From 13936283c0561e7d7cdffb8069e862b507fa8e57 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Wed, 13 Nov 2024 20:38:49 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=B7=B2=E7=9F=A5=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/cms/cmsWebsite/model/index.ts       |  3 ++
 components/AppHeader.vue                |  4 +--
 components/Banner.vue                   | 18 ++++++++----
 nuxt.config.ts                          |  4 +--
 pages/components/AboutUs.vue            | 25 ++++++++++++----
 pages/components/Carousel.vue           | 30 ++++++++++++++-----
 pages/components/CompanyStyle.vue       | 12 ++++++--
 pages/components/NewsCenter.vue         | 34 +++++++++++++++++++---
 pages/components/VideoCenter.vue        | 38 +++++++++++++++++++++++--
 pages/detail/components/LikeArticle.vue | 24 +++++++++++++++-
 pages/detail/components/PageBanner.vue  | 32 ++-------------------
 11 files changed, 163 insertions(+), 61 deletions(-)

diff --git a/api/cms/cmsWebsite/model/index.ts b/api/cms/cmsWebsite/model/index.ts
index 27a9469..f91793f 100644
--- a/api/cms/cmsWebsite/model/index.ts
+++ b/api/cms/cmsWebsite/model/index.ts
@@ -1,4 +1,5 @@
 import type { PageParam } from '@/api';
