|
@@ -0,0 +1,425 @@
|
|
|
|
+<template>
|
|
|
|
+ <view class="container">
|
|
|
|
+ <uni-forms ref="valiForm" label-align="right" :label-width="80" :rules="rules" :modelValue="valiFormData">
|
|
|
|
+ <view class="space-select">
|
|
|
|
+ <uni-data-select v-if="!editSpaceNo" v-model="valiFormData.space_id" placeholder="请选择库位"
|
|
|
|
+ :localdata="options.space" :clear="false"></uni-data-select>
|
|
|
|
+ <uni-easyinput v-if="editSpaceNo" :value="space" :disabled="editSpaceNo" />
|
|
|
|
+ <button v-if="!editSpaceNo" type="primary" @click="submitSpace">确认</button>
|
|
|
|
+ <button v-if="editSpaceNo" type="primary" @click="editSpaceNo = false">修改</button>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <uni-easyinput v-model="valiFormData.code" placeholder="请输入运单号" suffixIcon="scan" :focus="focusType"
|
|
|
|
+ @iconClick="scanInput" />
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </uni-forms>
|
|
|
|
+ <view class="button-group">
|
|
|
|
+ <button type="info" @click="reset">重置</button>
|
|
|
|
+ <button type="primary" @click="onsubmit" :loading="loading">
|
|
|
|
+ <uni-icons v-if="!loading" type="checkmarkempty" size="18" color="white"></uni-icons>
|
|
|
|
+ 提交
|
|
|
|
+ </button>
|
|
|
|
+ </view>
|
|
|
|
+ <view v-if="waybillNoHistory.length > 0" class="history">
|
|
|
|
+ <text class="title">记录(最近5条)</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="history">
|
|
|
|
+ <view class="item" v-for="(item, i) in waybillNoHistory.slice(0, 5)" :key="i">
|
|
|
|
+ <view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="type">库位</text>
|
|
|
|
+ <text class="code" :style="{ color: item.status ? 'green' : '#666' }">{{ item.space }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <text class="type">单号</text>
|
|
|
|
+ <text class="code" :style="{ color: item.status ? 'green' : '#666' }">{{ item.code }}</text>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="space-time">
|
|
|
|
+ <text>
|
|
|
|
+ {{ item.createTime }}
|
|
|
|
+ </text>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ <uni-icons v-if="item.status" type="checkmarkempty" class="status" size="16"
|
|
|
|
+ color="green"></uni-icons>
|
|
|
|
+ <text class="status fail" v-else>F</text>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <uni-popup ref="messageRef" type="message">
|
|
|
|
+ <uni-popup-message :type="messageType" :message="messageText" :duration="2000"></uni-popup-message>
|
|
|
|
+ </uni-popup>
|
|
|
|
+ </view>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script setup lang="ts">
|
|
|
|
+ import { reactive, ref, computed, nextTick } from 'vue';
|
|
|
|
+ import permision from '@/common/permission.js';
|
|
|
|
+ import { onShow, onLoad, onUnload, onHide, onBackPress, onNavigationBarButtonTap } from '@dcloudio/uni-app';
|
|
|
|
+ import { waybillNoOptions, addWaybillNoURL, getWaybillsURL } from '@/utils/api.js';
|
|
|
|
+ const token = ref();
|
|
|
|
+ const editSpaceNo = ref(false);
|
|
|
|
+ const loading = ref(false);
|
|
|
|
+ const hidePage = ref(false);
|
|
|
|
+ const focusType = ref(true);
|
|
|
|
+ const waybillNoHistory = ref([]);
|
|
|
|
+ const messageRef = ref();
|
|
|
|
+ const messageType = ref();
|
|
|
|
+ const messageText = ref();
|
|
|
|
+ let st : NodeJS.Timeout;
|
|
|
|
+
|
|
|
|
+ const valiFormData = ref({
|
|
|
|
+ code: '',
|
|
|
|
+ space_id: '',
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ const rules = reactive({
|
|
|
|
+ code: {
|
|
|
|
+ rules: [
|
|
|
|
+ {
|
|
|
|
+ required: true,
|
|
|
|
+ errorMessage: '单号不能为空'
|
|
|
|
+ }
|
|
|
|
+ ]
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ const options = reactive({
|
|
|
|
+ space: [] as any,
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ const checkPermission = async () => {
|
|
|
|
+ let status = permision.isIOS ? await permision.requestIOS('camera') : await permision.requestAndroid('android.permission.CAMERA');
|
|
|
|
+
|
|
|
|
+ if (status === null || status === 1) {
|
|
|
|
+ status = 1;
|
|
|
|
+ } else {
|
|
|
|
+ uni.showModal({
|
|
|
|
+ content: 'Camera permission required',
|
|
|
|
+ confirmText: 'Setting',
|
|
|
|
+ success: function (res) {
|
|
|
|
+ if (res.confirm) {
|
|
|
|
+ permision.gotoAppSetting();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ return status;
|
|
|
|
+ };
|
|
|
|
+ const scanInput = async () => {
|
|
|
|
+ // #ifdef APP-PLUS
|
|
|
|
+ let status = await checkPermission();
|
|
|
|
+ if (status !== 1) {
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ // #endif
|
|
|
|
+ uni.scanCode({
|
|
|
|
+ success: (res : any) => {
|
|
|
|
+ valiFormData.value.code = res.result;
|
|
|
|
+ // onsubmit();
|
|
|
|
+ },
|
|
|
|
+ fail: (err) => {
|
|
|
|
+ // 需要注意的是小程序扫码不需要申请相机权限
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ };
|
|
|
|
+ const reset = () => {
|
|
|
|
+ loading.value = false;
|
|
|
|
+ valiFormData.value.code = '';
|
|
|
|
+ // editSpaceNo.value && (valiFormData.value.space_id = '');
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ const submitSpace = () => {
|
|
|
|
+ if (valiFormData.value.space_id) {
|
|
|
|
+ editSpaceNo.value = true
|
|
|
|
+ setFocus()
|
|
|
|
+ } else {
|
|
|
|
+ messageType.value = 'error';
|
|
|
|
+ messageText.value = '请选择库位';
|
|
|
|
+ messageRef.value.open();
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ const space = computed(() => {
|
|
|
|
+ const res = options.space.find(item => item.value === valiFormData.value.space_id)
|
|
|
|
+ return res?.text
|
|
|
|
+ })
|
|
|
|
+
|
|
|
|
+ const findPalletNumIdByValue = (data : any, targetValue : any) => {
|
|
|
|
+ for (let i = 0; i < data.length; i++) {
|
|
|
|
+ const item = data[i];
|
|
|
|
+ // 检查当前项的 label
|
|
|
|
+ if (item.id === targetValue || item.value === targetValue) {
|
|
|
|
+ return [item.id];
|
|
|
|
+ } else if (item.children && item.children.length > 0) {
|
|
|
|
+ const childId = findPalletNumIdByValue(item.children, targetValue) as any;
|
|
|
|
+ if (childId !== null) {
|
|
|
|
+ return childId;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ return null;
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ const onsubmit = () => {
|
|
|
|
+ if (valiFormData.value.space_id && valiFormData.value.code) {
|
|
|
|
+ st && clearTimeout(st);
|
|
|
|
+ loading.value = true;
|
|
|
|
+ uni.request({
|
|
|
|
+ url: addWaybillNoURL,
|
|
|
|
+ method: 'POST',
|
|
|
|
+ header: {
|
|
|
|
+ batoken: token.value
|
|
|
|
+ },
|
|
|
|
+ data: {
|
|
|
|
+ code: valiFormData.value.code,
|
|
|
|
+ space_id: valiFormData.value.space_id,
|
|
|
|
+ },
|
|
|
|
+ success: (res : any) => {
|
|
|
|
+ loading.value = false;
|
|
|
|
+ const space = options.space.find(item => item.value === valiFormData.value.space_id)
|
|
|
|
+ if (res.data.code == 1) {
|
|
|
|
+ messageType.value = 'success';
|
|
|
|
+ messageText.value = res.data.msg;
|
|
|
|
+ messageRef.value.open();
|
|
|
|
+ const historyItem = {
|
|
|
|
+ code: valiFormData.value.code,
|
|
|
|
+ createTime: new Date(),
|
|
|
|
+ type: '运单号',
|
|
|
|
+ space: space.text,
|
|
|
|
+ status: true
|
|
|
|
+ };
|
|
|
|
+ waybillNoHistory.value.unshift(historyItem);
|
|
|
|
+ uni.setStorageSync('waybillNoHistory', waybillNoHistory.value);
|
|
|
|
+ getHistory();
|
|
|
|
+ } else {
|
|
|
|
+ messageType.value = 'error';
|
|
|
|
+ messageText.value = res.data.msg;
|
|
|
|
+ messageRef.value.open();
|
|
|
|
+
|
|
|
|
+ const historyItem = {
|
|
|
|
+ code: valiFormData.value.code,
|
|
|
|
+ createTime: new Date(),
|
|
|
|
+ type: '运单号',
|
|
|
|
+ space: space.text,
|
|
|
|
+ status: false
|
|
|
|
+ };
|
|
|
|
+ waybillNoHistory.value.unshift(historyItem);
|
|
|
|
+ uni.setStorageSync('waybillNoHistory', waybillNoHistory.value);
|
|
|
|
+ getHistory();
|
|
|
|
+ }
|
|
|
|
+ st = setTimeout(() => {
|
|
|
|
+ reset();
|
|
|
|
+ setFocus();
|
|
|
|
+ st && clearTimeout(st);
|
|
|
|
+ }, 1000);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ } else {
|
|
|
|
+ if (!valiFormData.value.space_id) {
|
|
|
|
+ messageType.value = 'error';
|
|
|
|
+ messageText.value = '请选择库位';
|
|
|
|
+ messageRef.value.open();
|
|
|
|
+ }
|
|
|
|
+ if (!valiFormData.value.code) {
|
|
|
|
+ messageType.value = 'error';
|
|
|
|
+ messageText.value = '请填写运单号';
|
|
|
|
+ messageRef.value.open();
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ const getHistory = () => {
|
|
|
|
+ waybillNoHistory.value = uni.getStorageSync('waybillNoHistory') || [];
|
|
|
|
+ };
|
|
|
|
+ const keypress = (e : any) => {
|
|
|
|
+ console.log(e, '按键码');
|
|
|
|
+ // 102 左侧 103 右侧 104 中间按键
|
|
|
|
+ if (e.keyCode === 102 || e.keyCode === 103 || e.keyCode === 104) {
|
|
|
|
+ //这里按键成功
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if (e.keyCode == 66) {
|
|
|
|
+ //enter按键
|
|
|
|
+ //这里input已经拿到数据了,在这里把拿到的数据,通过接口数据联调起来
|
|
|
|
+ onsubmit();
|
|
|
|
+ }
|
|
|
|
+ };
|
|
|
|
+ onLoad(() => {
|
|
|
|
+ // #ifdef APP-PLUS
|
|
|
|
+ plus.key.addEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ // #ifdef H5
|
|
|
|
+ document.addEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ });
|
|
|
|
+ onUnload(() => {
|
|
|
|
+ // #ifdef APP-PLUS
|
|
|
|
+ plus.key.removeEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ // #ifdef H5
|
|
|
|
+ document.removeEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ });
|
|
|
|
+ onHide(() => {
|
|
|
|
+ hidePage.value = true;
|
|
|
|
+ // #ifdef APP-PLUS
|
|
|
|
+ plus.key.removeEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ // #ifdef H5
|
|
|
|
+ document.removeEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ });
|
|
|
|
+ onBackPress(() => {
|
|
|
|
+ // #ifdef APP-PLUS
|
|
|
|
+ plus.key.removeEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ // #ifdef H5
|
|
|
|
+ document.removeEventListener('keyup', keypress);
|
|
|
|
+ // #endif
|
|
|
|
+ });
|
|
|
|
+ onShow(() => {
|
|
|
|
+ hidePage.value = false;
|
|
|
|
+ token.value = uni.getStorageSync('token');
|
|
|
|
+ getOptions();
|
|
|
|
+ getHistory();
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ const getOptions = () => {
|
|
|
|
+ uni.request({
|
|
|
|
+ url: waybillNoOptions,
|
|
|
|
+ method: 'GET',
|
|
|
|
+ header: {
|
|
|
|
+ batoken: token.value
|
|
|
|
+ },
|
|
|
|
+ success: (res : any) => {
|
|
|
|
+ console.log(res);
|
|
|
|
+ if (res.data.code === 1) {
|
|
|
|
+ for (let key in res.data.data.space_id) {
|
|
|
|
+ if (res.data.data.space_id.hasOwnProperty(key)) {
|
|
|
|
+ options.space.push({ text: res.data.data.space_id[key], value: key })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ fail(e) {
|
|
|
|
+ console.log('fail--', e);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ const setFocus = () => {
|
|
|
|
+ if (hidePage.value) {
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ focusType.value = false;
|
|
|
|
+ nextTick(() => {
|
|
|
|
+ focusType.value = true;
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ onNavigationBarButtonTap((event) => {
|
|
|
|
+ if (event.index === 0) {
|
|
|
|
+ uni.navigateTo({
|
|
|
|
+ url: '/pages/waybillNo/waybillNoLog'
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="scss">
|
|
|
|
+ .container {
|
|
|
|
+ padding: 15px;
|
|
|
|
+ background-color: #fff;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .space-select {
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+ margin-bottom: 20rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ button {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ height: 35px;
|
|
|
|
+ margin-left: 20rpx;
|
|
|
|
+ font-size: 16rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .weight-tip {
|
|
|
|
+ color: gray;
|
|
|
|
+ font-size: 12rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .button-group {
|
|
|
|
+ margin-top: 15px;
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+ justify-content: space-around;
|
|
|
|
+
|
|
|
|
+ button {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ height: 35px;
|
|
|
|
+ width: 50%;
|
|
|
|
+ margin-left: 10px;
|
|
|
|
+ font-size: 16rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .uni-icons {
|
|
|
|
+ margin-right: 10px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .history {
|
|
|
|
+ display: flex;
|
|
|
|
+ width: 100%;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ justify-items: start;
|
|
|
|
+
|
|
|
|
+ .title {
|
|
|
|
+ padding: 20rpx;
|
|
|
|
+ font-size: 24rpx;
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .type {
|
|
|
|
+ padding-right: 20rpx;
|
|
|
|
+ font-size: 24rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .code {
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .item {
|
|
|
|
+ padding: 20rpx;
|
|
|
|
+ font-size: 20rpx;
|
|
|
|
+ color: #666;
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: row;
|
|
|
|
+
|
|
|
|
+ .status {
|
|
|
|
+ padding-left: 20rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .fail {
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ color: #f00;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .is-empty {
|
|
|
|
+ text-align: center;
|
|
|
|
+ margin: 40px 0;
|
|
|
|
+ color: #999;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+</style>
|