Merge branch 'dev' of https://git.citupro.com/zhengnaiwen_citu/menduner into dev

src/views/entrances/components/slider.vue

@@ -24,7 +24,7 @@ const list = [
   // { mdi: 'mdi-arrow-up-bold', tips: '返回顶部' },
   { mdi: 'mdi-qrcode', tips: '微信公众号', showImg: 'https://minio.citupro.com/dev/static/mendunerCode.jpg' },
   { mdi: 'mdi-face-agent', tips: '客服' },
-  // { mdi: 'mdi-list-box-outline', tips: '在线简历', path: '/recruit/personal/resume' }
+  { mdi: 'mdi-application-settings', tips: '预约演示', path: '/' }
 ]
 
 const handleClick = (item, index) => {

src/views/entrances/list/index.vue

@@ -1,22 +1,19 @@
 <!-- 门墩儿入口管理列表 -->
 <template>
-  <div class="d-flex justify-center" style="margin-top: 150px;">
+  <div class="d-flex justify-center" style="margin-top: 130px;">
     <div style="text-align: center;">
       <div style="font-size: 40px; font-weight: bold;">
         <span v-for="(val, i) in bigTitle" :key="'bigTitle' + i" :class="{'ml-2': i}">{{ val }}</span>
       </div>
-      <div style="font-size: 24px; color: #777" class="mt-3">
+      <div style="font-size: 24px; color: #777" class="mt-5">
         <span v-for="(val, i) in smallTitle" :key="'smallTitle' + i" :class="{'ml-5': i}">{{ val }}</span>
       </div>
     </div>
   </div>
-  <div class="listBox mt-10">
+  <div class="listBox mt-15">
     <div
       v-for="(item, index) in menuList" :key="'menu' + index"
       class="listItem mb-2 mx-3"
-      :class="item.active ? 'elevation-0 mt-0' : 'elevation-0 mt-2'"
-      @mouseover="item.active = true"
-      @mouseleave="item.active = false"
       @click="handleClick(item)"
     >
       <!-- <span>{{ item.title }}</span> -->
@@ -63,6 +60,11 @@ const menuList = ref([
     cursor: pointer;
     border-radius: 8px;
     text-align: center;
+    box-shadow: 0px 0px 40px 0px var(--v-primary-lighten4);
+    // transition: all 0.2s;
+    &:hover {
+      transform: translateY(-8px);
+    }
   }
 }
 </style>

src/views/entrances/navBar/components/commonMenuStyle.vue

@@ -1,6 +1,6 @@
 <template>
+  <!-- open-on-hover  -->
   <v-menu
-    open-on-hover 
     :close-delay="1" 
     :open-delay="0" 
     v-bind="$attrs" 
@@ -9,10 +9,10 @@
     :close-on-content-click="closeOnContentClick"
   >
     <template v-slot:activator="{ isActive, props }">
-      <span v-bind="props" class="cursor-pointer">
-        <span>{{ defineProps.btnTitle }}</span>
-        <span class="ml-2" :class="isActive ? 'mdi mdi-menu-up' : 'mdi mdi-menu-down'"></span>
-      </span>
+      <div v-bind="props" class="d-flex cursor-pointer menuText">
+        <div>{{ defineProps.btnTitle }}</div>
+        <div class="ml-2" :class="isActive ? 'mdi mdi-menu-up' : 'mdi mdi-menu-down'"></div>
+      </div>
     </template>
     <slot></slot>
   </v-menu>
@@ -27,11 +27,15 @@ const defineProps = defineProps({
   },
   closeOnContentClick: {
     type: Boolean,
-    default: true
+    default: false
   }
 })
-
 </script>
-
 <style lang="scss" scoped>
+.menuText {
+  div {
+    height: 50px;
+    line-height: 50px;
+  }
+}
 </style>

src/views/entrances/navBar/components/defineListPage.vue

@@ -0,0 +1,54 @@
+<template>
+  <m-menu :btnTitle="title">
+    <v-card elevation="3" style="padding: 40px 60px;">
+      <div class="d-flex">
+        <div v-for="(item, i) in list" :key="'product'+i" :style="{'margin-left': i ? ml : 'auto'}">
+          <div style="font-size: 20px; color: var(--v-primary-lighten2)" class="mb-5">{{ item.title }}</div>
+          <v-divider class="mb-3" style="color: var(--v-primary-lighten2)"></v-divider>
+          <div v-for="(arr, j) in item.appList" :key="'productApp'+j" class="d-flex">
+            <div v-for="(val, k) in arr" :key="'productAppArr'+k" class="d-flex cursor-pointer" @click="emits('emitClick', val)">
+              <span class="mr-2" style="font-size: 30px;line-height: 48px;color: var(--v-primary-lighten2);">·</span>
+              <div
+                :style="{width: k ? 'auto' : width}"
+                style="font-size: 16px; line-height: 50px;"
+              >
+                {{ val.title }}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </v-card>
+  </m-menu>
+</template>
+
+<script setup>
+import MMenu from './commonMenuStyle.vue'
+defineOptions({name: 'entrances-defineListPage'})
+const emits = defineEmits(['emitClick'])
+defineProps({
+  list: {
+    type: Array,
+    default: () => []
+  },
+  title: {
+    type: String,
+    default: 'title'
+  },
+  width: {
+    type: String,
+    default: '160px'
+  },
+  ml: {
+    type: String,
+    default: '150px'
+  }
+})
+</script>
+<style lang="scss" scoped>
+.cursor-pointer {
+  &:hover {
+    color: var(--v-primary-base);
+  }
+}
+</style>

