<template>
  <div class="main-div">
    <Collapse v-model="bottomList" style="width: 100%">
      <Panel name="1">
        {{ $t('essentialInformation') }}
        <div id="search-cond-div" ref="search-cond-div" slot="content" class="form-content-class">
          <DkForm ref="formInline" style="width:95%;" name="dk-form" v-model="formData">
            <DkRow>
              <!--收款单-->
              <DkFormItem style="margin-top: 10px;" prop="receiptId">
                <InputPop ref="receiptNo" :readonly="true" v-model="formData.receiptNo"/>
              </DkFormItem>
              <!--业务员-->
              <DkFormItem style="margin-top: 10px;" prop="staffId">
                <InputPop ref="staffName" :readonly="true" v-model="formData.staffName"/>
              </DkFormItem>
              <!--业务部门-->
              <DkFormItem style="margin-top: 10px;" prop="orgId">
                <InputPop ref="orgName" :readonly="true" v-model="formData.orgName"/>
              </DkFormItem>
              <!--客户名称-->
              <DkFormItem style="margin-top: 10px;" prop="customerId">
                <InputPop ref="customerName" :readonly="true" v-model="formData.customerName"/>
              </DkFormItem>
              <!--客户电话-->
              <DkFormItem style="margin-top: 10px;" prop="customerPhone">
                <InputPop ref="customerPhone" :readonly="true" v-model="formData.customerPhone"/>
              </DkFormItem>
              <!--详细地址-->
              <DkFormItem style="margin-top: 10px;" prop="addressFull" :span="12">
                <InputPop ref="addressFull" :readonly="true" v-model="formData.addressFull"/>
              </DkFormItem>
              <!--关联订单-->
              <DkFormItem style="margin-top: 10px;" prop="orderId">
                <InputPop ref="orderNo" :readonly="true" v-model="formData.orderNo"/>
              </DkFormItem>
              <!--结算方式-->
              <DkFormItem prop="settlementType" style="margin-top: 10px;">
                <InputPop ref="settlementTypeName" :readonly="true" v-model="formData.settlementTypeName"/>
              </DkFormItem>
              <!--合计金额-->
              <DkFormItem prop="sumAmount" style="margin-top: 10px;">
                <InputNumberPop v-model="formData.sumAmount" :readonly="true" :digits=2 :max="9999999"/>
              </DkFormItem>
              <!--可用余额-->
              <DkFormItem prop="balanceAmount" style="margin-top: 10px;">
                <InputNumberPop v-model="formData.balanceAmount" :readonly=true :digits=2 :max="9999999"/>
              </DkFormItem>
              <!--退款金额-->
              <DkFormItem prop="sumRefundAmount" :label="$t('usedAmount')" style="margin-top: 10px;">
                <InputNumberPop v-model="formData.sumRefundAmount" :digits=2 :max="99999" :min="0" :readonly="true"/>
              </DkFormItem>
              <!--退款方式-->
              <DkFormItem prop="refundMethod" style="margin-top: 10px;">
                <InputPop ref="refundMethod" :readonly="true" v-model="formData.refundMethod"/>
              </DkFormItem>
              <!--退款账号-->
              <DkFormItem prop="refundAccount" style="margin-top: 10px;">
                <InputPop v-model="formData.refundAccount" :readonly="true"/>
              </DkFormItem>
              <!--退款原因-->
              <DkFormItem prop="refundReason" style="margin-top: 10px;">
                <InputPop v-model="formData.refundReason" :readonly="true"/>
              </DkFormItem>
              <!--收款日期-->
              <DkFormItem style="margin-top: 10px;" prop="opCreateTime">
                <InputPop ref="opCreateTime" :readonly="true" v-model="formData.opCreateTime"/>
              </DkFormItem>
            </DkRow>
            <DkRow>
              <!--备注-->
              <DkFormItem style="margin-top: 10px;" prop="remarks" :span="24">
                <InputPop v-model="formData.remarks" textareaFlag :readonly="true"/>
              </DkFormItem>
            </DkRow>
          </DkForm>
        </div>
      </Panel>
    </Collapse>
    <!--附件-->
    <div style="display: flex;margin-bottom: 80px">
      <div id="name5" class="hide-anchor"></div>
      <Collapse v-model="bottomList" style="width: 100%">
        <Panel name="5">
          <span style="font-size: 14px">{{ $t('files') }}</span>
          <div ref="search-cond-div-files-info"
               slot="content">
            <DkPicWall v-model="formData.annexPaths" folder="t_refund/annex_paths"
                       :accept="$config.uploadFileConfig.acceptPicType"
                       :format="['jpg','jpeg','png']"></DkPicWall>
          </div>
        </Panel>
      </Collapse>
    </div>
    <!--  下部分按钮区域  -->
    <DkSaveButton :approval-flag="type==this.$config.formMode.approval" ref="saveButton" :loading="loading"
                  @save="submitForm" @close="close"></DkSaveButton>
  </div>
