From d698c77ac8f21ef383a1557be3dfdabbc2d76d61 Mon Sep 17 00:00:00 2001
From: 付延余 <f-yanyu@outlook.com>
Date: 星期一, 19 十二月 2022 15:37:25 +0800
Subject: [PATCH] pull editor

---
 pages/jihua/jihua.vue |  427 ++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 305 insertions(+), 122 deletions(-)

diff --git a/pages/jihua/jihua.vue b/pages/jihua/jihua.vue
index e3c5bf5..b4090af 100644
--- a/pages/jihua/jihua.vue
+++ b/pages/jihua/jihua.vue
@@ -1,5 +1,6 @@
 <template>
 	<view class="jihua-wrap">
+		<u-overlay :show="overlayShow" @click="overlayShow = false"></u-overlay>
 		<view class="qiehuan-box"><u-tabs :list="tabList" @click="tabClick"></u-tabs></view>
 		<view class="jihua-main">
 			<view class="shaixuan-box">
@@ -11,7 +12,8 @@
 			</view>
 			<view class="main-inside">
 				<view v-if="isTomJihua == '鍏ㄩ儴'">
-					<view class="main-block-box" v-for="(item, index) in fyData" :key="item.id">
+					<u-empty v-if="fyData.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" class="empty-container"></u-empty>
+					<view id="u-dropdown" class="main-block-box" v-for="(item, index) in fyData" :key="item.id" ref="planViewRef">
 						<view class="jihua-main-line">
 							<!-- <view class="name">瀹㈡埛鍚嶇О锛歿{item.customerName || ''}}</view> -->
 							<view class="name">鏀惰揣鍗曚綅锛歿{ item.customerAddressName || '' }}</view>
@@ -26,15 +28,35 @@
 							<view class="main-flex">
 								<view class="carNum-box">
 									<view>璁″垝杞︽暟锛�</view>
-									<u--input placeholder="璇疯緭鍏ュ彂杩愯溅鏁�" border="surround" v-model="item.numPlan" @change="inputChange"></u--input>
+									<!-- <u--input placeholder="璇疯緭鍏ュ彂杩愯溅鏁�" border="surround" v-model="item.numPlan" @change="inputChange" @focus="faYunPlanCarsFocus(item)"></u--input> -->
+									<view class="planCars" :style="{color:item.numPlan  ? '#111':'#ccc'}" @click="faYunPlanCarsFocus(item)">
+										<text v-model="item.numPlan">{{ item.numPlan || '鐐瑰嚮杈撳叆鏁伴噺' }}</text>
+										<view class="cursor" v-if="isCursor && fayunPlanFocusId == item.id"><image src="@/static/cursor.gif" mode=""><image></view>
+									</view>
 								</view>
-								<view>瀹為檯鍙戣溅鏁帮細{{ item.numReal || '' }}</view>
+								<view>瀹為檯鍙戣溅鏁帮細{{ item.numReal || '鏆傛棤' }}</view>
 							</view>
 						</view>
+						<u-keyboard    
+							@change="valChange"
+							@backspace="backspace"
+							@confirm="keyBoardConfirm"
+							@cancel="keyBoardCancel"
+							@close="keyBoardClose"
+							:show="keyBoardShow"
+							ref="uKeyboard"
+							mode="number"
+							:overlay="false"
+							:closeOnClickOverlay="false"
+							:dotDisabled="true"
+							zIndex="100000"
+						></u-keyboard>
 					</view>
-					<u-button class="xiugai-btn" type="primary" text="鎻愪氦" @click="dataFormSubmit"></u-button>
+
+					<u-button class="xiugai-btn" type="primary" text="鎻愪氦" @click="submit"></u-button>
 				</view>
 				<view v-if="isTomJihua == '宸茶缃殑璁″垝'">
+					<u-empty v-if="fyData.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" class="empty-container"></u-empty>
 					<view class="main-block-box" v-for="(item, index) in fyData" :key="item.id">
 						<view class="jihua-main-line">
 							<view class="name">瀹㈡埛鍚嶇О锛歿{ item.customerName || '' }}</view>
@@ -42,29 +64,45 @@
 						<view class="jihua-main-line">
 							<view class="main-flex">
 								<view>鐓ょ锛歿{ item.order.coalName || '' }}</view>
