瀏覽代碼

feat: 优化

zhangyuhan 3 年之前
父節點
當前提交
10490d9815
共有 6 個文件被更改,包括 454 次插入161 次删除
  1. 26 0
      Dockerfile
  2. 37 0
      README.md
  3. 2 2
      bin/config.js
  4. 二進制
      web/files/1.pdf
  5. 389 159
      web/index.html
  6. 二進制
      web/pdf-files/demo.pdf

+ 26 - 0
Dockerfile

@@ -0,0 +1,26 @@
+#FROM node
+#FROM buildkite/puppeteer
+FROM kuser/jypdf:v1.0
+
+#从git拉去代码
+RUN mkdir -p /home/create-pdf
+WORKDIR /home/create-pdf
+
+#git clone https://gitee.com/zhangyuhan2016/create-pdf ./
+COPY . /home/create-pdf
+
+
+RUN npm install 
+#RUN npm config set registry https://registry.npm.taobao.org --global
+#RUN npm config set disturl https://npm.taobao.org/dist --global
+#RUN npm install yarn 
+#RUN  yarn config set registry https://registry.npm.taobao.org --global
+#RUN yarn config set disturl https://npm.taobao.org/dist --global
+#RUN yarn install --prefer-offline
+
+
+EXPOSE 8088
+
+#RUN npm run serve
+ENTRYPOINT ["npm", "run"]
+CMD ["serve"]

+ 37 - 0
README.md

@@ -0,0 +1,37 @@
+
+# PDF 生成服务
+
+> 基于 puppeteer koa 的 pdf 生成服务
+
+## 启动
+
+`
+yarn run serve
+`
+## 访问
+`
+http://localhost:8088/api/to-pdf/文件名?dir=目录名&url=https://www.baidu.com?search=test
+`
+
+## 配置项
+`
+dir: 目录名
+width: puppeteer设置 宽度
+height: puppeteer设置 高度
+... 更多 puppeteer 设置
+url: 页面URL(如含有query参数,务必作为最后一个参数,详见代码参数截取逻辑)
+`
+
+## Docker 启动命令
+`
+docker build -t pdfserver .  
+docker run -p 8081:8088 -v /opt/Downloads/:/home/PdfService/web/files -d pdfserver
+`
+
+
+## 特殊提示
+
+### pdf 页头页尾植入
+> 参考 index.html \ test.html
+> 
+> 最终版本参照剑鱼项目报告

+ 2 - 2
bin/config.js

@@ -5,9 +5,9 @@ const rootDir = path.resolve(__dirname, '../web/')
 const config = {
   PATH_ROOT: rootDir,
   PATH_LOGS: path.join(rootDir, 'logs'),
-  PATH_FILES: path.join(rootDir, 'files'),
+  PATH_FILES: path.join(rootDir, 'pdf-files'),
   LISTEN_PORT: '8088',
-  DOMAIN: 'http://192.168.20.41:8088'
+  DOMAIN: ''
 }
 
 module.exports = config

二進制
web/files/1.pdf


+ 389 - 159
web/index.html

@@ -10,7 +10,7 @@
             background: rgb(204,204,204);
         }
         .page[size="A4"] + .page[size="A4"] {
-            margin-top: 0.5cm;
+            /*margin-top: 0.5cm;*/
         }
         .page[size="A4"] {
             background: white;
@@ -240,10 +240,13 @@
         }
         .page-footer,
         .page-header {
-            width: 830px;
+            width: 950px;
+            padding: 35px 60px;
+            box-sizing: border-box;
+            background: #fff;
             position: absolute;
             top: 60px;
-            left: 60px;
+            left: 0;
             display: flex;
             flex-direction: row;
             align-items: center;
@@ -251,8 +254,7 @@
         }
         .page-footer {
             top: unset;
-            left: 60px;
-            bottom: 60px;
+            left: 0;
             text-align: center;
             font-size: 12px;
             line-height: 12px;
@@ -310,195 +312,423 @@
             flex: unset;
             width: 10em;
         }
