1206 lines
37 KiB
Vue
1206 lines
37 KiB
Vue
<template>
|
||
<view class="teacher-profile-page">
|
||
<!-- 加载状态 -->
|
||
<view v-if="loading" class="loading-mask">
|
||
<view class="loading-content">
|
||
<view class="loading-spinner"></view>
|
||
<text class="loading-text">数据加载中...</text>
|
||
</view>
|
||
</view>
|
||
|
||
<scroll-view v-else scroll-y class="profile-scroll">
|
||
<!-- 顶部基本信息卡片 -->
|
||
<view class="header-card">
|
||
<view class="avatar-wrapper">
|
||
<image
|
||
class="avatar"
|
||
:src="teacher.headPic || '/static/default-avatar.png'"
|
||
mode="aspectFill"
|
||
/>
|
||
</view>
|
||
<view class="header-info">
|
||
<text class="teacher-name">{{ teacher.jsxm || '-' }}</text>
|
||
<text class="teacher-code">档案号:{{ teacher.jsdah || '-' }}</text>
|
||
<view class="basic-tags">
|
||
<text class="tag tag-primary" v-if="teacher.jsType">{{ teacher.jsType }}</text>
|
||
<text class="tag tag-info" v-if="teacher.age">{{ teacher.age }}岁</text>
|
||
<text class="tag tag-success" v-if="teacher.jsxbId">{{ parseGender(teacher.jsxbId) }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 个人基础信息大模块 -->
|
||
<view class="section-container">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">个人基础信息</text>
|
||
</view>
|
||
|
||
<!-- 基础信息子模块 -->
|
||
<view class="sub-section">
|
||
<view class="sub-section-header">基础信息</view>
|
||
<view class="info-grid">
|
||
<view class="info-item">
|
||
<text class="info-label">档案号</text>
|
||
<text class="info-value">{{ teacher.jsdah || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">姓名</text>
|
||
<text class="info-value">{{ teacher.jsxm || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">类型</text>
|
||
<text class="info-value">{{ teacher.jsType || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">性别</text>
|
||
<text class="info-value">{{ parseGender(teacher.jsxbId) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">籍贯</text>
|
||
<text class="info-value">{{ teacher.jsjgId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">民族</text>
|
||
<text class="info-value">{{ teacher.mzId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">身份证号</text>
|
||
<text class="info-value">{{ teacher.sfzh || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">出生日期</text>
|
||
<text class="info-value">{{ formatDate(teacher.cstime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">年龄</text>
|
||
<text class="info-value">{{ teacher.age ? teacher.age + '岁' : '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">政治面貌</text>
|
||
<text class="info-value">{{ teacher.zzmmId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">入党时间</text>
|
||
<text class="info-value">{{ formatMonth(teacher.rdtime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">联系电话</text>
|
||
<text class="info-value">{{ teacher.lxdh || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">电子邮箱</text>
|
||
<text class="info-value">{{ teacher.dzyx || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">参加工作时间</text>
|
||
<text class="info-value">{{ formatMonth(teacher.cgtime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">工龄</text>
|
||
<text class="info-value">{{ teacher.jsgl ? teacher.jsgl + '年' : '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">教龄计算时间</text>
|
||
<text class="info-value">{{ formatMonth(teacher.jltime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">教龄</text>
|
||
<text class="info-value">{{ teacher.jl ? teacher.jl + '年' : '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">进入本单位时间</text>
|
||
<text class="info-value">{{ formatMonth(teacher.jrdwtime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">进入本单位年限</text>
|
||
<text class="info-value">{{ teacher.jrdwnx ? teacher.jrdwnx + '年' : '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">进入来源</text>
|
||
<text class="info-value">{{ teacher.jrly || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">编制情况</text>
|
||
<text class="info-value">{{ teacher.bzqkId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">在岗情况</text>
|
||
<text class="info-value">{{ teacher.zdqkId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item" v-if="teacher.dcyy">
|
||
<text class="info-label">调出原因</text>
|
||
<text class="info-value">{{ teacher.dcyy }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">社保卡号</text>
|
||
<text class="info-value">{{ teacher.sbkh || '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 学历情况子模块 -->
|
||
<view class="sub-section">
|
||
<view class="sub-section-header">学历情况</view>
|
||
<view class="info-grid">
|
||
<view class="info-item">
|
||
<text class="info-label">初始学历</text>
|
||
<text class="info-value">{{ teacher.dyxlId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">全日制学历毕业院校</text>
|
||
<text class="info-value">{{ teacher.dybyyx || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">全日制学历专业</text>
|
||
<text class="info-value">{{ teacher.dybyzy || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">全日制学历毕业年月</text>
|
||
<text class="info-value">{{ formatMonth(teacher.dybynytime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">最后学历</text>
|
||
<text class="info-value">{{ teacher.zhxlId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">最后学历毕业院校</text>
|
||
<text class="info-value">{{ teacher.zhbyyx || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">最后学历专业</text>
|
||
<text class="info-value">{{ teacher.zhbyzy || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">最后毕业年月</text>
|
||
<text class="info-value">{{ formatMonth(teacher.zhbynytime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">学位</text>
|
||
<text class="info-value">{{ teacher.xw || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">学位专业</text>
|
||
<text class="info-value">{{ teacher.xwzy || '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 教师资格子模块 -->
|
||
<view class="sub-section">
|
||
<view class="sub-section-header">教师资格</view>
|
||
<view class="info-grid">
|
||
<view class="info-item">
|
||
<text class="info-label">教师资格学段</text>
|
||
<text class="info-value">{{ teacher.zgxdId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">教师资格学科</text>
|
||
<text class="info-value">{{ teacher.zgxkId || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">教师资格证书号</text>
|
||
<text class="info-value">{{ teacher.zgzs || '-' }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">教师资格证取得年月</text>
|
||
<text class="info-value">{{ formatMonth(teacher.zgnytime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">当前教师资格注册时间</text>
|
||
<text class="info-value">{{ formatDate(teacher.zgzctime) }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">下次教师资格注册时间</text>
|
||
<text class="info-value">{{ formatDate(teacher.xczgzctime) }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 任职情况子模块 -->
|
||
<view class="sub-section">
|
||
<view class="sub-section-header">任职情况</view>
|
||
<view class="info-grid">
|
||
<view class="info-item">
|
||
<text class="info-label">党政职务</text>
|
||
<text class="info-value">{{ dzzwNames }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">其他职务</text>
|
||
<text class="info-value">{{ qtzwNames }}</text>
|
||
</view>
|
||
<view class="info-item">
|
||
<text class="info-label">所属年级</text>
|
||
<text class="info-value">{{ teacher.njmc || '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 职称信息 -->
|
||
<view class="section-container">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">职称信息</text>
|
||
</view>
|
||
<view class="list-wrapper">
|
||
<view v-if="!zcxxList.length" class="empty-tip">暂无职称信息</view>
|
||
<view v-else class="list-container">
|
||
<view class="list-item" v-for="(item, index) in zcxxList" :key="item.id">
|
||
<view class="list-item-header">
|
||
<view class="item-badge">{{ index + 1 }}</view>
|
||
<text class="item-title">{{ item.zcdjId || '-' }}</text>
|
||
</view>
|
||
<view class="list-item-body">
|
||
<view class="item-row">
|
||
<text class="item-label">职称类别</text>
|
||
<text class="item-value">{{ item.zclbId || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">职称专业</text>
|
||
<text class="item-value">{{ item.zczyId || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">审批机关</text>
|
||
<text class="item-value">{{ item.zcspjg || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">批准文号</text>
|
||
<text class="item-value">{{ item.zcbzwh || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">批准年月</text>
|
||
<text class="item-value">{{ formatMonth(item.zcpztime) }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">证书编号</text>
|
||
<text class="item-value">{{ item.zczsbh || '-' }}</text>
|
||
</view>
|
||
<view class="item-row" v-if="item.pydj">
|
||
<text class="item-label">聘用等级</text>
|
||
<text class="item-value">{{ item.pydj }}</text>
|
||
</view>
|
||
<view class="item-row" v-if="item.qqtime">
|
||
<text class="item-label">起聘时间</text>
|
||
<text class="item-value">{{ formatMonth(item.qqtime) }}</text>
|
||
</view>
|
||
<view class="item-row" v-if="item.pywjh">
|
||
<text class="item-label">聘用文件号</text>
|
||
<text class="item-value">{{ item.pywjh }}</text>
|
||
</view>
|
||
<view class="item-row item-row-column" v-if="item.zczs">
|
||
<text class="item-label">职称证书</text>
|
||
<view class="certificate-images">
|
||
<image
|
||
v-for="(imgPath, imgIndex) in parseImagePaths(item.zczs)"
|
||
:key="imgIndex"
|
||
:src="getImageUrl(imgPath)"
|
||
class="certificate-image"
|
||
mode="aspectFill"
|
||
@click="previewCertificate(item.zczs, imgIndex)"
|
||
/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 任岗情况 -->
|
||
<view class="section-container">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">任岗情况</text>
|
||
</view>
|
||
<view class="list-wrapper">
|
||
<view v-if="!gwqkList.length" class="empty-tip">暂无岗位信息</view>
|
||
<view v-else class="list-container">
|
||
<view class="list-item" v-for="(item, index) in gwqkList" :key="item.id">
|
||
<view class="list-item-header">
|
||
<view class="item-badge">{{ index + 1 }}</view>
|
||
<text class="item-title">{{ item.gwjbId || '-' }}</text>
|
||
</view>
|
||
<view class="list-item-body">
|
||
<view class="item-row">
|
||
<text class="item-label">岗位类别</text>
|
||
<text class="item-value">{{ item.gwlbId || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">开始时间</text>
|
||
<text class="item-value">{{ formatMonth(item.gwrzkstime) }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">结束时间</text>
|
||
<text class="item-value">{{ formatMonth(item.gwrzjstime) }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">任职年限</text>
|
||
<text class="item-value">{{ item.gwrznx ? item.gwrznx + '年' : '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 学习及工作经历 -->
|
||
<view class="section-container">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">学习及工作经历</text>
|
||
</view>
|
||
<view class="list-wrapper">
|
||
<view v-if="!gzjlList.length" class="empty-tip">暂无工作经历信息</view>
|
||
<view v-else class="list-container">
|
||
<view class="list-item" v-for="(item, index) in gzjlList" :key="item.id">
|
||
<view class="list-item-header">
|
||
<view class="item-badge">{{ index + 1 }}</view>
|
||
<text class="item-title">{{ item.gzdw || '-' }}</text>
|
||
</view>
|
||
<view class="list-item-body">
|
||
<view class="item-row">
|
||
<text class="item-label">开始时间</text>
|
||
<text class="item-value">{{ formatMonth(item.gzkstime) }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">结束时间</text>
|
||
<text class="item-value">{{ formatMonth(item.gzjstime) }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">职务</text>
|
||
<text class="item-value">{{ item.zw || '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 家庭成员 -->
|
||
<view class="section-container">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">家庭成员</text>
|
||
</view>
|
||
<view class="list-wrapper">
|
||
<view v-if="!jtcyList.length" class="empty-tip">暂无家庭成员信息</view>
|
||
<view v-else class="list-container">
|
||
<view class="list-item" v-for="(item, index) in jtcyList" :key="item.id">
|
||
<view class="list-item-header">
|
||
<view class="item-badge">{{ index + 1 }}</view>
|
||
<text class="item-title">{{ item.xm || '-' }}</text>
|
||
</view>
|
||
<view class="list-item-body">
|
||
<view class="item-row">
|
||
<text class="item-label">与本人关系</text>
|
||
<text class="item-value">{{ item.jtcygxId || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">出生日期</text>
|
||
<text class="item-value">{{ formatDate(item.cstime) }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">工作单位</text>
|
||
<text class="item-value">{{ item.gzdw || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">职务</text>
|
||
<text class="item-value">{{ item.zw || '-' }}</text>
|
||
</view>
|
||
<view class="item-row">
|
||
<text class="item-label">联系电话</text>
|
||
<text class="item-value">{{ item.lxdh || '-' }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 备案资料 -->
|
||
<view class="section-container">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">备案资料</text>
|
||
</view>
|
||
<view class="document-wrapper">
|
||
<view class="document-grid">
|
||
<view class="document-item" v-if="teacher.sfzrxy" @click="previewDocument(teacher.sfzrxy)">
|
||
<image :src="getImageUrl(teacher.sfzrxy)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">身份证人像页</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.sfzghy" @click="previewDocument(teacher.sfzghy)">
|
||
<image :src="getImageUrl(teacher.sfzghy)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">身份证国徽页</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.dyxlbyz" @click="previewDocument(teacher.dyxlbyz)">
|
||
<image :src="getImageUrl(teacher.dyxlbyz)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">第一学历毕业证</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.dyxlxwz" @click="previewDocument(teacher.dyxlxwz)">
|
||
<image :src="getImageUrl(teacher.dyxlxwz)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">第一学历学位证</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.zgxlbyz" @click="previewDocument(teacher.zgxlbyz)">
|
||
<image :src="getImageUrl(teacher.zgxlbyz)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">最高学历毕业证</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.zgxlxwz" @click="previewDocument(teacher.zgxlxwz)">
|
||
<image :src="getImageUrl(teacher.zgxlxwz)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">最高学历学位证</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.pthzm" @click="previewDocument(teacher.pthzm)">
|
||
<image :src="getImageUrl(teacher.pthzm)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">普通话证明</text>
|
||
</view>
|
||
<view class="document-item" v-if="teacher.jszgz" @click="previewDocument(teacher.jszgz)">
|
||
<image :src="getImageUrl(teacher.jszgz)" class="document-image" mode="aspectFill" />
|
||
<text class="document-label">教师资格证</text>
|
||
</view>
|
||
</view>
|
||
<view v-if="!hasAnyDocument" class="empty-tip">暂无备案资料</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 备注信息 -->
|
||
<view class="section-container" v-if="teacher.remark">
|
||
<view class="section-header">
|
||
<view class="section-marker"></view>
|
||
<text class="section-title">备注信息</text>
|
||
</view>
|
||
<view class="remark-content">
|
||
<text class="remark-text">{{ teacher.remark }}</text>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<!-- 固定在底部的返回按钮 -->
|
||
<view class="fixed-bottom">
|
||
<button class="back-btn" @click="handleBack">
|
||
返回
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { ref, computed, onMounted } from "vue";
|
||
import { onLoad } from "@dcloudio/uni-app";
|
||
import { get } from "@/utils/request";
|
||
import dayjs from "dayjs";
|
||
import { BASE_IMAGE_URL } from "@/config";
|
||
import { getZwListByLx } from "@/api/base/zwApi";
|
||
|
||
interface Teacher {
|
||
id?: string;
|
||
jsxm?: string;
|
||
jsdah?: string;
|
||
jsType?: string;
|
||
jsxbId?: string;
|
||
jsjgId?: string;
|
||
mzId?: string;
|
||
sfzh?: string;
|
||
cstime?: string;
|
||
age?: number;
|
||
zzmmId?: string;
|
||
rdtime?: string;
|
||
lxdh?: string;
|
||
dzyx?: string;
|
||
cgtime?: string;
|
||
jsgl?: number;
|
||
jltime?: string;
|
||
jl?: number;
|
||
jrdwtime?: string;
|
||
jrdwnx?: number;
|
||
jrly?: string;
|
||
bzqkId?: string;
|
||
zdqkId?: string;
|
||
dcyy?: string;
|
||
sbkh?: string;
|
||
dyxlId?: string;
|
||
dybyyx?: string;
|
||
dybyzy?: string;
|
||
dybynytime?: string;
|
||
zhxlId?: string;
|
||
zhbyyx?: string;
|
||
zhbyzy?: string;
|
||
zhbynytime?: string;
|
||
xw?: string;
|
||
xwzy?: string;
|
||
zgxdId?: string;
|
||
zgxkId?: string;
|
||
zgzs?: string;
|
||
zgnytime?: string;
|
||
zgzctime?: string;
|
||
xczgzctime?: string;
|
||
dzzw?: string;
|
||
qtzw?: string;
|
||
njmc?: string;
|
||
remark?: string;
|
||
headPic?: string;
|
||
// 备案资料
|
||
sfzrxy?: string; // 身份证人像页
|
||
sfzghy?: string; // 身份证国徽页
|
||
dyxlbyz?: string; // 第一学历毕业证
|
||
dyxlxwz?: string; // 第一学历学位证
|
||
zgxlbyz?: string; // 最高学历毕业证
|
||
zgxlxwz?: string; // 最高学历学位证
|
||
pthzm?: string; // 普通话证明
|
||
jszgz?: string; // 教师资格证
|
||
}
|
||
|
||
const teacherId = ref("");
|
||
const teacher = ref<Teacher>({});
|
||
const loading = ref(false);
|
||
|
||
// 各模块数据
|
||
const zcxxList = ref<any[]>([]); // 职称信息
|
||
const gwqkList = ref<any[]>([]); // 岗位情况(任岗情况)
|
||
const gzjlList = ref<any[]>([]); // 工作经历
|
||
const jtcyList = ref<any[]>([]); // 家庭成员
|
||
|
||
// 职务数据
|
||
const dzZwList = ref<any[]>([]); // 党政职务列表
|
||
const qtZwList = ref<any[]>([]); // 其他职务列表
|
||
|
||
// 计算是否有任何备案资料
|
||
const hasAnyDocument = computed(() => {
|
||
return !!(
|
||
teacher.value.sfzrxy ||
|
||
teacher.value.sfzghy ||
|
||
teacher.value.dyxlbyz ||
|
||
teacher.value.dyxlxwz ||
|
||
teacher.value.zgxlbyz ||
|
||
teacher.value.zgxlxwz ||
|
||
teacher.value.pthzm ||
|
||
teacher.value.jszgz
|
||
);
|
||
});
|
||
|
||
// 性别解析
|
||
const parseGender = (jsxbId?: string) => {
|
||
if (!jsxbId) return '-';
|
||
if (jsxbId === '1' || jsxbId === '男') return '男';
|
||
if (jsxbId === '2' || jsxbId === '女') return '女';
|
||
return jsxbId;
|
||
};
|
||
|
||
// 职务ID转名称(支持单个或多个,逗号分隔)
|
||
const parseZwNames = (zwIds?: string, zwList: any[] = []) => {
|
||
if (!zwIds || !zwIds.trim()) return '-';
|
||
|
||
// 分割多个职务ID
|
||
const idArray = zwIds.split(',').map(id => id.trim()).filter(id => id);
|
||
|
||
// 将ID转换为名称
|
||
const names = idArray.map(id => {
|
||
const zw = zwList.find(item => item.id === id || item.id === parseInt(id));
|
||
return zw ? zw.zwmc : id;
|
||
}).filter(name => name);
|
||
|
||
return names.length > 0 ? names.join('、') : '-';
|
||
};
|
||
|
||
// 党政职务名称
|
||
const dzzwNames = computed(() => parseZwNames(teacher.value.dzzw, dzZwList.value));
|
||
|
||
// 其他职务名称
|
||
const qtzwNames = computed(() => parseZwNames(teacher.value.qtzw, qtZwList.value));
|
||
|
||
// 日期格式化(YYYY-MM-DD)
|
||
const formatDate = (dateStr?: string) => {
|
||
if (!dateStr) return '-';
|
||
try {
|
||
return dayjs(dateStr).format('YYYY-MM-DD');
|
||
} catch (error) {
|
||
return '-';
|
||
}
|
||
};
|
||
|
||
// 月份格式化(YYYY-MM)
|
||
const formatMonth = (dateStr?: string) => {
|
||
if (!dateStr) return '-';
|
||
try {
|
||
return dayjs(dateStr).format('YYYY-MM');
|
||
} catch (error) {
|
||
return '-';
|
||
}
|
||
};
|
||
|
||
// 解析图片路径(支持单张或多张,逗号分隔)
|
||
const parseImagePaths = (pathStr?: string): string[] => {
|
||
if (!pathStr) return [];
|
||
return pathStr.split(',').map(path => path.trim()).filter(path => path);
|
||
};
|
||
|
||
// 获取完整图片URL
|
||
const getImageUrl = (path: string): string => {
|
||
if (!path) return '';
|
||
// 如果是完整URL,直接返回
|
||
if (path.startsWith('http://') || path.startsWith('https://')) {
|
||
return path;
|
||
}
|
||
// 否则拼接服务器地址(使用项目配置的图片服务器地址)
|
||
return `${BASE_IMAGE_URL}${path.startsWith('/') ? path : '/' + path}`;
|
||
};
|
||
|
||
// 预览证书图片(多张)
|
||
const previewCertificate = (pathStr: string, currentIndex: number) => {
|
||
const paths = parseImagePaths(pathStr);
|
||
const urls = paths.map(path => getImageUrl(path));
|
||
|
||
if (urls.length === 0) return;
|
||
|
||
uni.previewImage({
|
||
current: currentIndex,
|
||
urls: urls,
|
||
});
|
||
};
|
||
|
||
// 预览文档(单张)
|
||
const previewDocument = (path: string) => {
|
||
if (!path) return;
|
||
|
||
const url = getImageUrl(path);
|
||
uni.previewImage({
|
||
current: 0,
|
||
urls: [url],
|
||
});
|
||
};
|
||
|
||
// 加载教师完整档案信息
|
||
const loadTeacherInfo = async () => {
|
||
if (!teacherId.value) {
|
||
uni.showToast({
|
||
title: '教师ID不能为空',
|
||
icon: 'none',
|
||
});
|
||
return;
|
||
}
|
||
|
||
loading.value = true;
|
||
try {
|
||
// 并行加载所有数据
|
||
const [basicInfoRes, zcxxRes, gwqkRes, gzjlRes, jtcyRes, dzZwRes, qtZwRes] = await Promise.all([
|
||
// 基础信息
|
||
get('/api/js/findJsById', { id: teacherId.value }),
|
||
// 职称信息
|
||
get('/api/zcxx/findPage', { jsId: teacherId.value, page: 1, rows: 100 }),
|
||
// 岗位情况
|
||
get('/api/gwqk/findPage', { jsId: teacherId.value, page: 1, rows: 100 }),
|
||
// 工作经历
|
||
get('/api/gzjl/findPage', { jsId: teacherId.value, page: 1, rows: 100 }),
|
||
// 家庭成员
|
||
get('/api/jtcy/findPage', { jsId: teacherId.value, page: 1, rows: 100 }),
|
||
// 党政职务列表
|
||
getZwListByLx('党政职务'),
|
||
// 其他职务列表
|
||
getZwListByLx('其他职务'),
|
||
]);
|
||
|
||
// 处理基础信息
|
||
if (basicInfoRes) {
|
||
// 如果有 resultCode 字段,使用 result
|
||
// 如果有 rows 数组,取第一个元素
|
||
// 否则直接使用响应数据
|
||
if (basicInfoRes.result) {
|
||
teacher.value = basicInfoRes.result as Teacher;
|
||
} else if (basicInfoRes.rows && Array.isArray(basicInfoRes.rows) && basicInfoRes.rows.length > 0) {
|
||
teacher.value = basicInfoRes.rows[0] as Teacher;
|
||
} else {
|
||
teacher.value = basicInfoRes as Teacher;
|
||
}
|
||
console.log('教师基础信息:', teacher.value);
|
||
}
|
||
|
||
// 处理职称信息
|
||
if (zcxxRes && zcxxRes.rows && Array.isArray(zcxxRes.rows)) {
|
||
zcxxList.value = zcxxRes.rows;
|
||
console.log('职称信息:', zcxxList.value);
|
||
}
|
||
|
||
// 处理岗位情况
|
||
if (gwqkRes && gwqkRes.rows && Array.isArray(gwqkRes.rows)) {
|
||
gwqkList.value = gwqkRes.rows;
|
||
console.log('岗位情况:', gwqkList.value);
|
||
}
|
||
|
||
// 处理工作经历
|
||
if (gzjlRes && gzjlRes.rows && Array.isArray(gzjlRes.rows)) {
|
||
gzjlList.value = gzjlRes.rows;
|
||
console.log('工作经历:', gzjlList.value);
|
||
}
|
||
|
||
// 处理家庭成员
|
||
if (jtcyRes && jtcyRes.rows && Array.isArray(jtcyRes.rows)) {
|
||
jtcyList.value = jtcyRes.rows;
|
||
console.log('家庭成员:', jtcyList.value);
|
||
}
|
||
|
||
// 处理党政职务列表
|
||
if (dzZwRes) {
|
||
if (dzZwRes.result && Array.isArray(dzZwRes.result)) {
|
||
dzZwList.value = dzZwRes.result;
|
||
} else if (Array.isArray(dzZwRes)) {
|
||
dzZwList.value = dzZwRes;
|
||
}
|
||
console.log('党政职务列表:', dzZwList.value);
|
||
}
|
||
|
||
// 处理其他职务列表
|
||
if (qtZwRes) {
|
||
if (qtZwRes.result && Array.isArray(qtZwRes.result)) {
|
||
qtZwList.value = qtZwRes.result;
|
||
} else if (Array.isArray(qtZwRes)) {
|
||
qtZwList.value = qtZwRes;
|
||
}
|
||
console.log('其他职务列表:', qtZwList.value);
|
||
}
|
||
|
||
} catch (error) {
|
||
console.error('加载教师档案失败:', error);
|
||
uni.showToast({
|
||
title: '网络异常,请稍后重试',
|
||
icon: 'none',
|
||
});
|
||
} finally {
|
||
loading.value = false;
|
||
}
|
||
};
|
||
|
||
// 返回上一页
|
||
const handleBack = () => {
|
||
uni.navigateBack();
|
||
};
|
||
|
||
onLoad((options: any) => {
|
||
if (options.id) {
|
||
teacherId.value = options.id;
|
||
console.log('接收到的教师ID:', teacherId.value);
|
||
}
|
||
});
|
||
|
||
onMounted(() => {
|
||
loadTeacherInfo();
|
||
});
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.teacher-profile-page {
|
||
min-height: 100vh;
|
||
background: #f4f6fb;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.profile-scroll {
|
||
flex: 1;
|
||
padding: 24rpx 0 160rpx 0; // 只有上下padding,为底部固定按钮留出空间
|
||
background-color: #f4f6fb;
|
||
}
|
||
|
||
// 加载遮罩
|
||
.loading-mask {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background: rgba(0, 0, 0, 0.5);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
z-index: 9999;
|
||
}
|
||
|
||
.loading-content {
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
padding: 48rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 24rpx;
|
||
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.15);
|
||
}
|
||
|
||
.loading-spinner {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
border: 4rpx solid #e5e7eb;
|
||
border-top-color: #3b82f6;
|
||
border-radius: 50%;
|
||
animation: spin 1s linear infinite;
|
||
}
|
||
|
||
@keyframes spin {
|
||
0% { transform: rotate(0deg); }
|
||
100% { transform: rotate(360deg); }
|
||
}
|
||
|
||
.loading-text {
|
||
font-size: 28rpx;
|
||
color: #6b7280;
|
||
font-weight: 500;
|
||
}
|
||
|
||
// 顶部卡片
|
||
.header-card {
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
border-radius: 24rpx;
|
||
padding: 48rpx 32rpx;
|
||
margin: 0 30rpx 24rpx 30rpx; // 左右30rpx留白
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
box-shadow: 0 8rpx 24rpx rgba(102, 126, 234, 0.3);
|
||
}
|
||
|
||
.avatar-wrapper {
|
||
width: 160rpx;
|
||
height: 160rpx;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
border: 6rpx solid rgba(255, 255, 255, 0.3);
|
||
margin-bottom: 24rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.2);
|
||
}
|
||
|
||
.avatar {
|
||
width: 100%;
|
||
height: 100%;
|
||
background: #e0e7ff;
|
||
}
|
||
|
||
.header-info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 12rpx;
|
||
width: 100%;
|
||
}
|
||
|
||
.teacher-name {
|
||
font-size: 40rpx;
|
||
font-weight: 700;
|
||
color: #ffffff;
|
||
text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.2);
|
||
}
|
||
|
||
.teacher-code {
|
||
font-size: 26rpx;
|
||
color: rgba(255, 255, 255, 0.9);
|
||
}
|
||
|
||
.basic-tags {
|
||
display: flex;
|
||
gap: 16rpx;
|
||
margin-top: 8rpx;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
}
|
||
|
||
.tag {
|
||
padding: 8rpx 20rpx;
|
||
border-radius: 24rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
backdrop-filter: blur(10rpx);
|
||
background: rgba(255, 255, 255, 0.25);
|
||
color: #ffffff;
|
||
border: 1px solid rgba(255, 255, 255, 0.3);
|
||
}
|
||
|
||
// 大模块容器
|
||
.section-container {
|
||
background: #ffffff;
|
||
border-radius: 16rpx;
|
||
margin: 0 30rpx 24rpx 30rpx; // 左右30rpx留白
|
||
overflow: hidden;
|
||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
|
||
}
|
||
|
||
.section-header {
|
||
background: #fafbfc;
|
||
padding: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
border-bottom: 2rpx solid #e5e7eb;
|
||
}
|
||
|
||
.section-marker {
|
||
width: 8rpx;
|
||
height: 32rpx;
|
||
background: #3b82f6;
|
||
border-radius: 4rpx;
|
||
margin-right: 16rpx;
|
||
}
|
||
|
||
.section-title {
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
color: #1f2933;
|
||
}
|
||
|
||
// 子模块
|
||
.sub-section {
|
||
padding: 24rpx;
|
||
border-bottom: 1px solid #f3f4f6;
|
||
|
||
&:last-child {
|
||
border-bottom: none;
|
||
}
|
||
}
|
||
|
||
.sub-section-header {
|
||
font-size: 28rpx;
|
||
font-weight: 600;
|
||
color: #3b82f6;
|
||
margin-bottom: 20rpx;
|
||
padding-bottom: 12rpx;
|
||
border-bottom: 2rpx solid #e0f2fe;
|
||
}
|
||
|
||
// 信息网格布局(每行4列)
|
||
.info-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 20rpx;
|
||
}
|
||
|
||
.info-item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 8rpx;
|
||
}
|
||
|
||
.info-label {
|
||
font-size: 24rpx;
|
||
color: #6b7280;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.info-value {
|
||
font-size: 28rpx;
|
||
color: #1f2933;
|
||
word-break: break-all;
|
||
line-height: 1.4;
|
||
}
|
||
|
||
// 备注内容
|
||
.remark-content {
|
||
padding: 24rpx;
|
||
}
|
||
|
||
.remark-text {
|
||
font-size: 28rpx;
|
||
color: #1f2933;
|
||
line-height: 1.8;
|
||
white-space: pre-wrap;
|
||
}
|
||
|
||
// 备案资料
|
||
.document-wrapper {
|
||
padding: 24rpx;
|
||
}
|
||
|
||
.document-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 24rpx;
|
||
margin-bottom: 24rpx;
|
||
}
|
||
|
||
.document-item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 12rpx;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.document-image {
|
||
width: 100%;
|
||
height: 280rpx;
|
||
border-radius: 12rpx;
|
||
border: 2px solid #e5e7eb;
|
||
background: #f8f9fa;
|
||
transition: all 0.3s;
|
||
|
||
&:active {
|
||
transform: scale(0.95);
|
||
opacity: 0.8;
|
||
}
|
||
}
|
||
|
||
.document-label {
|
||
font-size: 26rpx;
|
||
color: #6b7280;
|
||
font-weight: 500;
|
||
text-align: center;
|
||
}
|
||
|
||
// 列表容器
|
||
.list-wrapper {
|
||
padding: 24rpx;
|
||
}
|
||
|
||
.list-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 20rpx;
|
||
}
|
||
|
||
.list-item {
|
||
background: #f8f9fb;
|
||
border-radius: 12rpx;
|
||
overflow: hidden;
|
||
border: 1px solid #e5e7eb;
|
||
transition: all 0.3s;
|
||
}
|
||
|
||
.list-item-header {
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
padding: 20rpx 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16rpx;
|
||
}
|
||
|
||
.item-badge {
|
||
width: 44rpx;
|
||
height: 44rpx;
|
||
border-radius: 50%;
|
||
background: rgba(255, 255, 255, 0.25);
|
||
backdrop-filter: blur(10rpx);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 24rpx;
|
||
font-weight: 600;
|
||
color: #ffffff;
|
||
border: 2px solid rgba(255, 255, 255, 0.3);
|
||
}
|
||
|
||
.item-title {
|
||
flex: 1;
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
color: #ffffff;
|
||
text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.15);
|
||
}
|
||
|
||
.list-item-body {
|
||
padding: 24rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 16rpx;
|
||
background: #ffffff;
|
||
}
|
||
|
||
.item-row {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-start;
|
||
padding-bottom: 16rpx;
|
||
border-bottom: 1px solid #f3f4f6;
|
||
|
||
&:last-child {
|
||
padding-bottom: 0;
|
||
border-bottom: none;
|
||
}
|
||
|
||
&.item-row-column {
|
||
flex-direction: column;
|
||
align-items: stretch;
|
||
gap: 16rpx;
|
||
}
|
||
}
|
||
|
||
.item-label {
|
||
font-size: 26rpx;
|
||
color: #6b7280;
|
||
font-weight: 500;
|
||
min-width: 180rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.item-value {
|
||
flex: 1;
|
||
font-size: 28rpx;
|
||
color: #1f2933;
|
||
text-align: right;
|
||
word-break: break-all;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
// 证书图片容器
|
||
.certificate-images {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 16rpx;
|
||
margin-top: 8rpx;
|
||
}
|
||
|
||
.certificate-image {
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
border-radius: 12rpx;
|
||
border: 2px solid #e5e7eb;
|
||
background: #f8f9fa;
|
||
transition: all 0.3s;
|
||
|
||
&:active {
|
||
transform: scale(0.95);
|
||
opacity: 0.8;
|
||
}
|
||
}
|
||
|
||
.empty-tip {
|
||
text-align: center;
|
||
padding: 64rpx;
|
||
color: #9ca3af;
|
||
font-size: 26rpx;
|
||
background: #f8f9fa;
|
||
border-radius: 12rpx;
|
||
}
|
||
|
||
// 固定底部按钮
|
||
.fixed-bottom {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
background: #ffffff;
|
||
padding: 24rpx;
|
||
box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.08);
|
||
z-index: 100;
|
||
}
|
||
|
||
.back-btn {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
line-height: 88rpx;
|
||
background: #3b82f6;
|
||
color: #ffffff;
|
||
border: none;
|
||
border-radius: 16rpx;
|
||
font-size: 32rpx;
|
||
font-weight: 600;
|
||
box-shadow: 0 4rpx 16rpx rgba(59, 130, 246, 0.3);
|
||
transition: all 0.3s;
|
||
|
||
&:hover {
|
||
background: #2563eb;
|
||
box-shadow: 0 6rpx 20rpx rgba(59, 130, 246, 0.4);
|
||
}
|
||
|
||
&:active {
|
||
transform: scale(0.98);
|
||
background: #1d4ed8;
|
||
}
|
||
}
|
||
</style>
|
||
|