From d6e734507524db613cd7ce7a8107dc484cd395af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com>
Date: Thu, 26 Sep 2024 23:04:16 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=EF=BC=9A=E7=A7=BB=E5=8A=A8?=
 =?UTF-8?q?=E7=AB=AF=E8=87=AA=E9=80=82=E5=BA=94=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/AppHeader.vue               | 189 +++++++++++++------------
 components/PageBanner.vue              |   4 +-
 pages/ask/components/CardList.vue      |   6 +-
 pages/case/components/CardList.vue     |   6 +-
 pages/case/components/PageBanner.vue   |   3 +-
 pages/components/ArticleList.vue       |   6 +-
 pages/components/Flash.vue             |   7 +-
 pages/components/PlugList.vue          |   6 +-
 pages/components/ProductList.vue       |   8 +-
 pages/detail/components/PageBanner.vue |   4 +-
 pages/detail/index.vue                 |  20 +--
 pages/market/components/CardList.vue   |  17 ++-
 pages/market/components/PageBanner.vue |   2 +-
 pages/market/index.vue                 |  16 +--
 pages/product/components/CardList.vue  |   6 +-
 15 files changed, 158 insertions(+), 142 deletions(-)

diff --git a/components/AppHeader.vue b/components/AppHeader.vue
index 415b1ae..c09c6f1 100644
--- a/components/AppHeader.vue
+++ b/components/AppHeader.vue
@@ -1,94 +1,107 @@
 <template>
   <el-affix :offset="0" @change="onAffix">
-  <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="header___left flex items-center">
-        <div class="logo mt-1 sm:w-[120px] sm:ml-0 ml-2 h-7 w-auto py-2 flex items-center">
-          <nuxt-link v-if="config?.siteLogo" to="/">
-            <div class="flex flex-col text-center">
-              <el-image
-                  :src="config.siteLogo"
-                  shape="square"
-                  fit="fill"
-                  class="sm:h-5 h-5 sm:w-auto w-17"
-                  :alt="config.siteName"
-                  :title="config.siteName"
-              />
-              <span class="text-gray-500 text-2.5" style="line-height: 1rem">云应用开发平台</span>
-            </div>
+    <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="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">
+                <el-image
+                    :src="config.siteLogo"
+                    shape="square"
+                    fit="fill"
+                    class="sm:h-7 sm: pb-2 h-5 sm:w-auto"
+                    :alt="config.siteName"
+                    :title="config.siteName"
+                />
+                <!--              <span class="text-gray-500 text-2.5" style="line-height: 1rem">云应用开发平台</span>-->
+              </div>
 
-          </nuxt-link>
-          <nuxt-link v-else to="/">
-            <text>{{ config?.siteName }}</text>
-          </nuxt-link>
+            </nuxt-link>
+            <nuxt-link v-else to="/">
+              <text>{{ config?.siteName }}</text>
+            </nuxt-link>
+          </div>
+          <div class="hidden sm:flex">
+            <el-menu
+                :default-active="currentIndex"
+                mode="horizontal"
+                background-color="transparent"
+                :collapse="true"
+                :ellipsis="false"
+                style="border: none"
+                @select="handleSelect"
+            >
+              <template v-for="(item, index) in navigations">
+                <el-sub-menu v-if="item?.children && item.children.length > 0" :index="`${item.path}`">
+                  <template #title><h3>{{ item.title }}</h3></template>
+                  <el-menu-item v-for="(sub,subIndex) in item.children" :index="`${sub.path}`">{{
+                      sub.title
+                    }}
+                  </el-menu-item>
+                </el-sub-menu>
+                <el-menu-item v-else :index="`${item.path}`"><h3>{{ item.title }}</h3></el-menu-item>
+              </template>
+              <el-menu-item v-if="user.roleId === 858" :index="`/merchant`"><h3>商家中心</h3></el-menu-item>
+              <el-menu-item v-if="user.roleId === 859" :index="`/developer`"><h3>开发者中心</h3></el-menu-item>
+              <el-menu-item v-else :index="`/developer`"><h3>入驻</h3></el-menu-item>
+            </el-menu>
+          </div>
         </div>
