|
|
|
@ -1,12 +1,12 @@
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import { favorite, getConditionList, unfavorite } from "@/api/home/filter";
|
|
|
|
|
import { favorite, getConditionList, unfavorite, sort } from "@/api/home/filter";
|
|
|
|
|
import { asideMap } from "@/config/aside";
|
|
|
|
|
import { useInfiniteScroll } from "@vueuse/core";
|
|
|
|
|
import { debounce } from "lodash-es";
|
|
|
|
|
import { onMounted, reactive, ref, watch } from "vue";
|
|
|
|
|
import type { FilterSearchParam } from "/#/api";
|
|
|
|
|
import type { Filter, FilterEntity } from "/#/home";
|
|
|
|
|
import { VueDraggable } from 'vue-draggable-plus'
|
|
|
|
|
import { VueDraggable } from "vue-draggable-plus";
|
|
|
|
|
|
|
|
|
|
defineOptions({ name: "AdvanceFilter" });
|
|
|
|
|
|
|
|
|
@ -74,7 +74,6 @@ useInfiniteScroll(
|
|
|
|
|
{ distance: 10, interval: 300, canLoadMore: () => false }
|
|
|
|
|
);
|
|
|
|
|
const showClick = () => {
|
|
|
|
|
console.log("showClick");
|
|
|
|
|
inputHandler("");
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
@ -110,7 +109,7 @@ async function featchList() {
|
|
|
|
|
// 转换服务器数据格式
|
|
|
|
|
function generateFilterEntityList(data) {
|
|
|
|
|
const filterEntityList = data.map((item) => {
|
|
|
|
|
const { searchname, iztop, ocrUsersearchchildList, id } = item;
|
|
|
|
|
const { searchname, iztop, ocrUsersearchchildList, id, reorder } = item;
|
|
|
|
|
|
|
|
|
|
const list = ocrUsersearchchildList.map((item) => {
|
|
|
|
|
const { searchfield, searchvalue } = item;
|
|
|
|
@ -133,6 +132,7 @@ function generateFilterEntityList(data) {
|
|
|
|
|
favorite: iztop,
|
|
|
|
|
isDefaultFilter: false,
|
|
|
|
|
filterList: list,
|
|
|
|
|
reorder,
|
|
|
|
|
};
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
@ -145,6 +145,11 @@ function selectHandler(item: FilterEntity) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const inputHandler = debounce((word) => {
|
|
|
|
|
if (word) {
|
|
|
|
|
pagination.pageSize = 300;
|
|
|
|
|
} else {
|
|
|
|
|
pagination.pageSize = 10;
|
|
|
|
|
}
|
|
|
|
|
keyword.value = word;
|
|
|
|
|
featchList().then((list) => {
|
|
|
|
|
let dataArr: FilterEntity[] = [];
|
|
|
|
@ -157,8 +162,12 @@ const inputHandler = debounce((word) => {
|
|
|
|
|
unDataArr.push(item);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
data.value = dataArr;
|
|
|
|
|
unData.value = unDataArr;
|
|
|
|
|
data.value = dataArr.sort(
|
|
|
|
|
(a, b) => Number((a as any).reorder) - Number((b as any).reorder)
|
|
|
|
|
);
|
|
|
|
|
unData.value = unDataArr.sort(
|
|
|
|
|
(a, b) => Number((a as any).reorder) - Number((b as any).reorder)
|
|
|
|
|
);
|
|
|
|
|
});
|
|
|
|
|
}, 300);
|
|
|
|
|
|
|
|
|
@ -171,6 +180,15 @@ function favoriteHandler(event: MouseEvent, item: any) {
|
|
|
|
|
if (!isDefaultFilter) {
|
|
|
|
|
item.favorite = true;
|
|
|
|
|
favorite(id);
|
|
|
|
|
data.value.map((v, index) => {
|
|
|
|
|
if (v.id == id) {
|
|
|
|
|
sort(v.id, 0);
|
|
|
|
|
} else {
|
|
|
|
|
sort(v.id, index + 1);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
inputHandler(keyword.value);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -183,8 +201,15 @@ function unFavoriteHandler(event: MouseEvent, item) {
|
|
|
|
|
if (!isDefaultFilter) {
|
|
|
|
|
item.favorite = false;
|
|
|
|
|
unfavorite(id);
|
|
|
|
|
inputHandler(keyword.value);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const moveEnd = () => {
|
|
|
|
|
unData.value.map((v, index) => {
|
|
|
|
|
sort(v.id, index);
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
@ -248,6 +273,7 @@ function unFavoriteHandler(event: MouseEvent, item) {
|
|
|
|
|
<div v-html="item.name" />
|
|
|
|
|
</li>
|
|
|
|
|
<VueDraggable
|
|
|
|
|
@end="moveEnd"
|
|
|
|
|
v-model="unData"
|
|
|
|
|
filter=".draggable-li[draggable='false']"
|
|
|
|
|
class="draggable-ul"
|
|
|
|
|