Przeglądaj źródła

导航栏新需求;

huan-jie 4 lat temu
rodzic
commit
916bf0361e
2 zmienionych plików z 62 dodań i 30 usunięć
  1. 55 2
      components/header.vue
  2. 7 28
      components/headers/dropDownData.js

+ 55 - 2
components/header.vue

@@ -16,7 +16,7 @@
 
       <div class="dropDownArea">
         <el-button type="text" class="dashboard-title">技术人力</el-button>
-        <el-button type="text" class="dashboard-title">开发</el-button>
+        <!-- <el-button type="text" class="dashboard-title">开发</el-button> -->
 
         <div class="showDropDownArea">
           <div class="contentArea">
@@ -71,6 +71,38 @@
         <div class="dropdown" style="display:none;"></div>
         <div class="dropdown" style="display:none;"></div>
       </div>
+
+      <!-- 更多 -->
+      <el-dropdown class="more-dropdown" placement="bottom-start">
+        <el-button type="text" class="dashboard-title">更多</el-button>
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item>
+            <a class="more-item" :href="kaifainUrl">
+              <img :src="KaifainIcon" alt="" >
+              <span>开发屋</span>
+            </a>
+          </el-dropdown-item>
+          <el-dropdown-item>
+            <a class="more-item" :href="jishuBaseUrl">
+              <img :src="JishuinIcon" alt="" >
+              <span>技术圈</span>
+            </a>
+          </el-dropdown-item>
+          <el-dropdown-item>
+            <a class="more-item" href="https://unisms.apistd.com/?source=pi.pc.nav" target="_blank">
+              <img src="https://uni-cdn.oss-cn-hangzhou.aliyuncs.com/public/img/unisms-icon.png" alt="" >
+              <span>UniSMS (合一短信)</span>
+            </a>
+          </el-dropdown-item>
+          <el-dropdown-item>
+            <a class="more-item" href="https://www.yesdev.cn/" target="_blank">
+              <img :src="YesDevIcon" alt="" >
+              <span>YesDev</span>
+            </a>
+          </el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+
       <template v-if="myInfo.nickname">
         <el-dropdown class="nav-dropdown">
           <el-button type="text" class="dashboard-title">
@@ -277,12 +309,18 @@
 
 <script>
 import WhiteLogo from "@/assets/img/white_logo@2x.png";
+import KaifainIcon from "@/assets/img/header/new/kaifain2@2x.png"
+import JishuinIcon from "@/assets/img/header/new/jishuin@2x.png"
+import YesDevIcon from "@/assets/img/header/new/yesdev@2x.png"
 import DropDownData from "./headers/dropDownData.js";
 
 export default {
   props: ["transparent"],
   data() {
     return {
+      KaifainIcon,
+      JishuinIcon,
+      YesDevIcon,
       baseUrl: "",
       jishuBaseUrl: "",
       kaifainUrl: "",
@@ -433,7 +471,7 @@ export default {
         display: flex;
         box-sizing: content-box;
         width: 830px;
-        height: 550px;
+        height: 460px;
         background: #ffffff;
         border-radius: 6px;
         box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.06);
@@ -564,6 +602,21 @@ export default {
     }
   }
 }
+.more-item {
+  // padding: 4px 12px 4px 8px;
+  display: flex;
+  align-items: center;
+  img {
+    width: 24px;
+    height: 24px;
+    margin-right: 12px;
+  }
+  span {
+    font-size: 15px;
+    color: rgba(0, 0, 0, .85);
+    font-weight: 500;
+  }
+}
 </style>
 
 <style scoped>

+ 7 - 28
components/headers/dropDownData.js

@@ -4,7 +4,7 @@ const DropDownData = (domainConfig) => {
   return [
     {
       title: "服务",
-      titleEn: "Solutions by Scenari",
+      titleEn: "Technical manpower",
       list: [{
         icon: require('../../assets/img/header/new/job@2x.png'),
         title: "自由工作",
@@ -20,37 +20,16 @@ const DropDownData = (domainConfig) => {
         title: "人力外包",
         desc: "一站式软件开发",
         href: siteUrl+'/outsource/sitePublicity?from=top_nav'
-      }, {
-        icon: require('../../assets/img/header/new/cloud@2x.png'),
-        title: "任务大厅",
-        desc: "专注程序员技术招聘",
-        href: jobUrl+'/?from=top_nav'
       }], 
     },
     {
-      title: "更多",
-      titleEn: "More",
+      title: "招聘",
+      titleEn: "Technical recruitment",
       list: [{
-        icon: require('../../assets/img/header/new/kaifain2@2x.png'),
-        title: "开发屋",
-        desc: "数据API交易平台",
-        href: kaifainUrl
-      }, {
-        icon: require('../../assets/img/header/new/jishuin@2x.png'),
-        title: "技术圈",
-        desc: "最新行业动态",
-        href: jishuinUrl
-      }, {
-        icon: require('../../assets/img/header/new/yesdev@2x.png'),
-        title: "YesDev",
-        desc: "专注软件开发过程中的每一个环节",
-        href: 'https://www.yesdev.cn/'
-      }, {
-        icon: 'https://uni-cdn.oss-cn-hangzhou.aliyuncs.com/public/img/unisms-icon.png',
-        title: "UniSMS (合一短信)",
-        desc: "高可用聚合短信平台",
-        href: 'https://unisms.apistd.com/?source=pi.pc.nav',
-        blank: true
+        icon: require('../../assets/img/header/new/cloud@2x.png'),
+        title: "飞码招聘",
+        desc: "专注程序员技术招聘",
+        href: jobUrl+'/?from=top_nav'
       }],
     },
   ]