初始化

zhuoyuan.wang

2024-06-19 15ebe96f28cadec6a726c5324593a40bbf56205f

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
<template>
  <app-page-tab v-bind="tabPageProps">
    <template #header-button="scope" v-if="view === 'index'">
      <el-button
        size="small"
        icon="Search"
        type="primary"
        :disabled="!scope.selected?.edit?.id"
        @click="onOpenDetail(scope.selected.edit)">
        {{
          $t('common.button.text.view')
        }}
      </el-button>
      <el-button
        size="small"
        icon="Plus"
        type="primary"
        @click="onTabForm({})">
        {{
          $t('common.button.text.add')
        }}
      </el-button>
      <el-button
        size="small"
        type="primary"
        icon="Edit"
        :disabled="!scope.selected?.edit?.id"
        @click="onTabForm({...scope.selected.edit})"
      >
        {{ $t('common.button.text.edit') }}
      </el-button>
      <el-button
        :disabled="!scope.selected?.edit?.id"
        size="small"
        type="danger"
        icon="Delete"
        @click="onDelete(scope.selected?.edit)"
      >
      </el-button>
    </template>
    <template #index="scope">
      <index-page v-bind="indexPageProps"/>
    </template>
    <template #form="scope">
      <form-page v-bind="formPageProps"/>
    </template>
    <template #detail="scope">
      <detail-page v-bind="detailPageProps"/>
    </template>
  </app-page-tab>
</template>
 
<script setup name="systemFile">
 
import IndexPage from './IndexPage';
import FormPage from './FormPage';
import DetailPage from './DetailPage';
 
import {useI18n} from 'vue-i18n';
 
const {t} = useI18n();
 
const router = useRouter();
 
const params = router.currentRoute.value.query;
 
const pageTabRef = ref();
 
const indexPageRef = ref();
 
const indexPageProps = {
  ref: indexPageRef,
  async subCurrent(row) {
    await nextTick();
    pageTabRef.value.assignSelected({edit: row});
  }
}
 
const formPageRef = ref();
 
const formPageProps = {
  ref: formPageRef,
}
 
const detailPageRef = ref();
 
const detailPageProps = {
  ref: detailPageRef,
}
 
/**
 * index form chart
 */
const view = params.view || 'index';
 
const tabPageProps = {
  ref: pageTabRef,
  tabList: [{name: view, title: t('views.system.systemNotice.title')}],
};
 
const onOpenDetail = (row) => indexPageRef.value.onOpenDetail(row);
 
const onTabForm = (row) => indexPageRef.value.onTabForm(row);
 
const onDelete = (row) => indexPageRef.value.onDelete(row);
 
</script>