sailun-tbr-web/pages/home/scancode/index.vue

<template>
	<view class="content">
		<view class="text-area">
			<scan @getCode="getScanCode" />
		</view>
		<view class="stripe"></view>
		<view class="roll">
			<view>
				<view @click="show =! show">
					<u-icon name="edit-pen"></u-icon>手动录入
				</view>
				<view class="" v-if="show==true">
					<input type="text" value="wocao" style="background-color: #DD6161;width: 60%;font-size: 42rpx;border: 1rpx solid #000;" />
				</view>
				<view class="" v-else>
					<view>{{tips}}：{{number}}</view>
				</view>
			</view>
			<view>
				<view></view>
				<view></view>
				<view style="width: 94%;height: 20px;background-color: rgb(0,0,0,0);margin: 0 auto;margin-top: -1rpx;border-radius: 0;">
					<image src="../../../static/sailun/line.png" style="width: 100%;height: 1rpx;" mode=""></image>
				</view>
			</view>
			<view class="generate">
				<u-table font-size="24" border-color="#ffffff" bg-color="#fff">
					<u-tr class="u-tr">
						<u-th class="u-th" width="30%">胎号</u-th>
						<u-th class="u-th">规格</u-th>
						<u-th class="u-th" width="15%">操作</u-th>
					</u-tr>
					<u-tr class="u-tr" :key="index" v-for="(item, index) in lisi">
						<u-td class="u-td" width="30%">{{item.tireNumber}}</u-td>
						<u-td class="u-td">{{item.maktx}}</u-td>
						<u-td class="u-td" width="15%"><text @click="confirm(index)" style="color: #FA3534;">删除</text></u-td>
					</u-tr>
				</u-table>
				<u-divider color="rgb(144, 147, 153)" half-width="200" border-color="rgb(144, 147, 153)" margin-top="40">没有更多了</u-divider>
			</view>
		</view>
		<view class="determine">
			<u-button type="primary" shape="circle" @click="scancodein">扫码确认</u-button>
		</view>
		<view>
		</view>
		<u-toast ref="repeat" position="bottom" />
		
		
	</view>
</template>

<script>
	import {
		request
	} from '../../../common/request/request'
	require("promise.prototype.finally").shim()
	export default {
		data() {
			return {
				tips: '提示',
				number: '请扫码入库',
				nbTitle: '扫码标题',
				content: '东临碣石，以观沧海',
				number_s: '',
				lisi: [],
				background: {
					backgroundColor: '#0094fe',
				},
				show: true,
				zoom:18,//地图相关设置
				center:{lng:0,lat:0}


			}
		},
		created() {
			
		},
		methods: {
			//获取扫码控件
			getScanCode(val) {
				console.log(val)
				this.number = val
				this.number_s = val
				request({
						url: '/storeScan/storeScanGetTyre',
						method: 'Post',
						data: {
							storeId: '1000',
							userId: '123',
							tyreNum: this.number_s
						}
					}).then(res => {
						this.tips = "胎号"
						for (let i = 0; i < this.lisi.length; i++) {
							if (this.lisi[i].tireNumber == res.data.data[0].tirenumber) {
								this.$refs.repeat.show({
									title: '请勿重复扫码',
									type: 'default',
									position: 'bottom'
								})
								return
							} else if (res.data.data[0].flagRegular == 1) {
								this.$refs.repeat.show({
									title: '轮胎非正规',
									type: 'default',
									position: 'bottom'
								})
								return
							}
						}
						this.$refs.repeat.show({
							title: '扫码成功',
							type: 'success',
							position: 'bottom'
						})
						console.log("我成功啦")
						this.lisi.push({
							specs: res.data.data[0].specs,
							flagRegular: res.data.data[0].isRegular,
							diameter: res.data.data[0].diameter,
							maktx: res.data.data[0].maktx,
							pattern: res.data.data[0].pattern,
							soldToPartyKunnr: res.data.data[0].soldToPartyKunnr,
							matnr: res.data.data[0].matnr,
							tireNumber: res.data.data[0].tirenumber,
							brand: res.data.data[0].brand,
							shippedDate: res.data.data[0].shippedDate,
							scanWay: '1'
						})
						console.log(this.lisi)
					}).catch(err => {
						this.$refs.repeat.show({
							title: "请重新扫码",
							type: 'default',
							position: 'bottom'
						})
						console.log(err)
					})
					.finally(() => {
						// Loading.close()
					})
			},
			confirm(index) {
				console.log(index + "什么情况")
				this.lisi.splice(index, 1)
			},
			scancodein() {
				if (this.lisi == '') {
					this.$refs.repeat.show({
						title: '请扫码后再点击！',
						type: 'default',
						position: 'bottom'
					})
				} else { //解
					this.$u.route({
						url: 'pages/home/Scan-code-in/index'
					})
					uni.$emit('update', {
						materialList: this.lisi
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.generate {
		width: 98%;
		height: 300rpx;
		overflow: auto;
		margin: 0 auto;
		margin-top: 120rpx;
	}

	.determine {
		width: 690rpx;
		margin-top: 30rpx;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-top: 100%;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.stripe {
		width: 740rpx;
		height: 30rpx;
		background-color: #00A0EA;
		border-radius: 12rpx;
		margin: 0 auto;
		margin-top: -100rpx;
	}

	.text-area {
		width: 100%;
		background-color: #000;
		display: flex;
		position: static;
		justify-content: center;
		padding-top: 180rpx;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}

	page {
		/* background-color: #000; */
	}

	.roll {
		width: 710rpx;
		height: auto;
		background: #FFFFFF;
		margin: 0 auto;
		margin-top: -15rpx;
		box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(101, 176, 249, 0.3);
		border-bottom-left-radius: 10rpx;
		border-bottom-right-radius: 10rpx;
		padding-top: 50rpx;
		padding-bottom: 50rpx;
	}

	.roll>view:nth-child(1)>view:nth-child(2) {
		font-size: 42rpx;
		font-weight: bold;
		color: #0192FD;
		text-align: center;
		margin-bottom: 50rpx;
	}

	.roll>view:nth-child(1)>view:nth-child(1) {
		width: 200rpx;
		color: #0094FE;
		position: relative;
		top: -40rpx;
		left: 500rpx;
		font-size: 32rpx;
		text-align: center;
	}

	.roll>view:nth-child(2)>view {
		width: 50rpx;
		height: 50rpx;
		background-color: #F4F4F4;
		border-radius: 100%;
		float: right;
		margin-right: -30rpx;
	}

	.roll>view:nth-child(2)>view:nth-child(1) {
		float: left;
		margin-left: -30rpx;
	}

	.status_bar {
		height: var(--status-bar-height);
		width: 100%;
		background-color: #0095FF;
	}
</style>