新版本官网优化完成

components/AppHeader/Login/Login.vue

@@ -1,23 +1,74 @@
 <template>
   <div class="fr clearfix flex items-center">
-<!--    <div class="fl mr-5">-->
-<!--      <el-input v-model="keyword" :placeholder="`${$t('searchKeywords')}...`" :suffix-icon="Search" @change="onSearch"/>-->
-<!--    </div>-->
-    <div class="lang flex justify-center text-center items-center">
+    <div class="fl mr-5">
+      <el-input v-model="keywords" :placeholder="`${$t('searchKeywords')}`" :suffix-icon="Search" @change="onSearch"/>
+    </div>
+    <!-- 未登录 -->
+    <div v-if="!token" class="lang flex justify-center text-center items-center">
       <el-space>
-        <nuxt-link to="https://oa.websoft.top/register" type="text" class="text-sm text-gray-500">注册</nuxt-link>
+        <nuxt-link to="/passport/login?type=register" type="text" class="text-sm text-gray-500">注册</nuxt-link>
         <el-divider direction="vertical"/>
-        <nuxt-link to="https://oa.websoft.top/passport/login" type="text" class="text-sm text-gray-500">登录</nuxt-link>
+        <nuxt-link to="/passport/login" type="text" class="text-sm text-gray-500">登录</nuxt-link>
       </el-space>
     </div>
+    <!-- 已登录 -->
+    <div v-else>
+      <div class="header__right items-center pr-4 xl:pr-0 md:flex hidden">
+        <el-space class="sm:flex hidden" size="large">
+          <ClientOnly>
+            <template v-if="token">
+              <el-dropdown @command="handleCommand">
+                <el-space class="flex items-center cursor-pointer">
+                  <el-avatar class="cursor-pointer" :src="user?.avatar" :size="30" />
+                  <span>{{ user?.tenantName }}</span>
+                </el-space>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item command="user"><nuxt-link to="/user">用户中心</nuxt-link></el-dropdown-item>
+                    <el-dropdown-item command="password"><nuxt-link to="/user/password">修改密码</nuxt-link></el-dropdown-item>
+                    <el-dropdown-item command="auth"><nuxt-link to="/user/auth">实名认证</nuxt-link></el-dropdown-item>
+                    <el-dropdown-item divided command="order"><nuxt-link to="/user/order">我的订单</nuxt-link></el-dropdown-item>
+                    <el-dropdown-item divided command="logOut"><nuxt-link to="/user/logout">退出登录</nuxt-link>
+                    </el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </template>
+            <template v-else>
+              <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>
+        </el-space>
+      </div>
+    </div>
   </div>
 </template>
 <script setup lang="ts">
 import { Search } from '@element-plus/icons-vue'
-const keyword = ref<string>('');
+const token = useToken();
+const user = useUser();
+const keywords = ref<string>();
 
 const onSearch = () => {
-  window.location.href = `/search/${keyword.value}`;
+  navigateTo(`/search/${keywords.value || '关键词不能为空！'}`)
+}
+
+function handleCommand(command: string) {
+  switch (command) {
+    case 'logOut':
+      logOut();
+      break;
+    default:
+      navigateTo('/user');
+      break;
+  }
+}
+
+function logOut() {
+  token.value = '';
+  localStorage.clear();
+  navigateTo('/passport/login')
 }
 </script>
 <style scoped lang="scss">

components/Banner.vue

@@ -1,6 +1,6 @@
 <template>
   <!-- 自定义banner -->
-  <div class="banner m-auto relative sm:flex hidden-sm-and-down flex justify-center">
+  <div v-if="layout?.banner" class="banner m-auto relative sm:flex hidden-sm-and-down flex justify-center">
     <el-image :src="layout?.banner" class="min-h-sm sm:h-auto w-full"></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">

components/CmsArticleRelated.vue

