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
| <template>
| <el-button type="info" @click="open">
| <cl-svg name="export" class="mr-[5px]" />
| {{ $t('导出') }}
| </el-button>
|
| <cl-form ref="Form" />
| </template>
|
| <script lang="ts" setup>
| defineOptions({
| name: 'menu-exp'
| });
|
| import { useForm } from '@cool-vue/crud';
| import { ElMessage } from 'element-plus';
| import { isEmpty } from 'lodash-es';
| import { type PropType } from 'vue';
| import { useCool } from '/@/cool';
| import dayjs from 'dayjs';
| import { useI18n } from 'vue-i18n';
|
| const { t } = useI18n();
| const props = defineProps({
| data: {
| type: Array as PropType<Eps.BaseSysMenuEntity[]>,
| default: () => []
| }
| });
|
| const { service, refs, setRefs } = useCool();
| const Form = useForm();
|
| function open() {
| Form.value?.open({
| title: t('导出'),
| width: '600px',
| props: {
| labelPosition: 'top'
| },
| op: {
| saveButtonText: t('导出')
| },
| items: [
| {
| label: t('选择菜单'),
| prop: 'ids',
| component: {
| name: 'el-tree-select',
| ref: setRefs('ids'),
| props: {
| data: props.data,
| nodeKey: 'id',
| multiple: true,
| showCheckbox: true,
| collapseTags: true,
| collapseTagsTooltip: true,
| props: {
| label: 'name',
| children: '_children'
| }
| }
| }
| }
| ],
| on: {
| submit(_, { done, close }) {
| // 取所有id
| const ids = [...refs.ids.getCheckedKeys(), ...refs.ids.getHalfCheckedKeys()];
|
| if (isEmpty(ids)) {
| ElMessage.warning(t('请先选择要导出的菜单'));
| done();
| } else {
| service.base.sys.menu
| .export({
| ids
| })
| .then(res => {
| close();
|
| // 创建 Blob 对象
| const blob = new Blob([JSON.stringify(res)], {
| type: 'application/json'
| });
|
| const url = URL.createObjectURL(blob);
|
| // 创建一个 <a> 元素
| const a = document.createElement('a');
| a.href = url;
| a.download =
| t('菜单数据') + ` ${dayjs().format('MM-DD HH_mm_ss')}.json`;
|
| // 模拟点击 <a> 元素以触发下载
| a.click();
|
| // 清理 URL 对象
| URL.revokeObjectURL(url);
| })
| .catch(err => {
| ElMessage.error(err.message);
| });
| }
| }
| }
| });
| }
| </script>
|
|