</template>

<script>
import {indexMixin} from "@/mixins";
// import receiptService from "@/api/sale/receipt/index";

export default {
  mixins: [indexMixin],
  name: "receipt-detail",
  data() {
    return {
      //画面模式选项角标
      bottomList: ['1', '5'],
      loading: false,
      formData: {
        // 附件
        annexPaths: [],
      },
    }
  },
  methods: {
    /**
     * @desc   : 关闭回到收款单页面
     * @author : 周兴
     * @date   : 2022/8/29 15:57
     */
    close() {
      this.closeTag(this.$route)
      //跳转到订单一览界面
      this.$router.push('/sale/receipt/index');
    },
    /**
     * @desc   : 查询收款单信息
     * @author : 周兴
     * @date   : 2022/8/29 15:56
     */
    detail(id) {
      if (!id) {
        return
      }
      this.loading = true
      this.$route.params.id = id
      let params = {
        receiptId: id,
        // 日期后台要求必填，不填报错
        opCreateTimeStart: '2000-01-01',
        opCreateTimeEnd: '2100-12-31',
        cpId: this.$store.state.user.cpId
      }
      receiptService.selectByCond(params).then(res => {
        if (res.code === 200 && res.data.list && res.data.list.length > 0) {
          // 给变量赋值 HEAD
          this.setEntity(res.data.list[0])
          this.$emit('on-detail', res.data.list[0])
          this.loading = false
        } else {
          this.$Message.error(res.message)
          this.loading = false
        }
      })
    },
    /**
     * @desc   : 赋值
     * @author : 周兴
     * @date   : 2022/8/29 15:32
     */
    setEntity(row) {
      // 收款单ID
      this.formData.receiptId = row.receiptId
      // 收款单号
      this.formData.receiptNo = row.receiptNo;
      // 客户名称
      this.formData.customerName = row.customerName;
      // 业务部门
      this.formData.orgName = row.orgName;
      // 业务员
      this.formData.staffName = row.staffName;
      // 关联单号
      this.formData.orderNo = row.orderNo;
      // 客户地址
      this.formData.addressFull = row.addressFull;
      // 结算方式
      this.formData.settlementTypeName = row.settlementTypeName;
      // 合计金额
      this.formData.sumAmount = row.sumAmount;
      // 可用余额
      this.formData.balanceAmount = row.balanceAmount;
      // 退款原因
      this.formData.refundReason = row.refundReason;
      // 退款方式
      this.formData.refundMethod = row.refundMethod;
      // 退款账户
      this.formData.refundAccount = row.refundAccount;
      // 客户电话
      this.formData.customerPhone = row.customerPhone;
      // 退款金额
      this.formData.sumRefundAmount = row.sumRefundAmount;
      // 收款日期
      this.formData.opCreateTime = row.opCreateTime;
      // 备注
      this.formData.remarks = row.remarks;
      // 审批Id
      this.formData.apvSubmitId = row.apvSubmitId;
      if (row.annexPaths) {
        this.formData.annexPaths = row.annexPaths.map(m => {
          return {
            name: m.name,
            path: m.url,
            type: m.type,
            createTime: m.createTime
          }
        })
      }
    },
    /**
     * @desc   : 提交事件
     * @author : 常皓宁
     * @date   : 2023/10/24 10:19
     */
    submitForm(value) {
      // 设置保存的参数
      let params = this.setSubmitFormParams(value)
      // 编辑
      receiptService.update(params).then(res => {
        if (res.code === 200) {
          this.$Message.success(this.$t('I_001', {'param': this.$v('保存')}))
          this.closeTag(this.$route)
          //跳转到订单一览界面
          this.$router.push('/sale/receipt/index');
        } else {
          this.$Message.error(res.message)
        }
        this.loading = false
      })
    },
    /**
     * @desc   : 设置保存的参数
     * @author : 常皓宁
     * @date   : 2023/10/24 10:20
     */
    setSubmitFormParams(value) {
      let params = {
        receiptId: this.formData.receiptId
      }
      //附件
      if (this.formData.annexPaths.length > 0) {
        params.annexPaths = this.formData.annexPaths.map(m => {
          return {
            name: m.name,
            url: m.path,
            type: m.type,
            createTime: m.createTime
          }
        })
      } else {
        params.annexPaths = null
      }
      return params
    },
  },
  created() {
    // 根据收款单Id获取收款单信息
    // this.detail(this.$route.query.receiptId || this.$route.query.id);
  }
}
</script>

<style scoped>

</style>
