新增CSV文件转换节点2

src/views/modules/visi/design-csvselect-config.vue

@@ -30,7 +30,7 @@
         <el-form :layout="formLayout">
           <el-form-item label="获取数据集">
             <el-select
-              v-model="inputnodefilevalue"
+              v-model="filename"
               placeholder="请选择"
               @change="changeslect"
             >
@@ -38,7 +38,7 @@
                 v-for="item in inputnodefilemap"
                 :key="item.name"
                 :label="item.name"
-                :value="item"
+                :value="item.name"
               ></el-option>
             </el-select>
           </el-form-item>
@@ -53,12 +53,14 @@
             <el-button type="primary" @click="previewfile"> 预览 </el-button>
           </el-form-item>
         </el-form>
+        <el-divider></el-divider>
         <!-- csv文件头信息 -->
         <el-table
           :data="allStringinfo"
           style="width: 100%"
-          stripe empty-text=" "
-          max-height="300"
+          stripe
+          empty-text=" "
+          max-height="400"
         >
           <el-table-column type="index"></el-table-column>
           <el-table-column
@@ -121,14 +123,16 @@
             <el-button type="primary" @click="previewnewfile"> 预览 </el-button>
           </el-form-item>
         </el-form>
+        <el-divider></el-divider>
         <!-- csv文件头信息 -->
         <el-table
           :data="newallStringinfo"
           style="width: 100%"
-          stripe empty-text=" "
-          max-height="300"
+          stripe
+          empty-text=" "
+          max-height="400"
         >
-        <el-table-column type="index"></el-table-column>
+          <el-table-column type="index"></el-table-column>
           <el-table-column
             v-for="(item, index) in newheaderinfo"
             :key="index"
