<!--
  - Author: gn
  -->
<template>
  <el-dialog
    :title="title"
    :visible.sync="visible"
    :width="width"
    :close-on-click-modal="false"
    append-to-body
    @close="dialogcloseFn"
  >
    <avue-form ref="formRef" v-model="form" :option="formOption">
      <template slot="goodsTypeCode" slot-scope="scope">
        <avue-select
          v-model="form.goodsTypeCode"
          placeholder="请选择商品大类"
          type="tree"
          :dic="goodsTypeList"
        ></avue-select>
      </template>
      <template slot="goodsVersion" slot-scope="scope">
        <avue-select
          @change="getGoodsByVersion"
          v-model="form.goodsVersion"
          placeholder="请选择版本"
          :dic="goodsVersionList"
        ></avue-select>
      </template>

      <template slot="goodsNo" slot-scope="scope">
        <avue-input-tree
          @change="goodsNoChange"
          v-model="form.goodsNo"
          placeholder="请选择商品"
          type="tree"
          :dic="goodsNoList"
        ></avue-input-tree>
      </template>

      <!-- <template slot="file" slot-scope="scope">
        <el-upload
          action="#"
          :limit="1"
          ref="fileRef"
          name="files"
          accept=".xls, .xlsx"
          :file-list="fileList"
          :show-filter-list="true"
          :on-change="handleChange"
          :on-remove="handleRemove"
          :auto-upload="false"
        >
          <el-button v-show="hideUpload" size="small" type="primary">上传文件</el-button>
          <div class="el-upload__tip" slot="tip" style="color: #e6a23c"></div>
        </el-upload>
      </template> -->

      <template slot-scope="scope" slot="menuForm">
        <el-button
          size="small"
          type="primary"
          icon="el-icon-check"
          :loading="btnLoading"
          @click="handleSubmit"
        >确定</el-button>
        <el-button size="small" icon="el-icon-close" :loading="btnLoading" @click="close">关闭</el-button>
      </template>
    </avue-form>
  </el-dialog>
</template>

<script>
import { GnFormMixin } from "@/util/GnFormMixin";
import {
  fetchList,
  addResult,
  getResult,
  getResult2,
  delResult,
  putResult
} from "@/api/commonApis";
import { addGoodsAPI } from "@/api/baseManage/invcust";

