d第一次提交

2024-02-28 17:34:03 +08:00
commit 0689cf2677
1234 changed files with 144804 additions and 0 deletions
--- a/uni_modules/vehicle-code/components/vehicle-code/vehicle-code.vue
+++ b/uni_modules/vehicle-code/components/vehicle-code/vehicle-code.vue
@@ -0,0 +1,416 @@
+<template>
+	<uni-popup id="popupV" ref="popupV" type="share" :maskClick="mask">
+		<view class="uni-flex uni-column">
+			<view class="layer">
+				<view class="nums">
+					<text class="nums-l">{{title}}</text>
+					<text class="closes myicon icon-closes" @click.stop="$refs.popupV.close()"></text>
+				</view>
+				<view class="row b-b">
+					<text class="spot"></text>
+					<view class="cart-num" :class="{cartdef:cartindex == index,marginR:index===1,
+					gua:cartData[index].name==='挂'}"
+						@click="checkcart(item,index)" v-for="(item,index) in cartlength" :key="index">
+						{{cartData[index].name}}
+					</view>
+				</view>
+				<view class="model-div" v-for="(item,index) in popupList" :key="index"
+					@click.stop="checkdata(item,index)">
+					{{item}}
+				</view>
+				<view class="model-btn">
+					<text class="qx sy" @click.stop="$refs.popupV.close()">取消</text>
+					<text class="qd sy" @click.stop="confirm">确定</text>
+				</view>
+			</view>
+		</view>
+	</uni-popup>
+</template>
+
+<script>
+	let cardList = [
+		"京", "津", "冀", "晋", "蒙", "辽", "吉", "黑",
+		"沪", "苏", "浙", "皖", "闽", "赣", "鲁", "豫", 
+		"湘", "鄂", "粤", "桂", "琼", "渝", "川", "黔", 
+		"滇", "藏", "陕", "甘", "青", "宁", "贵", "台", 
+		"港", "澳", "新"
+	];
+	
+	export default {
+		props:{
+			// length: {
+			//   type: [Array, String, Number,Boolean],
+			//   default: 7
+			// },
+			title: {
+			  type: [Array, String, Number,Boolean],
+			  default: '车牌号'
+			},
+			mask: {
+			  type: [Array, String, Number,Boolean],
+			  default: false
+			},
+			codeList: {
+			  type: Array,
+			  default: function(){
+				  return cardList;
+			  },
+			},
+		},
+		data() {
+			return {
+				urls: '',
+				cartinfo: {
+					token: '',
+					name: '',
+					tel: '',
+					color: '',
+					code: '',
+					default: 0
+				},
+				disabled: false,
+				cartindex: '',
+				popupList: [],
+				letternumList: [],
+				letterList: [],
+				colorList: [],
+				numbList: [],
+				cardList: [],
+				specClass: 'none',
+				cartlength: [],
+				cartData: [],
+				cartcode: '',
+				colorindex: 0,
+				wzfrom:{},
+				length:7,
+			}
+		},
+		onLoad() {},
+		mounted(){
+			this.letterData();
+		},
+		watch:{},
+		methods: {
+			/* 字母,数字,车牌号前缀 */
+			letterData() {
+				let arry = [];
+				for (let i = 0; i < 26; i++) {
+					// console.log(String.fromCharCode(65+i));//输出A-Z 26个大写字母
+					this.letterList.push(String.fromCharCode(65 + i));
+					arry.push(String.fromCharCode(65 + i));
+				}
+				for (let i = 0; i < 10; i++) {
+					// console.log(String.fromCharCode(65+i));//输出A-Z 26个大写字母
+					this.numbList.push(i.toString());
+					arry.push(i.toString());
+				}
+				this.cardList = this.codeList;
+				this.colorList = ["红色", "白色", "黑色", "黄色", "银色", "紫色", "绿色", "棕色", "粉色", "橙色", "灰色", "深蓝色", "其他"];
+			
+				this.letternumList = arry;
+			
+				this.cartlength.length = this.length;
+				// console.log(this.cartlength);
+				this.intDatas([],this.cartlength.length);
+				// console.log(arry);//数字+字母
+				// console.log(this.numbList);//数字
+				// console.log(this.letterList);//字母
+				// console.log(this.cardList);//省开头
+			},
+			/* 车牌号校验 */
+			isLicenseNo(str) {
+				// let res = /^(([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳使领]))$/;
+				// return res.test(str);
+				return /(^[\u4E00-\u9FA5]{1}[A-Z0-9]{6}$)|(^[A-Z]{2}[A-Z0-9]{2}[A-Z0-9\u4E00-\u9FA5]{1}[A-Z0-9]{4}$)|(^[\u4E00-\u9FA5]{1}[A-Z0-9]{5}[挂学警军港澳]{1}$)|(^[A-Z]{2}[0-9]{5}$)|(^(08|38){1}[A-Z0-9]{4}[A-Z0-9挂学警军港澳]{1}$)/
+					.test(str);
+			},
+			// 选择自动切换下一项
+			checkdata(item, index) {
+				if (this.colorindex == 99) {
+					this.cartinfo.color = item;
+					this.toggleSpec(-1);
+				} else {
+					let cartindex = this.cartindex;
+					if ((cartindex + 1) === this.cartlength.length) {
+						this.cartData[cartindex].name = item;
+						this.toggleSpec(-1);
+					} else {
+						this.cartData[cartindex].name = item;
+						cartindex += 1;
+					}
+					let num = cartindex;
+					// console.log(JSON.stringify(this.cartData))
+					// console.log(num)
+					if(this.cartData[num].name==='挂')return
+					this.cartindex = cartindex;
+					this.togList(num);
+				}
+			
+			},
+			togList(index) {
+				// console.log(index)
+				this.colorindex = index;
+				if (index == 0) {
+					this.popupList = this.cardList;
+				}
+				if (index == 1) {
+					this.popupList = this.letterList;
+				}
+				if (index == 99) {
+					this.popupList = this.colorList;
+				}
+				if (index != 1 && index != 0 && index != 99) {
+					this.popupList = this.letternumList;
+				}
+			},
+			//弹窗开关
+			toggleSpec(index) {
+				if (this.specClass === 'show') {
+					this.specClass = 'hide';
+					setTimeout(() => {
+						this.specClass = 'none';
+					}, 250);
+				} else if (this.specClass === 'none') {
+					this.specClass = 'show';
+				}
+				if (index == -1) {} else {
+					this.togList(index);
+				}
+				// console.log(JSON.stringify(this.popupList))
+			},
+			intDatas(data,index){
+				for (let i = 0; index > i; i++) {
+					this.cartData.push({
+						name: ''
+					});
+				}
+				// console.log(this.cartData)
+			},
+			//选择
+			checkcart(row, index) {
+				if(!this.isLicenseNo(row)&&row){
+					uni.showToast({
+						title:'车牌号有误',
+						icon:'error',
+					})
+				}
+				if(row){
+					if(row.length>0){
+						this.cartData = [];
+						let length = this.length;
+						for(let i=0;length>i;i++){
+							this.cartData.push({
+								name: row[i]
+							});
+						}
+					}
+				}
+				// console.log(row, index,this.cartData[index].name)
+				if(!row&&index===6&&this.cartData[index].name==='挂')return
+				this.cartindex = index;
+				this.toggleSpec(index);
+			
+				this.$refs.popupV.open()
+			},
+			//提交
+			confirm() {
+				this.cartcode = '';
+				this.cartData.forEach((item, index) => {
+					this.cartcode += item.name;
+				})
+				// console.log(this.cartData)
+				// console.log(this.cartlength)
+				this.cartinfo.code = this.cartcode;
+				// console.log(this.cartcode)
+				// console.log(this.cartinfo)
+				if(this.isLicenseNo(this.cartinfo.code)){
+					this.$set(this.wzfrom,'num',this.cartinfo.code)
+					this.$emit('changes',this.cartinfo.code);
+					this.$refs.popupV.close()
+				}else{
+					uni.showToast({
+						title:'请正确选择车牌号',
+						icon:'error',
+					})
+				}
+				
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page{
+		.layer {
+			// position: fixed;
+			// z-index: 99;
+			// bottom: 0;
+			width: 97.5%;
+			min-height: 10vh;
+			border-radius: 30rpx 30rpx 0 0;
+			background-color: #FFFFFF;
+			padding: 10rpx 10rpx 10rpx 14rpx;
+		
+			.nums {
+				height: 100rpx;
+				line-height: 100rpx;
+		
+				.nums-l {
+					margin-left: 40rpx;
+					font-weight: bold;
+					font-size: 32rpx;
+				}
+		
+				.closes {
+					float: right;
+					margin-right: 40rpx;
+					font-weight: bold;
+				}
+			}
+		
+			.model-btn {
+				width: 100%;
+				height: 100rpx;
+				line-height: 100rpx;
+				margin: 5rpx;
+				text-align: center;
+				float: right;
+				font-size: 34rpx;
+				margin-top: 20rpx;
+				margin-bottom: 20rpx;
+				border-top: 1rpx solid #F0F0F0;
+		
+				.sy {
+					padding: 16rpx 18%;
+					margin: 0 15rpx;
+					border-radius: 50px;
+				}
+		
+				.qx {
+					background: linear-gradient(to left, #D4D4D4, #F0F0F0);
+					color: #676767;
+				}
+		
+				.qd {
+					background: linear-gradient(to left, #226AFF, #0097FF);
+					color: #FFFFFF;
+				}
+			}
+		
+			.model-div {
+				width: 11.2%;
+				height: 70rpx;
+				line-height: 70rpx;
+				background: #F5F5F5;
+				margin: 5rpx;
+				// border-radius: 20rpx;
+				float: left;
+				text-align: center;
+		
+				&:active {
+					background-color: #CCCCCC;
+					color: #FFFFFF;
+				}
+			}
+		}
+		
+		.row {
+			display: flex;
+			align-items: center;
+			position: relative;
+			padding: 0 0rpx;
+			height: 120rpx;
+			background: #fff;
+			.gua{
+				background: #F0F0F0;
+			}
+			.cart-num {
+				color: #333333;
+				font-weight: bold;
+				width: 10.3%;
+				height: 80rpx;
+				line-height: 80rpx;
+				text-align: center;
+				margin: 0 10rpx;
+				border: 1rpx solid #D3D3D3;
+				border-radius: 10rpx;
+			}
+		
+			.cartdef {
+				border: 3rpx #226AFF solid;
+			}
+		
+			.marginR {
+				margin-right: 50rpx;
+			}
+		
+			.spot {
+				position: absolute;
+				left: 208rpx;
+				width: 14rpx;
+				height: 14rpx;
+				color: #999;
+				background: #999;
+				border-radius: 50%;
+			}
+		
+			.mgleft {
+				margin-left: 15rpx;
+			}
+		
+			.icon-dhb {
+				color: #888888;
+			}
+		
+			.tit {
+				flex-shrink: 0;
+				width: 120upx;
+				font-size: 30upx;
+				color: #676767;
+			}
+		
+			.color {
+				width: 150rpx;
+			}
+		
+			.label {
+				height: 110rpx;
+				line-height: 110rpx;
+		
+				.label-txt {
+					position: relative;
+					bottom: 2rpx;
+					margin-left: 20rpx;
+					border: 1rpx #333333 solid;
+					padding: 10rpx 30rpx;
+					border-radius: 50rpx;
+					color: #333333;
+				}
+		
+				.check {
+					border: 1rpx $lxyy-color solid;
+					color: $lxyy-color;
+				}
+			}
+		
+			.label-duo {
+				position: relative;
+				bottom: 4rpx;
+				margin-left: 30rpx;
+				color: #888888;
+			}
+		
+			.input {
+				flex: 1;
+				font-size: 30upx;
+				color: $font-color-dark;
+				text-align: right;
+			}
+		
+			.icon-shouhuodizhi {
+				font-size: 36upx;
+				color: $font-color-light;
+			}
+		}
+	}
+</style>