From f2bd5ed4358a6c26a89cde120201bf680d74674a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Sat, 28 Sep 2024 15:52:45 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E5=A4=9A=E7=AB=AF=E9=80=82?=
 =?UTF-8?q?=E9=85=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/AppFooter.vue                |  6 ++--
 components/AppHeader.vue                | 18 ++++++------
 components/CardList.vue                 |  2 +-
 components/PageBanner.vue               |  2 +-
 components/ProductList.vue              |  2 +-
 composables/useServerRequest.ts         | 10 +++----
 layouts/default.vue                     | 35 +++++++++++------------
 nuxt.config.ts                          |  8 +++---
 pages/ask/components/CardList.vue       |  4 +--
 pages/ask/index.vue                     |  2 +-
 pages/case/components/CardList.vue      |  4 +--
 pages/category/components/CardList.vue  |  4 +--
 pages/components/ArticleList.vue        |  4 +--
 pages/components/CardList.vue           |  4 +--
 pages/components/PlugList.vue           |  4 +--
 pages/components/ProductList.vue        |  4 +--
 pages/detail/components/LikeArticle.vue | 27 +-----------------
 pages/detail/components/PageBanner.vue  |  2 +-
 pages/detail/index.vue                  |  8 +++---
 pages/developer/components/CardList.vue |  4 +--
 pages/docs/components/CardList.vue      |  4 +--
 pages/down/components/CardList.vue      |  4 +--
 pages/down/index.vue                    | 37 ++++++++++++++++---------
 pages/market/components/CardList.vue    |  4 +--
 pages/product/components/CardList.vue   |  4 +--
 25 files changed, 96 insertions(+), 111 deletions(-)

diff --git a/components/AppFooter.vue b/components/AppFooter.vue
index 5d08c53..9b8b091 100644
--- a/components/AppFooter.vue
+++ b/components/AppFooter.vue
@@ -11,7 +11,7 @@
     </div>
     <div class="w-full flex flex-col sm:bg-black justify-between">
       <!-- PC版 -->
-      <div class="sub-menu w-full md:w-screen-xl m-auto flex justify-between py-10 text-center p-2 hidden-sm-and-down">
+      <div class="sub-menu w-full xl:w-screen-xl xl:px-0 px-4 m-auto flex justify-between py-10 text-center hidden-sm-and-down">
 
         <!-- 底部菜单 -->
           <div class="left flex flex-col sm:flex-row sm:flex-wrap justify-between gap-3xl sm:w-9/12 flex-wrap w-full">
@@ -62,7 +62,7 @@
 <!--      </div>-->
 
       <!-- 版权信息 -->
-      <div class="w-full md:w-screen-xl w-full m-auto flex sm:flex-row flex-col-reverse sm:justify-between justify-center items-center sm:py-10 pt-6 pb-6 text-center p-2">
+      <div class="w-full xl:w-screen-xl xl:px-0 px-4 w-full m-auto flex sm:flex-row flex-col-reverse sm:justify-between justify-center items-center sm:py-10 pt-6 pb-6 text-center">
         <div class="text-gray-400 sm:gap-xl leading-7 flex flex-col sm:flex-row">
           <span>Copyright © {{ new Date().getFullYear() }} {{ config?.copyright }}</span>
           <a class="text-gray-400 hover:text-gray-400" href="https://beian.miit.gov.cn/" target="_blank"> 备案号：{{ config?.icpNo }}</a>
@@ -76,7 +76,7 @@
     </div>
   </footer>
   <footer class="absolute bottom-0 w-full" v-if="getPath().startsWith('/login')">
