|
|
@@ -1,296 +1,85 @@
|
|
|
<template>
|
|
|
<div id="newsList">
|
|
|
- <!-- 页面头部 -->
|
|
|
- <HomePageHead></HomePageHead>
|
|
|
- <!-- 导航栏 -->
|
|
|
- <HomePageNavigation1></HomePageNavigation1>
|
|
|
- <!-- 列表页广告一 -->
|
|
|
- <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
|
|
|
- <!-- 搜索框 -->
|
|
|
- <div class="search">
|
|
|
- <div class="inner">
|
|
|
- <input v-model="keywordInput" type="text" placeholder="请输入搜索内容">
|
|
|
- <button @click="goSearch">搜索</button>
|
|
|
- </div>
|
|
|
+ <!-- 头部 -->
|
|
|
+ <templateHead></templateHead>
|
|
|
+ <!-- 菜单 -->
|
|
|
+ <templateMenu></templateMenu>
|
|
|
+ <div>
|
|
|
+ <!--广告组件 农民网-->
|
|
|
+ <templateAd :adTag="'nmw_search_0001'" :skinId="skinId" :adData="adData"></templateAd>
|
|
|
+ <!--搜索组件-->
|
|
|
+ <templateSearch :skinId="skinId" :templateData="testTemplateData"></templateSearch>
|
|
|
+ <!--广告组件 农民网-->
|
|
|
+ <templateAd :adTag="'nmw_search_0002'" :skinId="skinId" :adData="adData"></templateAd>
|
|
|
</div>
|
|
|
- <div class="breadcrumb">
|
|
|
- <div class="inner">
|
|
|
- <span class="location">当前位置:</span>
|
|
|
- <el-breadcrumb :separator-icon="ArrowRight">
|
|
|
- <el-breadcrumb-item>
|
|
|
- <NuxtLink to="/">首页</NuxtLink>
|
|
|
- </el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item>搜索</el-breadcrumb-item>
|
|
|
- </el-breadcrumb>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="newsList">
|
|
|
- <div class="inner">
|
|
|
- <div class="innerLeft">
|
|
|
- <ul class="list" v-if="newsList.length >= 0">
|
|
|
- <li v-for="(item, index) in newsList" :key="index">
|
|
|
- <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
|
|
|
- :target="item.islink == 1 ? '_blank' : '_self'">
|
|
|
- <span class="listText"> {{ item.title }}</span>
|
|
|
- <span class="time">{{ getTime(item.updated_at, 'month', 1) }}</span>
|
|
|
- </NuxtLink>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <div v-if="newsList.length == 0" class="empty">
|
|
|
- <div>
|
|
|
- <img src="../../public/search/empty.png" alt="暂无内容">
|
|
|
- <p>暂无搜索数据</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 分页器 -->
|
|
|
- <div class="pagination" v-if="total > 0">
|
|
|
- <el-pagination size="small" background layout="prev, pager, next" :total="total" class="mt-4"
|
|
|
- :page-size="pageSize" prev-text="上一页" next-text="下一页" @change="changePage" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 列表页广告二 -->
|
|
|
- <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
|
|
|
- <!-- 页面底部 -->
|
|
|
- <HomeFoot></HomeFoot>
|
|
|
+ <!-- 底部 -->
|
|
|
+ <templateFoot></templateFoot>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-//1.页面依赖 start ---------------------------------------->
|
|
|
-import { ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus'
|
|
|
-import { ArrowRight } from '@element-plus/icons-vue'
|
|
|
+//0.加载全局模板组件 start---------------------------------------->
|
|
|
+//0.1 全局通栏
|
|
|
+import templateHead from '@/components/template/sector/head/1200x200/1.vue'
|
|
|
+import templateMenu from '@/components/template/sector/menu/1200x130/1.vue'
|
|
|
+import templateFoot from '@/components/template/sector/foot/1200x580/1.vue'
|
|
|
+//0.2.1 广告组件
|
|
|
+import templateAd from '@/components/template/sector/body/ad/1200x90/1.vue'
|
|
|
+//0.2.2 搜索组件
|
|
|
+import templateSearch from '@/components/template/sector/body/search/list/1200x1300/1.vue'
|
|
|
+//0.加载全局模板组件 end---------------------------------------->
|
|
|
+
|
|
|
+//1.获得基本信息单元 start---------------------------------------->
|
|
|
+//1.1获得页面依赖
|
|
|
import { ref, onMounted } from 'vue';
|
|
|
-
|
|
|
-const route = useRoute();
|
|
|
-//const pageCatids = route.query.catids;
|
|
|
-const pageCatids = ""
|
|
|
-if (route.params.id == 'search') {
|
|
|
-
|
|
|
-} else {
|
|
|
- const pageCatids = route.params.id
|
|
|
-}
|
|
|
-
|
|
|
-const pageDepartment_id = route.query.department_id;
|
|
|
-
|
|
|
-//const category_id = route.query.category_id; //获得该页面的id
|
|
|
-// const searchKey = route.query.keyword
|
|
|
-// const catids = ref([]);
|
|
|
-
|
|
|
-//关键词
|
|
|
-let total = useState("total", () => 0)
|
|
|
-let page = useState("page", () => 1)
|
|
|
-let pageSize = useState("pageSize", () => 20)
|
|
|
-
|
|
|
-//格式化跳转链接
|
|
|
-const getLinkPathDetail = (item) => {
|
|
|
- if (item.islink == 1) {
|
|
|
- return `${item.linkurl}`;
|
|
|
- } else {
|
|
|
- return `/${item.pinyin}/${item.id}.html`;
|
|
|
- }
|
|
|
-}
|
|
|
-//1.页面依赖 end ---------------------------------------->
|
|
|
-
|
|
|
-//2.页面数据 start ---------------------------------------->
|
|
|
-//2.1 广告
|
|
|
-let adImg1 = ref([]);
|
|
|
-let adImg2 = ref([]);
|
|
|
-onMounted(async () => {
|
|
|
- //从客户端获取行政职能部门 加快打开速度
|
|
|
- const { $webUrl, $CwebUrl } = useNuxtApp();
|
|
|
- //广告1
|
|
|
- let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmw_search_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=nmw_search_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];
|
|
|
-})
|
|
|
-
|
|
|
-
|
|
|
-// 新闻列表
|
|
|
-const newsList = ref([]);
|
|
|
-let keywordInput = ref("");
|
|
|
-
|
|
|
-//搜索
|
|
|
-let goSearch = async () => {
|
|
|
- console.log(page.value)
|
|
|
- console.log(pageSize.value)
|
|
|
- console.log(keywordInput.value)
|
|
|
- console.log(pageCatids)
|
|
|
- console.log(pageDepartment_id)
|
|
|
-
|
|
|
- const listData = await requestDataPromise('/web/selectWebsiteCategory', {
|
|
|
- method: 'GET',
|
|
|
- query: {
|
|
|
- 'page': page.value,
|
|
|
- 'pageSize': pageSize.value,
|
|
|
- 'keyword': keywordInput.value,
|
|
|
- 'cityid': pageCatids,
|
|
|
- 'department_id': pageDepartment_id
|
|
|
- },
|
|
|
+//1.2获得pinia源
|
|
|
+import { useTemplateBaseStore } from '@/stores/templateBase'
|
|
|
+const templateBaseStore = useTemplateBaseStore()
|
|
|
+//1.3获得该页的皮肤id - 在每个组件中也是同样的获得方法
|
|
|
+const skinId = ref("")
|
|
|
+const websiteId = ref("")
|
|
|
+//1.4获得站点基本信息
|
|
|
+const responseStatus = await requestDataPromise('/web/getWebsiteAllinfo', {
|
|
|
+ method: 'GET',
|
|
|
+ query: {
|
|
|
+ 'link_textnum':24,
|
|
|
+ 'link_imgnum':18,
|
|
|
+ 'link_footnum':4
|
|
|
+ },
|
|
|
+});
|
|
|
+if (responseStatus.code == 200) {
|
|
|
+ //0.3.1设置站点基本信息
|
|
|
+ templateBaseStore.setWebSiteInfo(responseStatus.data)
|
|
|
+ websiteId.value = responseStatus.data.website_head.id;//获得网站id
|
|
|
+ //0.3.2设置皮肤id
|
|
|
+ skinId.value = templateBaseStore.webSiteInfo.website_foot.foot_info.template_id;
|
|
|
+ console.log("当前的网站id:"+responseStatus.data.website_head.id)
|
|
|
+ //0.3.3设置seo信息
|
|
|
+ let seoTitle = templateBaseStore.webSiteInfo.website_head.title;
|
|
|
+ let seoDescription = templateBaseStore.webSiteInfo.website_head.description;
|
|
|
+ let seoKeywords = templateBaseStore.webSiteInfo.website_head.keywords;
|
|
|
+ let seoSuffix = templateBaseStore.webSiteInfo.website_head.suffix;
|
|
|
+ let seoName = templateBaseStore.webSiteInfo.website_head.website_name;
|
|
|
+ useSeoMeta({
|
|
|
+ title: seoTitle + "_" + seoSuffix,
|
|
|
+ meta: [
|
|
|
+ { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
|
|
|
+ { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
|
|
|
+ ]
|
|
|
});
|
|
|
- if (listData.data.rows) {
|
|
|
- console.log(listData)
|
|
|
- newsList.value = listData.data.rows;
|
|
|
- total.value = listData.data.count;
|
|
|
- } else {
|
|
|
- newsList.value = [];
|
|
|
- total.value = 0;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-goSearch();
|
|
|
-//基于导航池搜索
|
|
|
-// let goSearchFont = async (font) => {
|
|
|
-// const listData = await requestDataPromise('/web/getWebsiteArticleList', {
|
|
|
-// method: 'GET',
|
|
|
-// query: {
|
|
|
-// 'page': page.value,
|
|
|
-// 'pageSize': pageSize.value,
|
|
|
-// 'catid': font
|
|
|
-// },
|
|
|
-// });
|
|
|
-// newsList.value = listData.data.rows;
|
|
|
-// total.value = listData.data.count;
|
|
|
-// }
|
|
|
-
|
|
|
-// //基于导航池与关键词搜索
|
|
|
-// let goSearchFontandCid = async (font) => {
|
|
|
-// const listData = await requestDataPromise('/web/getWebsiteArticleList', {
|
|
|
-// method: 'GET',
|
|
|
-// query: {
|
|
|
-// 'page': page.value,
|
|
|
-// 'pageSize': pageSize.value,
|
|
|
-// 'catid': category_id,
|
|
|
-// 'keyword':searchKey
|
|
|
-// },
|
|
|
-// });
|
|
|
-// newsList.value = listData.data.rows;
|
|
|
-// total.value = listData.data.count;
|
|
|
-// }
|
|
|
-
|
|
|
-
|
|
|
-//直接查新闻
|
|
|
-// const newslists = async () => {
|
|
|
-// try {
|
|
|
-// // 从地区跳转
|
|
|
-// if (route.query.catids && route.query.catids.length > 0) {
|
|
|
-// // 将字符串转换回数组，并过滤掉可能的空值
|
|
|
-// catids.value = route.query.catids.split(',').filter(id => id);
|
|
|
-
|
|
|
-// if (catids.value.length > 0) {
|
|
|
-// // 有效的 catids 数组，可以进行后续操作
|
|
|
-// console.log('接收到的分类ID数组：', catids.value);
|
|
|
-// let font = catids.value.join(",")
|
|
|
-// font = "[" + font + "]"
|
|
|
-
|
|
|
-// goSearchFont(font);
|
|
|
-// } else {
|
|
|
-// // 处理空数组情况
|
|
|
-// console.log('未接收到有效的分类ID');
|
|
|
-// }
|
|
|
-// } else {
|
|
|
-// if (category_id == undefined) {
|
|
|
-// //直接搜索 默认进来没有导航池的话 不执行搜索
|
|
|
-// goSearch();
|
|
|
-// } else {
|
|
|
-// goSearchFontandCid();
|
|
|
-// }
|
|
|
-// }
|
|
|
-// } catch (error) {
|
|
|
-// console.error(error);
|
|
|
-// }
|
|
|
-// }
|
|
|
-// newslists();
|
|
|
-
|
|
|
-
|
|
|
-// 查询导航池的方法
|
|
|
-// const newslists = async () => {
|
|
|
-// try {
|
|
|
-// // 从地区跳转
|
|
|
-// if (route.query.catids && route.query.catids.length > 0) {
|
|
|
-// // 将字符串转换回数组，并过滤掉可能的空值
|
|
|
-// catids.value = route.query.catids.split(',').filter(id => id);
|
|
|
-
|
|
|
-// if (catids.value.length > 0) {
|
|
|
-// // 有效的 catids 数组，可以进行后续操作
|
|
|
-// console.log('接收到的分类ID数组：', catids.value);
|
|
|
-// let font = catids.value.join(",")
|
|
|
-// font = "[" + font + "]"
|
|
|
-
|
|
|
-// goSearchFont(font);
|
|
|
-// } else {
|
|
|
-// // 处理空数组情况
|
|
|
-// console.log('未接收到有效的分类ID');
|
|
|
-// }
|
|
|
-// } else {
|
|
|
-// if (category_id == undefined) {
|
|
|
-// //直接搜索 默认进来没有导航池的话 不执行搜索
|
|
|
-// goSearch();
|
|
|
-// } else {
|
|
|
-// goSearchFontandCid();
|
|
|
-// }
|
|
|
-// }
|
|
|
-// } catch (error) {
|
|
|
-// console.error(error);
|
|
|
-// }
|
|
|
-// }
|
|
|
-
|
|
|
-// newslists();
|
|
|
-
|
|
|
-//分页事件
|
|
|
-let changePage = (value) => {
|
|
|
- console.log("当前页码", value);
|
|
|
- page.value = value
|
|
|
- console.log(page.value);
|
|
|
- goSearch()
|
|
|
}
|
|
|
-//2.页面数据 end ---------------------------------------->
|
|
|
-
|
|
|
-
|
|
|
-//4.设置seo信息 start---------------------------------------->
|
|
|
-//4.1 设置seo信息
|
|
|
-const setData = await requestDataPromise('/web/getWebsiteFootInfo', {
|
|
|
+//1.5获得广告池
|
|
|
+const adData = ref([]);
|
|
|
+const adResponseStatus = await requestDataPromise('/web/getWebsiteAdvertisement', {
|
|
|
method: 'GET',
|
|
|
query: {},
|
|
|
});
|
|
|
-
|
|
|
-let seoTitle = setData.data.website_head.title;
|
|
|
-let seoDescription = setData.data.website_head.description;
|
|
|
-let seoKeywords = setData.data.website_head.keywords;
|
|
|
-let seoSuffix = setData.data.website_head.suffix;
|
|
|
-let seoName = setData.data.website_head.website_name;
|
|
|
-
|
|
|
-useSeoMeta({
|
|
|
- title: seoTitle + "_" + seoSuffix,
|
|
|
- meta: [
|
|
|
- { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
|
|
|
- { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
|
|
|
- ]
|
|
|
-});
|
|
|
-//4.设置seo信息 end---------------------------------------->
|
|
|
+if (adResponseStatus.code == 200) {
|
|
|
+ adData.value = adResponseStatus.data;
|
|
|
+ templateBaseStore.setAdList(adResponseStatus.data)
|
|
|
+}
|
|
|
+//1.获得基本信息单元 end---------------------------------------->
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-@import url('@/assets/css/search.less');
|
|
|
</style>
|
dangyunlong