feat: ai流水线对接完成

src/api/pipeline.js

@@ -27,7 +27,7 @@ export const addPipeline = async payload => {
  */
 export const getAllPipeline = payload => {
     const {userId} = payload;
-    return axios.get(`${PIPELINE_MODULE}/all/${userId}`).then(res => {
+    return axios.get(`${PIPELINE_MODULE}/?userId=${userId}`).then(res => {
     // return axios.get(`${MOCK}/ml/pipelines/all/:userId`).then(res => {
         return res;
     });
@@ -38,8 +38,8 @@ export const getAllPipeline = payload => {
  * @returns
  */
 export const usePipeline = payload => {
-    const {pipelineId, fileId} = payload;
-    return axios.get(`${PIPELINE_MODULE}/${pipelineId}?fileId=${fileId}`).then(res => {
+    const {pipelineId, fileId, modelName} = payload;
+    return axios.post(`${PIPELINE_MODULE}/${pipelineId}?fileId=${fileId}&modelName=${modelName}`).then(res => {
     // return axios.post(`${MOCK}/ml/pipelines/:pipelineId`).then(res => {
         return res;
     });

src/views/ml/MLPipeline.vue

@@ -17,7 +17,7 @@
       <el-table-column prop="features" label="特征字段" :show-overflow-tooltip="true"></el-table-column>
       <el-table-column prop="label" label="标签字段"></el-table-column>
       <el-table-column label="模型算法">
-        <template #default="scope">{{ scope.row.machineLearningAlgorithm.algorithmName }}</template>
+        <template #default="scope">{{ scope.row.machineLearningAlgorithm }}</template>
       </el-table-column>
       <el-table-column prop="arguments" label="参数值" :show-overflow-tooltip="true" >
         <template #default="scope">
@@ -26,7 +26,7 @@
       </el-table-column>
       <el-table-column label="操作" width="180" align="center">
         <template #default="scope">
-            <el-button type="text" @click="handleUsePipeline(scope.row.id)">使用</el-button>
+<!--            <el-button type="text" @click="handleUsePipeline(scope.row.id)">使用</el-button>-->
             <el-button type="text" class="red" @click="handleDelete(scope.row.id)">删除</el-button>
         </template>
       </el-table-column>
@@ -63,6 +63,20 @@
     </template>
   </el-dialog>
 
+  <el-dialog v-model="downloadVisible" title="下载预测结果" width="30%">
+    <el-form width="300px">
+      <el-form-item label="文件名称" required>
+        <el-input v-model="fileName"></el-input>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+          <span class="dialog-footer">
+            <el-button @click="downloadVisible = false">取消</el-button>
+            <el-button type="primary" @click="download" style="margin-left: 10px"> 下载 </el-button>
+          </span>
+    </template>
+  </el-dialog>
+
 </div>
 </template>
 
@@ -71,6 +85,7 @@ import {reactive, ref} from "vue";
 import {deletePipeline, getAllPipeline, usePipeline} from "../../api/pipeline";
 import {ElMessage, ElMessageBox} from "element-plus";
 import {GetAllFile} from "../../api/file";
+import {downloadFile} from "../../api/utils";
 
 export default {
   name: "MLPipeline",
@@ -90,6 +105,9 @@ export default {
     const formLabelWidth='120px'
     const fileList = ref()
     let usePipelineId = ref()
+    let fileName = ref('')
+    let downloadUri = ref()
+    let downloadVisible = ref(false)
 
     const getPage = () => {
       const userId = localStorage.getItem("ms_userId");
@@ -115,7 +133,8 @@ export default {
       usePipelineVisible.value = false
       let data ={
         pipelineId: usePipelineId.value,
-        fileId: fileId
+        fileId: fileId,
+        modelName: `流水线${usePipelineId.value}的模型`
       }
       ElMessageBox( {
         title: "确定要使用流水线吗？",
@@ -131,17 +150,11 @@ export default {
               console.log("predic_res: ",res);
               if (res.msg === '成功')
               {
-                ElMessageBox({
-                  title: '流水线使用',
-                  message: `流水线使用成功`,
-                  confirmButtonText: '确定',
-                })
                 handleDownload(res.result.predictedFileDownloadingUri)
                 done()
               }
               else
               {
-                console.log(res);
                 ElMessage.error("预测失败!失败码:"+res.msg);
                 done()
               }
@@ -156,13 +169,33 @@ export default {
     }
 
     const handleDownload=(url)=>{
-      const a = document.createElement('a')
-      a.href = url
-      //a.download = res.success.fileName // 下载后文件名
-      a.style.display = 'none'
-      document.body.appendChild(a)
-      a.click() // 点击下载
-      document.body.removeChild(a)
+      downloadVisible.value =true
+      downloadUri.value = url
+    }
+    const download = () =>{
+      const payload={
+        fileUri: downloadUri.value
+      }
+      downloadFile(payload).then(data=>{
+        downloadVisible.value = false
+        let file = new Blob(["\ufeff" + data], { type: 'text/csv'});
+        if (window.navigator.msSaveOrOpenBlob)
+            // IE10+
+          window.navigator.msSaveOrOpenBlob(file, fileName.value);
+        else {
+          // Others
+          let a = document.createElement("a"),
+              url = URL.createObjectURL(file);
+          a.href = url;
+          a.download = fileName.value;
+          document.body.appendChild(a);
+          a.click();
+          setTimeout(function() {
+            document.body.removeChild(a);
+            window.URL.revokeObjectURL(url);
+          }, 0);
+        }
+      })
     }
     const handleDelete = (pid) => {
       ElMessageBox.confirm("确定要删除此流水线吗？", "提示", {
@@ -188,11 +221,14 @@ export default {
       formLabelWidth,
       fileList,
       usePipelineId,
+      fileName,
+      downloadVisible,
+      handleDownload,
+      download,
       getPage,
       handleUsePipeline,
       handleDelete,
       goPipeline,
-      handleDownload,
     }
   }
 }

src/views/ml/ModelList.vue

@@ -358,6 +358,7 @@ export default {
           alert('请输入必要信息！')
           return
         }
+        deployVisible.value = false
         addDeployment(payload).then(res=>{
           if (res.msg === '成功'){
             ElMessage.success('开始部署！')

src/views/ml/PredictionList.vue

@@ -36,6 +36,7 @@
         </template>
       </el-table-column>
       <el-table-column prop="finishTime" label="完成时间"></el-table-column>
+      <el-table-column prop="exampleData" label="预测结果示例"></el-table-column>
       <el-table-column label="操作" width="180" align="center">
         <template #default="scope">
           <div v-if="scope.row.predictionState === 'SUCCESS'">
@@ -86,6 +87,7 @@ export default {
         userId: localStorage.getItem("ms_userId")
       }
       getPrediction(payload).then(res => {
+        console.log( res.result)
         tableData.value=res.result;
       })
     }