From 8a4d220f73dcee2ab848596eb4e48a56b94c7a99 Mon Sep 17 00:00:00 2001
From: charles <981744753@qq.com>
Date: 星期五, 26 四月 2024 17:07:45 +0800
Subject: [PATCH] feat:完成新看板质检数据统计接口联调

---
 src/views/newDashboard/index.vue |   89 +++++++++++++++++++++++++++++++++++---------
 1 files changed, 70 insertions(+), 19 deletions(-)

diff --git a/src/views/newDashboard/index.vue b/src/views/newDashboard/index.vue
index 375be39..be49404 100644
--- a/src/views/newDashboard/index.vue
+++ b/src/views/newDashboard/index.vue
@@ -1,9 +1,17 @@
 <script setup lang="ts">
-import { ref, onMounted, watch } from 'vue'
+import { ref, onMounted, watch, nextTick } from 'vue'
 import { ElMessage } from 'element-plus'
 import TaskTabs from '@/views/dashboard/components/TaskTabs.vue'
 import CurrentDateTime from '@/views/dashboard/components/CurrentDateTime.vue'
-import { getQualityProcedureApi, getProjectApi, getProductApi, getWorkerApi, updateQualityProcedureApi } from '@/api'
+import {
+  getQualityProcedureApi,
+  getProjectApi,
+  getProductApi,
+  getWorkerApi,
+  updateQualityProcedureApi,
+  qualityCountApi,
+  IQualityCountParams
+} from '@/api'
 import BigButton from '@/views/dashboard/components/BigButton.vue'
 import EditInspection from '@/views/newDashboard/components/EditInspection.vue'
 defineOptions({
@@ -24,13 +32,12 @@
 const qualityList = ref([])
 const lookQuality = ref({})
 const oldLookQuality = ref({})
+const DEFAULT_QUALITY_COUNT = { wait: '--', over: '--', scrapped: '--', pass: '--' }
+const qualityCountObj = ref({ ...DEFAULT_QUALITY_COUNT })
 const tableHeaderColor = ({ rowIndex }: any) => {
   if (rowIndex === 0) {
     return 'header-row-class' // 杩欎釜绫诲悕闇�瑕佷綘鑷繁瀹氫箟
   }
-}
-const changeTab = (tabObj: any) => {
-  console.log(tabObj)
 }
 const checkProduct = (quality: any) => {
   lookQuality.value = { ...quality }
@@ -42,6 +49,7 @@
     if (code == 200) {
       ElMessage.success(data)
       queryQualityProcedure()
+      queryQualityCount()
       modalObj.value.modalValue = false
     } else {
       ElMessage.error(data)
@@ -56,7 +64,6 @@
       if (Array.isArray(data) && data.length > 0) {
         projectIdArray.value[0] = data[0].id
         queryProduct()
-        queryQualityProcedure()
       }
     }
   })
@@ -67,6 +74,11 @@
     getProductApi({ projectId: projectIdArray.value[0], ...pageData.value }).then(({ code, data }) => {
       if (code == 200) {
         productList.value = data
+        if (Array.isArray(data) && data.length > 0) {
+          productIdArray.value[0] = data[0].id
+          queryQualityProcedure()
+          queryQualityCount()
+        }
       }
     })
   } else {
@@ -85,6 +97,9 @@
   }
   if (Array.isArray(productIdArray.value) && productIdArray.value.length > 0) {
     params.productId = productIdArray.value[0] + ''
+  } else {
+    qualityList.value = []
+    return
   }
   getQualityProcedureApi(params).then(({ code, data }: any) => {
     if (code == 200) {
@@ -97,6 +112,7 @@
   [() => activeTaskTab.value, () => productIdArray.value, () => projectIdArray.value],
   () => {
     queryQualityProcedure()
+    queryQualityCount()
   },
   { immediate: false }
 )
@@ -108,10 +124,35 @@
     }
   })
 }
