Pārlūkot izejas kodu

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

wuhongyu 5 gadi atpakaļ
vecāks
revīzija
7fd6613f39
3 mainītis faili ar 157 papildinājumiem un 10 dzēšanām
  1. 6 0
      src/router/index.js
  2. 111 0
      src/views/detail/detail.vue
  3. 40 10
      src/views/technical/index.vue

+ 6 - 0
src/router/index.js

@@ -8,6 +8,12 @@ const live = [
     name: 'live',
     component: () => import('../views/index.vue'),
     children: [
+      {
+        path: '/live/detail',
+        meta: { title: '信息详情', subSite: true },
+        name: 'live_detail',
+        component: () => import('../views/detail/detail.vue'),
+      },
       {
         path: '/market/index',
         name: 'market_index',

+ 111 - 0
src/views/detail/detail.vue

@@ -0,0 +1,111 @@
+<template>
+  <div id="detail" style="background-color: #F5F5F54f;">
+    <div class="w_0100">
+      <div class="w_1200">
+        <div class="detailmain">
+          <div class="detailtop">
+            <span>{{ detailinfo.title }}</span>
+          </div>
+          <div class="detailtopleft">
+            <span>时间:{{ detailinfo.publish_time }}&nbsp;&nbsp;&nbsp;&nbsp;来源:{{ detailinfo.orgin }}</span>
+          </div>
+
+          <div class="detailimage" v-if="detailinfo.picture">
+            <img :src="detailinfo.picture" class="detailimg" />
+          </div>
+          <div class="detailcontext">
+            {{ detailinfo.content }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: news } = createNamespacedHelpers('news');
+export default {
+  name: 'detail',
+  props: {},
+  components: {},
+  data: () => {
+    return {
+      img: {
+        top_bg: require('@/assets/live/top_bg.png'),
+        logo: require('@/assets/live/logo.png'),
+        img1: require('@/assets/live/1.jpg'),
+      },
+
+      detailinfo: {},
+    };
+  },
+  created() {
+    this.search();
+  },
+  methods: {
+    ...news(['fetch']),
+    async search() {
+      console.log(this.id);
+
+      const res = await this.fetch(this.id);
+      this.$set(this, `detailinfo`, res.data);
+    },
+  },
+  computed: {
+    id() {
+      return this.$route.query.id;
+    },
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import '~@/style/style.css';
+.detailmain {
+  margin: 15px 0 15px 0;
+  box-shadow: 0 0 10px #2d64b3;
+  border-radius: 10px;
+  min-height: 800px;
+}
+
+.detailtop {
+  padding: 20px 0px;
+  font-size: 18px;
+  line-height: 40px;
+  font-weight: normal;
+  text-align: left;
+  margin: 0;
+  text-align: center;
+  color: #005293;
+}
+
+.detailtopleft {
+  text-align: center;
+  padding: 0 0 10px 0;
+  border-bottom: 1px solid #ccc;
+  font-size: 16px;
+  color: #666666;
+}
+
+.detailimage {
+  text-align: center;
+  padding: 20px 0 0 0;
+}
+
+.detailimg {
+  width: 500px;
+  height: 300px;
+}
+
+.detailcontext {
+  padding: 20px 40px 60px 40px;
+}
+</style>

+ 40 - 10
src/views/technical/index.vue

@@ -10,7 +10,7 @@
           <el-col class="infoLeftList" :span="24" v-for="(item, index) in zhuantiList" :key="index">
             <p>{{ item.publish_time }}</p>
             <p>
-              <span class="textOver">{{ item.title }}</span>
+              <span @click="clickzhuanti(item.id)" class="textOver">{{ item.title }}</span>
               <span>{{ item.content }}</span>
             </p>
           </el-col>
@@ -22,7 +22,7 @@
         <el-col :span="23" class="infoRight">
           <el-col class="infoRightList" :span="24" v-for="(item, index) in jishuList" :key="index">
             <p>
-              <span class="textOver">{{ item.title }}</span
+              <span class="textOver" @click="clickjishu(item.id)">{{ item.title }}</span
               ><span class="textOver">{{ item.publish_time }}</span>
             </p>
           </el-col>
@@ -43,7 +43,7 @@
         <el-col :span="23" class="infoRight">
           <el-col class="infoRightList" :span="24" v-for="(item, index) in hangyeList" :key="index">
             <p>
-              <span class="textOver">{{ item.title }}</span
+              <span class="textOver" @click="clickhangye(item.id)">{{ item.title }}</span
               ><span class="textOver">{{ item.publish_time }}</span>
             </p>
           </el-col>
@@ -56,7 +56,7 @@
           <el-col class="infoLeftList" :span="24" v-for="(item, index) in jiaoyuList" :key="index">
             <p>{{ item.publish_time }}</p>
             <p>
-              <span class="textOver">{{ item.title }}</span>
+              <span class="textOver" @click="clickjiaoyu(item.id)">{{ item.title }}</span>
               <span>{{ item.content }}</span>
             </p>
           </el-col>
@@ -85,12 +85,42 @@ export default {
     hangyeList: [],
     jiaoyuList: [],
   }),
-  created() {},
+  created() {
+    this.searchInfo();
+  },
   computed: {},
   methods: {
+    ...news(['query']),
+    async searchInfo() {
+      let res = await this.query({ skip: 0, limit: 5, column_name: '专题研讨' });
+      if (this.$checkRes(res)) this.$set(this, `zhuantiList`, res.data);
+      res = await this.query({ skip: 0, limit: 10, column_name: '技术问答' });
+      if (this.$checkRes(res)) this.$set(this, `jishuList`, res.data);
+      res = await this.query({ skip: 0, limit: 10, column_name: '行业研究' });
+      if (this.$checkRes(res)) this.$set(this, `hangyeList`, res.data);
+      res = await this.query({ skip: 0, limit: 5, column_name: '教育培训' });
+      if (this.$checkRes(res)) this.$set(this, `jiaoyuList`, res.data);
+    },
     turnToList(column_name) {
       this.$router.push({ path: '/technical/list', query: { column_name: column_name } });
     },
+    clickzhuanti(id) {
+      this.$router.push({ path: '/live/detail', query: { id: id } });
+      console.log(id);
+    },
+    clickjishu(id) {
+      this.$router.push({ path: '/live/detail', query: { id: id } });
+      console.log(id);
+    },
+    clickhangye(id) {
+      this.$router.push({ path: '/live/detail', query: { id: id } });
+      console.log(id);
+    },
+
+    clickjiaoyu(id) {
+      this.$router.push({ path: '/live/detail', query: { id: id } });
+      console.log(id);
+    },
   },
 };
 </script>
@@ -138,17 +168,17 @@ export default {
   width: 95%;
   border-bottom: 1px dashed #ccc;
   padding: 8px 0 8px 0;
-  height: 82px;
+  height: 80px;
   margin: 0 0 0 5px;
 }
 
-.infoLeftList:last-child {
+.infoLeftList:nth-child(6) {
   float: left;
   width: 95%;
   border-bottom: none;
-  padding: 15px 0 15px 0;
-  height: 80px;
-  margin: 0 0 0 5px;
+  padding: 8px 0 8px 0;
+  height: 81px;
+  margin: 0 0 15px 5px;
 }
 .infoLeftList:hover p:last-child span:first-child {
   -webkit-transform: translateY(-3px);