Browse Source

都加上了公共搜索和时间

dev-V1.10.2-temp
wangmingyong@163.com 3 months ago
parent
commit
dddafa46f1
  1. 205
      zdxt-web-client/zdxt-efcode-enforcement-app/src/components/common/SearchFilterBar.vue
  2. 126
      zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/enforce/enforcementList.vue
  3. 31
      zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/law/lawServiceList.vue
  4. 50
      zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/enforcementEvaluateList.vue
  5. 40
      zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/enforcementReserveList.vue
  6. 43
      zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/enforcementTaskList.vue
  7. 58
      zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/planNoticeList.vue

205
zdxt-web-client/zdxt-efcode-enforcement-app/src/components/common/SearchFilterBar.vue

@ -0,0 +1,205 @@
<template>
<div class="search-filter-bar">
<van-search v-model="searchText" show-action placeholder="请输入关键字查询" clearable clear-trigger="always"
@clear="onClear" @search="onSearch">
<template #action>
<div @click="onSearch">搜索</div>
</template>
</van-search>
<div v-if="showDateFilter" class="search-button-list">
<van-button plain hairline :class="dateType === null ? 'search-btn active' : 'search-btn'"
@click="searchDateType(null)" round type="primary" size="mini">全部</van-button>
<van-button plain hairline :class="dateType === 1 ? 'search-btn active' : 'search-btn'"
@click="searchDateType(1)" round type="primary" size="mini">本月</van-button>
<van-button plain hairline :class="dateType === 2 ? 'search-btn active' : 'search-btn'"
@click="searchDateType(2)" round type="primary" size="mini">本季</van-button>
<van-button plain hairline :class="dateType === 3 ? 'search-btn active' : 'search-btn'"
@click="searchDateType(3)" round type="primary" size="mini">本年</van-button>
<van-button plain hairline :class="dateType === 9 ? 'search-btn active' : 'search-btn'"
@click="openDatePicker" round type="primary" size="mini">筛选</van-button>
</div>
<div v-if="showDateFilter" class="search-date-display" v-show="dateShow">
<span class="date-label" @click="openDatePicker">{{ dateSearchDisplay }}</span>
</div>
<van-popup v-if="showDateFilter" 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-popup>
</div>
</template>
<script setup name="SearchFilterBar">
import { ref, watch } from 'vue';
const props = defineProps({
searchValue: {
type: String,
default: ''
},
dateType: {
type: Number,
default: null
},
dateSearch: {
type: String,
default: null
},
showDateFilter: {
type: Boolean,
default: true
}
});
const emit = defineEmits(['search', 'clear', 'dateChange']);
const searchText = ref(props.searchValue);
const dateType = ref(props.dateType);
const dateShow = ref(false);
const showDatePicker = ref(false);
const dateSearchDisplay = ref('');
const currentDate = ref(['2026', '01']);
const minDate = new Date(2020, 0, 1);
const maxDate = new Date(2030, 11, 31);
watch(() => props.dateType, (newVal) => {
dateType.value = newVal;
});
watch(() => props.dateSearch, (newVal) => {
if (newVal) {
const parts = newVal.split('-');
if (parts.length >= 2) {
currentDate.value = [parts[0], parts[1]];
dateSearchDisplay.value = `${parts[0]}/${parts[1]}`;
dateShow.value = true;
}
} else {
dateShow.value = false;
dateSearchDisplay.value = '';
}
});
const onSearch = () => {
emit('search', {
searchValue: searchText.value,
dateType: props.dateType,
dateSearch: props.dateSearch
});
};
const onClear = () => {
searchText.value = '';
emit('clear');
emit('search', {
searchValue: '',
dateType: props.dateType,
dateSearch: props.dateSearch
});
};
const searchDateType = (val) => {
emit('dateChange', {
dateType: val,
dateSearch: null,
dateShow: false
});
};
const openDatePicker = () => {
showDatePicker.value = true;
};
const onDateConfirm = (value) => {
const year = value.selectedValues[0];
const month = value.selectedValues[1];
dateSearchDisplay.value = year + '/' + month;
showDatePicker.value = false;
emit('dateChange', {
dateType: 9,
dateSearch: year + '-' + month,
dateShow: true
});
};
</script>
<style lang="less" scoped>
.search-filter-bar {
:deep(.van-search) {
background: #fff;
padding: 12px 16px;
margin-bottom: -1px;
}
:deep(.van-search__content) {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
:deep(.van-search__action) {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 1px solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
}
.search-button-list {
display: flex;
flex-direction: row;
padding: 0.2rem 0.27rem 0;
gap: 0.15rem;
margin-bottom: 8px;
.search-btn {
flex: 1;
height: 0.7rem;
background: #ebebeb;
border-color: #ebebeb;
color: #999;
font-size: 0.3rem;
}
.search-btn.active {
background-color: #d9e6fd;
border-color: #75a5fb;
color: #1367fe;
}
}
.search-date-display {
padding: 0.15rem 0.27rem 0;
.date-label {
color: #c1bfbf;
font-size: 0.4rem;
}
}
/* ===== Vant 搜索框样式覆盖 ===== */
:deep(.van-search__content) {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
:deep(.van-search__action) {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 0.01rem solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
}
}
</style>

126
zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/enforce/enforcementList.vue

@ -1,37 +1,13 @@
<template> <template>
<div class="registration-list-page"> <div class="registration-list-page">
<!-- 搜索栏 --> <SearchFilterBar
<van-search v-model="searchText" show-action placeholder="请输入关键字查询" clearable clear-trigger="always" :search-value="searchText"
@clear="onClear" @search="onSearch"> :date-type="dateType"
<template #action> :date-search="dateSearch"
<div @click="onSearch">搜索</div> @search="onSearch"
</template> @clear="onClear"
</van-search> @date-change="onDateChange"
/>
<!-- 日期快捷筛选按钮 -->
<div class="search-button-list">
<van-button plain hairline :class="dateType === null ? 'search-btn active' : 'search-btn'"
@click="searchDateType(null)" round type="primary" size="mini">全部</van-button>
<van-button plain hairline :class="dateType === 1 ? 'search-btn active' : 'search-btn'"
@click="searchDateType(1)" round type="primary" size="mini">本月</van-button>
<van-button plain hairline :class="dateType === 2 ? 'search-btn active' : 'search-btn'"
@click="searchDateType(2)" round type="primary" size="mini">本季</van-button>
<van-button plain hairline :class="dateType === 3 ? 'search-btn active' : 'search-btn'"
@click="searchDateType(3)" round type="primary" size="mini">本年</van-button>
<van-button plain hairline :class="dateType === 9 ? 'search-btn active' : 'search-btn'"
@click="openDatePicker" round type="primary" size="mini">筛选</van-button>
</div>
<!-- 指定月份显示 -->
<div class="search-date-display" v-show="dateShow">
<span class="date-label" @click="openDatePicker">{{ dateSearchDisplay }}</span>
</div>
<!-- 月份选择器弹出层 -->
<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-popup>
<!-- 可滚动列表区域 --> <!-- 可滚动列表区域 -->
<div class="list-container"> <div class="list-container">
@ -87,6 +63,7 @@ import { showToast } from 'vant';
import 'vant/es/toast/style'; import 'vant/es/toast/style';
import { queryEnforcementRegistrationPageList } from '@/api/enforcement'; import { queryEnforcementRegistrationPageList } from '@/api/enforcement';
import { formatEnforcer } from '@/util/util'; import { formatEnforcer } from '@/util/util';
import SearchFilterBar from '@/components/common/SearchFilterBar.vue';
const router = useRouter(); const router = useRouter();
@ -104,12 +81,6 @@ const pageSize = ref(10);
// ========== 日期筛选 ========== // ========== 日期筛选 ==========
const dateType = ref(null); const dateType = ref(null);
const dateSearch = ref(null); const dateSearch = ref(null);
const dateSearchDisplay = ref('');
const dateShow = ref(false);
const showDatePicker = ref(false);
const currentDate = ref(['2026', '01']);
const minDate = new Date(2020, 0, 1);
const maxDate = new Date(2030, 11, 31);
// ========== 格式化日期 ========== // ========== 格式化日期 ==========
const formatDate = (dateStr) => { const formatDate = (dateStr) => {
@ -202,29 +173,10 @@ const onClear = () => {
onSearch(); onSearch();
}; };
// ========== 日期类型切换 ========== // ========== 日期筛选变化 ==========
const searchDateType = (val) => { const onDateChange = ({ dateType: type, dateSearch: search, dateShow }) => {
dateType.value = val; dateType.value = type;
dateSearch.value = null; dateSearch.value = search;
dateShow.value = false;
onSearch();
};
// ========== 打开月份选择器 ==========
const openDatePicker = () => {
dateType.value = 9;
showDatePicker.value = true;
};
// ========== 月份选择确认 ==========
const onDateConfirm = (value) => {
const year = value.selectedValues[0];
const month = value.selectedValues[1];
dateSearchDisplay.value = year + '/' + month;
dateSearch.value = year + '-' + month;
dateType.value = 9;
dateShow.value = true;
showDatePicker.value = false;
onSearch(); onSearch();
}; };
@ -274,40 +226,6 @@ onMounted(() => {
} }
} }
/* ===== 搜索按钮行 ===== */
.search-button-list {
display: flex;
flex-direction: row;
padding: 0.2rem 0.27rem 0;
gap: 0.15rem;
margin-bottom: 8px;
.search-btn {
flex: 1;
height: 0.7rem;
background: #ebebeb;
border-color: #ebebeb;
color: #999;
font-size: 0.3rem;
}
.search-btn.active {
background-color: #d9e6fd;
border-color: #75a5fb;
color: #1367fe;
}
}
/* ===== 日期显示 ===== */
.search-date-display {
padding: 0.15rem 0.27rem 0;
.date-label {
color: #c1bfbf;
font-size: 0.4rem;
}
}
/* ===== 卡片样式 ===== */ /* ===== 卡片样式 ===== */
.card-item { .card-item {
background: #fff; background: #fff;
@ -403,22 +321,4 @@ onMounted(() => {
} }
} }
/* ===== Vant 搜索框样式覆盖 ===== */
:deep(.van-search__content) {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
:deep(.van-search__action) {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 0.01rem solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
}
</style> </style>

31
zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/law/lawServiceList.vue

@ -9,13 +9,14 @@
> >
</van-nav-bar> --> </van-nav-bar> -->
<!-- 搜索栏 --> <SearchFilterBar
<van-search v-model="searchText" show-action placeholder="请输入关键字查询" clearable clear-trigger="always" :search-value="searchText"
@clear="onClear" @search="onSearch"> :date-type="dateType"
<template #action> :date-search="dateSearch"
<div @click="onSearch">搜索</div> @search="onSearch"
</template> @clear="onClear"
</van-search> @date-change="onDateChange"
/>
<!-- 列表区域 --> <!-- 列表区域 -->
<div class="list-container"> <div class="list-container">
@ -70,6 +71,7 @@ import { useRouter } from 'vue-router';
import { showToast } from 'vant'; import { showToast } from 'vant';
import 'vant/es/toast/style'; import 'vant/es/toast/style';
import { getEducationServicesList } from '@/api/enforcement'; import { getEducationServicesList } from '@/api/enforcement';
import SearchFilterBar from '@/components/common/SearchFilterBar.vue';
const router = useRouter(); const router = useRouter();
@ -82,6 +84,8 @@ const pageNum = ref(1);
const pageSize = ref(10); const pageSize = ref(10);
const isFetching = ref(false); // 防重复请求标志位 const isFetching = ref(false); // 防重复请求标志位
const searchText = ref(''); const searchText = ref('');
const dateType = ref(null);
const dateSearch = ref(null);
// ========== 格式化时间 ========== // ========== 格式化时间 ==========
const formatTime = (val) => { const formatTime = (val) => {
@ -117,6 +121,12 @@ const fetchList = () => {
if (searchText.value) { if (searchText.value) {
params.searchValue = searchText.value; params.searchValue = searchText.value;
} }
if (dateType.value != null && dateType.value !== 9) {
params.dateType = dateType.value;
}
if (dateSearch.value) {
params.dateSearch = dateSearch.value;
}
getEducationServicesList(params, (res) => { getEducationServicesList(params, (res) => {
if (res.code === 200) { if (res.code === 200) {
const rows = res.rows || res.data?.rows || []; const rows = res.rows || res.data?.rows || [];
@ -186,6 +196,13 @@ const onClear = () => {
onSearch(); onSearch();
}; };
// ========== 日期筛选变化 ==========
const onDateChange = ({ dateType: type, dateSearch: search }) => {
dateType.value = type;
dateSearch.value = search;
onSearch();
};
// ========== 筛选点击 ========== // ========== 筛选点击 ==========
const onFilterClick = () => { const onFilterClick = () => {
showToast('筛选功能开发中'); showToast('筛选功能开发中');

50
zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/enforcementEvaluateList.vue

@ -4,14 +4,14 @@
<!-- <van-nav-bar title="执法反馈" left-text="返回" left-arrow @click-left="onClickLeft"> <!-- <van-nav-bar title="执法反馈" left-text="返回" left-arrow @click-left="onClickLeft">
</van-nav-bar> --> </van-nav-bar> -->
<!-- 搜索栏 --> <SearchFilterBar
<van-search v-model="searchText" show-action placeholder="请输入关键字查询" clearable clear-trigger="always" :search-value="searchText"
@clear="onClear" @search="onSearch"> :date-type="dateType"
<template #action> :date-search="dateSearch"
<div @click="onSearch">搜索</div> @search="onSearch"
</template> @clear="onClear"
</van-search> @date-change="onDateChange"
/>
<!-- 列表区域 --> <!-- 列表区域 -->
<div class="list-container"> <div class="list-container">
<van-pull-refresh v-model="refreshing" @refresh="onRefresh"> <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
@ -69,6 +69,7 @@ import { showToast } from 'vant';
import 'vant/es/toast/style'; import 'vant/es/toast/style';
import { queryEvaluateList } from '@/api/enforcement/index'; import { queryEvaluateList } from '@/api/enforcement/index';
import { formatEnforcer } from '@/util/util'; import { formatEnforcer } from '@/util/util';
import SearchFilterBar from '@/components/common/SearchFilterBar.vue';
const router = useRouter(); const router = useRouter();
@ -80,6 +81,8 @@ const refreshing = ref(false);
const pageNum = ref(1); const pageNum = ref(1);
const pageSize = ref(10); const pageSize = ref(10);
const searchText = ref(''); const searchText = ref('');
const dateType = ref(null);
const dateSearch = ref(null);
// ========== 获取状态文本 ========== // ========== 获取状态文本 ==========
const getStatusText = (status) => { const getStatusText = (status) => {
@ -111,6 +114,12 @@ const fetchList = () => {
if (searchText.value) { if (searchText.value) {
params.searchValue = searchText.value; params.searchValue = searchText.value;
} }
if (dateType.value != null && dateType.value !== 9) {
params.dateType = dateType.value;
}
if (dateSearch.value) {
params.dateSearch = dateSearch.value;
}
queryEvaluateList(params, (res) => { queryEvaluateList(params, (res) => {
if (res.code === 200) { if (res.code === 200) {
const rows = res.rows || res.data?.rows || res.data?.list || res.data || []; const rows = res.rows || res.data?.rows || res.data?.list || res.data || [];
@ -173,6 +182,13 @@ const onClear = () => {
onSearch(); onSearch();
}; };
// ========== 日期筛选变化 ==========
const onDateChange = ({ dateType: type, dateSearch: search }) => {
dateType.value = type;
dateSearch.value = search;
onSearch();
};
// ========== 跳转详情页面 ========== // ========== 跳转详情页面 ==========
const toDetail = (item) => { const toDetail = (item) => {
router.push({ router.push({
@ -314,22 +330,4 @@ onMounted(() => {
:deep(.van-empty) { :deep(.van-empty) {
padding: 60px 0; padding: 60px 0;
} }
/* ===== Vant 搜索框样式覆盖 ===== */
:deep(.van-search__content) {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
:deep(.van-search__action) {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 0.01rem solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
}
</style> </style>

40
zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/enforcementReserveList.vue

@ -1,5 +1,13 @@
<template> <template>
<div class="reserve-list-page app_content"> <div class="reserve-list-page app_content">
<SearchFilterBar
:search-value="searchText"
:date-type="dateType"
:date-search="dateSearch"
@search="onSearch"
@clear="onClear"
@date-change="onDateChange"
/>
<div class="content-area"> <div class="content-area">
<van-pull-refresh v-model="refreshing" @refresh="onRefresh"> <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="" <van-list v-model:loading="loading" :finished="finished" finished-text=""
@ -37,6 +45,7 @@
<script setup name="enforcementReserveList"> <script setup name="enforcementReserveList">
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import SearchFilterBar from '@/components/common/SearchFilterBar.vue';
const router = useRouter(); const router = useRouter();
@ -44,6 +53,9 @@ const reserveList = ref([]);
const loading = ref(false); const loading = ref(false);
const finished = ref(false); const finished = ref(false);
const refreshing = ref(false); const refreshing = ref(false);
const searchText = ref('');
const dateType = ref(null);
const dateSearch = ref(null);
const fetchReserveList = () => { const fetchReserveList = () => {
loading.value = true; loading.value = true;
@ -68,7 +80,16 @@ const fetchReserveList = () => {
checkTime: '2026-04-20 上午' checkTime: '2026-04-20 上午'
} }
]; ];
reserveList.value = mockData; let filteredData = mockData;
if (searchText.value) {
const keyword = searchText.value.toLowerCase();
filteredData = filteredData.filter(item =>
(item.enterpriseName || '').toLowerCase().includes(keyword) ||
(item.reserveUnit || '').toLowerCase().includes(keyword) ||
(item.enforcementUnit || '').toLowerCase().includes(keyword)
);
}
reserveList.value = filteredData;
loading.value = false; loading.value = false;
finished.value = true; finished.value = true;
refreshing.value = false; refreshing.value = false;
@ -85,6 +106,23 @@ const onRefresh = () => {
fetchReserveList(); fetchReserveList();
}; };
const onSearch = () => {
finished.value = false;
loading.value = true;
fetchReserveList();
};
const onClear = () => {
searchText.value = '';
onSearch();
};
const onDateChange = ({ dateType: type, dateSearch: search }) => {
dateType.value = type;
dateSearch.value = search;
onSearch();
};
onMounted(() => { onMounted(() => {
fetchReserveList(); fetchReserveList();
}); });

43
zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/enforcementTaskList.vue

@ -1,6 +1,14 @@
<template> <template>
<div class="task-list-page app_content"> <div class="task-list-page app_content">
<!-- <van-nav-bar title="执法任务" left-arrow @click-left="goBack" /> --> <!-- <van-nav-bar title="执法任务" left-arrow @click-left="goBack" /> -->
<SearchFilterBar
:search-value="searchText"
:date-type="dateType"
:date-search="dateSearch"
@search="onSearch"
@clear="onClear"
@date-change="onDateChange"
/>
<div class="content-area"> <div class="content-area">
<van-pull-refresh v-model="refreshing" @refresh="onRefresh"> <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<van-list v-model:loading="loading" :finished="finished" finished-text="" <van-list v-model:loading="loading" :finished="finished" finished-text=""
@ -38,6 +46,7 @@
<script setup name="enforcementTaskList"> <script setup name="enforcementTaskList">
import { ref, onMounted } from 'vue'; import { ref, onMounted } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import SearchFilterBar from '@/components/common/SearchFilterBar.vue';
const router = useRouter(); const router = useRouter();
@ -47,6 +56,9 @@ const finished = ref(false);
const refreshing = ref(false); const refreshing = ref(false);
const pageNum = ref(1); const pageNum = ref(1);
const pageSize = ref(10); const pageSize = ref(10);
const searchText = ref('');
const dateType = ref(null);
const dateSearch = ref(null);
const goBack = () => { const goBack = () => {
router.back(); router.back();
@ -65,7 +77,7 @@ const fetchTaskList = () => {
{ {
time: '2026-03-20 14:20', time: '2026-03-20 14:20',
enterpriseName: '深圳市新粤云有限公司', enterpriseName: '深圳市新粤云有限公司',
checkTime: '2026-03-04 上午', checkTime: '2026-03-21 上午',
enforcementItem: '日常检查' enforcementItem: '日常检查'
}, },
{ {
@ -75,7 +87,15 @@ const fetchTaskList = () => {
enforcementItem: '日常检查' enforcementItem: '日常检查'
} }
]; ];
taskList.value = mockData; let filteredData = mockData;
if (searchText.value) {
const keyword = searchText.value.toLowerCase();
filteredData = filteredData.filter(item =>
item.enterpriseName.toLowerCase().includes(keyword) ||
item.enforcementItem.toLowerCase().includes(keyword)
);
}
taskList.value = filteredData;
loading.value = false; loading.value = false;
finished.value = true; finished.value = true;
refreshing.value = false; refreshing.value = false;
@ -93,6 +113,25 @@ const onRefresh = () => {
fetchTaskList(); fetchTaskList();
}; };
const onSearch = () => {
pageNum.value = 1;
taskList.value = [];
finished.value = false;
loading.value = true;
fetchTaskList();
};
const onClear = () => {
searchText.value = '';
onSearch();
};
const onDateChange = ({ dateType: type, dateSearch: search }) => {
dateType.value = type;
dateSearch.value = search;
onSearch();
};
onMounted(() => { onMounted(() => {
fetchTaskList(); fetchTaskList();
}); });

58
zdxt-web-client/zdxt-efcode-enforcement-app/src/views/enforcement/message/planNoticeList.vue

@ -4,15 +4,14 @@
<van-nav-bar title="计划通知" left-text="返回" left-arrow @click-left="onClickLeft"> <van-nav-bar title="计划通知" left-text="返回" left-arrow @click-left="onClickLeft">
</van-nav-bar> </van-nav-bar>
<!-- 搜索栏 --> <SearchFilterBar
<div class="search-bar"> :search-value="searchText"
<van-search v-model="searchText" show-action placeholder="请输入计划名称/单位" clearable clear-icon="clear" :date-type="dateType"
clear-trigger="always" @clear="onClear" @search="onSearch"> :date-search="dateSearch"
<template #action> @search="onSearch"
<div @click="onSearch">搜索</div> @clear="onClear"
</template> @date-change="onDateChange"
</van-search> />
</div>
<!-- 列表区域 --> <!-- 列表区域 -->
<div class="list-container"> <div class="list-container">
@ -69,6 +68,7 @@ import { useRouter } from 'vue-router';
import { showToast } from 'vant'; import { showToast } from 'vant';
import 'vant/es/toast/style'; import 'vant/es/toast/style';
import { queryListNoPermission } from '@/api/enforcement/index'; import { queryListNoPermission } from '@/api/enforcement/index';
import SearchFilterBar from '@/components/common/SearchFilterBar.vue';
const router = useRouter(); const router = useRouter();
@ -80,6 +80,8 @@ const refreshing = ref(false);
const searchText = ref(''); const searchText = ref('');
const pageNum = ref(1); const pageNum = ref(1);
const pageSize = ref(10); const pageSize = ref(10);
const dateType = ref(null);
const dateSearch = ref(null);
// ========== 加载数据 ========== // ========== 加载数据 ==========
const fetchList = () => { const fetchList = () => {
@ -88,6 +90,12 @@ const fetchList = () => {
pageSize: pageSize.value, pageSize: pageSize.value,
queryParam: searchText.value || undefined, queryParam: searchText.value || undefined,
}; };
if (dateType.value != null && dateType.value !== 9) {
params.dateType = dateType.value;
}
if (dateSearch.value) {
params.dateSearch = dateSearch.value;
}
queryListNoPermission(params, (res) => { queryListNoPermission(params, (res) => {
if (res.code === 200) { if (res.code === 200) {
const rows = res.rows || []; const rows = res.rows || [];
@ -141,6 +149,13 @@ const onClear = () => {
onSearch(); onSearch();
}; };
// ========== 日期筛选变化 ==========
const onDateChange = ({ dateType: type, dateSearch: search }) => {
dateType.value = type;
dateSearch.value = search;
onSearch();
};
// ========== 搜索 ========== // ========== 搜索 ==========
const onSearch = () => { const onSearch = () => {
pageNum.value = 1; pageNum.value = 1;
@ -204,31 +219,6 @@ onMounted(() => {
color: #333; color: #333;
} }
/* ===== 搜索栏样式 ===== */
:deep(.van-search) {
background: #fff;
padding: 12px 16px;
margin-bottom: -1px;
}
:deep(.van-search__content) {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
:deep(.van-search__action) {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 1px solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
}
/* ===== 列表容器 ===== */ /* ===== 列表容器 ===== */
.list-container { .list-container {
flex: 1; flex: 1;

Loading…
Cancel
Save