-								<view>鍓╀綑閲忥細{{ item.order.executiveSurplus || '' }}</view>
+								<view>鍓╀綑閲忥細{{ item.order.executiveSurplus || '' }}</view>       
 							</view>
 						</view>
 						<view class="jihua-main-line">
 							<view class="main-flex">
 								<view class="carNum-box">
 									<view>璁″垝杞︽暟锛�</view>
-									<u--input placeholder="璇疯緭鍏ュ彂杩愯溅鏁�" border="surround" v-model="item.numPlan" @change="inputTotalChange(item)"></u--input>
+									<!-- <u--input placeholder="璇疯緭鍏ュ彂杩愯溅鏁�" border="surround" v-model="item.numPlan" @change="inputTotalChange(item)" @focus="faYunPlanCarsFocus(item)"></u--input> -->
+									<view class="planCars" :style="{color:item.numPlan  ? '#111':'#ccc'}" @click="faYunPlanCarsFocus(item)">
+										<text v-model="item.numPlan">{{ item.numPlan || '鐐瑰嚮杈撳叆鏁伴噺' }}</text>
+										<view class="cursor" v-if="isCursor && fayunPlanFocusId == item.id">
+											<image src="@/static/cursor.gif" mode="" />
+										</view>
+									</view>
 								</view>
-								<view>瀹為檯鍙戣溅鏁帮細{{ item.order.numReal || '' }}</view>
+								<view>瀹為檯鍙戣溅鏁帮細{{ item.order.numReal == null ? '鏆傛棤' : item.order.numReal }}</view>
 							</view>
 						</view>
+						<u-keyboard
+							@change="valChange"
+							@backspace="backspace"
+							@confirm="keyBoardConfirm"
+							@cancel="keyBoardCancel"
+							@close="keyBoardClose"
+							:show="keyBoardShow"
+							ref="uKeyboard"
+							mode="number"
+							:overlay="false"
+							:closeOnClickOverlay="false"
+							:dotDisabled="true"
+							zIndex="100000"
+						></u-keyboard>
 					</view>
-					<u-button class="xiugai-btn" type="primary" text="淇敼" @click="getOrderCarNum"></u-button>
+					<u-button class="xiugai-btn" type="primary" text="淇敼" @click="editPlan"></u-button>
 				</view>
-				<!-- <u-empty
-				    v-if="fyData.length == 0"
-			    	mode="data"
-			    	icon=""
-			    >
-				</u-empty> -->
 			</view>
 		</view>
+
+		<view class="back-top-container"><u-back-top :scroll-top="scrollTop" icon="arrow-up" mode="square"></u-back-top></view>
 		<!-- 鑿滃崟鏍� -->
 		<popup-menu @menuShow="menushow" ref="menuRef"></popup-menu>
 	</view>
@@ -72,6 +110,7 @@
 
 <script>
 import popupMenu from '@/components/common/popup-menu/popup-menu.vue';
