<!--
  @description:添加/编辑供货记录-弹框
  @Modifier:肖文龙
  @routerPath:supplierDeclaration/supplier/supplYrecord
  @date:2020/2/17-17:27
-->
<template>
  <el-dialog
    v-dialogDrag
    :visible.sync="data.dialog"
    :close-on-click-modal="false"
    :title="dialogTitle"
    width="700px"
    top="calc((100vh - 702px) / 2)"
    custom-class="el-dialog__body-p0"
    style="padding:0 50px;"
  >
    <div class="main mb10">
      <el-form
        ref="form"
        :model="supplyRecordData"
        :rules="rules"
        :inline-message="true"
      >
        <table class="from_table">
          <tr>
            <td><el-form-item ref="partners" prop="partners" label="合同合作方" /></td>
            <td>
              <el-radio-group v-model="supplyRecordData.partners" @change="partnersChange">
                <el-radio
                  v-for="(item) in supplierPartnersList"
                  :key="item.typecode"
                  :label="item.typecode"
                >
                  {{ item.typename }}
                </el-radio>
              </el-radio-group>
            </td>
          </tr>
          <tr>
            <td><el-form-item ref="productName" prop="productName" label="产品名称" /></td>
            <td>
              <div>
                <el-input v-model="supplyRecordData.productName" style="width: calc(100% - 180px)" disabled />
                <el-button type="primary" @click="dialogData.dialog=true">
                  选择
                </el-button>
                <el-button plain @click="categoryTreeInfo('clear')">
                  清空
                </el-button>
              </div>
            </td>
          </tr>
          <tr>
            <td><el-form-item ref="purchasingUnit" prop="purchasingUnit" label="采购单位" /></td>
            <td>
              <!-- 本集团内 -->
              <template v-if="supplyRecordData.partners === '00'">
                <el-input v-model="supplyRecordData.purchasingUnit" style="width: calc(100% - 180px)" disabled />
                <el-button type="primary" @click="oRganizationData.dialog=true">
                  选择
                </el-button>
                <el-button @click="oRganizationInfo('clear')">
                  清空
                </el-button>
              </template>
              <!-- 其他单位 -->
              <template v-if="supplyRecordData.partners === '01'">
                <el-input v-model="supplyRecordData.purchasingUnit" />
              </template>
            </td>
          </tr>
          <tr>
            <td><el-form-item ref="contractDate" prop="contractDate" label="合同签订日期" /></td>
            <td>
              <el-date-picker
                v-model="supplyRecordData.contractDate"
                type="date"
                placeholder="选择日期"
              />
            </td>
          </tr>
          <tr>
            <td><el-form-item ref="contractAmount" prop="contractAmount" label="合同金额(万元)" /></td>
            <td> <money :thousands="true" :unit-fixed="0" :money-value="supplyRecordData" width="calc(100% - 44px)" name="contractAmount" /></td>
          </tr>
          <tr>
            <td><el-form-item ref="currencies" prop="currencies" label="币种" /></td>
            <td>
              <el-select v-model="supplyRecordData.currencies" style="width:100%" placeholder="请选择">
                <el-option
                  v-for="item in currencies"
                  :key="item.typecode"
                  :label="item.typename"
                  :value="item.typecode"
                />
              </el-select>
            </td>
          </tr>
          <tr>
            <td><el-form-item ref="supplyProject" prop="supplyProject" label="供货项目" /></td>
            <td><el-input v-model="supplyRecordData.supplyProject" /></td>
          </tr>
          <tr>
            <td> <el-form-item ref="projectLocation" prop="projectLocation" label="项目所在地" /></td>
            <td><el-input v-model="supplyRecordData.projectLocation" /></td>
          </tr>
          <tr>
            <td><el-form-item ref="buyerRepresentative" prop="buyerRepresentative" label="买方业务代表" /></td>
            <td><el-input v-model="supplyRecordData.buyerRepresentative" /></td>
          </tr>
          <tr>
            <td><el-form-item ref="isDomesticPhone" prop="isDomesticPhone" label="是否国内电话" /></td>
            <td>
              <el-radio-group v-model="supplyRecordData.isDomesticPhone">
                <el-radio
                  v-for="(item) in isDomesticPhoneList"
                  :key="item.typecode"
                  :label="item.typecode"
                >
                  {{ item.typename }}
                </el-radio>
              </el-radio-group>
            </td>
          </tr>
          <tr>
            <td><el-form-item ref="buyerLinker" prop="buyerLinker" label="买方业务代表联系电话" /></td>
            <td><el-input v-model="supplyRecordData.buyerLinker" /></td>
          </tr>
          <tr>
            <td>
              <el-form-item
                ref="principalType"
                label="合同扫描件"
                prop="principalType"
              />
            </td>
            <td>
              <upload
                v-if="data.dialog"
                :on-change="supplyRecordChange"
                :data="supplyRecordFile"
                :auto-delete="true"
                :auto-upload="true"
                :limit="1"
                file-ref="fileRef"
                but-text="文件上传"
                title=""
                accept="application/msword,doc,docx,application/pdf,image/jpg,image/jpeg,image/png"
                tip-text="上传格式 (.doc .docx .pdf .jpg .png)"
              />
            </td>
          </tr>
        </table>
      </el-form>
    </div>
    <!-- 产品名称 -->
    <category-tree-dialog :dialog-data="dialogData" @categoryTreeInfo="categoryTreeInfo" />
    <!-- 采购单位 -->
    <oRganizationDialog :dialog-data="oRganizationData" org-types="1" @oRganizationInfo="oRganizationInfo" />
    <!--底部操作按钮-->
    <span slot="footer" class="dialog-footer">
      <el-button :loading="confirmLoading" type="primary" @click="ensure('form')">{{ language.Determine }}</el-button>
      <el-button :loading="confirmLoading" @click="data.dialog = false">{{ language.cancel }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
/* 接口*/
import { querySupplyRecordInfo, saveSupplyRecordInfo } from '@/api/supplier/supplierSupplyRecord'
/* 公用方法 */
import { checkMyriadMoney, validateInput, phoneAndText } from '@/assets/js/validate'
import { randomData, restoreInitialValue } from '@/assets/js/utils'// 清空value值
/* 混合开发*/
import { declareHegSupperGroupMixin } from '@/views/supplier/editorDeclaration/mixins/declareHegSupperGroupMixin'// 供应商-字典
import { declareHegSupperMixins } from '@/views/supplier/editorDeclaration/mixins/declareHegSupperMixins'// 应商-公用方法参数
/* 组件*/
import money from '@comp/common/money/money'// 金额
import upload from '@comp/common/updownload/upload'
import categoryTreeDialog from '@/views/common/tools/categoryTree-dialog'// 产品名称-弹框
import oRganizationDialog from './oRganization-dialog'// 选择采购单位弹框
import { mapGetters } from 'vuex'
export default {
  name: 'SupplYrecordnDialog',
  components: {
    money,
    upload,
    'category-tree-dialog': categoryTreeDialog, // 产品名称-弹框
    oRganizationDialog
  },
  mixins: [declareHegSupperGroupMixin, declareHegSupperMixins],
  props: {
    // 弹框展示状态
    data: {
      type: Object,
      default: function() {
        return {
          dialog: false, // 弹窗状态
          id: '', // 编辑时才会有供货记录id
          oldId: '' // 修改时用的Id
        }
      }
    }
  },
  data() {
    return {
      dialogTitle: '', // 标题名称
      // 弹窗-展示/隐藏状态 true 展示/false 隐藏
      dialogData: {
        title: '产品名称',
        dialog: false, // 产品名称
        selectCodes: [] // 当前选中的产品名称Code
      },
      // 采购单位-弹窗
      oRganizationData: {
        dialog: false // 弹框状态
      },
      // 校验输入内容
      rules: {
        partners: [{ required: true, message: '请选择', trigger: 'change' }], // 合作方
        productName: [{ required: true, message: '请选择', trigger: 'change' }], // 产品名称
        purchasingUnit: [{ required: true, message: '请选择', trigger: 'change' }], // 采购单位
        contractDate: [{ required: true, message: '请选择', trigger: 'change' }], // 合同签订日期
        contractAmount: [{ required: true, validator: checkMyriadMoney, trigger: 'blur' }], // 合同金额
        supplyProject: [{ required: true, validator: validateInput, trigger: 'blur' }], // 供货项目
        projectLocation: [{ required: true, validator: validateInput, trigger: 'blur' }], // 项目所在地点
        buyerRepresentative: [{ required: true, validator: validateInput, trigger: 'blur' }], // 买方业务代表
        buyerLinker: [{ required: true, validator: phoneAndText, trigger: 'blur' }], // 买方联系方式
        isDomesticPhone: [{ required: true, message: '请选择', trigger: 'change' }], // 是否国内电话
        principalType: [{ required: true, message: '请上传', trigger: 'change' }], // 合同扫描-是否上传
        currencies: [{ required: true, message: '请选择', trigger: 'change' }] // 币种
      }
    }
  },
  computed: {
    ...mapGetters(['language'])
  },
  watch: {
    // 产品名称-弹框选中回显
    'supplyRecordData.productId'() {
      if (this.supplyRecordData.productId) { // 选择了
        this.dialogData.selectCodes = this.supplyRecordData.productId.split(',')
      } else { // 未选择
        this.dialogData.selectCodes = []
      }
    },
    // 弹框展示状态
    data: {
      handler(newVal) {
        // 判断是否为编辑
        if (newVal.dialog) {
          if (newVal.id) { // 编辑时
            this.dialogTitle = '编辑供货记录'
            this.initData()// 初始化数据
          } else {
            this.dialogTitle = '添加供货记录'
            if (this.supplyRecordData.id) { // 非编辑时&&有上次的遗留信息时
              this.restoreInitial()// 恢复初始值
            }
            this.supplyRecordData.id = randomData()// 主键id
            this.supplyRecordData.changeType = '00'
            this.supplyRecordFile.bizId = this.supplyRecordData.id// 合同扫描件
            this.supplyRecordData.isDomesticPhone = '01' // 是否国内电话 00 否 01 是
          }
        }
      },
      deep: true
    }
  },
  created() {
    this.getSupplyRecordDictionaries()// 字典信息获取
  },
  methods: {
    // 初始化数据
    initData() {
      const data = {
        id: this.data.id,
        oldId: this.data.oldId
      }
      querySupplyRecordInfo(data).then(res => {
        this.supplyRecordData = {
          ... this.supplyRecordData,
          ...res.data
        }
        this.supplyRecordData.changeType = '01'
        this.supplyRecordFile.bizId = this.supplyRecordData.id// 合同扫描件
      })
    },
    // // 合同扫描件
    supplyRecordChange(file, fileList) {
      if (fileList.length > 0) { // 上传了
        this.$set(this.supplyRecordData, 'principalType', 'true')
      } else { // 未上传
        this.$set(this.supplyRecordData, 'principalType', '')
      }
    },
    // 合作方-触发Change事件
    partnersChange() {
      this.supplyRecordData.purchasingUnit = ''// 名称
      this.supplyRecordData.purchasingUnitId = ''// 代码
    },
    // 产品选择/清空
    categoryTreeInfo(data) {
      if (data === 'clear') { // 清空
        this.supplyRecordData.productName = ''// 名称
        this.supplyRecordData.productId = ''// 代码
      } else { // 选择
        this.supplyRecordData.productName = data.labels// 名称
        this.supplyRecordData.productId = data.keys// 代码
      }
    },
    // 采购单位
    oRganizationInfo(data) {
      if (data === 'clear') { // 清空
        this.supplyRecordData.purchasingUnit = ''// 名称
        this.supplyRecordData.purchasingUnitId = ''// 代码
      } else { // 选择
        this.supplyRecordData.purchasingUnit = data.labels// 名称
        this.supplyRecordData.ppurchasingUnitId = data.keys// 代码
      }
    },
    // 选择信息-确定
    ensure(formName) {
      // 校验输入内容
      this.$refs[formName].validate((valid, field) => {
        if (valid) { // 校验通过
          this.supplyRecordData.contractDate = this.$Moment(this.supplyRecordData.contractDate).format(this.momentSaveFormat)
          this.supplyRecordData.status = '00'// 00 保存 01 提交
          this.confirmLoading = true // Loading
          saveSupplyRecordInfo(this.supplyRecordData).then(response => {
            this.$emit('supplYrecordsInfo', this.supplyRecordData)
            this.confirmLoading = false // Loading
            this.data.dialog = false
            this.restoreInitial()// 恢复初始值
          }).catch(() => {
            this.confirmLoading = false // Loading
          })
        }
      })
    },
    // 恢复初始值
    restoreInitial() {
      // 恢复初始值
      restoreInitialValue(this.supplyRecordData)
      this.supplyRecordData.partners = '00' // 合作方 00 本集团 01 非本集团
      this.supplyRecordData.isDomesticPhone = '01' // 是否国内电话 00 否 01 是
    }
  }
}
</script>

<style scoped lang="less">

</style>
