index.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515
  1. <template>
  2. <div>
  3. <HomePageHead></HomePageHead>
  4. <HomePageNavigation></HomePageNavigation>
  5. <div>当前皮肤:{{ skinId }}</div>
  6. <HomeAdvertising :imgurl="adImg1"></HomeAdvertising>
  7. <!--头条-->
  8. <!-- <HomePageMessage></HomePageMessage> -->
  9. <!-- 第一部分 -->
  10. <!-- <div class="part1">
  11. <div class="inner">
  12. <div class="part1_left">
  13. <div class="hengxian">
  14. <em></em>
  15. </div>
  16. <div class="part1_left_title">
  17. <img src="../public/index/nav01.png" alt="">
  18. <NuxtLink class="active" v-if="pageData[0].cid" :href="getLinkPath(pageData[0])"
  19. :title="pageData[0].alias">
  20. {{ pageData[0].alias }}
  21. </NuxtLink>
  22. </div>
  23. <div class="part1_left_content">
  24. <div class="part1_left_content1">
  25. <div class="part1_left_photo">
  26. <div class="part1_left_photo11" v-for="item in boxData1" :key="index">
  27. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  28. :target="item.islink == 1 ? '_blank' : '_self'">
  29. <img :src="item.imgurl" :alt="item.title">
  30. <div class="left_content">
  31. {{ item.title }}
  32. </div>
  33. </NuxtLink>
  34. </div>
  35. </div>
  36. <ul class="part1_left_context">
  37. <li class="part1_left_contextList" v-for="item in boxData1data2" :key="index">
  38. {{ item.title }}
  39. </li>
  40. </ul>
  41. </div>
  42. <div class="part1_left_content2">
  43. <ul class="part1_left_context222">
  44. <li class="part1_left_contextList222" v-for="item in boxData1data3" :key="index">
  45. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  46. :target="item.islink == 1 ? '_blank' : '_self'">
  47. {{ item.title }}
  48. </NuxtLink>
  49. </li>
  50. </ul>
  51. <ul class="part1_left_context222">
  52. <li class="part1_left_contextList222" v-for="item in boxData1data4" :key="index">
  53. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  54. :target="item.islink == 1 ? '_blank' : '_self'">
  55. {{ item.title }}
  56. </NuxtLink>
  57. </li>
  58. </ul>
  59. </div>
  60. </div>
  61. </div>
  62. <div class="part1_right">
  63. <div class="part1_right_title">
  64. <NuxtLink :class="{ 'part1_right_titlelist': true, 'active': hoverStatus == 1 }"
  65. @mouseenter="qhPic(1)" v-if="pageData[1].cid" :href="getLinkPath(pageData[1])"
  66. :title="pageData[1].alias">
  67. {{ pageData[1].alias }}
  68. </NuxtLink>
  69. <NuxtLink :class="{ 'part1_right_titlelist': true, 'active': hoverStatus == 2 }"
  70. @mouseenter="qhPic(2)" v-if="pageData[2].cid" :href="getLinkPath(pageData[2])"
  71. :title="pageData[2].alias">
  72. {{ pageData[2].alias }}
  73. </NuxtLink>
  74. </div>
  75. <div v-if="hoverStatus == 1">
  76. <div class="part1_right_photo_text">
  77. <div v-for="item in boxData2" :key="index">
  78. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  79. :target="item.islink == 1 ? '_blank' : '_self'">
  80. <img :src="item.imgurl" :alt="item.title">
  81. <div class="part1_right_text">
  82. {{ item.title }}
  83. </div>
  84. </NuxtLink>
  85. </div>
  86. </div>
  87. <ul class="part1_right_content">
  88. <li class="part1_right_contentList" v-for="item in boxData2data2" :key="index">
  89. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  90. :target="item.islink == 1 ? '_blank' : '_self'">
  91. <em></em>
  92. {{ item.title }}
  93. </NuxtLink>
  94. </li>
  95. </ul>
  96. </div>
  97. <div v-if="hoverStatus == 2">
  98. <div class="part1_right_photo_text">
  99. <div v-for="item in boxData3" :key="index">
  100. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  101. :target="item.islink == 1 ? '_blank' : '_self'">
  102. <img :src="item.imgurl" :alt="item.title">
  103. <div class="part1_right_text">
  104. {{ item.title }}
  105. </div>
  106. </NuxtLink>
  107. </div>
  108. </div>
  109. <ul class="part1_right_content">
  110. <li class="part1_right_contentList" v-for="item in boxData3data2" :key="index">
  111. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  112. :target="item.islink == 1 ? '_blank' : '_self'">
  113. <em></em>
  114. {{ item.title }}
  115. </NuxtLink>
  116. </li>
  117. </ul>
  118. </div>
  119. </div>
  120. </div>
  121. </div> -->
  122. <!-- 广告位 2 -->
  123. <!-- <HomeAdvertising :imgurl="adImg2"></HomeAdvertising> -->
  124. <!-- 第二部分 -->
  125. <!-- <div class="part2">
  126. <div class="inner">
  127. <div class="part2_left">
  128. <div class="part2_hengxian">
  129. <em></em>
  130. </div>
  131. <div class="part2_left_title">
  132. <img src="../public/index/nav02.png" alt="">
  133. <NuxtLink class="active" v-if="pageData[3].cid" :href="getLinkPath(pageData[3])"
  134. :title="pageData[3].alias">
  135. {{ pageData[3].alias }}
  136. </NuxtLink>
  137. </div>
  138. <div class="part2_left_content1">
  139. <ul class="part2_left_content111">
  140. <li class="part2_left_content1_list" v-for="item in boxData4" :key="index">
  141. <NuxtLink :href="getLinkPath1(item)" :title="item.title"
  142. :target="item.islink == 1 ? '_blank' : '_self'">
  143. <span class="nav2_title">{{ item.alias }}</span>
  144. </NuxtLink>
  145. <NuxtLink :href="getLinkPathDetail1(item)" :title="item.title"
  146. :target="item.islink == 1 ? '_blank' : '_self'">
  147. <span class="nav2_title_content">
  148. {{ item.title }}
  149. </span>
  150. </NuxtLink>
  151. </li>
  152. </ul>
  153. </div>
  154. <ul class="part2_left_content2">
  155. <li class="part2_left_content2list" v-for="item in boxData4data2" :key="index">
  156. <NuxtLink :href="getLinkPathDetail1(item)" :title="item.title"
  157. :target="item.islink == 1 ? '_blank' : '_self'">
  158. <img :src="item.imgurl" :alt="item.title" class="part2_left_content222img">
  159. <div class="content2_text">
  160. <span class="content2_text_content">
  161. {{ item.title }}
  162. </span>
  163. <NuxtLink :href="getLinkPath1(item)" :title="item.title"
  164. :target="item.islink == 1 ? '_blank' : '_self'">
  165. <span class="content2_text_title">{{ item.alias }}</span>
  166. </NuxtLink>
  167. </div>
  168. </NuxtLink>
  169. </li>
  170. <div class="adlogo3" v-if="adImg3">
  171. <a href="http://sannongdy.org.cn/" v-if="adImg3.image_url == null" target="_blank"
  172. :title="adImg3.place_name">
  173. <img :src="adImg3.thumb" :alt="adImg3.place_name" data-tag="imgurl.ad_tag">
  174. </a>
  175. <a :href="adImg3.image_url" v-else :title="adImg3.ad_name">
  176. <img :src="adImg3.image_src" :alt="adImg3.ad_name" data-tag="imgurl.ad_tag">
  177. </a>
  178. </div>
  179. </ul>
  180. </div>
  181. <div class="part2_right">
  182. <div class="part2_right_title">
  183. <NuxtLink v-if="pageData[4].cid" :href="getLinkPath(pageData[4])" :title="pageData[4].alias">
  184. {{ pageData[4].alias }}
  185. </NuxtLink>
  186. </div>
  187. <ul class="part2_right_content">
  188. <li class="part2_right_contentList" v-for="(item, index) in boxData5" :key="index">
  189. <span class="listNumber">{{ index + 1 }}</span>
  190. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  191. :target="item.islink == 1 ? '_blank' : '_self'">
  192. {{ item.title }}
  193. </NuxtLink>
  194. </li>
  195. </ul>
  196. </div>
  197. </div>
  198. </div> -->
  199. <!-- 第三部分 -->
  200. <!-- <div class="part3">
  201. <div class="inner">
  202. <div class="part3_left">
  203. <div class="part3_hengxian">
  204. <em></em>
  205. </div>
  206. <div class="part3_left_title">
  207. <img src="../public/index/nav03.png" alt="">
  208. <NuxtLink class="active" v-if="pageData[5].cid" :href="getLinkPath(pageData[5])"
  209. :title="pageData[5].alias">
  210. {{ pageData[5].alias }}
  211. </NuxtLink>
  212. </div>
  213. <div class="part3_left_content">
  214. <div class="part3_left_content1">
  215. <div class="part3_left_content1_photo1">
  216. <div v-for="item in boxData6" :key="index">
  217. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  218. :target="item.islink == 1 ? '_blank' : '_self'">
  219. <img :src="item.imgurl" :alt="item.title">
  220. <div class="part3_left_content1_text">
  221. {{ item.title }}
  222. </div>
  223. </NuxtLink>
  224. </div>
  225. </div>
  226. <div class="part3_left_content1_photo2">
  227. <div class="part3_left_content1_photo2list" v-for="item in boxData6data2" :key="index">
  228. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  229. :target="item.islink == 1 ? '_blank' : '_self'">
  230. <img :src="item.imgurl" :alt="item.title">
  231. <div class="part3_left_content1_text">
  232. {{ item.title }}
  233. </div>
  234. </NuxtLink>
  235. </div>
  236. </div>
  237. </div>
  238. <div class="part3_left_content2">
  239. <ul class="part3_left_content2_text">
  240. <li class="part3_left_content2_list" v-for="item in boxData6data3" :key="index">
  241. <NuxtLink :href="getLinkPath1(item)" :title="item.title"
  242. :target="item.islink == 1 ? '_blank' : '_self'">
  243. <span class="nav3_title">{{ item.alias }}</span>
  244. </NuxtLink>
  245. <NuxtLink :href="getLinkPathDetail1(item)" :title="item.title"
  246. :target="item.islink == 1 ? '_blank' : '_self'">
  247. <span class="nav3_title_content">
  248. {{ item.title }}
  249. </span>
  250. </NuxtLink>
  251. </li>
  252. </ul>
  253. <ul class="part3_left_content2_text">
  254. <li class="part3_left_content2_list" v-for="item in boxData6data4" :key="index">
  255. <NuxtLink :href="getLinkPath1(item)" :title="item.title"
  256. :target="item.islink == 1 ? '_blank' : '_self'">
  257. <span class="nav3_title">{{ item.alias }}</span>
  258. </NuxtLink>
  259. <NuxtLink :href="getLinkPathDetail1(item)" :title="item.title"
  260. :target="item.islink == 1 ? '_blank' : '_self'">
  261. <span class="nav3_title_content">
  262. {{ item.title }}
  263. </span>
  264. </NuxtLink>
  265. </li>
  266. </ul>
  267. </div>
  268. </div>
  269. </div>
  270. <div class="part3_right">
  271. <div class="part3_right_title">
  272. <NuxtLink class="active" v-if="pageData[6].cid" :href="getLinkPath(pageData[6])"
  273. :title="pageData[6].alias">
  274. {{ pageData[6].alias }}
  275. </NuxtLink>
  276. </div>
  277. <div class="part3_right_content">
  278. <div class="right_photo_text" v-for="item in boxData7" :key="index">
  279. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  280. :target="item.islink == 1 ? '_blank' : '_self'">
  281. <img :src="item.imgurl" :alt="item.title">
  282. <div class="right_text">
  283. {{ item.title }}
  284. </div>
  285. </NuxtLink>
  286. </div>
  287. <ul class="rightcontent_text">
  288. <li class="rightcontent_textlist" v-for="item in boxData7data3" :key="index">
  289. <em></em>
  290. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  291. :target="item.islink == 1 ? '_blank' : '_self'">
  292. {{ item.title }}
  293. </NuxtLink>
  294. </li>
  295. </ul>
  296. <div class="right_photo_text" v-for="item in boxData7data2" :key="index">
  297. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  298. :target="item.islink == 1 ? '_blank' : '_self'">
  299. <img :src="item.imgurl" :alt="item.title">
  300. <div class="right_text">
  301. {{ item.title }}
  302. </div>
  303. </NuxtLink>
  304. </div>
  305. <ul class="rightcontent_text">
  306. <li class="rightcontent_textlist" v-for="item in boxData7data4" :key="index">
  307. <em></em>
  308. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  309. :target="item.islink == 1 ? '_blank' : '_self'">
  310. {{ item.title }}
  311. </NuxtLink>
  312. </li>
  313. </ul>
  314. </div>
  315. </div>
  316. </div>
  317. </div> -->
  318. <!-- <HomeAdvertising :imgurl="adImg4"></HomeAdvertising> -->
  319. <!-- 第四部分 -->
  320. <!-- <div class="part4">
  321. <div class="inner">
  322. <div class="part4_one">
  323. <div class="part4_title">
  324. <div class="part4_hengxian">
  325. <em></em>
  326. </div>
  327. <div class="part4_left_title">
  328. <img src="../public/index/nav03.png" alt="">
  329. <NuxtLink class="active" v-if="pageData[7].cid" :href="getLinkPath(pageData[7])"
  330. :title="pageData[7].alias">
  331. {{ pageData[7].alias }}
  332. </NuxtLink>
  333. </div>
  334. </div>
  335. <div class="part4_photo_text">
  336. <div v-for="item in boxData8" :key="index">
  337. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  338. :target="item.islink == 1 ? '_blank' : '_self'">
  339. <img :src="item.imgurl" :alt="item.title">
  340. <span class="text">{{ item.title }}</span>
  341. </NuxtLink>
  342. </div>
  343. </div>
  344. <ul class="part4_photo_content">
  345. <li class="part4_photo_contentlist" v-for="item in boxData8data2" :key="index">
  346. <NuxtLink :href="getLinkPath1(item)" :title="item.title"
  347. :target="item.islink == 1 ? '_blank' : '_self'">
  348. <span class="nav11_title">{{ item.alias }}</span>
  349. </NuxtLink>
  350. <NuxtLink :href="getLinkPathDetail1(item)" :title="item.title"
  351. :target="item.islink == 1 ? '_blank' : '_self'">
  352. <span class="nav11_title_content">
  353. {{ item.title }}
  354. </span>
  355. </NuxtLink>
  356. </li>
  357. </ul>
  358. </div>
  359. <div class="part4_one">
  360. <div class="part4_title">
  361. <div class="part4_hengxian">
  362. <em></em>
  363. </div>
  364. <div class="part4_left_title">
  365. <img src="../public/index/nav03.png" alt="">
  366. <NuxtLink class="active" v-if="pageData[8].cid" :href="getLinkPath(pageData[8])"
  367. :title="pageData[8].alias">
  368. {{ pageData[8].alias }}
  369. </NuxtLink>
  370. </div>
  371. </div>
  372. <div class="part4_photo_text">
  373. <div v-for="item in boxData9" :key="index">
  374. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  375. :target="item.islink == 1 ? '_blank' : '_self'">
  376. <img :src="item.imgurl" :alt="item.title">
  377. <span class="text">{{ item.title }}</span>
  378. </NuxtLink>
  379. </div>
  380. </div>
  381. <ul class="part4_photo_content">
  382. <li class="part4_photo_contentlist" v-for="item in boxData9data2" :key="index">
  383. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  384. :target="item.islink == 1 ? '_blank' : '_self'">
  385. <span class="nav11_title_content2">
  386. {{ item.title }}
  387. </span>
  388. </NuxtLink>
  389. </li>
  390. </ul>
  391. </div>
  392. <div class="part4_one">
  393. <div class="part4_title">
  394. <div class="part4_hengxian">
  395. <em></em>
  396. </div>
  397. <div class="part4_left_title">
  398. <img src="../public/index/nav03.png" alt="">
  399. <NuxtLink class="active" v-if="pageData[9].cid" :href="getLinkPath(pageData[9])"
  400. :title="pageData[9].alias">
  401. {{ pageData[9].alias }}
  402. </NuxtLink>
  403. </div>
  404. </div>
  405. <div class="part4_photo_text">
  406. <div v-for="item in boxData10" :key="index">
  407. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  408. :target="item.islink == 1 ? '_blank' : '_self'">
  409. <img :src="item.imgurl" :alt="item.title">
  410. <span class="text">{{ item.title }}</span>
  411. </NuxtLink>
  412. </div>
  413. </div>
  414. <ul class="part4_photo_content">
  415. <li class="part4_photo_contentlist" v-for="item in boxData10data2" :key="index">
  416. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title"
  417. :target="item.islink == 1 ? '_blank' : '_self'">
  418. <span class="nav11_title_content2">
  419. {{ item.title }}
  420. </span>
  421. </NuxtLink>
  422. </li>
  423. </ul>
  424. </div>
  425. </div>
  426. </div> -->
  427. <HomeFoot></HomeFoot>
  428. </div>
  429. </template>
  430. <script setup>
  431. //0.pinia单基本信息 start---------------------------------------->
  432. //0.1获得pinia源
  433. import { useTemplateBaseStore } from '@/stores/templateBase'
  434. const templateBaseStore = useTemplateBaseStore()
  435. //0.2获得该页的皮肤id - 在每个组件中也是同样的获得方法
  436. const skinId = ref("")
  437. //0.3获得站点基本信息
  438. let getTemplateBaseInfo = async () => {
  439. const responseStatus = await requestDataPromise('/web/getWebsiteAllinfo', {
  440. method: 'GET',
  441. query: {
  442. 'link_textnum':24,
  443. 'link_imgnum':18,
  444. 'link_footnum':4
  445. },
  446. });
  447. if (responseStatus.code == 200) {
  448. templateBaseStore.setWebSiteInfo(responseStatus.data)
  449. skinId.value = templateBaseStore.webSiteInfo.website_foot.foot_info.template_id;
  450. }
  451. }
  452. getTemplateBaseInfo();
  453. //0.4获得广告池
  454. let getAdList = async (adKey) => {
  455. const responseStatus = await requestDataPromise('/web/getWebsiteAdvertisement', {
  456. method: 'GET',
  457. query: {
  458. },
  459. });
  460. if (responseStatus.code == 200) {
  461. //console.log(responseStatus.data)
  462. templateBaseStore.setAdList(responseStatus.data)
  463. //获取广告
  464. //adImg.value = requestAd(templateBaseStore.webAdList,templateBaseStore.webSiteInfo.website_head.ad_key + "_" + "top")
  465. }
  466. }
  467. getAdList();
  468. //0.5设置seo信息
  469. //0.pinia单基本信息 end---------------------------------------->
  470. //1.加载页面必备组件 start---------------------------------------->
  471. import { ref, onMounted } from 'vue';
  472. import { ElMessage } from 'element-plus';
  473. //1.加载页面必备组件 end---------------------------------------->
  474. //2.页面数据 start---------------------------------------->
  475. //2.页面数据 end---------------------------------------->
  476. //5.设置seo数据 start---------------------------------------->
  477. //获取seo数据
  478. const setData = await requestDataPromise('/web/getWebsiteFootInfo', {
  479. method: 'GET',
  480. query: {},
  481. });
  482. if (setData.code == 200) {
  483. let seoTitle = setData.data.website_head.title;
  484. let seoDescription = setData.data.website_head.description;
  485. let seoKeywords = setData.data.website_head.keywords;
  486. let seoSuffix = setData.data.website_head.suffix;
  487. let seoName = setData.data.website_head.website_name;
  488. useSeoMeta({
  489. title: seoTitle + "_" + seoSuffix,
  490. meta: [
  491. { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
  492. { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
  493. ]
  494. });
  495. } else {
  496. //console.log("设置首页SEO出错!", setData.message)
  497. }
  498. //5.设置seo数据 start---------------------------------------->
  499. </script>
  500. <style lang="less" scoped>
  501. @import url('@/assets/css/index.less');
  502. </style>