+//6.鏌ヨ璐ㄦ鏁版嵁缁熻
+const queryQualityCount = () => {
+  const params: IQualityCountParams = { productId: '', projectId: '' }
+  if (Array.isArray(projectIdArray.value) && projectIdArray.value.length > 0) {
+    params.projectId = projectIdArray.value[0] + ''
+  } else {
+    qualityCountObj.value = { ...DEFAULT_QUALITY_COUNT }
+    return
+  }
+  if (Array.isArray(productIdArray.value) && productIdArray.value.length > 0) {
+    params.productId = productIdArray.value[0] + ''
+  } else {
+    qualityCountObj.value = { ...DEFAULT_QUALITY_COUNT }
+    return
+  }
+  qualityCountApi(params).then(({ code, data }) => {
+    if (code == 200) {
+      for (let fieldName in data) {
+        if (isNaN(parseInt(data[fieldName]))) {
+          data[fieldName] = '--'
+        }
+      }
+      qualityCountObj.value = data
+    }
+  })
+}
 //6.鍒濆鍖栭〉闈㈡暟鎹�
 const initPage = () => {
   queryProject()
-  //queryQualityProcedure()
   queryWorker()
 }
 onMounted(() => {
@@ -137,34 +178,39 @@
         <div class="img bg1"><img src="@/assets/images/u820.png" /></div>
         <div class="text">
           <div>寰呮娴�</div>
-          <div>1</div>
+          <div>{{ qualityCountObj.wait }}</div>
         </div>
       </div>
       <div class="item">
         <div class="img bg2"><img src="@/assets/images/u820.png" /></div>
         <div class="text">
           <div>瀹屾垚鏁�</div>
-          <div>1</div>
+          <div>{{ qualityCountObj.over }}</div>
         </div>
       </div>
       <div class="item">
         <div class="img bg3"><img src="@/assets/images/u820.png" /></div>
         <div class="text">
-          <div>鍚堟牸鏁�</div>
-          <div class="success-number">1</div>
+          <div>鍚堟牸鐜�</div>
+          <div class="success-number">
+            {{ qualityCountObj.pass }}
+            <span v-show="!isNaN(parseInt(qualityCountObj.pass))">%</span>
+          </div>
         </div>
       </div>
       <div class="item">
         <div class="img bg4"><img src="@/assets/images/u820.png" /></div>
         <div class="text">
-          <div>鎶ュ簾鏁�</div>
-          <div class="fail-number">0</div>
+          <div>鎶ュ簾鐜�</div>
+          <div class="fail-number">
+            {{ qualityCountObj.scrapped }}<span v-show="!isNaN(parseInt(qualityCountObj.scrapped))">%</span>
+          </div>
         </div>
       </div>
     </div>
     <div class="table-filter">
       <div class="left">
-        <TaskTabs v-model="activeTaskTab" style="margin-top: 20px" :list="taskTabsList" @change="changeTab"></TaskTabs>
+        <TaskTabs v-model="activeTaskTab" style="margin-top: 20px" :list="taskTabsList"></TaskTabs>
       </div>
       <div class="right">
         <el-select
@@ -191,10 +237,10 @@
           multiple
           placeholder="浜у搧"
         >
-          <el-option v-for="item in productList" :key="item.id" :label="item.productName" :value="item.id" multiple>
+          <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id" multiple>
             <div class="item-option">
               <div>{{ item.id }}</div>
-              <div>{{ item.productName }}</div>
+              <div>{{ item.name }}</div>
             </div>
           </el-option>
         </el-select>
@@ -219,7 +265,7 @@
         <el-table-column prop="passAmount" align="center" label="鍚堟牸鏁�" />
         <el-table-column prop="workerName" align="center" label="鍔犲伐浜哄憳" />
         <el-table-column prop="inspectionPeople" align="center" label="璐ㄦ鍛�" />
-        <el-table-column prop="procedureId" align="center" label="宸ュ簭鍙�" />
+        <!--<el-table-column prop="procedureId" align="center" label="宸ュ簭鍙�" />-->
         <el-table-column fixed="right" align="center" label="鎿嶄綔" width="120px">
           <template #default="scope">
             <BigButton bg-color="#00ff00" @click="checkProduct(scope.row)">璐ㄦ</BigButton>
@@ -338,10 +384,11 @@
       margin-left: 10px;
     }
     .right {
-      width: 34%;
+      width: 40%;
       display: flex;
       justify-content: space-around;
       margin-top: 2.5vh;
+      margin-right: -10px;
       .el-select {
         width: 256px;
         :deep(.el-select__wrapper) {
@@ -362,6 +409,7 @@
         /*);*/
       }
       :deep(.el-select__popper) {
+        width: 100%;
         border: 1px solid #1ca898;
         background: deepskyblue;
       }
@@ -370,7 +418,10 @@
         display: flex;
         flex: 1;
         > div {
-          width: 50%;
+          min-width: 50%;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
           text-align: center;
         }
       }

--
Gitblit v1.8.0