hotel-tablecloth-uniapp-24-08-29/components/userShop/deliverGoods.vue

<template>
	<uv-popup ref="popup" :round="30">
		
		<view class="form">
			<view class="shopName">
				<view>物流名称</view>
				<view>
					<input v-model="form.logisticsName" placeholder="请输入物流名称" clearable></input>
				</view>
			</view>
			<view class="shopName">
				<view>物流单号</view>
				<view>
					<input v-model="form.logisticsCode" placeholder="请输入物流单号" clearable></input>
				</view>
			</view>
		</view>
		
		<view class="btn" @click="sendLogistics">
			<button class="a">发货</button>
		</view>
	</uv-popup>
</template>

<script>
	export default {
		data() {
			return {
				form : {}
			}
		},
		props : ['orderId'],
		methods: {
			open(){
				this.$refs.popup.open('bottom')
			},
			close(){
				this.$refs.popup.close()
			},
			// 水洗店换货发货
			sendLogistics(from, fn){
				
				if (this.$utils.verificationAll(this.form, {
						logisticsName : '请输入物流名称',
						logisticsCode : '请输入物流单号',
					})) {
					return
				}
				
				this.form.id = this.orderId
				
				this.$api('sendLogistics', this.form, res => {
					if (res.code == 200) {
						this.$emit('getData')
						this.$refs.popup.close()
					}
				})
			},
		}
	}
</script>

<style scoped lang="scss">
.form{
	padding: 20rpx 0;
	height: 40vh;
	.shopName {
		display: flex;
		align-items: center;
		background-color: #FFF;
		margin: 10rpx 0 0 0;
		padding: 10rpx 20rpx;
	
		>view:nth-of-type(1) {
			width: 30%;
			// font-weight: 700;
		}
	
		>view:nth-of-type(2) {
			width: 70%;
			// padding: 0 20rpx 0 0;
			border-radius: 10rpx;
			overflow: hidden;
	
			input {
				background-color: #f5f5f5;
				// color: #a4a4a4;
				font-size: 28rpx;
				padding: 8rpx 8rpx 8rpx 15rpx;
			}
		}
	}
}
.btn {
	display: flex;
	justify-content: center;
	width: 100%;
	
	.a {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 90%;
		height: 100rpx;
		color: #FFF;
		background-color: $uni-color;
		border: 1px solid red;
		border-radius: 100rpx;
		font-size: 30rpx;
	}
}
</style>