导入资源库

src/api/kettle/file.js

@@ -200,6 +200,25 @@ export function getFilextension(data) {
     method: 'post'
   })
 }
+//资源库导入文件
+export function Imptree(data) {
+  return request({
+    url: 'etlweb/repository/imptree',
+    data,
+    method: 'post'
+  })
+}
+
+//导入成功
+export function imp(data) {
+  return request({
+    url: 'etlweb/repository/imp',
+    data,
+    method: 'post'
+  })
+}
+
+
 
 
 

src/views/dialogs-components/global/in-repository/index.js

+import main from './main.vue'
+export default main
\ No newline at end of file

src/views/dialogs-components/global/in-repository/main.vue

+<template>
+  <div>
+    <el-dialog
+      title="请选择导出文件"
+      :visible.sync="inputVisibility"
+      width="650px"
+      :before-close="handleClose">
+      <!-- <span>请输入{{title}}名称：</span> -->
+      <!-- <el-input style="margin-top:15px;" v-model="inputValue" :placeholder="'请输入'+title+'名称'"></el-input> -->
+         <el-upload
+                ref="upload"
+                :limit="1"
+                class="input-length"
+                action="https://jsonplaceholder.typicode.com/posts/"
+                :file-list="fileList"
+                :auto-upload="false"
+              :on-change="handleChange">   
+                <el-button size="small" type="primary">点击上传</el-button>
+              </el-upload>
+        
+
+        <!-- 文件夹存放区域start-->
+      <el-tree
+        :data="impFileList"
+        :auto-expand-parent="true"
+        :default-expand-all="false"
+        node-key="id"
+        ref="tree"
+        :props="defaultProps"
+        :highlight-current="true"
+      show-checkbox
+      v-if="impFileList.length>0" @check-change="getCheckedNodes">
+        <span class="custom-tree-node" slot-scope="{ node, data }">
+          <span style="display: flex; align: center">
+            <div
+              :class="data.iconCls"
+              style="
+                display: inline-block;
+                width: 20px;
+                height: 20px;
+                background-repeat: no-repeat;
+                background-position: center;
+              "
+              width=""
+              alt=""
+            ></div>
+            {{ node.label }}
+          </span>
+        </span>
+      </el-tree>
+      <!-- 文件夹存放区域end -->
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="estabDialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="confirm()">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+
+import {Imptree,imp } from "@/api/kettle/file";
+
+export default {
+  name: "in-repository",
+  data() {
+    return {
+      impFileList:[],//导入的文件列表
+      fileList:[],
+      defaultProps: {
+          label: "text",
+          children: "children",
+      },
+      checkedArr:[],
+      uploadPath:''
+    }
+      
+  },
+  props: {
+    inputVisibility: Boolean,
+    explorer:Function,
+    // listNames: Function, //父传过来的方法
+  },
+  created() {
+    // this.exptree();
+  },
+  methods: {
+    //获取导出资源库树
+    exptree() {
+      let data = new FormData();
+      data.append("loadElement", 3);
+      data.append("node", "root");
+      exptree(data).then((res) => {
+        if (res) {
+          console.log("导出资源库树列表：", res);
+          this.exTreeList = res;
+        } else {
+          this.$message.error(res.errMsg);
+        }
+      });
+    },
+    getCheckedNodes() {
+        console.log('当前勾选的所有数据',this.$refs.tree.getCheckedNodes());
+        var allCheckedsNodes=this.$refs.tree.getCheckedNodes();
+        var checkedNodes=allCheckedsNodes.filter((item)=>{
+          return item.children==null
+          });
+        var checkArr=[];
+        checkedNodes.forEach(element => {
+           var myObj={};
+           myObj.path=element.path;
+           myObj.type=element.type;
+           checkArr.push(myObj);
+        });
+        this.checkedArr=checkArr;
+        console.log('当前选择文件====',this.checkedArr);
+        
+      
+    },
+     // 导入资源库
+     imp(data){
+        var formData = new FormData();
+            formData.append('filePath',this.uploadPath);
+            formData.append('data', JSON.stringify(data));
+            console.log('参数==',formData);
+            imp(formData).then(res=>{
+                if (res) {           
+                    this.$message.success('导入成功！');
+                    this.explorer('');//刷新列表
+                     this.$emit("update:inputVisibility", false);//关闭弹窗
+
+                }else {
+                this.$message.error(res.errMsg)
+                }
+            })
+    },
+
+
+    confirm(){
+       console.log('当前选择文件====',this.checkedArr);
+       this.imp(this.checkedArr);
+    },
+    //导出资源库
+    expRespository() {
+      if(this.checkedArr.length==0){
+        this.$message.error('请先选择要导出文件');
+      }
+      let data = new FormData();
+      
+      data.append("data",JSON.stringify(this.checkedArr) );
+      expRespository(data).then((res) => {
+        if (res) {
+          console.log("导出资源库：", res);
+
+          // var link = document.createElement("a");
+          // link.style.display = "none";
+          // link.href = url;
+          // link.setAttribute("download", "下载名称");
+          // document.body.appendChild(link);
+          // link.click();
+
+          var url=`http://192.168.0.2:9888/ETLWEB-SERVER/etlweb/attachment/download?filePath=${res.message}&remove=true`
+          window.open(url);
+
+        } else {
+          this.$message.error(res.errMsg);
+        }
+      });
+    },
+ 
+    handleClose() {
+      this.$emit("update:inputVisibility", false);
+    },
+    handleChange(file, fileList) {
+       console.log('已经上传的文件==',file);
+       var path=file.name;
+      //  path='H:\\小曾发来的新项目\\kettle\\kettle-webapp\\file_trans1.zip';
+       path="D:\\file\\111.zip";
+       this.uploadPath=path;
+       
+       this.Imptree(path);
+      
+    },
+    // 导入资源库
+     Imptree(path){
+        var formData = new FormData();
+            formData.append('loadElement',3);
+            formData.append('filePath', path);
+            formData.append('node', 'root');
+            console.log('参数==',formData);
+            Imptree(formData).then(res=>{
+                if (res) {           
+                    // this.$message.success('成功！');
+                    this.impFileList=res;
+                    
+                    
+
+                }else {
+                this.$message.error(res.errMsg)
+                }
+            })
+    },
+    
+
+  },
+};
+</script>
+<style>
+.type-checked {
+  background-color: #8888ff;
+  color: #fff;
+}
+</style>
\ No newline at end of file

