From 0e0b14236ad7331aaeab522868ce5b6d2369b27c Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期五, 13 五月 2022 15:08:15 +0800 Subject: [PATCH] Merge branch 'shf' of https://sinanoaq.cn:8888/r/ztqt into shf --- src/views/hiddenDangerTroubleshootingList/index.vue | 179 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 176 insertions(+), 3 deletions(-) diff --git a/src/views/hiddenDangerTroubleshootingList/index.vue b/src/views/hiddenDangerTroubleshootingList/index.vue index 34cd1a0..88dfb61 100644 --- a/src/views/hiddenDangerTroubleshootingList/index.vue +++ b/src/views/hiddenDangerTroubleshootingList/index.vue @@ -1,13 +1,186 @@ <template> - + <div class="whole"> + <div class="left-tree"> + <el-tree + :data="data" + node-key="id" + default-expand-all + @node-drag-start="handleDragStart" + @node-drag-enter="handleDragEnter" + @node-drag-leave="handleDragLeave" + @node-drag-over="handleDragOver" + @node-drag-end="handleDragEnd" + @node-drop="handleDrop" + draggable + :allow-drop="allowDrop" + :allow-drag="allowDrag"> + <span slot-scope="{ node, data }" class="slot-t-node"> + <template> + <i + v-if="data.ChildItems&&data.ChildItems.length" + :class="{ + 'el-icon-folder': !node.expanded, // 节点收缩时的图标 + 'el-icon-folder-opened': node.expanded, // 节点展开时的图标 + }" + style="color: #409eff;" + /> + <i v-else class=" +el-icon-folder-add" style="color: #EC933A;" /> + <span>{{ node.label }}</span> + </template> + </span> + </el-tree> + </div> + <div class="right-table"> + <el-form :model="config" ref="configTableForm"> + <el-table + :data="config.list" + style="width: 100%" + max-height="450"> +<!-- <el-table-column label="查询名">--> +<!-- <template slot-scope="scope">--> +<!-- <el-form-item>--> +<!-- <el-input--> +<!-- v-model.trim="scope.row.value"--> +<!-- size="mini"--> +<!-- placeholder="请填写值"></el-input>--> +<!-- </el-form-item>--> +<!-- </template>--> +<!-- </el-table-column>--> +<!-- <el-table-column label="查询名">--> +<!-- <template slot-scope="scope">--> +<!-- <el-form-item>--> +<!-- <el-input--> +<!-- v-model.trim="scope.row.value"--> +<!-- size="mini"--> +<!-- placeholder="请填写值"></el-input>--> +<!-- </el-form-item>--> +<!-- </template>--> +<!-- </el-table-column>--> + <tr>sssss</tr> + <td>ss</td> + </el-table> + </el-form> + <div class="btns"> +<!-- <el-button--> +<!-- type="primary"--> +<!-- @click="submitConfig('configTableForm')">保存并确定</el-button>--> + </div> + </div> + </div> </template> <script> export default { - name: "index" + name: "index" , + data() { + return { + data: [{ + id: 1, + label: '隐患排查清单', + icon:'el-icon-folder', + children: [{ + id: 4, + label: '现场管理清单', + icon:'el-icon-folder', + }, + { + id: 5, + label: '基础管理清单', + icon:'el-icon-success', + }] + }], + defaultProps: { + children: 'children', + label: 'label' + }, + // 配置列表 + config: { + list: [ + {name: ''} + ] + }, + }; + }, + mounted(){ + this.getAllColumns() + }, + methods: { + handleDragStart(node, ev) { + console.log('drag start', node); + }, + handleDragEnter(draggingNode, dropNode, ev) { + console.log('tree drag enter: ', dropNode.label); + }, + handleDragLeave(draggingNode, dropNode, ev) { + console.log('tree drag leave: ', dropNode.label); + }, + handleDragOver(draggingNode, dropNode, ev) { + console.log('tree drag over: ', dropNode.label); + }, + handleDragEnd(draggingNode, dropNode, dropType, ev) { + console.log('tree drag end: ', dropNode && dropNode.label, dropType); + }, + handleDrop(draggingNode, dropNode, dropType, ev) { + console.log('tree drop: ', dropNode.label, dropType); + }, + allowDrop(draggingNode, dropNode, type) { + if (dropNode.data.label === '二级 3-1') { + return type !== 'inner'; + } else { + return true; + } + }, + allowDrag(draggingNode) { + return draggingNode.data.label.indexOf('三级 3-2-2') === -1; + }, + // 获取表格数据进行渲染 + getAllColumns() { + var data = this.$route.query + }, + } } </script> <style scoped> - +.whole{ + display: flex; +} +.left-tree{ + width: 15%; +} +.left-tree .el-tree{ + background: #f0f6e4; + height: 400px; + overflow-y: scroll; + border: 1px solid #000; +} +/deep/ .is-leaf{ + background: transparent !important; + width: 5px; + height: 5px; + background-size: 100%; + margin-right: 5px; +} +/*/deep/ .el-tree-node__expand-icon{*/ +/* background: url(../../../../assets/shu_ic_wzk.png) no-repeat;*/ +/* width: 5px;*/ +/* height: 5px;*/ +/* background-size: 100%;*/ +/* margin-right: 5px;*/ +/*}*/ +/*/deep/ .expanded{*/ +/* background: url(../../../../assets/shu_ic_zk.png) no-repeat;*/ +/* width: 5px;*/ +/* height: 5px;*/ +/* background-size: 100%;*/ +/* margin-right: 5px;*/ +/* transform: rotate(0deg) !important;*/ +/*}*/ +/deep/ .el-icon-caret-right:before{ + content: ''; +} +.right-table{ + width: 80%; +} </style> -- Gitblit v1.9.2