peng
2025-09-01 50330b85ea88ae53953e93ec40974b29f92a1195
seller/src/views/goods/goods-seller/goodsOperationSec.vue
@@ -23,16 +23,25 @@
            <FormItem label="商品价格" prop="price">
              <Input v-model="baseInfoForm.price" clearable placeholder="商品价格" style="width: 260px" type="text"/>
            </FormItem>
            <FormItem label="抽成比例" prop="commission">
<!--              <Input v-model="baseInfoForm.commission" max="100" min="0" clearable placeholder="抽成比例" style="width: 260px" type="number"/>-->
              <InputNumber v-model="baseInfoForm.commission" :formatter="value => `${value}%`"
                           :parser="value => value.replace('%', '')" :max="100" :min="0" clearable
                           :active-change="false"
                           placeholder="抽成比例" style="width: 260px" type="number"/>
            </FormItem>
            <FormItem label="商品卖点" prop="sellingPoint">
              <Input v-model="baseInfoForm.sellingPoint" :rows="4" style="width: 260px" type="textarea"/>
            </FormItem>
            <FormItem label="商品品牌" prop="brandId">
              <Select v-model="baseInfoForm.brandId" filterable style="width: 200px">
                <Option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id"></Option>
              </Select>
              <Button class="refresh-icon" icon="md-refresh" shape="circle" type="text"
                      @click="refresh('brand')"></Button>
            </FormItem>
<!--            <FormItem label="商品品牌" prop="brandId">-->
<!--              <Select v-model="baseInfoForm.brandId" filterable style="width: 200px">-->
<!--                <Option v-for="item in brandList" :key="item.id" :label="item.name" :value="item.id"></Option>-->
<!--              </Select>-->
<!--              <Button class="refresh-icon" icon="md-refresh" shape="circle" type="text"-->
<!--                      @click="refresh('brand')"></Button>-->
<!--            </FormItem>-->
          </div>
          <h4>商品交易信息</h4>
          <div class="form-item-view">
@@ -48,13 +57,22 @@
              <RadioGroup v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'" v-model="baseInfoForm.salesModel"
                          button-style="solid" type="button" @on-change="renderTableData(skuTableData)">
                <Radio label="RETAIL" title="零售型">零售型</Radio>
                <Radio label="WHOLESALE" title="批发型">批发型</Radio>
<!--                <Radio label="WHOLESALE" title="批发型">批发型</Radio>-->
                <Radio label="PRESALE" title="预售">预售</Radio>
              </RadioGroup>
              <RadioGroup v-else v-model="baseInfoForm.salesModel" button-style="solid" type="button">
                <Radio label="RETAIL" title="零售型">
                  <span>虚拟型</span>
                </Radio>
              </RadioGroup>
            </FormItem>
            <FormItem v-if="baseInfoForm.salesModel == 'PRESALE'">
              <div>
                预售时间:
                <DatePicker type="daterange" v-model="baseInfoForm.preSaleTime"
                            format="yyyy-MM-dd" placement="bottom-end" placeholder="请选择预售时间" style="width: 200px"
                            @on-change="choosePreTime"></DatePicker>
              </div>
            </FormItem>
            <FormItem v-if="baseInfoForm.salesModel == 'WHOLESALE'" class="form-item-view-el" label="销售规则"
                      prop="wholesaleRule">
@@ -101,10 +119,10 @@
          </div>
          <h4>商品规格及图片</h4>
          <div class="form-item-view">
            <FormItem class="form-item-view-el required" label="主图" prop="goodsGalleryFiles">
            <FormItem class="form-item-view-el required" label="主图" prop="goodsGalleryFiles"  >
              <div style="display: flex; flex-wrap: wrap;">
                <vuedraggable :animation="200" :list="baseInfoForm.goodsGalleryFiles">
                  <div v-for="(item, __index) in baseInfoForm.goodsGalleryFiles" :key="__index"
                <vuedraggable :animation="200" :list="showListImages">
                  <div v-for="(item, __index) in showListImages" :key="__index"
                       class="demo-upload-list">
                    <template>
                      <img :src="item"/>
