| | |
| | | <template> |
| | | <el-container> |
| | | |
| | | <el-aside> |
| | | <basic-container> |
| | | <div ref="TreeBox" style="height: calc(100vh - 144px);!important;"> |
| | | <div class="headerCon"> |
| | | <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addClickHandler">创建 |
| | | </el-button> |
| | | <el-button icon="el-icon-edit" plain size="small" type="primary" @click="editClickHandler">修改 |
| | | </el-button> |
| | | <el-button icon="el-icon-delete" plain size="small" type="danger" @click="delClickHandler">删除 |
| | | </el-button> |
| | | <el-button icon="el-icon-download" plain size="small" type="primary" @click="exportClickHandler">导出 |
| | | </el-button> |
| | | <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadClickHandler">导入 |
| | | </el-button> |
| | | <el-button class="smallBtn" plain size="small" type="primary" |
| | | @click="checkViewClickHandler">查看使用范围 |
| | | </el-button> |
| | | </div> |
| | | <div ref="TreeBox" style="height: calc(100vh - 154px);!important;"> |
| | | <!-- 左侧树 --> |
| | | <div style="height: calc(100vh - 280px);"> |
| | | <div style="height: calc(100vh - 190px);"> |
| | | <avue-tree :data="treeData" :option="treeOption" @node-click="nodeClick"> |
| | | <span slot-scope="{ node, data }" class="el-tree-node__label"> |
| | | <span style="font-size: 15px"> |
| | | <i class="el-icon-s-promotion"></i> |
| | | {{ (node || {}).label }} |
| | | </span> |
| | | </span> |
| | | <span slot-scope="{ node, data }" class="el-tree-node__label"> |
| | | <span style="font-size: 15px"> |
| | | <i class="el-icon-s-promotion"></i> |
| | | {{ (node || {}).label }} |
| | | </span> |
| | | </span> |
| | | </avue-tree> |
| | | </div> |
| | | </div> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import {getBizTree} from "@/api/UI/uiDefine"; |
| | | export default { |
| | | name: "index" |
| | | name: "index", |
| | | data:function (){ |
| | | return{ |
| | | treeOption: { |
| | | height: 'auto', |
| | | defaultExpandAll: true, |
| | | menu: false, |
| | | addBtn: false, |
| | | props: { |
| | | label: 'text', |
| | | value: 'oid', |
| | | children: 'children' |
| | | } |
| | | }, |
| | | nodeRow: {}, |
| | | treeData: [], |
| | | } |
| | | }, |
| | | created() { |
| | | this.getTreeList(); |
| | | }, |
| | | methods: { |
| | | //树表查询 |
| | | getTreeList() { |
| | | const loading = this.$loading({}); |
| | | getBizTree().then(res => { |
| | | this.treeData = [res.data.obj]; |
| | | loading.close(); |
| | | }).catch(error => { |
| | | loading.close(); |
| | | }) |
| | | }, |
| | | // 树点击 |
| | | nodeClick(row) { |
| | | if (row.oid) { |
| | | this.nodeRow = row; |
| | | this.getTableList(); |
| | | } |
| | | }, |
| | | getTableList() { |
| | | |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | | |
| | |
| | | .el-scrollbar__wrap { |
| | | overflow: auto !important; |
| | | } |
| | | .headerCon{ |
| | | .el-button{ |
| | | width: 82px; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .headerCon { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | margin-bottom: 5px; |
| | | |
| | | .el-button + .el-button { |
| | | margin-left: 5px; |
| | | } |
| | | |
| | | .el-button { |
| | | margin-top: 5px; |
| | | } |
| | | } |
| | | |
| | | .headerCon > .el-button:nth-child(4) { |
| | | margin-left: 0; |
| | | } |
| | | |
| | | .headerCon > .el-button:nth-child(7) { |
| | | margin-left: 0; |
| | | } |
| | | |
| | | |
| | | .smallBtn { |
| | | width: 82px; |
| | | text-align: center; |
| | | padding-left: 4.5px; |
| | | } |
| | | |
| | | </style> |
| | |
| | | |
| | | <script> |
| | | import basicOption from "@/util/basic-option"; |
| | | import { |
| | | cloneUIContextData, |
| | | delUIContextData, expUIContextData, |
| | | getBizTree, getExpContextTree, |
| | | gridUIContextData, |
| | | saveUIContextData, |
| | | updateUIContextData |
| | | } from "@/api/UI/uiDefine"; |
| | | import { delUIContextData, getBizTree, gridUIContextData} from "@/api/UI/uiDefine"; |
| | | import func from "@/util/func"; |
| | | import actionDialog from "@/views/modelingMenu/ui/Aciton/dialog" |
| | | |
| | |
| | | }, |
| | | nodeRow: {}, |
| | | treeData: [], |
| | | searchParams: { |
| | | }, |
| | | searchParams: {}, |
| | | tableLoading: false, |
| | | selectList: [], |
| | | option: { |
| | |
| | | class="avue-dialog" |
| | | width="1400px" |
| | | @close="cancelDialog"> |
| | | <el-container> |
| | | <el-container style="height: 580px;"> |
| | | <el-aside> |
| | | <basic-container> |
| | | <basic-container style="height: 560px;"> |
| | | <!-- 左侧树 --> |
| | | <div style="height: 200px;"> |
| | | <div style="height: 520px;"> |
| | | <avue-tree |
| | | ref="tree" |
| | | v-model="treeForm" |
| | |
| | | </el-aside> |
| | | |
| | | <el-main> |
| | | <basic-container> |
| | | <basic-container style="height: 560px;"> |
| | | <div> |
| | | <avue-crud |
| | | ref="crud" |
| | |
| | | option: { |
| | | ...basicOption, |
| | | addBtn: false, |
| | | height: 200, |
| | | height: 420, |
| | | highlightCurrentRow: true, |
| | | menu:false, |
| | | column: [ |