From 89137c72ec0d02e617e09e68cfe0d12a6a8d76d2 Mon Sep 17 00:00:00 2001
From: xingyuv <xingyu4j@vip.qq.com>
Date: Thu, 23 Mar 2023 15:40:09 +0800
Subject: [PATCH] feat: notify message

---
 src/api/system/notify/message.ts              |   4 +-
 src/locales/lang/en/routes/basic.ts           |   3 +-
 src/locales/lang/zh-CN/routes/basic.ts        |   3 +-
 src/router/routes/index.ts                    |  12 ++
 src/views/system/notify/my/index.vue          |  67 ++++++++-
 src/views/system/notify/my/my.data.ts         | 113 ++++++++++++++
 .../system/notify/template/TemplateModal.vue  |  54 +++++++
 src/views/system/notify/template/index.vue    |  80 +++++++++-
 .../system/notify/template/template.data.ts   | 140 ++++++++++++++++++
 9 files changed, 470 insertions(+), 6 deletions(-)
 create mode 100644 src/views/system/notify/my/my.data.ts
 create mode 100644 src/views/system/notify/template/TemplateModal.vue
 create mode 100644 src/views/system/notify/template/template.data.ts

diff --git a/src/api/system/notify/message.ts b/src/api/system/notify/message.ts
index 1c6de78e..07cda56e 100644
--- a/src/api/system/notify/message.ts
+++ b/src/api/system/notify/message.ts
@@ -2,12 +2,12 @@ import { defHttp } from '@/utils/http/axios'
 import qs from 'qs'
 
 // 获得站内信分页
-export function getPostPage(params) {
+export function getNotifyMessagePage(params) {
   return defHttp.get({ url: '/system/notify-message/page', params })
 }
 
 // 获得我的站内信分页
-export function listSimplePosts(params) {
+export function getMyNotifyMessagePage(params) {
   return defHttp.get({ url: '/system/notify-message/my-page', params })
 }
 
diff --git a/src/locales/lang/en/routes/basic.ts b/src/locales/lang/en/routes/basic.ts
index 0855f9e5..d179c301 100644
--- a/src/locales/lang/en/routes/basic.ts
+++ b/src/locales/lang/en/routes/basic.ts
@@ -1,5 +1,6 @@
 export default {
   login: 'Login',
   errorLogList: 'Error Log',
-  profile: 'User Center'
+  profile: 'User Center',
+  notifyMessage: 'Notify Message'
 }
diff --git a/src/locales/lang/zh-CN/routes/basic.ts b/src/locales/lang/zh-CN/routes/basic.ts
index 5e1e509a..1f147751 100644
--- a/src/locales/lang/zh-CN/routes/basic.ts
+++ b/src/locales/lang/zh-CN/routes/basic.ts
@@ -1,5 +1,6 @@
 export default {
   login: '登录',
   errorLogList: '错误日志列表',
-  profile: '个人中心'
+  profile: '个人中心',
+  notifyMessage: '站内信'
 }
diff --git a/src/router/routes/index.ts b/src/router/routes/index.ts
index 85e31850..2633c127 100644
--- a/src/router/routes/index.ts
+++ b/src/router/routes/index.ts
@@ -58,6 +58,18 @@ export const ProfileRoute: AppRouteRecordRaw = {
         icon: 'ep:user',
         title: t('routes.basic.profile')
       }
+    },
+    {
+      path: 'notify-message',
+      component: () => import('@/views/system/notify/my/index.vue'),
+      name: 'MyNotifyMessage',
+      meta: {
+        canTo: true,
+        hidden: true,
+        noTagsView: false,
+        icon: 'ep:message',
+        title: t('routes.basic.notifyMessage')
+      }
     }
   ]
 }
diff --git a/src/views/system/notify/my/index.vue b/src/views/system/notify/my/index.vue
index 3b64cfc4..3574d51f 100644
--- a/src/views/system/notify/my/index.vue
+++ b/src/views/system/notify/my/index.vue
@@ -1,3 +1,68 @@
 <template>
