feat(shopOrder): 订单提醒时同步刷新列表数据
- Dashboard 欢迎横幅标题改为显示当前用户租户名称 - useOrderNotify 新增 onNewOrder 回调参数 - 新订单提醒触发时调用 onNewOrder 回调刷新表格数据 - shopOrder 页面调用 useOrderNotify 时传入刷新回调 - 保证新订单提醒时语音播放与表格数据同步更新
This commit is contained in:
@@ -25,3 +25,12 @@
|
|||||||
1. 检查后端是否有定时任务更新 `cmsStatistics` 表
|
1. 检查后端是否有定时任务更新 `cmsStatistics` 表
|
||||||
2. 或手动触发统计数据更新
|
2. 或手动触发统计数据更新
|
||||||
3. 检查浏览器控制台是否有 API 调用失败的错误日志
|
3. 检查浏览器控制台是否有 API 调用失败的错误日志
|
||||||
|
|
||||||
|
## 2026-07-14 Dashboard 标题改用 tenantName + 订单提醒同步刷新
|
||||||
|
|
||||||
|
### Dashboard 标题
|
||||||
|
- `src/views/shop/dashboard/index.vue` 欢迎横幅标题从 `siteStore.appName` 改为 `userStore.info?.tenantName`,显示当前登录用户所属租户名称。
|
||||||
|
|
||||||
|
### 订单新订单语音提醒同步刷新
|
||||||
|
- `src/views/shop/shopOrder/useOrderNotify.ts` 增加 `onNewOrder` 回调参数,检测到新订单触发提醒(叮声+语音)时同时调用回调。
|
||||||
|
- `src/views/shop/shopOrder/index.vue` 调用 `useOrderNotify({ onNewOrder: () => reload() })`,使新订单提醒时自动刷新表格数据,保持数据同步。
|
||||||
|
|||||||
@@ -398,7 +398,9 @@
|
|||||||
const activeKey = ref<string>('undelivered');
|
const activeKey = ref<string>('undelivered');
|
||||||
|
|
||||||
// ============ 新订单提醒 ============
|
// ============ 新订单提醒 ============
|
||||||
const { enabled: notifyEnabled, toggle: onNotifyToggle, testNotify: onTestNotify } = useOrderNotify();
|
const { enabled: notifyEnabled, toggle: onNotifyToggle, testNotify: onTestNotify } = useOrderNotify({
|
||||||
|
onNewOrder: () => reload()
|
||||||
|
});
|
||||||
// 表格数据源
|
// 表格数据源
|
||||||
const datasource: DatasourceFunction = ({
|
const datasource: DatasourceFunction = ({
|
||||||
page,
|
page,
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ import type { ShopOrder } from '@/api/shop/shopOrder/model';
|
|||||||
* 1. 定时轮询 pageShopOrder(只查最新 1 条)
|
* 1. 定时轮询 pageShopOrder(只查最新 1 条)
|
||||||
* 2. 与上次记录的 orderId 比较,不同则说明有新订单
|
* 2. 与上次记录的 orderId 比较,不同则说明有新订单
|
||||||
* 3. 播放"叮"声(Web Audio API) + 语音播报"您有一条新的订单"(Speech Synthesis API)
|
* 3. 播放"叮"声(Web Audio API) + 语音播报"您有一条新的订单"(Speech Synthesis API)
|
||||||
|
* 4. 同时触发 onNewOrder 回调,通知调用方刷新页面数据
|
||||||
*
|
*
|
||||||
* 浏览器策略:音频播放需要用户交互后才允许。
|
* 浏览器策略:音频播放需要用户交互后才允许。
|
||||||
* 默认开启轮询,音频在用户首次交互后自动解锁。
|
* 默认开启轮询,音频在用户首次交互后自动解锁。
|
||||||
@@ -51,6 +52,9 @@ let initialized = false;
|
|||||||
/** 用户交互解锁音频的监听器(一次性) */
|
/** 用户交互解锁音频的监听器(一次性) */
|
||||||
let unlockHandler: (() => void) | null = null;
|
let unlockHandler: (() => void) | null = null;
|
||||||
|
|
||||||
|
/** 新订单回调函数(由调用方传入,用于刷新页面数据) */
|
||||||
|
let onNewOrderCallback: (() => void) | null = null;
|
||||||
|
|
||||||
// ============ 声音播放 ============
|
// ============ 声音播放 ============
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -143,13 +147,17 @@ function speak(text: string) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 触发提醒:叮声 + 语音播报
|
* 触发提醒:叮声 + 语音播报 + 刷新页面
|
||||||
*/
|
*/
|
||||||
function triggerNotify() {
|
function triggerNotify() {
|
||||||
// 尝试初始化音频上下文(如果已解锁则生效,未解锁则静默失败)
|
// 尝试初始化音频上下文(如果已解锁则生效,未解锁则静默失败)
|
||||||
initAudioContext();
|
initAudioContext();
|
||||||
playDingSound();
|
playDingSound();
|
||||||
speak(SPEECH_TEXT);
|
speak(SPEECH_TEXT);
|
||||||
|
// 通知调用方刷新页面数据
|
||||||
|
if (onNewOrderCallback) {
|
||||||
|
onNewOrderCallback();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// ============ 轮询逻辑 ============
|
// ============ 轮询逻辑 ============
|
||||||
@@ -231,11 +239,18 @@ function stopPolling() {
|
|||||||
*
|
*
|
||||||
* 用法:
|
* 用法:
|
||||||
* ```ts
|
* ```ts
|
||||||
* const { enabled, toggle } = useOrderNotify();
|
* const { enabled, toggle } = useOrderNotify({
|
||||||
|
* onNewOrder: () => reload() // 检测到新订单时刷新表格
|
||||||
|
* });
|
||||||
* // 用户点击开关时调用 toggle(true/false)
|
* // 用户点击开关时调用 toggle(true/false)
|
||||||
* ```
|
* ```
|
||||||
|
*
|
||||||
|
* @param options.onNewOrder 检测到新订单时的回调(通常用于刷新页面数据)
|
||||||
*/
|
*/
|
||||||
export function useOrderNotify() {
|
export function useOrderNotify(options?: { onNewOrder?: () => void }) {
|
||||||
|
// 缓存回调
|
||||||
|
onNewOrderCallback = options?.onNewOrder ?? null;
|
||||||
|
|
||||||
// 组件挂载时自动启动(默认开启)
|
// 组件挂载时自动启动(默认开启)
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// 注册用户交互解锁音频监听器
|
// 注册用户交互解锁音频监听器
|
||||||
@@ -253,6 +268,8 @@ export function useOrderNotify() {
|
|||||||
document.removeEventListener('keydown', unlockHandler);
|
document.removeEventListener('keydown', unlockHandler);
|
||||||
unlockHandler = null;
|
unlockHandler = null;
|
||||||
}
|
}
|
||||||
|
// 清理回调引用
|
||||||
|
onNewOrderCallback = null;
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
Reference in New Issue
Block a user