权限用户资源

yinbangzhong

2024-07-29 eeba916b840d8851bc38586fd162358f7ed1941e

 src/views/authority/users/index.vue

@@ -149,40 +149,58 @@

    </a-modal>
    <a-modal width="30%" v-model:visible="resourcevisible" title="权限配置" @cancel="handleCancel(3)"
             @ok="editDeptHandleOk">
             @ok="editResourceHandleOk">
      <div :style="{ display:'flex', 'flex-direction':'column' }">
        <a-tabs :style="{ width: '100%',height: '500px', 'overflow-y': 'auto' }">
          <a-tab-pane key="1">
            <template #title>
              <icon-calendar/> 菜单
              <icon-calendar />
              菜单
            </template>
            Content of Tab Panel 1
            <a-tree
              class="tree-demo"
              v-model:checked-keys="checkedKeysMenu"
              v-model:expanded-keys="expandKdysMenu"
              :checkable="true"
              :data="treeDataMenu"
              :show-line="showLineMenu"
              @check="onCheckMenu"
              :fieldNames="{
               key:'menuId',
              title:'menuName',
              children:'children',
            }"
              :check-strictly="checkStrictlyMenu"
            >
            </a-tree>
          </a-tab-pane>
          <a-tab-pane key="2">
            <template #title>
              <icon-clock-circle/> 知识库
              <icon-clock-circle />
              知识库
            </template>
            Content of Tab Panel 2
          </a-tab-pane>
          <a-tab-pane key="3">
            <template #title>
              <icon-user/> 智能体
              <icon-user />
              智能体
            </template>
            Content of Tab Panel 3
          </a-tab-pane>
        </a-tabs>
        <a-card  :style="{ width: '100%',height: '200px', 'overflow-y': 'auto', margin:'1px'}"
          class="card-demo"
          title="用户所有权限"
          hoverable
        <a-card :style="{ width: '100%',height: '200px', 'overflow-y': 'auto', margin:'1px'}"
                class="card-demo"
                title="用户所有权限"
                hoverable
        >
          <a-space wrap>
            <a-tag
              v-for="(tag, index) of checkResourceStrictly"
              :key="tag.deptId"
              @close="handleRemove(tag)"
              v-for="(tag, index) of checkStrictlyMenu"
              :key="tag.menuId"
              @close="handleMenuRemove(tag)"
            >
              {{ tag.deptName }}
              {{ tag.menuName }}
            </a-tag>
          </a-space>
        </a-card>
@@ -200,6 +218,7 @@
import type { TableColumnData } from "@arco-design/web-vue/es/table/interface";
import {
  OrganizationList,
  ResourceList,
  User,
  UserAdd,
  UserChangePwd,
@@ -215,7 +234,14 @@
let checkedKeys = ref([]);
let expandKdys = ref([]);
let checkStrictly = ref([]);
let checkResourceStrictly=ref([])


let treeDataMenu = ref([]);
let checkedKeysMenu = ref([]);
let expandKdysMenu = ref([]);
let checkStrictlyMenu = ref([]);


let menuTips = ref(["权限管理", "账号"]);
type SizeProps = "mini" | "small" | "medium" | "large";
const account = ref(null);
@@ -262,8 +288,25 @@

  }
};
const onCheckMenu = (newCheckedKeys, event) => {
  let o = { "menuId": event.node.menuId, "menuName": event.node.menuName };
  if (event.checked) {
    checkStrictlyMenu.value.push(o);
  } else {
    checkStrictlyMenu.value.forEach((val, idx, array) => {
      // val: 当前值
      if (val.menuId == event.node.menuId) {
        checkStrictlyMenu.value.splice(idx, 1);
        return true;
      }
    });
  }
};
const handleRemove = (key) => {
  checkStrictly.value = checkStrictly.value.filter((tag) => tag !== key);
};
const handleMenuRemove = (key) => {
  checkStrictlyMenu.value = checkStrictlyMenu.value.filter((tag) => tag !== key);
};
const basePagination: Pagination = {
  current: 1,
@@ -352,6 +395,17 @@
  });
};

const editResourceHandleOk = async () => {
  let resources: Array = [], user: User = { "userId": selectUser.value.userId };
  checkStrictlyMenu.value.forEach((val) => {
    resources.push(val.menuId);
  });
  user.resources = resources;
  await UserEdit(user).then((res) => {
    fetchData();
  });
};

const editHandleOk = async () => {
  if (editform.value.userId.length > 0) {
    await UserEdit({
@@ -414,7 +468,15 @@
  //权限
  if (t == 4) {
    resourcevisible.value = true;

    checkedKeysMenu.value = [];
    expandKdysMenu.value = [];
    checkStrictlyMenu.value = [];
    selectUser.value = record;
    record.resources.forEach((val) => {
      checkStrictlyMenu.value.push({ "menuId": val.menuId, "menuName": val.menuName });
      checkedKeysMenu.value.push(val.menuId);
      expandKdysMenu.value.push(val.menuId);
    });

  }
  //机构
@@ -468,9 +530,16 @@
    treeData.value = [...res.rows];
  });
};
const MenuData = async (key) => {
  await ResourceList(key).then((res) => {
    treeDataMenu.value = [...res.rows];
  });
};


fetchData();
OrganizationData("");
MenuData();

const reset = () => {
  formModel.value = generateFormModel();