<template>
    <NavBar :showIcon="true" :showTitle="true" title="简历详情" backgroundBox="#fff"></NavBar>
    <div class="resume-page">
        <!-- 个人信息 -->
        <view class="user-info flex-between">
            <view>
                <view class="name">{{ resumeData.realName || "未实名" }} </view>
                <view class="other">
                    <!-- {{ resumeData.workExperienceYear }}年经验·{{ resumeData.age }}岁·{{ resumeData.educationLevel }} -->
                    {{ resumeData.workExperienceYear }}年 ｜ {{ resumeData.educationLevel }} ｜ {{ resumeData.schoolName }}·{{
                        resumeData.major
                    }}
                </view>
            </view>
            <image v-if="resumeData.avatarPath" class="avatar" :src="evn.APP_IMAGE_BASE_API + resumeData.avatarPath" mode="" />
            <image v-else class="avatar" src="@/static/image/user/default-avatar.png" mode="" />
        </view>
        <!-- 个人信息 -->
        <view class="basics">
            <text class="gradient-title">个人信息</text>
            <view class="basics-top">
                <view class="item">
                    <img v-show="resumeData.sex === 1" src="@/static/image/user/man.png" alt="" />
                    <img v-show="resumeData.sex === 2" src="@/static/image/user/woman.png" alt="" />
                    <text>{{ resumeData.sex === 1 ? "男" : "女" }}</text>
                </view>
                <view class="item">
                    <img src="@/static/image/user/birth.png" alt="" />
                    <text>{{ resumeData.birthday }}</text>
                </view>
                <view class="item">
                    <!-- <img src="@/static/image/user/bag.png" alt=""> -->
                    <text>{{ resumeData.workExperienceYear }}年</text>
                </view>
            </view>
            <view class="information">
                <text class="label">人员类别</text>
                <text class="value">{{ resumeData.identityTypes }}</text>
            </view>
            <view class="information">
                <text class="label">专业</text>
                <text class="value">{{ resumeData.major || "无" }}</text>
            </view>
            <view class="information">
                <text class="label">专业技术职称</text>
                <text class="value">{{ resumeData.positionalTitle || "无" }}</text>
            </view>
            <view class="information">
                <text class="label">职业资格/技能等级证书</text>
                <text class="value">{{ resumeData.professionalCertificates || "无" }}</text>
            </view>
            <view class="information">
                <text class="label">特种作业证</text>
                <text class="value">{{ resumeData.specialCertificates || "无" }}</text>
            </view>
            <view class="information">
                <text class="label">户籍地</text>
                <text class="value">{{ resumeData.residenceCodes }}</text>
            </view>
            <view class="information">
                <text class="label">常住地</text>
                <text class="value">{{ resumeData.birthCodes }}</text>
            </view>
        </view>
        <!-- 求职意向 -->
        <!-- <view class="intention">
            <view class="flex-between">
                <text class="gradient-title">求职意向</text>
            </view>
            <view class="postion">{{ resumeData.preferredPosition }}</view>
            <view class="salary">{{ resumeData.minSalary }}-{{ resumeData.maxSalary }}| {{ resumeData.preferredCityName }}</view>
        </view> -->
        <!-- 求职意向 -->
        <view class="intention" @click="toPage(1)">
            <view class="flex-between">
                <text class="gradient-title">求职意向</text>
            </view>
            <view class="postion">{{ resumeData.positionNames }}</view>
            <view class="salary-postion">
                <view class="salary"
                    >{{ resumeData.minSalary }}{{ resumeData.minSalary ? "-" : "" }}{{ resumeData.maxSalary
                    }}{{ resumeData.districtCode ? " | " : "" }} {{ resumeData.districtCode }}</view
                >
                <view>
                    <text class="text" style="margin-right: 30rpx">{{ resumeData.workModeText }}</text>
                    <text class="text">{{ resumeData.needAccommodationText }}</text>
                </view>
            </view>
        </view>
        <!-- 教育经历 -->
        <view class="experience" @click="navigateTo('/pages/user/resume/educationExperience/index')">
            <view class="flex-between">
                <text class="gradient-title">教育经历</text>
            </view>
            <view class="list">
                <view class="item" v-for="(item, index) in resumeData.educationExperience" :key="index">
                    <view class="name-date flex-between">
                        <text class="name">·{{ item.schoolName }}</text>
                        <text class="date">{{ item.startDate }}~{{ item.endDate }}</text>
                    </view>
                    <view class="postion">·{{ item.major }}</view>
                    <!-- <view class="content">
                ·内容：预计，建筑工程将在今年底竣工。宿舍会在明年8月启用，让多达600名学生入住。
                国大学生事务处处长何汉杰说，国大的宿舍都各有特色，并解释为何要兴建以体育为主题的宿舍。
            </view> -->
                </view>
            </view>
        </view>
        <!-- 工作经历 -->
        <view class="experience" @click="navigateTo('/pages/user/resume/workExperience/index')">
            <view class="flex-between">
                <text class="gradient-title">工作经历</text>
            </view>
            <view class="list">
                <view class="item" v-for="(item, index) in resumeData.workExperience" :key="index">
                    <view class="name-date flex-between">
                        <text class="name">·{{ item.companyName }}</text>
                        <text class="date">{{ item.startDate }} ~ {{ item.endDate }}</text>
                    </view>
                    <view class="postion">·{{ item.position }}</view>
                    <view class="content" style="white-space: pre-wrap">{{ item.content }} </view>
                </view>
            </view>
        </view>
        <!-- 个人优势 -->
        <view class="advantage">
            <view class="flex-between">
                <text class="gradient-title">个人优势</text>
            </view>
            <view class="content">
                {{ resumeData.personalAdvantage }}
            </view>
        </view>
        <!-- {{ status }} -->

        <div class="footer" v-if="pageType !== 'application'">
            <template v-if="status == 0 || status == 1">
                <div class="f-btn-box">
                    <button class="b1" @click="refuse" v-if="jobIdTemp">不合适</button>
                    <button class="b2" @click="invitation">邀请面试</button>
                </div>
            </template>
            <template v-else>
                <div class="f-btn-box">
                    <button class="b3" :class="`style${status}`">{{ btnText }}</button>
                    <div class="b4" v-if="!(applicationData.status == 4 || applicationData.applicationType != 0)">
                        <div @click="callPhone">
                            <img src="@/static/image/icon/telephone.png" alt="" />
                            <p>立即联系</p>
                        </div>
                    </div>
                </div>
            </template>
        </div>
        <div class="footer" v-else>
            <template v-if="applicationData.status == 0 || applicationData.status == 1">
                <div class="f-btn-box">
                    <button class="b1" @click="refuse" v-if="jobIdTemp">不合适</button>
                    <button class="b2" @click="invitation">邀请面试</button>
                </div>
            </template>
            <template v-else>
                <div class="f-btn-box">
                    <button class="b3" :class="`style${applicationData.status}`">{{ applicationText }}</button>
                    <div class="b4" v-if="!(applicationData.status == 4 || applicationData.applicationType != 0)">
                        <div @click="callPhone" :href="`tel:${applicationData.userPhone}`">
                            <img src="@/static/image/icon/telephone.png" alt="" />
                            <p>立即联系</p>
                        </div>
                    </div>
                </div>
            </template>
        </div>
        <!-- 确认拒绝 -->
        <wd-message-box />
    </div>
