Merge branch 'master' of http://git.cc-lotus.info/service-platform/web-website

src/components/index.vue

@@ -32,14 +32,14 @@
               </el-col>
             </el-col>
             <el-col :span="24" class="dian">
-              图标
+              <dian></dian>
             </el-col>
           </el-col>
           <el-col :span="9" class="xinpin">
-            新品发布，创新服务
+            <xinpin :xinpinList="xinpinList" :chuangxinList="chuangxinList"></xinpin>
           </el-col>
           <el-col :span="24" class="link">
-            友情链接
+            <linkInfo :linkList="linkList"></linkInfo>
           </el-col>
         </div>
       </el-col>
@@ -60,6 +60,9 @@ import mapInfo from '@/layout/index/mapInfo.vue';
 import zixun from '@/layout/index/zixun.vue';
 import notice from '@/layout/index/notice.vue';
 import law from '@/layout/index/law.vue';
+import dian from '@/layout/index/dian.vue';
+import xinpin from '@/layout/index/xinpin.vue';
+import linkInfo from '@/layout/index/linkInfo.vue';
 import foot from '@/layout/index/foot.vue';
 
 export default {
@@ -70,6 +73,9 @@ export default {
     zixunList: null, //最新资讯
     noticeList: null, //通知公告
     lawList: null, //政策法规
+    xinpinList: null, //新品发布
+    chuangxinList: null, //创新服务
+    linkList: null, //友情链接
   },
   components: {
     top, //头部
@@ -79,6 +85,9 @@ export default {
     zixun, //最新资讯
     notice, //通知公告
     law, //政策法规
+    dian, //图标链接
+    xinpin, //新品发布 创新服务
+    linkInfo, //友情链接
     foot, //底部
   },
   data: () => ({}),
@@ -107,7 +116,7 @@ export default {
   overflow: hidden;
 }
 .main {
-  height: 960px;
+  height: 1000px;
   overflow: hidden;
   margin: 10px 0;
 }
@@ -159,7 +168,6 @@ export default {
   float: left;
   width: 100%;
   height: 160px;
-  background: #fff;
   overflow: hidden;
 }
 .main .xinpin {

src/layout/index/dian.vue

@@ -0,0 +1,64 @@
+<template>
+  <div id="dian">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="4" class="list" v-for="(item, index) in list" :key="index">
+          <el-link :underline="false" :href="item.url">
+            <el-image style="width:130px;height:160px;" :src="item.pic"></el-image>
+          </el-link>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'dian',
+  props: {},
+  components: {},
+  data: () => ({
+    list: [
+      {
+        url: '',
+        pic: require('@/assets/dian1.jpg'),
+      },
+
+      {
+        url: '',
+        pic: require('@/assets/dian2.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/dian3.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/dian4.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/dian5.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/dian6.jpg'),
+      },
+    ],
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.list {
+  width: 130px;
+  height: 160px;
+  margin: 0 6px 0 0;
+}
+.list:last-child {
+  margin: 0;
+}
+</style>

src/layout/index/linkInfo.vue

@@ -0,0 +1,57 @@
+<template>
+  <div id="linkInfo">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="2" class="leftTitle">
+          <span>友情链接</span>
+        </el-col>
+        <el-col :span="22">
+          <el-col :span="6" class="list" v-for="(item, index) in linkList" :key="index">
+            <el-link :underline="false" :href="item.url">
+              <el-image style="width:245px;height:53px;" :src="item.pic"></el-image>
+            </el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'linkInfo',
+  props: {
+    linkList: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.info {
+  padding: 20px;
+}
+.info .leftTitle {
+  text-align: center;
+  height: 60px;
+  line-height: 60px;
+}
+.info .leftTitle span {
+  font-size: 22px;
+  font-weight: bold;
+  color: #2e3351;
+}
+.list {
+  width: 258px;
+  height: 60px;
+  line-height: 60px;
+  margin: 0 10px 0 0;
+}
+.list:last-child {
+  margin: 0;
+}
+</style>

src/layout/index/xinpin.vue

@@ -0,0 +1,120 @@
+<template>
+  <div id="xinpin">
+    <el-row>
+      <el-col :span="24" class="xinpin">
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="topInfo">
+            <el-col :span="20" class="left">{{ title }}</el-col>
+            <el-col :span="4" class="more">
+              <el-link :underline="false"><el-image :src="more"></el-image></el-link>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="list">
+            <ul>
+              <li class="zixunList" v-for="(item, index) in xinpinList" :key="index">
+                <el-link :underline="false">
+                  <span class="title textOver">{{ item.title }}</span>
+                  <span class="date textOver">{{ item.date }}</span>
+                </el-link>
+              </li>
+            </ul>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="topInfo">
+            <el-col :span="20" class="left">{{ chuangxintitle }}</el-col>
+            <el-col :span="4" class="more">
+              <el-link :underline="false"><el-image :src="more"></el-image></el-link>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="list">
+            <ul>
+              <li class="zixunList" v-for="(item, index) in chuangxinList" :key="index">
+                <el-link :underline="false">
+                  <span class="title textOver">{{ item.title }}</span>
+                  <span class="date textOver">{{ item.date }}</span>
+                </el-link>
+              </li>
+            </ul>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'xinpin',
+  props: {
+    xinpinList: null,
+    chuangxinList: null,
+  },
+  components: {},
+  data: () => ({
+    title: '新品发布',
+    chuangxintitle: '创新服务',
+    more: require('@/assets/更多.png'),
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.xinpin {
+  padding: 20px;
+}
+ul {
+  padding: 0;
+  margin: 0;
+}
+li {
+  padding: 0;
+  margin: 0;
+  color: #999;
+}
+.info {
+  width: 100%;
+  height: 220px;
+  overflow: hidden;
+  background-color: #fff;
+}
+.topInfo {
+  height: 30px;
+  line-height: 30px;
+  margin: 0 0 10px 0;
+}
+.topInfo .left {
+  font-size: 22px;
+  color: #2c3350;
+  font-weight: bold;
+}
+.topInfo .more {
+  height: 30px;
+  text-align: right;
+  padding: 6px 0;
+}
+.list {
+  padding: 0 0 0 20px;
+  height: 180px;
+  overflow: hidden;
+}
+.zixunList {
+  padding: 0 0 5px 0;
+}
+.zixunList .title {
+  font-size: 14px;
+  color: #60626e;
+  display: inline-block;
+  width: 220px;
+  margin: 0 20px 0 0;
+}
+.zixunList .date {
+  font-size: 14px;
+  color: #abaab8;
+  float: right;
+  max-width: 90px;
+}
+</style>

src/layout/index/zixun.vue

@@ -91,6 +91,9 @@ li {
   width: 160px;
   background-color: #f3f3f3;
 }
+/deep/.el-select-dropdown__item {
+  padding: 0 15px;
+}
 .search .btn .icons {
   width: 45px;
   color: #4978bb;

src/views/index.vue

@@ -1,6 +1,15 @@
 <template>
   <div id="index">
-    <index-detail :info="info" :map="map" :zixunList="zixunList" :noticeList="noticeList" :lawList="lawList"></index-detail>
+    <index-detail
+      :info="info"
+      :map="map"
+      :zixunList="zixunList"
+      :noticeList="noticeList"
+      :lawList="lawList"
+      :xinpinList="xinpinList"
+      :chuangxinList="chuangxinList"
+      :linkList="linkList"
+    ></index-detail>
   </div>
 </template>
 
@@ -47,6 +56,44 @@ export default {
         date: '2019-12-25',
       },
     ],
+    linkList: [
+      {
+        url: '',
+        pic: require('@/assets/link1.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/link2.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/link3.jpg'),
+      },
+      {
+        url: '',
+        pic: require('@/assets/link3.jpg'),
+      },
+    ],
+    xinpinList: [
+      {
+        title: '尼日利亚传统领袖：尼应学习借鉴中国自贸区建设经验',
+        date: '2019-12-25',
+      },
+      {
+        title: '六条数据',
+        date: '2019-12-25',
+      },
+    ],
+    chuangxinList: [
+      {
+        title: '尼日利亚传统领袖：尼应学习借鉴中国自贸区建设经验',
+        date: '2019-12-25',
+      },
+      {
+        title: '六条数据',
+        date: '2019-12-25',
+      },
+    ],
   }),
   created() {},
   computed: {},