1

src/views/news/detail-model/model-0.vue

@@ -0,0 +1,112 @@
+<template>
+  <div id="model-0">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="btn">
+          <slot></slot>
+        </el-col>
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="title">
+            {{ data.title }}
+          </el-col>
+          <el-col :span="24" class="other">
+            <el-col :span="12" class="text">
+              信息来源：<span>{{ data.origin }}</span>
+            </el-col>
+            <el-col :span="12" class="text">
+              发布时间：<span>{{ data.release_time }}</span>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="content">
+            <p v-html="data.content"></p>
+          </el-col>
+          <el-col :span="24" class="image" v-if="data.image">
+            <el-carousel height="300px" :interval="2000">
+              <el-carousel-item v-for="(tag, index) in data.image" :key="index">
+                <el-image :src="tag.url"></el-image>
+              </el-carousel-item>
+            </el-carousel>
+          </el-col>
+          <el-col :span="24" class="fileUrl" v-if="data.fileUrl && data.fileUrl.length > 0">
+            <p>附件：</p>
+            <el-link :href="data.fileUrl[0].url">{{ data.fileUrl[0].name }}</el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'model-0',
+  props: {
+    data: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .btn {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+  .info {
+    .title {
+      font-size: 18px;
+      text-align: center;
+      font-weight: bold;
+      margin: 0 0 15px 0;
+    }
+    .other {
+      margin: 0 0 15px 0;
+      .text {
+        font-size: 14px;
+        color: #666;
+        text-align: right;
+        padding: 0 10px;
+        span {
+          color: #000;
+        }
+      }
+      .text:nth-child(2) {
+        text-align: left;
+      }
+    }
+    .content {
+      font-size: 16px;
+      text-indent: 2rem;
+      margin: 0 0 15px 0;
+    }
+    .image {
+      text-align: center;
+      padding: 0 26%;
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+</style>

src/views/news/detail-model/model-1.vue

@@ -0,0 +1,112 @@
+<template>
+  <div id="model-0">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="btn">
+          <slot></slot>
+        </el-col>
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="title">
+            {{ data.title }}
+          </el-col>
+          <el-col :span="24" class="other">
+            <el-col :span="12" class="text">
+              信息来源：<span>{{ data.origin }}</span>
+            </el-col>
+            <el-col :span="12" class="text">
+              发布时间：<span>{{ data.release_time }}</span>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="content">
+            <p v-html="data.content"></p>
+          </el-col>
+          <el-col :span="24" class="image" v-if="data.image">
+            <el-carousel height="300px" :interval="2000">
+              <el-carousel-item v-for="(tag, index) in data.image" :key="index">
+                <el-image :src="tag.url"></el-image>
+              </el-carousel-item>
+            </el-carousel>
+          </el-col>
+          <el-col :span="24" class="fileUrl" v-if="data.fileUrl && data.fileUrl.length > 0">
+            <p>附件：</p>
+            <el-link :href="data.fileUrl[0].url">{{ data.fileUrl[0].name }}</el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'model-0',
+  props: {
+    data: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .btn {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+  .info {
+    .title {
+      font-size: 18px;
+      text-align: center;
+      font-weight: bold;
+      margin: 0 0 15px 0;
+    }
+    .other {
+      margin: 0 0 15px 0;
+      .text {
+        font-size: 14px;
+        color: #666;
+        text-align: right;
+        padding: 0 10px;
+        span {
+          color: #000;
+        }
+      }
+      .text:nth-child(2) {
+        text-align: left;
+      }
+    }
+    .content {
+      font-size: 16px;
+      text-indent: 2rem;
+      margin: 0 0 15px 0;
+    }
+    .image {
+      text-align: center;
+      padding: 0 26%;
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+</style>

src/views/news/detail-model/model-2.vue

@@ -0,0 +1,112 @@
+<template>
+  <div id="model-0">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="btn">
+          <slot></slot>
+        </el-col>
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="title">
+            {{ data.title }}
+          </el-col>
+          <el-col :span="24" class="other">
+            <el-col :span="12" class="text">
+              信息来源：<span>{{ data.origin }}</span>
+            </el-col>
+            <el-col :span="12" class="text">
+              发布时间：<span>{{ data.release_time }}</span>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="content">
+            <p v-html="data.content"></p>
+          </el-col>
+          <el-col :span="24" class="image" v-if="data.image">
+            <el-carousel height="300px" :interval="2000">
+              <el-carousel-item v-for="(tag, index) in data.image" :key="index">
+                <el-image :src="tag.url"></el-image>
+              </el-carousel-item>
+            </el-carousel>
+          </el-col>
+          <el-col :span="24" class="fileUrl" v-if="data.fileUrl && data.fileUrl.length > 0">
+            <p>附件：</p>
+            <el-link :href="data.fileUrl[0].url">{{ data.fileUrl[0].name }}</el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'model-0',
+  props: {
+    data: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .btn {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+  .info {
+    .title {
+      font-size: 18px;
+      text-align: center;
+      font-weight: bold;
+      margin: 0 0 15px 0;
+    }
+    .other {
+      margin: 0 0 15px 0;
+      .text {
+        font-size: 14px;
+        color: #666;
+        text-align: right;
+        padding: 0 10px;
+        span {
+          color: #000;
+        }
+      }
+      .text:nth-child(2) {
+        text-align: left;
+      }
+    }
+    .content {
+      font-size: 16px;
+      text-indent: 2rem;
+      margin: 0 0 15px 0;
+    }
+    .image {
+      text-align: center;
+      padding: 0 26%;
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+</style>

src/views/news/detail-model/model-3.vue

@@ -0,0 +1,112 @@
+<template>
+  <div id="model-0">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="btn">
+          <slot></slot>
+        </el-col>
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="title">
+            {{ data.title }}
+          </el-col>
+          <el-col :span="24" class="other">
+            <el-col :span="12" class="text">
+              信息来源：<span>{{ data.origin }}</span>
+            </el-col>
+            <el-col :span="12" class="text">
+              发布时间：<span>{{ data.release_time }}</span>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="content">
+            <p v-html="data.content"></p>
+          </el-col>
+          <el-col :span="24" class="image" v-if="data.image">
+            <el-carousel height="300px" :interval="2000">
+              <el-carousel-item v-for="(tag, index) in data.image" :key="index">
+                <el-image :src="tag.url"></el-image>
+              </el-carousel-item>
+            </el-carousel>
+          </el-col>
+          <el-col :span="24" class="fileUrl" v-if="data.fileUrl && data.fileUrl.length > 0">
+            <p>附件：</p>
+            <el-link :href="data.fileUrl[0].url">{{ data.fileUrl[0].name }}</el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'model-0',
+  props: {
+    data: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .btn {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+  .info {
+    .title {
+      font-size: 18px;
+      text-align: center;
+      font-weight: bold;
+      margin: 0 0 15px 0;
+    }
+    .other {
+      margin: 0 0 15px 0;
+      .text {
+        font-size: 14px;
+        color: #666;
+        text-align: right;
+        padding: 0 10px;
+        span {
+          color: #000;
+        }
+      }
+      .text:nth-child(2) {
+        text-align: left;
+      }
+    }
+    .content {
+      font-size: 16px;
+      text-indent: 2rem;
+      margin: 0 0 15px 0;
+    }
+    .image {
+      text-align: center;
+      padding: 0 26%;
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+</style>

src/views/news/detail-model/model-4.vue

@@ -0,0 +1,112 @@
+<template>
+  <div id="model-0">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="btn">
+          <slot></slot>
+        </el-col>
+        <el-col :span="24" class="info">
+          <el-col :span="24" class="title">
+            {{ data.title }}
+          </el-col>
+          <el-col :span="24" class="other">
+            <el-col :span="12" class="text">
+              信息来源：<span>{{ data.origin }}</span>
+            </el-col>
+            <el-col :span="12" class="text">
+              发布时间：<span>{{ data.release_time }}</span>
+            </el-col>
+          </el-col>
+          <el-col :span="24" class="content">
+            <p v-html="data.content"></p>
+          </el-col>
+          <el-col :span="24" class="image" v-if="data.image">
+            <el-carousel height="300px" :interval="2000">
+              <el-carousel-item v-for="(tag, index) in data.image" :key="index">
+                <el-image :src="tag.url"></el-image>
+              </el-carousel-item>
+            </el-carousel>
+          </el-col>
+          <el-col :span="24" class="fileUrl" v-if="data.fileUrl && data.fileUrl.length > 0">
+            <p>附件：</p>
+            <el-link :href="data.fileUrl[0].url">{{ data.fileUrl[0].name }}</el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'model-0',
+  props: {
+    data: { type: Object },
+  },
+  components: {},
+  data: function () {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .btn {
+    text-align: right;
+    margin: 0 0 10px 0;
+  }
+  .info {
+    .title {
+      font-size: 18px;
+      text-align: center;
+      font-weight: bold;
+      margin: 0 0 15px 0;
+    }
+    .other {
+      margin: 0 0 15px 0;
+      .text {
+        font-size: 14px;
+        color: #666;
+        text-align: right;
+        padding: 0 10px;
+        span {
+          color: #000;
+        }
+      }
+      .text:nth-child(2) {
+        text-align: left;
+      }
+    }
+    .content {
+      font-size: 16px;
+      text-indent: 2rem;
+      margin: 0 0 15px 0;
+    }
+    .image {
+      text-align: center;
+      padding: 0 26%;
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+}
+</style>

src/views/news/index.vue

@@ -6,27 +6,27 @@
           <el-col :span="24" class="common one">
             <el-col :span="12" class="left">
               <top topText="政务动态" @more="more('0')"></top>
-              <list type="1" :list="oneList"></list>
+              <list type="1" :list="oneList" @detail="detail"></list>
             </el-col>
             <el-col :span="12" class="left">
               <top topText="通知通告" @more="more('1')"></top>
-              <list type="2" :list="twoList"></list>
+              <list type="2" :list="twoList" @detail="detail"></list>
             </el-col>
           </el-col>
           <el-col :span="24" class="common two">
             <el-col :span="12" class="left">
               <top topText="科技新闻" @more="more('2')"></top>
-              <list type="3" :list="thrList"></list>
+              <list type="3" :list="thrList" @detail="detail"></list>
             </el-col>
             <el-col :span="12" class="left">
               <top topText="媒体聚焦" @more="more('3')"></top>
-              <list type="4" :list="fourList"></list>
+              <list type="4" :list="fourList" @detail="detail"></list>
             </el-col>
           </el-col>
           <el-col :span="24" class="common thr">
             <el-col :span="24" class="left">
               <top topText="信息公开" @more="more('4')"></top>
-              <list type="5" :list="fiveList"></list>
+              <list type="5" :list="fiveList" @detail="detail"></list>
             </el-col>
           </el-col>
         </div>
@@ -89,6 +89,10 @@ export default {
     more(index) {
       this.$router.push({ path: '/news/list', query: { index: index } });
     },
+    // 详情
+    detail({ id, index }) {
+      this.$router.push({ path: '/news/list', query: { id: id, index: index } });
+    },
   },
   computed: {
     ...mapState(['user']),

src/views/news/list-model/model-0.vue

@@ -2,7 +2,7 @@
   <div id="model-0">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detail(item.id)">
           <el-col :span="24" class="title textOver">
             {{ item.title }}
           </el-col>
@@ -32,9 +32,16 @@ export default {
     return {};
   },
   created() {},
-  methods: {},
+  methods: {
+    detail(id) {
+      this.$router.push({ path: './list', query: { index: this.index, id } });
+    },
+  },
   computed: {
     ...mapState(['user']),
+    index() {
+      return parseInt(this.$route.query.index) || 0;
+    },
   },
   metaInfo() {
     return { title: this.$route.meta.title };

src/views/news/list-model/model-1.vue

@@ -2,7 +2,7 @@
   <div id="model-1">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detail(item.id)">
           <el-col :span="24" class="title textOver">
             {{ item.title }}
           </el-col>
@@ -32,9 +32,16 @@ export default {
     return {};
   },
   created() {},
-  methods: {},
+  methods: {
+    detail(id) {
+      this.$router.push({ path: './list', query: { index: this.index, id } });
+    },
+  },
   computed: {
     ...mapState(['user']),
+    index() {
+      return parseInt(this.$route.query.index) || 0;
+    },
   },
   metaInfo() {
     return { title: this.$route.meta.title };

src/views/news/list-model/model-2.vue

@@ -2,7 +2,7 @@
   <div id="model-2">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detail(item.id)">
           <el-col :span="6" class="image">
             <el-carousel height="110px" arrow="never" indicator-position="none" :interval="2000" v-if="item.image.length > 0">
               <el-carousel-item v-for="(tag, index) in item.image" :key="index">
@@ -44,9 +44,16 @@ export default {
     };
   },
   created() {},
-  methods: {},
+  methods: {
+    detail(id) {
+      this.$router.push({ path: './list', query: { index: this.index, id } });
+    },
+  },
   computed: {
     ...mapState(['user']),
+    index() {
+      return parseInt(this.$route.query.index) || 0;
+    },
   },
   metaInfo() {
     return { title: this.$route.meta.title };

src/views/news/list-model/model-3.vue

@@ -2,7 +2,7 @@
   <div id="model-3">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detail(item.id)">
           <el-col :span="24" class="title textOver">
             {{ item.title }}
           </el-col>
@@ -32,9 +32,16 @@ export default {
     return {};
   },
   created() {},
-  methods: {},
+  methods: {
+    detail(id) {
+      this.$router.push({ path: './list', query: { index: this.index, id } });
+    },
+  },
   computed: {
     ...mapState(['user']),
+    index() {
+      return parseInt(this.$route.query.index) || 0;
+    },
   },
   metaInfo() {
     return { title: this.$route.meta.title };

src/views/news/list-model/model-4.vue

@@ -2,7 +2,7 @@
   <div id="model-4">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detail(item.id)">
           <el-col :span="24" class="title textOver">
             {{ item.title }}
           </el-col>
@@ -32,9 +32,16 @@ export default {
     return {};
   },
   created() {},
-  methods: {},
+  methods: {
+    detail(id) {
+      this.$router.push({ path: './list', query: { index: this.index, id } });
+    },
+  },
   computed: {
     ...mapState(['user']),
+    index() {
+      return parseInt(this.$route.query.index) || 0;
+    },
   },
   metaInfo() {
     return { title: this.$route.meta.title };

src/views/news/list/kjxw.vue

@@ -3,7 +3,11 @@
     <list-page v-bind="$attrs" :total="total" v-if="!id" @toSearch="search" :pageSize="pageSize" searchModel="title">
       <component :is="model" :list="list"></component>
     </list-page>
-    <template v-else> 详情 </template>
+    <template v-else>
+      <dmodel :data="detail" v-if="detail">
+        <el-button size="mini" type="primary" @click="$router.push({ path: './list', query: { index: $route.query.index } })"> 返回</el-button>
+      </dmodel>
+    </template>
   </div>
 </template>
 
@@ -19,6 +23,7 @@ export default {
   components: {
     listPage,
     model2: () => import('../list-model/model-2.vue'),
+    dmodel: () => import('../detail-model/model-2.vue'),
   },
   data: function () {
     return {

src/views/news/list/mtjj.vue

@@ -3,7 +3,11 @@
     <list-page v-bind="$attrs" :total="total" v-if="!id" @toSearch="search" :pageSize="pageSize" searchModel="title">
       <component :is="model" :list="list"></component>
     </list-page>
-    <template v-else> 详情 </template>
+    <template v-else>
+      <dmodel :data="detail" v-if="detail">
+        <el-button size="mini" type="primary" @click="$router.push({ path: './list', query: { index: $route.query.index } })"> 返回</el-button>
+      </dmodel>
+    </template>
   </div>
 </template>
 
@@ -19,6 +23,7 @@ export default {
   components: {
     listPage,
     model3: () => import('../list-model/model-3.vue'),
+    dmodel: () => import('../detail-model/model-3.vue'),
   },
   data: function () {
     return {

src/views/news/list/tgtg.vue

@@ -3,7 +3,11 @@
     <list-page v-bind="$attrs" :total="total" v-if="!id" @toSearch="search" :pageSize="pageSize" searchModel="title">
       <component :is="model" :list="list"></component>
     </list-page>
-    <template v-else> 详情 </template>
+    <template v-else>
+      <dmodel :data="detail" v-if="detail">
+        <el-button size="mini" type="primary" @click="$router.push({ path: './list', query: { index: $route.query.index } })"> 返回</el-button>
+      </dmodel>
+    </template>
   </div>
 </template>
 
@@ -19,6 +23,7 @@ export default {
   components: {
     listPage,
     model1: () => import('../list-model/model-1.vue'),
+    dmodel: () => import('../detail-model/model-1.vue'),
   },
   data: function () {
     return {

src/views/news/list/xxgk.vue

@@ -3,7 +3,11 @@
     <list-page v-bind="$attrs" :total="total" v-if="!id" @toSearch="search" :pageSize="pageSize" searchModel="title">
       <component :is="model" :list="list"></component>
     </list-page>
-    <template v-else> 详情 </template>
+    <template v-else>
+      <dmodel :data="detail" v-if="detail">
+        <el-button size="mini" type="primary" @click="$router.push({ path: './list', query: { index: $route.query.index } })"> 返回</el-button>
+      </dmodel>
+    </template>
   </div>
 </template>
 
@@ -19,6 +23,7 @@ export default {
   components: {
     listPage,
     model4: () => import('../list-model/model-4.vue'),
+    dmodel: () => import('../detail-model/model-4.vue'),
   },
   data: function () {
     return {

src/views/news/list/zwdt.vue

@@ -3,7 +3,11 @@
     <list-page v-bind="$attrs" :total="total" v-if="!id" @toSearch="search" :pageSize="pageSize" searchModel="title">
       <component :is="model" :list="list"></component>
     </list-page>
-    <template v-else> 详情 </template>
+    <template v-else>
+      <dmodel :data="detail" v-if="detail">
+        <el-button size="mini" type="primary" @click="$router.push({ path: './list', query: { index: $route.query.index } })"> 返回</el-button>
+      </dmodel>
+    </template>
   </div>
 </template>
 
@@ -19,6 +23,7 @@ export default {
   components: {
     listPage,
     model0: () => import('../list-model/model-0.vue'),
+    dmodel: () => import('../detail-model/model-0.vue'),
   },
   data: function () {
     return {

src/views/news/parts/list.vue

@@ -3,7 +3,7 @@
     <el-row>
       <el-col :span="24" class="main">
         <el-col :span="24" class="one" v-if="type == '1'">
-          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detailBtn(item.id, '0')">
             <el-col :span="24" class="text">
               <el-col :span="1" class="i">
                 <i class="el-icon-caret-right"></i>
@@ -16,7 +16,7 @@
           </el-col>
         </el-col>
         <el-col :span="24" class="one" v-else-if="type == '2'">
-          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detailBtn(item.id, '1')">
             <el-col :span="24" class="text">
               <el-col :span="1" class="i">
                 <i class="el-icon-caret-left"></i>
@@ -29,7 +29,7 @@
           </el-col>
         </el-col>
         <el-col :span="24" class="thr" v-else-if="type == '3'">
-          <el-col :span="12" class="list" v-for="(item, index) in list" :key="index">
+          <el-col :span="12" class="list" v-for="(item, index) in list" :key="index" @click.native="detailBtn(item.id, '2')">
             <el-col :span="24" class="image">
               <el-carousel height="135px" arrow="never" indicator-position="none" :interval="2000" v-if="item.image.length > 0">
                 <el-carousel-item v-for="(tag, index) in item.image" :key="index">
@@ -47,7 +47,7 @@
           </el-col>
         </el-col>
         <el-col :span="24" class="one" v-else-if="type == '4'">
-          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+          <el-col :span="24" class="list" v-for="(item, index) in list" :key="index" @click.native="detailBtn(item.id, '3')">
             <el-col :span="24" class="text">
               <el-col :span="1" class="i">
                 <i class="el-icon-caret-left"></i>
@@ -60,7 +60,7 @@
           </el-col>
         </el-col>
         <el-col :span="24" class="five" v-else-if="type == '5'">
-          <el-col :span="12" class="fiveList" v-for="(item, index) in list" :key="index">
+          <el-col :span="12" class="fiveList" v-for="(item, index) in list" :key="index" @click.native="detailBtn(item.id, '4')">
             <el-col :span="24" class="text">
               <el-col :span="1" class="i">
                 <i class="el-icon-caret-right"></i>
@@ -96,7 +96,11 @@ export default {
     };
   },
   created() {},
-  methods: {},
+  methods: {
+    detailBtn(id, index) {
+      this.$emit('detail', { id: id, index: index });
+    },
+  },
   computed: {
     ...mapState(['user']),
   },