lilinsen 6 years ago
parent
commit
c4d2646a41
4 changed files with 29 additions and 11 deletions
  1. 2 2
      sites/doc/app.js
  2. 21 8
      sites/doc/app.vue
  3. 1 0
      sites/doc/compents/vue-stickto/VueStickto.js
  4. 5 1
      sites/doc/info.vue

+ 2 - 2
sites/doc/app.js

@@ -8,8 +8,8 @@ import backtop from './compents/backtop/backtop.js';
 import  './compents/backtop/backtop.css';
 backtop.install(Vue);
 import 'highlight.js/styles/github.css';
-
-
+import VueStickto from './compents/vue-stickto/VueStickto.js';
+Vue.use(VueStickto)
 import codes from 'qrcode';
 
 

+ 21 - 8
sites/doc/app.vue

@@ -42,12 +42,8 @@
         </div>
       </div>
       <div class="demo-wrapper">
-        <router-view class="demo-nav"></router-view>
-        
-        <keep-alive include="index">
-          <router-view class="doc-cont" :class="showPhone?'':'docpad'" name="main"></router-view>
-        </keep-alive>
-        <div v-if="showPhone" class="showPhone">
+       
+         <div v-if="showPhone" class="showPhone">
           <div class="ph">
             <div class="bg">
               <img src="./asset/css/i/phtitle.png" alt>
@@ -57,7 +53,15 @@
             </div>
             <iframe :src="'//nutui.jd.com/demo.html#/'+routerName+'?ver='+version"></iframe>
           </div>
+        </div> 
+        <keep-alive include="index">
+          <router-view class="doc-cont wrapper-right" :class="showPhone?'':'docpad'" name="main"></router-view>
+        </keep-alive>
+        <div class="left-nav">
+          <router-view class="demo-nav"></router-view>
         </div>
+         
+       
       </div>
       <div class="foot">
         Copyright © 2018~2019
@@ -259,7 +263,7 @@ export default {
     margin-top: 7px;
     vertical-align: bottom;
   }
-
+  
   .h-nav {
     display: flex;
     padding-left: 42px;
@@ -374,12 +378,19 @@ export default {
 .demo-wrapper {
   display: flex;
   width: 100%;
-
+   justify-content:flex-end;
+   flex-direction:row-reverse;
   //padding: 0 20px 0 0;
   .demo-nav {
     width: 294px;
     flex-shrink: 0;
   }
+  .left-nav{
+    width: 295px;
+  }
+  .wrapper-right{
+    // margin-left: 300px;
+  }
   .showPhone {
     padding-right: 25px;
     //margin-left: 20px;
@@ -444,6 +455,8 @@ export default {
   position: absolute;
   bottom: 0;
   width: 100%;
+  padding-left: 295px;
+  box-sizing: border-box;
   a {
     color: #fff;
     text-decoration: none;

File diff suppressed because it is too large
+ 1 - 0
sites/doc/compents/vue-stickto/VueStickto.js


+ 5 - 1
sites/doc/info.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="main-menu lt-nv">
+  <div class="main-menu lt-nv " v-stickto>
     <ol class="nav-l-1">
       <dt>指南</dt>
       <dd :class="curName=='intr' ?'l-1 curs':'l-1'">
@@ -182,6 +182,10 @@ dd {
   font-size: 14px;
   width: 295px;
   border-right: 1px solid #d8d8d8;
+  background: #fff;
+  height: 100%;
+  overflow: hidden;
+  overflow-y: auto;
   a,
   span {
     text-decoration: none;