From 709e88bc29ce6565a9927edb12ef9fe9ca214d8c Mon Sep 17 00:00:00 2001
From: zhangyouji <zhangyouji@sdxkhlw.cn>
Date: Wed, 17 Apr 2024 15:38:24 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BC=96=E8=BE=91=E5=95=86=E5=93=81-=E5=95=86?=
 =?UTF-8?q?=E5=93=81=E6=8E=A8=E8=8D=90=E5=9B=9E=E6=98=BE=E3=80=81=E5=95=86?=
 =?UTF-8?q?=E5=93=81=E7=9B=B8=E5=86=8C=E5=90=8C=E5=90=8D=E5=88=A0=E9=99=A4?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../productAdd/components/CustomUpload.vue    |   14 +-
 src/views/product/productAdd/newIndex.vue     | 3263 +++++++++--------
 2 files changed, 1639 insertions(+), 1638 deletions(-)

diff --git a/src/views/product/productAdd/components/CustomUpload.vue b/src/views/product/productAdd/components/CustomUpload.vue
index 05a9c1c..fdd142c 100644
--- a/src/views/product/productAdd/components/CustomUpload.vue
+++ b/src/views/product/productAdd/components/CustomUpload.vue
@@ -5,7 +5,7 @@
             list-type="picture-card">
             <i slot="default" class="el-icon-plus"></i>
             <div slot="file" slot-scope="{file}">
-                <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">  
+                <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
                 <span class="el-upload-list__item-actions">
                     <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
                         <i class="el-icon-zoom-in"></i>
@@ -16,9 +16,9 @@
                     <slot :file="file" name="imgButton">
 
                     </slot>
-                  
+
                 </span>
-            </div>   
+            </div>
         </el-upload>
         <!-- <div style="width: 100%;display: flex;justify-content: center;">
             <slot name="footer">
@@ -31,7 +31,7 @@
     </div>
 </template>
 
