From 8eebd3b823c2e477f949b7f06b6e972ec09327df Mon Sep 17 00:00:00 2001 From: Mr.Zhang <710666463@qq.com> Date: 星期二, 22 八月 2023 14:27:22 +0800 Subject: [PATCH] 工序 接口调试 --- screen_standard/src/views/process.vue | 145 ++++++++++++++++++++++++++++------------------- 1 files changed, 86 insertions(+), 59 deletions(-) diff --git a/screen_standard/src/views/process.vue b/screen_standard/src/views/process.vue index 378946b..ac48cf4 100644 --- a/screen_standard/src/views/process.vue +++ b/screen_standard/src/views/process.vue @@ -34,31 +34,31 @@ <div class="yield-content"> <div class="yield-content-left"> <div class="content_left_item1_content"> - <div class="content_left_item1_content_row" v-for="(item, index) in 5" :key="index"> + <div class="content_left_item1_content_row" v-for="(item, index) in top1" :key="index"> <div class="content_left_item1_content_row_name"> <div :class="index > 2 ? 'num bg1' : 'num bg2'">{{ index + 1 }}</div> - <span>璧电珛{{ index }}</span> + <span>{{ item.userName }}</span> </div> <div class="content_left_item1_content_row_line"> - <el-progress :show-text="false" :percentage="50"> + <el-progress :show-text="false" :percentage="item.doneNum/baseNum"> </el-progress> </div> - <div class="content_left_item1_content_row_num">342</div> + <div class="content_left_item1_content_row_num">{{ item.doneNum }}</div> </div> </div> </div> <div class="yield-content-left"> <div class="content_left_item1_content"> - <div class="content_left_item1_content_row" v-for="(item, index) in 5" :key="index"> + <div class="content_left_item1_content_row" v-for="(item, index) in top2" :key="index"> <div class="content_left_item1_content_row_name"> <div class="num bg1">{{ index + 6 }}</div> - <span>璧电珛{{ index }}</span> + <span>{{ item.userName }}</span> </div> <div class="content_left_item1_content_row_line"> - <el-progress :show-text="false" :percentage="50"> + <el-progress :show-text="false" :percentage="item.doneNum/baseNum"> </el-progress> </div> - <div class="content_left_item1_content_row_num">342</div> + <div class="content_left_item1_content_row_num">{{ item.doneNum }}</div> </div> </div> </div> @@ -107,54 +107,60 @@ </template> <script setup> -import { reactive, ref, onMounted, onBeforeUnmount, onUnmounted, nextTick } from 'vue' +import { reactive, ref, toRefs, onMounted, onBeforeUnmount, onUnmounted, nextTick } from 'vue' +import { getProcedurePlanData, getTop } from '@/utils/apis.js' +import { useCounterStore } from '@/stores/counter.js' +import { useRoute } from 'vue-router' import * as echarts from 'echarts' +const route = useRoute() +const enterprise = useCounterStore() let planTimer = ref(null) let reportTimer = ref(null) let planContainer = ref(null) let reportLogContainer = ref(null) -let listData = reactive([ - { name: 'dom绗竴涓�' }, - { name: 'dom绗簩涓�' }, - { name: 'dom绗笁涓�' }, - { name: 'dom绗洓涓�' }, - { name: 'dom绗簲涓�' }, - { name: 'dom绗叚涓�' }, - { name: 'dom绗竷涓�' }, - { name: 'dom绗叓涓�' }, - { name: 'dom绗節涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, - { name: 'dom绗崄涓�' }, -]) -let dayDistribution = reactive([ - { date: '8/1', num: '20' }, - { date: '8/2', num: '10' }, - { date: '8/3', num: '20' }, - { date: '8/4', num: '40' }, - { date: '8/5', num: '30' }, - { date: '8/6', num: '10' }, - { date: '8/7', num: '20' }, -]) -let typeDistribution = reactive([ - { name: '澶栬涓嶈壇', num: 15 }, - { name: '鏈夋瘺鍒�', num: 12 }, - { name: '灏哄涓嶈壇', num: 22 }, - { name: '鏈夊垝鐥�', num: 5 }, - { name: '鍏朵粬', num: 2 }, +const data = reactive({ + listData: [ + { name: 'dom绗竴涓�' }, + { name: 'dom绗簩涓�' }, + { name: 'dom绗笁涓�' }, + { name: 'dom绗洓涓�' }, + { name: 'dom绗簲涓�' }, + { name: 'dom绗叚涓�' }, + { name: 'dom绗竷涓�' }, + { name: 'dom绗叓涓�' }, + { name: 'dom绗節涓�' }, + { name: 'dom绗崄涓�' }, + ], + top1: [], + top2: [], + baseNum: 0, + dayDistribution: [ + { date: '8/1', num: '20' }, + { date: '8/2', num: '10' }, + { date: '8/3', num: '20' }, + { date: '8/4', num: '40' }, + { date: '8/5', num: '30' }, + { date: '8/6', num: '10' }, + { date: '8/7', num: '20' }, + ], + typeDistribution: [ + { name: '澶栬涓嶈壇', num: 15 }, + { name: '鏈夋瘺鍒�', num: 12 }, + { name: '灏哄涓嶈壇', num: 22 }, + { name: '鏈夊垝鐥�', num: 5 }, + { name: '鍏朵粬', num: 2 }, + ] +}) -]) +let { listData, top1, top2, baseNum } = toRefs(data) + // start() onBeforeUnmount(() => { clearTimeout(planTimer.value) clearTimeout(reportTimer.value) }) onMounted(() => { + initData() nextTick(() => { start() reportStart() @@ -168,6 +174,36 @@ clearTimeout(planTimer.value) clearTimeout(reportTimer.value) }) + +function initData() { + // 璁″垝鏁� + getProcedurePlanData(enterprise.companyId, enterprise.departId, { procedureId: route.query.procedureId }) + .then(res => { + enterprise.setNum(res) + }) + // top10 + getTop(enterprise.companyId, enterprise.departId, { procedureId: route.query.procedureId }) + .then(res => { + if (res.length) { + + data.baseNum = res[0].doneNum + data.top1 = [] + data.top2 = [] + if (res.length <= 5) { + data.top1 = res + } else { + res.forEach((item, index) => { + if (index < 5) { + data.top1.push(item) + } else { + data.top2.push(item) + } + }) + } + } + }) + +} function handleMouseEnter() { clearTimeout(planTimer.value) @@ -200,12 +236,12 @@ scrollDom = planContainer.value } else { // 濡傛灉鍒楄〃鏁伴噺杩囧皯涓嶈繘琛屾粴鍔� - if (scrollDom.children.length < 4) { + if (scrollDom.children.length <=10) { clearTimeout(planTimer.value) return } // 缁勪欢杩涜婊氬姩 - scrollDom.scrollTop += 2 + scrollDom.scrollTop += 1.5 // 鍒ゆ柇鏄惁婊氬姩鍒板簳閮� if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { // 鑾峰彇缁勪欢绗竴涓妭鐐� @@ -233,12 +269,12 @@ scrollDom = reportLogContainer.value } else { // 濡傛灉鍒楄〃鏁伴噺杩囧皯涓嶈繘琛屾粴鍔� - if (scrollDom.children.length < 4) { + if (scrollDom.children.length <= 10) { clearTimeout(reportTimer.value) return } // 缁勪欢杩涜婊氬姩 - scrollDom.scrollTop += 2 + scrollDom.scrollTop += 1.5 // 鍒ゆ柇鏄惁婊氬姩鍒板簳閮� if (scrollDom.scrollTop >= (scrollDom.scrollHeight - scrollDom.clientHeight)) { // 鑾峰彇缁勪欢绗竴涓妭鐐� @@ -259,7 +295,7 @@ let dateList = [] let numList = [] - dayDistribution.forEach(item => { + data.dayDistribution.forEach(item => { dateList.push(item.date) numList.push(item.num) }) @@ -350,20 +386,11 @@ let myChart = echarts.init(dayChartDom); let legendData = [] let seriesData = [] - typeDistribution.forEach(item => { + data.typeDistribution.forEach(item => { legendData.push(item.name) seriesData.push({name:item.name, value:item.num}) }) let option = { - // title: { - // text: '鍚屽悕鏁伴噺缁熻', - // subtext: '绾睘铏氭瀯', - // left: 'center' - // }, - // tooltip: { - // trigger: 'item', - // formatter: '{a} <br/>{b} : {c} ({d}%)' - // }, legend: { show: false, type: 'scroll', -- Gitblit v1.9.3