52 lines
1.8 KiB
Vue
52 lines
1.8 KiB
Vue
<template>
|
|
<view class="page edge">
|
|
<fy-header title="工资条" back />
|
|
<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.month" class="card item">
|
|
<view class="main">
|
|
<text class="t">{{ r.month || r.period || '工资条' }}</text>
|
|
<text class="s">应发 {{ money(r.gross || r.shouldPay) }}</text>
|
|
</view>
|
|
<view class="amt">
|
|
<text class="lab">实发</text>
|
|
<text class="num">{{ money(r.net || r.actual) }}</text>
|
|
</view>
|
|
</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, FyScroll },
|
|
data() { return { rows: [] } },
|
|
onShow() { this.load() },
|
|
methods: {
|
|
load() {
|
|
oaGet('/profile/payslips', store.token).then((d) => { this.rows = asList(d) }).catch(() => { this.rows = [] })
|
|
},
|
|
money(v) {
|
|
if (v === 0) return '0'
|
|
return v == null || v === '' ? '-' : String(v)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.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; }
|
|
.amt { text-align: right; margin-left: 16rpx; }
|
|
.lab { display: block; font-size: 22rpx; color: #6B7280; }
|
|
.num { display: block; margin-top: 4rpx; font-size: 32rpx; font-weight: 700; color: #1677FF; }
|
|
</style>
|