结账和搜索

ghsApp/src/components/module/app-search-number.vue

@@ -0,0 +1,146 @@
+<template>
+	<div class="app-search-module" :style="{ height: height + 'upx' }">
+		<div class="map-search" :style="{ backgroundColor: backColor }" style="height: 80upx">
+			<div class="icon-wrap" v-if="isIcon">
+				<i class="iconfont" :class="[icon]"></i>
+			</div>
+			<div class="input-wrap">
+				<input
+					type="number" placeholder-style="color:#ccc"
+					ref="searchInput"
+					v-model="search"
+					:focus="focus"
+					@input="inputFn" @focus="inputEmptyFn"
+					:style="{ fontSize: fontSize + 'upx' }"
+					:placeholder="placeholder"
+					placeholder-class="placeholder"
+					@confirm="searchFn"
+					confirm-type="search"
+				/>
+			</div>
+		</div>
+		<block v-if="isBtn">
+			<button v-if="isTextBtn" class="search-btn" :style="{ fontSize: fontSize + 'upx' }" @click="searchFn" > {{ btnText }} </button>
+			<button v-else class="search-btn admin-button-com middle blue" :style="{ fontSize: fontSize + 'upx' }" @click="searchFn" > {{ btnText }} </button>
+		</block>
+	</div>
+</template>
+
+<script>
+export default {
+	name: "app-search-module",
+	props: {
+		// 搜索组件的高度
+		height: {
+			type: Number,
+			default: 66
+		},
+		placeholder: {
+			type: String,
+			default: "请输入"
+		},
+		// size字体大小
+		fontSize: {
+			type: Number,
+			default: 26
+		},
+		// 是否有icon
+		isIcon: {
+			type: Boolean,
+			default: true
+		},
+		// 显示的icon
+		icon: {
+			type: String,
+			default: "iconsearch"
+		},
+		// 背景色
+		backColor: {
+			type: String,
+			default: "#F0F2F6"
+		},
+		// 是否需要按钮
+		isBtn: {
+			type: Boolean,
+			default: false
+		},
+		// 是否是文字按钮
+		isTextBtn: {
+			type: Boolean,
+			default: true
+		},
+		// 按钮文字
+		btnText: {
+			type: String,
+			default: "搜索"
+		},
+		// 是否自动聚焦
+		focus: {
+			type: Boolean,
+			default: false
+		}
+	},
+	data() {
+		return {
+			search: ""
+		};
+	},
+	methods: {
+		searchFn() {
+			this.$emit("search", this.search);
+		},
+		inputFn(e) {
+			setTimeout(() => {
+				this.$emit("input", this.search);
+			});
+		},
+		inputEmptyFn(e) {
+			this.search = '';
+			this.$emit("input", this.search);
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.app-search-module {
+	width: 100%;
+	@include disFlex(center, space-between);
+	.map-search {
+		@include disFlex(center, flex-start);
+		width: 100%;
+		height: 100%;
+		border-radius: 50upx;
+		.icon-wrap {
+			margin-left: 20upx;
+			width: 40upx;
+			.iconfont {
+				color: #ccc;
+				font-size: 32upx;
+			}
+		}
+		.input-wrap {
+			width: calc(100% - 90upx);
+			height: 80upx;
+			margin-left: 14upx;
+			input {
+				height: 100%;
+				font-size: 30upx !important;
+				text-align: left;
+				line-height: 80upx;
+			}
+			.placeholder {
+				color: #ccc;
+			}
+		}
+	}
+	// 按钮
+	.search-btn {
+		height: 110upx;
+		padding: 0 20upx;
+		flex-shrink: 0;
+		margin-left: 20upx;
+		background-color: inherit;
+	}
+}
+</style>

ghsApp/src/pagesGys/search.vue

@@ -3,20 +3,19 @@
 
 	<uni-popup ref="searchShowRef" :mask-click="false" background-color="#fff" type="center" :animation="false" class="class-popup-style">
 
-			<view style="height:auto;font-size:33upx;margin-top:130upx;padding-left:25upx;color:#333333;">
-				<view style="margin-bottom:28upx;">
-					<view>KD312702412 | 2023-06-17 00:21</view>
-					<view>金额 ¥23.5</view>
-				</view>
-				<view style="margin-bottom:28upx;">
-					<view>KD312702412 | 2023-06-17 00:21</view>
-					<view>金额 ¥23.5</view>
-				</view>
-				<view style="margin-bottom:28upx;">
-					<view>KD312702412 | 2023-06-17 00:21</view>
-					<view>金额 ¥23.5</view>
-				</view>
-			</view>
+		<view style="height:auto;font-size:33upx;margin-top:130upx;padding-left:25upx;color:#333333;">
+
+			<block v-if="!$util.isEmpty(searchList)">
+				<block v-for="(item, index) in searchList" :key="index">
+					<view style="margin-bottom:28upx;" @click="addData(item)">
+						<view>编号 {{item.orderSn}}</view>
+						<view>时间 {{item.entryTime.substr(5,11)}}</view>
+						<view>金额 ¥{{item.actPrice}}</view>
+					</view>
+				</block>
+			</block>
+
+		</view>
 
 	</uni-popup>
 
@@ -30,12 +29,15 @@
     </view>
 	<view class="order-page">
 		<view scroll-y class="shop-list">
-			<block v-if="!$util.isEmpty(detailsList)">
-				<view v-for="(item, index) in detailsList">
-				</view>
+			<block v-if="!$util.isEmpty(selectDataList)">
+				<block v-for="(item, index) in selectDataList" :key="index">
+					<view style="margin-bottom:10upx;font-size:30upx;">
+						ID:{{item}}
+					</view>
+				</block>
 			</block>
 			<block v-else>
-				<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(detailsList)" />
+				<AppWrapperEmpty title="暂无数据" :is-empty="$util.isEmpty(selectDataList)" />
 			</block>
 		</view>
 		<view class="bar-view">
@@ -47,7 +49,7 @@
 				</view>
 			</template>
 			<view class="btn-view">
-				<button :class="['admin-button-com', 'blue']" @click="clearSelectedOrder" >下一步</button>
+				<button :class="['admin-button-com', 'blue']" @click="nextStep">下一步</button>
 			</view>
 		</view>
 
@@ -57,14 +59,14 @@
 <script>
 import AppWrapperEmpty from "@/components/app-wrapper-empty";
 import { getDebtList,clearOrderApi } from "@/api/gys/index";
-import AppSearchModule from "@/components/module/app-search";
+import AppSearchModule from "@/components/module/app-search-number";
 export default {
 	components: { AppWrapperEmpty, AppSearchModule},
 	data() {
 		return {
 			totalAmount: "",
 			num: "",
-			detailsList: [],
+			selectDataList: [],
 			searchList:[],
 			listLoading: false,
       		isAllCheck: false,
@@ -81,6 +83,19 @@ export default {
 	computed: {
 	},
 	methods: {
+		addData(item){
+			if (this.$util.isEmpty(this.selectDataList)) {
+				this.selectDataList.push(item.id)
+			}else{
+				if(this.selectDataList.indexOf(item.id) == -1){
+					this.selectDataList.push(item.id)
+				}
+			}
+
+			uni.setStorageSync('select_ghs_clear_'+this.option.id, this.selectDataList)
+
+			this.$refs.searchShowRef.close()
+		},
 		searchFn(e) {
 			let that = this
 			if (this.$util.isEmpty(e)) {
@@ -106,14 +121,11 @@ export default {
 			})
 		},
 		init(){
-
+			let cache = uni.getStorageSync('select_ghs_clear_'+this.option.id)
+			console.log(cache)
 		},
-		clearSelectedOrder(){
-			if (this.$util.isEmpty(this.selectList)) {
-				this.$msg("请选择订单");
-				return;
-			}
-			this.showClearModel = true;
+		nextStep(){
+
 		}
 	}
 };
@@ -127,14 +139,9 @@ export default {
   position: fixed;
   top: 0;
   z-index: 9999;
-  /* 手机mobile屏幕小于1000px */
   @media screen and (max-width: 1100px) {
     width: 100%;
-  }
-  /* 收银台cashier屏幕大于1000px */
-  @media screen and (min-width:1100px) {
-    width: 40%;
-  }   
+  }  
   height: 100upx;
   display: flex;
   align-items: center;