门墩儿入口管理列表

src/layout/personal/navBar.vue

@@ -130,7 +130,7 @@ const list = ref([
   { text: t('common.company'), path: '/recruit/personal/company' }
 ])
 
-const handleLogoClick = () => { router.push({ path: '/home'}) }
+const handleLogoClick = () => { router.push({ path: '/'}) } // /home 点击logo
 const handleSubmit = () => { toEnterprise(radios.value) }
 
 // 查看用户是否有企业

src/styles/entrances/navBar.scss

@@ -0,0 +1,41 @@
+.banner {
+  width: 100%;
+  height: 50px;
+  z-index: var(--zIndex-nav) !important;
+  color: #fff;
+  background-color: #d5e6e8;
+  padding-left: 0px;
+  font-size: 14px;
+  .left {
+    height: 100%;
+    display: flex;
+    align-items: center;
+    font-size: 20px;
+    cursor: pointer;
+  }
+}
+.hover:hover {
+  cursor: pointer;
+  background: rgba(0, 0, 0, 0.03);
+}
+.innerBox {
+  position: relative;
+  // width: 1184px;
+  // max-width: 1184px;
+  width: 100%;
+  padding: 0 50px;
+  margin: 0 auto;
+  align-items: center;
+  color: var(--v-primary-base);
+  font-size: 16px;
+}
+.nav-logo {
+  float: left;
+}
+.menuList {
+  display: flex;
+  align-items: center;
+  div {
+    margin-left: 60px;
+  }
+}

src/views/entrances/index.vue

@@ -1,10 +1,16 @@
 <!-- 门墩儿入口管理页 -->
 <template>
-  <div>vue3PageInit</div>
+  <div>
+    <navBar></navBar>
+    <m-list></m-list>
+  </div>
 </template>
 
 <script setup>
+import navBar from './navBar'
+import MList from './list'
 defineOptions({name: 'entrances-index'})
+
 </script>
 <style lang="scss" scoped>
 </style>

src/views/entrances/list/index.vue

@@ -0,0 +1,35 @@
+<!-- 门墩儿入口管理列表 -->
+<template>
+  <div class="d-flex justify-center mt-15">
+    <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;" class="mt-5">
+        <span v-for="(val, i) in smallTitle" :key="'bigTitle' + i" :class="{'ml-2': i}">{{ val }}</span>
+      </div>
+    </div>
+  </div>
+  <div class="listBox">
+
+  </div>
+</template>
+
+<script setup>
+defineOptions({name: 'entrances-list'})
+
+const bigTitle = ['酒店一体化 SaaS 平台', '职业发展社交平台']
+
+const smallTitle = [
+  '企业在线招聘专场',
+  '更快找到合适人选',
+  '尽享海量VIP特权',
+]
+// const smallTitle = [
+//   '候选人推荐',
+//   '滚动广告位宣传',
+//   '企业在线招聘专场'
+// ]
+</script>
+<style lang="scss" scoped>
+</style>

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

@@ -0,0 +1,37 @@
+<template>
+  <v-menu
+    open-on-hover 
+    :close-delay="1" 
+    :open-delay="0" 
+    v-bind="$attrs" 
+    location="bottom" 
+    max-height="400"
+    :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>
+    </template>
+    <slot></slot>
+  </v-menu>
+</template>
+<script setup>
+// import { ref } from 'vue'
+defineOptions({name: 'conditionFilter-index-page'})
+const defineProps = defineProps({
+  btnTitle: {
+    type: String,
+    default: 'Text'
+  },
+  closeOnContentClick: {
+    type: Boolean,
+    default: true
+  }
+})
+
+</script>
+
+<style lang="scss" scoped>
+</style>

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

@@ -0,0 +1,20 @@
+<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>
+</template>
+
+<script setup>
+import MMenu from './commonMenuStyle.vue'
+defineOptions({name: 'navBar-product'})
+
+const title = '产品'
+</script>
+<style lang="scss" scoped>
+</style>

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

@@ -0,0 +1,20 @@
+<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>
+</template>
+
+<script setup>
+import MMenu from './commonMenuStyle.vue'
+defineOptions({name: 'navBar-solution'})
+
+const title = '解决方案'
+</script>
+<style lang="scss" scoped>
+</style>

src/views/entrances/navBar/index.vue

@@ -0,0 +1,39 @@
+<template>
+  <v-toolbar
+    class="banner"
+    density="compact"
+    style="padding-left: 0px;height: 50px;font-size: 14px;"
+  >
+    <div class="innerBox d-flex justify-space-between">
+      <div class="d-flex">
+        <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>
+        </div>
+        <!-- <div class="menuList ml-10">
+          <div v-for="val in menuList" :key="val.name">
+            <component :is="val.path"></component>
+          </div>
+        </div> -->
+      </div>
+      <!-- <div class="d-flex">
+        <span>右侧</span>
+      </div> -->
+    </div>
+  </v-toolbar>
+</template>
+
+<script setup>
+// import product from './components/product.vue'
+// import solution from './components/solution.vue'
+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 },
+// ]
+</script>
+<style lang="scss" scoped>
+@import '@/styles/entrances/navBar.scss'
+</style>