+import type {CmsNavigation} from "~/api/cms/cmsNavigation/model";
 
 /**
  * 网站信息记录表
@@ -88,6 +89,8 @@ export interface CmsWebsite {
   updateTime?: string;
   // 网站配置
   config?: any;
+  topNavs?: CmsNavigation[];
+  bottomNavs?: CmsNavigation[];
 }
 
 /**
diff --git a/components/AppHeader.vue b/components/AppHeader.vue
index 4e6d720..b5c8f11 100644
--- a/components/AppHeader.vue
+++ b/components/AppHeader.vue
@@ -93,7 +93,7 @@
               </el-dropdown>
             </template>
             <template v-else>
-              <el-button type="primary" v-if="!token" @click="navigateTo(`/passport/login`)">登录/注册</el-button>
+<!--              <el-button type="primary" v-if="!token" @click="navigateTo(`/passport/login`)">登录/注册</el-button>-->
               <!--                <el-button v-if="config.showLoginButton" circle :icon="ElIconUserFilled" @click="goLogin"></el-button>-->
             </template>
           </ClientOnly>
@@ -117,7 +117,7 @@
                 <el-dropdown-item divided @click="loginDeveloperCenterByToken">会员中心</el-dropdown-item>
                 <el-dropdown-item divided command="logOut" @click="navigateTo('/user/logout')">退出</el-dropdown-item>
               </template>
-              <el-dropdown-item v-if="!token" divided @click="navigateTo(`/passport/login`)">登录</el-dropdown-item>
+<!--              <el-dropdown-item v-if="!token" divided @click="navigateTo(`/passport/login`)">登录</el-dropdown-item>-->
             </el-dropdown-menu>
           </template>
         </el-dropdown>
diff --git a/components/Banner.vue b/components/Banner.vue
index 58988fd..9c3cdbe 100644
--- a/components/Banner.vue
+++ b/components/Banner.vue
@@ -1,16 +1,22 @@
 <template>
-  <div class="banner m-auto relative sm:flex mt-[60px]">
+  <div class="banner m-auto relative sm:flex mt-[60px] hidden-sm-and-down">
+    <template v-if="layout && layout.showBanner">
+      <el-image :src="layout?.photo || config.subpageBanner" :class="layout?.style" class="sm:h-auto"></el-image>
+      <div class="banner-bar absolute top-0 w-full sm:flex hidden">
+        <div class="banner-text py-12 md:w-screen-xl m-auto opacity-90 flex flex-col justify-center">
+          <div class="keywords my-4 text-3xl">{{ layout?.name }}</div>
+          <div class="description mb-4 mt-1 text-xl max-w-3xl text-gray-600">{{ layout?.description }}</div>
+        </div>
+      </div>
+    </template>
+  </div>
+  <div class="banner m-auto relative sm:flex mt-[48px] hidden-sm-and-up">
     <template v-if="layout && layout.showBanner">
       <el-image :src="layout?.photo || config.subpageBanner" :class="layout?.style" class="sm:h-auto"></el-image>
       <div class="banner-bar absolute top-0 w-full sm:flex hidden">
         <div class="banner-text py-12 md:w-screen-xl m-auto opacity-90 flex flex-col justify-center">
           <div class="keywords my-4 text-3xl">{{ layout?.name }}</div>
           <div class="description mb-4 mt-1 text-xl max-w-3xl text-gray-600">{{ layout?.description }}</div>
-<!--          <div class="buy-btn">-->
-<!--            <el-button v-if="layout.demoUrl" @click="openSpmUrl(layout.demoUrl)" type="primary">演示地址</el-button>-->
-<!--            <el-button v-if="layout.docUrl" @click="openSpmUrl(layout.docUrl)">产品文档</el-button>-->
-<!--          </div>-->
-<!--          <div class="demo-account mt-3 text-blue-7" v-if="layout?.account">账号密码：{{ layout.account }}</div>-->
         </div>
       </div>
     </template>
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 53090e6..7ad9dfd 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -27,11 +27,11 @@ export default defineNuxtConfig({
         }
     },
     devServer: {
-        port: 10304
+        port: 10301
     },
     runtimeConfig: {
         public: {
-            tenantId: 10304,
+            tenantId: 10301,
             // 开发环境配置
             // apiServer: 'http://127.0.0.1:9002/api',
             // 生产环境
diff --git a/pages/components/AboutUs.vue b/pages/components/AboutUs.vue
index fec3e94..f3e5e2c 100644
--- a/pages/components/AboutUs.vue
+++ b/pages/components/AboutUs.vue
@@ -12,13 +12,25 @@
           {{ title }}
         </h2>
       </div>
-      <div class="xl:w-screen-xl m-auto text-xl flex justify-between " v-if="config?.IndexAboutInfo">
-        <p class="indent-xl max-w-3/5 px-4 left-2-right" :class="config?.IndexAboutStyle"
-           style="font-family: Source Han Serif, SimSun,serif">{{ config?.IndexAboutInfo }}</p>
-        <div class="carousel px-3 text-center right-to-left">
-          <img :src="config?.IndexAboutImg" class="scale-img"/>
+      <div class="hidden-sm-and-down">
+        <div class="xl:w-screen-xl m-auto text-xl flex justify-between " v-if="config?.IndexAboutInfo">
+          <p class="indent-xl max-w-3/5 px-4 left-2-right" :class="config?.IndexAboutStyle"
+             style="font-family: Source Han Serif, SimSun,serif">{{ config?.IndexAboutInfo }}</p>
+          <div class="carousel px-3 text-center right-to-left">
+            <img :src="config?.IndexAboutImg" class="scale-img"/>
+          </div>
         </div>
       </div>
+      <div class="hidden-sm-and-up">
+        <div class="xl:w-screen-xl m-auto text-lg flex flex-col " v-if="config?.IndexAboutInfo">
+          <div class="carousel px-3 text-center right-to-left">
+            <img :src="config?.IndexAboutImg" class="scale-img"/>
+          </div>
+          <p class="p-3 left-2-right" :class="config?.IndexAboutStyle"
+             style="font-family: Source Han Serif, SimSun,serif">{{ config?.IndexAboutInfo }}</p>
+        </div>
+      </div>
+
     </template>
   </div>
 
@@ -70,13 +82,14 @@ watch(
 }
 
 .custom-tabs .el-tabs__item {
-  font-size: 22px; /* 调整为你想要的字体大小 */
+  font-size: 20px; /* 调整为你想要的字体大小 */
 }
 </style>
 
 <style lang="less" scoped>
 .scale-img {
   width: 500px;
+  max-width: 100% !important;
 }
 
 .scale-img:hover {
diff --git a/pages/components/Carousel.vue b/pages/components/Carousel.vue
index 086d0f2..8d48b02 100644
--- a/pages/components/Carousel.vue
+++ b/pages/components/Carousel.vue
@@ -1,12 +1,22 @@
 <template>
-  <div class="w-full bg-white mt-[60px] mb-3" v-if="ad">
-    <el-carousel indicator-position="none" :height="ad?.height">
-      <el-carousel-item v-for="(item,index) in ad?.imgArr" :key="index">
-        <div class="item relative" @click="openSpmUrl(`https://www.baidu.com`)">
+  <div>
+    <div class="w-full bg-white mt-[60px] mb-3 hidden-sm-and-down" v-if="ad">
+      <el-carousel indicator-position="none" :height="ad?.height">
+        <el-carousel-item v-for="(item,index) in ad?.imgArr" :key="index">
+          <div class="item relative">
+            <el-image :src="item.url" />
+          </div>
+        </el-carousel-item>
+      </el-carousel>
+    </div>
+    <!-- 移动端 -->
+    <div class="sm:hidden w-full bg-white mt-[48px] mb-3 hidden-sm-and-up" v-if="ad">
+      <el-carousel indicator-position="none" height="160">
+        <el-carousel-item v-for="(item,index) in ad?.imgArr" :key="index">
           <el-image :src="item.url" />
-        </div>
-      </el-carousel-item>
-    </el-carousel>
+        </el-carousel-item>
+      </el-carousel>
+    </div>
   </div>
 </template>
 
@@ -57,3 +67,9 @@ watch(
     {immediate: true}
 );
 </script>
+
+<style>
+.hidden-sm-and-up .el-carousel{
+  height: 160px;
+}
+</style>
diff --git a/pages/components/CompanyStyle.vue b/pages/components/CompanyStyle.vue
index 1a1fb09..3a8ccf4 100644
--- a/pages/components/CompanyStyle.vue
+++ b/pages/components/CompanyStyle.vue
@@ -2,7 +2,7 @@
   <div class="w-full bg-gray-100 pb-20">
     <div class="text-center flex flex-col items-center py-15 relative ">
       <div class="sub-title">
-        <p class="text-gray-200 text-6xl font-bold dark:text-gray-700 py-0 line-height-5">
+        <p class="text-gray-200 text-5xl font-bold dark:text-gray-700 py-0 line-height-5">
           {{ comments }}
         </p>
       </div>
@@ -10,7 +10,15 @@
         {{ title }}
       </h2>
     </div>
-    <div class="xl:w-screen-xl m-auto text-xl right-to-left" v-if="show">
+    <div class="xl:w-screen-xl m-auto text-xl right-to-left hidden-sm-and-down" v-if="show">
+      <el-carousel :interval="4000" type="card" height="350px" arrow="never" indicator-position="none">
+        <el-carousel-item class="relative" v-for="(item,index) in list" :key="index">
+          <el-image :src="item.path" class="cursor-pointer scale-img w-full" />
+          <div class="absolute bg-[#e65a01]/75 w-full py-2 z-100 text-center text-sm text-white bottom-0" v-if="item.comments">{{ item.comments }}</div>
+        </el-carousel-item>
+      </el-carousel>
+    </div>
+    <div class="xl:w-screen-xl m-auto text-xl right-to-left hidden-sm-and-up">
       <el-carousel :interval="4000" type="card" height="350px" arrow="never" indicator-position="none">
         <el-carousel-item class="relative" v-for="(item,index) in list" :key="index">
           <el-image :src="item.path" class="cursor-pointer scale-img w-full" />
diff --git a/pages/components/NewsCenter.vue b/pages/components/NewsCenter.vue
index c7bd4e8..ec548d7 100644
--- a/pages/components/NewsCenter.vue
+++ b/pages/components/NewsCenter.vue
@@ -1,8 +1,5 @@
 <template>
-  <!--  <div class="relative">-->
-  <!--    <el-image src="https://oss.wsdns.cn/20241108/dbb0ef723f414394bbf6736818f7ac2c.png" class="absolute top-0 z-0" />-->
-  <!--  </div>-->
-  <div class="w-full bg-white pb-20 mb-3">
+  <div class="w-full bg-white pb-20 mb-3 hidden-sm-and-down">
     <div class="text-center flex flex-col items-center py-15 relative bg-white">
       <div class="sub-title">
         <p class="text-gray-200 text-6xl font-bold dark:text-gray-700 py-0 line-height-5">
@@ -47,6 +44,34 @@
     </div>
   </div>
 
+  <div class="w-full bg-white pb-20 mb-3 hidden-sm-and-up">
+    <div class="text-center flex flex-col items-center py-15 relative bg-white">
+      <div class="sub-title">
+        <p class="text-gray-200 text-5xl font-bold dark:text-gray-700 py-0 line-height-5">
+          {{ comments }}
+        </p>
+      </div>
+      <h2 class="text-4xl font-bold tracking-tight text-[#409eff] lg:text-5xl">
+        {{ title }}
+      </h2>
+    </div>
+    <div class="xl:w-screen-2xl m-auto text-lg">
+      <div class="tabs px-3 w-full left-2-right">
+        <el-tabs class="custom-tabs" v-model="categoryId" @tab-change="handleClick">
+          <el-tab-pane v-for="(cate,index) in category?.data" :key="index" :label="cate.title"
+                       :name="cate.navigationId" class="text-lg"/>
+        </el-tabs>
+        <template v-for="(item,index) in list" :key="index">
+          <li class="flex justify-between py-2">
+            <a class="" :class="`item-${index}`"
+               :href="getSpmUrl(`/detail`,item,item.articleId)" target="_blank">{{ item.title }}<span class="text-gray-400 font-200 px-1">{{ dayjs(item.createTime).format('MM-DD') }}</span></a>
+
+          </li>
+        </template>
+      </div>
+    </div>
+  </div>
+
 
 </template>
 
@@ -175,4 +200,5 @@ watch(
     transform: translateX(0);
   }
 }
