mj_firm_former/src/views/infosManage/externalFiles/externalFiles.vue

<template>
  <ibps-layout ref="layout">
    <!-- 外部 -->
    <div slot="west">
      <div class="box">
        <p class="title">文件类型</p>
        <el-input placeholder="输入关键字进行过滤"
                  v-model="filterText">
        </el-input>
        <el-tree ref="tree"
                 :width="width"
                 :data="typeData"
                 :props="defaultProps"
                 @node-click="handleNodeClick"
                 :filter-node-method="filterNode"></el-tree>
      </div>
      <ibps-container :margin-left="width + 'px'"
                      class="page">
        <el-alert v-if="!show"
                  :closable="false"
                  title="请选择左边菜单右键进行操作！"
                  type="warning"
                  show-icon
                  style="height:50px;" />
        <template v-else>
          <ibps-crud key="istree"
                     ref="crud"
                     :data="listData"
                     :toolbars="listConfig.toolbars"
                     :search-form="listConfig.searchForm"
                     :pk-key="pkKey"
                     :columns="listConfig.columns"
                     :loading="loading"
                     :pagination="pagination"
                     @sort-change="handleSortChange"
                     @action-event="handleAction"
                     @pagination-change="handlePaginationChange">
            <template slot="wenjinachayue"
                      slot-scope="scope">
              <ibps-attachment :value="scope.row.wen_jian_id_"
                               readonly
                               allow-download
                               :download="false" />
            </template>
          </ibps-crud>
        </template>
      </ibps-container>

    </div>
  </ibps-layout>
