1

src/components/parts/chat.vue

@@ -2,20 +2,21 @@
   <div id="chat">
     <el-row class="chat">
       <div class="chatList">
-        <ul id="chatSell">
+        <ul>
           <li v-for="(i, index) in list" :key="index">
             <p>
-              <span>[{{ i.send_time | getTime }}]</span><span style="font-weight: bold;">{{ i.sender_name }}：</span>
-              <span> {{ i.content }}</span>
+              <span>[{{ i.send_time | getTime }}]</span><span style="font-weight: bold;" :class="i.role == '8' ? 'nameColor' : ''">{{ i.sender_name }}：</span>
+              <span v-if="!isEmotion(i.content)"> {{ i.content }}</span>
+              <span v-else v-html="i.content"> </span>
             </p>
           </li>
         </ul>
-        <el-row type="flex" :gutter="10" style="padding-top:10px;">
+        <el-row type="flex" :gutter="10" style="height:40px;line-height:40px;width:100%;background: transparent;">
           <el-col :span="19">
             <el-input v-model="text" size="mini"></el-input>
           </el-col>
           <el-col :span="5">
-            <el-button @click="send" size="mini" round style="background: #2c69fe;color: #fff;">发送</el-button>
+            <el-button @click="send" size="mini" round type="primary">发送</el-button>
           </el-col>
         </el-row>
       </div>
