扣车管理2

src/views/rescue/buckleList.vue

@@ -87,6 +87,37 @@
         </el-form-item>
       </el-form>
 
+      <!-- 统计 -->
+      <div style="margin-bottom: 1rem">
+        <el-row style="display: flex;justify-content: space-between">
+          <el-col :span="4">
+            <div>
+              <el-statistic :value="buckleCount" title="总扣车"/>
+            </div>
+          </el-col>
+          <el-col :span="4">
+            <div>
+              <el-statistic :value="deductionCount" title="扣车中"/>
+            </div>
+          </el-col>
+          <el-col :span="4">
+            <div>
+              <el-statistic :value="unDeductionCount" title="已解扣"/>
+            </div>
+          </el-col>
+          <el-col :span="4">
+            <div>
+              <el-statistic :value="returnCount" title="已还车"/>
+            </div>
+          </el-col>
+          <el-col :span="4">
+            <div>
+              <el-statistic :value="noLibraryCount" title="待入库"/>
+            </div>
+          </el-col>
+        </el-row>
+      </div>
+
       <el-row style="margin: 1rem 0" :gutter="10" class="mb8">
         <el-col :span="1.5">
           <el-button type="primary" icon="el-icon-download" :loading="exportLoading" size="mini" @click="handleExport">
@@ -192,6 +223,13 @@
         </el-table-column>
         <el-table-column fixed="right" label="操作" align="center" width="150" class-name="small-padding fixed-width">
           <template slot-scope="scope">
+            <el-button v-if="scope.row.rescueStatus === '6'"
+              size="mini"
+              type="text"
+              icon="el-icon-check"
+              @click="handleReturn(scope.row)"
+            >还车
+            </el-button>
             <el-button
               size="mini"
               type="text"
@@ -217,7 +255,7 @@
 </template>
 
 <script>
-import {downloadOrder, listBuckle, listInfo, updateInfo} from "@/api/rescue/info";
+import {delInfo, downloadOrder, listBuckle, listInfo, updateInfo} from "@/api/rescue/info";
 
 export default {
   name: "BuckleList",
@@ -260,12 +298,31 @@ export default {
       total: 0,
       editType: 0,
       editIdx: -1,
+      // 扣车总数
+      buckleCount: 0,
+      // 扣车中
+      deductionCount: 0,
+      // 已解扣
+      unDeductionCount: 0,
+      // 已还车
+      returnCount: 0,
+      // 待入库
+      noLibraryCount: 0
     }
   },
   watch: {
     filterText(val) {
       this.$refs.tree.filter(val)
     },
+    chooseData(val){
+      if (val){
+        this.buckleCount = val.buckleCount
+        this.deductionCount = val.deductionCount
+        this.unDeductionCount = val.unDeductionCount
+        this.returnCount = val.returnCount
+        this.noLibraryCount = val.noLibraryCount
+      }
+    }
   },
   created() {
     this.getList()
@@ -277,10 +334,28 @@ export default {
         this.treeLoading = true
         const response = await listBuckle();
         this.dictDataTree = response.data
+        await this.initStatistic(response.data)
       } finally {
         this.treeLoading = false
       }
     },
+    async initStatistic(data){
+      this.buckleCount = data.reduce((temp, item) => {
+        return temp + item.buckleCount
+      }, 0)
+      this.deductionCount = data.reduce((temp, item) => {
+        return temp + item.deductionCount
+      }, 0)
+      this.unDeductionCount = data.reduce((temp, item) => {
+        return temp + item.unDeductionCount
+      }, 0)
+      this.returnCount = data.reduce((temp, item) => {
+        return temp + item.returnCount
+      }, 0)
+      this.noLibraryCount = data.reduce((temp, item) => {
+        return temp + item.noLibraryCount
+      }, 0)
+    },
     handleSelectionChange(selection) {
       const flag = this.selectNodes.findIndex(item => item.dataId === selection.dataId)
       if (flag > -1) {
@@ -366,6 +441,21 @@ export default {
     },
     getBuckleName(id){
       return this.dictDataTree.find(item => item.id === id)?.buckleName || "其他"
+    },
+    // 还车
+    handleReturn(row){
+
+    },
+    // 删除
+    handleDelete(row){
+      const ids = row.id || this.ids;
+      this.$modal.confirm('是否确认删除道路救援模块编号为"' + ids + '"的数据项？').then(function() {
+        return delInfo(ids);
+      }).then(() => {
+        this.getList();
+        this.getTabList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
     }
   }
 }