-<script> 
+<script>
 export default {
     props: {
         limit: {
@@ -57,7 +57,7 @@ export default {
             this.fileList.push(Object.assign(file, { url }));
         },
         handleRemove(file) {
-            this.fileList = this.fileList.filter(item => item.name !== file.name)
+            this.fileList = this.fileList.filter(item => item !== file)
         },
         handlePictureCardPreview(file) {
             this.dialogImageUrl = file.url;
@@ -68,7 +68,7 @@ export default {
         }
     }
 }
-</script> 
+</script>
 <style scoped lang="scss"> ::v-deep .hiedd .el-upload--picture-card {
      display: none !important;
      /* 上传按钮隐藏 */
@@ -79,4 +79,4 @@ export default {
      display: flex;
      justify-content: center;
  }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/product/productAdd/newIndex.vue b/src/views/product/productAdd/newIndex.vue
index d4a2890..37002b2 100644
--- a/src/views/product/productAdd/newIndex.vue
+++ b/src/views/product/productAdd/newIndex.vue
@@ -1,1631 +1,1632 @@
-<template>
-  <div class="divBox">
-    <el-card class="box-card">
-      <div slot="header" class="clearfix">
-        <el-steps :active="currentTab" align-center finish-status="success">
-          <el-step title="商品信息" />
-          <el-step title="商品详情" />
-          <!-- <el-step title="其他设置" /> -->
-          <!--<el-step title="规格设置" />-->
-        </el-steps>
-      </div>
-      <el-form
-        ref="formValidate"
-        v-loading="loading"
-        class="formValidate mt20"
-        :rules="ruleValidate"
-        :model="formValidate"
-        label-width="120px"
-        @submit.native.prevent
-      >
-        <el-row v-show="currentTab === 0" :gutter="24">
-          <!-- 商品信息-->
-          <el-col v-bind="grid2">
-            <el-form-item label="商品分类：" prop="categorys" :rules="[{ required: true, message: '请选择商品分类', trigger: ['change'] }]">
-              <el-cascader
-                @change="cascaderChange"
-                v-model="formValidate.categorys"
-                :options="merCateList"
-                :props="props2"
-                clearable
-                class="selWidth"
-                :show-all-levels="false"
-                :disabled="isDisabled"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品名称：" prop="productName" :rules="[{ required: true, message: '请输入商品名称', trigger: ['change'] }]">
-              <el-input v-model="formValidate.productName" maxlength="249" placeholder="请输入商品名称" :disabled="isDisabled" />
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品关键字：" prop="keyword">
-              <el-input v-model="formValidate.keyword" placeholder="请输入商品关键字" :disabled="isDisabled" />
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品品牌：" prop="brandId" :rules="[{ required: true, message: '请选择商品品牌', trigger: ['change'] }]">
-              <el-select style="width: 100%;" v-model="formValidate.brandId" placeholder="请选择">
-                <el-option v-for="item in brandOptions" :key="item.id" :label="item.brandName" :value="item.id"> </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品货号" prop="productNum">
-              <el-input v-model="formValidate.productNum" maxlength="249" placeholder="请输入商品货号" :disabled="isDisabled" />
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品售价" prop="price" :rules="[{ required: true, message: '请输入商品售价', trigger: ['change'] }]">
-              <el-input v-model="formValidate.price" maxlength="249" type="number" placeholder="请输入商品售价" :disabled="isDisabled" />
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品类型：" prop="productType" :rules="[{ required: true, message: '请选择商品类型', trigger: ['change'] }]">
-              <el-select style="width: 100%;" v-model="formValidate.productType" placeholder="请选择商品类型">
-                <el-option label="店铺商品" value="2"> </el-option>
-                <el-option label="平台商品" value="1"> </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <!-- <el-col v-bind="grid2">
-            <el-form-item label="商品简介：" prop="storeInfo">
-              <el-input v-model="formValidate.storeInfo" type="textarea" maxlength="250" :rows="3" placeholder="请输入商品简介"
-                :disabled="isDisabled" />
-            </el-form-item>
-          </el-col> -->
-          <el-col v-bind="grid2">
-            <el-form-item label="自提油站" prop="siteIds" :rules="[{ validator: validateSiteIds, trigger: ['change'] }]">
-              <el-tag
-                style="margin-left: 10px;"
-                :key="tagIndex"
-                v-for="(tag, tagIndex) in OilStationSelectionList"
-                closable
-                :disable-transitions="false"
-                @close="delectOilStationSelectionList(tag, tagIndex)"
-              >
-                {{ tag.siteName }}
-              </el-tag>
-              <el-button class="button-new-tag" size="small" @click="isOilStationSelection = true">+ 添加油站</el-button>
-            </el-form-item>
-          </el-col>
-          <el-col v-bind="grid2">
-            <el-form-item label="商品推荐：">
-              <el-select style="width: 100%;" v-model="formValidate.recommendOrNewMark" placeholder="请选择商品类型">
-                <el-option label="新品" value="1"> </el-option>
-                <el-option label="推荐" value="2"> </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="商品上架" prop="productStatus">
-              <el-switch active-value="1" inactive-value="2" v-model="formValidate.productStatus" active-color="#13ce66" inactive-color="#ff4949">
-              </el-switch>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="商品封面图：" prop="image">
-              <CustomUpload ref="CustomUpload"></CustomUpload>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="商品相册：" prop="sliderImages">
-              <CustomUpload :limit="5" ref="CustomLBUpload"> </CustomUpload>
-            </el-form-item>
-          </el-col>
-          <!-- <el-col :span="24">
-            <el-form-item label="商品规格：" props="specType">
-              <el-radio-group v-model="formValidate.specType" @change="onChangeSpec(formValidate.specType)"
-                :disabled="isDisabled">
-                <el-radio :label="false" class="radio">单规格</el-radio>
-                <el-radio :label="true">多规格</el-radio>
-              </el-radio-group>
-            </el-form-item>
-          </el-col> -->
-          <!-- 多规格添加-->
-          <el-col v-if="!isDisabled" :span="24" class="noForm">
-            <el-form-item label="选择规格：" prop="attributesTypeId" :rules="[{ required: true, message: '请选择规格', trigger: ['blur'] }]">
-              <div class="acea-row">
-                <el-select v-model="formValidate.attributesTypeId">
-                  <el-option v-for="item in ruleList" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-                <el-button type="primary" class="mr20" @click="confirm">确认</el-button>
-                <!-- <el-button class="mr15" @click="addRule">添加规格</el-button> -->
-              </div>
-            </el-form-item>
-            <el-form-item>
-              <div v-for="(item, index) in formValidate.attr" :key="index">
-                <div class="acea-row row-middle">
-                  <span class="mr5">{{ item.attributeName }}</span
-                  ><i class="el-icon-circle-close" @click="handleRemoveAttr(index)" />
-                </div>
-                <div class="rulesBox">
-                  <el-tag
-                    v-for="(j, indexn) in item.sku.value"
-                    :key="indexn"
-                    closable
-                    size="medium"
-                    :disable-transitions="false"
-                    class="mb5 mr10"
-                    @close="handleClose(item.sku.value, indexn, index)"
-                  >
-                    {{ j }}
-                  </el-tag>
-                </div>
-              </div>
-            </el-form-item>
-          </el-col>
-          <!-- 批量设置-->
-          <el-col v-if="formValidate.attr.length > 0 && !isDisabled" :span="24" class="noForm">
-            <el-form-item label="批量设置：">
-              <el-table :data="oneFormBatch" border class="tabNumWidth" size="mini">
-                <el-table-column v-for="(item, iii) in attrValue" :key="iii" :label="item.label" align="center" min-width="120">
-                  <template slot-scope="scope">
-                    <el-input
-                      :disabled="isDisabled"
-                      maxlength="9"
-                      min="0.01"
-                      v-model="scope.row[item.value]"
-                      class="priceBox"
-                      @blur="keyupEvent(iii, scope.row[item.value], scope.$index, 3)"
-                    />
-                  </template>
-                </el-table-column>
-                <el-table-column align="center" label="操作" min-width="80">
-                  <template>
-                    <el-button type="text" class="submission" @click="batchAdd">批量添加</el-button>
-                  </template>
-                </el-table-column>
-              </el-table>
-            </el-form-item>
-          </el-col>
-          <el-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
-            <!-- 单规格表格-->
-            <!-- <el-form-item v-if="formValidate.specType === false">
-              <el-table :data="OneattrValue" border class="tabNumWidth" size="mini">
-                <el-table-column v-for="(item, iii) in attrValue" :key="iii" :label="item.label" align="center"
-                  min-width="120">
-                  <template slot-scope="scope">
-                    <el-input :disabled="isDisabled" maxlength="9" min="0.01" v-model="scope.row[item.value]"
-                      class="priceBox" @blur="keyupEvent(iii, scope.row[item.value], scope.$index, 3)" />
-                  </template>
-                </el-table-column>
-              </el-table>
-            </el-form-item> -->
-            <!-- <el-form-item label="全部sku：" v-if="$route.params.id && showAll">
-              <el-button type="default" @click="showAllSku()" :disabled="isDisabled">展示</el-button>
-            </el-form-item> -->
-            <!-- 多规格表格-->
-            <el-form-item
-              v-if="formValidate.attr.length > 0"
-              label="商品属性："
-              class="labeltop"
-              :class="isDisabled ? 'disLabel' : 'disLabelmoren'"
-              prop="attr"
-              :rules="[{ validator: validateAttr, trigger: ['change'] }]"
-            >
-              <!-- :rules="[{ validator: validateAttr, trigger: ['blur'] }]" -->
-              <el-table :data="ManyAttrValue" border class="tabNumWidth" size="mini">
-                <template v-if="manyTabDate">
-                  <el-table-column v-for="item in manyTabDate" :key="item" align="center" :label="item" min-width="80">
-                    <template slot-scope="scope">
-                      <span class="priceBox" v-text="scope.row[item]" />
-                    </template>
-                  </el-table-column>
-                </template>
-                <el-table-column v-for="(item, iii) in attrValue" :key="iii" :label="item.label" align="center" min-width="120">
-                  <template slot-scope="scope">
-                    <el-input
-                      :disabled="isDisabled"
-                      maxlength="9"
-                      min="0.01"
-                      required
-                      v-model="scope.row[item.value]"
-                      class="priceBox"
-                      @blur="keyupEvent(iii, scope.row[item.value], scope.$index, 3)"
-                    />
-                  </template>
-                </el-table-column>
-                <el-table-column label="操作" fixed="right">
-                  <template slot-scope="scope">
-                    <el-button type="text" @click="delAttrTable(scope.$index)">删除</el-button>
-                  </template>
-                </el-table-column>
-              </el-table>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <!-- 商品详情-->
-        <el-row v-show="currentTab === 1 && !isDisabled">
-          <el-col :span="24">
-            <el-form-item label="商品详情：">
-              <Tinymce v-model="formValidate.productDetail"></Tinymce>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row v-show="currentTab === 1 && isDisabled">
-          <el-col :span="24">
-            <el-form-item label="商品详情：">
-              <span v-html="formValidate.productDetail || '无'"></span>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <!-- 其他设置-->
-        <el-row v-show="currentTab === 2">
-          <el-col :span="24">
-            <el-col v-bind="grid">
-              <el-form-item label="排序：">
-                <el-input-number v-model="formValidate.sort" :min="0" placeholder="请输入排序" :disabled="isDisabled" />
-              </el-form-item>
-            </el-col>
-            <el-col v-bind="grid">
-              <el-form-item label="积分：">
-                <el-input-number v-model="formValidate.giveIntegral" :min="0" placeholder="请输入排序" :disabled="isDisabled" />
-              </el-form-item>
-            </el-col>
-            <el-col v-bind="grid">
-              <el-form-item label="虚拟销量：">
-                <el-input-number v-model="formValidate.ficti" :min="0" placeholder="请输入排序" :disabled="isDisabled" />
-              </el-form-item>
-            </el-col>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="商品推荐：">
-              <el-checkbox-group v-model="checkboxGroup" size="small" @change="onChangeGroup" :disabled="isDisabled">
-                <el-checkbox v-for="(item, index) in recommend" :key="index" :label="item.value">{{ item.name }}</el-checkbox>
-              </el-checkbox-group>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="活动优先级：">
-              <div class="color-list acea-row row-middle">
-                <div
-                  :disabled="isDisabled"
-                  class="color-item"
-                  :class="activity[item]"
-                  v-for="item in formValidate.activity"
-                  :key="item"
-                  draggable="true"
-                  @dragstart="handleDragStart($event, item)"
-                  @dragover.prevent="handleDragOver($event, item)"
-                  @dragenter="handleDragEnterFont($event, item)"
-                  @dragend="handleDragEnd($event, item)"
-                >
-                  {{ item }}
-                </div>
-                <div class="tip">可拖动按钮调整活动的优先展示顺序</div>
-              </div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="优惠券：" class="proCoupon">
-              <div class="acea-row">
-                <el-tag
-                  v-for="(tag, index) in formValidate.coupons"
-                  :key="index"
-                  class="mr10 mb10"
-                  :closable="!isDisabled"
-                  :disable-transitions="false"
-                  @close="handleCloseCoupon(tag)"
-                >
-                  {{ tag.name }}
-                </el-tag>
-                <!-- <span v-if="formValidate.couponIds == null">无</span> -->
-                <el-button v-if="!isDisabled" class="mr15" @click="addCoupon">选择优惠券</el-button>
-              </div>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-form-item>
-          <el-button v-show="currentTab > 0" class="submission priamry_border" @click="handleSubmitUp">上一步</el-button>
-          <el-button v-show="currentTab < 1" type="primary" class="submission" @click="handleSubmitNest('formValidate')">下一步</el-button>
-          <el-button
-            v-show="(currentTab === 1 || $route.params.id) && !isDisabled"
-            type="primary"
-            class="submission"
-            @click="handleSubmit('formValidate')"
-            >提交</el-button
-          >
-        </el-form-item>
-      </el-form>
-    </el-card>
-    <CreatTemplates ref="addTemplates" @getList="getShippingList" />
-    <el-dialog width="80%" title="选择油站" :visible.sync="isOilStationSelection">
-      <OilStationSelection
-        :product-id="this.$route.query.id"
-        ref="selectSites"
-        :OilStationSelectionList="OilStationSelectionList"
-        @submit="oilStationSelectionSubmit"
-      >
-      </OilStationSelection>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-import productApi from '@/api/product/productAttr.js'
-import Tinymce from '@/components/Tinymce/index'
-import CreatTemplates from '@/views/systemSetting/logistics/shippingTemplates/creatTemplates'
-import Templates from '../../appSetting/wxAccount/wxTemplate/index'
-import { Debounce } from '@/utils/validate'
-import CustomUpload from './components/CustomUpload.vue'
-import OilStationSelection from './components/OilStationSelection.vue'
-import { loadingFn } from '@/utils/validate'
-
-const defaultObj = {
-  image: '',
-  sliderImages: [],
-  videoLink: '',
-  sliderImage: '',
-  storeName: '',
-  storeInfo: '',
-  keyword: '',
-  cateIds: [], // 商品分类id
-  cateId: null, // 商品分类id传值
-  unitName: '',
-  sort: 0,
-  giveIntegral: 0,
-  ficti: 0,
-  isShow: false,
-  isBenefit: false,
-  isNew: false,
-  isGood: false,
-  isHot: false,
-  isBest: false,
-  tempId: '',
-  attrValue: [
-    {
-      image: '',
-      price: 0,
-      cost: 0,
-      otPrice: 0,
-      stock: 0,
-      barCode: '',
-      weight: 0,
-      volume: 0
-    }
-  ],
-  attr: [],
-  selectRule: '',
-  isSub: false,
-  content: '',
-  specType: false,
-  id: 0,
-  couponIds: [],
-  coupons: [],
-  activity: ['默认', '秒杀', '砍价', '拼团']
-}
-const objTitle = {
-  price: {
-    title: '市场价格'
-  },
-  cost: {
-    title: '销售价格'
-  },
-  otPrice: {
-    title: '商品库存'
-  },
-  stock: {
-    title: 'SKU编号'
-  },
-  barCode: {
-    title: '兑换积分'
-  }
-}
-export default {
-  name: 'ProductProductAdd',
-  components: { Templates, CreatTemplates, Tinymce, CustomUpload, OilStationSelection },
-  data() {
-    const validateSiteIds = (rule, value, callback) => {
-      let siteIds = this.OilStationSelectionList.map(item => item.siteId)
-      if (siteIds.length == 0) {
-        callback('请选择油站')
-      }
-      callback()
-    }
-    const validateAttr = (rule, value, callback) => {
-      // SKU编号，即"skuNum"，不需要手填，提交后会自动生成，因此此处略过校验
-      let length = this.attrValue.length - 1
-      let isCan = this.ManyAttrValue.every(item => {
-        // 此处返回已填的值 通过长度来判断是否都填了
-        let _length = this.attrValue.filter(_item => {
-          let key = _item.value
-          if (key != 'skuNum' && item[key]) return _item
-        }).length
-        return length != _length
-      })
-      if (isCan) callback('商品属性不可存在空')
-      callback()
-    }
-    return {
-      validateSiteIds,
-      validateAttr,
-      loading: false,
-      OilStationSelectionList: [],
-      isOilStationSelection: false,
-      brandOptions: [],
-      isDisabled: this.$route.params.isDisabled === '1' ? true : false,
-      activity: { 默认: 'red', 秒杀: 'blue', 砍价: 'green', 拼团: 'yellow' },
-      props2: {
-        children: 'children',
-        label: 'categoryName',
-        value: 'id'
-      },
-      checkboxGroup: [],
-      recommend: [],
-      tabs: [],
-      fullscreenLoading: false,
-      props: { multiple: true },
-      active: 0,
-      OneattrValue: [Object.assign({}, defaultObj.attrValue[0])], // 单规格
-      ManyAttrValue: [Object.assign({}, defaultObj.attrValue[0])], // 多规格
-      ruleList: [],
-      merCateList: [], // 商户分类筛选
-      shippingList: [], // 运费模板
-      formThead: Object.assign({}, objTitle),
-      formValidate: {
-        recommendOrNewMark: '',
-        productStatus: '1',
-        attr: [],
-        productDetail: ''
-      },
-      formDynamics: {
-        ruleName: '',
-        ruleValue: []
-      },
-      tempData: {
-        page: 1,
-        limit: 9999
-      },
-      manyTabTit: {},
-      manyTabDate: {},
-      grid2: {
-        xl: 12,
-        lg: 12,
-        md: 12,
-        sm: 24,
-        xs: 24
-      },
-      // 规格数据
-      formDynamic: {
-        attrsName: '',
-        attrsVal: ''
-      },
-      isBtn: false,
-      manyFormValidate: [],
-      currentTab: 0,
-      isChoice: '',
-      grid: {
-        xl: 8,
-        lg: 8,
-        md: 12,
-        sm: 24,
-        xs: 24
-      },
-      ruleValidate: {
-        // storeName: [
-        //   { required: true, message: '请输入商品名称', trigger: 'blur' }
-        // ],
-        // cateIds: [
-        //   { required: true, message: '请选择商品分类', trigger: 'change', type: 'array', min: '1' }
-        // ],
-        // keyword: [
-        //   { required: true, message: '请输入商品关键字', trigger: 'blur' }
-        // ],
-        // unitName: [
-        //   { required: true, message: '请输入单位', trigger: 'blur' }
-        // ],
-        // storeInfo: [
-        //   { required: true, message: '请输入商品简介', trigger: 'blur' }
-        // ],
-        // tempId: [
-        //   { required: true, message: '请选择运费模板', trigger: 'change' }
-        // ],
-        // image: [
-        //   { required: true, message: '请上传商品图', trigger: 'change' }
-        // ],
-        // sliderImages: [
-        //   { required: true, message: '请上传商品轮播图', type: 'array', trigger: 'change' }
-        // ],
-        // specType: [
-        //   { required: true, message: '请选择商品规格', trigger: 'change' }
-        // ]
-      },
-      attrInfo: {},
-      tableFrom: {
-        page: 1,
-        limit: 9999,
-        keywords: ''
-      },
-      tempRoute: {},
-      keyNum: 0,
-      isAttr: false,
-      showAll: false,
-      videoLink: '',
-      attrValue: [
-        {
-          label: '市场价格',
-          name: '市场价格',
-          value: 'marketPrice'
-        },
-        {
-          label: '销售价格',
-          name: '销售价格',
-          value: 'sellPrice'
-        },
-        {
-          label: '商品库存',
-          name: '商品库存',
-          value: 'stock'
-        },
-        {
-          label: 'SKU编号',
-          name: 'SKU编号',
-          value: 'skuNum'
-        },
-        {
-          label: '兑换积分',
-          name: '兑换积分',
-          value: 'integral'
-        }
-      ]
-    }
-  },
-  computed: {
-    oneFormBatch() {
-      const obj = [Object.assign({}, defaultObj.attrValue[0])]
-      delete obj[0].barCode
-      return obj
-    }
-  },
-  watch: {
-    $route(to, from) {
-      if (from.path == '/productList' && to.params.id) {
-        this.chenkId()
-      }
-      // console.log(from.path) //从哪来
-      // console.log(to.path, to.params) //到哪去
-    },
-    // 'formValidate.content': function(n) {},
-    // ManyAttrValue(n) {},
-    'formValidate.attr': {
-      handler: function(val, o) {
-        if (this.isAttr) this.watCh(val, o) //重要！！！
-      },
-      immediate: false,
-      deep: true
-    }
-  },
-  async created() {
-    await this.chenkId()
-    await this.getCategorySelect()
-    await this.productGetRule()
-    await this.brandGetAll()
-  },
-  mounted() {},
-  deactivated() {
-    this.$destroy()
-  },
-  methods: {
-    async chenkId() {
-      if (this.$route.query && this.$route.query.id) {
-        await this.getproductInfo(this.$route.query.id)
-      }
-    },
-    productAddGetSites(ids) {
-      Promise.all(
-        ids.map(id => {
-          return productApi.productAddGetSites(id)
-        })
-      ).then(res => {
-        // console.log(res, 'productAddGetSites')
-      })
-    },
-    async inverseAnalysis(data) {
-      let { categoryOneId, categoryTwoId } = data
-      let categorys = [categoryOneId, categoryTwoId]
-      this.OilStationSelectionList = data.siteInfos
-      this.formValidate = {
-        ...this.formValidate,
-        categorys,
-        ...data
-      }
-      // Object.assign(this.formValidate, {
-      //   categorys,
-      //   ...data
-      // })
-      this.$refs.CustomUpload.fileList = [...this.formValidate.images.filter(item => item.mainMark == '1')]
-      this.$refs.CustomLBUpload.fileList = [...this.formValidate.images.filter(item => item.mainMark != '1')]
-      await this.confirm()
-      this.$nextTick(() => {
-        this.formValidate.attr = this.formValidate.attr
-          .map(item => {
-            let align = this.formValidate.checkedList.find(i => item.id == i.attributeId)
-            if (align) {
-              return {
-                ...item,
-                sku: {
-                  ...item.sku,
-                  value: align.checked.split(',')
-                }
-              }
-            } else {
-              return null
-            }
-          })
-          .filter(item => item)
-        setTimeout(() => {
-          this.ManyAttrValue.forEach((item, index) => {
-            let data = this.formValidate.stockList.find(i => i.attributeJson == JSON.stringify(item.data))
-            if (data) {
-              Object.assign(item, data, { delect: false })
-            } else {
-              Object.assign(item, data, { delect: true })
-            }
-          })
-          this.ManyAttrValue = this.ManyAttrValue.filter(item => !item.delect)
-        }, 1000)
-      })
-    },
-    async getproductInfo(id) {
-      await productApi.productAddGetEdit(id).then(async res => {
-        if (res.code == 20000) {
-          await this.inverseAnalysis(res.data)
-        }
-      })
-    },
-    setPreferred(setPreferred) {
-      // console.log(setPreferred, 'setPreferred')
-    },
-    delectOilStationSelectionList(e, index) {
-      this.OilStationSelectionList.splice(index, 1)
-      if (this.$refs.selectSites && this.$refs.selectSites.checkedSites) {
-        this.$refs.selectSites.checkedSites = this.$refs.selectSites.checkedSites.filter(site => e.siteId !== site.siteId)
-      }
-    },
-    oilStationSelectionSubmit(e) {
-      this.OilStationSelectionList = e
-      this.isOilStationSelection = false
-      this.formValidate.siteIds = e.map(item => item.siteId)
-    },
-    async brandGetAll() {
-      await productApi.brandGetAll().then(res => {
-        if (res.code == 20000) {
-          this.brandOptions = res.data
-        }
-      })
-    },
-    cascaderChange(e) {
-      // console.log(e, 'cascaderChange')
-    },
-    // 校验输入框不能输入0，保留2位小数，库存为正整数
-    keyupEvent(key, val, index, num) {
-      if (key === 'barCode') return
-      var re = /^\D*([0-9]\d*\.?\d{0,2})?.*$/
-      switch (num) {
-        case 1:
-          if (val == 0) {
-            this.oneFormBatch[index][key] = key === 'stock' ? 0 : 0.01
-          } else {
-            this.oneFormBatch[index][key] =
-              key === 'stock' ? parseInt(val) : this.$set(this.oneFormBatch[index], key, val.toString().replace(re, '$1'))
-          }
-          break
-        case 2:
-          if (val == 0) {
-            this.OneattrValue[index][key] = key === 'stock' ? 0 : 0.01
-          } else {
-            this.OneattrValue[index][key] =
-              key === 'stock' ? parseInt(val) : this.$set(this.OneattrValue[index], key, val.toString().replace(re, '$1'))
-          }
-          break
-        default:
-          if (val == 0) {
-            this.ManyAttrValue[index][key] = key === 'stock' ? 0 : 0.01
-          } else {
-            this.ManyAttrValue[index][key] =
-              key === 'stock' ? parseInt(val) : this.$set(this.ManyAttrValue[index], key, val.toString().replace(re, '$1'))
-          }
-          break
-      }
-    },
-    handleCloseCoupon(tag) {
-      this.isAttr = true
-      this.formValidate.coupons.splice(this.formValidate.coupons.indexOf(tag), 1)
-      this.formValidate.couponIds.splice(this.formValidate.couponIds.indexOf(tag.id), 1)
-    },
-    addCoupon() {
-      const _this = this
-      this.$modalCoupon(
-        'wu',
-        (this.keyNum += 1),
-        this.formValidate.coupons,
-        function(row) {
-          _this.formValidate.couponIds = []
-          _this.formValidate.coupons = row
-          row.map(item => {
-            _this.formValidate.couponIds.push(item.id)
-          })
-        },
-        ''
-      )
-    },
-    setTagsViewTitle() {
-      const title = this.isDisabled ? '商品详情' : '编辑商品'
-      const route = Object.assign({}, this.tempRoute, { title: `${title}-${this.$route.query.id}` })
-      this.$store.dispatch('tagsView/updateVisitedView', route)
-    },
-    onChangeGroup() {
-      this.checkboxGroup.includes('isGood') ? (this.formValidate.isGood = true) : (this.formValidate.isGood = false)
-      this.checkboxGroup.includes('isBenefit') ? (this.formValidate.isBenefit = true) : (this.formValidate.isBenefit = false)
-      this.checkboxGroup.includes('isBest') ? (this.formValidate.isBest = true) : (this.formValidate.isBest = false)
-      this.checkboxGroup.includes('isNew') ? (this.formValidate.isNew = true) : (this.formValidate.isNew = false)
-      this.checkboxGroup.includes('isHot') ? (this.formValidate.isHot = true) : (this.formValidate.isHot = false)
-    },
-    // sku算法
-    watCh(val, o) {
-      let arr = []
-      this.manyTabDate = []
-      for (let i = 0; i < val.length; i++) {
-        arr.push(val[i].sku)
-        this.manyTabDate.push(val[i].sku.name)
-      }
-      console.log('this.manyTabDate', this.manyTabDate)
-      // console.log('arr', arr)
-      this.ManyAttrValue = arr.reduce(
-        (prev, cur) => {
-          let res = []
-          prev.map(item => {
-            cur.value.map(_item => {
-              res.push({
-                ...item,
-                [cur.name]: _item,
-                data: Object.assign({}, item.data || {}, { [cur.name]: _item }),
-                ...Object.fromEntries(
-                  this.attrValue.map(item => {
-                    return [item.value, '']
-                  })
-                )
-              })
-            })
-          })
-          return res
-        },
-        [{}]
-      )
-      console.log(this.ManyAttrValue, 'this.ManyAttrValue ')
-    },
-    attrFormat(arr) {
-      let data = []
-      const res = []
-      return format(arr)
-      function format(arr) {
-        if (arr.length > 1) {
-          arr.forEach((v, i) => {
-            if (i === 0) data = arr[i]['attrValue']
-            const tmp = []
-            if (!data) return
-            data.forEach(function(vv) {
-              arr[i + 1] &&
-                arr[i + 1]['attrValue'] &&
-                arr[i + 1]['attrValue'].forEach(g => {
-                  const rep2 = (i !== 0 ? '' : arr[i]['attrName'] + '_') + vv + '$&' + arr[i + 1]['attrName'] + '_' + g
-                  tmp.push(rep2)
-                  if (i === arr.length - 2) {
-                    const rep4 = {
-                      image: '',
-                      price: 0,
-                      cost: 0,
-                      otPrice: 0,
-                      stock: 0,
-                      barCode: '',
-                      weight: 0,
-                      volume: 0,
-                      brokerage: 0,
-                      brokerage_two: 0
-                    }
-                    rep2.split('$&').forEach((h, k) => {
-                      const rep3 = h.split('_')
-                      if (!rep4['attrValue']) rep4['attrValue'] = {}
-                      rep4['attrValue'][rep3[0]] = rep3.length > 1 ? rep3[1] : ''
-                    })
-                    for (let attrValueKey in rep4.attrValue) {
-                      rep4[attrValueKey] = rep4.attrValue[attrValueKey]
-                    }
-                    res.push(rep4)
-                  }
-                })
-            })
-            data = tmp.length ? tmp : []
-          })
-        } else {
-          const dataArr = []
-          arr.forEach((v, k) => {
-            v['attrValue'].forEach((vv, kk) => {
-              dataArr[kk] = v['attrName'] + '_' + vv
-              res[kk] = {
-                image: '',
-                price: 0,
-                cost: 0,
-                otPrice: 0,
-                stock: 0,
-                barCode: '',
-                weight: 0,
-                volume: 0,
-                brokerage: 0,
-                brokerage_two: 0,
-                attrValue: { [v['attrName']]: vv }
-              }
-              // Object.values(res[kk].attrValue).forEach((v, i) => {
-              //   res[kk]['value' + i] = v
-              // })
-              for (let attrValueKey in res[kk].attrValue) {
-                res[kk][attrValueKey] = res[kk].attrValue[attrValueKey]
-              }
-            })
-          })
-          data.push(dataArr.join('$&'))
-        }
-        return res
-      }
-    },
-    // 运费模板
-    addTem() {
-      this.$refs.addTemplates.dialogVisible = true
-      this.$refs.addTemplates.getCityList()
-    },
-    // 添加规则；
-    addRule() {
-      const _this = this
-      this.$modalAttr(this.formDynamics, function() {
-        _this.productGetRule()
-      })
-    },
-    // 选择规格
-    onChangeSpec(num) {
-      this.isAttr = true
-      if (num) this.productGetRule()
-    },
-    // 选择属性确认
-    async confirm(is = true) {
-      this.isAttr = true
-      if (is) {
-        if (!this.formValidate.attributesTypeId) {
-          return this.$message.warning('请选择属性')
-        }
-        await this.productGetRule()
-        this.formValidate.attr = JSON.parse(JSON.stringify(this.ruleList.find(item => item.id == this.formValidate.attributesTypeId).attributesList))
-        // console.log('this.formValidate.attr ', this.formValidate.attr)
-      }
-      // console.log('this.attrValue', this.attrValue)
-    },
-    // 商品分类；
-    async getCategorySelect() {
-      await productApi.getClassificationTree().then(res => {
-        if (res.code == 20000) {
-          this.merCateList = res.data
-        }
-      })
-    },
-    filerMerCateList(treeData) {
-      return treeData.map(item => {
-        if (!item.child) {
-          item.disabled = true
-        }
-        item.label = item.name
-        return item
-      })
-    },
-    // 获取商品属性模板；
-    productGetRule() {
-      return new Promise((re, rj) => {
-        productApi.getAllAttributesType().then(res => {
-          if (res.code == 20000) {
-            this.ruleList = res.data.map(item => {
-              return {
-                ...item,
-                attributesList: item.attributesList.map(citem => {
-                  return {
-                    ...citem,
-                    sku: { name: citem.attributeName, value: citem.attributeContent.split(',') }
-                  }
-                })
-              }
-            })
-            re(this.ruleList)
-          }
-        })
-      })
-    },
-    // 运费模板；
-    getShippingList() {
-      shippingTemplatesList(this.tempData).then(res => {
-        this.shippingList = res.list
-      })
-    },
-    showInput(item) {
-      this.$set(item, 'inputVisible', true)
-    },
-    onChangetype(item) {
-      if (item === 1) {
-        this.OneattrValue.map(item => {
-          this.$set(item, 'brokerage', null)
-          this.$set(item, 'brokerageTwo', null)
-        })
-        this.ManyAttrValue.map(item => {
-          this.$set(item, 'brokerage', null)
-          this.$set(item, 'brokerageTwo', null)
-        })
-      } else {
-        this.OneattrValue.map(item => {
-          delete item.brokerage
-          delete item.brokerageTwo
-          this.$set(item, 'brokerage', null)
-          this.$set(item, 'brokerageTwo', null)
-        })
-        this.ManyAttrValue.map(item => {
-          delete item.brokerage
-          delete item.brokerageTwo
-        })
-      }
-    },
-    // 删除表格中的属性
-    delAttrTable(index) {
-      this.ManyAttrValue.splice(index, 1)
-    },
-    // 批量添加
-    batchAdd() {
-      // if (!this.oneFormBatch[0].pic || !this.oneFormBatch[0].price || !this.oneFormBatch[0].cost || !this.oneFormBatch[0].ot_price ||
-      //     !this.oneFormBatch[0].stock || !this.oneFormBatch[0].bar_code) return this.$Message.warning('请填写完整的批量设置内容！');
-      // console.log(this.ManyAttrValue, this.oneFormBatch, ' this.ManyAttrValue')
-      this.ManyAttrValue.forEach(item => {
-        Object.assign(item, this.oneFormBatch[0])
-      })
-    },
-    // 添加按钮
-    addBtn() {
-      this.clearAttr()
-      this.isBtn = true
-    },
-    // 取消
-    offAttrName() {
-      this.isBtn = false
-    },
-    clearAttr() {
-      this.isAttr = true
-      this.formDynamic.attrsName = ''
-      this.formDynamic.attrsVal = ''
-    },
-    // 删除规格
-    handleRemoveAttr(index) {
-      this.isAttr = true
-      this.formValidate.attr.splice(index, 1)
-      this.manyFormValidate.splice(index, 1)
-    },
-    // 删除属性
-    handleClose(item, index, parentIndex) {
-      if (item.length == 1) {
-        this.handleRemoveAttr(parentIndex)
-      } else {
-        item.splice(index, 1)
-      }
-    },
-    // 添加规则名称
-    createAttrName() {
-      this.isAttr = true
-      if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
-        const data = {
-          attrName: this.formDynamic.attrsName,
-          attrValue: [this.formDynamic.attrsVal]
-        }
-        this.formValidate.attr.push(data)
-        var hash = {}
-        this.formValidate.attr = this.formValidate.attr.reduce(function(item, next) {
-          /* eslint-disable */
-          hash[next.attrName] ? '' : (hash[next.attrName] = true && item.push(next))
-          return item
-        }, [])
-        this.clearAttr()
-        this.isBtn = false
-      } else {
-        this.$Message.warning('请添加完整的规格！')
-      }
-    },
-    // 添加属性
-    createAttr(num, idx) {
-      this.isAttr = true
-      if (num) {
-        this.formValidate.attr[idx].attrValue.push(num)
-        var hash = {}
-        this.formValidate.attr[idx].attrValue = this.formValidate.attr[idx].attrValue.reduce(function(item, next) {
-          /* eslint-disable */
-          hash[next] ? '' : (hash[next] = true && item.push(next))
-          return item
-        }, [])
-        this.formValidate.attr[idx].inputVisible = false
-      } else {
-        this.$message.warning('请添加属性')
-      }
-    },
-    //点击展示所有多规格属性
-    showAllSku() {
-      if (this.isAttr == false) {
-        this.isAttr = true
-        if (this.formValidate.specType && this.isAttr) this.watCh(this.formValidate.attr) //重要！！！
-      } else if (this.isAttr == true) {
-        this.isAttr = false
-        this.getInfo()
-      }
-    },
-    // 详情
-    getInfo() {
-      this.fullscreenLoading = true
-      productDetailApi(this.$route.query.id)
-        .then(async res => {
-          // this.isAttr = true;
-          let info = res
-          this.formValidate = {
-            image: this.$selfUtil.setDomain(info.image),
-            sliderImage: info.sliderImage,
-            sliderImages: JSON.parse(info.sliderImage),
-            storeName: info.storeName,
-            storeInfo: info.storeInfo,
-            keyword: info.keyword,
-            cateIds: info.cateId.split(','), // 商品分类id
-            cateId: info.cateId, // 商品分类id传值
-            unitName: info.unitName,
-            sort: info.sort,
-            isShow: info.isShow,
-            isBenefit: info.isBenefit,
-            isNew: info.isNew,
-            isGood: info.isGood,
-            isHot: info.isHot,
-            isBest: info.isBest,
-            tempId: info.tempId,
-            attr: info.attr,
-            attrValue: info.attrValue,
-            selectRule: info.selectRule,
-            isSub: info.isSub,
-            content: this.$selfUtil.replaceImgSrcHttps(info.content),
-            specType: info.specType,
-            id: info.id,
-            giveIntegral: info.giveIntegral,
-            ficti: info.ficti,
-            coupons: info.coupons,
-            couponIds: info.couponIds,
-            activity: info.activityStr ? info.activityStr.split(',') : ['默认', '秒杀', '砍价', '拼团']
-          }
-          marketingSendApi({ type: 3 }).then(res => {
-            if (this.formValidate.couponIds !== null) {
-              let ids = this.formValidate.couponIds.toString()
-              let arr = res.list
-              let obj = {}
-              for (let i in arr) {
-                obj[arr[i].id] = arr[i]
-              }
-              let strArr = ids.split(',')
-              let newArr = []
-              for (let item of strArr) {
-                if (obj[item]) {
-                  newArr.push(obj[item])
-                }
-              }
-              this.$set(this.formValidate, 'coupons', newArr) //在编辑回显时，让返回数据中的优惠券id，通过接口匹配显示,
-            }
-          })
-          let imgs = JSON.parse(info.sliderImage)
-          let imgss = []
-          Object.keys(imgs).map(i => {
-            imgss.push(this.$selfUtil.setDomain(imgs[i]))
-          })
-          this.formValidate.sliderImages = [...imgss]
-          if (info.isHot) this.checkboxGroup.push('isHot')
-          if (info.isGood) this.checkboxGroup.push('isGood')
-          if (info.isBenefit) this.checkboxGroup.push('isBenefit')
-          if (info.isBest) this.checkboxGroup.push('isBest')
-          if (info.isNew) this.checkboxGroup.push('isNew')
-          this.productGetRule()
-          if (info.specType) {
-            this.formValidate.attr = info.attr.map(item => {
-              return {
-                attrName: item.attrName,
-                attrValue: item.attrValues.split(',')
-              }
-            })
-            this.ManyAttrValue = info.attrValue
-            this.ManyAttrValue.forEach(val => {
-              val.image = this.$selfUtil.setDomain(val.image)
-              val.attrValue = JSON.parse(val.attrValue)
-              this.attrInfo[
-                Object.values(val.attrValue)
-                  .sort()
-                  .join('/')
-              ] = val
-            })
-            /***多规格商品如果被删除过sku，优先展示api返回的数据,否则会有没有删除的错觉***/
-            let manyAttr = this.attrFormat(this.formValidate.attr)
-            if (manyAttr.length !== this.ManyAttrValue.length) {
-              this.$set(this, 'showAll', true)
-              this.isAttr = false
-            } else {
-              this.isAttr = true
-            }
-            /*******/
-            const tmp = {}
-            const tmpTab = {}
-            this.formValidate.attr.forEach((o, i) => {
-              // tmp['value' + i] = { title: o.attrName }
-              // tmpTab['value' + i] = ''
-              tmp[o.attrName] = { title: o.attrName }
-              tmpTab[o.attrName] = ''
-            })
-
-            // 此处手动实现后台原本value0 value1的逻辑
-            this.formValidate.attrValue.forEach(item => {
-              for (let attrValueKey in item.attrValue) {
-                item[attrValueKey] = item.attrValue[attrValueKey]
-              }
-            })
-
-            this.manyTabTit = tmp
-            this.manyTabDate = tmpTab
-            this.formThead = Object.assign({}, this.formThead, tmp)
-          } else {
-            this.OneattrValue = info.attrValue
-            // this.formValidate.attr = [] //单规格商品规格设置为空
-          }
-          this.fullscreenLoading = false
-        })
-        .catch(res => {
-          this.fullscreenLoading = false
-          this.$message.error(res.message)
-        })
-    },
-    handleRemove(i) {
-      this.formValidate.sliderImages.splice(i, 1)
-    },
-    // 点击商品图
-    modalPicTap(tit, num, i, status) {
-      const _this = this
-      if (_this.isDisabled) return
-      this.$modalUpload(
-        function(img) {
-          if (tit === '1' && !num) {
-            _this.formValidate.image = img[0].sattDir
-            _this.OneattrValue[0].image = img[0].sattDir
-          }
-          if (tit === '2' && !num) {
-            if (img.length > 10) return this.$message.warning('最多选择10张图片！')
-            if (img.length + _this.formValidate.sliderImages.length > 10) return this.$message.warning('最多选择10张图片！')
-            img.map(item => {
-              _this.formValidate.sliderImages.push(item.sattDir)
-            })
-          }
-          if (tit === '1' && num === 'dan') {
-            _this.OneattrValue[0].image = img[0].sattDir
-          }
-          if (tit === '1' && num === 'duo') {
-            _this.ManyAttrValue[i].image = img[0].sattDir
-          }
-          if (tit === '1' && num === 'pi') {
-            _this.oneFormBatch[0].image = img[0].sattDir
-          }
-        },
-        tit,
-        'content'
-      )
-    },
-    handleSubmitUp() {
-      // this.currentTab --
-      if (this.currentTab-- < 0) this.currentTab = 0
-    },
-    handleSubmitNest(name) {
-      // console.log(this.formValidate, 'handleSubmitNest')
-      if (this.formValidate.attr < 1) {
-        this.$message.error('规格属性不能为空')
-        return
-      }
-      this.$refs[name].validate(valid => {
-        if (valid) {
-          if (this.currentTab++ > 2) this.currentTab = 0
-        } else {
-          // if (
-          //   !this.formValidate.store_name ||
-          //   !this.formValidate.cate_id ||
-          //   !this.formValidate.keyword ||
-          //   !this.formValidate.unit_name ||
-          //   !this.formValidate.store_info ||
-          //   !this.formValidate.image ||
-          //   !this.formValidate.slider_image
-          // ) {
-          //   this.$message.warning('请填写完整商品信息！')
-          // }
-        }
-      })
-    },
-    // 提交
-    handleSubmit: Debounce(function(name) {
-      let cover = this.$refs.CustomUpload.getFileList()
-      let Carousel = this.$refs.CustomLBUpload.getFileList()
-      cover.length && (cover[0]['mainMark'] = 1)
-      let [categoryOneId, categoryTwoId] = this.formValidate.categorys
-      let isRecommendOrNewMark = this.formValidate.recommendOrNewMark == '1' ? 'newMark' : 'recommend'
-      let siteIds = this.OilStationSelectionList.map(item => item.siteId)
-      // if (siteIds.length == 0) {
-      //   this.$message.error('请选择油站')
-      //   return
-      // }
-      let checkedList = this.formValidate.attr.map(item => {
-        let attributeId = item.id
-        let checked = item.sku.value.join(',')
-        return { attributeId, checked }
-      })
-      let images = cover.concat(Carousel).map((item, index) => {
-        let { name, url, mainMark = '' } = item
-        return {
-          name,
-          url,
-          mainMark
-        }
-      })
-      let stockList = this.ManyAttrValue.map(item => {
-        let { marketPrice = '', sellPrice = '', stock = '', integral = '', skuNum = '', id = '' } = item
-        return {
-          attributeJson: JSON.stringify(item.data),
-          marketPrice,
-          sellPrice,
-          stock,
-          integral,
-          skuNum,
-          id
-        }
-      })
-      this.formValidate[isRecommendOrNewMark] = '1'
-      loadingFn.call(
-        this,
-        'loading',
-        productApi[this.$route.query.id ? 'addUpdate' : 'addSave'](
-          Object.assign(this.formValidate, {
-            categoryOneId,
-            categoryTwoId,
-            siteIds,
-            checkedList,
-            images,
-            stockList
-          })
-        ).then(res => {
-          if (res.code == 20000) {
-            this.$message.success('操作成功')
-            setTimeout(() => {
-              this.$bus.$emit('productRefresh')
-              this.$router.push({ path: 'productList', query: { refresh: true } })
-              // this.$destroy()
-            }, 1000)
-          }
-        })
-      )
-
-      // this.onChangeGroup()
-      // if (this.formValidate.specType && this.formValidate.attr.length < 1) return this.$message.warning("请填写多规格属性！");
-      // this.formValidate.cateId = this.formValidate.cateIds.join(',')
-      // this.formValidate.sliderImage = JSON.stringify(this.formValidate.sliderImages)
-      // if (this.formValidate.specType) {
-      //   this.formValidate.attrValue = this.ManyAttrValue;
-      //   this.formValidate.attr = this.formValidate.attr.map((item) => {
-      //     return {
-      //       attrName: item.attrName,
-      //       id: item.id,
-      //       attrValues: item.attrValue.join(','),
-      //     }
-      //   })
-      //   for (var i = 0; i < this.formValidate.attrValue.length; i++) {
-      //     this.$set(this.formValidate.attrValue[i], 'id', 0);
-      //     this.$set(this.formValidate.attrValue[i], 'productId', 0);
-      //     this.$set(this.formValidate.attrValue[i], 'attrValue', JSON.stringify(this.formValidate.attrValue[i].attrValue)); //
-      //     delete this.formValidate.attrValue[i].value0
-      //   }
-      // } else {
-      //   this.formValidate.attr = [{ attrName: '规格', attrValues: '默认', id: this.$route.params.id ? this.formValidate.attr[0].id : 0 }]
-      //   this.OneattrValue.map(item => {
-      //     this.$set(item, 'attrValue', JSON.stringify({ '规格': '默认' }))
-      //   })
-      //   this.formValidate.attrValue = this.OneattrValue
-      // }
-      // this.$refs[name].validate((valid) => {
-      //   if (valid) {
-      //     this.fullscreenLoading = true
-      //     this.$route.params.id ? productUpdateApi(this.formValidate).then(async res => {
-      //       this.$message.success('编辑成功');
-      //       setTimeout(() => {
-      //         this.$router.push({ path: '/store/index' });
-      //       }, 500);
-      //       this.fullscreenLoading = false
-      //     }).catch(res => {
-      //       this.fullscreenLoading = false
-      //     }) : productCreateApi(this.formValidate).then(async res => {
-      //       this.$message.success('新增成功');
-      //       setTimeout(() => {
-      //         this.$router.push({ path: '/store/index' });
-      //       }, 500);
-      //       this.fullscreenLoading = false
-      //     }).catch(res => {
-      //       this.fullscreenLoading = false
-      //     })
-      //   } else {
-      //     if (!this.formValidate.storeName || !this.formValidate.cateId || !this.formValidate.keyword
-      //       || !this.formValidate.unitName || !this.formValidate.storeInfo || !this.formValidate.image || !this.formValidate.sliderImages) {
-      //       this.$message.warning("请填写完整商品信息！");
-      //     }
-      //   }
-      // });
-    }),
-    // 表单验证
-    validate(prop, status, error) {
-      if (status === false) {
-        this.$message.warning(error)
-      }
-    },
-    // 移动
-    handleDragStart(e, item) {
-      if (!this.isDisabled) this.dragging = item
-    },
-    handleDragEnd(e, item) {
-      if (!this.isDisabled) this.dragging = null
-    },
-    handleDragOver(e) {
-      if (!this.isDisabled) e.dataTransfer.dropEffect = 'move'
-    },
-    handleDragEnter(e, item) {
-      if (!this.isDisabled) {
-        e.dataTransfer.effectAllowed = 'move'
-        if (item === this.dragging) {
-          return
-        }
-        const newItems = [...this.formValidate.sliderImages]
-        const src = newItems.indexOf(this.dragging)
-        const dst = newItems.indexOf(item)
-        newItems.splice(dst, 0, ...newItems.splice(src, 1))
-        this.formValidate.sliderImages = newItems
-      }
-    },
-    handleDragEnterFont(e, item) {
-      if (!this.isDisabled) {
-        e.dataTransfer.effectAllowed = 'move'
-        if (item === this.dragging) {
-          return
-        }
-        const newItems = [...this.formValidate.activity]
-        const src = newItems.indexOf(this.dragging)
-        const dst = newItems.indexOf(item)
-        newItems.splice(dst, 0, ...newItems.splice(src, 1))
-        this.formValidate.activity = newItems
-      }
-    },
-    getGoodsType() {
-      /** 让商品推荐列表的name属性与页面设置tab的name匹配**/
-      goodDesignList({ gid: 70 }).then(response => {
-        let list = response.list
-        let arr = [],
-          arr1 = []
-        const listArr = [{ name: '是否热卖', value: 'isGood' }]
-        let typeLists = [
-          { name: '', value: 'isHot', type: '2' }, //热门榜单
-          { name: '', value: 'isBenefit', type: '4' }, //促销单品
-          { name: '', value: 'isBest', type: '1' }, //精品推荐
-          { name: '', value: 'isNew', type: '3' }
-        ] //首发新品
-        list.forEach(item => {
-          let obj = {}
-          obj.value = JSON.parse(item.value)
-          obj.id = item.id
-          obj.gid = item.gid
-          obj.status = item.status
-          arr.push(obj)
-        })
-        arr.forEach(item1 => {
-          let obj1 = {}
-          obj1.name = item1.value.fields[1].value
-          obj1.status = item1.status
-          obj1.type = item1.value.fields[3].value
-          arr1.push(obj1)
-        })
-        typeLists.forEach(item => {
-          arr1.forEach(item1 => {
-            if (item.type == item1.type) {
-              listArr.push({
-                name: item1.name,
-                value: item.value,
-                type: item.type
-              })
-            }
-          })
-        })
-        this.recommend = listArr
-      })
-    }
-  }
-}
-</script>
-<style scoped lang="scss">
-.disLabel {
-  ::v-deep.el-form-item__label {
-    margin-left: 36px !important;
-  }
-}
-
-.disLabelmoren {
-  ::v-deep.el-form-item__label {
-    margin-left: 120px !important;
-  }
-}
-
-.priamry_border {
-  border: 1px solid #1890ff;
-  color: #1890ff;
-}
-
-.color-item {
-  height: 30px;
-  line-height: 30px;
-  padding: 0 10px;
-  color: #fff;
-  margin-right: 10px;
-}
-
-.color-list .color-item.blue {
-  background-color: #1e9fff;
-}
-
-.color-list .color-item.yellow {
-  background-color: rgb(254, 185, 0);
-}
-
-.color-list .color-item.green {
-  background-color: #009688;
-}
-
-.color-list .color-item.red {
-  background-color: #ed4014;
-}
-
-.proCoupon {
-  ::v-deep.el-form-item__content {
-    margin-top: 5px;
-  }
-}
-
-.tabPic {
-  width: 40px !important;
-  height: 40px !important;
-
-  img {
-    width: 100%;
-    height: 100%;
-  }
-}
-
-.noLeft {
-  ::v-deep.el-form-item__content {
-    margin-left: 0 !important;
-  }
-}
-
-.tabNumWidth {
-  ::v-deep.el-input-number--medium {
-    width: 121px !important;
-  }
-
-  ::v-deep.el-input-number__increase {
-    width: 20px !important;
-    font-size: 12px !important;
-  }
-
-  ::v-deep.el-input-number__decrease {
-    width: 20px !important;
-    font-size: 12px !important;
-  }
-
-  ::v-deep.el-input-number--medium .el-input__inner {
-    padding-left: 25px !important;
-    padding-right: 25px !important;
-  }
-
-  ::v-deep thead {
-    line-height: normal !important;
-  }
-
-  ::v-deep .el-table .cell {
-    line-height: normal !important;
-  }
-}
-
-.selWidth {
-  width: 100%;
-}
-
-.selWidthd {
-  width: 300px;
-}
-
-.button-new-tag {
-  height: 28px;
-  line-height: 26px;
-  padding-top: 0;
-  padding-bottom: 0;
-}
-
-.input-new-tag {
-  width: 90px;
-  margin-left: 10px;
-  vertical-align: bottom;
-}
-
-.pictrue {
-  width: 60px;
-  height: 60px;
-  border: 1px dotted rgba(0, 0, 0, 0.1);
-  margin-right: 10px;
-  position: relative;
-  cursor: pointer;
-
-  img {
-    width: 100%;
-    height: 100%;
-  }
-
-  video {
-    width: 100%;
-    height: 100%;
-  }
-}
-
-.btndel {
-  position: absolute;
-  z-index: 1;
-  width: 20px !important;
-  height: 20px !important;
-  left: 46px;
-  top: -4px;
-}
-
-.labeltop {
-  ::v-deep.el-form-item__label {
-    float: none !important;
-    display: inline-block !important;
-    width: auto !important;
-  }
-}
-
-.iview-video-style {
-  width: 300px;
-  height: 180px;
-  border-radius: 10px;
-  background-color: #707070;
-  margin: 0 120px 20px;
-  position: relative;
-  overflow: hidden;
-}
-
-.iview-video-style .iconv {
-  color: #fff;
-  line-height: 180px;
-  width: 50px;
-  height: 50px;
-  display: inherit;
-  font-size: 26px;
-  position: absolute;
-  top: -74px;
-  left: 50%;
-  margin-left: -25px;
-}
-
-.iview-video-style .mark {
-  position: absolute;
-  width: 100%;
-  height: 30px;
-  top: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  text-align: center;
-}
-</style>
+<template>
+  <div class="divBox">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <el-steps :active="currentTab" align-center finish-status="success">
+          <el-step title="商品信息" />
+          <el-step title="商品详情" />
+          <!-- <el-step title="其他设置" /> -->
+          <!--<el-step title="规格设置" />-->
+        </el-steps>
+      </div>
+      <el-form
+        ref="formValidate"
+        v-loading="loading"
+        class="formValidate mt20"
+        :rules="ruleValidate"
+        :model="formValidate"
+        label-width="120px"
+        @submit.native.prevent
+      >
+        <el-row v-show="currentTab === 0" :gutter="24">
+          <!-- 商品信息-->
+          <el-col v-bind="grid2">
+            <el-form-item label="商品分类：" prop="categorys" :rules="[{ required: true, message: '请选择商品分类', trigger: ['change'] }]">
+              <el-cascader
+                @change="cascaderChange"
+                v-model="formValidate.categorys"
+                :options="merCateList"
+                :props="props2"
+                clearable
+                class="selWidth"
+                :show-all-levels="false"
+                :disabled="isDisabled"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品名称：" prop="productName" :rules="[{ required: true, message: '请输入商品名称', trigger: ['change'] }]">
+              <el-input v-model="formValidate.productName" maxlength="249" placeholder="请输入商品名称" :disabled="isDisabled" />
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品关键字：" prop="keyword">
+              <el-input v-model="formValidate.keyword" placeholder="请输入商品关键字" :disabled="isDisabled" />
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品品牌：" prop="brandId" :rules="[{ required: true, message: '请选择商品品牌', trigger: ['change'] }]">
+              <el-select style="width: 100%;" v-model="formValidate.brandId" placeholder="请选择">
+                <el-option v-for="item in brandOptions" :key="item.id" :label="item.brandName" :value="item.id"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品货号" prop="productNum">
+              <el-input v-model="formValidate.productNum" maxlength="249" placeholder="请输入商品货号" :disabled="isDisabled" />
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品售价" prop="price" :rules="[{ required: true, message: '请输入商品售价', trigger: ['change'] }]">
+              <el-input v-model="formValidate.price" maxlength="249" type="number" placeholder="请输入商品售价" :disabled="isDisabled" />
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品类型：" prop="productType" :rules="[{ required: true, message: '请选择商品类型', trigger: ['change'] }]">
+              <el-select style="width: 100%;" v-model="formValidate.productType" placeholder="请选择商品类型">
+                <el-option label="店铺商品" value="2"> </el-option>
+                <el-option label="平台商品" value="1"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <!-- <el-col v-bind="grid2">
+            <el-form-item label="商品简介：" prop="storeInfo">
+              <el-input v-model="formValidate.storeInfo" type="textarea" maxlength="250" :rows="3" placeholder="请输入商品简介"
+                :disabled="isDisabled" />
+            </el-form-item>
+          </el-col> -->
+          <el-col v-bind="grid2">
+            <el-form-item label="自提油站" prop="siteIds" :rules="[{ validator: validateSiteIds, trigger: ['change'] }]">
+              <el-tag
+                style="margin-left: 10px;"
+                :key="tagIndex"
+                v-for="(tag, tagIndex) in OilStationSelectionList"
+                closable
+                :disable-transitions="false"
+                @close="delectOilStationSelectionList(tag, tagIndex)"
+              >
+                {{ tag.siteName }}
+              </el-tag>
+              <el-button class="button-new-tag" size="small" @click="isOilStationSelection = true">+ 添加油站</el-button>
+            </el-form-item>
+          </el-col>
+          <el-col v-bind="grid2">
+            <el-form-item label="商品推荐：">
+              <el-select style="width: 100%;" v-model="formValidate.recommendOrNewMark" placeholder="请选择商品类型">
+                <el-option label="新品" value="1"> </el-option>
+                <el-option label="推荐" value="2"> </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品上架" prop="productStatus">
+              <el-switch active-value="1" inactive-value="2" v-model="formValidate.productStatus" active-color="#13ce66" inactive-color="#ff4949">
+              </el-switch>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品封面图：" prop="image">
+              <CustomUpload ref="CustomUpload"></CustomUpload>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品相册：" prop="sliderImages">
+              <CustomUpload :limit="5" ref="CustomLBUpload"> </CustomUpload>
+            </el-form-item>
+          </el-col>
+          <!-- <el-col :span="24">
+            <el-form-item label="商品规格：" props="specType">
+              <el-radio-group v-model="formValidate.specType" @change="onChangeSpec(formValidate.specType)"
+                :disabled="isDisabled">
+                <el-radio :label="false" class="radio">单规格</el-radio>
+                <el-radio :label="true">多规格</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col> -->
+          <!-- 多规格添加-->
+          <el-col v-if="!isDisabled" :span="24" class="noForm">
+            <el-form-item label="选择规格：" prop="attributesTypeId" :rules="[{ required: true, message: '请选择规格', trigger: ['blur'] }]">
+              <div class="acea-row">
+                <el-select v-model="formValidate.attributesTypeId">
+                  <el-option v-for="item in ruleList" :key="item.id" :label="item.name" :value="item.id" />
+                </el-select>
+                <el-button type="primary" class="mr20" @click="confirm">确认</el-button>
+                <!-- <el-button class="mr15" @click="addRule">添加规格</el-button> -->
+              </div>
+            </el-form-item>
+            <el-form-item>
+              <div v-for="(item, index) in formValidate.attr" :key="index">
+                <div class="acea-row row-middle">
+                  <span class="mr5">{{ item.attributeName }}</span
+                  ><i class="el-icon-circle-close" @click="handleRemoveAttr(index)" />
+                </div>
+                <div class="rulesBox">
+                  <el-tag
+                    v-for="(j, indexn) in item.sku.value"
+                    :key="indexn"
+                    closable
+                    size="medium"
+                    :disable-transitions="false"
+                    class="mb5 mr10"
+                    @close="handleClose(item.sku.value, indexn, index)"
+                  >
+                    {{ j }}
+                  </el-tag>
+                </div>
+              </div>
+            </el-form-item>
+          </el-col>
+          <!-- 批量设置-->
+          <el-col v-if="formValidate.attr.length > 0 && !isDisabled" :span="24" class="noForm">
+            <el-form-item label="批量设置：">
+              <el-table :data="oneFormBatch" border class="tabNumWidth" size="mini">
+                <el-table-column v-for="(item, iii) in attrValue" :key="iii" :label="item.label" align="center" min-width="120">
+                  <template slot-scope="scope">
+                    <el-input
+                      :disabled="isDisabled"
+                      maxlength="9"
+                      min="0.01"
+                      v-model="scope.row[item.value]"
+                      class="priceBox"
+                      @blur="keyupEvent(iii, scope.row[item.value], scope.$index, 3)"
+                    />
+                  </template>
+                </el-table-column>
+                <el-table-column align="center" label="操作" min-width="80">
+                  <template>
+                    <el-button type="text" class="submission" @click="batchAdd">批量添加</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-col>
+          <el-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
+            <!-- 单规格表格-->
+            <!-- <el-form-item v-if="formValidate.specType === false">
+              <el-table :data="OneattrValue" border class="tabNumWidth" size="mini">
+                <el-table-column v-for="(item, iii) in attrValue" :key="iii" :label="item.label" align="center"
+                  min-width="120">
+                  <template slot-scope="scope">
+                    <el-input :disabled="isDisabled" maxlength="9" min="0.01" v-model="scope.row[item.value]"
+                      class="priceBox" @blur="keyupEvent(iii, scope.row[item.value], scope.$index, 3)" />
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item> -->
+            <!-- <el-form-item label="全部sku：" v-if="$route.params.id && showAll">
+              <el-button type="default" @click="showAllSku()" :disabled="isDisabled">展示</el-button>
+            </el-form-item> -->
+            <!-- 多规格表格-->
+            <el-form-item
+              v-if="formValidate.attr.length > 0"
+              label="商品属性："
+              class="labeltop"
+              :class="isDisabled ? 'disLabel' : 'disLabelmoren'"
+              prop="attr"
+              :rules="[{ validator: validateAttr, trigger: ['change'] }]"
+            >
+              <!-- :rules="[{ validator: validateAttr, trigger: ['blur'] }]" -->
+              <el-table :data="ManyAttrValue" border class="tabNumWidth" size="mini">
+                <template v-if="manyTabDate">
+                  <el-table-column v-for="item in manyTabDate" :key="item" align="center" :label="item" min-width="80">
+                    <template slot-scope="scope">
+                      <span class="priceBox" v-text="scope.row[item]" />
+                    </template>
+                  </el-table-column>
+                </template>
+                <el-table-column v-for="(item, iii) in attrValue" :key="iii" :label="item.label" align="center" min-width="120">
+                  <template slot-scope="scope">
+                    <el-input
+                      :disabled="isDisabled"
+                      maxlength="9"
+                      min="0.01"
+                      required
+                      v-model="scope.row[item.value]"
+                      class="priceBox"
+                      @blur="keyupEvent(iii, scope.row[item.value], scope.$index, 3)"
+                    />
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" fixed="right">
+                  <template slot-scope="scope">
+                    <el-button type="text" @click="delAttrTable(scope.$index)">删除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <!-- 商品详情-->
+        <el-row v-show="currentTab === 1 && !isDisabled">
+          <el-col :span="24">
+            <el-form-item label="商品详情：">
+              <Tinymce v-model="formValidate.productDetail"></Tinymce>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row v-show="currentTab === 1 && isDisabled">
+          <el-col :span="24">
+            <el-form-item label="商品详情：">
+              <span v-html="formValidate.productDetail || '无'"></span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <!-- 其他设置-->
+        <el-row v-show="currentTab === 2">
+          <el-col :span="24">
+            <el-col v-bind="grid">
+              <el-form-item label="排序：">
+                <el-input-number v-model="formValidate.sort" :min="0" placeholder="请输入排序" :disabled="isDisabled" />
+              </el-form-item>
+            </el-col>
+            <el-col v-bind="grid">
+              <el-form-item label="积分：">
+                <el-input-number v-model="formValidate.giveIntegral" :min="0" placeholder="请输入排序" :disabled="isDisabled" />
+              </el-form-item>
+            </el-col>
+            <el-col v-bind="grid">
+              <el-form-item label="虚拟销量：">
+                <el-input-number v-model="formValidate.ficti" :min="0" placeholder="请输入排序" :disabled="isDisabled" />
+              </el-form-item>
+            </el-col>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="商品推荐：">
+              <el-checkbox-group v-model="checkboxGroup" size="small" @change="onChangeGroup" :disabled="isDisabled">
+                <el-checkbox v-for="(item, index) in recommend" :key="index" :label="item.value">{{ item.name }}</el-checkbox>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="活动优先级：">
+              <div class="color-list acea-row row-middle">
+                <div
+                  :disabled="isDisabled"
+                  class="color-item"
+                  :class="activity[item]"
+                  v-for="item in formValidate.activity"
+                  :key="item"
+                  draggable="true"
+                  @dragstart="handleDragStart($event, item)"
+                  @dragover.prevent="handleDragOver($event, item)"
+                  @dragenter="handleDragEnterFont($event, item)"
+                  @dragend="handleDragEnd($event, item)"
+                >
+                  {{ item }}
+                </div>
+                <div class="tip">可拖动按钮调整活动的优先展示顺序</div>
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="优惠券：" class="proCoupon">
+              <div class="acea-row">
+                <el-tag
+                  v-for="(tag, index) in formValidate.coupons"
+                  :key="index"
+                  class="mr10 mb10"
+                  :closable="!isDisabled"
+                  :disable-transitions="false"
+                  @close="handleCloseCoupon(tag)"
+                >
+                  {{ tag.name }}
+                </el-tag>
+                <!-- <span v-if="formValidate.couponIds == null">无</span> -->
+                <el-button v-if="!isDisabled" class="mr15" @click="addCoupon">选择优惠券</el-button>
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item>
+          <el-button v-show="currentTab > 0" class="submission priamry_border" @click="handleSubmitUp">上一步</el-button>
+          <el-button v-show="currentTab < 1" type="primary" class="submission" @click="handleSubmitNest('formValidate')">下一步</el-button>
+          <el-button
+            v-show="(currentTab === 1 || $route.params.id) && !isDisabled"
+            type="primary"
+            class="submission"
+            @click="handleSubmit('formValidate')"
+            >提交</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <CreatTemplates ref="addTemplates" @getList="getShippingList" />
+    <el-dialog width="80%" title="选择油站" :visible.sync="isOilStationSelection">
+      <OilStationSelection
+        :product-id="this.$route.query.id"
+        ref="selectSites"
+        :OilStationSelectionList="OilStationSelectionList"
+        @submit="oilStationSelectionSubmit"
+      >
+      </OilStationSelection>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import productApi from '@/api/product/productAttr.js'
+import Tinymce from '@/components/Tinymce/index'
+import CreatTemplates from '@/views/systemSetting/logistics/shippingTemplates/creatTemplates'
+import Templates from '../../appSetting/wxAccount/wxTemplate/index'
+import { Debounce } from '@/utils/validate'
+import CustomUpload from './components/CustomUpload.vue'
+import OilStationSelection from './components/OilStationSelection.vue'
+import { loadingFn } from '@/utils/validate'
+
+const defaultObj = {
+  image: '',
+  sliderImages: [],
+  videoLink: '',
+  sliderImage: '',
+  storeName: '',
+  storeInfo: '',
+  keyword: '',
+  cateIds: [], // 商品分类id
+  cateId: null, // 商品分类id传值
+  unitName: '',
+  sort: 0,
+  giveIntegral: 0,
+  ficti: 0,
+  isShow: false,
+  isBenefit: false,
+  isNew: false,
+  isGood: false,
+  isHot: false,
+  isBest: false,
+  tempId: '',
+  attrValue: [
+    {
+      image: '',
+      price: 0,
+      cost: 0,
+      otPrice: 0,
+      stock: 0,
+      barCode: '',
+      weight: 0,
+      volume: 0
+    }
+  ],
+  attr: [],
+  selectRule: '',
+  isSub: false,
+  content: '',
+  specType: false,
+  id: 0,
+  couponIds: [],
+  coupons: [],
+  activity: ['默认', '秒杀', '砍价', '拼团']
+}
+const objTitle = {
+  price: {
+    title: '市场价格'
+  },
+  cost: {
+    title: '销售价格'
+  },
+  otPrice: {
+    title: '商品库存'
+  },
+  stock: {
+    title: 'SKU编号'
+  },
+  barCode: {
+    title: '兑换积分'
+  }
+}
+export default {
+  name: 'ProductProductAdd',
+  components: { Templates, CreatTemplates, Tinymce, CustomUpload, OilStationSelection },
+  data() {
+    const validateSiteIds = (rule, value, callback) => {
+      let siteIds = this.OilStationSelectionList.map(item => item.siteId)
+      if (siteIds.length == 0) {
+        callback('请选择油站')
+      }
+      callback()
+    }
+    const validateAttr = (rule, value, callback) => {
+      // SKU编号，即"skuNum"，不需要手填，提交后会自动生成，因此此处略过校验
+      let length = this.attrValue.length - 1
+      let isCan = this.ManyAttrValue.every(item => {
+        // 此处返回已填的值 通过长度来判断是否都填了
+        let _length = this.attrValue.filter(_item => {
+          let key = _item.value
+          if (key != 'skuNum' && item[key]) return _item
+        }).length
+        return length != _length
+      })
+      if (isCan) callback('商品属性不可存在空')
+      callback()
+    }
+    return {
+      validateSiteIds,
+      validateAttr,
+      loading: false,
+      OilStationSelectionList: [],
+      isOilStationSelection: false,
+      brandOptions: [],
+      isDisabled: this.$route.params.isDisabled === '1' ? true : false,
+      activity: { 默认: 'red', 秒杀: 'blue', 砍价: 'green', 拼团: 'yellow' },
+      props2: {
+        children: 'children',
+        label: 'categoryName',
+        value: 'id'
+      },
+      checkboxGroup: [],
+      recommend: [],
+      tabs: [],
+      fullscreenLoading: false,
+      props: { multiple: true },
+      active: 0,
+      OneattrValue: [Object.assign({}, defaultObj.attrValue[0])], // 单规格
+      ManyAttrValue: [Object.assign({}, defaultObj.attrValue[0])], // 多规格
+      ruleList: [],
+      merCateList: [], // 商户分类筛选
+      shippingList: [], // 运费模板
+      formThead: Object.assign({}, objTitle),
+      formValidate: {
+        recommendOrNewMark: '',
+        productStatus: '1',
+        attr: [],
+        productDetail: ''
+      },
+      formDynamics: {
+        ruleName: '',
+        ruleValue: []
+      },
+      tempData: {
+        page: 1,
+        limit: 9999
+      },
+      manyTabTit: {},
+      manyTabDate: {},
+      grid2: {
+        xl: 12,
+        lg: 12,
+        md: 12,
+        sm: 24,
+        xs: 24
+      },
+      // 规格数据
+      formDynamic: {
+        attrsName: '',
+        attrsVal: ''
+      },
+      isBtn: false,
+      manyFormValidate: [],
+      currentTab: 0,
+      isChoice: '',
+      grid: {
+        xl: 8,
+        lg: 8,
+        md: 12,
+        sm: 24,
+        xs: 24
+      },
+      ruleValidate: {
+        // storeName: [
+        //   { required: true, message: '请输入商品名称', trigger: 'blur' }
+        // ],
+        // cateIds: [
+        //   { required: true, message: '请选择商品分类', trigger: 'change', type: 'array', min: '1' }
+        // ],
+        // keyword: [
+        //   { required: true, message: '请输入商品关键字', trigger: 'blur' }
+        // ],
+        // unitName: [
+        //   { required: true, message: '请输入单位', trigger: 'blur' }
+        // ],
+        // storeInfo: [
+        //   { required: true, message: '请输入商品简介', trigger: 'blur' }
+        // ],
+        // tempId: [
+        //   { required: true, message: '请选择运费模板', trigger: 'change' }
+        // ],
+        // image: [
+        //   { required: true, message: '请上传商品图', trigger: 'change' }
+        // ],
+        // sliderImages: [
+        //   { required: true, message: '请上传商品轮播图', type: 'array', trigger: 'change' }
+        // ],
+        // specType: [
+        //   { required: true, message: '请选择商品规格', trigger: 'change' }
+        // ]
+      },
+      attrInfo: {},
+      tableFrom: {
+        page: 1,
+        limit: 9999,
+        keywords: ''
+      },
+      tempRoute: {},
+      keyNum: 0,
+      isAttr: false,
+      showAll: false,
+      videoLink: '',
+      attrValue: [
+        {
+          label: '市场价格',
+          name: '市场价格',
+          value: 'marketPrice'
+        },
+        {
+          label: '销售价格',
+          name: '销售价格',
+          value: 'sellPrice'
+        },
+        {
+          label: '商品库存',
+          name: '商品库存',
+          value: 'stock'
+        },
+        {
+          label: 'SKU编号',
+          name: 'SKU编号',
+          value: 'skuNum'
+        },
+        {
+          label: '兑换积分',
+          name: '兑换积分',
+          value: 'integral'
+        }
+      ]
+    }
+  },
+  computed: {
+    oneFormBatch() {
+      const obj = [Object.assign({}, defaultObj.attrValue[0])]
+      delete obj[0].barCode
+      return obj
+    }
+  },
+  watch: {
+    $route(to, from) {
+      if (from.path == '/productList' && to.params.id) {
+        this.chenkId()
+      }
+      // console.log(from.path) //从哪来
+      // console.log(to.path, to.params) //到哪去
+    },
+    // 'formValidate.content': function(n) {},
+    // ManyAttrValue(n) {},
+    'formValidate.attr': {
+      handler: function(val, o) {
+        if (this.isAttr) this.watCh(val, o) //重要！！！
+      },
+      immediate: false,
+      deep: true
+    }
+  },
+  async created() {
+    await this.chenkId()
+    await this.getCategorySelect()
+    await this.productGetRule()
+    await this.brandGetAll()
+  },
+  mounted() {},
+  deactivated() {
+    this.$destroy()
+  },
+  methods: {
+    async chenkId() {
+      if (this.$route.query && this.$route.query.id) {
+        await this.getproductInfo(this.$route.query.id)
+      }
+    },
+    productAddGetSites(ids) {
+      Promise.all(
+        ids.map(id => {
+          return productApi.productAddGetSites(id)
+        })
+      ).then(res => {
+        // console.log(res, 'productAddGetSites')
+      })
+    },
+    async inverseAnalysis(data) {
+      let { categoryOneId, categoryTwoId } = data
+      let categorys = [categoryOneId, categoryTwoId]
+      this.OilStationSelectionList = data.siteInfos
+      this.formValidate = {
+        ...this.formValidate,
+        categorys,
+        ...data
+      }
+      // Object.assign(this.formValidate, {
+      //   categorys,
+      //   ...data
+      // })
+      this.$refs.CustomUpload.fileList = [...this.formValidate.images.filter(item => item.mainMark == '1')]
+      this.$refs.CustomLBUpload.fileList = [...this.formValidate.images.filter(item => item.mainMark != '1')]
+      this.formValidate.recommendOrNewMark = data.newMark == '1' ? '1' : '2'
+      await this.confirm()
+      this.$nextTick(() => {
+        this.formValidate.attr = this.formValidate.attr
+          .map(item => {
+            let align = this.formValidate.checkedList.find(i => item.id == i.attributeId)
+            if (align) {
+              return {
+                ...item,
+                sku: {
+                  ...item.sku,
+                  value: align.checked.split(',')
+                }
+              }
+            } else {
+              return null
+            }
+          })
+          .filter(item => item)
+        setTimeout(() => {
+          this.ManyAttrValue.forEach((item, index) => {
+            let data = this.formValidate.stockList.find(i => i.attributeJson == JSON.stringify(item.data))
+            if (data) {
+              Object.assign(item, data, { delect: false })
+            } else {
+              Object.assign(item, data, { delect: true })
+            }
+          })
+          this.ManyAttrValue = this.ManyAttrValue.filter(item => !item.delect)
+        }, 1000)
+      })
+    },
+    async getproductInfo(id) {
+      await productApi.productAddGetEdit(id).then(async res => {
+        if (res.code == 20000) {
+          await this.inverseAnalysis(res.data)
+        }
+      })
+    },
+    setPreferred(setPreferred) {
+      // console.log(setPreferred, 'setPreferred')
+    },
+    delectOilStationSelectionList(e, index) {
+      this.OilStationSelectionList.splice(index, 1)
+      if (this.$refs.selectSites && this.$refs.selectSites.checkedSites) {
+        this.$refs.selectSites.checkedSites = this.$refs.selectSites.checkedSites.filter(site => e.siteId !== site.siteId)
+      }
+    },
+    oilStationSelectionSubmit(e) {
+      this.OilStationSelectionList = e
+      this.isOilStationSelection = false
+      this.formValidate.siteIds = e.map(item => item.siteId)
+    },
+    async brandGetAll() {
+      await productApi.brandGetAll().then(res => {
+        if (res.code == 20000) {
+          this.brandOptions = res.data
+        }
+      })
+    },
+    cascaderChange(e) {
+      // console.log(e, 'cascaderChange')
+    },
+    // 校验输入框不能输入0，保留2位小数，库存为正整数
+    keyupEvent(key, val, index, num) {
+      if (key === 'barCode') return
+      var re = /^\D*([0-9]\d*\.?\d{0,2})?.*$/
+      switch (num) {
+        case 1:
+          if (val == 0) {
+            this.oneFormBatch[index][key] = key === 'stock' ? 0 : 0.01
+          } else {
+            this.oneFormBatch[index][key] =
+              key === 'stock' ? parseInt(val) : this.$set(this.oneFormBatch[index], key, val.toString().replace(re, '$1'))
+          }
+          break
+        case 2:
+          if (val == 0) {
+            this.OneattrValue[index][key] = key === 'stock' ? 0 : 0.01
+          } else {
+            this.OneattrValue[index][key] =
+              key === 'stock' ? parseInt(val) : this.$set(this.OneattrValue[index], key, val.toString().replace(re, '$1'))
+          }
+          break
+        default:
+          if (val == 0) {
+            this.ManyAttrValue[index][key] = key === 'stock' ? 0 : 0.01
+          } else {
+            this.ManyAttrValue[index][key] =
+              key === 'stock' ? parseInt(val) : this.$set(this.ManyAttrValue[index], key, val.toString().replace(re, '$1'))
+          }
+          break
+      }
+    },
+    handleCloseCoupon(tag) {
+      this.isAttr = true
+      this.formValidate.coupons.splice(this.formValidate.coupons.indexOf(tag), 1)
+      this.formValidate.couponIds.splice(this.formValidate.couponIds.indexOf(tag.id), 1)
+    },
+    addCoupon() {
+      const _this = this
+      this.$modalCoupon(
+        'wu',
+        (this.keyNum += 1),
+        this.formValidate.coupons,
+        function(row) {
+          _this.formValidate.couponIds = []
+          _this.formValidate.coupons = row
+          row.map(item => {
+            _this.formValidate.couponIds.push(item.id)
+          })
+        },
+        ''
+      )
+    },
+    setTagsViewTitle() {
+      const title = this.isDisabled ? '商品详情' : '编辑商品'
+      const route = Object.assign({}, this.tempRoute, { title: `${title}-${this.$route.query.id}` })
+      this.$store.dispatch('tagsView/updateVisitedView', route)
+    },
+    onChangeGroup() {
+      this.checkboxGroup.includes('isGood') ? (this.formValidate.isGood = true) : (this.formValidate.isGood = false)
+      this.checkboxGroup.includes('isBenefit') ? (this.formValidate.isBenefit = true) : (this.formValidate.isBenefit = false)
+      this.checkboxGroup.includes('isBest') ? (this.formValidate.isBest = true) : (this.formValidate.isBest = false)
+      this.checkboxGroup.includes('isNew') ? (this.formValidate.isNew = true) : (this.formValidate.isNew = false)
+      this.checkboxGroup.includes('isHot') ? (this.formValidate.isHot = true) : (this.formValidate.isHot = false)
+    },
+    // sku算法
+    watCh(val, o) {
+      let arr = []
+      this.manyTabDate = []
+      for (let i = 0; i < val.length; i++) {
+        arr.push(val[i].sku)
+        this.manyTabDate.push(val[i].sku.name)
+      }
+      console.log('this.manyTabDate', this.manyTabDate)
+      // console.log('arr', arr)
+      this.ManyAttrValue = arr.reduce(
+        (prev, cur) => {
+          let res = []
+          prev.map(item => {
+            cur.value.map(_item => {
+              res.push({
+                ...item,
+                [cur.name]: _item,
+                data: Object.assign({}, item.data || {}, { [cur.name]: _item }),
+                ...Object.fromEntries(
+                  this.attrValue.map(item => {
+                    return [item.value, '']
+                  })
+                )
+              })
+            })
+          })
+          return res
+        },
+        [{}]
+      )
+      console.log(this.ManyAttrValue, 'this.ManyAttrValue ')
+    },
+    attrFormat(arr) {
+      let data = []
+      const res = []
+      return format(arr)
+      function format(arr) {
+        if (arr.length > 1) {
+          arr.forEach((v, i) => {
+            if (i === 0) data = arr[i]['attrValue']
+            const tmp = []
+            if (!data) return
+            data.forEach(function(vv) {
+              arr[i + 1] &&
+                arr[i + 1]['attrValue'] &&
+                arr[i + 1]['attrValue'].forEach(g => {
+                  const rep2 = (i !== 0 ? '' : arr[i]['attrName'] + '_') + vv + '$&' + arr[i + 1]['attrName'] + '_' + g
+                  tmp.push(rep2)
+                  if (i === arr.length - 2) {
+                    const rep4 = {
+                      image: '',
+                      price: 0,
+                      cost: 0,
+                      otPrice: 0,
+                      stock: 0,
+                      barCode: '',
+                      weight: 0,
+                      volume: 0,
+                      brokerage: 0,
+                      brokerage_two: 0
+                    }
+                    rep2.split('$&').forEach((h, k) => {
+                      const rep3 = h.split('_')
+                      if (!rep4['attrValue']) rep4['attrValue'] = {}
+                      rep4['attrValue'][rep3[0]] = rep3.length > 1 ? rep3[1] : ''
+                    })
+                    for (let attrValueKey in rep4.attrValue) {
+                      rep4[attrValueKey] = rep4.attrValue[attrValueKey]
+                    }
+                    res.push(rep4)
+                  }
+                })
+            })
+            data = tmp.length ? tmp : []
+          })
+        } else {
+          const dataArr = []
+          arr.forEach((v, k) => {
+            v['attrValue'].forEach((vv, kk) => {
+              dataArr[kk] = v['attrName'] + '_' + vv
+              res[kk] = {
+                image: '',
+                price: 0,
+                cost: 0,
+                otPrice: 0,
+                stock: 0,
+                barCode: '',
+                weight: 0,
+                volume: 0,
+                brokerage: 0,
+                brokerage_two: 0,
+                attrValue: { [v['attrName']]: vv }
+              }
+              // Object.values(res[kk].attrValue).forEach((v, i) => {
+              //   res[kk]['value' + i] = v
+              // })
+              for (let attrValueKey in res[kk].attrValue) {
+                res[kk][attrValueKey] = res[kk].attrValue[attrValueKey]
+              }
+            })
+          })
+          data.push(dataArr.join('$&'))
+        }
+        return res
+      }
+    },
+    // 运费模板
+    addTem() {
+      this.$refs.addTemplates.dialogVisible = true
+      this.$refs.addTemplates.getCityList()
+    },
+    // 添加规则；
+    addRule() {
+      const _this = this
+      this.$modalAttr(this.formDynamics, function() {
+        _this.productGetRule()
+      })
+    },
+    // 选择规格
+    onChangeSpec(num) {
+      this.isAttr = true
+      if (num) this.productGetRule()
+    },
+    // 选择属性确认
+    async confirm(is = true) {
+      this.isAttr = true
+      if (is) {
+        if (!this.formValidate.attributesTypeId) {
+          return this.$message.warning('请选择属性')
+        }
+        await this.productGetRule()
+        this.formValidate.attr = JSON.parse(JSON.stringify(this.ruleList.find(item => item.id == this.formValidate.attributesTypeId).attributesList))
+        // console.log('this.formValidate.attr ', this.formValidate.attr)
+      }
+      // console.log('this.attrValue', this.attrValue)
+    },
+    // 商品分类；
+    async getCategorySelect() {
+      await productApi.getClassificationTree().then(res => {
+        if (res.code == 20000) {
+          this.merCateList = res.data
+        }
+      })
+    },
+    filerMerCateList(treeData) {
+      return treeData.map(item => {
+        if (!item.child) {
+          item.disabled = true
+        }
+        item.label = item.name
+        return item
+      })
+    },
+    // 获取商品属性模板；
+    productGetRule() {
+      return new Promise((re, rj) => {
+        productApi.getAllAttributesType().then(res => {
+          if (res.code == 20000) {
+            this.ruleList = res.data.map(item => {
+              return {
+                ...item,
+                attributesList: item.attributesList.map(citem => {
+                  return {
+                    ...citem,
+                    sku: { name: citem.attributeName, value: citem.attributeContent.split(',') }
+                  }
+                })
+              }
+            })
+            re(this.ruleList)
+          }
+        })
+      })
+    },
+    // 运费模板；
+    getShippingList() {
+      shippingTemplatesList(this.tempData).then(res => {
+        this.shippingList = res.list
+      })
+    },
+    showInput(item) {
+      this.$set(item, 'inputVisible', true)
+    },
+    onChangetype(item) {
+      if (item === 1) {
+        this.OneattrValue.map(item => {
+          this.$set(item, 'brokerage', null)
+          this.$set(item, 'brokerageTwo', null)
+        })
+        this.ManyAttrValue.map(item => {
+          this.$set(item, 'brokerage', null)
+          this.$set(item, 'brokerageTwo', null)
+        })
+      } else {
+        this.OneattrValue.map(item => {
+          delete item.brokerage
+          delete item.brokerageTwo
+          this.$set(item, 'brokerage', null)
+          this.$set(item, 'brokerageTwo', null)
+        })
+        this.ManyAttrValue.map(item => {
+          delete item.brokerage
+          delete item.brokerageTwo
+        })
+      }
+    },
+    // 删除表格中的属性
+    delAttrTable(index) {
+      this.ManyAttrValue.splice(index, 1)
+    },
+    // 批量添加
+    batchAdd() {
+      // if (!this.oneFormBatch[0].pic || !this.oneFormBatch[0].price || !this.oneFormBatch[0].cost || !this.oneFormBatch[0].ot_price ||
+      //     !this.oneFormBatch[0].stock || !this.oneFormBatch[0].bar_code) return this.$Message.warning('请填写完整的批量设置内容！');
+      // console.log(this.ManyAttrValue, this.oneFormBatch, ' this.ManyAttrValue')
+      this.ManyAttrValue.forEach(item => {
+        Object.assign(item, this.oneFormBatch[0])
+      })
+    },
+    // 添加按钮
+    addBtn() {
+      this.clearAttr()
+      this.isBtn = true
+    },
+    // 取消
+    offAttrName() {
+      this.isBtn = false
+    },
+    clearAttr() {
+      this.isAttr = true
+      this.formDynamic.attrsName = ''
+      this.formDynamic.attrsVal = ''
+    },
+    // 删除规格
+    handleRemoveAttr(index) {
+      this.isAttr = true
+      this.formValidate.attr.splice(index, 1)
+      this.manyFormValidate.splice(index, 1)
+    },
+    // 删除属性
+    handleClose(item, index, parentIndex) {
+      if (item.length == 1) {
+        this.handleRemoveAttr(parentIndex)
+      } else {
+        item.splice(index, 1)
+      }
+    },
+    // 添加规则名称
+    createAttrName() {
+      this.isAttr = true
+      if (this.formDynamic.attrsName && this.formDynamic.attrsVal) {
+        const data = {
+          attrName: this.formDynamic.attrsName,
+          attrValue: [this.formDynamic.attrsVal]
+        }
+        this.formValidate.attr.push(data)
+        var hash = {}
+        this.formValidate.attr = this.formValidate.attr.reduce(function(item, next) {
+          /* eslint-disable */
+          hash[next.attrName] ? '' : (hash[next.attrName] = true && item.push(next))
+          return item
+        }, [])
+        this.clearAttr()
+        this.isBtn = false
+      } else {
+        this.$Message.warning('请添加完整的规格！')
+      }
+    },
+    // 添加属性
+    createAttr(num, idx) {
+      this.isAttr = true
+      if (num) {
+        this.formValidate.attr[idx].attrValue.push(num)
+        var hash = {}
+        this.formValidate.attr[idx].attrValue = this.formValidate.attr[idx].attrValue.reduce(function(item, next) {
+          /* eslint-disable */
+          hash[next] ? '' : (hash[next] = true && item.push(next))
+          return item
+        }, [])
+        this.formValidate.attr[idx].inputVisible = false
+      } else {
+        this.$message.warning('请添加属性')
+      }
+    },
+    //点击展示所有多规格属性
+    showAllSku() {
+      if (this.isAttr == false) {
+        this.isAttr = true
+        if (this.formValidate.specType && this.isAttr) this.watCh(this.formValidate.attr) //重要！！！
+      } else if (this.isAttr == true) {
+        this.isAttr = false
+        this.getInfo()
+      }
+    },
+    // 详情
+    getInfo() {
+      this.fullscreenLoading = true
+      productDetailApi(this.$route.query.id)
+        .then(async res => {
+          // this.isAttr = true;
+          let info = res
+          this.formValidate = {
+            image: this.$selfUtil.setDomain(info.image),
+            sliderImage: info.sliderImage,
+            sliderImages: JSON.parse(info.sliderImage),
+            storeName: info.storeName,
+            storeInfo: info.storeInfo,
+            keyword: info.keyword,
+            cateIds: info.cateId.split(','), // 商品分类id
+            cateId: info.cateId, // 商品分类id传值
+            unitName: info.unitName,
+            sort: info.sort,
+            isShow: info.isShow,
+            isBenefit: info.isBenefit,
+            isNew: info.isNew,
+            isGood: info.isGood,
+            isHot: info.isHot,
+            isBest: info.isBest,
+            tempId: info.tempId,
+            attr: info.attr,
+            attrValue: info.attrValue,
+            selectRule: info.selectRule,
+            isSub: info.isSub,
+            content: this.$selfUtil.replaceImgSrcHttps(info.content),
+            specType: info.specType,
+            id: info.id,
+            giveIntegral: info.giveIntegral,
+            ficti: info.ficti,
+            coupons: info.coupons,
+            couponIds: info.couponIds,
+            activity: info.activityStr ? info.activityStr.split(',') : ['默认', '秒杀', '砍价', '拼团']
+          }
+          marketingSendApi({ type: 3 }).then(res => {
+            if (this.formValidate.couponIds !== null) {
+              let ids = this.formValidate.couponIds.toString()
+              let arr = res.list
+              let obj = {}
+              for (let i in arr) {
+                obj[arr[i].id] = arr[i]
+              }
+              let strArr = ids.split(',')
+              let newArr = []
+              for (let item of strArr) {
+                if (obj[item]) {
+                  newArr.push(obj[item])
+                }
+              }
+              this.$set(this.formValidate, 'coupons', newArr) //在编辑回显时，让返回数据中的优惠券id，通过接口匹配显示,
+            }
+          })
+          let imgs = JSON.parse(info.sliderImage)
+          let imgss = []
+          Object.keys(imgs).map(i => {
+            imgss.push(this.$selfUtil.setDomain(imgs[i]))
+          })
+          this.formValidate.sliderImages = [...imgss]
+          if (info.isHot) this.checkboxGroup.push('isHot')
+          if (info.isGood) this.checkboxGroup.push('isGood')
+          if (info.isBenefit) this.checkboxGroup.push('isBenefit')
+          if (info.isBest) this.checkboxGroup.push('isBest')
+          if (info.isNew) this.checkboxGroup.push('isNew')
+          this.productGetRule()
+          if (info.specType) {
+            this.formValidate.attr = info.attr.map(item => {
+              return {
+                attrName: item.attrName,
+                attrValue: item.attrValues.split(',')
+              }
+            })
+            this.ManyAttrValue = info.attrValue
+            this.ManyAttrValue.forEach(val => {
+              val.image = this.$selfUtil.setDomain(val.image)
+              val.attrValue = JSON.parse(val.attrValue)
+              this.attrInfo[
+                Object.values(val.attrValue)
+                  .sort()
+                  .join('/')
+              ] = val
+            })
+            /***多规格商品如果被删除过sku，优先展示api返回的数据,否则会有没有删除的错觉***/
+            let manyAttr = this.attrFormat(this.formValidate.attr)
+            if (manyAttr.length !== this.ManyAttrValue.length) {
+              this.$set(this, 'showAll', true)
+              this.isAttr = false
+            } else {
+              this.isAttr = true
+            }
+            /*******/
+            const tmp = {}
+            const tmpTab = {}
+            this.formValidate.attr.forEach((o, i) => {
+              // tmp['value' + i] = { title: o.attrName }
+              // tmpTab['value' + i] = ''
+              tmp[o.attrName] = { title: o.attrName }
+              tmpTab[o.attrName] = ''
+            })
+
+            // 此处手动实现后台原本value0 value1的逻辑
+            this.formValidate.attrValue.forEach(item => {
+              for (let attrValueKey in item.attrValue) {
+                item[attrValueKey] = item.attrValue[attrValueKey]
+              }
+            })
+
+            this.manyTabTit = tmp
+            this.manyTabDate = tmpTab
+            this.formThead = Object.assign({}, this.formThead, tmp)
+          } else {
+            this.OneattrValue = info.attrValue
+            // this.formValidate.attr = [] //单规格商品规格设置为空
+          }
+          this.fullscreenLoading = false
+        })
+        .catch(res => {
+          this.fullscreenLoading = false
+          this.$message.error(res.message)
+        })
+    },
+    handleRemove(i) {
+      this.formValidate.sliderImages.splice(i, 1)
+    },
+    // 点击商品图
+    modalPicTap(tit, num, i, status) {
+      const _this = this
+      if (_this.isDisabled) return
+      this.$modalUpload(
+        function(img) {
+          if (tit === '1' && !num) {
+            _this.formValidate.image = img[0].sattDir
+            _this.OneattrValue[0].image = img[0].sattDir
+          }
+          if (tit === '2' && !num) {
+            if (img.length > 10) return this.$message.warning('最多选择10张图片！')
+            if (img.length + _this.formValidate.sliderImages.length > 10) return this.$message.warning('最多选择10张图片！')
+            img.map(item => {
+              _this.formValidate.sliderImages.push(item.sattDir)
+            })
+          }
+          if (tit === '1' && num === 'dan') {
+            _this.OneattrValue[0].image = img[0].sattDir
+          }
+          if (tit === '1' && num === 'duo') {
+            _this.ManyAttrValue[i].image = img[0].sattDir
+          }
+          if (tit === '1' && num === 'pi') {
+            _this.oneFormBatch[0].image = img[0].sattDir
+          }
+        },
+        tit,
+        'content'
+      )
+    },
+    handleSubmitUp() {
+      // this.currentTab --
+      if (this.currentTab-- < 0) this.currentTab = 0
+    },
+    handleSubmitNest(name) {
+      // console.log(this.formValidate, 'handleSubmitNest')
+      if (this.formValidate.attr < 1) {
+        this.$message.error('规格属性不能为空')
+        return
+      }
+      this.$refs[name].validate(valid => {
+        if (valid) {
+          if (this.currentTab++ > 2) this.currentTab = 0
+        } else {
+          // if (
+          //   !this.formValidate.store_name ||
+          //   !this.formValidate.cate_id ||
+          //   !this.formValidate.keyword ||
+          //   !this.formValidate.unit_name ||
+          //   !this.formValidate.store_info ||
+          //   !this.formValidate.image ||
+          //   !this.formValidate.slider_image
+          // ) {
+          //   this.$message.warning('请填写完整商品信息！')
+          // }
+        }
+      })
+    },
+    // 提交
+    handleSubmit: Debounce(function(name) {
+      let cover = this.$refs.CustomUpload.getFileList()
+      let Carousel = this.$refs.CustomLBUpload.getFileList()
+      cover.length && (cover[0]['mainMark'] = 1)
+      let [categoryOneId, categoryTwoId] = this.formValidate.categorys
+      let isRecommendOrNewMark = this.formValidate.recommendOrNewMark == '1' ? 'newMark' : 'recommend'
+      let siteIds = this.OilStationSelectionList.map(item => item.siteId)
+      // if (siteIds.length == 0) {
+      //   this.$message.error('请选择油站')
+      //   return
+      // }
+      let checkedList = this.formValidate.attr.map(item => {
+        let attributeId = item.id
+        let checked = item.sku.value.join(',')
+        return { attributeId, checked }
+      })
+      let images = cover.concat(Carousel).map((item, index) => {
+        let { name, url, mainMark = '' } = item
+        return {
+          name,
+          url,
+          mainMark
+        }
+      })
+      let stockList = this.ManyAttrValue.map(item => {
+        let { marketPrice = '', sellPrice = '', stock = '', integral = '', skuNum = '', id = '' } = item
+        return {
+          attributeJson: JSON.stringify(item.data),
+          marketPrice,
+          sellPrice,
+          stock,
+          integral,
+          skuNum,
+          id
+        }
+      })
+      this.formValidate[isRecommendOrNewMark] = '1'
+      loadingFn.call(
+        this,
+        'loading',
+        productApi[this.$route.query.id ? 'addUpdate' : 'addSave'](
+          Object.assign(this.formValidate, {
+            categoryOneId,
+            categoryTwoId,
+            siteIds,
+            checkedList,
+            images,
+            stockList
+          })
+        ).then(res => {
+          if (res.code == 20000) {
+            this.$message.success('操作成功')
+            setTimeout(() => {
+              this.$bus.$emit('productRefresh')
+              this.$router.push({ path: 'productList', query: { refresh: true } })
+              // this.$destroy()
+            }, 1000)
+          }
+        })
+      )
+
+      // this.onChangeGroup()
+      // if (this.formValidate.specType && this.formValidate.attr.length < 1) return this.$message.warning("请填写多规格属性！");
+      // this.formValidate.cateId = this.formValidate.cateIds.join(',')
+      // this.formValidate.sliderImage = JSON.stringify(this.formValidate.sliderImages)
+      // if (this.formValidate.specType) {
+      //   this.formValidate.attrValue = this.ManyAttrValue;
+      //   this.formValidate.attr = this.formValidate.attr.map((item) => {
+      //     return {
+      //       attrName: item.attrName,
+      //       id: item.id,
+      //       attrValues: item.attrValue.join(','),
+      //     }
+      //   })
+      //   for (var i = 0; i < this.formValidate.attrValue.length; i++) {
+      //     this.$set(this.formValidate.attrValue[i], 'id', 0);
+      //     this.$set(this.formValidate.attrValue[i], 'productId', 0);
+      //     this.$set(this.formValidate.attrValue[i], 'attrValue', JSON.stringify(this.formValidate.attrValue[i].attrValue)); //
+      //     delete this.formValidate.attrValue[i].value0
+      //   }
+      // } else {
+      //   this.formValidate.attr = [{ attrName: '规格', attrValues: '默认', id: this.$route.params.id ? this.formValidate.attr[0].id : 0 }]
+      //   this.OneattrValue.map(item => {
+      //     this.$set(item, 'attrValue', JSON.stringify({ '规格': '默认' }))
+      //   })
+      //   this.formValidate.attrValue = this.OneattrValue
+      // }
+      // this.$refs[name].validate((valid) => {
+      //   if (valid) {
+      //     this.fullscreenLoading = true
+      //     this.$route.params.id ? productUpdateApi(this.formValidate).then(async res => {
+      //       this.$message.success('编辑成功');
+      //       setTimeout(() => {
+      //         this.$router.push({ path: '/store/index' });
+      //       }, 500);
+      //       this.fullscreenLoading = false
+      //     }).catch(res => {
+      //       this.fullscreenLoading = false
+      //     }) : productCreateApi(this.formValidate).then(async res => {
+      //       this.$message.success('新增成功');
+      //       setTimeout(() => {
+      //         this.$router.push({ path: '/store/index' });
+      //       }, 500);
+      //       this.fullscreenLoading = false
+      //     }).catch(res => {
+      //       this.fullscreenLoading = false
+      //     })
+      //   } else {
+      //     if (!this.formValidate.storeName || !this.formValidate.cateId || !this.formValidate.keyword
+      //       || !this.formValidate.unitName || !this.formValidate.storeInfo || !this.formValidate.image || !this.formValidate.sliderImages) {
+      //       this.$message.warning("请填写完整商品信息！");
+      //     }
+      //   }
+      // });
+    }),
+    // 表单验证
+    validate(prop, status, error) {
+      if (status === false) {
+        this.$message.warning(error)
+      }
+    },
+    // 移动
+    handleDragStart(e, item) {
+      if (!this.isDisabled) this.dragging = item
+    },
+    handleDragEnd(e, item) {
+      if (!this.isDisabled) this.dragging = null
+    },
+    handleDragOver(e) {
+      if (!this.isDisabled) e.dataTransfer.dropEffect = 'move'
+    },
+    handleDragEnter(e, item) {
+      if (!this.isDisabled) {
+        e.dataTransfer.effectAllowed = 'move'
+        if (item === this.dragging) {
+          return
+        }
+        const newItems = [...this.formValidate.sliderImages]
+        const src = newItems.indexOf(this.dragging)
+        const dst = newItems.indexOf(item)
+        newItems.splice(dst, 0, ...newItems.splice(src, 1))
+        this.formValidate.sliderImages = newItems
+      }
+    },
+    handleDragEnterFont(e, item) {
+      if (!this.isDisabled) {
+        e.dataTransfer.effectAllowed = 'move'
+        if (item === this.dragging) {
+          return
+        }
+        const newItems = [...this.formValidate.activity]
+        const src = newItems.indexOf(this.dragging)
+        const dst = newItems.indexOf(item)
+        newItems.splice(dst, 0, ...newItems.splice(src, 1))
+        this.formValidate.activity = newItems
+      }
+    },
+    getGoodsType() {
+      /** 让商品推荐列表的name属性与页面设置tab的name匹配**/
+      goodDesignList({ gid: 70 }).then(response => {
+        let list = response.list
+        let arr = [],
+          arr1 = []
+        const listArr = [{ name: '是否热卖', value: 'isGood' }]
+        let typeLists = [
+          { name: '', value: 'isHot', type: '2' }, //热门榜单
+          { name: '', value: 'isBenefit', type: '4' }, //促销单品
+          { name: '', value: 'isBest', type: '1' }, //精品推荐
+          { name: '', value: 'isNew', type: '3' }
+        ] //首发新品
+        list.forEach(item => {
+          let obj = {}
+          obj.value = JSON.parse(item.value)
+          obj.id = item.id
+          obj.gid = item.gid
+          obj.status = item.status
+          arr.push(obj)
+        })
+        arr.forEach(item1 => {
+          let obj1 = {}
+          obj1.name = item1.value.fields[1].value
+          obj1.status = item1.status
+          obj1.type = item1.value.fields[3].value
+          arr1.push(obj1)
+        })
+        typeLists.forEach(item => {
+          arr1.forEach(item1 => {
+            if (item.type == item1.type) {
+              listArr.push({
+                name: item1.name,
+                value: item.value,
+                type: item.type
+              })
+            }
+          })
+        })
+        this.recommend = listArr
+      })
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.disLabel {
+  ::v-deep.el-form-item__label {
+    margin-left: 36px !important;
+  }
+}
+
+.disLabelmoren {
+  ::v-deep.el-form-item__label {
+    margin-left: 120px !important;
+  }
+}
+
+.priamry_border {
+  border: 1px solid #1890ff;
+  color: #1890ff;
+}
+
+.color-item {
+  height: 30px;
+  line-height: 30px;
+  padding: 0 10px;
+  color: #fff;
+  margin-right: 10px;
+}
+
+.color-list .color-item.blue {
+  background-color: #1e9fff;
+}
+
+.color-list .color-item.yellow {
+  background-color: rgb(254, 185, 0);
+}
+
+.color-list .color-item.green {
+  background-color: #009688;
+}
+
+.color-list .color-item.red {
+  background-color: #ed4014;
+}
+
+.proCoupon {
+  ::v-deep.el-form-item__content {
+    margin-top: 5px;
+  }
+}
+
+.tabPic {
+  width: 40px !important;
+  height: 40px !important;
+
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.noLeft {
+  ::v-deep.el-form-item__content {
+    margin-left: 0 !important;
+  }
+}
+
+.tabNumWidth {
+  ::v-deep.el-input-number--medium {
+    width: 121px !important;
+  }
+
+  ::v-deep.el-input-number__increase {
+    width: 20px !important;
+    font-size: 12px !important;
+  }
+
+  ::v-deep.el-input-number__decrease {
+    width: 20px !important;
+    font-size: 12px !important;
+  }
+
+  ::v-deep.el-input-number--medium .el-input__inner {
+    padding-left: 25px !important;
+    padding-right: 25px !important;
+  }
+
+  ::v-deep thead {
+    line-height: normal !important;
+  }
+
+  ::v-deep .el-table .cell {
+    line-height: normal !important;
+  }
+}
+
+.selWidth {
+  width: 100%;
+}
+
+.selWidthd {
+  width: 300px;
+}
+
+.button-new-tag {
+  height: 28px;
+  line-height: 26px;
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.input-new-tag {
+  width: 90px;
+  margin-left: 10px;
+  vertical-align: bottom;
+}
+
+.pictrue {
+  width: 60px;
+  height: 60px;
+  border: 1px dotted rgba(0, 0, 0, 0.1);
+  margin-right: 10px;
+  position: relative;
+  cursor: pointer;
+
+  img {
+    width: 100%;
+    height: 100%;
+  }
+
+  video {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.btndel {
+  position: absolute;
+  z-index: 1;
+  width: 20px !important;
+  height: 20px !important;
+  left: 46px;
+  top: -4px;
+}
+
+.labeltop {
+  ::v-deep.el-form-item__label {
+    float: none !important;
+    display: inline-block !important;
+    width: auto !important;
+  }
+}
+
+.iview-video-style {
+  width: 300px;
+  height: 180px;
+  border-radius: 10px;
+  background-color: #707070;
+  margin: 0 120px 20px;
+  position: relative;
+  overflow: hidden;
+}
+
+.iview-video-style .iconv {
+  color: #fff;
+  line-height: 180px;
+  width: 50px;
+  height: 50px;
+  display: inherit;
+  font-size: 26px;
+  position: absolute;
+  top: -74px;
+  left: 50%;
+  margin-left: -25px;
+}
+
+.iview-video-style .mark {
+  position: absolute;
+  width: 100%;
+  height: 30px;
+  top: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  text-align: center;
+}
+</style>
-- 
2.36.2