+import tool from '@/utils/tool.js';
 export default {
 	components: {
 		popupMenu
@@ -80,7 +119,7 @@
 		return {
 			radioValue: '鍏ㄩ儴',
 			tabList: [
-				{
+				{  
 					name: '浠婃棩鍙戣繍璁″垝'
 				},
 				{
@@ -95,7 +134,14 @@
 			},
 			isTomJihua: '鍏ㄩ儴',
 			editRow: '', //淇敼琛岀殑琛�
-			menuShow: false
+			menuShow: false,
+			scrollTop: 0, // 杩斿洖椤堕儴鎸夐挳缁戝畾,
+			// 閿洏
+			keyBoardShow: false,
+			keyBoardValue: '',
+			fayunPlanFocusId: null,
+			isCursor: false ,// 鏃ヨ鍒掕溅杈嗚緭鍏ユ鐒︾偣鍔ㄧ敾
+			overlayShow:false // 閬僵灞�
 		};
 	},
 	onShow() {
@@ -104,10 +150,58 @@
 		}
 		this.init();
 	},
+	onPageScroll(e) {
+		// 浼犲叆scrollTop鍊煎苟瑙﹀彂鎵�鏈塭asy-loadimage缁勪欢涓嬬殑婊氬姩鐩戝惉浜嬩欢
+		this.scrollTop = e.scrollTop;
+	},
 	// 鐐瑰嚮瀵艰埅鏍忚彍鍗曞悗
 	onNavigationBarButtonTap(e) {
 		// console.log(e);
 		this.$refs.menuRef.menuClick();
+	},
+	mounted() {
+		// setInterval(() => {
+		// 	uni.hideKeyboard();
+		// }, 1);
+	},
+	watch: {
+		isTomJihua: {
+			handler: function(newV, oldV) {
+				if (newV != oldV) {
+					this.keyBoardShow = false;
+				}
+			},
+			deep: true,
+			immediate: true
+		},
+		keyBoardValue: {
+			handler: function(newV, oldV) {
+				console.log('閿洏杈撳叆鍊�', newV, oldV);
+				this.fyData.map(item => {
+					if (item.id == this.fayunPlanFocusId) {
+						if (item.numPlan && item.numPlan != newV) {
+							item.numPlan = this.keyBoardValue;
+							if (this.isTomJihua == '宸茶缃殑璁″垝') {
+								this.editRow = item;
+							}
+						}
+					}
+				});
+			},
+			deep: true,
+			immediate: true
+		},
+		scrollTop: {
+			handler: function(newV, oldV) {
+				// console.log('椤甸潰婊戝姩', newV);
+				if (newV != oldV) {
+					this.keyBoardClose();
+					// this.keyBoardShow = false;
+				}
+			}
+		},
+		deep: true,
+		immediate: true
 	},
 	methods: {
 		init() {
@@ -116,22 +210,30 @@
 		menushow(e) {
 			this.menuShow = e;
 		},
+		//鎻愪氦
 		dataFormSubmit() {
-			//鎻愪氦璁㈠崟
-			this.fyData.forEach(e => {
-				e.shippingDate = this.info.shippingDate;
-				if (e.planId && !e.numPlan) {
-					e.numPlan = -1; //鍒犻櫎璁剧疆涓虹┖鐨勮鍒�
-				}
-				let orderId = e.id;
-				e.id = e.planId;
-				e.orderId = orderId;
-			});
-			this.$reqPost('addObj', this.fyData).then(res => {
-				this.$u.toast('娣诲姞鎴愬姛');
-				this.fyList();
-			});
+			console.log('鏃ュ彂杩愯鍒掓洿鏂版暟鎹彁浜�',this.fyData);
+				this.overlayShow = true;
+				this.fyData.forEach(e => {
+					e.shippingDate = this.info.shippingDate;
+					if (e.planId && !e.numPlan) {
+						e.numPlan = -1; // 鍒犻櫎璁剧疆涓虹┖鐨勮鍒�
+					}
+					let orderId = e.id;  // 璁㈠崟id
+					e.orderId = orderId;
+					// e.id = e.planId;
+				});
+				this.$reqPost('addObj', this.fyData).then(res => {
+					console.log('addObj鎺ュ彛杩斿洖',res);
+					this.$u.toast('娣诲姞鎴愬姛');
+					this.fyList();
+				});
 		},
+		// 鍏ㄩ儴鏃ヨ鍒掓彁浜ゆ寜閽槻鎶�
+		submit:tool.throttle(function(){
+				this.dataFormSubmit();
+		}),
+		// 淇敼鏃ヨ鍒掓寜閽�
 		getOrderCarNum() {
 			//淇敼
 			this.$reqPost('setCarNums', this.editRow).then(res => {
@@ -139,6 +241,11 @@
 				this.xscarshippingdayplan();
 			});
 		},
+		// 淇敼鏃ヨ鍒掗槻鎶栨寜閽�
+		editPlan:tool.throttle(function(){
+			this.getOrderCarNum();
+		}),
+		// 鍒囨崲鍏ㄩ儴鍜屽凡璁剧疆
 		groupChange(n) {
 			console.log(n, 'n================');
 			this.isTomJihua = n;
@@ -147,6 +254,140 @@
 			} else {
 				this.fyList();
 			}
+		},
+		fyList() {
+			this.overlayShow = true;
+			//鍒楄〃鏌ヨ
+			uni.showLoading({   
+				title: '姝ｅ湪鍔犺浇...'
+			});
+			let compId = uni.getStorageSync('userInfo').compId;
+			let params = {
+				current: 1,
+				size: 100,
+				status: 2,
+				trainType: 1,
+				compId: compId
+			};
+			this.$reqGet('fyList', params).then(res => {
+				if (res.code == 0) {
+					console.log('fylist--------',res.data);
+					this.xscarshippingdayplan(res.data);
+				}
+			});
+		},
+		xscarshippingdayplan(allList) {
+			uni.showLoading({
+				title: '姝ｅ湪鍔犺浇...'
+			});
+			this.overlayShow = true;
+			//宸茬粡璁剧疆鐨�
+			let params = {
+				current: 1,
+				size: 50,
+				shippingDate: this.info.shippingDate
+			};
+			this.$reqGet('xscarshippingdayplan', params)
+				.then(res => {
+					console.log('涓嶇煡閬撴槸浠�涔�---------------',res);
+					if (res.code == 0) {
+						if (allList) {
+							let selectFyData = res.data.records;
+							allList.forEach(e => {
+								selectFyData.forEach(ee => {
+									if (e.id == ee.orderId) {
+										e.numPlan = ee.numPlan;
+										e.numReal = ee.numReal;	
+										// e.planId = ee.id;
+										console.log('淇敼planid鎿嶄綔',`planId:${ee.id}`);
+										if (ee.carNums != null) {
+											e.carNums = ee.carNums;
+										}
+									}
+								});
+							});
+							this.fyData = allList;
+						} else {
+							this.fyData = res.data.records;
+						}
+						uni.hideLoading();
+						this.overlayShow = false;
+					}
+				})
+				.catch(e => {
+					uni.hideLoading();
+					this.overlayShow = false;
+				});
+		},
+		//鍒囨崲浠婃棩鍜屾槑鏃�
+		tabClick(item) {
+			console.log(item, 'item==========');
+			if (item.index == 1) {
+				this.info.shippingDate = this.tomorrowDate();
+				if (this.isTomJihua == '宸茶缃殑璁″垝') {
+					this.xscarshippingdayplan();
+				} else {
+					this.fyList();
+				}
+			} else {
+				this.info.shippingDate = this.todayDate();
+				if (this.isTomJihua == '宸茶缃殑璁″垝') {
+					this.xscarshippingdayplan();
+				} else {
+					this.fyList();
+				}
+			}
+		},
+		inputChange(val) {
+			console.log('鍏ㄩ儴璁″垝', val);
+		},
+		inputTotalChange(val) {
+			console.log(val, 'val2=======val2,宸茶缃鍒�');
+			this.editRow = val;
+		},   
+		// input鑾峰彇鐒︾偣
+		faYunPlanCarsFocus(item) {
+			// 鑾峰彇璇ョ劍鐐瑰湪椤甸潰鐨勪綅缃�
+			// let boxBottom = document.getElementById('#u-dropdown');
+			// console.log('鍏冪礌',boxBottom);
+			// let bottom = this.$refs.planViewRef.offsetHeight
+			
+			this.fayunPlanFocusId = item.id;
+			this.keyBoardShow = true;
+			this.isCursor = true;
+			this.keyBoardValue = item.numPlan + '';
+		},
+		// 閿洏
+		valChange(val) {
+			// this.keyBoardValue += val;
+			// 灏嗘瘡娆℃寜閿殑鍊兼嫾鎺ュ埌value鍙橀噺涓紝娉ㄦ剰+=鍐欐硶
+			this.fyData.map(item => {
+				if (item.id == this.fayunPlanFocusId) {
+					if (item.numPlan) {
+						item.numPlan = this.keyBoardValue += val + '';
+						this.keyBoardValue = item.numPlan;
+					} else {
+						item.numPlan = val;
+						this.keyBoardValue = item.numPlan;
+					}
+				}
+			});
+		},
+		backspace() {
+			this.keyBoardValue = this.keyBoardValue.substr(0, this.keyBoardValue.length - 1);
+		},
+		keyBoardConfirm(val) {
+			console.log('閿洏鐐瑰嚮纭畾鐨勫��', val);
+			this.keyBoardClose();
+		},
+		keyBoardCancel() {
+			this.keyBoardClose();
+		},
+		keyBoardClose() {
+			console.log('閿洏鍏抽棴浜�');
+			this.fayunPlanFocusId = null;
+			this.keyBoardShow = false;
+			this.isCursor = false;
 		},
 		todayDate() {
 			let yes = new Date().getTime();
@@ -171,92 +412,6 @@
 			const time = y + '-' + m + '-' + d;
 			console.log('tomorrowDate---------222', time);
 			return time;
-		},
-
-		fyList() {
-			//鍒楄〃鏌ヨ
-			uni.showLoading({
-				title: '姝ｅ湪鍔犺浇...'
-			});
-			let compId = uni.getStorageSync('userInfo').compId;
-
-			let params = {
-				current: 1,
-				size: 100,
-				status: 2,
-				trainType: 1,
-				compId: compId
-			};
-			this.$reqGet('fyList', params).then(res => {
-				if (res.code == 0) {
-					this.xscarshippingdayplan(res.data);
-				}
-			});
-		},
-		xscarshippingdayplan(allList) {
-			//宸茬粡璁剧疆鐨�
-			console.log(allList, 'allList==========');
-			let params = {
-				current: 1,
-				size: 50,
-				shippingDate: this.info.shippingDate
-			};
-			this.$reqGet('xscarshippingdayplan', params)
-				.then(res => {
-					if (res.code == 0) {
-						if (!allList) {
-							this.fyData = res.data.records;
-							console.log(this.fyData, 'this.fyData=========11111111');
-						} else {
-							let l = res.data.records;
-							allList.forEach(e => {
-								l.forEach(ee => {
-									if (e.id == ee.orderId) {
-										e.numPlan = ee.numPlan;
-										e.numReal = ee.numReal;
-										e.planId = ee.id;
-										if (ee.carNums != null) {
-											e.carNums = ee.carNums;
-										}
-									}
-								});
-							});
-							this.fyData = allList;
-							console.log(this.fyData, 'this.fyData=========22222222');
-						}
-						console.log(this.fyData, 'this.fyData=========333333333');
-						uni.hideLoading();
-					}
-				})
-				.catch(e => {
-					uni.hideLoading();
-				});
-		},
-		tabClick(item) {
-			//鍒囨崲浠婃棩鍜屾槑鏃�
-			console.log(item, 'item==========');
-			if (item.index == 1) {
-				this.info.shippingDate = this.tomorrowDate();
-				if (this.isTomJihua == '宸茶缃殑璁″垝') {
-					this.xscarshippingdayplan();
-				} else {
-					this.fyList();
-				}
-			} else {
-				this.info.shippingDate = this.todayDate();
-				if (this.isTomJihua == '宸茶缃殑璁″垝') {
-					this.xscarshippingdayplan();
-				} else {
-					this.fyList();
-				}
-			}
-		},
-		inputChange(val) {
-			console.log(val);
-		},
-		inputTotalChange(val) {
-			console.log(val, 'val2=======val2');
-			this.editRow = val;
 		}
 	}
 };
@@ -282,6 +437,7 @@
 	.u-input {
 		height: vww(16);
 		width: vww(100);
+		z-index: 1;
 	}
 	.u-button {
 		position: fixed !important;
@@ -307,6 +463,10 @@
 		font-size: vww(12) !important;
 		line-height: vww(12) !important;
 	}
+	.u-empty {
+		width: 100%;
+		height: vww(300);
+	}
 }
 
 .qiehuan-box {
@@ -315,8 +475,8 @@
 	left: 0;
 	right: 0;
 	width: 100%;
-	height:vww(44);
-	// z-index: 1; 
+	height: vww(44);
+	z-index: 10;
 	background-color: #fff;
 }
 
