| | |
| | | <span>{{ node.label }}</span> |
| | | <span class="btnBox"> |
| | | <el-button |
| | | v-if="menuStatus.insert" |
| | | type="text" |
| | | size="mini" |
| | | @click="() => append(node, data)" |
| | |
| | | <i class="el-icon-circle-plus"></i> |
| | | </el-button> |
| | | <el-button |
| | | v-if="menuStatus.delete" |
| | | type="text" |
| | | size="mini" |
| | | @click="() => remove(node, data)" |
| | |
| | | <el-form-item label="备注" :label-width="formLabelWidth"> |
| | | <el-input v-model="itemdetail.bak" autocomplete="off"></el-input> |
| | | </el-form-item> |
| | | <div class="btnBox"> |
| | | <div class="btnBox" v-if="menuStatus.update"> |
| | | <el-button type="primary" @click="updDep('itemdetail')" |
| | | >保存</el-button |
| | | > |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import MyBread from "../../components/MyBread.vue"; |
| | | import MyBread from '../../components/MyBread.vue'; |
| | | import { |
| | | queryDepTree, |
| | | updateDepTree, |
| | |
| | | queryMaxId, |
| | | insertDep, |
| | | deleteDep, |
| | | } from "../../api/api"; |
| | | } from '../../api/api'; |
| | | export default { |
| | | //import引入的组件需要注入到对象中才能使用 |
| | | components: { |
| | |
| | | }, |
| | | data() { |
| | | let validName = (rule, value, callback) => { |
| | | if (value === "" || value === null || value === undefined) { |
| | | return callback(new Error("名称不能为空")); |
| | | if (value === '' || value === null || value === undefined) { |
| | | return callback(new Error('名称不能为空')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }; |
| | | return { |
| | | menuStatus: { |
| | | delete: false, |
| | | insert: false, |
| | | update: false, |
| | | }, |
| | | defaultProps: { |
| | | children: "children", |
| | | label: "name", |
| | | children: 'children', |
| | | label: 'name', |
| | | }, |
| | | fullscreenLoading: false, |
| | | oriData: [], //原始树数据 |
| | |
| | | old_depData: [], //el树数据(拖动前) |
| | | newData: [], //拖动后原始数据 |
| | | itemdetail: { |
| | | addr: "", |
| | | bak: "", |
| | | code: "", |
| | | contact: "", |
| | | email: "", |
| | | fax: "", |
| | | name: "", |
| | | post: "", |
| | | sname: "", |
| | | uncode: "", |
| | | website: "", |
| | | addr: '', |
| | | bak: '', |
| | | code: '', |
| | | contact: '', |
| | | email: '', |
| | | fax: '', |
| | | name: '', |
| | | post: '', |
| | | sname: '', |
| | | uncode: '', |
| | | website: '', |
| | | }, |
| | | backUpData: "", |
| | | formLabelWidth: "130px", |
| | | delChildID: "", |
| | | backUpData: '', |
| | | formLabelWidth: '130px', |
| | | delChildID: '', |
| | | delChildIDs: [], |
| | | dialogFormVisible: false, |
| | | ruleForm: { |
| | | level: null, |
| | | orderNum: null, |
| | | pid: null, |
| | | addr: "", |
| | | bak: "", |
| | | code: "", |
| | | contact: "", |
| | | email: "", |
| | | fax: "", |
| | | name: "", |
| | | post: "", |
| | | sname: "", |
| | | uncode: "", |
| | | website: "", |
| | | addr: '', |
| | | bak: '', |
| | | code: '', |
| | | contact: '', |
| | | email: '', |
| | | fax: '', |
| | | name: '', |
| | | post: '', |
| | | sname: '', |
| | | uncode: '', |
| | | website: '', |
| | | }, |
| | | rules: { |
| | | name: [{ required: true, validator: validName, trigger: "blur" }], |
| | | name: [{ required: true, validator: validName, trigger: 'blur' }], |
| | | }, |
| | | }; |
| | | }, |
| | |
| | | } else { |
| | | this.$notify.error({ |
| | | title: res.code, |
| | | message: "无法获取单位列表", |
| | | message: '无法获取单位列表', |
| | | }); |
| | | } |
| | | }); |
| | |
| | | return cloneData.filter((father) => { |
| | | // 循环所有项 |
| | | let branchArr = cloneData.filter((child) => father.id == child.pid); // 对比ID,分别上下级菜单,并返回数据 |
| | | branchArr.length > 0 ? (father.children = branchArr) : ""; // 给父级添加一个children属性,并赋值 |
| | | branchArr.length > 0 ? (father.children = branchArr) : ''; // 给父级添加一个children属性,并赋值 |
| | | return father.pid == 0; // 返回一级菜单 |
| | | }); |
| | | }, |
| | |
| | | this.fullscreenLoading = false; |
| | | if (res.code == 200) { |
| | | this.$message({ |
| | | message: "添加成功", |
| | | type: "success", |
| | | message: '添加成功', |
| | | type: 'success', |
| | | }); |
| | | this.getMenuTree(); |
| | | this.itemdetail = {}; |
| | |
| | | }) |
| | | .catch((res) => { |
| | | this.itemdetail = {}; |
| | | this.$message.error("添加失败"); |
| | | this.$message.error('添加失败'); |
| | | this.fullscreenLoading = false; |
| | | console.log(res); |
| | | }); |
| | |
| | | }); |
| | | }, |
| | | remove(node, data) { |
| | | this.$confirm("此操作将删除该节点, 是否继续?", "提示", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | this.$confirm('此操作将删除该节点, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }) |
| | | .then(() => { |
| | | //兄弟重新排序 |
| | |
| | | console.log(res); |
| | | if (res[0].code == 200 && res[1].code == 200) { |
| | | this.$message({ |
| | | type: "success", |
| | | message: "删除成功!", |
| | | type: 'success', |
| | | message: '删除成功!', |
| | | }); |
| | | this.getMenuTree(); |
| | | this.itemdetail = {}; |
| | | } else if (res[0].code == 200) { |
| | | this.getMenuTree(); |
| | | this.$message.error("删除成功,位置调整失败"); |
| | | this.$message.error('删除成功,位置调整失败'); |
| | | } else if (res[1].code == 200) { |
| | | this.getMenuTree(); |
| | | this.$message.error("删除失败,位置调整成功"); |
| | | this.$message.error('删除失败,位置调整成功'); |
| | | } else { |
| | | this.getMenuTree(); |
| | | this.$message.error("删除失败"); |
| | | this.$message.error('删除失败'); |
| | | } |
| | | }) |
| | | .catch(() => { |
| | | this.$message.error("删除失败"); |
| | | this.$message.error('删除失败'); |
| | | this.itemdetail = {}; |
| | | }); |
| | | |
| | |
| | | this.delChildIDs = []; |
| | | }) |
| | | .catch(() => { |
| | | this.$message("已取消删除"); |
| | | this.$message('已取消删除'); |
| | | }); |
| | | // this.dialogMessage="是否删除" |
| | | // this.dialogFlag = 1; |
| | |
| | | this.old_depData = JSON.parse(JSON.stringify(this.depList)); //将备份的dir重新赋值 |
| | | }, |
| | | handleDrop(draggingNode, dropNode, dropType, ev) { |
| | | this.$confirm("此操作将保存目录更改, 是否继续?", "提示", { |
| | | confirmButtonText: "确定", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | this.$confirm('此操作将保存目录更改, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }) |
| | | .then(() => { |
| | | //父节点 |
| | | let data = dropType != "inner" ? dropNode.parent.data : dropNode.data; |
| | | let data = dropType != 'inner' ? dropNode.parent.data : dropNode.data; |
| | | // 父节点中全部子节点 |
| | | let nodeData = |
| | | dropNode.level == 1 && dropType != "inner" ? data : data.children; |
| | | dropNode.level == 1 && dropType != 'inner' ? data : data.children; |
| | | //变更节点 |
| | | // console.log(nodeData); |
| | | nodeData.forEach((item, i) => { |
| | | if (dropType != "inner") { |
| | | if (dropType != 'inner') { |
| | | if (draggingNode.data.pid === dropNode.data.pid) { |
| | | item.pid = item.pid; |
| | | } else { |
| | |
| | | }) |
| | | .catch(() => { |
| | | this.$message({ |
| | | type: "info", |
| | | message: "已取消更改", |
| | | type: 'info', |
| | | message: '已取消更改', |
| | | }); |
| | | this.depList = this.old_depData; //将备份的dir重新赋值 |
| | | }); |
| | |
| | | this.getMenuTree(); |
| | | return; |
| | | } else { |
| | | alert("调整失败,请重试!"); |
| | | alert('调整失败,请重试!'); |
| | | } |
| | | }) |
| | | .catch(() => { |
| | | alert("修改失败,请重试!"); |
| | | alert('修改失败,请重试!'); |
| | | }); |
| | | }, |
| | | handleNodeClick(data) { |
| | |
| | | setTimeout(() => { |
| | | this.fullscreenLoading = false; |
| | | if (res.code == 200) { |
| | | this.getMenuTree() |
| | | this.getMenuTree(); |
| | | this.itemdetail = {}; |
| | | this.dialogFormVisible = false; |
| | | } |
| | | }, 500); |
| | | }) |
| | | .catch((res) => { |
| | | alert("修改失败,请重试!"); |
| | | alert('修改失败,请重试!'); |
| | | this.fullscreenLoading = false; |
| | | }); |
| | | } else { |
| | |
| | | }, |
| | | reset() { |
| | | this.$refs[formName].resetFields(); |
| | | if (this.backUpData != "") { |
| | | if (this.backUpData != '') { |
| | | this.itemdetail = JSON.parse(this.backUpData); |
| | | } |
| | | }, |
| | | showPermsMenu(res) { |
| | | switch (res.tag) { |
| | | case '/delete': |
| | | this.menuStatus.delete = true; |
| | | break; |
| | | case '/insert': |
| | | this.menuStatus.insert = true; |
| | | break; |
| | | case '/update': |
| | | this.menuStatus.update = true; |
| | | break; |
| | | } |
| | | }, |
| | | }, |
| | | mounted() { |
| | | this.getDepTree(); |
| | | }, |
| | | created() { |
| | | var val = this.$store.state.currentPerms; |
| | | var permsEntity = this.$store.state.permsEntity; |
| | | for (var i = 0; i < permsEntity.length; i++) { |
| | | if (permsEntity[i].perms == val) { |
| | | this.showPermsMenu(permsEntity[i]); |
| | | } |
| | | } |
| | | }, |
| | | }; |
| | | </script> |
| | | <style lang="less" scoped> |