<template>
    <div class="provideDetail">
        <!-- 头部 -->
        <van-nav-bar fixed title="发放详情">
            <template #left>
                <img src="../../assets/images/back.png" alt="" @click="goBack"/>
            </template>
        </van-nav-bar>

        <div v-if="Object.keys(formData).length > 0">
            <!-- 发放详情 -->
            <div class="img_block bg1" v-if="formData.status === 1">
                <img src="../../assets/images/shalou.png" alt="">
                <span>叶酸待领取...</span>
            </div>
            <div class="img_block bg1" v-if="formData.status === 2">
                <img src="../../assets/images/success.png" alt="">
                <span>叶酸领取成功</span>
            </div>
            <div class="img_block bg2" v-if="formData.status === 3">
                <img src="../../assets/images/error.png" alt="">
                <span>叶酸申请无效</span>
            </div>
          <div class="item_info">
            <span style="width: 100px">领取单位：</span>
            <span>{{ formData.unitName }}</span>
          </div>
            <div class="title_info">
                <div class="line"></div>
                <div class="title">女方信息</div>
            </div>
            <div class="item_info">
                <span>姓名</span>
                <span>{{ formData.womanName }}</span>
            </div>
            <div class="item_info">
                <span>证件类型</span>
                <span>{{ formData.womenCertificateTypeName }}</span>
            </div>
            <div class="item_info" v-if="formData.womenCertificateType!=3">
                <span>证件号码</span>
                <span>{{ formData.womenIdCard }}</span>
            </div>
            <div class="item_info">
                <span>出生日期</span>
                <span>{{ formData.birthDate }}</span>
            </div>
            <div class="item_info">
                <span>身高</span>
                <span>{{ formData.height }}cm</span>
            </div>
            <div class="item_info">
                <span>体重</span>
                <span>{{ formData.weight }}kg</span>
            </div>
            <div class="item_info">
                <span>BMI</span>
                <span>{{ formData.bmi }}</span>
            </div>
            <div class="split"></div>
            <div class="title_info">
                <div class="line"></div>
                <div class="title">其他信息</div>
            </div>
            <div class="item_info">
                <span>联系电话</span>
                <span>{{ formData.telephone }}</span>
            </div>
            <div class="item_info">
                <span style="width: 200px">现住地址</span>
                <span>{{ formData.presentCodeName }}</span>
            </div>
            <div class="item_info" style="height: auto;min-height: 54px">
                <span style="width: 200px">详细地址</span>
                <span>{{ formData.nowAddress }}</span>
            </div>
            <div class="item_info border_none">
                <span>签名知情同意书</span>
                <span>已签名</span>
            </div>

            <div v-if="formData.status === 2&&formData.provideInfo">
                <div class="split"></div>
                <div class="title_info">
                    <div class="line"></div>
                    <div class="title">发放登记</div>
                </div>
                <div class="item_info">
                    <span>发放日期</span>
                    <span>{{ formData.provideInfo.provideDate }}</span>
                </div>
                <div class="item_info">
                    <span>发放数量</span>
                    <span>{{ formData.provideInfo.provideNumber }}</span>
                </div>
                <div class="item_info">
                    <span>发放医生</span>
                    <span>{{ formData.provideInfo.provideDoctorName }}</span>
                </div>
                <div class="item_info">
                    <span>建议服用</span>
                    <span>{{ formData.provideInfo.recommendEat }}</span>
                </div>
                <div class="item_info" style="height: auto;min-height: 54px;">
                    <span style="width: 150px">备注</span>
                    <span style="margin-left: 20px;margin: 3px">{{ formData.provideInfo.remarks }}</span>
                </div>
                <br><br>
                <br>
                <br>
            </div>
            <br><br>
        </div>
    </div>
</template>
<script>
import {getProvideDetail} from '@/axios/api'

export default {
    data() {
        return {
            formData: {},
        }
    },
    created() {
        this.getProvideDetailInfo();
    },
    methods: {
        getProvideDetailInfo() {
            let id = this.$route.query.id;
            this.$toast.open();
            getProvideDetail(id).then(res => {
                if (res.code === 'SUCCESS') {
                    this.formData = res.data;
                }
                ;
            }).finally(() => {
                this.$toast.close();
            });
        },
        goBack() {
            this.$router.push('applyRecord');
        },
    },
}
</script>
<style lang="less" scoped>
.provideDetail {
  padding-top: 44px;

  .img_block {
    height: 64px;
    display: flex;
    align-items: center;

    img {
      margin-left: 42px;
    }

    span {
      margin-left: 12px;
      font-size: 14px;
      color: #fff;
      letter-spacing: 1px;
    }
  }

  .bg1 {
    background: linear-gradient(292.1deg, rgba(255, 121, 54, 0.65) 1.9%, rgba(253, 41, 34, 0.65) 94.3%), linear-gradient(180deg, #FF9B82 0%, #FD2922 100%);
  }

  .bg2 {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15));
  }

  .item_info {
    height: 54px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 16px;
    border-bottom: 1px solid #D9D9D9;
    font-size: 14px;
    color: #262626;
  }
}
</style>