GY/AttributioClassification
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增功能

Browse Source
This commit is contained in:
pengjunchao 2025-12-05 09:17:34 +08:00
parent 4848f892c5
commit 4f8d0f43cf
10 changed files with 664 additions and 148 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@ -212,7 +212,8 @@
<script type="module" src="/src/main.js"></script>
<script>
window.CONFIG = {
baseUrl: 'http://www.jiatq.com:10009'
baseUrl: 'http://www.jiatq.com:10009',
userBaseUrl: 'http://qc2c966e.natappfree.cc/prod-api',
}
</script>
</body>

3
src/assets/styles/public.scss
View File

@ -45,6 +45,9 @@ body, #app {
}
}
}
.el-table__empty-block {
background-color: #1C2630;
}
.el-table__body {
tr {
color: #a7bacf;

24
src/store/modules/permission.js
View File

@ -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
},
},
]
}
]

10
src/views/chart/layout/SideMenu.vue
View File

@ -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',

242
src/views/chart/pages/Calculation.vue
View File

@ -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(',')

78
src/views/chart/pages/Configure.vue
View File

@ -4,28 +4,42 @@
<div class="list-box">
<div class="filter-wrap">
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<el-form-item label="Activity reference time">
<el-date-picker v-model="queryParams.dateTime1" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
<!--<el-form-item label="Activity reference time">
<el-date-picker v-model="queryParams.acquisition_start_begin" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>
<el-form-item label="Concentration reference time">
<el-date-picker v-model="queryParams.dateTime2" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
<el-date-picker v-model="queryParams.acquisition_start_end" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>-->
<el-form-item label="Create time">
<el-date-picker
v-model="dateRage"
type="daterange"
range-separator="至"
start-placeholder="start"
end-placeholder="end"
value-format="YYYY-MM-DD"
class="dark-date-picker"
popper-class="dark-date-picker"
@change="dateChange"></el-date-picker>
</el-form-item>
<el-form-item label="">
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSearch">Search</el-button>
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSearch">Select</el-button>
<el-button type="primary" icon="document" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSave">Save</el-button>
</el-form-item>
</el-form>
</div>
<el-table :data="tableData" stripe style="width: 100%" class="dark-table">
<el-table-column prop="date" label="NO" width="180"> </el-table-column>
<el-table-column prop="name" label="XE131M_CONC" width="180"> </el-table-column>
<el-table-column prop="name" label="XE131M_MDC"> </el-table-column>
<el-table-column prop="name" label="XE131M_CONC"> </el-table-column>
<el-table-column prop="name" label="XE131M_MDC"> </el-table-column>
<el-table-column prop="name" label="XE131M_CONC"> </el-table-column>
<el-table-column prop="name" label="XE131M_MDC"> </el-table-column>
<el-table-column prop="name" label="XE131M_CONC"> </el-table-column>
<el-table-column prop="address" label="XE131M_MDC"> </el-table-column>
<el-table-column fixed type="index" label="NO" width="80"></el-table-column>
<el-table-column prop="xe131m_conc" label="XE131M_CONC"></el-table-column>
<el-table-column prop="xe131m_mdc" label="XE131M_MDC"></el-table-column>
<el-table-column prop="xe133_conc" label="XE133_CONC"></el-table-column>
<el-table-column prop="xe133_mdc" label="XE133_MDC"></el-table-column>
<el-table-column prop="xe133m_conc" label="XE133M_CONC"></el-table-column>
<el-table-column prop="xe133m_mdc" label="XE133M_MDC"></el-table-column>
<el-table-column prop="xe135_conc" label="XE135M_CONC"></el-table-column>
<el-table-column prop="xe135_mdc" label="XE135M_MDC"></el-table-column>
<el-table-column prop="type" label="TYPE">
<template #default="scope">
<el-input v-model="scope.row.type" class="dark-input"></el-input>
@ -48,35 +62,11 @@ export default {
queryParams: {
page: 1,
size: 10,
acquisition_start_begin: '',
acquisition_start_end: '',
create_time_begin: '',
create_time_end: '',
},
tableData: [
{
date: '2016-05-02',
name: '0.03464',
address: '0.2548',
type: '1111'
},
{
date: '2016-05-04',
name: '0.03464',
address: '0.2548',
type: ''
},
{
date: '2016-05-01',
name: '0.03464',
address: '0.2548',
type: ''
},
{
date: '2016-05-03',
name: '0.03464',
address: '0.2548',
type: ''
},
],
tableData: [],
dateRage: []
}
},
created () {
@ -85,13 +75,17 @@ export default {
methods: {
onSearch () {
this.loading = true
this.$axios.get(window.CONFIG.baseUrl + '/sssssssssssssssssssss', { params: this.queryParams }).then((res) => {
this.$axios.get(window.CONFIG.baseUrl + '/nuclide/query_samples', { params: this.queryParams }).then((res) => {
this.tableData = res.data.items
this.total = res.data.pagination.total_count
}).finally(() => {
this.loading = false
})
},
dateChange(dates) {
this.queryParams.create_time_begin = dates[0]
this.queryParams.create_time_end = dates[1]
},
async onSave() {
const res = await this.$axios.post(window.CONFIG.baseUrl + '/wwwwwwwwwwwwwwwwwwwwwwwwwwww', this.tableData)
debugger

221
src/views/chart/pages/ConfigureChart.vue Normal file
View File

@ -0,0 +1,221 @@
<template>
<div class="list-wrap">
<div class="section-head">Configure</div>
<div class="list-box">
<div class="filter-wrap">
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<!--<el-form-item label="Activity reference time">
<el-date-picker v-model="queryParams.acquisition_start_begin" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>
<el-form-item label="Concentration reference time">
<el-date-picker v-model="queryParams.acquisition_start_end" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>-->
<el-form-item label="Create time">
<el-date-picker
v-model="dateRage"
type="daterange"
range-separator="至"
start-placeholder="start"
end-placeholder="end"
value-format="YYYY-MM-DD"
class="dark-date-picker"
popper-class="dark-date-picker"
@change="dateChange"></el-date-picker>
</el-form-item>
<el-form-item label="">
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSearch">Select</el-button>
</el-form-item>
</el-form>
</div>
<div class="chart-wrap">
<div ref="chartDom" style="width: 100%; height: 100%"></div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
loading: false,
total: 0,
queryParams: {
page: 1,
size: 10,
create_time_begin: '',
create_time_end: '',
},
tableData: [],
dateRage: []
}
},
created () {
this.onSearch()
},
mounted() {
// this.chart()
},
methods: {
onSearch () {
this.loading = true
this.$axios.get(window.CONFIG.baseUrl + '/nuclide/query_samples', { params: this.queryParams }).then((res) => {
this.tableData = res.data.items
this.total = res.data.pagination.total_count
}).finally(() => {
this.loading = false
})
},
dateChange(dates) {
this.queryParams.create_time_begin = dates[0]
this.queryParams.create_time_end = dates[1]
},
chart() {
this.myChart = this.$echarts.init(this.$refs.chartDomx)
const option = {
grid: {
left: 60,
right: 20,
bottom: 30,
},
xAxis: {
axisLine: {
lineStyle: {
color: '#273F4B',
width: 1,
},
},
axisTick: {
lineStyle: {
color: '#152029',
width: 1,
},
},
axisLabel: {
color: '#a2b4c9',
// rotate: 0
},
splitLine: {
lineStyle: {
color: '#152029',
type: 'dashed',
},
},
},
yAxis: {
axisLine: {
show: true,
lineStyle: {
color: '#273F4B',
},
},
axisLabel: {
color: '#a2b4c9',
},
splitLine: {
lineStyle: {
color: '#152029',
type: 'dashed',
},
},
// axisTick: {
// show: true,
// lineStyle: {
// color: '#f00'
// }
// }
},
tooltip: {
trigger: 'axis',
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
// },
// extraCssText: 'width: 170px'
},
color: ['#0A4072', '#683F14', '#0F605A', '#0F5A7A', '#5C5F25'],
series: [
{
symbolSize: 20,
data: [
[10.0, 8.04],
[8.07, 6.95],
[13.0, 7.58],
[9.05, 8.81],
[11.0, 8.33],
[14.0, 7.66],
[13.4, 6.81],
[10.0, 6.33],
[14.0, 8.96],
[12.5, 6.82],
[9.15, 7.2],
[11.5, 7.2],
[3.03, 4.23],
[12.2, 7.83],
[2.02, 4.47],
[1.05, 3.33],
[4.05, 4.96],
[6.03, 7.24],
[12.0, 6.26],
[12.0, 8.84],
[7.08, 5.82],
[5.02, 5.68]
],
type: 'scatter'
}
]
}
this.myChart.setOption(option)
},
},
}
</script>
<style scoped lang="scss">
.list-wrap {
height: 100%;
overflow: hidden;
color: #fff;
display: flex;
flex-direction: column;
.section-head {
height: 32px;
padding: 0 13px;
background-color: #1c2630;
border-left: 4px solid #be8728;
font-family: MICROGRAMMADMEDEXT;
font-size: 20px;
font-weight: bold;
}
.list-box {
flex: 1;
display: flex;
flex-direction: column;
.filter-wrap {
height: 50px;
margin-top: 16px;
::v-deep .el-form-item__label {
font-size: 16px;
color: #a7bacf;
}
}
.chart-wrap {
flex: 1;
}
}
}
</style>

5
src/views/chart/pages/Dataset.vue
View File

@ -11,7 +11,7 @@
<el-date-picker v-model="queryParams.acquisition_start_end" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>
<el-form-item label="">
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSearch">Search</el-button>
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSearch">Select</el-button>
<!--<el-button type="primary" icon="upload" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;">Upload</el-button>-->
<el-upload
ref="upload"
@ -105,8 +105,9 @@ export default {
// 将所有文件添加到 FormData
this.selectedFiles.forEach(file => {
formData.append('files[]', file)
formData.append('files', file)
});
formData.append('create_by', 'system')
// 使用 axios 发送请求
return new Promise((resolve, reject) => {

29
src/views/chart/pages/LoadFromDb.vue
View File

@ -4,12 +4,26 @@
<div class="list-box">
<div class="filter-wrap">
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<el-form-item label="Activity reference time">
<!--<el-form-item label="Activity reference time">
<el-date-picker v-model="queryParams.acquisition_start_begin" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>
<el-form-item label="Concentration reference time">
<el-date-picker v-model="queryParams.acquisition_start_end" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>-->
<el-form-item label="Create time">
<el-date-picker
v-model="dateRage"
type="daterange"
range-separator="至"
start-placeholder="start"
end-placeholder="end"
value-format="YYYY-MM-DD"
class="dark-date-picker"
popper-class="dark-date-picker"
@change="dateChange"></el-date-picker>
</el-form-item>
<el-form-item label="">
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;" @click="onSearch">Select</el-button>
<!--<el-button type="primary" icon="upload" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;">Upload</el-button>-->
@ -49,8 +63,6 @@
</template>
<script>
import {listUser} from "@/api/system/user.js";
export default {
data() {
return {
@ -59,11 +71,12 @@ export default {
queryParams: {
page: 1,
size: 10,
acquisition_start_begin: '',
acquisition_start_end: '',
create_time_begin: '',
create_time_end: '',
},
tableData: [],
fileList: []
fileList: [],
dateRage: []
}
},
created () {
@ -93,6 +106,10 @@ export default {
const file = files[0]
this.$refs.upload.handleStart(file)
},
dateChange(dates) {
this.queryParams.create_time_begin = dates[0]
this.queryParams.create_time_end = dates[1]
},
},
}
</script>

197
src/views/chart/pages/Predict.vue Normal file
View File

@ -0,0 +1,197 @@
<template>
<div class="list-wrap">
<div class="section-head">Predict</div>
<div class="list-box">
<div class="filter-wrap">
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
<!--<el-form-item label="Activity reference time">
<el-date-picker v-model="queryParams.acquisition_start_begin" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>
<el-form-item label="Concentration reference time">
<el-date-picker v-model="queryParams.acquisition_start_end" type="datetime" placeholder="选择日期时间" class="dark-date-picker" popper-class="dark-date-picker"></el-date-picker>
</el-form-item>-->
<el-form-item label="Dataset">
<el-select v-model="queryParams.case_no" placeholder="请选择" class="dark-select" popper-class="dark-select-popper" style="width: 120px">
<el-option
v-for="item in caseOptions"
:key="item.id"
:label="item.id"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="Classify">
<el-select v-model="modelTypes" multiple placeholder="请选择" class="dark-select" popper-class="dark-select-popper" style="width: 520px" @change="modelTypeChange">
<el-option
v-for="item in selectOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-upload
ref="upload"
v-model:file-list="fileList"
class="upload-demo"
:auto-upload="false"
:limit="1"
:multiple="false"
:show-file-list="false"
:on-change="handleChange"
style="height: 32px; margin-left: 12px;">
<el-button type="primary" icon="upload" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0;">Upload</el-button>
</el-upload>
<el-button type="primary" icon="search" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0; margin-left: 12px;" @click="onSearch">Select</el-button>
<el-button type="primary" icon="document" style="background-color: #7393b7; border-color: #7393b7; border-radius: 0; margin-left: 12px;" @click="onDownload">Download</el-button>
</el-form-item>
</el-form>
</div>
<el-table :data="tableData" stripe style="width: 100%" class="dark-table">
<el-table-column fixed type="index" label="NO" width="80"></el-table-column>
<el-table-column prop="xe131m_conc" label="XE131M_CONC"></el-table-column>
<el-table-column prop="xe131m_mdc" label="XE131M_MDC"></el-table-column>
<el-table-column prop="xe133_conc" label="XE133_CONC"></el-table-column>
<el-table-column prop="xe133_mdc" label="XE133_MDC"></el-table-column>
<el-table-column prop="xe133m_conc" label="XE133M_CONC"></el-table-column>
<el-table-column prop="xe133m_mdc" label="XE133M_MDC"></el-table-column>
<el-table-column prop="xe135_conc" label="XE135M_CONC"></el-table-column>
<el-table-column prop="xe135_mdc" label="XE135M_MDC"></el-table-column>
<el-table-column prop="type" label="TYPE">
<template #default="scope">
<el-input v-model="scope.row.type" class="dark-input"></el-input>
</template>
</el-table-column>
</el-table>
<div class="pagination-wrap">
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.page" v-model:limit="queryParams.size" class="dark-pagination" @pagination="onSearch" />
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
loading: false,
total: 0,
queryParams: {
page: 1,
size: 10,
case_no: '',
model_types: '',
file: '',
},
selectOptions: [
{
value: 'CNN',
label: 'CNN',
},
{
value: 'BDT',
label: 'BDT',
},
{
value: 'SVM',
label: 'SVM',
},
{
value: 'MLP',
label: 'MLP',
},
{
value: 'RF',
label: 'RF',
},
],
caseOptions: [],
tableData: [],
fileList: [],
modelTypes: [],
currentFile: null
}
},
created () {
// color: ['#0A4072', '#683F14', '#0F605A', '#0F5A7A', '#5C5F25']
// this.onSearch()
this.getCaseData()
},
methods: {
onSearch () {
this.loading = true
const formData = new FormData()
formData.append("file", this.currentFile)
formData.append("case_no", this.queryParams.case_no)
formData.append("model_types", this.queryParams.model_types)
this.$axios.post(window.CONFIG.baseUrl + '/train-oneday/predict', formData, { headers: { "Content-Type": "multipart/form-data" } }).then((res) => {
this.tableData = res.data.items
this.total = res.data.pagination.total_count
}).finally(() => {
this.loading = false
})
},
getCaseData () {
this.loading = true
this.$axios.get(window.CONFIG.baseUrl + '/train-oneday/query_train_datasets', { params: this.queryParams }).then((res) => {
this.caseOptions = res.data.items
}).finally(() => {
this.loading = false
})
},
// 文件选择变化
handleChange(file, fileList) {
if (file) {
this.currentFile = file.raw || file
} else {
this.currentFile = null
}
},
modelTypeChange(data) {
this.queryParams.model_types = data.join(',')
},
async onDownload() {
const res = await this.$axios.get(window.CONFIG.baseUrl + '/download', { params: { path: '' }}) // 理解：path应该是查询成功后返回的路径
debugger
},
},
}
</script>
<style scoped lang="scss">
.list-wrap {
overflow: hidden;
color: #fff;
.section-head {
height: 32px;
padding: 0 13px;
background-color: #1c2630;
border-left: 4px solid #be8728;
font-family: MICROGRAMMADMEDEXT;
font-size: 20px;
font-weight: bold;
}
.list-box {
.filter-wrap {
margin-top: 16px;
::v-deep .el-form-item__label {
font-size: 16px;
color: #a7bacf;
}
}
.dark-table {
width: 100%;
}
}
.pagination-wrap {
display: flex;
justify-content: flex-end;
margin: 16px 0;
}
}
</style>