+//.hidden-sm-and-down .carousel{display: none;}
 </style>
diff --git a/pages/components/VideoCenter.vue b/pages/components/VideoCenter.vue
index 64c9e28..ab6c01d 100644
--- a/pages/components/VideoCenter.vue
+++ b/pages/components/VideoCenter.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="w-full bg-white pb-20 mb-3">
+  <div class="w-full bg-white pb-20 mb-3 hidden-sm-and-down">
     <div class="text-center flex flex-col items-center py-15 relative ">
       <div class="sub-title">
-        <p class="text-gray-200 text-6xl font-bold dark:text-gray-700 py-0 line-height-5">
+        <p class="text-gray-200 text-5xl font-bold dark:text-gray-700 py-0 line-height-5">
           {{ comments }}
         </p>
       </div>
@@ -23,6 +23,40 @@
       </div>
     </div>
   </div>
+  <div class="w-full bg-white pb-20 mb-3 hidden-sm-and-up">
+    <div class="text-center flex flex-col items-center py-15 relative ">
+      <div class="sub-title">
+        <p class="text-gray-200 text-6xl font-bold dark:text-gray-700 py-0 line-height-5">
+          {{ comments }}
+        </p>
+      </div>
+      <h2 class="text-3xl font-bold tracking-tight text-[#FF6E0CFF] lg:text-5xl">
+        {{ title }}
+      </h2>
+    </div>
+    <div class="xl:w-screen-xl m-auto text-xl scale" v-if="config && show">
+      <div class="hidden-sm-and-down carousel py-3 text-center" v-if="config?.IndexVideoCenter">
+        <video id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="900" height="510"
+               :poster="config?.IndexVideoImg" data-setup="{}">
+          <source :src="config?.IndexVideoCenter" type="video/mp4">
+          <p class="vjs-no-js">
+            To view this video please enable JavaScript, and consider upgrading to a web browser that
+            <a :href="config?.IndexVideoCenter" target="_blank">supports HTML5 video</a>
+          </p>
+        </video>
+      </div>
+      <div class="hidden-sm-and-up carousel text-center" v-if="config?.IndexVideoCenter">
+        <video id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="350" height="210"
+               :poster="config?.IndexVideoImg" data-setup="{}">
+          <source :src="config?.IndexVideoCenter" type="video/mp4">
+          <p class="vjs-no-js">
+            To view this video please enable JavaScript, and consider upgrading to a web browser that
+            <a :href="config?.IndexVideoCenter" target="_blank">supports HTML5 video</a>
+          </p>
+        </video>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script setup lang="ts">
diff --git a/pages/detail/components/LikeArticle.vue b/pages/detail/components/LikeArticle.vue
index abf3d37..57e6136 100644
--- a/pages/detail/components/LikeArticle.vue
+++ b/pages/detail/components/LikeArticle.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-affix class="lg:p-0 p-3" v-if="form" :offset="offset" @change="onAffix">
+  <el-affix class="lg:p-0 p-3 hidden-sm-and-down" v-if="form" :offset="offset" @change="onAffix">
     <el-button type="text" color="gray">
       <div class="text-xl text-gray-600 ">推荐文章</div>
       <el-icon class="el-icon--right text-gray-600" color="#999999">