</template>

<script setup>
import { reactive, computed } from "vue";
import {
    getUserResumeApi,
    rejectApplicationApi,
    resumeInappropriateApi,
    getApplicationByIdApi,
    getUserResumeByApplicationIdApi
} from "@/api/postion";
import { getCityNameByCodeApi, getDistNameByCodeApi } from "@/api/common";

import { getEnumText, getEumData, getEnumText2 } from "@/utils/utils.js";
import evn from "@/utils/config.js";
import { useMessage } from "wot-design-uni";
import dayjs from "dayjs";
import _ from "lodash";
_.Number;
// 投递id
let id = null;
const applicationIdTemp = ref(null);
//工作id
let jobIdTemp = ref(null);
//用户id
let userIdTemp = null;
const resumeData = reactive({
    preferredCityName: "",
    personalAdvantage: "",
    preferredPosition: "",
    maxSalary: "",
    minSalary: "",
    workExperience: [],
    educationExperience: [],
    workExperience: "",
    workExperienceYear: "",
    jobStatusText: "",
    educationLevel: "",
    realName: "",
    username: "",
    avatarPath: "",
    birthDate: "",
    jobStatus: "",
    age: "",
    schoolName: "",
    major: "",
    userPhone: ""
});
const applicationData = ref({});
// 数据回显
const getUserResume = ({ userId, jobId, applicationId }) => {
    // console.log("jobId", jobId);=
    // jobId = !jobId || jobId == "undefined" ? null : jobId;
    // getUserResumeApi({ userId, jobId }).then(async res => {
    let apiFn;

    if (Number(applicationId)) {
        apiFn = getUserResumeByApplicationIdApi(applicationId);
    } else {
        apiFn = getUserResumeApi(userId);
    }
    apiFn.then(async res => {
        console.log(res);
        const {
            personalAdvantages,
            maxSalary,
            minSalary,
            workExperience,
            positionNames,
            educationExperience,
            operator,
            cityCode,
            needAccommodation,
            workMode
        } = res.data.userResume;
        const {
            workAge,
            education,
            avatarPath,
            phone,
            residenceCodes,
            birthCodes,
            specialCertificates,
            positionalTitle,
            professionalCertificates,
            major,
            identityTypes,
            sex,
            name,
            username,
            birthday
        } = res.data.userInfo;

        resumeData.personalAdvantage = personalAdvantages; //个人优势
        resumeData.maxSalary = maxSalary && maxSalary / 1000 + "k"; //薪水
        resumeData.minSalary = minSalary && minSalary / 1000 + "k";
        resumeData.preferredPosition = positionNames;
        resumeData.preferredCityName = (await getCityNameByCodeApi(cityCode))?.data?.cityName;
        const educationExperienceJson = JSON.parse(educationExperience || "[]"); //教育精力
        resumeData.educationExperience = educationExperienceJson;
        resumeData.workExperienceYear = workAge; //工作年限
        const educationLevelText = await getEnumText("EnumEducation", education);
        resumeData.educationLevel = educationLevelText;
        resumeData.avatarPath = avatarPath;
        resumeData.schoolName = educationExperienceJson[0]?.schoolName; //学校
        resumeData.major = educationExperienceJson[0]?.major; //专业
        resumeData.workExperience = JSON.parse(workExperience || "[]"); //工作经历

        applicationData.value = res.data.application || { status: 0 };
        applicationData.value.userPhone = phone;

        /* 个人信息 */
        resumeData.positionNames = positionNames;

        resumeData.workModeText = await getEnumText("EnumWorkMode", workMode);
        resumeData.needAccommodationText = await getEnumText("EnumAccommodation", needAccommodation);
        resumeData.realName = name;
        resumeData.workExperienceYear = workAge;
        resumeData.educationLevel = await getEnumText("EnumEducation", education);
        resumeData.username = username;
        resumeData.avatarPath = avatarPath;
        resumeData.age = calculateAge(birthday);
        resumeData.sex = sex;
        console.log("identityTypesidentityTypes:", identityTypes);

        resumeData.identityTypes = await getEnumText2(
            "EnumIdentityType",
            identityTypes.split(",").map(v => v * 1)
        );
        console.log(resumeData.identityTypes);

        resumeData.birthday = dayjs(birthday).format("YYYY-MM-DD");

        resumeData.major = major;
        resumeData.positionalTitle = positionalTitle;
        resumeData.professionalCertificates = professionalCertificates;
        resumeData.specialCertificates = specialCertificates;

        console.log("ascsacsacsa", residenceCodes);

        getDistNameByCodeApi(residenceCodes.split(",")[2]).then(res => {
            resumeData.residenceCodes = res.data.provinceName + res.data.cityName + res.data.districtName;
        });
        getDistNameByCodeApi(birthCodes.split(",")[2]).then(res => {
            resumeData.birthCodes = res.data.provinceName + res.data.cityName + res.data.districtName;
        });
        /*
        const { realName, workExperience: workExperienceYear, educationLevel, avatarPath } = res.data.user;

        console.log(educationExperienceJson);

         */
    });
};

