update notify style
This commit is contained in:
Timi
+1
-1
@@ -19,7 +19,7 @@
|
||||
"less": "^4.3.0",
|
||||
"pinia": "^3.0.2",
|
||||
"tdesign-mobile-vue": "^1.16.0",
|
||||
"timi-tdesign-mobile": "0.0.10",
|
||||
"timi-tdesign-mobile": "link:E:/WebProject/timi-tdesign-mobile",
|
||||
"timi-web-api": "link:E:/WebProject/timi-web-api",
|
||||
"timi-web": "link:E:/WebProject/timi-web",
|
||||
"ts-node": "^10.9.2",
|
||||
|
||||
@@ -66,7 +66,7 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Message } from "@/utils/message";
|
||||
import { Time, Toolkit } from "timi-web";
|
||||
import { Time, Toolkit, WebToolkit } from "timi-web";
|
||||
import { type Page, type PageResult, useUserStore } from "timi-web-api";
|
||||
import CustomerAPI from "@/api/CustomerAPI";
|
||||
import TagSelector from "@/components/TagSelector.vue";
|
||||
@@ -226,7 +226,7 @@ async function doExport(): Promise<void> {
|
||||
isExporting.value = true;
|
||||
try {
|
||||
const blob = await CustomerAPI.exportXSSF(page);
|
||||
Toolkit.downloadBlob(blob, `客户列表-${Time.formatDate(new Date())}.xlsx`);
|
||||
WebToolkit.downloadBlob(blob, `客户列表-${Time.formatDate(new Date())}.xlsx`);
|
||||
Message.success("导出已开始");
|
||||
} finally {
|
||||
isExporting.value = false;
|
||||
|
||||
@@ -127,7 +127,7 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { DialogPlugin, type DropdownValue } from "tdesign-mobile-vue";
|
||||
import { Time, Toolkit } from "timi-web";
|
||||
import { Time, WebToolkit } from "timi-web";
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import EventAPI from "@/api/EventAPI";
|
||||
import EventRecordAPI from "@/api/EventRecordAPI";
|
||||
@@ -413,7 +413,7 @@ async function exportExcel(): Promise<void> {
|
||||
size: pageSize,
|
||||
...buildRangeReq()
|
||||
});
|
||||
Toolkit.downloadBlob(blob, `登记事件记录-${Time.formatDate(new Date())}.xlsx`);
|
||||
WebToolkit.downloadBlob(blob, `登记事件记录-${Time.formatDate(new Date())}.xlsx`);
|
||||
Message.success("导出已开始");
|
||||
} finally {
|
||||
isExporting.value = false;
|
||||
|
||||
@@ -11,12 +11,15 @@
|
||||
/>
|
||||
</t-form-item>
|
||||
<t-form-item
|
||||
class="recipient-item"
|
||||
label="接收用户"
|
||||
:description="selectedRecipientDescription"
|
||||
required-mark
|
||||
arrow
|
||||
@click="openRecipientPicker"
|
||||
/>
|
||||
content-align="right"
|
||||
>
|
||||
<span class="value clip-text" v-text="selectedRecipientDescription" />
|
||||
</t-form-item>
|
||||
<t-form-item label="发送时间" arrow @click="openSchedulePicker">
|
||||
<div class="schedule-value">
|
||||
<span v-text="scheduleAtText || '立即发送'" />
|
||||
@@ -372,6 +375,14 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.recipient-item {
|
||||
|
||||
.value {
|
||||
max-width: 12rem;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.editor-wrapper {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
|
||||
@@ -1,76 +1,37 @@
|
||||
<template>
|
||||
<div v-can="corePermissionCodes.notify.read" class="notify-management-detail">
|
||||
<div v-can="corePermissionCodes.notify.read" class="notify-detail">
|
||||
<t-empty
|
||||
v-if="!detail"
|
||||
:description="isLoading ? '正在加载通知' : '通知不存在'"
|
||||
/>
|
||||
<template v-else>
|
||||
<article class="article">
|
||||
<header class="header">
|
||||
<h1 v-text="getSubject(detail)" />
|
||||
<div class="time" v-text="getSendTime(detail.detailList?.[0])" />
|
||||
</header>
|
||||
<section class="body">
|
||||
<notify-view
|
||||
v-if="mainDetail"
|
||||
:detail="mainDetail"
|
||||
empty-text="暂无通知内容"
|
||||
:resolve-attachment-url="resolveAttachmentUrl"
|
||||
/>
|
||||
<div v-else class="empty-content">暂无通知内容</div>
|
||||
</section>
|
||||
</article>
|
||||
<t-cell-group title="通知状态" theme="card">
|
||||
<t-cell title="接收用户" :note="`${detail.detailList?.length || 0} 人`" />
|
||||
<t-cell title="已读用户" :note="`${readCount} 人`" />
|
||||
<t-cell-group title="通知状态" theme="card" v-entrance-transition>
|
||||
<t-cell title="发送用户" :note="`${detail.detailList?.length || 0} 人`" arrow @click="openRecipientList"/>
|
||||
<t-cell title="已读用户" :note="`${readCount} 人`" arrow @click="openReadRecipientList"/>
|
||||
<t-cell title="未读用户" :note="`${unreadCount} 人`" arrow @click="openUnreadRecipientList"/>
|
||||
<t-cell title="当前状态">
|
||||
<template #note>
|
||||
<t-tag size="small" :theme="getSummaryTheme" :content="getSummaryStatus" />
|
||||
</template>
|
||||
</t-cell>
|
||||
</t-cell-group>
|
||||
<div v-if="canCancelNotify && canCancel" class="actions">
|
||||
<div v-if="canCancelNotify && canCancel" class="actions" v-entrance-transition="70">
|
||||
<t-button theme="primary" variant="outline" block :loading="isCanceling" @click="confirmCancel">
|
||||
取消发送
|
||||
</t-button>
|
||||
</div>
|
||||
<div v-if="canDeleteNotify" class="actions">
|
||||
<t-button theme="danger" variant="outline" block :loading="isDeleting" @click="confirmDelete">
|
||||
删除通知
|
||||
</t-button>
|
||||
</div>
|
||||
<t-segmented
|
||||
v-model="recipientFilter"
|
||||
class="filter"
|
||||
block
|
||||
:options="recipientFilterOptions"
|
||||
<notify-content
|
||||
:detail="mainDetail"
|
||||
:subject="getSubject(detail)"
|
||||
:time="getSendTime(mainDetail)"
|
||||
:resolve-attachment-url="resolveAttachmentUrl"
|
||||
v-entrance-transition="140"
|
||||
/>
|
||||
<t-cell-group v-if="filteredDetailList.length" title="发送用户" theme="card" class="recipients">
|
||||
<t-cell v-for="item in filteredDetailList" :key="item.id">
|
||||
<template #title>
|
||||
<div class="recipient-title">
|
||||
<span v-text="getRecipientName(item)" />
|
||||
<t-tag size="small" :theme="getReadTheme(item)" :content="getReadText(item)" />
|
||||
</div>
|
||||
</template>
|
||||
<template #description>
|
||||
<div class="recipient-description">
|
||||
<span v-text="getRecipientContact(item)" />
|
||||
<span v-if="item.resultDesc" v-text="item.resultDesc" />
|
||||
</div>
|
||||
</template>
|
||||
<template #note>
|
||||
<span v-text="getReadTime(item)" />
|
||||
</template>
|
||||
</t-cell>
|
||||
</t-cell-group>
|
||||
<t-empty v-else description="暂无匹配的接收用户" />
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { NotifyView } from "timi-tdesign-mobile";
|
||||
import { Time } from "timi-web";
|
||||
import { NotifyAPI, type Notify, type NotifyDetail, useUserStore } from "timi-web-api";
|
||||
import { DialogPlugin } from "tdesign-mobile-vue";
|
||||
@@ -79,9 +40,10 @@ import { getErrorMessage } from "@/utils/error";
|
||||
import { getAttachmentReadURL } from "@/utils/attachment";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import { corePermissionCodes } from "@/utils/permission";
|
||||
import NotifyContent from "@/pages/notify/component/NotifyContent.vue";
|
||||
|
||||
type RecipientFilter = "all" | "unread" | "read";
|
||||
type NotifyTagTheme = "default" | "success" | "warning" | "primary" | "danger";
|
||||
type RecipientFilter = "all" | "unread" | "read";
|
||||
|
||||
defineOptions({
|
||||
name: "NotifyDetail"
|
||||
@@ -100,26 +62,11 @@ const detail = ref<Notify>();
|
||||
const isLoading = ref(false);
|
||||
const isCanceling = ref(false);
|
||||
const isDeleting = ref(false);
|
||||
const recipientFilter = ref<RecipientFilter>("all");
|
||||
let loadToken = 0;
|
||||
|
||||
const recipientFilterOptions = [
|
||||
{ value: "all" as RecipientFilter, label: "全部" },
|
||||
{ value: "unread" as RecipientFilter, label: "未读" },
|
||||
{ value: "read" as RecipientFilter, label: "已读" }
|
||||
];
|
||||
const mainDetail = computed(() => detail.value?.detailList?.[0]);
|
||||
const readCount = computed(() => detail.value?.detailList?.filter(item => Boolean(item.readAt)).length || 0);
|
||||
const filteredDetailList = computed(() => {
|
||||
const detailList = detail.value?.detailList || [];
|
||||
if (recipientFilter.value === "unread") {
|
||||
return detailList.filter(item => !item.readAt);
|
||||
}
|
||||
if (recipientFilter.value === "read") {
|
||||
return detailList.filter(item => Boolean(item.readAt));
|
||||
}
|
||||
return detailList;
|
||||
});
|
||||
const unreadCount = computed(() => detail.value?.detailList?.filter(item => !item.readAt).length || 0);
|
||||
const canCancel = computed(() => detail.value?.detailList?.some(item => isCancelable(item)) || false);
|
||||
const getSummaryStatus = computed(() => {
|
||||
const detailList = detail.value?.detailList || [];
|
||||
@@ -266,39 +213,36 @@ function getSendTime(item?: NotifyDetail): string {
|
||||
return Time.toDateTime(item.sendAt);
|
||||
}
|
||||
|
||||
function getRecipientName(item: NotifyDetail): string {
|
||||
return item.toUser?.nick?.trim() || item.toUser?.name?.trim() || item.sendTo || "未知用户";
|
||||
async function openRecipientList(): Promise<void> {
|
||||
const notifyId = detail.value?.id;
|
||||
if (!notifyId) {
|
||||
return;
|
||||
}
|
||||
await router.push({
|
||||
name: "NotifyRecipientList",
|
||||
params: { id: notifyId },
|
||||
query: { filter: "all" satisfies RecipientFilter }
|
||||
});
|
||||
}
|
||||
|
||||
function getRecipientContact(item: NotifyDetail): string {
|
||||
return item.toUser?.phoneNo || item.sendTo || "-";
|
||||
async function openReadRecipientList(): Promise<void> {
|
||||
await openRecipientListByFilter("read");
|
||||
}
|
||||
|
||||
function getReadText(item: NotifyDetail): string {
|
||||
if (isCancelable(item)) {
|
||||
return "待发送";
|
||||
}
|
||||
if (item.status === "CANCEL") {
|
||||
return "已取消";
|
||||
}
|
||||
if (item.status === "FAIL" || item.status === "TIMEOUT") {
|
||||
return item.status === "TIMEOUT" ? "已超时" : "发送失败";
|
||||
}
|
||||
return item.readAt ? "已读" : "未读";
|
||||
async function openUnreadRecipientList(): Promise<void> {
|
||||
await openRecipientListByFilter("unread");
|
||||
}
|
||||
|
||||
function getReadTheme(item: NotifyDetail): NotifyTagTheme {
|
||||
if (isCancelable(item)) {
|
||||
return "warning";
|
||||
async function openRecipientListByFilter(filter: RecipientFilter): Promise<void> {
|
||||
const notifyId = detail.value?.id;
|
||||
if (!notifyId) {
|
||||
return;
|
||||
}
|
||||
if (item.status === "CANCEL" || item.status === "FAIL" || item.status === "TIMEOUT") {
|
||||
return "danger";
|
||||
}
|
||||
return item.readAt ? "primary" : "default";
|
||||
}
|
||||
|
||||
function getReadTime(item: NotifyDetail): string {
|
||||
return item.readAt ? `已读 ${Time.toDateTime(item.readAt)}` : "未读";
|
||||
await router.push({
|
||||
name: "NotifyRecipientList",
|
||||
params: { id: notifyId },
|
||||
query: { filter }
|
||||
});
|
||||
}
|
||||
|
||||
// ---------- 生命周期 ----------
|
||||
@@ -312,10 +256,10 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.notify-management-detail {
|
||||
.notify-detail {
|
||||
gap: 1rem;
|
||||
min-height: 100%;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 1rem;
|
||||
padding: var(--app-nav-height) 0 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@@ -361,62 +305,5 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
.actions {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.filter {
|
||||
width: calc(100% - 2rem);
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.recipients {
|
||||
:deep(.t-cell__title) {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:deep(.t-cell__description) {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.recipient-title,
|
||||
.recipient-description {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.recipient-title {
|
||||
gap: .5rem;
|
||||
|
||||
> span:first-child {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.recipient-description {
|
||||
gap: .75rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:global(html.theme-dark) {
|
||||
.notify-management-detail {
|
||||
.header {
|
||||
.time {
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
color: #cbd5e1;
|
||||
|
||||
.empty-content {
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -6,18 +6,18 @@
|
||||
@refresh="refresh"
|
||||
@scrolltolower="loadMore"
|
||||
>
|
||||
<t-cell-group v-if="pageResult.list.length" class="items" theme="card">
|
||||
<t-cell-group
|
||||
v-if="pageResult.list.length"
|
||||
class="items fix-last-cell-line"
|
||||
theme="card"
|
||||
>
|
||||
<t-swipe-cell
|
||||
v-for="item in pageResult.list"
|
||||
v-for="(item, index) in pageResult.list"
|
||||
:key="item.id"
|
||||
class="item"
|
||||
v-entrance-transition="index * 30"
|
||||
>
|
||||
<t-cell
|
||||
:description="getSendTime(item)"
|
||||
arrow
|
||||
hover
|
||||
@click="toDetail(item)"
|
||||
>
|
||||
<t-cell :description="getSendTime(item)" arrow @click="toDetail(item)">
|
||||
<template #leftIcon>
|
||||
<div class="icon" :class="{ scheduled: isScheduled(item) }">
|
||||
<t-icon :name="isScheduled(item) ? 'time' : 'notification'" size="1.25rem" />
|
||||
|
||||
@@ -0,0 +1,215 @@
|
||||
<template>
|
||||
<div v-can="corePermissionCodes.notify.read" class="notify-recipient-list">
|
||||
<template v-if="detail">
|
||||
<t-segmented
|
||||
v-model="recipientFilter"
|
||||
class="filter"
|
||||
block
|
||||
:options="recipientFilterOptions"
|
||||
v-entrance-transition
|
||||
/>
|
||||
<t-cell-group v-if="filteredDetailList.length" title="发送用户" theme="card" class="recipients">
|
||||
<t-cell
|
||||
v-for="(item, index) in filteredDetailList"
|
||||
:key="item.id"
|
||||
v-entrance-transition="index * 70"
|
||||
>
|
||||
<template #title>
|
||||
<div class="recipient-title">
|
||||
<span v-text="getRecipientName(item)" />
|
||||
<t-tag size="small" :theme="getReadTheme(item)" :content="getReadText(item)" />
|
||||
</div>
|
||||
</template>
|
||||
<template #description>
|
||||
<div class="recipient-description">
|
||||
<span v-text="getRecipientContact(item)" />
|
||||
<span v-if="item.resultDesc" v-text="item.resultDesc" />
|
||||
</div>
|
||||
</template>
|
||||
<template #note>
|
||||
<span v-text="getReadTime(item)" />
|
||||
</template>
|
||||
</t-cell>
|
||||
</t-cell-group>
|
||||
<t-empty v-else description="暂无匹配的接收用户" v-entrance-transition="70" />
|
||||
</template>
|
||||
<t-empty
|
||||
v-else
|
||||
:description="isLoading ? '正在加载发送用户' : '通知不存在'"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Time } from "timi-web";
|
||||
import { NotifyAPI, type Notify, type NotifyDetail } from "timi-web-api";
|
||||
import { Message } from "@/utils/message";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import { corePermissionCodes } from "@/utils/permission";
|
||||
|
||||
type RecipientFilter = "all" | "unread" | "read";
|
||||
type NotifyTagTheme = "default" | "success" | "warning" | "primary" | "danger";
|
||||
|
||||
defineOptions({
|
||||
name: "NotifyRecipientList"
|
||||
});
|
||||
|
||||
const route = useRoute();
|
||||
const navBarStore = useNavBarStore();
|
||||
|
||||
// ---------- 通知数据 ----------
|
||||
|
||||
const detail = ref<Notify>();
|
||||
const isLoading = ref(false);
|
||||
const recipientFilter = ref<RecipientFilter>(getRecipientFilterFromRoute());
|
||||
let loadToken = 0;
|
||||
|
||||
const recipientFilterOptions = [
|
||||
{ value: "all" as RecipientFilter, label: "全部" },
|
||||
{ value: "unread" as RecipientFilter, label: "未读" },
|
||||
{ value: "read" as RecipientFilter, label: "已读" }
|
||||
];
|
||||
const filteredDetailList = computed(() => {
|
||||
const detailList = detail.value?.detailList || [];
|
||||
if (recipientFilter.value === "unread") {
|
||||
return detailList.filter(item => !item.readAt);
|
||||
}
|
||||
if (recipientFilter.value === "read") {
|
||||
return detailList.filter(item => Boolean(item.readAt));
|
||||
}
|
||||
return detailList;
|
||||
});
|
||||
|
||||
function getRecipientFilterFromRoute(): RecipientFilter {
|
||||
const filter = String(route.query.filter || "");
|
||||
return filter === "unread" || filter === "read" ? filter : "all";
|
||||
}
|
||||
|
||||
async function loadDetail(): Promise<void> {
|
||||
const requestToken = loadToken + 1;
|
||||
loadToken = requestToken;
|
||||
detail.value = undefined;
|
||||
const notifyId = String(route.params.id || "");
|
||||
if (!notifyId) {
|
||||
return;
|
||||
}
|
||||
|
||||
isLoading.value = true;
|
||||
try {
|
||||
const result = await NotifyAPI.managementDetail(notifyId);
|
||||
if (requestToken !== loadToken) {
|
||||
return;
|
||||
}
|
||||
detail.value = result;
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发送用户加载失败"));
|
||||
} finally {
|
||||
if (requestToken === loadToken) {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ---------- 用户展示 ----------
|
||||
|
||||
function isCancelable(item: NotifyDetail): boolean {
|
||||
return item.status === "WAITING" && Boolean(item.sendAt && Time.now() < item.sendAt);
|
||||
}
|
||||
|
||||
function getRecipientName(item: NotifyDetail): string {
|
||||
return item.toUser?.nick?.trim() || item.toUser?.name?.trim() || item.sendTo || "未知用户";
|
||||
}
|
||||
|
||||
function getRecipientContact(item: NotifyDetail): string {
|
||||
return item.toUser?.phoneNo || item.sendTo || "-";
|
||||
}
|
||||
|
||||
function getReadText(item: NotifyDetail): string {
|
||||
if (isCancelable(item)) {
|
||||
return "待发送";
|
||||
}
|
||||
if (item.status === "CANCEL") {
|
||||
return "已取消";
|
||||
}
|
||||
if (item.status === "FAIL" || item.status === "TIMEOUT") {
|
||||
return item.status === "TIMEOUT" ? "已超时" : "发送失败";
|
||||
}
|
||||
return item.readAt ? "已读" : "未读";
|
||||
}
|
||||
|
||||
function getReadTheme(item: NotifyDetail): NotifyTagTheme {
|
||||
if (isCancelable(item)) {
|
||||
return "warning";
|
||||
}
|
||||
if (item.status === "CANCEL" || item.status === "FAIL" || item.status === "TIMEOUT") {
|
||||
return "danger";
|
||||
}
|
||||
return item.readAt ? "primary" : "default";
|
||||
}
|
||||
|
||||
function getReadTime(item: NotifyDetail): string {
|
||||
return item.readAt ? `已读 ${Time.toDateTime(item.readAt)}` : "未读";
|
||||
}
|
||||
|
||||
// ---------- 生命周期 ----------
|
||||
|
||||
watch(() => route.params.id, async () => {
|
||||
await loadDetail();
|
||||
}, { immediate: true });
|
||||
|
||||
watch(() => route.query.filter, () => {
|
||||
recipientFilter.value = getRecipientFilterFromRoute();
|
||||
});
|
||||
|
||||
onMounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.notify-recipient-list {
|
||||
gap: 1rem;
|
||||
min-height: 100%;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.filter {
|
||||
width: calc(100% - 2rem);
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.recipients {
|
||||
:deep(.t-cell__title) {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:deep(.t-cell__description) {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.recipient-title,
|
||||
.recipient-description {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.recipient-title {
|
||||
gap: .5rem;
|
||||
|
||||
> span:first-child {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.recipient-description {
|
||||
gap: .75rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,21 +1,12 @@
|
||||
<template>
|
||||
<div v-can="corePermissionCodes.notify.read" class="notify-detail">
|
||||
<article v-if="detail" class="article">
|
||||
<header class="header">
|
||||
<h1 v-text="getSubject(detail)" />
|
||||
<div class="sender">
|
||||
发送用户：<span v-text="getSenderName(detail)" />
|
||||
</div>
|
||||
<pass-time-label class="time" :timestamp="detail.sendAt" underline />
|
||||
</header>
|
||||
<section class="body">
|
||||
<notify-view
|
||||
:detail="detail"
|
||||
empty-text="暂无通知内容"
|
||||
:resolve-attachment-url="resolveAttachmentUrl"
|
||||
/>
|
||||
</section>
|
||||
</article>
|
||||
<notify-content
|
||||
v-if="detail"
|
||||
:detail="detail"
|
||||
:sender="getSenderName(detail)"
|
||||
:timestamp="detail.sendAt"
|
||||
:resolve-attachment-url="resolveAttachmentUrl"
|
||||
/>
|
||||
<t-empty
|
||||
v-else
|
||||
:description="isLoading ? '正在加载通知' : '通知不存在'"
|
||||
@@ -24,8 +15,6 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { NotifyView } from "timi-tdesign-mobile";
|
||||
import { PassTimeLabel } from "timi-web";
|
||||
import { NotifyAPI, type NotifyDetail } from "timi-web-api";
|
||||
import { DialogPlugin } from "tdesign-mobile-vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
@@ -33,6 +22,7 @@ import { getErrorMessage } from "@/utils/error";
|
||||
import { getAttachmentReadURL } from "@/utils/attachment";
|
||||
import { corePermissionCodes } from "@/utils/permission";
|
||||
import { Message } from "@/utils/message.ts";
|
||||
import NotifyContent from "@/pages/notify/component/NotifyContent.vue";
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
@@ -145,10 +135,6 @@ async function markRead(item: NotifyDetail, requestToken: number): Promise<void>
|
||||
|
||||
// ---------- 展示 ----------
|
||||
|
||||
function getSubject(item: NotifyDetail): string {
|
||||
return item.subject?.trim() || "站内通知";
|
||||
}
|
||||
|
||||
function getSenderName(item: NotifyDetail): string {
|
||||
return item.fromUser?.nick?.trim() || item.fromUser?.name?.trim() || "系统通知";
|
||||
}
|
||||
@@ -179,71 +165,5 @@ onUnmounted(() => {
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 1rem 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.article {
|
||||
padding: 1.25rem 1rem;
|
||||
margin: 0 1rem;
|
||||
background: rgba(255, 255, 255, .92);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
border-radius: 1.4rem;
|
||||
}
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
border-bottom: 1px solid rgba(148, 163, 184, .2);
|
||||
padding-bottom: 1rem;
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.time {
|
||||
color: #64748b;
|
||||
margin-top: .5rem;
|
||||
font-size: .8125rem;
|
||||
}
|
||||
|
||||
.sender {
|
||||
color: #64748b;
|
||||
margin-top: .5rem;
|
||||
font-size: .8125rem;
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
color: #334155;
|
||||
padding-top: 1rem;
|
||||
font-size: .9375rem;
|
||||
line-height: 1.8;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
:global(html.theme-dark) {
|
||||
.notify-detail {
|
||||
.article {
|
||||
background: rgba(15, 23, 42, .88);
|
||||
box-shadow: 0 .75rem 2rem rgba(2, 6, 23, .32);
|
||||
}
|
||||
|
||||
.header {
|
||||
border-bottom-color: rgba(148, 163, 184, .16);
|
||||
|
||||
.time {
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.sender {
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
color: #cbd5e1;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<article class="notify-content">
|
||||
<header class="header">
|
||||
<h1 v-text="subjectValue" />
|
||||
<div v-if="sender" class="sender">
|
||||
发送用户：<span v-text="sender" />
|
||||
</div>
|
||||
<pass-time-label
|
||||
v-if="timestamp !== undefined"
|
||||
class="time"
|
||||
:timestamp="timestamp"
|
||||
underline
|
||||
/>
|
||||
<div v-else-if="time" class="time" v-text="time" />
|
||||
</header>
|
||||
<section class="body">
|
||||
<notify-view
|
||||
:detail="detail"
|
||||
:empty-text="emptyText"
|
||||
:resolve-attachment-url="resolveAttachmentUrl"
|
||||
/>
|
||||
</section>
|
||||
</article>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { NotifyView } from "timi-tdesign-mobile";
|
||||
import { PassTimeLabel } from "timi-web";
|
||||
import type { NotifyDetail } from "timi-web-api";
|
||||
|
||||
defineOptions({
|
||||
name: "NotifyContent"
|
||||
});
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
detail?: NotifyDetail;
|
||||
emptyText?: string;
|
||||
resolveAttachmentUrl?: (attachmentId: string) => string | Promise<string>;
|
||||
sender?: string;
|
||||
subject?: string;
|
||||
time?: string;
|
||||
timestamp?: number;
|
||||
}>(), {
|
||||
emptyText: "暂无通知内容",
|
||||
sender: "",
|
||||
subject: "",
|
||||
time: ""
|
||||
});
|
||||
|
||||
const subjectValue = computed(() => props.subject.trim() || props.detail?.subject?.trim() || "站内通知");
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.notify-content {
|
||||
margin: 0 1rem;
|
||||
padding: 1rem;
|
||||
background: var(--td-bg-color-container);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
border-radius: 1.4rem;
|
||||
|
||||
.header {
|
||||
text-align: center;
|
||||
padding-bottom: 1rem;
|
||||
border-bottom: 1px solid rgba(148, 163, 184, .2);
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.time,
|
||||
.sender {
|
||||
color: #64748b;
|
||||
margin-top: .5rem;
|
||||
font-size: .8125rem;
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
color: #334155;
|
||||
padding-top: 1rem;
|
||||
font-size: .9375rem;
|
||||
line-height: 1.8;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
|
||||
:deep(.content) {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:global(html.theme-dark) {
|
||||
.article {
|
||||
background: rgba(15, 23, 42, .88);
|
||||
box-shadow: 0 .75rem 2rem rgba(2, 6, 23, .32);
|
||||
}
|
||||
|
||||
.header {
|
||||
border-bottom-color: rgba(148, 163, 184, .16);
|
||||
|
||||
.time,
|
||||
.sender {
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
|
||||
.body {
|
||||
color: #cbd5e1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -39,7 +39,7 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Message } from "@/utils/message";
|
||||
import { Time, Toolkit } from "timi-web";
|
||||
import { Time, WebToolkit } from "timi-web";
|
||||
import { type Page, type PageResult, useUserStore } from "timi-web-api";
|
||||
import StoreAPI from "@/api/StoreAPI";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
@@ -152,7 +152,7 @@ async function exportExcel(): Promise<void> {
|
||||
size: 10000,
|
||||
orderMap: page.orderMap
|
||||
});
|
||||
Toolkit.downloadBlob(blob, `门店列表-${Time.formatDate(new Date())}.xlsx`);
|
||||
WebToolkit.downloadBlob(blob, `门店列表-${Time.formatDate(new Date())}.xlsx`);
|
||||
Message.success("导出已开始");
|
||||
} finally {
|
||||
isExporting.value = false;
|
||||
|
||||
@@ -3,6 +3,7 @@ import AppSettings from "@/pages/setting/AppSettings.vue";
|
||||
import NotifyList from "@/pages/notify/NotifyList.vue";
|
||||
import NotifyCreate from "@/pages/notify/NotifyCreate.vue";
|
||||
import NotifyDetail from "@/pages/notify/NotifyDetail.vue";
|
||||
import NotifyRecipientList from "@/pages/notify/NotifyRecipientList.vue";
|
||||
import UserProfile from "@/pages/user/UserProfile.vue";
|
||||
import UserPassword from "@/pages/user/UserPassword.vue";
|
||||
import CustomerQrCode from "@/pages/customer/CustomerQrCode.vue";
|
||||
@@ -142,6 +143,20 @@ export const managementSettingRoutes: RouteRecordRaw[] = [
|
||||
darkBodyBackground: "#10161f"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/management/notifications/:id/recipients",
|
||||
name: "NotifyRecipientList",
|
||||
component: NotifyRecipientList,
|
||||
meta: {
|
||||
depth: 5,
|
||||
navBarVisible: true,
|
||||
navBarCanBack: true,
|
||||
navBarTitle: "发送用户",
|
||||
tabBarVisible: false,
|
||||
bodyBackground: "#F5F5F8",
|
||||
darkBodyBackground: "#10161f"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/management/tags",
|
||||
name: "TagList",
|
||||
|
||||
@@ -100,6 +100,10 @@ html.theme-dark body {
|
||||
}
|
||||
}
|
||||
|
||||
.fix-last-cell-line .item:last-child .t-cell:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.entrance-fade-up-enter-active {
|
||||
transition: opacity .4s ease, transform .4s ease;
|
||||
transition-delay: var(--entrance-delay, 0ms);
|
||||
|
||||
Reference in New Issue
Block a user