<template>
    <div class="replacereport">
        <div class="banner">
            <img src="./img/banner.png" alt="" />
        </div>
        <van-form>
            <van-cell-group>
                <van-field v-model="name" name="姓名" label="姓名" left-icon="user-o" clearable required placeholder="输入姓名">
                </van-field>
                <van-field v-model="phone" name="手机号码" label="手机号码" left-icon="phone-o" clearable required
                    placeholder="输入手机号码" :rules="[
                        { pattern, required: true, message: '请填写正确的手机号码' },
                    ]">
                </van-field>
                <van-field v-model="idCard" name="证件号码" label="证件号码" left-icon="paid" clearable required
                    placeholder="输入证件号码" :rules="[{ required: true, message: '请填写正确的证件号码' }]">
                </van-field>
                <van-field v-model="place" name="场所类型" label="场所类型" left-icon="home-o" clearable readonly required
                    placeholder="输入您的场所类型">
                </van-field>
                <van-field v-model="area" name="所在地市辖区" label="所在地市辖区" left-icon="hotel-o" clearable readonly required
                    placeholder="请填写当前所在地市辖区" />
                <van-field v-model="address" name="位置信息" label="位置信息" left-icon="location-o" clearable readonly required
                    placeholder="输入您的位置信息">
                </van-field>
            </van-cell-group>
        </van-form>
        <div class="button">
            <van-button type="info" size="normal" block @click="upload">港澳台及外籍用户出行登记</van-button>
        </div>
    </div>
</template>

<script>
import Vue from "vue";
import axios from "axios";
import { encryptByDES } from "@/utils/utils";
import { Field, Button, CellGroup, Form, Image, Toast } from "vant";
// import { epidemicQuickMarkUpload } from "@/api/epidemic";

