gypsy-crm-frontend-vu/pages/analytics/news.vue

<template>
    <cwg-page-wrapper class="create-page" :isHeaderFixed="true">
        <cwg-header :title="t('News.NewsInformation')" />
        <cwg-asset-tabs v-model="activeTab" :tabs="tabsConfig" />
        <view class="account-section">
            <List ref="newsList" :fetchData="fetchNewsList" :queryParams="queryParams" :type="type" />
        </view>
    </cwg-page-wrapper>
</template>

<script setup lang="ts">
import { ref, reactive, computed, onMounted, onUnmounted, watch, nextTick } from 'vue'
import { onLoad, onReachBottom } from '@dcloudio/uni-app'
import { useI18n } from 'vue-i18n' // uni-app 中已集成，但需配置
import { newsApi } from '@/service/news'
import List from './components/List.vue'
const { t, locale } = useI18n()
const isZh = computed(() => ['cn', 'zhHant'].includes(locale.value))
const newsList = ref(null)
const fetchNewsList = ref(null)
const queryParams = ref({
    tag: 3,
    endDate: "",
    startDate: "",
    id: null
})
const activeTab = ref(1)
const tabsConfig = computed(() => [
    { text: t('News.ExpertAnalysis'), value: 1, type: 5 },
    { text: t('News.Ebook'), value: 2, type: 10 },
])
onReachBottom(() => {
    newsList.value?.loadMore()
})
const type = ref(0)
watch(activeTab, (val) => {
    if (val == 1) {
        fetchNewsList.value = newsApi.newsInformationNewsletterList
        queryParams.value = {
            tag: 3,
            endDate: '',
            startDate: '',
            id: null, pageSize: 9
        }
    } else {
        fetchNewsList.value = newsApi.newsEbookList
        queryParams.value = {
            tag: null,
            endDate: '',
            startDate: '',
            id: null, pageSize: 12
        }
    }
    type.value = tabsConfig.value.find(item => item.value == val).type
    nextTick(() => {
        newsList.value.load()
    })
}, { immediate: true })
</script>
<style lang="scss" scoped>
@import "@/uni.scss";
</style>