优化全选input

ghsApp/src/components/module/allSelectInput.vue

@@ -26,7 +26,7 @@
 	}
 </style>
 <template>
-	<view class="change-input">
+	<view class="change-input" :style="'width:'+width+'rpx !important;height:'+height+'rpx !important;'" >
 			<input :focus="isFocus" :style="isActive?'caret-color:rgba(0,0,0,0)':'caret-color:rgba(0,0,0,1)'"  type="number" @focus="initAllInput" @blur="moveAllInput" v-model="inputVal" @input="changeAllInput" :placeholder="value==''&&inputVal==''?placeholder:''">
 			<text :class="isActive?'active':''">{{value?value:''}}</text>
 	</view>
@@ -35,6 +35,8 @@
 export default {
   name: "allSelectInput",
 	props: {
+		width: '',
+		height: '',
 		isActive: '',
 		isFocus: '',
 		value: '',

ghsApp/src/pagesPurchase/add.vue

@@ -109,6 +109,7 @@
 <!--								placeholder="请填写采购总价"-->
 <!--							/>元-->
 							<allSelectInput :isActive="isAloneAllActive" :isFocus="isAloneAllFocus" :value="customData.itemPrice" :placeholder="'请填写采购总价'"
+																							:width="400" :height="60"
 																							@deleteInputVal="deleteAloneInputVal" @initAllInput="initAloneAllInput" @moveAllInput="moveAloneAllInput">
 							</allSelectInput>元
 						</view>
@@ -222,6 +223,8 @@ export default {
 			// this.moveAllInputOne();
 			this.isFocus = false;
 			this.isFocusOne = false;
+			this.isAloneAllActive=false;
+			this.isAloneAllFocus=false;
 			this.$nextTick(()=>{
 				if(this.customData.bigCount==0 && this.customData.smallCount==0){
 					this.delAllEvent(this.customData)}

ghsApp/src/pagesStorehouse/allot/exSelect.vue

@@ -83,6 +83,7 @@
 								"
 								@customNum="customNum"
 								@add="addEvent"
+								@addOneEvent="addCustomNumEvent"
 								@del="delEvent"
 							></Commondity>
 							<!-- <Commondity

hdApp/src/pagesPurchase/add.vue

@@ -65,15 +65,13 @@
 								:type="pageType"
 								:key="productIndex"
 								:info="productItem"
-								:bigCount="
-									getSelectItemById(productItem.id, classItem.classId).bigCount
-								"
-								:smallCount="
-									getSelectItemById(productItem.id, classItem.classId).smallCount
-								"
+								:bigCount=" getSelectItemById(productItem.id, classItem.classId).bigCount"
+								:smallCount="getSelectItemById(productItem.id, classItem.classId).smallCount"
+								:itemPrice="getSelectItemById(productItem.id, classItem.classId).itemPrice"
 								@customNum="customNum"
 								@add="addEvent"
-								@del="delEvent"
+								@addOneEvent="addCustomNumEvent"
+								@del="delAllEvent"
 							></CommodityPurchase>
 						</template>
 					</view>
@@ -104,12 +102,15 @@
 							<view class="kc">
 								价格
 							</view>
-							<input
-								:value="customData.itemPrice"
-								@change="changePriceEvent"
-								type="number"
-								placeholder="请填写采购总价"
-							/>元
+<!--							<input-->
+<!--								:value="customData.itemPrice"-->
+<!--								@change="changePriceEvent"-->
+<!--								type="number"-->
+<!--								placeholder="请填写采购总价"-->
+<!--							/>元-->
+							<allSelectInput :isActive="isAloneAllActive" :isFocus="isAloneAllFocus" :value="customData.itemPrice" :placeholder="'请填写采购总价'"
+																							@deleteInputVal="deleteAloneInputVal" @initAllInput="initAloneAllInput" @moveAllInput="moveAloneAllInput">
+							</allSelectInput>元
 						</view>
 					</view>
 					<view class="select-cmd_bx">
@@ -117,8 +118,14 @@
 							<view class="kc">
 								数量
 							</view>
-							<input v-model="customData.bigCount" type="number" focus />扎
-							<input v-model="customData.smallCount" type="number" style="margin-left:24upx"/>支
+							<allMoreSelectInput
+								:isActive="isActive" :isFocus="isFocus" :value="customData.bigCount"
+								:isActiveOne="isActiveOne" :isFocusOne="isFocusOne" :valueOne="customData.smallCount"
+								@deleteInputVal="deleteInputVal" @initAllInput="initAllInput" @moveAllInput="moveAllInput"
+								@deleteInputValOne="deleteInputValOne" @initAllInputOne="initAllInputOne" @moveAllInputOne="moveAllInputOne">
+							</allMoreSelectInput>
+							<!--<input v-model="customData.bigCount" type="number" focus />扎-->
+							<!--<input v-model="customData.smallCount" type="number" style="margin-left:24upx"/>支-->
 						</view>
 					</view>
 				</view>
@@ -151,6 +158,11 @@ import ModalModule from "@/components/plugin/modal";
 import FooterCart from "@/components/module/app-footer-cart";
 import productMins from "@/mixins/product";
 
+import allMoreSelectInput from "@/components/module/allMoreSelectInput";
+import allMoreSelectInputMins from "@/mixins/allMoreSelectInput";
+
+import allSelectInput from "@/components/module/allSelectInput";
+import allSelectInputMins from "@/mixins/allSelectInput";
 export default {
 	name: "purchase", // 采购
 	components: {
@@ -159,41 +171,72 @@ export default {
 		AppWrapperEmpty,
 		CommodityPurchase,
 		ModalModule,
-		FooterCart
+		FooterCart,allMoreSelectInput,allSelectInput
 	},
-	mixins: [productMins],
+	mixins: [productMins,allMoreSelectInputMins,allSelectInputMins],
 	data() {
 		return {
 			pageType: "purchase",
 
+			isAloneAllActive: false,
+			isAloneAllFocus: false,
+
 			isModel: false,
 			showSubmitModel: false,
 			customData: {
 				bigCount: 0,
 				smallCount: 0,
-				itemPrice: null
+				itemPrice: 0
 			}
 		};
 	},
 	onLoad() {},
 	methods: {
+		// 离开全选input alone
+		moveAloneAllInput(e){
+			this.isAloneAllActive=false;
+			this.isAloneAllFocus=false;
+			if(e==''){return}
+			this.customData.itemPrice = e;
+		},
+		//input点击删除按键
+		deleteAloneInputVal(){
+			this.isAloneAllActive=false;
+			this.customData.itemPrice = '';
+		},
 		//自定义数量
 		customNum(info) {
 			this.isModel = true;
 			this.customData = info;
+			this.$nextTick(()=>{
+				// this.initAllInput();
+				this.initAloneAllInput();
+			})
 		},
 		modalCancel() {
 			this.isModel = false;
 			this.customData = {};
 		}, // 取消 确认
 		affirm(val) {
-			if (val.index === 0) {
-				this.modalCancel();
-			} else {
-				//超过库存时 设置为库存最大值
-				this.updateItemEvent(this.customData);
-				this.modalCancel();
-			}
+			// this.moveAllInput();
+			// this.moveAllInputOne();
+			this.isFocus = false;
+			this.isFocusOne = false;
+			this.$nextTick(()=>{
+				if(this.customData.bigCount==0 && this.customData.smallCount==0){
+					this.delAllEvent(this.customData)}
+
+				if (val.index === 0) {
+					this.modalCancel();
+				} else {
+
+					// delAllEvent
+					//超过库存时 设置为库存最大值
+					this.updateItemEvent(this.customData);
+					this.modalCancel();
+				}
+			})
+
 		},
 		cancelEvent() {},
 		submitEvent(val) {
@@ -238,8 +281,13 @@ export default {
 	}
 };
 </script>
-
+<style>
+	.change-input{
+		width: 170rpx !important;
+	}
+</style>
 <style lang="scss" scoped>
+
 .billing_box_bg {
 	height: 100%;
 	display: flex;