<template>
    <view>
        <view
            class="single-fetch"
            v-for="(fetch, index) in fetchMaterialList"
            :key="index">
            <view class="fetch-upper">
                <!-- <checkbox-group
					v-show="fetch.taskStatus != '35'"
					style="margin-right: 15rpx;"
					@change="checkClick(fetch)"
				>
					<checkbox :checked="fetch.checked" />
				</checkbox-group> -->
                <view class="upper-lef">
                    {{
                        fetch.createBy == null ? "" : fetch.createBy.slice(0, 1)
                    }}
                </view>
                <view class="upper-rig">
                    <h4 style="font-size: 16px">{{ fetch.createBy }}</h4>
                    <h4 style="color: #989898">{{ fetch.phoneNumber }}</h4>
                </view>
            </view>
            <view class="fetch-lower">
                <view>
                    <span>领料申请单位</span>
                    <h4>{{ fetch.deptName }}</h4>
                </view>
                <view>
                    <span>领料申请工程</span>
                    <h4>{{ fetch.proName }}</h4>
                </view>
                <!-- <view>
					<span>工机具类型</span>
					<h4>{{ fetch.fetchType }}</h4>
				</view> -->
                <view>
                    <span>申请数量</span>
                    <h4>{{ fetch.preCountNum }}</h4>
                </view>
                <view>
                    <span>申请时间</span>
                    <h4>{{ fetch.createTime }}</h4>
                </view>
                <view v-show="fetch.examineStatus != null">
                    <span>审批意见</span>
                    <h4>{{ fetch.examineStatus }}</h4>
                </view>
            </view>
            <view class="fetch-btns">
                <view
                    style="background-color: #3788ff"
                    @click="seeDetail(fetch.taskId)"
                    v-show="fetch.taskStatus != '35'">
                    <uni-icons style="color: #fff" type="eye"></uni-icons>
                    查看
                </view>
                <view
                    style="background-color: #fca30d"
                    v-show="fetch.taskStatus == 31 && roles.includes('jjfgs')"
                    @click="toggleOpenModal(fetch)">
                    <uni-icons style="color: #fff" type="auth"></uni-icons>
                    机具分公司审核
                </view>
                <view
                    style="background-color: #fca30d"
                    v-show="fetch.taskStatus == 32 && roles.includes('sgb')"
                    @click="toggleOpenModal(fetch)">
                    <uni-icons style="color: #fff" type="auth"></uni-icons>
                    施管部审核
                </view>
                <view
                    style="background-color: #fca30d"
                    v-show="fetch.taskStatus == 117 && roles.includes('jjfgs')"
                    @click="toggleOpenModal(fetch)">
                    <uni-icons style="color: #fff" type="auth"></uni-icons>
                    机具分公司确认
                </view>
                <!-- <view
					style="background-color: #FCA30D;"
					v-show="fetch.taskStatus == 30 && roles.includes('fgs')"
					@click="toggleOpenModal(fetch)"
				>
					<uni-icons style="color: #fff;" type="auth"></uni-icons>
					分公司审核
				</view>
				<view
					style="background-color: #FCA30D;"
					v-show="fetch.taskStatus == 31 && fetch.leaseApplyInfoList[0].status == 0 && roles.includes('sgb')"
					@click="toggleOpenModal(fetch)"
				>
					<uni-icons style="color: #fff;" type="auth"></uni-icons>
					施管审核
				</view>
				<view
					style="background-color: #FCA30D;"
					v-show="fetch.taskStatus == 31 && fetch.leaseApplyInfoList[0].status == 0 && roles.includes('ajb')"
					@click="toggleOpenModal(fetch)"
				>
					<uni-icons style="color: #fff;" type="auth"></uni-icons>
					安监审核
				</view>
				<view
					style="background-color: #FCA30D;"
					v-show="fetch.taskStatus == 32 && fetch.leaseApplyInfoList[0].status == 5 && roles.includes('jjfgs')"
					@click="toggleOpenModal(fetch)"
				>
					<uni-icons style="color: #fff;" type="auth"></uni-icons>
					机具审核
				</view>
				<view
					style="background-color: #FCA30D;"
					v-show="fetch.taskStatus == 32 && fetch.leaseApplyInfoList[0].status == 7 && roles.includes('tsfgs')"
					@click="toggleOpenModal(fetch)"
				>
					<uni-icons style="color: #fff;" type="auth"></uni-icons>
					调试审核
				</view> -->
            </view>
            <view class="sticky-area">
                <!-- <image src="/static/passed.png" v-show="fetch.taskStatus == '33'" mode=""></image>
				<image src="/static/noExam.png" v-show="fetch.taskStatus != '33'" mode=""></image> -->
                <h4>{{ fetch.taskName }}</h4>
                <!-- <h4
					v-show="fetch.taskStatus == '30'"
				>
					待分公司审核
				</h4>
				<h4
					v-show="fetch.taskStatus == '31'"
				>
					待分管部门审核
				</h4>
				<h4
					v-show="fetch.taskStatus == '32'"
				>
					待内部审核
				</h4>
				<h4
					v-show="fetch.taskStatus == '33'"
				>
					待出库
				</h4>
				<h4
					v-show="fetch.taskStatus == '34'"
				>
					出库进行中
				</h4>
				<h4
					v-show="fetch.taskStatus == '98'"
					style="border: 1px solid #EE603D; color: #EE603D;"
				>
					分公司审核驳回
				</h4>
				<h4
					v-show="fetch.taskStatus == '99'"
					style="border: 1px solid #EE603D; color: #EE603D;"
				>
					分管审核驳回
				</h4>
				<h4
					v-show="fetch.taskStatus == '100'"
					style="border: 1px solid #EE603D; color: #EE603D;"
				>
					内部审核驳回
				</h4>
				<h4
					v-show="fetch.taskStatus == '35'"
					style="border: 1px solid #27D870; color: #27D870;"
				>
					已完成
				</h4> -->
            </view>
        </view>
        <!-- <view class="btm-sticky">
			<view class="checked">
				<checkbox-group @tap="checkAll" style="margin-right: 15rpx;">
					<checkbox :checked="allChecked" />
				</checkbox-group>
				<text>全选</text>
			</view>
			<view
				class="exam"
				@click="toggleExam"
			>
				审核
			</view>
		</view> -->
        <uni-popup ref="popup" type="center" :mask-click="false">
            <view class="popup">
                <view class="pop-top">
                    <h4>审批</h4>
                    <uni-icons
                        style="color: #aaaaaa; font-weight: bold"
                        type="closeempty"
                        @click="closePopup">
                    </uni-icons>
                </view>
                <h4
                    style="
                        width: 85%;
                        margin: 2vh auto;
                        font-weight: normal;
                        text-align: center;
                    ">
                    是否确认审批？
                </h4>
                <view class="select-area">
                    <view @click="modalConfirm">通过</view>
                    <view
                        @click="modalReject"
                        v-show="modalList.taskStatus != 117"
                        >驳回</view
                    >
                    <!-- <uni-forms ref="examForm" :modelValue="examFormData" :rules="rules" label-position="top">
						<uni-forms-item name="ifPass" required label="是否通过" label-width="150">
							<uni-data-select
							  v-model="examFormData.ifPass"
							  :localdata="ifPassRange"
							  :clear="false"
							  @change="ifPassChange"
							></uni-data-select>
						</uni-forms-item>
						<uni-forms-item required v-show="examFormData.ifPass == '1'" name="noPassReason" label="不通过原因" label-width="150">
							<uni-easyinput type="textarea" v-model="examFormData.noPassReason" placeholder="请输入内容"></uni-easyinput>
						</uni-forms-item>
						<button class="submit-btn" @click="formSubmit">确认</button>
					</uni-forms> -->
                </view>
            </view>
        </uni-popup>
        <uni-popup ref="popup1" type="center" :mask-click="false">
            <view class="popup1">
                <view class="pop-top">
                    <h4>驳回原因</h4>
                    <uni-icons
                        style="color: #aaaaaa; font-weight: bold"
                        type="closeempty"
                        @click="closePopup1">
                    </uni-icons>
                </view>
                <view class="select-area">
                    <uni-easyinput
                        v-model="rejectReason"
                        maxlength="50"
                        placeholder="请填写驳回原因"></uni-easyinput>
                    <view class="btn" @click="confirmReject">驳回</view>
                </view>
            </view>
        </uni-popup>
        <u-loading-page
            :loading="showLoading"
            color="#000"
            loading-text="加载中,请稍后..."></u-loading-page>
    </view>
