175 lines
3.3 KiB
Vue
175 lines
3.3 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view class="content">
|
||
<!-- 党政职务 -->
|
||
<view class="section">
|
||
<view class="section-title">党政职务：</view>
|
||
<view class="position-display">
|
||
<text class="position-text" v-for="item in partyPositions" :key="item.id">
|
||
{{ item.name }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 其他职务 -->
|
||
<view class="section">
|
||
<view class="section-title">其他职务</view>
|
||
<view class="position-display">
|
||
<text class="position-text" v-for="item in otherPositions" :key="item.id">
|
||
{{ item.name }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 任职信息列表 -->
|
||
<view class="info-list">
|
||
<view class="info-item" v-for="item in teachingInfo" :key="item.key">
|
||
<view class="info-label">{{ item.label }}</view>
|
||
<view class="info-value">
|
||
<text :class="{ empty: item.isEmpty }">{{ item.value }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { ref } from "vue";
|
||
|
||
// 党政职务数据
|
||
const partyPositions = ref([
|
||
{ id: 1, name: "党委（总支）书记" },
|
||
{ id: 2, name: "党委（总支）副书记" },
|
||
]);
|
||
|
||
// 其他职务数据
|
||
const otherPositions = ref([{ id: 1, name: "党支部支委" }]);
|
||
|
||
// 任教任职信息
|
||
const teachingInfo = ref([
|
||
{
|
||
key: "mainSubject",
|
||
label: "主任学科",
|
||
value: "音乐",
|
||
isEmpty: false,
|
||
},
|
||
{
|
||
key: "mainClass",
|
||
label: "主任班级",
|
||
value: "未填写",
|
||
isEmpty: true,
|
||
},
|
||
{
|
||
key: "partTimeSubject",
|
||
label: "兼任学科",
|
||
value: "未填写",
|
||
isEmpty: true,
|
||
},
|
||
{
|
||
key: "partTimeClass",
|
||
label: "兼任班级",
|
||
value: "未填写",
|
||
isEmpty: true,
|
||
},
|
||
{
|
||
key: "grade",
|
||
label: "所属年级",
|
||
value: "一年级(2024级)",
|
||
isEmpty: false,
|
||
},
|
||
{
|
||
key: "headTeacherClass",
|
||
label: "所任班主任班级",
|
||
value: "8班",
|
||
isEmpty: false,
|
||
},
|
||
]);
|
||
|
||
// 返回上一页
|
||
const goBack = () => {
|
||
uni.navigateBack();
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.container {
|
||
min-height: 100vh;
|
||
background-color: #f5f5f5;
|
||
}
|
||
|
||
.content {
|
||
padding-bottom: 40rpx;
|
||
}
|
||
|
||
.section {
|
||
background-color: #ffffff;
|
||
margin-bottom: 20rpx;
|
||
padding: 30rpx;
|
||
|
||
.section-title {
|
||
font-size: 32rpx;
|
||
color: #333;
|
||
font-weight: bold;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
}
|
||
|
||
// 职务展示
|
||
.position-display {
|
||
.position-text {
|
||
display: inline-block;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
margin-right: 20rpx;
|
||
margin-bottom: 10rpx;
|
||
|
||
&:not(:last-child)::after {
|
||
content: '、';
|
||
margin-left: 0;
|
||
margin-right: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
// 信息列表
|
||
.info-list {
|
||
background-color: #ffffff;
|
||
border-radius: 16rpx;
|
||
overflow: hidden;
|
||
margin: 0 30rpx;
|
||
}
|
||
|
||
.info-item {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 30rpx;
|
||
border-bottom: 1rpx solid #f0f0f0;
|
||
|
||
&:last-child {
|
||
border-bottom: none;
|
||
}
|
||
|
||
.info-label {
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.info-value {
|
||
flex: 1;
|
||
text-align: right;
|
||
|
||
text {
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
|
||
&.empty {
|
||
color: #999;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|