<view :class="['slide', currentIndx === cindx ? 'active' : '']">
<view class="page-head">
<view class="page-head-bg pt32"
style="child.gender == '1' ? 'background:' + swiperHeadBg[0] : 'background:' + swiperHeadBg[1]">
<view class="flex" style="justify-content: space-between;">
<view class="flex">
<view class="child-avatar img-wrap">
<image :src="babyAvatar" mode="aspectFit"></image>
</view>
<view class="child-info" v-if="currentChild">
<view class="child-name">{{ child.name }}</view>
<view class="child-age">{{ child.birthDate }}</view>
</view>
<text class="child-info colorFFFFFF" v-else>{{ $t("SYSTEM.EMPTY") }}{{
$t("MODULE_NAME.CHILD") }}</text>
</view>
<view v-if="children.length < 5" @click="gotoBind">
<view class="dot-box right-item" style="margin-right: 16px;">
<u-icon name="plus-circle" size="32rpx" label="添加" label-color="#fff"
color="#fff" label-size="28rpx" margin-left="4px"></u-icon>
</view>
</view>
</view>
<view class="flex notice" style="background-color: rgba(255, 255, 255, 0.1);">
<view style="flex: 5;text-align: left;" class="bgFFF-10 font26 colorFFFFFF">
{{ child.recordOrganCodeShortName }}
</view>
<view style="flex: 1;text-align: right;" v-if="notice != ''">
<p @click="noticeShow = true" class="noticeBtn">公告</p>
</view>
</view>
</view>
</view>
<!-- 功能区 -->
<!-- 展示疫苗 -->
<view class="block-wrap bgFFF radiob16 margint0 padding32 bgimgc6">
<view class="">
<view style="height: 44rpx;line-height: 44rpx;margin-bottom: 16rpx;">
<u-tag text="下一针推荐" type="primary" mode="light" size="mini"
class="marginr8 margintB8" />
<text class="color8C8C8C font26">接种疫苗</text>
</view>
<view v-if="nextVaccineList.vacList">
<view class="font32" v-for="(item, index) in nextVaccineList.vacList" :key="index">
{{ item.actualVaccineName || item.vaccineIdName || '暂无推荐' }}</view>
</view>
<view v-else class="font32">暂无推荐</view>
</view>
<view class="margint24">
<text class="color8C8C8C font26">推荐最早接种时间</text>
<view class="font32 margint8">{{ nextDate || '暂无推荐' }}</view>
</view>
<view class="margint24">
<text class="color8C8C8C font26">预约状态</text>
<view class="font32 margint8">{{ advanceHisttoryName || '未预约' }}</view>
</view>
<view class="page-bottom">
<view class="item">
<u-button
v-show="advanceHisttory == '1' || advanceHisttory == '3' || advanceHisttory == '4'"
shape="circle" type="primary" @click="gotoReserve">查看当前预约</u-button>
<u-button v-show="advanceHisttory == '2'" shape="circle" type="primary"
@click="reserveAgain">预约下一针</u-button>
<!-- <u-button shape="circle" type="primary" @click="reserveAgain">预约下一针</u-button> -->
</view>
</view>
</view>
<view class="block-wrap bgFFF radio16 margint16">
<view class="margint10 flex" style="justify-content: space-evenly;">
<view class="width25">
<view class="func-item flex-wrap" @click="openReservations">
<view class="img-wrap">
<image src="../../static/img/child/p1.png" mode="aspectFit"></image>
</view>
<view class="text-center">
<text class="child-info font28">历史预约</text>
</view>
</view>
</view>
<view class="width25" @click="gotoRecords" stop>
<view class="func-item flex-wrap">
<view class="img-wrap">
<image src="../../static/img/child/p2.png" mode="aspectFit"></image>
</view>
<view class="text-center">
<text class="child-info font28">{{ $t("BLOCK_NAME.VACCINE_RECORD") }}</text>
</view>
</view>
</view>
<view class="width25" @click="gotoSchoolChecking">
<view class="func-item flex-wrap">
<view class="img-wrap">
<image src="../../static/img/child/p3.png" mode="aspectFit"></image>
</view>
<view class="text-center">
<text class="child-info font28">{{ $t("BLOCK_NAME.SCHOOL_CHECKING")
}}</text>
</view>
</view>
</view>
</view>
</view>
</view>
</swiper-item>
</swiper>
</view>