-    <div class="w-full md:w-screen-xl w-full m-auto flex sm:flex-row flex-col-reverse sm:justify-center justify-center items-center sm:py-10 pt-6 pb-6 text-center p-2">
+    <div class="w-full xl:w-screen-xl xl:p-0 px-4 w-full m-auto flex sm:flex-row flex-col-reverse sm:justify-center justify-center items-center sm:py-10 pt-6 pb-6 text-center">
       <div class="text-gray-400 sm:gap-xl leading-7 flex flex-col sm:flex-row">
         <span>Copyright © {{ new Date().getFullYear() }} {{ config?.copyright }}</span>
         <a class="text-gray-400 hover:text-gray-400" href="https://beian.miit.gov.cn/" target="_blank"> 备案号：{{ config?.icpNo }}</a>
diff --git a/components/AppHeader.vue b/components/AppHeader.vue
index 3db0b7d..9fc13f3 100644
--- a/components/AppHeader.vue
+++ b/components/AppHeader.vue
@@ -3,11 +3,11 @@
     <header
         class="header z-100 top-0 w-full bg-white/75 opacity-90 backdrop-blur  border-b border-gray-200 dark:border-gray-800 -mb-px sticky top-0 z-50 lg:mb-0 lg:border-0"
         :class="affix ? 'absolute blur-xs' : 'sticky bg-white/75'">
-      <div class="flex items-center between md:w-screen-xl w-full m-auto">
+      <div class="xl:w-screen-xl xl:p-0 px-4 flex items-center between w-full m-auto">
         <div class="header___left flex items-center">
           <div class="logo mt-1 sm:w-[150px] h-7 w-auto py-2 flex items-center">
             <nuxt-link v-if="config?.siteLogo" to="/">
-              <div class="flex flex-col text-center md:p-0 px-4">
+              <div class="flex flex-col text-center xl:p-0">
                 <el-image
                     :src="config.siteLogo"
                     shape="square"
@@ -47,7 +47,7 @@
             </el-menu>
           </div>
         </div>
-        <div class="header__right items-center pr-4 sm:pr-0 md:flex hidden">
+        <div class="header__right items-center pr-4 xl:pr-0 md:flex hidden">
           <el-space class="sm:flex hidden" size="large" v-if="config.showSearchTools">
             <!--          <el-button v-if="token" @click="navigateTo(`/manage`)">控制台</el-button>-->
             <!--          <el-button v-if="config.showSearchIcon" circle :icon="ElIconSearch" @click="navigateTo('/search')"></el-button>-->
@@ -75,17 +75,18 @@
           </el-space>
         </div>
         <!-- 移动端菜单 -->
-        <div class="md:hidden flex md:p-0 px-4">
+        <div class="sm:hidden flex xl:p-0 px-8">
           <el-dropdown>
-            <span class="el-dropdown-link">
+            <el-space class="el-dropdown-link flex items-center">
+              <span>{{ user.nickname }}</span>
               <el-avatar v-if="token" class="cursor-pointer" :src="user?.avatar" :size="30"/>
               <el-button v-else :icon="ElIconMenu"></el-button>
-            </span>
+            </el-space>
             <template #dropdown>
               <el-dropdown-menu>
                 <template v-for="(item, index) in navigations">
                   <el-dropdown-item>
-                    <span @click="navigateTo(item.path)">{{ item.title }}</span>
+                    <span @click="openSpmUrl(`${item.path}`,item,item.navigationId)">{{ item.title }}</span>
                   </el-dropdown-item>
                 </template>
                 <template v-if="token">
@@ -113,8 +114,7 @@ import {
   useProductAffix,
   useSysDomain,
   useToken,
-  useUser,
-  useWebsite
+  useUser
 } from "~/composables/configState";
 import {useServerRequest} from "~/composables/useServerRequest";
 import type {ApiResult} from "~/api";
diff --git a/components/CardList.vue b/components/CardList.vue
index 3e6548e..edf1e0c 100644
--- a/components/CardList.vue
+++ b/components/CardList.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
         <el-col :span="6" class="mb-5 min-w-xs">
diff --git a/components/PageBanner.vue b/components/PageBanner.vue
index 91e1a0d..2e9033b 100644
--- a/components/PageBanner.vue
+++ b/components/PageBanner.vue
@@ -19,7 +19,7 @@
         </linearGradient>
       </defs>
     </svg>