@@ -21,6 +21,28 @@
       </el-card>
     </template>
   </el-affix>
+  <div class="lg:p-0 p-3 hidden-sm-and-up">
+    <el-button type="text" color="gray">
+      <div class="text-xl text-gray-600 ">推荐文章</div>
+      <el-icon class="el-icon--right text-gray-600" color="#999999">
+        <ArrowRightBold/>
+      </el-icon>
+    </el-button>
+    <template v-for="(item,index) in list" :key="index">
+      <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer mt-3"
+               @click="openSpmUrl(`/detail`,item,item.articleId,true)">
+        <el-image :src="item.image" fit="fill" :lazy="true" class="w-full md:h-[150px] h-[199px] cursor-pointer"/>
+        <div class="flex-1 px-4 py-5 sm:p-6 !p-4">
+          <div class="text-gray-700 dark:text-white text-base font-semibold  flex items-center gap-1.5">
+            <span class="flex-1 text-xl cursor-pointer max-h-[57px] overflow-hidden">{{ item.title }}</span>
+          </div>
+          <div class="flex items-center gap-1.5 py-2 text-gray-500">
+            <span>{{ dayjs(item.createTime).format('YYYY-MM-DD') }}</span>
+          </div>
+        </div>
+      </el-card>
+    </template>
+  </div>
 </template>
 <script setup lang="ts">
 import { ArrowRightBold } from '@element-plus/icons-vue'
