响应情况弹窗筛选功能完成,预警情况弹窗增加影响区域过滤,

This commit is contained in:
fanjia 2026-04-21 17:46:30 +08:00
parent 07b5f24adf
commit fc7e3ee0a9
7 changed files with 54 additions and 19 deletions

View File

@ -65,7 +65,7 @@
</div> </div>
<!-- 照片 --> <!-- 照片 -->
<div class="section"> <div class="section" v-if="photoList.length > 0">
<div class="section-title"> <div class="section-title">
<span class="title-icon"></span> <span class="title-icon"></span>
照片 照片
@ -107,13 +107,13 @@
<div class="detail-row"> <div class="detail-row">
<span class="detail-label">现场情况描述</span> <span class="detail-label">现场情况描述</span>
<span class="detail-value">{{ record.description }}</span> <span class="detail-value">{{ record.description }}</span>
<div <!-- <div
v-if="record.image" v-if="record.image"
class="detail-image" class="detail-image"
@click="previewImage(record.image)" @click="previewImage(record.image)"
> >
<img :src="record.image" alt="现场照片" /> <img :src="record.image" alt="" />
</div> </div> -->
</div> </div>
<div class="detail-row"> <div class="detail-row">
<span class="detail-label">是否发现问题</span> <span class="detail-label">是否发现问题</span>

View File

@ -106,7 +106,7 @@
</div> </div>
</div> </div>
<div v-if="record.image" class="patrol-image" @click="previewImage(record.image)"> <div v-if="record.image" class="patrol-image" @click="previewImage(record.image)">
<img :src="record.image" alt="现场照片" /> <img :src="record.image" alt="" />
</div> </div>
</div> </div>
</div> </div>

View File

@ -126,7 +126,7 @@
class="detail-image" class="detail-image"
@click="previewImage(patrolRecord.image)" @click="previewImage(patrolRecord.image)"
> >
<img :src="patrolRecord.image" alt="现场照片" /> <img :src="patrolRecord.image" alt="" />
</div> </div>
</div> </div>
</div> </div>

View File

@ -156,7 +156,7 @@
class="detail-image" class="detail-image"
@click="previewImage(patrolRecord.image)" @click="previewImage(patrolRecord.image)"
> >
<img :src="patrolRecord.image" alt="现场照片" /> <img :src="patrolRecord.image" alt="" />
</div> </div>
</div> </div>
</div> </div>

View File

