|
|
|
@ -0,0 +1,671 @@
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
|
|
|
<el-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>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="main-but">
|
|
|
|
|
|
|
|
<el-upload
|
|
|
|
|
|
|
|
ref="uploadRef"
|
|
|
|
|
|
|
|
class="upload-demo"
|
|
|
|
|
|
|
|
:file-list="fileList"
|
|
|
|
|
|
|
|
:auto-upload="false"
|
|
|
|
|
|
|
|
:on-change="handleChange"
|
|
|
|
|
|
|
|
:show-file-list="false"
|
|
|
|
|
|
|
|
multiple="multiple"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<template #trigger>
|
|
|
|
|
|
|
|
<el-button><img src="../../../assets/images/导入.png" alt="">算法知识导入</el-button>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<!-- <div class="reportPromptFile" v-html="item[`${index}`].path"></div> -->
|
|
|
|
|
|
|
|
</el-upload>
|
|
|
|
|
|
|
|
<el-button @click="taskSubmit"><img src="../../../assets/images/提交.png" alt="">实训任务提交</el-button>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="app-main">
|
|
|
|
|
|
|
|
<div class="main-left">
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
<div class="left-top">
|
|
|
|
|
|
|
|
<span>一、选择指标</span>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="metrics">
|
|
|
|
|
|
|
|
<el-select v-model="input" placeholder="请选择" style="width: 180px" @change="optionData">
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="item in options"
|
|
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="metrics-table" style="margin-top: 10px">
|
|
|
|
|
|
|
|
<el-table border :data="tableData" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange" >
|
|
|
|
|
|
|
|
<el-table-column type="selection" label="Date" align="center" :selectable="flag"/>
|
|
|
|
|
|
|
|
<el-table-column prop="text" label="指标" align="center"/>
|
|
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
<el-button @click="taskZB">确定</el-button>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="left-top">
|
|
|
|
|
|
|
|
<span>二、数据预处理</span>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="metrics">
|
|
|
|
|
|
|
|
<el-select v-model="input2" @change="optionData2" placeholder="请选择" style="width: 180px">
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="item in options2"
|
|
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="metrics" style="margin-top:15px">
|
|
|
|
|
|
|
|
<el-select v-model="input3" @change="optionData2" placeholder="请选择" style="width: 180px">
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="item in options3"
|
|
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="left-top" style="margin-top: 10px">
|
|
|
|
|
|
|
|
<span>三、模型参数设置</span>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="metrics-table" style="margin-top: 10px">
|
|
|
|
|
|
|
|
<span style="font-weight: 400;font-size: 12px;color: #FFFFFF;">
|
|
|
|
|
|
|
|
聚类方法：
|
|
|
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
<div class="metrics" style="margin-top:10px">
|
|
|
|
|
|
|
|
<el-select v-model="input4" placeholder="请选择" style="width: 180px">
|
|
|
|
|
|
|
|
<el-option
|
|
|
|
|
|
|
|
v-for="item in options4"
|
|
|
|
|
|
|
|
:key="item.value"
|
|
|
|
|
|
|
|
:label="item.label"
|
|
|
|
|
|
|
|
:value="item.value"
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="margin-top:10px">
|
|
|
|
|
|
|
|
<span style="font-weight: 400;font-size: 12px;color: #FFFFFF;">
|
|
|
|
|
|
|
|
设置簇数K值：
|
|
|
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
<el-input v-model="input5" style="width: 180px;margin-top:5px"/>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="margin-top:10px">
|
|
|
|
|
|
|
|
<span style="font-weight: 400;font-size: 12px;color: #FFFFFF;">
|
|
|
|
|
|
|
|
最大迭代次数：
|
|
|
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
<el-input v-model="input6" style="width: 180px;margin-top:5px"/>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<el-button @click="computation">计算</el-button>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="margin-top: auto;">
|
|
|
|
|
|
|
|
<div class="startOver">
|
|
|
|
|
|
|
|
<img src="../../../assets/images/重新开始.png" alt="">
|
|
|
|
|
|
|
|
<span>重新开始</span>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="main-right">
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
<span style="font-weight: bold;font-size: 18px;color: #3596EB;">分析数据：</span>
|
|
|
|
|
|
|
|
<el-table :data="tableData2" style="width: 94%;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" />
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="analysisResults" style="margin-top: 20px">
|
|
|
|
|
|
|
|
<span style="font-weight: bold;font-size: 18px;color: #3596EB;display: block;">分析结果：</span>
|
|
|
|
|
|
|
|
<el-button>下载</el-button>
|
|
|
|
|
|
|
|
<el-table :data="tableData" style="width: 94%;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" />
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div style="margin-top:20px;gap:25px;display: flex;">
|
|
|
|
|
|
|
|
<!-- <img src="../../../assets/images/图1.png" alt=""> -->
|
|
|
|
|
|
|
|
<div style="background:#FFFFFF;">
|
|
|
|
|
|
|
|
<div id="main" style="width: 500px;height: 500px;"></div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div style="background:#FFFFFF;">
|
|
|
|
|
|
|
|
<div id="main" style="width: 500px;height: 500px;"></div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</el-scrollbar>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
|
|
|
v-model="dialogVisible"
|
|
|
|
|
|
|
|
title="实训任务提交"
|
|
|
|
|
|
|
|
width="600"
|
|
|
|
|
|
|
|
custom-class="dialogClass"
|
|
|
|
|
|
|
|
:show-close="false"
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<template #header="{ close, titleId, titleClass }">
|
|
|
|
|
|
|
|
<div class="my-header">
|
|
|
|
|
|
|
|
<span :id="titleId" :class="titleClass">实训任务提交</span>
|
|
|
|
|
|
|
|
<img class="gbImg" src="../../../assets/images/关闭.png" @click="close" alt="">
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<img class="xtImg" src="../../../assets/images/线条.png" alt="">
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<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-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="最大迭代次数：">
|
|
|
|
|
|
|
|
<el-input style="width: 120px;" v-model="formInline.user" 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-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="簇类2:">
|
|
|
|
|
|
|
|
<el-input style="width: 240px;" v-model="formInline.user" clearable />
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="簇类3:">
|
|
|
|
|
|
|
|
<el-input style="width: 240px;" v-model="formInline.user" clearable />
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
<el-form-item label="簇类4:">
|
|
|
|
|
|
|
|
<el-input style="width: 240px;" v-model="formInline.user" clearable />
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<template #footer>
|
|
|
|
|
|
|
|
<div class="dialog-footer">
|
|
|
|
|
|
|
|
<el-button @click="dialogVisible = false">确定</el-button>
|
|
|
|
|
|
|
|
<el-button type="primary" @click="dialogVisible = false">
|
|
|
|
|
|
|
|
返回
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
|
|
|
import * as echarts from 'echarts';
|
|
|
|
|
|
|
|
import ecStat from 'echarts-stat';
|
|
|
|
|
|
|
|
import * as API from '@/api/AI.js'
|
|
|
|
|
|
|
|
import { getUserInfo } from "@/utils/auth";
|
|
|
|
|
|
|
|
import { onMounted } from 'vue';
|
|
|
|
|
|
|
|
const { proxy } = getCurrentInstance()
|
|
|
|
|
|
|
|
const dialogVisible=ref(false)
|
|
|
|
|
|
|
|
const tableLabel=reactive([
|
|
|
|
|
|
|
|
{prop:'date',label:''},
|
|
|
|
|
|
|
|
])
|
|
|
|
|
|
|
|
const getList=()=>{
|
|
|
|
|
|
|
|
API.selectionMetrics({userId:JSON.parse(getUserInfo()).userId}).then((res)=>{
|
|
|
|
|
|
|
|
res.data.forEach(element => {
|
|
|
|
|
|
|
|
options.value.push({
|
|
|
|
|
|
|
|
value:element,
|
|
|
|
|
|
|
|
label:element
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const fileList=ref([])
|
|
|
|
|
|
|
|
const handleChange=(info)=>{
|
|
|
|
|
|
|
|
fileList.value.push(info);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const flag=ref(false)
|
|
|
|
|
|
|
|
onMounted(()=>{
|
|
|
|
|
|
|
|
getList()
|
|
|
|
|
|
|
|
var chartDom = document.getElementById('main');
|
|
|
|
|
|
|
|
var myChart = echarts.init(chartDom);
|
|
|
|
|
|
|
|
var option;
|
|
|
|
|
|
|
|
echarts.registerTransform(ecStat.transform.clustering);
|
|
|
|
|
|
|
|
const data = [
|
|
|
|
|
|
|
|
[3.275154, 2.957587],
|
|
|
|
|
|
|
|
[-3.344465, 2.603513],
|
|
|
|
|
|
|
|
[0.355083, -3.376585],
|
|
|
|
|
|
|
|
[1.852435, 3.547351],
|
|
|
|
|
|
|
|
[-2.078973, 2.552013],
|
|
|
|
|
|
|
|
[-0.993756, -0.884433],
|
|
|
|
|
|
|
|
[2.682252, 4.007573],
|
|
|
|
|
|
|
|
[-3.087776, 2.878713],
|
|
|
|
|
|
|
|
[-1.565978, -1.256985],
|
|
|
|
|
|
|
|
[2.441611, 0.444826],
|
|
|
|
|
|
|
|
[-0.659487, 3.111284],
|
|
|
|
|
|
|
|
[-0.459601, -2.618005],
|
|
|
|
|
|
|
|
[2.17768, 2.387793],
|
|
|
|
|
|
|
|
[-2.920969, 2.917485],
|
|
|
|
|
|
|
|
[-0.028814, -4.168078],
|
|
|
|
|
|
|
|
[3.625746, 2.119041],
|
|
|
|
|
|
|
|
[-3.912363, 1.325108],
|
|
|
|
|
|
|
|
[-0.551694, -2.814223],
|
|
|
|
|
|
|
|
[2.855808, 3.483301],
|
|
|
|
|
|
|
|
[-3.594448, 2.856651],
|
|
|
|
|
|
|
|
[0.421993, -2.372646],
|
|
|
|
|
|
|
|
[1.650821, 3.407572],
|
|
|
|
|
|
|
|
[-2.082902, 3.384412],
|
|
|
|
|
|
|
|
[-0.718809, -2.492514],
|
|
|
|
|
|
|
|
[4.513623, 3.841029],
|
|
|
|
|
|
|
|
[-4.822011, 4.607049],
|
|
|
|
|
|
|
|
[-0.656297, -1.449872],
|
|
|
|
|
|
|
|
[1.919901, 4.439368],
|
|
|
|
|
|
|
|
[-3.287749, 3.918836],
|
|
|
|
|
|
|
|
[-1.576936, -2.977622],
|
|
|
|
|
|
|
|
[3.598143, 1.97597],
|
|
|
|
|
|
|
|
[-3.977329, 4.900932],
|
|
|
|
|
|
|
|
[-1.79108, -2.184517],
|
|
|
|
|
|
|
|
[3.914654, 3.559303],
|
|
|
|
|
|
|
|
[-1.910108, 4.166946],
|
|
|
|
|
|
|
|
[-1.226597, -3.317889],
|
|
|
|
|
|
|
|
[1.148946, 3.345138],
|
|
|
|
|
|
|
|
[-2.113864, 3.548172],
|
|
|
|
|
|
|
|
[0.845762, -3.589788],
|
|
|
|
|
|
|
|
[2.629062, 3.535831],
|
|
|
|
|
|
|
|
[-1.640717, 2.990517],
|
|
|
|
|
|
|
|
[-1.881012, -2.485405],
|
|
|
|
|
|
|
|
[4.606999, 3.510312],
|
|
|
|
|
|
|
|
[-4.366462, 4.023316],
|
|
|
|
|
|
|
|
[0.765015, -3.00127],
|
|
|
|
|
|
|
|
[3.121904, 2.173988],
|
|
|
|
|
|
|
|
[-4.025139, 4.65231],
|
|
|
|
|
|
|
|
[-0.559558, -3.840539],
|
|
|
|
|
|
|
|
[4.376754, 4.863579],
|
|
|
|
|
|
|
|
[-1.874308, 4.032237],
|
|
|
|
|
|
|
|
[-0.089337, -3.026809],
|
|
|
|
|
|
|
|
[3.997787, 2.518662],
|
|
|
|
|
|
|
|
[-3.082978, 2.884822],
|
|
|
|
|
|
|
|
[0.845235, -3.454465],
|
|
|
|
|
|
|
|
[1.327224, 3.358778],
|
|
|
|
|
|
|
|
[-2.889949, 3.596178],
|
|
|
|
|
|
|
|
[-0.966018, -2.839827],
|
|
|
|
|
|
|
|
[2.960769, 3.079555],
|
|
|
|
|
|
|
|
[-3.275518, 1.577068],
|
|
|
|
|
|
|
|
[0.639276, -3.41284]
|
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
const redPoints = [
|
|
|
|
|
|
|
|
[4, 3], // 红色点1的坐标
|
|
|
|
|
|
|
|
[-4, -4], // 红色点2的坐标
|
|
|
|
|
|
|
|
[2, -2] // 红色点3的坐标
|
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
var CLUSTER_COUNT = 6;
|
|
|
|
|
|
|
|
var DIENSIION_CLUSTER_INDEX = 2;
|
|
|
|
|
|
|
|
var COLOR_ALL = [
|
|
|
|
|
|
|
|
'#37A2DA',
|
|
|
|
|
|
|
|
'#e06343',
|
|
|
|
|
|
|
|
'#37a354',
|
|
|
|
|
|
|
|
'#b55dba',
|
|
|
|
|
|
|
|
'#b5bd48',
|
|
|
|
|
|
|
|
'#8378EA',
|
|
|
|
|
|
|
|
'#96BFFF'
|
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
var pieces = [];
|
|
|
|
|
|
|
|
for (var i = 0; i < CLUSTER_COUNT; i++) {
|
|
|
|
|
|
|
|
pieces.push({
|
|
|
|
|
|
|
|
value: i,
|
|
|
|
|
|
|
|
label: 'cluster ' + i,
|
|
|
|
|
|
|
|
color: COLOR_ALL[i]
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
option = {
|
|
|
|
|
|
|
|
dataset: [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
source: data
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
transform: {
|
|
|
|
|
|
|
|
type: 'ecStat:clustering',
|
|
|
|
|
|
|
|
// print: true,
|
|
|
|
|
|
|
|
config: {
|
|
|
|
|
|
|
|
clusterCount: CLUSTER_COUNT,
|
|
|
|
|
|
|
|
outputType: 'single',
|
|
|
|
|
|
|
|
outputClusterIndexDimension: DIENSIION_CLUSTER_INDEX
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
],
|
|
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
|
|
position: 'top'
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
visualMap: {
|
|
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
|
|
type: 'piecewise',
|
|
|
|
|
|
|
|
// top: 'middle',
|
|
|
|
|
|
|
|
min: 0,
|
|
|
|
|
|
|
|
max: CLUSTER_COUNT,
|
|
|
|
|
|
|
|
left: 10,
|
|
|
|
|
|
|
|
splitNumber: CLUSTER_COUNT,
|
|
|
|
|
|
|
|
dimension: DIENSIION_CLUSTER_INDEX,
|
|
|
|
|
|
|
|
pieces: pieces
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
|
|
left: 120
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
xAxis: {},
|
|
|
|
|
|
|
|
yAxis: {},
|
|
|
|
|
|
|
|
series: [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
type: 'scatter',
|
|
|
|
|
|
|
|
encode: { tooltip: [0, 1] },
|
|
|
|
|
|
|
|
symbolSize: 15,
|
|
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
|
|
borderColor: '#555'
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
datasetIndex: 1
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
type: 'scatter',
|
|
|
|
|
|
|
|
data: redPoints,
|
|
|
|
|
|
|
|
symbolSize: 15,
|
|
|
|
|
|
|
|
symbol: 'circle',
|
|
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
|
|
color: 'red', // 填充颜色
|
|
|
|
|
|
|
|
borderColor: 'red', // 边框颜色
|
|
|
|
|
|
|
|
opacity: 1 // 设置为不透明
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
|
|
formatter: function (params) {
|
|
|
|
|
|
|
|
return params.value[0] + ' ' + params.value[1]; // 显示 X 和 Y 轴的值
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
]
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
option && myChart.setOption(option);
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
const optionData=()=>{
|
|
|
|
|
|
|
|
API.viewingMetrics({userId:JSON.parse(getUserInfo()).userId,tableName:input.value}).then((res)=>{
|
|
|
|
|
|
|
|
tableData.value=[]
|
|
|
|
|
|
|
|
res.data.forEach(element => {
|
|
|
|
|
|
|
|
tableData.value.push({
|
|
|
|
|
|
|
|
text:element
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const selectedRows = ref([]);
|
|
|
|
|
|
|
|
const handleSelectionChange = (selection) => {
|
|
|
|
|
|
|
|
selectedRows.value = selection;
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
const tableData2=ref([])
|
|
|
|
|
|
|
|
const resTable2=ref()
|
|
|
|
|
|
|
|
const taskZB=()=>{
|
|
|
|
|
|
|
|
flag.value=true
|
|
|
|
|
|
|
|
if(!selectedRows.value){
|
|
|
|
|
|
|
|
return
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const sendData={
|
|
|
|
|
|
|
|
tableName:input.value,
|
|
|
|
|
|
|
|
userId:JSON.parse(getUserInfo()).userId,
|
|
|
|
|
|
|
|
fieldList:selectedRows.value.map(item=>item.text)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
API.analysisDataDisplay(sendData).then((res)=>{
|
|
|
|
|
|
|
|
tableLabel.length=0
|
|
|
|
|
|
|
|
for (const key in res.data[0]) {
|
|
|
|
|
|
|
|
tableLabel.push({
|
|
|
|
|
|
|
|
label:key,
|
|
|
|
|
|
|
|
prop:key
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
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:'缺失值处理--剔除数据'
|
|
|
|
|
|
|
|
},{
|
|
|
|
|
|
|
|
value:'缺失值处理--均值替换',
|
|
|
|
|
|
|
|
label:'缺失值处理--均值替换'
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
])
|
|
|
|
|
|
|
|
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(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 computation=()=>{
|
|
|
|
|
|
|
|
if(input5.value&&input6.value&&input4.value){
|
|
|
|
|
|
|
|
const sendData={
|
|
|
|
|
|
|
|
k:input5.value,
|
|
|
|
|
|
|
|
t:input6.value,
|
|
|
|
|
|
|
|
userId:JSON.parse(getUserInfo()).userId,
|
|
|
|
|
|
|
|
deduplicatedDataList:resTable2.value
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
API.clusterAnalysis(sendData).then((res)=>{
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
|
|
|
.main-top {
|
|
|
|
|
|
|
|
margin: 20px 20px 0;
|
|
|
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
|
|
|
height: 85px;
|
|
|
|
|
|
|
|
background: #001d40;
|
|
|
|
|
|
|
|
border: 1px solid #0452c6;
|
|
|
|
|
|
|
|
padding: 5px 20px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.main-but{
|
|
|
|
|
|
|
|
margin: 5px 20px 0;
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
.el-button:nth-child(1) {
|
|
|
|
|
|
|
|
width: 180px;
|
|
|
|
|
|
|
|
height: 56px;
|
|
|
|
|
|
|
|
background: url('../../../assets/images/011.png');
|
|
|
|
|
|
|
|
color:#FFFFFF;
|
|
|
|
|
|
|
|
border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-button:nth-child(2) {
|
|
|
|
|
|
|
|
width: 180px;
|
|
|
|
|
|
|
|
height: 56px;
|
|
|
|
|
|
|
|
background: url('../../../assets/images/022.png');
|
|
|
|
|
|
|
|
color:#FFFFFF;
|
|
|
|
|
|
|
|
border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.app-main {
|
|
|
|
|
|
|
|
// background-color: #f5f5f5;
|
|
|
|
|
|
|
|
min-height: 965px;
|
|
|
|
|
|
|
|
margin: 5px 20px 0;
|
|
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
overflow: auto;
|
|
|
|
|
|
|
|
.main-left {
|
|
|
|
|
|
|
|
//水平居中
|
|
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
|
|
min-height: 965px;
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
width: 205px;
|
|
|
|
|
|
|
|
// height: 100%;
|
|
|
|
|
|
|
|
background: #041c49;
|
|
|
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
|
|
|
.left-top {
|
|
|
|
|
|
|
|
padding: 10px;
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
|
|
|
color: #3596eb;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.metrics-table{
|
|
|
|
|
|
|
|
.el-button {
|
|
|
|
|
|
|
|
width: 149px;
|
|
|
|
|
|
|
|
height: 48px;
|
|
|
|
|
|
|
|
background: url('../../../assets/images/确定.png');
|
|
|
|
|
|
|
|
color:#FFFFFF;
|
|
|
|
|
|
|
|
border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
margin: 15px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.el-input{
|
|
|
|
|
|
|
|
--el-input-text-color:#FFFFFF;
|
|
|
|
|
|
|
|
--el-input-bg-color:#002651;
|
|
|
|
|
|
|
|
--el-input-border-color:#67B3D6;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.startOver{
|
|
|
|
|
|
|
|
margin-left: -10px;
|
|
|
|
|
|
|
|
width: 205px;
|
|
|
|
|
|
|
|
height: 55px;
|
|
|
|
|
|
|
|
background: #00F4FF;
|
|
|
|
|
|
|
|
//水平居中
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
:deep(.el-table) {
|
|
|
|
|
|
|
|
--el-table-row-hover-bg-color:#002651 !important;
|
|
|
|
|
|
|
|
--el-table-border-color: #7AC1FF;
|
|
|
|
|
|
|
|
.el-table__row{
|
|
|
|
|
|
|
|
background-color: #002652 !important;
|
|
|
|
|
|
|
|
color: #E6E6E6;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.main-right {
|
|
|
|
|
|
|
|
width: 1639px;
|
|
|
|
|
|
|
|
// height: 100%;
|
|
|
|
|
|
|
|
padding: 20px;
|
|
|
|
|
|
|
|
border: 1px solid #0452c6;
|
|
|
|
|
|
|
|
:deep(.el-table__header){
|
|
|
|
|
|
|
|
.el-table__cell{
|
|
|
|
|
|
|
|
background:linear-gradient(0deg, #5304BE 0%, #9126FE 100%) !important;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
:deep(.el-table) {
|
|
|
|
|
|
|
|
--el-table-row-hover-bg-color:#002651 !important;
|
|
|
|
|
|
|
|
--el-table-border-color: #002651;
|
|
|
|
|
|
|
|
--el-table-bg-color:#FFFFFF00;
|
|
|
|
|
|
|
|
.el-table__row{
|
|
|
|
|
|
|
|
background-color: #002652 !important;
|
|
|
|
|
|
|
|
color: #E6E6E6;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.metrics{
|
|
|
|
|
|
|
|
:deep(.el-input){
|
|
|
|
|
|
|
|
.el-input__wrapper{
|
|
|
|
|
|
|
|
background-color:#FFFFFF00;
|
|
|
|
|
|
|
|
background-image:url('../../../assets/images/下拉框.png');
|
|
|
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
--el-input-text-color:#FFFFFF;
|
|
|
|
|
|
|
|
--el-input-border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
--el-input-hover-border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
--el-input-hover-border:#FFFFFF00;
|
|
|
|
|
|
|
|
--el-select-border-color-hover:#FFFFFF00;
|
|
|
|
|
|
|
|
--el-select-input-focus-border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
--el-input-placeholder-color:#FFFFFF;
|
|
|
|
|
|
|
|
.el-input__inner{
|
|
|
|
|
|
|
|
color:#FFFFFF;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.analysisResults{
|
|
|
|
|
|
|
|
.el-button {
|
|
|
|
|
|
|
|
width: 89px;
|
|
|
|
|
|
|
|
height: 31px;
|
|
|
|
|
|
|
|
background: url('../../../assets/images/下载.png');
|
|
|
|
|
|
|
|
color:black;
|
|
|
|
|
|
|
|
border-color:#FFFFFF00;
|
|
|
|
|
|
|
|
// background-size: 100% 100%;
|
|
|
|
|
|
|
|
margin: 15px 0px 5px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
:deep(.el-form-item__label){
|
|
|
|
|
|
|
|
color: #FFFFFF;;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.from-item{
|
|
|
|
|
|
|
|
padding: 20px;
|
|
|
|
|
|
|
|
.el-input{
|
|
|
|
|
|
|
|
--el-input-text-color:#FFFFFF;
|
|
|
|
|
|
|
|
--el-input-bg-color:#002651;
|
|
|
|
|
|
|
|
--el-input-border-color:#67B3D6;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.dialog-footer{
|
|
|
|
|
|
|
|
margin-bottom: 20px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
|
|
|
|
.el-dialog{
|
|
|
|
|
|
|
|
background:url('../../../assets/images/弹框.png') !important;
|
|
|
|
|
|
|
|
background-size: 100% 100% !important;
|
|
|
|
|
|
|
|
.el-dialog__header{
|
|
|
|
|
|
|
|
padding: 5px 0px;
|
|
|
|
|
|
|
|
margin-right: 5px !important;
|
|
|
|
|
|
|
|
.gbImg{
|
|
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
width: 51px;
|
|
|
|
|
|
|
|
height: 31px;
|
|
|
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.xtImg{
|
|
|
|
|
|
|
|
margin-left: 18px;
|
|
|
|
|
|
|
|
width: 530px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.my-header {
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
flex-direction: row;
|
|
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
gap: 16px;
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
span{
|
|
|
|
|
|
|
|
color: #FFFFFF;
|
|
|
|
|
|
|
|
padding: 38px 20px 0;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
HeHaonan
2 years ago
