From c7f3fd5215399b37d0511b3bd555150ff1b13507 Mon Sep 17 00:00:00 2001
From: charles <981744753@qq.com>
Date: 星期一, 29 四月 2024 10:39:30 +0800
Subject: [PATCH] fix:回退原先版本
---
src/views/newDashboard/index.vue | 177 ++++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 114 insertions(+), 63 deletions(-)
diff --git a/src/views/newDashboard/index.vue b/src/views/newDashboard/index.vue
index 62bc29e..459041a 100644
--- a/src/views/newDashboard/index.vue
+++ b/src/views/newDashboard/index.vue
@@ -1,36 +1,43 @@
<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({
name: 'NewDashboardView'
})
-const taskTabsList = [
+const taskTabsList: Array<any> = [
{ label: '寰呰川妫�', value: 1 },
{ label: '宸茶川妫�', value: 3 }
]
const activeTaskTab = ref(1)
const projectList = ref([])
const productList = ref([])
-const projectIdArray = ref([])
-const productIdArray = ref([])
+const projectIdArray = ref('')
+const productIdArray = ref('')
const workerList = ref([])
const pageData = ref({ page: 1, pageSize: 1000 })
const modalObj = ref({ modalValue: false })
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)
@@ -53,30 +61,45 @@
getProjectApi(pageData.value).then(({ code, data }: any) => {
if (code == 200) {
projectList.value = data
+ if (Array.isArray(data) && data.length > 0) {
+ projectIdArray.value = data[0].id
+ queryProduct()
+ }
}
})
}
//2.鏍规嵁椤圭洰缂栧彿鏌ヨ浜у搧鍒楄〃
const queryProduct = () => {
- if (projectIdArray.value && projectIdArray.value.length > 0) {
- getProductApi({ projectId: projectIdArray.value[0], ...pageData.value }).then(({ code, data }) => {
+ if (projectIdArray.value) {
+ getProductApi({ projectId: projectIdArray.value, ...pageData.value }).then(({ code, data }) => {
if (code == 200) {
productList.value = data
+ if (Array.isArray(data) && data.length > 0) {
+ productIdArray.value = data[0].id
+ queryQualityProcedure()
+ queryQualityCount()
+ }
}
})
} else {
productList.value = []
- productIdArray.value = []
+ productIdArray.value = ''
}
}
//3.鏌ヨ宸ュ簭璐ㄦ鍒楄〃
const queryQualityProcedure = () => {
- const params = { status: activeTaskTab.value, projectId: '', productId: '', ...pageData.value, keyword: '' }
- if (Array.isArray(projectIdArray.value) && projectIdArray.value.length > 0) {
- params.projectId = projectIdArray.value[0] + ''
+ const params: any = { status: activeTaskTab.value, projectId: '', productId: '', ...pageData.value, keyword: '' }
+ if (projectIdArray.value) {
+ params.projectId = projectIdArray.value + ''
+ } else {
+ qualityList.value = []
+ return
}
- if (Array.isArray(productIdArray.value) && productIdArray.value.length > 0) {
- params.productId = productIdArray.value[0] + ''
+ if (productIdArray.value) {
+ params.productId = productIdArray.value + ''
+ } else {
+ qualityList.value = []
+ return
}
getQualityProcedureApi(params).then(({ code, data }: any) => {
if (code == 200) {
@@ -89,6 +112,7 @@
[() => activeTaskTab.value, () => productIdArray.value, () => projectIdArray.value],
() => {
queryQualityProcedure()
+ queryQualityCount()
},
{ immediate: false }
)
@@ -100,10 +124,35 @@
}
})
}
+//6.鏌ヨ璐ㄦ鏁版嵁缁熻
+const queryQualityCount = () => {
+ const params: IQualityCountParams = { productId: '', projectId: '' }
+ if (projectIdArray.value) {
+ params.projectId = projectIdArray.value + ''
+ } else {
+ qualityCountObj.value = { ...DEFAULT_QUALITY_COUNT }
+ return
+ }
+ if (productIdArray.value) {
+ params.productId = productIdArray.value + ''
+ } 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(() => {
@@ -129,97 +178,94 @@
<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
v-model="projectIdArray"
:teleported="false"
size="large"
- :multiple-limit="1"
- multiple
placeholder="椤圭洰"
+ :clearable="true"
@change="queryProduct"
>
- <el-option v-for="item in projectList" :key="item.id" :label="item.projectName" :value="item.id" multiple>
+ <el-option v-for="item in projectList" :key="item.id" :label="item.projectName" :value="item.id">
<div class="item-option">
<div>{{ item.id }}</div>
<div>{{ item.projectName }}</div>
</div>
</el-option>
</el-select>
- <el-select
- v-model="productIdArray"
- :teleported="false"
- size="large"
- :multiple-limit="1"
- multiple
- placeholder="浜у搧"
- >
- <el-option v-for="item in productList" :key="item.id" :label="item.productName" :value="item.id" multiple>
+ <el-select v-model="productIdArray" :teleported="false" size="large" placeholder="浜у搧" :clearable="true">
+ <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id">
<div class="item-option">
<div>{{ item.id }}</div>
- <div>{{ item.productName }}</div>
+ <div>{{ item.name }}</div>
</div>
</el-option>
</el-select>
</div>
</div>
<div class="table">
- <el-empty v-if="qualityList.length == 0" description="鏆傛棤鏁版嵁" />
+ <!--<el-empty v-if="qualityList.length == 0" description="鏆傛棤鏁版嵁" />-->
<el-table
- v-else
:data="qualityList"
:header-cell-class-name="tableHeaderColor"
row-class-name="row-bg"
style="width: 100%; background: transparent"
border
>
- <el-table-column prop="workOrderId" align="center" label="宸ュ崟鍙�" />
- <el-table-column prop="projectId" align="center" label="椤圭洰鍙�" />
- <el-table-column prop="productId" align="center" label="浜у搧鍙�" />
- <el-table-column prop="productName" align="center" label="浜у搧鍚�" />
- <el-table-column prop="procedureId" align="center" label="宸ュ簭鍙�" />
- <el-table-column prop="procedureName" align="center" label="宸ュ簭鍚嶇О" />
- <el-table-column prop="drawingNumber" align="center" label="鍥惧彿" />
- <el-table-column prop="amount" align="center" label="鍥惧彿" />
- <el-table-column prop="transferAmount" align="center" label="杞Щ鏁伴噺" />
- <el-table-column prop="scrappedAmount" align="center" label="鎶ュ簾鏁伴噺" />
- <el-table-column prop="passAmount" align="center" label="鍚堟牸鏁伴噺" />
- <el-table-column prop="workerName" align="center" label="鍔犲伐鍛�" />
+ <el-table-column fixed prop="procedureName" style="background: gray" align="center" label="浜у搧宸ュ簭" />
+ <el-table-column prop="workOrderId" align="center" label="宸ュ崟缂栧彿" />
+ <el-table-column prop="productName" align="center" label="浜у搧鍚嶇О" />
+ <el-table-column prop="drawingNumber" align="center" label="浜у搧鍥惧彿" />
+ <el-table-column prop="amount" align="center" label="璁″垝鏁�" />
+ <el-table-column prop="transferAmount" align="center" label="杞叆鏁�" />
+ <el-table-column prop="scrappedAmount" align="center" label="鎶ュ簾鏁�" />
+ <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 align="center" label="鎿嶄綔" width="120px">
+ <!--<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>
</template>
</el-table-column>
+ <template #empty>
+ <el-empty description="鏆傛棤鏁版嵁"></el-empty>
+ </template>
</el-table>
</div>
</div>
@@ -330,22 +376,26 @@
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) {
- background-color: transparent !important;
+ // background-color: transparent !important;
+ }
+ :deep(.el-select__placeholder) {
+ //color: white;
}
}
.el-select-dropdown__item {
- color: white;
+ //color: white;
}
.el-select-dropdown__item.is-hovering {
- color: #fff;
- background: transparent !important;
+ //color: #fff;
+ //background: transparent !important;
/*background: linear-gradient(*/
/*to right,*/
/*rgba(147, 250, 255, 0),*/
@@ -354,15 +404,19 @@
/*);*/
}
:deep(.el-select__popper) {
- border: 1px solid #1ca898;
- background: deepskyblue;
+ width: 100%;
+ //border: 1px solid #1ca898;
+ // background: deepskyblue;
}
.item-option {
width: 100%;
display: flex;
flex: 1;
> div {
- width: 50%;
+ min-width: 50%;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
text-align: center;
}
}
@@ -370,9 +424,6 @@
background: transparent;
font-size: 16px;
color: white;
- }
- :deep(.el-icon) {
- display: none;
}
}
}
--
Gitblit v1.8.0