1、数据清洗、数据建模界面实现输入缓存
2、增加建模历史记录功能
This commit is contained in:
lzh
+2
-1
@@ -1,10 +1,11 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<transition name="fade" mode="out-in">
|
||||
<router-view v-if="isRouterAlive"></router-view>
|
||||
<keep-alive>
|
||||
<router-view v-if="$route.meta.keepAlive"></router-view>
|
||||
<router-view v-if="!$route.meta.keepAlive"></router-view>
|
||||
</keep-alive>
|
||||
<router-view v-if="!$route.meta.keepAlive"></router-view>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
+5
-9
@@ -6,7 +6,7 @@ import Table from './views/nav1/Table.vue'
|
||||
import MLmodel from './views/nav1/MLmodel.vue'
|
||||
import user from './views/nav1/user.vue'
|
||||
import Clean from './views/nav1/Clean.vue'
|
||||
import Page4 from './views/nav2/Page4.vue'
|
||||
import History from './views/nav2/History.vue'
|
||||
import Page5 from './views/nav2/Page5.vue'
|
||||
import Page6 from './views/nav3/Page6.vue'
|
||||
import echarts from './views/charts/echarts.vue'
|
||||
@@ -36,7 +36,7 @@ let routes = [
|
||||
component: Main,
|
||||
name: '主页',
|
||||
hidden: true ,
|
||||
keepAlive: true
|
||||
meta:{keepAlive: true}
|
||||
},
|
||||
{ path: '/table', component: Table, name: '我的数据集', meta:{keepAlive: true} },
|
||||
{ path: '/user', component: user, name: '数据预览', meta:{keepAlive: true} },
|
||||
@@ -51,15 +51,11 @@ let routes = [
|
||||
{
|
||||
path: '/',
|
||||
component: Home,
|
||||
name: '图片数据建模',
|
||||
name: '构建历史',
|
||||
iconCls: 'fa fa-id-card-o',
|
||||
children: [
|
||||
{ path: '/page4', component: Page4, name: '页面4' },
|
||||
{ path: '/page5', component: Page5, name: '页面5' }
|
||||
],
|
||||
meta: {
|
||||
title:"ML代码生成平台"
|
||||
}
|
||||
{path: '/history', component: History, name: '历史记录'}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
|
||||
+1
-1
@@ -117,7 +117,7 @@
|
||||
this.$confirm('确认退出吗?', '提示', {
|
||||
//type: 'warning'
|
||||
}).then(() => {
|
||||
sessionStorage.removeItem('user');
|
||||
sessionStorage.clear();
|
||||
_this.$router.push('/login');
|
||||
}).catch(() => {
|
||||
|
||||
|
||||
@@ -122,8 +122,20 @@
|
||||
this.get_datasets()
|
||||
this.get_clean_methods()
|
||||
this.get_dataset_cols(this.value)
|
||||
var clean_params = sessionStorage.getItem("clean_params")
|
||||
if (clean_params){
|
||||
this.clean_form = JSON.parse(clean_params)
|
||||
}
|
||||
|
||||
},
|
||||
watch: {
|
||||
clean_form:{
|
||||
handler: function(val, oldVal){
|
||||
sessionStorage.setItem("clean_params",JSON.stringify(val))
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/*初始化加载方法:用户所有数据集、清洗方法 */
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="form" label-width="80px" @submit.prevent="onSubmit" style="margin:20px;width:60%;min-width:600px;">
|
||||
|
||||
<el-form ref="form" :model="form" :rules="rules_model" label-width="80px" @submit.prevent="onSubmit" style="margin:20px;width:60%;min-width:600px;">
|
||||
<el-form-item label="任务名称">
|
||||
<el-input v-model="form.name"></el-input>
|
||||
</el-form-item>
|
||||
@@ -56,7 +57,7 @@
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="模型选择">
|
||||
<el-checkbox-group v-model="form.models">
|
||||
<el-checkbox-group v-model="form.model_name">
|
||||
<el-checkbox
|
||||
v-for="item in models[form.model_type]"
|
||||
:label="item"
|
||||
@@ -82,6 +83,7 @@
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">立即创建</el-button>
|
||||
<el-button type="primary" @click="saveParams">保存条件</el-button>
|
||||
<el-button @click.native.prevent>取消</el-button>
|
||||
</el-form-item>
|
||||
|
||||
@@ -96,13 +98,14 @@
|
||||
</el-dialog>
|
||||
<el-col v-html="run_code_result"></el-col>
|
||||
</el-form>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
axios.defaults.withCredentials=true;
|
||||
export default {
|
||||
inject:['reload'],
|
||||
// inject:['reload'],
|
||||
|
||||
data() {
|
||||
return {
|
||||
@@ -120,6 +123,12 @@
|
||||
model_scene:"股价预测",
|
||||
|
||||
},
|
||||
rules_model:{
|
||||
name:[
|
||||
{required: true, message:'任务名称不能为空', trigger:'blur'},
|
||||
{min:1, max:16, message:"长度在1-16个字符", trigger:'blur'},
|
||||
]
|
||||
},
|
||||
models:{},//用户可选择的模型,key为模型类型(分类，回归，聚类),value为具体模型[]
|
||||
metrics:{},//用户可选择的模型评估方法,key为模型类型(分类，回归，聚类),value为具体方法[]
|
||||
dataset_options:[],
|
||||
@@ -127,18 +136,35 @@
|
||||
//用于目标列中不出现已选择的特征列
|
||||
target_cols:[],
|
||||
run_code_result:"",
|
||||
scenes:["股价预测","气温预测","湿度预测",
|
||||
"成绩等级分类","属性分类"]
|
||||
scenes:["股价预测","气温预测","湿度预测","商品价格预测",
|
||||
"成绩等级分类","属性分类","情感/语义评分",
|
||||
"地理信息聚类","情感属性聚类"]
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.get_datasets()
|
||||
var datasetName=sessionStorage.getItem('dataset_name')
|
||||
console.log(this.form)
|
||||
if (datasetName!='') {
|
||||
this.form.dataset_name=datasetName
|
||||
this.get_dataset_cols(datasetName)
|
||||
}
|
||||
this.get_methods()
|
||||
//session是否存在参数缓存，如果存在，则读取缓存参数
|
||||
var model_params = sessionStorage.getItem("model_params")
|
||||
if (model_params)
|
||||
this.form=JSON.parse(model_params)
|
||||
},
|
||||
|
||||
//监听所有输入框的变化，实现数据缓存
|
||||
watch:{
|
||||
form:{
|
||||
handler:function(val,oldVal){
|
||||
console.log("new:%s,old:%s",val,oldVal)
|
||||
sessionStorage.setItem("model_params",JSON.stringify(this.form))
|
||||
},
|
||||
deep:true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSubmit() {
|
||||
@@ -153,6 +179,22 @@
|
||||
|
||||
})
|
||||
},
|
||||
//保存当前查询条件
|
||||
saveParams(){
|
||||
axios.post('/api/model_selection/save_params',{
|
||||
username:JSON.parse(sessionStorage.getItem('user')),
|
||||
data:this.form
|
||||
}).then((response)=>{
|
||||
var code=response.data.data
|
||||
if (code===200){
|
||||
this.$message.success(response.data.msg)
|
||||
}
|
||||
else {
|
||||
this.$message.warning(response.data.msg)
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
get_datasets(){
|
||||
var original=JSON.parse(sessionStorage.getItem("dataset_list"))
|
||||
for (var dataset of original){
|
||||
@@ -208,7 +250,7 @@
|
||||
model_type: '分类',
|
||||
features:[],
|
||||
target:'',
|
||||
models: [],
|
||||
model_name: [],
|
||||
metrics:[],
|
||||
desc:''
|
||||
},
|
||||
@@ -227,10 +269,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
//模型类型发生变化时，清空模型选择，模型评估的内容
|
||||
onModelTypeChange(){
|
||||
this.form.models = []
|
||||
this.form.model_name = []
|
||||
this.form.metrics = []
|
||||
},
|
||||
//导出代码文件
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
<span class="iconfont icon-shangchuan" />上传文件
|
||||
</el-button>
|
||||
</el-upload>
|
||||
<span style="color: orange">上传文件仅支持 csv,txt,xls、xlsx类型</span>
|
||||
<span style="color: orange">上传文件仅支持 csv,txt,xls,xlsx类型</span>
|
||||
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column prop="address" label="序号" width="180"></el-table-column>
|
||||
@@ -36,10 +36,6 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
|
||||
<!-- <div v-for="i in list">-->
|
||||
<!-- <h1>{{i}}</h1>-->
|
||||
<!-- </div>-->
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@@ -50,6 +46,7 @@
|
||||
|
||||
export default {
|
||||
data(){
|
||||
console.log(this.$route)
|
||||
return {
|
||||
tableData: [],
|
||||
list:"name",
|
||||
@@ -98,7 +95,6 @@
|
||||
dataset_list.push(temp)
|
||||
}
|
||||
this.isloading=false
|
||||
console.log(dataset_list)
|
||||
sessionStorage.setItem("dataset_list",JSON.stringify(dataset_list))
|
||||
|
||||
})
|
||||
@@ -109,17 +105,13 @@
|
||||
//文件上传检验
|
||||
beforeUpload(file) {
|
||||
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1);
|
||||
|
||||
const whiteList = ["csv","txt","xls", "xlsx"];
|
||||
|
||||
if (whiteList.indexOf(fileSuffix) === -1) {
|
||||
this.$message("上传文件只能是 csv、txt、xls、xlsx格式", "error");
|
||||
return false;
|
||||
}
|
||||
|
||||
const isLt10M = file.size / 1024 / 1024 < 10;
|
||||
|
||||
if (!isLt10M) {
|
||||
const isLt15M = file.size / 1024 / 1024 < 15;
|
||||
if (!isLt15M) {
|
||||
this.$message("上传文件大小不能超过 15MB", "error");
|
||||
return false;
|
||||
}
|
||||
@@ -130,7 +122,6 @@
|
||||
this.$message("上传成功!",'info')
|
||||
//清空上传列表
|
||||
this.reload()
|
||||
|
||||
},
|
||||
//上传失败回调
|
||||
handleError(err, file, fileList) {
|
||||
@@ -140,12 +131,9 @@
|
||||
var erro = JSON.parse(body)
|
||||
console.log(erro)
|
||||
this.$message("上传失败! " + erro.msg, 'warning')
|
||||
|
||||
|
||||
},
|
||||
//删除指定数据集文件
|
||||
del(row,i){
|
||||
console.log(row.name,i)
|
||||
del(row,index){
|
||||
axios.post('/api/del_dataset',{
|
||||
dataset_name:row.name,
|
||||
username:sessionStorage.getItem('user')
|
||||
@@ -161,7 +149,7 @@
|
||||
)
|
||||
},
|
||||
//跳转到数据预览页面
|
||||
jump(row,i){
|
||||
jump(row,index){
|
||||
sessionStorage.setItem('dataset_name',row.name)
|
||||
this.$router.push({ path: '/user' });
|
||||
}
|
||||
|
||||
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<section>
|
||||
<el-table :data="historyList" style="width: 100%">
|
||||
<el-table-column prop="name" label="任务名称" width="120"></el-table-column>
|
||||
<el-table-column prop="dataset_name" label="数据集名称" width="120"></el-table-column>
|
||||
<el-table-column prop="target" label="目标列" width="120"></el-table-column>
|
||||
<el-table-column prop="features" label="特征列" width="120"></el-table-column>
|
||||
<el-table-column prop="model_type" label="模型类型" width="120"></el-table-column>
|
||||
<el-table-column prop="model_name" label="模型名称" width="120"></el-table-column>
|
||||
<el-table-column prop="evaluate_methods" label="模型评估方法" width="120"></el-table-column>
|
||||
<el-table-column prop="model_scene" label="模型使用场景" width="120"></el-table-column>
|
||||
|
||||
|
||||
<el-table-column label="快速建模" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="warning" @click="build_model(scope.row,scope.$index)">快速建模</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="删除" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="danger" @click="del_history(scope.row,scope.$index)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
</el-table>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
|
||||
axios.defaults.withCredentials = true;
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
historyList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.history_list()
|
||||
},
|
||||
inject:['reload'],
|
||||
methods: {
|
||||
history_list() {
|
||||
var history_list = []
|
||||
var username = sessionStorage.getItem('user')
|
||||
axios.get('/api/get_history_list?username=' + JSON.parse(username))
|
||||
.then((response) => {
|
||||
var data = response.data.data
|
||||
var len = data.length
|
||||
for (var i = 0; i < len; i++) {
|
||||
this.historyList.push(data[i])
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 将历史记录的各参数，转换成构建模型的参数形式
|
||||
build_model(row,index){
|
||||
var list_fields = ["features","model_name","evaluate_methods"]
|
||||
var model_params = {}
|
||||
for(var key in row){
|
||||
model_params[key] = list_fields.indexOf(key)>-1 ? row[key].split(","):row[key]
|
||||
}
|
||||
sessionStorage.setItem("model_params",JSON.stringify(model_params))
|
||||
this.$router.push({path:'/MLmodel'})
|
||||
},
|
||||
|
||||
// 删除历史记录
|
||||
del_history(row, index){
|
||||
var del_task_name = row.name
|
||||
var username = JSON.parse(sessionStorage.getItem("user"))
|
||||
axios.post('/api/model_selection/delete_history',
|
||||
{
|
||||
"username":username,
|
||||
"name":row.name
|
||||
})
|
||||
.then((response) => {
|
||||
console.log("查看返回值:",response.data)
|
||||
var body=response.data
|
||||
if (body.code==200) {
|
||||
this.$message.success("删除成功！")
|
||||
this.reload()
|
||||
}
|
||||
else
|
||||
this.$message.error("删除失败")
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
@@ -1,33 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1>vuex 测试</h1>
|
||||
Clicked: {{ getCount }} times
|
||||
<button @click="increment">+</button>
|
||||
<button @click="decrement">-</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import { mapActions } from 'vuex'
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
// 使用对象展开运算符将 getters 混入 computed 对象中
|
||||
...mapGetters([
|
||||
'getCount'
|
||||
// ...
|
||||
])
|
||||
},
|
||||
methods: {
|
||||
...mapActions([
|
||||
'increment', // 映射 this.increment() 为 this.$store.dispatch('increment')
|
||||
'decrement'
|
||||
])
|
||||
//...mapActions({
|
||||
// add: 'increment' // 映射 this.add() 为 this.$store.dispatch('increment')
|
||||
//})
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user