From 726df452c8749f9f208f67ede9864f223d44ff49 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期五, 24 十一月 2023 17:43:56 +0800
Subject: [PATCH] 统计图表假数据测试
---
Source/UBCS-WEB/src/views/statistic/statisticPage.vue | 190 ++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 185 insertions(+), 5 deletions(-)
diff --git a/Source/UBCS-WEB/src/views/statistic/statisticPage.vue b/Source/UBCS-WEB/src/views/statistic/statisticPage.vue
index 415865a..d5b0556 100644
--- a/Source/UBCS-WEB/src/views/statistic/statisticPage.vue
+++ b/Source/UBCS-WEB/src/views/statistic/statisticPage.vue
@@ -8,14 +8,53 @@
<el-dialog
:visible.sync="addVisible"
append-to-body
+ class="avue-dialog avue-dialog--top"
title="鏂板鏁版嵁缁熻鍒嗘瀽"
+ top="-50px"
>
+ <el-table
+ :data="tableData"
+ border
+ style="width: 100%"
+ @selection-change="selectChange"
+ >
+ <el-table-column
+ type="selection"
+ width="55">
+ </el-table-column>
+ <el-table-column
+ align="center"
+ label="涓绘暟鎹簱鍚�"
+ prop="menuName">
+ </el-table-column>
+ <el-table-column
+ align="center"
+ label="绫诲瀷"
+ prop="codeType">
+ <template slot-scope="{ row }">
+ <el-select v-model="row.codeType" placeholder="璇烽�夋嫨鍥捐〃绫诲瀷">
+ <el-option label="鎶樼嚎鍥�" value="0"></el-option>
+ <el-option label="楗肩姸鍥�" value="1"></el-option>
+ <el-option label="鏌辩姸鍥�" value="2"></el-option>
+ <el-option label="鏌辩姸鎶樼嚎鍥�" value="3"></el-option>
+ </el-select>
+ </template>
+ </el-table-column>
+ </el-table>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="escHandler">鍙� 娑�</el-button>
+ <el-button type="primary" @click="addSaveHandler">淇濆瓨</el-button>
+ </span>
</el-dialog>
<!-- echarts缁勪欢-->
<div>
- <lineChart></lineChart>
- <pieChart></pieChart>
- <ColumnarChart></ColumnarChart>
+ <lineChart v-for="(item,index) in lineList" :key="index" :chartName="item.menuName"
+ :lineData="item.menuData"></lineChart>
+ <!-- <pieChart :pieData="pieData" :chartName="chartName"></pieChart>-->
+ <ColumnarChart v-for="(item,index) in columnarList" :key="index" :chartName="item.menuName"
+ :columnarData="item.menuData"></ColumnarChart>
+ <mixCart v-for="(item,index) in mixList" :key="index" :chartName="item.menuName"
+ :mixData="item.menuData"></mixCart>
</div>
</div>
</template>
@@ -24,23 +63,164 @@
import lineChart from "../../components/StatisticsComponent/lineChart"
import pieChart from "../../components/StatisticsComponent/pieChart"
import ColumnarChart from "../../components/StatisticsComponent/ColumnarChart"
+import mixCart from "../../components/StatisticsComponent/mixCart"
export default {
components: {
lineChart,
pieChart,
- ColumnarChart
+ ColumnarChart,
+ mixCart
},
name: "statisticPage",
data() {
return {
addVisible: false,
+ chartName: "",
+ lineList: [],
+ pieList: [],
+ columnarList: [],
+ mixList: [],
+ selectData: [],
+ tableData: [
+ {
+ menuName: "宸ヨ壓鏂囦欢",
+ codeType: "1",
+ menuData: [
+ [222, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "娴嬭瘯sc",
+ codeType: "2",
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "浜у搧鍨嬪彿",
+ codeType: "0",
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "鍥哄畾璧勪骇",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "鏉庤埅涓绘暟鎹�",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "Part",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "浜哄憳涓绘暟鎹�",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "浜哄憳",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "鏍囧噯",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "鐗╁搧涓绘暟鎹�",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ },
+ {
+ menuName: "鍨嬪彿",
+ codeType: null,
+ menuData: [
+ [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
+ [120, 132, 101, 134, 90, 230, 210, 130, 10, 122, 100, 80],
+ ]
+ }
+ ]
}
},
methods: {
+ //鏂板
addHandler() {
this.addVisible = true;
- }
+ },
+ //鍙栨秷
+ escHandler() {
+ this.addVisible = false;
+ },
+ //淇濆瓨
+ addSaveHandler() {
+ debugger
+ if (this.selectData.length <= 0) {
+ this.$message.warning('璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹紒');
+ return;
+ }
+
+ const typeList = {
+ "0": "lineList",
+ "1": "pieList",
+ "2": "columnarList",
+ "3": "mixList"
+ };
+
+ let hasValidData = false; // 娣诲姞涓�涓爣蹇楁潵璁板綍鏄惁鏈夋湁鏁堢殑閫夋嫨鏁版嵁
+ let codeStatus = this.selectData.every(key => key.codeType)
+ if (!codeStatus) {
+ this.$message.warning("璇锋鏌ュ凡鍕鹃�夋暟鎹被鍨嬫槸鍚︿负绌猴紒");
+ return;
+ }
+ this.selectData.forEach(item => {
+ const dataKey = typeList[item.codeType];
+ if (dataKey) {
+ this[dataKey].push(item);
+ hasValidData = true; // 鏍囪鏈夋湁鏁堟暟鎹娣诲姞
+ }
+ });
+
+ if (hasValidData) {
+ this.addVisible = false;
+ }
+ },
+ //琛ㄦ牸澶氶��
+ selectChange(selection, row) {
+ // console.log(selection, row)
+ this.selectData = selection;
+ },
}
}
</script>
--
Gitblit v1.9.3