| | |
| | | @clear="handleClear" @keyup.enter.native="handleEnter"></el-input> |
| | | </template> |
| | | <template #menu="{row,index,size}"> |
| | | <el-button type="text" icon="el-icon-menu" size="small" @click="classifyHandler">分类授权</el-button> |
| | | <el-button icon="el-icon-menu" size="small" type="text" @click="classifyHandler(row)">分类授权</el-button> |
| | | |
| | | </template> |
| | | </avue-crud> |
| | | <el-dialog :visible.sync="dialogVisible" append-to-body title="分类授权"> |
| | | <el-dialog :visible.sync="dialogVisible" append-to-body class="avue-dialog avue-dialog--top" title="分类授权" |
| | | top="-50px"> |
| | | |
| | | <el-row> |
| | | <el-col :span="10"> |
| | | <avue-tree ref="tree" |
| | | v-model="TreeForm" |
| | | :data="TreeData" |
| | | :option="TreeOption" |
| | | @check-change="checkChange"> |
| | | </avue-tree> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <div slot="footer" class="dialog-footer" style="height: 50px;line-height: 50px"> |
| | | <el-button icon="el-icon-plus" size="small" type="primary" @click="empower">授 权</el-button> |
| | | <el-button icon="el-icon-close" size="small" type="danger">重 置</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </basic-container> |
| | | </template> |
| | | <script> |
| | | import {getSysInfoList, sysInfoAdd, sysInfoEdit, sysInfoDel} from '@/api/integration/sysInfo.js' |
| | | import { |
| | | getSysInfoList, |
| | | sysInfoAdd, |
| | | sysInfoEdit, |
| | | sysInfoDel, |
| | | sysInfoTree, |
| | | batchAddSave |
| | | } from '@/api/integration/sysInfo.js' |
| | | |
| | | export default { |
| | | data() { |
| | | return { |
| | | checkAll: {}, |
| | | ParentList: [], |
| | | ParentRemoveList: [], |
| | | //避免缓存 |
| | | reload: Math.random(), |
| | | TreeLoading: false, |
| | | TreeOption: { |
| | | defaultExpandAll: false, |
| | | multiple: true, |
| | | addBtn: false, |
| | | filter: false |
| | | }, |
| | | TreeData: [], |
| | | TreeForm: {}, |
| | | loading: false, |
| | | dialogVisible:false, |
| | | dialogVisible: false, |
| | | page: { |
| | | currentPage: 1, |
| | | pageSize: 10, |
| | |
| | | }, |
| | | } |
| | | }, |
| | | created() { |
| | | }, |
| | | methods: { |
| | | empower() { |
| | | batchAddSave(this.checkAll.oid, this.checkAll.id, this.ParentList).then(res => { |
| | | // console.log(res.data) |
| | | if(res.data.code === 200){ |
| | | this.$message.success(res.data.msg) |
| | | this.dialogVisible=false; |
| | | } |
| | | }) |
| | | }, |
| | | //分类授权多选回调 |
| | | checkChange(row, checked) { |
| | | // this.ParentList=[] |
| | | // console.log('row',row) |
| | | if (checked) { |
| | | if (!row.parentId) { |
| | | const parentRecord = { |
| | | oid: row.oid, |
| | | classifyId: row.attributes.classifyId, |
| | | classifyOid: row.attributes.classifyOid, |
| | | classParentOid: row.parentId, |
| | | }; |
| | | this.ParentList.push(parentRecord); |
| | | // 如果row的children不为空 继续循环children中的每个对象 |
| | | if (row.children && row.children.length > 0) { |
| | | for (let child of row.children) { |
| | | const childRecord = { |
| | | oid: child.oid, |
| | | classifyId: child.attributes.classifyId, |
| | | classifyOid: child.attributes.classifyOid, |
| | | classParentOid: child.parentId, |
| | | }; |
| | | this.ParentList.push(childRecord); |
| | | // 如果子对象的children不为空 继续循环获取数据 |
| | | if (child.children && child.children.length > 0) { |
| | | for (let subChild of child.children) { |
| | | const subRecord = { |
| | | oid: subChild.oid, |
| | | classifyId: subChild.attributes.classifyId, |
| | | classifyOid: subChild.attributes.classifyOid, |
| | | classParentOid: subChild.parentId, |
| | | }; |
| | | this.ParentList.push(subRecord); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } else { |
| | | // 取消勾选的节点是父节点 |
| | | if (!row.parentId) { |
| | | // 找到父节点在ParentList中的索引 |
| | | const parentIndex = this.ParentList.findIndex(item => item.oid === row.oid); |
| | | if (parentIndex !== -1) { |
| | | const parentOid = this.ParentList[parentIndex].classifyOid; |
| | | |
| | | // 查找所有需要删除的子节点的索引 |
| | | const childIndexes = this.ParentList.reduce((indexes, item, index) => { |
| | | if (item.classParentOid === parentOid && item.classifyOid !== parentOid) { |
| | | indexes.push(index); |
| | | } |
| | | return indexes; |
| | | }, []); |
| | | |
| | | // 从后往前删除子节点的数据,保证索引的正确性 |
| | | for (let i = childIndexes.length - 1; i >= 0; i--) { |
| | | this.ParentList.splice(childIndexes[i], 1); |
| | | } |
| | | |
| | | // 删除父节点的数据 |
| | | this.ParentList.splice(parentIndex, 1); |
| | | } |
| | | } else { |
| | | // 取消勾选的节点是子节点 |
| | | const childIndex = this.ParentList.findIndex(item => item.oid === row.oid); |
| | | if (childIndex !== -1) { |
| | | // 删除子节点的数据 |
| | | this.ParentList.splice(childIndex, 1); |
| | | } |
| | | } |
| | | } |
| | | console.log('this.ParentList',this.ParentList); |
| | | }, |
| | | //分类授权 |
| | | classifyHandler(){ |
| | | this.dialogVisible=true; |
| | | classifyHandler(row) { |
| | | this.loading = true; |
| | | this.checkAll = row |
| | | sysInfoTree({systemOid: row.oid, systemId: row.id}).then(res => { |
| | | let List = []; |
| | | let value = 0; |
| | | let NumberList= []; |
| | | function traverse(obj, parent) { |
| | | //重新构建一次选中当前row的数据 |
| | | const record = { |
| | | label: obj.text, |
| | | oid: obj.oid, |
| | | attributes:{ |
| | | classifyId: obj.attributes.classifyId, |
| | | classifyOid: obj.attributes.classifyOid, |
| | | selected:obj.attributes.selected |
| | | }, |
| | | classParentOid: obj.parentId, |
| | | value: value, |
| | | children: [] |
| | | }; |
| | | //当前已选择数据回填 |
| | | if (record.attributes.selected == 'true') { |
| | | NumberList.push(record.value); |
| | | } |
| | | if (parent) { |
| | | const stingChild = parent.children.find(child => child.label === record.label); |
| | | if (stingChild) { |
| | | record.value = stingChild.value; // 使用已存在的子节点的value值 |
| | | } else { |
| | | parent.children.push(record); |
| | | value++; |
| | | } |
| | | } else { |
| | | const stingRecord = List.find(item => item.label === record.label); |
| | | if (stingRecord) { |
| | | record.value = stingRecord.value; // 使用已存在的顶层节点的value值 |
| | | } else { |
| | | List.push(record); |
| | | value++; |
| | | } |
| | | } |
| | | if (obj.children && obj.children.length > 0) { |
| | | for (let child of obj.children) { |
| | | traverse(child, record); |
| | | } |
| | | } |
| | | } |
| | | for (let item of res.data) { |
| | | traverse(item, null); |
| | | } |
| | | // console.log('list', List); |
| | | this.TreeData = List; |
| | | // this.ModifyProperties(this.TreeData, 'text', 'label'); |
| | | // 根据this.TreeData的长度计算延迟时间 |
| | | const delayTime = this.TreeData.length * 1; |
| | | setTimeout(() => { |
| | | this.loading = false; |
| | | this.reload = Math.random(); |
| | | this.dialogVisible = true; |
| | | |
| | | this.$nextTick(() => { |
| | | if (this.$refs.tree) { |
| | | this.$refs.tree.setCheckedKeys(NumberList); |
| | | } |
| | | }); |
| | | }, delayTime); |
| | | }); |
| | | }, |
| | | //定义一个修改数据属性名的方法 |
| | | ModifyProperties(obj, oldName, newName) { |
| | | for (let key in obj) { |
| | | if (key === oldName) { |
| | | obj[newName] = obj[key]; |
| | | delete obj[key]; |
| | | } |
| | | if (typeof obj[key] === 'object') { |
| | | this.ModifyProperties(obj[key], oldName, newName); |
| | | } |
| | | } |
| | | }, |
| | | async getDataList() { |
| | | this.loading = true; |
| | | console.log(this.search); |
| | | const { pageSize, currentPage } = this.page; |
| | | const {pageSize, currentPage} = this.page; |
| | | const conditions = {}; |
| | | if (Object.keys(this.search).length > 0) { |
| | | for (const key in this.search) { |
| | |
| | | } |
| | | const response = await getSysInfoList(pageSize, currentPage, conditions); |
| | | if (response.status === 200) { |
| | | console.log(response); |
| | | // console.log(response); |
| | | this.loading = false; |
| | | const data = response.data.data; |
| | | this.data = data.records; |
| | |
| | | }).then(async () => { |
| | | const response = await sysInfoDel(param) |
| | | if (response.status === 200) { |
| | | console.log(response) |
| | | // console.log(response) |
| | | this.$message({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | |
| | | }, |
| | | // enter搜索 |
| | | handleEnter() { |
| | | if (this.search[this.selectValue] === '') return |
| | | else this.getDataList() |
| | | |
| | | this.getDataList() |
| | | }, |
| | | // 输入框清空 |
| | | handleClear() { |
| | |
| | | }, |
| | | // 多选 |
| | | selectionChange(list) { |
| | | console.log(list) |
| | | let newData = list.map(item => { |
| | | const {oid} = item |
| | | return oid |
| | | }) |
| | | this.delIds = {oids: newData.toString()} |
| | | console.log(this.delIds) |
| | | // console.log(this.delIds) |
| | | }, |
| | | } |
| | | } |