-    <div class="md:w-screen-xl m-auto md:p-0 px-4">
+    <div class="md:w-screen-xl m-auto xl:p-0 px-4">
       <div class="py-8 sm:py-16" _path="/templates" _dir="" _draft="false" _partial="false" _locale=""
            _id="content:4.templates.yml" _type="yaml" _source="content" _file="4.templates.yml" _stem="4.templates"
            _extension="yml">
diff --git a/components/ProductList.vue b/components/ProductList.vue
index 00a3cde..59c7263 100644
--- a/components/ProductList.vue
+++ b/components/ProductList.vue
@@ -9,7 +9,7 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto  relative">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
         <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
diff --git a/composables/useServerRequest.ts b/composables/useServerRequest.ts
index d81a4e7..a33f77a 100644
--- a/composables/useServerRequest.ts
+++ b/composables/useServerRequest.ts
@@ -14,13 +14,11 @@ export const useServerRequest = <T>(url: string, opts?: UseFetchOptions<T, unkno
   // 请求接口
   const baseUrl = ref('');
   // 获取 Cookie
-  const token = useCookie('token');
+  const token = useToken();
+  const _token = localStorage.getItem('token');
 
-  if(localStorage.getItem('token')){
-    const tokenStr = localStorage.getItem('token');
-    if(tokenStr){
-      token.value = JSON.parse(tokenStr)
-    }
+  if(_token){
+    token.value = _token
   }
   baseUrl.value = runtimeConfig.public.apiBase;
 
diff --git a/layouts/default.vue b/layouts/default.vue
index 5105d26..73d4710 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -1,21 +1,22 @@
 <template>
-  <!-- 加载应用 -->
-  <template v-if="!loading" @scroll="handleScroll">
-    <!-- 管理中心界面 -->
-    <template v-if="getPath().startsWith('/manage')">
-      <slot/>
+  <div class="overflow-x-hidden">
+    <!-- 加载应用 -->
+    <template v-if="!loading" @scroll="handleScroll">
+      <!-- 管理中心界面 -->
+      <template v-if="getPath().startsWith('/manage')">
+        <slot/>
+      </template>
+      <!-- 默认布局 -->
+      <template v-else>
+        <app-header/>
+        <slot/>
+        <app-footer/>
+      </template>
     </template>
-    <!-- 默认布局 -->
-    <template v-else>
-      <app-header/>
-      <slot/>
-      <app-footer/>
-    </template>
-  </template>
-
-  <!-- 异常状态 -->
-  <UnderMaintenance v-if="loading"/>
 
+    <!-- 异常状态 -->
+    <UnderMaintenance v-if="loading"/>
+  </div>
 </template>
 <script setup lang="ts">
 import {useServerRequest} from "~/composables/useServerRequest";
@@ -41,10 +42,10 @@ const subMenu = useSubMenu()
 // 挂载钩子
 onMounted(() => {
   //必须在onMounted的时候才能用local和window
-  getLoacl();
+  // getLoacl();
   window.onbeforeunload = () => {
     //离开页面时保存数据，由于可能突发情况，所以重要数据请手动调用setLocal函数
-    setLocal(); //如果需要调试本地存储数据，记得把这个注释一下
+    // setLocal(); //如果需要调试本地存储数据，记得把这个注释一下
   };
 });
 
diff --git a/nuxt.config.ts b/nuxt.config.ts
index f1aa86c..7743b3c 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -33,12 +33,12 @@ export default defineNuxtConfig({
         public: {
             // 开发环境配置
             // tenantId: '5',
-            // apiBase: 'http://127.0.0.1:9090/api',
-            // apiServer: 'http://127.0.0.1:9090/api',
+            apiBase: 'http://127.0.0.1:9090/api',
+            apiServer: 'http://127.0.0.1:9090/api',
 
             // 生产环境
-            apiBase: 'https://server.gxwebsoft.com/api',
-            apiServer: 'https://server.gxwebsoft.com/api',
+            // apiBase: 'https://server.gxwebsoft.com/api',
+            // apiServer: 'https://server.gxwebsoft.com/api',
             globalTitle: '网宿软件',
             domain: 'websoft.top'
         },
diff --git a/pages/ask/components/CardList.vue b/pages/ask/components/CardList.vue
index fbc1fc8..cbccc2e 100644
--- a/pages/ask/components/CardList.vue
+++ b/pages/ask/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 px-4" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer" @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">
diff --git a/pages/ask/index.vue b/pages/ask/index.vue
index 458f0f0..71d2309 100644
--- a/pages/ask/index.vue
+++ b/pages/ask/index.vue
@@ -1,6 +1,6 @@
 <template>
   <PageBanner :layout="layout" title="社区" desc="分享研发成果 交流技术经验" />
-  <el-tabs v-model="activeName" class="md:w-screen-xl m-auto relative sm:flex pb-2" @tab-click="handleClick">
+  <el-tabs v-model="activeName" class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative pb-2" @tab-click="handleClick">
     <el-tab-pane label="轻松一刻" name="happy"></el-tab-pane>
     <el-tab-pane label="企业官网" name="website"></el-tab-pane>
     <el-tab-pane label="企业商城" name="weShop"></el-tab-pane>
diff --git a/pages/case/components/CardList.vue b/pages/case/components/CardList.vue
index aebf5f4..19f2aae 100644
--- a/pages/case/components/CardList.vue
+++ b/pages/case/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 p-4" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
             <el-image :src="item.appIcon" fit="contain" :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">
diff --git a/pages/category/components/CardList.vue b/pages/category/components/CardList.vue
index e69fe60..8e29333 100644
--- a/pages/category/components/CardList.vue
+++ b/pages/category/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer" @click="openSpmUrl(`/detail`,item,item.articleId,true)">
             <el-image :src="item.image" fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer" />
             <div class="flex-1 px-4 py-5 sm:p-6 !p-4">
diff --git a/pages/components/ArticleList.vue b/pages/components/ArticleList.vue
index 593272f..5ea0a1a 100644
--- a/pages/components/ArticleList.vue
+++ b/pages/components/ArticleList.vue
@@ -9,10 +9,10 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer"
                    @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"/>
diff --git a/pages/components/CardList.vue b/pages/components/CardList.vue
index 852bef4..926db63 100644
--- a/pages/components/CardList.vue
+++ b/pages/components/CardList.vue
@@ -9,10 +9,10 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
             <el-image
                 :src="`https://oss.wsdns.cn/20240925/e5e47100f4b6471395b3b81f834d2902.jpg?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90`"
diff --git a/pages/components/PlugList.vue b/pages/components/PlugList.vue
index ba3c889..95980fd 100644
--- a/pages/components/PlugList.vue
+++ b/pages/components/PlugList.vue
@@ -9,10 +9,10 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
             <el-image
                 :src="`https://oss.wsdns.cn/20240925/e5e47100f4b6471395b3b81f834d2902.jpg?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90`"
diff --git a/pages/components/ProductList.vue b/pages/components/ProductList.vue
index 5d908c0..8b8e783 100644
--- a/pages/components/ProductList.vue
+++ b/pages/components/ProductList.vue
@@ -9,10 +9,10 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
             <el-image
                 :src="`${item.image}`"
diff --git a/pages/detail/components/LikeArticle.vue b/pages/detail/components/LikeArticle.vue
index 32173fa..9121d96 100644
--- a/pages/detail/components/LikeArticle.vue
+++ b/pages/detail/components/LikeArticle.vue
@@ -1,6 +1,5 @@
 <template>
-  <!-- PC -->
-  <el-affix class="hidden-sm-and-down" v-if="form" :offset="offset" @change="onAffix">
+  <el-affix class="lg:p-0 p-3" 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">
@@ -23,30 +22,6 @@
       </el-card>
     </template>
   </el-affix>
-  <!-- H5 -->
-  <div class="hidden-xs-and-up p-3">
-    <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">
-          <p 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>
-          </p>
-          <p class="flex items-center gap-1.5 py-2 text-gray-500">
-            <el-avatar :src="item.avatar" :size="20"/>
-            <span>{{ item.nickname }} · {{ dayjs(item.createTime).format('MM-DD hh:mm') }}</span>
-          </p>
-        </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 d672978..526dccd 100644
--- a/pages/detail/components/PageBanner.vue
+++ b/pages/detail/components/PageBanner.vue
@@ -19,7 +19,7 @@
         </linearGradient>
       </defs>
     </svg>
-    <div class="md:w-screen-xl m-auto p-1">
+    <div class="md:w-screen-xl m-auto px-3">
       <Breadcrumb :data="form" />
       <div class="md:py-8 sm:py-16 md:px-0 px-4 py-8" _path="/templates" _dir="" _draft="false" _partial="false" _locale=""
            _id="content:4.templates.yml" _type="yaml" _source="content" _file="4.templates.yml" _stem="4.templates"
diff --git a/pages/detail/index.vue b/pages/detail/index.vue
index 848a917..8559ed1 100644
--- a/pages/detail/index.vue
+++ b/pages/detail/index.vue
@@ -1,10 +1,9 @@
 <!-- 文章详情 -->
 <template>
   <PageBanner :form="form"/>
-
-  <div class="page-main md:w-screen-xl m-auto" ref="container">
+  <div class="page-main md:w-screen-xl m-auto md:px-3" ref="container">
     <el-row :gutter="24">
-      <el-col :span="18" :xs="24" class="min-w-xs">
+      <el-col :xs="24" :sm="12" :md="12" :lg="18" class="min-w-xs">
         <div class="p-6 leading-7 bg-white md:rounded-lg text-lg line-height-loose text-gray-600 content"
              v-html="form?.content">
         </div>
@@ -19,7 +18,8 @@
           </div>
         </div>
       </el-col>
-      <el-col :span="6" :xs="24">
+<!--      <el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="6">-->
+      <el-col :xs="24" :sm="6" :md="6" :lg="6">
         <!-- 你可能感兴趣 -->
         <LikeArticle v-if="form" :form="form" />
       </el-col>
diff --git a/pages/developer/components/CardList.vue b/pages/developer/components/CardList.vue
index 0c19540..f6bc0d3 100644
--- a/pages/developer/components/CardList.vue
+++ b/pages/developer/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer" @click="openSpmUrl(`/detail`,item,item.articleId)">
             <el-image :src="item.image" fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer" />
             <div class="flex-1 px-4 py-5 sm:p-6 !p-4">
diff --git a/pages/docs/components/CardList.vue b/pages/docs/components/CardList.vue
index 0c19540..f6bc0d3 100644
--- a/pages/docs/components/CardList.vue
+++ b/pages/docs/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer" @click="openSpmUrl(`/detail`,item,item.articleId)">
             <el-image :src="item.image" fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer" />
             <div class="flex-1 px-4 py-5 sm:p-6 !p-4">
diff --git a/pages/down/components/CardList.vue b/pages/down/components/CardList.vue
index 165987e..1707b1d 100644
--- a/pages/down/components/CardList.vue
+++ b/pages/down/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 p-4" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
             <el-image :src="`${item.image}`" fit="contain" :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">
diff --git a/pages/down/index.vue b/pages/down/index.vue
index 31a059d..ff80f9a 100644
--- a/pages/down/index.vue
+++ b/pages/down/index.vue
@@ -1,6 +1,9 @@
 <template>
-  <PageBanner :layout="layout" :title="`开源版免费下载`" desc="`拥抱开源、坚守品质；致力于打造安全稳定高可用的WEB应用！`" />
-  <CardList :list="list" :disabled="disabled" @done="onSearch" />
+  <PageBanner :layout="layout" :title="`开源版免费下载`"
+              :desc="`拥抱开源、坚守品质；致力于打造安全稳定高可用的WEB应用！`"/>
+  <div class="text-3xl py-5">{{ count }}</div>
+  <el-button @click="increment">点击</el-button>
+  <CardList :list="list" :disabled="disabled" @done="onSearch"/>
 </template>
 <script setup lang="ts">
 import type {ApiResult, PageResult} from "~/api";
@@ -10,7 +13,7 @@ import type {Navigation} from "~/api/cms/navigation/model";
 import type {CompanyParam} from "~/api/system/company/model";
 import CardList from './components/CardList.vue';
 import type {CmsProduct} from "~/api/cms/cmsProduct/model";
-
+import { v4 as uuidv4 } from 'uuid';
 const route = useRoute();
 
 // 页面信息
@@ -31,40 +34,48 @@ const where = reactive<CompanyParam>({
 });
 
 const onSearch = () => {
-  if(!disabled.value){
+  if (!disabled.value) {
     page.value++;
     reload(route.path);
   }
 }
+const count = useToken()
+
+function increment() {
+  count.value = uuidv4()
+}
 
 // 请求数据
 const reload = async (path: string) => {
-  const {data: response} = await useServerRequest<ApiResult<PageResult<CmsProduct>>>('/cms/cms-product/page',{baseURL: runtimeConfig.public.apiServer, params: {
+  const {data: response} = await useServerRequest<ApiResult<PageResult<CmsProduct>>>('/cms/cms-product/page', {
+    baseURL: runtimeConfig.public.apiServer, params: {
       page: page.value,
       limit: 8,
+      price: 0,
       keywords: where.keywords
-    }})
-  if(response.value?.data){
+    }
+  })
+  if (response.value?.data) {
     if (list.value.length < response.value?.data.count) {
       disabled.value = false;
       if (response.value?.data.list) {
         list.value = list.value.concat(response.value?.data.list);
       }
-    }else {
+    } else {
       disabled.value = true;
     }
-    if(response.value.data.count == 0){
+    if (response.value.data.count == 0) {
       resultText.value = '暂无相关结果'
     }
   }
 }
 
-const { data: nav } = await useServerRequest<ApiResult<Navigation>>('/cms/cms-navigation/getNavigationByPath',{query: {path: route.path}})
-if(nav.value?.data){
+const {data: nav} = await useServerRequest<ApiResult<Navigation>>('/cms/cms-navigation/getNavigationByPath', {query: {path: route.path}})
+if (nav.value?.data) {
   form.value = nav.value?.data;
 }
 // 页面布局
-if(form.value?.layout){
+if (form.value?.layout) {
   layout.value = JSON.parse(form.value?.layout)
 }
 
@@ -80,6 +91,6 @@ watch(
     (path) => {
       reload(path);
     },
-    { immediate: true }
+    {immediate: true}
 );
 </script>
diff --git a/pages/market/components/CardList.vue b/pages/market/components/CardList.vue
index 9a3ca08..875bc53 100644
--- a/pages/market/components/CardList.vue
+++ b/pages/market/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 px-4" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer" @click="openSpmUrl(`/item`, item, item.productId,true)">
             <el-image
                 :src="item.image"
diff --git a/pages/product/components/CardList.vue b/pages/product/components/CardList.vue
index 68ccd06..ac47b69 100644
--- a/pages/product/components/CardList.vue
+++ b/pages/product/components/CardList.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 p-4" v-infinite-scroll="load">
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
     <el-row :gutter="24" class="flex">
       <template v-for="(item,index) in list" :key="index">
-        <el-col :span="6" :xs="24" class="mb-5 min-w-xs">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
           <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
             <el-image :src="`${item.image}`" fit="contain" :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">