src/views/kettle/home.vue

@@ -43,7 +43,7 @@
                                     <el-dropdown-item >管理资源库</el-dropdown-item>
                                     <el-dropdown-item >断开资源库</el-dropdown-item>
                                     <el-dropdown-item @click.native="exportTreeDialog()">导出资源库</el-dropdown-item>
-                                    <el-dropdown-item>导入资源库</el-dropdown-item>
+                                    <el-dropdown-item  @click.native="inputResDialog()">导入资源库</el-dropdown-item>
                                 </el-dropdown-menu>
                             </el-dropdown>
                             <el-dropdown                          
@@ -318,6 +318,9 @@
         <createDialog ref="establishDialog"  :estabDialogVisible.sync="estabDialogVisible"  :title="estabTitle" :nodePath="nodePath" :explorer="explorer"></createDialog>
         <export-tree ref="exDialog" :exportDialogVisible.sync="exportDialogVisible"></export-tree>
 
+        <!-- 导出资源库 -->
+        <in-repository :inputVisibility.sync="inputVisibility" :explorer="explorer"></in-repository>
+
     </div>
 </template>
 
@@ -375,6 +378,7 @@ export default {
     },
     data() {
       return {
+          inputVisibility:false,//导入资源库弹窗
           exportDialogVisible:false,//导出资源库弹窗
           curDataBase:null,//当前选择的资源库
           nodePath:'',//当前选中文件夹
@@ -1273,6 +1277,11 @@ export default {
     exportTreeDialog(){
         console.log('导出资源库====');
         this.exportDialogVisible=true;
+    },
+    //导入资源库
+    inputResDialog(){
+        console.log('导入资源库====');
+        this.inputVisibility=true;
     }