feat: 添加订单大厅看板 UI(四列看板 + 声音提醒 + 桌面通知)
All checks were successful
Build and Deploy TenantUI / build-and-deploy (push) Successful in 56s
All checks were successful
Build and Deploy TenantUI / build-and-deploy (push) Successful in 56s
This commit is contained in:
@@ -0,0 +1,75 @@
|
||||
<!-- 文件职责:订单大厅工具栏(门店选择 + 渠道筛选 + 声音开关 + 连接状态)。 -->
|
||||
<script setup lang="ts">
|
||||
import type { BoardChannelFilter } from '../types';
|
||||
|
||||
import { CHANNEL_OPTIONS } from '../composables/order-board-page/constants';
|
||||
|
||||
const {
|
||||
channel = 'all',
|
||||
isConnected = false,
|
||||
isSoundEnabled = true,
|
||||
storeId = '',
|
||||
} = defineProps<{
|
||||
channel: BoardChannelFilter;
|
||||
isConnected: boolean;
|
||||
isSoundEnabled: boolean;
|
||||
storeId: string;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
'update:channel': [value: BoardChannelFilter];
|
||||
'update:isSoundEnabled': [value: boolean];
|
||||
'update:storeId': [value: string];
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="ob-toolbar">
|
||||
<!-- 1. 门店 ID 输入 -->
|
||||
<div class="ob-toolbar__store">
|
||||
<span class="ob-toolbar__label">门店ID:</span>
|
||||
<a-input
|
||||
:value="storeId"
|
||||
placeholder="输入门店 ID"
|
||||
style="width: 200px"
|
||||
@change="(e: any) => emit('update:storeId', e.target.value)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 2. 渠道筛选 -->
|
||||
<div class="ob-toolbar__channel">
|
||||
<a-radio-group
|
||||
:value="channel"
|
||||
button-style="solid"
|
||||
size="small"
|
||||
@change="(e: any) => emit('update:channel', e.target.value)"
|
||||
>
|
||||
<a-radio-button
|
||||
v-for="opt in CHANNEL_OPTIONS"
|
||||
:key="opt.value"
|
||||
:value="opt.value"
|
||||
>
|
||||
{{ opt.label }}
|
||||
</a-radio-button>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
|
||||
<!-- 3. 声音开关 + 连接状态 -->
|
||||
<div class="ob-toolbar__right">
|
||||
<a-switch
|
||||
:checked="isSoundEnabled"
|
||||
checked-children="声音开"
|
||||
un-checked-children="声音关"
|
||||
@change="(val: boolean) => emit('update:isSoundEnabled', val)"
|
||||
/>
|
||||
<span
|
||||
class="ob-toolbar__status"
|
||||
:class="[
|
||||
isConnected ? 'ob-toolbar__status--on' : 'ob-toolbar__status--off',
|
||||
]"
|
||||
>
|
||||
{{ isConnected ? '已连接' : '未连接' }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user