// 时间戳转为年月日
function formatTimestamp(timestampInMilliseconds) {
    // 创建日期对象
    var date = new Date(timestampInMilliseconds);
    // 获取年月日
    var year = date.getUTCFullYear();
    var month = ("0" + (date.getUTCMonth() + 1)).slice(-2); // 月份是从0开始的，所以加1，并确保两位数
    var day = ("0" + date.getUTCDate()).slice(-2); // 确保两位数
    return `${year}.${month}.${day}`;
}
function calculateAge(birthday) {
    var birthdayDate = new Date(birthday); // 将时间戳转换为日期对象
    var today = new Date(); // 获取当前日期
    var age = today.getFullYear() - birthdayDate.getFullYear(); // 计算年份差
    // 检查生日是否已经过去
    var m = today.getMonth() - birthdayDate.getMonth();
    if (m < 0 || (m === 0 && today.getDate() < birthdayDate.getDate())) {
        age--;
    }
    return age;
}
const pageType = ref(null);
onLoad(({ userId, jobId, applicationId, type }) => {
    pageType.value = type;
    id = applicationId;
    applicationIdTemp.value = applicationId;
    jobIdTemp.value = jobId == "null" ? null : jobId;
    userIdTemp = userId;
    getUserResume({ userId, jobId, applicationId });
});

