print-config.vue 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <view class="printconfig">
  3. <view v-if="initPrint==false" class="initPrint">
  4. <view class="title">使用须知</view>
  5. <view class="tips">使用前先连接wifi打印机</view>
  6. <uni-easyinput class="input" confirm-type="done" v-model="printInfo.ip" placeholder="请输入打印机ip地址" @confirm="connectPrint"></uni-easyinput>
  7. </view>
  8. <view v-else class="printInfo">
  9. <view>当前连接打印机</view>
  10. <uni-easyinput disabled v-model="printInfo.ip" placeholder="请输入打印机ip地址"></uni-easyinput>
  11. <button @click="resetPrint">断开连接</button>
  12. </view>
  13. </view>
  14. </template>
  15. <script>
  16. export default {
  17. name: 'printConfig'
  18. }
  19. </script>
  20. <script setup>
  21. import { onMounted, ref } from 'vue'
  22. const plug= uni.requireNativePlugin('Html5app-Gprinter');
  23. const initPrint = ref(false)
  24. const printInfo = ref({
  25. ip:'',
  26. port:'9100'
  27. })
  28. onMounted(() => {
  29. })
  30. const emit = defineEmits(['emitClose'])
  31. const connectPrint = ()=>{
  32. const ipReg = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/
  33. if(ipReg.test(printInfo.value.ip)){
  34. if(RegExp.$1<256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256){
  35. plug.connectIP({"ip":printInfo.value.ip,"port":printInfo.value.port},ret=>{
  36. console.log('connectPrint>>ret',ret)
  37. const res = JSON.parse(JSON.stringify(ret))
  38. console.log('connectPrint>>res',res.code)
  39. if(res.code==3){
  40. initPrint.value = true
  41. // _this.tip=JSON.stringify(ret);
  42. // console.log(_this.tip);
  43. // 关闭配置页操作
  44. emit('emitClose')
  45. } else{
  46. uni.$showMsg('打印机连接失败,请重试!', 500)
  47. }
  48. });
  49. } else{
  50. uni.$showMsg('ip地址有误,请重试!', 2000)
  51. }
  52. }
  53. }
  54. const resetPrint = ()=>{
  55. plug.disconnect({},ret=>{
  56. uni.$showMsg(ret.msg, 2000)
  57. initPrint.value = false
  58. // console.log(_this.tip);
  59. });
  60. }
  61. </script>
  62. <style lang="scss">
  63. .printconfig{
  64. background-color: #fff;
  65. width: 500rpx;
  66. height: 300rpx;
  67. padding: 20rpx;
  68. .initPrint{
  69. .title{
  70. font-size: 20rpx;
  71. }
  72. .tips{
  73. font-size: 16rpx;
  74. }
  75. .input{
  76. width: 300rpx;
  77. }
  78. }
  79. }
  80. </style>