This commit is contained in:
huangchenhao 2026-04-13 15:41:49 +08:00
commit 3c916bfbbd
3 changed files with 47 additions and 22 deletions

View File

@ -30,7 +30,11 @@
<div class="info-item">
<span class="info-dot"></span>
<span class="info-label">影响点等级</span>
<span class="info-value level-tag" :class="basicInfo.levelClass">{{ basicInfo.level }}</span>
<span
class="info-value level-tag"
:class="basicInfo.levelClass"
>{{ basicInfo.level }}</span
>
</div>
<div class="info-item">
<span class="info-dot"></span>
@ -47,7 +51,11 @@
<div class="info-item">
<span class="info-dot"></span>
<span class="info-label">风险点描述</span>
<span class="info-value" :class="getStatusClass(basicInfo.riskDesc)">{{ basicInfo.riskDesc }}</span>
<span
class="info-value"
:class="getStatusClass(basicInfo.riskDesc)"
>{{ basicInfo.riskDesc }}</span
>
</div>
<div class="info-item">
<span class="info-dot"></span>
@ -83,7 +91,11 @@
填报动态信息
</div>
<div class="timeline-list">
<div v-for="(record, index) in dynamicRecords" :key="index" class="timeline-item">
<div
v-for="(record, index) in dynamicRecords"
:key="index"
class="timeline-item"
>
<div class="timeline-marker">{{ index + 1 }}</div>
<div class="timeline-content">
<div class="timeline-header">
@ -101,13 +113,21 @@
<div class="detail-row">
<span class="detail-label">现场情况描述</span>
<span class="detail-value">{{ record.description }}</span>
<div v-if="record.image" class="detail-image" @click="previewImage(record.image)">
<div
v-if="record.image"
class="detail-image"
@click="previewImage(record.image)"
>
<img :src="record.image" alt="现场照片" />
</div>
</div>
<div class="detail-row">
<span class="detail-label">是否发现问题</span>
<span class="detail-value" :class="record.hasProblem ? 'status-yes' : 'status-no'">{{ record.hasProblem ? '是' : '否' }}</span>
<span
class="detail-value"
:class="record.hasProblem ? 'status-yes' : 'status-no'"
>{{ record.hasProblem ? "是" : "否" }}</span
>
</div>
</div>
</div>
@ -118,7 +138,11 @@
</base-dialog>
<!-- 图片预览弹窗 -->
<div v-if="previewVisible" class="image-preview-overlay" @click="closePreview">
<div
v-if="previewVisible"
class="image-preview-overlay"
@click="closePreview"
>
<div class="image-preview-container" @click.stop>
<img :src="previewImageUrl" alt="预览" />
<div class="close-preview-btn" @click="closePreview">
@ -154,7 +178,8 @@ const basicInfo = ref({
roadCode: "G348",
location: "丁吴路(K116+656至K116+739)",
riskDesc: "未回应",
discoverTime: "立即启动防汛Ⅰ级应急响应,立即转移危险区群众,医疗机构做好应急准备",
discoverTime:
"立即启动防汛Ⅰ级应急响应,立即转移危险区群众,医疗机构做好应急准备",
});
//
@ -165,7 +190,7 @@ const photoList = ref([
//
const dynamicRecords = ref([
{
type: "隐患",
type: "首报",
patrolTime: "2026-03-28 14:30:00",
patrolPerson: "刘伟",
description: "设置警示标识,半幅通行",
@ -173,7 +198,7 @@ const dynamicRecords = ref([
image: "https://via.placeholder.com/80x60/40a9ff/ffffff?text=现场",
},
{
type: "隐患",
type: "续报",
patrolTime: "2026-03-28 14:30:00",
patrolPerson: "刘伟",
description: "设置警示标识,半幅通行",
@ -218,13 +243,11 @@ watch(
if (newVal && props.pointData) {
Object.assign(basicInfo.value, props.pointData);
}
}
},
);
</script>
<style lang="scss" scoped>
//
.section {
margin-bottom: 20px;
@ -498,6 +521,4 @@ watch(
color: #fff;
}
}
</style>

View File

@ -219,6 +219,7 @@ const showCountyCardsOnMap = (dataList) => {
emit("districtClick", {
name: countyName,
data: item,
type: item.type,
});
});
@ -1171,12 +1172,12 @@ const locateToDistrict = (countyName) => {
if (selectedLayer) {
geoJsonLayer.resetStyle(selectedLayer);
}
targetLayer.setStyle({
fillColor: "#ff7a00",
fillOpacity: 0.6,
weight: 3,
color: "#ff4d4f",
});
// targetLayer.setStyle({
// fillColor: "#ff7a00",
// fillOpacity: 0.6,
// weight: 3,
// color: "#ff4d4f",
// });
selectedLayer = targetLayer;
console.log("已定位到区县:", countyName, "中心点:", center);

View File

@ -34,7 +34,7 @@
<slot name="filter"></slot>
</div>
<!-- 数据表格 -->
<div class="table-section">
<div class="table-section" v-if="props.tableData.length > 0">
<el-table
:data="props.tableData"
:height="props.tableHeight"
@ -59,7 +59,10 @@
</div>
<!-- 分页 -->
<div class="pagination">
<div
class="pagination"
v-if="props.tableData.length > 0 && props.showPagination"
>
<el-pagination
:current-page="props.currentPage"
:page-size="props.pageSize"