初始化

ny

昨天 282fbc6488f4e8ceb5fda759f963ee88fbf7b999

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<script lang="ts" setup>
import type { TreeActionType } from '@jnpf/ui';
 
import { nextTick, onMounted, reactive, ref, toRefs, unref } from 'vue';
 
import { useMessage } from '@jnpf/hooks';
import { BasicTree } from '@jnpf/ui';
 
import { getCommonAuthValues, updateCommonAuthList } from '#/api/permission/auth';
 
interface State {
  loading: boolean;
  objectId: string;
  treeData: any[];
  selectedIds: any[];
  btnLoading: boolean;
}
const props = defineProps({
  id: { type: String, default: '' },
  type: { type: String, default: 'Portal' },
  objectType: { type: String, default: 'role' },
});
 
const { createMessage } = useMessage();
const treeRef = ref<Nullable<TreeActionType>>(null);
const state = reactive<State>({
  loading: false,
  objectId: '',
  selectedIds: [],
  treeData: [],
  btnLoading: false,
});
const { treeData, loading, btnLoading } = toRefs(state);
 
defineExpose({ handleExpandAll, handleCheckAll, handleSubmit, btnLoading, loading });
 
function init() {
  state.objectId = props.id;
  state.btnLoading = false;
  getAuthorizeList();
}
function getAuthorizeList() {
  state.loading = true;
  state.treeData = [];
  state.selectedIds = [];
  getTree().setCheckedKeys([]);
  if (!props.type || !state.objectId) return;
  getCommonAuthValues(props.type, state.objectId, { objectType: props.objectType })
    .then((res) => {
      state.treeData = res.data.list || [];
      const parentKeys = getTree().getParentKeys(state.treeData, true);
      const dataIds = [...new Set([...res.data.ids, ...state.selectedIds])];
      state.selectedIds = dataIds;
      const checkedKeys = dataIds.filter((o) => !parentKeys.includes(o));
      nextTick(() => {
        getTree().setCheckedKeys(checkedKeys);
        state.loading = false;
      });
    })
    .catch(() => {
      state.loading = false;
    });
}
function onCheck(checkedKeys, e) {
  const dataIds = [...checkedKeys, ...e.halfCheckedKeys];
  state.selectedIds = dataIds;
}
function handleCheckAll(boo) {
  getTree().checkAll(boo);
  nextTick(() => {
    const checkedKeys: any[] = getTree().getCheckedKeys() as any[];
    state.selectedIds = checkedKeys;
  });
}
function handleExpandAll(boo) {
  getTree().expandAll(boo);
}
function getTree() {
  const tree = unref(treeRef);
  if (!tree) throw new Error('tree is null!');
  return tree;
}
function handleSubmit() {
  state.btnLoading = true;
  updateCommonAuthList(props.type, state.objectId, { ids: state.selectedIds, objectType: props.objectType })
    .then((res) => {
      createMessage.success(res.msg);
      state.btnLoading = false;
    })
    .catch(() => {
      state.btnLoading = false;
    });
}
 
onMounted(() => {
  init();
});
</script>
<template>
  <div class="auth-main-container">
    <div class="main h-full overflow-hidden" v-loading="loading">
      <BasicTree
        v-show="treeData.length"
        :tree-data="treeData"
        ref="treeRef"
        checkable
        block-node
        click-row-to-expand
        default-expand-all
        @check="onCheck"
        class="overflow-auto" />
      <div class="no-data" v-show="!treeData.length && !loading">
        <jnpf-empty />
      </div>
    </div>
  </div>
</template>