</template>

<script>
    import { basePath } from "../../public";
    export default {
        data() {
            return {
                pageNum: 1,
                pageSize: 10,
                pageTotal: 0,
                showLoading: false,
                allChecked: false,
                examFormData: {
                    ifPass: "",
                    noPassReason: "",
                },
                ifPassRange: [
                    { text: "是", value: "0" },
                    { text: "否", value: "1" },
                ],
                rules: {
                    ifPass: {
                        rules: [
                            {
                                required: true,
                                errorMessage: "请选择是否通过！",
                            },
                        ],
                    },
                },
                fetchMaterialList: [],
                examList: [],
                deviceList: [],
                roles: uni.getStorageSync("roles"),
                modalList: {},
                rejectReason: "",
            };
        },
        methods: {
            seeDetail(taskId) {
                uni.navigateTo({
                    url: `/pages/fetchMaterialDetail/fetchMaterialDetail?taskId=${taskId}`,
                });
            },
            checkAll() {
                this.allChecked = !this.allChecked;
                if (this.allChecked) {
                    this.fetchMaterialList.map((item) => {
                        if (item.checked == false) {
                            item.checked = true;
                        }
                    });
                } else {
                    this.fetchMaterialList.map((item) => {
                        if (item.checked == true) {
                            item.checked = false;
                        }
                    });
                }
            },
            checkClick(item) {
                item.checked = !item.checked;
                if (!item.checked) {
                    this.allChecked = false;
                } else {
                    const goods = this.fetchMaterialList.every((item) => {
                        return item.checked === true;
                    });
                    if (goods) {
                        this.allChecked = true;
                    } else {
                        this.allChecked = false;
                    }
                }
            },
            toggleOpenModal(info) {
                this.modalList = info;
                this.$refs.popup.open();
            },
            modalConfirm() {
                let that = this;
                that.modalList.leaseApplyInfoList[0].examineStatusId =
                    that.modalList.examineStatusId;
                that.examList = {
                    taskId: that.modalList.taskId,
                    leaseApplyInfoList: that.modalList.leaseApplyInfoList,
                    leaseApplyDetails:
                        that.modalList.leaseApplyInfoList[0].leaseApplyDetails,
                };
                switch (that.modalList.taskStatus) {
                    case 31:
                        that.examList.taskStatus = 32;
                        break;
                    case 32:
                        that.examList.taskStatus = 117;
                        break;
                    case 117:
                        that.examList.taskStatus = 33;
                        break;
                }
                /* that.examList = {
					taskId: that.modalList.taskId,
					taskStatus: that.modalList.taskStatus + 1,
					leaseApplyInfoList: that.modalList.leaseApplyInfoList,
					leaseApplyDetails: that.modalList.leaseApplyInfoList[0].leaseApplyDetails
				} */
                console.log(that.modalList, that.examList);
                that.toggleSubmit(that.examList);
                /* for (let i = 0; i < that.modalList.leaseApplyInfoList.length; i++) {
					that.modalList.leaseApplyInfoList[i].companyAuditBy = uni.getStorageSync('userInfo').userid
					that.modalList.leaseApplyInfoList[i].deptAuditBy = uni.getStorageSync('userInfo').userid
					that.modalList.leaseApplyInfoList[i].directAuditBy = uni.getStorageSync('userInfo').userid
					for (let k = 0; k < that.modalList.leaseApplyInfoList[i].leaseApplyDetails.length; k++) {
						that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].auditNum = that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].preNum
						if (that.modalList.taskStatus == '34') {
							that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].alNum = that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].auditNum
						}
					}
				}
				this.examList = {
					taskId: that.modalList.taskId,
					taskStatus: that.modalList.taskStatus + 1,
					leaseApplyInfoList: that.modalList.leaseApplyInfoList
				}
				if (that.roles.includes('fgs')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].examineStatusId = 30
					}
				} else if (that.roles.includes('sgb')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 5
						that.examList.leaseApplyInfoList[k].examineStatusId = 31
					}
				} else if (that.roles.includes('ajb')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 7
						that.examList.leaseApplyInfoList[k].examineStatusId = 31
					}
				} else if (that.roles.includes('jjfgs')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 1
						that.examList.leaseApplyInfoList[k].examineStatusId = 32
					}
				} else if (that.roles.includes('tsfgs')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 3
						that.examList.leaseApplyInfoList[k].examineStatusId = 32
					}
				}
				console.log(that.examList);
				that.toggleSubmit(that.examList) */
            },
            modalReject() {
                let that = this;
                console.log(that.modalList);
                that.examList = {
                    taskId: that.modalList.taskId,
                    leaseApplyInfoList: that.modalList.leaseApplyInfoList,
                    leaseApplyDetails:
                        that.modalList.leaseApplyInfoList[0].leaseApplyDetails,
                };
                switch (that.modalList.taskStatus) {
                    case 31:
                        that.examList.taskStatus = 98;
                        that.examList.examineStatusId = 98;
                        that.examList.leaseApplyInfoList[0].status = 2;
                        break;
                    case 32:
                        that.examList.taskStatus = 99;
                        that.examList.examineStatusId = 99;
                        that.examList.leaseApplyInfoList[0].status = 2;
                        break;
                }
                that.modalList.leaseApplyInfoList[0].examineStatusId =
                    that.examList.taskStatus;
                // if (that.modalList.taskStatus == 32) that.modalList.taskStatus = 100
                /* for (let i = 0; i < that.modalList.leaseApplyInfoList.length; i++) {
					that.modalList.leaseApplyInfoList[i].companyAuditBy = uni.getStorageSync('userInfo').userid
					that.modalList.leaseApplyInfoList[i].deptAuditBy = uni.getStorageSync('userInfo').userid
					that.modalList.leaseApplyInfoList[i].directAuditBy = uni.getStorageSync('userInfo').userid
					for (let k = 0; k < that.modalList.leaseApplyInfoList[i].leaseApplyDetails.length; k++) {
						that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].auditNum = that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].preNum
						if (that.modalList.taskStatus == '34') {
							that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].alNum = that.modalList.leaseApplyInfoList[i].leaseApplyDetails[k].auditNum
						}
					}
				}
				this.examList = {
					taskId: that.modalList.taskId,
					taskStatus: that.modalList.taskStatus + 1,
					leaseApplyInfoList: that.modalList.leaseApplyInfoList
				}
				if (that.roles.includes('fgs')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.taskStatus = 98
						that.examList.leaseApplyInfoList[k].examineStatusId = 98
					}
				} else if (that.roles.includes('sgb')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 6
						that.examList.taskStatus = 99
						that.examList.leaseApplyInfoList[k].examineStatusId = 99
					}
				} else if (that.roles.includes('ajb')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 8
						that.examList.taskStatus = 99
						that.examList.leaseApplyInfoList[k].examineStatusId = 99
					}
				} else if (that.roles.includes('jjfgs')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 2
						that.examList.taskStatus = 100
						that.examList.leaseApplyInfoList[k].examineStatusId = 100
					}
				} else if (that.roles.includes('tsfgs')) {
					for (let k = 0; k < that.examList.leaseApplyInfoList.length; k++) {
						that.examList.leaseApplyInfoList[k].status = 4
						that.examList.taskStatus = 100
						that.examList.leaseApplyInfoList[k].examineStatusId = 100
					}
				}
				console.log(that.examList); */
                // that.rejectSubmit(that.examList)
                that.$refs.popup1.open();
            },
            confirmReject() {
                let that = this;
                if (that.rejectReason == "") {
                    uni.showToast({
                        icon: "none",
                        title: "请填写驳回原因！",
                    });
                } else {
                    console.log(that.modalList);
                    /* if (that.modalList.taskStatus == 31) {
						that.examList.leaseApplyInfoList[0].deptAuditRemark = that.rejectReason
					} else if (that.modalList.taskStatus == 32) {
						that.examList.leaseApplyInfoList[0].directAuditRemark = that.rejectReason
					} */
                    that.examList.leaseApplyInfoList[0].companyAuditRemark =
                        that.rejectReason;
                    console.log(that.examList);
                    that.rejectSubmit(that.examList);
                }
            },
            /* toggleExam () {
				let that = this
				that.deviceList = []
				that.examList = that.fetchMaterialList.filter((item) => {
					return item.checked == true
				}).map((subItem) => {
					return {
						taskId: subItem['taskId'],
						taskStatus: 33,
						leaseApplyInfoList: subItem['leaseApplyInfoList']
					}
				})
				// this.$refs.popup.open()
				uni.showModal({
					title: '确认审核',
					content: '是否确认通过审核？',
					success: (res) => {
						if (res.confirm) {
							for (let i = 0; i < that.examList.length; i++) {
								for (let k = 0; k < that.examList[i].leaseApplyInfoList.length; k++) {
									that.examList[i].leaseApplyInfoList[k].companyAuditBy = uni.getStorageSync('userInfo').userid
									that.examList[i].leaseApplyInfoList[k].deptAuditBy = uni.getStorageSync('userInfo').userid
								}
							}
							console.log(that.examList);
							that.$api.fetchExam.subExam(that.examList).then(res => {
								console.log(res);
							}).catch(err => {
								console.log(err);
							})
						}
					}
				})
			}, */
            closePopup() {
                this.$refs.popup.close();
            },
            closePopup1() {
                this.$refs.popup1.close();
            },
            /* formSubmit () {
				let that = this
				that.$refs.examForm.validate().then(formData => {
					console.log(formData);
					that.$refs.popup.close()
				})
			}, */
            toggleSubmit(list) {
                console.log(list, "审核时的参数");
                let that = this;
                that.$api.fetchExam
                    .subExamCq(list)
                    .then((res) => {
                        console.log(res);
                        if (res.data.code == 200) {
                            that.closePopup();
                            uni.showToast({
                                icon: "none",
                                title: res.data.msg,
                                success: () => {
                                    uni.redirectTo({
                                        url: "/pages/fetchExam/fetchExam",
                                    });
                                },
                            });
                        } else {
                            that.closePopup();
                            uni.showToast({
                                icon: "none",
                                title: res.data.msg,
                            });
                        }
                    })
                    .catch((err) => {
                        console.log(err);
                    });
            },
            rejectSubmit(list) {
                let that = this;
                that.$api.fetchExam
                    .rejectExamCq(list)
                    .then((res) => {
                        console.log(res);
                        if (res.data.code == 200) {
                            that.closePopup();
                            that.closePopup1();
                            uni.showToast({
                                icon: "none",
                                title: res.data.msg,
                                success: () => {
                                    uni.redirectTo({
                                        url: "/pages/fetchExam/fetchExam",
                                    });
                                },
                            });
                        } else {
                            that.closePopup();
                            that.closePopup1();
                            uni.showToast({
                                icon: "none",
                                title: res.data.msg,
                            });
                        }
                    })
                    .catch((err) => {
                        console.log(err);
                    });
            },
            initFetch() {
                let that = this;
                that.showLoading = true;
                that.$api.fetchExam
                    .fetchTrueExamListCq({
                        souceBy: 0,
                        pageNum: that.pageNum,
                        pageSize: that.pageSize,
                    })
                    .then((res) => {
                        console.log(res);
                        if (res.data.code == 200) {
                            that.pageTotal = res.data.data.total;
                            if (res.data.data.rows.length == 0) {
                                that.showLoading = false;
                                uni.showToast({
                                    icon: "none",
                                    title: "未查询到相关数据！",
                                });
                            } else {
                                that.fetchMaterialList = [
                                    ...that.fetchMaterialList,
                                    ...res.data.data.rows,
                                ];
                                that.showLoading = false;
                                console.log(that.fetchMaterialList);
                            }
                        } else if (res.data.code == 500) {
                            that.showLoading = false;
                            uni.showToast({
                                icon: "none",
                                title: "登录状态已过期，请重新登录！",
                                success: () => {
                                    uni.removeStorageSync("token");
                                    uni.removeStorageSync("userInfo");
                                    uni.reLaunch({
                                        url: "/pages/login/login",
                                    });
                                },
                            });
                        } else {
                            that.showLoading = false;
                            uni.showToast({
                                icon: "none",
                                title: res.data.msg,
                            });
                        }
                    })
                    .catch((err) => {
                        console.log(err);
                    });
            },
        },
        onShow() {
            let that = this;
            console.log(that.roles);
            for (let i = 0; i < that.roles.length; i++) {
                if (that.roles[i] == "em02") {
                    that.roles[i] = "jjfgs";
                } else if (that.roles[i] == "em01") {
                    that.roles[i] = "sgb";
                }
            }
            if (that.roles.includes("admin"))
                that.roles = ["admin", "fgs", "sgb", "ajb", "jjfgs", "tsfgs"];
            that.initFetch();
        },
        onReachBottom() {
            console.log(this.fetchMaterialList, this.pageTotal);
            if (this.fetchMaterialList.length >= this.pageTotal) return;
            this.pageNum++;
            this.initFetch();
        },
    };