+        .page a {
+          word-break: break-all;
+        }
+        .com-detail {
+          padding: 20px;
+          box-sizing: border-box;
+          background: #f7f7f7;
+        }
+        .page a {
+          word-break: break-all;
+        }
+        .com-detail {
+          padding: 20px;
+          box-sizing: border-box;
+          background: #f7f7f7;
+        }
+        #report-content {
+          height: auto;
+        }
     </style>
+  <style>
+    body {
+      position: relative;
+    }
+    .test-page {
+      padding: 20px;
+      box-sizing: border-box;
+      /*margin-top: 60px;*/
+    }
+    .test-page div {
+      border: 1px solid #eeee;
+      box-sizing: border-box;
+    }
+    .test-page > div {
+      border: 1px solid red;
+      margin: 10px 0;
+    }
+    .fixed {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 1360px;
+      background: #FF7777;
+      z-index: -1;
+      opacity: 0.2;
+    }
+    .page-2 {
+      height: 2720px;
+      background: darkgreen;
+    }
+    .page-3 {
+      top: 4080px;
+      background: yellowgreen;
+    }
+  </style>
 </head>
 <body>
 
+<div class="fixed page-1"></div>
+<div class="fixed page-2"></div>
+<div class="fixed page-3"></div>
+
+<div id="clone-template" style="display: none">
+  <div class="page-header">
+    <div class="flex-r-box">
+      <img src="/images/report/logo.png" alt="">
+      <a href="/">www.jianyu360.cn</a>
+    </div>
+  </div>
+  <div class="page-footer">
+    <div style="width: 100%;">
+      第<span name="now">1</span>页共<span name="total">3</span>页
+    </div>
+  </div>
+</div>
+
 <div id="report" v-cloak>
-    <div class="page title-page" size="A4">
-        <div class="flex-c-box" style="height: 100%;justify-content: unset">
-            <div class="page-cover-title">
-                {{info.projectname}}
-                <br>
-                项目报告
-                <br>
-            </div>
-            <div class="date-tip">{{nowDate}}</div>
-        </div>
+  <div class="page title-page" size="A4">
+    <div class="flex-c-box" style="height: 100%;justify-content: unset">
+      <div class="page-cover-title">
+        ${info.projectname}
+        <br>
+        项目报告
+        <br>
+      </div>
+      <div class="date-tip">${nowDate}</div>
     </div>
-    <div class="page" size="A4">
-        <div class="page-header">
-            <div class="flex-r-box">
-                <img src="./static/image/logo.png" alt="">
-                <a href="/">www.jianyu360.cn</a>
-            </div>
+  </div>
+  <div class="page" size="A4" id="report-content">
+    <h1>1.项目摘要</h1>
+    <div>
+      <div class="table-box min-6">
+        <div class="table-row">
+          <div class="table-cell table-first-cell">地区</div>
+          <div class="table-cell">${info.area} ${info.city}</div>
         </div>
-        <h1>1.项目摘要</h1>
-        <div>
-            <div class="table-box min-6">
-                <div class="table-row">
-                    <div class="table-cell table-first-cell">地区</div>
-                    <div class="table-cell">{{info.area}} {{info.city}}</div>
-                </div>
-                <div class="table-row">
-                    <div class="table-cell table-first-cell">招标代理机构</div>
-                    <div class="table-cell">甘肃中采国际招标有限公司</div>
-                </div>
-                <div class="table-row">
-                    <div class="table-cell table-first-cell">采购单位</div>
-                    <div class="table-cell">{{info.buyer}}</div>
-                </div>
-                <div class="table-row">
-                    <div class="table-cell table-first-cell">采购联系人</div>
-                    <div class="table-cell">张老师</div>
-                </div>
-                <div class="table-row">
-                    <div class="table-cell table-first-cell">采购电话</div>
-                    <div class="table-cell">0931-7971540</div>
-                </div>
-            </div>
+        <div class="table-row">
+          <div class="table-cell table-first-cell">招标代理机构</div>
+          <div class="table-cell">甘肃中采国际招标有限公司</div>
         </div>
