更新

src/components/HelloWorld.vue

@@ -1,130 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br />
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener"
-        >vue-cli documentation</a
-      >.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
-          target="_blank"
-          rel="noopener"
-          >babel</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
-          target="_blank"
-          rel="noopener"
-          >router</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
-          target="_blank"
-          rel="noopener"
-          >vuex</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
-          target="_blank"
-          rel="noopener"
-          >eslint</a
-        >
-      </li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li>
-        <a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
-      </li>
-      <li>
-        <a href="https://forum.vuejs.org" target="_blank" rel="noopener"
-          >Forum</a
-        >
-      </li>
-      <li>
-        <a href="https://chat.vuejs.org" target="_blank" rel="noopener"
-          >Community Chat</a
-        >
-      </li>
-      <li>
-        <a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
-          >Twitter</a
-        >
-      </li>
-      <li>
-        <a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
-      </li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li>
-        <a href="https://router.vuejs.org" target="_blank" rel="noopener"
-          >vue-router</a
-        >
-      </li>
-      <li>
-        <a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-devtools#vue-devtools"
-          target="_blank"
-          rel="noopener"
-          >vue-devtools</a
-        >
-      </li>
-      <li>
-        <a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
-          >vue-loader</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/awesome-vue"
-          target="_blank"
-          rel="noopener"
-          >awesome-vue</a
-        >
-      </li>
-    </ul>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "HelloWorld",
-  props: {
-    msg: String,
-  },
-};
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="less">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

src/components/common/info-1.vue

@@ -0,0 +1,87 @@
+<template>
+  <div id="info-1">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="one">
+          {{ info.title }}
+        </el-col>
+        <el-col :span="24" class="two">
+          <span>
+            信息来源：<span>{{ info.origin }}</span>
+          </span>
+          <span>
+            发布时间：<span>{{ info.create_time }}</span>
+          </span>
+        </el-col>
+        <el-col :span="24" class="thr">
+          <p v-html="info.content"></p>
+        </el-col>
+        <el-col :span="24" class="four" v-if="info.file_url && info.file_url.length > 0">
+          <el-col :span="24" class="four_1">附件</el-col>
+          <el-col :span="24" class="four_2">
+            <el-link :underline="false" :href="item.uri" target="_blank" v-for="(item, index) in info.file_url" :key="index">{{ item.name }}</el-link>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'info-1',
+  props: {
+    info: { 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 {
+  .one {
+    text-align: center;
+    font-size: 20px;
+    margin: 15px 0;
+  }
+  .two {
+    text-align: center;
+    margin: 0 0 15px 0;
+    span {
+      font-size: 14px;
+      color: #858585;
+      span {
+        color: #000000;
+      }
+    }
+  }
+  .thr {
+    margin: 0 0 15px 0;
+  }
+  .four {
+    .four_1 {
+      font-weight: bold;
+      margin: 0 0 5px 0;
+    }
+  }
+}
+</style>

src/router/index.js

@@ -38,6 +38,11 @@ const routes = [
         meta: { title: '联系我们', is_filter: true, place: '4' },
         component: () => import('@/views/contact/index.vue'),
       },
+      {
+        path: '/detail/index',
+        meta: { title: '详细信息', is_filter: true, place: '4' },
+        component: () => import('@/views/detail/index.vue'),
+      },
     ],
   },
   ...common,

src/views/brand/index.vue

@@ -5,13 +5,13 @@
         <el-col :span="24" class="zero one">
           <el-col :span="16" class="one_1">
             <el-carousel height="500px">
-              <el-carousel-item v-for="(item, index) in bannerList" :key="index">
+              <el-carousel-item v-for="(item, index) in bannerList" :key="index" @click.native="toView(item, 'banner')">
                 <el-image class="image" :src="item.img_url && item.img_url.length > 0 ? item.img_url[0].url : ''"></el-image>
               </el-carousel-item>
             </el-carousel>
           </el-col>
           <el-col :span="8" class="one_2">
-            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index">
+            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index" @click.native="toView(item, 'news')">
               <el-col :span="24" class="title textOver">{{ item.title }}</el-col>
               <el-col :span="24" class="date">{{ item.create_time }}</el-col>
               <el-col :span="24" class="brief">{{ item.brief }}</el-col>
