头部导航更改逻辑

assets/js/commonVue.js

@@ -101,6 +101,12 @@ const App = {
     this.getColumnData()
   },
   methods: {
+    handleOpen(){
+
+    },
+    handleClose(){
+
+    },
 
     //获取栏目数据
     getColumnData() {
@@ -327,6 +333,12 @@ const App = {
       this.getArticalData(this.requestParams)
     },
 
+    // 首页箭头下拉
+    goDown:function (){
+      let scrollElement = this.$refs.scrollElement;
+      scrollElement.scrollIntoView({ behavior: 'smooth' })
+    },
+
     //申请试用
     goApply: function () {
       this.centerDialogVisible = true

assets/js/main.js

@@ -41,15 +41,15 @@ var onitirDoc;
 
     // Document Ready
     $(document).ready(function() {
-        onitirDoc.init();
+        // onitirDoc.init();
 
         //首页下箭头点击事件
-        var $wh = $(window).height();
-        $('.go_down').click(function (e) {
-            $('html,body').animate({
-                scrollTop: $(window).height()
-            }, 700);
-        });
+        // var $wh = $(window).height();
+        // $('.go_down').click(function (e) {
+        //     $('html,body').animate({
+        //         scrollTop: $(window).height()
+        //     }, 700);
+        // });
     });
 
     

index.html

@@ -83,6 +83,57 @@
     
             <!--====== HEADER START ======-->
             <header-com @data-event="goApply" :todo="columnList" :currentone="currentPath"></header-com>
+
+            <el-row class="tac mobile" style="  top: 85px;
+            position: absolute;
+            width: 100%;
+            z-index: 2;">
+                <el-col :span="24">
+                  <el-menu
+                    active-text-color="#ffd04b"
+                    background-color="#545c64"
+                    class="el-menu-vertical-demo"
+                    default-active="2"
+                    text-color="#fff"
+                    @open="handleOpen"
+                    @close="handleClose"
+                  >
+                    <el-menu-item index="1">
+                        <icon-menu />
+                        <span>Navigator 1</span>
+                    </el-menu-item>
+
+                    <el-sub-menu index="2">
+                      <template #title>
+                        <location />
+                        <span>Navigator 2</span>
+                      </template>
+                      <el-menu-item-group title="">
+                        <el-menu-item index="2-1">item one</el-menu-item>
+                        <el-menu-item index="2-2">item two</el-menu-item>
+                      </el-menu-item-group>
+                    </el-sub-menu>
+                    
+                    <el-sub-menu index="3">
+                        <template #title>
+                          <location />
+                          <span>Navigator 3</span>
+                        </template>
+                        <el-menu-item-group title="">
+                          <el-menu-item index="3-1">item one</el-menu-item>
+                          <el-menu-item index="3-2">item two</el-menu-item>
+                        </el-menu-item-group>
+                      </el-sub-menu>
+
+                    <el-menu-item index="4">
+                      <setting />
+                      <span>Navigator 4</span>
+                    </el-menu-item>
+                  </el-menu>
+                </el-col>
+              </el-row>
+
+
             <!--====== HEADER END ======-->
     
             <div class="video-section">
@@ -116,7 +167,7 @@
                         <span>成为智慧数字产业的领跑者</span>
                     </div>
                 </div>
-                <span class="go_down"></span>
+                <span class="go_down" @click="goDown()" ref="scrollElement"></span>
             </div>
     
             <section v-if="columnList.length>1&&contentBoolean">