-
-        <el-menu
-            :default-active="currentIndex"
-            mode="horizontal"
-            background-color="transparent"
-            :collapse="true"
-            :ellipsis="false"
-            style="border: none"
-            @select="handleSelect"
-        >
-          <template v-for="(item, index) in navigations">
-            <el-sub-menu v-if="item?.children && item.children.length > 0" :index="`${item.path}`">
-              <template #title><h3>{{ item.title }}</h3></template>
-              <el-menu-item v-for="(sub,subIndex) in item.children" :index="`${sub.path}`">{{
-                  sub.title
-                }}
-              </el-menu-item>
-            </el-sub-menu>
-            <el-menu-item v-else :index="`${item.path}`"><h3>{{ item.title }}</h3></el-menu-item>
-          </template>
-          <el-menu-item v-if="user.roleId === 858" :index="`/merchant`"><h3>商家中心</h3></el-menu-item>
-          <el-menu-item v-if="user.roleId === 859" :index="`/developer`"><h3>开发者中心</h3></el-menu-item>
-          <el-menu-item v-else :index="`/developer`"><h3>入驻</h3></el-menu-item>
-
-          <!-- 顶部菜单超出数量折叠 -->
-          <!--            <el-sub-menu index="more" v-if="navigations && navigations.length > (config.elMenuMaxNumber)">-->
-          <!--              <template #title>更多菜单</template>-->
-          <!--              <template v-for="(item, index) in navigations">-->
-          <!--                <el-menu-item :index="item.path" :key="index" v-if="index >= (config.elMenuMaxNumber)">-->
-          <!--                  <text :class="item.style">{{ item.title }}</text>-->
-          <!--                </el-menu-item-->
-          <!--                >-->
-          <!--              </template>-->
-          <!--            </el-sub-menu>-->
-        </el-menu>
-      </div>
-      <div class="header__right items-center pr-4 sm:pr-0">
-        <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>-->
-          <el-button v-if="token && sysDomain"
-                     @click="loginAdminByToken">控制台
-          </el-button>
-          <ClientOnly>
-            <template v-if="token">
-              <el-dropdown @command="handleCommand">
-                <el-avatar class="cursor-pointer" :src="user?.avatar" :size="30"/>
-                <el-button circle :icon="ElIconUserFilled" color="#155FAA"></el-button>
-                <template #dropdown>
-                  <el-dropdown-menu>
-                    <el-dropdown-item command="user">个人中心</el-dropdown-item>
-                    <el-dropdown-item divided command="logOut" @click="navigateTo('/user/logout')">退出
-                    </el-dropdown-item>
-                  </el-dropdown-menu>
+        <div class="header__right items-center pr-4 sm: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>-->
+            <el-button v-if="token && sysDomain"
+                       @click="loginAdminByToken">控制台
+            </el-button>
+            <ClientOnly>
+              <template v-if="token">
+                <el-dropdown @command="handleCommand">
+                  <el-avatar class="cursor-pointer" :src="user?.avatar" :size="30"/>
+                  <el-button circle :icon="ElIconUserFilled" color="#155FAA"></el-button>
+                  <template #dropdown>
+                    <el-dropdown-menu>
+                      <el-dropdown-item command="user">个人中心</el-dropdown-item>
+                      <el-dropdown-item divided command="logOut" @click="navigateTo('/user/logout')">退出
+                      </el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </template>
+              <template v-else>
+                <el-button v-if="config.showLoginButton" circle :icon="ElIconUserFilled" @click="goLogin"></el-button>
+              </template>
+            </ClientOnly>
+          </el-space>
+        </div>
+        <!-- 移动端菜单 -->
+        <div class="md:hidden flex md:p-0 px-4">
+          <el-dropdown>
+            <span class="el-dropdown-link">
+              <el-button :icon="ElIconMenu"></el-button>
+            </span>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <template v-for="(item, index) in navigations">
+                  <el-dropdown-item>
+                    <span @click="navigateTo(item.path)">{{ item.title }}</span>
+                  </el-dropdown-item>
                 </template>
-              </el-dropdown>
+                <el-dropdown-item v-if="token && sysDomain"
+                           @click="loginAdminByToken">控制台
+                </el-dropdown-item>
+                <el-dropdown-item v-else divided @click="navigateTo(`/passport/login`)">登录</el-dropdown-item>
+              </el-dropdown-menu>
             </template>
-            <template v-else>
-              <el-button v-if="config.showLoginButton" circle :icon="ElIconUserFilled" @click="goLogin"></el-button>
-            </template>
-          </ClientOnly>
-        </el-space>
+          </el-dropdown>
+        </div>
       </div>
-    </div>
-    <Passport :visible="showPassport" @done="reload"/>
-  </header>
-  <div class="header__height__placeholder"></div>
+      <Passport :visible="showPassport" @done="reload"/>
+    </header>
+    <div class="header__height__placeholder"></div>
   </el-affix>
 </template>
 
