| | |
| | | <el-container> |
| | | <el-aside> |
| | | <basic-container> |
| | | <div style="max-height: calc(100vh - 170px);overflow: auto"> |
| | | <avue-tree :key="refresh" ref="tree" :data="treeData" :option="treeOption" @node-click="nodeClick"> |
| | | <div style="max-height: calc(100vh - 150px);overflow: auto"> |
| | | <avue-tree :key="refresh" node-key="id" ref="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> |
| | |
| | | |
| | | <el-main> |
| | | <basic-container> |
| | | <el-form ref="form" :model="form" label-width="85px" style="height: 79vh"> |
| | | <el-form-item label="名称:"> |
| | | <el-input v-model="form.name" placeholder="请输入名称"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="标识:"> |
| | | <el-input v-model="form.code" placeholder="请输入标识"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="别名:"> |
| | | <el-input v-model="form.alias" placeholder="请输入别名"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="顺序:"> |
| | | <el-input-number v-model="form.sort" :min="0" :max="9999" label="顺序"></el-input-number> |
| | | </el-form-item> |
| | | <el-form-item label="描述:"> |
| | | <el-input v-model="form.remark" placeholder="请输入描述"></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div v-if="nodeRow.childType === 0 || nodeRow.childType === -1" class="btnBox"> |
| | | <el-button v-if="!addStatus" :disabled="nodeRow.childType === 0" icon="el-icon-plus" plain |
| | | <el-button v-if="!addStatus && !editStatus" :disabled="nodeRow.childType === 0" icon="el-icon-plus" plain |
| | | size="small" |
| | | type="primary" @click="addClickHandler">增加 |
| | | </el-button> |
| | | <el-button v-if="addStatus" icon="el-icon-check" plain size="small" |
| | | type="success" @click="addSaveClickHandler">保存 |
| | | </el-button> |
| | | <el-button v-if="!editStatus" :disabled="nodeRow.childType === -1" icon="el-icon-edit" plain size="small" type="primary" |
| | | <el-button v-if="!addStatus && !editStatus" :disabled="nodeRow.childType === -1" icon="el-icon-edit" plain size="small" type="primary" |
| | | @click="editClickHandler">修改 |
| | | </el-button> |
| | | <el-button v-if="editStatus" icon="el-icon-check" plain size="small" |
| | | type="success" @click="editSaveClickHandler">保存 |
| | | </el-button> |
| | | <el-button :disabled="nodeRow.childType === -1" icon="el-icon-close" plain size="small" type="danger" |
| | | <el-button v-if="addStatus || editStatus" icon="el-icon-close" plain size="small" |
| | | type="danger" @click="addStatus=false;editStatus=false;">取消 |
| | | </el-button> |
| | | <el-button v-if="!addStatus && !editStatus" :disabled="nodeRow.childType === -1" icon="el-icon-close" plain size="small" type="danger" |
| | | @click="delClickHandler">删除 |
| | | </el-button> |
| | | <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="sqlClickExportClick">导出sql |
| | | <el-button v-if="!addStatus && !editStatus" icon="el-icon-upload2" plain size="small" type="primary" @click="sqlClickExportClick">导出sql |
| | | </el-button> |
| | | </div> |
| | | <el-form ref="form" :model="form" label-width="85px" style="max-height: calc(100vh - 180px);overflow: auto;"> |
| | | <el-form-item label="名称:"> |
| | | <el-input v-model="form.name" :disabled="!editStatus && !addStatus" placeholder="请输入名称"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="标识:"> |
| | | <el-input v-model="form.code" :disabled="!editStatus && !addStatus" placeholder="请输入标识"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="别名:"> |
| | | <el-input v-model="form.alias" :disabled="!editStatus && !addStatus" placeholder="请输入别名"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="顺序:"> |
| | | <el-input-number v-model="form.sort" :disabled="!editStatus && !addStatus" :min="0" :max="9999" label="顺序"></el-input-number> |
| | | </el-form-item> |
| | | <el-form-item label="描述:"> |
| | | <el-input v-model="form.remark" :disabled="!editStatus && !addStatus" placeholder="请输入描述"></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | </basic-container> |
| | | </el-main> |
| | | </el-container> |
| | |
| | | editStatus:false, |
| | | addStatus: false, |
| | | nodeRow: {}, |
| | | currentClickNode:null, |
| | | form: {}, |
| | | treeData: [], |
| | | treeOption: { |
| | |
| | | }, |
| | | methods: { |
| | | // 树行点击 |
| | | nodeClick(row) { |
| | | nodeClick(row,node) { |
| | | console.log(row); |
| | | this.form = {...row}; |
| | | this.nodeRow = {...row}; |
| | | this.currentClickNode=node; |
| | | this.addStatus = false; |
| | | this.editStatus = false; |
| | | }, |
| | |
| | | addOperationType(params).then(res => { |
| | | if(res.data.code === 200){ |
| | | this.$message.success(res.data.msg); |
| | | this.refresh = Math.random(); // 刷新左侧树 |
| | | this.handleRefreshTree('add') |
| | | this.addStatus = false; |
| | | } |
| | | }) |
| | |
| | | updateOperationType(params).then(res => { |
| | | if(res.data.code === 200){ |
| | | this.$message.success(res.data.msg); |
| | | this.refresh = Math.random(); // 刷新左侧树 |
| | | this.handleRefreshTree('edit') |
| | | this.editStatus = false; |
| | | } |
| | | }) |
| | |
| | | delOperationType(this.form).then(res => { |
| | | if (res.data.code === 200) { |
| | | this.$message.success(res.data.msg); |
| | | this.resetFormValue(); |
| | | this.handleRefreshTree('del') |
| | | this.addStatus = false; |
| | | this.editStatus = false; |
| | | this.nodeRow = {}; |
| | |
| | | exportFunctionSql({isFunction: false}).then(res => { |
| | | func.downloadFileByBlobHandler(res); |
| | | this.$message.success('导出成功'); |
| | | }).catch(err => { |
| | | this.$message.error(err); |
| | | }); |
| | | }, |
| | | handleRefreshTree(type) { |
| | | //type:add\edit\del |
| | | if(type=="del"){ |
| | | this.$refs.tree.remove(this.currentClickNode); |
| | | this.currentClickNode=null; |
| | | this.form={}; |
| | | }else{ |
| | | if (this.currentClickNode) { |
| | | let node = this.currentClickNode.parent; |
| | | node.loaded = false; |
| | | node.expand(); |
| | | this.$refs.tree.setCurrentNode(this.currentClickNode); |
| | | }else { |
| | | this.refresh = Math.random(); // 刷新左侧树 |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | |
| | | .btnBox { |
| | | display: flex; |
| | | justify-content: center; |
| | | justify-content:left; |
| | | margin-bottom: 15px; |
| | | } |
| | | </style> |