From 3d3e7f45086799fdd7a412e2079710a6cdf8dc2b Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期四, 24 十月 2024 08:30:04 +0800 Subject: [PATCH] Merge branch 'lsf-dataproduct-1018' --- src/components/list-item/ItemSubTask.vue | 163 ++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 145 insertions(+), 18 deletions(-) diff --git a/src/components/list-item/ItemSubTask.vue b/src/components/list-item/ItemSubTask.vue index 58abf2b..ac1f3ab 100644 --- a/src/components/list-item/ItemSubTask.vue +++ b/src/components/list-item/ItemSubTask.vue @@ -1,27 +1,68 @@ <template> <div class="wrapper"> - <div> - <el-text truncated class="w-250px" size="large">{{ item.name }}</el-text> - </div> - <div> - <el-text truncated class="w-250px" size="small">{{ item.scenseaddress }}</el-text> - </div> - <div> - <el-text truncated size="small">{{ - $fm.formatYMDH(item.planstarttime) - }}</el-text> - </div> - <div> - <el-text truncated class="w-250px" size="small">{{ - item.executorrealtimes - }}</el-text> - </div> - <el-row justify="end" style="margin-top: 4px"> - <slot :item="item"></slot> + <el-row justify="space-between" class="m-t-4"> + <el-col :span="20"> + <div class="text-title"> + <el-tag + size="small" + :type="statusType.type" + effect="plain" + class="m-r-4 m-b-4" + > + <el-space :size="4"> + <el-icon size="16"> + <component :is="statusType.icon"></component> + </el-icon> + {{ item.status }} + </el-space> + </el-tag> + {{ item.name }} + </div> + <div class="text-info"> + <div class="text-label"> + <el-icon class="m-r-4" size="16"><LocationInformation /></el-icon> + <span>浠诲姟鍦板潃锛�</span> + </div> + {{ item.scenseaddress }} + </div> + <div class="text-info"> + <div class="text-label"> + <!-- <el-icon><Clock /></el-icon> --> + <el-icon class="m-r-4" size="16"><AlarmClock /></el-icon> + <span>浠诲姟鏃堕棿锛�</span> + </div> + {{ $fm.formatYMD(item.planstarttime) }} + </div> + <div class="text-info"> + <div class="text-label"> + <el-icon class="m-r-4" size="16"><User /></el-icon> + 浠诲姟浜哄憳锛� + </div> + {{ item.executorrealtimes }} + </div> + <el-space class="m-t-4"> + <el-tag size="small" type="info" effect="" + >闂锛歿{ status.proNum }}</el-tag + > + <el-tag size="small" type="info" effect="" + >鏁存敼锛歿{ status.changeNum }}</el-tag + > + <el-tag size="small" :type="changePerType" effect="" + >鏁存敼鐜囷細{{ status.changePer }}</el-tag + > + </el-space> + </el-col> + <el-col :span="4"> + <slot :item="item"></slot> + </el-col> </el-row> </div> </template> <script setup> +import { ref, watch, computed } from 'vue'; +import taskApi from '@/api/fysp/taskApi'; +import ProCheckProxy from '@/views/fysp/check/ProCheckProxy'; + /** * 鐩戠瀵硅薄 */ @@ -31,12 +72,98 @@ default: () => {} } }); + +const loading = ref(false); +const proList = ref([]); +const status = ref({}); + +const statusType = computed(() => { + switch (props.item.status) { + case '鏈墽琛�': + return { + type: 'danger', + icon: 'WarningFilled' + }; + case '姝e湪鎵ц': + return { + type: 'success', + icon: 'Timer' + }; + case '宸茬粨鏉�': + return { + type: 'info', + icon: 'SuccessFilled' + }; + default: + return { + type: 'danger', + icon: 'Warning' + }; + } +}); + +const changePerType = computed(() => { + if (status.value.changeNum == 0) { + if (status.value.proNum == 0) { + return 'success'; + } else { + return 'danger'; + } + } else if (status.value.proNum == status.value.changeNum) { + return 'success'; + } else { + return 'warning'; + } +}); + +watch( + () => props.item, + (nV, oV) => { + if (nV != oV) { + fetchProblems(nV); + } + }, + { immediate: true } +); + +function fetchProblems(subtask) { + loading.value = true; + taskApi + .getProBySubtask(subtask.stguid) + .then((res) => { + proList.value = res; + status.value = ProCheckProxy.calProStatus(res); + }) + .finally(() => { + loading.value = false; + }); +} </script> <style scoped> .wrapper { /* width: 300px; */ + width: 100%; border: 1px solid var(--el-border-color); border-radius: var(--el-border-radius-base); padding: 4px 8px; } + +.text-title { + font-weight: var(--el-font-weight-primary); + color: var(--el-text-color-primary); + font-size: var(--el-font-size-medium); +} + +.text-info { + display: flex; + align-items: flex-start; + color: var(--el-text-color-secondary); + font-size: var(--el-font-size-small); +} + +.text-label { + display: flex; + align-items: center; + white-space: nowrap; +} </style> -- Gitblit v1.9.3