houzhongjian
2024-08-08 820397e43a0b64d35c6d31d2a55475061438593b
提交 | 用户 | 时间
820397 1 <template>
H 2   <!-- 搜索工作栏 -->
3   <ContentWrap>
4     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams">
5       <!-- 新增等操作按钮 -->
6       <template #actionMore>
7         <el-button
8           type="primary"
9           plain
10           @click="openForm('create')"
11           v-hasPermi="['system:mail-template:create']"
12         >
13           <Icon icon="ep:plus" class="mr-5px" /> 新增
14         </el-button>
15       </template>
16     </Search>
17   </ContentWrap>
18
19   <!-- 列表 -->
20   <ContentWrap>
21     <Table
22       :columns="allSchemas.tableColumns"
23       :data="tableObject.tableList"
24       :loading="tableObject.loading"
25       :pagination="{
26         total: tableObject.total
27       }"
28       v-model:pageSize="tableObject.pageSize"
29       v-model:currentPage="tableObject.currentPage"
30     >
31       <template #action="{ row }">
32         <el-button
33           link
34           type="primary"
35           @click="openSendForm(row.id)"
36           v-hasPermi="['system:mail-template:send-mail']"
37         >
38           测试
39         </el-button>
40         <el-button
41           link
42           type="primary"
43           @click="openForm('update', row.id)"
44           v-hasPermi="['system:mail-template:update']"
45         >
46           编辑
47         </el-button>
48         <el-button
49           link
50           type="danger"
51           v-hasPermi="['system:mail-template:delete']"
52           @click="handleDelete(row.id)"
53         >
54           删除
55         </el-button>
56       </template>
57     </Table>
58   </ContentWrap>
59
60   <!-- 表单弹窗:添加/修改 -->
61   <MailTemplateForm ref="formRef" @success="getList" />
62
63   <!-- 表单弹窗:发送测试 -->
64   <MailTemplateSendForm ref="sendFormRef" />
65 </template>
66 <script lang="ts" setup>
67 import { allSchemas } from './template.data'
68 import * as MailTemplateApi from '@/api/system/mail/template'
69 import MailTemplateForm from './MailTemplateForm.vue'
70 import MailTemplateSendForm from './MailTemplateSendForm.vue'
71
72 defineOptions({ name: 'SystemMailTemplate' })
73
74 // tableObject:表格的属性对象,可获得分页大小、条数等属性
75 // tableMethods:表格的操作对象,可进行获得分页、删除记录等操作
76 const { tableObject, tableMethods } = useTable({
77   getListApi: MailTemplateApi.getMailTemplatePage, // 分页接口
78   delListApi: MailTemplateApi.deleteMailTemplate // 删除接口
79 })
80 // 获得表格的各种操作
81 const { getList, setSearchParams } = tableMethods
82
83 /** 添加/修改操作 */
84 const formRef = ref()
85 const openForm = (type: string, id?: number) => {
86   formRef.value.open(type, id)
87 }
88
89 /** 删除按钮操作 */
90 const handleDelete = (id: number) => {
91   tableMethods.delList(id, false)
92 }
93
94 /** 发送测试操作 */
95 const sendFormRef = ref()
96 const openSendForm = (id: number) => {
97   sendFormRef.value.open(id)
98 }
99
100 /** 初始化 **/
101 onMounted(() => {
102   getList()
103 })
104 </script>