|
|
|
|
@ -1,5 +1,5 @@
|
|
|
|
|
<template>
|
|
|
|
|
<el-scrollbar ref="scrollbar" height="800px">
|
|
|
|
|
<!-- <el-scrollbar ref="scrollbar" height="800px"> -->
|
|
|
|
|
<div class="main-top">
|
|
|
|
|
<span style="font-weight: bold; font-size: 18px; color: #3596eb">任务描述</span>
|
|
|
|
|
<p style="font-weight: 400; font-size: 12px; color: #e6e6e6">（给出任务清单参考，做哪些数据的统计分析）Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p>
|
|
|
|
|
@ -15,7 +15,9 @@
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="app-main">
|
|
|
|
|
|
|
|
|
|
<div class="main-left">
|
|
|
|
|
<el-scrollbar height="550px" style="padding: 0 10px" min-size="5">
|
|
|
|
|
<div>
|
|
|
|
|
<div class="left-top">
|
|
|
|
|
<span>一、选择指标</span>
|
|
|
|
|
@ -66,6 +68,7 @@
|
|
|
|
|
<el-button @click="computation">计算</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-scrollbar>
|
|
|
|
|
<div style="margin-top: auto">
|
|
|
|
|
<div class="startOver" @click="startOver()">
|
|
|
|
|
<img src="../../../assets/images/重新开始.png" alt="" />
|
|
|
|
|
@ -73,10 +76,13 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="main-right">
|
|
|
|
|
<el-scrollbar height="500px" ref="scrollbar" style="padding: 20px">
|
|
|
|
|
<div>
|
|
|
|
|
<span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
|
|
|
|
|
<el-table ref="exportTableRef" :data="tableData2" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
|
|
|
|
|
<el-table ref="exportTableRef" :data="tableData2" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
|
|
|
|
|
<el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<!-- <el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" /> -->
|
|
|
|
|
@ -84,7 +90,7 @@
|
|
|
|
|
<div class="analysisResults" style="margin-top: 20px">
|
|
|
|
|
<span style="font-weight: bold; font-size: 18px; color: #3596eb; display: block">分析结果：</span>
|
|
|
|
|
<el-button @click="upLoad" v-if="showChart">下载</el-button>
|
|
|
|
|
<el-table :data="tableData3" row-key="TSuid" style="width: 94%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
|
|
|
|
|
<el-table :data="tableData3" row-key="TSuid" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
|
|
|
|
|
<el-table-column v-for="column in tableLabel" :key="column.prop" :prop="column.prop" :label="column.label" align="center" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<!-- <el-pagination style="margin-top:10px" background layout="prev, pager, next" :total="1000" /> -->
|
|
|
|
|
@ -99,9 +105,10 @@
|
|
|
|
|
<div id="main2" style="width: 500px; height: 500px"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-scrollbar>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-scrollbar>
|
|
|
|
|
<!-- </el-scrollbar> -->
|
|
|
|
|
|
|
|
|
|
<el-dialog v-model="dialogVisible" title="实训任务提交" width="600" custom-class="dialogClass" :show-close="false">
|
|
|
|
|
<template #header="{ close, titleId, titleClass }">
|
|
|
|
|
@ -114,31 +121,31 @@
|
|
|
|
|
<div class="from-item">
|
|
|
|
|
<el-form :inline="true" label-position="right" label-width="115px" :model="form" class="demo-form-inline">
|
|
|
|
|
<el-form-item label="聚类个数：">
|
|
|
|
|
<el-input style="width: 120px" v-model="formInline.user" clearable />
|
|
|
|
|
<el-input style="width: 120px" v-model="formInline2.value1" clearable />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="最大迭代次数：">
|
|
|
|
|
<el-input style="width: 120px" v-model="formInline.user" clearable />
|
|
|
|
|
<el-input style="width: 120px" v-model="formInline2.value2" clearable />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<span style="color: #ffffff; font-weight: 700">各簇类特征描述：</span>
|
|
|
|
|
<el-form :inline="true" label-position="right" style="margin: 15px 0" label-width="115px" :model="form" class="demo-form-inline">
|
|
|
|
|
<el-form-item label="簇类1:">
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline.user" clearable />
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline2.value3" clearable />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="簇类2:">
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline.user" clearable />
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline2.value4" clearable />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="簇类3:">
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline.user" clearable />
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline2.value5" clearable />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="簇类4:">
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline.user" clearable />
|
|
|
|
|
<el-input style="width: 240px" v-model="formInline2.value6" clearable />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
<template #footer>
|
|
|
|
|
<div class="dialog-footer">
|
|
|
|
|
<el-button @click="dialogVisible = false">确定</el-button>
|
|
|
|
|
<el-button @click="task()">确定</el-button>
|
|
|
|
|
<el-button type="primary" @click="dialogVisible = false">返回</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -274,12 +281,24 @@ import * as XLSX from "XLSX";
|
|
|
|
|
import JSZip from "jszip";
|
|
|
|
|
import * as API from "@/api/AI.js";
|
|
|
|
|
import { getUserInfo } from "@/utils/auth";
|
|
|
|
|
import { onMounted } from "vue";
|
|
|
|
|
import { onMounted, reactive } from "vue";
|
|
|
|
|
const runResultShow = ref(false);
|
|
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
|
|
const dialogVisible = ref(false);
|
|
|
|
|
const tableLabel = reactive([{ prop: "date", label: "" }]);
|
|
|
|
|
const isFlag = ref(false);
|
|
|
|
|
const formInline2=reactive({
|
|
|
|
|
value1:'',
|
|
|
|
|
value2:'',
|
|
|
|
|
value3:'',
|
|
|
|
|
value4:'',
|
|
|
|
|
value5:'',
|
|
|
|
|
value6:'',
|
|
|
|
|
})
|
|
|
|
|
const task=()=>{
|
|
|
|
|
dialogVisible.value = false
|
|
|
|
|
proxy.$modal.msgSuccess("提交完成!");
|
|
|
|
|
}
|
|
|
|
|
const algorithmicKnowledge = () => {
|
|
|
|
|
runResultShow.value = true;
|
|
|
|
|
};
|
|
|
|
|
@ -410,66 +429,73 @@ const resTable2=ref()
|
|
|
|
|
}
|
|
|
|
|
tableData2.value=res.data
|
|
|
|
|
flag.value=true
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
const formInline=reactive({
|
|
|
|
|
user:'',
|
|
|
|
|
region:''
|
|
|
|
|
})
|
|
|
|
|
const input=ref()
|
|
|
|
|
const options = ref([])
|
|
|
|
|
const input2=ref()
|
|
|
|
|
const options2=ref([
|
|
|
|
|
proxy.$modal.msgSuccess("计算完成!");
|
|
|
|
|
tableData2.value = res.data;
|
|
|
|
|
flag.value = true;
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
const formInline = reactive({
|
|
|
|
|
user: "",
|
|
|
|
|
region: "",
|
|
|
|
|
});
|
|
|
|
|
const input = ref();
|
|
|
|
|
const options = ref([]);
|
|
|
|
|
const input2 = ref();
|
|
|
|
|
const options2 = ref([
|
|
|
|
|
{
|
|
|
|
|
value:'数据区重',
|
|
|
|
|
label:'数据去重'
|
|
|
|
|
}
|
|
|
|
|
])
|
|
|
|
|
const input3=ref()
|
|
|
|
|
const options3=ref([
|
|
|
|
|
value: "数据区重",
|
|
|
|
|
label: "数据去重",
|
|
|
|
|
},
|
|
|
|
|
]);
|
|
|
|
|
const input3 = ref();
|
|
|
|
|
const options3 = ref([
|
|
|
|
|
{
|
|
|
|
|
value:'缺失值处理--剔除数据',
|
|
|
|
|
label:'缺失值处理--剔除数据'
|
|
|
|
|
},{
|
|
|
|
|
value:'缺失值处理--均值替换',
|
|
|
|
|
label:'缺失值处理--均值替换'
|
|
|
|
|
value: "缺失值处理--剔除数据",
|
|
|
|
|
label: "缺失值处理--剔除数据",
|
|
|
|
|
},
|
|
|
|
|
])
|
|
|
|
|
const input4=ref()
|
|
|
|
|
const options4=ref([
|
|
|
|
|
{
|
|
|
|
|
value:'K-means',
|
|
|
|
|
label:'K-means'
|
|
|
|
|
value: "缺失值处理--均值替换",
|
|
|
|
|
label: "缺失值处理--均值替换",
|
|
|
|
|
},
|
|
|
|
|
])
|
|
|
|
|
const input5=ref()
|
|
|
|
|
const input6=ref()
|
|
|
|
|
const taskSubmit=()=>{
|
|
|
|
|
dialogVisible.value=true
|
|
|
|
|
}
|
|
|
|
|
const tableData = ref([
|
|
|
|
|
|
|
|
|
|
])
|
|
|
|
|
const headerCellStyle=()=>{
|
|
|
|
|
]);
|
|
|
|
|
const input4 = ref();
|
|
|
|
|
const options4 = ref([
|
|
|
|
|
{
|
|
|
|
|
value: "K-means",
|
|
|
|
|
label: "K-means",
|
|
|
|
|
},
|
|
|
|
|
]);
|
|
|
|
|
const input5 = ref();
|
|
|
|
|
const input6 = ref();
|
|
|
|
|
const taskSubmit = () => {
|
|
|
|
|
dialogVisible.value = true;
|
|
|
|
|
};
|
|
|
|
|
const tableData = ref([]);
|
|
|
|
|
const headerCellStyle = () => {
|
|
|
|
|
return {
|
|
|
|
|
backgroundColor: "#1882DE !important", // 设置表头背景颜色
|
|
|
|
|
color: "#ffffff !important",
|
|
|
|
|
};
|
|
|
|
|
};
|
|
|
|
|
const optionData2 = () => {
|
|
|
|
|
if (tableData2.value.length === 0) {
|
|
|
|
|
input2.value = "";
|
|
|
|
|
input3.value = "";
|
|
|
|
|
proxy.$modal.msgWarning("请先选择指标！");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
const optionData2=()=>{
|
|
|
|
|
if(input2.value&&input3.value){
|
|
|
|
|
const sendData=ref({
|
|
|
|
|
mapList:tableData2.value,
|
|
|
|
|
method:input3.value,
|
|
|
|
|
userId:JSON.parse(getUserInfo()).userId
|
|
|
|
|
})
|
|
|
|
|
API.dataPreprocessing(sendData.value).then((res)=>{
|
|
|
|
|
resTable2.value=res.data
|
|
|
|
|
tableData2.value=[]
|
|
|
|
|
tableData2.value=res.data
|
|
|
|
|
if (input2.value && input3.value) {
|
|
|
|
|
const sendData = ref({
|
|
|
|
|
mapList: tableData2.value,
|
|
|
|
|
method: input3.value,
|
|
|
|
|
userId: JSON.parse(getUserInfo()).userId,
|
|
|
|
|
});
|
|
|
|
|
API.dataPreprocessing(sendData.value).then((res) => {
|
|
|
|
|
resTable2.value = res.data;
|
|
|
|
|
tableData2.value = [];
|
|
|
|
|
tableData2.value = res.data;
|
|
|
|
|
proxy.$modal.msgSuccess("预处理成功！");
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const showChart = ref(false);
|
|
|
|
|
@ -643,20 +669,20 @@ const handleExport = async (name) => {
|
|
|
|
|
}
|
|
|
|
|
.app-main {
|
|
|
|
|
// background-color: #f5f5f5;
|
|
|
|
|
min-height: 965px;
|
|
|
|
|
// min-height: 965px;
|
|
|
|
|
margin: 5px 20px 0;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
// overflow: auto;
|
|
|
|
|
.main-left {
|
|
|
|
|
//水平居中
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
min-height: 965px;
|
|
|
|
|
// min-height: 965px;
|
|
|
|
|
display: flex;
|
|
|
|
|
width: 205px;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
background: #041c49;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
// padding: 0px 10px;
|
|
|
|
|
.left-top {
|
|
|
|
|
padding: 10px;
|
|
|
|
|
span {
|
|
|
|
|
@ -682,7 +708,7 @@ const handleExport = async (name) => {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.startOver {
|
|
|
|
|
margin-left: -10px;
|
|
|
|
|
// margin-left: -10px;
|
|
|
|
|
width: 205px;
|
|
|
|
|
height: 55px;
|
|
|
|
|
background: #00f4ff;
|
|
|
|
|
@ -704,7 +730,7 @@ const handleExport = async (name) => {
|
|
|
|
|
.main-right {
|
|
|
|
|
width: 1639px;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
// padding: 20px;
|
|
|
|
|
border: 1px solid #0452c6;
|
|
|
|
|
:deep(.el-table__header) {
|
|
|
|
|
.el-table__cell {
|
|
|
|
|
|
qinzhenpen
2 years ago