初始化项目

2024-11-14 11:06:38 +08:00
parent 988b9e6799
commit 4ffac789e1
320 changed files with 34244 additions and 0 deletions
--- a/src/views/manage/role/modules/menu-auth.vue
+++ b/src/views/manage/role/modules/menu-auth.vue
@@ -0,0 +1,123 @@
+<script setup lang="ts">
+import type { DataNode } from 'ant-design-vue/es/tree';
+import { SimpleScrollbar } from '@sa/materials';
+
+defineOptions({
+  name: 'MenuAuthModal'
+});
+
+interface Props {
+  /** the roleId */
+  roleId: number;
+  type: 'add' | 'edit';
+  drawerVisible: boolean;
+}
+
+const props = defineProps<Props>();
+const menuIds = defineModel<number[]>('menuIds', { default: [] });
+
+const tree = shallowRef<DataNode[]>([]);
+
+watch(
+  () => props.drawerVisible,
+  val => {
+    if (val) {
+      init();
+    }
+  },
+  {
+    immediate: true
+  }
+);
+
+async function getTree() {
+  const { error, data } = await fetchGetMenuTree();
+
+  if (!error) {
+    tree.value = recursiveTransform(data);
+  }
+}
+
+function recursiveTransform(data: Api.SystemManage.MenuTree[]): DataNode[] {
+  return data.map(item => {
+    const { id: key, label } = item;
+
+    if (item.children) {
+      return {
+        key,
+        title: label,
+        children: recursiveTransform(item.children)
+      };
+    }
+
+    return {
+      key,
+      title: label
+    };
+  });
+}
+
+async function getChecks() {
+  const { data, error } = await doGetRoleMenuList(props.roleId);
+  if (!error) {
+    if (props.type === 'edit') {
+      tree.value = recursiveTransform(data.menus);
+      nextTick(() => {
+        menuIds.value = data.checkedKeys;
+      });
+    }
+  }
+}
+
+async function init() {
+  if (props.type === 'edit') {
+    await getChecks();
+  } else {
+    await getTree();
+  }
+}
+
+function clearChecks() {
+  menuIds.value = [];
+}
+
+defineExpose({
+  clearChecks,
+  checkedKeys: menuIds,
+  tree
+});
+</script>
+
+<template>
+  <div class="border-0.5 border-gray-300 rounded-md p-2 transition-all dark:border-dark-300" hover="border-gray-500">
+    <SimpleScrollbar>
+      <ATree
+        v-model:checked-keys="menuIds"
+        :selectable="false"
+        :virtual="false"
+        :tree-data="tree"
+        checkable
+        block-node
+      />
+    </SimpleScrollbar>
+  </div>
+</template>
+
+<style scoped>
+:deep(.ant-tree .ant-tree-switcher) {
+  line-height: normal;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+:deep(.ant-tree .ant-tree-checkbox) {
+  margin-block-start: unset;
+}
+
+:deep(.ant-tree .ant-tree-title) {
+  font-size: 14px;
+  padding: 2px;
+  font-weight: 500;
+}
+</style>