From a38fc307d056c901d140117e5498ce2d94ec577f Mon Sep 17 00:00:00 2001
From: dap <15891557205@163.com>
Date: Wed, 23 Oct 2024 13:46:23 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=A7=92=E8=89=B2=E7=AE=A1=E7=90=86=20?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E5=88=86=E9=85=8D=20=E8=8A=82=E7=82=B9?=
 =?UTF-8?q?=E7=8B=AC=E7=AB=8B=E4=B8=8B=E7=9A=84=E5=9B=9E=E6=98=BE=E5=8F=8A?=
 =?UTF-8?q?=E6=8F=90=E4=BA=A4=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                                  |   1 +
 apps/web-antd/src/views/system/role/data.tsx  |   9 +
 .../src/views/system/role/menu-select.vue     | 162 ------------------
 3 files changed, 10 insertions(+), 162 deletions(-)
 delete mode 100644 apps/web-antd/src/views/system/role/menu-select.vue

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b72ea5cd..125dd6d9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -18,6 +18,7 @@
 - VxeTable在开启/关闭查询表单时 需要使用不同的padding
 - VxeTable表格刷新 默认为reload 修改为在当前页刷新(query)
 - 岗位管理 部门参数错误
+- 角色管理 菜单分配 节点独立下的回显及提交问题
 
 **OTHERS**
 
diff --git a/apps/web-antd/src/views/system/role/data.tsx b/apps/web-antd/src/views/system/role/data.tsx
index 64761ec1..9c00056e 100644
--- a/apps/web-antd/src/views/system/role/data.tsx
+++ b/apps/web-antd/src/views/system/role/data.tsx
@@ -138,6 +138,15 @@ export const drawerSchema: FormSchemaGetter = () => [
     label: '角色状态',
     rules: 'required',
   },
