更新

src/router/index.js

@@ -271,6 +271,14 @@ const live = [
     name: 'dock_Detail',
     component: () => import('../views/hall/dock/dockDetail.vue'),
   },
+
+  {
+    path: '/live/hall/dock/zongjie',
+    meta: { title: '展会总结', subSite: true },
+    name: 'dock_Detail',
+    component: () => import('../views/hall/dock/zongjie.vue'),
+  },
+
   {
     path: '/live/hall/dock/zhuanjiaDetail',
     meta: { title: '专家信息详情', subSite: true },

src/views/hall/dock/zongjie.vue

@@ -0,0 +1,188 @@
+<template>
+  <div id="dockDetail">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-image :src="beijingPic"></el-image>
+        <el-col :span="24" class="info">
+          <div class="w_1200">
+            <el-col :span="24" class="top">
+              <p>{{ zjinfo.top }}展会总结</p>
+              <p>主办方：吉林省计算中心</p>
+            </el-col>
+            <el-col :span="24" class="main">
+              <el-col :span="24" class="context">
+                <p>展会由{{ zjinfo.name }}主办，{{ zjinfo.juban }}承办，{{ zjinfo.xieban }}协办，{{ zjinfo.fr }}提供技术支持，展会已经圆满结束。</p>
+                <p>
+                  本次展会到会人数:{{ zjinfo.person }}人，其中特邀嘉宾{{ zjinfo.jiabin }}人。同时还邀请了{{ zjinfo.school }}所高校、研究机构的{{
+                    zjinfo.zhuanjia
+                  }}位专家到参与在线对接。
+                </p>
+                <p>
+                  参加本次展会的项目共{{ zjinfo.xiang }}项。其中，有自于高校院所的项目成果共{{ zjinfo.shcoolxiang }}项；专利共{{
+                    zjinfo.zhuanli
+                  }}项成熟度处于中试及产业化阶段的项目成果共{{ zjinfo.chengguo }}项。
+                </p>
+                <p>本次展会共征集到技术需求{{ zjinfo.xuqiu }}项，其中{{ zjinfo.jishu }}项技术需求来自展会主办地区。</p>
+                <p>
+                  本次在线展会共实现技术对接{{ zjinfo.duijie }}次，达成意向{{ zjinfo.yixiang }}次，实现合作{{ zjinfo.hezuo }}次。此次展会还吸引了
+                  {{ zjinfo.fangke }}访客在线观摩，产生了强烈的反响。共收到鲜花{{ zjinfo.hua }}束，掌声{{ zjinfo.sheng }}次。
+                </p>
+              </el-col>
+
+              <el-col :span="24">
+                <el-col :span="24" class="tables"
+                  ><span>到会人数</span>{{ zjinfo.renshu }}人<span>参展项目</span><span>{{ zjinfo.xiangmu }}项</span><span>技术需求</span
+                  ><span>{{ zjinfo.xuqiu }}项</span></el-col
+                >
+
+                <el-col :span="24" class="tables"
+                  ><span>洽谈对接</span>{{ zjinfo.renshu }}次<span>产生意向</span><span>{{ zjinfo.xiangmu }}次</span><span>达成意向</span
+                  ><span>{{ zjinfo.xuqiu }}次</span></el-col
+                >
+              </el-col>
+            </el-col>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import _ from 'lodash';
+import { mapState, createNamespacedHelpers } from 'vuex';
+import chat from './parts/chat.vue';
+const { mapActions: mapProduct } = createNamespacedHelpers('marketproduct');
+const { mapActions: personalRoom } = createNamespacedHelpers('personalroom');
+const { mapActions: transaction } = createNamespacedHelpers('transaction');
+export default {
+  name: 'dockDetail',
+  props: {},
+  components: {},
+  data: () => ({
+    beijingPic: require('@a/live/top_3.png'),
+    zjinfo: {
+      top: '计算中心',
+      name: '吉林省计算中心',
+      juban: '中科院长春分院',
+      xieban: '中科院计算机网络信息中心和吉林省计算中心',
+      fr: '长春福瑞科技有限公司',
+      person: '300',
+      jiabin: '20',
+      school: '5',
+      zhuanjia: '12',
+      xiang: '12',
+      shcoolxiang: '10',
+      zhuanli: '20',
+      chengguo: '46',
+      xuqiu: '12',
+      jishu: '23',
+      duijie: '33',
+      yixiang: '33',
+      hezuo: '23',
+      fangke: '1',
+      hua: '1',
+      sheng: '23',
+      renshu: '234',
+      xiangmu: '233',
+      xuqiu: '123',
+    },
+    room: {},
+  }),
+  created() {
+    if (this.$route.query.id) {
+      this.searchInfo();
+    }
+  },
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  // beforeDestroy() {
+  //   this.killTalk();
+  // },
+  beforeRouteLeave(to, from, next) {
+    // this.killTalk();
+    next();
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+p {
+  padding: 0;
+  margin: 0;
+}
+.textOver {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+// .textOver{}
+// 	overflow: hidden;
+// 	text-overflow: ellipsis;
+// 	-webkit-line-clamp: 3;
+// 	word-break: break-all;
+// 	display: -webkit-box;
+//   -webkit-box-orient: vertical;
+//   }
+.style {
+  height: 100vh;
+}
+.style .info {
+  position: relative;
+  top: -450px;
+}
+.style .top {
+  position: relative;
+  top: 0;
+  width: 100%;
+  text-align: center;
+  z-index: 999;
+  height: 172px;
+  margin: 0 0 20px 0;
+}
+.style .top p:first-child {
+  font-size: 50px;
+  color: #fff;
+}
+.style .top p:last-child {
+  font-size: 30px;
+  color: #fff;
+  position: absolute;
+  width: 100%;
+  top: 135px;
+}
+.style .main {
+  min-height: 600px;
+  border: 1px solid red;
+  background: #fff;
+  padding: 30px 20px;
+}
+.main .context p {
+  font-size: 16px;
+  padding: 20px 0 20px 0;
+}
+
+.main.tables {
+  font-size: 16px;
+}
+
+.main.tables span::nth-child(n) {
+  background-color: red;
+}
+
+.main.tables span::nth-child(2n) {
+  background-color: blue;
+}
+</style>