feat(search) : 页面显示优化
- 搜索页面根据不同的显示情况展示不同的内容,没有内容的情况下屏蔽展示
This commit is contained in:
@@ -1,8 +0,0 @@
|
|||||||
import {ref} from 'vue';
|
|
||||||
|
|
||||||
const visible = ref<{ [key: string]: boolean }>({
|
|
||||||
mineSurvey: true,
|
|
||||||
templateMarket: true
|
|
||||||
});
|
|
||||||
|
|
||||||
export { visible };
|
|
||||||
@@ -4,14 +4,28 @@ import TemplateMarket from '@/views/HomeSearch/components/TemplateMarket/Index.v
|
|||||||
import MineSurvey from '@/views/HomeSearch/components/MineSurvey/Index.vue';
|
import MineSurvey from '@/views/HomeSearch/components/MineSurvey/Index.vue';
|
||||||
import { updateKeyword, keyword, loading } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
import { updateKeyword, keyword, loading } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
||||||
import Layout from '@/components/Layout/CommonLayout.vue';
|
import Layout from '@/components/Layout/CommonLayout.vue';
|
||||||
import { visible } from '@/views/HomeSearch/Hooks/useHomeSearch';
|
|
||||||
import RecommendTag from '@/views/HomeSearch/components/Recommend/Index.vue';
|
import RecommendTag from '@/views/HomeSearch/components/Recommend/Index.vue';
|
||||||
import { onMounted, onUnmounted, type Ref } from 'vue';
|
import { computed, onMounted, onUnmounted, ref, type Ref } from 'vue';
|
||||||
import ImageSlider from '../Home/components/ImageSlider/Index.vue';
|
import ImageSlider from '../Home/components/ImageSlider/Index.vue';
|
||||||
import { banners } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
import { banners } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
||||||
|
import { surveys, templates } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
||||||
|
|
||||||
const searchKeyword = keyword as Ref<string>;
|
const searchKeyword = keyword as Ref<string>;
|
||||||
|
|
||||||
|
type Visible = {
|
||||||
|
mineSurvey: boolean;
|
||||||
|
templateMarket: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
const visible = computed<Visible>(() => {
|
||||||
|
const mineSurvey = surveys.value.length > 0;
|
||||||
|
const templateMarket = templates.value.length > 0;
|
||||||
|
return {
|
||||||
|
mineSurvey,
|
||||||
|
templateMarket
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
function handleSearchCancel() {
|
function handleSearchCancel() {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { index, surveys as _surveys, keyword } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
import { index, surveys, keyword } from '@/views/HomeSearch/Hooks/useSurveySearch';
|
||||||
import SurveyItem from '@/components/SurveyItem/Index.vue';
|
import SurveyItem from '@/components/SurveyItem/Index.vue';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
@@ -22,10 +22,10 @@ function handleSurveyClick(survey: { sn: any }) {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
const surveys = computed(() => {
|
// const surveys = computed(() => {
|
||||||
// 取前三个元素
|
// // 取前三个元素
|
||||||
return _surveys.value.slice(0, 3);
|
// return _surveys.value.slice(0, 3);
|
||||||
});
|
// });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
1
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import MarketItem from '@/components/TemplateMarketItem/Index.vue';
|
import MarketItem from '@/components/TemplateMarketItem/Index.vue';
|
||||||
import { templates } from '../../Hooks/useSurveySearch';
|
import { templates } from '../../Hooks/useSurveySearch';
|
||||||
@@ -5,7 +6,7 @@ import { consoleSurveys, useTemplate } from '@/api/home';
|
|||||||
import { saveQuestions, snQuestions } from '@/api/design';
|
import { saveQuestions, snQuestions } from '@/api/design';
|
||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { useCounterStore } from '@/stores/counter';
|
import { useCounterStore } from '@/stores/counter';
|
||||||
import { type Store, type PiniaCustomStateProperties, storeToRefs } from 'pinia';
|
import { storeToRefs } from 'pinia';
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user