新版本官网优化完成

2025-02-12 16:37:07 +08:00
parent 43a2e17a80
commit 3efdbfc662
547 changed files with 23001 additions and 28169 deletions
--- a/pages/search/[id].vue
+++ b/pages/search/[id].vue
@@ -0,0 +1,146 @@
+<template>
+
+  <!-- 主体部分 -->
+  <div class="xl:w-screen-xl m-auto py-4 mt-20">
+    <el-row :gutter="24" id="container" class="clearfix">
+      <el-col :span="5" class="left">
+        <!-- 内页左侧组件 -->
+        <Left :category="category"  />
+      </el-col>
+      <el-col :span="19" class="right">
+        <div class="sitemp h-[32px] flex justify-between">
+          <h2>
+            {{ $t('searchKeywords') }}：{{ where.keywords }}
+          </h2>
+        </div>
+        <el-alert v-if="where.keywords" :title="`${$t('search.results')}：${$t('search.find')} ${total} ${$t('search.nums')}`" type="warning" :closable="false" />
+        <div class="content">
+
+          <ul class="news_listn clearfix">
+            <template v-for="(item,index) in list" key="index">
+              <li class="clearfix">
+                <a :href="detail(item)" target="_blank" class="n-left fl">
+                  <el-image :src="item.image" :fit="`scale-down`" class="w-[240px] h-[158px]" :alt="item.title" />
+                </a>
+                <div class="n-right fr">
+                  <h3><a :href="detail(item)" target="_blank" :title="item.title" v-html="replaceKeywords(item.title)"></a></h3>
+                  <div v-html="replaceKeywords(item.comments)" class="line-clamp-2"></div>
+                  <div class="date">{{ $t('createTime') }}：{{ dayjs(item.createTime).format('YYYY-MM-DD') }}</div>
+                  <div class="date">{{ $t('search.column') }}：{{ item.categoryName }}</div>
+                  <div class="n-more"><a :href="detail(item)">{{ $t('seeMore') }}>></a></div>
+                </div>
+              </li>
+            </template>
+            <div class="clearboth"></div>
+          </ul>
+
+          <Pagination :total="total" @done="search" />
+
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+<script setup lang="ts">
+import Banner from "@/components/Banner.vue";
+import {useLayout, usePage} from "~/composables/configState";
+import type {CmsNavigation} from "~/api/cms/cmsNavigation/model";
+import type {CmsArticle, CmsArticleParam} from "~/api/cms/cmsArticle/model";
+import dayjs from "dayjs";
+import {ArrowRight} from '@element-plus/icons-vue'
+import {detail, getPath} from "~/utils/common";
+import Left from "~/components/Left.vue";
+import {listCmsNavigation} from "~/api/cms/cmsNavigation";
+import {pageCmsArticle} from "~/api/cms/cmsArticle";
+import {listCmsModel} from "~/api/cms/cmsModel";
+
+const route = useRoute();
+
+// 页面信息
+const list = ref<CmsArticle[]>([]);
+const i18n = useI18n();
+const category = ref<CmsNavigation[]>([]);
+const total = ref(0);
+
+// 获取状态
+const page = usePage();
+const layout = useLayout();
+
+// 搜索表单
+const where = reactive<CmsArticleParam>({
+  keywords: '',
+  page: 1,
+  limit: 10,
+  status: 0,
+  parentId: undefined,
+  categoryId: undefined,
+  lang: i18n.locale.value
+});
+
+const replaceKeywords = (text: any) => {
+  return text.replace(`${where.keywords}`,'<font color=#ff0000>' + where.keywords + '</font>');
+}
+
+// 加载页面数据
+const reload = async () => {
+  listCmsModel({
+    model: getPath(1)
+  }).then(response => {
+    const data = response[0];
+    if(data){
+      // 获取栏目信息
+      page.value = data
+      layout.value.banner = data.banner;
+
+      // 设置页面标题
+      useSeoMeta({
+        description: data?.comments || `${route.params.id}`,
+        keywords: `${route.params.id}`,
+        titleTemplate: `【搜索结果】${route.params.id}` + ' - %s',
+      })
+      // 二级栏目分类
+      listCmsNavigation({
+        parentId: 2847,
+      }).then(categoryData => {
+        category.value = categoryData;
+        // 加载文章列表
+        if(!getPath(1)){
+          return ElMessage.error('请输入搜索关键词！');
+        }
+        where.keywords = `${route.params.id}`;
+        pageCmsArticle(where).then(response => {
+          if(response){
+            total.value = response?.count;
+            list.value = response?.list;
+          }
+        })
+      })
+    }
+
+  }).catch(err => {
+    console.log(err,'加载失败...')
+  })
+}
+
+/**
+ * 搜索
+ * @param data
+ */
+const search = (data: CmsArticleParam) => {
+  where.page = data.page;
+  reload();
+}
+
+watch(
+    () => route.path,
+    () => {
+      reload();
+    },
+    {immediate: true}
+);
+</script>
+<style scoped lang="less">
+.sitemp h2{
+  width: 500px !important;
+}
+</style>