feat(文档管理): 添加文档工作区和个人文档标签页，优化文件预览功能

src/components/addDoc/file-edit.vue

@@ -12,6 +12,15 @@
     :maxable="true"
     :resizable="true"
   >
+    <el-tabs
+      v-model="activeName"
+      type="card"
+      @tab-click="handleClick"
+      style="margin-bottom: 10px"
+    >
+      <el-tab-pane label="文档工作区" name="1"></el-tab-pane>
+      <el-tab-pane label="个人文档" name="2"></el-tab-pane>
+    </el-tabs>
     <el-form ref="form" :model="form" :rules="rules" label-width="82px">
       <el-row :gutter="15">
         <el-col :span="24">
@@ -139,6 +148,7 @@
         fileType: 0
       };
       return {
+        activeName: '1',
         rules: {
           businessCodeId: [
             { required: true, message: '请选择', trigger: 'blur' }
@@ -149,6 +159,8 @@
         },
         templateVisible: false,
         folderList: [],
+        allFolderList: [],
+        myFolderList: [],
         list: [],
         options: [],
         defaultForm,
@@ -172,19 +184,34 @@
       ...mapGetters(['user'])
     },
     async created() {
-      let query = {
+      this.allFolderList = await getDocTreeListAPI({
         type: 0,
         currentUserId: this.user.info.userId
-      };
-      this.folderList = await getDocTreeListAPI(query);
+      });
+      this.myFolderList = await getDocTreeListAPI({
+        type: 1,
+        currentUserId: this.user.info.userId
+      });
+      this.folderList = this.allFolderList;
       setFolderList(this.folderList); //权限过滤
     },
     methods: {
+      handleClick() {
+        this.form.directoryId = '';
+        this.form.businessCodeId = '';
+        this.form.codeType = '';
+        if (this.activeName == 2) {
+          this.folderList = this.myFolderList;
+        } else {
+          this.folderList = this.allFolderList;
+        }
+      },
       async getTreeCode() {
         let nodeData = {};
         await this.$nextTick(() => {
           // console.log(this.$refs,'this.$refs')
-          nodeData = this.$refs.cascaderRef&&this.$refs.cascaderRef.getCheckedNodes();
+          nodeData =
+            this.$refs.cascaderRef && this.$refs.cascaderRef.getCheckedNodes();
         });
         this.nodeData = {
           id: nodeData[0]?.data?.id,
@@ -222,13 +249,16 @@
         });
       },
       async typeChange(val) {
-        let data = await listParentId({
+        let obj = {
           pageNum: 1,
           size: 100,
-          parentId: val,
-          objId: this.nodeData?.id,
-          objParentId: this.nodeData?.parentId
-        });
+          parentId: val
+        };
+        if (this.activeName == 1) {
+          obj['objId'] = this.nodeData?.id;
+          obj['objParentId'] = this.nodeData?.parentId;
+        }
+        let data = await listParentId(obj);
         this.options = data.list.filter((item) => item.type == 2);
         this.form.businessCodeId = '';
       },
@@ -244,10 +274,12 @@
             return false;
           }
 