@ -21,8 +21,10 @@
<el-select <el-select
:teleported="false" :teleported="false"
v-model="filterForm.warningLevel" v-model="filterForm.warningLevel"
placeholder="预警等级" placeholder="请选择预警等级"
class="filter-select" class="filter-select"
@change="handleWarningLevelChange"
clearable
> >
<el-option <el-option
v-for="option in warningLevelOptions" v-for="option in warningLevelOptions"
@ -36,8 +38,10 @@
<el-select <el-select
:teleported="false" :teleported="false"
v-model="filterForm.region" v-model="filterForm.region"
placeholder="影响区域" placeholder="请选择影响区域"
class="filter-select" class="filter-select"
@change="handleWarningLevelChange"
clearable
> >
<el-option <el-option
v-for="option in regionOptions" v-for="option in regionOptions"
@ -51,8 +55,10 @@
<el-select <el-select
:teleported="false" :teleported="false"
v-model="filterForm.isEnded" v-model="filterForm.isEnded"
placeholder="是否结束" placeholder="请选择是否结束"
class="filter-select" class="filter-select"
@change="handleWarningLevelChange"
clearable
> >
<el-option <el-option
v-for="option in isEndedOptions" v-for="option in isEndedOptions"
@ -66,8 +72,10 @@
<el-select <el-select
:teleported="false" :teleported="false"
v-model="filterForm.isResponded" v-model="filterForm.isResponded"
placeholder="是否回应" placeholder="请选择是否回应"
class="filter-select" class="filter-select"
@change="handleWarningLevelChange"
clearable
> >
<el-option <el-option
v-for="option in isRespondedOptions" v-for="option in isRespondedOptions"
@ -212,7 +220,11 @@ const handleCurrentChange = val => {
currentPage.value = val; currentPage.value = val;
fetchData(); fetchData();
}; };
//
const handleWarningLevelChange = () => {
currentPage.value = 1;
fetchData();
};
// //
const fetchData = async () => { const fetchData = async () => {
try { try {
@ -222,7 +234,23 @@ const fetchData = async () => {
end: '', end: '',
offset: (currentPage.value - 1) * pageSize.value, offset: (currentPage.value - 1) * pageSize.value,
limit: pageSize.value, limit: pageSize.value,
riskLevel: filterForm.value.warningLevel || '',
countyName: '',
isExpire: filterForm.value.isEnded,
isReply: filterForm.value.isResponded,
}; };
if (regionOptions.value.length > 0) {
//
const selectedRegion = regionOptions.value.find(
option => option.value === filterForm.value.region
);
if (selectedRegion) {
params.countyName = selectedRegion.label == '全部' ? '' : selectedRegion.label || '';
}
}
if (props.dispatchDateRange.length > 0) { if (props.dispatchDateRange.length > 0) {
params.start = formatDateTime(props.dispatchDateRange[0]) || ''; params.start = formatDateTime(props.dispatchDateRange[0]) || '';
params.end = formatDateTime(props.dispatchDateRange[1]) || ''; params.end = formatDateTime(props.dispatchDateRange[1]) || '';
@ -303,7 +331,7 @@ watch(
.filter-item { .filter-item {
.filter-select { .filter-select {
width: 120px; width: 150px;
:deep(.el-input__wrapper) { :deep(.el-input__wrapper) {
background-color: rgba(30, 70, 120, 0.4); background-color: rgba(30, 70, 120, 0.4);

View File

@ -187,7 +187,7 @@ const tableHeight = ref(300);
const tableColumns = ref([ const tableColumns = ref([
{ prop: 'index', label: '序号', width: '' }, { prop: 'index', label: '序号', width: '' },
{ prop: 'riskLeve', label: '预警等级', width: '', slot: 'riskLeve' }, { prop: 'riskLeve', label: '预警等级', width: '', slot: 'riskLeve' },
{ label: '来源', prop: 'source', width: '' }, { prop: 'source', label: '来源', width: '' },
{ prop: 'weatherType', label: '气象类型', width: '' }, { prop: 'weatherType', label: '气象类型', width: '' },
{ prop: 'countyName', label: '影响区域', width: '' }, { prop: 'countyName', label: '影响区域', width: '' },
{ prop: 'warningTime', label: '生效时间', width: '' }, { prop: 'warningTime', label: '生效时间', width: '' },
@ -226,7 +226,12 @@ const fetchWarningData = async () => {
params.riskLevel = filterForm.value.riskLeve; params.riskLevel = filterForm.value.riskLeve;
} }
if (filterForm.value.countyName) { if (filterForm.value.countyName) {
params.countyName = filterForm.value.countyName; const selectedRegion = regionOptions.value.find(
option => option.value === filterForm.value.countyName
);
if (selectedRegion) {
params.countyName = selectedRegion.label == '全部' ? '' : selectedRegion.label || '';
}
} }
if (filterForm.value.isEnded !== undefined && filterForm.value.isEnded !== '') { if (filterForm.value.isEnded !== undefined && filterForm.value.isEnded !== '') {
params.isExpire = filterForm.value.isEnded; params.isExpire = filterForm.value.isEnded;
@ -250,9 +255,9 @@ const fetchWarningData = async () => {
tableData.value = list.map((item, index) => ({ tableData.value = list.map((item, index) => ({
index: index + 1, index: index + 1,
riskLeve: item.riskLeve || '-', riskLeve: item.riskLeve || '-',
source: item.source || '-',
weatherType: item.weatherType || '-', weatherType: item.weatherType || '-',
countyName: item.countyName || '-', countyName: item.countyName || '-',
source: item.source || '-',
warningTime: item.startTime || '-', warningTime: item.startTime || '-',
endTime: item.endTime || '-', endTime: item.endTime || '-',
impactCount: item.affectedCount || 0, impactCount: item.affectedCount || 0,

View File

@ -54,7 +54,8 @@ export const fetchRoadConditionOptions = async () => {
label: item, label: item,
value: item, value: item,
})); }));
typeOptions.value = options; // 保留"全部"选项,并添加接口返回的数据
typeOptions.value = [{ label: '全部', value: '' }, ...options];
return options; return options;
} }
} catch (error) { } catch (error) {
@ -100,6 +101,7 @@ export const fetchControlMeasureOptions = async () => {
// 风险等级选项 // 风险等级选项
export const riskLevelOptions = [ export const riskLevelOptions = [
{ label: '全部', value: '' },
{ label: '一级', value: '一级' }, { label: '一级', value: '一级' },
{ label: '二级', value: '二级' }, { label: '二级', value: '二级' },
{ label: '三级', value: '三级' }, { label: '三级', value: '三级' },
@ -125,8 +127,8 @@ export const pointLevelOptions = [
// 是否回应选项 // 是否回应选项
export const isRespondedOptions = [ export const isRespondedOptions = [
{ label: '全部', value: '' }, { label: '全部', value: '' },
{ label: '是', value: 'yes' }, { label: '是', value: true },
{ label: '否', value: 'no' }, { label: '否', value: false },
]; ];
// 预警等级选项 // 预警等级选项