kun 19/10/14 11:20

2019-10-14 11:17:11 +08:00
parent 110cf5418f
commit a4c8a1e89a
9 changed files with 104 additions and 26 deletions
--- a/package.json
+++ b/package.json
@@ -12,6 +12,8 @@
    "axios": "^0.19.0",
    "core-js": "^2.6.5",
    "element-ui": "^2.12.0",
+    "html2canvas": "^1.0.0-rc.5",
+    "jspdf": "^1.5.3",
    "mavon-editor": "^2.7.6",
    "node-sass": "^4.12.0",
    "sass-loader": "^8.0.0",
--- a/src/components/FooterNav.vue
+++ b/src/components/FooterNav.vue
@@ -6,7 +6,7 @@
    </div>
    <div class="div2">
      <div class="img-box">
-        <img src="https://dummyimage.com/80" alt />
+        <img :src="imgUrl.wxtp0" alt />
        <p>微信公众号</p>
      </div>
      <div class="img-box">
@@ -14,7 +14,7 @@
        <p>微信公众号</p>
      </div>
      <div class="img-box">
-        <img src="https://dummyimage.com/80" alt />
+        <img :src="imgUrl.wxtp1" alt />
        <p>微信公众号</p>
      </div>
    </div>
@@ -29,7 +29,9 @@ export default {
    return {
      imgUrl: {
        foot: require('../../static/img/foot.png'),
-        foot1: require('../../static/img/foot1.png')
+        foot1: require('../../static/img/foot1.png'),
+        wxtp0: require('../../static/img/wxtp0.png'),
+        wxtp1: require('../../static/img/wxtp1.png')
      }
    }
  },
@@ -62,6 +64,8 @@ export default {
    margin-top: 34px;

    img {
+      width: 80px;
+      height: 80px;
      margin-bottom: 11px;
    }

--- a/src/htmlToPdf.js
+++ b/src/htmlToPdf.js
@@ -0,0 +1,35 @@
+import html2Canvas from 'html2canvas'
+import JsPDF from 'jspdf'
+export default {
+  install (Vue, options) {
+    Vue.prototype.getPdf = function (idStr, title) {
+      html2Canvas(document.querySelector('#' + idStr), {
+        allowTaint: true
+      }).then(function (canvas) {
+        let contentWidth = canvas.width
+        let contentHeight = canvas.height
+        let pageHeight = contentWidth / 592.28 * 841.89
+        let leftHeight = contentHeight
+        let position = 0
+        let imgWidth = 595.28
+        let imgHeight = 592.28 / contentWidth * contentHeight
+        let pageData = canvas.toDataURL('image/jpeg', 1.0)
+        let PDF = new JsPDF('', 'pt', 'a4')
+        if (leftHeight < pageHeight) {
+          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
+        } else {
+          while (leftHeight > 0) {
+            PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
+            leftHeight -= pageHeight
+            position -= 841.89
+            if (leftHeight > 0) {
+              PDF.addPage()
+            }
+          }
+        }
+        PDF.save(title + '.pdf')
+      }
+      )
+    }
+  }
+}
--- a/src/main.js
+++ b/src/main.js
@@ -8,6 +8,7 @@ import ElementUI from 'element-ui'
 import md5 from 'js-md5'
 import VueQuillEditor from 'vue-quill-editor'
 import mavonEditor from 'mavon-editor'
+import htmlToPdf from './htmlToPdf'

 import 'mavon-editor/dist/css/index.css'
 import 'quill/dist/quill.core.css'
@@ -33,6 +34,7 @@ Vue.prototype.$jParams = function (url, parameters) {
  })
 }

+Vue.use(htmlToPdf)
 Vue.use(mavonEditor)
 Vue.use(VueQuillEditor)
 Vue.use(ElementUI)
--- a/src/views/project/Application.vue
+++ b/src/views/project/Application.vue
@@ -113,7 +113,7 @@
            </div>
            <div>
              <label>传真电话:</label>
-              <input type="text" placeholder="非必填" name="fax_tel" v-model="fax_tel" value required />
+              <input type="text" placeholder="非必填" name="fax_tel" v-model="fax_tel" value />
            </div>
          </aside>
          <!-- end -->
