sendCommand.vue 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528
  1. <template>
  2. <view class="content">
  3. <view class="body">
  4. <!-- <view>
  5. <textarea class="result" v-model="returnResult"></textarea>
  6. </view>
  7. <textarea class="input" @input="inputEvent" /> -->
  8. <!-- <button type="primary" @tap="sendData">发送(票据可使用)</button> -->
  9. <view style='margin-top:4%;display: flex;flex-direction: column;'>
  10. <button type='primary' class="btn" @tap='receiptTest' :loading='isReceiptSend'
  11. :disabled='isReceiptSend'>打印质检单小票</button>
  12. <button type='primary' class="btn" @tap='goToList'>返回列表页</button>
  13. <!-- <button type='primary' @tap='labelTest' :loading='isLabelSend' :disabled='isLabelSend'>标签测试</button> -->
  14. </view>
  15. <view style='margin-top:4%;display: flex;flex-direction: row;'>
  16. <!-- hidden='true' -->
  17. <canvas canvas-id='edit_area_canvas'
  18. :style="{width:canvasWidth+'px',height:canvasHeight+'px'}"></canvas>
  19. </view>
  20. <!-- <picker style='margin:20px' mode='selector' :range='buffSize' :value='buffIndex' @change='buffBindChange'>
  21. 当前每次发送字节数为(点击可更换):{{buffSize[buffIndex]}}
  22. </picker>
  23. <picker style='margin:20px' mode='selector' :range='printNum' :value='printNumIndex' @change='printNumBindChange'>
  24. 当前打印份数(点击可更换):{{printNum[printNumIndex]}}
  25. </picker> -->
  26. </view>
  27. </view>
  28. </template>
  29. <script>
  30. var tsc = require("../../util/ble/tsc.js");
  31. var esc = require("../../util/ble/esc.js");
  32. var encode = require("../../util/ble/encoding.js");
  33. import {
  34. mapState
  35. } from 'vuex';
  36. export default {
  37. data() {
  38. return {
  39. sendContent: "",
  40. looptime: 0,
  41. currentTime: 1,
  42. lastData: 0,
  43. oneTimeData: 0,
  44. returnResult: "",
  45. canvasWidth: 180,
  46. canvasHeight: 180,
  47. imageSrc: '../../static/img/abc_ic_star_black_16dp.png',
  48. buffSize: [],
  49. buffIndex: 0,
  50. printNum: [],
  51. printNumIndex: 0,
  52. printerNum: 1,
  53. currentPrint: 1,
  54. isReceiptSend: false,
  55. isLabelSend: false,
  56. gridList: {}
  57. };
  58. },
  59. computed: mapState(['sysinfo', 'Bluetooth']),
  60. onLoad() {
  61. let that = this;
  62. let {
  63. BLEInformation
  64. } = that.Bluetooth;
  65. uni.notifyBLECharacteristicValueChange({
  66. deviceId: BLEInformation.deviceId,
  67. serviceId: BLEInformation.notifyServiceId,
  68. characteristicId: BLEInformation.notifyCharaterId,
  69. state: true,
  70. success(res) {
  71. uni.onBLECharacteristicValueChange(function(r) {
  72. console.log(`characteristic ${r.characteristicId} has changed, now is ${r}`)
  73. })
  74. },
  75. fail: function(e) {
  76. console.log(e)
  77. },
  78. complete: function(e) {
  79. console.log(e)
  80. }
  81. })
  82. },
  83. onReady() {
  84. let list = []
  85. let numList = []
  86. let j = 0
  87. for (let i = 20; i < 200; i += 10) {
  88. list[j] = i;
  89. j++
  90. }
  91. for (let i = 1; i < 10; i++) {
  92. numList[i - 1] = i
  93. }
  94. this.buffSize = list;
  95. this.oneTimeData = list[0];
  96. this.printNum = numList;
  97. this.printerNum = numList[0];
  98. },
  99. onShow() {
  100. this.gridList = uni.getStorageSync("quality_print")
  101. // this.gridList.compId = uni.getStorageSync('pcUserInfo').compId
  102. console.log(this.gridList)
  103. let that = this;
  104. let width;
  105. let height;
  106. uni.getImageInfo({
  107. src: that.imageSrc,
  108. success(res) {
  109. console.log(res.width)
  110. console.log(res.height)
  111. width = res.width
  112. height = res.height
  113. that.canvasWidth = res.width;
  114. that.canvasHeight = res.height;
  115. }
  116. })
  117. const ctx = uni.createCanvasContext("edit_area_canvas", this);
  118. // if (app.globalData.platform == "android") {
  119. // ctx.translate(width, height)
  120. // ctx.rotate(180 * Math.PI / 180)
  121. // }
  122. ctx.drawImage(this.imageSrc, 0, 0, width, height);
  123. ctx.draw();
  124. },
  125. onUnload() {
  126. let that = this;
  127. let {
  128. BLEInformation
  129. } = that.Bluetooth;
  130. // uni.closeBLEConnection({
  131. // deviceId: BLEInformation.deviceId,
  132. // success: function(res) {
  133. // console.log("关闭蓝牙成功")
  134. // },
  135. // })
  136. },
  137. methods: {
  138. goToList(){
  139. uni.navigateTo({
  140. url: '/pages/erpbusiness/quality_testing?managementType=1'
  141. })
  142. },
  143. //获取输入内容
  144. inputEvent(e) {
  145. this.sendContent = e.detail.value;
  146. },
  147. //输入框点击发送
  148. sendData() {
  149. let data = this.sendContent + "\n"
  150. this.looptime = 0;
  151. var content = new encode.TextEncoder(
  152. 'gb18030', {
  153. NONSTANDARD_allowLegacyEncoding: true
  154. }).encode(data);
  155. this.prepareSend(content);
  156. },
  157. //打印票据数据
  158. receiptTest() {
  159. var that = this;
  160. var canvasWidth = that.canvasWidth
  161. var canvasHeight = that.canvasHeight
  162. var command = esc.jpPrinter.createNew()
  163. command.init()
  164. //编号
  165. command.bold(3); //加粗
  166. command.setFontSize(36); //字体大小
  167. command.setSelectJustification(1) //居中
  168. command.rowSpace(200);
  169. // command.rowSpace(10);
  170. command.setText(that.gridList.qualityNo.substring(that.gridList.qualityNo.length - 3));
  171. command.setPrint();
  172. command.rowSpace(60);
  173. command.bold(0); //取消加粗
  174. command.setFontSize(0); //正常字体
  175. // 标题
  176. command.bold(1); //加粗
  177. command.setFontSize(16); //字体大小
  178. command.setSelectJustification(1) //居中
  179. // command.rowSpace(10);
  180. command.setText("粮食质检单");
  181. command.setPrint();
  182. command.rowSpace(60);
  183. command.bold(0); //取消加粗
  184. command.setFontSize(0); //正常字体
  185. // 二维码
  186. command.rowSpace(60);
  187. command.setSelectSizeOfModuleForQRCode(5);
  188. command.setSelectErrorCorrectionLevelForQRCode(7)
  189. command.setStoreQRCodeData(that.gridList.compId + '&' + that.gridList.qualityNo + '&' + that.gridList.warehouseId);
  190. command.setPrintQRCode();
  191. //客户姓名
  192. command.setSelectJustification(0); //居左
  193. command.setLeftMargin(30)
  194. command.setText("客户姓名:" + that.gridList.customerName);
  195. command.setPrint();
  196. //客户电话
  197. command.setSelectJustification(0); //居左
  198. command.setLeftMargin(30)
  199. command.setText("客户电话:" + that.gridList.customerPhone);
  200. command.setPrint();
  201. //车牌号
  202. command.setSelectJustification(0); //居左
  203. command.setLeftMargin(30)
  204. command.setText("车牌号:" + that.gridList.carNumber);
  205. command.setPrint();
  206. if (that.gridList.boxNo) {
  207. //箱号
  208. command.setSelectJustification(0); //居左
  209. command.setLeftMargin(30)
  210. command.setText("箱号-1:" + that.gridList.boxNo);
  211. command.setPrint();
  212. }
  213. if (that.gridList.boxNoOther) {
  214. //箱号
  215. command.setSelectJustification(0); //居左
  216. command.setLeftMargin(30)
  217. command.setText("箱号-2:" + that.gridList.boxNoOther);
  218. command.setPrint();
  219. }
  220. if (that.gridList.titleNo) {
  221. //封号
  222. command.setSelectJustification(0); //居左
  223. command.setLeftMargin(30)
  224. command.setText("封号-1:" + that.gridList.titleNo);
  225. command.setPrint();
  226. }
  227. if (that.gridList.titleNoOther) {
  228. //封号
  229. command.setSelectJustification(0); //居左
  230. command.setLeftMargin(30)
  231. command.setText("封号-2:" + that.gridList.titleNoOther);
  232. command.setPrint();
  233. }
  234. //收货单位
  235. command.setSelectJustification(0); //居左
  236. command.setLeftMargin(30)
  237. command.setText("收货单位:" + that.gridList.compName);
  238. command.setPrint();
  239. //联系人
  240. command.setSelectJustification(0); //居左
  241. command.setLeftMargin(30)
  242. command.setText("联系人:" + that.gridList.person);
  243. command.setPrint();
  244. //联系电话
  245. command.setSelectJustification(0); //居左
  246. command.setLeftMargin(30)
  247. command.setText("联系电话:" + that.gridList.personPhone);
  248. command.setPrint();
  249. //货名
  250. command.setSelectJustification(0); //居左
  251. command.setLeftMargin(30)
  252. command.setText("货名:" + that.gridList.goodsName);
  253. command.setPrint();
  254. //类型
  255. command.setSelectJustification(0); //居左
  256. command.setLeftMargin(30)
  257. command.setText("类型:" + that.gridList.type);
  258. command.setPrint();
  259. //容量
  260. command.setSelectJustification(0); //居左
  261. command.setLeftMargin(30)
  262. command.setText("容量(克/升):" + that.gridList.bulkDensity);
  263. command.setPrint();
  264. //不完善粒
  265. command.setSelectJustification(0); //居左
  266. command.setLeftMargin(30)
  267. command.setText("不完善粒(%):" + that.gridList.imperfectGrain);
  268. command.setPrint();
  269. //等级
  270. command.setSelectJustification(0); //居左
  271. command.setLeftMargin(30)
  272. command.setText("等级:" + that.gridList.grade);
  273. command.setPrint();
  274. //水分
  275. command.setSelectJustification(0); //居左
  276. command.setLeftMargin(30)
  277. command.setText("水分(%):" + that.gridList.waterContent);
  278. command.setPrint();
  279. //热损伤
  280. command.setSelectJustification(0); //居左
  281. command.setLeftMargin(30)
  282. command.setText("热损伤(%):" + that.gridList.jiaorenli);
  283. command.setPrint();
  284. //单价
  285. command.setSelectJustification(0); //居左
  286. command.setLeftMargin(30)
  287. if (that.gridList.type == '潮粮') {
  288. command.setText("单价(元/公斤):" + that.gridList.tidalGrainPrice);
  289. } else {
  290. command.setText("单价(元/公斤):" + that.gridList.dryGrainPrice);
  291. }
  292. command.setPrint();
  293. //杂质
  294. command.setSelectJustification(0); //居左
  295. command.setLeftMargin(30)
  296. command.setText("杂质(%):" + that.gridList.impurity);
  297. command.setPrint();
  298. //霉变粒
  299. command.setSelectJustification(0); //居左
  300. command.setLeftMargin(30)
  301. command.setText("霉变粒(%):" + that.gridList.mildewGrain);
  302. command.setPrint();
  303. //购粮性质
  304. command.setSelectJustification(0); //居左
  305. command.setLeftMargin(30)
  306. command.setText("购粮性质:" + that.gridList.natureOfGrainPurchase);
  307. command.setPrint();
  308. //仓位号
  309. command.setSelectJustification(0); //居左
  310. command.setLeftMargin(30)
  311. command.setText("仓位号:" + that.gridList.binNumber);
  312. command.setPrint();
  313. //囤位号
  314. command.setSelectJustification(0); //居左
  315. command.setLeftMargin(30)
  316. command.setText("囤位号:" + that.gridList.storageTagNo);
  317. command.setPrint();
  318. //质检员
  319. command.setSelectJustification(0); //居左
  320. command.setLeftMargin(30)
  321. command.setText("质检员:" + that.gridList.qualityInspector);
  322. command.setPrint();
  323. //客户签名
  324. command.rowSpace(100);
  325. command.setSelectJustification(0); //居左
  326. command.setLeftMargin(30)
  327. command.setText("客户签名:");
  328. command.setPrint();
  329. command.rowSpace(100);
  330. //收货单位签名或盖章
  331. command.setSelectJustification(0); //居左
  332. command.setLeftMargin(30)
  333. command.setText("收货单位签名或盖章:");
  334. command.setPrintAndFeed(150);
  335. command.setPrintAndFeedRow(8);
  336. that.isReceiptSend = true;
  337. that.prepareSend(command.getData());
  338. },
  339. //准备发送,根据每次发送字节数来处理分包数量
  340. prepareSend(buff) {
  341. console.log(buff);
  342. let that = this
  343. let time = that.oneTimeData
  344. let looptime = parseInt(buff.length / time);
  345. let lastData = parseInt(buff.length % time);
  346. console.log(looptime + "---" + lastData)
  347. this.looptime = looptime + 1;
  348. this.lastData = lastData;
  349. this.currentTime = 1;
  350. that.Send(buff)
  351. },
  352. //查询打印机状态
  353. queryStatus() {
  354. let command = esc.jpPrinter.Query();
  355. command.getRealtimeStatusTransmission(1);
  356. },
  357. //分包发送
  358. Send(buff) {
  359. let that = this
  360. let {
  361. currentTime,
  362. looptime: loopTime,
  363. lastData,
  364. oneTimeData: onTimeData,
  365. printerNum: printNum,
  366. currentPrint
  367. } = that;
  368. let buf;
  369. let dataView;
  370. if (currentTime < loopTime) {
  371. buf = new ArrayBuffer(onTimeData)
  372. dataView = new DataView(buf)
  373. for (var i = 0; i < onTimeData; ++i) {
  374. dataView.setUint8(i, buff[(currentTime - 1) * onTimeData + i])
  375. }
  376. } else {
  377. buf = new ArrayBuffer(lastData)
  378. dataView = new DataView(buf)
  379. for (var i = 0; i < lastData; ++i) {
  380. dataView.setUint8(i, buff[(currentTime - 1) * onTimeData + i])
  381. }
  382. }
  383. console.log("第" + currentTime + "次发送数据大小为:" + buf.byteLength)
  384. let {
  385. BLEInformation
  386. } = that.Bluetooth;
  387. plus.bluetooth.writeBLECharacteristicValue({
  388. deviceId: BLEInformation.deviceId,
  389. serviceId: BLEInformation.writeServiceId,
  390. characteristicId: BLEInformation.writeCharaterId,
  391. value: buf,
  392. success: function(res) {
  393. console.log(res)
  394. },
  395. fail: function(e) {
  396. console.log(e)
  397. },
  398. complete: function() {
  399. currentTime++
  400. if (currentTime <= loopTime) {
  401. that.currentTime = currentTime;
  402. that.Send(buff)
  403. } else {
  404. uni.showToast({
  405. title: '已打印第' + currentPrint + '张',
  406. })
  407. if (currentPrint == printNum) {
  408. that.looptime = 0;
  409. that.lastData = 0;
  410. that.currentTime = 1;
  411. that.isReceiptSend = false;
  412. that.isLabelSend = false;
  413. that.currentPrint = 1;
  414. } else {
  415. currentPrint++;
  416. that.currentPrint = currentPrint;
  417. that.currentTime = 1;
  418. that.Send(buff)
  419. }
  420. }
  421. }
  422. })
  423. },
  424. buffBindChange: function(res) { //更改打印字节数
  425. let index = res.detail.value
  426. let time = this.buffSize[index]
  427. this.buffIndex = index;
  428. this.oneTimeData = time;
  429. },
  430. printNumBindChange: function(res) { //更改打印份数
  431. let index = res.detail.value
  432. let num = this.printNum[index]
  433. this.printNumIndex = index;
  434. this.printerNum = num;
  435. },
  436. }
  437. }
  438. </script>
  439. <style lang="less">
  440. .input {
  441. text-align: top;
  442. width: 90%;
  443. height: 150px;
  444. margin-left: 4%;
  445. margin-right: 4%;
  446. margin-top: 10px;
  447. margin-bottom: 12px;
  448. border: 1px solid slategray;
  449. }
  450. .receiver_info_scroll_view {
  451. width: 90%;
  452. height: 200px;
  453. margin-left: 4%;
  454. margin-right: 4%;
  455. margin-top: 10px;
  456. margin-bottom: 25px;
  457. border: 1px solid black;
  458. }
  459. .result {
  460. width: 90%;
  461. height: 150px;
  462. border: 1px solid black;
  463. margin-left: 4%;
  464. margin-bottom: 4%;
  465. margin-top: 5%;
  466. }
  467. button {
  468. width: 90%;
  469. margin-left: 5%;
  470. margin-right: 5%;
  471. }
  472. .switch {
  473. float: right;
  474. margin-right: 20px;
  475. margin-bottom: 16px;
  476. }
  477. text {
  478. color: #fff;
  479. display: block;
  480. }
  481. input {
  482. color: gainsboro;
  483. float: left;
  484. }
  485. .v_net_ssid {
  486. width: 100%;
  487. background: #fff;
  488. }
  489. .v_net_passw {
  490. width: 100%;
  491. background: antiquewhite;
  492. }
  493. .swiper {
  494. width: 100%;
  495. height: 100%;
  496. }
  497. .btn {
  498. margin-top: 50rpx;
  499. background: #22C572;
  500. }
  501. uni-button[loading][type=primary] {
  502. color: hsla(0, 0%, 100%, .6);
  503. background-color: #22C572;
  504. }
  505. </style>