修改任务下发

renmingwang

2026-03-30 675f3f475a61dd0ad8ffb76e183baa9b78f14f45

 ÏîÄ¿´úÂë/WMS/WIDESEA_WMSClient/src/views/Home.vue

@@ -3,7 +3,7 @@
    <div class="head">
      <h1>WMS系统监控中心</h1>
      <div class="head-actions">
        <el-button type="primary" @click="toggleFullScreen" size="small">
        <el-button type="primary" @click="toggleFullScreen" size="small" round>
          <el-icon><FullScreen /></el-icon>
          {{ isFullScreen ? '退出全屏' : '全屏显示' }}
        </el-button>
@@ -21,39 +21,41 @@
        </div>
      </div>
      <div class="data-center">
        <div class="title">库存数据</div>
        <div class="center-top-num">
          <div class="item">
            <div class="text">总货位数量</div>
            <div class="num">{{ totalStock }}</div>
          </div>
          <div class="item">
            <div class="text">今日入库</div>
            <div class="num">{{ todayInbound }}</div>
          </div>
          <div class="item">
            <div class="text">今日出库</div>
            <div class="num">{{ todayOutbound }}</div>
          </div>
          <div class="item">
            <div class="text">本周入库</div>
            <div class="num">{{ weekInbound }}</div>
          </div>
          <div class="item">
            <div class="text">本周出库</div>
            <div class="num">{{ weekOutbound }}</div>
          </div>
          <div class="item">
            <div class="text">本月入库</div>
            <div class="num">{{ monthInbound }}</div>
          </div>
          <div class="item">
            <div class="text">本月出库</div>
            <div class="num">{{ monthOutbound }}</div>
          </div>
          <div class="item">
            <div class="text">待处理订单</div>
            <div class="num">{{ pendingOrders }}</div>
        <div class="data-center-item">
          <div class="title">库存数据</div>
          <div class="center-top-num">
            <div class="item">
              <div class="text">总货位数量</div>
              <div class="num">{{ totalLocations }}</div>
            </div>
            <div class="item">
              <div class="text">今日入库</div>
              <div class="num">{{ todayInbound }}</div>
            </div>
            <div class="item">
              <div class="text">今日出库</div>
              <div class="num">{{ todayOutbound }}</div>
            </div>
            <div class="item">
              <div class="text">本周入库</div>
              <div class="num">{{ weekInbound }}</div>
            </div>
            <div class="item">
              <div class="text">本周出库</div>
              <div class="num">{{ weekOutbound }}</div>
            </div>
            <div class="item">
              <div class="text">本月入库</div>
              <div class="num">{{ monthInbound }}</div>
            </div>
            <div class="item">
              <div class="text">本月出库</div>
              <div class="num">{{ monthOutbound }}</div>
            </div>
            <!-- <div class="item">
              <div class="text">待处理订单</div>
              <div class="num">{{ pendingOrders }}</div>
            </div> -->
          </div>
        </div>
        <div class="data-center-item">
@@ -86,7 +88,7 @@

export default {
  setup() {
    const totalStock = ref('0')
    const totalLocations = ref('0')
    const todayInbound = ref('0')
    const todayOutbound = ref('0')
    const weekInbound = ref('0')
@@ -143,7 +145,7 @@
    const fetchData = async () => {
      try {
        // èŽ·å–库存统计数据
        const stockStatistics = await http.post('/api/StockInfo/GetStockStatistics', {}, false)
        const stockStatistics = await http.post('/api/Home/GetDt_TaskHty', {}, false)
        
        console.log('库存统计数据:', stockStatistics)
        
@@ -151,7 +153,7 @@
          if (stockStatistics.status) {
            const data = stockStatistics.data;
            console.log('库存数据:', data)
            totalStock.value = data.totalStock ? data.totalStock.toLocaleString() : '0';
            totalLocations.value = data.totalLocations ? data.totalLocations.toLocaleString() : '0';
            todayInbound.value = data.todayInbound ? data.todayInbound.toLocaleString() : '0';
            todayOutbound.value = data.todayOutbound ? data.todayOutbound.toLocaleString() : '0';
            weekInbound.value = data.weekInbound ? data.weekInbound.toLocaleString() : '0';
@@ -233,9 +235,9 @@
              { value: stockData.warehouseUtilization?.inStock || 0, name: '有货' },
              { value: stockData.warehouseUtilization?.free || 0, name: '空闲' },
              { value: stockData.warehouseUtilization?.inStockLock || 0, name: '有货锁定' },
              { value: stockData.warehouseUtilization?.lockLocations || 0, name: '锁定' },
              { value: stockData.warehouseUtilization?.freeLock || 0, name: '空闲锁定' },
              { value: stockData.warehouseUtilization?.palletLock || 0, name: '大托盘锁定' }
              // { value: stockData.warehouseUtilization?.lockLocations || 0, name: '锁定' },
              // { value: stockData.warehouseUtilization?.freeLock || 0, name: '空闲锁定' },
              // { value: stockData.warehouseUtilization?.palletLock || 0, name: '大托盘锁定' }
            ]
          }]
        })
