138 lines
4.1 KiB
Vue
138 lines
4.1 KiB
Vue
<template>
|
|
<div v-loading="loading" class="page-card doctor-submission-detail">
|
|
<!-- 面包屑 (标准: 首页 / 分类 / 当前页) -->
|
|
<div class="breadcrumb">首页 / 我的项目设计投稿 / 投稿详情</div>
|
|
|
|
<!-- 表单 (只读, 用 el-input readonly 展示) -->
|
|
<el-form label-width="120px" class="readonly-form">
|
|
<el-row :gutter="12">
|
|
<el-col :span="12">
|
|
<el-form-item label="策划方案名称">
|
|
<el-input :model-value="display.planName" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="项目方向">
|
|
<el-input :model-value="display.planDirectionTitle" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="12">
|
|
<el-col :span="12">
|
|
<el-form-item label="项目形式">
|
|
<el-input :model-value="display.projectForm" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="项目类别">
|
|
<el-input :model-value="display.planCategory" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="12">
|
|
<el-col :span="24">
|
|
<el-form-item label="设计文件">
|
|
<div class="readonly-cell">
|
|
<template v-if="detail.designFileUrl">
|
|
<el-link :href="detail.designFileUrl" :download="detail.planName || '设计文件'" target="_blank" type="primary">下载</el-link>
|
|
</template>
|
|
<span v-else>-</span>
|
|
</div>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="12">
|
|
<el-col :span="24">
|
|
<el-form-item label="备注">
|
|
<el-input :model-value="display.remark" type="textarea" :rows="4" readonly />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
|
|
<!-- 操作按钮 -->
|
|
<div class="detail-actions">
|
|
<el-button @click="goBack">返回</el-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed, onMounted } from 'vue'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import { ElMessage } from 'element-plus'
|
|
import request from '@/utils/request'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
|
|
const loading = ref(false)
|
|
const detail = ref({})
|
|
|
|
// 显示用: 空值显示 "-"
|
|
function fmt(v) {
|
|
if (v === null || v === undefined || v === '') return '-'
|
|
return v
|
|
}
|
|
|
|
const display = computed(() => ({
|
|
planName: fmt(detail.value.planName),
|
|
planDirectionTitle: fmt(detail.value.planDirectionTitle || detail.value.planDirection),
|
|
projectForm: fmt(detail.value.projectForm),
|
|
planCategory: fmt(detail.value.planCategory),
|
|
remark: fmt(detail.value.remark)
|
|
}))
|
|
|
|
function goBack() {
|
|
router.push({ path: '/doctor/submissions', query: { _t: Date.now() } })
|
|
}
|
|
|
|
async function load() {
|
|
const planId = route.params.planId
|
|
if (!planId) { ElMessage.warning('参数缺失'); goBack(); return }
|
|
loading.value = true
|
|
try {
|
|
const res = await request.get(`/business/projectPlan/${planId}`, { __silentError: true })
|
|
if (res?.code === 200) {
|
|
detail.value = res.data || {}
|
|
} else {
|
|
ElMessage.error(res?.msg || '加载失败')
|
|
}
|
|
} catch (e) {
|
|
console.error('[submission-detail] load failed', e)
|
|
ElMessage.error(e?.msg || '加载失败')
|
|
} finally {
|
|
loading.value = false
|
|
}
|
|
}
|
|
|
|
onMounted(load)
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* 整页面板 (详情页标准: max-width 1200px) */
|
|
.doctor-submission-detail { max-width: 1200px; padding: 16px; }
|
|
.breadcrumb { font-size: 13px; color: #8c8c8c; margin-bottom: 16px; }
|
|
|
|
/* 只读表单样式 - 模拟 el-input 视觉, 但只显示文字 */
|
|
.readonly-form :deep(.el-form-item) { margin-bottom: 22px; }
|
|
.readonly-form :deep(.el-form-item__label) { color: #606266; font-weight: normal; }
|
|
|
|
.readonly-cell {
|
|
min-height: 40px;
|
|
line-height: 38px;
|
|
padding: 0 14px;
|
|
background: #fafafa;
|
|
border: 1px solid #e8e8e8;
|
|
border-radius: 4px;
|
|
color: #262626;
|
|
font-size: 14px;
|
|
word-break: break-all;
|
|
}
|
|
.readonly-form :deep(.el-link) { font-weight: 500; }
|
|
|
|
.detail-actions { margin-top: 16px; }
|
|
</style> |