@@ -118,17 +136,17 @@
                  </div>
                </vuedraggable>
                <!--<Upload ref="upload"-->
                        <!--:action="uploadFileUrl" :before-upload="handleBeforeUploadGoodsPicture"-->
                        <!--:format="['jpg', 'jpeg', 'png', 'webp']"-->
                        <!--:headers="{ ...accessToken }"-->
                        <!--:max-size="2048" :on-error="() => { $Spin.hide(); }" :on-exceeded-size="handleMaxSize"-->
                        <!--:on-format-error="handleFormatError" :on-progress="() => { $Spin.show(); }"-->
                        <!--:on-success="handleSuccessGoodsPicture" :show-upload-list="false" multiple-->
                        <!--style="margin-left: 10px"-->
                        <!--type="drag">-->
                  <!--<div style="width: 148px; height: 148px; line-height: 148px">-->
                    <!--<Icon size="20" type="md-add"></Icon>-->
                  <!--</div>-->
                <!--:action="uploadFileUrl" :before-upload="handleBeforeUploadGoodsPicture"-->
                <!--:format="['jpg', 'jpeg', 'png', 'webp']"-->
                <!--:headers="{ ...accessToken }"-->
                <!--:max-size="2048" :on-error="() => { $Spin.hide(); }" :on-exceeded-size="handleMaxSize"-->
                <!--:on-format-error="handleFormatError" :on-progress="() => { $Spin.show(); }"-->
                <!--:on-success="handleSuccessGoodsPicture" :show-upload-list="false" multiple-->
                <!--style="margin-left: 10px"-->
                <!--type="drag">-->
                <!--<div style="width: 148px; height: 148px; line-height: 148px">-->
                <!--<Icon size="20" type="md-add"></Icon>-->
                <!--</div>-->
                <!--</Upload>-->
              </div>
              <div style="width: 100%;display: flex;justify-content: start;margin-top: 10px;">
@@ -139,22 +157,33 @@
              </Modal>
            </FormItem>
            <FormItem>
              <div style="color: grey">主图仅支持png,jpg,jpeg格式,宽高至少600*600px,大小2M内,可拖拽调整主图顺序</div>
<!--              <div class="demo-upload-list" v-for="(item,index) in showListImages">-->
<!--                <template style="display: flex">-->
<!--                  <img :src="item">-->
<!--                  <div class="demo-upload-list-cover">-->
<!--                    <Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>-->
<!--                    <Icon type="ios-trash-outline" @click.native="handleRemove(index)"></Icon>-->
<!--                  </div>-->
<!--                </template>-->
<!--              </div>-->
              <div style="color: grey"  v-if="!baseInfoForm.goodsVideo">主图仅支持png,jpg,jpeg格式,宽高至少600*600px,大小2M内</div>
            </FormItem>
            <FormItem class="form-item-view-el" label="主图视频" prop="goodsVideo">
            <FormItem class="form-item-view-el" label="视频" prop="goodsVideo" >
              <div class="goods-video">
                <div v-if="baseInfoForm.goodsVideo">
                  <div>
                    <video :src="baseInfoForm.goodsVideo" class="video" controls style="max-width: 300px;"/>
                    <video :src="baseInfoForm.showGoodsVideo" class="video" controls style="max-width: 300px;max-height: 400px"/>
                  </div>
                </div>
                <Upload ref="upload" :action="uploadFileUrl" :format="['avi', 'wmv', 'mpeg', 'mp4', 'mov']"
                <Upload ref="upload" action="-" :format="['avi', 'wmv', 'mpeg', 'mp4', 'mov']"
                        :headers="{ ...accessToken }"
                        :max-size="10240" :on-error="() => { loadingVideo = false }"
                        :on-exceeded-size="handleVideoMaxSize"
                        :on-format-error="handleFormatError" :on-progress="() => { loadingVideo = true }"
                        :on-success="handleSuccessGoodsVideo" :show-upload-list="false"
                        multiple
                        :before-upload="upLoadVideo"
                        accept="video/*"
                        style="margin-left: 10px" type="drag">
                  <Button :loading="loadingVideo" icon="ios-cloud-upload-outline" type="text">
                    <span v-if="!loadingVideo">
@@ -165,6 +194,9 @@
                    </span>
                  </Button>
                </Upload>
                <Button :loading="loadingVideo" v-if="baseInfoForm.goodsVideo"  icon="delete" @click="removeVideo" type="text">
                  <span>删除视频</span>
                </Button>
              </div>
            </FormItem>
            <div class="layout" style="width: 100%">
@@ -176,7 +208,7 @@
                      <div v-for="(item, $index) in skuInfo" :key="$index" class="sku-item-content">
                        <Card :bordered="true" class="ivu-card-body">
                          <a slot="extra" style="margin-left: 6px">
                            <Icon size="20" type="md-trash"  @click="handleCloseSkuItem($index, item)"></Icon>
                            <Icon size="20" type="md-trash" @click="handleCloseSkuItem($index, item)"></Icon>
                          </a>
                          <div>
                            <div style="display: flex;margin-bottom: 10px;font-weight: bold">规格项</div>
