|
|
@@ -1,33 +1,17 @@
|
|
|
<template>
|
|
|
- <view class='container'>
|
|
|
- <view class='content'>
|
|
|
- <view>
|
|
|
- <text class='title'>{{firstTitle}}</text>
|
|
|
- <view>
|
|
|
- <view class="form-item uni-row">
|
|
|
- <input class='inp' v-model='inpValue' />
|
|
|
- <input class='inp' v-model='inpValue' />
|
|
|
+ <view class='container' >
|
|
|
+ <view class='content' style="height: 1000rpx;">
|
|
|
+ <view >
|
|
|
+ <text class='title'>当前箱号</text>
|
|
|
+ <view class="vehicleList uni-row" style="height: 100%;">
|
|
|
+ <view class="vehicleNo uni-row" v-for="(item,index) in vehicleList">
|
|
|
+ <text>{{item}}</text>
|
|
|
+ <text @click="handleDelVehicleNo(item)">×</text>
|
|
|
</view>
|
|
|
- <view class='btn-container uni-row'>
|
|
|
- <button class='btn' type='primary' @click='addHandle()'>添加</button>
|
|
|
- <button class='btn' type='primary' @click='scanCodeHandle()'>扫码</button>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class='middle'>
|
|
|
- <view class='segment'></view>
|
|
|
- <image class='img' src="../../static/convert.png"></image>
|
|
|
- <view class='segment'></view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view>
|
|
|
- <text class='title'>{{secondTitle}}</text>
|
|
|
- <view class="form-item uni-row">
|
|
|
- <input class='inp' v-model='secondInpValue' />
|
|
|
- <input class='inp' v-model='secondInpValue' />
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <button class='submit code' >扫码</button>
|
|
|
- </view>
|
|
|
+ <view class="btn">
|
|
|
+ <button class='submit code' @click="handleScanCode()" >扫码</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class='bottom uni-row'>
|
|
|
@@ -46,14 +30,20 @@
|
|
|
|
|
|
|
|
|
onLoad(() => {
|
|
|
- firstTitle.value = '扫描旧箱子';
|
|
|
- secondTitle.value = '扫描新箱子';
|
|
|
})
|
|
|
- const firstTitle = ref(null)
|
|
|
- const secondTitle = ref(null)
|
|
|
- const inpValue = ref('X1523')
|
|
|
- const secondInpValue = ref('X1893')
|
|
|
-
|
|
|
+ const vehicleList = ref(['X1234','X1654','X2458','X1698','X7895'])
|
|
|
+ function handleDelVehicleNo(item) {
|
|
|
+ vehicleList.value.splice(item,1);
|
|
|
+ }
|
|
|
+ function handleScanCode() {
|
|
|
+ uni.scanCode({
|
|
|
+ scanType: ['qrCode'], // 条形码扫描
|
|
|
+ onlyFromCamera: true, // 只允许相机扫码
|
|
|
+ success: function(res) {
|
|
|
+ vehicleList.value.push(res.result);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
@@ -90,7 +80,26 @@
|
|
|
background-color: rgba(255, 255, 255, 1);
|
|
|
margin: 50rpx auto;
|
|
|
padding-bottom: 50rpx;
|
|
|
- border-radius: 12rpx
|
|
|
+ border-radius: 12rpx;
|
|
|
+ .vehicleList {
|
|
|
+ justify-content: flex-start;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ width: 100%;
|
|
|
+ height: 120rpx;
|
|
|
+ overflow: auto;
|
|
|
+ padding: 0 80rpx;
|
|
|
+
|
|
|
+ .vehicleNo {
|
|
|
+ padding: 0 10rpx;
|
|
|
+ margin: 10rpx;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ width: 230rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ border: 1px solid rgba(213, 213, 213, 1);
|
|
|
+ border-radius: 6rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.title {
|
|
|
@@ -100,41 +109,12 @@
|
|
|
font-weight: bold;
|
|
|
}
|
|
|
|
|
|
- .form-item {
|
|
|
- justify-content: space-between;
|
|
|
- padding: 0 80rpx;
|
|
|
-
|
|
|
- .inp {
|
|
|
- width: 232rpx;
|
|
|
- height: 60rpx;
|
|
|
- border: 1px solid rgba(39, 138, 247, 1);
|
|
|
- margin: 30rpx auto;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .btn-container {
|
|
|
- padding: 0 80rpx;
|
|
|
- .btn {
|
|
|
- width: 232rpx;
|
|
|
- height: 80rpx;
|
|
|
- line-height: 80rpx;
|
|
|
- margin: 30rpx auto;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- margin: 10rpx
|
|
|
- }
|
|
|
-
|
|
|
- .middle {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- align-items: center;
|
|
|
- justify-content: center
|
|
|
- }
|
|
|
+.btn {
|
|
|
+ position: fixed;
|
|
|
+ top: 940rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
|
|
|
.segment {
|
|
|
width: 280rpx;
|
