From 563c60ab9d465e275bf18b57fde7b51c4bc020da Mon Sep 17 00:00:00 2001 From: zuozhengqing <a13193816592@163.com> Date: 星期三, 29 十一月 2023 15:32:56 +0800 Subject: [PATCH] 出入库明细单打印功能调整,新引入三方库:html2Canvas,jsPdf,vue-office --- src/views/overview/AddOverviewDialog.vue | 17 + src/router/product/index.js | 9 + package-lock.json | 222 +++++++++++++++++++++++++++++++ src/views/reportForm/inboundOutboundDetail/index.vue | 16 + package.json | 4 src/views/reportForm/outboundDetail/index.vue | 23 ++- src/views/overview/previewExcel.vue | 101 ++++++++++++++ 7 files changed, 370 insertions(+), 22 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7686237..979de2c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,13 +8,18 @@ "name": "crm-web", "version": "0.1.0", "dependencies": { + "@vue-office/excel": "^1.4.7", "axios": "^1.4.0", "core-js": "^3.8.3", "docx-preview": "^0.1.18", "downloadjs": "^1.4.7", "element-ui": "^2.15.13", + "html2canvas": "^1.4.1", "js-cookie": "^3.0.5", + "jspdf": "^2.5.1", "vue": "^2.6.14", + "vue-cropper": "^0.6.4", + "vue-demi": "^0.13.11", "vue-router": "^3.5.1", "vuex": "^3.6.2" }, @@ -1749,7 +1754,6 @@ "version": "7.22.10", "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.22.10.tgz", "integrity": "sha512-21t/fkKLMZI4pqP2wlmsQAWnYW1PDyKyyUV4vCi+B25ydmdaYTKXPwCj0BzSUnZf4seIiYvSA3jcZ3gdsMFkLQ==", - "dev": true, "dependencies": { "regenerator-runtime": "^0.14.0" }, @@ -2295,6 +2299,12 @@ "integrity": "sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==", "dev": true }, + "node_modules/@types/raf": { + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.3.tgz", + "integrity": "sha512-c4YAvMedbPZ5tEyxzQdMoOhhJ4RD3rngZIdwC2/qDN3d7JpEhB6fiBRKVY1lg5B7Wk+uPBjn5f39j1/2MY1oOw==", + "optional": true + }, "node_modules/@types/range-parser": { "version": "1.2.4", "resolved": "https://registry.npmmirror.com/@types/range-parser/-/range-parser-1.2.4.tgz", @@ -2353,6 +2363,22 @@ "dev": true, "dependencies": { "@types/node": "*" + } + }, + "node_modules/@vue-office/excel": { + "version": "1.4.7", + "resolved": "https://registry.npmjs.org/@vue-office/excel/-/excel-1.4.7.tgz", + "integrity": "sha512-ouwgxE0tDp9amNx/itQLNmWIi9EmRpEJZ64YWOIuN65InYu+77qU6xi13iJvt1wvwtfQ3GN7aNUqWzMU8KLOjg==", + "hasInstallScript": true, + "peerDependencies": { + "@vue/composition-api": "^1.7.1", + "vue": "^2.0.0 || >=3.0.0", + "vue-demi": "^0.13.11" + }, + "peerDependenciesMeta": { + "@vue/composition-api": { + "optional": true + } } }, "node_modules/@vue/babel-helper-vue-jsx-merge-props": { @@ -3427,6 +3453,17 @@ "node": ">= 4.0.0" } }, + "node_modules/atob": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz", + "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==", + "bin": { + "atob": "bin/atob.js" + }, + "engines": { + "node": ">= 4.5.0" + } + }, "node_modules/autoprefixer": { "version": "10.4.15", "resolved": "https://registry.npmmirror.com/autoprefixer/-/autoprefixer-10.4.15.tgz", @@ -3572,6 +3609,14 @@ "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz", "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", "dev": true + }, + "node_modules/base64-arraybuffer": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz", + "integrity": "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==", + "engines": { + "node": ">= 0.6.0" + } }, "node_modules/base64-js": { "version": "1.5.1", @@ -3726,6 +3771,17 @@ "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" } }, + "node_modules/btoa": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/btoa/-/btoa-1.2.1.tgz", + "integrity": "sha512-SB4/MIGlsiVkMcHmT+pSmIPoNDoHg+7cMzmt3Uxt628MTz2487DKSqK/fuhFBrkuqrYv5UCEnACpF4dTFNKc/g==", + "bin": { + "btoa": "bin/btoa.js" + }, + "engines": { + "node": ">= 0.4.0" + } + }, "node_modules/buffer": { "version": "5.7.1", "resolved": "https://registry.npmmirror.com/buffer/-/buffer-5.7.1.tgz", @@ -3806,6 +3862,31 @@ "resolved": "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001522.tgz", "integrity": "sha512-TKiyTVZxJGhsTszLuzb+6vUZSjVOAhClszBr2Ta2k9IwtNBT/4dzmL6aywt0HCgEZlmwJzXJd8yNiob6HgwTRg==", "dev": true + }, + "node_modules/canvg": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.10.tgz", + "integrity": "sha512-qwR2FRNO9NlzTeKIPIKpnTY6fqwuYSequ8Ru8c0YkYU7U0oW+hLUvWadLvAu1Rl72OMNiFhoLu4f8eUjQ7l/+Q==", + "optional": true, + "dependencies": { + "@babel/runtime": "^7.12.5", + "@types/raf": "^3.4.0", + "core-js": "^3.8.3", + "raf": "^3.4.1", + "regenerator-runtime": "^0.13.7", + "rgbcolor": "^1.0.1", + "stackblur-canvas": "^2.0.0", + "svg-pathdata": "^6.0.3" + }, + "engines": { + "node": ">=10.0.0" + } + }, + "node_modules/canvg/node_modules/regenerator-runtime": { + "version": "0.13.11", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==", + "optional": true }, "node_modules/case-sensitive-paths-webpack-plugin": { "version": "2.4.0", @@ -4345,6 +4426,14 @@ }, "peerDependencies": { "postcss": "^8.0.9" + } + }, + "node_modules/css-line-break": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-2.1.0.tgz", + "integrity": "sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w==", + "dependencies": { + "utrie": "^1.0.2" } }, "node_modules/css-loader": { @@ -4926,6 +5015,12 @@ "engines": { "node": ">= 4" } + }, + "node_modules/dompurify": { + "version": "2.4.7", + "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-2.4.7.tgz", + "integrity": "sha512-kxxKlPEDa6Nc5WJi+qRgPbOAbgTpSULL+vI3NUXsZMlkJxTqYI9wg5ZTay2sFrdZRWHPWNi+EdAhcJf81WtoMQ==", + "optional": true }, "node_modules/domutils": { "version": "2.8.0", @@ -5894,6 +5989,11 @@ "node": ">=0.8.0" } }, + "node_modules/fflate": { + "version": "0.4.8", + "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.4.8.tgz", + "integrity": "sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA==" + }, "node_modules/figures": { "version": "2.0.0", "resolved": "https://registry.npmmirror.com/figures/-/figures-2.0.0.tgz", @@ -6421,6 +6521,18 @@ }, "peerDependencies": { "webpack": "^5.20.0" + } + }, + "node_modules/html2canvas": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.4.1.tgz", + "integrity": "sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA==", + "dependencies": { + "css-line-break": "^2.1.0", + "text-segmentation": "^1.0.3" + }, + "engines": { + "node": ">=8.0.0" } }, "node_modules/htmlparser2": { @@ -6960,6 +7072,23 @@ }, "optionalDependencies": { "graceful-fs": "^4.1.6" + } + }, + "node_modules/jspdf": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/jspdf/-/jspdf-2.5.1.tgz", + "integrity": "sha512-hXObxz7ZqoyhxET78+XR34Xu2qFGrJJ2I2bE5w4SM8eFaFEkW2xcGRVUss360fYelwRSid/jT078kbNvmoW0QA==", + "dependencies": { + "@babel/runtime": "^7.14.0", + "atob": "^2.1.2", + "btoa": "^1.2.1", + "fflate": "^0.4.8" + }, + "optionalDependencies": { + "canvg": "^3.0.6", + "core-js": "^3.6.0", + "dompurify": "^2.2.0", + "html2canvas": "^1.0.0-rc.5" } }, "node_modules/jszip": { @@ -8522,6 +8651,12 @@ "node": ">=8" } }, + "node_modules/performance-now": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", + "integrity": "sha512-7EAHlyLHI56VEIdK57uwHdHKIaAGbnXPiw0yWbarQZOKaKpvUIgW0jWRVLiatnM+XXlSwsanIBH/hzGMJulMow==", + "optional": true + }, "node_modules/picocolors": { "version": "1.0.0", "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.0.0.tgz", @@ -9260,6 +9395,15 @@ "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", "dev": true }, + "node_modules/raf": { + "version": "3.4.1", + "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz", + "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==", + "optional": true, + "dependencies": { + "performance-now": "^2.1.0" + } + }, "node_modules/randombytes": { "version": "2.1.0", "resolved": "https://registry.npmmirror.com/randombytes/-/randombytes-2.1.0.tgz", @@ -9387,8 +9531,7 @@ "node_modules/regenerator-runtime": { "version": "0.14.0", "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz", - "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==", - "dev": true + "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==" }, "node_modules/regenerator-transform": { "version": "0.15.2", @@ -9557,6 +9700,15 @@ "resolved": "https://registry.npmmirror.com/rfdc/-/rfdc-1.3.0.tgz", "integrity": "sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==", "dev": true + }, + "node_modules/rgbcolor": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/rgbcolor/-/rgbcolor-1.0.1.tgz", + "integrity": "sha512-9aZLIrhRaD97sgVhtJOW6ckOEh6/GnvQtdVNfdZ6s67+3/XwLS9lBcQYzEEhYVeUowN7pRzMLsyGhK2i/xvWbw==", + "optional": true, + "engines": { + "node": ">= 0.8.15" + } }, "node_modules/rimraf": { "version": "3.0.2", @@ -10103,6 +10255,15 @@ "deprecated": "Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility", "dev": true }, + "node_modules/stackblur-canvas": { + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/stackblur-canvas/-/stackblur-canvas-2.6.0.tgz", + "integrity": "sha512-8S1aIA+UoF6erJYnglGPug6MaHYGo1Ot7h5fuXx4fUPvcvQfcdw2o/ppCse63+eZf8PPidSu4v1JnmEVtEDnpg==", + "optional": true, + "engines": { + "node": ">=0.1.14" + } + }, "node_modules/stackframe": { "version": "1.3.4", "resolved": "https://registry.npmmirror.com/stackframe/-/stackframe-1.3.4.tgz", @@ -10247,6 +10408,15 @@ "dev": true, "engines": { "node": ">= 0.4" + } + }, + "node_modules/svg-pathdata": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/svg-pathdata/-/svg-pathdata-6.0.3.tgz", + "integrity": "sha512-qsjeeq5YjBZ5eMdFuUa4ZosMLxgr5RZ+F+Y1OrDhuOCEInRMA3x74XdBtggJcj9kOeInz0WE+LgCPDkZFlBYJw==", + "optional": true, + "engines": { + "node": ">=12.0.0" } }, "node_modules/svg-tags": { @@ -10439,6 +10609,14 @@ "resolved": "https://registry.npmmirror.com/commander/-/commander-2.20.3.tgz", "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==", "dev": true + }, + "node_modules/text-segmentation": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/text-segmentation/-/text-segmentation-1.0.3.tgz", + "integrity": "sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw==", + "dependencies": { + "utrie": "^1.0.2" + } }, "node_modules/text-table": { "version": "0.2.0", @@ -10722,6 +10900,14 @@ "node": ">= 0.4.0" } }, + "node_modules/utrie": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/utrie/-/utrie-1.0.2.tgz", + "integrity": "sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==", + "dependencies": { + "base64-arraybuffer": "^1.0.2" + } + }, "node_modules/uuid": { "version": "8.3.2", "resolved": "https://registry.npmmirror.com/uuid/-/uuid-8.3.2.tgz", @@ -10765,6 +10951,36 @@ "csstype": "^3.1.0" } }, + "node_modules/vue-cropper": { + "version": "0.6.4", + "resolved": "https://registry.npmjs.org/vue-cropper/-/vue-cropper-0.6.4.tgz", + "integrity": "sha512-U3bm17Li/Xwfw2t3pr8/hFE/tYhvwIWqepHK9IFC1TnX1KFd64VyfCD9nMBhPY91RyvMC6jSQgT/DyDNKuTpIQ==" + }, + "node_modules/vue-demi": { + "version": "0.13.11", + "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.13.11.tgz", + "integrity": "sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==", + "hasInstallScript": true, + "bin": { + "vue-demi-fix": "bin/vue-demi-fix.js", + "vue-demi-switch": "bin/vue-demi-switch.js" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/antfu" + }, + "peerDependencies": { + "@vue/composition-api": "^1.0.0-rc.1", + "vue": "^3.0.0-0 || ^2.6.0" + }, + "peerDependenciesMeta": { + "@vue/composition-api": { + "optional": true + } + } + }, "node_modules/vue-eslint-parser": { "version": "8.3.0", "resolved": "https://registry.npmmirror.com/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz", diff --git a/package.json b/package.json index 5b40fc3..4799391 100644 --- a/package.json +++ b/package.json @@ -10,14 +10,18 @@ "test:unit": "vue-cli-service test:unit" }, "dependencies": { + "@vue-office/excel": "^1.4.7", "axios": "^1.4.0", "core-js": "^3.8.3", "docx-preview": "^0.1.18", "downloadjs": "^1.4.7", "element-ui": "^2.15.13", + "html2canvas": "^1.4.1", "js-cookie": "^3.0.5", + "jspdf": "^2.5.1", "vue": "^2.6.14", "vue-cropper": "^0.6.4", + "vue-demi": "^0.13.11", "vue-router": "^3.5.1", "vuex": "^3.6.2" }, diff --git a/src/router/product/index.js b/src/router/product/index.js index 61dafed..ffbae30 100644 --- a/src/router/product/index.js +++ b/src/router/product/index.js @@ -6,6 +6,7 @@ const productCategory = (resolve) => require(["@/views/productManage/productCategory/index"], resolve) // 浜у搧绫诲埆 const productList = (resolve) => require(["@/views/productManage/productCategory/ProductList"], resolve) // 浜у搧绫诲埆-浜у搧 const overviewList = (resolve) => require(["@/views/overview/OverviewListView"], resolve) // 姒傝堪-浜у搧鍒楄〃 +const previewExcel = (resolve) => require(["@/views/overview/previewExcel"], resolve) // 姒傝堪-浜у搧鍒楄〃 const reorderRules = (resolve) => require(["@/views/productManage/reorderRules/index"], resolve) // 閲嶈璐ц鍒� const appconfig = [ @@ -58,6 +59,14 @@ } }, { + path: "/overview/previewExcel", + name: "previewExcel", + component: previewExcel, + meta: { + title: "棰勮Excel" + } + }, + { path: "/productManage/reorderRules", name: "reorderRules", component: reorderRules, diff --git a/src/views/overview/AddOverviewDialog.vue b/src/views/overview/AddOverviewDialog.vue index cb3b72c..50a1b04 100644 --- a/src/views/overview/AddOverviewDialog.vue +++ b/src/views/overview/AddOverviewDialog.vue @@ -902,11 +902,18 @@ await printReceipts(this.editCommonConfig.infomation.id).then((res) => { console.log(res) if (res.code === 200) { - this.$message.success("鎵撳嵃鎴愬姛") - const link = document.createElement('a'); - link.href = res.data; - link.download = '鍑哄簱鍗�.xlsx'; - link.click(); + // this.$message.success("鎵撳嵃鎴愬姛") + // const link = document.createElement('a'); + // link.href = res.data; + // link.download = '鍑哄簱鍗�.xlsx'; + // link.click(); + this.$router.push({ + name:"previewExcel", + params:{ + url:res.data, + baseOperationType:this.editConfig.infomation.baseOperationType||undefined, + } + }) } }) } diff --git a/src/views/overview/previewExcel.vue b/src/views/overview/previewExcel.vue new file mode 100644 index 0000000..07acb3b --- /dev/null +++ b/src/views/overview/previewExcel.vue @@ -0,0 +1,101 @@ +<template> + <div> + <div ref="elementToCrop" > + <div style="width: 100%;"> + <vue-office-excel :minRowLength="0" :src="excel" @rendered="rendered"/> + </div> + </div> + </div> +</template> + +<script> +import VueOfficeExcel from '@vue-office/excel' +import '@vue-office/excel/lib/index.css' +import html2canvas from "html2canvas"; +import jsPDF from "jspdf"; +export default { + name:"previewExcel", + props: { + }, + data() { + return { + excel: '',//excel鏂囨。鍦板潃 + cutWidth:200, + }; + }, + computed: { + }, + created() { + if(this.$route.params.baseOperationType!=undefined){ + this.excel=this.$route.params.url + if(this.this.$route.params.baseOperationType===1){ + this.cutWidth=200 + }else if(this.this.$route.params.baseOperationType===2){ + this.cutWidth=315 + } + } + }, + mounted() { + }, + watch: { + }, + methods: { + rendered(){ + console.log("娓叉煋瀹屾垚") + if(this.$route.params.baseOperationType!=undefined){ + this.excel=this.$route.params.url + this.cropAndDownload() + } + }, + async cropAndDownload() { + const elementToCrop = this.$refs.elementToCrop; + const canvas = await html2canvas(elementToCrop); + const croppedCanvas = document.createElement("canvas"); + const croppedContext = croppedCanvas.getContext("2d"); + croppedCanvas.width = canvas.width - this.cutWidth; // 鍘绘帀宸﹀彸鍚�100px + croppedCanvas.height = canvas.height - 100; // 鍘绘帀涓婁笅鍚�100px + // 鍦ㄦ柊鐨凜anvas涓婄粯鍒惰鍓悗鐨勫浘鍍� + croppedContext.drawImage( + canvas, + 50, // 寮�濮嬭鍓殑宸︿晶浣嶇疆 + 20, // 寮�濮嬭鍓殑涓婁晶浣嶇疆 + croppedCanvas.width, // 瑁佸壀鍚庣殑瀹藉害 + croppedCanvas.height-300, // 瑁佸壀鍚庣殑楂樺害 + 0, // 鏂癈anvas涓粯鍒剁殑宸︿晶浣嶇疆 + 0, // 鏂癈anvas涓粯鍒剁殑涓婁晶浣嶇疆 + croppedCanvas.width, // 鏂癈anvas涓粯鍒剁殑瀹藉害 + croppedCanvas.height // 鏂癈anvas涓粯鍒剁殑楂樺害 + ); + // 灏嗚鍓悗鐨凜anvas杞崲涓篋ataURL + const croppedImage = croppedCanvas.toDataURL("image/png"); + // 鏇存柊鏁版嵁锛屼互鍦ㄩ〉闈笂鏄剧ず瑁佸壀鍚庣殑鍥剧墖 + this.croppedImage = croppedImage; + // 鍒涘缓PDF鏂囨。 + const pdf = new jsPDF({ + unit:"mm", + format:"a4" + }); + // A4 + const a4Width = 210; + const a4Height = 297; + // 璁$畻缂╂斁姣斾緥锛岀‘淇漜anvas绛夋瘮渚嬬缉鏀鹃�傚簲A4绾� + const scale = Math.min(a4Width / canvas.width, a4Height / canvas.height); + // 璁$畻缂╂斁鍚庣殑瀹介珮 + const scaledWidth = canvas.width * scale; + const scaledHeight = canvas.height * scale; + // 灏哻anvas鍏冪礌杞崲涓簆ng锛屾彃鍏ュ埌PDF鏂囨。涓� + pdf.addImage(croppedImage, "PNG",0,0,scaledWidth,scaledHeight); + // 淇濆瓨PDF鏂囨。 + pdf.save("export.pdf"); + }, + }, + components: { + VueOfficeExcel, + }, +}; +</script> +<style scoped lang="scss"> +.vue-office-excel{ + height: 1000px; +} +</style> diff --git a/src/views/reportForm/inboundOutboundDetail/index.vue b/src/views/reportForm/inboundOutboundDetail/index.vue index f75ab04..fa95d2b 100644 --- a/src/views/reportForm/inboundOutboundDetail/index.vue +++ b/src/views/reportForm/inboundOutboundDetail/index.vue @@ -211,15 +211,17 @@ page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize }).then((res) => { - if (res.code === 200) { + if (res.code === 200&&res.data) { res.data.map((item)=>{ let dateObject = new Date(item.date); let formattedDateString = dateObject.toISOString().split('T')[0]; item.date=formattedDateString }) - this.tableList.tableInfomation = res.data - this.pagerOptions.totalCount = res.total + this.tableList.tableInfomation = res.data||[] + }else{ + this.tableList.tableInfomation = res.data||[] } + this.pagerOptions.totalCount = res.total }) } else { await getHistory({ @@ -228,7 +230,7 @@ page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize }).then((res) => { - if (res.code === 200) { + if (res.code === 200&&res.data) { res.data.map((item)=>{ if(item.status===""){ item.status=4 @@ -237,9 +239,11 @@ let formattedDateString = dateObject.toISOString().split('T')[0]; item.date=formattedDateString }) - this.tableList.tableInfomation = res.data?res.data:[] - this.pagerOptions.totalCount = res.total + this.tableList.tableInfomation = res.data||[] + }else{ + this.tableList.tableInfomation = res.data||[] } + this.pagerOptions.totalCount = res.total }) } }, diff --git a/src/views/reportForm/outboundDetail/index.vue b/src/views/reportForm/outboundDetail/index.vue index 7040834..e7c63ca 100644 --- a/src/views/reportForm/outboundDetail/index.vue +++ b/src/views/reportForm/outboundDetail/index.vue @@ -14,7 +14,7 @@ </div> </div> <!-- 缂栬緫 --> - <AddOverviewDialog v-if="editConfig.visible" :edit-common-config="editConfig" :add-name="this.$route.params.name" /> + <AddOverviewDialog :workType="workType" v-if="editConfig.visible" :edit-common-config="editConfig" :add-name="this.$route.params.name" /> </div> </template> @@ -23,7 +23,9 @@ import { getHistory,getOperationInfo } from "@/api/reportForm/inventoryRwport" // import { getProductOperatonList } from "@/api/product/product" -import AddOverviewDialog from "@/views/reportForm/outboundDetail/AddOutboundDetailDialog.vue" +// import AddOverviewDialog from "@/views/reportForm/outboundDetail/AddOutboundDetailDialog.vue" +import AddOverviewDialog from "@/views/overview/AddOverviewDialog" + import { getDataByType } from "@/api/data" export default { name: "outboundDetail", @@ -33,6 +35,7 @@ computed: {}, data() { return { + workType:2, tableList: {}, showcol: ["鐘舵��"], searchOptions: [], @@ -196,15 +199,17 @@ page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize }).then((res) => { - if (res.code === 200) { + if (res.code === 200&&res.data) { res.data.map((item) => { let dateObject = new Date(item.date); let formattedDateString = dateObject.toISOString().split('T')[0]; item.date = formattedDateString }) - this.tableList.tableInfomation = res.data - this.pagerOptions.totalCount = res.total + this.tableList.tableInfomation = res.data||[] + }else{ + this.tableList.tableInfomation = res.data||[] } + this.pagerOptions.totalCount = res.total }) } else { await getHistory({ @@ -213,7 +218,7 @@ page: this.pagerOptions.currPage, pageSize: this.pagerOptions.pageSize }).then((res) => { - if (res.code === 200) { + if (res.code === 200&&res.data) { res.data.map((item) => { if(item.status===""){ item.status=4 @@ -222,9 +227,11 @@ let formattedDateString = dateObject.toISOString().split('T')[0]; item.date = formattedDateString }) - this.tableList.tableInfomation = res.data ? res.data : [] - this.pagerOptions.totalCount = res.total + this.tableList.tableInfomation = res.data || [] + }else{ + this.tableList.tableInfomation = res.data || [] } + this.pagerOptions.totalCount = res.total }) } }, -- Gitblit v1.8.0