<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="88px">
      <el-form-item label="商品名称" prop="goodsName">
        <el-input v-model="queryParams.goodsName" placeholder="请输入商品名称" clearable size="small"
          @keyup.enter.native="handleQuery" />
      </el-form-item>
     <el-form-item label="商品分类" prop="classId">
        <el-cascader :options="classIdOptions" v-model="queryParams.classId" placeholder="商品分类" :show-all-levels="false"
          clearable></el-cascader>
      </el-form-item>
      <el-form-item label="商品专区" prop="tag">
        <el-select v-model="queryParams.tag" placeholder="请选择专区" clearable size="small">
          <el-option v-for="item in tagList" :key="item.id" :label="item.tagName" :value="item.id" />
        </el-select>
      </el-form-item>
      <el-form-item label="推荐产品" prop="isRecommend">
        <el-select v-model="queryParams.isRecommend" placeholder="请选择是否推荐" clearable size="small">
          <el-option v-for="dict in recommendOptions" :key="dict.dictValue" :label="dict.dictLabel"
            :value="dict.dictValue" />
        </el-select>
      </el-form-item>

      <el-form-item label="热门产品" prop="isHot">
        <el-select v-model="queryParams.isHot" placeholder="请选择是否热门" clearable size="small">
          <el-option v-for="dict in hotOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
        </el-select>
      </el-form-item>
      <!--      <el-form-item label="热卖产品" prop="isHot">-->
      <!--        <el-input-->
      <!--          v-model="queryParams.isHot"-->
      <!--          placeholder="请输入是否是热卖产品 0不是 1是"-->
      <!--          clearable-->
      <!--          size="small"-->
      <!--          @keyup.enter.native="handleQuery"-->
      <!--        />-->
      <!--      </el-form-item>-->
      <el-form-item label="状态" prop="status">
        <el-select v-model="queryParams.status" placeholder="请选择状态" clearable size="small">
          <el-option v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictLabel"
            :value="dict.dictValue" />
        </el-select>
      </el-form-item>
      <el-form-item label="库存" prop="stockStart">
        <el-input v-model="queryParams.stockStart" type="number" placeholder="库存（起）" clearable size="small"
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <span style="margin-right:15px">-</span>
      <el-form-item prop="stockEnd">
        <el-input v-model="queryParams.stockEnd" type="number" placeholder="库存（止）" clearable size="small"
          @keyup.enter.native="handleQuery" />
      </el-form-item>
      <el-form-item label="审核状态" prop="checkStatus">
        <el-select v-model="queryParams.checkStatus" placeholder="请选择状态" clearable size="small">
          <el-option v-for="item in checkOptions" :key="item.value" :label="item.label" :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="商家" prop="shopId">
        <el-select v-model="queryParams.shopId" clearable filterable placeholder="请选择">
          <el-option v-for="(item,index) in shopList" :key="index" :label="item.shopName" :value="item.shopId">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="供应商" prop="supplierArr">
        <el-cascader @change="show" v-model="queryParams.supplierArr" :options="supplierList"
          :props="{ value: 'id' , label: 'name'}" clearable>
          <template slot-scope="{ node, data }">
            <div>
              <span>{{ data.name }}</span>
              <!--<span style="float: right;margin-left: 10px"> {{ data.phone }} </span>-->
            </div>

          </template>
        </el-cascader>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>



    <el-table v-loading="loading" :data="mallGoodsGoodsList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <!--      <el-table-column label="主键ID" align="center" prop="id" />-->
      <el-table-column label="商品名称" align="center" prop="goodsName" />
      <!--      <el-table-column label="商品介绍" align="center" prop="goodsTitle" />-->
      <el-table-column label="默认规格" align="center" prop="spec" />
      <el-table-column label="商品logo" align="center" prop="goodsImg">
        <template slot-scope="scope">
          <el-image :src="scope.row.goodsImg" style="width: 80px" :preview-src-list="[scope.row.goodsImg]" />
        </template>
      </el-table-column>
      <el-table-column label="提成(元)" align="center" prop="commission">
      </el-table-column>

      <el-table-column label="现价(元)" align="center" prop="displayprice">
      </el-table-column>
      <el-table-column label="vip价格(元)" align="center" prop="displaypriceVip">
      </el-table-column>
      <el-table-column label="采购价格" align="center" prop="displaypurchasePrice">
      </el-table-column>
      <el-table-column label="商品分类" align="center" prop="className">
      </el-table-column>
      <!--      <el-table-column label="启用规格" align="center" prop="hasSpec" >-->
      <!--        <template slot-scope="scope">-->
      <!--          <div v-if="scope.row.hasSpec == 0">不启用</div>-->
      <!--          <div v-if="scope.row.hasSpec == 1">启用</div>-->
      <!--        </template>-->
      <!--      </el-table-column>-->
      <el-table-column label="标签" align="center" prop="tips" />


      <!--<el-table-column label="热卖产品" align="center" prop="isHot" />-->
      <el-table-column label="状态" align="center" prop="status">
        <template slot-scope="scope">
          <dict-tag :options="statusOptions" :value="scope.row.status" />
        </template>
      </el-table-column>
      <el-table-column label="库存" align="center" prop="stock" />
      <el-table-column label="商家" align="center" prop="shopName" />
      <el-table-column label="供应商" align="center" prop="supplierName" />
      <el-table-column label="上架审核" align="center" prop="checkStatus">
        <template slot-scope="scope">
          <el-tag type="warning" v-if="scope.row.checkStatus===0">待审核</el-tag>
          <el-tag type="success" v-if="scope.row.checkStatus===1">同意上架</el-tag>
          <el-tag type="danger" v-if="scope.row.checkStatus===2">拒绝上架</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="排序" align="center" prop="sort" />
      <el-table-column label="是否复制" align="center" prop="isCopy">
        <template slot-scope="scope">
          <span v-if="scope.row.isCopy == 1">是</span>
          <span v-if="scope.row.isCopy != 1">否</span>
        </template>
      </el-table-column>
      <el-table-column label="添加时间" align="center" prop="createAt" />

    </el-table>

    <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />






  </div>
