|
|
@@ -0,0 +1,339 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="crumbs">
|
|
|
+ <el-breadcrumb separator="/">
|
|
|
+ <el-breadcrumb-item>
|
|
|
+ <i class="el-icon-lx-cascades"></i> 模型训练使用
|
|
|
+ </el-breadcrumb-item>
|
|
|
+ </el-breadcrumb>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="container">
|
|
|
+ <div class="handle-box">
|
|
|
+ <el-select v-model="query.file" placeholder="模型信息" class="handle-select mr10">
|
|
|
+ <el-option key="0" label="所有" value="0"></el-option>
|
|
|
+ <el-option key="1" label="逻辑回归" value="1"></el-option>
|
|
|
+ <el-option key="2" label="决策树" value="2"></el-option>
|
|
|
+ <el-option key="3" label="随机森林" value="3"></el-option>
|
|
|
+ <el-option key="4" label="梯度提升决策树" value="4"></el-option>
|
|
|
+ <el-option key="5" label="多层感知器分类器" value="5"></el-option>
|
|
|
+ <el-option key="6" label="朴素贝叶斯" value="6"></el-option>
|
|
|
+ <el-option key="7" label="随机森林回归" value="7"></el-option>
|
|
|
+ <el-option key="8" label="K-均值" value="8"></el-option>
|
|
|
+ </el-select>
|
|
|
+ <!-- <el-input v-model="query.name" placeholder="模型Id" class="handle-input mr10"></el-input>
|
|
|
+ <el-button type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button> -->
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="tableData" border class="table" ref="multipleTable"
|
|
|
+ header-cell-class-name="table-header"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ @row-dblclick="getConfigDetail"
|
|
|
+ >
|
|
|
+ <el-table-column width="50" type="selection"></el-table-column>
|
|
|
+ <el-table-column prop="confName" label="模型Id"></el-table-column>
|
|
|
+ <el-table-column label="模型信息">
|
|
|
+ <template #default="scope">{{ scope.row.modelTypeName }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="fileName" label="待测试文件">
|
|
|
+ <template #default="scope">
|
|
|
+ <router-link :to="{path:'/ConfigDetail',query:{configId:scope.row.configId}}">
|
|
|
+ <el-button type="text" icon="el-icon-upload" >选择文件
|
|
|
+ </el-button>
|
|
|
+ </router-link>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column label="模型训练" width="180" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button type="text" icon="el-icon-video-play" class="green"
|
|
|
+ @click="handleDelete(scope.$index, scope.row)">模型训练</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- 如果已经训练了，那么就告诉她您已经训练过该模型，但还是感觉应该放在模型配置里面，配置就可以让他进行训练！ -->
|
|
|
+
|
|
|
+
|
|
|
+ <el-table-column label="操作" width="180" align="center">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button type="text" icon="el-icon-mouse" class="blue"
|
|
|
+ @click="handleDelete(scope.$index, scope.row)">模型使用</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="pagination">
|
|
|
+ <el-pagination background layout="total, prev, pager, next" :current-page="query.pageIndex"
|
|
|
+ :page-size="query.pageSize" :total="pageTotal" @current-change="handlePageChange"></el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 编辑弹出框 -->
|
|
|
+ <el-dialog title="编辑" v-model="editVisible" min-width="30%">
|
|
|
+ <el-form label-width="150px">
|
|
|
+ <el-form-item label="配置名称" required>
|
|
|
+ <el-input v-model="form.name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="训练文件" required>
|
|
|
+ <el-input v-model="form.file"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择模型类别" required>
|
|
|
+ <el-radio-group v-model="modelSty.resource">
|
|
|
+ <el-radio label="分类"></el-radio>
|
|
|
+ <el-radio label="聚类"></el-radio>
|
|
|
+ <el-radio label="回归"></el-radio>
|
|
|
+ <el-radio label="自动化分类器"></el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item label="特征选择方式" required>
|
|
|
+<!-- <el-checkbox v-for="f in featureList" :key="f" :label="f"></el-checkbox>-->
|
|
|
+ <el-radio-group v-model="featureSty.resource">
|
|
|
+ <el-radio label="手动选择"></el-radio>
|
|
|
+ <el-radio label="自动选择"></el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+<!-- <el-form-item label="单选框" prop="resource">-->
|
|
|
+<!-- <el-radio-group v-model="form.resource">-->
|
|
|
+<!-- <el-radio label="步步高"></el-radio>-->
|
|
|
+<!-- <el-radio label="小天才"></el-radio>-->
|
|
|
+<!-- <el-radio label="imoo"></el-radio>-->
|
|
|
+<!-- </el-radio-group>-->
|
|
|
+<!-- </el-form-item>-->
|
|
|
+
|
|
|
+ <el-form-item label="选择特征字段" required>
|
|
|
+ <el-alert type="info" description="您下列选择的第一个字段为分类模型的目标字段"
|
|
|
+ show-icon style="height: 40px;"></el-alert>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="editVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="saveEdit">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { ref, reactive } from "vue";
|
|
|
+import { ElMessage, ElMessageBox } from "element-plus";
|
|
|
+import { fetchData } from "../api/index";
|
|
|
+import {addConfig, deleteModelByModelId, getAllConfig} from "../api/config";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "config",
|
|
|
+ //训练特征
|
|
|
+ // data(){
|
|
|
+ // return{
|
|
|
+ // form:{
|
|
|
+ // name:"",
|
|
|
+ // file:"",
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ setup() {
|
|
|
+ const featureSty = reactive({
|
|
|
+
|
|
|
+ resource: "小天才",
|
|
|
+
|
|
|
+ });
|
|
|
+ const modelSty = reactive({
|
|
|
+
|
|
|
+ resource: "小天才",
|
|
|
+
|
|
|
+ });
|
|
|
+ const query = reactive({
|
|
|
+ file: "",
|
|
|
+ name: "",
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ });
|
|
|
+
|
|
|
+ //new TODO
|
|
|
+ const typeList=["所有","分类","聚类","回归","自动分类器"];
|
|
|
+ const featureList=["所有","手动选择","自动选择"];
|
|
|
+ const multipleSelection =ref([]);
|
|
|
+
|
|
|
+ // const tableData = ref([]);
|
|
|
+ const tableData = ref([
|
|
|
+ ]);
|
|
|
+
|
|
|
+ const pageTotal = ref(0);
|
|
|
+ // 获取表格数据
|
|
|
+
|
|
|
+ const getpage=()=> {
|
|
|
+ // console.log("getpage");
|
|
|
+ getAllConfig({
|
|
|
+ uid: 1
|
|
|
+ }).then(res => {
|
|
|
+ console.log("res",res);
|
|
|
+ tableData.value = res.data;
|
|
|
+
|
|
|
+ })
|
|
|
+ };
|
|
|
+ getpage();
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // 查询操作
|
|
|
+ const handleSearch = () => {
|
|
|
+ query.pageIndex = 1;
|
|
|
+ getData();
|
|
|
+ };
|
|
|
+ // 分页导航
|
|
|
+ const handlePageChange = (val) => {
|
|
|
+ query.pageIndex = val;
|
|
|
+ getData();
|
|
|
+ };
|
|
|
+
|
|
|
+ // 删除操作(单个)
|
|
|
+ const handleDelete = (index) => {
|
|
|
+ // 二次确认删除
|
|
|
+ ElMessageBox.confirm("确定要删除吗？", "提示", {
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ // ElMessage.success("删除成功");
|
|
|
+ // tableData.value.splice(index, 1);
|
|
|
+ console.log("删除");
|
|
|
+ let idx=tableData._rawValue[index].id;
|
|
|
+ console.log(idx);
|
|
|
+ deleteModelByModelId({
|
|
|
+ configId:idx
|
|
|
+ }).then(res=>{
|
|
|
+ console.log("deleteres",res);
|
|
|
+ });
|
|
|
+
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+ };
|
|
|
+
|
|
|
+ //TODO
|
|
|
+ const handleSelectionChange = (val) => {
|
|
|
+ multipleSelection.value = val
|
|
|
+ };
|
|
|
+
|
|
|
+ //TODO 批量删除
|
|
|
+ const handleBatchDelete =()=>{
|
|
|
+ // 二次确认
|
|
|
+ if(multipleSelection.value.length<=0){
|
|
|
+ ElMessageBox.alert("请先勾选要删除的模型", '提示', {
|
|
|
+ confirmButtonText: '好的'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ else{
|
|
|
+ ElMessageBox.confirm("确定要删除这些模型吗？", "提示", {
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ let idList=[];
|
|
|
+ for(let i=0;i<multipleSelection.value.length;i++){
|
|
|
+ let id=multipleSelection.value[i]['id'];
|
|
|
+ idList.push(id);
|
|
|
+ }
|
|
|
+ idList.sort();
|
|
|
+ console.log(idList);
|
|
|
+ for (let i = idList[idList.length-1]; i >=0 ; i--) {
|
|
|
+ tableData.value.splice(i,1);
|
|
|
+ }
|
|
|
+ ElMessage.success("删除成功");
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ const getConfigDetail=(row,column,event)=>{
|
|
|
+ var configId=row.configId;
|
|
|
+ //todo:双击跳转到config界面
|
|
|
+ console.log("跳转到config详情界面")
|
|
|
+ }
|
|
|
+ // 表格编辑时弹窗和保存
|
|
|
+ const editVisible = ref(false);
|
|
|
+ let form = reactive({
|
|
|
+ name: "",
|
|
|
+ file: "",
|
|
|
+ // classification:"",
|
|
|
+ // feature:"",
|
|
|
+ });
|
|
|
+ let idx = -1;
|
|
|
+ const handleEdit = (index, row) => {
|
|
|
+ idx = index;
|
|
|
+ Object.keys(form).forEach((item) => {
|
|
|
+ form[item] = row[item];
|
|
|
+ });
|
|
|
+ editVisible.value = true;
|
|
|
+ };
|
|
|
+
|
|
|
+ const saveEdit = () => {
|
|
|
+ editVisible.value = false;
|
|
|
+ // ElMessage.success(`修改第 ${idx + 1} 行成功`);
|
|
|
+ // Object.keys(form).forEach((item) => {
|
|
|
+ // tableData.value[idx][item] = form[item];
|
|
|
+ // });
|
|
|
+ // console.log("here",featureSty.resource);
|
|
|
+ // const { , ,confName , fieldIds} = payload;
|
|
|
+
|
|
|
+ addConfig({
|
|
|
+ fileInfoId:form.file,
|
|
|
+ userId:0,
|
|
|
+ modelTypeId:modelSty.resource,
|
|
|
+ confName:form.name,
|
|
|
+ fieldIds:featureSty.resource
|
|
|
+ }).then(res=>{
|
|
|
+ console.log(res);
|
|
|
+ });
|
|
|
+ };
|
|
|
+
|
|
|
+ return {
|
|
|
+ query,
|
|
|
+ tableData,
|
|
|
+ pageTotal,
|
|
|
+ editVisible,
|
|
|
+ form,
|
|
|
+ handleSearch,
|
|
|
+ handlePageChange,
|
|
|
+ handleDelete,
|
|
|
+ handleSelectionChange,
|
|
|
+ handleBatchDelete,
|
|
|
+ handleEdit,
|
|
|
+ saveEdit,
|
|
|
+ getConfigDetail,
|
|
|
+ featureSty,
|
|
|
+ modelSty,
|
|
|
+ getpage,
|
|
|
+ };
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.handle-box {
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.handle-select {
|
|
|
+ width: 120px;
|
|
|
+}
|
|
|
+
|
|
|
+.handle-input {
|
|
|
+ width: 300px;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.table {
|
|
|
+ width: 100%;
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+.red {
|
|
|
+ color: #ff0000;
|
|
|
+}
|
|
|
+.mr10 {
|
|
|
+ margin-right: 10px;
|
|
|
+}
|
|
|
+.table-td-thumb {
|
|
|
+ display: block;
|
|
|
+ margin: auto;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+}
|
|
|
+</style>
|
