1

src/views/technical/detail/expdetail.vue

@@ -0,0 +1,99 @@
+<template>
+  <div id="expdetail">
+    <el-row>
+      <el-col :span="24" class="main">
+        <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">
+          <p v-html="detailinfo.content"></p>
+        </div>
+        <div class="development">
+          <p>功能开发中</p>
+          <p>功能实现流程：<span>问诊记录展示</span>-<span>在线咨询</span>-<span>专家在线问诊</span></p>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'expdetail',
+  props: {
+    detailinfo: { type: Object },
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .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 0;
+    min-height: 370px;
+  }
+  .development {
+    height: 50px;
+    border: 1px dashed red;
+    padding: 0 30px;
+    p:first-child {
+      text-align: center;
+      font-size: 18px;
+      color: red;
+      font-weight: bold;
+    }
+    p:last-child {
+      text-align: center;
+      height: 25px;
+      line-height: 25px;
+      font-size: 16px;
+      font-weight: bold;
+    }
+  }
+}
+</style>

src/views/technical/detail/guidetail.vue

@@ -0,0 +1,27 @@
+<template>
+  <div id="expdetail">
+    <p>expdetail</p>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'expdetail',
+  props: {},
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/technical/detail/inddetail.vue

@@ -0,0 +1,27 @@
+<template>
+  <div id="expdetail">
+    <p>expdetail</p>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'expdetail',
+  props: {},
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/technical/detail/roadetail.vue

@@ -0,0 +1,27 @@
+<template>
+  <div id="expdetail">
+    <p>expdetail</p>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'expdetail',
+  props: {},
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/technical/list.vue

@@ -31,7 +31,7 @@
                   <el-button type="primary" size="mini" @click="display = 'list'">返回</el-button>
                 </el-col>
                 <el-col :span="24">
-                  专家问诊
+                  <expdetail :detailinfo="expdetail"></expdetail>
                 </el-col>
               </span>
               <span v-else-if="column_name == '行业研究'">
@@ -39,7 +39,7 @@
                   <el-button type="primary" size="mini" @click="display = 'list'">返回</el-button>
                 </el-col>
                 <el-col :span="24">
-                  行业研究
+                  <inddetail></inddetail>
                 </el-col>
               </span>
               <span v-else-if="column_name == '嘉宾访谈'">
@@ -47,7 +47,7 @@
                   <el-button type="primary" size="mini" @click="display = 'list'">返回</el-button>
                 </el-col>
                 <el-col :span="24">
-                  嘉宾访谈
+                  <guidetail></guidetail>
                 </el-col>
               </span>
               <span v-else-if="column_name == '项目路演'">
@@ -55,7 +55,7 @@
                   <el-button type="primary" size="mini" @click="display = 'list'">返回</el-button>
                 </el-col>
                 <el-col :span="24">
-                  项目路演
+                  <roadetail></roadetail>
                 </el-col>
               </span>
             </span>
@@ -68,10 +68,17 @@
 
 <script>
 import _ from 'lodash';
+// 列表
 import exports from './list/export.vue';
 import industry from './list/industry.vue';
 import guidance from './list/guidance.vue';
 import roadshow from './list/roadshow.vue';
+// 详情
+import expdetail from './detail/expdetail.vue';
+import inddetail from './detail/inddetail.vue';
+import guidetail from './detail/guidetail.vue';
+import roadetail from './detail/roadetail.vue';
+
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: column } = createNamespacedHelpers('column');
 const { mapActions: news } = createNamespacedHelpers('news');
@@ -85,6 +92,10 @@ export default {
     industry,
     guidance,
     roadshow,
+    expdetail,
+    inddetail,
+    guidetail,
+    roadetail,
   },
   data: function() {
     return {
@@ -112,6 +123,8 @@ export default {
       // 项目路演
       roadshowList: [],
       roadshowTotal: 0,
+      // 专家详情
+      expdetail: {},
     };
   },
   async created() {
@@ -120,7 +133,7 @@ export default {
   },
   methods: {
     ...column({ columnList: 'query', columnInfo: 'fetch' }),
-    ...news({ newsList: 'query' }),
+    ...news({ newsList: 'query', newsFetch: 'fetch' }),
     ...newsguidance({ danceQuery: 'query' }),
     ...newsroadshow({ adshowQuery: 'query' }),
     // 查询栏目，列表，详情
@@ -181,7 +194,14 @@ export default {
       }
     },
     // 查看详情
-    async searchDetail(columnName, id) {},
+    async searchDetail(columnName, id) {
+      if (columnName == '专家问诊') {
+        let res = await this.newsFetch(id);
+        if (this.$checkRes(res)) {
+          this.$set(this, `expdetail`, res.data);
+        }
+      }
+    },
     // 点击查看详情
     clickDetail({ column_name, id }) {
       this.$set(this, `column_name`, column_name);