From 2a825e765f1407298c598c8eb42718d598f0bf8f Mon Sep 17 00:00:00 2001
From: hufflzp <1395188856@qq.com>
Date: Mon, 12 Jan 2026 16:49:07 +0800
Subject: [PATCH] =?UTF-8?q?update:=20=E6=96=B0=E5=A2=9E=E5=95=86=E5=93=81?=
 =?UTF-8?q?=E5=9B=BE=E7=89=87=E6=96=B0=E5=A2=9E=E5=9B=BE=E5=BA=93=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/product/goodsImg/goodsImgs.vue |  17 +-
 src/views/product/goodsImg/imgAdd.vue    | 193 +++++++++++++++++++++++
 2 files changed, 209 insertions(+), 1 deletion(-)
 create mode 100644 src/views/product/goodsImg/imgAdd.vue

diff --git a/src/views/product/goodsImg/goodsImgs.vue b/src/views/product/goodsImg/goodsImgs.vue
index db2ca0c..6990231 100644
--- a/src/views/product/goodsImg/goodsImgs.vue
+++ b/src/views/product/goodsImg/goodsImgs.vue
@@ -32,6 +32,14 @@
         批量编辑
       </el-button>
     </div>
+            <el-button
+              type="primary"
+              icon="el-icon-plus"
+              @click.stop="handleAdd"
+              style="margin-bottom: 10px;"
+            >
+              新增图库
+            </el-button>
     <div class="list">
       <el-table
         ref="imgTable"
@@ -148,6 +156,7 @@
     </div>
     <batchEditBarcode ref="batchEditBarcodeRef" @success="handleEditSuccess" />
     <img-edit ref="imgEditRef" @success="handleEditSuccess" />
+    <img-add ref="imgAddRef" @callback_fun_add="handleEditSuccess" />
   </div>
 </template>
 
@@ -155,11 +164,13 @@
 import GoodsToolApi from '@/api/goodsTool'
 import batchEditBarcode from './batchEditBarcode.vue'
 import imgEdit from './imgEdit.vue'