@@ -185,10 +217,13 @@
                              <div>
                                <AutoComplete v-model="item.name" :filter-method="filterMethod"
                                              :maxlength="30" placeholder="请输入规格项名称" style="width: 150px"
                                              @on-focus="changeSkuItem(item.name)" @on-change="editSkuItem(item.name, $index, item)">
                                              @on-focus="changeSkuItem(item.name)"
                                              @on-change="editSkuItem(item.name, $index, item)">
                                </AutoComplete>
                                <iSwitch v-if="$index === 0" style="margin-left: 10px" size="small" @on-change="changeSkuOpenImage" v-model="openImage" /><span v-if="$index === 0" style="margin-left: 5px">添加规格图片</span>
<!--                                <iSwitch v-if="$index === 0" style="margin-left: 10px" size="small"-->
<!--                                         @on-change="changeSkuOpenImage" v-model="openImage"/>-->
<!--                                <span v-if="$index === 0" style="margin-left: 5px">添加规格图片</span>-->
                              </div>
                            </FormItem>
@@ -210,7 +245,8 @@
                                                @on-change="skuValueChange(val, index, item)">
                                  </AutoComplete>
                                  <a style="margin-left: 6px" v-if="val.value && val.value !== ''">
                                    <Icon size="15" type="md-trash" @click="handleCloseSkuValue(val, index, item)"></Icon>
                                    <Icon size="15" type="md-trash"
                                          @click="handleCloseSkuValue(val, index, item)"></Icon>
                                  </a>
                                </div>
                                <div v-if="$index === 0 && openImage" style="margin-top: 10px">
@@ -225,19 +261,20 @@
                                          style="width: 180px;height: 140px"
                                        />
                                        <div class="sku-upload-list-cover">
                                          <div style="margin-top: 50px" >
                                          <div style="margin-top: 50px">
                                            <Icon size="25" type="md-search" @click="handleView(img)"></Icon>
                                            <Icon size="25" type="md-trash" @click="handleRemove(val.images, __index)"></Icon>
                                            <Icon size="25" type="md-trash"
                                                  @click="handleRemove(val.images, __index)"></Icon>
                                          </div>
                                        </div>
                                      </template>
                                    </div>
                                  </vuedraggable>
                                  <Upload ref="uploadSku" :action="uploadFileUrl"
<!--                                  todo 3-->
                                  <Upload ref="uploadSku" action="-"
                                          v-if="val.images < 1"
                                          :before-upload="handleBeforeUpload"
                                          :format="['jpg', 'jpeg', 'png', 'webp']"
                                          :headers="{ ...accessToken }"
                                          :max-size="2048"
                                          :on-error="() => { $Spin.hide(); }"
                                          :on-exceeded-size="handleMaxSize"
@@ -255,7 +292,9 @@
                                </div>
                              </FormItem>
                              <FormItem v-if="item.spec_values.length < 10 && item.spec_values.length >= 1 && item.spec_values[0].value !== ''" class="sku-item-content-val flex" label="" style="line-height: 32px;">
                              <FormItem
                                v-if="item.spec_values.length < 10 && item.spec_values.length >= 1 && item.spec_values[0].value !== ''"
                                class="sku-item-content-val flex" label="" style="line-height: 32px;">
                                <AutoComplete ref="input" v-model="newSkuValues[$index]"
                                              :filter-method="filterMethod"
                                              :maxlength="30" placeholder="自定义规格值" style="width: 180px"
@@ -288,9 +327,9 @@
                            overflow-x: hidden;
                          }
                        ">
                        <template slot="sn" slot-scope="{ row }">
                          <Input v-model="row.sn" clearable placeholder="请输入货号"
                                 @on-change="updateSkuTable(row, 'sn')"/>
                        <template slot="sn" slot-scope="{ row, index }">
                          <Input v-model="row.sn" placeholder="请输入货号" disabled
                                 @on-change="updateSkuTable(row, 'sn')" />
                        </template>
                        <div v-if="baseInfoForm.goodsType !== 'VIRTUAL_GOODS'" slot="weight" slot-scope="{ row }">
                          <Input v-model="row.weight" clearable placeholder="请输入重量"
@@ -362,6 +401,7 @@
            </div>
            <FormItem class="form-item-view-el" label="PC商品描述" prop="intro" style="width: 100%">
              <editor
                :show-upload="true"
                ref="editor"
                v-model="baseInfoForm.intro"
                height="800px"
@@ -375,6 +415,7 @@
            <FormItem class="form-item-view-el" label="移动端描述" prop="skuList" style="width: 100%">
              <editor
                :show-upload="true"
                ref="introEditor"
                v-model="baseInfoForm.mobileIntro"
                height="800px"
