feat: mock了文件列表、删除、详情、创建配置

src/api/_prefix.js

@@ -22,5 +22,6 @@ export const PIC_MODULE= `${API_MODULE}/picture`
 export const POST_MODULE=`${NEW_API_MODULE}/posts`
 export const COMMENT_MODULE=`${NEW_API_MODULE}/comment`
 export const MAIL_MODULE=`${NEW_API_MODULE}/mail`
+export const MOCK=`https://www.fastmock.site/mock/bf3861ab0686afc109db950891639c79/api`
 
 

src/api/config.js

@@ -2,7 +2,7 @@ import request from '../utils/request';
 //import axios from 'axios';
 import {CONFIG_MODULE} from "./_prefix";
 import {axios} from '../utils/request'
-
+import {MOCK} from "./_prefix";
 
 /**
  *  添加模型配置信息 POST
@@ -10,9 +10,13 @@ import {axios} from '../utils/request'
  * @returns
  */
 export const addConfig = payload => {
-  console.log(payload);
   const { fileInfoId, userId, learningType, configName, features, label} = payload;
-  return axios.post(`${CONFIG_MODULE}`, {
+  // return axios.post(`${CONFIG_MODULE}`, {
+  //   fileInfoId, userId, learningType ,configName ,features, label
+  // }).then(res => {
+  //   return res;
+  // });
+  return axios.post(`${MOCK}/ml/configs`, {
     fileInfoId, userId, learningType ,configName ,features, label
   }).then(res => {
     return res;

src/api/file.js

@@ -2,6 +2,7 @@
 import {FILE_MODULE} from "./_prefix";
 import request from '../utils/request';
 import {axios} from '../utils/request'
+import {MOCK} from "./_prefix";
 
 /**
  *  添加文件 POST /upload
@@ -55,13 +56,17 @@ export const UploadFile = payload => {
  * @returns
  */
 export const GetAllFile = userId => {
-    return axios.get(`${FILE_MODULE}`, {
-        params:{
-            userId: userId
-        }
-    }).then( res => {
-        return res;
-    });
+    // return axios.get(`${FILE_MODULE}`, {
+    //     params:{
+    //         userId: userId
+    //     }
+    // }).then( res => {
+    //     return res;
+    // });
+    return axios.get(`${MOCK}/files:userId=1`, {
+        }).then( res => {
+            return res;
+        });
 }
 
 // 直接返回数据
@@ -82,56 +87,25 @@ export const GetAllFile = userId => {
  * @returns
  */
 export const getFileDetail = fileId => {
-    return axios.get(`${FILE_MODULE}/${fileId}`).then( res => {
+    // return axios.get(`${FILE_MODULE}/${fileId}`).then( res => {
+    //     return res;
+    // })
+    return axios.get(`${MOCK}/files/:fileInfoId`).then( res => {
         return res;
     })
 }
 
-//直接返回数据：
-//     return Promise.resolve({
-//         "timestamp": 1649398931190,
-//         "status": 200,
-//         "data": {
-//             "fileName": "event_data",
-//             "createTime": "2022-03-29T09:25:43.154+00:00",
-//             "fileStrucInfo": {
-//                 "totalRows": "754"
-//             },
-//             "headerInfos": [
-//                 {
-//                     "id": 103,
-//                     "fileInfoId": 1,
-//                     "fieldName": "frame_index",
-//                     "aliasName": "",
-//                     "fieldDes": "",
-//                     "nullsRatio": 0.0,
-//                     "conOrDis": 1,
-//                     "fieldType": "int",
-//                     "valueInfo": "[\"79\",\"89992\"]"
-//                 },
-//                 {
-//                     "id": 104,
-//                     "fileInfoId": 1,
-//                     "fieldName": "time",
-//                     "aliasName": "",
-//                     "fieldDes": "",
-//                     "nullsRatio": 0.0,
-//                     "conOrDis": 1,
-//                     "fieldType": "double",
-//                     "valueInfo": "[\"3.16\",\"3599.68\"]"
-//                 }
-//             ]
-//         }
-//     })
-// }
 /**
  *  删除文件 GET /delete
  * @param {*} fileId
  * @returns
  */
 export const deleteFile = fileId => {
-    return axios.delete(`${FILE_MODULE}/${fileId}`).then( res => {
-            return res;
+    // return axios.delete(`${FILE_MODULE}/${fileId}`).then( res => {
+    //         return res;
+    // });
+    return axios.delete(`${MOCK}/files/:fileInfoId`).then( res => {
+        return res;
     });
 }
 

src/views/file/FileDetail.vue

@@ -19,29 +19,24 @@
 
       </div>
 
-      <el-table :data="tableData" border class="table" ref="fieldTable" header-cell-class-name="table-header" @selection-change="handleSelectChange">
+      <el-table :data="tableData"
+                border class="table"
+                ref="fieldTable"
+                header-cell-class-name="table-header"
+                @selection-change="handleSelectChange"
+      >
         <el-table-column width="50" type="selection"></el-table-column>
+        <el-table-column label="字段id">
+          <template #default="scope"><span>{{ scope.row.id }}</span></template>
+        </el-table-column>
         <el-table-column label="字段名">
           <template #default="scope"><span>{{ scope.row.fieldName }}</span></template>
         </el-table-column>
-        <el-table-column label="别名">
-          <template #default="scope">{{ scope.row.aliasName }}</template>
-        </el-table-column>
-        <el-table-column label="描述">
-          <template #default="scope">{{ scope.row.fieldDes }}</template>
-        </el-table-column>
         <el-table-column label="取值类型">
-          <template #default="scope">{{ scope.row.fieldType }}</template>
-        </el-table-column>
-        <el-table-column label="分布类型">
-          <template #default="scope">{{ scope.row.conOrDis }}</template>
+          <template #default="scope">{{ scope.row.dataType }}</template>
         </el-table-column>
         <el-table-column label="空值率">
-          <template #default="scope">{{ scope.row.nullsRatio }}</template>
-        </el-table-column>
-
-        <el-table-column label="值域" >
-          <template #default="scope">{{ scope.row.valueInfo }}</template>
+          <template #default="scope">{{ scope.row.nullRate }}</template>
         </el-table-column>
       </el-table>
       <div class="pagination">
@@ -141,7 +136,7 @@
             <el-option key="1" label="是" value='1'></el-option>
             <el-option key="2" label="否" value='2'></el-option>
           </el-select>
-          <el-alert type="info" description="选择的最后一个字段为标签字段" v-if="labelTip===1"
+          <el-alert type="info" description="您选择的最后一个字段为标签字段" v-if="labelTip===1"
                     show-icon style="height: 40px; margin-top: 10px"></el-alert>
           <el-alert type="info" description="没有目标字段,适用于k-means模型" v-if="labelTip===2"
                     show-icon style="height: 40px; margin-top: 10px"></el-alert>
@@ -220,29 +215,18 @@ export default {
     // 获取表格数据
     const getData = () => {
       const route=useRoute()
-      //todo:调用获取文件具体信息获取字段列表
       if(route.query.fileId!=null) {
         getFileDetail(route.query.fileId).then(res => {
-          tableData.value = res.data.headerInfos;
-          for (var i = 0; i < tableData.value.length; i++) {
-            if (tableData.value[i].conOrDis === 1) {
-              tableData.value[i].conOrDis = "连续值"
-            } else {
-              tableData.value[i].conOrDis = "离散值"
-            }
-          }
-          //console.log(tableData)
+          console.log(res)
+          tableData.value = res.result.fileFieldList;
+          console.log(tableData)
           console.log("fileId="+route.query.fileId)
           fileId=route.query.fileId
         })
       }
 
     };
-    //getData();
-    tableData.value = [
-      {id:1, fileInfoId: 1, fieldName: '编号', conOrDis: '连续值',fieldType: 'int'},
-      {id:2, fileInfoId: 1, fieldName: '色泽', conOrDis: '连续值',fieldType: 'string'},
-      {id:3, fileInfoId: 1, fieldName: '纹理', conOrDis: '连续值',fieldType: 'string'}]
+    getData();
 
     const getFeature=()=>{
       if(selectData.value.length===0){ElMessage.error("请先选择目标字段");return;}
@@ -387,12 +371,10 @@ export default {
     const selectModelTypeChange=(selectValue)=>{
       if(selectValue==="8")featureTip.value=2;
       else featureTip.value=1;
-      console.log(featureTip.value)
     }
     const selectLabelChange=(selectValue)=>{
       if(selectValue==="1") labelTip.value=1;
       else labelTip.value=2;
-      console.log(labelTip.value)
     }
     const configCreate = ref(false);
     const createConfig =() => {
@@ -434,7 +416,6 @@ export default {
     }
     const handleSelectChange=val=>{
       selectData.value=val;
-      console.log('selectData:'+JSON.stringify(selectData))
     };
 
     return {

src/views/file/FileList.vue

@@ -20,10 +20,10 @@
                 <!----------------------------todo------------------------------->
                 <!----------------------------获取文件详细信息、跳转到响应页面；删除文件------------------------------->
                 <div style="display:flex;width: 100%;justify-content:space-around;">
-                  <el-button size="small" @click="handleFileDetail(scope.row.fileId)">查看详情</el-button>
+                  <el-button size="small" @click="handleFileDetail(scope.row.id)">查看详情</el-button>
 
                 <!--  scope.$index 是数组下标,这里再传一个fileId             handleFileDelete(scope.$index,scope.row.fileId)   -->
-                  <el-button size="small" type="danger"  @click="handleDeleteDialog(scope.row.fileId);dialogVisible=true">
+                  <el-button size="small" type="danger"  @click="handleDeleteDialog(scope.row.id);dialogVisible=true">
                     删除文件
                   </el-button>
                 </div>
@@ -90,12 +90,11 @@ export default {
     //用户Id => 文件列表
     const getFileList=(userId)=>{
       GetAllFile(userId).then(res=>{
-        console.log(res)
         if(res.msg === '成功'){
-          state.fileList=res.data;
+          state.fileList=res.result.fileInfoVOList;
+          console.log(state.fileList)
         }
         else{
-          console.log("getFileList Error!");
           ElMessage.error("获取文件列表失败!")
         }
       })
@@ -114,21 +113,18 @@ export default {
     //打开提示确认删除的对话框，将fileId保存下来
     const handleDeleteDialog = (fileId)=>{
       toDeleteFileId=fileId;
-      console.log("handleDeleteDialog")
-      console.log("fileId:"+fileId)
       ElMessage.info("要删除的文件Id fileId:"+fileId)
     }
 
     //删除对应文件
     const handleFileDelete = () => {
-      console.log("fileId:"+toDeleteFileId)
       deleteFile(toDeleteFileId).then(res=>{
-        if(res.status===200){
+        if(res.msg === '成功'){
           ElMessage.success("删除成功!")
           getFileList(userId);
         }
         else{
-          ElMessage.error("删除失败!错误码:"+res.status)
+          ElMessage.error("删除失败!错误码:"+res.msg)
         }
       })
     };
@@ -144,14 +140,14 @@ export default {
       console.log(index)
     }
 
-    //初始化
-    // onMounted(() => {
-    //   getFileList(userId);
-    // })
-    state.fileList = [
-        {fileName: '666', fileId: 1},
-        {fileName: '777', fileId: 2}
-        ]
+    onMounted(() => {
+      getFileList(userId);
+    })
+
+    // state.fileList = [
+    //     {fileName: '666', fileId: 1},
+    //     {fileName: '777', fileId: 2}
+    //     ]
 
 
     return {