260616

src/views/shop/shopGoods/components/search.vue

@@ -25,6 +25,12 @@
       </template>
       <span>导入</span>
     </a-button>
+    <a-button type="dashed" class="ele-btn-icon" @click="openImageImport">
+      <template #icon>
+        <UploadOutlined />
+      </template>
+      <span>导入图片</span>
+    </a-button>
     <a-button type="dashed" class="ele-btn-icon" @click="handleExport">
       导出xls
     </a-button>
@@ -105,6 +111,7 @@
     (e: 'remove'): void;
     (e: 'batchMove'): void;
     (e: 'import'): void;
+    (e: 'imageImport'): void;
     (e: 'export'): void;
   }>();
 
@@ -123,6 +130,10 @@
     emit('import');
   };
 
+  const openImageImport = () => {
+    emit('imageImport');
+  };
+
   // 导出
   const handleExport = () => {
     emit('export');

src/views/shop/shopGoods/index.vue

@@ -23,6 +23,7 @@
             @remove="removeBatch"
             @batchMove="openMove"
             @import="openImport"
+            @imageImport="openImageImport"
             @export="handleExport"
           />
         </template>
@@ -85,6 +86,11 @@
       v-model:visible="showImport"
       @done="reload"
     />
+
+    <ShopGoodsImageImport
+      v-model:visible="showImageImport"
+      @done="reload"
+    />
   </a-page-header>
 </template>
 
@@ -107,6 +113,7 @@
   import ShopGoodsEdit from './components/shopGoodsEdit.vue';
   import Extra from '@/views/shop/shopGoods/components/extra.vue';
   import ShopGoodsImport from './components/shop-goods-import.vue';
+  import ShopGoodsImageImport from './components/shop-goods-image-import.vue';
   import { listShopGoods, pageShopGoods, removeShopGoods, removeBatchShopGoods, updateShopGoods } from '@/api/shop/shopGoods';
   import type { ShopGoods, ShopGoodsParam } from '@/api/shop/shopGoods/model';
   import { getPageTitle } from '@/utils/common';
@@ -128,6 +135,8 @@
   const showEdit = ref(false);
   // 是否显示导入弹窗
   const showImport = ref(false);
+  // 是否显示图片导入弹窗
+  const showImageImport = ref(false);
   // 是否显示批量移动弹窗
   const showMove = ref(false);
   // 加载状态
@@ -259,6 +268,11 @@
     showImport.value = true;
   };
 
+  /* 打开图片导入弹窗 */
+  const openImageImport = () => {
+    showImageImport.value = true;
+  };
+
   /* 导出商品列表 */
   const handleExport = async () => {
     if (loading.value) {

src/views/shop/shopGoodsCategory/components/shopGoodsCategoryEdit.vue

@@ -57,6 +57,22 @@
           </div>
         </a-upload>
       </a-form-item>
+      <a-form-item label="广告图" name="adImage">
+        <a-upload
+          :before-upload="handleAdImageUpload"
+          :show-upload-list="false"
+          accept="image/*"
+        >
+          <a-button v-if="!form.adImage">
+            <template #icon><UploadOutlined /></template>
+            上传广告图
+          </a-button>
+          <div v-else class="flex items-center gap-2">
+            <img :src="form.adImage" style="width: 120px; height: 60px; object-fit: cover; border-radius: 4px; border: 1px solid #d9d9d9;" />
+            <a-button type="text" danger size="small" @click.stop="form.adImage = undefined">删除</a-button>
+          </div>
+        </a-upload>
+      </a-form-item>
       <a-form-item label="排序号" name="sortNumber">
         <a-input-number
           :min="0"
@@ -124,6 +140,7 @@
     title: undefined,
     type: 0,
     image: undefined,
+    adImage: undefined,
     parentId: undefined,
     path: undefined,
     component: undefined,
@@ -235,6 +252,23 @@
     return false; // 阻止默认上传
   };
 
+  const handleAdImageUpload = async (file: File) => {
+    const isImage = file.type?.startsWith('image/');
+    if (!isImage) {
+      message.error('只能上传图片文件');
+      return false;
+    }
+    try {
+      const res = await uploadFile(file);
+      if (res?.path) {
+        form.adImage = res.path;
+      }
+    } catch (e: any) {
+      message.error(e.message || '上传失败');
+    }
+    return false;
+  };
+
   watch(
     () => props.visible,
     (visible) => {
@@ -250,6 +284,7 @@
             title: undefined,
             type: 0,
             image: undefined,
+            adImage: undefined,
             parentId: undefined,
             sortNumber: 100,
             comments: undefined,

src/views/shop/shopGoodsCategory/index.vue

@@ -33,6 +33,14 @@
                 {{ record.type === 0 ? '商城分类' : '外卖分类' }}
               </a-tag>
             </template>
+            <template v-if="column.key === 'adImage'">
+              <img
+                v-if="record.adImage"
+                :src="record.adImage"
+                style="width: 72px; height: 40px; object-fit: cover; border-radius: 4px;"
+              />
+              <span v-else>-</span>
+            </template>
             <template v-if="column.key === 'parentId'">
               {{ getParentName(record.parentId) }}
             </template>
@@ -164,6 +172,13 @@
       align: 'center',
       width: 100
     },
+    {
+      title: '广告图',
+      dataIndex: 'adImage',
+      key: 'adImage',
+      align: 'center',
+      width: 110
+    },
     {
       title: '上级分类',
       dataIndex: 'parentId',