@@ -35,7 +35,7 @@ watch(
 
 <template>
   <div class="relatenew relate"><h4>{{ $t('articleRelated')}}：</h4>
-    <div class="p-1">
+    <div class="py-1">
       <ul id="relate_n" class="news_list clearfix">
         <li v-for="(item,index) in list" :key="index"><a :href="detail(item)" :title="item.title">{{ item.title }}</a></li>
       </ul>

components/CmsRecently.vue

@@ -54,7 +54,7 @@ const reload = () => {
 <template>
   <div class="relateproduct relate">
     <h4>{{ $t('recentlyViewed') }}：</h4>
-    <div class="p-1" v-if="type == 'article'">
+    <div class="py-1" v-if="type == 'article'">
       <ul id="relate_n" class="news_list clearfix">
         <li v-for="(item,index) in list" :key="index"><a :href="detail(item)" :title="item.title">{{ item.title }}</a></li>
       </ul>

components/Content.vue

@@ -10,19 +10,18 @@ const props = withDefaults(
 </script>
 
 <template>
-  <div class="text-[16px]" v-html="data"></div>
+  <div v-html="data"></div>
 </template>
 
 <style lang="scss">
 .content {
-  padding-top: 15px;
   overflow: hidden;
   color: #333131;
 }
 .content p{
   padding: 0;
   line-height: 2.2rem;
-  text-indent: 2rem;
+  //text-indent: 2rem;
 }
 .content img{
   padding: 8px 0;

components/NextArticle.vue

@@ -29,14 +29,24 @@ nextArticle.value = await getNext({
 </script>
 
 <template>
-  <div class="page flex flex-col">
-            <span class="text-left">
-              {{ $t('previous') }}：<a :href="detail(previousArticle)">{{ previousArticle?.title }}</a>
-            </span>
-            <span class="text-left">
-              {{ $t('next') }}：<a :href="detail(nextArticle)">{{ nextArticle?.title }}</a>
-            </span>
+  <div class="flex justify-between my-3 gap-4">
+      <nuxt-link :to="previousArticle ? detail(previousArticle) : ''" class="w-[50%] flex flex-col justify-center p-4 border-1 border-solid border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50">
+        <span class="text-lg text-gray-800">{{ previousArticle?.title || '没有了' }}</span>
+        <span class="text-gray-400">{{ $t('previous') }}</span>
+      </nuxt-link>
+      <nuxt-link :to="nextArticle ? detail(nextArticle) : ''" class="w-[50%] flex flex-col justify-center p-4 border-1 border-solid border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50">
+        <span class="text-lg text-gray-800">{{ nextArticle?.title || '没有了' }}</span>
+        <span class="text-gray-400">{{ $t('next') }}</span>
+      </nuxt-link>
   </div>
+<!--  <div class="page flex flex-col">-->
+<!--            <span class="text-left">-->
+<!--              {{ $t('previous') }}：<a :href="detail(previousArticle)">{{ previousArticle?.title }}</a>-->
+<!--            </span>-->
+<!--            <span class="text-left">-->
+<!--              {{ $t('next') }}：<a :href="detail(nextArticle)">{{ nextArticle?.title }}</a>-->
+<!--            </span>-->
+<!--  </div>-->
 </template>
 
 <style scoped lang="scss">

components/Pagination.vue

@@ -9,6 +9,7 @@ const props = withDefaults(
       data?: any;
       total?: number;
       size?: ComponentSize;
+      pageSize?: number;
     }>(),
     {}
 );
@@ -28,7 +29,7 @@ const mobile = useIsMobile();
 const where = reactive<CmsArticleParam>({
   keywords: '',
   page: 1,
-  limit: 20,
+  limit: props.pageSize || 12,
   status: 0,
   parentId: undefined,
   categoryId: undefined,

components/SearchBar.vue

@@ -0,0 +1,52 @@
+<template>
+  <el-space class="flex items-center">
+    <el-input v-model="where.keywords" :placeholder="`${$t('searchKeywords')}...`" :suffix-icon="Search"/>
+  </el-space>
+</template>
+
+<script setup lang="ts">
+import { Search } from '@element-plus/icons-vue'
+import type {CmsArticle} from "~/api/cms/cmsArticle/model";
+
+const i18n = useI18n();
+
+const props = withDefaults(
+    defineProps<{
+      title?: string;
+      desc?: string;
+      buyUrl?: string;
+      form?: CmsArticle;
+      value?: number;
+    }>(),
+    {}
+);
+
+const emit = defineEmits<{
+  (e: 'done', where: any): void
+}>()
+
+// 搜索表单
+const where = reactive<any>({
+  keywords: '',
+  page: 1,
+  limit: 20,
+  status: 0,
+  parentId: undefined,
+  categoryId: undefined,
+  lang: i18n.locale.value
+});
+
+const reload = () => {
+  navigateTo(`/search/${where.keywords}`)
+}
+
+</script>
+<style scoped lang="less">
+.rounded-avatar {
+  border-radius: 30px;
+}
+
+.rounded-avatar-xs {
+  border-radius: 20px;
+}
+</style>