From 963a2313f4f8959715293d38f69894078150d508 Mon Sep 17 00:00:00 2001 From: lzhe <lzhe@example.com> Date: 星期五, 14 六月 2024 11:29:47 +0800 Subject: [PATCH] Merge branch 'master' of http://www.beijingsoft.cn:9090/r/smart-web --- src/views/mdc/components/Time.vue | 204 ++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 200 insertions(+), 4 deletions(-) diff --git a/src/views/mdc/components/Time.vue b/src/views/mdc/components/Time.vue index 6578296..17d160d 100644 --- a/src/views/mdc/components/Time.vue +++ b/src/views/mdc/components/Time.vue @@ -1,18 +1,214 @@ <!-- - * @Date: 2024-04-18 21:52:28 + * @Date: 2024-04-18 21:52:18 * @LastEditors: Sneed - * @LastEditTime: 2024-04-18 21:54:53 + * @LastEditTime: 2024-04-27 23:30:06 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/components/Time.vue --> <template> - <div> + <el-row> + <el-col> + <el-button-group> + <el-button size="small" @click="statisticalMethod = item.value" + :type="statisticalMethod == item.value ? 'primary' : ''" v-for="item in btnList" + :key="item.value">{{ + item.label }}</el-button> + </el-button-group> + </el-col> + <el-col style="margin-top: 12px;"> + <el-card shadow="never"> + <scEcharts height="300px" :option="option2"></scEcharts> + </el-card> + </el-col> + <el-col> + 缁熻鏁版嵁 + </el-col> + <el-col> + <scTable ref="table" row-key="id" border :params="params" :apiObj="apiObj" stripe> + <el-table-column prop="workstationCode" label="宸ヤ綅缂栫爜" /> + <el-table-column prop="workstationName" label="宸ヤ綅鍚嶇О" /> + <el-table-column prop="" :label="item" v-for="item in cols"> + <template #default="scope"> + <span>{{ scope.row.data[item] }}</span> + </template> + </el-table-column> - </div> + </scTable> + </el-col> + </el-row> </template> <script> +import scEcharts from '@/components/scEcharts'; export default { + props: { + url: { + default: '/api/blade-mdc/efficiency-analysis', + type: String, + } + }, + components: { + scEcharts + }, + data() { + return { + apiObj: '', + params: {}, + statisticalMethod: 'DAY', + btnList: [ + { + label: '鎸夋棩鏌ョ湅', + value: 'DAY', + }, + { + label: '鎸夊懆鏌ョ湅', + value: 'WEEK', + }, + { + label: '鎸夋湀鏌ョ湅', + value: 'MONTH', + }, + ], + cols: [], + chartsData: [], + option2: null, + } + }, + watch: { + statisticalMethod(val) { + this.query({ + ...this.params, + }) + this.queryChart({ + ...this.params, + }) + } + }, + methods: { + init(params) { + this.params = params + this.getTime({ + endDate: params.endDate, + startDate: params.startDate, + statisticalMethod: this.statisticalMethod + }).then(res => { + this.query({ + ...params, + statisticalMethod: this.statisticalMethod + }) + this.queryChart({ + ...params, + statisticalMethod: this.statisticalMethod + }) + }) + }, + getTime(data) { + return Promise.resolve() + // return this.$HTTP.post('/api/blade-mdc/efficiency-analysis/interval', { + // ...data + // }).then(res => { + // if (res.code === 200) { + // this.btnList = res.data + // } + // }) + }, + queryChart(data) { + let params = { + size: -1 + } + let dataSend = { + ...data, + queryType: 0, + statisticalMethod: this.statisticalMethod + } + return this.$HTTP.post(this.url, dataSend, { params }).then(res => { + this.chartsData = res.data.items.records + let option2 = { + // legend: { + // type: 'plain', + // }, + title: { + text: '缁熻鍥捐〃', + subtext: '', + }, + grid: { + top: '80px' + }, + tooltip: { + trigger: 'axis' + }, + xAxis: { + type: 'category', + axisLabel: { + interval: 'auto', + } + }, + yAxis: { + type: 'value', + axisLabel: { + formatter: (value) => { + return value + '%' + } + }, + }, + dataZoom: [ + { type: 'slider' } + ], + dataset: { + source: [] + }, + series: [] + } + let source1 = ['product'] + let row = res.data.items.records[0] + Object.values(row.nameData).forEach(v => { + option2.series.push({ + type: 'bar', + }) + source1.push(v) + }) + option2.dataset.source = [source1] + res.data.items.records.forEach(v => { + let current = [v.id] + Object.keys(v.nameData).forEach(key => { + current.push((v.data[key] - 0) * 100) + }) + option2.dataset.source.push(current) + }); + this.option2 = option2 + console.log(option2) + }) + }, + query(params) { + this.params = params + this.apiObj = { + get: async (data) => { + let params = { + current: data.current, + size: data.size + } + let dataSend = { + ...data, + queryType: 1, + statisticalMethod: this.statisticalMethod + } + delete dataSend.current + delete dataSend.size + delete dataSend.order + delete dataSend.prop + return await this.$HTTP.post(this.url, dataSend, { params }).then(res => { + let row = res.data.items?.records[0]?.data || {} + this.cols = Object.keys(row) + console.log(this.cols) + return { + ...res, + data: res.data.items + } + }) + } + } + } + } } </script> -- Gitblit v1.9.3