From 6ca4af64eda4d827adbe4cf4b5208b4e844ebddf Mon Sep 17 00:00:00 2001
From: hyingbo <1363390067@qq.com>
Date: 星期一, 28 七月 2025 16:19:05 +0800
Subject: [PATCH] 工具入库-选择申请单入库，选择入库单后查寻得却是所有入库单明细
---
src/views/mdc/base/GroupUtilizationRateCompareChart.vue | 355 +++++++++++++++++++++++++++++++++--------------------------
1 files changed, 198 insertions(+), 157 deletions(-)
diff --git a/src/views/mdc/base/GroupUtilizationRateCompareChart.vue b/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
index db59115..c016c8f 100644
--- a/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
+++ b/src/views/mdc/base/GroupUtilizationRateCompareChart.vue
@@ -1,177 +1,218 @@
<template>
<a-card>
+ <div class="table-page-search-wrapper">
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+ <a-col :md="3" :sm="3">
+ <a-form-item label="涓績">
+ <a-select v-model="queryParam.productionId" placeholder="璇烽�夋嫨涓績">
+ <a-select-option v-for="item in centerList" :key="item.key">
+ {{ item.title }}
+ </a-select-option>
+ </a-select>
+ </a-form-item>
+ </a-col>
+
+ <a-col :md="5" :sm="5">
+ <a-space>
+ <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+ </a-space>
+ </a-col>
+ </a-row>
+ </a-form>
+ </div>
+
<div style="display: flex;justify-content: space-between">
- <div id="chart-container-left" style="height: 700px;width: 48%"></div>
- <div id="chart-container-right" style="height: 700px;width: 48%"></div>
+ <div id="chart-container-left" style="height: 700px;width: 30%"></div>
+ <div id="chart-container-middle" style="height: 700px;width: 30%"></div>
+ <div id="chart-container-right" style="height: 700px;width: 30%"></div>
</div>
</a-card>
</template>
<script>
-import api from '@api/mdc'
-import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+ import mdcApi from '@api/mdc'
+ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
-export default {
- name: 'GroupUtilizationRateCompareChart',
- components: {},
- mixins: [JeecgListMixin],
- data() {
- return {
- disableMixinCreated: true,
- typeTree: '',
- queryParam: {},
- driveTypeList: [],
- leftChartContainer: null,
- rightChartContainer: null,
- url: {}
- }
- },
- props: { nodeTree: '', Type: '', nodePeople: '' },
- created() {
- },
- mounted() {
- window.addEventListener('resize', this.handleWindowResize)
- this.getDriveTypeByApi()
- this.loadData()
- this.handleWindowResize()
- },
- watch: {
- Type(valmath) {
- this.dataList = []
- this.queryParam.typeTree = valmath
- },
- nodeTree(val) { //鐩戝惉currSelected 鍙樺寲锛屽皢鍙樺寲鍚庣殑鏁板�间紶閫掔粰 getCurrSelected 浜嬩欢
- if (JSON.stringify(val) != '{}') {
- if (val.equipmentId != null) {
- this.queryParamEquip.parentId = ''
- this.queryParamEquip.equipmentId = val.equipmentId
- } else {
- this.queryParamEquip.parentId = val.key
- this.queryParamEquip.equipmentId = ''
- }
- this.searchQuery()
- }
- },
- nodePeople(val) {
- if (JSON.stringify(val) != '{}') {
- if (val.equipmentId != null) {
- this.queryParamPeople.parentId = val.equipmentId
- this.queryParamPeople.equipmentId = ''
- } else {
- this.queryParamPeople.parentId = val.key
- this.queryParamPeople.equipmentId = ''
- }
- this.searchQuery()
- }
- }
- },
- methods: {
- loadData() {
- this.initChart('left')
- this.initChart('right')
- },
-
- initChart(position) {
- this[position + 'ChartContainer'] = this.$echarts.init(document.getElementById(`chart-container-${position}`))
- const option = {
- title: {
- text: position === 'left' ? '鍚勭彮缁�24灏忔椂缁煎悎鏁堢巼瀵规瘮' : '鍚勭彮缁�24灏忔椂缁煎悎鏁堢巼瀵规瘮锛堝幓闄ゆ晠闅滆澶囨椂闂达級',
- left: 'center',
- top: 0,
- textStyle: {
- fontSize: 22
- }
- },
- grid: {
- top: '10%',
- left: '1%',
- right: '1%',
- bottom: '5%',
- containLabel: true
- },
- legend: {
- bottom: 0,
- right: 'center',
- itemGap: 20,
- data: ['鏁伴摚涓�鐝�', '鏁伴摚浜岀彮', '鏁伴摚涓夌彮', '鏁拌溅鐝�']
- },
- tooltip: {
- show: true,
- trigger: 'axis'
- },
- xAxis: {
- type: 'category',
- data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
- },
- yAxis: [
+ export default {
+ name: 'GroupUtilizationRateCompareChart',
+ components: {},
+ mixins: [JeecgListMixin],
+ data() {
+ return {
+ disableMixinCreated: true,
+ centerList: [],
+ chartsOptionList: [
{
- type: 'value',
- name: '鍒╃敤鐜�(%)',
- axisLine: {
- show: true
- },
- axisLabel: {
- formatter: '{value}%'
- }
+ position: 'left',
+ title: '鐝粍璁惧缁煎悎鍒╃敤鐜囷紙24h锛�',
+ property: 'utilizationRateList'
+ },
+ {
+ position: 'middle',
+ title: '鐝粍璁惧缁煎悎鍒╃敤鐜囷紙24h鍘婚櫎鏁呴殰鏃堕棿锛�',
+ property: 'amendUtilizationRateList'
+ },
+ {
+ position: 'right',
+ title: '鐝粍璁惧缁煎悎鍒╃敤鐜囷紙璁″垝宸ヤ綔鏃堕棿锛�',
+ property: 'shiftUtilizationRateList'
}
],
- series: [
- {
- type: 'line',
- name: '鏁伴摚涓�鐝�',
- yAxisIndex: 0,
- data: [85, 32, 23, 56, 24, 64, 34, 85, 32, 23, 56, 24]
- },
- {
- type: 'line',
- name: '鏁伴摚浜岀彮',
- yAxisIndex: 0,
- data: [23, 42, 76, 54, 87, 34, 53, 76, 54, 87, 34, 53]
- },
- {
- type: 'line',
- name: '鏁伴摚涓夌彮',
- yAxisIndex: 0,
- data: [10, 84, 21, 42, 53, 57, 32, 21, 42, 53, 57, 32]
- },
- {
- type: 'line',
- name: '鏁拌溅鐝�',
- yAxisIndex: 0,
- data: [23, 32, 42, 35, 64, 53, 16, 42, 35, 64, 53, 16]
- }
- ]
+ leftChartContainer: null,
+ middleChartContainer: null,
+ rightChartContainer: null
}
- this[position + 'ChartContainer'].setOption(option, true)
},
- // 璋冪敤鎺ュ彛鑾峰彇鎺у埗绯荤粺绫诲瀷
- getDriveTypeByApi() {
- api.getDriveTypeApi().then((res) => {
- this.driveTypeList = res.result.map(item => item.value)
- })
+ mounted() {
+ window.addEventListener('resize', this.handleWindowResize)
+ this.getCenterListByApi()
+ this.handleWindowResize()
},
+ methods: {
+ // 鑾峰彇鍥捐〃鏁版嵁
+ loadData() {
+ const that = this
+ this.chartsOptionList.forEach(item => {
+ that.initChart(item.position)
+ that.chartSetOption(item.position, item.title, [], [], false)
+ })
+ mdcApi.getGroupRateCompareChartDataApi(this.queryParam.productionId)
+ .then(res => {
+ if (res.success) {
+ that.chartsOptionList.forEach(item => this.chartSetOption(item.position, item.title, res.result[item.property], res.result.dateList))
+ } else {
+ that.$notification.warning({
+ message: '娑堟伅',
+ description: res.message
+ })
+ }
+ })
+ .catch(err => {
+ that.$notification.error({
+ message: '娑堟伅',
+ description: err.message
+ })
+ })
+ },
- /**
- * 鑱旀兂杈撳叆妗嗙瓫閫夊姛鑳�
- * @param input 杈撳叆鐨勫唴瀹�
- * @param option 閰嶇疆
- * @returns {boolean} 鍒ゆ柇鏄惁绛涢��
- */
- filterOption(input, option) {
- return (
- option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
- )
- },
+ /**
+ * 鍒濆鍖栧浘琛�
+ * @param position 鍥捐〃浣嶇疆 String
+ */
+ initChart(position) {
+ this[position + 'ChartContainer'] = this.$echarts.init(document.getElementById(`chart-container-${position}`))
+ this[position + 'ChartContainer'].showLoading({
+ text: '鏁版嵁鍔犺浇涓� ...',
+ color: '#0696e1', // 鍔犺浇鍔ㄧ敾棰滆壊
+ textColor: '#0696e1'
+ })
+ },
- handleWindowResize() {
- if (this.leftChartContainer) this.leftChartContainer.resize()
- if (this.rightChartContainer) this.rightChartContainer.resize()
+ /**
+ * 璁剧疆鍥炬爣閫夐」
+ * @param position 鍥捐〃浣嶇疆 String
+ * @param title 鍥捐〃鏍囬 String
+ * @param dataList 鍥捐〃鏁版嵁婧� Array
+ * @param dateList 鍥捐〃妯潗鏍囨湀浠� Array
+ * @param isHideLoading 鏄惁鍏抽棴鍔犺浇鍥炬爣 Boolean
+ */
+ chartSetOption(position, title, dataList, dateList, isHideLoading = true) {
+ const option = {
+ title: {
+ text: title,
+ left: 'center',
+ top: 0,
+ textStyle: {
+ fontSize: 22
+ }
+ },
+ grid: {
+ top: '10%',
+ left: '1%',
+ right: '1%',
+ bottom: '12%',
+ containLabel: true
+ },
+ legend: {
+ bottom: '3%',
+ right: 'center',
+ data: dataList.map(item => item.productionName)
+ },
+ tooltip: {
+ show: true,
+ trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: dateList
+ },
+ yAxis: [
+ {
+ type: 'value',
+ name: '鍒╃敤鐜�(%)',
+ axisLine: {
+ show: true
+ },
+ axisLabel: {
+ formatter: '{value}%'
+ }
+ }
+ ],
+ series: dataList.map(item => {
+ return {
+ type: 'line',
+ name: item.productionName,
+ data: item.dataList.map(item => item.utilizationRate)
+ }
+ })
+ // series: [
+ // {
+ // type: 'line',
+ // name: '鏁伴摚涓�鐝�',
+ // data: [85, 32, 23, 56, 24, 64]
+ // },
+ // {
+ // type: 'line',
+ // name: '鏁伴摚浜岀彮',
+ // data: [23, 42, 76, 54, 87, 34]
+ // },
+ // {
+ // type: 'line',
+ // name: '鏁伴摚涓夌彮',
+ // data: [10, 84, 21, 42, 53, 57]
+ // },
+ // {
+ // type: 'line',
+ // name: '鏁拌溅鐝�',
+ // data: [23, 32, 42, 35, 64, 53]
+ // }
+ // ]
+ }
+ this[position + 'ChartContainer'].setOption(option, true)
+ if (isHideLoading) this[position + 'ChartContainer'].hideLoading()
+ },
+
+ // 鑾峰彇涓績鍒楄〃
+ getCenterListByApi() {
+ this.centerList = []
+ const that = this
+ mdcApi.getCenterOrGroupListApi()
+ .then(res => {
+ if (res.success) {
+ that.centerList = res.result
+ that.$set(that.queryParam, 'productionId', res.result[0].value)
+ that.loadData()
+ }
+ })
+ },
+
+ handleWindowResize() {
+ if (this.leftChartContainer) this.leftChartContainer.resize()
+ if (this.middleChartContainer) this.middleChartContainer.resize()
+ if (this.rightChartContainer) this.rightChartContainer.resize()
+ }
}
}
-}
-</script>
-
-<style scoped lang="less">
-
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
--
Gitblit v1.9.3