-

src/assets/css/hyapp.css

@@ -285,7 +285,6 @@ li {
 .von-cp-right{
 	flex: 1;
 	margin-left: 70px;
-	position: absolute;
 	min-height: 100%;
 	background: #333536;
 }

src/components/Nav.vue

@@ -44,8 +44,8 @@
         <li class="sanjiao">
           <a href="#">Victory<br />硬质合金车刀</a>
           <dl>
-            <dt><a href="#/cpdat01">整体概览</a></dt>
-            <dt><a href="#/cpdat02">详细参数</a></dt>
+            <dt><a href="#/cpinfo01">整体概览</a></dt>
+            <dt><a href="#/cpinfo02">详细参数</a></dt>
             <dd></dd>
           </dl>
         </li>

src/components/footer.vue

@@ -20,6 +20,9 @@ export default {
 </script>
 
 <style>
+footer{
+  z-index: 29000;
+}
 .fblue{
   display: flex;
   height: 60px;

src/routers/index.js

@@ -16,6 +16,14 @@ export const constantRoutes = [
     path: '/cpdat02',
     component: () => import('@/views/cpdat02')
   },
+  {
+    path: '/cpinfo01',
+    component: () => import('@/views/cpinfo01')
+  },
+  {
+    path: '/cpinfo02',
+    component: () => import('@/views/cpinfo02')
+  },
   {
     path: '/cplist',
     component: () => import('@/views/cplist')

src/views/cpinfo01.vue

@@ -0,0 +1,56 @@
+<template>
+<div class="main">
+  <div  class="von-in-main von-cpda">
+				<div class="von-in">
+					<img src="@/assets/img/cpda01.png">	
+					<div class="qh-btn cp-qh-btna">
+						<button type="button" class="btn">查看详细参数<i class="iconfont iconbofang"></i></button>
+					</div>
+				</div>
+				<div class="von-in">
+					<img src="@/assets/img/cpda02.png">	
+				</div>
+				<div class="von-in">
+					<img src="@/assets/img/cpda03.png">	
+					<div class="qh-btn cp-qh-btn">
+						<button type="button" class="btn">查看详细参数<i class="iconfont iconbofang"></i></button>
+					</div>
+				</div>
+				<div class="von-in">
+					<img src="@/assets/img/cpda04.png">
+					
+				</div>
+				<div class="von-in von-cpda-bg">
+					<img src="@/assets/img/cpda05.png">	
+					<img src="@/assets/img/cpda06.png">	
+					<img src="@/assets/img/cpda07.png">	
+					<img src="@/assets/img/cpda08.png">	
+					<img src="@/assets/img/cpda09.png">	
+				</div>
+				<div class="von-in">
+					<img src="@/assets/img/cpda11.png">
+					<div class="qh-btn cp-qh-btne">
+						<button type="button" class="btn">查看详细参数<i class="iconfont iconbofang"></i></button>
+					</div>
+				</div>
+				
+			</div>
+             <app-nav/>
+ <app-footer/>
+		</div>	
+</template>
+
+<script>
+import AppNav from '@/components/Nav.vue'
+import AppFooter from '@/components/footer.vue'
+export default {
+ components: {
+        AppFooter,
+        AppNav
+      },
+}
+</script>
+
+<style>
+
+</style>

src/views/cpinfo02.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="main">
+  
+			<div class="von-cp von-cpdat-row d-flex">
+			<div class="von-cp-nav">
+					<ul class="nav nav-pills nav-list cp-info" role="tablist">
+						<li class="active">
+							<a href="#"><img src="@/assets/img/cpda13.png" width="60%"/></a>
+						</li>
+						<li class="">
+							<a href="#"><img src="@/assets/img/cpda14.png" width="60%"/></a>
+						</li>
+						<li class="">
+							<a href="#"><img src="@/assets/img/cpda15.png" width="60%"/></a>
+						</li>
+						<li class="">
+							<a href="#"><img src="@/assets/img/cpda16.png" width="60%"/></a>
+						</li>
+						<li class="">
+							<a href="#"><img src="@/assets/img/cpda17.png" width="60%"/></a>
+						</li>
+						<li class="">
+							<a href="#"><img src="@/assets/img/cpda18.png" width="60%"/></a>
+						</li>
+					</ul>
+					<a class="von-call-btn" href="">
+						<span class="iconfont icondianhua"></span>
+						<div class="">
+							联系我们
+						</div>
+					</a>
+				</div>	
+				<div class="von-cp-right">
+					<div class="cp-right-ban">
+						<img src="@/assets/img/cpda12.png" />
+					</div>
+					<div class="">
+						<img src="@/assets/img/cpda19.png" width="100%"/>
+					</div>
+				</div>
+			</div>
+		<app-nav/>
+ <app-footer/>	
+  </div>
+</template>
+
+<script>
+import AppNav from '@/components/Nav.vue'
+import AppFooter from '@/components/footer.vue'
+export default {
+ components: {
+        AppFooter,
+        AppNav
+      },
+}
+</script>
+
+<style>
+
+.von-cp{
+    justify-content: space-between;
+}
+.rightdetail{
+    margin-left: 70px;
+    width: 100%;
+    box-sizing:content-box;
+}
+.rightdetail img{
+    width: 100%;
+    height: auto;
+}
+
+</style>

src/views/cplist.vue

@@ -26,7 +26,7 @@
             <img class="dj-demo-off" src="@/assets/img/off.png" alt="" @click="windowt=false;">
         </div>
     </div>
-
+<div>
 <div class="von-cp-right">
 					<div class="cp-right-ban">
 						<img src="@/assets/img/cpbanner.png" />
@@ -63,6 +63,8 @@
 						</li>
 					</ul>
 				</div>
+  </div>
+  
   <app-nav/>
  <app-footer/>
   </div>
@@ -97,14 +99,15 @@ export default {
 
 <style scoped>
 .fixnav{
+    position: fixed; 
+    left: 0;
     background: black;
-    height: 100%;
     display: block;
     padding-top: 25%;
     width: 70px;
-    position: fixed;
-    left: 0;
-    z-index: 0;
+    height: auto;
+    padding-bottom: 12.5%;
+    
 }
 .fixnav ul{
     margin-bottom: 30%;