From 04e9d32ac49bf5a38adf3cd7dab6bff6e346eefd Mon Sep 17 00:00:00 2001 From: Riku <risaku@163.com> Date: 星期一, 08 七月 2024 22:53:51 +0800 Subject: [PATCH] 问题整改跟踪和工作流模块 --- src/components/inspection/TaskItem.vue | 81 +++++++++++++++++++++++----------------- 1 files changed, 47 insertions(+), 34 deletions(-) diff --git a/src/components/inspection/TaskItem.vue b/src/components/inspection/TaskItem.vue index be50b89..ca54f28 100644 --- a/src/components/inspection/TaskItem.vue +++ b/src/components/inspection/TaskItem.vue @@ -1,42 +1,49 @@ <template> - <div class="demo-progress border-r-small f-b"> - <el-row> - <el-col span="8"> - <el-progress :width="100" type="dashboard" :percentage="(finish / total) * 100"> + <!-- <div class="demo-progress border-r-small"> --> + <el-row justify="space-evenly"> + <el-col span="12"> + <div class="v-center"> + <el-text>鎬婚噺</el-text> + <el-progress + :width="100" + type="circle" + status="warning" + :percentage="(finish / total) * 100" + > <template #default="{ percentage }"> <span class="percentage-value">{{ percentage }}%</span> - <span class="percentage-label">{{ finish + '/' + total }}</span> + <!-- <span class="percentage-label">{{ finish + '/' + total }}</span> --> </template> </el-progress> - </el-col> - <el-col span="16"> - <div>{{ name }}</div> - <!-- <div>{{ planTime }}</div> --> - <div>{{ userName }}</div> - <el-row style="gap: 10px"> - <div class="v-center" v-for="item in count" :key="item.sceneType"> - <el-progress - :width="50" - :stroke-width="3" - type="dashboard" - :percentage="(item.finish / item.total) * 100" - > - <template #default="{ percentage }"> - <span class="percentage-value-small">{{ percentage }}%</span> - </template> - </el-progress> - <div> - <el-text size="small">{{ item.sceneType }}</el-text> - <el-text size="small">{{ item.finish + '/' + item.total }}</el-text> - </div> - <div></div> - <!-- <div class="percentage-label-small">{{ item.sceneType }}</div> --> - <!-- <span class="percentage-label-small">{{ item.finish + '/' + item.total }} </span> --> - </div> - </el-row> - </el-col> - </el-row> - </div> + <el-text size="small">{{ finish + '/' + total }}</el-text> + </div> + </el-col> + <el-col span="12" class="flex-bottom"> + <!-- <div>{{ name }}</div> --> + <!-- <div>{{ planTime }}</div> --> + <!-- <div>{{ userName }}</div> --> + <el-row style="gap: 40px" justify="space-between"> + <div class="v-center" v-for="item in count" :key="item.sceneType"> + <el-text size="small">{{ item.sceneType }}</el-text> + <el-progress + :width="50" + :stroke-width="3" + type="circle" + status="warning" + :percentage="(item.finish / item.total) * 100" + > + <template #default="{ percentage }"> + <span class="percentage-value-small">{{ percentage }}%</span> + </template> + </el-progress> + <el-text size="small">{{ item.finish + '/' + item.total }}</el-text> + <!-- <div class="percentage-label-small">{{ item.sceneType }}</div> --> + <!-- <span class="percentage-label-small">{{ item.finish + '/' + item.total }} </span> --> + </div> + </el-row> + </el-col> + </el-row> + <!-- </div> --> </template> <script> @@ -85,6 +92,12 @@ border-radius: var(--el-border-radius-base); } +.flex-bottom { + display: flex; + flex-direction: column; + justify-content: end; +} + .percentage-value { display: block; margin-top: 10px; -- Gitblit v1.9.3