@@ -97,6 +97,10 @@ export default {
     typeEnter(e, index) {
       this.$set(this, `type_active`, index);
     },
+    // 详细信息
+    toView(e, type) {
+      this.$router.push({ path: '/detail/index', query: { id: e._id, type: type } });
+    },
   },
   computed: {
     ...mapState(['user']),

src/views/contact/index.vue

@@ -5,13 +5,13 @@
         <el-col :span="24" class="zero one">
           <el-col :span="16" class="one_1">
             <el-carousel height="500px">
-              <el-carousel-item v-for="(item, index) in bannerList" :key="index">
+              <el-carousel-item v-for="(item, index) in bannerList" :key="index" @click.native="toView(item, 'banner')">
                 <el-image class="image" :src="item.img_url && item.img_url.length > 0 ? item.img_url[0].url : ''"></el-image>
               </el-carousel-item>
             </el-carousel>
           </el-col>
           <el-col :span="8" class="one_2">
-            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index">
+            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index" @click.native="toView(item, 'news')">
               <el-col :span="24" class="title textOver">{{ item.title }}</el-col>
               <el-col :span="24" class="date">{{ item.create_time }}</el-col>
               <el-col :span="24" class="brief">{{ item.brief }}</el-col>
@@ -96,6 +96,10 @@ export default {
       let res = await this.create(data);
       if (this.$checkRes(res, '留言成功', res.errmsg)) this.form = {};
     },
+    // 详细信息
+    toView(e, type) {
+      this.$router.push({ path: '/detail/index', query: { id: e._id, type: type } });
+    },
   },
   computed: {
     ...mapState(['user']),

src/views/detail/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__zoomInDown">
+        <el-col :span="24" class="one">
+          <span>{{ $route.meta.title }}</span>
+        </el-col>
+        <el-col :span="24" class="two">
+          <info-1 :info="info"></info-1>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: banner } = createNamespacedHelpers('banner');
+const { mapActions: news } = createNamespacedHelpers('news');
+const { mapActions: cases } = createNamespacedHelpers('cases');
+
+export default {
+  name: 'index',
+  props: {},
+  components: {
+    info1: () => import('@c/common/info-1.vue'),
+  },
+  data: function () {
+    return {
+      info: {},
+    };
+  },
+  created() {
+    this.search();
+  },
+  methods: {
+    ...banner({ bFetch: 'fetch' }),
+    ...news({ nFetch: 'fetch' }),
+    ...cases({ cFetch: 'fetch' }),
+    async search() {
+      let res;
+      if (this.type == 'banner') res = await this.bFetch(this.id);
+      else if (this.type == 'news') res = await this.nFetch(this.id);
+      else if (this.type == 'cases') res = await this.cFetch(this.id);
+      if (this.$checkRes(res)) {
+        this.$set(this, `info`, res.data);
+      }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    id() {
+      return this.$route.query.id;
+    },
+    type() {
+      return this.$route.query.type;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .one {
+    border-bottom: 1px solid #f1f1f1;
+    margin: 0 0 20px 0;
+    span {
+      display: inline-block;
+      padding: 8px 10px;
+      border-bottom: 1px solid #ffc001;
+      color: #ffc001;
+      font-size: 20px;
+      font-family: monospace;
+      font-weight: bold;
+    }
+  }
+}
+</style>

src/views/homeIndex.vue

@@ -5,13 +5,13 @@
         <el-col :span="24" class="zero one">
           <el-col :span="16" class="one_1">
             <el-carousel height="500px">
-              <el-carousel-item v-for="(item, index) in bannerList" :key="index">
+              <el-carousel-item v-for="(item, index) in bannerList" :key="index" @click.native="toView(item, 'banner')">
                 <el-image class="image" :src="item.img_url && item.img_url.length > 0 ? item.img_url[0].url : ''"></el-image>
               </el-carousel-item>
             </el-carousel>
           </el-col>
           <el-col :span="8" class="one_2">
-            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index">
+            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index" @click.native="toView(item, 'news')">
               <el-col :span="24" class="title textOver">{{ item.title }}</el-col>
               <el-col :span="24" class="date">{{ item.create_time }}</el-col>
               <el-col :span="24" class="brief">{{ item.brief }}</el-col>
@@ -42,7 +42,7 @@
               >
             </el-col>
             <el-col :span="24" class="four_1_2">
-              <el-col :span="24" class="four1List" v-for="(item, index) in four1List" :key="index">
+              <el-col :span="24" class="four1List" v-for="(item, index) in four1List" :key="index" @click.native="toView(item, 'news')">
                 <el-col :span="4" class="date">
                   <el-col :span="24" class="date_1">{{ getDate(item.create_time, 'day') }}</el-col>
                   <el-col :span="24" class="date_2">{{ getDate(item.create_time, 'year') }}</el-col>
@@ -153,6 +153,10 @@ export default {
         else '暂无';
       }
     },
+    // 详细信息
+    toView(e, type) {
+      this.$router.push({ path: '/detail/index', query: { id: e._id, type: type } });
+    },
     // 查询其他信息
     async searchOther() {
       let res;

src/views/news/index.vue

@@ -5,13 +5,13 @@
         <el-col :span="24" class="zero one">
           <el-col :span="16" class="one_1">
             <el-carousel height="500px">
-              <el-carousel-item v-for="(item, index) in bannerList" :key="index">
+              <el-carousel-item v-for="(item, index) in bannerList" :key="index" @click.native="toView(item, 'banner')">
                 <el-image class="image" :src="item.img_url && item.img_url.length > 0 ? item.img_url[0].url : ''"></el-image>
               </el-carousel-item>
             </el-carousel>
           </el-col>
           <el-col :span="8" class="one_2">
-            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index">
+            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index" @click.native="toView(item, 'news')">
               <el-col :span="24" class="title textOver">{{ item.title }}</el-col>
               <el-col :span="24" class="date">{{ item.create_time }}</el-col>
               <el-col :span="24" class="brief">{{ item.brief }}</el-col>
@@ -25,14 +25,14 @@
             <span></span>
           </el-col>
           <el-col :span="24" class="two_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="toView(item, 'news')">
               <el-col :span="2" class="date">
                 <p>
                   <span>{{ getDate(item.create_time, 'day') }}</span>
                   <span>{{ getDate(item.create_time, 'year') }}</span>
                 </p>
               </el-col>
-              <el-col :span="2" class="info">
+              <el-col :span="22" class="info">
                 <el-col :span="24" class="title">{{ item.title }}</el-col>
                 <el-col :span="24" class="brief">{{ item.brief || '暂无' }}</el-col>
               </el-col>
@@ -106,6 +106,10 @@ export default {
         this.$set(this, `newsList`, res.data);
       }
     },
+    // 详细信息
+    toView(e, type) {
+      this.$router.push({ path: '/detail/index', query: { id: e._id, type: type } });
+    },
   },
   computed: {
     ...mapState(['user']),

src/views/solve/index.vue

@@ -5,13 +5,13 @@
         <el-col :span="24" class="zero one">
           <el-col :span="16" class="one_1">
             <el-carousel height="500px">
-              <el-carousel-item v-for="(item, index) in bannerList" :key="index">
+              <el-carousel-item v-for="(item, index) in bannerList" :key="index" @click.native="toView(item, 'banner')">
                 <el-image class="image" :src="item.img_url && item.img_url.length > 0 ? item.img_url[0].url : ''"></el-image>
               </el-carousel-item>
             </el-carousel>
           </el-col>
           <el-col :span="8" class="one_2">
-            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index">
+            <el-col :span="24" class="newsList" v-for="(item, index) in newsList" :key="index" @click.native="toView(item, 'news')">
               <el-col :span="24" class="title textOver">{{ item.title }}</el-col>
               <el-col :span="24" class="date">{{ item.create_time }}</el-col>
               <el-col :span="24" class="brief">{{ item.brief }}</el-col>
@@ -45,7 +45,7 @@
             <span></span>
           </el-col>
           <el-col :span="24" class="thr_2">
-            <el-col :span="8" class="thrList" v-for="(item, index) in thrList" :key="index">
+            <el-col :span="8" class="thrList" v-for="(item, index) in thrList" :key="index" @click.native="toView(item, 'cases')">
               <el-image class="image" :src="item.img_url && item.img_url.length > 0 ? item.img_url[0].url : ''"></el-image>
               <el-col :span="24" class="title textOver">{{ item.title }}</el-col>
             </el-col>
@@ -105,6 +105,10 @@ export default {
         this.$set(this, `thrList`, res.data);
       }
     },
+    // 详细信息
+    toView(e, type) {
+      this.$router.push({ path: '/detail/index', query: { id: e._id, type: type } });
+    },
   },
   computed: {
     ...mapState(['user']),