修改显示

src/views/productCenter/index.vue

@@ -34,6 +34,8 @@
         <HighFrequencyRFID class="highFrequencyRFID" v-if="i.configModal === '8'  " :data="i"/>
         <!--        <UltraHighFrequencyRFID class="ultraHighFrequencyRFID" v-if="i.configModal === '9' " :data="i"/>-->
         <DataAcquisitionSensing class="dataAcquisitionSensing" v-if="i.configModal === '9'" :data="i"/>
+        <modal11 class="dataAcquisitionSensing" v-if="i.configModal === '11'" :data="i"/>
+        <modal12 class="dataAcquisitionSensing" v-if="i.configModal === '12'" :data="i"/>
       </div>
     </div>
     <!--    <div v-if="tabsActive === 1">-->
@@ -54,6 +56,8 @@ import PlatformArchitecture from './platformArchitecture'
 import TechnicalArchitecture from './technicalArchitecture'
 import PlatformFeatures from './platformFeatures'
 import HighFrequencyRFID from './product/highFrequencyRFID'
+import modal11 from './modal11'
+import modal12 from './modal12'
 import UltraHighFrequencyRFID from './product/ultraHighFrequencyRFID'
 import DataAcquisitionSensing from './product/dataAcquisitionSensing'
 import ContactUs from '@/components/contactUs'
@@ -74,7 +78,9 @@ export default {
     UltraHighFrequencyRFID,
     DataAcquisitionSensing,
     ContactUs,
-    Copyright
+    Copyright,
+    modal11,
+    modal12
   },
   data() {
     return {

src/views/productCenter/modal11.vue

@@ -0,0 +1,72 @@
+<template>
+  <div>
+    <TitleGroup>
+      <template slot="title">{{ data.productInfoEtitle }}</template>
+      <template slot="subTitle">{{ data.productInfoCtitle }}</template>
+    </TitleGroup>
+    <div class="list">
+      <div v-for="ii in groupByCount(data.hwProductInfoDetailList)">
+        <div class="item" v-for="(i,k) in ii">
+          <el-image
+            style="width: 100%;height: 100%"
+            :src="i.productInfoDetailPic"
+            fit="contain"></el-image>
+        </div>
+        <br>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import TitleGroup from "@/components/TitleGroup";
+import wlw from "@/assets/icon/wlw.png";
+import znzz from "@/assets/icon/znzz.png";
+import kdwl from "@/assets/icon/kdwl.png";
+import znlt from "@/assets/icon/znlt.png";
+
+let map = null
+export default {
+  name: 'modal11',
+  props: ['data'],
+  components: {
+    TitleGroup
+  },
+  data() {
+    return {}
+  },
+  mounted() {
+  },
+  methods: {
+    groupByCount(array) {
+      let result = [];
+      for (let i = 0; i < array.length; i += 3) {
+        result.push(array.slice(i, i + 3));
+      }
+      return result;
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+@import "~@/style.less";
+
+.list {
+  margin: 3.9vw auto 0;
+  padding-bottom: 5.3vw;
+  width: 60vw;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+
+  .item {
+    display: inline-block;
+    width: 30%;
+    //height: 16.7vw;
+    margin: 0 0.5vw;
+
+  }
+}
+</style>

src/views/productCenter/modal12.vue

@@ -0,0 +1,72 @@
+<template>
+  <div>
+    <TitleGroup>
+      <template slot="title">{{ data.productInfoEtitle }}</template>
+      <template slot="subTitle">{{ data.productInfoCtitle }}</template>
+    </TitleGroup>
+    <div v-for="ii in groupByCount(data.hwProductInfoDetailList)">
+      <div class="list">
+        <div class="item" v-for="(i,k) in ii">
+          <el-image
+            style="width: 100%;height: 100%"
+            :src="i.productInfoDetailPic"
+            fit="contain"></el-image>
+        </div>
+        <br>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import TitleGroup from "@/components/TitleGroup";
+import wlw from "@/assets/icon/wlw.png";
+import znzz from "@/assets/icon/znzz.png";
+import kdwl from "@/assets/icon/kdwl.png";
+import znlt from "@/assets/icon/znlt.png";
+
+let map = null
+export default {
+  name: 'modal12',
+  props: ['data'],
+  components: {
+    TitleGroup
+  },
+  data() {
+    return {}
+  },
+  mounted() {
+  },
+  methods: {
+    groupByCount(array) {
+      let result = [];
+      for (let i = 0; i < array.length; i += 2) {
+        result.push(array.slice(i, i + 2));
+      }
+      return result;
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+@import "~@/style.less";
+
+.list {
+  margin: 3.9vw auto 0;
+  padding-bottom: 5.3vw;
+  width: 60vw;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+
+  .item {
+    display: inline-block;
+    width: 49%;
+    //height: 16.7vw;
+    margin: 0 0.5vw;
+
+  }
+}
+</style>