printTag.vue 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259
  1. <template>
  2. <view class="printTag">
  3. <u-alert-tips :show="show" @close="show = false" type="warning" description="正在打印中,请勿息屏或退出应用!"></u-alert-tips>
  4. <view class="print-nums flex flex_column align_center justify_center">
  5. <view>打印数量</view>
  6. <view class="u-ninput">
  7. <u-number-box :min="1" v-model="printNum" color="#000" bg-color="#fff" size="30" :input-height="70" :input-width="100"></u-number-box>
  8. </view>
  9. </view>
  10. <view class="print-radio" v-if="fromPage == 'bdtq'">
  11. <u-radio-group v-model="numType" @change="qtyChange">
  12. <u-radio :name="1">按当前库存打印</u-radio>
  13. <u-radio :name="2">按最大库容打印</u-radio>
  14. </u-radio-group>
  15. </view>
  16. <view class="shelf-info">
  17. <view class="shelf-info-title">
  18. <view class="shelf-name">{{infoData&&infoData.shelfName || '--'}}</view>
  19. <view class="pno">{{infoData&&infoData.shelfPlaceCode}}</view>
  20. </view>
  21. <view class="shelf-info-body">
  22. <view>产品编码:{{fromPage == 'smdy'?infoData.productCode : infoData.productEntity&&infoData.productEntity.code}}</view>
  23. <view>产品名称:{{fromPage == 'smdy'?infoData.productName : infoData.productEntity&&infoData.productEntity.productName}}</view>
  24. <view>{{fromPage == 'smdy'?'实发数量':'当前库存'}}:{{fromPage == 'smdy'?infoData.confirmQty : infoData.qty}}{{infoData.productEntity&&infoData.productEntity.unit}}</view>
  25. <view v-if="fromPage == 'bdtq'">最大库容:{{infoData.maxQty}}{{infoData.productEntity&&infoData.productEntity.unit}}</view>
  26. </view>
  27. </view>
  28. <view class="buttons flex align_center justify_center">
  29. <view v-if="fromPage == 'bdtq'"><u-button @click="cancel" shape="circle" plain>返回列表</u-button></view>
  30. <view v-if="fromPage == 'smdy'"><u-button @click="cancel" shape="circle" plain>重新扫描</u-button></view>
  31. <view>
  32. <kk-printer @closeConnect="closeConnect" ref="kkprinter" @startPrint="startPrint"></kk-printer>
  33. </view>
  34. </view>
  35. </view>
  36. </template>
  37. <script>
  38. import { clzConfirm, numberToFixed } from '@/libs/tools';
  39. import { shelfDetail } from '@/api/shelf'
  40. import kkPrinter from '@/components/kk-printer/index.vue';
  41. import {printTempl} from '@/libs/printTools.js'
  42. import moment from 'moment'
  43. export default {
  44. components:{
  45. kkPrinter
  46. },
  47. data() {
  48. return {
  49. show: false,
  50. infoData: null,
  51. fromPage: '',
  52. printInfo: null,
  53. printNum: 1,
  54. isParinting: false,
  55. numType: 1
  56. }
  57. },
  58. onLoad(options) {
  59. const _this = this
  60. _this.fromPage = options.page
  61. _this.infoData = options.data ? JSON.parse(options.data) : {};
  62. _this.printNum = _this.fromPage == 'smdy' ? _this.infoData.confirmQty : _this.infoData.qty
  63. _this.printNum = _this.printNum||1
  64. console.log(_this.infoData)
  65. // 保持屏幕常亮
  66. uni.setKeepScreenOn({
  67. keepScreenOn: true
  68. });
  69. },
  70. onUnload() {
  71. // this.$refs.kkprinter.closeConnect()
  72. this.printNum = 1
  73. this.infoData = null
  74. this.printInfo = null
  75. this.fromPage = ''
  76. // 保持屏幕常亮
  77. uni.setKeepScreenOn({
  78. keepScreenOn: false
  79. });
  80. },
  81. // 监听页面返回,返回 event = {from:backbutton、 navigateBack} ,backbutton 表示来源是左上角返回按钮或 android 返回键;navigateBack表示来源是 uni.navigateBack
  82. onBackPress(event){
  83. if(event.from == 'backbutton'){
  84. if(this.isParinting){
  85. uni.showToast({
  86. icon:'none',
  87. title: '正在打印中...'
  88. })
  89. }else{
  90. this.cancel()
  91. }
  92. return true // 阻止默认返回行为(会导致无限循环)
  93. }
  94. },
  95. methods: {
  96. qtyChange(v){
  97. this.printNum = v == '1' ? this.infoData.qty : this.infoData.maxQty
  98. },
  99. cancel(){
  100. if(this.fromPage == 'bdtq'){ // 补打贴签
  101. uni.navigateBack({delta: 1})
  102. }else if(this.fromPage == 'smdy'){ // 扫码打印
  103. uni.$emit('refreshBL')
  104. uni.navigateBack({delta: 1})
  105. }
  106. },
  107. // 获取打印内容
  108. getPrintContent(){
  109. const _this = this
  110. const nowDate = moment().format('YYYY-MM-DD HH:mm')
  111. if(_this.fromPage == 'bdtq'){
  112. _this.printInfo = {
  113. dealerName: _this.$store.state.vuex_userData.orgName,
  114. shelfName: _this.infoData.shelfName || '',
  115. productCode: _this.infoData.productEntity&&_this.infoData.productEntity.code || '',
  116. productName: _this.infoData.productEntity&&_this.infoData.productEntity.productName || '',
  117. shelfPlaceCode: _this.infoData.shelfPlaceCode || '',
  118. currentInven: _this.printNum,
  119. printDate: nowDate,
  120. printUser: _this.$store.state.vuex_userData.userNameCN,
  121. barCode: `${_this.infoData.shelfSn}&${_this.infoData.productEntity&&_this.infoData.productEntity.code}&${_this.infoData.productEntity&&_this.infoData.productEntity.productSn}&${_this.infoData.shelfPlaceSn}`
  122. // barCode: `dealerSn=${_this.$store.state.vuex_userData.orgSn}&shelfSn=${_this.infoData.shelfSn}&productSn=${_this.infoData.productEntity&&_this.infoData.productEntity.productSn}&productCode=${_this.infoData.productEntity&&_this.infoData.productEntity.code}&shelfPlaceCode=${_this.infoData.shelfPlaceCode}&shelfPlaceSn=${_this.infoData.shelfPlaceSn}`
  123. }
  124. }else if(_this.fromPage == 'smdy'){
  125. _this.printInfo = {
  126. dealerName: _this.$store.state.vuex_userData.orgName,
  127. shelfName: _this.infoData.shelfName || '',
  128. productCode: _this.infoData.productCode || '',
  129. productName: _this.infoData.productName || '',
  130. shelfPlaceCode: _this.infoData.shelfPlaceCode || '',
  131. currentInven: _this.printNum,
  132. printDate: nowDate,
  133. printUser: _this.$store.state.vuex_userData.userNameCN,
  134. barCode: `${_this.infoData.shelfSn}&${_this.infoData.productCode}&${_this.infoData.productSn}&${_this.infoData.shelfPlaceSn}`
  135. // barCode: `dealerSn=${_this.$store.state.vuex_userData.orgSn}&shelfSn=${_this.infoData.shelfSn}&productSn=${_this.infoData.productSn}&productCode=${_this.infoData.productCode}&shelfPlaceCode=${_this.infoData.shelfPlaceCode}&shelfPlaceSn=${_this.infoData.shelfPlaceSn}`
  136. }
  137. }
  138. console.log('printInfo-----------',_this.printInfo)
  139. },
  140. closeConnect(){
  141. this.isParinting = false
  142. uni.hideLoading()
  143. },
  144. // 打印
  145. startPrint(opt,tsc,blesdk){
  146. console.log(opt,'opt')
  147. this.getPrintContent()
  148. if(this.printInfo.currentInven<=0){
  149. uni.showToast({
  150. icon:"none",
  151. title: "请选择打印数量"
  152. })
  153. this.$refs.kkprinter.onPrintFail()
  154. return
  155. }
  156. if(this.isParinting){
  157. return
  158. }
  159. this.isParinting = true
  160. this.show = true
  161. const command = printTempl(tsc,this.printInfo)
  162. blesdk.senBlData(opt.deviceId, opt.serviceId, opt.writeId, command.getData(), this.onPrintSuccess);
  163. },
  164. // 打印成功
  165. onPrintSuccess(){
  166. this.$refs.kkprinter.onPrintSuccess()
  167. this.isParinting = false
  168. this.show = false
  169. clzConfirm({
  170. title: '提示',
  171. content: '打印已经结束,是否返回上页!',
  172. success (ret) {
  173. if (ret.confirm || ret.index == 0) {
  174. uni.navigateBack()
  175. }
  176. }
  177. })
  178. }
  179. }
  180. }
  181. </script>
  182. <style lang="less">
  183. .printTag{
  184. background-color: #fff;
  185. width: 100vh;
  186. padding: 50rpx 30rpx;
  187. .print-nums{
  188. padding: 50rpx 30rpx 10rpx;
  189. color: #999;
  190. font-size: 32rpx;
  191. > view{
  192. padding: 20rpx 0;
  193. }
  194. .u-ninput{
  195. border: 2rpx solid #eee;
  196. border-radius: 50rpx;
  197. padding: 0 12rpx;
  198. }
  199. /deep/ .u-icon-disabled{
  200. background: #fff!important;
  201. }
  202. /deep/ .u-number-input{
  203. margin: 0 2rpx;
  204. border: 2rpx solid #eee;
  205. border-top: 0;
  206. border-bottom: 0;
  207. }
  208. /deep/ .u-icon-plus, /deep/ .u-icon-minus{
  209. border-radius: 50rpx;
  210. }
  211. }
  212. .print-radio{
  213. padding: 20rpx 20rpx 50rpx;
  214. text-align: center;
  215. }
  216. .shelf-info{
  217. background-color: #f8f8f8;
  218. border-radius: 12rpx;
  219. color: #707070;
  220. .shelf-info-title{
  221. font-size: 30rpx;
  222. color: #222222;
  223. display: flex;
  224. justify-content: space-between;
  225. border-bottom: 1rpx solid #eee;
  226. padding: 15rpx 30rpx;
  227. font-weight: bold;
  228. .shelf-name{
  229. flex:1;
  230. margin-right: 10rpx;
  231. }
  232. .pno{
  233. background: rgba(3, 54, 146, 0.15);
  234. border-radius: 100rpx;
  235. padding: 0 20rpx;
  236. color: #033692;
  237. font-size: 26rpx;
  238. height: 40rpx;
  239. margin-top:5rpx;
  240. }
  241. }
  242. .shelf-info-body{
  243. padding: 15rpx 30rpx;
  244. > view{
  245. padding: 5rpx 0;
  246. }
  247. }
  248. }
  249. .buttons{
  250. padding: 50rpx 0;
  251. > view{
  252. width: 36%;
  253. margin: 0 2%;
  254. }
  255. }
  256. }
  257. </style>