260616

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',