@@ -262,8 +264,8 @@
      chartDailyInout.setOption({
        tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } },
        grid: { left: '0%', top: '10px', right: '0%', bottom: '4%', containLabel: true },
        xAxis: { type: 'category', data: ['08时', '09时', '10时', '11时', '12时', '13时', '14时', '15时', '16时', '17时'], axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        xAxis: { type: 'category', data: ['08时', '09时', '10时', '11时', '12时', '13时', '14时', '15时', '16时', '17时'], axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        series: [
          { name: '入库', type: 'bar', data: [], barWidth: '25%', itemStyle: { normal: { color: '#2f89cf' } } },
          { name: '出库', type: 'bar', data: [], barWidth: '25%', itemStyle: { normal: { color: '#46d000' } } }
@@ -275,8 +277,8 @@
      chartWeekInout.setOption({
        tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } },
        grid: { left: '0%', top: '10px', right: '0%', bottom: '4%', containLabel: true },
        xAxis: { type: 'category', data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        xAxis: { type: 'category', data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        series: [
          { name: '入库', type: 'bar', data: [], barWidth: '25%', itemStyle: { normal: { color: '#2f89cf' } } },
          { name: '出库', type: 'bar', data: [], barWidth: '25%', itemStyle: { normal: { color: '#46d000' } } }
@@ -288,8 +290,8 @@
      chartMonthInout.setOption({
        tooltip: { trigger: 'axis' },
        grid: { left: '0%', top: '10px', right: '0%', bottom: '4%', containLabel: true },
        xAxis: { type: 'category', data: ['01日', '05日', '10日', '15日', '20日', '25日', '30日'], axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        xAxis: { type: 'category', data: ['01日', '05日', '10日', '15日', '20日', '25日', '30日'], axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        series: [
          { name: '入库', type: 'line', data: [], smooth: true, lineStyle: { color: '#2f89cf' }, areaStyle: { color: 'rgba(47, 137, 207, 0.3)' } },
          { name: '出库', type: 'line', data: [], smooth: true, lineStyle: { color: '#46d000' }, areaStyle: { color: 'rgba(70, 208, 0, 0.3)' } }
@@ -300,7 +302,7 @@
      chartWarehouseUtilization = echarts.init(document.getElementById('chart-warehouse-utilization'))
      chartWarehouseUtilization.setOption({
        tooltip: { trigger: 'item' },
        legend: { orient: 'vertical', left: 'left' },
        legend: { orient: 'vertical', left: 'left', textStyle: { color: 'rgba(255,255,255,.8)' } },
        series: [
          { name: '货位状态分布', type: 'pie', radius: '60%', data: [], emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } }
        ]
@@ -308,13 +310,12 @@

      // åº“存变化趋势
      chartStockTrend = echarts.init(document.getElementById('chart-stock-trend'))
      // ç”Ÿæˆæœ€è¿‘7天的连续日期
      const recentDays = generateRecentDays()
      chartStockTrend.setOption({
        tooltip: { trigger: 'axis' },
        grid: { left: '0%', top: '10px', right: '0%', bottom: '4%', containLabel: true },
        xAxis: { type: 'category', data: recentDays, axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.1)' } } },
        xAxis: { type: 'category', data: recentDays, axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        yAxis: { type: 'value', axisLine: { show: true, lineStyle: { color: 'rgba(255,255,255,.5)' } }, axisLabel: { color: 'rgba(255,255,255,.8)' } },
        series: [{ type: 'line', data: [], smooth: true, lineStyle: { color: '#4ecdc4' }, areaStyle: { color: 'rgba(78, 205, 196, 0.3)' } }]
      })
    }
@@ -343,10 +344,10 @@
      // åˆå§‹èŽ·å–数据
      fetchData()
      
      // å®šæ—¶åˆ·æ–°æ•°æ®ï¼Œæ¯30秒更新一次

      dataTimer = setInterval(() => {
        fetchData()
      }, 30000)
      }, 600000)//十分钟更新一次
    })

    onUnmounted(() => {
@@ -373,7 +374,7 @@
    })

    return {
      totalStock,
      totalLocations,
      todayInbound,
      todayOutbound,
      weekInbound,
@@ -401,7 +402,7 @@
  .head {
    height: 60px;
    display: flex;
    justify-content: space-between;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    font-weight: bold;
@@ -409,9 +410,12 @@
    padding: 0 20px;
    box-sizing: border-box;
    margin-bottom: 10px;
    position: relative;
  }
  

  .head-actions {
    position: absolute;
    right: 20px;
    display: flex;
    gap: 10px;
  }
@@ -429,11 +433,12 @@
        gap: 20px;

        .data-left-item {
          height: calc(50% - 10px);
          flex: 1;
          background: rgba(10, 30, 50, 0.6);
          border-radius: 4px;
          border-radius: 12px;
          padding: 10px;
          box-sizing: border-box;
          min-height: 0;
        }
      }

@@ -444,19 +449,20 @@
        gap: 20px;

        .center-top-num {
          flex: 1;
          display: grid;
          grid-template-columns: repeat(4, 1fr);
          grid-template-rows: repeat(2, 1fr);
          gap: 15px;
          height: calc(50% - 10px);
          background: rgba(10, 30, 50, 0.6);
          border-radius: 4px;
          border-radius: 12px;
          padding: 10px;
          box-sizing: border-box;
          min-height: 0;

          .item {
            background: rgba(10, 40, 70, 0.7);
            border-radius: 4px;
            border-radius: 12px;
            padding: 15px;
            box-sizing: border-box;
            display: flex;
@@ -479,13 +485,14 @@
        }

        .data-center-item {
          height: calc(50% - 10px);
          flex: 1;
          background: rgba(10, 30, 50, 0.6);
          border-radius: 4px;
          border-radius: 12px;
          padding: 10px;
          box-sizing: border-box;
          display: flex;
          flex-direction: column;
          min-height: 0;
          
          > div[id^="chart-"] {
            flex: 1;
@@ -502,11 +509,12 @@
        gap: 20px;

        .data-right-item {
          height: calc(50% - 10px);
          flex: 1;
          background: rgba(10, 30, 50, 0.6);
          border-radius: 4px;
          border-radius: 12px;
          padding: 10px;
          box-sizing: border-box;
          min-height: 0;
        }
      }
    }