From 4f8d0f43cf8e82cbb3f33027389b1b6a70a9c914 Mon Sep 17 00:00:00 2001
From: pengjunchao <499766544@qq.com>
Date: Fri, 5 Dec 2025 09:17:34 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
index.html | 3 +-
src/assets/styles/public.scss | 3 +
src/store/modules/permission.js | 24 +++
src/views/chart/layout/SideMenu.vue | 10 +
src/views/chart/pages/Calculation.vue | 242 ++++++++++++++---------
src/views/chart/pages/Configure.vue | 78 ++++----
src/views/chart/pages/ConfigureChart.vue | 221 +++++++++++++++++++++
src/views/chart/pages/Dataset.vue | 5 +-
src/views/chart/pages/LoadFromDb.vue | 29 ++-
src/views/chart/pages/Predict.vue | 197 ++++++++++++++++++
10 files changed, 664 insertions(+), 148 deletions(-)
create mode 100644 src/views/chart/pages/ConfigureChart.vue
create mode 100644 src/views/chart/pages/Predict.vue
diff --git a/index.html b/index.html
index 4ea261a..036a3a4 100644
--- a/index.html
+++ b/index.html
@@ -212,7 +212,8 @@
diff --git a/src/assets/styles/public.scss b/src/assets/styles/public.scss
index 95d0b62..aa2ba20 100644
--- a/src/assets/styles/public.scss
+++ b/src/assets/styles/public.scss
@@ -45,6 +45,9 @@ body, #app {
}
}
}
+ .el-table__empty-block {
+ background-color: #1C2630;
+ }
.el-table__body {
tr {
color: #a7bacf;
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index 48c0653..22d6ea3 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -222,6 +222,30 @@ const usePermissionStore = defineStore(
"link": null
},
},
+ {
+ "name": "Predict",
+ "path": "Predict",
+ "hidden": false,
+ "component": "chart/pages/Predict",
+ "meta": {
+ "title": "Predict",
+ "icon": "log",
+ "noCache": false,
+ "link": null
+ },
+ },
+ {
+ "name": "ConfigureChart",
+ "path": "ConfigureChart",
+ "hidden": false,
+ "component": "chart/pages/ConfigureChart",
+ "meta": {
+ "title": "ConfigureChart",
+ "icon": "log",
+ "noCache": false,
+ "link": null
+ },
+ },
]
}
]
diff --git a/src/views/chart/layout/SideMenu.vue b/src/views/chart/layout/SideMenu.vue
index 712b3e9..5eb0227 100644
--- a/src/views/chart/layout/SideMenu.vue
+++ b/src/views/chart/layout/SideMenu.vue
@@ -97,6 +97,16 @@ export default {
name: 'Monitor the training process',
url: '/system/chart/Calculation',
},
+ {
+ id: '24',
+ name: 'Config chart',
+ url: '/system/chart/ConfigureChart',
+ },
+ {
+ id: '23',
+ name: 'Predict',
+ url: '/system/chart/Predict',
+ },
{
id: '4',
name: 'Analyze',
diff --git a/src/views/chart/pages/Calculation.vue b/src/views/chart/pages/Calculation.vue
index 5de36e6..2c4c589 100644
--- a/src/views/chart/pages/Calculation.vue
+++ b/src/views/chart/pages/Calculation.vue
@@ -225,13 +225,31 @@ export default {
value: 'BDT',
label: 'BDT',
},
- ]
+ {
+ value: 'SVM',
+ label: 'SVM',
+ },
+ {
+ value: 'MLP',
+ label: 'MLP',
+ },
+ {
+ value: 'RF',
+ label: 'RF',
+ },
+ ],
+ caseNo: '',
+ timer: null,
+ chartData: {
+ xAxisData: [],
+ seriesData: []
+ },
+ myChart: null
}
},
created() {},
mounted() {
this.chart()
- this.onSearch()
this.getDataset()
},
methods: {
@@ -245,14 +263,41 @@ export default {
this.$axios.post(window.CONFIG.baseUrl + '/train-oneday/train_models', this.queryParams, {
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then((res) => {
- this.tableData = res.data.items
- this.total = res.data.pagination.total_count
+ debugger
+ if (res.case_no) {
+ this.caseNo = res.case_no
+ }
+ this.queryModalProcess()
}).finally(() => {
this.loading = false
})
},
+ queryModalProcess() {
+ this.timer = setInterval(async () => {
+ // const res = await this.$axios.get(window.CONFIG.baseUrl + '/train-oneday/get_available_models', { params: { case_no: this.caseNo } })
+ const res = await this.$axios.get(window.CONFIG.baseUrl + '/train-oneday/query_train_cases', { params: { /*dataset_id: this.queryParams.dataset_id, model_type: this.queryParams.model_types,*/ case_no: this.caseNo, page: 1, size: 30 } })
+ debugger
+ res.data.items.forEach((item, index) => {
+ debugger
+ if (index === 0) {
+ this.chartData.xAxisData.push(item.start_time.substr(0, 10))
+ }
+ this.chartData.seriesData.push({
+ name: item.model_type,
+ type: 'line',
+ data: [item.res_accu ? item.res_accu : 0, item.res_auc ? item.res_auc : 0, item.res_f1 ? item.res_f1 : 0, item.res_prec ? item.res_prec : 0, item.res_recall ? item.res_recall : 0],
+ })
+ })
+ this.myChart.setOption({
+ xAxis: {
+ data: this.chartData.xAxisData
+ },
+ series: this.chartData.seriesData
+ })
+ }, 3000)
+ },
chart() {
- const myChart = this.$echarts.init(this.$refs.chartDom)
+ this.myChart = this.$echarts.init(this.$refs.chartDom)
const option = {
grid: {
left: 60,
@@ -276,38 +321,39 @@ export default {
color: '#a2b4c9',
// rotate: 0
},
- data: [
- '2022-11-01',
- '2022-11-02',
- '2022-11-03',
- '2022-11-04',
- '2022-11-05',
- '2022-11-06',
- '2022-11-07',
- '2022-11-08',
- '2022-11-09',
- '2022-11-10',
- '2022-11-11',
- '2022-11-12',
- '2022-11-13',
- '2022-11-14',
- '2022-11-15',
- '2022-11-16',
- '2022-11-17',
- '2022-11-18',
- '2022-11-19',
- '2022-11-20',
- '2022-11-21',
- '2022-11-22',
- '2022-11-23',
- '2022-11-24',
- '2022-11-25',
- '2022-11-26',
- '2022-11-27',
- '2022-11-28',
- '2022-11-29',
- '2022-11-30',
- ],
+ // data: [
+ // '2022-11-01',
+ // '2022-11-02',
+ // '2022-11-03',
+ // '2022-11-04',
+ // '2022-11-05',
+ // '2022-11-06',
+ // '2022-11-07',
+ // '2022-11-08',
+ // '2022-11-09',
+ // '2022-11-10',
+ // '2022-11-11',
+ // '2022-11-12',
+ // '2022-11-13',
+ // '2022-11-14',
+ // '2022-11-15',
+ // '2022-11-16',
+ // '2022-11-17',
+ // '2022-11-18',
+ // '2022-11-19',
+ // '2022-11-20',
+ // '2022-11-21',
+ // '2022-11-22',
+ // '2022-11-23',
+ // '2022-11-24',
+ // '2022-11-25',
+ // '2022-11-26',
+ // '2022-11-27',
+ // '2022-11-28',
+ // '2022-11-29',
+ // '2022-11-30',
+ // ],
+ data: this.chartData.xAxisData
},
yAxis: {
axisLine: {
@@ -337,69 +383,71 @@ export default {
axisPointer: {
type: 'cross',
},
- borderWidth: 1,
- borderColor: '#ccc',
- padding: 10,
- textStyle: {
- color: '#000',
- },
- position: function (pos, params, el, elRect, size) {
- const obj = {
- top: 10,
- }
- obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 30
- return obj
- },
+ // borderWidth: 1,
+ // borderColor: '#ccc',
+ // padding: 10,
+ // textStyle: {
+ // color: '#000',
+ // },
+ // position: function (pos, params, el, elRect, size) {
+ // const obj = {
+ // top: 10,
+ // }
+ // obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 30
+ // return obj
+ // },
// extraCssText: 'width: 170px'
},
- series: [
- {
- name: 'MA5',
- type: 'line',
- data: [
- 23, 33, 34, 32, 44, 33, 46, 32, 44, 33, 46, 32, 44, 33, 67, 22, 44, 33, 46, 32, 34,
- 33, 46, 32, 8, 33, 46, 32, 44, 33,
- ],
- // smooth: true,
- showSymbol: false,
- lineStyle: {
- width: 3,
- color: '#EA0706',
- },
- },
- {
- name: 'MA5',
- type: 'line',
- data: [
- 44, 33, 46, 32, 44, 33, 44, 33, 46, 33, 44, 33, 46, 32, 44, 33, 46, 32, 44, 33, 46,
- 32, 44, 33, 46, 32, 44, 33, 46, 32,
- ],
- // smooth: true,
- showSymbol: false,
- lineStyle: {
- width: 3,
- color: '#067607',
- // type: 'dashed',
- },
- },
- {
- name: 'MA5',
- type: 'line',
- data: [
- 46, 66, 44, 22, 46, 56, 44, 33, 46, 32, 44, 33, 65, 32, 44, 22, 46, 32, 44, 33, 33,
- 33, 46, 32, 44, 33, 34, 32, 44, 33,
- ],
- // smooth: true,
- showSymbol: false,
- lineStyle: {
- width: 3,
- color: '#0000FB',
- // type: 'dashed',
- },
- },
- ],
+ color: ['#f00', '#f0f', '#ff0'],
+ // series: [
+ // {
+ // name: 'MA5',
+ // type: 'line',
+ // data: [
+ // 23, 33, 34, 32, 44, 33, 46, 32, 44, 33, 46, 32, 44, 33, 67, 22, 44, 33, 46, 32, 34,
+ // 33, 46, 32, 8, 33, 46, 32, 44, 33,
+ // ],
+ // // smooth: true,
+ // // showSymbol: false,
+ // // lineStyle: {
+ // // width: 3,
+ // // color: '#EA0706',
+ // // },
+ // },
+ // {
+ // name: 'MA4',
+ // type: 'line',
+ // data: [
+ // 44, 33, 46, 32, 44, 33, 44, 33, 46, 33, 44, 33, 46, 32, 44, 33, 46, 32, 44, 33, 46,
+ // 32, 44, 33, 46, 32, 44, 33, 46, 32,
+ // ],
+ // // smooth: true,
+ // // showSymbol: false,
+ // // lineStyle: {
+ // // width: 3,
+ // // color: '#067607',
+ // // // type: 'dashed',
+ // // },
+ // },
+ // {
+ // name: 'MA3',
+ // type: 'line',
+ // data: [
+ // 46, 66, 44, 22, 46, 56, 44, 33, 46, 32, 44, 33, 65, 32, 44, 22, 46, 32, 44, 33, 33,
+ // 33, 46, 32, 44, 33, 34, 32, 44, 33,
+ // ],
+ // // smooth: true,
+ // // showSymbol: false,
+ // // lineStyle: {
+ // // width: 3,
+ // // color: '#0000FB',
+ // // // type: 'dashed',
+ // // },
+ // },
+ // ],
+ series: this.chartData.seriesData
}
- myChart.setOption(option)
+ this.myChart.setOption(option)
},
modelTypeChange(data) {
this.queryParams.model_types = data.join(',')
diff --git a/src/views/chart/pages/Configure.vue b/src/views/chart/pages/Configure.vue
index 75fbb87..f514e2d 100644
--- a/src/views/chart/pages/Configure.vue
+++ b/src/views/chart/pages/Configure.vue
@@ -4,28 +4,42 @@