1

src/router/index.js

@@ -48,6 +48,11 @@ export default new Router({
           component: () => import('../views/adminCenter/adminScore/detail.vue'),
           meta: { title: '专家评分查看' },
         },
+        {
+          path: '/adminScore/preview',
+          component: () => import('../views/adminCenter/adminScore/preview.vue'),
+          meta: { title: '专家意见预览' },
+        },
         // 专家会审
         {
           path: '/adminMeet',

src/views/adminCenter/adminMeet/expert.vue

@@ -5,6 +5,7 @@
         <el-col :span="24" class="top">
           <el-button type="primary" size="mini" @click="back">返回</el-button>
           <el-button type="primary" size="mini" @click="add">添加专家</el-button>
+          <el-button type="success" size="mini" @click="previewBtn">预览PDF</el-button>
         </el-col>
         <el-col :span="24" class="down">
           <data-table
@@ -144,6 +145,10 @@ export default {
     back() {
       this.$router.push({ path: '/adminMeet' });
     },
+    // 预览专家
+    previewBtn() {
+      this.$router.push({ path: '/adminScore/preview', query: { id: this.id, type: '2' } });
+    },
   },
   computed: {
     ...mapState(['user', 'menuParams']),

src/views/adminCenter/adminMeet/file copy.vue

@@ -1,78 +0,0 @@
-<template>
-  <div id="file">
-    <el-button type="primary" @click="handleDown">pdf</el-button>
-    <el-row>
-      <el-col :span="24" style="text-align:center;font-size:32px;margin-bottom:30px;">
-        {{ getProp('basic.achieve_name') }}
-      </el-col>
-    </el-row>
-    <div id="demo">
-      <el-col :span="24" class="info">
-        <page5></page5>
-        <!-- <page6></page6> -->
-        <!-- <page5></page5>
-        <expertList :list="expertList"></expertList> -->
-      </el-col>
-    </div>
-  </div>
-</template>
-
-<script>
-const _ = require('lodash');
-import page5 from '@common/template/page5.vue';
-import page6 from '@common/template/page6.vue';
-import expertList from '@common/template/expertList.vue';
-import htmlToPdf from '@/unit/htmlToPdf.js';
-import { mapState, createNamespacedHelpers } from 'vuex';
-const { mapActions: achieveApply } = createNamespacedHelpers('achieveApply');
-const { mapActions: achieveApplyExpert } = createNamespacedHelpers('achieveApplyExpert');
-export default {
-  name: 'file',
-  props: {},
-  components: { page5 },
-  data: function() {
-    return {
-      info: {},
-      expertList: [],
-    };
-  },
-  created() {
-    this.init();
-  },
-  methods: {
-    ...achieveApply(['fetch']),
-    ...achieveApplyExpert(['query']),
-    async init() {
-      const apply = await this.fetch(this.id);
-      if (this.$checkRes(apply)) {
-        this.$set(this, `info`, apply.data);
-      }
-      const experts = await this.query({ apply_id: this.info.id, type: '2', expert: true });
-      if (this.$checkRes(experts)) {
-        this.$set(this, `expertList`, experts.data);
-      }
-    },
-    // 证书下载
-    handleDown() {
-      htmlToPdf.downloadPDF(document.querySelector('#demo'), this.info.basic.achieve_name);
-    },
-    getProp(prop) {
-      return _.get(this.info, prop);
-    },
-  },
-  computed: {
-    ...mapState(['user', 'menuParams']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
-    },
-    id() {
-      return this.$route.query.id;
-    },
-  },
-  metaInfo() {
-    return { title: this.$route.meta.title };
-  },
-};
-</script>
-
-<style lang="less" scoped></style>

src/views/adminCenter/adminScore/detail.vue

@@ -3,14 +3,10 @@
     <el-row>
       <el-col :span="24" class="main">
         <el-col :span="24" class="top">
-          <template v-if="view === 'list'">
+          <template>
             <el-button type="primary" size="mini" @click="back">返回</el-button>
             <el-button type="primary" size="mini" @click="add">添加专家</el-button>
-            <el-button type="success" size="mini" @click="view = 'pdf'">预览PDF</el-button>
-          </template>
-          <template v-if="view === 'pdf'">
-            <el-button type="primary" size="mini" @click="view = 'list'">返回</el-button>
-            <el-button type="success" size="mini" @click="toPdf">生成PDF</el-button>
+            <el-button type="success" size="mini" @click="previewBtn">预览PDF</el-button>
           </template>
         </el-col>
         <el-col :span="24" class="down">
@@ -26,9 +22,7 @@
             :useSum="true"
             :sumcol="['verify.score']"
             sumres="avg"
-            v-if="view === 'list'"
           ></data-table>
-          <listpdf :list="list" v-else></listpdf>
         </el-col>
       </el-col>
     </el-row>
@@ -49,8 +43,6 @@
 
 <script>
 const _ = require('lodash');
-import htmlToPdf from '@/unit/htmlToPdf.js';
-import listpdf from './parts/listpdf.vue';
 import scoreInfo from './parts/scoreInfo.vue';
 import dataTable from '@common/src/components/frame/filter-page-table.vue';
 import dataForm from '@common/src/components/frame/form.vue';
@@ -67,7 +59,6 @@ export default {
     dataTable,
     dataForm,
     scoreInfo,
-    listpdf,
   },
   data: function() {
     return {
@@ -107,8 +98,6 @@ export default {
       scoreDialog: false,
       info: {},
       expertList: [],
-      // 当前视图
-      view: 'list',
     };
   },
   async created() {
@@ -175,8 +164,9 @@ export default {
       const res = await this.getExpert({ status: '0' });
       if (this.$checkRes(res)) this.$set(this, 'expertList', res.data);
     },
-    toPdf() {
-      htmlToPdf.downloadPDF(document.querySelector('#listpdf'), '专家意见');
+    // 预览专家
+    previewBtn() {
+      this.$router.push({ path: '/adminScore/preview', query: { id: this.id, type: '1' } });
     },
   },
   computed: {

src/views/adminCenter/adminScore/parts/listpdf.vue

@@ -1,20 +1,20 @@
 <template>
   <div id="listpdf">
-    <el-card v-for="(i, index) in list" :key="`card${index}`" style="margin-bottom:10px">
-      <template #header>
-        <el-row type="flex" :gutter="10">
-          <el-col :span="8">姓名:{{ getProp(i, 'expert_id.expert_name') }}</el-col>
-          <el-col :span="8">电话:{{ getProp(i, 'expert_id.phone') }}</el-col>
-          <el-col :span="8">评分:{{ getProp(i, 'verify.score') }}</el-col>
-        </el-row>
-      </template>
-      <el-row>
-        <el-col :span="24">评分详情:</el-col>
-        <el-col :span="24">
-          <p style="text-indent:35px">{{ getProp(i, 'verify.content') }}</p>
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="list" v-for="(i, index) in list" :key="index">
+          <el-col :span="24" class="text">
+            <el-col :span="8" class="name">姓名:{{ getProp(i, 'expert_id.expert_name') }}</el-col>
+            <el-col :span="8" class="name">电话:{{ getProp(i, 'expert_id.phone') }}</el-col>
+            <el-col :span="8" class="name">评分:{{ getProp(i, 'verify.score') }}</el-col>
+          </el-col>
+          <el-col :span="24" class="opinion">
+            <h5>意见详情:</h5>
+            <p>{{ getProp(i, 'verify.content') }}</p>
+          </el-col>
         </el-col>
-      </el-row>
-    </el-card>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
@@ -23,9 +23,7 @@ const _ = require('lodash');
 import { mapState, createNamespacedHelpers } from 'vuex';
 export default {
   name: 'listpdf',
-  props: {
-    list: Array,
-  },
+  props: { list: Array },
   components: {},
   data: function() {
     return {};
@@ -37,15 +35,50 @@ export default {
     },
   },
   computed: {
-    ...mapState(['user', 'menuParams']),
-    pageTitle() {
-      return `${this.$route.meta.title}`;
-    },
+    ...mapState(['user']),
   },
   metaInfo() {
     return { title: this.$route.meta.title };
   },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.main {
+  .list {
+    margin: 0 0 15px 0;
+    border-radius: 5px;
+    padding: 10px;
+    border: 1px solid #000;
+    background-color: #fff;
+    .text {
+      margin: 0 0 5px 0;
+      border-bottom: 1px dashed #ccc;
+      .name {
+        font-size: 16px;
+        padding: 10px 0;
+        text-align: center;
+        font-family: monospace;
+      }
+    }
+    .opinion {
+      h5 {
+        padding: 5px 0;
+      }
+      p {
+        text-indent: 2rem;
+        font-size: 14px;
+        color: #000;
+        font-family: monospace;
+      }
+    }
+  }
+}
+</style>

src/views/adminCenter/adminScore/preview.vue

@@ -0,0 +1,124 @@
+<template>
+  <div id="preview">
+    <el-row>
+      <el-col :span="24" class="main">
+        <el-col :span="24" class="top">
+          <el-button type="primary" size="mini" @click="download">PDF下载</el-button>
+          <el-button type="primary" size="mini" @click="back">返回</el-button>
+        </el-col>
+        <el-col :span="24" class="down">
+          <div id="demo">
+            <el-col :span="24" class="common one">
+              <listpdf :list="list"></listpdf>
+            </el-col>
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import listpdf from './parts/listpdf.vue';
+import htmlToPdf from '@/unit/htmlToPdf.js';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: achieveApply } = createNamespacedHelpers('achieveApply');
+const { mapActions: achieveApplyExpert } = createNamespacedHelpers('achieveApplyExpert');
+export default {
+  name: 'preview',
+  props: {},
+  components: { listpdf },
+  data: function() {
+    return {
+      form: {
+        // 基本信息
+        basic: {},
+        // 信息简介
+        brief: {},
+        // 参加人员
+        research: [],
+        // 图片
+        file: {},
+      },
+      list: [],
+    };
+  },
+  async created() {
+    await this.search();
+  },
+  methods: {
+    ...achieveApply(['fetch', 'update']),
+    ...achieveApplyExpert(['query']),
+    async search({ skip, limit = 10, ...info } = {}) {
+      if (this.id) {
+        let res = await this.fetch(this.id);
+        if (this.$checkRes(res)) {
+          this.$set(this, 'form', res.data);
+        }
+        res = await this.query({ ...info, apply_id: this.id, expert: true, type: this.type });
+        if (this.$checkRes(res)) {
+          this.$set(this, `list`, res.data);
+        }
+      }
+    },
+    // PDF下载
+    download() {
+      htmlToPdf.downloadPDF(document.querySelector('#demo'), '专家意见');
+    },
+    // 返回
+    back() {
+      if (this.type == '1') {
+        this.$router.push({ path: '/adminScore/detail', query: { id: this.id } });
+      } else if (this.type == '2') {
+        this.$router.push({ path: '/adminMeet/expert', query: { id: this.id } });
+      }
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    id() {
+      return this.$route.query.id;
+    },
+    type() {
+      return this.$route.query.type;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  watch: {
+    test: {
+      deep: true,
+      immediate: true,
+      handler(val) {},
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  .top {
+    text-align: center;
+    margin: 0 0 15px 0;
+  }
+  .down {
+    padding: 0 20%;
+    #demo {
+      width: 100%;
+      height: 1389px;
+      border: 1px solid #ff0000;
+      .one {
+        height: 1389px;
+        padding: 20px;
+      }
+    }
+  }
+}
+.common {
+  width: 100%;
+  height: 1389px;
+  border-bottom: 1px solid #666666;
+  padding: 40px 20px;
+}
+</style>