export default {
  name: "modalUpload",
  mixins: [GnFormMixin],
  components: {},
  props: {
    custNoData: String
  },
  data() {
    return {
      title: "添加",
      width: "800",
      url: {
        getSuplierNoList: "/invtory/invsupplier/page",
        getGoodsTypeList: "/invtory/invgoodstype/getAllGoodsType",
        getGoodsNoList: "invtory/invgoods/getGoodsByGoodsVersion",
        handleSubmit: "/invtory/invgoodsinvtory/import",
        getGoodsVersionList: "/admin/dict/type/goods_version"
      },
      selfOption: {
        printBtn: false,
        emptyBtn: false,
        submitBtn: false,
        column: [
          {
            label: "商品大类",
            prop: "goodsTypeCode",
            span: 24,
            formslot: true,
            labelWidth: 90,
            rules: [
              {
                required: true,
                message: "请选择商品大类！",
                trigger: "blur"
              }
            ]
          },
          {
            type: "select",
            formslot: true,
            label: "商品版本",
            prop: "goodsVersion",
            width: 80,
            span: 24,
            search: true,
            rules: [
              {
                required: true,
                message: "请选择商品版本",
                trigger: "blur"
              }
            ]
          },
          {
            label: "商品名",
            prop: "goodsNo",
            span: 24,
            formslot: true,
            labelWidth: 90,
            rules: [
              {
                required: true,
                message: "请选择商品！",
                trigger: "blur"
              }
            ]
          },
          {
            label: "售卖价格",
            prop: "price",
            span: 24,
            labelWidth: 90,
            type: "input",
            rules: [
              {
                required: true,
                message: "请输入售卖价格！",
                trigger: "blur"
              },
              {
                pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
                message: '请输入数字，金额输入不能小于0，最多只可保留2位小数',
                trigger: 'blur'
              }
            ]
          },
          // {
          //   label: "文件",
          //   prop: "file",
          //   // type: 'upload',
          //   // accept: '.xls,.xlsx',
          //   // limit: 1,
          //   // dataType: 'string',
          //   // loadText: '文件上传中，请稍等',
          //   // listType: 'picture-card',
          //   // tip: '只能上传 .xls/.xlsx 文件！',
          //   // listType: 'text',
          //   formslot: true,
          //   span: 24,
          //   labelWidth: 90,
          //   rules: [
          //     {
          //       required: true,
          //       message: "请选择需要导入的文件！",
          //       trigger: "blur"
          //     }
          //   ]
          // }
        ]
      },

      form: {},
      btnLoading: false,
      suplierNoList: [],
      goodsTypeList: [],
      goodsNoList: [],
      goodsVersionList: [],
      searchForm: {},

      // 文件导入
      hideUpload: true,
      fileList: []
    };
  },
  // watch: {
  //   visible: {
  //     handler(newVal, oldVal) {
  //       if (newVal === false) {
  //         this.resetModalData();
  //       }
  //     }
  //   }
  // },
  created() {
    this.mergeFormOption();
    this.getOptions();
  },
  methods: {
    mergeFormOption() {
      this.formOption = Object.assign(this.formOption, this.selfOption);
    },
    init() {
      this.hideUpload = true;
      this.visible = true;
      this.fileList = [];
      this.form = {};
    },
    getGoodsByVersion(e) {
      if (e) {
        this.getGoodsNoList(this.form.goodsTypeCode, e);
      }
    },
    goodsTypeCodeChange(e) {
      if (e) {
        this.form.goodsTypeName = this.goodsTypeList.find(
          i => i.value === e
        ).label;
        this.getGoodsNoList(e);
      }
      console.log("e", e, "\nform", this.form);
    },
    goodsNoChange(e) {
      if (e) {
        this.form.goodsName = this.goodsNoList.find(i => i.value === e).label;
      }
      console.log("e", e, "\nform", this.form);
    },
    // 文件上传
    handleChange(file, fileList) {
      if (fileList.length == 1) {
        this.hideUpload = false;
      }
      this.formOption.column[3].rules[0].required = false;
      this.fileList = fileList;
      console.log("file=======", this.fileList);
    },
    // 删除文件
    handleRemove(file, fileList) {
      if (fileList.length == 0) {
        this.hideUpload = true;
      }
      this.formOption.column[3].rules[0].required = true;
      this.fileList = fileList;
    },
    dialogcloseFn() {
      this.$refs.formRef.resetFields()
    },
    // 确定
    async handleSubmit() {
      console.log("file", this.fileList);
      this.$refs.formRef.validate(async (valid, done) => {
        if (!valid) return;
        this.btnLoading = true;
        // let fd = new FormData();
        // fd.append("goodsType", this.form.goodsTypeCode);
        // fd.append("goodsTypeName", this.form.goodsTypeName);
        // fd.append("goodsNo", this.form.goodsNo);
        // fd.append("goodsName", this.form.goodsName);
        // fd.append("goodsVersion", this.form.goodsVersion);
        // fd.append("goodsFile", this.fileList[0].raw);
        // await addResult(this.url.handleSubmit, fd)
        let GoodsObj = {
          custNo: this.custNoData,
          // goodsType: this.form.goodsTypeCode,
          // goodsTypeName: this.form.goodsTypeName,
          goodsNo : this.form.goodsNo,
          // goodsName : this.form.goodsName,
          // goodsVersion : this.form.goodsVersion,
          price : this.form.price
        }
        await addGoodsAPI(GoodsObj)
          .then(res => {
            if (res.data.code === 0) {
              this.$message.success("数据添加成功！");
              this.close();
              this.$emit("ok");
            } else {
              this.$message.warning("数据添加失败！原因：" + res.data.msg);
            }
            this.btnLoading = false;
            done();
          })
          .catch(err => {
            this.btnLoading = false;
            done();
            this.$message.error("错误！原因：" + err);
          });
      });
    },

    // 当前页面部分数据置空
    resetModalData() {
      this.form = {
        goodsTypeName: undefined,
        goodsTypeCode: undefined,
        goodsNo: undefined,
        goodsVersion: undefined
      };
      this.fileList = [];
    },

    getOptions() {
      this.getGoodsVersionList();
      this.getGoodsTypeList();
    },

    async getGoodsVersionList() {
      await fetchList(this.url.getGoodsVersionList)
        .then(res => {
          this.goodsVersionList = res.data.data.map(i => {
            return i;
          });
        })
        .catch(err => {
          this.goodsVersionList = [];
        });
    },
    async getGoodsTypeList() {
      await fetchList(this.url.getGoodsTypeList)
        .then(res => {
          this.goodsTypeList = res.data.data.map(i => {
            i.value = i.goodsTypeNo;
            i.label = i.goodsTypeName;
            return i;
          });
        })
        .catch(err => {
          this.goodsTypeList = [];
        });
    },

    async getGoodsNoList(goodsTypeNo, goodsVersion) {
      this.searchForm.goodsType = goodsTypeNo;
      this.searchForm.goodsVersion = goodsVersion;
      this.goodsNoList = {};
      await fetchList(this.url.getGoodsNoList, this.searchForm).then(res => {
        if (res && res.data && res.data.data && res.data.data.length) {
          this.goodsNoList = res.data.data.map(i => {
            i.value = i.goodsNo;
            i.label = i.goodsName;
            return i;
          });
        }
      });
    }
  }
};
</script>

<style>
</style>