Vue.use(Field).use(Button).use(CellGroup).use(Form).use(Image).use(Toast);
export default {
    data() {
        return {
            area: "",
            name: "",
            name1: "",
            phone: "",
            idCard: "",
            address: "",
            place: "",
            userInfo: {},
            permitCode: "",
            pattern:
                /^(13[0-9]|14[5-9]|15[012356789]|166|17[0-8]|18[0-9]|19[8-9])[0-9]{8}$/,
            realInfo: "",
            healthType: '',
            isolatedState: '',
            riskArea: '',
        };
    },
    methods: {
        // 获取个人信息
        getUserInfo(res) {
            sessionStorage.setItem("ZJCD-UserInfo", res);
            this.userInfo = JSON.parse(res);
        },
        // 提交上报
        upload() {
            this.$toast.loading({
                duration: 0, // 持续展示 toast
                forbidClick: true,
                message: "加载中...",
            });
            let params = {
                appId: "1234",
                areaName: this.area,
                idCard: this.idCard ? encryptByDES(this.idCard, "MnuYbhGv") : "",
                reverseGeoCoding: this.address,
                placeType: this.place,
                realUserName: this.userInfo.realName ? this.userInfo.realName : (this.name1 ? this.name1 : ''),
                mobile: this.userInfo.mobileNo ? this.userInfo.mobileNo : "",
                realUserId: this.userInfo.userId,
                uploadMobile: this.phone,
                uploadName: this.name,
                permitCode: this.permitCode,
                uploadType: 2,
            };
            if (params.uploadName && params.uploadMobile && params.idCard) {
                let regTest =
                    /^13[0-9]{1}[0-9]{8}$|15[^4]{1}[0-9]{8}$|18[0-9]{1}[0-9]{8}$|17[0-8]{1}[0-9]{8}$|14[5-9]{1}[0-9]{8}$|16[6]{1}[0-9]{8}$|19[8-9]{1}[0-9]{8}$/;
                if (!regTest.test(params.uploadMobile)) {
                    this.$toast.clear();
                    this.$dialog
                        .confirm({
                            message: "手机号码格式不对",
                            showCancelButton: false,
                        })
                        .then(() => {
                            return;
                        });
                } else {
                    axios({
                        url: 'https://appointment.smart-zj.cn/applet/applet/epidemic/querySpecialUser',
                        methods: 'get',
                        header: {
                            "Content-Type": "application/json",
                        },
                        params: {
                            idCard: params.idCard
                        }
                    }).then((res) => {
                        if (res.data.data == true) {
                            axios({
                                url: 'https://appointment.smart-zj.cn/applet/applet/epidemic/queryUserOrigin',
                                methods: 'get',
                                header: {
                                    "Content-Type": "application/json",
                                },
                                params: {
                                    idCard: params.idCard
                                }
                            }).then((res) => {
                                this.isolatedState = res.data.data ? res.data.data : ''
                                this.riskArea = res.data.message ? res.data.message : ''
                                // axios({
                                //     url: 'https://appointment.smart-zj.cn/applet/applet/epidemic/queryHealthCodeColor',
                                //     methods: 'get',
                                //     headers: {
                                //         "Content-Type": "application/json",
                                //     },
                                //     params: {
                                //         idCard: params.idCard,
                                //         name: params.uploadName
                                //     }
                                // }).then((res) => {
                                //     this.healthType = res.data.data.levelData ? res.data.data.levelData : '4'
                                    this.healthType = '1'
                                    this.upLoad()
                                // }).catch(err => {
                                //     if (err.data.status == 500) {
                                //         this.upLoad()
                                //     } else {
                                //         this.$toast.clear();
                                //         this.$dialog.confirm({
                                //             message: "服务异常，请稍后重试",
                                //             showCancelButton: false,
                                //         })
                                //     }
                                // })
                            }).catch(() => {
                                this.$toast.clear();
                                this.$dialog.confirm({
                                    message: "请填写正确的个人信息",
                                    showCancelButton: false,
                                })
                            })
                        } else {
                            this.$toast.clear();
                            this.$dialog.confirm({
                                message: res.data.message,
                                showCancelButton: false,
                            })
                        }
                    })

                }
            } else {
                this.$toast.clear();
                this.$dialog
                    .confirm({
                        message: "请填写完成个人信息",
                        showCancelButton: false,
                    })
                    .then(() => {
                        return;
                    });
            }
        },
        upLoad() {
            let params = {
                appId: "1234",
                areaName: this.area,
                idCard: this.idCard ? encryptByDES(this.idCard, "MnuYbhGv") : "",
                reverseGeoCoding: this.address,
                placeType: this.place,
                realUserName: this.userInfo.realName ? this.userInfo.realName : (this.name1 ? this.name1 : ''),
                mobile: this.userInfo.mobileNo ? this.userInfo.mobileNo : "",
                realUserId: this.userInfo.userId,
                uploadMobile: this.phone,
                uploadName: this.name,
                permitCode: this.permitCode,
                uploadType: 2,
                healthType: this.healthType ? this.healthType : '4',
                isolatedState: this.isolatedState ? this.isolatedState : '0',
                riskArea: this.riskArea ? this.riskArea : '',
                userType: 0,
                // 推送字段
                // boardinglocation: this.push.address,
                // note: this.push.remarks,
                // province: this.push.areaName,
                // city: this.push.cityName,
                // village: this.push.villageName,
                pushType: this.$route.query.isPushType,
                // reason: this.push.reasonId,
                // regionId: this.push.concatAreaId,
                // regionName: this.push.concatAreaName,
                // xdhszmState: this.push.hsjc,
            };
            // alert(JSON.stringify(params))
            axios({
                url: 'https://appointment.smart-zj.cn/applet/applet/epidemic/uploadUserInfo',
                method: 'post',
                headers: {
                    'Content-Type': "application/json",
                },
                data: params
            }).then(() => {
                this.$toast.clear();
                this.$toast("提交成功");
                this.jump();
            }).catch((err) => {
                console.log(err)
                this.$toast.clear();
                this.$toast("提交失败，请稍后重试");
            });
        },
        // 上报成功
        jump() {
            this.$router.push({
                name: "ReportDetails",
                query: {
                    name: this.name,
                    address: this.address,
                    phone: this.phone,
                    idCard: this.idCard,
                    place: this.place,
                    healthType: this.healthType ? this.healthType : '4',
                    isolatedState: this.isolatedState
                },
            });
        },
    },
    mounted() {
        window.getUserInfo = this.getUserInfo;
    },
    created() {
        if (window.android !== undefined) {
            const res = window.android.getUserInfo(); // 这是一个json字符串
            sessionStorage.setItem("ZJCD-UserInfo", res);
            this.userInfo = JSON.parse(res);
        } else if (window.webkit) {
            window.webkit &&
                window.webkit.messageHandlers.getUserInfo.postMessage("getUserInfo");
        } else {
            window.receiveLocation(
                JSON.stringify({ code: 0, data: { lat: 39.983744, lng: 116.276063 } })
            );
            this.$toast("请先登录镇合意app");
        }
        let res = sessionStorage.getItem("ZJCD-UserInfo");
        this.userInfo = JSON.parse(res);
        this.area = this.$route.query.area;
        this.address = this.$route.query.address;
        this.place = this.$route.query.place;
        this.permitCode = this.$route.query.permitCode;
        this.name1 = this.$route.query.name1;
    },
};
</script>

<style lang="stylus" scoped>
.banner {
  width: 100%;
  height: 300px;
  padding: 0 0 20px 0;

  img {
    width: 100%;
    height: 100%;
  }
}

.button {
  padding: 15px 40px;
}
</style>