@@ -473,8 +514,32 @@
    <!--<Modal width="1200px" v-model="picModelFlag">-->
    <!--<ossManage @callback="callbackSelected" ref="ossManage" />-->
    <!--</Modal>-->
    <Modal v-model="picModelFlag" width="1200px" @on-ok="confirmUrls">
      <ossManage ref="ossManage" :isComponent="true" :initialize="picModelFlag" @callback="callbackSelected" @selected="(list)=>{ selectedImage = list}"/>
    <!--    todo web-->
    <Modal v-model="picModelFlag" width="1200px">
      <!--      <ossManage ref="ossManRage" :isComponent="true" :initialize="picModelFlag" @callback="callbackSelected" @selected="(list)=>{ selectedImage = list}"/>-->
      <div class="demo-upload-list" v-for="(item,index) in showListImages">
        <template>
          <img :src="item">
          <div class="demo-upload-list-cover">
            <Icon type="ios-eye-outline" @click.native="handleView(item)"></Icon>
            <Icon type="ios-trash-outline" @click.native="handleRemove(null,index)"></Icon>
          </div>
        </template>
      </div>
      <div class="demo-upload-list">
        <Upload
          :before-upload="upLoadImg"
          accept="image/*"
          action="-"
          type="drag"
          style=" display: inline-block;width: 58px"
        >
          <div style="width: 58px;height:58px;line-height: 58px;">
            <Icon type="ios-camera" size="20"></Icon>
          </div>
        </Upload>
      </div>
    </Modal>
  </div>
@@ -491,6 +556,10 @@
import DPlayer from 'dplayer';
// import ossManage from "@/views/sys/oss-manage/ossManage";
import ossManage from "@/views/shop/ossManages";
import COS from 'cos-js-sdk-v5';
import {getFileKey} from "@/utils/file.js";
import {getFilePreview, getSts} from "@/api/file";
import {formatDate} from "@/utils/filters";
export default {
@@ -523,6 +592,7 @@
      }, 1000);
    };
    return {
      showListImages: [],
      regular,
      openImage: false,
      needToloadSku: false,
@@ -625,6 +695,12 @@
        /** 商品分类中文名 */
        categoryName: [],
        goodsVideo: "",
        showGoodsVideo: "",
        // 预售时间
        preSaleTime:[],
        preSaleBeginDate:'',
        preSaleEndDate:'',
        commission:5
      },
      /** 表格头 */
      skuTableColumn: [],
