<template>
  <ele-modal
    v-if="visible"
    custom-class="ele-dialog-form long-dialog-form"
    :centered="true"
    :append-to-body="true"
    :visible.sync="visible"
    :close-on-click-modal="false"
    width="80%"
    @close="cancel"
    :maxable="true"
    :resizable="true"
    :title="title"
  >
    <headerTitle title="基本信息"></headerTitle>

    <el-form
      label-width="120px"
      ref="baseInfoRef"
      :model="form"
      :rules="rules"
      class="el-form-box"
    >
      <el-row>
        <el-col :span="8">
          <el-form-item label="样品类型：" prop="conditionType">
            <el-select
              v-model="form.conditionType"
              placeholder="请选择物品类型"
              width="100%"
              :disabled="type == 'detail'"
            >
              <el-option
                v-for="item in sampleList"
                :key="item.id"
                :label="item.label"
                :value="+item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="样品编码：">
            <el-input
              disabled
              v-model="form.sampleCode"
              maxlength="50"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <headerTitle title="样品列表"></headerTitle>
    <sampleTable
      ref="inventoryTable"
      :pricingWay="form.pricingWay"
      :isSinglePrice="false"
      :isTotalCount="false"
      :isDiscount="false"
      :isTemporary="true"
      :dataList="dataList"
      pageName="businessOpportunity"
      @changesMainNumberModal="changesMainNumberModal"
    ></sampleTable>

    <div slot="footer" class="footer">
      <el-button type="primary" @click="save('baseInfoRef')">保存</el-button>

      <el-button @click="cancel">返回</el-button>
    </div>
  </ele-modal>
</template>

<script>
  import dictMixins from '@/mixins/dictMixins';
  import sampleTable from './sampleTable.vue';
  import { getCode } from '@/api/login';
  import { saveData, updateData, getById } from '@/api/sample';
  export default {
    components: {
      sampleTable
    },
    mixins: [dictMixins],

    data() {
      return {
        id: '',
        title: '',
        visible: false,
        type: '',
        fullscreen: false,
        form: {
          pricingWay: [],
          conditionType: '',
          categoryCode: '',
          categoryId: '',
          sampleCode: '',
          categoryName: '',
          batchNo: '',
          brandNum: '',
          measureUnit: '',
          weightUnit: '',
          weight: '',
          specification: '',
          modelType: ''
        },
        // form: copyObj(formDef),
        // 提交状态
        loading: false,
        // 是否是修改
        isUpdate: false,
        gList: [], //商品分类
        levelList: [],
        sampleList: [
          { id: 1, label: '整样' },
          { id: 2, label: '小样' }
        ],
        rules: {
          conditionType: [
            { required: true, message: '请选择商品分类', trigger: 'change' }
          ]
        },
        dataList: [],
        sampleType: ''
      };
    },

    methods: {
      //打开弹出框
      async open(type, row, contactCategoryId) {
        // this.$refs.inventoryTable.resetTable()
        // this.form.categoryLevelId = contactCategoryId;\

        this.title =
          type === 'add' ? '新增' : type === 'view' ? '详情' : '修改';
        this.type = type;
        this.visible = true;

        this.sampleType = type;
        console.log(this.type, this.sampleType);

        if (this.sampleType == 'edit') {
          this.id = row.id;
          await this.getDetial(row.id);
        } else if (this.sampleType == 'add') {
          this.resetForm();
          this.resetTable();
        }
        // console.log(row, 'row');

        // this.dataList = row;
        // if (type == 'add') {
        //   this.isUpdate = false;
        // } else {
        //   this.isUpdate = true;
        // }
        // if (type != 'add') {
        //   // this.getGoodsById(row.id);
        // }
      },

      async getDetial(id) {
        console.log(id, 'id');
        const data = await getById(id);
        this.form.id = this.id;
        this.form.sampleCode = data.sampleCode;
        this.form.conditionType = data.conditionType;
        this.form.categoryId = data.categoryId;
        this.form.categoryCode = data.categoryCode;
        this.form.categoryName = data.categoryName;
        this.form.batchNo = data.batchNo;
        this.form.brandNum = data.brandNum;
        this.pricingWay = [];
        this.form.modelType = data.modelType;
        this.form.specification = data.specification;
        this.form.weight = data.weight;
        this.form.weightUnit = data.weightUnit;

        console.log(this.form);

        // this.form.brandNum = data.brandNum;

        // this.form.categoryId = data.weightUnit;
        // this.form.categoryName = data.netWeight;

        // this.form.modelType = data.modelType;

        this.form.sampleVOList = data.sampleVOList;
        this.dataList = data.sampleVOList;
      },
      cancel() {
        this.handleClose();
      },
      save(formName) {
        this.$refs[formName].validate(async (valid) => {
          if (valid) {
            if (this.dataList.length > 0) {
              let params = {
                ...this.form,
                sampleVOList: this.dataList
              };

              if (this.type == 'add') {
                delete params.sampleCode;
                try {
                  await saveData(params);
                  this.loading = false;
                  this.$message.success('成功');
                  this.handleClose();
                  this.$emit('done');
                } catch (error) {
                  this.loading = false;
                }
              } else {
                try {
                  await updateData({ ...params, id: this.id });
                  this.loading = false;
                  this.visible = false;

                  this.$message.success(msg);
                  this.handleClose();
                  this.$emit('done');
                } catch (error) {
                  this.loading = false;
                }
              }
            }
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      // 确认选择了样品后的事件
      async changesMainNumberModal(id, data) {
        console.log(data);

        if (this.type == 'add') {
          this.form.sampleCode = data.sampleCode;
        }
        this.form.categoryCode = data.categoryCode;
        this.form.categoryId = data.categoryId;
        this.form.categoryName = data.categoryName;
        this.form.batchNo = data.batchNo;
        this.form.brandNum = data.brandNum;
        this.form.measureUnit = data.measureUnit;
        this.form.weight = data.weight;
        this.form.weightUnit = data.weightUnit;
        this.form.specification = data.specification;
        this.form.modelType = data.modelType;
        // data.conditionType = this.form.conditionType;
        // this.form = { ...data };
        // 单选
        this.dataList = [];
        this.dataList.push(data);
      },

      handleClose() {
        this.$nextTick(() => {
          this.resetForm();
          this.resetTable();
        });
        this.visible = false;
      },

      resetTable() {
        console.log('resetTable');
        this.dataList = [];
      },
      resetForm() {
        console.log('resetForm');
        this.form = {
          pricingWay: [],
          conditionType: '',
          categoryCode: '',
          categoryId: '',
          sampleCode: '',
          categoryName: '',
          batchNo: '',
          brandNum: '',
          measureUnit: '',
          weightUnit: '',
          weight: '',
          specification: '',
          modelType: ''
        };
        this.sampleType = '';
      }
    }
  };
</script>

<style></style>
