From abd832383e0a6941352215a1b150a6fb0c50e7dc Mon Sep 17 00:00:00 2001 From: xiejun <xj@2023> Date: 星期五, 24 十一月 2023 10:18:33 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- Source/UBCS-WEB/src/views/statistic/statisticPage.vue | 15 + Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue | 29 +++ Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue | 105 +++++--------- Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue | 121 +++++++++++++++++ Source/UBCS-WEB/src/api/GetItem.js | 16 ++ Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue | 84 ++++++++++++ 6 files changed, 297 insertions(+), 73 deletions(-) diff --git a/Source/UBCS-WEB/src/api/GetItem.js b/Source/UBCS-WEB/src/api/GetItem.js index 2ba7b96..f8c50ce 100644 --- a/Source/UBCS-WEB/src/api/GetItem.js +++ b/Source/UBCS-WEB/src/api/GetItem.js @@ -45,6 +45,22 @@ data }) } +//鐢宠 +export function applySaveCode(data) { + return request({ + url: 'api/ubcs-code/mdmEngineController/addSaveBZ', + method: 'post', + data + }) +} +//淇 +export function amendEditCode(data) { + return request({ + url: 'api/ubcs-code/mdmEngineController/addSaveBZ', + method: 'post', + data + }) +} //宸插彂甯冩暟鎹洿鏀� export function upSaveCode(data) { return request({ diff --git a/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue b/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue index 5025b4b..483d080 100644 --- a/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue +++ b/Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue @@ -72,7 +72,7 @@ align="center"> </el-table-column> <!-- 鍙傜収鏁版嵁--> - <el-table-column v-for="(item,index) in referArray" key="index" v-if="Object.keys(item.referConfig).length > 0 && !item.hidden" :label="item.title" prop="jiliangdw" + <el-table-column v-for="(item,index) in referArray" :key="index" v-if="item.referConfig && Object.keys(item.referConfig).length > 0 && !item.hidden" :label="item.title" prop="jiliangdw" :show-overflow-tooltip="true" :sortable="item.sortable" :width="item.width" align="center"> <template slot-scope="scope"> @@ -176,7 +176,8 @@ deleteCode, upSaveCode, applyGroupCode, - receiveEditApply + receiveEditApply, + applySaveCode } from "@/api/GetItem"; import {processTS, changeStatus} from "@/api/template/setPersonnel" import {listCodeAttributeByClassId} from "@/api/integration/integration.js"; @@ -553,10 +554,28 @@ this.applyvisible = true; }); }, - applySumbit(){ - + applySumbit(val){ + // console.log('val',val) + if(func.notEmpty(val.ts)) { + val.ts = func.formattedDateTime(val.ts); + //console.log(val.ts); + } + applySaveCode(val).then(res => { + this.$nextTick(() => { + this.applyvisible = false; + this.$message.success("淇濆瓨鎴愬姛"); + this.onLoad() + }) + }) }, - amendSumbit(){ + amendSumbit(val){ + applySaveCode(val).then(res => { + this.$nextTick(() => { + this.amendvisible = false; + this.$message.success("淇濆瓨鎴愬姛"); + this.onLoad() + }) + }) }, //鏍囧噯淇 diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue new file mode 100644 index 0000000..2d84725 --- /dev/null +++ b/Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue @@ -0,0 +1,121 @@ +<template> + <basic-container> + <v-chart id="chart" :auto-resize="true" :options="chartOptions"></v-chart> + </basic-container> + +</template> + +<script> +import 'echarts' +import 'echarts/lib/chart/line' +import 'echarts/lib/chart/pie' +import 'echarts/lib/chart/bar' +import 'echarts/lib/component/tooltip' +import 'echarts/lib/component/title' +import 'echarts/lib/component/legend' + +var data = [ + [120, 132, 101, 134, 90, 230, 210, 130, 0, 122, 100, 80], + [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234], +]; + +// 鎵惧埌姣忎竴椤规暟鎹腑鐨勬渶澶у�煎苟淇濆瓨鍒版暟缁� +var maxValues = data[0].map(function (_, i) { + return Math.max.apply(null, data.map(function (item) { + return item[i]; + })); +}); + +var colors = ['#91CC75', '#5470C6']; +// 鐢熸垚鏌辩姸鍥剧殑 series 鏁版嵁 +var seriesData = []; +for (var i = 0; i < data.length; i++) { + var curSeriesData = []; + // 璁$畻鏁版嵁涓殑姣忕粍鏁版嵁鐨勬渶澶у�� + for (var j = 0; j < data[i].length; j++) { + var borderRadius = [0, 0, 0, 0]; // 榛樿涓嶈缃渾瑙� + if (data[i][j] === maxValues[j]) { // 濡傛灉褰撳墠鏌卞瓙鐨勫�肩瓑浜庡搴斿垪鐨勬渶澶у�硷紝璁剧疆鍦嗚 + borderRadius = [50, 50, 0, 0]; // 璁剧疆鍥涗釜瑙掗兘涓哄渾瑙� + } + curSeriesData.push({ + value: data[i][j], + itemStyle: { + normal: { + barBorderRadius: borderRadius, // 璁剧疆鍦嗚 + color: colors[i], + show: function (params) { + // 鏍规嵁鏁版嵁鍊肩殑澶у皬鏉ュ垽鏂槸鍚︽樉绀� label + return params.value > 30; + } + } + } + }); + } + var seriesName = ''; + if (i === 0) { + seriesName = '鎬婚噺'; + } else if (i === 1) { + seriesName = '鏂板'; + } + seriesData.push({ + name: seriesName, + type: 'bar', + stack: '鎬婚噺', + data: curSeriesData, + label: { + show: true, + position: 'top' + }, + itemStyle: { + color: colors[i] // 璁剧疆鏌卞瓙鐨勯鑹� + }, + emphasis: { + focus: 'series' + } + }); +} + +export default { + name: "ColumnarChart", + data() { + return { + chartOptions: { + title: { + text: '浜哄憳涓绘暟鎹粺璁�' + }, + grid: { + left: '3%', + right: '4%', + bottom: '3%', + containLabel: true + }, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'shadow' + } + }, + legend: { + data: ['鎬婚噺', '鏂板'], + left: 'center' + }, + xAxis: { + type: 'category', + data: ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�'] + }, + yAxis: { + type: 'value' + }, + series: seriesData, + } + } + } +} +</script> + +<style scoped lang="scss"> +#chart { + width: 1280px; + height: 800px; +} +</style> diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue index 4427fb6..d51df80 100644 --- a/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue +++ b/Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue @@ -1,103 +1,78 @@ <template> <div id="main"> <basic-container> - <v-chart :options="option" ref="chart" style="width: 100%;"></v-chart> + <v-chart id="chart" :auto-resize="true" :options="chartOptions"></v-chart> </basic-container> </div> </template> <script> import 'echarts' -import 'echarts/lib/chart/line'; -import 'echarts/lib/component/tooltip'; -import 'echarts/lib/component/title'; -import 'echarts/lib/component/legend'; +import 'echarts/lib/chart/line' +import 'echarts/lib/chart/pie' +import 'echarts/lib/chart/bar' +import 'echarts/lib/component/tooltip' +import 'echarts/lib/component/title' +import 'echarts/lib/component/legend' + export default { - name: "statisticPage", + name: "lineChart", data() { return { - option: { - color: ['red','black'], - legend: { - data: ['鍥句緥1', '鍥句緥2', '鍥句緥3'], - }, - dataset: [ - { - id: 'dataset_raw', - source: [ - { month: 1, total: 1000, newly: 800 }, - { month: 2, total: 5000, newly: 1000 }, - { month: 3, total: 1800, newly: 1400 }, - { month: 4, total: 1500, newly: 1200 }, - { month: 5, total: 1000, newly: 1200 }, - { month: 6, total: 1500, newly: 1200 }, - { month: 7, total: 1500, newly: 1200 }, - { month: 8, total: 1500, newly: 1000 }, - { month: 9, total: 1500, newly: 1200 }, - { month: 10, total: 1500, newly: 1200 }, - { month: 11, total: 1500, newly: 1200 }, - { month: 12, total: 1500, newly: 1200 }, - ], - }, - ], + chartOptions: { + color:['#2eadd6 ','#FFA500 '], title: { - text: '涓绘暟鎹粺璁″垎鏋�', - left:'center', - textAlign:'center' + text: '鐗╁搧涓绘暟鎹粺璁�' }, tooltip: { - trigger: 'axis', + trigger: 'axis' + }, + legend: { + data: ['鎬婚噺', '鏂板'] }, xAxis: { + boundaryGap: true, // 鎺у埗鍧愭爣杞翠袱渚х暀鐧� type: 'category', - nameLocation: 'middle', - name:'month', - // data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] // 鏈堜唤鏁版嵁 + data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�'] }, yAxis: { - name: 'Number', - type: 'value', + type: 'value' }, series: [ { + name: '鎬婚噺', type: 'line', - datasetId: 'dataset_raw', - showSymbol: false, - encode: { - x: 'month', - y: 'total', - itemName: 'month', - tooltip: ['total'], + smooth: true, + stack: 'Total', + label: { + show: true, + position: 'top' }, + data: [5000, 2000, 3600, 1000, 1000, 2000, 500, 2000, 500, 2000, 500, 2000] }, { + name: '鏂板', type: 'line', - datasetId: 'dataset_raw', - showSymbol: false, - encode: { - x: 'month', - y: 'newly', - itemName: 'month', - tooltip: ['newly'], + smooth: true, + stack: 'Total', + label: { + show: true, + position: 'top' }, - }, - ], - } + data: [1510, 1010, 2610, 2010, 3010, 1010, 1510, 3010, 1010, 1510, 3010, 2000] + } + ] + }, }; }, mounted() { - import('echarts').then((echarts) => { - // console.log(echarts) - this.$nextTick(() => { - const chartDom = this.$refs.chart.$el; - const myChart = echarts.init(chartDom); - myChart.setOption(this.option); - }); - }); }, } </script> -<style scoped> +<style lang="scss" scoped> +#chart { + width: 1280px; +} </style> diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue new file mode 100644 index 0000000..9b757c3 --- /dev/null +++ b/Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue @@ -0,0 +1,84 @@ +<template> + <basic-container> + <v-chart :options="chartOptions" :auto-resize="true" id="chart"></v-chart> + </basic-container> +</template> + +<script> +import 'echarts' +import 'echarts/lib/chart/pie' +import 'echarts/lib/component/tooltip' +import 'echarts/lib/component/legend' +export default { + name: "pieChart", + data() { + return { + chartOptions: { + title: { + text: '渚涘簲鍟嗕富鏁版嵁缁熻', + left: 'center' + }, + tooltip: { + trigger: 'item', + formatter: function (params) { + var result = ''; + if (params.componentType === 'series') { + result += params.name + '<br/>'; + result += '鏂板锛�' + params.data.newValue + '<br/>'; + result += '鎬婚噺锛�' + params.data.value + '<br/>'; + result += '鐧惧垎姣旓細' + params.percent + '%'; + } + return result; + } + }, + legend: { + orient: 'vertical', + right: 10, + top: 'middle', + data: ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�'] + }, + series: [ + { + name: '', + type: 'pie', + radius: ['40%', '70%'], + avoidLabelOverlap:false, + label: { + formatter: '{b}\n{d}%', + fontSize:14 + }, + itemStyle: { + color: function(params) { + // 鏍规嵁鍏蜂綋闇�姹傝缃鑹� + var colorList = ['#5470C6', '#91CC75', '#fac858', '#EE6666', '#3BA272', '#FC8452', '#9A60B4', '#e34d4d', '#b3e9b9', '#eaaaed', '#1bc6e4', '#c6b3e9']; + return colorList[params.dataIndex % colorList.length]; + } + }, + data: [ + { value: 110, name: '涓�鏈�', newValue: 10, totalValue: 110 }, + { value: 220, name: '浜屾湀', newValue: 20, totalValue: 220 }, + { value: 330, name: '涓夋湀', newValue: 30, totalValue: 330 }, + { value: 440, name: '鍥涙湀', newValue: 40, totalValue: 440 }, + { value: 550, name: '浜旀湀', newValue: 50, totalValue: 550 }, + { value: 660, name: '鍏湀', newValue: 60, totalValue: 660 }, + { value: 770, name: '涓冩湀', newValue: 70, totalValue: 770 }, + { value: 880, name: '鍏湀', newValue: 80, totalValue: 880 }, + { value: 990, name: '涔濇湀', newValue: 90, totalValue: 990 }, + { value: 1100, name: '鍗佹湀', newValue: 100, totalValue: 1100 }, + { value: 1210, name: '鍗佷竴鏈�', newValue: 110, totalValue: 1210 }, + { value: 1320, name: '鍗佷簩鏈�', newValue: 120, totalValue: 1320 } + ] + } + ] + }, + } + } +} +</script> + +<style scoped lang="scss"> +#chart { + width: 800px; + height: 600px; +} +</style> diff --git a/Source/UBCS-WEB/src/views/statistic/statisticPage.vue b/Source/UBCS-WEB/src/views/statistic/statisticPage.vue index 3afb4d8..415865a 100644 --- a/Source/UBCS-WEB/src/views/statistic/statisticPage.vue +++ b/Source/UBCS-WEB/src/views/statistic/statisticPage.vue @@ -6,21 +6,30 @@ </div> <!-- 鏂板瀵硅瘽妗�--> <el-dialog - title="鏂板鏁版嵁缁熻鍒嗘瀽" :visible.sync="addVisible" append-to-body + title="鏂板鏁版嵁缁熻鍒嗘瀽" > </el-dialog> + <!-- echarts缁勪欢--> + <div> + <lineChart></lineChart> + <pieChart></pieChart> + <ColumnarChart></ColumnarChart> + </div> </div> - </template> <script> import lineChart from "../../components/StatisticsComponent/lineChart" +import pieChart from "../../components/StatisticsComponent/pieChart" +import ColumnarChart from "../../components/StatisticsComponent/ColumnarChart" export default { components: { - lineChart + lineChart, + pieChart, + ColumnarChart }, name: "statisticPage", data() { -- Gitblit v1.9.3