@@ -698,12 +774,45 @@
      if (val) {
        this.initVideo();
      }
    },
    showListImages(newValue){
      this.baseInfoForm.goodsGalleryFiles = newValue.map(item => {
        return   item.split('/').slice(-2).join('/')
      })
    }
  },
  methods: {
    // 格式化显示值
    formatter(date) {
      return this.formatDate(date, 'yyyy-MM-dd');
    },
    // 日期格式化工具
    formatDate(date, format) {
      const year = date.getFullYear();
      const month = (date.getMonth() + 1).toString().padStart(2, '0');
      const day = date.getDate().toString().padStart(2, '0');
      return format
        .replace('yyyy', year)
        .replace('MM', month)
        .replace('dd', day);
    },
    choosePreTime(e){
      if (this.baseInfoForm.preSaleTime){
        const[begin,end] = this.baseInfoForm.preSaleTime;
        this.baseInfoForm.preSaleBeginDate = this.formatDate(begin,'yyyy-MM-dd');
        this.baseInfoForm.preSaleEndDate = this.formatDate(end,'yyyy-MM-dd');
        console.log('------------------>选择时间',this.baseInfoForm.preSaleBeginDate,this.baseInfoForm.preSaleEndDate)
      }
      console.log('时间选择------------------》',e)
    },
    // 选择图片modal
    handleCLickImg(val, index) {
      this.$refs.ossManage.selectImage = true;
      console.log('测试输入的值----------------》', val)
      // 废弃原有的图片上传
      // this.$refs.ossManage.selectImage = true;
      this.picModelFlag = true;
      this.selectedFormBtnName = val;
      // this.picIndex = index;
@@ -724,10 +833,10 @@
    },
    // ship大小不正确
    handleVideoMaxSize(file) {
      this.$Notice.warning({
        title: "超过文件大小限制",
        desc: "视频大小不能超过10MB",
      });
      // this.$Notice.warning({
      //   title: "超过文件大小限制",
      //   desc: "视频大小不能超过10MB",
      // });
    },
    onAddSku(index) {
      if (!this.newSkuValues[index]) {
@@ -865,7 +974,15 @@
    },
    // 移除已选图片
    handleRemove(item, index) {
      item.splice(index, 1)
      if (!item) {
        this.listImages.splice(index, 1);
        this.showListImages.splice(index, 1);
        this.baseInfoForm.goodsGalleryFiles.splice(index, 1);
        this.baseInfoForm.goodsGalleryList.splice(index, 1);
      } else {
        console.log('移除测试',item, index);
        item.splice(index, 1)
      }
      this.previewPicture = "";
    },
    // 查看商品大图
@@ -999,14 +1116,57 @@
      }
    },
    // sku图片上传前钩子
    handleBeforeUpload(file) {
  async handleBeforeUpload(file) {
      const check =
        this.selectedSku.images !== undefined &&
        this.selectedSku.images.length > 5;
      if (check) {
        this.$Notice.warning({title: "图片数量不能大于五张"});
        return false;
      }
      try {
        // this.upLoadVideoLoading = true;
        // 获取文件上传临时密钥
        const sts = await getSts();
        const cos = new COS({
          getAuthorization: async function (options, callback) {
            callback({
              TmpSecretId: sts.data.tmpSecretId,
              TmpSecretKey: sts.data.tmpSecretKey,
              SecurityToken: sts.data.sessionToken,
              // 建议返回服务器时间作为签名的开始时间,避免客户端本地时间偏差过大导致签名错误
              StartTime: sts.data.stsStartTime, // 时间戳,单位秒,如:1580000000
              ExpiredTime: sts.data.stsEndTime,// 时间戳,单位秒,如:1580000000
              ScopeLimit: true, // 细粒度控制权限需要设为 true,会限制密钥只在相同请求时重复使用
            });
          }
        })
        const fileKey = getFileKey(file.name)
        const upData = await cos.uploadFile({
          Bucket: sts.data.bucket,
          Region: sts.data.region,
          Key: fileKey,
          Body: file, // 要上传的文件对象。
          SliceSize: 1024 * 1024 * 5,
          onProgress: function (progressData) {
            console.log('上传进度:', progressData);
          },
        });
        console.log("上传成功", upData)
        this.$nextTick(() => {
          this.listImages.push(fileKey);
          this.showListImages.push(sts.data.endpoint + "/" + fileKey);
          this.baseInfoForm.goodsGalleryFiles.push(fileKey);
        })
      } catch (e) {
        console.log("上传失败", upData)
        return false;
      } finally {
        // this.upLoadVideoLoading = false;
      }
      return false;
    },
    /** 查询商品品牌列表 */
@@ -1075,6 +1235,7 @@
      response.result.recommend
        ? (response.result.recommend = 1)
        : (response.result.recommend = 0);
      response.result.preSaleTime = [response.result.preSaleBeginDate, response.result.preSaleEndDate];
      this.baseInfoForm = {...this.baseInfoForm, ...response.result};
      this.baseInfoForm.release = 1; //即使是被放入仓库,修改的时候也会显示会立即发布
      this.categoryId = response.result.categoryPath.split(",")[2];
@@ -1086,8 +1247,34 @@
        this.baseInfoForm.goodsGalleryFiles =
          response.result.goodsGalleryList.map((i) => {
            return i;
          });
          })
        try {
          const stsInfo = await getSts();
          const endpoint = stsInfo.data.endpoint;
          this.showListImages = response.result.goodsGalleryList.map((i) => {
            if (i!=null&&i.indexOf('http')===-1)
            return endpoint+'/'+i;
            else return i;
          })
          if (response.result.goodsVideo){
          }
        } catch (e) {
          console.log('组装路径出问题',e);
        }
      }
     if (response.result.goodsVideo){
       try {
         const stsInfo = await getSts();
         const endpoint = stsInfo.data.endpoint;
         this.baseInfoForm.goodsVideo = response.result.goodsVideo;
         this.baseInfoForm.showGoodsVideo = endpoint + '/' + response.result.goodsVideo;
         console.log('显示商品视频------------------->', this.baseInfoForm.showGoodsVideo);
       } catch (e) {
         console.log('组装视频地址出错了')
       }
     }
      if (
        response.result.wholesaleList &&
@@ -1105,7 +1292,8 @@
      this.renderGoodsDetailSku(response.result.skuList);
      /** 查询品牌列表 */
      this.getGoodsBrandList();
      //todo 移除品牌概念
      // this.getGoodsBrandList();
      /** 查询店铺商品分类 */
      this.GET_ShopGoodsLabel();
@@ -1125,7 +1313,7 @@
      this.firstData.goodsType &&
      (this.baseInfoForm.goodsType = this.firstData.goodsType);
      /** 查询商品参数 */
      this.GET_GoodsParams();
      // this.GET_GoodsParams();
    },
    // 渲染sku数据
    renderGoodsDetailSku(skuList) {
@@ -1515,6 +1703,7 @@
        this.baseInfoForm.regeneratorSkuFlag = true;
        this.newSkuValues[$index] = "";
      }
      this.renderTableData(this.skuTableData);
    },
    handleClearSku() {
      this.skuInfo = [];
@@ -1542,6 +1731,7 @@
     * 渲染table所需要的column 和 data
     */
    renderTableData(skus) {
      console.log('-------------->销售类型',skus)
      this.skuTableColumn = [];
      let pushData = [];
      // 渲染头部
@@ -1566,7 +1756,15 @@
          }
        );
      }
      // 预售模式
      // if (this.baseInfoForm.salesModel !== "PRESALE") {
      //   pushData.push(
      //     {
      //       title: "预售时间",
      //       slot: "price",
      //     }
      //   );
      // }
      if (this.baseInfoForm.salesModel === "WHOLESALE" && this.wholesaleData) {
        this.wholesaleData.forEach((item, index) => {
          pushData.push({
@@ -1622,6 +1820,7 @@
     * array spec数据
     */
    specIterator(result, spec, skus) {
      let table = result;
      if (spec.length > 0) {
        //清除当前循环的分组
@@ -1663,6 +1862,11 @@
      } else {
        this.skuIndex++;
      }
      table.forEach((item,index) =>{
        console.log("元素:" + item +"index:" + (index +1))
          item.sn = index + 1;
      })
      return table;
    },
    /** 根据分类id获取系统设置规格信息*/
@@ -1720,6 +1924,7 @@
          return;
        }
      }
      // else if (item === "alertQuantity") {
      //   if (
      //     !/^[0-9]\d*$/.test(row[item]) ||
@@ -1780,124 +1985,134 @@
    },
    /**  添加商品 **/
    save() {
      this.submitLoading = true;
      this.$refs["baseInfoForm"].validate((valid) => {
        if (valid) {
          if (this.baseInfoForm.salesModel === "WHOLESALE") {
            for (let i = 0; i < this.wholesaleData.length; i++) {
              this.checkWholesaleNum(i);
              this.checkWholesalePrice(i);
              this.wholesaleData[i].goodsId = this.goodsId;
            }
            this.baseInfoForm.wholesaleList = this.wholesaleData;
          }
          this.baseInfoForm.goodsId = this.goodsId;
          let submit = JSON.parse(JSON.stringify(this.baseInfoForm));
          if (
            submit.goodsGalleryFiles &&
            submit.goodsGalleryFiles.length <= 0
          ) {
            this.submitLoading = false;
            this.$Message.error("请上传商品图片");
            return;
          }
          if (submit.templateId === "") submit.templateId = 0;
          let flag = false;
          let paramValue = "";
          if (flag) {
            this.$Message.error(paramValue + " 参数值不能为空");
            this.submitLoading = false;
            return;
          }
          if (this.goodsUnitList && !this.goodsUnitList.find(i => i === this.baseInfoForm.goodsUnit)) {
            submit.goodsUnit = ""
            this.$Message.error("商品单位不存在");
            this.submitLoading = false;
            return;
          }
          let skuInfoNames = this.skuInfo.map((n) => n.name);
          submit.skuList = [];
          let containEmptyImage = false;
          this.skuTableData.map((sku) => {
            let skuCopy = {
              cost: 1,
              price: sku.price,
              quantity: sku.quantity,
              // alertQuantity: sku.alertQuantity,
              sn: sku.sn,
              images: [],
            };
            if (this.openImage) {
              this.skuInfo[0].spec_values.forEach(item => {
                if (!item.images || item.images.length === 0) {
                  containEmptyImage = true;
                  return;
                }
                if (item.value === sku[this.skuInfo[0].name]) {
                  skuCopy.images = item.images
                }
              })
            }
            if (sku.weight) {
              skuCopy.weight = sku.weight;
            }
            if (this.baseInfoForm.weight) {
              skuCopy.weight = this.baseInfoForm.weight;
            }
            if (sku.id) {
              skuCopy.id = sku.id;
            }
            for (let skuInfoName of skuInfoNames) {
              skuCopy[skuInfoName] = sku[skuInfoName];
            }
            submit.skuList.push(skuCopy);
          });
          if (containEmptyImage) {
            this.$Message.error("开启规格图片,所有规格图片不能为空!");
            this.submitLoading = false;
            return;
          }
          if (submit.goodsGalleryFiles.length > 0) {
            submit.goodsGalleryList = submit.goodsGalleryFiles.map(
              (i) => i
            );
          }
          /** 参数校验 **/
          /* Object.keys(submit.goodsParamsList).forEach((item) => {
          });*/
          submit.release ? (submit.release = true) : (submit.release = false);
          submit.recommend
            ? (submit.recommend = true)
            : (submit.recommend = false);
          if (this.goodsId) {
            API_GOODS.editGoods(this.goodsId, submit).then((res) => {
              if (res.success) {
                this.submitLoading = false;
                this.$router.go(-1);
              } else {
                this.submitLoading = false;
      try {
        this.submitLoading = true;
        this.$refs["baseInfoForm"].validate((valid) => {
          if (valid) {
            if (this.baseInfoForm.salesModel === "WHOLESALE") {
              for (let i = 0; i < this.wholesaleData.length; i++) {
                this.checkWholesaleNum(i);
                this.checkWholesalePrice(i);
                this.wholesaleData[i].goodsId = this.goodsId;
              }
              this.baseInfoForm.wholesaleList = this.wholesaleData;
            }
            this.baseInfoForm.goodsId = this.goodsId;
            let submit = JSON.parse(JSON.stringify(this.baseInfoForm));
            console.log('----------------->提交',submit);
            if (
              submit.goodsGalleryFiles &&
                submit.goodsGalleryFiles.length <= 0
            ) {
              this.submitLoading = false;
              this.$Message.error("请上传商品图片");
              return;
            }
            // if (!submit.goodsVideo){
            //   this.submitLoading = false;
            //   this.$Message.error("请上传商品视频");
            //   return;
            // }
            if (submit.templateId === "") submit.templateId = 0;
            let flag = false;
            let paramValue = "";
            if (flag) {
              this.$Message.error(paramValue + " 参数值不能为空");
              this.submitLoading = false;
              return;
            }
            if (this.goodsUnitList && !this.goodsUnitList.find(i => i === this.baseInfoForm.goodsUnit)) {
              submit.goodsUnit = ""
              this.$Message.error("商品单位不存在");
              this.submitLoading = false;
              return;
            }
            let skuInfoNames = this.skuInfo.map((n) => n.name);
            submit.skuList = [];
            let containEmptyImage = false;
            this.skuTableData.map((sku) => {
              let skuCopy = {
                cost: 1,
                price: sku.price,
                quantity: sku.quantity,
                // alertQuantity: sku.alertQuantity,
                sn: sku.sn,
                images: [],
              };
              if (this.openImage) {
                this.skuInfo[0].spec_values.forEach(item => {
                  if (!item.images || item.images.length === 0) {
                    containEmptyImage = true;
                    return;
                  }
                  if (item.value === sku[this.skuInfo[0].name]) {
                    skuCopy.images = item.images
                  }
                })
              }
              if (sku.weight) {
                skuCopy.weight = sku.weight;
              }
              if (this.baseInfoForm.weight) {
                skuCopy.weight = this.baseInfoForm.weight;
              }
              if (sku.id) {
                skuCopy.id = sku.id;
              }
              for (let skuInfoName of skuInfoNames) {
                skuCopy[skuInfoName] = sku[skuInfoName];
              }
              submit.skuList.push(skuCopy);
            });
            if (containEmptyImage) {
              this.$Message.error("开启规格图片,所有规格图片不能为空!");
              this.submitLoading = false;
              return;
            }
            if (submit.goodsGalleryFiles.length > 0) {
              submit.goodsGalleryList = submit.goodsGalleryFiles.map(
                (i) => i
              );
            }
            /** 参数校验 **/
            /* Object.keys(submit.goodsParamsList).forEach((item) => {
            });*/
            submit.release ? (submit.release = true) : (submit.release = false);
            submit.recommend
              ? (submit.recommend = true)
              : (submit.recommend = false);
            if (this.goodsId) {
              API_GOODS.editGoods(this.goodsId, submit).then((res) => {
                if (res.success) {
                  this.submitLoading = false;
                  this.$router.go(-1);
                } else {
                  this.submitLoading = false;
                }
              });
            } else {
              API_GOODS.createGoods(submit).then((res) => {
                if (res.success) {
                  this.submitLoading = false;
                  this.$parent.activestep = 2;
                  window.scrollTo(0, 0);
                } else {
                  this.submitLoading = false;
                }
              });
            }
          } else {
            API_GOODS.createGoods(submit).then((res) => {
              if (res.success) {
                this.submitLoading = false;
                this.$parent.activestep = 2;
                window.scrollTo(0, 0);
              } else {
                this.submitLoading = false;
              }
            });
          }
        } else {
          this.submitLoading = false;
            this.submitLoading = false;
          this.$Message.error("还有必填项未做处理,请检查表单");
        }
      });
            this.$Message.error("还有必填项未做处理,请检查表单");
          }
        });
      } finally {
        this.submitLoading = false;
      }
    },
    /** 保存为模板 */
    saveToDraft() {
@@ -1961,8 +2176,110 @@
        } else if (type === 'localRefresh') {
          this.$Message.error("刷新失败,请重试");
        }
      }).catch(reason => {
        console.log("获取模板失败",reason)
      });
    }
    },
    removeVideo(){
      this.baseInfoForm.showGoodsVideo = null;
      this.baseInfoForm.goodsVideo = null;
    },
    // todo 文件上传
    async upLoadImg(file) {
      console.log(file,this.count++);
      if (this.listImages.length >= 5) {
        this.$Message.error("图片上传不能超过5个");
        return;
      }
      try {
        // this.upLoadVideoLoading = true;
        // 获取文件上传临时密钥
        const sts = await getSts();
        const cos = new COS({
          getAuthorization: async function (options, callback) {
            callback({
              TmpSecretId: sts.data.tmpSecretId,
              TmpSecretKey: sts.data.tmpSecretKey,
              SecurityToken: sts.data.sessionToken,
              // 建议返回服务器时间作为签名的开始时间,避免客户端本地时间偏差过大导致签名错误
              StartTime: sts.data.stsStartTime, // 时间戳,单位秒,如:1580000000
              ExpiredTime: sts.data.stsEndTime,// 时间戳,单位秒,如:1580000000
              ScopeLimit: true, // 细粒度控制权限需要设为 true,会限制密钥只在相同请求时重复使用
            });
          }
        })
        const fileKey = getFileKey(file.name)
        const upData = await cos.uploadFile({
          Bucket: sts.data.bucket,
          Region: sts.data.region,
          Key: fileKey,
          Body: file, // 要上传的文件对象。
          SliceSize: 1024 * 1024 * 5,
          onProgress: function (progressData) {
            console.log('上传进度:', progressData);
          },
        });
        console.log("上传成功", upData)
        this.$nextTick(() => {
          this.listImages.push(fileKey);
          this.showListImages.push(sts.data.endpoint + "/" + fileKey);
          this.baseInfoForm.goodsGalleryFiles.push(fileKey);
        })
      } catch (e) {
        console.log("上传失败", upData)
        return false;
      } finally {
        // this.upLoadVideoLoading = false;
      }
      return false;
    },
    async upLoadVideo(file) {
      try {
        // this.upLoadVideoLoading = true;
        // 获取文件上传临时密钥
        const sts = await getSts();
        const cos = new COS({
          getAuthorization: async function (options, callback) {
            callback({
              TmpSecretId: sts.data.tmpSecretId,
              TmpSecretKey: sts.data.tmpSecretKey,
              SecurityToken: sts.data.sessionToken,
              // 建议返回服务器时间作为签名的开始时间,避免客户端本地时间偏差过大导致签名错误
              StartTime: sts.data.stsStartTime, // 时间戳,单位秒,如:1580000000
              ExpiredTime: sts.data.stsEndTime,// 时间戳,单位秒,如:1580000000
              ScopeLimit: true, // 细粒度控制权限需要设为 true,会限制密钥只在相同请求时重复使用
            });
          }
        })
        const fileKey = getFileKey(file.name)
        const upData = await cos.uploadFile({
          Bucket: sts.data.bucket,
          Region: sts.data.region,
          Key: fileKey,
          Body: file, // 要上传的文件对象。
          SliceSize: 1024 * 1024 * 5,
          onProgress: function (progressData) {
            console.log('上传进度:', progressData);
          },
        });
        console.log("上传成功", upData)
        this.$nextTick(() => {
          this.baseInfoForm.goodsVideo = fileKey;
          this.baseInfoForm.showGoodsVideo = sts.data.endpoint + "/" + fileKey;
          this.baseInfoForm.goodsVideo = fileKey;
        })
      } catch (e) {
        console.log("上传失败", upData)
        return false;
      } finally {
        // this.upLoadVideoLoading = false;
      }
      return false;
    },
  },
  mounted() {
    this.accessToken = {
@@ -1988,12 +2305,17 @@
        this.baseInfoForm.goodsType = this.firstData.goodsType;
        /** 获取该商城分类下 商品参数信息 */
        this.GET_GoodsParams();
        /** 查询品牌列表 */
        this.getGoodsBrandList();
        /** 查询分类绑定的规格信息 */
        this.Get_SkuInfoByCategory(this.categoryId);
        if (this.categoryId!=null && this.categoryId!=='') {
          /** 获取该商城分类下 商品参数信息 */
          this.GET_GoodsParams();
          console.log('分类id------------------>',this.categoryId);
          /** 查询分类绑定的规格信息 */
          this.Get_SkuInfoByCategory(this.categoryId);
          /** 查询品牌列表 */
          this.getGoodsBrandList();
        }
        // 获取商品单位
        this.GET_GoodsUnit();
        // 获取当前店铺分类
@@ -2044,4 +2366,45 @@
.refresh-icon {
  margin-left: 10px;
}
.demo-upload-list {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  border: 1px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  position: relative;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
  margin-right: 4px;
}
.demo-upload-list img {
  width: 100%;
  height: 100%;
}
.demo-upload-list-cover {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, .6);
}
.demo-upload-list:hover .demo-upload-list-cover {
  display: block;
}
.demo-upload-list-cover i {
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  margin: 0 2px;
}
</style>