feat(shop): 实现新订单声音和语音提醒功能

- 新增 useOrderNotify 组合式函数，支持每60秒轮询检测新订单
- 采用 Web Audio API 播放叮声，Speech Synthesis API 进行语音播报
- shopOrder 页面添加提醒开关栏，包含开关、提示和测试按钮
- 开关默认关闭，需用户点击启用后启动声音和轮询功能
- 测试按钮仅在提醒开启时可用，用于验证提醒效果
- 完善样式，提升提醒栏的视觉效果和交互体验
- 统一更新相关环境变量，调整项目名称和接口地址

src/views/shop/shopOrder/index.vue

@@ -10,6 +10,30 @@
       />
     </a-card>
     <a-card :bordered="false" :body-style="{ padding: '16px' }">
+      <div class="order-notify-bar">
+        <a-space>
+          <span class="order-notify-label">新订单提醒</span>
+          <a-switch
+            v-model:checked="notifyEnabled"
+            checked-children="开"
+            un-checked-children="关"
+            @change="onNotifyToggle"
+          />
+          <a-tooltip
+            title="开启后每60秒自动检测新订单，检测到后播放叮声并语音播报"
+          >
+            <InfoCircleOutlined class="order-notify-tip" />
+          </a-tooltip>
+          <a-button
+            type="link"
+            size="small"
+            :disabled="!notifyEnabled"
+            @click="onTestNotify"
+          >
+            测试提醒
+          </a-button>
+        </a-space>
+      </div>
       <a-tabs type="card" v-model:activeKey="activeKey" @change="onTabs">
         <a-tab-pane key="all" tab="全部" />
         <a-tab-pane key="undelivered" tab="待发货" />
@@ -315,7 +339,8 @@
     CheckCircleOutlined,
     CloseCircleOutlined,
     RedoOutlined,
-    DeleteOutlined
+    DeleteOutlined,
+    InfoCircleOutlined
   } from '@ant-design/icons-vue';
   import Search from './components/search.vue';
   import { getPageTitle } from '@/utils/common';
@@ -333,6 +358,7 @@
   import { updateUser } from '@/api/system/user';
   import { getPayType } from '@/utils/shop';
   import { message, Modal } from 'ant-design-vue';
+  import { useOrderNotify } from './useOrderNotify';
 
   // 表格实例
   const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
@@ -351,6 +377,9 @@
   const loading = ref(true);
   // 激活的标签
   const activeKey = ref<string>('undelivered');
+
+  // ============ 新订单提醒 ============
+  const { enabled: notifyEnabled, toggle: onNotifyToggle, testNotify: onTestNotify } = useOrderNotify();
   // 表格数据源
   const datasource: DatasourceFunction = ({
     page,
@@ -775,4 +804,23 @@
   };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+  .order-notify-bar {
+    display: flex;
+    align-items: center;
+    margin-bottom: 12px;
+    padding: 8px 12px;
+    background: var(--ant-color-fill-alter, #fafafa);
+    border-radius: 6px;
+  }
+
+  .order-notify-label {
+    font-size: 14px;
+    font-weight: 500;
+  }
+
+  .order-notify-tip {
+    color: var(--ant-color-text-secondary, #999);
+    cursor: help;
+  }
+</style>