@toolspack/ttd-pdfjs 0.0.1 → 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@toolspack/ttd-pdfjs",
3
- "version": "0.0.1",
3
+ "version": "0.0.2",
4
4
  "private": false,
5
5
  "main": "lib/ttd-pdfjs.umd.min.js",
6
6
  "scripts": {
@@ -14,9 +14,10 @@
14
14
  "babel-laoder": "0.0.1-security",
15
15
  "babel-polyfill": "^6.26.0",
16
16
  "core-js": "^3.6.5",
17
+ "element-ui": "^2.15.14",
17
18
  "less": "^3.8.1",
18
19
  "less-loader": "^4.1.0",
19
- "pdfjs-dist": "2.16.105",
20
+ "pdfjs-dist": "3.11.174",
20
21
  "vue": "^2.6.12"
21
22
  },
22
23
  "devDependencies": {
@@ -26,6 +27,7 @@
26
27
  "@vue/cli-service": "~4.5.0",
27
28
  "@vue/eslint-config-airbnb": "^5.3.0",
28
29
  "babel-eslint": "^10.1.0",
30
+ "babel-plugin-component": "^1.1.1",
29
31
  "babel-preset-es2015": "^6.24.1",
30
32
  "eslint": "^6.7.2",
31
33
  "eslint-plugin-import": "^2.22.1",
package/src/App.vue CHANGED
@@ -1,11 +1,26 @@
1
1
  <template>
2
2
  <div id="app">
3
- <form id="myForm" @submit.prevent="uploadFile">
4
- <label for="">请上传:</label>
5
- <input type="file" ref="fileInput" multiple name="files"><br>
6
- <input type="hidden" name="bucketName" :value="uName">
7
- <input type="submit" value="提交">
8
- </form>
3
+ <!-- <el-upload
4
+ ref="baseUpload"
5
+ :show-file-list="false"
6
+ :accept="accept"
7
+ name="files"
8
+ :action="actionInner"
9
+ :on-success="handleAvatarSuccess"
10
+ :on-progress="handelProgress"
11
+ :before-upload="beforeAvatarUpload"
12
+ :headers="uploadHeader()"
13
+ :data="uploadData"
14
+ :on-exceed="onExceed"
15
+ :disabled="disabled"
16
+ list-type="text"
17
+ :multiple="multiple"
18
+ :limit="limit"
19
+ >
20
+ <template slot="trigger">
21
+ <slot></slot>
22
+ </template>
23
+ </el-upload> -->
9
24
  <PdfView :pdfurl="url" />
10
25
  </div>
11
26
  </template>
@@ -20,7 +35,7 @@ export default {
20
35
  name: 'App',
21
36
  data() {
22
37
  return {
23
- url: 'https://petx.totodi.com/visit/totodi-contract/20230905-e777d0d33a6f440db4b5276b397121fd-无法翻页-40.pdf?expireDataTime=1693900521328',
38
+ url: 'https://petx.totodi.com/visit/totodi-contract/20231218-d5c012c049fd4dfabd974d24a5304166-无法显示--风险揭示书.pdf?expireDataTime=1702871246572',
24
39
  uName: 'totodi-contract',
25
40
  action: `${_baseUrl}zuul/file-service/oos/uploadFile`,
26
41
  }
package/src/main.js CHANGED
@@ -1,8 +1,12 @@
1
1
  import Vue from 'vue';
2
+ import { Button, Input } from 'element-ui';
2
3
  import App from './App.vue';
3
4
 
4
5
  Vue.config.productionTip = false;
5
6
 
7
+ Vue.component(Button.name, Button);
8
+ Vue.component(Input.name, Input);
9
+
6
10
  new Vue({
7
11
  render: (h) => h(App),
8
12
  }).$mount('#app');
@@ -26,13 +26,16 @@
26
26
  </template>
27
27
  <script>
28
28
 
29
+ import SwitchPage from './SwitchPage.vue'
30
+
29
31
  const PDFJS = require('pdfjs-dist')
30
32
 
31
33
  const defautScale = 1.0
32
34
 
33
- PDFJS.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/legacy/build/pdf.worker.entry')
35
+ PDFJS.GlobalWorkerOptions.workerSrc = require('pdfjs-dist/build/pdf.worker.js')
34
36
 
35
37
  export default {
38
+ components: { SwitchPage },
36
39
  props: {
37
40
  pdfurl: {
38
41
  default: '',
@@ -0,0 +1,79 @@
1
+ <template lang="html">
2
+ <div class="switch-page">
3
+ <el-button size="mini" @click="switchPage('prev')"><i class="el-icon-caret-left"></i></el-button>
4
+ <el-button size="mini" @click="switchPage('next')"><i class="el-icon-caret-right"></i></el-button>
5
+ <span style="margin-left: 10px;">{{page}}/{{numPages}}</span>
6
+ <span style="margin-left: 6px">
7
+ 跳转至
8
+ <el-input v-model.number="itemPage" style="width: 50px;margin: 0 4px" size="mini" @keyup.native.enter="goPage"></el-input>
9
+
10
+ </span>
11
+ </div>
12
+ </template>
13
+
14
+ <script>
15
+ export default {
16
+ name: 'switch-page',
17
+ props: {
18
+ numPages: {
19
+ type: [Number, String],
20
+ },
21
+ },
22
+ data() {
23
+ return {
24
+ page: 1,
25
+ itemPage: '',
26
+ }
27
+ },
28
+ watch: {
29
+ numPages() {
30
+ this.page = 1
31
+ this.itemPage = ''
32
+ },
33
+ },
34
+ methods: {
35
+ switchPage(str) {
36
+ if (str === 'prev') {
37
+ if (this.page === 1) {
38
+ return
39
+ }
40
+ this.page--
41
+ }
42
+ if (str === 'next') {
43
+ if (this.page === this.numPages) {
44
+ this.$message({ message: '当前已是最后一页', type: 'warning' })
45
+ return
46
+ }
47
+ this.page++
48
+ }
49
+ this.$emit('page', this.page)
50
+ },
51
+ setPage(page = 1) {
52
+ this.page = page
53
+ },
54
+ goPage() {
55
+ if (this.itemPage > 0) {
56
+ if (this.itemPage >= this.numPages) {
57
+ this.page = this.numPages
58
+ this.itemPage = this.page
59
+ } else {
60
+ this.page = this.itemPage
61
+ }
62
+ this.$emit('page', this.page)
63
+ }
64
+ },
65
+ },
66
+ }
67
+ </script>
68
+
69
+ <style lang="css" scoped>
70
+ .switch-page {
71
+ margin: 0;
72
+ padding: 0;
73
+ overflow: auto;
74
+ }
75
+ .switch-page button {
76
+ font-size: 16px;
77
+ padding: 6px !important;
78
+ }
79
+ </style>