diff --git a/pages/detail/components/PageBanner.vue b/pages/detail/components/PageBanner.vue
index dc52d1e..6300119 100644
--- a/pages/detail/components/PageBanner.vue
+++ b/pages/detail/components/PageBanner.vue
@@ -1,5 +1,7 @@
 <template>
-  <div class="banner m-auto relative sm:flex mt-[60px]">
+  <div class="banner m-auto relative sm:flex">
+    <div class="mt-[60px] hidden-sm-and-down"></div>
+    <div class="mt-[51px] hidden-sm-and-up"></div>
     <svg viewBox="0 0 1440 181" fill="none" xmlns="http://www.w3.org/2000/svg"
          class="pointer-events-none absolute w-full top-[-2px] transition-all text-green-5 flex-shrink-0 opacity-100 duration-[400ms] opacity-80 -z-10">
       <mask id="path-1-inside-1_414_5526" fill="white">
@@ -33,34 +35,6 @@
             <el-space class="mt-4 text-gray-500 dark:text-gray-400">
               {{ dayjs(form.createTime).format('YYYY-MM-DD') }}
             </el-space>
-
-<!--            <el-space class="mt-4">-->
-<!--              <el-button-->
-<!--                  :icon="ElIconView"-->
-<!--                  size="large"-->
-<!--                  v-if="form.demoUrl"-->
-<!--                  @click="openSpmUrl(form.demoUrl)"-->
-<!--              >-->
-<!--                演示地址-->
-<!--              </el-button>-->
-<!--              <el-button-->
-<!--                  v-if="form.buyUrl"-->
-<!--                  :icon="ElIconBottom"-->
-<!--                  size="large"-->
-<!--                  @click="openSpmUrl(form.buyUrl)"-->
-<!--              >-->
-<!--                下载模版-->
-<!--              </el-button>-->
-<!--              <el-button-->
-<!--                  :icon="ElIconMemo"-->
-<!--                  size="large"-->
-<!--                  v-if="form.docUrl"-->
-<!--                  @click="openSpmUrl(form.docUrl)"-->
-<!--              >-->
-<!--                帮助文档-->
-<!--              </el-button>-->
-<!--            </el-space>-->
-
           </div>
         </div>
       </div>