2026-06-12 11:02:01 +08:00

80 lines
3.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="hcd-page" v-if="info.id">
<view class="hcd-card">
<view class="hcd-status" :class="'st' + info.status">{{ statusText(info.status) }}</view>
<view class="hcd-name">{{ info.contract_name }}</view>
<view class="hcd-no">合同编号{{ info.contract_no }}</view>
</view>
<view class="hcd-block">
<view class="hcd-item"><text class="hcd-label">月薪</text><text class="hcd-val amount">¥{{ info.month_amount }}</text></view>
<view class="hcd-item"><text class="hcd-label">账单日</text><text class="hcd-val">每月 {{ info.pay_day }} </text></view>
<view class="hcd-item"><text class="hcd-label">结算方式</text><text class="hcd-val">{{ info.settle_mode === 1 ? '平台月账单' : '线下自付' }}</text></view>
<view class="hcd-item"><text class="hcd-label">合同开始</text><text class="hcd-val">{{ fmtDate(info.start_date) }}</text></view>
<view class="hcd-item"><text class="hcd-label">合同结束</text><text class="hcd-val">{{ fmtDate(info.end_date) }}</text></view>
<view class="hcd-item"><text class="hcd-label">联系人</text><text class="hcd-val">{{ info.contact_name || '-' }}</text></view>
<view class="hcd-item"><text class="hcd-label">联系电话</text><text class="hcd-val">{{ info.contact_phone || '-' }}</text></view>
<view class="hcd-item"><text class="hcd-label">服务地址</text><text class="hcd-val">{{ info.service_address || '-' }}</text></view>
<view class="hcd-item" v-if="info.remark"><text class="hcd-label">备注</text><text class="hcd-val">{{ info.remark }}</text></view>
</view>
<view class="hcd-block" v-if="info.file_url">
<view class="hcd-file" @tap="openFile">查看已签合同</view>
</view>
</view>
</template>
<script>
import { request, picUrl } from '@/utils'
import { apiArr } from '@/api/homeService'
export default {
data() {
return { picUrl, id: 0, info: {} }
},
onLoad(options) {
this.id = Number(options.id)
this.loadInfo()
},
methods: {
loadInfo() {
const userId = uni.getStorageSync('userId')
request(apiArr.contractInfo, 'POST', { id: this.id, user_id: userId }, {}, false).then(res => {
this.info = res || {}
})
},
statusText(s) {
const map = { 1: '待签署', 2: '生效中', 3: '已到期', 4: '已解除', 5: '线下结算' }
return map[s] || ''
},
fmtDate(v) {
return v ? String(v).slice(0, 10) : '-'
},
openFile() {
const url = this.info.file_url.startsWith('http') ? this.info.file_url : this.picUrl + this.info.file_url
uni.downloadFile({
url,
success: (d) => {
uni.openDocument({ filePath: d.tempFilePath, showMenu: true })
},
fail: () => uni.showToast({ title: '打开失败', icon: 'none' })
})
}
}
}
</script>
<style scoped>
.hcd-page { background: #f5f5f5; min-height: 100vh; padding: 20rpx; }
.hcd-card { background: #fff; border-radius: 16rpx; padding: 28rpx; margin-bottom: 20rpx; }
.hcd-status { font-size: 26rpx; color: #FF370B; margin-bottom: 12rpx; }
.hcd-status.st2 { color: #07c160; }
.hcd-status.st3, .hcd-status.st4 { color: #999; }
.hcd-name { font-size: 34rpx; color: #222; font-weight: 600; }
.hcd-no { font-size: 26rpx; color: #888; margin-top: 10rpx; }
.hcd-block { background: #fff; border-radius: 16rpx; padding: 8rpx 28rpx; margin-bottom: 20rpx; }
.hcd-item { display: flex; justify-content: space-between; padding: 22rpx 0; border-bottom: 1rpx solid #f2f2f2; }
.hcd-label { font-size: 28rpx; color: #888; }
.hcd-val { font-size: 28rpx; color: #222; max-width: 460rpx; text-align: right; }
.hcd-val.amount { color: #FF370B; font-weight: 600; }
.hcd-file { text-align: center; color: #2b6cff; font-size: 28rpx; padding: 24rpx 0; }
</style>