@@ -341,9 +501,8 @@
 	display: flex;
 	flex-direction: column;
 	width: 100%;
-	padding: vww(0) vww(10) vww(70) vww(10);
+	padding: vww(44) vww(10) vww(70) vww(10);
 	box-sizing: border-box;
-	margin-top: vww(44);
 	.main-inside {
 		width: 100%;
 		height: calc(100% - vww(44));
@@ -356,7 +515,7 @@
 		left: 0;
 		right: 0;
 		width: 100%;
-		// z-index: 1; 
+		z-index: 10;
 		background-color: #fff;
 	}
 
@@ -392,6 +551,30 @@
 				}
 				.carNum-box {
 					display: flex;
+					.planCars {
+						display: flex;
+						box-sizing: border-box;
+						overflow: auto;
+						width: vww(120);
+						border: 1px solid #dddddd;
+						border-radius: vww(4);
+						padding: vww(1) vww(10);
+						
+						
+						// 杈撳叆鐒︾偣鍥剧墖
+						.cursor {
+							// float: left;
+							width: vww(1);
+							height: vww(15);
+							vertical-align: middle;
+							align-self: center;
+							image {
+								width: vww(1);
+								display: block;
+								height: vww(15);
+							}
+						}
+					}
 					view {
 						font-size: vww(14);
 						line-height: vww(32);
@@ -401,4 +584,4 @@
 		}
 	}
 }
-</style>
+</style>
\ No newline at end of file

--
Gitblit v1.9.1