| | |
| | | <!-- |
| | | * @Author: 李喆(开发组) lzhe@yxqiche.com |
| | | * @Date: 2025-08-11 09:25:36 |
| | | * @LastEditors: 李喆(开发组) lzhe@yxqiche.com |
| | | * @LastEditTime: 2025-08-12 17:43:58 |
| | | * @FilePath: /mdmweb/src/views/wel/gongkong.vue |
| | | * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |
| | | --> |
| | | <template> |
| | | <div class="gongkongMain"> |
| | | <div> |
| | | <el-tree :props="defaultProps" lazy @node-click="handleNodeClick" :load="treeLoad" node-key="id"/> |
| | | <el-tree :data="treeData" :props="defaultProps" node-key="id" :default-expand-all="false" :default-expanded-keys="defaultKeys" @node-click="handleNodeClick" /> |
| | | </div> |
| | | <div>内容</div> |
| | | <div> |
| | | <el-row> |
| | | <el-col :span="6" style="margin-right: 12px;"> |
| | | <el-input v-model="fileName" clearable placeholder="文件名称"/> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-button type="primary" @click="onQuery">查询</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | <el-table :data="treecFileData" style="width: 100%"> |
| | | <el-table-column prop="name" label="名称" /> |
| | | <el-table-column prop="fileModifyTime" label="创建日期" /> |
| | | <el-table-column prop="fileModifyTime" label="修改日期" /> |
| | | <el-table-column prop="fileSizeDisplay" label="大小" /> |
| | | <el-table-column fixed="right" label="操作" min-width="120"> |
| | | <template #default="scope"> |
| | | <el-button link type="primary" size="small" @click="fileView(scope.row)">查看</el-button> |
| | | <el-button link type="primary" size="small" @click="fileEdit(scope.row)">编辑</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="paginationTree"> |
| | | <el-pagination layout="prev, pager, next" :total="fileTotal" @size-change="sizeChange" @current-change="currentChange" /> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-dialog v-model="fileDialogVisible" :title="fileOptionTitle" width="800"> |
| | | <div><el-input v-model="fileContent" :rows="15" type="textarea" :disabled="fileOptionTitle == '查看'"/></div> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button @click="fileDialogVisible = false">关闭</el-button> |
| | | <el-button type="primary" @click="fileDialogComit" v-if="fileOptionTitle != '查看'">提交</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | | <script> |
| | | export default { |
| | | components: {}, |
| | | data() { |
| | | return { |
| | | defaultKeys: [], |
| | | fileOptionTitle: "", |
| | | fileContent: "", |
| | | fileDialogVisible: false, |
| | | fileName: "", |
| | | treeData: [], |
| | | defaultProps: { |
| | | children: 'children', |
| | | label: 'name', |
| | | isLeaf: (data) => !data.hasChildren |
| | | }, |
| | | treeData: [] |
| | | treeData: [], |
| | | current: 1, |
| | | size: 10, |
| | | fileTotal: 0, |
| | | treecFileData: [], |
| | | TreeNode: {}, |
| | | fileRow: {}, |
| | | } |
| | | }, |
| | | computed: {}, |
| | |
| | | |
| | | }, |
| | | methods: { |
| | | treeLoad (node, resolve) { |
| | | // 如果是根节点(level=0),加载根节点数据 |
| | | const parentId = node.level === 0 ? 0 : node.data.id; |
| | | fileDialogComit() { |
| | | this.loading = true; |
| | | var obj = {parentId} |
| | | axios({ |
| | | url: '/blade-mdm/gkw/node/lazy-list', |
| | | method: 'get', |
| | | params: obj, |
| | | url: '/blade-mdm/gkw/node/file-save', |
| | | method: 'post', |
| | | params: {id:this.fileRow.id,content: this.fileContent}, |
| | | }).then( |
| | | res => { |
| | | resolve(res.data.data); |
| | | this.loading = false; |
| | | this.fileDialogVisible = false; |
| | | this.$message.success("操作成功"); |
| | | } |
| | | ).catch(() => resolve([])); |
| | | ); |
| | | }, |
| | | handleNodeClick(a,b,c,d) { |
| | | console.og(a,b,c,d) |
| | | fileView(row) { |
| | | this.fileOptionTitle = "查看"; |
| | | this.getFileContent(row); |
| | | }, |
| | | fileEdit(row) { |
| | | this.fileOptionTitle = "编辑"; |
| | | this.fileRow = {...row}; |
| | | this.getFileContent(row); |
| | | }, |
| | | getFileContent(row) { |
| | | this.loading = true; |
| | | axios({ |
| | | url: '/blade-mdm/gkw/node/file-content', |
| | | method: 'get', |
| | | params: {id:row.id}, |
| | | }).then( |
| | | res => { |
| | | this.loading = false; |
| | | this.fileDialogVisible = true; |
| | | this.fileContent = res.data.data; |
| | | } |
| | | ); |
| | | }, |
| | | onQuery() { |
| | | this.size = 10; |
| | | this.searchTable(this.TreeNode); |
| | | }, |
| | | sizeChange(size) { |
| | | this.size = size; |
| | | this.treeLoad(this.TreeNode); |
| | | }, |
| | | currentChange(current) { |
| | | this.current = current; |
| | | this.treeLoad(); |
| | | }, |
| | | handleNodeClick(TreeNode,b,c,d) { |
| | | this.fileName = ""; |
| | | this.searchTable(TreeNode); |
| | | }, |
| | | searchTable(TreeNode) { |
| | | this.TreeNode = {...TreeNode}; |
| | | if(TreeNode.dirType == 'SEND' || TreeNode.dirType == 'REC' || TreeNode.dirType == 'TEMP') { |
| | | var obj = { |
| | | name: this.fileName, |
| | | dirType: TreeNode.dirType, |
| | | machineCode: TreeNode.machineCode, |
| | | current: this.current, |
| | | size: this.size |
| | | } |
| | | axios({ |
| | | url: '/blade-mdm/gkw/node/file-page', |
| | | method: 'get', |
| | | params: obj |
| | | }).then( |
| | | res => { |
| | | this.treecFileData = res.data.data.records; |
| | | this.fileTotal = res.data.data.total; |
| | | } |
| | | ) |
| | | }else { |
| | | return; |
| | | } |
| | | }, |
| | | treeLoad () { |
| | | axios({ |
| | | url: '/blade-mdm/gkw/node/load-tree', |
| | | method: 'get', |
| | | }).then( |
| | | res => { |
| | | this.treeData = res.data.data; |
| | | var firstIndex = 0; |
| | | res.data.data.forEach((item,index)=> { |
| | | if(item.children.length != 0) { |
| | | firstIndex = index; |
| | | } |
| | | }) |
| | | //defaultKeys.push(item.id); |
| | | this.defaultKeys = [res.data.data[firstIndex].id]; |
| | | } |
| | | ) |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.treeLoad(); |
| | | } |
| | | }; |
| | | </script> |
| | |
| | | .gongkongMain div:nth-child(2) { |
| | | flex: 1; |
| | | } |
| | | .paginationTree { |
| | | margin-top: 12px; |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | } |
| | | </style> |