产品详情界面制作

components/header/menuDrops/menuDrop.vue

@@ -69,15 +69,18 @@ const productMenus = [
 const solutionMenus = [
   {
     text: "解决方案",
-    typeKey: "sol"
+    typeKey: "sol",
+    href: '/sol'
   },
   {
     text: "行业应用",
-    typeKey: "acs"
+    typeKey: "acs",
+    href: '/acs'
   },
   {
     text: "电力案例",
-    typeKey: "epower"
+    typeKey: "epower",
+    href: '/epower'
   },
 ];
 export default {

components/solutionList.vue

@@ -77,7 +77,6 @@ export default {
 }
 .solution{
   display: flex;
-  width: 96%;
   height: 360px;
   margin-bottom: 30px;
   border-radius: 3px;
@@ -85,20 +84,25 @@ export default {
   box-shadow: 1px 1px 5px black;
   justify-content: space-between;
   cursor: pointer;
+  padding: 5px;
+  box-sizing: content-box;
 }
 .solution .imgBox{
   display: flex;
-  position: relative;
+  /*position: relative;*/
   width: 40%;
   height: 360px;
   overflow: hidden;
   justify-content: center;
+  flex-shrink: 1;
 }
+
 .solution .imgBox img{
   display: block;
   max-width: 100%;
   width: auto;
   height: 100%;
+  position: relative;
 }
 
 .solution .more{

pages/solution/_type.vue

@@ -0,0 +1,63 @@
+<template>
+<!--  <product-index :p-type="type" :p-product="products"/>-->
+  <solution-index :p-type="type" :p-solution="solutions"></solution-index>
+</template>
+
+<script>
+import productIndex from '@/pages/product/index.vue'
+import handle from "~/until/handle";
+import axios from "axios";
+import qs from "qs";
+import SolutionIndex from "@/pages/solution/index";
+const pageLimit = 5;
+export default {
+  name: "typeSolutionPage",
+  props:[],
+  async asyncData(ctx){
+    // ctx.searchProduct();
+    const queryData = {};
+    // console.log(ctx)
+    queryData['key']=ctx.key;
+
+    queryData['type']=ctx.params.type?ctx.params.type:'all';
+    queryData['page']=1;
+    queryData['limit']=pageLimit;
+    // 获取数据
+    let url = 'http://szhfy.com.cn/api/searchSolution.php';
+    let [err,res] = await handle(axios.post(
+      url,
+      qs.stringify(queryData)
+    ));
+    if(err){
+      console.log(err);
+      return {};
+    }
+    let result = res.data;
+    if(result.rcode === 1){
+      return {solutions:result.data}
+    }else{
+      console.error(result.msg);
+      console.log(result);
+      return {solutions:[]}
+    }
+  },
+  data(){
+    return {
+      type:  'all',
+      solutions: []
+    }
+  },
+  beforeMount() {
+    // console.log('动态页面执行');
+    this.type = this.$route.params.type?this.$route.params.type:'all';
+    // console.log(this.type);
+  },
+  components:{
+    SolutionIndex,
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

pages/solution/index.vue

@@ -22,6 +22,7 @@ import langMap from "~/map/langMap";
 import handle from "~/until/handle";
 import axios from "axios";
 
+const pageLimit = 10;
 export default {
   name: "solutionIndex",
   props:['uLang','pType','pKey','pSolution'],
@@ -38,6 +39,7 @@ export default {
     queryData['key']=ctx.key;
     queryData['type']=ctx.type;
     queryData['page']=1;
+    queryData['limit']=pageLimit;
     // 获取数据
     let url = 'http://szhfy.com.cn/api/searchSolution.php';
     let [err,res] = await handle(axios.post(
@@ -65,6 +67,7 @@ export default {
       page: 1,
       nowCount: 199,
       nowTotal: 2,
+      limit:pageLimit,
       solutions:this.pSolution?this.pSolution:[],
       pageSave: {
 
@@ -76,7 +79,14 @@ export default {
     this.$root.$on('changeSolutionType',this.selectType);
     this.$root.$on('changePage',this.changePageHandle);
     // this.$root.$on('changeProductType',this.selectType);
-
+    const queryData = {};
+    // console.log(ctx)
+    queryData['key']=this.key;
+    queryData['type']=this.type;
+    queryData['page']=this.page;
+    queryData['limit']=this.limit;
+    let data = qs.stringify(queryData);
+    this.loadPageData(data);
   },
   methods:{
     switchLang(nextLang){
@@ -110,6 +120,7 @@ export default {
       queryData['key']=this.key;
       queryData['type']=this.type;
       queryData['page']=this.page;
+      queryData['limit']=this.limit;
       // 获取数据
       let url = '/api/searchSolution.php';
       let data = qs.stringify(queryData);