样式调整

components/tki-float-keyboard/tki-float-keyboard.vue

@@ -0,0 +1,459 @@
+<template xlang="wxml" minapp="mpvue">
+	<view class="_flkey-body" :class="[keyShowAni?'_floatAniIn':'_floatAniOut']" v-if='keyShow'>
+		<view class="_flkey-bar">
+			<view class="_flkey-bar-l" @tap="_keySwUp" hover-class="_float-hover-c">
+				<view class="_flkey-bar-btn" v-show="mode == 'keyboard' && keyInputSkin">{{isUp?'小写':'大写'}}</view>
+			</view>
+			<view class="_flkey-bar-c">
+				<view class="_flkey-bar-title">{{title}}</view>
+			</view>
+			<view class="_flkey-bar-r" @tap="_keyHide" hover-class="_float-hover-c">
+				<view class="_flkey-bar-btn">完成</view>
+			</view>
+		</view>
+		<view class="_flkey" v-show="mode != 'number'">
+			<view class="_flkey-h" v-show="!keyInputSkin && mode == 'car'">
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!provinceCP_}" :data-ac="provinceCP_" v-for="v in province.row_1" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!provinceCP_}" :data-ac="provinceCP_" v-for="v in province.row_2" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!provinceCP_}" :data-ac="provinceCP_" v-for="v in province.row_3" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!provinceCP_}" :data-ac="provinceCP_" v-for="v in province.row_4" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+					<view class="_flkey-i" :class="{'_flkey-noac':!specialCP_}" :data-ac="specialCP_" v-for="v in province.row_5" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="_flkey-h" v-show="!keyInputSkin && mode == 'keyboard'">
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!symbolCP_}" :data-ac="symbolCP_" v-for="v in symbol.row_1" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!symbolCP_}" :data-ac="symbolCP_" v-for="v in symbol.row_2" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!symbolCP_}" :data-ac="symbolCP_" v-for="v in symbol.row_3" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="_flkey-n" v-show="keyInputSkin">
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!numCp_}" :data-ac="numCp_" v-for="v in number" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!letterCp_}" :data-ac="letterCp_" v-for="v in letter.row_1" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!letterCp_}" :data-ac="letterCp_" v-for="v in letter.row_2" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+				<view class="_flkey-row">
+					<view class="_flkey-i" :class="{'_flkey-noac':!letterCp_}" :data-ac="letterCp_" v-for="v in letter.row_3" :key="v" :data-v="v" @tap="_keyInput" hover-class="_float-hover-c">
+						<view class="_flkey-i-b">
+							{{v}}
+						</view>
+					</view>
+				</view>
+			</view>
+			<view class="_flkey-tool">
+				<view class="_flkey-tool-i tool-i-a" :class="{'_flkey-noac':!swCp_}" @tap="_keyInputSw" hover-class="_float-hover-c">
+					<view class="_flkey-tool-i-b">{{keyInputSkin?swTxtCp_[0]:swTxtCp_[1]}}</view>
+				</view>
+				<view class="_flkey-tool-i tool-i-del" @tap="_keyInputDel" hover-class="_float-hover-c">
+					<view class="_flkey-tool-i-b">删除</view>
+				</view>
+			</view>
+		</view>
+		<view class="_flkey-number" v-show="mode == 'number'">
+			<view class="_flkey-number-row">
+				<view class="_flkey-number-row-i" data-v="1" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">1</view>
+				<view class="_flkey-number-row-i" data-v="2" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">2</view>
+				<view class="_flkey-number-row-i" data-v="3" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">3</view>
+			</view>
+			<view class="_flkey-number-row">
+				<view class="_flkey-number-row-i" data-v="4" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">4</view>
+				<view class="_flkey-number-row-i" data-v="5" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">5</view>
+				<view class="_flkey-number-row-i" data-v="6" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">6</view>
+			</view>
+			<view class="_flkey-number-row">
+				<view class="_flkey-number-row-i" data-v="7" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">7</view>
+				<view class="_flkey-number-row-i" data-v="8" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">8</view>
+				<view class="_flkey-number-row-i" data-v="9" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">9</view>
+			</view>
+			<view class="_flkey-number-row">
+				<view class="_flkey-number-row-i _number-tool" data-v="." :class="{'_flkey-noac':!dotCp_}" :data-ac="dotCp_" @tap="_keyInput" hover-class="_float-hover-c">.</view>
+				<view class="_flkey-number-row-i" data-v="0" :class="{'_flkey-noac':!digitCp_}" :data-ac="digitCp_" @tap="_keyInput" hover-class="_float-hover-c">0</view>
+				<view class="_flkey-number-row-i _number-tool" hover-class="_float-hover-c" @tap="_keyInputDel">删除</view>
+			</view>
+		</view>
+		<view class="_flkey-bot">
+		</view>
+	</view>
+</template>
+
+<script>
+export default {
+	name: "tki-float-keyboard",
+	props: {
+		'title': {
+			type: [String],
+			default: '',
+		},
+		'type': {
+			type: [Number, String],
+			default: 0,
+		},
+		'mode': {
+			type: [String],
+			default: 'keyboard', // keyboard 普通键盘 car 汽车键盘 number 数字键盘
+		}
+	},
+	data() {
+		return {
+			isUp: false, // 是否是大写
+			swTxt: true, // 键盘切换按钮是否可用
+			keyShow: false,
+			keyShowAni: true, // true 进入 false 隐藏
+			keyInputSkin: true, // true 显示 字母和数字  false 显示汉子
+			symbol: {
+				row_1: ['+', '-', '*', '/', '=', '^', '<', '>', '(', ')'],
+				row_2: ['?', '!', '@', '#', '$', '&', ',', '.', '[', ']'],
+				row_3: [':', ';', '\'', '"', '_', '~', '…'],
+			},
+			province: {
+				row_1: ["京", "津", "沪", "渝", "蒙", "新", "藏", "宁", "桂", "黑"],
+				row_2: ["吉", "辽", "晋", "冀", "青", "鲁", "豫", "苏", "皖", "浙"],
+				row_3: ["闽", "赣", "湘", "鄂", "粤", "琼", "甘", "陕", "云", "贵"],
+				row_4: ["川"],
+				row_5: ["港", "澳", "学", "警", "领", "使"],
+			},
+			number: [1, 2, 3, 4, 5, 6, 7, 8, 9, 0],
+			letter: {
+				row_1: ["Q", "W", "E", "R", "T", "Y", "U", "I", "O", "P"],
+				row_2: ["A", "S", "D", "F", "G", "H", "J", "K", "L"],
+				row_3: ["Z", "X", "C", "V", "B", "N", "M"],
+			},
+			symbolCP_: true,
+			provinceCP_: true,
+			specialCP_: true,
+			numCp_: true,
+			letterCp_: true,
+			digitCp_: true,
+			dotCp_: true,
+			swCp_: true,
+			swTxtCp_: ['省', 'ABC'],
+		}
+	},
+	methods: {
+		_keyInit() {
+			if (this.mode == 'keyboard') {
+				this.isUp = true
+				this._keyTypeWacth(this.keyType)
+				this._keySwUp()
+			}
+			if (this.mode == 'car') {
+				this.isUp = false
+				this._carTypeWacth(this.carType)
+				this._keySwUp()
+			}
+			if (this.mode == 'number') {
+				this._numberTypeWacth(this.numberType)
+			}
+		},
+		_keySwUp(t) {
+			if (this.mode != 'number' && this.keyInputSkin) {
+				// 大小写切换
+				for (const key in this.letter) {
+					if (this.letter.hasOwnProperty(key)) {
+						for (let index = 0; index < this.letter[key].length; index++) {
+							if (!this.isUp) {
+								let tp = this.letter[key][index].toUpperCase()
+								this.letter[key][index] = tp
+							} else {
+								let tp = this.letter[key][index].toLowerCase()
+								this.letter[key][index] = tp
+							}
+						}
+					}
+				}
+				this.isUp = !this.isUp
+			}
+		},
+		_keyInput(e) {
+			let d = e.currentTarget.dataset
+			if (d.ac) {
+				this.$emit('val', String(d.v))
+			}
+		},
+		_keyInputDel() {
+			this.$emit('del', true)
+		},
+		_keyInputSw() {
+			let that = this;
+			if (that.swCp_) {
+				that.keyInputSkin = !that.keyInputSkin
+			}
+		},
+		_keyShow() {
+			let that = this
+			uni.hideKeyboard()
+			that.keyShow = true
+			that.keyShowAni = true
+			setTimeout(() => {
+				uni.createSelectorQuery().in(that).select('._flkey-body').boundingClientRect(function (rect) {
+					that.$emit('show', rect)
+				}).exec()
+			}, 150);
+		},
+		_keyHide() {
+			let that = this
+			that.keyShowAni = false
+			setTimeout(() => {
+				that.$emit('hide', true)
+				that.keyShow = false
+			}, 166);
+		},
+		_carTypeWacth(n) {
+			let v = Number(n)
+			// 0 全部
+			// 1 字母加数字
+			// 2 省
+			// 3 字母加数字加特
+			// 4 字母
+			// 5 数字
+			switch (v) {
+				case 0:
+					this.provinceCP_ = true
+					this.specialCP_ = true
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = true
+					this.swTxtCp_ = ['省', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 1:
+					this.provinceCP_ = false
+					this.specialCP_ = false
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = false
+					this.swTxtCp_ = ['省', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 2:
+					this.provinceCP_ = true
+					this.specialCP_ = false
+					this.numCp_ = false
+					this.letterCp_ = false
+					this.swCp_ = false
+					this.swTxtCp_ = ['省', 'ABC']
+					this.keyInputSkin = false
+					break;
+				case 3:
+					this.provinceCP_ = false
+					this.specialCP_ = true
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = true
+					this.swTxtCp_ = ['特', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 4:
+					this.provinceCP_ = false
+					this.specialCP_ = false
+					this.numCp_ = false
+					this.letterCp_ = true
+					this.swCp_ = false
+					this.swTxtCp_ = ['省', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 5:
+					this.provinceCP_ = false
+					this.specialCP_ = false
+					this.numCp_ = true
+					this.letterCp_ = false
+					this.swCp_ = false
+					this.swTxtCp_ = ['省', 'ABC']
+					this.keyInputSkin = true
+					break;
+				default:
+					this.provinceCP_ = true
+					this.specialCP_ = true
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = true
+					this.swTxtCp_ = ['省', 'ABC']
+					this.keyInputSkin = true
+					break;
+			}
+		},
+		_keyTypeWacth(n) {
+			let v = Number(n)
+			// 0 全部
+			// 1 字母加数字
+			// 2 符号
+			// 3 字母
+			// 4 数字
+			// 5 字母加符号
+			// 6 数字加符号
+			switch (v) {
+				case 0:
+					this.symbolCP_ = true
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = true
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 1:
+					this.symbolCP_ = false
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = false
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 2:
+					this.symbolCP_ = true
+					this.numCp_ = false
+					this.letterCp_ = false
+					this.swCp_ = false
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = false
+					break;
+				case 3:
+					this.symbolCP_ = false
+					this.numCp_ = false
+					this.letterCp_ = true
+					this.swCp_ = false
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 4:
+					this.symbolCP_ = false
+					this.numCp_ = true
+					this.letterCp_ = false
+					this.swCp_ = false
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 5:
+					this.symbolCP_ = true
+					this.numCp_ = false
+					this.letterCp_ = true
+					this.swCp_ = true
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+				case 6:
+					this.symbolCP_ = true
+					this.numCp_ = true
+					this.letterCp_ = false
+					this.swCp_ = true
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+				default:
+					this.symbolCP_ = true
+					this.numCp_ = true
+					this.letterCp_ = true
+					this.swCp_ = true
+					this.swTxtCp_ = ['符', 'ABC']
+					this.keyInputSkin = true
+					break;
+			}
+		},
+		_numberTypeWacth(n) {
+			let v = Number(n)
+			// 0 全部
+			// 1 禁用.
+			switch (v) {
+				case 0:
+					this.digitCp_ = true
+					this.dotCp_ = true
+					break;
+				case 1:
+					this.digitCp_ = true
+					this.dotCp_ = false
+					break;
+				default:
+					this.digitCp_ = true
+					this.dotCp_ = true
+					break;
+			}
+		}
+	},
+	computed: {
+	},
+	watch: {
+		type(n, o) {
+			if (this.mode == 'car') {
+				this._carTypeWacth(n)
+			}
+			if (this.mode == 'keyboard') {
+				this._keyTypeWacth(n)
+			}
+			if (this.mode == 'number') {
+				this._numberTypeWacth(n)
+			}
+		},
+		mode(n, o) {
+			if (n != o) {
+				this._keyInit()
+			}
+		}
+	},
+	created() {
+		this._keyInit()
+	},
+}
+</script>
+
+<style>
+@import "style.css";
+</style>

pages.json

@@ -82,6 +82,9 @@
 		"navigationBarTitleText": "uni-app",
 		"navigationBarBackgroundColor": "#F8F8F8",
 		"backgroundColor": "#F8F8F8",
+		"rpxCalcMaxDeviceWidth": 960, // rpx 计算所支持的最大设备宽度，单位 px，默认值为 960
+		"rpxCalcBaseDeviceWidth": 375, // rpx 计算使用的基准设备宽度，设备实际宽度超出 rpx 计算所支持的最大设备宽度时将按基准宽度计算，单位 px，默认值为 375
+		"rpxCalcIncludeWidth": 750, // rpx 计算特殊处理的值，始终按实际的设备宽度计算，单位 rpx，默认值为 750
 		"h5": {
 			"titleNView": false
 		}

pages/index/index.vue

@@ -30,14 +30,6 @@
 							:thumb="item.lrTx?config.baseUrl+item.lrTx:config.baseUrl + config.head" :note="item.lrCydh"
 							thumbSize="lg" :showArrow="false">
 							<template v-slot:footer>
-								<!-- 	<image v-if="item.lzzt == '0'" src="../../static/images/caogao.png" style="width: 10vw;"
-									mode="widthFix" />
-								<image v-else-if="item.lzzt == '1' || item.lzzt == '2'"
-									src="../../static/images/daishenhe.png" style="width: 10vw;" mode="widthFix" />
-								<image v-else-if="item.lzzt == '3'" src="../../static/images/tongguo.png"
-									style="width: 10vw;" mode="widthFix" />
-								<image v-else-if="item.lzzt == '4'" src="../../static/images/jujue.png"
-									style="width: 10vw;" mode="widthFix" /> -->
 								<view v-if="item.lzzt == '0'"
 									style="width: 60px;display: flex;flex-direction: column;background-image: url('../../static/images/caogao.png');background-position: left;background-size:58px 58px;background-repeat: no-repeat;">
 									<text v-if="item.updateTime">{{item.updateTime.substring(0,8) }}</text>
@@ -70,6 +62,8 @@
 			</uni-card>
 		</view>
 
+
+
 	</view>
 </template>
 
@@ -169,26 +163,24 @@
 </script>
 
 <style scoped>
+	.container {
+		display: flex;
+		flex-direction: column;
+		height: 100vh;
+		width: 100vw;
+		background: linear-gradient(to bottom, #07bf61 0%, #fff 30%, #F8FCFF 100%);
+	}
+
 	/* 轮播图 */
 	.bannerBox {
-		position: absolute;
-		margin-top: 14vh;
 		width: 100vw;
 	}
 
 	.swiper-box {
-		width: 90%;
-		height: 300rpx;
-		margin: 50rpx 5vw;
-		margin-top: -15%;
-		margin-bottom: 20rpx;
+		height: 19vh;
+		margin: 7vh 2vh 20px;
 	}
 
-	.swiper-adsense-box {
-		width: 90%;
-		height: 150rpx;
-		margin: 30rpx auto;
-	}
 
 	.imgItem {
 		width: 100%;
@@ -196,26 +188,10 @@
 	}
 
 	.swiper-box swiper-item {
-		height: 280rpx !important;
 		border-radius: 15px;
 		overflow: hidden;
 	}
 
-	.wx-swiper-dots .wx-swiper-dot {
-		width: 45rpx;
-		height: 8rpx;
-		border-radius: 5rpx;
-	}
-
-	.wx-swiper-dots .wx-swiper-dot:nth-of-type(n+2) {
-		margin-left: 30rpx;
-	}
-
-	.wx-swiper-dots.wx-swiper-dots-horizontal {
-		position: absolute;
-		bottom: 0rpx;
-	}
-
 	.phoneText {
 		position: absolute;
 		margin-top: 2vh;
@@ -230,36 +206,27 @@
 		vertical-align: top;
 	}
 
-	.container {
-		display: flex;
-		height: 100vh;
-		width: 100vw;
-		background: linear-gradient(to bottom, #07bf61 0%, #fff 30%, #F8FCFF 100%);
-	}
+
 
 	/* 按钮 */
 	.btnBox {
-		position: absolute;
-		width: 90%;
+		/* width: 90%; */
 		display: flex;
-		margin: 30vh 5vw;
-		margin-bottom: 10rem;
+		margin: 1vh 19px;
 	}
 
 	.btnImg {
-		width: 45vw;
-		height: 33vw;
-		display: block;
+		width: 49%;
+		height: 16vh;
 	}
 
 	.img2 {
-		margin-left: 5vw;
+		margin-left: 2%;
 	}
 
 	.daiban {
-		width: 84.5vw;
-		left: 1.5vw;
-		top: 49vh;
-
+		position: fixed;
+		left: 4px;
+		right: 4px;
 	}
 </style>

pages/login/index.vue

@@ -1,34 +1,38 @@
 <template>
 	<view style="width: 100%;height: 100%;">
-		<image src="../../static/images/card.jpg" style="width: 100%;height: 100%;" mode="aspectFill">
+		<image src="../../static/images/card.jpg" style="width: 100%;height: 100%;" mode="scaleToFill"
+			@click="keyHideStatus">
 			<uni-forms ref="baseForm" id="form1" :modelValue="formData" :rules="rules">
 				<view class="cardBody">
-					<view class="card ">
-						<view class="phoneText global-font">
+					<view class="card " :style="'height:'+height+' ;'">
+						<view class="phoneText global-font" @click="keyHideStatus">
 							账号
 						</view>
-						<view>
+						<view @click="keyHideStatus">
 							<uni-forms-item name="username">
-								<input class="inputClass" v-model="formData.username" :adjust-position="false"/>
+								<input class="inputClass" :style="'height:'+inputHeight+';'" ref="userInput"
+									v-model="formData.username" :adjust-position="false" @focus="openUsername"
+									@blur="closeUsername" />
 							</uni-forms-item>
 						</view>
 
-						<view class="phoneText global-font">
+						<view class="phoneText global-font" @click="keyHideStatus">
 							密码（初始密码为身份证号后6位）
 						</view>
 						<view>
 							<uni-forms-item name="password">
-								<input id="ins" class="inputClass" v-model="formData.password" :password="true"
-									@blur="close()" @focus="open" />
-						<!-- 		<uv-keyboard ref="keyboard" mode="card" tips="密码键盘" @change="change" @confirm="confirm"
-									@backspace="backspace"></uv-keyboard> -->
+								<input id="ins" class="inputClass" :style="'height:'+inputHeight+';'"
+									v-model="formData.password" :password="showPassword" @blur="close()"
+									@focus="open" />
+								<tki-float-keyboard ref="keyb" :mode="keyMode" :type="keyType" :title="title"
+									@del="keyDel" @val="keyVal" @show="keyShow" @hide="keyHide"></tki-float-keyboard>
 							</uni-forms-item>
 						</view>
 						<view>
-							<button cursor-spacing="22px" class="buttonClass" @click="to">登录</button>
+							<button class="buttonClass" @click="to">登录</button>
 						</view>
-						<view style="width: 80vw;text-align: center;">
-							<text class="zcText global-font" @click="register">注册账号</text>
+						<view class="zcText">
+							<text class="global-font" @click="register">注册账号</text>
 						</view>
 					</view>
 				</view>
@@ -55,14 +59,26 @@
 	import {
 		showConfirm
 	} from '../../common/common'
-
+	import tkiFloatKeyboard from '@/components/tki-float-keyboard/tki-float-keyboard.vue'
 	export default {
 		components: {
-
+			tkiFloatKeyboard
 		},
 		data() {
 			return {
-				title: '',
+				// 键盘
+				// 键盘类型  keyboard 普通键盘，car 汽车键盘，number 数字键盘
+				keyMode: 'keyboard',
+				// type 键盘可用区域，配合mode属性使用  默认值：0
+				//mode = keyboard 时 type = 0 全部、 1 字母加数字、 2 符号、 3 字母、 4 数字、 5 字母加符号、6 数字加符号
+				//mode = car 时 type = 0 全部、 1 字母加数字、 2 省、 3 字母加数字加特、 4 字母、 5 数字
+				//mode = number 时 type = 0 全部、 1 禁用.
+				keyType: 0,
+				title: '密码键盘',
+				keyShowStatus: false,
+				showPassword: true,
+				height: '42vh',
+				inputHeight: '5vh',
 				formData: {
 					// username: '220722199507280418',
 					// password: 'sckj@2022',
@@ -85,6 +101,9 @@
 						}]
 					},
 				},
+				defaultPhoneHeight: '', //屏幕默认高度
+				nowPhoneHeight: '', //屏幕现在的高度
+				show: false
 			}
 		},
 		onLoad() {
@@ -94,7 +113,54 @@
 				this.getCode(config.appid)
 			}
 		},
+		mounted() {
+			//监听软键盘获取当前屏幕高度的事件
+			this.defaultPhoneHeight = window.innerHeight
+			window.onresize = () => {
+				this.nowPhoneHeight = window.innerHeight
+			}
+		},
+		watch: {
+			//软键盘弹起事件
+			nowPhoneHeight() {
+				if (this.defaultPhoneHeight != this.nowPhoneHeight) {
+					//手机键盘被唤起了。
+					this.show = true
+				} else {
+					//手机键盘被关闭了。
+					this.show = false
+				}
+			}
+		},
 		methods: {
+			openUsername() {
+				setTimeout(() => {
+					if (this.show) {
+						this.height = '58vh'
+						this.inputHeight = '8vh'
+					}
+				}, 140)
+
+			},
+			closeUsername() {
+				this.height = '42vh'
+				this.inputHeight = '5vh'
+			},
+			keyHideStatus() {
+				if (this.keyShowStatus) this.$refs.keyb._keyHide()
+			},
+			keyVal(v) {
+				this.formData.password += v
+			},
+			keyDel(d) {
+				this.formData.password = this.formData.password.substring(0, this.formData.password.length - 1)
+			},
+			keyShow(h) {
+				this.keyShowStatus = true
+			},
+			keyHide(h) {
+				this.keyShowStatus = false
+			},
 			change(e) {
 				this.formData.password += e
 				console.log('change', e)
@@ -110,13 +176,11 @@
 				this.title = e;
 			},
 			open() {
-				// uni.hideKeyboard()
-
-				// this.$refs.keyboard.open();
+				uni.hideKeyboard()
+				this.$refs.keyb._keyShow();
 				console.log("打开");
 			},
 			close() {
-				window.scrollTo(0, 0);
 				console.log("关闭");
 			},
 			register() {
@@ -192,13 +256,14 @@
 		flex-direction: column;
 
 		position: absolute;
-		bottom: 20vh;
+		/* bottom: 20vh; */
+		top: 37vh;
 		left: 12vw;
 	}
 
 	.card {
 		width: 76vw;
-		height: 80vw;
+		/* height: 42vh; */
 		border-radius: 16px;
 		background: rgba(255, 255, 255, 1);
 		box-shadow: 5px 6px 18px rgba(0, 0, 0, 0.08);
@@ -206,10 +271,10 @@
 	}
 
 	.phoneText {
-		margin-top: 6vw;
+		margin-top: 3vh;
 		margin-left: 4vw;
 		width: 80vw;
-		height: 6vw;
+		height: 3vh;
 		font-size: 14px;
 		line-height: 2vh;
 		color: rgba(116, 127, 158, 1);
@@ -218,11 +283,14 @@
 
 	}
 
+	.global-font {}
+
 	.zcText {
 		position: absolute;
-		margin-top: 4vw;
-		margin-left: -9vw;
-		height: 2vh;
+		margin-top: 2vh;
+		margin-left: 4vw;
+		width: 68vw;
+		height: 5vh;
 		font-size: 14px;
 		color: rgba(116, 127, 158, 1);
 		font-weight: 500;
@@ -232,20 +300,20 @@
 	}
 
 	.inputClass {
-		margin-top: 2vw;
+		margin-top: 1vh;
 		margin-left: 4vw;
 		width: 68vw;
-		height: 10vw;
+		/* height: 5vh; */
 		border-radius: 16px;
 		border: 1px solid rgba(176, 179, 199, 1);
 		text-indent: 4vw;
 	}
 
 	.buttonClass {
-		margin-top: 8vw;
+		margin-top: 4vh;
 		margin-left: 4vw;
 		width: 68vw;
-		/* height: 5.5vh; */
+		/* height: 5vh; */
 		text-align: center;
 		border-radius: 16px;
 		border: 1px solid rgba(176, 179, 199, 1);

pages/lr/base.vue

@@ -24,13 +24,13 @@
 							:inputBorder="false"></uni-easyinput>
 					</uni-forms-item> -->
 					<uni-forms-item label="人像" required>
-						<image :src="src" @click="takePhoto" mode="widthFix" style="width: 25vw;"></image>
+						<image :src="src" @click="takePhoto" mode="widthFix" style="width: 150px;"></image>
 					</uni-forms-item>
 					<view v-if="show">
-						<uni-forms-item label="直接上传">
+						<uni-forms-item label="直接保存">
 							<uni-data-checkbox v-model="radio" :localdata="radioData"></uni-data-checkbox>
 						</uni-forms-item>
-						<text>注意：由于人脸比对不成功可以直接上传人工审核！</text>
+						<text>注意：由于人脸比对不成功可以直接保存人工审核！</text>
 					</view>
 
 					<view>
@@ -155,7 +155,7 @@
 					photo: {
 						rules: [{
 							required: true,
-							errorMessage: '请上传人像'
+							errorMessage: '请采集人像'
 						}]
 					},
 					lrCydh: {
@@ -388,15 +388,15 @@
 			},
 			save() {
 				if (this.src == '/static/images/head.png') {
-					showConfirm('请上传人像')
+					showConfirm('请采集人像')
 					return
 				} else {
 					if (!this.ocrXm) {
-						showConfirm('修改信息请重新上传身份证人像面')
+						showConfirm('修改信息请重新识别身份证人像面')
 						return
 					}
 					if (this.ocrXm != this.baseFormData.lrXm) {
-						showConfirm('姓名与真实姓名不符，请重新上传身份证人像面')
+						showConfirm('姓名与真实姓名不符，请重新识别身份证人像面')
 						return
 					}
 					// if (!this.isSearch) {
@@ -455,7 +455,7 @@
 							console.log(err);
 						})
 					} else {
-						showConfirm('请重新上传人像')
+						showConfirm('请重新采集人像')
 						return
 					}
 				}
@@ -463,7 +463,7 @@
 			},
 			takePhoto() {
 				if (!this.zjSrc) {
-					showConfirm('请先上传身份证人像面')
+					showConfirm('请先识别身份证人像面')
 					return
 				}
 				uni.chooseImage({
@@ -473,7 +473,7 @@
 					sourceType: ['camera'],
 					success: (res) => {
 						uni.showLoading({
-							title: '正在上传中...'
+							title: '正在识别中...'
 						})
 
 						let size = res.tempFiles[0].size
@@ -509,7 +509,7 @@
 			// 身份证识别
 			idcardEnd(words, src) {
 				if (words.image_status == "other_type_card") {
-					showConfirm('请上传正确的身份证人像面')
+					showConfirm('请识别正确的身份证人像面')
 					return
 				}
 				// 身份证号校验  性别  出生日期
@@ -519,31 +519,31 @@
 				let sex = words.words_result['性别'].words
 				let info = idCardNoUtil.getIdCardInfo(id)
 				if (!idCardNoUtil.checkIdCardNo(id)) {
-					showConfirm('身份证号识别有误，请重新上传')
+					showConfirm('身份证号识别有误，请重新识别')
 					return
 				}
 				if (this.userType == '07' && this.baseFormData.lrZjhm != id) {
-					showConfirm('请使用本人身份证重新上传')
+					showConfirm('请使用本人身份证重新识别')
 					return
 				}
 				if (info.birthday != csrq) {
-					showConfirm('身份证出生日期识别有误，请重新上传')
+					showConfirm('身份证出生日期识别有误，请重新识别')
 					return
 				}
 				if (info.gender != sex) {
-					showConfirm('身份证性别识别有误，请重新上传')
+					showConfirm('身份证性别识别有误，请重新识别')
 					return
 				}
 				if (words.image_status == "reversed_side") {
-					showConfirm('请上传身份证人像面')
+					showConfirm('请识别身份证人像面')
 					return
 				}
 				if (words.risk_type != "normal") {
 					// normal-正常身份证；copy-复印件；temporary-临时身份证；screen-翻拍；unknown-其他未知情况
-					showConfirm('请上传正确的身份证人像面')
+					showConfirm('请识别正确的身份证人像面')
 					return
 				}
-				
+
 				this.baseFormData.lrXb = getDictInfo(this.dicts.C0007, words.words_result['性别'].words)[0].value
 				this.baseFormData.lrMz = getDictInfo(this.dicts.C0009, words.words_result['民族'].words)[0].value
 
@@ -581,15 +581,15 @@
 
 <style>
 	.lzcOCR {
-		width: 77%;
+		/* 	width: 77%;
 		display: flex;
-		justify-content: center;
+		justify-content: center; */
 	}
 
 	.buttonClass {
 		margin-top: 4vh;
 		margin-left: 4vw;
-		width: 68vw;
+		width: 280px;
 		/* height: 5vh; */
 		border-radius: 16px;
 		border: 1px solid rgba(176, 179, 199, 1);

pages/my/updatePwd.vue

@@ -1,21 +1,28 @@
 <template>
 	<view>
-		<uni-card>
+		<uni-card @click="keyHideStatus">
 			<uni-forms ref="baseForm" :rules="rules" :modelValue="baseFormData">
 				<uni-forms-item label="旧密码" name="oldPassword">
-					<uni-easyinput type="password" v-model="baseFormData.oldPassword"></uni-easyinput>
+					<uni-easyinput ref="oldPassword" type="password" v-model="baseFormData.oldPassword" @blur="close()"
+						@focus="open(1)"></uni-easyinput>
 				</uni-forms-item>
 				<uni-forms-item label="新密码" name="newPassword">
-					<uni-easyinput type="password" v-model="baseFormData.newPassword"></uni-easyinput>
+					<uni-easyinput type="password" v-model="baseFormData.newPassword" @blur="close()"
+						@focus="open(2)"></uni-easyinput>
 				</uni-forms-item>
 				<uni-forms-item label="确认密码" name="newPassword1">
-					<uni-easyinput type="password" v-model="baseFormData.newPassword1"></uni-easyinput>
+					<uni-easyinput type="password" v-model="baseFormData.newPassword1" @blur="close()"
+						@focus="open(3)"></uni-easyinput>
 				</uni-forms-item>
 				<view>
-					<button cursor-spacing="22px" class="buttonClass" @click="save()">修改</button>
+					<button class="buttonClass" @click="save()">修改</button>
 				</view>
 			</uni-forms>
 		</uni-card>
+		<view>
+			<tki-float-keyboard ref="keyb" :mode="keyMode" :type="keyType" :title="title" @del="keyDel" @val="keyVal"
+				@show="keyShow" @hide="keyHide"></tki-float-keyboard>
+		</view>
 	</view>
 </template>
 
@@ -25,10 +32,29 @@
 		unbind,
 		logout
 	} from '@/api/my.js'
+	import tkiFloatKeyboard from '@/components/tki-float-keyboard/tki-float-keyboard.vue'
 	export default {
+		components: {
+			tkiFloatKeyboard
+		},
 		data() {
 			return {
-				baseFormData: {},
+				// 键盘
+				// 键盘类型  keyboard 普通键盘，car 汽车键盘，number 数字键盘
+				keyMode: 'keyboard',
+				// type 键盘可用区域，配合mode属性使用  默认值：0
+				//mode = keyboard 时 type = 0 全部、 1 字母加数字、 2 符号、 3 字母、 4 数字、 5 字母加符号、6 数字加符号
+				//mode = car 时 type = 0 全部、 1 字母加数字、 2 省、 3 字母加数字加特、 4 字母、 5 数字
+				//mode = number 时 type = 0 全部、 1 禁用.
+				keyType: 0,
+				title: '密码键盘',
+				keyShowStatus: false,
+				showType: 0,
+				baseFormData: {
+					oldPassword: '',
+					newPassword: '',
+					newPassword1: '',
+				},
 				rules: {
 					oldPassword: {
 						rules: [{
@@ -52,7 +78,51 @@
 			}
 		},
 		methods: {
+			keyHideStatus() {
+				if (this.keyShowStatus) this.$refs.keyb._keyHide()
+			},
+			keyVal(v) {
+				console.log(this.showType);
+				if (this.showType == 1) {
+					this.baseFormData.oldPassword += v
+				} else if (this.showType == 2) {
+					this.baseFormData.newPassword += v
+				} else if (this.showType == 3) {
+					this.baseFormData.newPassword1 += v
+				}
+
+			},
+			keyDel(d) {
+				// this.formData.password = this.formData.password.substring(0, this.formData.password.length - 1)
+				if (this.showType == 1) {
+					this.baseFormData.oldPassword = this.baseFormData.oldPassword.substring(0, this.baseFormData
+						.oldPassword.length - 1)
+				} else if (this.showType == 2) {
+					this.baseFormData.newPassword = this.baseFormData.newPassword.substring(0, this.baseFormData
+						.newPassword.length - 1)
+				} else if (this.showType == 3) {
+					this.baseFormData.newPassword1 = this.baseFormData.newPassword1.substring(0, this.baseFormData
+						.newPassword1.length - 1)
+				}
+			},
+			keyShow(h) {
+				this.keyShowStatus = true
+				console.log("打开",this.showType,this.keyShowStatus);
+			},
+			keyHide(h) {
+				this.keyShowStatus = false
+			},
+			open(e) {
+				this.showType = e
+				uni.hideKeyboard()
+				this.$refs.keyb._keyShow();
+				// console.log("打开",this.showType,this.keyShowStatus);
+			},
+			close() {
+				console.log("关闭");
+			},
 			save() {
+				if (this.keyShowStatus) this.$refs.keyb._keyHide()
 				this.$refs['baseForm'].validate().then(res => {
 					if (this.baseFormData.newPassword != this.baseFormData.newPassword1) {
 						this.showConfirm('新密码与确认密码不同')
@@ -81,7 +151,7 @@
 <style>
 	.buttonClass {
 		margin-top: 4vh;
-		margin-left: 4vw;
+		margin-left: 9vw;
 		width: 68vw;
 		height: 5vh;
 		border-radius: 16px;