|
|
|
|
@ -1,89 +1,88 @@
|
|
|
|
|
<template>
|
|
|
|
|
<el-scrollbar height="800px" v-loading="loading">
|
|
|
|
|
<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">
|
|
|
|
|
<input type="file" ref="fileknowledge" style="display: none" @change="knowledgeImport" />
|
|
|
|
|
<el-button @click="$refs.fileknowledge.click()">
|
|
|
|
|
<img src="../../../assets/images/导入.png" alt="" />
|
|
|
|
|
算法知识导入
|
|
|
|
|
</el-button>
|
|
|
|
|
<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="selectType">
|
|
|
|
|
<el-option v-for="item in algorithmStore.userDataLabel" :key="item" :label="item" :value="item" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics-table" style="margin-top: 10px">
|
|
|
|
|
<el-table border ref="multipleTableRef" :data="algorithmStore.indexLibrary" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
|
|
|
|
|
<el-table-column type="selection" prop="date" label="Date" align="center" />
|
|
|
|
|
<el-table-column label="指标" align="center" prop="label" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<el-button @click="submit">确定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="left-top">
|
|
|
|
|
<span>二、数据预处理</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics">
|
|
|
|
|
<el-select v-model="preProcessText.text1" placeholder="请选择数据" style="width: 180px">
|
|
|
|
|
<el-option label="数据去重" value="数据去重" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics" style="margin-top: 15px">
|
|
|
|
|
<el-select v-model="preProcessText.text2" placeholder="请选择数据" style="width: 180px" @change="preProcess">
|
|
|
|
|
<el-option label="缺失值处理-剔除数据" value="缺失值处理-剔除数据" />
|
|
|
|
|
<el-option label="缺失值处理一均值替代" value="缺失值处理一均值替代" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="left-top" style="margin-top: 10px">
|
|
|
|
|
<span>三、模型参数设置</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics-table" style="margin-top: 10px">
|
|
|
|
|
<el-table border ref="multipleTableRef" :data="modelParams" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handlemodelSelectionChange">
|
|
|
|
|
<el-table-column type="selection" prop="date" label="Date" align="center" />
|
|
|
|
|
<el-table-column prop="name" label="统计量" align="center" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<el-button @click="modelCalculation">计算</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <el-scrollbar height="800px" v-loading="loading"> -->
|
|
|
|
|
<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-button @click="knowledgeImport">
|
|
|
|
|
<img src="../../../assets/images/导入.png" alt="" />
|
|
|
|
|
算法知识导入
|
|
|
|
|
</el-button>
|
|
|
|
|
<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 style="margin-top: auto">
|
|
|
|
|
<div class="startOver" @click="restart">
|
|
|
|
|
<img src="../../../assets/images/重新开始.png" alt="" />
|
|
|
|
|
<span>重新开始</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics">
|
|
|
|
|
<el-select v-model="n_dataTableQuery.tableName" placeholder="请选择数据" style="width: 180px" @change="selectType">
|
|
|
|
|
<el-option v-for="item in algorithmStore.userDataLabel" :key="item" :label="item" :value="item" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="main-right">
|
|
|
|
|
<div>
|
|
|
|
|
<span style="font-weight: bold; font-size: 18px; color: #3596eb">分析数据：</span>
|
|
|
|
|
<el-table :data="analysisData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle">
|
|
|
|
|
<el-table-column v-for="column in analysisHanderKry" :key="column" :prop="column" :label="column" align="center" />
|
|
|
|
|
<div class="metrics-table" style="margin-top: 10px">
|
|
|
|
|
<el-table border ref="multipleTableRef" :data="algorithmStore.indexLibrary" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handleSelectionChange">
|
|
|
|
|
<el-table-column type="selection" prop="date" label="Date" align="center" />
|
|
|
|
|
<el-table-column label="指标" align="center" prop="label" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<!-- <pagination v-show="datatotal > 0" :total="datatotal" v-model:page="dataqueryParams.index" v-model:limit="dataqueryParams.size" @pagination="submit" style="margin-top: 10px" /> -->
|
|
|
|
|
<el-button @click="submit">确定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="left-top">
|
|
|
|
|
<span>二、数据预处理</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics">
|
|
|
|
|
<el-select v-model="preProcessText.text1" placeholder="请选择数据" style="width: 180px">
|
|
|
|
|
<el-option label="数据去重" value="数据去重" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</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: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
|
|
|
|
|
<el-table-column v-for="column in tableLabel" :key="column.label" :prop="column.prop" :label="column.label" align="center"></el-table-column>
|
|
|
|
|
<div class="metrics" style="margin-top: 15px">
|
|
|
|
|
<el-select v-model="preProcessText.text2" placeholder="请选择数据" style="width: 180px" @change="preProcess">
|
|
|
|
|
<el-option label="缺失值处理-剔除数据" value="缺失值处理-剔除数据" />
|
|
|
|
|
<el-option label="缺失值处理一均值替代" value="缺失值处理一均值替代" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="left-top" style="margin-top: 10px">
|
|
|
|
|
<span>三、模型参数设置</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="metrics-table" style="margin-top: 10px">
|
|
|
|
|
<el-table border ref="multipleTableRef" :data="modelParams" style="width: 100%" :header-cell-style="headerCellStyle" @selection-change="handlemodelSelectionChange">
|
|
|
|
|
<el-table-column type="selection" prop="date" label="Date" align="center" />
|
|
|
|
|
<el-table-column prop="name" label="统计量" align="center" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<el-pagination style="margin-top: 10px" background layout="prev, pager, next" :total="1000" />
|
|
|
|
|
<el-button @click="modelCalculation">计算</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="margin-top: auto">
|
|
|
|
|
<div class="startOver" @click="restart">
|
|
|
|
|
<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="analysisData" style="width: 100%; margin-top: 10px" :header-cell-style="headerCellStyle">
|
|
|
|
|
<el-table-column v-for="column in analysisHanderKry" :key="column" :prop="column" :label="column" align="center" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<pagination v-show="n_analyzeTheNumberOfDataItems > 0" :total="n_analyzeTheNumberOfDataItems" v-model:page="n_dataTableQuery.index" v-model:limit="n_dataTableQuery.size" @pagination="analyzeDataNext" />
|
|
|
|
|
</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: 100%; margin-top: 10px" :header-cell-style="headerCellStyle" height="350">
|
|
|
|
|
<el-table-column v-for="column in tableLabel" :key="column.label" :prop="column.prop" :label="column.label" align="center"></el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
<pagination v-show="nNumberOfAnalysisResults > 0" :total="nNumberOfAnalysisResults" v-model:page="gAnalysisResults.index" v-model:limit="gAnalysisResults.size" @pagination="updatePageAnalysisResults" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-scrollbar>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- </el-scrollbar> -->
|
|
|
|
|
<el-dialog v-model="dialogVisible" title="实训任务提交" width="565" custom-class="dialogClass" :show-close="false">
|
|
|
|
|
<template #header="{ close, titleId, titleClass }">
|
|
|
|
|
<div class="my-header">
|
|
|
|
|
@ -139,11 +138,29 @@
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<el-dialog v-model="b_introductionOfAlgorithmKnowledge" title="算法知识导入" width="60%" :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">
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<template #footer>
|
|
|
|
|
<div class="dialog-footer">
|
|
|
|
|
<el-button @click="submitTask">确定</el-button>
|
|
|
|
|
<el-button type="primary" @click="dialogVisible = false">返回</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</template>
|
|
|
|
|
<script setup>
|
|
|
|
|
import * as portraitModel from "@/api/portraitModel";
|
|
|
|
|
|
|
|
|
|
import {paginate} from '@/utils/index.js'
|
|
|
|
|
import * as API from "@/api/AI.js";
|
|
|
|
|
import * as marketingAlgorithmApi from "@/api/marketing-algorithm.js";
|
|
|
|
|
import useAlgorithmStore from "@/store/modules/algorithm.js";
|
|
|
|
|
@ -154,14 +171,18 @@ const loading = ref(false);
|
|
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
|
|
const userStore = useUserStore();
|
|
|
|
|
const algorithmStore = useAlgorithmStore();
|
|
|
|
|
const multipleTableRef=ref(null)
|
|
|
|
|
const fileknowledge = ref(null);
|
|
|
|
|
const multipleTableRef = ref(null);
|
|
|
|
|
const b_introductionOfAlgorithmKnowledge = ref(false);
|
|
|
|
|
const n_dataTableQuery = ref({
|
|
|
|
|
index: 1,
|
|
|
|
|
size: 20,
|
|
|
|
|
size: 5,
|
|
|
|
|
tableName: "用户属性表",
|
|
|
|
|
userId: userInfo.userId,
|
|
|
|
|
});
|
|
|
|
|
const gAnalysisResults=ref({
|
|
|
|
|
index: 1,
|
|
|
|
|
size: 5,
|
|
|
|
|
})
|
|
|
|
|
const dialogVisible = ref(false);
|
|
|
|
|
// 模型参数
|
|
|
|
|
const modelParams = reactive([
|
|
|
|
|
@ -238,6 +259,13 @@ const preProcessText = ref({
|
|
|
|
|
text1: "数据去重",
|
|
|
|
|
text2: "",
|
|
|
|
|
});
|
|
|
|
|
// 分析数据
|
|
|
|
|
const n_analyzeTheNumberOfDataItems = ref(0);
|
|
|
|
|
const aAnalyzeTheRawData = ref([]);
|
|
|
|
|
//分析结果
|
|
|
|
|
const nNumberOfAnalysisResults=ref(0)
|
|
|
|
|
const aOriginalDataOfAnalysisResults=ref([])
|
|
|
|
|
|
|
|
|
|
// 模型参数
|
|
|
|
|
const g_modelParameter = ref([]);
|
|
|
|
|
// 预处理
|
|
|
|
|
@ -251,6 +279,7 @@ const preProcess = (tetx) => {
|
|
|
|
|
method: preProcessText.value.text2,
|
|
|
|
|
userId: n_dataTableQuery.value.userId,
|
|
|
|
|
}).then((res) => {
|
|
|
|
|
proxy.$modal.msgSuccess("预处理成功");
|
|
|
|
|
analysisData.value = res.data;
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
@ -280,6 +309,11 @@ const submit = () => {
|
|
|
|
|
marketingAlgorithmApi.getMarketingAlgorithm({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName, fieldList: g_indicatorData.value }).then((res) => {
|
|
|
|
|
analysisData.value = res.data;
|
|
|
|
|
analysisHanderKry.value = Object.keys(res.data[0]);
|
|
|
|
|
if (res.data.length > 5) {
|
|
|
|
|
n_analyzeTheNumberOfDataItems.value = res.data.length;
|
|
|
|
|
aAnalyzeTheRawData.value = res.data;
|
|
|
|
|
analysisData.value = res.data.slice(0, 5);
|
|
|
|
|
}
|
|
|
|
|
proxy.$modal.msgSuccess("分析数据成功");
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
@ -296,6 +330,11 @@ const modelCalculation = () => {
|
|
|
|
|
const processedData = processArrayData(analysisHanderKry.value, analysisData.value);
|
|
|
|
|
marketingAlgorithmApi.getMarketingAlgorithmPreprocessing(JSON.stringify({ map: processedData, statistic: g_modelParameter.value, userId: n_dataTableQuery.value.userId })).then((res) => {
|
|
|
|
|
tableData.value = res.data.map((item) => item.statistics);
|
|
|
|
|
if(res.data.length>5){
|
|
|
|
|
nNumberOfAnalysisResults.value=res.data.length
|
|
|
|
|
aOriginalDataOfAnalysisResults.value = res.data.map((item) => item.statistics)
|
|
|
|
|
tableData.value = res.data.map((item) => item.statistics).slice(0,5)
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
function processArrayData(keys, data) {
|
|
|
|
|
@ -320,15 +359,8 @@ const getIndicator = () => {
|
|
|
|
|
algorithmStore.getUserDatabase({ userId: n_dataTableQuery.value.userId, tableName: n_dataTableQuery.value.tableName });
|
|
|
|
|
};
|
|
|
|
|
// 算法知识导入
|
|
|
|
|
const knowledgeImport = (e) => {
|
|
|
|
|
loading.value = true;
|
|
|
|
|
const files = e.target.files[0];
|
|
|
|
|
const formdata = new FormData();
|
|
|
|
|
formdata.append("file", files);
|
|
|
|
|
marketingAlgorithmApi.getMarketingAlgorithmKnowledgeImport(formdata).then((res) => {
|
|
|
|
|
proxy.$modal.msgSuccess("导入成功");
|
|
|
|
|
loading.value = false;
|
|
|
|
|
});
|
|
|
|
|
const knowledgeImport = () => {
|
|
|
|
|
b_introductionOfAlgorithmKnowledge.value=true
|
|
|
|
|
};
|
|
|
|
|
// 实训任务提交
|
|
|
|
|
const submitTask = () => {
|
|
|
|
|
@ -378,6 +410,13 @@ const restart = () => {
|
|
|
|
|
proxy.$modal.msgSuccess("重新开始成功");
|
|
|
|
|
multipleTableRef.value.clearSelection();
|
|
|
|
|
};
|
|
|
|
|
//
|
|
|
|
|
const analyzeDataNext = () => {
|
|
|
|
|
analysisData.value =paginate(aAnalyzeTheRawData.value,n_dataTableQuery.value.index,n_dataTableQuery.value.size).data
|
|
|
|
|
};
|
|
|
|
|
const updatePageAnalysisResults=()=>{
|
|
|
|
|
tableData.value =paginate(aOriginalDataOfAnalysisResults.value,gAnalysisResults.value.index,gAnalysisResults.value.size).data
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
|
@ -392,14 +431,14 @@ const restart = () => {
|
|
|
|
|
.main-but {
|
|
|
|
|
margin: 5px 20px 0;
|
|
|
|
|
display: flex;
|
|
|
|
|
.el-button:nth-child(2) {
|
|
|
|
|
.el-button:nth-child(1) {
|
|
|
|
|
width: 180px;
|
|
|
|
|
height: 56px;
|
|
|
|
|
background: url("../../../assets/images/011.png");
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
border-color: #ffffff00;
|
|
|
|
|
}
|
|
|
|
|
.el-button:nth-child(3) {
|
|
|
|
|
.el-button:nth-child(2) {
|
|
|
|
|
width: 180px;
|
|
|
|
|
height: 56px;
|
|
|
|
|
background: url("../../../assets/images/022.png");
|
|
|
|
|
|
qinzhenpen
2 years ago