+  {
+    component: 'Radio',
+    dependencies: {
+      show: () => false,
+      triggerFields: [''],
+    },
+    fieldName: 'menuCheckStrictly',
+    label: '菜单权限',
+  },
   {
     component: 'Input',
     defaultValue: [],
diff --git a/apps/web-antd/src/views/system/role/menu-select.vue b/apps/web-antd/src/views/system/role/menu-select.vue
deleted file mode 100644
index ef44b28b..00000000
--- a/apps/web-antd/src/views/system/role/menu-select.vue
+++ /dev/null
@@ -1,162 +0,0 @@
-<script setup lang="ts">
-import type { CheckboxChangeEvent } from 'ant-design-vue/es/checkbox/interface';
-import type { DataNode } from 'ant-design-vue/es/tree';
-import type { CheckInfo } from 'ant-design-vue/es/vc-tree/props';
-
-import { computed, type PropType, ref, watch } from 'vue';
-
-import { findGroupParentIds, treeToList } from '@vben/utils';
-
-import { Checkbox, Tree } from 'ant-design-vue';
-
-defineOptions({ inheritAttrs: false });
-
-const props = defineProps({
-  checkStrictly: {
-    default: true,
-    type: Boolean,
-  },
-  menuTree: {
-    default: () => [],
-    type: Array as PropType<DataNode[]>,
-  },
-});
-const emit = defineEmits<{ checkStrictlyChange: [boolean] }>();
-
-const expandStatus = ref(false);
-const selectAllStatus = ref(false);
-
-/**
- * 后台的这个字段跟antd/ele是反的
- * 组件库这个字段代表不关联
- * 后台这个代表关联
- */
-const innerCheckedStrictly = computed(() => {
-  return !props.checkStrictly;
-});
-
-function handleCheckStrictlyChange(e: CheckboxChangeEvent) {
-  emit('checkStrictlyChange', e.target.checked);
-}
-
-const associationText = computed(() => {
-  return props.checkStrictly ? '父子节点关联' : '父子节点独立';
-});
-
-/**
- * 这个只用于界面显示
- * 关联情况下 只会有最末尾的节点被选中
- */
-const checkedKeys = defineModel('value', {
-  default: () => [],
-  type: Array as PropType<(number | string)[]>,
-});
-// 所有节点的ID
-const allKeys = computed(() => {
-  return treeToList(props.menuTree).map((item: any) => item.id);
-});
-
-/** 已经选择的所有节点  包括子/父节点 */
-const checkedMenuKeys = ref<(number | string)[]>([]);
-
-/**
- * 取第一次的menuTree id 设置到checkedMenuKeys
- * 主要为了解决没有任何修改 直接点击保存的情况
- */
-const stop = watch(
-  () => props.menuTree,
-  () => {
-    /** 节点关联情况下是不带父节点的 */
-    if (props.checkStrictly) {
-      /** 找到父节点 添加上 */
-      const parentIds = findGroupParentIds(
-        props.menuTree,
-        checkedKeys.value as any,
-      );
-      checkedMenuKeys.value = [...parentIds, ...checkedKeys.value];
-    } else {
-      /** 节点独立 这里是全部的节点 */
-      checkedMenuKeys.value = checkedKeys.value;
-    }
-    stop();
-  },
-);
-
-/**
- *
- * @param checkedKeys 已经选中的子节点的ID
- * @param info info.halfCheckedKeys为父节点的ID
- */
-type CheckedState<T = number | string> =
-  | { checked: T[]; halfChecked: T[] }
-  | T[];
-function handleChecked(checkedKeys: CheckedState, info: CheckInfo) {
-  // 数组的话为节点关联
-  if (Array.isArray(checkedKeys)) {
-    const halfCheckedKeys: number[] = (info.halfCheckedKeys || []) as number[];
-    checkedMenuKeys.value = [...halfCheckedKeys, ...checkedKeys];
-  } else {
-    checkedMenuKeys.value = [...checkedKeys.checked];
-  }
-}
-
-function handleExpandChange(e: CheckboxChangeEvent) {
-  // 这个用于展示
-  checkedKeys.value = e.target.checked ? allKeys.value : [];
-  // 这个用于提交
-  checkedMenuKeys.value = e.target.checked ? allKeys.value : [];
-}
-
-const expandedKeys = ref<string[]>([]);
-function handleExpandOrCollapseAll(e: CheckboxChangeEvent) {
-  const expand = e.target.checked;
-  expandedKeys.value = expand ? allKeys.value : [];
-}
-
-defineExpose({
-  getCheckedKeys: () => checkedMenuKeys.value,
-});
-</script>
-
-<template>
-  <div class="bg-background w-full rounded-lg border-[1px] p-[12px]">
-    <div class="flex items-center gap-2 border-b-[1px] pb-2">
-      <span>节点状态: </span>
-      <span
-        :class="[props.checkStrictly ? 'text-primary' : 'text-red-500']"
-        class="font-semibold"
-      >
-        {{ associationText }}
-      </span>
-    </div>
-    <div
-      class="flex flex-wrap items-center justify-between border-b-[1px] py-2"
-    >
-      <Checkbox
-        v-model:checked="expandStatus"
-        @change="handleExpandOrCollapseAll"
-      >
-        展开/折叠全部
-      </Checkbox>
-      <Checkbox v-model:checked="selectAllStatus" @change="handleExpandChange">
-        全选/取消全选
-      </Checkbox>
-      <Checkbox :checked="checkStrictly" @change="handleCheckStrictlyChange">
-        父子节点关联
-      </Checkbox>
-    </div>
-    <div class="py-2">
-      <Tree
-        v-if="menuTree.length > 0"
-        v-model:check-strictly="innerCheckedStrictly"
-        v-model:checked-keys="checkedKeys"
-        v-model:expanded-keys="expandedKeys"
-        :checkable="true"
-        :field-names="{ title: 'label', key: 'id' }"
-        :selectable="false"
-        :tree-data="menuTree"
-        @check="handleChecked"
-      />
-    </div>
-  </div>
-</template>