我的资料,工资条,我的绩效样式修改

This commit is contained in:
2026-09-24 14:22:35 +08:00
parent 365bba0555
commit 5e77d4fdb1
3 changed files with 119 additions and 42 deletions
+26 -13
View File
@@ -1,32 +1,45 @@
<template>
<view class="page">
<view class="page edge">
<fy-header title="我的绩效" back />
<view v-if="!rows.length" class="empty">暂无绩效记录</view>
<view v-for="r in rows" :key="r.id || r.period" class="card item">
<text class="t">{{ r.period || r.quarter || '绩效' }}</text>
<text class="s">评级 {{ r.grade || r.level || '-' }} · {{ r.score || '' }}</text>
</view>
<fy-scroll class="edge-scroll" @refresh="load">
<wd-status-tip v-if="!rows.length" image="content" tip="暂无绩效记录" />
<view v-for="r in rows" :key="r.id || r.period" class="card item">
<view class="main">
<text class="t">{{ r.period || r.quarter || '绩效' }}</text>
<text v-if="scoreOf(r)" class="s">得分 {{ scoreOf(r) }}</text>
</view>
<text class="chip">{{ r.grade || r.level || '-' }}</text>
</view>
</fy-scroll>
</view>
</template>
<script>
import FyHeader from '../../components/fy-header.vue'
import FyScroll from '../../components/fy-scroll.vue'
import { store } from '../../utils/store.js'
import { asList } from '../../utils/format.js'
import { oaGet } from '../../utils/api.js'
export default {
components: { FyHeader },
components: { FyHeader, FyScroll },
data() { return { rows: [] } },
onShow() {
oaGet('/profile/performance', store.token).then((d) => { this.rows = asList(d) }).catch(() => { this.rows = [] })
onShow() { this.load() },
methods: {
load() {
oaGet('/profile/performance', store.token).then((d) => { this.rows = asList(d) }).catch(() => { this.rows = [] })
},
scoreOf(r) {
if (r.score == null || r.score === '') return ''
return String(r.score)
}
}
}
</script>
<style scoped>
.item { margin: 16rpx 24rpx; padding: 24rpx; }
.t { display: block; font-weight: 600; }
.s { font-size: 24rpx; color: #6B7280; }
.empty { padding: 80rpx; text-align: center; color: #6B7280; }
.item { margin: 16rpx 24rpx; padding: 28rpx 24rpx; display: flex; align-items: center; }
.main { flex: 1; min-width: 0; }
.t { display: block; font-size: 30rpx; font-weight: 650; color: #111827; }
.s { display: block; margin-top: 8rpx; font-size: 24rpx; color: #6B7280; }
</style>