<template>
  <div>
    <el-form ref="cDocForm" :model="cDocObj" label-width="100px">
      <el-form-item :label="$t('出单方式')">
        <el-select v-model="cDocObj.cdOutBillType" :placeholder="$t('请选择出单方式')">
          <el-option v-for="item in method" :key="item.value" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </el-form-item>

      <template v-if="cDocObj.cdOutBillType === '1'">
        <el-form-item :label="$t('电放时间')">
          <el-date-picker type="datetime" :placeholder="$t('请选择日期')" v-model="cDocObj.cdElectricTime" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
        </el-form-item>
        <el-form-item :label="$t('电放凭证附件')">
          <FileUpload :limit="1" :isShowTip=false v-model="cDocObj.cdElectricVoucher" :fileType="fileType" />
        </el-form-item>
      </template>

      <template v-if="cDocObj.cdOutBillType === '2'">
        <el-form-item :label="$t('寄送时间')">
          <el-date-picker type="datetime" :placeholder="$t('请选择日期')" v-model="cDocObj.cdSendTime" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
        </el-form-item>
        <el-form-item :label="$t('快递单号')">
          <el-input v-model="cDocObj.cdBillNo" :placeholder="$t('请输入快递单号')"></el-input>
        </el-form-item>
      </template>

      <el-form-item label="agent list">
        <el-radio-group v-model="cDocObj.cdAgentlistType">
          <el-radio v-for="item in status" :key="item.value" :label="item.value">{{item.label}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-date-picker type="datetime" :placeholder="$t('请选择日期')" v-model="cDocObj.cdAgentlistTime" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
      </el-form-item>
      <el-form-item>
        <FileUpload :limit="1" :isShowTip=false v-model="cDocObj.cdAgentlistFile" :fileType="fileType" />
      </el-form-item>

      <el-form-item label="soncap">
        <el-radio-group v-model="cDocObj.cdSoncapType">
          <el-radio v-for="item in status" :key="item.value" :label="item.value">{{item.label}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-date-picker type="datetime" :placeholder="$t('请选择日期')" v-model="cDocObj.cdSoncapTime" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
      </el-form-item>
      <el-form-item>
        <FileUpload :limit="1" :isShowTip=false v-model="cDocObj.cdSoncapFile" :fileType="fileType" />
      </el-form-item>

    </el-form>
    <el-row class="operate-button">
      <el-button type="primary" @click="onSubmit(1)">{{$t('保存')}}</el-button>
      <el-button type="success" @click="onSubmit(2)">{{$t('提交')}}</el-button>
      <el-button @click="cancel">{{$t('关闭')}}</el-button>
    </el-row>
  </div>
</template>

<script>
import { clearanceDocCreate } from "@/api/ecw/boxSea";
import {
  constantDict,
  formatDateStr,
  formatNumberString,
  fileTypes,
  serviceMsg,
} from "../utils";
import FileUpload from "@/components/FileUpload";

/**
 * 清关文件
 */
export default {
  name: "clrDocument",
  inheritAttrs: false,
  components: { FileUpload },
  data() {
    return {
      // 清关文件对象
      cDocObj: {},
      // 出单方式
      method: constantDict.billingMethod,
      // 选项
      status: constantDict.isFile,
      // 文件类型
      fileType: fileTypes,
    };
  },
  created() {
    const voName = this.$attrs.currNode.voName;
    let oldData = { ...this.$attrs.shipmentObj[voName] };
    oldData = formatDateStr(oldData, [
      "cdElectricTime",
      "cdSendTime",
      "cdAgentlistTime",
      "cdSoncapTime",
    ]);
    oldData = formatNumberString(oldData, [
      "cdOutBillType",
      "cdAgentlistType",
      "cdSoncapType",
    ]);
    this.cDocObj = {
      ...oldData,
      cdOutBillType:
        oldData.cdOutBillType === 0 ? undefined : oldData.cdOutBillType,
    };
  },
  methods: {
    /** 提交 */
    onSubmit(operateType) {
      this.$refs["cDocForm"].validate((valid) => {
        if (valid) {
          clearanceDocCreate({
            ...this.cDocObj,
            shipmentId: this.$attrs.shipmentObj.id,
            operateType,
          }).then((res) => {
            serviceMsg(res, this).then(() => {
              this.cancel("submit");
            });
          });
        }
      });
    },
    /** 取消 */
    cancel(type) {
      this.$emit("closeDialog", type);
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
