<template>
|
<view class="container">
|
<view class="header">
|
<text class="title">{{ projectInfo.projectName || '项目详情' }}</text>
|
<text class="status-tag" :class="'status-' + projectInfo.status">
|
{{ getDictLabel('sys_project_status', projectInfo.status) }}
|
</text>
|
</view>
|
|
<view class="detail-card">
|
<view class="info-item">
|
<text class="label">项目名称：</text>
|
<text class="value">{{ projectInfo.projectName || '-' }}</text>
|
</view>
|
<view class="info-item">
|
<text class="label">项目类型：</text>
|
<text class="value">{{ getDictLabel('sys_project_type', projectInfo.projectType) }}</text>
|
</view>
|
<view class="info-item">
|
<text class="label">主管部门：</text>
|
<text class="value">{{ projectInfo.competentDepartmentName || '-' }}</text>
|
</view>
|
<view class="info-item">
|
<text class="label">业主单位：</text>
|
<text class="value">{{ projectInfo.projectOwnerUnitName || '-' }}</text>
|
</view>
|
<view class="info-item">
|
<text class="label">年份：</text>
|
<text class="value">{{ projectInfo.year ? projectInfo.year + '年' : '-' }}</text>
|
</view>
|
<view class="info-item">
|
<text class="label">投资额：</text>
|
<text class="value highlight">{{ projectInfo.investmentAmount || 0 }} 万</text>
|
</view>
|
<view class="info-item vertical">
|
<text class="label">建设内容：</text>
|
<text class="value content-text">{{ projectInfo.buildContent || '暂无内容' }}</text>
|
</view>
|
</view>
|
|
<view class="action-bar">
|
<button v-if="projectInfo.processInsId" class="btn primary" @click="goToFlow">查看流程</button>
|
<button class="btn default" @click="goBack">返回列表</button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { getDicts } from '@/api/data.js'
|
export default {
|
data() {
|
return {
|
projectInfo: {},
|
dicts: ['sys_project_type'],
|
dict: {
|
type: {
|
sys_project_type: [
|
{ label: '新建', value: '1' },
|
{ label: '扩建', value: '2' },
|
{ label: '改建', value: '3' }
|
],
|
sys_project_status: [
|
{ label: '未开工', value: '0' },
|
{ label: '已开工', value: '1' },
|
{ label: '已完工', value: '2' }
|
]
|
}
|
}
|
}
|
},
|
onLoad(options) {
|
if (options.data) {
|
try {
|
this.projectInfo = JSON.parse(decodeURIComponent(options.data))
|
} catch (e) {
|
console.error('解析项目数据失败', e)
|
}
|
}
|
this.initDict();
|
},
|
methods: {
|
async initDict(){
|
const res = await getDicts(this.dicts)
|
if(res.statusCode ===200){
|
this.dict.type.sys_project_type =res.data.data;
|
console.log(this.dict)
|
}
|
},
|
getDictLabel(dictType, value) {
|
const options = this.dict.type[dictType] || []
|
const option = options.find(opt => opt.dictValue == value)
|
return option ? option.dictLabel : value
|
},
|
goBack() {
|
uni.navigateBack()
|
},
|
goToFlow() {
|
uni.navigateTo({
|
url: `/subpackage/flowable/task-process?procInsId=${this.projectInfo.processInsId}&projectId=${this.projectInfo.id}&isWait=false`
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.container {
|
min-height: 100vh;
|
background-color: #f5f7fa;
|
padding: 30rpx;
|
}
|
.header {
|
display: flex;
|
justify-content: space-between;
|
align-items: flex-start;
|
margin-bottom: 30rpx;
|
}
|
.title {
|
font-size: 36rpx;
|
font-weight: bold;
|
color: #333;
|
flex: 1;
|
}
|
.status-tag {
|
font-size: 24rpx;
|
padding: 4rpx 16rpx;
|
border-radius: 4rpx;
|
background-color: #eee;
|
color: #999;
|
margin-left: 20rpx;
|
}
|
.status-1 { background-color: #E8F5E9; color: #4CAF50; }
|
.status-2 { background-color: #FFF3E0; color: #FF9800; }
|
|
.detail-card {
|
background-color: #fff;
|
border-radius: 16rpx;
|
padding: 30rpx;
|
box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.04);
|
}
|
.info-item {
|
display: flex;
|
margin-bottom: 24rpx;
|
line-height: 1.6;
|
}
|
.info-item.vertical {
|
flex-direction: column;
|
}
|
.label {
|
width: 160rpx;
|
color: #999;
|
font-size: 28rpx;
|
flex-shrink: 0;
|
}
|
.value {
|
flex: 1;
|
color: #333;
|
font-size: 28rpx;
|
}
|
.highlight {
|
color: #f44336;
|
font-weight: bold;
|
}
|
.content-text {
|
margin-top: 10rpx;
|
color: #666;
|
}
|
|
.action-bar {
|
margin-top: 50rpx;
|
display: flex;
|
flex-direction: column;
|
gap: 20rpx;
|
}
|
.btn {
|
width: 100%;
|
height: 88rpx;
|
line-height: 88rpx;
|
border-radius: 44rpx;
|
font-size: 32rpx;
|
}
|
.btn.primary {
|
background-color: #1E88E5;
|
color: #fff;
|
}
|
.btn.default {
|
background-color: #fff;
|
color: #666;
|
border: 1rpx solid #ddd;
|
}
|
</style>
|