function navigateTo(url) {
    xma.navigateTo({
        url
    });
}
/* 获取投递信息 */
const status = ref("");
const userPhone = ref("");
const btnText = computed(() => {
    switch (status.value) {
        case 2:
            return "已邀请面试";
        case 3:
            return "已面试";
        case 4:
            return "已拒绝";
        default:
            return "";
    }
});
const applicationText = computed(() => {
    switch (applicationData.value.status) {
        case 2:
            return "已邀请面试";
        case 3:
            return "已面试";
        case 4:
            return "已拒绝";
        default:
            return "";
    }
});
onShow(() => {
    /* "code": "0",
        "text": "已投递",
        "code": "1",
        "text": "已查看",
        "code": "2",
        "text": "待面试",
        "code": "3",
        "text": "已面试",
        "code": "4",
        "text": "已拒绝", */
    id = id == "undefined" ? null : id;
    if (pageType.value == "application") {
    } else {
        getApplicationByIdApi(id).then(res => {
            status.value = res.data.status;
            userPhone.value = res.data.userPhone;
        });
    }
});
/* 拒绝 */
const message = useMessage();
const refuse = () => {
    if (pageType.value == "application") {
        id = applicationData.value.id;
    }
    message
        .confirm({
            msg: "您确认拒绝该简历吗？",
            title: "拒绝"
        })
        .then(() => {
            console.log(id);
            const result = id
                ? rejectApplicationApi(id)
                : resumeInappropriateApi({ userId: userIdTemp, positionId: jobIdTemp.value });

            result.then(res => {
                if (res.code === 200) {
                    uni.showToast({
                        title: "已拒绝",
                        icon: "none"
                    });
                    status.value = 4;
                    applicationData.value.status = 4;
                }
            });
            // resumeInappropriateApi
        })
        .catch(() => {});
};
/* 邀请 */
const invitation = () => {
    if (pageType.value == "application") {
        id = applicationData.value.id;
    }
    uni.navigateTo({
        url: `/pages/recommend/invitation/index?id=${id}&jobId=${jobIdTemp.value}&userId=${userIdTemp}`
    });
};
/* 拨打电话 */
const callPhone = () => {
    uni.makePhoneCall({
        phoneNumber: applicationData.value.userPhone
    });
};
</script>

