warehouse-sign.vue 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. <template>
  2. <view class="container">
  3. <view class="main-content">
  4. <view class="input-group">
  5. <u-input :customStyle="customStyle" :placeholder-style="placeholderStyle" v-model="selectedWarehouse"
  6. placeholder="请选择仓库" readonly border="surround" />
  7. <u-button :customStyle="customStyle" type="info" color="#a4adb3" @click="openWarehouseSelector"
  8. text="选择" />
  9. </view>
  10. <view class="input-group">
  11. <u-input :customStyle="customStyle" :placeholder-style="placeholderStyle" v-model="form.packageCode"
  12. placeholder="扫描/输入物流单号" border="surround" />
  13. <u-button :customStyle="customStyle" type="info" color="#a4adb3"
  14. @click="handleBarcode(form.packageCode)" text="确定" />
  15. </view>
  16. </view>
  17. <view class="fixed-bottom">
  18. <u-button size="large" type="success" @click="scanCode" text="扫码" class="scan-button" />
  19. </view>
  20. <WarehouseSelector v-model:show="showSelector" @warehouse-selected="handleWarehouseSelected" />
  21. </view>
  22. </template>
  23. <script setup>
  24. import {
  25. reactive,
  26. ref
  27. } from 'vue';
  28. import {
  29. onLoad
  30. } from '@dcloudio/uni-app'
  31. import WarehouseSelector from './components/WarehouseSelector.vue';
  32. const placeholderStyle = "font-size:32rpx"
  33. const customStyle = reactive({
  34. height: '90rpx'
  35. })
  36. const selectedWarehouse = ref('');
  37. const form = ref({
  38. "packageCode": "",
  39. "godownId": "",
  40. })
  41. const showSelector = ref(false);
  42. function openWarehouseSelector() {
  43. showSelector.value = true;
  44. }
  45. //选择仓库之后后处理
  46. function handleWarehouseSelected(item) {
  47. selectedWarehouse.value = item.godownName;
  48. form.value.godownId = item.id
  49. }
  50. function scanCode() {
  51. uni.scanCode({
  52. success: (res) => {
  53. form.value.packageCode = res.result;
  54. handleBarcode(res.result)
  55. },
  56. fail: (err) => {
  57. uni.$u.toast('扫码失败')
  58. }
  59. });
  60. }
  61. function handleBarcode(code) {
  62. if (!code) return uni.$u.toast('请输入物流单号')
  63. uni.$u.http.post('/app/ordersign/toGodownSign', form.value).then(res => {
  64. if (res.code == 200) {
  65. let text = code + '到仓签收成功'
  66. uni.$u.ttsModule.speak(text)
  67. } else {
  68. let text = code + '订单不存在'
  69. uni.$u.ttsModule.speak(text)
  70. }
  71. })
  72. }
  73. //获取用户绑定的仓库
  74. function getUserBindWarehouse() {
  75. uni.$u.http.get('/app/appUser/getUserBindGodown').then(res => {
  76. if (res.code == 200) {
  77. selectedWarehouse.value = res.data?.godownName
  78. form.value.godownId = res.data?.id
  79. }
  80. })
  81. }
  82. onLoad(() => {
  83. getUserBindWarehouse()
  84. // #ifdef APP-PLUS
  85. uni.$u.useGlobalEvent((e) => {
  86. form.value.packageCode = e.barcode;
  87. handleBarcode(e.barcode)
  88. })
  89. // #endif
  90. })
  91. </script>
  92. <style lang="scss" scoped>
  93. .main-content {
  94. padding: 20px;
  95. gap: 20px;
  96. }
  97. .input-group {
  98. display: flex;
  99. gap: 10px;
  100. margin-bottom: 30rpx;
  101. :deep(.u-button) {
  102. width: 160rpx
  103. }
  104. .u-input {
  105. background-color: #fff;
  106. }
  107. }
  108. </style>