</template>

<script>
  import {
    listMallGoodsGoods,
    getMallGoodsGoods,
    delMallGoodsGoods,
    addMallGoodsGoods,
    updateMallGoodsGoods,
    getClassList,
    getClassSelectList,
    getSpecList,
    updateCheckStatus,
    updateSupplier,
    listOtherGoods,
    exportMallGoodsGoods,
    exportMallGoodsGoodsScreen,
    exportMallGoodsGoodsCheck,
    Goodssort
  } from "@/api/mall/mallGoodsGoods";

  import { selectListMallGoodsTag } from "@/api/mall/mallGoodsTag";
  import { getToken } from "@/utils/auth";
  import ImageUpload from "@/components/ImageUpload";

  import { checkPermi, checkRole } from "@/utils/permission";
  import { getAllShopList, listMallShopShop, selectShopShopList } from "@/api/mall/mallShopShop";
  import { exportOrder } from "@/api/mall/mallOrderOrder";

  export default {
    name: "MallGoodsGoods",
    components: {
      ImageUpload,

    },
    data() {
      return {
        // 商家
        shopList: [],
        checkOptions: [{
            value: 0,
            label: '待审核'
          },
          {
            value: 1,
            label: '同意上架'
          },
          {
            value: 2,
            label: '拒绝上架'
          },
        ],

        // 规格列表
        goodsProductList: [],
        valueList: [
          { value: '' }
        ],
        value: '',
        // 遮罩层
        loading: true,
        // 导出遮罩层
        exportLoading: false,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 上传参数
        upload: {
          // 是否禁用上传
          isUploading: false,
          // 设置上传的请求头部
          headers: { Authorization: "Bearer " + getToken() },
          // 上传的地址
          url: process.env.VUE_APP_BASE_API + "/common/upload",
          // 上传的文件列表
          fileList: [],
          // 上传的文件列表
          fileBannersList: [],
          // 上传的文件列表
          fileDetailList: [],
        },
        goodsBanner: [],
        goodsDetail: [],
        // 商品表格数据
        mallGoodsGoodsList: [],
        statusOptions: [],
        // 类型数据字典
        classIdOptions: [],
        recommendOptions: [],
        hotOptions: [],
        tipsOptions: [],
        specList: [],
        newList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        isEdit: false,
        specTitle: "",
        specOpen: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          goodsName: null,
          isRecommend: null,
          isHot: null,
          status: null,
          classId: null,
          stockStart: null,
          stockEnd: null,
          tag: null,
          checkStatus: null,
          supplierArr: [],
          supplierId: null
        },
        // 其他店铺商品查询参数
        queryOther: {
          pageNum: 1,
          pageSize: 10,
          goodsName: null,
          classId: null,
        },
        otherTotal: 0,
        // 表单参数
        form: {},
        // 表单校验
        rules: {
          goodsName: [
            { required: true, message: "请输入商品名称", trigger: "blur" }
          ],
          // classId: [
          //   { required: true, message: "请选择商品分类", trigger: "blur" }
          // ],
          stock: [
            { required: true, message: "请输入库存", trigger: "blur" }
          ],
          spec: [
            { required: true, message: "请输入默认规格名", trigger: "blur" }
          ],
          supplierArr: [
            { required: true, message: "请选择供应商", trigger: "change" }
          ],
        },
        rules1: {
          goodsName: [
            { required: true, message: "请输入商品名称", trigger: "blur" }
          ],
          // classId: [
          //   { required: true, message: "请选择商品分类", trigger: "blur" }
          // ],
          stock: [
            { required: true, message: "请输入库存", trigger: "blur" }
          ],
          spec: [
            { required: true, message: "请输入默认规格名", trigger: "blur" }
          ],
        },
        tagList: [],
        checkOpen: false,
        // 更换供应商弹窗开关
        supplierOpen: false,
        // 级联列表
        supplierList: [],
        // 级联选择数组
        supplierArr: [],
        // 其他商品
        otherGoodsList: [],
        otherOpen: false,
        otherLoading: false,
        // 审核from
        checkForm: {},
        // 更换form
        changeForm: {},
        // 多选框
        tagArr: [],
        supplierArrTwo:[],
        supplierArrThree:[]
      };
    },
    created() {
      this.getList();
      this.getDicts("mall_status").then(response => {
        this.statusOptions = response.data;
      });
      this.getDicts("mall_goods_recommend").then(response => {
        this.recommendOptions = response.data;
      });
      this.getDicts("mall_goods_hot").then(response => {
        this.hotOptions = response.data;
      });
      this.getClassSelect();
      this.selectTagList();
      this.allShopList();
      this.shopShopList();

    },
    methods: {
      checkRole,
      getGoodssort() {
        Goodssort().then(res => {
          if (res.code == 200) {
            console.log('哈哈哈', res)
            this.form.sort = Number(res.data) + 1
          }
        })
      },
      show() {
        console.log(this.form.supplierId)
      },
      /** 商家列表 */
      shopShopList() {
        selectShopShopList().then(response => {
          this.shopList = response.data
        })
      },
      /** 店铺供应商级联 */
      allShopList() {
        getAllShopList().then(response => {
          this.supplierList = response.data;
        })
      },
      // 商品规格列表
      setGoodsProductList(goodsProductList) {
        this.goodsProductList = goodsProductList
      },

      //专区列表
      selectTagList() {
        selectListMallGoodsTag().then(res => {
          this.tagList = res.data
        })
      },
      add() {
        let value = {
          value: ''
        }
        this.valueList.push(value)
      },
      /** 查询商品列表 */
      getList() {
        this.loading = true;
        if (this.queryParams.classId != null) {
          let classIds = this.queryParams.classId

          if (classIds.length !== undefined) {
            this.queryParams.classId = classIds[classIds.length - 1]
          }

        }
        if (this.queryParams.supplierArr != null && this.queryParams.supplierArr.length > 1) {
          var arr = this.queryParams.supplierArr
          this.queryParams.supplierId = arr[1];
        } else {
          this.queryParams.supplierId = 0;
        }
        listMallGoodsGoods(this.queryParams).then(response => {
          this.mallGoodsGoodsList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      /** 查询下拉分类 */
      getClassSelect() {
        getClassSelectList().then(response => {
          this.classIdOptions = response.data;
        });
      },
      // 打开规格表
      setSpec() {
        getSpecList().then(res => {
          var arr = res.data
          for (var i = 0; i < arr.length; i++) {
            arr[i].checkList = []
          }
          var arr1 = this.form.proList
          if (arr1 && arr1.length > 0) {
            for (var i = 0; i < arr1.length; i++) {
              if (arr1[i].isDefault == '1') {
                this.form.isDefault = i;
                break;
              }
            }
          }
          this.newList = this.form.proList || []
          this.specList = arr
          // this.interpop = true
          this.specOpen = true;

        })

      },
      // 生成规格表
      shengcheng() {
        var a = [...this.specList]
        var arr = []
        var arr1 = []
        var arr2 = []
        if (!(a[1] && a[1].checkList && a[1].checkList.length > 0)) {
          a.splice(1, 2)
        }
        if (!(a[0] && a[0].checkList && a[0].checkList.length > 0)) {
          a.splice(0, 1)
        }
        var count = 0;
        a.forEach(item => {
          if (item.checkList.length > 0) {
            count++;
          }
        })
        if (count > 2) {
          this.$message.error('最多选择两个规格的值')
          return
        }

        if (count == 0) {
          this.$message.error('请至少选择一种规格')
          return
        } else if (count == 1) {
          var arrx = []
          var b = [];
          a.forEach(item => {
            if (item.checkList.length > 0) {
              b = item.checkList;
              b.forEach(itb => {
                arr.push({ id: itb.id, value: itb.value, productName: item.name + ':' + itb.value, specName: itb
                    .value })
                arrx.push({ name: item.name, specId: item.id, id: itb.id, value: itb.value })
              })
              arr2.push({ name: item.name, specId: item.id, spec: arrx })
            }
          })
        } else if (count == 2) {
          var arrx = []
          var countN = 0;
          var b1 = {};
          var b2 = {};
          a.forEach(item => {
            if (item.checkList.length > 0) {
              if (countN == 0) {
                b1 = item;
                countN++;
              } else {
                b2 = item;
              }
            }
          })
          var b11 = b1.checkList;
          var b22 = b2.checkList;
          b11.forEach(item => {
            arrx.push({ name: b1.name, id: b11.id, specId: b11.id, value: item.value, isClick: '0' })
            b22.forEach(item2 => {
              arr.push({ id: null, productName: b1.name + ':' + item.value + '*' + b2.name + ':' + item2.value,
                specName: item.value + ' ' + item2.value })
            })
          })
          arr2.push({ name: b1.name, specId: b1.id, spec: arrx })
          arrx = []
          b22.forEach(item2 => {
            arrx.push({ name: b2.name, id: b22.id, specId: b22.id, value: item2.value, isClick: "0" })
          })
          arr2.push({ name: b2.name, specId: b2.id, spec: arrx })

        }
        this.newList = arr
        this.spec = arr2
        // this.form.isDefault = -1
      },
      // 修改默认后强制更新视图
      setDefault() {
        this.$forceUpdate();
      },
      // 修改默认后强制更新视图
      submitFormSpec() {
        if (!this.newList || this.newList.length == 0) {
          this.$message.error('请生成规格表')
          return
        } else if (this.form.isDefault == -1) {
          this.$message.error('请选择默认规格')
          return;
        } else {
          var flag = true
          for (var i = 0; i < this.newList.length; i++) {
            this.$refs['guiform' + i][0].validate((valid) => {
              if (!valid) {
                flag = false
              }
            })
          }
          if (flag) {
            var a = this.newList
            for (var i = 0; i < a.length; i++) {
              a[i].isDefault = this.form.isDefault == i ? '1' : '0'
            }
            this.form.proList = a
            this.form.spec = JSON.stringify(this.spec)
            this.newList = []
            this.specOpen = false
          }
        }
        // this.specOpen = false;
      },
      // 修改默认后强制更新视图
      specClose() {
        this.specOpen = false;
      },

      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          id: null,
          goodsName: null,
          goodsTitle: null,
          classId: null,
          goodsImg: null,
          postFee: null,
          monthlySales: null,
          stock: null,
          spec: null,
          param: null,
          hasSpec: null,
          isRecommend: null,
          isHot: null,
          status: "0",
          shareImg: null,
          shareTitle: null,
          sort: null,
          tips: null,
          createAt: null,
          updateAt: null,
          delFlag: null,
          tagArr: [],
          isCopy: null,
          goodsCopy: 0
        };
        this.goodsProductList = [];
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQueryOther() {
        this.queryOther.pageNum = 1;
        this.copyGoods();
      },
      /** 重置按钮操作 */
      resetQueryOther() {
        this.resetForm("queryOther");
        this.queryOther.goodsName = null;
        this.queryOther.classId = null;
        this.handleQueryOther();
      },

      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.id)
        this.single = selection.length !== 1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.getGoodssort()
        this.reset();
        this.tagArr = [];
        this.form.isDefault = -1
        this.open = true;
        this.isEdit = false;
        this.title = "添加商品";
        if (this.valueList.length != 0) {
          let value = {
            value: ''
          }
          this.valueList = [];
          this.valueList.push(value)
        }
      },
      handleClassIdOptions(val) {


        if (val) {
          this.form.classId = val[val.length - 1]
        }
      },
      handleClassIdOptionsTow(val) {
        if (val) {
          this.form.classIdtwo = val[val.length - 1]
        }
      },
      handleClassIdOptionsThree(val) {
        if (val) {
          this.form.classIdthree = val[val.length - 1]
        }
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        this.tagArr = [];
        const id = row.id || this.ids
        getMallGoodsGoods(id).then(response => {
          this.form =response.data
          this.form.classId = Number(this.form.classId)
          this.form.classIdtwo=Number(this.form.classIdtwo)
          this.form.classIdthree= Number(this.form.classIdthree)
          // this.form.classId=item2.label
          // const reg = new RegExp("</br>", "g"); //创建正则RegExp对象
          // this.form.goodsTitler= this.form.goodsTitle.replace(reg,/<br\/>/g,"\n");
          this.open = true;
          this.isEdit = true;
          this.title = "修改商品";
          if (this.form.tag != null) {
            this.tagArr.push(this.form.tag);
          }
          if (this.form.goodsProductList) {
            this.goodsProductList = this.form.goodsProductList
          }

          let valueList = this.form.tips.split(",");

          this.valueList = [];
          valueList.map(item => {
            let value = {
              value: ''
            }
            value.value = item
            this.valueList.push(value)
          })
          if (this.form.hasSpec == 0) {
            if (response.data.proList.length > 0) {
              this.form.productName = response.data.proList[0].productName;
              this.form.price = response.data.proList[0].price;
            }

            // this.form.stock=response.data.proList[0].stock;
          }

          // let id=this.classIdOptions.find(el=>el.children.map(item=>item.value))
          // alert(id,'李飞钒')
          this.form.goodsCopy = response.data.isCopy;
        });
      },
      /** 提交按钮 */
      submitForm() {
        //级联选择器选中值是数组，获取二级分类的id




        this.form.tips = "";
        for (let i = 0; i < this.valueList.length; i++) {
          let str = this.valueList[i].value
          if (str == "") {
            break
          } else {
            this.form.tips = this.form.tips + str;
            if (i != this.valueList.length - 1) {
              this.form.tips = this.form.tips + ",";
            }
          }
        }
        if (this.form.hasSpec == 0) {
          if (this.form.proList.length > 0) {
            this.form.proList = [{
              "id": undefined == this.form.proList ? "" : this.form.proList[0].id,
              "isDefault": "1",
              "productName": this.form.productName,
              "price": this.form.price,
            }];
          }
        }

        this.form.goodsProductList = this.goodsProductList
        if (this.tagArr.length > 0) {
          this.form.tag = this.tagArr[0];
        } else {
          this.form.tag = null;
        }
        // this.form.goodsTitle = this.form.goodsTitle.replace(/\n|\r\n/g,"</br>");
        this.$refs["form1"].validate(valid => {
          if (valid) {
            if (this.form.id != null) {
              updateMallGoodsGoods(this.form).then(response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.goodsProductList = []
                this.getList();
              });
            } else {
              console.log('+++++', this.form)
              addMallGoodsGoods(this.form).then(response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.goodsProductList = []
                this.getList();
              });
            }
            this.tagArr = []
          }
        });
      },
      /** 修改审核 */
      handleCheck(row) {
        this.checkForm = {
          id: null,
          checkStatus: null
        };
        const id = row.id
        getMallGoodsGoods(id).then(response => {
          var obj = response.data;
          this.checkForm.id = obj.id;
          this.checkForm.checkStatus = obj.checkStatus;
          this.checkOpen = true;
        })

      },
      /** 修改审核提交 */
      submitCheckForm() {
        this.$refs["checkForm"].validate(valid => {
          if (valid) {
            if (this.checkForm.id != null) {
              updateCheckStatus(this.checkForm).then(response => {
                this.msgSuccess("修改成功");
                this.checkOpen = false;
                this.getList();
              });
            }
          }
        });
      },
      /** 关闭审核弹窗 */
      cancelCheck() {
        this.checkOpen = false;
      },
      /** 修改供应商 */
      handleSupplier(row) {
        this.changeForm = {
          id: null,
          shopId: null,
          supplierId: null,
          supplierArr: []
        };
        const id = row.id
        getMallGoodsGoods(id).then(response => {
          var obj = response.data;
          this.changeForm.id = obj.id;
          this.supplierOpen = true;
        })

      },
      /** 供应商变更 */
      submitSupplierForm() {
        this.$refs["changeForm"].validate(valid => {
          if (valid) {
            if (this.changeForm.supplierArr.length === 1) {
              this.changeForm.shopId = this.changeForm.supplierArr[0]
            } else if (this.changeForm.supplierArr.length === 2) {
              this.changeForm.shopId = this.changeForm.supplierArr[0]
              this.changeForm.supplierId = this.changeForm.supplierArr[1]
            }

            if (this.changeForm.supplierArr.length === 1) {
              this.changeForm.shopIdTwo = this.changeForm.supplierArrTwo[0]
            } else if (this.changeForm.supplierArr.length === 2) {
              this.changeForm.shopIdTwo = this.changeForm.supplierArrTwo[0]
              this.changeForm.supplierIdTwo = this.changeForm.supplierArrTwo[1]
            }

            if (this.changeForm.supplierArr.length === 1) {
              this.changeForm.shopIdThree  = this.changeForm.supplierArrThree[0]
            } else if (this.changeForm.supplierArr.length === 2) {
              this.changeForm.shopIdThree = this.changeForm.supplierArrThree[0]
              this.changeForm.supplierIdThree = this.changeForm.supplierArrThree[1]
            }





            if (this.changeForm.id != null) {
              updateSupplier(this.changeForm).then(response => {
                this.msgSuccess("修改成功");
                this.supplierOpen = false;
                this.getList();
              });
            }
          }
        });
      },
      /** 关闭供应商弹窗 */
      cancelSupplier() {
        this.supplierOpen = false;
      },
      /** 关闭其他店铺商品弹窗 */
      cancelOtherOpen() {
        this.otherOpen = false;
      },
      /** 查看其他商铺商品 */
      copyGoods() {
        // this.otherGoodsList = [];
        this.otherLoading = true;
        if (this.queryOther.classId != null) {
          let classIds = this.queryOther.classId

          if (classIds.length !== undefined) {
            this.queryOther.classId = classIds[classIds.length - 1]
          }

        }
        listOtherGoods(this.queryOther).then(response => {
          this.otherGoodsList = response.rows;
          this.otherTotal = response.total
          this.otherLoading = false;
          this.otherOpen = true;
        })
      },
      /** 点击复制商品 */
      handleCopy(row) {
        this.reset();
        const id = row.id;
        getMallGoodsGoods(id).then(response => {
          this.form = response.data;
          console.log('befoForm', this.form)
          // this.open = true;
          // this.isEdit = false;
          // this.title = "修改商品";
          this.form.id = null;
          this.form.shopId = null;
          this.form.supplierId = null;
          this.form.checkStatus = null;
          this.form.copyId = id;
          // 级联选择
          let classId = this.form.classId;
          let classArr = [];
          for (let i = 0; i < this.classIdOptions.length; i++) {
            var temp = this.classIdOptions[i].children
            if (temp.length > 0) {
              for (let j = 0; j < temp.length; j++) {
                if (temp[j].value === classId) {
                  classArr = [this.classIdOptions[i].value, temp[j].value];
                  break;
                }
              }
            }
          }
          this.form.classId = classArr;

          if (this.form.goodsProductList) {
            this.goodsProductList = this.form.goodsProductList
            if (this.goodsProductList.length > 0) {
              for (let i = 0; i < this.goodsProductList.length; i++) {
                this.goodsProductList[i].copyId = this.goodsProductList[i].id;
                this.goodsProductList[i].id = null;
                this.goodsProductList[i].goodsId = null;
                this.goodsProductList[i].price = this.goodsProductList[i].price + 4;
              }
            }
          }

          let valueList = this.form.tips.split(",");

          this.valueList = [];
          valueList.map(item => {
            let value = {
              value: ''
            }
            value.value = item
            this.valueList.push(value)
          })
          if (this.form.hasSpec == 0) {
            this.form.productName = response.data.proList[0].productName;
            this.form.price = response.data.proList[0].price;
            // this.form.stock=response.data.proList[0].stock;
          }
          // 是复制商品
          this.form.isCopy = 1;
          this.form.goodsCopy = 1;
          console.log('form', this.form)
          console.log('proList', this.goodsProductList)
          this.otherOpen = false;
        });


      },

      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除商品编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delMallGoodsGoods(ids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {});
      },
      /** 导出按钮操作 */
      handleExport() {
        const goodsIds = this.ids;
        var that = this
        if (goodsIds.length === 0) {
          const queryParams = this.queryParams;
          this.$confirm('是否确认导出满足筛选条件的商品数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            this.exportLoading = true;
            return exportMallGoodsGoodsScreen(queryParams);
          }).then(response => {
            this.download(response.msg);
            this.exportLoading = false;
          }).catch(() => {});
        } else {
          this.$confirm('是否确认导出勾选的商品数据项?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            that.exportLoading = true;
            return exportMallGoodsGoodsCheck(goodsIds);
          }).then(response => {
            that.download(response.msg);
            that.exportLoading = false;
          }).catch(() => {});

        }

      }
    }
  };
