sendCommand.vue 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529
  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
  190. .warehouseId);
  191. command.setPrintQRCode();
  192. //客户姓名
  193. command.setSelectJustification(0); //居左
  194. command.setLeftMargin(30)
  195. command.setText("客户姓名:" + that.gridList.customerName);
  196. command.setPrint();
  197. //客户电话
  198. command.setSelectJustification(0); //居左
  199. command.setLeftMargin(30)
  200. command.setText("客户电话:" + that.gridList.customerPhone);
  201. command.setPrint();
  202. //车牌号
  203. command.setSelectJustification(0); //居左
  204. command.setLeftMargin(30)
  205. command.setText("车牌号:" + that.gridList.carNumber);
  206. command.setPrint();
  207. if (that.gridList.boxNo) {
  208. //箱号
  209. command.setSelectJustification(0); //居左
  210. command.setLeftMargin(30)
  211. command.setText("箱号-1:" + that.gridList.boxNo);
  212. command.setPrint();
  213. }
  214. if (that.gridList.boxNoOther) {
  215. //箱号
  216. command.setSelectJustification(0); //居左
  217. command.setLeftMargin(30)
  218. command.setText("箱号-2:" + that.gridList.boxNoOther);
  219. command.setPrint();
  220. }
  221. if (that.gridList.titleNo) {
  222. //封号
  223. command.setSelectJustification(0); //居左
  224. command.setLeftMargin(30)
  225. command.setText("封号-1:" + that.gridList.titleNo);
  226. command.setPrint();
  227. }
  228. if (that.gridList.titleNoOther) {
  229. //封号
  230. command.setSelectJustification(0); //居左
  231. command.setLeftMargin(30)
  232. command.setText("封号-2:" + that.gridList.titleNoOther);
  233. command.setPrint();
  234. }
  235. //收货单位
  236. command.setSelectJustification(0); //居左
  237. command.setLeftMargin(30)
  238. command.setText("收货单位:" + that.gridList.compName);
  239. command.setPrint();
  240. //联系人
  241. command.setSelectJustification(0); //居左
  242. command.setLeftMargin(30)
  243. command.setText("联系人:" + that.gridList.person);
  244. command.setPrint();
  245. //联系电话
  246. command.setSelectJustification(0); //居左
  247. command.setLeftMargin(30)
  248. command.setText("联系电话:" + that.gridList.personPhone);
  249. command.setPrint();
  250. //货名
  251. command.setSelectJustification(0); //居左
  252. command.setLeftMargin(30)
  253. command.setText("货名:" + that.gridList.goodsName);
  254. command.setPrint();
  255. //类型
  256. command.setSelectJustification(0); //居左
  257. command.setLeftMargin(30)
  258. command.setText("类型:" + that.gridList.type);
  259. command.setPrint();
  260. //容量
  261. command.setSelectJustification(0); //居左
  262. command.setLeftMargin(30)
  263. command.setText("容量(克/升):" + that.gridList.bulkDensity);
  264. command.setPrint();
  265. //不完善粒
  266. command.setSelectJustification(0); //居左
  267. command.setLeftMargin(30)
  268. command.setText("不完善粒(%):" + that.gridList.imperfectGrain);
  269. command.setPrint();
  270. //等级
  271. command.setSelectJustification(0); //居左
  272. command.setLeftMargin(30)
  273. command.setText("等级:" + that.gridList.grade);
  274. command.setPrint();
  275. //水分
  276. command.setSelectJustification(0); //居左
  277. command.setLeftMargin(30)
  278. command.setText("水分(%):" + that.gridList.waterContent);
  279. command.setPrint();
  280. //热损伤
  281. command.setSelectJustification(0); //居左
  282. command.setLeftMargin(30)
  283. command.setText("热损伤(%):" + that.gridList.jiaorenli);
  284. command.setPrint();
  285. //单价
  286. command.setSelectJustification(0); //居左
  287. command.setLeftMargin(30)
  288. if (that.gridList.type == '潮粮') {
  289. command.setText("单价(元/公斤):" + that.gridList.tidalGrainPrice);
  290. } else {
  291. command.setText("单价(元/公斤):" + that.gridList.dryGrainPrice);
  292. }
  293. command.setPrint();
  294. //杂质
  295. command.setSelectJustification(0); //居左
  296. command.setLeftMargin(30)
  297. command.setText("杂质(%):" + that.gridList.impurity);
  298. command.setPrint();
  299. //霉变粒
  300. command.setSelectJustification(0); //居左
  301. command.setLeftMargin(30)
  302. command.setText("霉变粒(%):" + that.gridList.mildewGrain);
  303. command.setPrint();
  304. //购粮性质
  305. command.setSelectJustification(0); //居左
  306. command.setLeftMargin(30)
  307. command.setText("购粮性质:" + that.gridList.natureOfGrainPurchase);
  308. command.setPrint();
  309. //仓位号
  310. command.setSelectJustification(0); //居左
  311. command.setLeftMargin(30)
  312. command.setText("仓位号:" + that.gridList.binNumber);
  313. command.setPrint();
  314. //囤位号
  315. command.setSelectJustification(0); //居左
  316. command.setLeftMargin(30)
  317. command.setText("囤位号:" + that.gridList.storageTagNo);
  318. command.setPrint();
  319. //质检员
  320. command.setSelectJustification(0); //居左
  321. command.setLeftMargin(30)
  322. command.setText("质检员:" + that.gridList.qualityInspector);
  323. command.setPrint();
  324. //客户签名
  325. command.rowSpace(100);
  326. command.setSelectJustification(0); //居左
  327. command.setLeftMargin(30)
  328. command.setText("客户签名:");
  329. command.setPrint();
  330. command.rowSpace(100);
  331. //收货单位签名或盖章
  332. command.setSelectJustification(0); //居左
  333. command.setLeftMargin(30)
  334. command.setText("收货单位签名或盖章:");
  335. command.setPrintAndFeed(150);
  336. command.setPrintAndFeedRow(8);
  337. that.isReceiptSend = true;
  338. that.prepareSend(command.getData());
  339. },
  340. //准备发送,根据每次发送字节数来处理分包数量
  341. prepareSend(buff) {
  342. console.log(buff);
  343. let that = this
  344. let time = that.oneTimeData
  345. let looptime = parseInt(buff.length / time);
  346. let lastData = parseInt(buff.length % time);
  347. console.log(looptime + "---" + lastData)
  348. this.looptime = looptime + 1;
  349. this.lastData = lastData;
  350. this.currentTime = 1;
  351. that.Send(buff)
  352. },
  353. //查询打印机状态
  354. queryStatus() {
  355. let command = esc.jpPrinter.Query();
  356. command.getRealtimeStatusTransmission(1);
  357. },
  358. //分包发送
  359. Send(buff) {
  360. let that = this
  361. let {
  362. currentTime,
  363. looptime: loopTime,
  364. lastData,
  365. oneTimeData: onTimeData,
  366. printerNum: printNum,
  367. currentPrint
  368. } = that;
  369. let buf;
  370. let dataView;
  371. if (currentTime < loopTime) {
  372. buf = new ArrayBuffer(onTimeData)
  373. dataView = new DataView(buf)
  374. for (var i = 0; i < onTimeData; ++i) {
  375. dataView.setUint8(i, buff[(currentTime - 1) * onTimeData + i])
  376. }
  377. } else {
  378. buf = new ArrayBuffer(lastData)
  379. dataView = new DataView(buf)
  380. for (var i = 0; i < lastData; ++i) {
  381. dataView.setUint8(i, buff[(currentTime - 1) * onTimeData + i])
  382. }
  383. }
  384. console.log("第" + currentTime + "次发送数据大小为:" + buf.byteLength)
  385. let {
  386. BLEInformation
  387. } = that.Bluetooth;
  388. plus.bluetooth.writeBLECharacteristicValue({
  389. deviceId: BLEInformation.deviceId,
  390. serviceId: BLEInformation.writeServiceId,
  391. characteristicId: BLEInformation.writeCharaterId,
  392. value: buf,
  393. success: function(res) {
  394. console.log(res)
  395. },
  396. fail: function(e) {
  397. console.log(e)
  398. },
  399. complete: function() {
  400. currentTime++
  401. if (currentTime <= loopTime) {
  402. that.currentTime = currentTime;
  403. that.Send(buff)
  404. } else {
  405. uni.showToast({
  406. title: '已打印第' + currentPrint + '张',
  407. })
  408. if (currentPrint == printNum) {
  409. that.looptime = 0;
  410. that.lastData = 0;
  411. that.currentTime = 1;
  412. that.isReceiptSend = false;
  413. that.isLabelSend = false;
  414. that.currentPrint = 1;
  415. } else {
  416. currentPrint++;
  417. that.currentPrint = currentPrint;
  418. that.currentTime = 1;
  419. that.Send(buff)
  420. }
  421. }
  422. }
  423. })
  424. },
  425. buffBindChange: function(res) { //更改打印字节数
  426. let index = res.detail.value
  427. let time = this.buffSize[index]
  428. this.buffIndex = index;
  429. this.oneTimeData = time;
  430. },
  431. printNumBindChange: function(res) { //更改打印份数
  432. let index = res.detail.value
  433. let num = this.printNum[index]
  434. this.printNumIndex = index;
  435. this.printerNum = num;
  436. },
  437. }
  438. }
  439. </script>
  440. <style lang="less">
  441. .input {
  442. text-align: top;
  443. width: 90%;
  444. height: 150px;
  445. margin-left: 4%;
  446. margin-right: 4%;
  447. margin-top: 10px;
  448. margin-bottom: 12px;
  449. border: 1px solid slategray;
  450. }
  451. .receiver_info_scroll_view {
  452. width: 90%;
  453. height: 200px;
  454. margin-left: 4%;
  455. margin-right: 4%;
  456. margin-top: 10px;
  457. margin-bottom: 25px;
  458. border: 1px solid black;
  459. }
  460. .result {
  461. width: 90%;
  462. height: 150px;
  463. border: 1px solid black;
  464. margin-left: 4%;
  465. margin-bottom: 4%;
  466. margin-top: 5%;
  467. }
  468. button {
  469. width: 90%;
  470. margin-left: 5%;
  471. margin-right: 5%;
  472. }
  473. .switch {
  474. float: right;
  475. margin-right: 20px;
  476. margin-bottom: 16px;
  477. }
  478. text {
  479. color: #fff;
  480. display: block;
  481. }
  482. input {
  483. color: gainsboro;
  484. float: left;
  485. }
  486. .v_net_ssid {
  487. width: 100%;
  488. background: #fff;
  489. }
  490. .v_net_passw {
  491. width: 100%;
  492. background: antiquewhite;
  493. }
  494. .swiper {
  495. width: 100%;
  496. height: 100%;
  497. }
  498. .btn {
  499. margin-top: 50rpx;
  500. background: #22C572;
  501. }
  502. uni-button[loading][type=primary] {
  503. color: hsla(0, 0%, 100%, .6);
  504. background-color: #22C572;
  505. }
  506. </style>