|  |  | 
 |  |  |         <template #index="{ rowIndex }"> | 
 |  |  |           {{ rowIndex + 1 + (pagination.current - 1) * pagination.pageSize }} | 
 |  |  |         </template> | 
 |  |  |         <template #dept="{ record }">{{ | 
 |  |  |           record.dept ? record.dept.deptName : '' | 
 |  |  |         }}</template> | 
 |  |  |         <template #status="{ record }"> | 
 |  |  |           <a-switch | 
 |  |  |             checked-value="1" | 
 |  |  | 
 |  |  |         </template> | 
 |  |  |         <template #operations="{ record }"> | 
 |  |  |           <a-space> | 
 |  |  |             <a-button type="outline" @click="operation(2, record)" | 
 |  |  |               >编辑</a-button | 
 |  |  |             > | 
 |  |  |             <a-button | 
 |  |  |               type="dashed" | 
 |  |  |               status="warning" | 
 |  |  |               @click="operation(4, record)" | 
 |  |  |             >角色权限</a-button> | 
 |  |  |             <a-popconfirm | 
 |  |  |               content="Are you sure you want to delete?" | 
 |  |  |               type="success" | 
 |  |  | 
 |  |  |             > | 
 |  |  |               <a-button type="outline" status="danger">删除</a-button> | 
 |  |  |             </a-popconfirm> | 
 |  |  |             <a-button | 
 |  |  |               type="dashed" | 
 |  |  |               status="warning" | 
 |  |  |               @click="operation(4, record)" | 
 |  |  |               >权限配置</a-button | 
 |  |  |             > | 
 |  |  |             <a-button status="success" @click="operation(5, record)" | 
 |  |  |               >部门配置</a-button | 
 |  |  |             > | 
 |  |  |  | 
 |  |  |  | 
 |  |  |           </a-space> | 
 |  |  |         </template> | 
 |  |  |       </a-table> | 
 |  |  | 
 |  |  |       @ok="editHandleOk" | 
 |  |  |     > | 
 |  |  |       <a-form :model="editform"> | 
 |  |  |         <a-form-item field="roleName" label="角色名"> | 
 |  |  |         <a-form-item required field="roleName" label="角色名"> | 
 |  |  |           <a-input v-model="editform.roleName" /> | 
 |  |  |         </a-form-item> | 
 |  |  |         <a-form-item field="roleKey" label="权限字符串"> | 
 |  |  |           <a-input v-model="editform.roleKey" /> | 
 |  |  |         </a-form-item> | 
 |  |  |         <a-form-item field="remark" label="备注"> | 
 |  |  |           <a-input v-model="editform.remark" /> | 
 |  |  |         </a-form-item> | 
 |  |  |       </a-form> | 
 |  |  |     </a-modal> | 
 |  |  |     <a-modal | 
 |  |  |       width="50%" | 
 |  |  |       v-model:visible="deptvisible" | 
 |  |  |       title="部门配置" | 
 |  |  |       @cancel="handleCancel(2)" | 
 |  |  |       @ok="editDeptHandleOk" | 
 |  |  |     > | 
 |  |  |       <div :style="{ display: 'flex' }"> | 
 |  |  |         <a-card | 
 |  |  |           :style="{ 'width': '460px', 'height': '500px', 'overflow-y': 'auto' }" | 
 |  |  |           title="机构" | 
 |  |  |           hoverable | 
 |  |  |         > | 
 |  |  |           <a-tree | 
 |  |  |             class="tree-demo" | 
 |  |  |             v-model:checked-keys="checkedKeys" | 
 |  |  |             v-model:expanded-keys="expandKdys" | 
 |  |  |             :checkable="true" | 
 |  |  |             :data="treeData" | 
 |  |  |             :show-line="showLine" | 
 |  |  |             @check="onCheck" | 
 |  |  |             :fieldNames="{ | 
 |  |  |               key: 'deptId', | 
 |  |  |               title: 'deptName', | 
 |  |  |               children: 'children', | 
 |  |  |             }" | 
 |  |  |             :check-strictly="checkStrictly" | 
 |  |  |           > | 
 |  |  |           </a-tree> | 
 |  |  |         </a-card> | 
 |  |  |         <a-card class="card-demo" title="用户所属机构" hoverable> | 
 |  |  |           <a-space wrap> | 
 |  |  |             <a-tag | 
 |  |  |               v-for="(tag, index) of checkStrictly" | 
 |  |  |               :key="tag.deptId" | 
 |  |  |               @close="handleRemove(tag)" | 
 |  |  |             > | 
 |  |  |               {{ tag.deptName }} | 
 |  |  |             </a-tag> | 
 |  |  |           </a-space> | 
 |  |  |         </a-card> | 
 |  |  |       </div> | 
 |  |  |     </a-modal> | 
 |  |  |     <a-modal | 
 |  |  |       width="30%" | 
 |  |  | 
 |  |  |             <a-space direction="vertical" size="large"> | 
 |  |  |               <a-checkbox-group | 
 |  |  |                 v-model="checkedKeysKnowledge" | 
 |  |  |                 direction="vertical" | 
 |  |  |                 @change="onCheckKnowledge" | 
 |  |  |               > | 
 |  |  |                 <a-checkbox | 
 |  |  | 
 |  |  |                   :value="knowledg.id" | 
 |  |  |                   :lable="knowledg.name" | 
 |  |  |                   @change="onCheckKnowledge" | 
 |  |  |                 > | 
 |  |  |                   style="width:150px"> | 
 |  |  |                   {{ knowledg.name }} | 
 |  |  |                 </a-checkbox> | 
 |  |  |               </a-checkbox-group> | 
 |  |  | 
 |  |  |             </template> | 
 |  |  |             <a-checkbox-group | 
 |  |  |               v-model="checkedKeysDialog" | 
 |  |  |               direction="vertical" | 
 |  |  |               @change="onCheckDialog" | 
 |  |  |             > | 
 |  |  |               <a-checkbox | 
 |  |  | 
 |  |  |                 :value="dialog.id" | 
 |  |  |                 :lable="dialog.name" | 
 |  |  |                 @change="onCheckDialog" | 
 |  |  |               > | 
 |  |  |                 style="width:150px"> | 
 |  |  |                 {{ dialog.name }} | 
 |  |  |               </a-checkbox> | 
 |  |  |             </a-checkbox-group> | 
 |  |  |             <a-checkbox-group | 
 |  |  |               v-model="checkedKeysDialog" | 
 |  |  |               @change="onCheckDialog" | 
 |  |  |             > | 
 |  |  |               <a-checkbox | 
 |  |  |                 v-for="(agent, index) of AgentList" | 
 |  |  |                 :value="agent.id" | 
 |  |  |                 :lable="agent.title" | 
 |  |  |                 @change="onCheckAgent" | 
 |  |  |                 style="width:150px"> | 
 |  |  |                 {{ agent.title }} | 
 |  |  |               </a-checkbox> | 
 |  |  |             </a-checkbox-group> | 
 |  |  |           </a-tab-pane> | 
 |  |  | 
 |  |  |   } from "@/api/authority"; | 
 |  |  |   import { Modal } from '@arco-design/web-vue'; | 
 |  |  |   import Authheader from '@/views/authority/components/authheader.vue'; | 
 |  |  |  | 
 |  |  |   let treeData = ref([]); | 
 |  |  |   let checkedKeys = ref([]); | 
 |  |  |   let expandKdys = ref([]); | 
 |  |  |   let checkStrictly = ref([]); | 
 |  |  |   import router from "@/router"; | 
 |  |  |   import { queryCanvasList } from "@/api/Agent"; | 
 |  |  |  | 
 |  |  |   let treeDataMenu = ref([]); | 
 |  |  |   let checkedKeysMenu = ref([]); | 
 |  |  | 
 |  |  |   let checkedKeysDialog = ref([]); | 
 |  |  |   let checkStrictlyDialog = ref([]); | 
 |  |  |  | 
 |  |  |   let checkedKeysAgent = ref([]); | 
 |  |  |   let checkStrictlyAgent = ref([]); | 
 |  |  |  | 
 |  |  |   let knowledgeList = ref([]); | 
 |  |  |   let DialogsList = ref([]); | 
 |  |  |   let AgentList = ref([]); | 
 |  |  |  | 
 |  |  |   let menuTips = ref(['权限管理', '角色']); | 
 |  |  |   type SizeProps = 'mini' | 'small' | 'medium' | 'large'; | 
 |  |  | 
 |  |  |  | 
 |  |  |   let size = ref<SizeProps>('medium'); | 
 |  |  |   let visible = ref(false); | 
 |  |  |   let deptvisible = ref(false); | 
 |  |  |   let resourcevisible = ref(false); | 
 |  |  |   let selectRole = ref({}); | 
 |  |  |  | 
 |  |  |   const onCheck = (newCheckedKeys, event) => { | 
 |  |  |     let o = { deptId: event.node.deptId, deptName: event.node.deptName }; | 
 |  |  |     if (event.checked) { | 
 |  |  |       checkStrictly.value.push(o); | 
 |  |  |     } else { | 
 |  |  |       checkStrictly.value.forEach((val, idx, array) => { | 
 |  |  |         // val: 当前值 | 
 |  |  |         if (val.deptId == event.node.deptId) { | 
 |  |  |           checkStrictly.value.splice(idx, 1); | 
 |  |  |           return true; | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |     } | 
 |  |  |   }; | 
 |  |  |   const onCheckMenu = (newCheckedKeys, event) => { | 
 |  |  |     let o = { menuId: event.node.menuId, menuName: event.node.menuName }; | 
 |  |  |     if (event.checked) { | 
 |  |  | 
 |  |  |         // val: 当前值 | 
 |  |  |         if (val.knowledgeId == event.target.value) { | 
 |  |  |           checkStrictlyKnowledge.value.splice(idx, 1); | 
 |  |  |           return true; | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |     } | 
 |  |  |   }; | 
 |  |  |   const onCheckAgent = (newCheckedKeys, event) => { | 
 |  |  |     let o = { | 
 |  |  |       agentId: event.target.value, | 
 |  |  |       agentTitle: event.target.labels[0].innerText, | 
 |  |  |     }; | 
 |  |  |     if (event.target.checked) { | 
 |  |  |       checkStrictlyAgent.value.push(o); | 
 |  |  |     } else { | 
 |  |  |       checkStrictlyAgent.value.forEach((val, idx, array) => { | 
 |  |  |         // val: 当前值 | 
 |  |  |         if (val.agentId == event.target.value) { | 
 |  |  |           checkStrictlyAgent.value.splice(idx, 1); | 
 |  |  |           return true; | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  | 
 |  |  |       dataIndex: 'roleName', | 
 |  |  |     }, | 
 |  |  |     { | 
 |  |  |       title: t('创建时间'), | 
 |  |  |       dataIndex: 'createTime', | 
 |  |  |     }, | 
 |  |  |     { | 
 |  |  |       title: t('权限字符串'), | 
 |  |  |       dataIndex: 'roleKey', | 
 |  |  |       slotName: 'roleKey', | 
 |  |  |     }, | 
 |  |  |     { | 
 |  |  |       title: t('状态'), | 
 |  |  |       dataIndex: 'status', | 
 |  |  |       slotName: 'status', | 
 |  |  | 
 |  |  |       visible.value = false; | 
 |  |  |     } | 
 |  |  |     if (type == 2) { | 
 |  |  |       deptvisible.value = false; | 
 |  |  |     } | 
 |  |  |     if (type == 2) { | 
 |  |  |       resourcevisible.value = false; | 
 |  |  |     } | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const editDeptHandleOk = async () => { | 
 |  |  |     let depts: Array = [], | 
 |  |  |       role: Role = { roleId: selectRole.value.roleId }; | 
 |  |  |     checkStrictly.value.forEach((val) => { | 
 |  |  |       depts.push(val.deptId); | 
 |  |  |     }); | 
 |  |  |     role.dept = depts; | 
 |  |  |     await RoleEdit(role).then((res) => { | 
 |  |  |       fetchData(); | 
 |  |  |     }); | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const editResourceHandleOk = async () => { | 
 |  |  |     let resources: Array = [], | 
 |  |  | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const editHandleOk = async () => { | 
 |  |  |     if(editform.value.roleName==""){ | 
 |  |  |       Modal.warning({ | 
 |  |  |         title: '警告', | 
 |  |  |         content: '名称不能为空' | 
 |  |  |       }); | 
 |  |  |       return; | 
 |  |  |     } | 
 |  |  |     if (editform.value.roleId.length > 0) { | 
 |  |  |       await RoleEdit({ | 
 |  |  |         ...editform.value, | 
 |  |  | 
 |  |  |       editform.value.roleKey = ""; | 
 |  |  |       editform.value.remark = ""; | 
 |  |  |     } | 
 |  |  |     //编辑 | 
 |  |  |     if (t == 2) { | 
 |  |  |       visible.value = true; | 
 |  |  |       save.value = '编辑'; | 
 |  |  |       editform.value.roleId=record.roleId | 
 |  |  |       editform.value.roleName = record.roleName; | 
 |  |  |       editform.value.roleKey = record.roleKey; | 
 |  |  |       editform.value.remark = record.remark; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     //删除 | 
 |  |  |     if (t == 3) { | 
 |  |  |       await RoleDelete(record.roleId).then((res) => { | 
 |  |  | 
 |  |  |         }); | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |     //机构 | 
 |  |  |     if (t == 5) { | 
 |  |  |       deptvisible.value = true; | 
 |  |  |       checkedKeys.value = []; | 
 |  |  |       expandKdys.value = []; | 
 |  |  |       checkStrictly.value = []; | 
 |  |  |       selectRole.value = record; | 
 |  |  |       expandKdys.value.push('0'); | 
 |  |  |       if (record.dept) { | 
 |  |  |         record.dept.forEach((val) => { | 
 |  |  |           checkStrictly.value.push({ | 
 |  |  |             deptId: val.deptId, | 
 |  |  |             deptName: val.deptName, | 
 |  |  |           }); | 
 |  |  |           checkedKeys.value.push(val.deptId); | 
 |  |  |           expandKdys.value.push(val.deptId); | 
 |  |  |         }); | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const fetchData = async ( | 
 |  |  | 
 |  |  |     fetchData({ ...basePagination, current }); | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const OrganizationData = async (key) => { | 
 |  |  |     await OrganizationList(key).then((res) => { | 
 |  |  |       treeData.value = [...res.rows]; | 
 |  |  |     }); | 
 |  |  |   }; | 
 |  |  |  | 
 |  |  |   const MenuData = async (key) => { | 
 |  |  |     await ResourceList(key).then((res) => { | 
 |  |  |       treeDataMenu.value = [...res.rows]; | 
 |  |  | 
 |  |  |   DialogList().then((res) => { | 
 |  |  |     DialogsList.value = res.rows; | 
 |  |  |   }); | 
 |  |  |   queryCanvasList(null).then((canvas) => { | 
 |  |  |     AgentList= canvas.data | 
 |  |  |   }); | 
 |  |  |   fetchData(); | 
 |  |  |   OrganizationData(''); | 
 |  |  |   MenuData(); | 
 |  |  |  | 
 |  |  |   const reset = () => { |