| | |
| | | <template> |
| | | <el-container> |
| | | <el-header class="businessHeader" style="height: 40px;padding:0 8px"> |
| | | <div> |
| | | <el-button v-if="permissionList.addBtn" icon="el-icon-plus" size="small" type="primary" @click="businessAdd" plain> |
| | | 新增 |
| | | </el-button> |
| | | <el-button v-if="permissionList.editBtn" icon="el-icon-edit" size="small" type="primary" @click="businessEdit" plain> |
| | | 修改 |
| | | </el-button> |
| | | <el-button v-if="permissionList.table" icon="el-icon-thumb" size="small" type="primary" |
| | | @click="selectFromTable" plain> 从已有中获取 |
| | | </el-button> |
| | | </div> |
| | | </el-header> |
| | | <!-- <el-header class="businessHeader" style="height: 40px;padding:0 8px">--> |
| | | |
| | | <!-- </el-header>--> |
| | | <el-container> |
| | | <el-aside style="width:250px"> |
| | | <el-aside> |
| | | <basic-container class="businessTreeContainer"> |
| | | <div class="app"> |
| | | <p style="margin-top: 10px;font-weight: 570;font-size: 19px">{{ treeOption.title }}</p> |
| | | <avue-tree id="basic" :data="treeData" :option="treeOption" class="businessTree" @node-click="nodeClick"> |
| | | <div style="display: flex;margin-bottom: 10px;justify-content: space-around;"> |
| | | <el-button v-if="permissionList.addBtn" size="mini" type="primary" @click="businessAdd" plain style="width: 60px"> |
| | | 新增 |
| | | </el-button> |
| | | <el-button v-if="permissionList.editBtn" size="mini" type="primary" @click="businessEdit" plain style="width: 60px"> |
| | | 修改 |
| | | </el-button> |
| | | <el-button v-if="permissionList.table" size="mini" type="primary" |
| | | @click="selectFromTable" plain> 从已有中获取 |
| | | </el-button> |
| | | </div> |
| | | <avue-tree :data="treeData" :option="treeOption" class="businessTree" @node-click="nodeClick"> |
| | | <span slot-scope="{ node, data }" class="el-tree-node__label"> |
| | | <span> |
| | | <i :class="(node || {}).level === 2 ? 'el-icon-star-off' : 'el-icon-folder-opened'"></i> |
| | |
| | | </script> |
| | | |
| | | <style lang="scss"> |
| | | #basic { |
| | | height: 770px; |
| | | border-radius: 10px; |
| | | } |
| | | |
| | | .businessCrud > .el-card:nth-of-type(2) > .el-card__body > .avue-crud__menu { |
| | | display: none !important; |
| | |
| | | display: none !important; |
| | | } |
| | | |
| | | .businessTreeContainer > .el-card > .el-card__body { |
| | | height: 775px; |
| | | }</style> |
| | | |
| | | .app { |
| | | overflow: auto; |
| | | height: calc(100vh - 150px); |
| | | } |
| | | |
| | | .app::-webkit-scrollbar { |
| | | height: 15px; // 纵向滚动条 必写 |
| | | background: white; |
| | | border: white; |
| | | width: 10px; |
| | | |
| | | } |
| | | |
| | | // 滚动条的滑块 |
| | | .app::-webkit-scrollbar-thumb { |
| | | background-color: #ececec; |
| | | border-radius: 20px; |
| | | border: #ececec; |
| | | } |
| | | </style> |