Showing
1 changed file
with
52 additions
and
12 deletions
| 1 | <template> | 1 | <template> |
| 2 | <div> | 2 | <div> |
| 3 | - <BasicTable @register="registerTable"> | 3 | + <BasicTable |
| 4 | + @selection-change="useSelectionChange" | ||
| 5 | + :rowSelection="{ type: 'checkbox' }" | ||
| 6 | + @register="registerTable" | ||
| 7 | + > | ||
| 4 | <template #toolbar> | 8 | <template #toolbar> |
| 5 | <a-button type="primary" @click="handleCreate"> 新增消息模板 </a-button> | 9 | <a-button type="primary" @click="handleCreate"> 新增消息模板 </a-button> |
| 6 | - <a-button color="error" @click="handleDeleteOrBatchDelete(null)" :disabled="hasBatchDelete"> | 10 | + <a-button color="error" @click="handleDeleteOrBatchDelete(null)" :disabled="disabled"> |
| 7 | 批量删除 | 11 | 批量删除 |
| 8 | </a-button> | 12 | </a-button> |
| 9 | </template> | 13 | </template> |
| @@ -44,8 +48,7 @@ | @@ -44,8 +48,7 @@ | ||
| 44 | </div> | 48 | </div> |
| 45 | </template> | 49 | </template> |
| 46 | <script lang="ts"> | 50 | <script lang="ts"> |
| 47 | - import { defineComponent } from 'vue'; | ||
| 48 | - | 51 | + import { defineComponent, ref } from 'vue'; |
| 49 | import { BasicTable, TableAction, useTable } from '/@/components/Table'; | 52 | import { BasicTable, TableAction, useTable } from '/@/components/Table'; |
| 50 | import { useDrawer } from '/@/components/Drawer'; | 53 | import { useDrawer } from '/@/components/Drawer'; |
| 51 | import TemplateDrawer from './TemplateDrawer.vue'; | 54 | import TemplateDrawer from './TemplateDrawer.vue'; |
| @@ -57,21 +60,21 @@ | @@ -57,21 +60,21 @@ | ||
| 57 | import SendSms from '/@/views/message/template/SendSms.vue'; | 60 | import SendSms from '/@/views/message/template/SendSms.vue'; |
| 58 | import { MessageEnum } from '/@/enums/messageEnum'; | 61 | import { MessageEnum } from '/@/enums/messageEnum'; |
| 59 | import SendEmail from '/@/views/message/template/SendEmail.vue'; | 62 | import SendEmail from '/@/views/message/template/SendEmail.vue'; |
| 60 | - import { useBatchDelete } from '/@/hooks/web/useBatchDelete'; | 63 | + import { useMessage } from '/@/hooks/web/useMessage'; |
| 61 | 64 | ||
| 62 | export default defineComponent({ | 65 | export default defineComponent({ |
| 63 | name: 'MessageTemplateManagement', | 66 | name: 'MessageTemplateManagement', |
| 64 | components: { SendSms, SendEmail, BasicTable, TemplateDrawer, TableAction }, | 67 | components: { SendSms, SendEmail, BasicTable, TemplateDrawer, TableAction }, |
| 65 | setup() { | 68 | setup() { |
| 69 | + let selectedRowKeys: any = []; | ||
| 70 | + const disabled = ref(true); | ||
| 71 | + const { createMessage } = useMessage(); | ||
| 66 | const [registerModal, { openModal: openModal }] = useModal(); | 72 | const [registerModal, { openModal: openModal }] = useModal(); |
| 67 | const [registerMailModal, { openModal: openMailModal }] = useModal(); | 73 | const [registerMailModal, { openModal: openMailModal }] = useModal(); |
| 68 | const go = useGo(); | 74 | const go = useGo(); |
| 69 | const [registerDrawer, { openDrawer }] = useDrawer(); | 75 | const [registerDrawer, { openDrawer }] = useDrawer(); |
| 70 | - const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions } = useBatchDelete( | ||
| 71 | - deleteMessageTemplate, | ||
| 72 | - handleSuccess | ||
| 73 | - ); | ||
| 74 | - const [registerTable, { reload }] = useTable({ | 76 | + |
| 77 | + const [registerTable, { reload, getSelectRows, getSelectRowKeys }] = useTable({ | ||
| 75 | title: '消息模板列表', | 78 | title: '消息模板列表', |
| 76 | api: messageTemplatePage, | 79 | api: messageTemplatePage, |
| 77 | columns, | 80 | columns, |
| @@ -79,6 +82,7 @@ | @@ -79,6 +82,7 @@ | ||
| 79 | labelWidth: 120, | 82 | labelWidth: 120, |
| 80 | schemas: searchFormSchema, | 83 | schemas: searchFormSchema, |
| 81 | }, | 84 | }, |
| 85 | + rowKey: 'id', | ||
| 82 | useSearchForm: true, | 86 | useSearchForm: true, |
| 83 | showTableSetting: true, | 87 | showTableSetting: true, |
| 84 | bordered: true, | 88 | bordered: true, |
| @@ -90,7 +94,6 @@ | @@ -90,7 +94,6 @@ | ||
| 90 | slots: { customRender: 'action' }, | 94 | slots: { customRender: 'action' }, |
| 91 | fixed: 'right', | 95 | fixed: 'right', |
| 92 | }, | 96 | }, |
| 93 | - ...selectionOptions, | ||
| 94 | }); | 97 | }); |
| 95 | 98 | ||
| 96 | function handleCreate() { | 99 | function handleCreate() { |
| @@ -132,6 +135,42 @@ | @@ -132,6 +135,42 @@ | ||
| 132 | function goConfig() { | 135 | function goConfig() { |
| 133 | go(PageEnum.MESSAGE_CONFIG); | 136 | go(PageEnum.MESSAGE_CONFIG); |
| 134 | } | 137 | } |
| 138 | + const useSelectionChange = () => { | ||
| 139 | + selectedRowKeys = getSelectRowKeys(); | ||
| 140 | + if (selectedRowKeys.length > 0) { | ||
| 141 | + disabled.value = false; | ||
| 142 | + } | ||
| 143 | + const isJudge = getSelectRows().map((m) => m.status); | ||
| 144 | + if (isJudge.includes(1)) { | ||
| 145 | + disabled.value = true; | ||
| 146 | + } else { | ||
| 147 | + disabled.value = false; | ||
| 148 | + } | ||
| 149 | + if (isJudge.length === 0) { | ||
| 150 | + disabled.value = true; | ||
| 151 | + } | ||
| 152 | + }; | ||
| 153 | + // 删除或批量删除 | ||
| 154 | + const handleDeleteOrBatchDelete = async (record: Recordable | null) => { | ||
| 155 | + if (record) { | ||
| 156 | + try { | ||
| 157 | + await deleteMessageTemplate([record.id]); | ||
| 158 | + createMessage.success('删除成功'); | ||
| 159 | + handleSuccess(); | ||
| 160 | + } catch (e: any) {} | ||
| 161 | + } else { | ||
| 162 | + try { | ||
| 163 | + await deleteMessageTemplate(selectedRowKeys); | ||
| 164 | + createMessage.success('批量删除成功'); | ||
| 165 | + handleSuccess(); | ||
| 166 | + selectedRowKeys.length = 0; | ||
| 167 | + } catch (e: any) { | ||
| 168 | + selectedRowKeys.length = 0; | ||
| 169 | + } finally { | ||
| 170 | + selectedRowKeys.length = 0; | ||
| 171 | + } | ||
| 172 | + } | ||
| 173 | + }; | ||
| 135 | return { | 174 | return { |
| 136 | registerTable, | 175 | registerTable, |
| 137 | registerDrawer, | 176 | registerDrawer, |
| @@ -142,7 +181,8 @@ | @@ -142,7 +181,8 @@ | ||
| 142 | handleSuccess, | 181 | handleSuccess, |
| 143 | handleModal, | 182 | handleModal, |
| 144 | goConfig, | 183 | goConfig, |
| 145 | - hasBatchDelete, | 184 | + useSelectionChange, |
| 185 | + disabled, | ||
| 146 | handleDeleteOrBatchDelete, | 186 | handleDeleteOrBatchDelete, |
| 147 | }; | 187 | }; |
| 148 | }, | 188 | }, |