sendCommand.vue 16 KB

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