location-order.vue 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <view class="container">
  3. <view class="header">
  4. <view class="flex-d">
  5. <text>仓库: 河南仓</text>
  6. <text class="mt-16">库位编号: {{ location }}</text>
  7. <text class="mt-16">订单数量: 3</text>
  8. </view>
  9. </view>
  10. <view class="product-details">
  11. <LocationOrderItem v-for="(item, index) in products" :key="index" :item="item" />
  12. </view>
  13. <!-- 底部扫码输入框 -->
  14. <view class="fixed-bottom pad-20" style="background: #ffffff;">
  15. <u-search placeholder="请输入快递单号/订单编号" v-model="searchValue" @confirm="onSearch" :show-action="false"
  16. custom-style="margin-right:10px"></u-search>
  17. <u-icon name="scan" size="28" color="#19be6b" @click="openScan"></u-icon>
  18. </view>
  19. </view>
  20. </template>
  21. <script setup>
  22. import {
  23. reactive,
  24. ref
  25. } from 'vue'
  26. import LocationOrderItem from './components/LocationOrderItem.vue'
  27. const location = 'K01-01-1A'
  28. const searchValue = ref('')
  29. const products = ref([{
  30. orderNo: '978704051555',
  31. logisticsNo: "SFUS98218323132131",
  32. inspectionDate: "2023-01-01",
  33. badCount: 5,
  34. operator: '张三',
  35. },
  36. {
  37. orderNo: '978704051555',
  38. logisticsNo: "SFUS98218323132131",
  39. inspectionDate: "2023-01-01",
  40. badCount: 5,
  41. operator: '张三',
  42. }
  43. ])
  44. const operationLogs = ref([
  45. // Example log data
  46. {
  47. date: '2024-01-12 14:18:01',
  48. user: '张张张',
  49. action: '提交出库'
  50. },
  51. {
  52. date: '2024-01-12 14:18:01',
  53. user: '张张张',
  54. action: '提交入库'
  55. }
  56. ])
  57. const onSearch = () => {
  58. // Implement search logic here
  59. }
  60. function openScan() {
  61. }
  62. </script>
  63. <style lang="scss" scoped>
  64. .header {
  65. display: flex;
  66. justify-content: space-between;
  67. padding: 20rpx 30rpx;
  68. background-color: #ffffff;
  69. }
  70. .status {
  71. color: green;
  72. }
  73. .log-item {
  74. display: flex;
  75. justify-content: space-between;
  76. padding: 20rpx 30rpx;
  77. border-bottom: 1px solid #e0e0e0;
  78. }
  79. </style>