@@ -36,11 +37,13 @@ export default {
     return {
       list: [],
       text: '',
+      dock_id: '',
     };
   },
   created() {
     //回车事件
     // this.enterListen();
+    this.$set(this, 'dock_id', this.$route.query.id);
     this.search();
   },
   mounted() {
@@ -49,42 +52,43 @@ export default {
   methods: {
     ...chat(['query', 'create']),
     async search() {
-      const res = await this.query({ skip: 0, limit: 10 });
+      const res = await this.query({ skip: 0, limit: 10, dock_id: this.dock_id });
       if (this.$checkRes(res)) this.$set(this, `list`, _.reverse(res.data));
     },
     async send() {
-      if (!this.user.uid) {
-        this.$message.error('游客不能发言,请先注册');
+      if (!this.user) {
+        this.$notify({
+          message: '游客不能发言',
+          type: 'danger',
+        });
         return;
+      } else {
+        if (this.text != '') {
+          let object = { sender_name: this.user.name ? this.user.name : this.user.adminuser, content: this.text, dock_id: this.dock_id };
+          if (this.user.uid) {
+            object.sender_id = this.user.uid;
+            object.role = this.user.role;
+          }
+          let res = await this.create(object);
+          this.$checkRes(res, null, res.errmsg || '发言失败');
+        } else this.$message.error('请输入信息后发送');
       }
-      if (this.text != '') {
-        let object = { sender_name: this.user.name, content: this.text };
-        if (this.user.uid) object.sender_id = this.user.uid;
-        //TODO接口
-        let res = await this.create(object);
-        this.$checkRes(res, null, res.errmsg || '发言失败');
-      } else this.$message.error('请输入信息后发送');
+    },
+    isEmotion(word) {
+      return word.startsWith('<img');
     },
     channel() {
-      console.log('in function:');
       this.$stomp({
-        [`/exchange/public_chat`]: this.onMessage,
+        [`/exchange/public_chat/${this.dock_id}`]: this.onMessage,
       });
     },
     onMessage(message) {
-      // console.log('receive a message: ', message.body);
       let body = _.get(message, 'body');
       if (body) {
         body = JSON.parse(body);
         this.list.push(body);
         this.text = '';
-        this.$nextTick(() => {
-          document.getElementById('chatSell').scrollTop = document.getElementById('chatSell').scrollHeight + 275;
-        });
       }
-      // const { content, contenttype, sendid, sendname, icon, groupid, sendtime, type } = message.headers;
-      // let object = { content, contenttype, sendid, sendname, icon, groupid, sendtime, type };
-      // this.list.push(object);
     },
     enterListen() {
       var lett = this;
@@ -123,56 +127,26 @@ export default {
 .chat {
   float: left;
   width: 100%;
-  height: 340px;
+  height: 325px;
   border-radius: 5px;
-  box-shadow: 0 0 5px #2c69fe;
+  box-shadow: 0 0 5px #0085d2;
   padding: 0 10px 0px 10px;
   margin: 4px 0px 0 3px;
 }
 
-.chat .luyanTop {
-  height: 30px;
-  line-height: 30px;
-}
-
-.chat .luyanTop span:first-child {
-  display: inline-block;
-  padding: 0 10px;
-  height: 30px;
-  color: #fff;
-  background-color: #ff8500;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-}
-
-.chat .luyanTop .icon {
-  float: right;
-  background: #f2f4f5;
-  border-radius: 20px;
-  color: #666;
-  padding: 0 5px;
-  margin: 0 0 0 5px;
-}
-
-.chat .luyanTop .icon {
-  cursor: pointer;
-}
-
 .chat .chatList {
   background: #fff;
   float: left;
   width: 100%;
-  height: 340px;
   overflow: hidden;
 }
 
 .chat .chatList ul {
   float: left;
   width: 100%;
-  height: 275px;
-  padding: 5px 0 0 0;
+  height: 270px;
+  padding: 10px 0 0 0;
   overflow: auto;
-  margin: 10px 0 0 0;
 }
 
 .chat .chatList ul li {
@@ -222,5 +196,11 @@ export default {
   max-width: 109px;
   margin: 20px 0 0 0;
   border-radius: 5px;
+  /deep/.el-button {
+    margin: 0 10px;
+  }
+}
+.nameColor {
+  color: red;
 }
 </style>

src/router/before.js

@@ -0,0 +1,17 @@
+import store from '@/store/index';
+
+const checkLogin = (router, func) => {
+  router.beforeEach(async (to, form, next) => {
+    if (to.name == 'user_index') {
+      const user = localStorage.getItem('user');
+      if (!user) {
+        next('/login');
+      } else {
+        console.log('asd');
+      }
+      let res = await store.dispatch('login/toGetUser', func ? func : null);
+    }
+    next();
+  });
+};
+export default checkLogin;

src/router/index.js

@@ -1,6 +1,7 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
 import store from '@/store/index';
+import checkLogin from './before';
 
 Vue.use(VueRouter);
 
@@ -60,7 +61,7 @@ const routes = [
   // 登录
   {
     path: '/login',
-    name: 'login',
+    name: '',
     meta: { title: '登录', isleftarrow: true },
     component: () => import('../views/login.vue'),
   },
@@ -366,19 +367,7 @@ const router = new VueRouter({
   base: process.env.NODE_ENV === 'development' ? '' : process.env.VUE_APP_ROUTER,
   routes,
 });
-router.beforeEach((to, form, next) => {
-  if (to.name === 'user_index') {
-    let user = store.state.user;
-    if (user) {
-      next();
-    } else {
-      next('/login');
-    }
-  } else {
-    store.commit('setUser');
-    next();
-  }
-});
+checkLogin(router);
 const originalPush = VueRouter.prototype.push;
 VueRouter.prototype.push = function push(location, onResolve, onReject) {
   if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject);

src/store/common/mutations.js

@@ -1,19 +1,33 @@
-const jwt = require('jsonwebtoken');
 export const setUser = (state, payload) => {
-  let res = true;
-  // 登陆时;
-  if (payload) {
-    state.user = payload;
-  } else {
-    //已经登陆,切换路由时取出用户信息放在总store中
-    let token = sessionStorage.getItem('token');
-    if (token) {
-      state.user = jwt.decode(token);
-    }
-  }
-  return res;
+  state.user = payload;
+  // let res = true;
+  // //登陆时
+  // if (payload) {
+  //   state.token = payload;
+  // } else {
+  //   //已经登陆,切换路由时取出用户信息放在总store中
+  //   let token = localStorage.getItem('token');
+  //   if (token && token !== 'guest') {
+  //     state.user = jwt.decode(token);
+  //   } else if (token && token == 'guest') {
+  //     let user = localStorage.getItem('user');
+  //     state.user = JSON.parse(user);
+  //   } else {
+  //     let timestamp = new Date().getTime();
+  //     let user = {
+  //       // id: `guest${timestamp}`,
+  //       name: `游客${timestamp}`,
+  //     };
+  //     state.user = user;
+  //     localStorage.setItem('token', 'guest');
+  //     localStorage.setItem('user', JSON.stringify(user));
+  //     console.warn('游客身份');
+  //   }
+  // }
+  // return res;
 };
+
 export const deleteUser = (state, payload) => {
   state.user = {};
-  localStorage.removeItem('user');
+  localStorage.removeItem('token');
 };

src/store/common/state.js

@@ -1 +1,2 @@
-export const user = undefined;
+export const user = {};
+export const menuList = [];

src/store/user/login.js

@@ -64,6 +64,7 @@ const actions = {
         payload();
         return;
       }
+      console.log('游客身份');
       let user = localStorage.getItem('user');
       if (user) {
         commit('setUser', JSON.parse(user), { root: true });

src/views/live/index.vue

@@ -66,18 +66,17 @@ export default {
     };
   },
   async created() {
+    console.log(this.user);
     await this.searchPlace();
     await this.searchList({ status: '0' });
     await this.searchList({ status: '1' });
     await this.searchList({ status: '2' });
-    // await this.searchList();
   },
   methods: {
     ...dock({ dockQuery: 'query' }),
     ...place({ palcequery: 'query', transactiondtetle: 'delete' }),
     async searchList({ skip = 0, limit = 10, status, ...info } = {}) {
       let res = await this.dockQuery({ is_allowed: 1, skip, status, ...info });
-      console.log(res);
       if (res.errcode === 0) {
         if (status == '0') {
           this.$set(this, `preTotal`, res.total);

src/views/live/parts/videoDetail.vue

@@ -3,20 +3,12 @@
     <el-row>
       <el-col :span="24" class="info">
         <el-col :span="24" class="video">
-          <!-- <video :src="file_path" controls="controls" style="height: 200px; width: 100%;">
+          <video :src="dockInfo.file_path" autoplay="" controls="controls" v-if="dockInfo.file_path != null || ''" class="videoinfo">
             您的浏览器不支持 video 标签。
-          </video> -->
-          <el-col :span="24" class="leftvideo">
-            <el-col :span="24" class="video">
-              <video :src="dockInfo.file_path" autoplay="" controls="controls" v-if="dockInfo.file_path != null || ''">
-                您的浏览器不支持 video 标签。
-              </video>
-              <div class="videointro" v-else>
-                <p>{{ dockInfo.videointro }}</p>
-                <!-- <p>{{ dockInfo.videointroinfo }}</p> -->
-              </div>
-            </el-col>
-          </el-col>
+          </video>
+          <div class="videointro" v-else>
+            <p>{{ dockInfo.videointro }}</p>
+          </div>
         </el-col>
         <el-col :span="24" class="chat">
           <chat></chat>
@@ -77,8 +69,6 @@ export default {
   },
   data: function() {
     return {
-      input: '',
-      dockInfo: [],
       activeName: 'first',
       //科技需求
       twoList: [],
@@ -87,35 +77,52 @@ export default {
       //专家智库
       expertList: [],
       expertimage: require('@/assets/222.png'),
+      // 展会详情
+      dockInfo: {},
+      times: 5,
     };
   },
-  created() {
-    this.seachInfo();
+  async created() {
+    await this.seachdock();
+    await this.seachInfo();
   },
   methods: {
-    ...dock({ dockQuery: 'query', palcefetch: 'fetch' }),
+    ...dock({ dockQuery: 'query', dockFetch: 'fetch' }),
     ...exportuser({ expertQuery: 'query' }),
     async seachInfo({ skip = 0, limit = 5, ...info } = {}) {
-      let res = await this.palcefetch(this.id);
+      let res = await this.dockFetch(this.id);
       if (this.$checkRes(res)) {
-        this.$set(this, `dockInfo`, res.data);
+        let czxm = res.data.apply.map(item => item.goodsList);
+        czxm = _.flattenDeep(czxm);
+        var czxmNew = czxm.filter(item => item.dockStatus == '1');
+        //科技需求
+        var jishuData = czxmNew.filter(item => item.type === '0');
+        this.$set(this, `twoList`, jishuData);
+        //技术成果
+        var chanpinData = czxmNew.filter(item => item.type === '1');
+        if (chanpinData) this.$set(this, `demandList`, chanpinData);
+        // 专家智库
+        let exportdata = await this.expertQuery({ role: 6, limit: 6 });
+        if (this.$checkRes(exportdata)) this.$set(this, `expertList`, exportdata.data);
       }
-      let czxm = res.data.apply.map(item => item.goodsList);
-      czxm = _.flattenDeep(czxm);
-      var czxmNew = czxm.filter(item => item.dockStatus == '1');
-      //科技需求
-      var jishuData = czxmNew.filter(item => item.type === '0');
-      this.$set(this, `twoList`, jishuData);
-      //技术成果
-      var chanpinData = czxmNew.filter(item => item.type === '1');
-      if (chanpinData) this.$set(this, `demandList`, chanpinData);
-      // 专家智库
-      let exportdata = await this.expertQuery({ role: 6, limit: 6 });
-      if (this.$checkRes(exportdata)) this.$set(this, `expertList`, exportdata.data);
-      console.log(this.expertList);
     },
-    onSubmit() {
-      console.log(this.input);
+    // 文字/视频倒计时
+    daojishi() {
+      this.timer = setInterval(() => {
+        this.times--;
+        if (this.times === 0) {
+          this.seachdock();
+          this.times = 5;
+          clearInterval(this.timer);
+        }
+      }, 1000);
+    },
+    async seachdock() {
+      let res = await this.dockFetch(this.id);
+      if (this.$checkRes(res)) {
+        // 对接会详情
+        this.$set(this, `dockInfo`, res.data);
+      }
     },
   },
   computed: {
@@ -130,6 +137,16 @@ export default {
   metaInfo() {
     return { title: this.$route.meta.title };
   },
+  watch: {
+    times: {
+      handler(val) {
+        if (val == 5) {
+          this.daojishi();
+        }
+      },
+      immediate: true,
+    },
+  },
 };
 </script>
 
@@ -140,38 +157,36 @@ export default {
     background: #fff;
     padding: 10px;
     margin: 0 0 10px 0;
-    height: 225px;
-    .leftvideo {
-      video {
-        width: 100%;
-        height: 225px;
-        background: #000;
-        padding: 0px 0 15px 0px;
+    height: 250px;
+    .videoinfo {
+      width: 100%;
+      height: 215px;
+      background: #000;
+      padding: 0px 0 15px 0px;
+    }
+    .videointro {
+      background: url(/img/directBack.d8126f77.png);
+      background-size: 100% 100%;
+      color: #fff;
+      padding: 0 15px;
+      height: 230px;
+      p:first-child {
+        text-align: center;
+        font-size: 30px;
+        padding: 25% 0;
       }
-      .videointro {
-        background: url('~@/assets/directBack.png');
-        background-size: 100% 100%;
-        color: #fff;
-        padding: 0 15px;
-        height: 225px;
-        p:first-child {
-          text-align: center;
-          font-size: 30px;
-          padding: 25% 0;
-        }
-        p:last-child {
-          padding: 0;
-          padding-top: 30px;
-          text-align: center;
-          font-size: 18px;
-          line-height: 35px;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          -webkit-line-clamp: 7;
-          word-break: break-all;
-          display: -webkit-box;
-          -webkit-box-orient: vertical;
-        }
+      p:last-child {
+        padding: 0;
+        padding-top: 30px;
+        text-align: center;
+        font-size: 18px;
+        line-height: 35px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        -webkit-line-clamp: 7;
+        word-break: break-all;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
       }
     }
   }