fix:施工立项项目内容中,项目详情初步实现,但是还存在一些问题
This commit is contained in:
parent
6d9c33f7c2
commit
ef44f64861
|
@ -70,6 +70,6 @@ declare global {
|
|||
// for type re-export
|
||||
declare global {
|
||||
// @ts-ignore
|
||||
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
|
||||
export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
|
||||
import('vue')
|
||||
}
|
||||
|
|
|
@ -3,22 +3,22 @@ import { computed } from 'vue'
|
|||
import WindTurbine from './icons/WindTurbine.vue'
|
||||
|
||||
interface Turbine {
|
||||
id: number
|
||||
turbineNo: string
|
||||
status: 0 | 1 | 2 // 0 待施工 1 施工中 2 已完成
|
||||
lat?: number
|
||||
lng?: number
|
||||
id: number
|
||||
turbineNo: string
|
||||
status: 0 | 1 | 2 // 0 待施工 1 施工中 2 已完成
|
||||
lat?: number
|
||||
lng?: number
|
||||
}
|
||||
|
||||
const props = defineProps<{ modelValue: Turbine }>()
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:modelValue', v: Turbine): void
|
||||
(e: 'map'): void
|
||||
(e: 'update:modelValue', v: Turbine): void
|
||||
(e: 'map'): void
|
||||
}>()
|
||||
|
||||
const turbine = computed({
|
||||
get: () => props.modelValue,
|
||||
set: v => emit('update:modelValue', v)
|
||||
get: () => props.modelValue,
|
||||
set: (v) => emit('update:modelValue', v),
|
||||
})
|
||||
|
||||
/* 状态文字 & 颜色 */
|
||||
|
@ -27,34 +27,36 @@ const statusColorMap = { 0: '#FF7D00', 1: '#165DFF', 2: '#00B42A' }
|
|||
|
||||
/* 点击循环切换 */
|
||||
function toggleStatus() {
|
||||
const next = ((turbine.value.status + 1) % 3) as 0 | 1 | 2
|
||||
turbine.value = { ...turbine.value, status: next }
|
||||
const next = ((turbine.value.status + 1) % 3) as 0 | 1 | 2
|
||||
turbine.value = { ...turbine.value, status: next }
|
||||
}
|
||||
|
||||
function updateNo(val: string) {
|
||||
turbine.value = { ...turbine.value, turbineNo: val }
|
||||
turbine.value = { ...turbine.value, turbineNo: val }
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="turbine-card">
|
||||
<!-- 可点击的状态标签 -->
|
||||
<div class="status-tag" :style="{ backgroundColor: statusColorMap[turbine.status] }" @click="toggleStatus">
|
||||
{{ statusTextMap[turbine.status] }}
|
||||
</div>
|
||||
|
||||
<!-- 风机图标 -->
|
||||
<WindTurbine />
|
||||
|
||||
<!-- 机组编号输入框 -->
|
||||
<a-input :model-value="turbine.turbineNo" @update:model-value="updateNo" size="small" class="turbine-input"
|
||||
placeholder="编号" />
|
||||
|
||||
<!-- 地图选点按钮 -->
|
||||
<a-button size="mini" @click="$emit('map')">
|
||||
<template #icon><icon-location /></template>
|
||||
</a-button>
|
||||
<div class="turbine-card">
|
||||
<!-- 可点击的状态标签 -->
|
||||
<div class="status-tag" :style="{ backgroundColor: statusColorMap[turbine.status] }" @click="toggleStatus">
|
||||
{{ statusTextMap[turbine.status] }}
|
||||
</div>
|
||||
|
||||
<!-- 风机图标 -->
|
||||
<WindTurbine />
|
||||
|
||||
<!-- 机组编号输入框 -->
|
||||
<a-input
|
||||
:model-value="turbine.turbineNo" size="small" class="turbine-input" placeholder="编号"
|
||||
@update:model-value="updateNo"
|
||||
/>
|
||||
|
||||
<!-- 地图选点按钮 -->
|
||||
<a-button size="mini" @click="$emit('map')">
|
||||
<template #icon><icon-location /></template>
|
||||
</a-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
@ -85,4 +87,4 @@ function updateNo(val: string) {
|
|||
margin-top: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
@ -347,6 +347,53 @@
|
|||
</a-upload>
|
||||
</div>
|
||||
</a-modal>
|
||||
|
||||
<!-- 详情弹窗 -->
|
||||
<a-modal
|
||||
v-model:visible="detailVisible"
|
||||
title="项目详情"
|
||||
width="900px"
|
||||
:footer="false"
|
||||
:mask-closable="false"
|
||||
>
|
||||
<a-spin :loading="detailLoading">
|
||||
<a-descriptions :column="2" bordered :label-style="{ width: '140px', fontWeight: 'bold' }">
|
||||
<a-descriptions-item label="项目名称" :span="2">{{ detailData.projectName || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="项目编号">{{ detailData.projectCode || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="状态">
|
||||
<a-tag v-if="detailData.status !== undefined" :color="getStatusColor(detailData.status)">
|
||||
{{ PROJECT_STATUS_MAP[detailData.status] || detailData.statusLabel || '-' }}
|
||||
</a-tag>
|
||||
</a-descriptions-item>
|
||||
<a-descriptions-item label="项目类型">{{ detailData.projectCategory || '-' }}</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="业主">{{ detailData.inspectionUnit || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="业主联系人">{{ detailData.inspectionContact || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="业主电话">{{ detailData.inspectionPhone || '-' }}</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="委托单位">{{ detailData.client || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="委托联系人">{{ detailData.clientContact || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="委托电话">{{ detailData.clientPhone || '-' }}</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="风场名称">{{ detailData.farmName || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="风场地址">{{ detailData.farmAddress || '-' }}</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="项目经理">{{ detailData.projectManagerName || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="项目规模">{{ detailData.scale || detailData.projectScale || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="风机型号">{{ detailData.turbineModel || '-' }}</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="开始时间">{{ detailData.startDate || '-' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="结束时间">{{ detailData.endDate || '-' }}</a-descriptions-item>
|
||||
|
||||
<a-descriptions-item label="项目简介" :span="2">
|
||||
<a-typography-paragraph :ellipsis="{ rows: 3, expandable: true, collapseText: '收起', expandText: '展开' }">
|
||||
{{ detailData.projectIntro || '-' }}
|
||||
</a-typography-paragraph>
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</a-spin>
|
||||
</a-modal>
|
||||
|
||||
</GiPageLayout>
|
||||
</template>
|
||||
|
||||
|
@ -412,6 +459,12 @@ const dataList = ref<T.ProjectResp[]>([])
|
|||
const userLoading = ref(false)
|
||||
const userOptions = ref<{ label: string, value: string }[]>([])
|
||||
|
||||
|
||||
// 详情弹窗状态
|
||||
const detailVisible = ref(false)
|
||||
const detailLoading = ref(false)
|
||||
const detailData = ref<any>({})
|
||||
|
||||
const searchForm = reactive<Partial<ProjectPageQuery>>({
|
||||
projectName: '',
|
||||
status: undefined,
|
||||
|
@ -979,19 +1032,29 @@ const deleteItem = async (record: T.ProjectResp) => {
|
|||
}
|
||||
}
|
||||
|
||||
const viewDetail = (record: T.ProjectResp) => {
|
||||
const viewDetail = async (record: T.ProjectResp) => {
|
||||
const projectId = record.id || record.projectId
|
||||
if (!projectId) {
|
||||
Message.error('项目ID不存在')
|
||||
return
|
||||
}
|
||||
|
||||
router.push({
|
||||
name: 'ProjectDetail',
|
||||
params: {
|
||||
id: projectId.toString(),
|
||||
},
|
||||
})
|
||||
detailVisible.value = true
|
||||
detailLoading.value = true
|
||||
try {
|
||||
// /project/detail/{projectId}
|
||||
const res = await getProjectDetail(projectId)
|
||||
const data = (res as any).data || res || {}
|
||||
// 若后端返回status为数字,补充状态文案
|
||||
if (typeof data.status === 'number' && !data.statusLabel) {
|
||||
data.statusLabel = PROJECT_STATUS_MAP[data.status]
|
||||
}
|
||||
detailData.value = data
|
||||
} catch (e) {
|
||||
console.error('获取项目详情失败:', e)
|
||||
Message.error('获取项目详情失败')
|
||||
} finally {
|
||||
detailLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const openImportModal = () => {
|
||||
|
|
Loading…
Reference in New Issue