| 1 |
- {"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\pages\\order\\print\\index.vue?vue&type=script&lang=js","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\pages\\order\\print\\index.vue","mtime":1761614939045},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\babel-loader\\lib\\index.js","mtime":1761614927320},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQppbXBvcnQgeyBkaXN0cmlidXRpb25PcmRlciB9IGZyb20gJ0AvYXBpL29yZGVyJzsNCmltcG9ydCBRUkNvZGUgZnJvbSAncXJjb2RlanMyJzsNCmltcG9ydCBTZXR0aW5nIGZyb20gJ0Avc2V0dGluZyc7DQpleHBvcnQgZGVmYXVsdCB7DQogIGRhdGEoKSB7DQogICAgcmV0dXJuIHsNCiAgICAgIG9yZGVyRGF0YToge30sDQogICAgICBCYXNlVVJMOiBTZXR0aW5nLmFwaUJhc2VVUkwucmVwbGFjZSgvYWRtaW5hcGkvLCAnJyksDQogICAgICBuZXdBcnJheURhdGE6IFtdLA0KICAgICAgc2l0ZV9uYW1lOiAnJywNCiAgICAgIHJlZnVuZF9waG9uZTogJycsDQogICAgICByZWZ1bmRfYWRkcmVzczogJycsDQogICAgfTsNCiAgfSwNCiAgY3JlYXRlZCgpIHsNCiAgICB0aGlzLmdldERpc3RyaWJ1dGlvbigpOw0KICB9LA0KICBtb3VudGVkKCkge30sDQogIG1ldGhvZHM6IHsNCiAgICAvLyDnlJ/miJDkuoznu7TnoIENCiAgICBjcmVhdFFyQ29kZSgpIHsNCiAgICAgIGxldCBxcmNvZGU7DQogICAgICBsZXQgdXJsID0gd2luZG93LmxvY2F0aW9uLm9yaWdpbiArICcvcGFnZXMvZ29vZHMvb3JkZXJfZGV0YWlscy9pbmRleD9vcmRlcl9pZD0nICsgdGhpcy4kcm91dGUucXVlcnkuaWQ7DQogICAgICB0aGlzLm5ld0FycmF5RGF0YS5mb3JFYWNoKChpdGVtLCBpbmRleCkgPT4gew0KICAgICAgICBsZXQgb2JqID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ3FyQ29kZVVybCcgKyBpbmRleCk7DQogICAgICAgIHFyY29kZSA9IG5ldyBRUkNvZGUob2JqLCB7DQogICAgICAgICAgdGV4dDogdXJsLCAvLyDpnIDopoHovazmjaLkuLrkuoznu7TnoIHnmoTlhoXlrrkNCiAgICAgICAgICB3aWR0aDogOTAsDQogICAgICAgICAgaGVpZ2h0OiA5MCwNCiAgICAgICAgICBjb2xvckRhcms6ICcjMDAwMDAwJywNCiAgICAgICAgICBjb2xvckxpZ2h0OiAnI2ZmZmZmZicsDQogICAgICAgICAgY29ycmVjdExldmVsOiBRUkNvZGUuQ29ycmVjdExldmVsLkgsDQogICAgICAgIH0pOw0KICAgICAgfSk7DQogICAgfSwNCiAgICBnZXREaXN0cmlidXRpb24oKSB7DQogICAgICBkaXN0cmlidXRpb25PcmRlcih0aGlzLiRyb3V0ZS5xdWVyeS5pZCkNCiAgICAgICAgLnRoZW4oKHJlcykgPT4gew0KICAgICAgICAgIHRoaXMub3JkZXJEYXRhID0gcmVzLmRhdGE7DQogICAgICAgICAgY29uc3QgY2h1bmtlZEFycmF5cyA9IFtdOw0KICAgICAgICAgIHJlcy5kYXRhLnByb2R1Y3RfaW5mby5mb3JFYWNoKChpdGVtLCBpbmRleCkgPT4gew0KICAgICAgICAgICAgY29uc3QgY2h1bmtJbmRleCA9IE1hdGguZmxvb3IoaW5kZXggLyA2KTsNCiAgICAgICAgICAgIGlmICghY2h1bmtlZEFycmF5c1tjaHVua0luZGV4XSkgew0KICAgICAgICAgICAgICBjaHVua2VkQXJyYXlzW2NodW5rSW5kZXhdID0gW107DQogICAgICAgICAgICB9DQogICAgICAgICAgICBpdGVtLmluZGV4ID0gaW5kZXggKyAxOw0KICAgICAgICAgICAgY2h1bmtlZEFycmF5c1tjaHVua0luZGV4XS5wdXNoKGl0ZW0pOw0KICAgICAgICAgIH0pOw0KICAgICAgICAgIHRoaXMubmV3QXJyYXlEYXRhID0gY2h1bmtlZEFycmF5czsNCiAgICAgICAgICBzZXRUaW1lb3V0KCgpID0+IHsNCiAgICAgICAgICAgIHRoaXMuY3JlYXRRckNvZGUoKTsNCiAgICAgICAgICB9LCAyMDApOw0KICAgICAgICB9KQ0KICAgICAgICAuY2F0Y2goKGVycikgPT4gew0KICAgICAgICAgIHRoaXMuJE1lc3NhZ2UuZXJyb3IoZXJyLm1zZyk7DQogICAgICAgIH0pOw0KICAgIH0sDQogIH0sDQp9Ow0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AA0EA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/pages/order/print","sourcesContent":["<template>\r\n <!-- 支付订单 -->\r\n <div class=\"order-bgc\">\r\n <div class=\"putSupplier perpage\" v-for=\"(item, index) in newArrayData\" :key=\"index\">\r\n <div class=\"header acea-row row-between-wrapper\">\r\n <div class=\"left acea-row row-middle\">\r\n <!-- <div class=\"picture\" :id=\"'qrCodeUrl' + index\"></div> -->\r\n <div class=\"info\">\r\n <div><span class=\"name\">收货人:</span>{{ orderData.user_name }}</div>\r\n <div><span class=\"name\">收货地址:</span>{{ orderData.user_address }}</div>\r\n <div>\r\n <span class=\"name\">手机号:</span><span>{{ orderData.user_phone }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"info\">\r\n <div><span class=\"name\">订单编号:</span>{{ orderData.order_id }}</div>\r\n <div><span class=\"name\">支付时间:</span>{{ orderData.pay_time }}</div>\r\n <div><span class=\"name\">支付方式:</span>{{ orderData.pay_type }}</div>\r\n </div>\r\n </div>\r\n <div class=\"mt20\">\r\n <el-table border :data=\"item\" :disabled-hover=\"true\">\r\n <el-table-column label=\"商品编号\" width=\"80\" align=\"center\">\r\n <template slot-scope=\"scope\">\r\n <span class=\"nickname\">{{ scope.row.index }} </span>\r\n </template>\r\n </el-table-column>\r\n <el-table-column label=\"商品名称\" width=\"170\">\r\n <template slot-scope=\"scope\">\r\n <span class=\"nickname\">{{ scope.row.name }} </span>\r\n </template>\r\n </el-table-column>\r\n <el-table-column label=\"商品规格\" minWidth=\"150\">\r\n <template slot-scope=\"scope\">\r\n <span class=\"nickname\">{{ scope.row.sku }} </span>\r\n </template>\r\n </el-table-column>\r\n <el-table-column label=\"单价\" width=\"80\">\r\n <template slot-scope=\"scope\">\r\n <span class=\"nickname\">{{ scope.row.price }}</span>\r\n </template>\r\n </el-table-column>\r\n <el-table-column label=\"数量\" width=\"80\">\r\n <template slot-scope=\"scope\">\r\n <span class=\"nickname\">{{ scope.row.num }} </span>\r\n </template>\r\n </el-table-column>\r\n <el-table-column label=\"金额\" width=\"100\">\r\n <template slot-scope=\"scope\">\r\n <span class=\"nickname\">{{ scope.row.sum_price }}</span>\r\n </template>\r\n </el-table-column>\r\n </el-table>\r\n </div>\r\n <div class=\"bottom acea-row row-between-wrapper\">\r\n <div class=\"acea-row row-middle\">\r\n <div class=\"item\"><span class=\"name\">运费:</span>{{ orderData.pay_postage }}</div>\r\n <div class=\"item\"><span class=\"name\">优惠:</span>{{ orderData.coupon_price }}</div>\r\n <div class=\"item\"><span class=\"name\">会员折扣:</span>{{ orderData.vip_price }}</div>\r\n <div class=\"item\"><span class=\"name\">积分抵扣:</span>{{ orderData.deduction_price }}</div>\r\n </div>\r\n <div class=\"pricePay\">实付金额:{{ orderData.pay_price }}</div>\r\n </div>\r\n <div class=\"bottom acea-row\">\r\n <div class=\"name\">\r\n 用户备注:<span class=\"con\">{{ orderData.mark || '-' }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- 注意:后续要是加内容使页面撑大,记得查看下打印是否在同一张,是否会多余一张空白纸 -->\r\n </div>\r\n</template>\r\n<script>\r\nimport { distributionOrder } from '@/api/order';\r\nimport QRCode from 'qrcodejs2';\r\nimport Setting from '@/setting';\r\nexport default {\r\n data() {\r\n return {\r\n orderData: {},\r\n BaseURL: Setting.apiBaseURL.replace(/adminapi/, ''),\r\n newArrayData: [],\r\n site_name: '',\r\n refund_phone: '',\r\n refund_address: '',\r\n };\r\n },\r\n created() {\r\n this.getDistribution();\r\n },\r\n mounted() {},\r\n methods: {\r\n // 生成二维码\r\n creatQrCode() {\r\n let qrcode;\r\n let url = window.location.origin + '/pages/goods/order_details/index?order_id=' + this.$route.query.id;\r\n this.newArrayData.forEach((item, index) => {\r\n let obj = document.getElementById('qrCodeUrl' + index);\r\n qrcode = new QRCode(obj, {\r\n text: url, // 需要转换为二维码的内容\r\n width: 90,\r\n height: 90,\r\n colorDark: '#000000',\r\n colorLight: '#ffffff',\r\n correctLevel: QRCode.CorrectLevel.H,\r\n });\r\n });\r\n },\r\n getDistribution() {\r\n distributionOrder(this.$route.query.id)\r\n .then((res) => {\r\n this.orderData = res.data;\r\n const chunkedArrays = [];\r\n res.data.product_info.forEach((item, index) => {\r\n const chunkIndex = Math.floor(index / 6);\r\n if (!chunkedArrays[chunkIndex]) {\r\n chunkedArrays[chunkIndex] = [];\r\n }\r\n item.index = index + 1;\r\n chunkedArrays[chunkIndex].push(item);\r\n });\r\n this.newArrayData = chunkedArrays;\r\n setTimeout(() => {\r\n this.creatQrCode();\r\n }, 200);\r\n })\r\n .catch((err) => {\r\n this.$Message.error(err.msg);\r\n });\r\n },\r\n },\r\n};\r\n</script>\r\n<style lang=\"scss\" scoped>\r\n.perpage {\r\n page-break-after: always !important;\r\n}\r\n.order-bgc {\r\n position: absolute;\r\n width: 100%;\r\n background-color: #fff;\r\n height: max-content;\r\n min-height: 100vh;\r\n font-weight: 600;\r\n}\r\n::v-deep .el-table th {\r\n background-color: #fff !important;\r\n}\r\n::v-deep .el-table-header thead tr th:nth-of-type(1) {\r\n padding-left: 0 !important;\r\n}\r\n::v-deep .el-table-header thead tr th {\r\n border-top: 1px solid #333;\r\n}\r\n::v-deep .el-table td:nth-of-type(1) {\r\n padding-left: 0 !important;\r\n}\r\n::v-deep .el-table-header table {\r\n //border-top:0!important;\r\n}\r\n::v-deep .el-table-border th,\r\n::v-deep .el-table-border td {\r\n border-right: 1px solid #333 !important;\r\n}\r\n::v-deep .el-table-border th:nth-of-type(1),\r\n::v-deep .el-table-border td:nth-of-type(1) {\r\n border-left: 1px solid #333 !important;\r\n}\r\n::v-deep .el-table th,\r\n::v-deep .el-table td {\r\n border-bottom: 1px solid #333 !important;\r\n border-right: 1px solid #333 !important;\r\n}\r\n::v-deep .el-table-wrapper-with-border {\r\n border-color: #333 !important;\r\n border: unset;\r\n}\r\n::v-deep .el-table-border:after {\r\n background-color: #333;\r\n width: 0 !important;\r\n height: 0 !important;\r\n}\r\n::v-deep .el-table--border {\r\n border: 1px solid #333 !important;\r\n}\r\n::v-deep .el-table:before {\r\n background-color: #333;\r\n width: 0 !important;\r\n height: 0 !important;\r\n}\r\n::v-deep .el-table .cell,\r\n::v-deep .el-table th.el-table__cell > .cell {\r\n height: 47px !important;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-weight: 600;\r\n}\r\n::v-deep .el-table {\r\n color: #000;\r\n}\r\n.pricePay {\r\n font-weight: bold;\r\n}\r\n.bottom {\r\n color: rgba(0, 0, 0, 0.85);\r\n font-size: 12px;\r\n font-weight: 400;\r\n margin-top: 20px;\r\n .item {\r\n margin-right: 30px;\r\n font-weight: 600;\r\n }\r\n .name {\r\n font-weight: 600;\r\n }\r\n .con {\r\n width: 740px;\r\n font-weight: unset;\r\n }\r\n}\r\n.putSupplier {\r\n width: 794px;\r\n background-color: #fff;\r\n margin: 0 auto;\r\n padding-top: 10px;\r\n /*padding: 20px 20px 450px 20px;*/\r\n /*box-sizing: border-box;*/\r\n .header {\r\n .info {\r\n font-size: 12px;\r\n color: rgba(0, 0, 0, 0.85);\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n height: 80px;\r\n font-weight: 600;\r\n }\r\n .left {\r\n width: 500px;\r\n .picture {\r\n width: 90px;\r\n height: 90px;\r\n margin-right: 20px;\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n }\r\n .info {\r\n flex: 1;\r\n }\r\n }\r\n }\r\n}\r\n.delivery {\r\n display: flex;\r\n justify-content: center;\r\n width: 794px;\r\n padding-top: 14px;\r\n border-top: 1px solid #dddddd;\r\n margin: 11px auto;\r\n font-size: 10px;\r\n color: #333333;\r\n\r\n div + div {\r\n margin-left: 30px;\r\n }\r\n}\r\n</style>\r\n"]}]}
|