-  <div>开发中</div>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" @click="handleUpdateList"> 标记已读 </a-button>
+        <a-button type="primary" @click="handleUpdateAll"> 全部已读 </a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction :actions="[{ icon: IconEnum.EDIT, label: '已读', onClick: handleUpdateSingle.bind(null, record) }]" />
+        </template>
+      </template>
+    </BasicTable>
+  </div>
 </template>
+<script lang="ts" setup name="MyNotify">
+import { useI18n } from '@/hooks/web/useI18n'
+import { useMessage } from '@/hooks/web/useMessage'
+import { IconEnum } from '@/enums/appEnum'
+import { BasicTable, useTable, TableAction } from '@/components/Table'
+import { getMyNotifyMessagePage, updateAllNotifyMessageRead, updateNotifyMessageRead } from '@/api/system/notify/message'
+import { columns, searchFormSchema } from './my.data'
+
+const { t } = useI18n()
+const { createMessage } = useMessage()
+
+const [registerTable, { getSelectRowKeys, reload }] = useTable({
+  title: '我的站内信列表',
+  api: getMyNotifyMessagePage,
+  columns,
+  formConfig: {
+    labelWidth: 120,
+    schemas: searchFormSchema
+  },
+  rowSelection: { type: 'checkbox' },
+  rowKey: 'id',
+  useSearchForm: true,
+  showTableSetting: true,
+  showIndexColumn: false,
+  actionColumn: {
+    width: 140,
+    title: t('common.action'),
+    dataIndex: 'action',
+    fixed: 'right'
+  }
+})
+
+function handleUpdateList() {
+  const ids = getSelectRowKeys()
+  handleUpdate(ids)
+}
+
+async function handleUpdateSingle(record: Recordable) {
+  await handleUpdate([record.id])
+}
+
+async function handleUpdate(ids) {
+  await updateNotifyMessageRead(ids)
+  createMessage.success('标记已读成功！')
+  reload()
+}
+
+async function handleUpdateAll() {
+  await updateAllNotifyMessageRead()
+  createMessage.success('全部已读成功！')
+  reload()
+}
+</script>
diff --git a/src/views/system/notify/my/my.data.ts b/src/views/system/notify/my/my.data.ts
new file mode 100644
index 00000000..ccb0c5b1
--- /dev/null
+++ b/src/views/system/notify/my/my.data.ts
@@ -0,0 +1,113 @@
+import { BasicColumn, FormSchema, useRender } from '@/components/Table'
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+
+export const columns: BasicColumn[] = [
+  {
+    title: '发送人',
+    dataIndex: 'templateNickname',
+    width: 100
+  },
+  {
+    title: '发送时间',
+    dataIndex: 'createTime',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDate(text)
+    }
+  },
+  {
+    title: '类型',
+    dataIndex: 'templateType',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDict(text, DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE)
+    }
+  },
+  {
+    title: '内容',
+    dataIndex: 'templateContent',
+    width: 300
+  },
+  {
+    title: '是否已读',
+    dataIndex: 'readStatus',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDict(text, DICT_TYPE.INFRA_BOOLEAN_STRING)
+    }
+  }
+]
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '是否已读',
+    field: 'readStatus',
+    component: 'Select',
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)
+    },
+    colProps: { span: 8 }
+  },
+  {
+    label: '发送时间',
+    field: 'createTime',
+    component: 'RangePicker',
+    colProps: { span: 8 }
+  }
+]
+
+export const formSchema: FormSchema[] = [
+  {
+    label: '编号',
+    field: 'id',
+    show: false,
+    component: 'Input'
+  },
+  {
+    label: '模版编码',
+    field: 'code',
+    required: true,
+    component: 'Input'
+  },
+  {
+    label: '模板名称',
+    field: 'name',
+    required: true,
+    component: 'Input'
+  },
+  {
+    label: '发件人名称',
+    field: 'nickname',
+    required: true,
+    component: 'Input'
+  },
+  {
+    label: '模板内容',
+    field: 'content',
+    required: true,
+    component: 'InputTextArea'
+  },
+  {
+    label: '类型',
+    field: 'type',
+    component: 'Select',
+    defaultValue: 0,
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE)
+    }
+  },
+  {
+    label: '开启状态',
+    field: 'status',
+    component: 'RadioGroup',
+    defaultValue: 0,
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.COMMON_STATUS)
+    }
+  },
+  {
+    label: '备注',
+    field: 'remark',
+    component: 'InputTextArea'
+  }
+]
diff --git a/src/views/system/notify/template/TemplateModal.vue b/src/views/system/notify/template/TemplateModal.vue
new file mode 100644
index 00000000..792e0c96
--- /dev/null
+++ b/src/views/system/notify/template/TemplateModal.vue
@@ -0,0 +1,54 @@
+<template>
+  <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
+</template>
+<script lang="ts" setup name="NotifyTemplateModal">
+import { ref, computed, unref } from 'vue'
+import { BasicModal, useModalInner } from '@/components/Modal'
+import { BasicForm, useForm } from '@/components/Form'
+import { formSchema } from './template.data'
+import { createNotifyTemplate, getNotifyTemplate, updateNotifyTemplate } from '@/api/system/notify/template'
+
+const emit = defineEmits(['success', 'register'])
+const isUpdate = ref(true)
+const rowId = ref()
+
+const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
+  labelWidth: 100,
+  baseColProps: { span: 24 },
+  schemas: formSchema,
+  showActionButtonGroup: false,
+  actionColOptions: { span: 23 }
+})
+
+const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+  resetFields()
+  setModalProps({ confirmLoading: false })
+  isUpdate.value = !!data?.isUpdate
+
+  if (unref(isUpdate)) {
+    const res = await getNotifyTemplate(data.record.id)
+    rowId.value = res.id
+    setFieldsValue({ ...res })
+  }
+})
+
+const getTitle = computed(() => (!unref(isUpdate) ? '新增岗位' : '编辑岗位'))
+
+async function handleSubmit() {
+  try {
+    const values = await validate()
+    setModalProps({ confirmLoading: true })
+    if (unref(isUpdate)) {
+      await updateNotifyTemplate(values)
+    } else {
+      await createNotifyTemplate(values)
+    }
+    closeModal()
+    emit('success')
+  } finally {
+    setModalProps({ confirmLoading: false })
+  }
+}
+</script>
diff --git a/src/views/system/notify/template/index.vue b/src/views/system/notify/template/index.vue
index 3b64cfc4..1159fc4d 100644
--- a/src/views/system/notify/template/index.vue
+++ b/src/views/system/notify/template/index.vue
@@ -1,3 +1,81 @@
 <template>
