sendCommand.vue 14 KB

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