|
|
|
@ -1,15 +1,8 @@ |
|
|
|
<template> |
|
|
|
<div class="registration-list-page"> |
|
|
|
<!-- 搜索栏 --> |
|
|
|
<van-search |
|
|
|
v-model="searchText" |
|
|
|
show-action |
|
|
|
placeholder="请输入关键字查询" |
|
|
|
clearable |
|
|
|
clear-trigger="always" |
|
|
|
@clear="onClear" |
|
|
|
@search="onSearch" |
|
|
|
> |
|
|
|
<van-search v-model="searchText" show-action placeholder="请输入关键字查询" clearable clear-trigger="always" |
|
|
|
@clear="onClear" @search="onSearch"> |
|
|
|
<template #action> |
|
|
|
<div @click="onSearch">搜索</div> |
|
|
|
</template> |
|
|
|
@ -36,27 +29,15 @@ |
|
|
|
|
|
|
|
<!-- 月份选择器弹出层 --> |
|
|
|
<van-popup v-model:show="showDatePicker" position="bottom"> |
|
|
|
<van-date-picker |
|
|
|
title="选择月度" |
|
|
|
v-model="currentDate" |
|
|
|
:min-date="minDate" |
|
|
|
:max-date="maxDate" |
|
|
|
:columns-type="['year', 'month']" |
|
|
|
@confirm="onDateConfirm" |
|
|
|
@cancel="showDatePicker = false" |
|
|
|
/> |
|
|
|
<van-date-picker title="选择月度" v-model="currentDate" :min-date="minDate" :max-date="maxDate" |
|
|
|
:columns-type="['year', 'month']" @confirm="onDateConfirm" @cancel="showDatePicker = false" /> |
|
|
|
</van-popup> |
|
|
|
|
|
|
|
<!-- 可滚动列表区域 --> |
|
|
|
<div class="list-container"> |
|
|
|
<van-pull-refresh v-model="refreshing" @refresh="onRefresh"> |
|
|
|
<van-list |
|
|
|
v-model:loading="loading" |
|
|
|
:finished="finished" |
|
|
|
finished-text="没有更多了" |
|
|
|
@load="onLoad" |
|
|
|
:offset="50" |
|
|
|
> |
|
|
|
<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad" |
|
|
|
:offset="50"> |
|
|
|
<!-- 空状态 --> |
|
|
|
<van-empty v-if="finished && list.length === 0" description="暂无数据" /> |
|
|
|
|
|
|
|
@ -64,29 +45,28 @@ |
|
|
|
<div class="card-item" v-for="item in list" :key="item.id"> |
|
|
|
<div class="card-header"> |
|
|
|
<span class="card-time">执法时间:{{ formatDate(item.enforcementTime) }}</span> |
|
|
|
<span class="joint-mark" v-if="item.hasUnion === 1">联</span> |
|
|
|
<span class="card-status" v-if="item.isRealUnion === 1">联</span> |
|
|
|
</div> |
|
|
|
<div class="card-divider"></div> |
|
|
|
<div class="card-body" @click="toDetailView(item.id)"> |
|
|
|
<div class="card-title">{{ item.lawEnforcementItemText || '-' }}</div> |
|
|
|
<div class="card-row"> |
|
|
|
<span class="card-label">执法单位:</span> |
|
|
|
<span>{{ item.bureauDeptName || '-' }}</span> |
|
|
|
<span>{{ item.lawEnforcement || '-' }}</span> |
|
|
|
</div> |
|
|
|
<div class="card-row"> |
|
|
|
<span class="card-label">执法人员:</span> |
|
|
|
<span class="enforcer-block"> |
|
|
|
<span>{{ item.lawEnforcerDisplay || item.lawEnforcer || '-' }}</span> |
|
|
|
<span v-for="(name, idx) in (item.lawEnforcer2List || [])" :key="idx">{{ name }}</span> |
|
|
|
<span>{{ getEnforcerDisplay(item) }}</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
<div class="card-row"> |
|
|
|
<span class="card-label">执法类别:</span> |
|
|
|
<span>{{ item.lawEnforceCategoryText || '-' }}</span> |
|
|
|
<span class="card-label">企业名称:</span> |
|
|
|
<span>{{ item.enterpriseName || '-' }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 评价按钮 --> |
|
|
|
<div class="card-actions" v-if="item.outTimeDayNum != null && item.outTimeDayNum <= 5 && item.isEvaluate === 0"> |
|
|
|
<!-- 评价按钮:未评价时显示 --> |
|
|
|
<div class="card-actions" v-if="item.hasEvaluate === 0"> |
|
|
|
<a @click.stop="toEvaluate(item.id, item.lawEnforcementItemText)"> |
|
|
|
<van-icon name="flower-o" /> 评价 |
|
|
|
</a> |
|
|
|
@ -99,7 +79,7 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script setup name="enforcementRegistrationList"> |
|
|
|
import { getEnterpriseEnforcementRegistrationList } from '@/api/enterprise'; |
|
|
|
import { queryEnforcementRegistrationPageList } from '@/api/enterprise'; |
|
|
|
import { showToast } from 'vant'; |
|
|
|
import 'vant/es/toast/style'; |
|
|
|
|
|
|
|
@ -130,13 +110,24 @@ const maxDate = new Date(2030, 11, 31); |
|
|
|
// ========== 格式化日期 ========== |
|
|
|
const formatDate = (dateStr) => { |
|
|
|
if (!dateStr) return '-'; |
|
|
|
const d = new Date(dateStr); |
|
|
|
const d = new Date(dateStr.replace ? dateStr.replace(/-/g, '/') : dateStr); |
|
|
|
if (isNaN(d.getTime())) return dateStr; |
|
|
|
const y = d.getFullYear(); |
|
|
|
const m = String(d.getMonth() + 1).padStart(2, '0'); |
|
|
|
const day = String(d.getDate()).padStart(2, '0'); |
|
|
|
return `${y}-${m}-${day}`; |
|
|
|
}; |
|
|
|
|
|
|
|
// ========== 执法人员展示 ========== |
|
|
|
const getEnforcerDisplay = (item) => { |
|
|
|
if (item.lawEnforcerDisplay) return item.lawEnforcerDisplay; |
|
|
|
const names = []; |
|
|
|
if (item.lawEnforcer) names.push(item.lawEnforcer); |
|
|
|
if (item.lawEnforcerTwo) names.push(item.lawEnforcerTwo); |
|
|
|
if (Array.isArray(item.lawEnforcer2List)) names.push(...item.lawEnforcer2List); |
|
|
|
return names.length ? names.join('、') : '-'; |
|
|
|
}; |
|
|
|
|
|
|
|
// ========== 加载数据 ========== |
|
|
|
const fetchList = () => { |
|
|
|
const params = { |
|
|
|
@ -157,11 +148,27 @@ const fetchList = () => { |
|
|
|
params.dateSearch = dateSearch.value; |
|
|
|
} |
|
|
|
|
|
|
|
getEnterpriseEnforcementRegistrationList(params, (res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
const rows = res.rows || []; |
|
|
|
const total = res.total || 0; |
|
|
|
queryEnforcementRegistrationPageList(params, (res) => { |
|
|
|
// 兼容数组 / 包裹格式 |
|
|
|
let rows = []; |
|
|
|
let total = 0; |
|
|
|
let ok = true; |
|
|
|
if (Array.isArray(res)) { |
|
|
|
rows = res; |
|
|
|
total = res.length; |
|
|
|
} else if (res && Array.isArray(res.rows)) { |
|
|
|
rows = res.rows; |
|
|
|
total = res.total || rows.length; |
|
|
|
ok = res.code ? res.code === 200 : true; |
|
|
|
} else if (res && Array.isArray(res.data)) { |
|
|
|
rows = res.data; |
|
|
|
total = res.total || rows.length; |
|
|
|
ok = res.code ? res.code === 200 : true; |
|
|
|
} else if (res && res.code && res.code !== 200) { |
|
|
|
ok = false; |
|
|
|
} |
|
|
|
|
|
|
|
if (ok) { |
|
|
|
if (refreshing.value) { |
|
|
|
list.value = rows; |
|
|
|
refreshing.value = false; |
|
|
|
@ -169,8 +176,10 @@ const fetchList = () => { |
|
|
|
list.value = [...list.value, ...rows]; |
|
|
|
} |
|
|
|
|
|
|
|
if (list.value.length >= total) { |
|
|
|
if (rows.length === 0 || list.value.length >= total) { |
|
|
|
finished.value = true; |
|
|
|
} else { |
|
|
|
pageNum.value++; |
|
|
|
} |
|
|
|
loading.value = false; |
|
|
|
} else { |
|
|
|
@ -190,16 +199,15 @@ const fetchList = () => { |
|
|
|
const onLoad = () => { |
|
|
|
if (refreshing.value) return; |
|
|
|
fetchList(); |
|
|
|
pageNum.value++; |
|
|
|
}; |
|
|
|
|
|
|
|
// ========== 下拉刷新 ========== |
|
|
|
const onRefresh = () => { |
|
|
|
pageNum.value = 1; |
|
|
|
list.value = []; |
|
|
|
finished.value = false; |
|
|
|
loading.value = true; |
|
|
|
fetchList(); |
|
|
|
pageNum.value++; |
|
|
|
}; |
|
|
|
|
|
|
|
// ========== 搜索 ========== |
|
|
|
@ -209,7 +217,6 @@ const onSearch = () => { |
|
|
|
finished.value = false; |
|
|
|
loading.value = true; |
|
|
|
fetchList(); |
|
|
|
pageNum.value++; |
|
|
|
}; |
|
|
|
|
|
|
|
// ========== 清空搜索 ========== |
|
|
|
@ -305,6 +312,7 @@ const toEvaluate = (id, checkItem) => { |
|
|
|
/* ===== 日期显示 ===== */ |
|
|
|
.search-date-display { |
|
|
|
padding: 0.15rem 0.27rem 0; |
|
|
|
|
|
|
|
.date-label { |
|
|
|
color: #c1bfbf; |
|
|
|
font-size: 0.4rem; |
|
|
|
@ -324,10 +332,19 @@ const toEvaluate = (id, checkItem) => { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
.card-time { |
|
|
|
color: #c1bfbf; |
|
|
|
font-size: 0.32rem; |
|
|
|
} |
|
|
|
|
|
|
|
.card-status { |
|
|
|
color: #fff; |
|
|
|
font-size: 0.32rem; |
|
|
|
background: #1367fe; |
|
|
|
padding: 10px; |
|
|
|
border-radius: 5px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.joint-mark { |
|
|
|
|