-  <div>开发中</div>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="primary" :preIcon="IconEnum.ADD" @click="handleCreate"> {{ t('action.create') }} </a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              { icon: IconEnum.EDIT, label: t('action.edit'), onClick: handleEdit.bind(null, record) },
+              {
+                icon: IconEnum.DELETE,
+                color: 'error',
+                label: t('action.delete'),
+                popConfirm: {
+                  title: t('common.delMessage'),
+                  placement: 'left',
+                  confirm: handleDelete.bind(null, record)
+                }
+              }
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+    <TemplateModal @register="registerModal" @success="reload()" />
+  </div>
 </template>
+<script lang="ts" setup name="NotifyTemplate">
+import { useI18n } from '@/hooks/web/useI18n'
+import { useMessage } from '@/hooks/web/useMessage'
+import { useModal } from '@/components/Modal'
+import TemplateModal from './TemplateModal.vue'
+import { IconEnum } from '@/enums/appEnum'
+import { BasicTable, useTable, TableAction } from '@/components/Table'
+import { deleteNotifyTemplate, getNotifyTemplatePage } from '@/api/system/notify/template'
+import { columns, searchFormSchema } from './template.data'
+
+const { t } = useI18n()
+const { createMessage } = useMessage()
+const [registerModal, { openModal }] = useModal()
+
+const [registerTable, { reload }] = useTable({
+  title: '站内信模板列表',
+  api: getNotifyTemplatePage,
+  columns,
+  formConfig: {
+    labelWidth: 120,
+    schemas: searchFormSchema
+  },
+  useSearchForm: true,
+  showTableSetting: true,
+  showIndexColumn: false,
+  actionColumn: {
+    width: 140,
+    title: t('common.action'),
+    dataIndex: 'action',
+    fixed: 'right'
+  }
+})
+
+function handleCreate() {
+  openModal(true, {
+    isUpdate: false
+  })
+}
+
+function handleEdit(record: Recordable) {
+  openModal(true, {
+    record,
+    isUpdate: true
+  })
+}
+
+async function handleDelete(record: Recordable) {
+  await deleteNotifyTemplate(record.id)
+  createMessage.success(t('common.delSuccessText'))
+  reload()
+}
+</script>
diff --git a/src/views/system/notify/template/template.data.ts b/src/views/system/notify/template/template.data.ts
new file mode 100644
index 00000000..284e1866
--- /dev/null
+++ b/src/views/system/notify/template/template.data.ts
@@ -0,0 +1,140 @@
+import { BasicColumn, FormSchema, useRender } from '@/components/Table'
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+
+export const columns: BasicColumn[] = [
+  {
+    title: '模板编码',
+    dataIndex: 'code',
+    width: 100
+  },
+  {
+    title: '模板名称',
+    dataIndex: 'name',
+    width: 180
+  },
+  {
+    title: '类型',
+    dataIndex: 'type',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDict(text, DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE)
+    }
+  },
+  {
+    title: '发送人名称',
+    dataIndex: 'nickname',
+    width: 100
+  },
+  {
+    title: '模板内容',
+    dataIndex: 'content',
+    width: 300
+  },
+  {
+    title: '开启状态',
+    dataIndex: 'status',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDict(text, DICT_TYPE.COMMON_STATUS)
+    }
+  },
+  {
+    title: '备注',
+    dataIndex: 'remark',
+    width: 180
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDate(text)
+    }
+  }
+]
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '模板名称',
+    field: 'name',
+    component: 'Input',
+    colProps: { span: 8 }
+  },
+  {
+    label: '模版编码',
+    field: 'code',
+    component: 'Input',
+    colProps: { span: 8 }
+  },
+  {
+    label: '状态',
+    field: 'status',
+    component: 'Select',
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.COMMON_STATUS)
+    },
+    colProps: { span: 8 }
+  },
+  {
+    label: '创建时间',
+    field: 'createTime',
+    component: 'RangePicker',
+    colProps: { span: 8 }
+  }
+]
+
+export const formSchema: FormSchema[] = [
+  {
+    label: '编号',
+    field: 'id',
+    show: false,
+    component: 'Input'
+  },
+  {
+    label: '模版编码',
+    field: 'code',
+    required: true,
+    component: 'Input'
+  },
+  {
+    label: '模板名称',
+    field: 'name',
+    required: true,
+    component: 'Input'
+  },
+  {
+    label: '发件人名称',
+    field: 'nickname',
+    required: true,
+    component: 'Input'
+  },
+  {
+    label: '模板内容',
+    field: 'content',
+    required: true,
+    component: 'InputTextArea'
+  },
+  {
+    label: '类型',
+    field: 'type',
+    component: 'Select',
+    defaultValue: 0,
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE)
+    }
+  },
+  {
+    label: '开启状态',
+    field: 'status',
+    component: 'RadioGroup',
+    defaultValue: 0,
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.COMMON_STATUS)
+    }
+  },
+  {
+    label: '备注',
+    field: 'remark',
+    component: 'InputTextArea'
+  }
+]