|
|
@@ -3,7 +3,7 @@
|
|
|
<div class="task-top">
|
|
|
<div class="map-container" ref="mapContainer"></div>
|
|
|
<div class="calendar-wrap">
|
|
|
- <calendar ref="calendarRef"></calendar>
|
|
|
+ <calendar ref="calendarRef" @dateSelect="handleDateSelect"></calendar>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="task-list">
|
|
|
@@ -128,12 +128,16 @@ const selectParma = ref({
|
|
|
districtCode: null,
|
|
|
});
|
|
|
|
|
|
-// 任务列表数据
|
|
|
+// 任务列表数据(用于显示,可能被筛选)
|
|
|
const taskList = ref([]);
|
|
|
+// 完整的任务列表数据(用于日历显示,不被筛选影响)
|
|
|
+const fullTaskList = ref([]);
|
|
|
// 各状态任务数量
|
|
|
const taskCounts = ref([0, 0, 0]);
|
|
|
// 当前选中的筛选索引
|
|
|
const activeIndex = ref(0);
|
|
|
+// 筛选日期(用于按日期筛选)
|
|
|
+const filterDate = ref(null);
|
|
|
const noData = ref(false);
|
|
|
const loading = ref(false);
|
|
|
|
|
|
@@ -210,7 +214,7 @@ function getDistrictListByCity() {
|
|
|
const cityCode = data[0].code.slice(0, -2);
|
|
|
districtList.value.unshift({ code: cityCode, name: "全部" });
|
|
|
selectParma.value.districtCode = cityCode;
|
|
|
- getSimpleList()
|
|
|
+ getSimpleList();
|
|
|
});
|
|
|
}
|
|
|
|
|
|
@@ -250,8 +254,23 @@ onMounted(() => {
|
|
|
});
|
|
|
});
|
|
|
|
|
|
+// 标记是否正在通过日期选择切换筛选(避免 watch 清除日期筛选)
|
|
|
+const isDateSelecting = ref(false);
|
|
|
+
|
|
|
// 监听 activeIndex 变化,重新加载数据
|
|
|
watch(activeIndex, () => {
|
|
|
+ // 如果正在通过日期选择切换,不清除日期筛选
|
|
|
+ if (isDateSelecting.value) {
|
|
|
+ isDateSelecting.value = false;
|
|
|
+ getSimpleList();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 切换筛选时清除日期筛选
|
|
|
+ filterDate.value = null;
|
|
|
+ // 清除日历选中状态
|
|
|
+ if (calendarRef.value) {
|
|
|
+ calendarRef.value.clearSelection();
|
|
|
+ }
|
|
|
getSimpleList();
|
|
|
});
|
|
|
|
|
|
@@ -262,44 +281,102 @@ function getSimpleList() {
|
|
|
taskItemRefs.value = [];
|
|
|
const startFlowStatus = getStartFlowStatus(activeIndex.value);
|
|
|
const params = {
|
|
|
+ ...selectParma.value,
|
|
|
role: 2,
|
|
|
location: mapPoint.value,
|
|
|
flowStatus: startFlowStatus,
|
|
|
farmWorkTypeId: selectParma.value.farmWorkTypeId || null,
|
|
|
};
|
|
|
+
|
|
|
return VE_API.z_farm_work_record
|
|
|
.getSimpleList(params)
|
|
|
.then(({ data }) => {
|
|
|
loading.value = false;
|
|
|
// 假设返回的数据结构是 { list: [], total: 0 } 或者直接是数组
|
|
|
- if (Array.isArray(data) && data.length > 0) {
|
|
|
- taskList.value = data;
|
|
|
+ let filteredData = data
|
|
|
+
|
|
|
+ // 保存完整数据(用于日历显示)
|
|
|
+ if (activeIndex.value === 2) {
|
|
|
+ // 如果是"待完成"状态,保存完整数据用于日历
|
|
|
+ fullTaskList.value = Array.isArray(data) ? data : [];
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果有日期筛选,在前端再次过滤(确保数据准确)
|
|
|
+ if (filterDate.value && Array.isArray(data)) {
|
|
|
+ filteredData = data.filter((item) => {
|
|
|
+ if (!item.executeDate) return false;
|
|
|
+ const itemDate = formatDate(new Date(item.executeDate));
|
|
|
+ return itemDate === filterDate.value;
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ if (Array.isArray(filteredData) && filteredData.length > 0) {
|
|
|
+ taskList.value = filteredData;
|
|
|
// 更新当前状态的数量
|
|
|
- taskCounts.value[activeIndex.value] = data.length;
|
|
|
- if (activeIndex.value === 2) {
|
|
|
- calendarRef.value && calendarRef.value.setSolarTerm(taskList.value);
|
|
|
- indexMap.initData(taskList.value);
|
|
|
- }
|
|
|
- } else {
|
|
|
- taskList.value = [];
|
|
|
- taskCounts.value[activeIndex.value] = 0;
|
|
|
+ taskCounts.value[activeIndex.value] = filteredData.length;
|
|
|
if (activeIndex.value === 2) {
|
|
|
+ // 传递给日历的数据应该是完整的未筛选数据
|
|
|
+ const calendarData = filterDate.value ? fullTaskList.value : taskList.value;
|
|
|
+ calendarRef.value && calendarRef.value.setSolarTerm(calendarData);
|
|
|
+ // 地图使用筛选后的数据
|
|
|
indexMap.initData(taskList.value);
|
|
|
- calendarRef.value && calendarRef.value.setSolarTerm(taskList.value);
|
|
|
}
|
|
|
+ }else{
|
|
|
noData.value = true;
|
|
|
+ taskList.value = [];
|
|
|
}
|
|
|
})
|
|
|
.catch((error) => {
|
|
|
console.error("获取任务列表失败:", error);
|
|
|
loading.value = false;
|
|
|
taskList.value = [];
|
|
|
+ taskCounts.value[activeIndex.value] = 0;
|
|
|
+ if (activeIndex.value === 2) {
|
|
|
+ // 即使筛选后没有数据,日历也应该显示完整数据
|
|
|
+ const calendarData = filterDate.value ? fullTaskList.value : [];
|
|
|
+ indexMap.initData(taskList.value);
|
|
|
+ calendarRef.value && calendarRef.value.setSolarTerm(calendarData);
|
|
|
+ }
|
|
|
noData.value = true;
|
|
|
});
|
|
|
}
|
|
|
|
|
|
+// 格式化日期函数(与 calendar 组件保持一致)
|
|
|
+function formatDate(date) {
|
|
|
+ if (typeof date === "string") {
|
|
|
+ date = new Date(date);
|
|
|
+ }
|
|
|
+ return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(
|
|
|
+ 2,
|
|
|
+ "0"
|
|
|
+ )}`;
|
|
|
+}
|
|
|
+
|
|
|
+// 处理日历日期选择
|
|
|
+const handleDateSelect = (date) => {
|
|
|
+ if (date) {
|
|
|
+ // 有日期选择,切换到"待完成"筛选并设置筛选日期
|
|
|
+ filterDate.value = date;
|
|
|
+ // 如果当前不是"待完成"状态,切换到"待完成"
|
|
|
+ if (activeIndex.value !== 2) {
|
|
|
+ isDateSelecting.value = true; // 标记正在通过日期选择切换
|
|
|
+ activeIndex.value = 2;
|
|
|
+ // watch 会处理 getSimpleList
|
|
|
+ } else {
|
|
|
+ // 如果已经是"待完成"状态,直接重新加载列表
|
|
|
+ getSimpleList();
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // 取消日期筛选
|
|
|
+ filterDate.value = null;
|
|
|
+ // 重新加载列表
|
|
|
+ getSimpleList();
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
function handleActiveFilter(i) {
|
|
|
activeIndex.value = i;
|
|
|
+ // watch 会自动处理清除日期筛选和日历选中状态
|
|
|
}
|
|
|
|
|
|
function toPage(item) {
|