src/views/entrances/navBar/components/defineListPage2.vue

@@ -0,0 +1,58 @@
+<template>
+  <m-menu :btnTitle="title">
+    <v-card elevation="3" style="padding: 40px 60px; overflow: visible;">
+      <div class="d-flex">
+        <div v-for="(item, i) in list" :key="'product'+i" :style="{'margin-left': i ? ml : 'auto'}">
+          <div style="font-size: 20px; color: var(--v-primary-lighten2)" class="mb-5">{{ item.title }}</div>
+          <v-divider class="mb-6" style="color: var(--v-primary-lighten2)"></v-divider>
+          <div v-for="(arr, j) in item.appList" :key="'productApp'+j" class="d-flex">
+            <div v-for="(val, k) in arr" :key="'productAppArr'+k" class="d-flex cursor-pointer" @click="emits('emitClick', val)">
+              <span class="mr-2" style="font-size: 30px;line-height: 28px;color: var(--v-primary-lighten2);">·</span>
+              <div
+                :style="{width: k ? 'auto' : width}"
+              >
+                <div style="font-size: 16px;">{{ val.title }}</div>
+                <div style="font-size: 14px;" class="subTitle mb-5">{{ val.subTitle }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </v-card>
+  </m-menu>
+</template>
+
+<script setup>
+import MMenu from './commonMenuStyle.vue'
+defineOptions({name: 'entrances-defineListPage2'})
+const emits = defineEmits(['emitClick'])
+defineProps({
+  list: {
+    type: Array,
+    default: () => []
+  },
+  title: {
+    type: String,
+    default: 'title'
+  },
+  width: {
+    type: String,
+    default: '160px'
+  },
+  ml: {
+    type: String,
+    default: '150px'
+  }
+})
+</script>
+<style lang="scss" scoped>
+.cursor-pointer {
+  .subTitle { color: #999; }
+  &:hover {
+    color: var(--v-primary-base);
+    .subTitle {
+      color: #666;
+    }
+  }
+}
+</style>

src/views/entrances/navBar/components/product.vue

@@ -1,20 +1,37 @@
 <template>
-  <m-menu :btnTitle="title">
-    <v-list>
-      <v-list-item
-        v-for="n in 1"
-        :key="n"
-        title=""
-      ></v-list-item>
-    </v-list>
-  </m-menu>
+  <defineListPage v-bind="$attrs" :list="list" @emitClick="val => emits('emitClick', val)"></defineListPage>
 </template>
 
 <script setup>
-import MMenu from './commonMenuStyle.vue'
+import defineListPage from './defineListPage.vue'
 defineOptions({name: 'navBar-product'})
+const emits = defineEmits(['emitClick'])
 
-const title = '产品'
+const list = [
+  {
+    title: '酒店管理',
+    appList: [
+      [{ title: '招聘管理系统', path: '/' }, { title: '绩效管理系统', path: '/' }],
+      [{ title: '组织人事系统', path: '/' }, { title: '盘点发展系统', path: '/' }],
+      [{ title: '假勤管理系统', path: '/' }, { title: '数字人力分析', path: '/' }],
+      [{ title: '数字人才', path: '/' }, { title: '文化激励', path: '/' }],
+    ],
+  },
+  {
+    title: '人才测评',
+    appList: [
+      [{ title: '招聘测评', path: '/' }, { title: '在线考试系统', path: '/' }],
+      [{ title: '人才管理测评', path: '/' }, { title: '360度评估反馈系统', path: '/' }],
+      [{ title: '人才测评中心平台', path: '/' }, { title: '人才模型构建', path: '/' }],
+    ]
+  },
+  {
+    title: '人才库',
+    appList: [
+      [{ title: '人才库', path: '/' }]
+    ]
+  },
+]
 </script>
 <style lang="scss" scoped>
 </style>

src/views/entrances/navBar/components/serviceSupport.vue

@@ -0,0 +1,22 @@
+<template>
+  <defineListPage v-bind="$attrs" width="350px" ml="100px" :list="list" @emitClick="val => emits('emitClick', val)"></defineListPage>
+</template>
+
+<script setup>
+import defineListPage from './defineListPage2.vue'
+defineOptions({name: 'navBar-serviceSupport'})
+const emits = defineEmits(['emitClick'])
+
+const list = [
+  {
+    title: '服务支持',
+    appList: [
+      [{ title: '客户成功', subTitle: '以客户价值为中心的陪伴式服务', path: '/' }, { title: '门墩儿SaaS平台', subTitle: '应用快速搭建，高灵活可配置', path: '/' }],
+      [{ title: '实践管理工作坊', subTitle: '专注HR职场生涯，提供个人专业能力解决方案', path: '/' }, { title: '应用商店', subTitle: '门墩儿为企业提供免费应用下载', path: '/' }],
+      [{ title: '开发者门户', subTitle: '高效、灵活的门墩儿SaaS应用开发平台', path: '/' }],
+    ],
+  },
+]
+</script>
+<style lang="scss" scoped>
+</style>

src/views/entrances/navBar/components/solution.vue

@@ -1,20 +1,31 @@
 <template>
-  <m-menu :btnTitle="title">
-    <v-list>
-      <v-list-item
-        v-for="n in 1"
-        :key="n"
-        title=""
-      ></v-list-item>
-    </v-list>
-  </m-menu>
+  <defineListPage v-bind="$attrs" width="250px" ml="100px" :list="list" @emitClick="val => emits('emitClick', val)"></defineListPage>
 </template>
 
 <script setup>
-import MMenu from './commonMenuStyle.vue'
+import defineListPage from './defineListPage2.vue'
 defineOptions({name: 'navBar-solution'})
+const emits = defineEmits(['emitClick'])
 
-const title = '解决方案'
+const list = [
+  {
+    title: '行业方案',
+    appList: [
+      [{ title: '互联网', subTitle: '智慧决策，极致体验', path: '/' }, { title: '央国企', subTitle: '推进人才强企，做好新时代人才工作', path: '/' }],
+      [{ title: '制造业', subTitle: '精细化管理，加速数字化转型', path: '/' }, { title: '盘点发展系统', subTitle: '银行', path: '/' }],
+      [{ title: '新能源', subTitle: '提升业务效能，创造人才价值', path: '/' }],
+    ],
+  },
+  {
+    title: '场景方案',
+    appList: [
+      [{ title: '校招', subTitle: '科技助力校招每一步，释放校招生产力', path: '/' }],
+      [{ title: '社招', subTitle: '高效人才招聘，提升企业人才竞争力', path: '/' }],
+      [{ title: '人才地图', subTitle: '发现高潜人才，保留关键人才', path: '/' }],
+      [{ title: '胜任力模型', subTitle: '提升人岗匹配，优化人才结构', path: '/' }]
+    ]
+  },
+]
 </script>
 <style lang="scss" scoped>
 </style>

src/views/entrances/navBar/index.vue

@@ -5,34 +5,50 @@
     style="padding-left: 0px;height: 50px;font-size: 14px;"
   >
     <div class="innerBox d-flex justify-space-between">
-      <div class="d-flex">
+      <div class="d-flex align-center">
         <div class="nav-logo" style="cursor: pointer;" @click="handleLogoClick">
-          <v-img src="@/assets/logo.png"  aspect-ratio="16/9" cover :width="90" style="height: 40px"></v-img>
+          <v-img src="@/assets/logo.png"  aspect-ratio="16/9" cover :width="90" style="height: 40px;"></v-img>
         </div>
-        <!-- <div class="menuList ml-10">
+        <div class="menuList ml-10">
           <div v-for="val in menuList" :key="val.name">
-            <component :is="val.path"></component>
+            <template v-if="val.fileName">
+              <component :is="val.fileName" :title="val.title" @emitClick="eventVal => handleClick(eventVal)"></component>
+            </template>
+            <template v-else>
+              <span class="cursor-pointer" @click="handleClick(val)">{{ val.title }}</span>
+            </template>
           </div>
-        </div> -->
+        </div>
       </div>
-      <!-- <div class="d-flex">
+      <div class="d-flex">
         <span>右侧</span>
-      </div> -->
+      </div>
     </div>
   </v-toolbar>
 </template>
 
 <script setup>
-// import product from './components/product.vue'
-// import solution from './components/solution.vue'
+import product from './components/product.vue'
+import solution from './components/solution.vue'
+import serviceSupport from './components/serviceSupport.vue'
+import Snackbar from '@/plugins/snackbar'
 import { useRouter } from 'vue-router'; const router = useRouter()
 defineOptions({name: 'entrances-navBar'})
 const handleLogoClick = () => { router.push({ path: '/'}) }
 
-// const menuList = [
-//   { name: 'product', path: product },
-//   { name: 'solution', path: solution },
-// ]
+const menuList = [
+  { title: '产品', fileName: product },
+  { title: '解决方案', fileName: solution },
+  { title: '客户案例', path: '/' },
+  { title: '服务支持', fileName: serviceSupport },
+  { title: '资源中心', fileName: product },
+  { title: '什么是门墩儿？', fileName: product },
+]
+const handleClick = (val) => {
+  Snackbar.warning('暂未开发，敬请期待！')
+  console.log('handleClick', val)
+  // if (val.path) window.open(val.path)
+}
 </script>
 <style lang="scss" scoped>
 @import '@/styles/entrances/navBar.scss'