</template>
<script>
import ActionUtils from '@/utils/action'
import { getFileType, getFileByUserId } from '@/api/permission/file'
import IbpsAttachment from '@/business/platform/file/attachment/selector'
import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
export default {
  components: {
    'ibps-attachment': IbpsAttachment
  },
  data() {
    return {
      show: '',
      rightsArr: ['join', 'delete'],
      rowHandle: true,
      width: 230,
      orgId: '',
      oldorgId: '',
      orgName: '',
      loading: false,
      typeData: [
        // { id: '0', label: 'CNAS相关文件' },
        // { id: '1', label: 'CMA相关文件' },
        // { id: '2', label: '法律法规' },
        // { id: '3', label: '检测标准' },
        // { id: '4', label: '设备说明书' },
        // { id: '5', label: '试剂耗材说明书' },
        // { id: '6', label: '标准物质证书' },
        // { id: '7', label: '参考技术文献（受限）' },
        // { id: '8', label: '客户技术资料（受限）' },
      ],
      filterText: '',
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      pkKey: 'id', // 主键  如果主键不是pk需要传主键
      loading: false,
      listData: [],
      selectListData: [],
      listTreeData: [],
      bianlistData: {
        dataResult: [],
        pageResult: {
          limit: 0,
          page: 0,
          totalCount: 0,
          totalPages: 0
        }
      },
      listConfig: {
        // 工具栏
        toolbars: [
          { key: 'search' }
        ],
        // 查询条件
        searchForm: {
          forms: [
            { prop: 'fileCode', label: '文件编号' },
            { prop: 'fileName', label: '文件名称' },
            // { prop: 'deptName', label: '部门' },
          ]
        },
        // 表格字段配置
        columns: [
          // { prop: 'zi_duan_yi_', label: '部门' },
          { prop: 'wen_jian_bian_hao', label: '文件编号', sortable: 'custom', width: 150 },
          { prop: 'wen_jian_ming_che', label: '文件名称', width: 400 },
          { prop: 'ban_ben_hao_', label: '版本号', sortable: 'custom', width: 100 },
          { prop: 'fa_bu_ri_qi_', label: '发放日期', sortable: 'custom', width: 100 },
          { prop: 'wen_jian_id_', label: '查阅', slotName: "wenjinachayue", width: 400 }
        ]
      },
      listOptions: {
        border: true,
        stripe: true
      },
      pagination: {
        limit: 20, page: 1
      },
      sorts: {},
      // testData: [{
      //     zi_duan_yi_: '1',
      //     wen_jian_bian_hao: '2',
      //     wen_jian_ming_che: '3',
      //     ban_ben_hao_: '4',
      //     fa_bu_ri_qi_: '5',
      //     wen_jian_id_: '880481571788816384'
      // }]
    }
  },
  mounted() {
    this.getType()
  },
  methods: {
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    loadNode() {
      this.loading = true
    },
    getType() {
      let sql = `select * FROM t_skwjlxpzb WHERE wen_jian_lei_xing = '外部文件' order by pai_lie_shun_xu_ asc`
      curdPost('sql', sql).then(res => {
        let typeDatas = res.variables.data
        for (var i of typeDatas) {
          let type = {}
          type.id = i.pai_lie_shun_xu_
          type.label = i.wen_jian_xi_lei_
          this.typeData.push(type)
        }
      })
    },
    getDatas(sorts) {
      this.listData = []
      let wheres = ''
      let sql = ''
      if (sorts.fileCode) {
        wheres = wheres + ` and wj.wen_jian_bian_hao like '%${sorts.fileCode}%'`
      }

      if (sorts.fileType) {
        wheres = wheres + ` and wj.wen_jian_lie_xing = '${sorts.fileType}'`
      }
      if (sorts.fileName) {
        wheres = wheres + ` and wj.wen_jian_ming_che like '%${sorts.fileName}%'`
      }
      if (sorts.sorts) {
        if (JSON.stringify(sorts.sorts) !== "{}") {
          wheres = wheres + ` order by SUBSTRING_INDEX(SUBSTRING_INDEX(${Object.keys(sorts.sorts)}, '.', 1), '-', -1)*1 ${Object.values(sorts.sorts)}, 
            SUBSTRING_INDEX(SUBSTRING_INDEX(${Object.keys(sorts.sorts)}, '.', -1), '-', 1)*1 ${Object.values(sorts.sorts)},
            SUBSTRING_INDEX(${Object.keys(sorts.sorts)}, '-', -1)*1 ${Object.values(sorts.sorts)}`
        }
      }
      if (sorts.fileType == '参考技术文献（受限）' || sorts.fileType == '客户技术资料（受限）') {
        sql = `select  wj.wen_jian_bian_hao,wj.wen_jian_ming_che,wj.ban_ben_hao_,wj.wen_jian_id_,wj.fa_bu_ri_qi_ FROM  t_wjcysqb qx 
      LEFT JOIN t_wjgl wj ON qx.wen_jian_id_=wj.id_ WHERE qx.yong_hu_id_='${sorts.userId}' ${wheres}`
      } else {
        sql = `select wj.* FROM t_wjgl wj WHERE wj.wen_jian_zhuang_t = '已发放' AND wj.yi_gai_zuo_fei_ = '否' ${wheres}`
      }
      // 重复发放的文件，在权限表会存在重复的文件信息
      curdPost('sql', sql).then(res => {
        let tableDatas = res.variables.data
        this.selectListData = JSON.parse(JSON.stringify(tableDatas))
        let filterDatas = []
        this.bianlistData.pageResult.totalCount = tableDatas.length
        this.bianlistData.pageResult.totalPages = Math.ceil(tableDatas.length / this.pagination.limit)
        this.bianlistData.pageResult.limit = this.pagination.limit
        this.bianlistData.pageResult.page = this.pagination.page
        if (this.pagination.limit > tableDatas.length) {
          filterDatas = JSON.parse(JSON.stringify(tableDatas))
        } else {
          for (let index = 0; index < 20; index++) {
            filterDatas.push(tableDatas[index])
          }
        }
        this.bianlistData.dataResult = filterDatas
        ActionUtils.handleListData(this, this.bianlistData)
      }).catch(res => {
        this.loading = false
        this.listData = []
      })
    },
    refreshData() {
      this.listData = []
      this.getDatas(this.getSearcFormData())
    },

    /**
    * 处理排序
    */
    handleSortChange(sort) {
      ActionUtils.setSorts(this.sorts, sort)
      this.getDatas(this.getSearcFormData())
    },

    handleNodeClick(data) {
      this.oldorgId = data
      this.show = 'detail'
      ActionUtils.setPagination(this.pagination, { limit: 20, page: 1 })
      if (this.oldorgId == data.id) {
        return
      } else {
        this.getDatas({
          fileType: data.label,
          userId: this.$store.getters.userInfo.employee.id,
          sorts: { 'wen_jian_bian_hao': 'desc' }
        })
      }
    },


    /**
      * 获取格式化参数
      */
    getSearcFormData() {
      const params = this.$refs['crud'] ? this.$refs['crud'].getSearcFormData() : {}
      params['fileType'] = this.oldorgId.label
      params['userId'] = this.$store.getters.userInfo.employee.id
      params['sorts'] = this.sorts
      return params
    },
    // 处理分页事件
    handlePaginationChange(page) {
      ActionUtils.setPagination(this.pagination, page)
      this.bianlistData.pageResult.limit = page.limit
      this.bianlistData.pageResult.page = page.page
      let filterDatas = []
      if (this.selectListData.length >= (page.limit * page.page)) {
        for (let index = (page.limit * page.page) - page.limit; index < (page.limit * page.page); index++) {
          filterDatas.push(this.selectListData[index])
        }
        this.bianlistData.dataResult = JSON.parse(JSON.stringify(filterDatas))
      } else {
        for (let index = (page.limit * page.page) - page.limit; index < this.selectListData.length; index++) {
          filterDatas.push(this.selectListData[index])
        }
        this.bianlistData.dataResult = JSON.parse(JSON.stringify(filterDatas))
      }
      ActionUtils.handleListData(this, this.bianlistData)
    },
    /**
     * 处理按钮事件
     */
    handleAction(command, position, selection, data) {
      switch (command) {
        case 'search':// 查询
          this.refreshData()
          break
        default:
          break
      }
    },

  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    }
  },
}
</script>
<style lang="less" scoped>
.box {
  width: 230px;
}

.title {
  font-size: 14px;
  margin: 21px 5px 5px;
  padding: 0;
}

/deep/ .el-tree-node__content {
  display: block;
}
</style>