diff --git a/src/api/v1/message.ts b/src/api/v1/message.ts new file mode 100644 index 0000000..a379207 --- /dev/null +++ b/src/api/v1/message.ts @@ -0,0 +1,22 @@ +import { http } from '@/api/service/request'; +import type { BaseResult, ResultTable } from '@/api/service/types'; + +/** 系统消息---获取系统消息列表 */ +export const fetchGetMessageList = (data: any) => { + return http.request>('get', `message/getMessageList/${data.currentPage}/${data.pageSize}`, { params: data }); +}; + +/** 系统消息---添加系统消息 */ +export const fetchAddMessage = (data: any) => { + return http.request>('post', 'message/addMessage', { data }); +}; + +/** 系统消息---更新系统消息 */ +export const fetchUpdateMessage = (data: any) => { + return http.request>('put', 'message/updateMessage', { data }); +}; + +/** 系统消息---删除系统消息 */ +export const fetchDeleteMessage = (data: any) => { + return http.request>('delete', 'message/deleteMessage', { data }); +}; diff --git a/src/store/message/message.ts b/src/store/message/message.ts new file mode 100644 index 0000000..1719dda --- /dev/null +++ b/src/store/message/message.ts @@ -0,0 +1,81 @@ +import { defineStore } from 'pinia'; +import { fetchAddMessage, fetchDeleteMessage, fetchGetMessageList, fetchUpdateMessage } from '@/api/v1/message'; +import { pageSizes } from '@/enums/baseConstant'; +import { storeMessage } from '@/utils/message'; +import { storePagination } from '@/store/useStorePagination'; + +/** + * 系统消息 Store + */ +export const useMessageStore = defineStore('messageStore', { + state() { + return { + // 系统消息列表 + datalist: [], + // 查询表单 + form: { + // 消息标题 + title: undefined, + // 接收人用户ID + receivedUserId: undefined, + // 发送人用户ID + sendUserId: undefined, + // 发送人昵称 + sendNickName: undefined, + // 消息类型 + messageType: undefined, + // 消息内容 + content: undefined, + // 编辑器类型 + editorType: undefined, + // 0:未读 1:已读 + status: undefined, + }, + // 分页查询结果 + pagination: { + currentPage: 1, + pageSize: 150, + total: 100, + pageSizes, + }, + // 加载 + loading: false, + }; + }, + getters: {}, + actions: { + /** 获取系统消息 */ + async getMessageList() { + // 整理请求参数 + const data = { ...this.pagination, ...this.form }; + delete data.pageSizes; + delete data.total; + delete data.background; + + // 获取系统消息列表 + const result = await fetchGetMessageList(data); + + // 公共页面函数hook + const pagination = storePagination.bind(this); + return pagination(result); + }, + + /** 添加系统消息 */ + async addMessage(data: any) { + const result = await fetchAddMessage(data); + return storeMessage(result); + }, + + /** 修改系统消息 */ + async updateMessage(data: any) { + const result = await fetchUpdateMessage(data); + return storeMessage(result); + }, + + /** 删除系统消息 */ + async deleteMessage(data: any) { + const result = await fetchDeleteMessage(data); + return storeMessage(result); + }, + }, +}); diff --git a/src/store/message/messageType.ts b/src/store/message/messageType.ts index 73f654f..f4296b5 100644 --- a/src/store/message/messageType.ts +++ b/src/store/message/messageType.ts @@ -1,5 +1,5 @@ import { defineStore } from 'pinia'; -import { fetchAddMessageType, fetchDeleteMessageType, fetchGetMessageTypeList, fetchUpdateMessageType } from '@/api/v1/messageType'; +import { fetchAddMessageType, fetchDeleteMessageType, fetchGetAllMessageTypes, fetchGetMessageTypeList, fetchUpdateMessageType } from '@/api/v1/messageType'; import { pageSizes } from '@/enums/baseConstant'; import { storeMessage } from '@/utils/message'; import { storePagination } from '@/store/useStorePagination'; @@ -12,6 +12,8 @@ export const useMessageTypeStore = defineStore('messageTypeStore', { return { // 系统消息类型列表 datalist: [], + // 所有消息类型 + allMessageTypeList: [], // 查询表单 form: { // 1:启用 0:禁用 @@ -52,6 +54,12 @@ export const useMessageTypeStore = defineStore('messageTypeStore', { return pagination(result); }, + /** 所有系统类型 */ + async getAllMessageTypeList() { + const baseResult = await fetchGetAllMessageTypes(); + this.allMessageTypeList = baseResult.data; + }, + /** 添加系统消息类型 */ async addMessageType(data: any) { const result = await fetchAddMessageType(data); diff --git a/src/views/message/message/index.vue b/src/views/message/message/index.vue new file mode 100644 index 0000000..694ad29 --- /dev/null +++ b/src/views/message/message/index.vue @@ -0,0 +1,153 @@ + + + diff --git a/src/views/message/message/message-dialog.vue b/src/views/message/message/message-dialog.vue new file mode 100644 index 0000000..0a9356b --- /dev/null +++ b/src/views/message/message/message-dialog.vue @@ -0,0 +1,120 @@ + + + diff --git a/src/views/message/message/utils/columns.ts b/src/views/message/message/utils/columns.ts new file mode 100644 index 0000000..31d1d2f --- /dev/null +++ b/src/views/message/message/utils/columns.ts @@ -0,0 +1,56 @@ +import { reactive } from 'vue'; +import { $t } from '@/plugins/i18n'; +import type { FormRules } from 'element-plus'; + +// 表格列 +export const columns: TableColumnList = [ + { type: 'selection', align: 'left' }, + { type: 'index', index: (index: number) => index + 1, label: '序号', width: 60 }, + // 消息标题 + { label: $t('title'), prop: 'title' }, + // 接收人用户ID + { + label: $t('receivedUserId'), + prop: 'receivedUserId', + formatter({ receivedUserId }) { + return !receivedUserId ? $t('all') : receivedUserId; + }, + }, + // 发送人用户ID + { label: $t('sendUserId'), prop: 'sendUserId' }, + // 发送人昵称 + { label: $t('sendNickName'), prop: 'sendNickName' }, + // 消息类型 + { label: $t('messageType'), prop: 'messageType' }, + // 消息内容 + { label: $t('content'), prop: 'content' }, + // 编辑器类型 + { label: $t('editorType'), prop: 'editorType' }, + // 0:未读 1:已读 + { label: $t('status'), prop: 'status' }, + { label: $t('table.updateTime'), prop: 'updateTime', sortable: true, width: 160 }, + { label: $t('table.createTime'), prop: 'createTime', sortable: true, width: 160 }, + { label: $t('table.createUser'), prop: 'createUser', slot: 'createUser', width: 90 }, + { label: $t('table.updateUser'), prop: 'updateUser', slot: 'updateUser', width: 90 }, + { label: $t('table.operation'), fixed: 'right', width: 210, slot: 'operation' }, +]; + +// 添加规则 +export const rules = reactive({ + // 消息标题 + title: [{ required: true, message: `${$t('input')}${$t('title')}`, trigger: 'blur' }], + // 发送人用户ID + sendUserId: [{ required: true, message: `${$t('input')}${$t('sendUserId')}`, trigger: 'blur' }], + // 消息类型 + messageType: [{ required: true, message: `${$t('input')}${$t('messageType')}`, trigger: 'blur' }], + // 消息内容 + content: [{ required: true, message: `${$t('input')}${$t('content')}`, trigger: 'blur' }], + // 编辑器类型 + editorType: [{ required: true, message: `${$t('input')}${$t('editorType')}`, trigger: 'blur' }], +}); + +/** 编辑器类型 */ +export const editorTypeList = [ + { label: $t('markdown'), value: 'markdown' }, + { label: $t('richText'), value: 'richText' }, +]; diff --git a/src/views/message/message/utils/hooks.ts b/src/views/message/message/utils/hooks.ts new file mode 100644 index 0000000..33b7df6 --- /dev/null +++ b/src/views/message/message/utils/hooks.ts @@ -0,0 +1,141 @@ +import { addDialog } from '@/components/BaseDialog/index'; +import MessageDialog from '@/views/message/message/message-dialog.vue'; +import { useMessageStore } from '@/store/message/message'; +import { h, ref } from 'vue'; +import { message, messageBox } from '@/utils/message'; +import type { FormItemProps } from '@/views/message/message/utils/types'; +import { $t } from '@/plugins/i18n'; +import DeleteBatchDialog from '@/components/Table/DeleteBatchDialog.vue'; + +export const formRef = ref(); +// 删除ids +export const deleteIds = ref([]); +const messageStore = useMessageStore(); + +/** 搜索初始化系统消息 */ +export async function onSearch() { + messageStore.loading = true; + await messageStore.getMessageList(); + messageStore.loading = false; +} + +/** 添加系统消息 */ +export function onAdd() { + addDialog({ + title: `${$t('addNew')}${$t('message')}`, + width: '30%', + props: { + formInline: { + title: undefined, + receivedUserId: undefined, + sendUserId: undefined, + sendNickName: undefined, + messageType: undefined, + content: undefined, + editorType: undefined, + status: undefined, + }, + }, + draggable: true, + fullscreenIcon: true, + closeOnClickModal: false, + contentRenderer: () => h(MessageDialog, { ref: formRef }), + beforeSure: (done, { options }) => { + const form = options.props.formInline as FormItemProps; + formRef.value.formRef.validate(async (valid: any) => { + if (!valid) return; + + const result = await messageStore.addMessage(form); + if (!result) return; + done(); + await onSearch(); + }); + }, + }); +} + +/** + * * 更新系统消息 + * @param row + */ +export function onUpdate(row: any) { + addDialog({ + title: `${$t('modify')}${$t('message')}`, + width: '30%', + props: { + formInline: { + title: row.title, + receivedUserId: row.receivedUserId, + sendUserId: row.sendUserId, + sendNickName: row.sendNickName, + messageType: row.messageType, + content: row.content, + editorType: row.editorType, + status: row.status, + }, + }, + draggable: true, + fullscreenIcon: true, + closeOnClickModal: false, + contentRenderer: () => h(MessageDialog, { ref: formRef }), + beforeSure: (done, { options }) => { + const form = options.props.formInline as FormItemProps; + formRef.value.formRef.validate(async (valid: any) => { + if (!valid) return; + + const result = await messageStore.updateMessage({ ...form, id: row.id }); + if (!result) return; + done(); + await onSearch(); + }); + }, + }); +} + +/** 删除系统消息 */ +export const onDelete = async (row: any) => { + const id = row.id; + + // 是否确认删除 + const result = await messageBox({ + title: $t('confirmDelete'), + showMessage: false, + confirmMessage: undefined, + cancelMessage: $t('cancel_delete'), + }); + if (!result) return; + + // 删除数据 + await messageStore.deleteMessage([id]); + await onSearch(); +}; + +/** 批量删除 */ +export const onDeleteBatch = async () => { + const ids = deleteIds.value; + const formDeletedBatchRef = ref(); + + addDialog({ + title: $t('deleteBatchTip'), + width: '30%', + props: { formInline: { confirmText: '' } }, + draggable: true, + fullscreenIcon: true, + closeOnClickModal: false, + contentRenderer: () => h(DeleteBatchDialog, { ref: formDeletedBatchRef }), + beforeSure: (done, { options }) => { + formDeletedBatchRef.value.formDeletedBatchRef.validate(async (valid: any) => { + if (!valid) return; + + const text = options.props.formInline.confirmText.toLowerCase(); + if (text === 'yes' || text === 'y') { + // 删除数据 + await messageStore.deleteMessage(ids); + await onSearch(); + + done(); + } else message($t('deleteBatchTip'), { type: 'warning' }); + }); + }, + }); +}; diff --git a/src/views/message/message/utils/types.ts b/src/views/message/message/utils/types.ts new file mode 100644 index 0000000..631756e --- /dev/null +++ b/src/views/message/message/utils/types.ts @@ -0,0 +1,24 @@ +// 添加或者修改表单元素 +export interface FormItemProps { + // 消息标题 + title: string; + // 接收人用户ID + receivedUserId: number; + // 发送人用户ID + sendUserId: number; + // 发送人昵称 + sendNickName: string; + // 消息类型 + messageType: string; + // 消息内容 + content: string; + // 编辑器类型 + editorType: string; + // 0:未读 1:已读 + status: boolean; +} + +// 添加或修改表单Props +export interface FormProps { + formInline: FormItemProps; +}