</script>


<style lang="scss" scoped>
  .el-checkbox__input.is-checked .el-checkbox__inner,
  .el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: #0655ce;
    border-color: #0655ce;
  }

  .el-radio__input.is-checked+.el-radio__label {
    color: #0655ce;
  }

  .el-radio__input.is-checked .el-radio__inner {
    background-color: #0655ce;
    border-color: #0655ce;
  }

  .el-input.is-disabled .el-input__inner,
  .el-textarea.is-disabled .el-textarea__inner {
    color: #606266;
    background-color: #fff;
    cursor: default;
  }

  .main {
    margin: 20px;
    background: #fff;

    .serbox {
      height: 60px;
      padding: 0 20px;
      align-items: center;
      display: flex;
      justify-content: space-between;
      border-bottom: 1px solid #eeeeee;

      .left {
        display: flex;

        .inp {
          margin-left: 20px;
        }
      }
    }
  }

  .table {
    border: 1px solid #eee;
    margin: 20px;
  }

  .page {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 40px;
    height: 60px;
  }

  .speclist {
    display: flex;
    margin-bottom: 20px;

    >span {
      display: inline-block;
      width: 80px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .specR {
      width: calc(100% - 80px);
      display: flex;
      flex-wrap: wrap;
      align-items: center;

      .sp-right {
        margin: 0 10px;
      }
    }
  }

  .splist {
    // border: 1px solid red;
    display: flex;
    align-items: center;
    margin: 20px 0;

    .tit {
      // border: 1px solid red;
      width: 80px;
    }
  }

  .alog-box {
    width: calc(100% - 100px);
    background: #fff;
    border: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
  }
</style>