@@ -165,6 +169,7 @@ export default {
       // fileurl: "http://150.158.138.99:9006/visiarguartifact/argoworkflow/DY_1019.csv?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=minio%2F20220724%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20220724T102526Z&X-Amz-Expires=1000&X-Amz-SignedHeaders=host&X-Amz-Signature=e7d18bcc2b3e0352194cbeddf3b3c5e2696b09916d9cbb326f56ccd01c181718"
       // name: "DY_1019.csv"
       filename: null,
+      bucketname: null,
       cell: null,
       nodeName: "1",
 
@@ -181,6 +186,7 @@ export default {
 
       //包含所有文件
       allfilemap: [{}],
+      fileitem: {}, //当前创建的文件
 
       //新文件
       tab3visi: false,
@@ -202,8 +208,8 @@ export default {
       this.formLayout = e.target.value;
     },
     indexMethod(index) {
-        return index ;
-      },
+      return index;
+    },
     callback(key) {
       console.log(key);
     },
@@ -214,7 +220,9 @@ export default {
       this.visible = true;
       this.inputnodefilemap = celldata.inputnodefilemap;
       this.inputnodefilevalue = celldata.inputnodefilevalue;
+      this.filename = celldata.inputnodefilevalue.name;
       this.allfilemap = celldata.allfilemap;
+      this.nodeName = celldata.nodeName;
       this.cell = cell;
 
       //新创建的文件初始化
@@ -225,6 +233,10 @@ export default {
           celldata.allfilemap[celldata.allfilemap.length - 1].name;
         this.newfileurl =
           celldata.allfilemap[celldata.allfilemap.length - 1].fileurl;
+
+        this.newbucketname =
+          celldata.allfilemap[celldata.allfilemap.length - 1].bucketname;
+        this.fileitem = celldata.allfilemap[celldata.allfilemap.length - 1];
       }
     },
     primary() {
@@ -238,7 +250,7 @@ export default {
       // this.cell.setData({ outputsparameters: this.outputsparameters });
       //20210922   zhang    是否需要保存 获取到的源数据
 
-      this.$emit("primaryCSVselectNodeclick", this.conditionForm,this.cell);
+      this.$emit("primaryCSVselectNodeclick", this.conditionForm, this.cell);
     },
 
     //新建边时，源节点为输入节点，节点内部获取输入节点对应的文件 name及url
@@ -286,7 +298,6 @@ export default {
     cascadeparahandleChange(value) {
       // console.log("多选参数");
       // console.log(value);
-
       // console.log(quotevalue)
       // 是否与上次的类型相同
       // let changeFlag = false;
@@ -335,9 +346,19 @@ export default {
 
     //
     changeslect(item) {
-      // console.log("输入文件数据集名称")
-      // console.log(item)
+      console.log("输入文件数据集名称");
+      console.log(item);
       // concole.log(item.target)
+      for (
+        var i = 0;
+        this.inputnodefilemap && i < this.inputnodefilemap.length;
+        i++
+      ) {
+        if (item == this.inputnodefilemap[i].name) {
+          this.inputnodefilevalue = this.inputnodefilemap[i];
+          this.bucketname = this.inputnodefilemap[i].bucketname;
+        }
+      }
     },
     //获取CSV文件表头信息
     getCSVHeader() {
@@ -413,7 +434,7 @@ export default {
         Message.error("输入有误");
       } else {
         // this.getWorkflowStatus();
-        // console.log("获取CSV文件表头信息");
+        console.log("获取CSV文件表头信息");
         this.$http({
           url: this.$http.adornUrl("/visi/visiworkflow/getnewfile"),
           method: "get",
@@ -433,25 +454,35 @@ export default {
                 this.newfileurl = data.newfileurl;
                 this.newbucketname = "visiarguartifact";
 
-                var fileitem = {};
-                fileitem["name"] = data.newfilename;
-                fileitem["bucketname"] = "visiarguartifact";
-                fileitem["fileurl"] = data.newfileurl;
-                this.allfilemap.push(fileitem);
+                // var fileitem = {};
+                this.fileitem["name"] = data.newfilename;
+                this.fileitem["bucketname"] = "visiarguartifact";
+                this.fileitem["fileurl"] = data.newfileurl;
+
                 // this.allfilemap.pop(0);
+
+                Message.success("创建新文件成功");
+                // this.primary();
               });
             }
           })
+          .then(() => {
+            if(this.allfilemap==null){
+              this.allfilemap = [];
+            }
+          }).then(() => {
+            this.allfilemap.push(this.fileitem);
+          })
           .then(() => {
             // console.log("获取的表头信息");
             // console.log(this.headerinfo);
             // console.log(this.allStringinfo);
             // console.log(this.rownum)
             // console.log(this.colnum)
-            Message.success("创建新文件成功")
+            // Message.success("创建新文件成功")
+
             this.primary();
           });
-          
       }
     },
 
@@ -473,8 +504,8 @@ export default {
           .then(({ data }) => {
             if (data && data.code === 0) {
               this.$nextTick(() => {
-                this.newrownum = Number(data.index);
-                this.newcolnum = Number(data.col);
+                this.newrownum = Number(data.index) - 1;
+                this.newcolnum = Number(data.col) - 1;
                 this.newheaderinfo = data.headerinfo;
                 this.newallStringinfo = data.allstring;
               });
@@ -490,7 +521,7 @@ export default {
         Message.error("未创建新文件");
       } else {
         // if (artifiletype == "csv") {
-        // console.log("csv类型");
+        console.log("csv类型");
         let routeData = this.$router.resolve({
           path: "/visi-previewcsv",
           query: {

src/views/modules/visi/design-graph1.vue

@@ -3463,6 +3463,7 @@ export default {
         templateName: "CSVConversionnode",
         inputnodefilemap: [], //引用输入节点的   文件列表，包含文件名和url
         inputnodefilevalue: [], //用户选择的输入节点的文件，存储文件url,后端调用
+        allfilemap: null, //选中的文件对应的名称及url
       },
     });
     //20211012  zhang

static/config/init.js

@@ -6,6 +6,7 @@
     icon: window.SITE_CONFIG.cdnUrl + '/static/img/favicon.ico',
     css: [
       window.SITE_CONFIG.cdnUrl + '/static/css/app.css',
+      window.SITE_CONFIG.cdnUrl + '/static/plugins/previewcsv/heiho.css',
     ],
     js: [
       // 插件, 放置业务之前加载, 以免业务需求依赖插件时, 还未加载出错
@@ -15,6 +16,7 @@
       window.SITE_CONFIG.cdnUrl + '/static/plugins/ueditor-1.4.3.3/ueditor.config.js',
       window.SITE_CONFIG.cdnUrl + '/static/plugins/ueditor-1.4.3.3/ueditor.all.min.js',
       window.SITE_CONFIG.cdnUrl + '/static/plugins/ueditor-1.4.3.3/lang/zh-cn/zh-cn.js',
+      window.SITE_CONFIG.cdnUrl + '/static/plugins/previewcsv/heiho.js',
       // 业务
       window.SITE_CONFIG.cdnUrl + '/static/js/manifest.js',
       // window.SITE_CONFIG.cdnUrl + '/static/js/vendor.js',