-        <h1>2.项目进展</h1>
-        <div>
-            <div class="table-box type-2">
-                <div class="table-row table-header">
-                    <div class="table-cell">时间</div>
-                    <div class="table-cell">公告类别</div>
-                    <div class="table-cell">公告标题</div>
-                </div>
-                <div class="table-row" v-for="(item, i) in info.tableList" :key="i">
-                    <div class="table-cell table-first-cell">{{item.l_publishtime | dateFormat}}</div>
-                    <div class="table-cell">{{item.s_subtype}}</div>
-                    <div class="table-cell">{{item.s_title}}</div>
-                </div>
-            </div>
+        <div class="table-row">
+          <div class="table-cell table-first-cell">采购单位</div>
+          <div class="table-cell">${info.buyer}</div>
         </div>
-        <h1>3.公告内容</h1>
-        <div>
-            <h2>3.1 西北师范大学计算机科学与工程学院本科专业工程教育认证管理软件项目</h2>
-            <p>剑鱼标讯地址:XXXXX</p>
-            <p>公告原文:</p>
+        <div class="table-row">
+          <div class="table-cell table-first-cell">采购联系人</div>
+          <div class="table-cell">张老师</div>
         </div>
-        <div class="page-footer">
-            <div style="width: 100%;">
-                第<span name="now">1</span>页共<span name="total">3</span>页
-            </div>
+        <div class="table-row">
+          <div class="table-cell table-first-cell">采购电话</div>
+          <div class="table-cell">0931-7971540</div>
         </div>
+      </div>
     </div>
-    <div class="page" size="A4">
-        <div class="page-header">
-            <div class="flex-r-box">
-                <img src="./static/image/logo.png" alt="">
-                <a href="/">www.jianyu360.cn</a>
-            </div>
-        </div>
-        <div class="com-detail" v-for="(item, i) in info.detailList" :key="i">
-            <div v-html="item.s_detail"></div>
-        </div>
-        <div class="page-footer">
-            <div style="width: 100%;">
-                第<span name="now">1</span>页共<span name="total">3</span>页
-            </div>
-        </div>
+    <h1>2.项目进展</h1>
+    <div class="table-row table-header">
+      <div class="table-cell">时间</div>
+      <div class="table-cell">公告类别</div>
+      <div class="table-cell">公告标题</div>
+    </div>
+    <div class="table-row" v-for="(item, i) in info.tableList" :key="i">
+      <div class="table-cell table-first-cell">${item.l_publishtime | dateFormat}</div>
+      <div class="table-cell">${item.s_subtype}</div>
+      <div class="table-cell">${item.s_title}</div>
     </div>
+    <h1>3.公告内容</h1>
+    <div class="active-content" v-for="(item, i) in info.detailList" :key="i">
+      <h2>3.${i + 1} ${item.s_title}</h2>
+      <p>剑鱼标讯地址:<a href="item.s_jyHref">${item.s_jyHref}</a></p>
+      <p>公告原文:</p>
+      <div class="com-detail">
+        <div v-html="item.s_detail"></div>
+      </div>
+    </div>
+  </div>
 </div>
 
-
+<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
 <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.11/vue.min.js"></script>
 <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
 <script>
