sendCommand.vue 14 KB

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