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
| <template>
| <div class="table-settings">
| <RedoSetting v-if="getSetting.size" />
| <SizeSetting v-if="getSetting.redo" />
| <ColumnSetting v-if="getSetting.setting" />
| <FullScreenSetting v-if="getSetting.fullScreen" />
| </div>
| </template>
| <script lang="ts">
| import { defineComponent, PropType, computed } from 'vue';
| import type { TableSetting } from '../../types/table';
| import { useI18n } from '/@/hooks/web/useI18n';
| import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
| import ColumnSetting from './ColumnSetting.vue';
| export default defineComponent({
| name: 'TableSetting',
| components: {
| ColumnSetting,
| SizeSetting: createAsyncComponent(() => import('./SizeSetting.vue')),
| RedoSetting: createAsyncComponent(() => import('./RedoSetting.vue')),
| FullScreenSetting: createAsyncComponent(() => import('./FullScreenSetting.vue')),
| },
| props: {
| setting: {
| type: Object as PropType<TableSetting>,
| default: {},
| },
| },
| setup(props) {
| const { t } = useI18n();
|
| const getSetting = computed(
| (): TableSetting => {
| return {
| redo: true,
| size: true,
| setting: true,
| fullScreen: false,
| ...props.setting,
| };
| }
| );
|
| return { getSetting, t };
| },
| });
| </script>
| <style lang="less">
| .table-settings {
| & > * {
| margin-right: 12px;
| }
|
| svg {
| width: 1.3em;
| height: 1.3em;
| }
| }
| </style>
|
|
