Merge remote-tracking branch 'origin/master'

api/cms/cmsNavigation/model/index.ts

@@ -1,4 +1,4 @@
-import type { PageParam } from '@/api';
+import type {PageParam} from '@/api';
 import type {CmsDesign} from "~/api/cms/cmsDesign/model";
 
 /**
@@ -79,6 +79,8 @@ export interface CmsNavigation {
   label?: string;
   value?: number;
   design?: CmsDesign;
+  childHeight?: number,
+  showChild?: boolean
 }
 
 /**

components/AppHeader.vue

@@ -1,5 +1,6 @@
 <template>
-    <header class="header fixed w-full bg-[#3f3e3c] opacity-90  border-b border-gray-200 dark:border-gray-800 -mb-px top-0 z-50 lg:mb-0 lg:border-0">
+  <header
+    class="header fixed w-full bg-[#3f3e3c] opacity-90  border-b border-gray-200 dark:border-gray-800 -mb-px top-0 z-50 lg:mb-0 lg:border-0">
     <div class="xl:w-screen-xl xl:p-0 px-4 flex items-center between w-full m-auto bg-[#3f3e3c]">
       <div class="header___left flex items-center">
         <div class="logo mt-1 sm:w-[250px] h-7 w-auto py-2 flex items-center">
@@ -30,16 +31,40 @@
             style="border: none"
           >
             <template v-for="(item, index) in navigations">
-                <el-sub-menu v-if="item?.children && item.children.length > 0" :index="`${item.path}`">
-                  <template #title><h3 class="text-white">{{ item.title }}</h3></template>
-                  <el-menu-item v-for="(sub,subIndex) in item.children" :index="`${sub.path}`">
-                    <el-space @click="openSpmUrl(`${item.path}`,sub,sub.navigationId)">
-                      <el-avatar v-if="sub.icon" :src="sub.icon" shape="square" size="small"></el-avatar>
+              <!--              <el-sub-menu v-if="item?.children && item.children.length > 0" :index="`${item.path}`">-->
+              <!--                <template #title><h3 class="text-white">{{ item.title }}</h3></template>-->
+              <!--                <el-menu-item v-for="(sub,subIndex) in item.children" :index="`${sub.path}`">-->
+              <!--                  <el-space @click="openSpmUrl(`${item.path}`,sub,sub.navigationId)">-->
+              <!--                    <el-avatar v-if="sub.icon" :src="sub.icon" shape="square" size="small"></el-avatar>-->
+              <!--                    <span class="font-bold">{{ sub.title }}</span>-->
+              <!--                  </el-space>-->
+              <!--                </el-menu-item>-->
+              <!--              </el-sub-menu>-->
+              <div v-if="item?.children && item.children.length > 0">
+                <div class="px-[20px] relative h-[60px] w-[80px] flex justify-center items-center">
+                  <h3 class="text-white cursor-pointer" @mouseenter="mouseenter(index)" @mouseleave="mouseleave(index)">
+                    {{
+                      item.title
+                    }}</h3>
+                  <div v-if="item.showChild"
+                       class="absolute top-[60px] bg-white p-2 shadow border-t-2 border-[#409eff] left-0 overflow-hidden"
+                       :style="{height: `${item.childHeight}px`}">
+                    <div v-for="(sub,subIndex) in item.children" :key="index" class="w-[200px] p-1 cursor-pointer hover:text-[#409eff]">
+                      <el-space
+                        @click="openSpmUrl(`${item.path}`,sub,sub.navigationId)">
+                        <el-avatar v-if="sub.icon" :src="sub.icon" shape="square"
+                                   size="small"></el-avatar>
                         <span class="font-bold">{{ sub.title }}</span>
                       </el-space>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <el-menu-item v-else :index="`${item.path}`"><h3
+                @mouseenter="mouseenter(index)"
+                @mouseleave="mouseleave(index)"
+                @click="openSpmUrl(`${item.path}`,item,item.navigationId)" class="text-white">{{ item.title }}</h3>
               </el-menu-item>
-                </el-sub-menu>
-                <el-menu-item v-else :index="`${item.path}`"><h3 @click="openSpmUrl(`${item.path}`,item,item.navigationId)" class="text-white">{{ item.title }}</h3></el-menu-item>
             </template>
           </el-menu>
         </div>
@@ -51,13 +76,14 @@
             <template v-if="token">
               <el-dropdown @command="handleCommand">
                 <el-space class="flex items-center cursor-pointer">
-                    <el-avatar class="cursor-pointer" :src="user?.logo" :size="30" />
+                  <el-avatar class="cursor-pointer" :src="user?.logo" :size="30"/>
                   <span>{{ user?.tenantName }}</span>
                 </el-space>
                 <template #dropdown>
                   <el-dropdown-menu>
                     <el-dropdown-item command="user" @click="openSpmUrl(`/user`)">账户中心</el-dropdown-item>
-                      <el-dropdown-item command="password" @click="openSpmUrl(`/user/password`)">修改密码</el-dropdown-item>
+                    <el-dropdown-item command="password" @click="openSpmUrl(`/user/password`)">修改密码
+                    </el-dropdown-item>
                     <el-dropdown-item command="auth" @click="openSpmUrl(`/user/auth`)">实名认证</el-dropdown-item>
                     <el-dropdown-item command="order" @click="openSpmUrl(`/user/order`)">我的订单</el-dropdown-item>
                     <el-dropdown-item divided command="logOut" @click="openSpmUrl('/user/logout')">退出登录
@@ -68,7 +94,7 @@
             </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>-->
+              <!--                <el-button v-if="config.showLoginButton" circle :icon="ElIconUserFilled" @click="goLogin"></el-button>-->
             </template>
           </ClientOnly>
         </el-space>
@@ -131,6 +157,70 @@ const config = useConfigInfo();
 const affix = useProductAffix();
 const sysDomain = useSysDomain();
 
+const setNav = () => {
+  navigations.value = navigations.value.map(item => {
+    item.showChild = false
+    item.childHeight = 0;
+    return item
+  })
+}
+setNav()
+
+const time = 10
+let interval: NodeJS.Timeout
+const mouseenter = async (index: number) => {
+  let showIndex = -1;
+  for (let i = 0; i < navigations.value.length; i++) {
+    console.log(navigations.value[i].showChild)
+    if (navigations.value[i].showChild) {
+      showIndex = i
+      break
+    }
+  }
+  if (showIndex === index) return
+  const item = navigations.value[index];
+  const childHeight = item.children ? parseInt((item.children?.length * 31).toString()) : 0;
+  await hideAll()
+  item.showChild = true
+  if (item.childHeight === undefined) item.childHeight = 0
+  interval = setInterval(() => {
+    if (item.childHeight !== undefined && item.childHeight >= childHeight && interval) clearInterval(interval)
+    if (item.childHeight !== undefined && item.children !== undefined && (item.childHeight < childHeight)) {
+      item.childHeight += parseInt(((childHeight / item.children?.length) / 5).toString())
+    } else {
+      // item.childHeight = childHeight
+      if (interval) clearInterval(interval)
+    }
+    console.log(item.childHeight, childHeight)
+    // console.log(item.childHeight)
+  }, time)
+}
+
+const mouseleave = () => {
+  if (interval) clearInterval(interval)
+}
+
+const hideAll = () => {
+  return new Promise(resolve => {
+    navigations.value = navigations.value.map(item => {
+      if (item.childHeight === undefined) item.childHeight = 0
+      if (item.showChild) {
+        const childHeight = item.children ? parseInt((item.children?.length * 31).toString()) : 0;
+        const interval = setInterval(() => {
+          if (item.childHeight !== undefined && item.children !== undefined && (item.childHeight > 0)) {
+            item.childHeight -= parseInt(((childHeight / item.children?.length) / 5).toString())
+          } else {
+            item.showChild = false
+            clearInterval(interval)
+          }
+        }, time)
+      }
+      return item
+    })
+    resolve(true)
+  })
+}
+
 // 顶部栏初始数
 const visibleNumber = ref<number>(6);
 config.value.elMenuMaxNumber = 8;
@@ -181,7 +271,7 @@ const reload = async () => {
     }
     // 获取企业信息
     const {data: companyInfo} = await useServerRequest<ApiResult<Company>>('/system/company/profile', {baseURL: runtimeConfig.public.apiServer})
-    if(companyInfo.value?.data){
+    if (companyInfo.value?.data) {
       company.value = companyInfo.value?.data;
       // sysDomain.value = company.value?.domain || undefined;
       // user.value.tenantName = company.value?.tenantName;

pages/components/AboutUs.vue

@@ -1,5 +1,6 @@
 <template>
-  <div class="w-full bg-white pb-20 mb-3 relative" :style="`background: url('${config?.IndexAboutBg}') no-repeat center`">
+  <div class="w-full bg-white pb-20 mb-3 relative"
+       :style="`background: url('${config?.IndexAboutBg}') no-repeat center`">
     <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">
@@ -11,9 +12,10 @@
       </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" :class="config?.IndexAboutStyle" style="font-family: Source Han Serif, SimSun,serif">{{ config?.IndexAboutInfo }}</p>
+      <p class="indent-xl max-w-3/5 px-4" :class="config?.IndexAboutStyle"
+         style="font-family: Source Han Serif, SimSun,serif">{{ config?.IndexAboutInfo }}</p>
       <div class="carousel px-3 text-center">
-        <el-image :src="config?.IndexAboutImg" />
+        <img :src="config?.IndexAboutImg" class="scale-img"/>
       </div>
     </div>
   </div>
@@ -42,10 +44,10 @@ const emit = defineEmits<{
 
 // 请求数据
 // const reload = async () => {
-  // const { data: fields } = await useServerRequest<ApiResult<Config>>('/cms/cms-website-field/config', {baseURL: 'https://server.gxwebsoft.com/api',});
-  // if (fields.value?.data) {
-    // config.value = fields.value?.data;
-  // }
+// const { data: fields } = await useServerRequest<ApiResult<Config>>('/cms/cms-website-field/config', {baseURL: 'https://server.gxwebsoft.com/api',});
+// if (fields.value?.data) {
+// config.value = fields.value?.data;
+// }
 // }
 
 // reload();
@@ -56,7 +58,25 @@ const emit = defineEmits<{
 .el-tabs__item {
   font-size: 3em; /* 调整为你想要的字体大小 */
 }
+
 .custom-tabs .el-tabs__item {
   font-size: 22px; /* 调整为你想要的字体大小 */
 }
 </style>
+
+<style lang="less" scoped>
+.scale-img:hover {
+  animation: scale;
+  animation-duration: 0.5s;
+  animation-fill-mode: forwards;
+}
+
+@keyframes scale {
+  from {
+    transform: scale(1);
+  }
+  to {
+    transform: scale(1.1);
+  }
+}
+</style>

pages/components/CompanyStyle.vue

@@ -13,7 +13,7 @@
     <div class="xl:w-screen-xl m-auto text-xl">
       <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" />
+          <img :src="item.path" class="cursor-pointer scale-img" />
           <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>
@@ -69,3 +69,20 @@ watch(
     {immediate: true}
 );
 </script>
+
+<style lang="less" scoped>
+.scale-img:hover {
+  animation: scale;
+  animation-duration: 0.5s;
+  animation-fill-mode: forwards;
+}
+
+@keyframes scale {
+  from {
+    transform: scale(1);
+  }
+  to {
+    transform: scale(1.1);
+  }
+}
+</style>