internalFiles.vue 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  1. <template>
  2. <ibps-layout ref="layout">
  3. <!-- 外部 -->
  4. <div slot="west">
  5. <div class="box">
  6. <p class="title">文件类型</p>
  7. <el-input placeholder="输入关键字进行过滤" v-model="filterText">
  8. </el-input>
  9. <div class="treeDiv">
  10. <el-tree ref="tree" :data="typeData" :props="defaultProps" @node-click="handleNodeClick"
  11. :filter-node-method="filterNode"></el-tree>
  12. </div>
  13. </div>
  14. <ibps-container :margin-left="width + 'px'" class="page">
  15. <el-alert v-if="!show" :closable="false" title="请选择左边菜单右键进行操作!" type="warning" show-icon
  16. style="height:50px;" />
  17. <template v-else>
  18. <ibps-crud key="istree" ref="crud" :data="tableData" :toolbars="listConfig.toolbars"
  19. :search-form="listConfig.searchForm" :pk-key="pkKey" :columns="listConfig.columns"
  20. :loading="loading" @action-event="handleAction">
  21. <template slot="wenjinachayue" slot-scope="scope">
  22. <ibps-attachment :value="scope.row.zi_duan_er_" readonly allow-download :download="false" />
  23. </template>
  24. </ibps-crud>
  25. </template>
  26. </ibps-container>
  27. </div>
  28. </ibps-layout>
  29. </template>
  30. <script>
  31. import ActionUtils from '@/utils/action'
  32. // import { getFileType, getFileByUserId } from '@/api/permission/file'
  33. import IbpsAttachment from '@/business/platform/file/attachment/selector'
  34. export default {
  35. components: {
  36. 'ibps-attachment': IbpsAttachment
  37. },
  38. data() {
  39. return {
  40. show: '',
  41. rightsArr: ['join', 'delete'],
  42. rowHandle: true,
  43. width: 230,
  44. orgId: '',
  45. oldorgId: '',
  46. orgName: '',
  47. loading: false,
  48. typeData: [
  49. { id: '0', label: '质量管理手册(QM)' },
  50. { id: '1', label: '程序文件(QP)' },
  51. { id: '2', label: '生物安全手册(SWAQ)[限]' },
  52. { id: '3', label: '行政管理制度(ZD)[限]' },
  53. { id: '4', label: '检测类(JC-SOP)[限]' },
  54. { id: '5', label: '仪器设备类(YQ-SOP)[限]' },
  55. { id: '6', label: '期间核查类(HC-SOP)[限]' },
  56. { id: '7', label: '环境设施类(HJ-SOP)[限]' },
  57. { id: '8', label: '质量或技术管理类(ZQ-SOP)[限]' },
  58. { id: '9', label: '技术记录表(FQ)' },
  59. { id: '10', label: '管理记录表(FQ)' }
  60. ],
  61. filterText: '',
  62. defaultProps: {
  63. children: 'children',
  64. label: 'label'
  65. },
  66. pkKey: 'id', // 主键 如果主键不是pk需要传主键
  67. loading: false,
  68. tableData: [],
  69. listTreeData: [],
  70. listConfig: {
  71. // 工具栏
  72. toolbars: [
  73. { key: 'search' }
  74. ],
  75. // 查询条件
  76. searchForm: {
  77. forms: [
  78. { prop: 'fileCode', label: '文件编号' },
  79. { prop: 'fileName', label: '文件名称' },
  80. // { prop: 'deptName', label: '部门' },
  81. ]
  82. },
  83. // 表格字段配置
  84. columns: [
  85. // { prop: 'zi_duan_yi_', label: '部门' },
  86. { prop: 'wen_jian_bian_hao', label: '文件编号' },
  87. { prop: 'wen_jian_ming_che', label: '文件名称' },
  88. { prop: 'ban_ben_hao_', label: '版本号' },
  89. { prop: 'fa_bu_ri_qi_', label: '发布日期' },
  90. { prop: 'zi_duan_er_', label: '查阅', slotName: "wenjinachayue" }
  91. ]
  92. },
  93. listOptions: {
  94. border: true,
  95. stripe: true
  96. },
  97. pagination: {},
  98. sorts: {},
  99. // testData: [{
  100. // zi_duan_yi_: '1',
  101. // wen_jian_bian_hao: '2',
  102. // wen_jian_ming_che: '3',
  103. // ban_ben_hao_: '4',
  104. // fa_bu_ri_qi_: '5',
  105. // zi_duan_er_: '880481571788816384'
  106. // }]
  107. }
  108. },
  109. mounted() {
  110. // this.loadNode()
  111. },
  112. methods: {
  113. filterNode(value, data) {
  114. if (!value) return true;
  115. return data.label.indexOf(value) !== -1;
  116. },
  117. loadNode() {
  118. this.loading = true
  119. // getFileType("内部文件").then(res => {
  120. // this.loading = false
  121. // for (let i in res.variables.data) {
  122. // let data = {}
  123. // data["id"] = i
  124. // data["label"] = res.variables.data[i]
  125. // this.typeData.push(data)
  126. // }
  127. // }).catch(res => {
  128. // this.loading = false
  129. // })
  130. },
  131. refreshData() {
  132. this.tableData = []
  133. getFileByUserId(this.getSearcFormData()).then(res => {
  134. this.tableData = res.variables.data
  135. }).catch(res => {
  136. this.loading = false
  137. this.tableData = []
  138. })
  139. },
  140. handleNodeClick(data) {
  141. this.show = 'detail'
  142. if (this.oldorgId == data.id) {
  143. return
  144. } else {
  145. getFileByUserId({
  146. deptName: "",
  147. fileCode: "",
  148. fileName: "",
  149. fileType: data.label,
  150. userId: this.$store.getters.userInfo.employee.id
  151. }).then(res => {
  152. this.oldorgId = data.id
  153. this.tableData = res.variables.data
  154. }).catch(res => {
  155. this.loading = false
  156. this.tableData = []
  157. })
  158. }
  159. },
  160. /**
  161. * 获取格式化参数
  162. */
  163. getSearcFormData() {
  164. const params = this.$refs['crud'] ? this.$refs['crud'].getSearcFormData() : {}
  165. params['fileType'] = this.typeData[this.oldorgId].label
  166. params['userId'] = this.$store.getters.userInfo.employee.id
  167. return params
  168. },
  169. /**
  170. * 处理按钮事件
  171. */
  172. handleAction(command, position, selection, data) {
  173. switch (command) {
  174. case 'search':// 查询
  175. this.refreshData()
  176. break
  177. default:
  178. break
  179. }
  180. },
  181. },
  182. watch: {
  183. filterText(val) {
  184. this.$refs.tree.filter(val);
  185. }
  186. },
  187. }
  188. </script>
  189. <style lang="less" scoped>
  190. .box {
  191. width: 230px;
  192. }
  193. .title {
  194. font-size: 14px;
  195. margin: 21px 5px 5px;
  196. padding: 0;
  197. }
  198. .treeDiv {
  199. height: 800px;
  200. overflow-y: auto;
  201. }
  202. /deep/ .el-tree-node__content {
  203. display: block;
  204. }
  205. </style>