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

package.json

@@ -11,6 +11,7 @@
     "@stomp/stompjs": "^5.4.4",
     "axios": "^0.19.2",
     "core-js": "^3.6.4",
+    "echarts": "^4.7.0",
     "element-ui": "^2.13.1",
     "jsonwebtoken": "^8.5.1",
     "loadsh": "0.0.4",

src/layout/live/head.vue

@@ -12,6 +12,7 @@
           <p class="username">
             <span v-if="user && user.name" @click="stnmae">{{ user.name }}</span>
             <span v-else>
+              {{ user.name }}
               <button type="button" class="logininfo" @click="btnLogin">登录</button>
               <button type="button" class="logininfo" @click="btnLogin">注册</button>
             </span>

src/router/index.js

@@ -78,6 +78,14 @@ const live = [
         meta: { title: '动态监测列表', subSite: true },
         component: () => import('../views/dynamic/list.vue'),
       },
+      // 动态监测-交易动态详情
+      {
+        path: '/dynamic/dealDetail',
+        name: 'dynamic_dealDetail',
+        meta: { title: '交易动态详情', subSite: true },
+        component: () => import('../views/dynamic/dealDetail.vue'),
+      },
+
       {
         path: '/technical/index',
         name: 'technical_index',

src/views/dynamic/dealDetail.vue

@@ -0,0 +1,47 @@
+<template>
+  <div id="dealDetail">
+    <el-row>
+      <div class="w_1200">
+        <el-col :span="24" class="main">
+          <el-col :span="24" class="top">
+            <el-steps :active="status" align-center>
+              <el-step title="正在洽谈" description="这是一段很长很长很长的描述性文字"></el-step>
+              <el-step title="达成意向" description="这是一段很长很长很长的描述性文字"></el-step>
+              <el-step title="交易完成" description="这是一段很长很长很长的描述性文字"></el-step>
+            </el-steps>
+          </el-col>
+          <el-col :span="message">
+            信息
+          </el-col>
+        </el-col>
+      </div>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'dealDetail',
+  props: {},
+  components: {},
+  data: () => ({
+    status: 2,
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 80%;
+  margin: 0 auto;
+}
+.main {
+  float: left;
+  width: 100%;
+  min-height: 600px;
+  margin: 30px 0;
+}
+</style>

src/views/dynamic/index.vue

@@ -8,10 +8,10 @@
               统计监测
             </el-col>
             <el-col :span="8" class="user">
-              平台用户，在线用户
+              <users></users>
             </el-col>
             <el-col :span="8" class="city">
-              举办展示次数，按地区
+              <maps></maps>
             </el-col>
             <el-col :span="8" class="data">
               正在洽谈，达成意向，交易成功
@@ -22,7 +22,7 @@
               交易动态
             </el-col>
             <el-col :span="24" class="data">
-              数据展示
+              <pie></pie>
             </el-col>
           </el-col>
         </div>
@@ -32,10 +32,13 @@
 </template>
 
 <script>
+import users from './parts/user.vue';
+import pie from './parts/down-pie.vue';
+import maps from './parts/map.vue';
 export default {
   name: 'index',
   props: {},
-  components: {},
+  components: { users, pie, maps },
   data: () => ({}),
   created() {},
   computed: {},

src/views/dynamic/parts/down-pie.vue

@@ -0,0 +1,91 @@
+<template>
+  <div id="down-pie">
+    <div id="chartPie" class="" style="height:450px;"></div>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions } = createNamespacedHelpers('transaction');
+const { mapActions: personalRoom } = createNamespacedHelpers('personalroom');
+import echarts from 'echarts/lib/echarts';
+import 'echarts/lib/chart/pie';
+import 'echarts/lib/chart/pie';
+import 'echarts/lib/chart/line';
+import 'echarts/lib/component/title';
+import 'echarts/lib/component/legend';
+import 'echarts/lib/component/toolbox';
+import 'echarts/lib/component/markPoint';
+import 'echarts/lib/component/tooltip';
+export default {
+  name: 'downPie',
+  props: {},
+  components: {},
+  data: () => {
+    return {
+      myChart: null,
+      type: 'pie',
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    ...mapActions(['query']),
+    ...personalRoom(['countRoom']),
+    async init() {
+      let res = await this.query();
+      let rooms = await this.countRoom();
+      if (this.$checkRes(res)) {
+        let taking = rooms.errcode == 0 ? rooms.total : 0;
+        let s1 = res.data.filter(f => f.status == '1'); //达成意向
+        let s2 = res.data.filter(f => f.status == '2'); //对接完成
+        let s3 = res.data.filter(f => f.status == '3'); //未达成意向
+        this.myChart = echarts.init(document.getElementById('chartPie'));
+        const option = {
+          title: {},
+          tooltip: { trigger: 'item', formatter: '{a} <br/>{b} : {c} ({d}%)' },
+          legend: {
+            data: ['正在洽谈', '达成意向', '对接完成', '未达成意向'],
+          },
+          series: [
+            {
+              name: '统计',
+              label: {
+                show: true,
+                position: 'top',
+              },
+              type: this.type,
+              data: [
+                { name: '正在洽谈', value: taking, itemStyle: { color: 'gray' } },
+                { name: '达成意向', value: s1.length, itemStyle: { color: 'blue' } },
+                { name: '对接完成', value: s2.length, itemStyle: { color: 'green' } },
+              ],
+              animationType: 'scale',
+            },
+          ],
+          toolbox: {
+            show: true,
+            feature: {
+              dataView: { readOnly: false },
+              saveAsImage: {},
+            },
+          },
+        };
+        this.myChart.setOption(option);
+      }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/dynamic/parts/map.vue

@@ -0,0 +1,88 @@
+<template>
+  <div id="maps">
+    <div id="chartMap" class="" style="height:450px;"></div>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+import echarts from 'echarts/lib/echarts';
+import 'echarts/map/js/china.js';
+import 'echarts/map/js/province/jilin.js';
+import 'echarts/lib/component/title';
+import 'echarts/lib/component/legend';
+import 'echarts/lib/component/toolbox';
+import 'echarts/lib/component/markPoint';
+import 'echarts/lib/component/tooltip';
+export default {
+  name: 'maps',
+  props: {},
+  components: {},
+  data: () => {
+    return {
+      myChart: null,
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    async init() {
+      let option = {
+        title: '',
+        geo: {
+          map: '吉林市',
+          label: {
+            emphasis: {
+              show: false,
+            },
+          },
+          itemStyle: {
+            normal: {
+              areaColor: '#058bd2',
+              borderColor: '#111',
+            },
+            emphasis: {
+              areaColor: '#1e67b2',
+            },
+          },
+        },
+        visualMap: {
+          //颜色轴，可以根据数据点的值大小，展示不同的颜色，或用来展示地图块的不同颜色
+          min: 0,
+          max: 200,
+          calculable: true,
+          inRange: {
+            color: ['#3dda8e', '#eac736', '#d94e5d'],
+          },
+          textStyle: {
+            color: '#fff',
+          },
+        },
+        series: [
+          {
+            name: '吉林',
+            geoIndex: 0,
+            type: 'map',
+            mapType: 'jilin',
+            data: [1],
+          },
+        ],
+      };
+      this.myChart = echarts.init(document.getElementById('chartMap'));
+      this.myChart.setOption(option);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/dynamic/parts/user.vue

@@ -0,0 +1,76 @@
+<template>
+  <div id="user">
+    <div id="chart" class="" style="height:450px;"></div>
+  </div>
+</template>
+
+<script>
+import echarts from 'echarts/lib/echarts';
+import 'echarts/lib/chart/bar';
+import 'echarts/lib/chart/pie';
+import 'echarts/lib/chart/line';
+import 'echarts/lib/component/title';
+import 'echarts/lib/component/legend';
+import 'echarts/lib/component/toolbox';
+import 'echarts/lib/component/markPoint';
+import 'echarts/lib/component/tooltip';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions } = createNamespacedHelpers('market');
+export default {
+  name: 'user',
+  props: {},
+  components: {},
+  data: () => {
+    return {
+      myChart: null,
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    ...mapActions(['query']),
+    async init() {
+      let res = await this.query();
+      if (this.$checkRes(res)) {
+        this.myChart = echarts.init(document.getElementById('chart'));
+        const option = {
+          title: { text: '用户统计' },
+          tooltip: { trigger: 'axis' },
+          legend: {
+            data: ['用户总数', '在线人数'],
+          },
+          xAxis: {
+            type: 'category',
+            data: ['用户总数', '在线人数'],
+          },
+          yAxis: {},
+          series: [
+            {
+              name: '用户总数',
+              label: {
+                show: true,
+                position: 'top',
+              },
+              type: 'line',
+              data: [res.total],
+            },
+          ],
+        };
+        this.myChart.setOption(option);
+      }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/views/hall/dock/dockDetail.vue

@@ -64,6 +64,7 @@
 </template>
 
 <script>
+import _ from 'lodash';
 import { mapState, createNamespacedHelpers } from 'vuex';
 import chat from './parts/chat.vue';
 const { mapActions: mapProduct } = createNamespacedHelpers('marketproduct');
@@ -83,11 +84,17 @@ export default {
     if (this.$route.query.id) {
       this.searchInfo();
     }
-    this.test();
+    //http://localhost:8001/direct?id=5eb52b8263be753d982dabc7
+  },
+  mounted() {
+    window.addEventListener('beforeunload', e => {
+      event.preventDefault();
+      this.killTalk();
+    });
   },
   methods: {
     ...mapProduct(['fetch']),
-    ...personalRoom(['create']),
+    ...personalRoom(['create', 'countDelete']),
     ...transaction({ buyProduct: 'create' }),
     async searchInfo() {
       let res = await this.fetch(this.$route.query.id);
@@ -138,8 +145,12 @@ export default {
       let res = await this.buyProduct(form);
       this.$checkRes(res, '购买申请成功', res.errmsg || '购买申请失败');
     },
-    test() {
-      console.log(this.user.uid);
+    killTalk() {
+      this.$alert('您确认对话已经可以结束了吗?');
+      let room_id = _.get(this.room, 'id');
+      if (room_id) {
+        this.countDelete(room_id);
+      }
     },
   },
   computed: {
@@ -151,6 +162,10 @@ export default {
   metaInfo() {
     return { title: this.$route.meta.title };
   },
+  beforeRouteLeave(to, from, next) {
+    this.killTalk();
+    next();
+  },
 };
 </script>
 

src/views/hall/dock/parts/chat.vue

@@ -11,7 +11,7 @@
           </template>
           <template v-else>
             <el-col :span="24" class="receverTime" :key="`div${i.id}${index}`">
-              <span :key="`receverTime${i.id}${index}`"> {{ i.receiver_name }} [{{ i.send_time }}]</span>
+              <span :key="`receverTime${i.id}${index}`"> {{ i.sender_name }} [{{ i.send_time }}]</span>
               <span v-html="i.content" :key="`receverContent${i.id}${index}`"></span>
             </el-col>
           </template>