手持机

ruoyi-admin/src/main/java/com/ruoyi/kpi/controller/KpiController.java

@@ -87,6 +87,12 @@ public class KpiController extends BaseController {
         return success(kpiService.getSpaceAnalysis(warehouseId));
     }
 
+    @GetMapping("/spaceStatusCounts")
+    public AjaxResult getSpaceStatusCounts(String warehouseId,
+                                           String roadwayId) {
+        return success(kpiService.getSpaceStatusCounts(warehouseId, roadwayId));
+    }
+
     /**
      * 获取货位巷道数据
      *

ruoyi-admin/src/main/java/com/ruoyi/kpi/service/KpiService.java

@@ -32,6 +32,7 @@ public interface KpiService {
      */
     Map<String, Object> getRoadwayAnalysis(String warehouseId, String startTime, String endTime);
 
+    Map<String, Object> getSpaceStatusCounts(String warehouseId, String roadwayId);
 
 
     Map<String, Object> getSpaceAnalysis(String warehouseId);

ruoyi-admin/src/main/java/com/ruoyi/kpi/service/impl/KpiServiceImpl.java

@@ -289,6 +289,35 @@ public class KpiServiceImpl implements KpiService
         return response;
     }
 
+    @Override
+    public Map<String, Object> getSpaceStatusCounts(String warehouseId, String roadwayId) {
+        BasCargoSpace query = new BasCargoSpace();
+        query.setWarehouseId(warehouseId);
+        query.setRoadwayId(roadwayId);
+        List<BasCargoSpace> list = basCargoSpaceMapper.selectBasCargoSpaceList(query);
+
+        Map<String, Integer> counts = new HashMap<>();
+        counts.put("1", 0); // 空闲
+        counts.put("2", 0); // 占用
+        counts.put("3", 0); // 入库分配
+        counts.put("4", 0); // 出库分配
+        counts.put("5", 0); // 入库待检
+        counts.put("6", 0); // 出库待检
+
+        for (BasCargoSpace space : list) {
+            String status = space.getStatus();
+            if (status != null && counts.containsKey(status)) {
+                counts.put(status, counts.get(status) + 1);
+            }
+        }
+
+        Map<String, Object> res = new HashMap<>();
+        res.put("data", counts);
+        return res;
+    }
+
+
+
     @Override
     public Map<String, Object> getRoadways(String warehouseId){
         Map<String, Object> response = new HashMap<>();

ruoyi-ui/src/api/kpi/spaceAnalysis.js

@@ -7,3 +7,10 @@ export function getSpaceAnalysisList(query) {
     params: query
   })
 }
+export function getSpaceStatusCounts(query) {
+  return request({
+    url: '/kpi/spaceStatusCounts',
+    method: 'get',
+    params: query
+  })
+}

ruoyi-ui/src/views/kpi/spaceAnalysis/index.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="app-container">
-<!--    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">-->
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
-<!--      &lt;!&ndash; 仓库 &ndash;&gt;-->
+      <!-- 仓库 -->
 <!--      <el-form-item label="仓库" prop="warehouseId">-->
-<!--        <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable>-->
+<!--        <el-select v-model="queryParams.warehouseId" placeholder="请选择仓库" clearable @change="onWarehouseChange">-->
 <!--          <el-option-->
 <!--            v-for="dict in warehouseOptions"-->
 <!--            :key="dict.warehouseId"-->
@@ -12,15 +12,26 @@
 <!--          />-->
 <!--        </el-select>-->
 <!--      </el-form-item>-->
-<!--      <el-form-item>-->
+      <!-- 巷道 -->
-<!--        &lt;!&ndash; 【搜索】按钮 &ndash;&gt;-->
+      <el-form-item label="巷道" prop="roadwayId">
-<!--        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
+        <el-select v-model="queryParams.roadwayId" placeholder="请选择巷道" clearable @change="handleQuery">
-<!--        &lt;!&ndash; 【重置】按钮 &ndash;&gt;-->
+          <el-option
-<!--        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
+            v-for="item in roadwayOptions"
-<!--      </el-form-item>-->
+            :key="item.value"
-<!--    </el-form>-->
+            :label="item.name"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <!-- 【搜索】按钮 -->
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <!-- 【重置】按钮 -->
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
 
-    <!-- 柱状图容器 -->
+    <!-- 饼状图容器 -->
     <div class="chart-container" style="height: 700px">
       <div ref="spaceChart" style="width: 100%; height: 100%"></div>
     </div>
@@ -29,8 +40,9 @@
 
 <script>
 import * as echarts from '@/plugins/echarts.min.js'
