<template>
|
<view class="pages-map-pallet-size">
|
<view class="tip">{{translate("pallet_size")}}</view>
|
<view class="row">
|
<view class="width-50">
|
<text class="attr">{{translate("length")}}:</text>
|
<input class=" val " type="number" :value="palletLength" @blur="onBlurPalletLength"
|
@confirm="onConfirmPalletLength" :maxlength="10" :placeholder="translate('input_please')" />
|
cm
|
</view>
|
<view class="width-50">
|
<text class="attr">{{translate("width")}}:</text>
|
<input class=" val " type="number" :value="palletWidth" @blur="onBlurPalletWidth"
|
@confirm="onConfirmPalletWidth" :maxlength="10" :placeholder="translate('input_please')" />
|
|
cm
|
</view>
|
</view>
|
</view>
|
</template>
|
<script>
|
import {
|
showToast,
|
showModal,
|
session,
|
showError,
|
showInfo
|
} from "@/comm/utils.js"
|
import {
|
Button
|
} from 'antd-mobile-vue-next'
|
|
import {
|
savePalletSize,
|
getPalletSize,
|
|
} from "@/api/vehicle.js"
|
export default {
|
name: "PagesMapPalletSize",
|
components: {
|
'a-button': Button
|
},
|
props: {
|
ip: {
|
type: String,
|
default () {
|
return ''
|
}
|
},
|
},
|
data() {
|
return {
|
palletLength: "200",
|
palletWidth: "1000"
|
}
|
},
|
computed: {
|
|
},
|
|
mounted() {
|
this.loadData()
|
|
},
|
methods: {
|
async loadData() {
|
try {
|
const res = await getPalletSize(this.ip)
|
this.palletLength = res?.length ? Math.floor(res.length * 100) : "200"
|
this.palletWidth = res?.width ? Math.floor(res.width * 100) : "1000"
|
} catch (ex) {
|
|
showError(ex, this.translate('error'))
|
}
|
},
|
|
validateNumber(input) {
|
// 常用正则模式
|
const patterns = {
|
integer: /^-?\d+$/, // 整数，包括负数 [citation:6]
|
positiveInt: /^[1-9]\d*$/, // 正整数 [citation:7]
|
decimal: /^-?\d*\.?\d+$/, // 小数 (支持像 ".1" 这样的格式)
|
decimalFixed: /^-?\d*\.?\d{0,3}$/, // 最多两位小数 [citation:5][citation:8]
|
};
|
// 选择需要的模式进行测试，例如使用 decimal
|
return patterns.integer.test(input);
|
},
|
async savePalletSize() {
|
try {
|
if (!this.validateNumber(this.palletLength)) {
|
console.log("input_content_only_numbers_or_signs")
|
showError(this.translate("input_content_only_numbers_or_signs"))
|
return
|
}
|
if (!this.validateNumber(this.palletWidth)) {
|
console.log("input_content_only_numbers_or_signs")
|
showError(this.translate("input_content_only_numbers_or_signs"))
|
return
|
}
|
const len = Number(this.palletLength) / 100
|
const width = Number(this.palletWidth) / 100
|
await savePalletSize(this.ip, len, width)
|
console.log("modify_success_restart_device", this.palletLength, this.palletWidth)
|
showToast(this.translate("modify_success_restart_device"))
|
} catch (ex) {
|
showError(ex, this.translate('error'))
|
}
|
},
|
onBlurPalletLength(event) {
|
this.palletLength = event.detail.value
|
this.savePalletSize()
|
},
|
onConfirmPalletLength(event) {
|
this.palletLength = event.detail.value
|
this.savePalletSize()
|
},
|
|
onBlurPalletWidth(event) {
|
this.palletWidth = event.detail.value
|
|
this.savePalletSize()
|
|
},
|
onConfirmPalletWidth(event) {
|
this.palletWidth = event.detail.value
|
this.savePalletSize()
|
},
|
translate(t) {
|
if (typeof this.$t == "function") return this.$t(`page.${t}`)
|
else return t;
|
},
|
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.pages-map-pallet-size {
|
.tip {
|
color: #888;
|
margin: 10rpx;
|
text-align: left;
|
}
|
|
.row {
|
margin: 5px;
|
display: flex;
|
flex-direction: row;
|
|
.width-50 {
|
width: calc(50% - 10rpx);
|
display: flex;
|
flex-direction: row;
|
padding-left: 10rpx;
|
}
|
|
.attr {
|
padding-right: 10rpx;
|
}
|
|
.val {
|
flex: 1;
|
padding-left: 10rpx;
|
color: #2d8cf0;
|
background-color: #fff;
|
border-bottom: 1px solid #ccc;
|
|
}
|
}
|
|
|
|
|
}
|
</style>
|