-function dateTime(date, fmt) {
-        if (fmt === void 0) {
-            fmt = 'yyyy年MM月dd日 hh:mm';
-        }
+  function changePage () {
+    var i = 2
+    var cH = 1360
+    var cP = 140
 
-        // 时间戳转换
-        if (!date) return '';
-        var d = new Date(date);
-        var o = {
-            "M+": d.getMonth() + 1,
-            //月份
-            "d+": d.getDate(),
-            //日
-            "h+": d.getHours(),
-            //小时
-            "m+": d.getMinutes(),
-            //分
-            "s+": d.getSeconds() //秒
+    function changeTop (el) {
 
-        }; // 根据y的长度来截取年
+      var allChilds = $(el).children()
+      var hasChild = allChilds.length
+      if (hasChild) {
+        for (let i = 0; i < hasChild; i++) {
+          var firstNode = $(el).children().get(i)
+          changeTop(firstNode)
+        }
+      } else {
+        var nowTop = $(el).offset().top + $(el).outerHeight()
+        var maxY = (cH * i) - cP
+        var canChange = nowTop >= maxY
+        var diffY = (cH * i) - $(el).offset().top + 20
 
-        if (/(y+)/.test(fmt)) {
-            fmt = fmt.replace(RegExp.$1, (d.getFullYear() + "").substr(4 - RegExp.$1.length));
-        }
 
-        for (var k in o) {
-            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
+
+        if (canChange) {
+
+          console.log(nowTop, diffY)
+          console.log($(el).position().top + $(el).outerHeight(), (cH * i) - $(el).position().top)
+
+          if ($(el).is($(el).parent().children().get(0))) {
+            $(el).parent().css('margin-top', cP + (diffY))
+          } else {
+            if ($(el).get(0).tagName === 'BR') {
+              $(el).before(`<div style="margin-top: ${cP + (diffY)}px"></div>`)
+            } else {
+              $(el).css('margin-top', cP + (diffY))
+            }
+          }
+          console.log($(el))
+          i++
         }
+        return canChange
+      }
+
+
+    }
+
+    function fixPage () {
+      var tempNode = '#report-content'
+      changeTop(tempNode)
+      var total = Math.ceil($(tempNode).outerHeight() / cH)
+      $(tempNode).css('min-height', total * cH)
+      for (let i = 0;i< total;i++) {
+        var f = $('#clone-template .page-footer').clone()
+        var h = $('#clone-template .page-header').clone()
+        $(h).css('top', cH * i)
+        $(f).css('top', cH * (i + 1) - 100)
+        $(f).find('span[name="now"]').text(i + 1)
+        $(f).find('span[name="total"]').text(total)
+        $(tempNode).append(f)
+        $(tempNode).prepend(h)
+      }
+    }
+    fixPage()
+    // var total = $(".page:not(.title-page)").length - 1
+    // $(".page .page-footer").each(function () {
+    //     $(this).find('span[name="now"]').text($(this).parents('.page').index())
+    //     $(this).find('span[name="total"]').text(total)
+    // })
+  }
 
-        return fmt;
+  function getParam (name) {
+    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
+    var r = window.location.search.substr(1).match(reg); //获取url中'?'符后的字符串并正则匹配
+
+    var context = '';
+    if (r != null) context = r[2];
+    // 释放变量
+    reg = null;
+    r = null;
+    return context == null || context == '' || context == 'undefined' ? '' : context;
+  }
+  function dateTime(date, fmt) {
+    if (fmt === void 0) {
+      fmt = 'yyyy年MM月dd日 hh:mm';
+    }
+
+    // 时间戳转换
+    if (!date) return '';
+    var d = new Date(date);
+    var o = {
+      "M+": d.getMonth() + 1,
+      //月份
+      "d+": d.getDate(),
+      //日
+      "h+": d.getHours(),
+      //小时
+      "m+": d.getMinutes(),
+      //分
+      "s+": d.getSeconds() //秒
+
+    }; // 根据y的长度来截取年
+
+    if (/(y+)/.test(fmt)) {
+      fmt = fmt.replace(RegExp.$1, (d.getFullYear() + "").substr(4 - RegExp.$1.length));
+    }
+
+    for (var k in o) {
+      if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
     }
-var report = new Vue({
+
+    return fmt;
+  }
+  var report = new Vue({
     el: '#report',
+    delimiters: ['${', '}'],
     data: function () {
-        return {
-            info: {},
-            nowDate: dateTime(new Date().getTime(), 'yyyy-MM-dd')
-        }
+      return {
+        info: {},
+        nowDate: dateTime(new Date().getTime(), 'yyyy-MM-dd')
+      }
     },
     filters: {
-        dateFormat: function (value) {
-            return dateTime(value, 'yyyy-MM-dd')
-        }
+      dateFormat: function (value) {
+        return dateTime(value, 'yyyy-MM-dd')
+      }
     },
     created: function () {
-        // this.getData()
-        this.getMockData()
+      // this.getData()
+      this.getMockData()
     },
     methods: {
-        renderHTML (res) {
-            console.log(res)
-            if (res && res.data) {
-                this.info = res.data
-            }
-        },
-        getMockData: function () {
-          this.renderHTML({
-              "error_code": 0,
-              "error_msg": "",
-              "data": {
-                  "area": "广东",
-                  "buyer": "广州市番禺区中心医院",
-                  "city": "广州市",
-                  "detailList": [
-                      {
-                          "s_detail": "广州市番禺区中心医院电冰箱采购计划     \t           \t\t\t\t\t\t\t\t\t一、采购人:广州市番禺区中心医院\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t二、采购项目编号:440113-201811-114528-0053\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t三、采购项目名称:电冰箱\t               \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t四、采购品目名称:电冰箱\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t五、采购预算金额(元):¥2,450.00\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t六、采购数量:1台\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t七、需求时间:\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t八、采购方式:协议采购\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t九、备案时间:2018-11-07\t\t\t\t\t\t\t\t\t\t            \t                      \t\t发布人:广州市番禺区中心医院                                 \t\t发布时间:2018年11月07日                           ",
-                          "s_jyHref": "https://jianyu360.com/article/content/ABCY2EBYTIoMD8sAnxhcHUJJzACHj1mZnB%2FKyhRODoneGhwBDNUCW8%3D.html",
-                          "s_title": "广州市番禺区中心医院电冰箱采购计划"
-                      }
-                  ],
-                  "projectcode": "440113-201811-114528-0053",
-                  "projectname": "广州市番禺区中心医院电冰箱",
-                  "tableList": [
-                      {
-                          "l_publishtime": 1541520000,
-                          "s_subtype": "预告",
-                          "s_title": "广州市番禺区中心医院电冰箱采购计划",
-                          "s_toptype": "预告"
-                      }
-                  ]
+      renderHTML (res) {
+        console.log(res)
+        if (res && res.data) {
+          this.info = res.data
+        }
+        this.$nextTick(function() {
+          changePage()
+        })
+      },
+      getMockData: function () {
+        this.renderHTML({
+          "error_code": 0,
+          "error_msg": "",
+          "data": {
+            "area": "广东",
+            "buyer": "广州市番禺区中心医院",
+            "city": "广州市",
+            "detailList": [
+              {
+                "s_detail": "广州市番禺区中心医院电冰箱采购计划     \t           \t\t\t\t\t\t\t\t\t一、采购人:广州市番禺区中心医院\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t二、采购项目编号:440113-201811-114528-0053\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t三、采购项目名称:电冰箱\t               \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t四、采购品目名称:电冰箱\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t五、采购预算金额(元):¥2,450.00\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t六、采购数量:1台\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t七、需求时间:\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t八、采购方式:协议采购\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t九、备案时间:2018-11-07\t\t\t\t\t\t\t\t\t\t            \t                      \t\t发布人:广州市番禺区中心医院                                 \t\t发布时间:2018年11月07日                           ",
+                "s_jyHref": "https://jianyu360.com/article/content/ABCY2EBYTIoMD8sAnxhcHUJJzACHj1mZnB%2FKyhRODoneGhwBDNUCW8%3D.html",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划"
+              },
+              {
+                "s_detail": "广州市番禺区中心医院电冰箱采购计划     \t           \t\t\t\t\t\t\t\t\t一、采购人:广州市番禺区中心医院\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t二、采购项目编号:440113-201811-114528-0053\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t三、采购项目名称:电冰箱\t               \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t四、采购品目名称:电冰箱\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t五、采购预算金额(元):¥2,450.00\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t六、采购数量:1台\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t七、需求时间:\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t八、采购方式:协议采购\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t九、备案时间:2018-11-07\t\t\t\t\t\t\t\t\t\t            \t                      \t\t发布人:广州市番禺区中心医院                                 \t\t发布时间:2018年11月07日                           ",
+                "s_jyHref": "https://jianyu360.com/article/content/ABCY2EBYTIoMD8sAnxhcHUJJzACHj1mZnB%2FKyhRODoneGhwBDNUCW8%3D.html",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划"
+              },
+              {
+                "s_detail": "广州市番禺区中心医院电冰箱采购计划     \t           \t\t\t\t\t\t\t\t\t一、采购人:广州市番禺区中心医院\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t二、采购项目编号:440113-201811-114528-0053\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t三、采购项目名称:电冰箱\t               \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t四、采购品目名称:电冰箱\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t五、采购预算金额(元):¥2,450.00\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t六、采购数量:1台\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t七、需求时间:\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t八、采购方式:协议采购\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t九、备案时间:2018-11-07\t\t\t\t\t\t\t\t\t\t            \t                      \t\t发布人:广州市番禺区中心医院                                 \t\t发布时间:2018年11月07日                           ",
+                "s_jyHref": "https://jianyu360.com/article/content/ABCY2EBYTIoMD8sAnxhcHUJJzACHj1mZnB%2FKyhRODoneGhwBDNUCW8%3D.html",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划"
+              },
+              {
+                "s_detail": "广州市番禺区中心医院电冰箱采购计划     \t           \t\t\t\t\t\t\t\t\t一、采购人:广州市番禺区中心医院\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t二、采购项目编号:440113-201811-114528-0053\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t三、采购项目名称:电冰箱\t               \t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t四、采购品目名称:电冰箱\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t五、采购预算金额(元):¥2,450.00\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t六、采购数量:1台\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t七、需求时间:\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t八、采购方式:协议采购\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t九、备案时间:2018-11-07\t\t\t\t\t\t\t\t\t\t            \t                      \t\t发布人:广州市番禺区中心医院                                 \t\t发布时间:2018年11月07日                           ",
+                "s_jyHref": "https://jianyu360.com/article/content/ABCY2EBYTIoMD8sAnxhcHUJJzACHj1mZnB%2FKyhRODoneGhwBDNUCW8%3D.html",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划"
               }
-          })
-        },
-        getData: function () {
-            var baseURL = 'http://192.168.20.182:814/bigmember//project/getPdfDetail?pid='
-            var pId = '5be2ada3a5cb26b9b718afb9'
-            axios.get(baseURL + pId).then(function (res) {
-                this.renderHTML(res)
-            })
-        }
+            ],
+            "projectcode": "440113-201811-114528-0053",
+            "projectname": "广州市番禺区中心医院电冰箱",
+            "tableList": [
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              },
+              {
+                "l_publishtime": 1541520000,
+                "s_subtype": "预告",
+                "s_title": "广州市番禺区中心医院电冰箱采购计划",
+                "s_toptype": "预告"
+              }
+            ]
+          }
+        })
+      },
+      getData: function () {
+        var baseURL = '/bigmember/project/getPdfDetail?pid='
+        var pId = getParam('pid') || '613854ab1a75b8f4466c6017'
+        axios.get(baseURL + pId).then(function (res) {
+          this.renderHTML(res.data)
+        }.bind(this))
+      }
     }
-})
+  })
 </script>
 </body>
 </html>

二進制
web/pdf-files/demo.pdf