-import { getSpaceAnalysisList } from "@/api/kpi/spaceAnalysis"
+import { getSpaceStatusCounts } from "@/api/kpi/spaceAnalysis"
-import {listWarehouse} from "@/api/bas/warehouse";
+import { listWarehouse } from "@/api/bas/warehouse";
+import { getRoadways } from "@/api/kpi/spacePlan";
 export default {
   name: "spaceAnalysis",
   data() {
@@ -41,24 +53,36 @@ export default {
       showSearch: true,
       // 仓库选项
       warehouseOptions: [],
+      // 巷道选项
+      roadwayOptions: [
+        {
+          value: "1",
+          name: "一巷道"
+        },
+        {
+          value: "2",
+          name: "二巷道"
+        }
+      ],
       // 查询参数
       queryParams: {
-        warehouseId: null  // 默认选择仓库1
+        // warehouseId: null,
+        roadwayId: null
       },
       // 图表实例
       chart: null,
-      // 图表数据（模拟数据）
+      // 图表数据（状态计数）
-      chartData:[],
+      chartData: {},
       queryWarehouseParam:{
         pageNum: 1,
         pageSize: 99,
-        typeData:[1,2]
+        typeData:[1]
       }
     }
   }
   ,
   created() {
-    this.getWarehouseList();
+    // this.getWarehouseList();
     this.handleQuery();
   }
   ,
@@ -75,34 +99,59 @@ export default {
   ,
   methods: {
     /** 查询仓库列表 */
-    getWarehouseList() {
+    // getWarehouseList() {
-
+    //   listWarehouse(this.queryWarehouseParam).then(response => {
-      listWarehouse(this.queryWarehouseParam).then(response => {
+    //     this.warehouseOptions = response.rows;
-        this.warehouseOptions = response.rows;
+    //     // 默认选择第一个仓库并加载巷道
-      });
+    //     // if (!this.queryParams.warehouseId && this.warehouseOptions.length) {
-      // this.warehouseOptions = [{warehouseId: "01", warehouseName: "仓库1"}, {warehouseId: "02", warehouseName: "仓库2"}];
+    //     //   this.queryParams.warehouseId = this.warehouseOptions[0].warehouseId;
-    }
+    //     // }
-    ,
+    //     this.getRoadwayList();
+    //   });
+    // }
+    // ,
+    /** 仓库切换 */
+    // onWarehouseChange() {
+    //   this.queryParams.roadwayId = null;
+    //   this.getRoadwayList();
+    // }
+    // ,
+    /** 查询巷道列表 */
+    // getRoadwayList() {
+    //   // if (!this.queryParams.warehouseId) return;
+    //   getRoadways({ warehouseId: this.queryParams.warehouseId }).then(res => {
+    //     this.roadwayOptions = (res.data && res.data.data) || [];
+    //     // 默认选择第一个巷道
+    //     // if (!this.queryParams.roadwayId && this.roadwayOptions.length) {
+    //     //   this.queryParams.roadwayId = this.roadwayOptions[0].value;
+    //     // }
+    //
+    //     this.handleQuery();
+    //   });
+    // }
+    // ,
     /** 搜索按钮操作 */
     handleQuery() {
-      getSpaceAnalysisList(this.queryParams).then(response => {
+      // if (!this.queryParams.warehouseId || !this.queryParams.roadwayId) return;
+      getSpaceStatusCounts(this.queryParams).then(response => {
         if (response.code === 200) {
-          this.chartData = response.data;
+          this.chartData = response.data.data || {};
           this.updateChart();
         } else {
           this.$message.error(response.msg);
         }
       }).catch(error => {
-        // 提示：获取数据失败
         console.error('获取数据失败:', error);
         this.$message.error('获取数据失败');
       });
-    },
+    }
+    ,
     /** 重置按钮操作 */
     resetQuery() {
       this.resetForm("queryForm");
-      this.queryParams.warehouseId = "01";  // 重置时仍选择仓库1
       this.handleQuery();
+
+
     }
     ,
     /** 初始化图表 */
@@ -118,57 +167,29 @@ export default {
         '2': '占用',
         '3': '入库分配',
         '4': '出库分配',
-        '5': '入库待检',
+        '5': '入库需盘点',
-        '6': '出库待检'
+        '6': '出库需盘点'
       };
       return statusMap[statusCode] || statusCode;
-    },
+    }
-    /** 更新图表数据 */
+    ,
+    /** 更新图表数据为饼图 */
     updateChart() {
-      console.log('chartData:', this.chartData);
+      const counts = this.chartData || {};
-      if (!this.chartData || !this.chartData.data || this.chartData.data.length === 0) {
+      const statusCodes = ['1','2','3','4','5','6'];
-        // 提示：无效的图表数据
+      const pieData = statusCodes.map(code => ({
-        console.warn('无效的图表数据');
+        name: this.getStatusText(code),
-        return;
+        value: counts[code] || 0
-      }
-
-      // 获取数据中所有的巷道字段
-      const firstItem = this.chartData.data[0];
-      // 巷道
-      const roadwayFields = Object.keys(firstItem).filter(key => key.startsWith('巷道'));
-
-      // 准备系列配置
-      const series = roadwayFields.map(roadway => ({
-        name: roadway,
-        type: 'bar',
-        data: this.chartData.data.map(item => item[roadway]),
-        barWidth: '30%',
-        itemStyle: {
-          // 巷道1-4
-          color: roadway === '巷道1' ? '#1890ff' :
-                 roadway === '巷道2' ? '#52c41a' :
-                 roadway === '巷道3' ? '#1890ff' :
-                 roadway === '巷道4' ? '#52c41a' : '#1890ff'
-        },
-        label: {
-          show: true,
-          position: 'top'
-        }
       }));
-      // 提示：生成的系列配置
-      console.log('系列配置:', series);
 
       const option = {
         title: {
-          // 货位状态分析
           text: '货位状态分析',
           left: 'center'
         },
         tooltip: {
-          trigger: 'axis',
+          trigger: 'item',
-          axisPointer: {
+          formatter: '{b}: {c} ({d}%)'
-            type: 'shadow'
-          }
         },
         legend: {
           top: "5%",
@@ -177,22 +198,21 @@ export default {
             color: "#292c2c"
           },
         },
-        xAxis: {
+        series: [{
-          type: 'category',
+          name: '货位状态',
-          data: this.chartData.data.map(item => this.getStatusText(item.status)),
+          type: 'pie',
-          axisLabel: {
+          radius: '60%',
-            interval: 0,
+          center: ['50%', '60%'],
-            rotate: 0
+          data: pieData,
+          label: {
+            show: true,
+            formatter: '{b}: {c}'
           }
-        },
+        }]
-        yAxis: {
-          type: 'value',
-          // 数量
-          name: '数量'
-        },
-        series: series
       };
-      this.chart.setOption(option);
+      if (this.chart) {
+        this.chart.setOption(option);
+      }
     },
   }
 }