+import imgAdd from './imgAdd.vue'
 
 export default {
   components: {
     batchEditBarcode,
-    imgEdit
+    imgEdit,
+    imgAdd,
   },
   data() {
     return {
@@ -315,6 +326,10 @@ export default {
     handleEdit(row) {
         this.$refs.imgEditRef?.open(row);
     },
+
+    handleAdd() {
+      this.$refs.imgAddRef.init();
+    },
   },
 }
 </script>
diff --git a/src/views/product/goodsImg/imgAdd.vue b/src/views/product/goodsImg/imgAdd.vue
new file mode 100644
index 0000000..a4962bf
--- /dev/null
+++ b/src/views/product/goodsImg/imgAdd.vue
@@ -0,0 +1,193 @@
+<template>
+    <div>
+        <el-dialog :title="title" :visible.sync="dialogVisible" @open="openDialog" :modal-append-to-body="false"
+            :append-to-body="true" :close-on-click-modal="false" width="70%">
+            <avue-form ref="formref" style="max-height: 700px; overflow-y: auto; margin-bottom: 50px" :key="formkey"
+                :option="option" v-model="form" @submit="handleSubmit" @error="handleSubmitError"></avue-form>
+
+            <span class="avue-dialog__footer avue-dialog__footer--right" v-if="['add', 'edit'].includes(ntype)">
+                <el-button icon="el-icon-upload" type="primary" :loading="btnLoading"
+                    @click="submitBtnSave">保存</el-button>
+                <el-button icon="el-icon-circle-close" @click="dialogVisible = false">取消</el-button>
+            </span>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import { saveBatchBarcode } from "@/api/goodsTool";
+
+export default {
+    data() {
+        return {
+            title: '新增',
+            dialogVisible: false,
+            ntype: 'add',
+            formkey: 1,
+            obj_detail: {},
+            btnLoading: false,
+
+            form: {},
+            option: {
+                column: [
+                    {
+                        label: '添加图库',
+                        prop: 'imgs',
+                        type: 'dynamic',
+                        span: 24,
+                        children: {
+                            align: 'center',
+                            headerAlign: 'center',
+                            rowAdd: (done) => {
+                                if (this.form.imgs.length >= 5) {
+                                    this.$message.error('批次每次最多五条');
+                                    return;
+                                }
+                                done();
+                            },
+                            column: [
+                                {
+                                    label: '商品名称',
+                                    prop: "name",
+                                    rules: [
+                                        {
+                                            required: true,
+                                            message: '商品名称必须填写',
+                                        },
+                                    ],
+                                },
+                                {
+                                    label: '条形码',
+                                    prop: "barcode",
+                                    tip: '如有条形码请记得添加',
+                                },
+                                {
+                                    label: '商品主图',
+                                    width: 200,
+                                    type: 'upload',
+                                    listType: 'picture-img',
+                                    propsHttp: {
+                                        res: 'data',
+                                        url: 'media_url',
+                                    },
+                                    action: 'https://mall.gpxscs.cn/api/admin/oss/upload',
+                                    tip: '只能上传jpg/png',
+                                    data: {
+                                        authorization: this.$store.state.user.token,
+                                    },
+                                    prop: 'thumb',
+                                    rules: [
+                                        {
+                                            required: true,
+                                            message: '商品主图必须有',
+                                        },
+                                    ],
+                                },
+                                {
+                                    label: '商品附图',
+                                    type: 'upload',
+                                    width: 150,
+                                    listType: 'picture',
+                                    propsHttp: {
+                                        res: 'data',
+                                        url: 'media_url',
+                                    },
+                                    action: 'https://mall.gpxscs.cn/api/admin/oss/upload',
+                                    tip: '只能上传jpg/png',
+                                    data: {
+                                        authorization: this.$store.state.user.token,
+                                    },
+                                    prop: 'product_image_list',
+                                },
+                                {
+                                    label: '商品简称',
+                                    prop: "sname",
+                                },
+                                {
+                                    label: '商品标题',
+                                    prop: "title",
+                                },
+                                {
+                                    label: '一级分类',
+                                    prop: "category_1st",
+                                },
+                                {
+                                    label: '二级分类',
+                                    prop: "category_2nd",
+                                },
+                            ],
+                        },
+                    }
+                ],
+                labelPosition: 'right',
+                labelSuffix: '：',
+                labelWidth: 140,
+                gutter: 0,
+                menuBtn: false,
+                detail: false,
+                submitBtn: false,
+                submitText: '提交',
+                emptyBtn: false,
+                emptyText: '清空',
+                menuPosition: 'center',
+            },
+        }
+    },
+    methods: {
+        init() {
+            this.form = {}
+            this.dialogVisible = true
+            this.formkey++
+        },
+        openDialog() {
+            this.title = '新增'
+            this.option.detail = false
+        },
+        submitBtnSave() {
+            this.btnLoading = true
+            this.$refs.formref.submit()
+        },
+        handleSubmitError() {
+            this.btnLoading = false
+        },
+        handleSubmit(form, done) {
+            done()
+            let putData = []
+            form.imgs.forEach((item) => {
+                let imageList = []
+                item.product_image_list.forEach((item) => {
+                    let putObj = {
+                        imageUrl: item,
+                    }
+                    imageList.push(putObj)
+                })
+                putData.push(
+                    {
+                        ...item,
+                        product_image_list: imageList,
+                    }
+                )
+            })
+            this.saveSet(saveBatchBarcode, putData)
+        },
+        saveSet(Interface, params) {
+            Interface(params).then(
+                (res) => {
+                    this.$emit('callback_fun_add')
+                    console.log(res)
+                    this.$message({
+                        type: 'success',
+                        message: res.msg,
+                    })
+                    this.dialogVisible = false
+                    this.btnLoading = false
+                },
+                (error) => {
+                    this.btnLoading = false
+                    window.console.log(error)
+                }
+            )
+        },
+    },
+}
+</script>