Commit d48a6f44 authored by 王玉鑫's avatar 王玉鑫

fix: 列表页删除选中的地址修正

parent 90fc2a5b
...@@ -5,13 +5,13 @@ ...@@ -5,13 +5,13 @@
<span class="w-[100px] shrink-0 leading-[38px] text-[#666]" :class="{ w80: isSmallView }"> <span class="w-[100px] shrink-0 leading-[38px] text-[#666]" :class="{ w80: isSmallView }">
已选条件 已选条件
</span> </span>
<div class="flex justify-between flex-1"> <div class="flex flex-1 justify-between">
<div class="flex flex-wrap pt-1.5"> <div class="flex flex-wrap pt-1.5">
<template v-for="item in selected"> <template v-for="item in selected">
<span <span
v-if="!item.isAddress" v-if="!item.isAddress"
:key="item.key" :key="item.key"
class="selected-item mb-3 mr-2.5 flex items-center px-3 py-[9px] " class="selected-item mb-3 mr-2.5 flex items-center px-3 py-[9px]"
> >
{{ item.label }}{{ {{ item.label }}{{
Array.isArray(item.value) ? item.value.join(' | ') : item.valueLabel Array.isArray(item.value) ? item.value.join(' | ') : item.valueLabel
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<span <span
v-else-if="item.key === 'provinceName'" v-else-if="item.key === 'provinceName'"
:key="item.key!" :key="item.key!"
class="selected-item mb-3 mr-2.5 flex items-center px-3 py-[9px] " class="selected-item mb-3 mr-2.5 flex items-center px-3 py-[9px]"
> >
区域:{{ 区域:{{
`${item.valueLabel}${filterList[1].value ? ' | ' + filterList[1].value : ''}${ `${item.valueLabel}${filterList[1].value ? ' | ' + filterList[1].value : ''}${
...@@ -43,20 +43,16 @@ ...@@ -43,20 +43,16 @@
</template> </template>
</div> </div>
<div <div
class="ml-[15px] mt-1.5 flex h-[25px] w-[118px] cursor-pointer items-center shrink-0 pl-2" class="ml-[15px] mt-1.5 flex h-[25px] w-[118px] shrink-0 cursor-pointer items-center pl-2"
@click="removeAll" @click="removeAll"
> >
<img class="h-3 w-3 mr-1" src="@/assets/images/icon-del.png" alt="" /> <img class="mr-1 h-3 w-3" src="@/assets/images/icon-del.png" alt="" />
<span>清空所有条件</span> <span>清空所有条件</span>
</div> </div>
</div> </div>
</div> </div>
<template v-for="(filter, index) in filterList"> <template v-for="(filter, index) in filterList">
<div <div v-if="!filter.isAddress || getFilterList(filter).length" :key="index" class="flex">
v-if="!filter.isAddress || getFilterList(filter).length"
:key="index"
class="flex"
>
<div <div
class="w-[100px] shrink-0 text-sm leading-[38px] text-[#666]" class="w-[100px] shrink-0 text-sm leading-[38px] text-[#666]"
:class="{ w80: isSmallView }" :class="{ w80: isSmallView }"
...@@ -73,16 +69,18 @@ ...@@ -73,16 +69,18 @@
全部 全部
</span> </span>
</div> </div>
<div class="flex-1" <div
:class="{ class="flex-1"
'address-warp': filter.isAddress, :class="{
'spread-view': filter.isAddress && filter.showAll, 'address-warp': filter.isAddress,
}"> 'spread-view': filter.isAddress && filter.showAll,
}"
>
<div <div
:ref="'filter-warp' + index"
class="flex flex-wrap" class="flex flex-wrap"
:class="'filter-warp'+index" :class="'filter-warp' + index"
:ref="'filter-warp'+index" :hei="getElHeight('filter-warp' + index)"
:hei="getElHeight('filter-warp'+index)"
> >
<div class="flex flex-wrap"> <div class="flex flex-wrap">
<div v-for="(item, idx) in getFilterList(filter)" :key="idx"> <div v-for="(item, idx) in getFilterList(filter)" :key="idx">
...@@ -97,7 +95,7 @@ ...@@ -97,7 +95,7 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="filter.plugins" class="ml-2 flex items-center mb-3"> <div v-if="filter.plugins" class="mb-3 ml-2 flex items-center">
<template v-if="filter.plugins.type === 'section'"> <template v-if="filter.plugins.type === 'section'">
<ElInput <ElInput
v-model="filter.plugins.value1" v-model="filter.plugins.value1"
...@@ -119,13 +117,13 @@ ...@@ -119,13 +117,13 @@
</div> </div>
</div> </div>
<div <div
v-if="filter.isAddress && !filter.showAll" v-if="filter.isAddress && !filter.showAll"
class="ml-2.5 flex h-6 cursor-pointer items-center text-black/[.65] shrink-0 w-[118px] pl-2" class="ml-2.5 flex h-6 w-[118px] shrink-0 cursor-pointer items-center pl-2 text-black/[.65]"
@click="filter.showAll = true" @click="filter.showAll = true"
> >
<img class="mr-1 h-3 w-3" src="@/assets/images/icon-plus.png" alt="" /> <img class="mr-1 h-3 w-3" src="@/assets/images/icon-plus.png" alt="" />
<span>展开</span> <span>展开</span>
</div> </div>
</div> </div>
<!-- 多选 --> <!-- 多选 -->
<div v-else class="text-sm"> <div v-else class="text-sm">
...@@ -179,12 +177,12 @@ const searchParamsStore = useSearchParamsStore(); ...@@ -179,12 +177,12 @@ const searchParamsStore = useSearchParamsStore();
const getHeight = (el: string) => { const getHeight = (el: string) => {
return setTimeout(() => { return setTimeout(() => {
return proxy.$refs[el]?.scrollHeight || document.getElementsByClassName(el)[0].scrollHeight return proxy.$refs[el]?.scrollHeight || document.getElementsByClassName(el)[0].scrollHeight;
}) });
} };
const getElHeight = computed(() => { const getElHeight = computed(() => {
return getHeight return getHeight;
}) });
// 展开收起状态 // 展开收起状态
const isSpread = ref<boolean>(false); const isSpread = ref<boolean>(false);
...@@ -328,7 +326,7 @@ function handleEnter(arg: any) { ...@@ -328,7 +326,7 @@ function handleEnter(arg: any) {
// 删除已选筛选项 // 删除已选筛选项
function removeSelected(select: any) { function removeSelected(select: any) {
filterList.value.forEach((item) => { filterList.value.forEach((item) => {
if (item.label === select.label) { if (item.label === select.label || (item.isAddress && select.isAddress)) {
item.value = Array.isArray(item.value) ? [] : ''; item.value = Array.isArray(item.value) ? [] : '';
if (item.plugins) { if (item.plugins) {
item.plugins.value1 = ''; item.plugins.value1 = '';
...@@ -428,8 +426,8 @@ watch( ...@@ -428,8 +426,8 @@ watch(
// width: 1200px; // width: 1200px;
padding-bottom: 10px; padding-bottom: 10px;
padding-right: 20px; padding-right: 20px;
.filter-item{ .filter-item {
margin-bottom: 12px margin-bottom: 12px;
} }
} }
.selected { .selected {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment