1

src/views/achieveLive/expert/index.vue

@@ -1,32 +1,137 @@
 <template>
   <div id="index">
     <el-row>
-      <el-col :span="24">
-        <p>专家列表</p>
+      <el-col :span="24" class="main">
+        <subTop :liveInfo="liveInfo"></subTop>
+        <el-col :span="24" class="info">
+          <div class="w_1200">
+            <el-col :span="24" class="infoMess">
+              <el-col :span="24" class="btn">
+                <el-col :span="12" class="left">
+                  <span>专家总数:{{ total }}人</span>
+                </el-col>
+                <el-col :span="12" class="right">
+                  <el-button type="primary" size="mini" @click="back">返回活动首页</el-button>
+                </el-col>
+              </el-col>
+              <el-col :span="24" class="list">
+                <data-table :fields="fields" :opera="opera" :data="list" :total="total" @query="search" @check="toCheck"></data-table>
+              </el-col>
+            </el-col>
+          </div>
+        </el-col>
       </el-col>
     </el-row>
   </div>
 </template>
 
 <script>
+import subTop from '../parts/subTop.vue';
+import dataTable from '@common/src/components/frame/filter-page-table.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: dock } = createNamespacedHelpers('dock');
+const { mapActions: expert } = createNamespacedHelpers('expert');
 export default {
   metaInfo() {
     return { title: this.$route.meta.title };
   },
   name: 'index',
   props: {},
-  components: {},
+  components: {
+    subTop,
+    dataTable,
+  },
   data: function() {
-    return {};
+    return {
+      // 展会详情
+      liveInfo: {},
+      opera: [
+        {
+          label: '对接',
+          method: 'check',
+        },
+      ],
+      fields: [
+        { label: '姓名', prop: 'name' },
+        { label: 'QQ微信', prop: 'qqwx' },
+        { label: '电子邮箱', prop: 'email' },
+        { label: '工作单位', prop: 'company' },
+        { label: '职务职称', prop: 'zwzc' },
+      ],
+      list: [],
+      total: 0,
+    };
+  },
+  async created() {
+    await this.search();
+  },
+  methods: {
+    ...dock(['fetch']),
+    ...expert(['query']),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      if (this.dock_id) {
+        let res = await this.fetch(this.dock_id);
+        if (this.$checkRes(res)) {
+          this.$set(this, `liveInfo`, res.data);
+        }
+      }
+      let res = await this.query({ skip, limit, ...info });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        this.$set(this, `total`, res.total);
+      }
+    },
+    // 对接
+    toCheck({ data }) {
+      console.log(data);
+    },
+    // 返回
+    back() {
+      this.$router.push({ path: '/achieveLive/detail', query: { id: this.dock_id } });
+    },
   },
-  created() {},
-  methods: {},
   computed: {
     ...mapState(['user']),
+    dock_id() {
+      return this.$route.query.dock_id;
+    },
   },
   watch: {},
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.main {
+  .info {
+    position: absolute;
+    top: 70%;
+    padding: 0 0 15px 0;
+    .infoMess {
+      min-height: 630px;
+      box-shadow: 0 0 5px #ccc;
+      background-color: #fff;
+      padding: 20px;
+      .btn {
+        margin: 0 0 10px 0;
+        height: 40px;
+        overflow: hidden;
+        border-bottom: 2px solid #666;
+        .left {
+          span {
+            display: inline-block;
+            background: #ff0000;
+            color: #fff;
+            height: 40px;
+            line-height: 40px;
+            padding: 0px 10px;
+            font-weight: bold;
+          }
+        }
+        .right {
+          text-align: right;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/achieveLive/guestRoad/index.vue

@@ -2,17 +2,7 @@
   <div id="index">
     <el-row>
       <el-col :span="24" class="main">
-        <el-col :span="24" class="top">
-          <div class="w_1200">
-            <el-col :span="24" class="one">
-              {{ liveInfo.title }}
-            </el-col>
-            <el-col :span="24" class="two">
-              <span>主办方：</span>
-              <span>{{ liveInfo.sponsor }}</span>
-            </el-col>
-          </div>
-        </el-col>
+        <subTop :liveInfo="liveInfo"></subTop>
         <el-col :span="24" class="info">
           <div class="w_1200">
             <el-col :span="24" class="infoMess">
@@ -48,6 +38,7 @@
 </template>
 
 <script>
+import subTop from '../parts/subTop.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: dock } = createNamespacedHelpers('dock');
 const { mapActions: interview } = createNamespacedHelpers('interview');
@@ -58,7 +49,9 @@ export default {
   },
   name: 'index',
   props: {},
-  components: {},
+  components: {
+    subTop,
+  },
   data: function() {
     return {
       // 展会详情
@@ -116,32 +109,6 @@ export default {
 
 <style lang="less" scoped>
 .main {
-  .top {
-    background: url('~@common/src/assets/live/dock_top.png');
-    height: 400px;
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    .one {
-      text-align: center;
-      font-size: 40px;
-      color: #fff;
-      padding: 4% 8% 0 10%;
-      height: 160px;
-      margin: 0 0 40px 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      -webkit-line-clamp: 2;
-      word-break: break-all;
-      display: -webkit-box;
-      -webkit-box-orient: vertical;
-    }
-    .two {
-      text-align: center;
-      font-size: 30px;
-      color: #fff;
-      margin: 0 0 50px 0;
-    }
-  }
   .info {
     position: absolute;
     top: 70%;

src/views/achieveLive/parts/subTop.vue

@@ -0,0 +1,70 @@
+<template>
+  <div id="subTop">
+    <el-row>
+      <el-col :span="24" class="subTop">
+        <el-col :span="24" class="top">
+          <div class="w_1200">
+            <el-col :span="24" class="one">
+              {{ liveInfo.title }}
+            </el-col>
+            <el-col :span="24" class="two">
+              <span>主办方：</span>
+              <span>{{ liveInfo.sponsor }}</span>
+            </el-col>
+          </div></el-col
+        >
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'subTop',
+  props: {
+    liveInfo: { type: Object },
+  },
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+  },
+  watch: {},
+};
+</script>
+
+<style lang="less" scoped>
+.subTop {
+  .top {
+    background: url('~@common/src/assets/live/dock_top.png');
+    height: 400px;
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    .one {
+      text-align: center;
+      font-size: 40px;
+      color: #fff;
+      padding: 4% 8% 0 10%;
+      height: 160px;
+      margin: 0 0 40px 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      -webkit-line-clamp: 2;
+      word-break: break-all;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+    }
+    .two {
+      text-align: center;
+      font-size: 30px;
+      color: #fff;
+      margin: 0 0 50px 0;
+    }
+  }
+}
+</style>