zhywpt-sp/subpackage/after-sale/blacklist-query/addCar.vue

<template>
	<view class="bg">
		<!-- 车牌输入 -->
		<view class="car-input">
			<view class="title" style="margin-top: 10rpx;">车牌号</view>
			<car-number-input @numberInputResult="carNumber" inputColor='#ECF1F4'></car-number-input>
		</view>
		<!-- 车牌颜色 -->
		<view class="chepai-lane">
			<view class="title">车牌颜色 <text class='tips'></text></view>
			<numberplate-color :numberplate="state.vehiclePlate" 
				:numberplateCor='state.vehiclePlateColor' @numberplateResult="checkNumberplateColor">
			</numberplate-color>
		</view>
		
	</view>
	
	<view class="action">
		<button type="default" class="ui-btn" @click="add()">
			绑定
		</button>
		
	</view>
</template>
<script setup lang="ts">
	import { reactive } from "vue";
	import { onLoad } from "@dcloudio/uni-app";
	import {vehicleBind } from "@/utils/network/api.js";
	import {requestNew } from "@/utils/network/request.js";
	import {getItem,StorageKeys } from "@/utils/storage";
	import carNumberInput from "../components/car-number-input.vue";
	import numberplateColor from "../components/layout-numberplate-color";
	import {msg} from "@/utils/utils";
	const state = reactive({
		vehiclePlate: "",
		vehiclePlateColor: ""
	});
	onLoad((option : any) => {
		
	})
	const carNumber = (val : any) => {
		state.vehiclePlate = val.trim();
	};
	/* 选择车牌颜色 */
	const checkNumberplateColor = (item : any) => {
		state.vehiclePlateColor = item;
	};
	const add = () => {
		const options = {
			type: 2,
			data: {
				"vehiclePlate": state.vehiclePlate,
				"vehiclePlateColor": state.vehiclePlateColor,
				"operaterId":getItem(StorageKeys.OpenId)
			},
			method: 'POST',
			showLoading: true,
		}
		requestNew(vehicleBind, options).then((res) => {
			console.log("res==",res)
			msg("新增成功")
			setTimeout(()=>{
				uni.navigateBack()
			},1500)
			
		})
	}
</script>

<style scoped lang="scss">
	.bg {
		background-color: white;
		width: 88%;
		margin: 0 auto;
		margin-top: 20rpx;
		border-radius: 12px;
		border: 1px solid #FFFFFF;
		padding: 20rpx;
		overflow: hidden;
		.title{
			font-weight: 400;
			font-size: 30rpx;
			color: #01243A;
			margin: 30rpx 0;
		}
	}
	
	.action {
		position: fixed;
		left: 0;
		bottom: 0;
		height: 160rpx;
		background-color: #fff;
		border-radius: 30rpx 30rpx 0 0;
		width: 100vw;
		display: flex;
		align-items: center;
		justify-content: space-evenly;
		flex-direction: column;
		margin-top: 20rpx;
	}
</style>