@@ -200,7 +200,7 @@
              </div>
              <div>
                <label>传真电话:</label>
-                <input type="text" placeholder="非必填" name="respophone" v-model="respophone" value required />
+                <input type="text" placeholder="非必填" name="respophone" v-model="respophone" value />
              </div>
            </aside>
            <!-- end -->
@@ -348,12 +348,13 @@
                    <input type="file" @change="getFile($event)" v-show="false" name="file" />
                  </label>
                </div>
-                <span for>只能上传一张图片</span>
+                <span for>只能上传一张不同的图片</span>
              </div>
            </div>
          </div>
          <template v-if="file">
            <img class="img-img" :src="file" alt />
+            <!-- <iframe class="img-img"  frameborder="0" scrolling="no" marginheight="0" marginwidth="0" :src="src"></iframe> -->
          </template>
          <div class="ll">
            <button type="button" @click="btn(0)">上一页</button>
@@ -442,7 +443,8 @@ export default {
      funds: '',
      proimages: '',
      file: '',
-      subStatus: 0
+      subStatus: 0,
+      src: ''
    };
  },
  computed: {},
@@ -465,7 +467,7 @@ export default {
        this.sub = s
      }

-      this.sub = s
+      // this.sub = s

      if (s == 1) {
        if (this.name == '' || this.company == '' || this.tid == '' ||
@@ -486,7 +488,16 @@ export default {
    },
    /** 上传文件 */
    getFile(event) {
+      let _this = this
      let file = event.target.files[0];
+/*
+      let reader = new FileReader()
+      reader.readAsDataURL(file) // 这里是最关键的一步，转换就在这里
+      reader.onloadend = function () {
+        _this.src = this.result
+      }
+*/
+
      let param = new FormData(); //创建form对象
      param.append('file', file);//通过append向form对象添加数据
      // console.log(param.get('file')); //FormData私有类对象，访问不到，可以通过get判断值是否传进去
@@ -498,6 +509,7 @@ export default {
          let url = response.data.data.url
          this.file = url
        })
+      console.log(this.file)
    },
    /** 保存和提交 */
    submit(index) {
@@ -529,8 +541,8 @@ export default {
      s = index;
      this.subStatus = s
      this.proimages = this.file
-      if(this.proimages === ''){
-        alert('文件未上传！')
+      if (this.proimages === '') {
+        alert('文件还未上传！')
        return
      }
      let _this = this
@@ -591,7 +603,7 @@ export default {
      }).then(res => {
        if (res.data.code === 200) {
          alert(res.data.data.msg)
-          _this.file = ''
+          _this.proimages = ''
        } else {
          alert(res.data.message)
        }
@@ -669,7 +681,13 @@ export default {
  margin-top: 25px;
  width: 150px;
  height: 250px;
+
+  &::-webkit-scrollbar {
+    width: 0px;
+    height: 00x;
+  }
 }
+
 .wrapper {
  min-width: 1280px;
  box-sizing: border-box;
--- a/src/views/project/Project.vue
+++ b/src/views/project/Project.vue
@@ -5,9 +5,11 @@
      <!-- 公告 -->
      <div class="top">
        <img :src="imgUrl.xlb" alt />
-        <div v-if="bgValue.announcement.name == ''">
-          <span>{{bgValue.announcement.name + bgValue.announcement.pro_content}}</span>
-          <time>{{bgValue.announcement.protime}}</time>
+        <div v-if="cd !== 0">
+          <!-- <aside v-for="(list,index) in bgValue.announcement" :key="index"> -->
+          <span>{{bgValue.announcement[0].name + bgValue.announcement[0].pro_content}}</span>
+          <time>{{bgValue.announcement[0].protime}}</time>
+          <!-- </aside> -->
        </div>
        <div v-else>
          <span>暂无项目申报内容</span>
@@ -118,7 +120,10 @@
                  </dd>
                  <dd>
                    <span class="iconfont icon-shenhetongguo1"></span>
-                    <span class="block">当前申报阶段：{{item.status}}</span>
+                    <span class="block-k">
+                      <b>项目状态：</b>
+                      {{item.status}}
+                    </span>
                  </dd>
                </dl>
              </div>
@@ -178,7 +183,8 @@ export default {
      area_value: '全部',
      value_date: '',
      start_time: '',
-      end_time: ''
+      end_time: '',
+      cd: Number
    };
  },
  computed: {},
@@ -251,7 +257,9 @@ export default {
      }).then(res => {
        if (res.data.code === 200) {
          _this.bgValue = res.data.data
-          // console.log(_this.bgValue)
+
+          console.log(_this.bgValue)
+          _this.cd = _this.bgValue.announcement.length
        } else {
          _this.$message.error('请求数据有问题！')
        }
@@ -413,12 +421,16 @@ export default {
                  color: #666666;
                }

-                .block {
+                .block-k {
                  width: 288px;
                  height: 14px;
                  line-height: 14px;
                  display: inline-block;
                  overflow: hidden;
+
+                  b {
+                    font-weight: 900;
+                  }
                }
              }

--- a/src/views/project/Schedule.vue
+++ b/src/views/project/Schedule.vue
@@ -8,15 +8,15 @@
          <span @click="btn(0)" :class="sub == 0 ? 'style' : ''">项目进度</span>
          <span @click="btn(1)" :class="sub == 1 ? 'style' : ''">项目信息</span>
        </div>
-        <div class="daochu" v-if="sub == 1">项目导出</div>
+        <div class="daochu" v-if="sub == 1" @click="download()">项目导出</div>
      </div>
      <!-- 进度 -->
-      <div class="img" v-if="sub == 0">
+      <!-- <div class="img" v-if="sub == 0">
        <img :src="imgUrl.tg" v-if="state == 0" />
        <img :src="imgUrl.btg" v-if="state == 1" />
        <img :src="imgUrl.shz" v-if="state == 2" />
        <img :src="imgUrl.zxz" v-if="state == 3" />
-      </div>
+      </div> -->
      <!-- 项目流程 -->
      <div class="bobb" v-if="sub == 0">
        <div class="left">
@@ -66,7 +66,7 @@
              <!-- <section>
                <span style="color:#e60012;font-size:20px;">总分: 71分</span>
                <span style="color:#999;font-size:16px;">（及格分数: 70）</span>
-              </section> -->
+              </section>-->
            </div>
            <div>
              <span>立项评审中</span>
@@ -86,7 +86,7 @@
        </div>
      </div>
      <!-- 项目信息 -->
-      <div class="boxx" v-if="sub == 1" :class="popupStatus == true ? 'fliter' : ''">
+      <div class="boxx" v-if="sub == 1" :class="popupStatus == true ? 'fliter' : ''" id="pdfDom">
        <h3>一、基本信息</h3>
        <div class="one-o">
          <ul>
@@ -172,7 +172,7 @@
        </div>
        <h3>五、经费预算:</h3>
        <div class="one-e">
-          <p>{{zData.funds}}</p>
+          <p v-html="zData.funds">{{zData.funds}}</p>
        </div>
        <h3>六、申报单位承诺:</h3>
        <div class="one-e">
@@ -182,7 +182,9 @@
        <div class="one-e">
          <p>
            <span>
-              <span>下载</span>
+              <a :href="zData.proimages" download="fileName" target="_blank">
+                <span>下载</span>
+              </a>
              &nbsp;|&nbsp;
              <span @click="preview()">预览</span>
            </span>
@@ -192,7 +194,7 @@
      <section id="preview" v-if="popupStatus">
        <div class="tc" @click="preview()"></div>
        <!-- <section class="tc-text">{{zData.proimages}}</section> -->
-        <img  class="tc-text" :src="zData.proimages" />
+        <img class="tc-text" :src="zData.proimages" />
      </section>
    </div>
    <footer-nav class="footer" :class="popupStatus == true ? 'fliter' : ''"></footer-nav>
@@ -255,6 +257,9 @@ export default {
    }
  },
  methods: {
+    download() {
+      this.getPdf('pdfDom', '企业信用报告')
+    },
    preview() {
      this.popupStatus = !this.popupStatus
    },
--- a/static/img/wxtp0.png
+++ b/static/img/wxtp0.png
--- a/static/img/wxtp1.png
+++ b/static/img/wxtp1.png