optimize: ♻️ 消息接受和发送连表查询显示用户名
This commit is contained in:
parent
ae4323c18b
commit
e06627ccb4
|
@ -27,8 +27,8 @@ export const fetchDeleteI18n = (data: any) => {
|
|||
};
|
||||
|
||||
/** 多语言类型管理---获取多语言类型列表 */
|
||||
export const fetchGetI18nTypeList = () => {
|
||||
return http.request<BaseResult<ResultTable>>('get', 'i18nType/noAuth/getI18nTypeList');
|
||||
export const fetchGetI18nTypeList = (data: any) => {
|
||||
return http.request<BaseResult<ResultTable>>('get', 'i18nType/noAuth/getI18nTypeList', { params: data });
|
||||
};
|
||||
|
||||
/** 多语言类型管理---添加多语言类型 */
|
||||
|
|
|
@ -32,7 +32,7 @@ export const userI18nTypeStore = defineStore('i18nTypeStore', {
|
|||
* * 获取多语言类型
|
||||
*/
|
||||
async getI18nTypeList() {
|
||||
const result = await fetchGetI18nTypeList();
|
||||
const result = await fetchGetI18nTypeList(this.form);
|
||||
if (result.code === 200) {
|
||||
this.datalist = result.data;
|
||||
return true;
|
||||
|
|
|
@ -17,11 +17,11 @@ export const useMessageStore = defineStore('messageStore', {
|
|||
// 消息标题
|
||||
title: undefined,
|
||||
// 接收人用户ID
|
||||
receivedUserId: undefined,
|
||||
receivedUserIds: undefined,
|
||||
// 发送人用户ID
|
||||
sendUserId: undefined,
|
||||
// 发送人昵称
|
||||
sendNickName: undefined,
|
||||
sendNickname: undefined,
|
||||
// 消息类型
|
||||
messageType: undefined,
|
||||
// 消息内容
|
||||
|
|
|
@ -20,6 +20,8 @@ export const useMessageTypeStore = defineStore('messageTypeStore', {
|
|||
status: undefined,
|
||||
// 消息名称
|
||||
messageName: undefined,
|
||||
// 发送人昵称
|
||||
sendUserNickname: undefined,
|
||||
// 消息类型
|
||||
messageType: undefined,
|
||||
// 消息备注
|
||||
|
|
|
@ -32,10 +32,10 @@ onMounted(() => {
|
|||
<template>
|
||||
<div class="main">
|
||||
<el-form ref="formRef" :inline="true" :model="i18nTypeStore.form" class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px] overflow-auto">
|
||||
<el-form-item :label="$t('i18n_typeName')" prop="title">
|
||||
<el-form-item :label="$t('i18n_typeName')" prop="typeName">
|
||||
<el-input v-model="i18nTypeStore.form.typeName" :placeholder="`${$t('input')}${$t('i18n_typeName')}`" class="!w-[180px]" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('i18n_summary')" prop="title">
|
||||
<el-form-item :label="$t('i18n_summary')" prop="summary">
|
||||
<el-input v-model="i18nTypeStore.form.summary" :placeholder="`${$t('input')}${$t('i18n_summary')}`" class="!w-[180px]" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
|
|
|
@ -65,8 +65,8 @@ onMounted(() => {
|
|||
</el-form-item>
|
||||
|
||||
<!-- 发送人昵称 -->
|
||||
<el-form-item :label="$t('sendNickName')" prop="sendNickName">
|
||||
<el-input v-model="messageStore.form.sendNickName" :placeholder="`${$t('input')}${$t('sendNickName')}`" class="!w-[180px]" clearable />
|
||||
<el-form-item :label="$t('sendNickname')" prop="sendNickname">
|
||||
<el-input v-model="messageStore.form.sendNickname" :placeholder="`${$t('input')}${$t('sendNickname')}`" class="!w-[180px]" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 消息类型 -->
|
||||
|
@ -81,16 +81,16 @@ onMounted(() => {
|
|||
|
||||
<!-- 编辑器类型 -->
|
||||
<el-form-item :label="$t('editorType')" prop="editorType">
|
||||
<el-select v-model="messageStore.form.editorType" :placeholder="`${$t('select')}${$t('editorType')}`" clearable filterable>
|
||||
<el-select v-model="messageStore.form.editorType" :placeholder="`${$t('select')}${$t('editorType')}`" class="!w-[180px]" clearable filterable>
|
||||
<el-option v-for="(item, index) in editorTypeList" :key="index" :label="item.label" :navigationBar="false" :value="item.value" />
|
||||
</el-select>
|
||||
<!--<el-input v-model="messageStore.form.editorType" :placeholder="`${$t('input')}${$t('editorType')}`" class="!w-[180px]" clearable />-->
|
||||
</el-form-item>
|
||||
|
||||
<!-- 0:未读 1:已读 -->
|
||||
<el-form-item :label="$t('status')" prop="status">
|
||||
<el-input v-model="messageStore.form.status" :placeholder="`${$t('input')}${$t('status')}`" class="!w-[180px]" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button :icon="useRenderIcon('ri:search-line')" :loading="messageStore.loading" type="primary" @click="onSearch"> {{ $t('search') }} </el-button>
|
||||
<el-button :icon="useRenderIcon(Refresh)" @click="resetForm(formRef)"> {{ $t('buttons.reset') }}</el-button>
|
||||
|
@ -129,11 +129,15 @@ onMounted(() => {
|
|||
@page-current-change="onCurrentPageChange"
|
||||
>
|
||||
<template #createUser="{ row }">
|
||||
<el-button link type="primary" @click="selectUserinfo(row.createUser)">{{ $t('table.createUser') }} </el-button>
|
||||
<el-button v-show="row.createUser" link type="primary" @click="selectUserinfo(row.createUser)">
|
||||
{{ row.createUsername }}
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
<template #updateUser="{ row }">
|
||||
<el-button link type="primary" @click="selectUserinfo(row.updateUser)">{{ $t('table.updateUser') }} </el-button>
|
||||
<el-button v-show="row.updateUser" link type="primary" @click="selectUserinfo(row.updateUser)">
|
||||
{{ row.updateUsername }}
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
<template #operation="{ row }">
|
||||
|
|
|
@ -7,7 +7,7 @@ import { $t } from '@/plugins/i18n';
|
|||
import { usePublicHooks } from '@/views/hooks';
|
||||
import { useMessageTypeStore } from '@/store/message/messageType';
|
||||
import LoadingSvg from '@/assets/svg/loading.svg';
|
||||
import { useAdminUserStore } from '@/store/system/adminUser';
|
||||
import { loading, onSearchUserinfo, userDataList } from '@/views/message/message/utils/hooks';
|
||||
|
||||
const props = withDefaults(defineProps<FormProps>(), {
|
||||
formInline: () => ({
|
||||
|
@ -33,25 +33,7 @@ const props = withDefaults(defineProps<FormProps>(), {
|
|||
const { switchStyle } = usePublicHooks();
|
||||
const formRef = ref<FormInstance>();
|
||||
const form = ref(props.formInline);
|
||||
const adminUserStore = useAdminUserStore();
|
||||
const messageTypeStore = useMessageTypeStore();
|
||||
// 搜索用户加载
|
||||
const loading = ref(false);
|
||||
// 用户信息列表
|
||||
const userDataList = ref();
|
||||
|
||||
/** 搜索 */
|
||||
const onSearchUserinfo = async (keyword: string) => {
|
||||
loading.value = true;
|
||||
userDataList.value = await adminUserStore.queryUser({ keyword });
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 当选择发送用户 */
|
||||
const onSelectSendUser = (va: any) => {
|
||||
const user = userDataList.value.filter((user: any) => user.id === va)[0];
|
||||
form.value.sendNickName = user.nickname;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
messageTypeStore.getAllMessageTypeList();
|
||||
|
@ -67,23 +49,20 @@ defineExpose({ formRef });
|
|||
</el-form-item>
|
||||
|
||||
<!-- 接收人用户ID -->
|
||||
<el-form-item :label="$t('receivedUserId')" prop="receivedUserId">
|
||||
<el-input v-model="form.receivedUserId" :placeholder="$t('receivedUserIdTip')" autocomplete="off" type="text" />
|
||||
<el-form-item :label="$t('receivedUserIds')" prop="receivedUserIds">
|
||||
<el-select v-model="form.receivedUserIds" :loading="loading" :placeholder="$t('receivedUserIdTip')" :remote-method="onSearchUserinfo" clearable filterable multiple remote remote-show-suffix>
|
||||
<el-option v-for="item in userDataList" :key="item.id" :label="item.username" :value="item.id" />
|
||||
<template #loading>
|
||||
<el-icon class="is-loading">
|
||||
<LoadingSvg />
|
||||
</el-icon>
|
||||
</template>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 发送人用户ID -->
|
||||
<el-form-item :label="$t('sendUserId')" prop="sendUserId">
|
||||
<el-select
|
||||
v-model="form.sendUserId"
|
||||
:loading="loading"
|
||||
:placeholder="$t('select') + $t('sendUserId')"
|
||||
:remote-method="onSearchUserinfo"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
remote-show-suffix
|
||||
@change="onSelectSendUser"
|
||||
>
|
||||
<el-select v-model="form.sendUserId" :loading="loading" :placeholder="$t('select') + $t('sendUserId')" :remote-method="onSearchUserinfo" clearable filterable remote remote-show-suffix>
|
||||
<el-option v-for="item in userDataList" :key="item.id" :label="item.username" :value="item.id" />
|
||||
<template #loading>
|
||||
<el-icon class="is-loading">
|
||||
|
|
|
@ -10,16 +10,14 @@ export const columns: TableColumnList = [
|
|||
{ label: $t('title'), prop: 'title' },
|
||||
// 接收人用户ID
|
||||
{
|
||||
label: $t('receivedUserId'),
|
||||
prop: 'receivedUserId',
|
||||
formatter({ receivedUserId }) {
|
||||
return !receivedUserId ? $t('all') : receivedUserId;
|
||||
label: $t('receivedUserIds'),
|
||||
prop: 'receivedUserIds',
|
||||
formatter({ receivedUserIds }) {
|
||||
return !receivedUserIds ? $t('all') : $t('portion');
|
||||
},
|
||||
},
|
||||
// 发送人用户ID
|
||||
{ label: $t('sendUserId'), prop: 'sendUserId' },
|
||||
// 发送人昵称
|
||||
{ label: $t('sendNickName'), prop: 'sendNickName' },
|
||||
{ label: $t('sendNickname'), prop: 'sendNickname' },
|
||||
// 消息类型
|
||||
{ label: $t('messageType'), prop: 'messageType' },
|
||||
// 消息内容
|
||||
|
@ -27,11 +25,17 @@ export const columns: TableColumnList = [
|
|||
// 编辑器类型
|
||||
{ label: $t('editorType'), prop: 'editorType' },
|
||||
// 0:未读 1:已读
|
||||
{ label: $t('status'), prop: 'status' },
|
||||
{
|
||||
label: $t('status'),
|
||||
prop: 'status',
|
||||
formatter({ status }) {
|
||||
return status ? $t('readAlready') : $t('unread');
|
||||
},
|
||||
},
|
||||
{ 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.createUser'), prop: 'createUser', slot: 'createUser', width: 130 },
|
||||
{ label: $t('table.updateUser'), prop: 'updateUser', slot: 'updateUser', width: 130 },
|
||||
{ label: $t('table.operation'), fixed: 'right', width: 210, slot: 'operation' },
|
||||
];
|
||||
|
||||
|
|
|
@ -6,11 +6,17 @@ 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';
|
||||
import { useAdminUserStore } from '@/store/system/adminUser';
|
||||
|
||||
export const formRef = ref();
|
||||
// 删除ids
|
||||
export const deleteIds = ref([]);
|
||||
// 用户信息列表
|
||||
export const userDataList = ref();
|
||||
// 搜索用户加载
|
||||
export const loading = ref(false);
|
||||
const messageStore = useMessageStore();
|
||||
const adminUserStore = useAdminUserStore();
|
||||
|
||||
/** 搜索初始化系统消息 */
|
||||
export async function onSearch() {
|
||||
|
@ -27,7 +33,7 @@ export function onAdd() {
|
|||
props: {
|
||||
formInline: {
|
||||
title: undefined,
|
||||
receivedUserId: undefined,
|
||||
receivedUserIds: undefined,
|
||||
sendUserId: undefined,
|
||||
sendNickName: undefined,
|
||||
messageType: undefined,
|
||||
|
@ -58,14 +64,16 @@ export function onAdd() {
|
|||
* * 更新系统消息
|
||||
* @param row
|
||||
*/
|
||||
export function onUpdate(row: any) {
|
||||
export async function onUpdate(row: any) {
|
||||
await onSearchUserinfo();
|
||||
|
||||
addDialog({
|
||||
title: `${$t('modify')}${$t('message')}`,
|
||||
width: '30%',
|
||||
props: {
|
||||
formInline: {
|
||||
title: row.title,
|
||||
receivedUserId: row.receivedUserId,
|
||||
receivedUserIds: row.receivedUserIds ? row.receivedUserIds.split(',') : row.receivedUserIds,
|
||||
sendUserId: row.sendUserId,
|
||||
sendNickName: row.sendNickName,
|
||||
messageType: row.messageType,
|
||||
|
@ -139,3 +147,10 @@ export const onDeleteBatch = async () => {
|
|||
},
|
||||
});
|
||||
};
|
||||
|
||||
/** 搜索 */
|
||||
export const onSearchUserinfo = async (keyword: string) => {
|
||||
loading.value = true;
|
||||
userDataList.value = await adminUserStore.queryUser({ keyword });
|
||||
loading.value = false;
|
||||
};
|
||||
|
|
|
@ -3,11 +3,9 @@ export interface FormItemProps {
|
|||
// 消息标题
|
||||
title: string;
|
||||
// 接收人用户ID
|
||||
receivedUserId: number;
|
||||
receivedUserIds: string[];
|
||||
// 发送人用户ID
|
||||
sendUserId: number;
|
||||
// 发送人昵称
|
||||
sendNickName: string;
|
||||
sendUserId: string;
|
||||
// 消息类型
|
||||
messageType: string;
|
||||
// 消息内容
|
||||
|
|
|
@ -68,6 +68,11 @@ onMounted(() => {
|
|||
<el-input v-model="messageTypeStore.form.messageName" :placeholder="`${$t('input')}${$t('messageName')}`" class="!w-[180px]" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 发送人昵称 -->
|
||||
<el-form-item :label="$t('sendUserNickname')" prop="sendUserNickname">
|
||||
<el-input v-model="messageTypeStore.form.sendUserNickname" :placeholder="`${$t('input')}${$t('sendUserNickname')}`" class="!w-[180px]" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 消息类型 -->
|
||||
<el-form-item :label="$t('messageType')" prop="messageType">
|
||||
<el-input v-model="messageTypeStore.form.messageType" :placeholder="`${$t('input')}${$t('messageType')}`" class="!w-[180px]" clearable />
|
||||
|
@ -127,11 +132,15 @@ onMounted(() => {
|
|||
</template>
|
||||
|
||||
<template #createUser="{ row }">
|
||||
<el-button link type="primary" @click="selectUserinfo(row.createUser)">{{ $t('table.createUser') }} </el-button>
|
||||
<el-button v-show="row.createUser" link type="primary" @click="selectUserinfo(row.createUser)">
|
||||
{{ row.createUsername }}
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
<template #updateUser="{ row }">
|
||||
<el-button link type="primary" @click="selectUserinfo(row.updateUser)">{{ $t('table.updateUser') }} </el-button>
|
||||
<el-button v-show="row.updateUser" link type="primary" @click="selectUserinfo(row.updateUser)">
|
||||
{{ row.updateUsername }}
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
<template #operation="{ row }">
|
||||
|
|
|
@ -16,8 +16,8 @@ export const columns: TableColumnList = [
|
|||
{ label: $t('summary'), prop: 'summary' },
|
||||
{ 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.createUser'), prop: 'createUser', slot: 'createUser', width: 130 },
|
||||
{ label: $t('table.updateUser'), prop: 'updateUser', slot: 'updateUser', width: 130 },
|
||||
{ label: $t('table.operation'), fixed: 'right', width: 210, slot: 'operation' },
|
||||
];
|
||||
|
||||
|
|
Loading…
Reference in New Issue