-          const data = {
+          let data = {
             ...this.form
           };
-
+          if (this.activeName == 2) {
+            data.fileType = 1;
+          }
           this.loading = true;
           fileSaveAPI(data)
             .then((msg) => {

src/components/addDoc/file-table-listTemplate.vue

@@ -29,6 +29,7 @@
 <script>
   import { filePageAPI } from './api';
   import browse from './browse.vue';
+  import { setFileUrl } from './util.js';
 
   export default {
     components: { browse },
@@ -193,7 +194,7 @@
       },
 
       browseOpen(row) {
-        this.$refs.browseRef.open(row);
+        window.open(setFileUrl(row));
       },
       getTableList() {
         return JSON.parse(JSON.stringify(this.selection));

src/components/addDoc/getCode.vue

@@ -119,7 +119,7 @@
         this.form.type1 = '';
       },
       async type1Change(val) {
-        this.form.code = await getCode(val);
+        // this.form.code = await getCode(val);
       },
       /* 保存编辑 */
       save() {

src/components/addDoc/main.vue

@@ -63,7 +63,7 @@
       custom-class="ele-dialog-form"
       append-to-body
       :maxable="true"
-    :resizable="true"
+      :resizable="true"
     >
       <doc_template
         :disabledTableList="tableList"
@@ -79,140 +79,141 @@
 </template>
 
 <script>
-import doc_template from './doc_template.vue';
-import fileEdit from './file-edit.vue';
-import browse from './browse.vue';
-import { queryIds } from './api';
+  import doc_template from './doc_template.vue';
+  import fileEdit from './file-edit.vue';
+  import browse from './browse.vue';
+  import { queryIds } from './api';
+  import { setFileUrl } from './util.js';
 
-export default {
-  components: { doc_template, fileEdit, browse },
+  export default {
+    components: { doc_template, fileEdit, browse },
 
-  data() {
-    return {
-      fileId: [],
-      fileShow: false,
-      showEditFlag: false,
-      tableList: [],
-      type: 'add',
-      columns: [
-        {
-          label: '编码',
-          prop: 'code',
-          width: 180,
-          align: 'center',
-          showOverflowTooltip: true
-        },
-        {
-          prop: 'name',
-          label: '文档名称',
-          align: 'center',
-          slot: 'name',
-          showOverflowTooltip: true,
-          minWidth: 200
-        },
-        {
-          prop: 'storagePath',
-          label: '文件名称',
-          align: 'center',
+    data() {
+      return {
+        fileId: [],
+        fileShow: false,
+        showEditFlag: false,
+        tableList: [],
+        type: 'add',
+        columns: [
+          {
+            label: '编码',
+            prop: 'code',
+            width: 180,
+            align: 'center',
+            showOverflowTooltip: true
+          },
+          {
+            prop: 'name',
+            label: '文档名称',
+            align: 'center',
+            slot: 'name',
+            showOverflowTooltip: true,
+            minWidth: 200
+          },
+          {
+            prop: 'storagePath',
+            label: '文件名称',
+            align: 'center',
 
-          showOverflowTooltip: true,
-          minWidth: 200,
-          formatter: (_row, _column, cellValue) => {
-            return cellValue && cellValue[0]?.name;
-          }
-        },
-        {
-          prop: 'version',
-          label: '版本',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 100
-        },
+            showOverflowTooltip: true,
+            minWidth: 200,
+            formatter: (_row, _column, cellValue) => {
+              return cellValue && cellValue[0]?.name;
+            }
+          },
+          {
+            prop: 'version',
+            label: '版本',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 100
+          },
 
-        {
-          prop: 'createUserName',
-          label: '创建人',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 100
-        },
-        {
-          prop: 'createTime',
-          label: '创建时间',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 160
-        },
+          {
+            prop: 'createUserName',
+            label: '创建人',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 100
+          },
+          {
+            prop: 'createTime',
+            label: '创建时间',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 160
+          },
 
-        {
-          prop: 'sizeUnit',
-          label: '文档大小',
-          align: 'center',
-          showOverflowTooltip: true,
-          minWidth: 100
-        },
+          {
+            prop: 'sizeUnit',
+            label: '文档大小',
+            align: 'center',
+            showOverflowTooltip: true,
+            minWidth: 100
+          },
 
-        {
-          columnKey: 'action',
-          label: '操作',
-          width: 200,
-          align: 'center',
-          resizable: false,
-          slot: 'action',
-          showOverflowTooltip: true
-        }
-      ]
-    };
-  },
-  created() {},
-
-  methods: {
-    open(fileId, type) {
-      //查看详情:view 新增:add
-      this.showEditFlag = true;
-      this.fileId = fileId || [];
-      if (type) {
-        this.type = type;
-      }
-      this.init();
-    },
-    fileEditOpen() {
-      this.$refs.fileEditRef.open();
-    },
-    remove(row) {
-      this.tableList = this.tableList.filter((item) => item.code != row.code);
-      this.fileId = this.tableList.map((item) => item.id);
-    },
-    async init() {
-      if (this.fileId.length > 0) {
-        this.tableList = await queryIds({ ids: "'" + this.fileId + "'" });
-      } else {
-        this.tableList = [];
-      }
-    },
-    done(id) {
-      this.fileId.push(...id);
-      this.init();
-    },
-    browseOpen(row) {
-      this.$refs.browseRef.open(row);
-    },
-    addFile() {
-      this.$emit(
-        'success',
-        this.tableList.map((item) => item.id)
-      );
-      this.showEditFlag = false;
+          {
+            columnKey: 'action',
+            label: '操作',
+            width: 200,
+            align: 'center',
+            resizable: false,
+            slot: 'action',
+            showOverflowTooltip: true
+          }
+        ]
+      };
     },
-    addTemplate() {
-      let list = this.$refs.doc_templateRef.getTableList();
-      this.fileShow = false;
-      if (list.length == 0) {
-        this.$message.error('请选择一条数据');
-        return;
+    created() {},
+
+    methods: {
+      open(fileId, type) {
+        //查看详情:view 新增:add
+        this.showEditFlag = true;
+        this.fileId = fileId || [];
+        if (type) {
+          this.type = type;
+        }
+        this.init();
+      },
+      fileEditOpen() {
+        this.$refs.fileEditRef.open();
+      },
+      remove(row) {
+        this.tableList = this.tableList.filter((item) => item.code != row.code);
+        this.fileId = this.tableList.map((item) => item.id);
+      },
+      async init() {
+        if (this.fileId.length > 0) {
+          this.tableList = await queryIds({ ids: "'" + this.fileId + "'" });
+        } else {
+          this.tableList = [];
+        }
+      },
+      done(id) {
+        this.fileId.push(...id);
+        this.init();
+      },
+      browseOpen(row) {
+        window.open(setFileUrl(row));
+      },
+      addFile() {
+        this.$emit(
+          'success',
+          this.tableList.map((item) => item.id)
+        );
+        this.showEditFlag = false;
+      },
+      addTemplate() {
+        let list = this.$refs.doc_templateRef.getTableList();
+        this.fileShow = false;
+        if (list.length == 0) {
+          this.$message.error('请选择一条数据');
+          return;
+        }
+        this.tableList.push(...list);
       }
-      this.tableList.push(...list);
     }
-  }
-};
+  };
 </script>

src/components/addDoc/util.js

@@ -1,65 +1,122 @@
 import store from '@/store';
-const userId = store.state.user?.info?.userId
-const userName = store.state.user?.info?.name
+const userId = store.state.user?.info?.userId;
+const userName = store.state.user?.info?.name;
 export function isPower(data = {}, power, selection = []) {
-
-    if (power == 'add' && data.userAuthority.length == 0) { //文件夹默认开放新增权限
-        return true
-    }
-    if (!data?.id && selection.length == 0) {
-        return false
-
-    }
-    if (power == 'checkEnter' && data?.checkOutUserId != userId) { //检入特殊处理
-        return false
-    }
-    if (selection.length > 0) { //多选情况处理
-        let isPower = true
-        let userAuthorityS = []
-        let createUserIdS = selection.map(item => item.createUserId).filter(createUserId => createUserId == userId)
-        if (createUserIdS.length == selection.length || userName == 'admin') {
-            return true
-        }
-        selection.forEach(val => {
-            const powerObj = val.userAuthority.find(item => item.id == userId)
-            if (powerObj) {
-                userAuthorityS.push(powerObj)
-            }
-        })
-
-        if (userAuthorityS.length == 0) {
-            isPower = false
-        }
-        userAuthorityS.forEach(item => {
-            if (item[power] != '1') {
-                isPower = false
-            }
-        })
-        return isPower
+  if (power == 'add' && data.userAuthority.length == 0) {
+    //文件夹默认开放新增权限
+    return true;
+  }
+  if (!data?.id && selection.length == 0) {
+    return false;
+  }
+  if (power == 'checkEnter' && data?.checkOutUserId != userId) {
+    //检入特殊处理
+    return false;
+  }
+  if (selection.length > 0) {
+    //多选情况处理
+    let isPower = true;
+    let userAuthorityS = [];
+    let createUserIdS = selection
+      .map((item) => item.createUserId)
+      .filter((createUserId) => createUserId == userId);
+    if (createUserIdS.length == selection.length || userName == 'admin') {
+      return true;
     }
+    selection.forEach((val) => {
+      const powerObj = val.userAuthority.find((item) => item.id == userId);
+      if (powerObj) {
+        userAuthorityS.push(powerObj);
+      }
+    });
 
-    if (data.createUserId == userId || userName == 'admin') { //创建人/admin所有权限
-        return true
-    }
-    if (!power) {
-        return false
+    if (userAuthorityS.length == 0) {
+      isPower = false;
     }
-    const powerObj = data.userAuthority.find(item => item.id == userId)
-    if (powerObj) {
+    userAuthorityS.forEach((item) => {
+      if (item[power] != '1') {
+        isPower = false;
+      }
+    });
+    return isPower;
+  }
 
-        return powerObj[power] == '1'
-    }
+  if (data.createUserId == userId || userName == 'admin') {
+    //创建人/admin所有权限
+    return true;
+  }
+  if (!power) {
+    return false;
+  }
+  const powerObj = data.userAuthority.find((item) => item.id == userId);
+  if (powerObj) {
+    return powerObj[power] == '1';
+  }
 }
-
-export function setFolderList(data) { //递归过滤文件夹权限
-    data.forEach((item) => {
-        item['disabled'] = !isPower(item, 'add');
-        if (item.sonDirectoryList && item.sonDirectoryList.length > 0) {
-            setFolderList(item.sonDirectoryList);
-        }
-    });
+export function setFileUrl(row) {
+  let file = row.storagePath[0];
+  let fileNames = file.storePath.split('/');
+  let url =
+    window.location.origin +
+    '/api/main/file/getFile?objectName=' +
+    file.storePath +
+    '&fullfilename=' +
+    fileNames[fileNames.length - 1];
+  return '/kkfile/onlinePreview?url=' + btoa(url);
+}
+export function setFolderList(data) {
+  //递归过滤文件夹权限
+  data.forEach((item) => {
+    item['disabled'] = !isPower(item, 'add');
+    if (item.sonDirectoryList && item.sonDirectoryList.length > 0) {
+      setFolderList(item.sonDirectoryList);
+    }
+  });
 }
 //新迪预览工具支持的文件格式
 export function getFileType() {
-    return ['par', 'asm', 'psm', 'dft', 'sldprt', 'sldasm', 'ipt', 'iam', 'prt', '3dxml', 'CATPart', 'CATProduct', 'cgr', 'model', 'exp', 'session', 'x_t', 'xmt_txt', 'x_b', 'xmp_bin', 'xmp_txt', 'sat', 'sab', 'igs', 'iges', 'stp', 'step', 'jt', 'xcgm', '3dm', 'stl', 'obj', '3mf', 'fbx', 'vda', 'dxf', 'dwg', 'pdf', 'idf', 'idb', 'emn', 'brd']
-}
+  return [
+    'par',
+    'asm',
+    'psm',
+    'dft',
+    'sldprt',
+    'sldasm',
+    'ipt',
+    'iam',
+    'prt',
+    '3dxml',
+    'CATPart',
+    'CATProduct',
+    'cgr',
+    'model',
+    'exp',
+    'session',
+    'x_t',
+    'xmt_txt',
+    'x_b',
+    'xmp_bin',
+    'xmp_txt',
+    'sat',
+    'sab',
+    'igs',
+    'iges',
+    'stp',
+    'step',
+    'jt',
+    'xcgm',
+    '3dm',
+    'stl',
+    'obj',
+    '3mf',
+    'fbx',
+    'vda',
+    'dxf',
+    'dwg',
+    'pdf',
+    'idf',
+    'idb',
+    'emn',
+    'brd'
+  ];
+}