| | |
| | | node-key="id" |
| | | :data="depList" |
| | | :expand-on-click-node="false" |
| | | :default-expand-all="true" |
| | | :default-expanded-keys=openKey |
| | | @node-click="handleNodeClick" |
| | | > |
| | | </el-tree> |
| | | </div> |
| | | </div> |
| | | <div class="right_menu subpage_Div"> |
| | | |
| | | <div style="display:flex;justify-content:space-between"> |
| | | <el-breadcrumb separator="/"> |
| | | <div style="display:flex;justify-content:right;align-items: center;padding-bottom: 14px"> |
| | | <el-breadcrumb separator="/" style="display: none"> |
| | | <el-breadcrumb-item :to="{ path: '/' }">{{ |
| | | $t('dataManage.dictionaryManageObj.particulars') |
| | | }}</el-breadcrumb-item> |
| | | </el-breadcrumb> |
| | | |
| | | <div> |
| | | <el-button |
| | | v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(1)" |
| | | type="info" |
| | | icon="el-icon-top" |
| | | size="small" |
| | | >向上移动</el-button> |
| | | <el-button |
| | | v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(2)" |
| | | type="info" |
| | | icon="el-icon-bottom" |
| | | size="small" |
| | | >向下移动</el-button> |
| | | <el-button |
| | | v-if="menuStatus.insert" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | |
| | | type="success" |
| | | icon="el-icon-plus" |
| | | size="small" |
| | | >新增同级</el-button> |
| | | >{{$t('operatManage.menuSetObj.insert')}}</el-button> |
| | | <el-button |
| | | v-if="menuStatus.insert" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | |
| | | type="success" |
| | | icon="el-icon-plus" |
| | | size="small" |
| | | >新增子级</el-button> |
| | | <el-button |
| | | >{{$t('operatManage.menuSetObj.subInsert')}}</el-button> |
| | | <el-button |
| | | v-if="menuStatus.delete" |
| | | @click="setDelNode()" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | type="danger" |
| | | icon="el-icon-delete" |
| | | size="small" |
| | | >删除</el-button> |
| | | >{{$t('operatManage.menuSetObj.delete')}}</el-button> |
| | | <el-button |
| | | v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(1)" |
| | | type="info" |
| | | icon="el-icon-top" |
| | | size="small" |
| | | >{{$t('operatManage.menuSetObj.moveUp')}}</el-button> |
| | | <el-button |
| | | v-if="menuStatus.update" |
| | | :disabled="itemdetail.pid == null ? true : false" |
| | | @click="setEditNode(2)" |
| | | type="info" |
| | | icon="el-icon-bottom" |
| | | size="small" |
| | | >{{$t('operatManage.menuSetObj.moveDown')}}</el-button> |
| | | </div> |
| | | </div> |
| | | <el-divider /> |
| | | |
| | | <div class="dividing-line"></div> |
| | | <div class="form_box"> |
| | | <el-form |
| | | <!-- <el-divider class="eldivider" />--> |
| | | <el-form label-width="130px" |
| | | :model="itemdetail" |
| | | ref="itemdetail" |
| | | :rules="rules" |
| | |
| | | <el-input |
| | | v-model="itemdetail.name" |
| | | autocomplete="off" |
| | | style="max-width: 400px;" |
| | | :placeholder="$t('userManage.orgManageObj.nameHolder')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="itemdetail.sname" |
| | | autocomplete="off" |
| | | :placeholder="$t('userManage.orgManageObj.abbreviationHolder')" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | :label-width="formLabelWidth" |
| | | > |
| | | <el-input |
| | | disabled |
| | | v-model="itemdetail.code" |
| | | autocomplete="off" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="itemdetail.uncode" |
| | | autocomplete="off" |
| | | :placeholder="$t('userManage.orgManageObj.organizationCodeHolder')" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="itemdetail.addr" |
| | | autocomplete="off" |
| | | :placeholder="$t('userManage.orgManageObj.cmpanyAddressHolder')" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="itemdetail.contact" |
| | | autocomplete="off" |
| | | :placeholder="$t('userManage.orgManageObj.continformationHolder')" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | > |
| | | <el-input |
| | | v-model="itemdetail.fax" |
| | | :placeholder="$t('userManage.orgManageObj.faxHolder')" |
| | | autocomplete="off" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | > |
| | | <el-input |
| | | v-model="itemdetail.email" |
| | | :placeholder="$t('userManage.orgManageObj.EMailHolder')" |
| | | autocomplete="off" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | > |
| | | <el-input |
| | | v-model="itemdetail.post" |
| | | :placeholder="$t('userManage.orgManageObj.postalCodeHolder')" |
| | | autocomplete="off" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | > |
| | | <el-input |
| | | v-model="itemdetail.website" |
| | | :placeholder="$t('userManage.orgManageObj.WebsiteAddressHolder')" |
| | | autocomplete="off" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="itemdetail.bak" |
| | | autocomplete="off" |
| | | :placeholder="$t('userManage.orgManageObj.remarksHolder')" |
| | | style="max-width: 400px;" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <div |
| | | class="btnBox" |
| | | v-if="menuStatus.update" |
| | | > |
| | | <el-button |
| | | type="primary" |
| | | size="small" |
| | | @click="updDep('itemdetail')" |
| | | >{{ $t('common.submit') }}</el-button> |
| | | <el-button |
| | | size="small" |
| | | @click="reset('itemdetail')" |
| | | >{{ |
| | | $t('common.cancel') |
| | | }}</el-button> |
| | | <div v-if="menuStatus.update"> |
| | | <el-form-item> |
| | | <el-button |
| | | type="primary" |
| | | size="small" |
| | | @click="updDep('itemdetail')" |
| | | >{{ $t('common.submit') }}</el-button> |
| | | <el-button |
| | | size="small" |
| | | @click="reset('itemdetail')" |
| | | >{{ |
| | | $t('common.cancel') |
| | | }}</el-button> |
| | | </el-form-item> |
| | | </div> |
| | | </el-form> |
| | | </div> |
| | | |
| | | </div> |
| | | |
| | | </div> |
| | | |
| | | <el-dialog |
| | | width="30%" |
| | | top="5vh" |
| | | :title="$t('common.append')" |
| | | :visible.sync="dialogFormVisible" |
| | | :before-close="handleClose" |
| | | > |
| | | <div style="height: 500px; overflow: auto"> |
| | | <el-form |
| | | :model="ruleForm" |
| | | ref="ruleForm" |
| | | :rules="rules" |
| | | label-position="top" |
| | | > |
| | | <el-form-item |
| | | prop="name" |
| | |
| | | <el-input |
| | | v-model="ruleForm.name" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.name')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.sname" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.abbreviation')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.code" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.unitCode')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.uncode" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.organizationCode')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.addr" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.cmpanyAddress')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.contact" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.continformation')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.fax" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.fax')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.email" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.EMail')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.post" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.postalCode')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.website" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.WebsiteAddress')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | <el-form-item |
| | |
| | | <el-input |
| | | v-model="ruleForm.bak" |
| | | autocomplete="off" |
| | | style="width:85%" |
| | | :placeholder="$t('shuJuGuanLi.shuJuJianSuo.valuetwo')+$t('userManage.orgManageObj.remarks')" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | <div |
| | | slot="footer" |
| | | class="dialog-footer" |
| | |
| | | name: [{ required: true, validator: validName, trigger: 'blur' }], |
| | | }, |
| | | newNode: null, |
| | | openKey: [1], |
| | | }; |
| | | }, |
| | | methods: { |
| | |
| | | // console.log(node); |
| | | }, |
| | | resetForm(formName) { |
| | | this.dialogFormVisible = false; |
| | | this.$nextTick(() => { |
| | | this.ruleForm = {}; |
| | | this.$refs[formName].resetFields(); |
| | | }); |
| | | this.$confirm("关闭后无法保存,是否关闭?") |
| | | .then((_) => { |
| | | this.dialogFormVisible = false; |
| | | this.$nextTick(() => { |
| | | this.ruleForm = {}; |
| | | this.$refs[formName].resetFields(); |
| | | }); |
| | | }) |
| | | .catch((_) => { }); |
| | | }, |
| | | submitForm(formName) { |
| | | this.$refs[formName].validate((valid) => { |
| | |
| | | .then(() => { |
| | | //兄弟重新排序 |
| | | const parent = node.parent; |
| | | this.openKey.push(parent.id) |
| | | const children = parent.data.children || parent.data; |
| | | children.splice(data.orderNum - 1, 1); |
| | | children.forEach((item, index) => { |
| | |
| | | updateDepTrees(children), |
| | | ]) |
| | | .then((res) => { |
| | | console.log(res); |
| | | if (res[0].code == 200 && res[1].code == 200) { |
| | | this.$message({ |
| | | type: 'success', |
| | |
| | | }); |
| | | }, |
| | | handleNodeClick(data, node) { |
| | | this.openKey.push(data.id) |
| | | this.newNode = node |
| | | this.backUpData = JSON.stringify(data); |
| | | this.itemdetail = JSON.parse(JSON.stringify(data)); |
| | |
| | | } |
| | | } |
| | | }, |
| | | handleClose() { |
| | | this.$confirm("关闭后无法保存,是否关闭?") |
| | | .then((_) => { |
| | | this.dialogFormVisible = false |
| | | }) |
| | | .catch((_) => { }); |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.getMenuTree(); |
| | |
| | | // } |
| | | // } |
| | | }, |
| | | beforeDestroy() { |
| | | this.openKey = [1] |
| | | } |
| | | }; |
| | | </script> |
| | | <style lang="less" scoped> |
| | |
| | | .menuSettings_box { |
| | | height: 98%; |
| | | width: 98%; |
| | | padding: 1%; |
| | | padding:0.5% 1%; |
| | | |
| | | .cataLogContent { |
| | | width: 100%; |
| | |
| | | } |
| | | .left_Tree { |
| | | width: 15%; |
| | | height: 91%; |
| | | |
| | | //height: 94%; |
| | | height: 100%; |
| | | border-radius: 5px; |
| | | padding: 1%; |
| | | overflow-y: auto; |
| | | border-right: 1px solid #dcdfe6; |
| | | } |
| | | .right_menu { |
| | | width: 80%; |
| | | height: 91%; |
| | | |
| | | //height: 91%; |
| | | height: 98%; |
| | | border-radius: 5px; |
| | | padding: 1%; |
| | | overflow: auto; |
| | | |
| | | .el-input { |
| | | width: 400px; |
| | | .form_box { |
| | | box-sizing: border-box; |
| | | padding-top: 22px; |
| | | width: 100%; |
| | | .el-input { |
| | | width: 400px; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .btnBox{ |
| | | //position: absolute; |
| | | //bottom: 0; |
| | | //right: 0; |
| | | } |
| | | </style> |