refactor: 批量工具页改为复用公共门店工具栏

apps/web-antd/src/views/product/batch/components/BatchToolbar.vue

@@ -1,43 +0,0 @@
-<script setup lang="ts">
-import { Select } from 'ant-design-vue';
-
-interface Props {
-  isStoreLoading: boolean;
-  selectedStoreId: string;
-  storeOptions: Array<{ label: string; value: string }>;
-}
-
-interface Emits {
-  (event: 'update:selectedStoreId', value: string): void;
-}
-
-const props = defineProps<Props>();
-const emit = defineEmits<Emits>();
-
-function setStore(value: unknown) {
-  if (typeof value === 'string' || typeof value === 'number') {
-    emit('update:selectedStoreId', String(value));
-    return;
-  }
-
-  emit('update:selectedStoreId', '');
-}
-</script>
-
-<template>
-  <div class="pbt-toolbar">
-    <div class="pbt-toolbar-main">
-      <span class="pbt-toolbar-label">门店</span>
-      <Select
-        class="pbt-toolbar-store"
-        :value="props.selectedStoreId"
-        :options="props.storeOptions"
-        :loading="props.isStoreLoading"
-        placeholder="请选择门店"
-        @update:value="setStore"
-      />
-    </div>
-    <div class="pbt-toolbar-tip">选择门店后，工具仅作用于当前门店商品</div>
-  </div>
-</template>
-

apps/web-antd/src/views/product/batch/index.vue

@@ -8,7 +8,7 @@ import BatchMoveCategoryPanel from './components/BatchMoveCategoryPanel.vue';
 import BatchPriceAdjustPanel from './components/BatchPriceAdjustPanel.vue';
 import BatchSaleSwitchPanel from './components/BatchSaleSwitchPanel.vue';
 import BatchStoreSyncPanel from './components/BatchStoreSyncPanel.vue';
-import BatchToolbar from './components/BatchToolbar.vue';
+import StoreScopeToolbar from '../../shared/components/StoreScopeToolbar.vue';
 import BatchToolCards from './components/BatchToolCards.vue';
 import { useProductBatchPage } from './composables/useProductBatchPage';
 
@@ -124,12 +124,18 @@ function updateExportCategoryIds(value: string[]) {
 <template>
   <Page title="批量工具" content-class="page-product-batch">
     <div class="pbt-page">
-      <BatchToolbar
+      <StoreScopeToolbar
+        class="pbt-toolbar-card"
         :selected-store-id="selectedStoreId"
         :store-options="storeOptions"
         :is-store-loading="isStoreLoading"
+        :show-copy-button="false"
         @update:selected-store-id="setSelectedStoreId"
-      />
+      >
+        <template #actions>
+          <div class="pbt-toolbar-tip">选择门店后，工具仅作用于当前门店商品</div>
+        </template>
+      </StoreScopeToolbar>
 
       <div v-if="isStoreLoading && !selectedStoreId" class="pbt-empty-wrap">
         <Spin tip="门店加载中..." />

apps/web-antd/src/views/product/batch/styles/layout.less

@@ -6,33 +6,10 @@
     max-width: 1120px;
   }
 
-  .pbt-toolbar {
+  .pbt-toolbar-card {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 12px;
-    align-items: center;
-    justify-content: space-between;
-    padding: 12px 16px;
-    background: #fff;
-    border-radius: 10px;
     box-shadow: var(--pbt-shadow-sm);
   }
 
-  .pbt-toolbar-main {
-    display: flex;
-    gap: 10px;
-    align-items: center;
-  }
-
-  .pbt-toolbar-label {
-    font-size: 13px;
-    color: #4b5563;
-  }
-
-  .pbt-toolbar-store {
-    width: 240px;
-  }
-
   .pbt-toolbar-tip {
     font-size: 13px;
     color: #9ca3af;

apps/web-antd/src/views/product/batch/styles/responsive.less

@@ -8,12 +8,6 @@
       grid-template-columns: 1fr;
     }
 
-    .pbt-toolbar {
-      align-items: flex-start;
-    }
-
-    .pbt-toolbar-main,
-    .pbt-toolbar-store,
     .pbt-toolbar-tip {
       width: 100%;
     }