</script>

<style lang="scss">
    body {
        background-color: #f8f8f8;
        box-sizing: border-box;
        padding-bottom: 10vh;
    }
    .single-fetch {
        width: 95%;
        margin: 20rpx auto;
        background-color: #fff;
        border-radius: 15rpx;
        box-sizing: border-box;
        padding: 15rpx;
        position: relative;
        .fetch-upper {
            width: 100%;
            box-sizing: border-box;
            padding: 15rpx;
            border-bottom: 1px solid #d7d7d7;
            display: flex;
            align-items: center;
            .upper-lef {
                width: 12%;
                height: 5vh;
                border-radius: 15rpx;
                background-color: #378aff;
                color: #fff;
                display: flex;
                justify-content: center;
                align-items: center;
                font-size: 24px;
            }
            .upper-rig {
                flex: 1;
                box-sizing: border-box;
                padding: 10rpx 20rpx;
                display: flex;
                flex-direction: column;
                justify-content: space-around;
                h4 {
                    font-weight: normal;
                    font-size: 14px;
                }
            }
        }
        .fetch-lower {
            width: 100%;
            box-sizing: border-box;
            padding: 15rpx;
            border-bottom: 1px solid #d7d7d7;
            view {
                width: 100%;
                display: flex;
                align-items: center;
                margin-bottom: 15rpx;
                font-size: 14px;
                span {
                    color: #9d9d9d;
                    padding-right: 20rpx;
                }
                h4 {
                    color: #000;
                    font-size: 14px;
                    font-weight: normal;
                }
            }
            view:last-child {
                margin-bottom: 0;
            }
        }
        .fetch-btns {
            width: 100%;
            box-sizing: border-box;
            padding: 15rpx;
            display: flex;
            justify-content: flex-end;
            view {
                box-sizing: border-box;
                padding: 8rpx 25rpx;
                border-radius: 15rpx;
                color: #fff;
                margin-right: 15rpx;
                font-size: 14px;
            }
            view:last-child {
                margin-right: 0;
            }
        }
        .sticky-area {
            position: absolute;
            top: 20rpx;
            right: 20rpx;
            /* width: 11vh;
			height: 10vh;
			image{
				width: 100%;
				height: 100%;
			} */
            h4 {
                box-sizing: border-box;
                padding: 8rpx 20rpx;
                border-radius: 15rpx;
                font-size: 14px;
                font-weight: normal;
                background-color: #fff;
                border: 1px solid #3788ff;
                color: #3788ff;
            }
        }
    }
    .btm-sticky {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        box-sizing: border-box;
        padding: 15rpx 30rpx;
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .checked {
            display: flex;
            align-items: center;
        }
        .exam {
            box-sizing: border-box;
            padding: 10rpx 50rpx;
            border-radius: 30rpx;
            background-color: #3788ff;
            font-size: 14px;
            color: #fff;
        }
    }
    .popup {
        width: 80vw;
        height: 20vh;
        background-color: #fff;
        border-radius: 15rpx;
        overflow: hidden;
        background: linear-gradient(#d9e7fe, #fff, #fff, #fff);
        .pop-top {
            width: 100%;
            height: 5vh;
            box-sizing: border-box;
            padding: 0 25rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .select-area {
            width: 85%;
            margin: 40rpx auto;
            display: flex;
            justify-content: space-around;
            align-items: center;
            view {
                box-sizing: border-box;
                font-size: 30rpx;
                padding: 12rpx 24rpx;
                background-color: #3788ff;
                color: #fff;
                border-radius: 20rpx;
            }
        }
    }
    .popup1 {
        width: 80vw;
        height: 20vh;
        background-color: #fff;
        border-radius: 15rpx;
        overflow: hidden;
        background: linear-gradient(#d9e7fe, #fff, #fff, #fff);
        .pop-top {
            width: 100%;
            height: 5vh;
            box-sizing: border-box;
            padding: 0 25rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .select-area {
            width: 85%;
            margin: 40rpx auto;
            .btn {
                width: 30%;
                box-sizing: border-box;
                padding: 10rpx 0;
                display: flex;
                justify-content: center;
                align-items: center;
                background-color: #3788ff;
                color: #fff;
                font-size: 14px;
                border-radius: 15rpx;
                margin: 20rpx auto;
            }
        }
    }
</style>
