| 提交 | 用户 | 时间 | ||
| 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-account: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="openForm('update', row.id)" | |
| 36 | v-hasPermi="['system:mail-account:update']" | |
| 37 | > | |
| 38 | 编辑 | |
| 39 | </el-button> | |
| 40 | <el-button | |
| 41 | link | |
| 42 | type="primary" | |
| 43 | @click="openDetail(row.id)" | |
| 44 | v-hasPermi="['system:mail-account:query']" | |
| 45 | > | |
| 46 | 详情 | |
| 47 | </el-button> | |
| 48 | <el-button | |
| 49 | link | |
| 50 | type="danger" | |
| 51 | v-hasPermi="['system:mail-account:delete']" | |
| 52 | @click="handleDelete(row.id)" | |
| 53 | > | |
| 54 | 删除 | |
| 55 | </el-button> | |
| 56 | </template> | |
| 57 | </Table> | |
| 58 | </ContentWrap> | |
| 59 | ||
| 60 | <!-- 表单弹窗：添加/修改 --> | |
| 61 | <MailAccountForm ref="formRef" @success="getList" /> | |
| 62 | <!-- 详情弹窗 --> | |
| 63 | <MailAccountDetail ref="detailRef" /> | |
| 64 | </template> | |
| 65 | <script lang="ts" setup> | |
| 66 | import { allSchemas } from './account.data' | |
| 67 | import * as MailAccountApi from '@/api/system/mail/account' | |
| 68 | import MailAccountForm from './MailAccountForm.vue' | |
| 69 | import MailAccountDetail from './MailAccountDetail.vue' | |
| 70 | ||
| 71 | defineOptions({ name: 'SystemMailAccount' }) | |
| 72 | ||
| 73 | // tableObject：表格的属性对象，可获得分页大小、条数等属性 | |
| 74 | // tableMethods：表格的操作对象，可进行获得分页、删除记录等操作 | |
| 75 | const { tableObject, tableMethods } = useTable({ | |
| 76 | getListApi: MailAccountApi.getMailAccountPage, // 分页接口 | |
| 77 | delListApi: MailAccountApi.deleteMailAccount // 删除接口 | |
| 78 | }) | |
| 79 | // 获得表格的各种操作 | |
| 80 | const { getList, setSearchParams } = tableMethods | |
| 81 | ||
| 82 | /** 添加/修改操作 */ | |
| 83 | const formRef = ref() | |
| 84 | const openForm = (type: string, id?: number) => { | |
| 85 | formRef.value.open(type, id) | |
| 86 | } | |
| 87 | ||
| 88 | /** 详情操作 */ | |
| 89 | const detailRef = ref() | |
| 90 | const openDetail = (id: number) => { | |
| 91 | detailRef.value.open(id) | |
| 92 | } | |
| 93 | ||
| 94 | /** 删除按钮操作 */ | |
| 95 | const handleDelete = (id: number) => { | |
| 96 | tableMethods.delList(id, false) | |
| 97 | } | |
| 98 | ||
| 99 | /** 初始化 **/ | |
| 100 | onMounted(() => { | |
| 101 | getList() | |
| 102 | }) | |
| 103 | </script> | |
