<template>
  <!-- 线下购买上传保单信息 -->
  <zj-page-container>
    <zj-fiex-column>
      <view class="page-content">
        <view class="page-content-view">
          <view class="" style="position: relative">
            <view class="dl-title">
              <text class="dl-label">保单生效日期</text>
            </view>
            <view class="dl-md">
              <zj-fiex-row>
                <view slot="before" style="width: 45%; height: 100%">
                  <zj-date v-model="fromData.startTime" />
                </view>
                <view class="shijianzhi"> 至 </view>
                <view slot="after" style="width: 45%; height: 100%">
                  <zj-date v-model="fromData.endTime" />
                </view>
              </zj-fiex-row>
            </view>
            <view class="dl-md">
              <zj-fiex-row>
                <view slot="before" class="dl-label">保单号</view>
                <input class="dl-input" placeholder="请输入" v-model="fromData.insureBill" />
              </zj-fiex-row>
            </view>
            <view class="dl-md" v-if="disabled">
              <zj-fiex-row>
                <view slot="before" class="dl-label">保险公司</view>
                <input class="dl-input" placeholder="请输入" v-model="fromData.insureCompany" />
              </zj-fiex-row>
            </view>
            <view class="dl-md" v-else>
              <zj-fiex-row>
                <view slot="before" class="dl-label">保险公司</view>
                <picker @change="bindPickerChange" :value="index" :range="INSURE_COMPANY" range-key="dictValue">
                  <view class="dl-input" style="height: 110rpx; line-height: 110rpx">
                    {{ fromData.insureCompany || '请选择' }}</view
                  >
                </picker>
              </zj-fiex-row>
            </view>
            <view v-if="disabled" class="page-content-view-zz" @tap.stop="() => {}"> </view>
          </view>
          <view class="dl-title" style="margin-bottom: 20rpx">
            <text class="dl-label">保单图片</text>
          </view>
          <view class="">
            <zj-upload
              :disabled="disabled"
              :fileList="fileList"
              @getFiles="
                list => {
                  fileList = list
                }
              "
            />
          </view>
        </view>
        <template v-if="!disabled">
          <view class="prompt" v-if="fromData.examineStatus"> 失败原因：{{ fromData.examineRemark }} </view>
          <u-button type="primary" @click="submit">提交审核</u-button>
        </template>
      </view>
    </zj-fiex-column>
  </zj-page-container>
</template>
<script>
import ZjFiexColumn from '@/components/zj-container/zj-fiex-column.vue'
import ZjFiexRow from '@/components/zj-container/zj-fiex-row.vue'
import ZjPageContainer from '@/components/zj-container/zj-page-container.vue'
import ZjDate from '@/packageEnter/components/zj-date.vue'
import ZjUpload from '@/components/zj-upload/index.vue'
export default {
  components: {
    ZjFiexRow,
    ZjFiexColumn,
    ZjPageContainer,
    ZjDate,
    ZjUpload
  },
  data() {
    return {
      disabled: true,
      fromData: {
        startTime: '',
        endTime: '',
        insureBill: '',
        insureCompany: '',
        insureWorkerCommercialFileList: [],
        examineStatus: ''
      },
      fileList: [],
      websitId: '',
      INSURE_COMPANY: [],
      index: 0
    }
  },
  async onLoad({ websitId }) {
    this.websitId = websitId
    this.$axios({
      url: insurance.insureCommercialDetail,
      params: {
        websitId: this.websitId
      }
    }).then(res => {
      console.log(res.data)
      if (res.data.endTime) {
        //当前时间
        let d1 = new Date()
        //到期时间
        let d2 = res.data.endTime
        //转换为标准时间"2019/12/29 23:59:59"
        d2 = d2.replace(/-/g, '/')
        d2 = new Date(d2)
        //如果当前时间大于到期时间
        if (d1.valueOf() > d2.valueOf()) {
          this.disabled = false
        } else {
          this.disabled = true
        }
      } else {
        this.disabled = false
      }
      for (var key in res.data) {
        if (~['startTime', 'endTime'].indexOf(key)) {
          if (res.data[key]) {
            this.fromData[key] = res.data[key]
          }
        } else {
          this.fromData[key] = res.data[key]
        }
      }
    })

    this.INSURE_COMPANY = await this.$getDictList({
      dictType: 'INSURE_COMPANY'
    })
    console.log(this.INSURE_COMPANY, '---------')
  },
  watch: {
    'fromData.insureWorkerCommercialFileList'() {
      this.fileList = (this.fromData.insureWorkerCommercialFileList || []).map(item => item.fileUrl)
    }
  },
  methods: {
    bindPickerChange(e) {
      this.fromData.insureCompany = this.INSURE_COMPANY[e.detail.value]
        ? this.INSURE_COMPANY[e.detail.value].dictValue
        : ''
      console.log(this.fromData.insureCompany)
    },
    submit() {
      console.log(this.fromData, this.fileList)
      // 校验
      for (var key of ['startTime', 'endTime', 'insureBill', 'insureCompany', 'insureWorkerCommercialFileList']) {
        if (!this.fromData[key]) {
          if (key === 'insureWorkerCommercialFileList') {
            if (!this.fileList.length) {
              this.$toast(
                `${
                  {
                    startTime: '证书有效开始时间',
                    endTime: '证书有效结束时间',
                    insureBill: '保险单',
                    insureCompany: '保险公司',
                    insureWorkerCommercialFileList: '保单图片'
                  }[key]
                }不能为空`
              )
              return
            }
          } else {
            this.$toast(
              `${
                {
                  startTime: '证书有效开始时间',
                  endTime: '证书有效结束时间',
                  insureBill: '保险单',
                  insureCompany: '保险公司',
                  insureWorkerCommercialFileList: '保单图片'
                }[key]
              }不能为空`
            )
            return
          }
        }
      }
      // 提交
      this.$axios({
        url: insurance.insureCommercialSubmit,
        type: 'json',
        params: {
          ...this.fromData,
          startTime: `${this.fromData.startTime} 00:00:00`,
          endTime: `${this.fromData.endTime} 23:59:59`,
          insureWorkerCommercialFileList: this.fileList.map(url => ({
            fileUrl: url
          })),
          websitId: this.websitId
        }
      }).then(res => {
        uni.$emit('updateUserInfo')
        uni.showToast({
          title: `提交成功`,
          duration: 2000
        })
        uni.switchTab({
          url: `/pages/task/index`
        })
      })
    }
  }
}
</script>
<style lang="scss" scoped>
@import './style.scss';
</style>