<style lang="scss" scoped>
.resume-page {
    padding-top: 50rpx;
    padding-bottom: 100rpx;
}
.user-info {
    padding-bottom: 30rpx;
    margin: 0 32rpx;
    border-bottom: 2rpx solid #f3f4f8;
    .name {
        margin-bottom: 16rpx;
        font-size: 36rpx;
        font-weight: 600;
        line-height: 36rpx;
        color: #1b2026;
        img {
            width: 28rpx;
            height: 28rpx;
        }
    }
    .other {
        font-size: 24rpx;
        font-weight: normal;
        line-height: 36rpx;
        color: #77818f;
    }
    .avatar {
        width: 88rpx;
        height: 88rpx;
        border-radius: 50%;
    }
}
.basics {
    padding: 0 32rpx 32rpx;
    margin-top: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    .basics-top {
        display: flex;
        align-items: center;
        .item {
            display: flex;
            align-items: center;
            margin-right: 96rpx;
            img {
                width: 28rpx;
                height: 28rpx;
                margin-right: 16rpx;
            }
            text {
                font-size: 24rpx;
                color: #1b2026;
            }
        }
    }
    .information {
        .label {
            margin-right: 16rpx;
            font-size: 24rpx;
            color: #77818f;
        }
        .value {
            font-size: 24rpx;
            color: #1b2026;
        }
    }
    view {
        margin-top: 16rpx;
        font-size: 24rpx;
        line-height: 36rpx;
        color: #1b2026;
    }
    .arrow {
        border-color: #1b2026;
    }
}
.state {
    padding: 0 32rpx 32rpx;
    margin-top: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    view {
        margin-top: 16rpx;
        font-size: 24rpx;
        line-height: 36rpx;
        color: #1b2026;
    }
    .arrow {
        border-color: #1b2026;
    }
}
.advantage {
    padding: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    .content {
        margin-top: 16rpx;
        font-size: 24rpx;
        line-height: 36rpx;
        color: #1b2026;
    }
}
.intention {
    padding: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    view {
        margin-top: 16rpx;
        font-size: 24rpx;
        line-height: 36rpx;
        color: #1b2026;
    }
    .salary-postion {
        display: flex;
        align-items: center;
        justify-content: space-between;
        .text {
            margin-top: 16rpx;
        }
    }
}
.experience {
    padding: 32rpx;
    border-bottom: 16rpx solid #f3f4f8;
    .list {
        .item {
            padding: 32rpx 0;
            &:not(:last-child) {
                border-bottom: 2rpx solid #f3f4f8;
            }
            .name-date {
                line-height: 36rpx;
                color: #1b2026;
                .name {
                    font-size: 28rpx;
                    font-weight: 600;
                }
                .date {
                    font-size: 24rpx;
                }
            }
            .postion {
                margin-top: 16rpx;
                font-size: 24rpx;
                line-height: 36rpx;
                color: #1b2026;
            }
            .content {
                font-size: 24rpx;
                line-height: 36rpx;
                color: #77818f;
            }
        }
    }
}
.footer {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 99;
    gap: 32rpx;
    width: 100%;
    border-top: 2rpx solid #1f23290f;
    .f-btn-box {
        z-index: 99;
        display: flex;
        align-items: center;
        justify-content: space-around;
        padding: 16rpx 0;
        background: #ffffff;
    }
    button {
        width: 294rpx;
        height: 80rpx;
        margin: 0;
        font-size: 30rpx;
        font-weight: 500;
        line-height: 80rpx;
        background: #1f86ff;
        border: 0;
        border-radius: 12rpx;
    }
    .b1 {
        color: #1f86ff;
        background: #1f86ff0f;
    }
    .b2 {
        color: #ffffff;
    }
    .b3 {
        width: 462rpx;
        height: 80rpx;
    }
    .b4 {
        text-align: center;
        div {
            font-size: 12px;
            color: #1f86ff;
            text-decoration: none;
        }
        img {
            width: 25px;
            height: 22px;
        }
    }
    .style2,
    .style3 {
        color: #1f86ff;
        background: rgb(31 134 255 / 10%);
    }
    .style4 {
        color: #f05a25;
        background: rgb(240 90 37 / 10%);
    }
}
</style>
