|
@@ -0,0 +1,563 @@
|
|
|
|
+<template>
|
|
|
|
+ <div class="shukan">
|
|
|
|
+ <!-- {{ routeId }} -->
|
|
|
|
+ <HomePageHead></HomePageHead>
|
|
|
|
+ <HomePageNavigation></HomePageNavigation>
|
|
|
|
+ <HomeSecondaryHeading_shukan :titleData="pageData" :pinyinid="routeId"></HomeSecondaryHeading_shukan>
|
|
|
|
+
|
|
|
|
+ <!-- 三农资讯网-书刊信息snzx_book -->
|
|
|
|
+ <main class="index_main">
|
|
|
|
+ <section class="index_2 clearfix">
|
|
|
|
+ <div class="index_2_left">
|
|
|
|
+ <div class="book_head_box clearfix">
|
|
|
|
+ <div class="book_head_left">
|
|
|
|
+ <NuxtLink class="book_head_a" :href="getLinkPath(pageData[0])" v-if="pageData[0]"
|
|
|
|
+ :title="pageData[0].alias" @mouseenter="tabsData1 = 1"
|
|
|
|
+ :class="{ book_head_only: tabsData1 == 1 }">
|
|
|
|
+ {{ pageData[0].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ <NuxtLink class="book_head_a" :href="getLinkPath(pageData[1])" v-if="pageData[1]"
|
|
|
|
+ :title="pageData[1].alias" @mouseenter="tabsData1 = 2"
|
|
|
|
+ :class="{ book_head_only: tabsData1 == 2 }">
|
|
|
|
+ {{ pageData[1].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[0])"
|
|
|
|
+ v-if="pageData[0] && tabsData1 == 1" :title="pageData[0].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[1])"
|
|
|
|
+ v-if="pageData[1] && tabsData1 == 2" :title="pageData[1].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块1 -->
|
|
|
|
+ <div class=" clearfix">
|
|
|
|
+ <div class="book_1_img_ul clearfix" v-if="tabsData1 == 1">
|
|
|
|
+ <div class="book_1_img_li" v-for="(item, index) in pageData[0].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_1_img_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_1_img_li_img" :src="item.img_url" :alt="item.title">
|
|
|
|
+ <div class="book_1_img_li_right clearfix">
|
|
|
|
+ <div class="book_1_img_li_dot2 dot2">
|
|
|
|
+ {{ item.title }}
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_1_img_li_btn clearfix">查看详情</div>
|
|
|
|
+ </div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块1 end -->
|
|
|
|
+ <!-- 模块2 -->
|
|
|
|
+ <div class=" clearfix">
|
|
|
|
+ <div class="book_1_img_ul clearfix" v-if="tabsData1 == 2">
|
|
|
|
+ <div class="book_1_img_li" v-for="(item, index) in pageData[1].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_1_img_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_1_img_li_img" :src="item.img_url" :alt="item.title">
|
|
|
|
+ <div class="book_1_img_li_right clearfix">
|
|
|
|
+ <div class="book_1_img_li_dot2 dot2">
|
|
|
|
+ {{ item.title }}
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_1_img_li_btn clearfix">查看详情</div>
|
|
|
|
+ </div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块2 end -->
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块3 -->
|
|
|
|
+ <div class="index_2_right">
|
|
|
|
+ <div class="book_head_box clearfix">
|
|
|
|
+ <div class="book_head_left">
|
|
|
|
+ <NuxtLink class="book_head_a book_head_only" :href="getLinkPath(pageData[2])"
|
|
|
|
+ v-if="pageData[2]" :title="pageData[2].alias">
|
|
|
|
+ {{ pageData[2].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[2])" v-if="pageData[2]"
|
|
|
|
+ :title="pageData[2].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_num_1_ul clearfix">
|
|
|
|
+ <div class="book_num_1_li clearfix" v-for="(item, index) in pageData[2].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_num_1_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <div class="book_num_1_li_tag" @mouseenter="showTabs = index + 1"
|
|
|
|
+ :class="{ num_active: showTabs == index + 1 }">
|
|
|
|
+ {{ index + 1 }}</div>
|
|
|
|
+ <img class="book_num_1_li_img" @mouseenter="showTabs = index + 1"
|
|
|
|
+ :class="{ img_active: showTabs == index + 1 }" :src="item.img_url"
|
|
|
|
+ :alt="item.title">
|
|
|
|
+ <div class="book_num_1_li_dot1 clearfix" @mouseenter="showTabs = index + 1"
|
|
|
|
+ :class="{ text_active: showTabs == index + 1 }">{{ item.title }}</div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块3 end-->
|
|
|
|
+ </section>
|
|
|
|
+ <HomeAdvertising :imgurl="adImg1"></HomeAdvertising>
|
|
|
|
+ <section class="index_3 clearfix">
|
|
|
|
+ <div class="index_3_left clearfix">
|
|
|
|
+ <div class="book_head_box clearfix">
|
|
|
|
+ <div class="book_head_left">
|
|
|
|
+ <NuxtLink class="book_head_a " :href="getLinkPath(pageData[3])" v-if="pageData[3]"
|
|
|
|
+ :title="pageData[3].alias" @mouseenter="tabsData2 = 1"
|
|
|
|
+ :class="{ book_head_only: tabsData2 == 1 }">
|
|
|
|
+ {{ pageData[3].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ <NuxtLink class="book_head_a " :href="getLinkPath(pageData[4])" v-if="pageData[4]"
|
|
|
|
+ :title="pageData[4].alias" @mouseenter="tabsData2 = 2"
|
|
|
|
+ :class="{ book_head_only: tabsData2 == 2 }">
|
|
|
|
+ {{ pageData[4].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[3])"
|
|
|
|
+ v-if="pageData[3] && tabsData2 == 1" :title="pageData[3].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[4])"
|
|
|
|
+ v-if="pageData[4] && tabsData2 == 2" :title="pageData[4].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <div class=" clearfix">
|
|
|
|
+ <!-- 模块4 -->
|
|
|
|
+ <div class="book_2_img_ul clearfix" v-if="tabsData2 == 1">
|
|
|
|
+ <div class="book_2_img_li clearfix" v-for="(item, index) in pageData[3].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_num_1_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_2_img_li_img" :src="item.img_url" title="" alt="">
|
|
|
|
+ <div class="book_2_img_li_dot1 dot1 clearfix">{{ item.title }}</div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块4 end -->
|
|
|
|
+ <!-- 模块5 -->
|
|
|
|
+ <div class="book_2_img_ul clearfix" v-if="tabsData2 == 2">
|
|
|
|
+ <div class="book_2_img_li clearfix" v-for="(item, index) in pageData[4].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_num_1_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_2_img_li_img" :src="item.img_url" :title="item.title">
|
|
|
|
+ <div class="book_2_img_li_dot1 dot1 clearfix">{{ item.title }}</div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块5 end -->
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 文化艺术 -->
|
|
|
|
+ <div class="index_3_right clearfix">
|
|
|
|
+ <div class="book_head_box clearfix">
|
|
|
|
+ <div class="book_head_left">
|
|
|
|
+ <NuxtLink class="book_head_a book_head_only" :href="getLinkPath(pageData[5])"
|
|
|
|
+ v-if="pageData[5]" :title="pageData[5].alias">
|
|
|
|
+ {{ pageData[5].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[5])" v-if="pageData[5]"
|
|
|
|
+ :title="pageData[5].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_3_img_ul clearfix">
|
|
|
|
+ <div class="book_3_img_li clearfix" v-for="(item, index) in pageData[5].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_3_img_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_3_img_li_img" :src="item.img_url" title="" alt="">
|
|
|
|
+ <div class="book_3_img_li_dot1 dot1 clearfix">{{ item.title }}</div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_2_ul clearfix">
|
|
|
|
+ <div class="book_2_li clearfix" v-for="(item, index) in pageData[5].data2" :key="index">
|
|
|
|
+ <NuxtLink class="book_2_li_a dot1" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ {{ item.title }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ <div class="book_2_li_tag">详</div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 文化艺术 -->
|
|
|
|
+ </section>
|
|
|
|
+ <HomeAdvertising :imgurl="adImg2"></HomeAdvertising>
|
|
|
|
+ <section class="index_4 clearfix">
|
|
|
|
+ <!-- 模块7 -->
|
|
|
|
+ <div class="index_4_left clearfix">
|
|
|
|
+ <div class="book_head_box clearfix">
|
|
|
|
+ <div class="book_head_left">
|
|
|
|
+ <NuxtLink class="book_head_a book_head_only" :href="getLinkPath(pageData[6])"
|
|
|
|
+ v-if="pageData[6]" :title="pageData[6].alias">
|
|
|
|
+ {{ pageData[6].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[6])" v-if="pageData[6]"
|
|
|
|
+ :title="pageData[6].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_5_img_ul clearfix">
|
|
|
|
+ <div class="book_5_img_li clearfix" v-for="(item, index) in pageData[6].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_5_img_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_5_img_li_img" :src="item.img_url" :title="item.title">
|
|
|
|
+ <div class="book_5_img_li_right clearfix">
|
|
|
|
+ <div class="book_5_img_li_dot2 dot2">{{ item.title }}</div>
|
|
|
|
+ <div class="book_5_img_li_foot clearfix">
|
|
|
|
+ <span class="book_5_img_li_foot_red">¥</span>
|
|
|
|
+ <span class="book_5_img_li_foot_num">{{ item.price }}</span>
|
|
|
|
+ <span class="book_5_img_li_foot_text">市场价:</span>
|
|
|
|
+ <span class="book_5_img_li_foot_price">¥{{ item.market_price }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块7 end -->
|
|
|
|
+ <!-- 模块8 -->
|
|
|
|
+ <div class="index_4_right clearfix">
|
|
|
|
+ <div class="book_head_box clearfix">
|
|
|
|
+ <div class="book_head_left">
|
|
|
|
+ <NuxtLink class="book_head_a book_head_only" :href="getLinkPath(pageData[7])"
|
|
|
|
+ v-if="pageData[7]" :title="pageData[7].alias">
|
|
|
|
+ {{ pageData[7].alias }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <NuxtLink class="book_head_a_more" :href="getLinkPath(pageData[7])" v-if="pageData[7]"
|
|
|
|
+ :title="pageData[7].title">
|
|
|
|
+ 栏目简介
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_4_img_ul clearfix">
|
|
|
|
+ <div class="book_4_img_li clearfix" v-for="(item, index) in pageData[7].data" :key="index">
|
|
|
|
+ <NuxtLink class="book_4_img_li_a" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ <img class="book_4_img_li_img" :src="item.img_url" title="" alt="">
|
|
|
|
+ <div class="book_4_img_li_dot1 dot1 clearfix">{{ item.title }}</div>
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="book_3_ul clearfix">
|
|
|
|
+ <div class="book_3_li clearfix" v-for="(item, index) in pageData[7].data2" :key="index">
|
|
|
|
+ <NuxtLink class="book_3_li_a dot1" :href="getLinkPathDetail(item)" :title="item.title">
|
|
|
|
+ {{ item.title }}
|
|
|
|
+ </NuxtLink>
|
|
|
|
+ <div class="book_3_li_tag">详</div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 模块8 end -->
|
|
|
|
+ </section>
|
|
|
|
+ </main>
|
|
|
|
+
|
|
|
|
+ <!-- 页脚部分 -->
|
|
|
|
+ <HomeFoot1></HomeFoot1>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+<script setup>
|
|
|
|
+//0.加载页面依赖 start ---------------------------------------->
|
|
|
|
+import { ref, onMounted } from 'vue';
|
|
|
|
+import { ElMessage } from 'element-plus';
|
|
|
|
+
|
|
|
|
+//格式化跳转路径 - 标题
|
|
|
|
+//首页分类栏目标题,不需要考虑外链
|
|
|
|
+const getLinkPath = (item) => {
|
|
|
|
+ //return `/${item.url}/1.html`;
|
|
|
|
+ //return `/newsList/${item.cid}?page=1`;
|
|
|
|
+ return `/${item.aLIas_pinyin}/list-1.html`;
|
|
|
|
+}
|
|
|
|
+//首页跳转到详情,这里需要考虑外链
|
|
|
|
+const getLinkPathDetail = (item) => {
|
|
|
|
+ if (item.islink == 1) {
|
|
|
|
+ return `${item.linkurl}`;
|
|
|
|
+ } else {
|
|
|
|
+ //return `/${item.aLIas_pinyin}/${item.id}`;
|
|
|
|
+ //return `/newsDetail/${item.id}`
|
|
|
|
+ return `/${item.pinyin}/${item.id}.html`;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+//0.加载页面依赖 end ---------------------------------------->
|
|
|
|
+
|
|
|
|
+//1.获得路由id start ---------------------------------------->
|
|
|
|
+const route = useRoute();
|
|
|
|
+
|
|
|
|
+//获得当前的完整路径
|
|
|
|
+const fullPath = route.path;
|
|
|
|
+//拆分,取出来中间这一段,然后提取数字部分
|
|
|
|
+const segments = fullPath.split('/');
|
|
|
|
+const targetSegment = segments[1];
|
|
|
|
+//let routeId = 11 //排除路径错误可以打开这个
|
|
|
|
+//const numberPart = targetSegment.match(/\d+$/)?.[0];
|
|
|
|
+//let routeId = numberPart;
|
|
|
|
+let routeId;
|
|
|
|
+//通过导航路径反向查询导航id
|
|
|
|
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
|
|
|
|
+ method: 'GET',
|
|
|
|
+ query: {
|
|
|
|
+ 'pinyin': targetSegment,
|
|
|
|
+ },
|
|
|
|
+});
|
|
|
|
+if (getRouteId.code == 200) {
|
|
|
|
+ routeId = getRouteId.data.category_id
|
|
|
|
+} else {
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+ console.log("错误位置:通过url路径查询导航池id")
|
|
|
|
+ console.log("后端错误反馈:", getRouteId.message)
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+}
|
|
|
|
+//1.获得路由id end ---------------------------------------->
|
|
|
|
+
|
|
|
|
+//2.页面交互效果 start ---------------------------------------->
|
|
|
|
+//2.1 新闻图片切换
|
|
|
|
+const hoverStatus = ref(0)
|
|
|
|
+const qhPic = function (num) {
|
|
|
|
+ console.log(num)
|
|
|
|
+ hoverStatus.value = num;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+//2.2 选项卡切换
|
|
|
|
+let showTabs = ref(1)
|
|
|
|
+// let qhtabs = function (number) {
|
|
|
|
+// console.log(number)
|
|
|
|
+// showTabs.value = number
|
|
|
|
+// }
|
|
|
|
+
|
|
|
|
+//2.3 展示广告
|
|
|
|
+let adImg1 = ref({})
|
|
|
|
+let adImg2 = ref({})
|
|
|
|
+let adImg3 = ref({})
|
|
|
|
+let adImg4 = ref({})
|
|
|
|
+onMounted(async () => {
|
|
|
|
+ //从客户端获取行政职能部门 加快打开速度
|
|
|
|
+ const { $webUrl, $CwebUrl } = useNuxtApp();
|
|
|
|
+ //广告1
|
|
|
|
+ let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0001`
|
|
|
|
+ const responseAd1 = await fetch(url, {
|
|
|
|
+ headers: {
|
|
|
|
+ 'Content-Type': 'application/json',
|
|
|
|
+ 'Userurl': $CwebUrl,
|
|
|
|
+ 'Origin': $CwebUrl
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ const resultAd1 = await responseAd1.json();
|
|
|
|
+ adImg1.value = resultAd1.data[0];
|
|
|
|
+
|
|
|
|
+ //广告2
|
|
|
|
+ let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0002`
|
|
|
|
+ const responseAd2 = await fetch(url2, {
|
|
|
|
+ headers: {
|
|
|
|
+ 'Content-Type': 'application/json',
|
|
|
|
+ 'Userurl': $CwebUrl,
|
|
|
|
+ 'Origin': $CwebUrl
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ const resultAd2 = await responseAd2.json();
|
|
|
|
+ adImg2.value = resultAd2.data[0];
|
|
|
|
+
|
|
|
|
+ //广告3
|
|
|
|
+ let url3 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0003`
|
|
|
|
+ const responseAd3 = await fetch(url3, {
|
|
|
|
+ headers: {
|
|
|
|
+ 'Content-Type': 'application/json',
|
|
|
|
+ 'Userurl': $CwebUrl,
|
|
|
|
+ 'Origin': $CwebUrl
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ const resultAd3 = await responseAd3.json();
|
|
|
|
+ adImg3.value = resultAd3.data[0];
|
|
|
|
+
|
|
|
|
+ //广告4
|
|
|
|
+ let url4 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0004`
|
|
|
|
+ const responseAd4 = await fetch(url4, {
|
|
|
|
+ headers: {
|
|
|
|
+ 'Content-Type': 'application/json',
|
|
|
|
+ 'Userurl': $CwebUrl,
|
|
|
|
+ 'Origin': $CwebUrl
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ const resultAd4 = await responseAd4.json();
|
|
|
|
+ adImg4.value = resultAd4.data[0];
|
|
|
|
+
|
|
|
|
+})
|
|
|
|
+//2.页面交互效果 end ---------------------------------------->
|
|
|
|
+
|
|
|
|
+//3.渲染页面数据 start ---------------------------------------->
|
|
|
|
+//3.1 该页面上所有的导航池 转为动态数据
|
|
|
|
+const pageCategory = ref([]);
|
|
|
|
+//3.2 该页面上需要渲染的所有数据
|
|
|
|
+const pageData = ref([
|
|
|
|
+ // { id: 0, data: [], data2: [], title: "", cid: "" },
|
|
|
|
+ // { id: 1, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 2, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 3, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 4, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 5, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 6, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 7, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 8, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 9, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 10, data: [], title: "", cid: "" },
|
|
|
|
+ // { id: 10, data: [], title: "", cid: "" },
|
|
|
|
+ // {
|
|
|
|
+ // id: 11,
|
|
|
|
+ // title: "",
|
|
|
|
+ // data: [],
|
|
|
|
+ // data1: [],
|
|
|
|
+ // data2: [],
|
|
|
|
+ // data3: [],
|
|
|
|
+ // data4: [],
|
|
|
|
+ // category_id1: "",
|
|
|
|
+ // category_id2: "",
|
|
|
|
+ // category_id3: "",
|
|
|
|
+ // category_id4: "",
|
|
|
|
+ // title1: "",
|
|
|
|
+ // title2: "",
|
|
|
|
+ // title3: "",
|
|
|
|
+ // title4: "",
|
|
|
|
+ // cid: ""
|
|
|
|
+ // },
|
|
|
|
+ // { id: 12, data1: [], data2: [], data3: [], cid: "" },
|
|
|
|
+])
|
|
|
|
+
|
|
|
|
+const navSize = ref("");
|
|
|
|
+const tabsData1 = ref(1);
|
|
|
|
+const tabsData2 = ref(1);
|
|
|
|
+
|
|
|
|
+//3.3 获取所有导航
|
|
|
|
+try {
|
|
|
|
+ const navigateData = await requestDataPromise('/web/getWebsiteModelCategory', {
|
|
|
|
+ method: 'GET',
|
|
|
|
+ query: {
|
|
|
|
+ 'placeid': 1,
|
|
|
|
+ 'pid': routeId,
|
|
|
|
+ 'num': 8
|
|
|
|
+ },
|
|
|
|
+ });
|
|
|
|
+ if (navigateData.code == 200) {
|
|
|
|
+ // 遍历可用的导航池放到页面中
|
|
|
|
+ for (let index in navigateData.data) {
|
|
|
|
+ let data = {
|
|
|
|
+ title: navigateData.data[index].name,
|
|
|
|
+ cid: navigateData.data[index].category_id,
|
|
|
|
+ children_count: navigateData.data[index].children_count,
|
|
|
|
+ alias: navigateData.data[index].alias,
|
|
|
|
+ aLIas_pinyin: targetSegment + "/" + navigateData.data[index].aLIas_pinyin,
|
|
|
|
+ data: [],
|
|
|
|
+ data1: [],
|
|
|
|
+ data2: [],
|
|
|
|
+ data3: [],
|
|
|
|
+ data4: [],
|
|
|
|
+ category_id1: "",
|
|
|
|
+ category_id2: "",
|
|
|
|
+ category_id3: "",
|
|
|
|
+ category_id4: "",
|
|
|
|
+ title1: "",
|
|
|
|
+ title2: "",
|
|
|
|
+ title3: "",
|
|
|
|
+ title4: ""
|
|
|
|
+ };
|
|
|
|
+ if (navigateData.data[index].is_url == 1) {
|
|
|
|
+ // 处理 URL 的逻辑
|
|
|
|
+ } else {
|
|
|
|
+ //每个页面最多8个模块
|
|
|
|
+ pageData.value.push(data);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ //导航池加载完毕,开始申请模块数据
|
|
|
|
+ let getJson = [
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[0].cid + ",6,0" },//模块1时政书讯
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[1].cid + ",6,0" },//模块2读书读报
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[2].cid + ",8,0" },//模块3文化艺术
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[3].cid + ",8,0" },//模块4生活百科
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[4].cid + ",8,0" },//模块5养生保健
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[5].cid + ",3,6" },//模块6典集史鉴
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[6].cid + ",3,0" },//模块7党政报刊
|
|
|
|
+ { "parent": routeId + ",0,0", "child": pageData.value[7].cid + ",3,6" },//模块8涉农报刊
|
|
|
|
+ ]
|
|
|
|
+
|
|
|
|
+ let jsonString = JSON.stringify(getJson);
|
|
|
|
+ getPageAllData(jsonString);
|
|
|
|
+
|
|
|
|
+ } else {
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+ console.log("错误位置:分类页导航池")
|
|
|
|
+ console.log("后端错误反馈:", navigateData.message)
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+ }
|
|
|
|
+} catch (error) {
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+ console.log("错误位置:分类页导航渲染阶段")
|
|
|
|
+ console.log("错误:导航池渲染执行接口出错!请检查首页的14的模块的具体执行方法!")
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+async function getPageAllData(jsonString) {
|
|
|
|
+ const mkdata = await requestDataPromise('/web/getWebsiteBook', {
|
|
|
|
+ method: 'GET',
|
|
|
|
+ query: {
|
|
|
|
+ 'id': jsonString
|
|
|
|
+ },
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ if (mkdata.code == 200) {
|
|
|
|
+ console.log(778899)
|
|
|
|
+ console.log(mkdata.data)
|
|
|
|
+ //模块1时政书讯
|
|
|
|
+ pageData.value[0].data = mkdata.data[0].child.imgnum;
|
|
|
|
+ //模块2读书读报
|
|
|
|
+ pageData.value[1].data = mkdata.data[1].child.imgnum;
|
|
|
|
+ //模块3文化艺术
|
|
|
|
+ pageData.value[2].data = mkdata.data[2].child.imgnum;
|
|
|
|
+ //模块4生活百科
|
|
|
|
+ pageData.value[3].data = mkdata.data[3].child.imgnum;
|
|
|
|
+ //模块5养生保健
|
|
|
|
+ pageData.value[4].data = mkdata.data[4].child.imgnum;
|
|
|
|
+ // 模块6
|
|
|
|
+ pageData.value[5].data = mkdata.data[5].child.imgnum;
|
|
|
|
+ pageData.value[5].data2 = mkdata.data[5].child.textnum;
|
|
|
|
+ //模块7党政报刊
|
|
|
|
+ pageData.value[6].data = mkdata.data[6].child.imgnum;
|
|
|
|
+ //模块8涉农报刊
|
|
|
|
+ pageData.value[7].data = mkdata.data[7].child.imgnum;
|
|
|
|
+ pageData.value[7].data2 = mkdata.data[7].child.textnum;
|
|
|
|
+
|
|
|
|
+ } else {
|
|
|
|
+ ElMessage.error(mkdata.message)
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+//3.渲染页面数据 end ---------------------------------------->
|
|
|
|
+
|
|
|
|
+//4.设置seo信息 start---------------------------------------->
|
|
|
|
+//4.1 设置seo信息
|
|
|
|
+const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
|
|
|
|
+ method: 'GET',
|
|
|
|
+ query: {
|
|
|
|
+ 'catid': routeId
|
|
|
|
+ },
|
|
|
|
+});
|
|
|
|
+
|
|
|
|
+if (setData.code == 200) {
|
|
|
|
+ let seoTitle = setData.data.seo_title;
|
|
|
|
+ let seoDescription = setData.data.seo_description;
|
|
|
|
+ let seoKeywords = setData.data.seo_keywords;
|
|
|
|
+ let seoSuffix = setData.data.suffix;
|
|
|
|
+ let seoName = setData.data.website_name;
|
|
|
|
+
|
|
|
|
+ useSeoMeta({
|
|
|
|
+ title: seoTitle + "_" + seoSuffix,
|
|
|
|
+ meta: [
|
|
|
|
+ { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
|
|
|
|
+ { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
|
|
|
|
+ ]
|
|
|
|
+ });
|
|
|
|
+} else {
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+ console.log("错误位置:设置分类页面SEO数据")
|
|
|
|
+ console.log("后端错误反馈:", setData.message)
|
|
|
|
+ console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
|
|
|
|
+}
|
|
|
|
+//4.设置seo信息 end---------------------------------------->
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="less" scoped>
|
|
|
|
+@import '@/assets/css/shukan.less';
|
|
|
|
+</style>
|