mirror of
https://gitee.com/huangge1199_admin/vue-pro.git
synced 2024-11-26 17:21:53 +08:00
站内信模块:vue3 消息
This commit is contained in:
parent
cb0da2db6a
commit
8cdae12b34
33
yudao-ui-admin-vue3/src/api/system/notify/message/index.ts
Normal file
33
yudao-ui-admin-vue3/src/api/system/notify/message/index.ts
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
import request from '@/config/axios'
|
||||||
|
|
||||||
|
export interface NotifyMessageVO {
|
||||||
|
id: number
|
||||||
|
userId: number
|
||||||
|
userType: number
|
||||||
|
templateId: number
|
||||||
|
templateCode: string
|
||||||
|
templateNickname: string
|
||||||
|
templateContent: string
|
||||||
|
templateType: number
|
||||||
|
templateParams: string
|
||||||
|
readStatus: boolean
|
||||||
|
readTime: Date
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface NotifyMessagePageReqVO extends PageParam {
|
||||||
|
userId?: number
|
||||||
|
userType?: number
|
||||||
|
templateCode?: string
|
||||||
|
templateType?: number
|
||||||
|
createTime?: Date[]
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询站内信消息列表
|
||||||
|
export const getNotifyMessagePageApi = async (params: NotifyMessagePageReqVO) => {
|
||||||
|
return await request.get({ url: '/system/notify-message/page', params })
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询站内信消息详情
|
||||||
|
export const getNotifyMessageApi = async (id: number) => {
|
||||||
|
return await request.get({ url: '/system/notify-message/get?id=' + id })
|
||||||
|
}
|
@ -0,0 +1,66 @@
|
|||||||
|
<template>
|
||||||
|
<ContentWrap>
|
||||||
|
<!-- 列表 -->
|
||||||
|
<XTable @register="registerTable">
|
||||||
|
<template #actionbtns_default="{ row }">
|
||||||
|
<!-- 操作:详情 -->
|
||||||
|
<XTextButton
|
||||||
|
preIcon="ep:view"
|
||||||
|
:title="t('action.detail')"
|
||||||
|
v-hasPermi="['system:notify-message:query']"
|
||||||
|
@click="handleDetail(row.id)"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</XTable>
|
||||||
|
</ContentWrap>
|
||||||
|
<!-- 弹窗 -->
|
||||||
|
<XModal id="messageModel" :loading="modelLoading" v-model="modelVisible" :title="modelTitle">
|
||||||
|
<!-- 表单:详情 -->
|
||||||
|
<Descriptions
|
||||||
|
v-if="actionType === 'detail'"
|
||||||
|
:schema="allSchemas.detailSchema"
|
||||||
|
:data="detailData"
|
||||||
|
/>
|
||||||
|
<template #footer>
|
||||||
|
<!-- 按钮:关闭 -->
|
||||||
|
<XButton :loading="actionLoading" :title="t('dialog.close')" @click="modelVisible = false" />
|
||||||
|
</template>
|
||||||
|
</XModal>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts" name="NotifyMessage">
|
||||||
|
// 业务相关的 import
|
||||||
|
import { allSchemas } from './message.data'
|
||||||
|
import * as NotifyMessageApi from '@/api/system/notify/message'
|
||||||
|
|
||||||
|
const { t } = useI18n() // 国际化
|
||||||
|
|
||||||
|
// 列表相关的变量
|
||||||
|
const [registerTable] = useXTable({
|
||||||
|
allSchemas: allSchemas,
|
||||||
|
getListApi: NotifyMessageApi.getNotifyMessagePageApi
|
||||||
|
})
|
||||||
|
|
||||||
|
// 弹窗相关的变量
|
||||||
|
const modelVisible = ref(false) // 是否显示弹出层
|
||||||
|
const modelTitle = ref('edit') // 弹出层标题
|
||||||
|
const modelLoading = ref(false) // 弹出层loading
|
||||||
|
const actionType = ref('') // 操作按钮的类型
|
||||||
|
const actionLoading = ref(false) // 按钮 Loading
|
||||||
|
const detailData = ref() // 详情 Ref
|
||||||
|
|
||||||
|
// 设置标题
|
||||||
|
const setDialogTile = (type: string) => {
|
||||||
|
modelLoading.value = true
|
||||||
|
modelTitle.value = t('action.' + type)
|
||||||
|
actionType.value = type
|
||||||
|
modelVisible.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
// 详情操作
|
||||||
|
const handleDetail = async (rowId: number) => {
|
||||||
|
setDialogTile('detail')
|
||||||
|
const res = await NotifyMessageApi.getNotifyMessageApi(rowId)
|
||||||
|
detailData.value = res
|
||||||
|
modelLoading.value = false
|
||||||
|
}
|
||||||
|
</script>
|
@ -0,0 +1,101 @@
|
|||||||
|
import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
|
||||||
|
|
||||||
|
// CrudSchema
|
||||||
|
const crudSchemas = reactive<VxeCrudSchema>({
|
||||||
|
primaryKey: 'id', // 默认的主键ID
|
||||||
|
primaryTitle: '编号', // 默认显示的值
|
||||||
|
primaryType: 'seq', // 默认为seq,序号模式
|
||||||
|
action: true,
|
||||||
|
actionWidth: '200', // 3个按钮默认200,如有删减对应增减即可
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: '用户编号',
|
||||||
|
field: 'userId',
|
||||||
|
isSearch: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '用户类型',
|
||||||
|
field: 'userType',
|
||||||
|
dictType: DICT_TYPE.USER_TYPE,
|
||||||
|
dictClass: 'string',
|
||||||
|
isSearch: true,
|
||||||
|
table: {
|
||||||
|
width: 80
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '模版编号',
|
||||||
|
field: 'templateId'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '模板编码',
|
||||||
|
field: 'templateCode',
|
||||||
|
isSearch: true,
|
||||||
|
table: {
|
||||||
|
width: 80
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '发送人名称',
|
||||||
|
field: 'templateNickname',
|
||||||
|
table: {
|
||||||
|
width: 120
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '模版内容',
|
||||||
|
field: 'templateContent',
|
||||||
|
table: {
|
||||||
|
width: 200
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '模版类型',
|
||||||
|
field: 'templateType',
|
||||||
|
dictType: DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE,
|
||||||
|
dictClass: 'number',
|
||||||
|
isSearch: true,
|
||||||
|
table: {
|
||||||
|
width: 80
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '模版参数',
|
||||||
|
field: 'templateParams',
|
||||||
|
isTable: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '是否已读',
|
||||||
|
field: 'readStatus',
|
||||||
|
dictType: DICT_TYPE.INFRA_BOOLEAN_STRING,
|
||||||
|
dictClass: 'boolean',
|
||||||
|
table: {
|
||||||
|
width: 80
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '阅读时间',
|
||||||
|
field: 'readTime',
|
||||||
|
formatter: 'formatDate',
|
||||||
|
table: {
|
||||||
|
width: 180
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '创建时间',
|
||||||
|
field: 'createTime',
|
||||||
|
isForm: false,
|
||||||
|
formatter: 'formatDate',
|
||||||
|
search: {
|
||||||
|
show: true,
|
||||||
|
itemRender: {
|
||||||
|
name: 'XDataTimePicker'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
table: {
|
||||||
|
width: 180
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
|
Loading…
Reference in New Issue
Block a user