@@ -167,7 +180,7 @@ const reload = async () => {
   }
   if (token && token != '') {
     const {data: response} = await useServerRequest<ApiResult<User>>('/auth/user', {baseURL: runtimeConfig.public.apiServer})
-    if(response.value?.data){
+    if (response.value?.data) {
       user.value = response.value?.data;
     }
     // 获取后台管理地址
@@ -186,11 +199,13 @@ reload();
 body {
   background-color: #f3f6f8;
 }
-.el-menu-item:visited,.el-menu-item:hover {
+
+.el-menu-item:visited, .el-menu-item:hover {
   background: none !important; /* 你可以根据需要设置不同的颜色 */
   transition: background-color 0.3s linear;
 }
-.is-active:hover{
+
+.is-active:hover {
   border-bottom: none !important;
 }
 </style>
diff --git a/components/PageBanner.vue b/components/PageBanner.vue
index 96d5374..ce22d8c 100644
--- a/components/PageBanner.vue
+++ b/components/PageBanner.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="banner m-auto relative sm:flex">
     <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">
+         class="pointer-events-none absolute w-full md:top-[-2px] 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">
         <path d="M0 0H1440V181H0V0Z"></path>
       </mask>
@@ -19,7 +19,7 @@
         </linearGradient>
       </defs>
     </svg>
-    <div class="md:w-screen-xl m-auto">
+    <div class="md:w-screen-xl m-auto md:px-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/pages/ask/components/CardList.vue b/pages/ask/components/CardList.vue
index e69fe60..fbc1fc8 100644
--- a/pages/ask/components/CardList.vue
+++ b/pages/ask/components/CardList.vue
@@ -1,10 +1,10 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 px-4" 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 :span="6" :xs="24" 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" />
+            <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>
diff --git a/pages/case/components/CardList.vue b/pages/case/components/CardList.vue
index 768646f..aebf5f4 100644
--- a/pages/case/components/CardList.vue
+++ b/pages/case/components/CardList.vue
@@ -1,10 +1,10 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 p-4" 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 :span="6" :xs="24" 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 h-[150px] 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">
               <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">{{ item.appName }}</span>
diff --git a/pages/case/components/PageBanner.vue b/pages/case/components/PageBanner.vue
index 4b0b628..c834fd8 100644
--- a/pages/case/components/PageBanner.vue
+++ b/pages/case/components/PageBanner.vue
@@ -19,7 +19,7 @@
         </linearGradient>
       </defs>
     </svg>
-    <div class="md:w-screen-xl m-auto">
+    <div class="md:w-screen-xl m-auto md: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">
@@ -53,7 +53,6 @@
                 帮助文档
               </el-button>
             </el-space>
-
           </div>
         </div>
       </div>
diff --git a/pages/components/ArticleList.vue b/pages/components/ArticleList.vue
index 45a20f6..f0300a1 100644
--- a/pages/components/ArticleList.vue
+++ b/pages/components/ArticleList.vue
@@ -9,12 +9,12 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4" 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 :span="6" :xs="24" 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" />
+            <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>
diff --git a/pages/components/Flash.vue b/pages/components/Flash.vue
index 7b0fff1..2a89ec1 100644
--- a/pages/components/Flash.vue
+++ b/pages/components/Flash.vue
@@ -1,6 +1,6 @@
 <template>
   <svg viewBox="0 0 1440 181" fill="none" xmlns="http://www.w3.org/2000/svg"
-       class="pointer-events-none absolute w-full top-[58px] transition-all text-green-5 flex-shrink-0 opacity-100 duration-[400ms] opacity-80 -z-10">
+       class="pointer-events-none absolute w-full md:top-[58px] top-[48px] 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">
       <path d="M0 0H1440V181H0V0Z"></path>
     </mask>
@@ -95,7 +95,7 @@
         </div>
         <div class="mt-10 flex flex-wrap gap-x-6 gap-y-3 justify-center">
           <div class="flex flex-col gap-4">
-            <div class="flex items-center gap-2">
+            <div class="flex items-center">
               <el-button size="large" type="primary" v-if="!token" :icon="ElIconArrowRight" @click="openSpmUrl(`/passport/login`, {},0)">立即开始</el-button>
               <el-button size="large" type="primary" v-else :icon="ElIconArrowRight" @click="loginAdminByToken">进入控制台</el-button>
               <el-button size="large" type="success"  :icon="ElIconDownload" @click="openSpmUrl(`http://git.gxwebsoft.com/gxwebsoft/websoft-cms.git`, {},0,true)">下载源码</el-button>
@@ -109,10 +109,9 @@
 
 </template>
 <script setup lang="ts">
-import {useSysDomain, useToken} from "~/composables/configState";
+import {useToken} from "~/composables/configState";
 import {loginAdminByToken, openSpmUrl} from "~/utils/common";
 const token = useToken();
-const sysDomain = useSysDomain();
 </script>
 
 <style scoped lang="less">
diff --git a/pages/components/PlugList.vue b/pages/components/PlugList.vue
index f273e3b..5796bf9 100644
--- a/pages/components/PlugList.vue
+++ b/pages/components/PlugList.vue
@@ -9,14 +9,14 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative sm:flex">
+  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4">
     <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 :span="6" :xs="24" 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`"
-                fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer"/>
+                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 flex-col gap-1.5">
                 <div class="flex-1 text-xl cursor-pointer">{{ item.plugName }}</div>
diff --git a/pages/components/ProductList.vue b/pages/components/ProductList.vue
index 01bcfd8..c6a6cb3 100644
--- a/pages/components/ProductList.vue
+++ b/pages/components/ProductList.vue
@@ -9,16 +9,16 @@
       </p>
     </div>
   </div>
-  <div class="md:w-screen-xl m-auto relative sm:flex">
+  <div class="md:w-screen-xl m-auto relative md:flex md:p-0 p-4">
     <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 :span="6" :xs="24" 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`"
-                fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer"/>
+                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 flex-col gap-1.5">
+              <p class="text-gray-700 dark:text-white text-base font-semibold flex flex-col gap-1.5">
                 <div class="flex-1 text-xl cursor-pointer">{{ item.goodsName }}</div>
                 <div class="text-red-500">￥{{ item.price }}</div>
               </p>
diff --git a/pages/detail/components/PageBanner.vue b/pages/detail/components/PageBanner.vue
index e096b75..9ad47a8 100644
--- a/pages/detail/components/PageBanner.vue
+++ b/pages/detail/components/PageBanner.vue
@@ -19,9 +19,9 @@
         </linearGradient>
       </defs>
     </svg>
-    <div class="md:w-screen-xl m-auto">
+    <div class="md:w-screen-xl m-auto p-1">
       <Breadcrumb :data="form" />
-      <div class="py-8 sm:py-16" _path="/templates" _dir="" _draft="false" _partial="false" _locale=""
+      <div class="md:py-8 sm:py-16 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"
            _extension="yml">
         <div class="gap-8 sm:gap-y-16 lg:items-center" v-if="form">
diff --git a/pages/detail/index.vue b/pages/detail/index.vue
index 2327033..0730a38 100644
--- a/pages/detail/index.vue
+++ b/pages/detail/index.vue
@@ -4,10 +4,10 @@
 
   <div class="page-main md:w-screen-xl m-auto">
     <el-row :gutter="24">
-      <el-col :span="18">
-        <div class="p-6 leading-7 bg-white rounded-lg text-lg line-height-loose text-gray-600 content" v-html="form?.content">
+      <el-col :span="18" :xs="24" 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>
-        <div class="page gap-xl m-auto mt-[30px] flex justify-between">
+        <div class="page md:gap-xl gap-xs m-auto my-[30px] md:p-0 p-4 flex justify-between">
           <div v-if="previousArticle" class="bg-white rounded-lg p-4 cursor-pointer hover:shadow w-[50%]" @click="openSpmUrl(`/detail`,previousArticle,previousArticle?.articleId)">
             <span>上一篇：{{ previousArticle?.title }}</span>
           </div>
@@ -16,12 +16,14 @@
           </div>
         </div>
       </el-col>
-      <el-col :span="6">
-        <div class="p-4 leading-7 bg-white rounded-lg">
-          点击排行
-        </div>
-        <div class="p-4 leading-7 bg-white rounded-lg mt-4">
-          推荐文章
+      <el-col :span="6" :xs="24">
+        <div class="right-box md:p-0 p-4">
+          <div class="p-4 leading-7 bg-white rounded-lg">
+            点击排行
+          </div>
+          <div class="p-4 leading-7 bg-white rounded-lg mt-4">
+            推荐文章
+          </div>
         </div>
       </el-col>
     </el-row>
diff --git a/pages/market/components/CardList.vue b/pages/market/components/CardList.vue
index 69a7502..2629a49 100644
--- a/pages/market/components/CardList.vue
+++ b/pages/market/components/CardList.vue
@@ -1,21 +1,24 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 px-4" 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 :span="6" :xs="24" 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`" fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer" />
+            <el-image
+                :src="`https://oss.wsdns.cn/20240925/e5e47100f4b6471395b3b81f834d2902.jpg?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90`"
+                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">{{ item.plugName }}</span>
-                <div class="text-red-500" v-if="item.price > 0">￥{{ item.price }} </div>
+                <div class="text-red-500" v-if="item.price > 0">￥{{ item.price }}</div>
               </p>
               <p class="flex items-center gap-1.5 py-2 text-gray-500 justify-between">
-                <div class="text-gray-500">{{ item.comments }} </div>
+                <div class="text-gray-500">{{ item.comments }}</div>
               </p>
               <div class="button-group flex justify-center mt-3">
                 <el-button class="w-full" @click="openSpmUrl(`/item`, item, item.plugId,true)">查看详情</el-button>
-                <el-button type="primary" v-if="item.price > 0" class="w-full" :icon="ElIconShoppingCart">购买</el-button>
+                <el-button type="primary" v-if="item.price > 0" class="w-full" :icon="ElIconShoppingCart">购买
+                </el-button>
                 <el-button v-else class="w-full">下载插件</el-button>
               </div>
             </div>
@@ -46,7 +49,7 @@ const emit = defineEmits<{
 }>();
 
 const load = () => {
-  if(!props.disabled){
+  if (!props.disabled) {
     emit('done')
   }
 }
diff --git a/pages/market/components/PageBanner.vue b/pages/market/components/PageBanner.vue
index 84d5d9d..e658704 100644
--- a/pages/market/components/PageBanner.vue
+++ b/pages/market/components/PageBanner.vue
@@ -19,7 +19,7 @@
         </linearGradient>
       </defs>
     </svg>
-    <div class="md:w-screen-xl m-auto">
+    <div class="md:w-screen-xl m-auto md: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/pages/market/index.vue b/pages/market/index.vue
index 35d809f..3a9a6e1 100644
--- a/pages/market/index.vue
+++ b/pages/market/index.vue
@@ -1,20 +1,18 @@
 <template>
   <PageBanner :layout="layout" />
-  <div class="flex justify-between md:w-screen-xl m-auto relative sm:flex pb-2">
-    <el-tabs v-model="activeName" @tab-click="handleClick">
+    <el-tabs v-model="activeName" class="md:w-screen-xl m-auto relative sm:flex 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>
       <el-tab-pane label="热门总榜" name="cms"></el-tab-pane>
       <el-tab-pane label="我的收藏" name="food"></el-tab-pane>
     </el-tabs>
-    <el-checkbox-group v-model="checkList">
-      <el-checkbox label="菜单" value="menu" />
-      <el-checkbox label="插件" value="plug" />
-      <el-checkbox label="应用" value="app" />
-      <el-checkbox label="前端" value="" />
-    </el-checkbox-group>
-  </div>
+<!--    <el-checkbox-group v-model="checkList" class="md:w-screen-xl m-auto relative sm:flex hidden pb-2">-->
+<!--      <el-checkbox label="菜单" value="menu" />-->
+<!--      <el-checkbox label="插件" value="plug" />-->
+<!--      <el-checkbox label="应用" value="app" />-->
+<!--      <el-checkbox label="前端" value="" />-->
+<!--    </el-checkbox-group>-->
   <CardList :list="list" :disabled="disabled" @done="onSearch" />
 </template>
 <script setup lang="ts">
diff --git a/pages/product/components/CardList.vue b/pages/product/components/CardList.vue
index 67741ee..a59bc58 100644
--- a/pages/product/components/CardList.vue
+++ b/pages/product/components/CardList.vue
@@ -1,10 +1,10 @@
 <template>
-  <div class="md:w-screen-xl m-auto relative sm:flex" v-infinite-scroll="load">
+  <div class="md:w-screen-xl m-auto relative sm:flex md:p-0 p-4" 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 :span="6" :xs="24" 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`" fit="fill" :lazy="true" class="w-full h-[150px] cursor-pointer" />
+            <el-image :src="`https://oss.wsdns.cn/20240925/e5e47100f4b6471395b3b81f834d2902.jpg?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90`" 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 flex-col gap-1.5">
                 <div class="flex-1 text-xl cursor-pointer">{{ item.goodsName }}</div>