Ci2Order.vue/App/pages/search/index.vue

<template>
	<view>
		<z-navbar title="搜索" back></z-navbar>
		<view class="search_top flex-n fac fjc">
			<view class="search_top_in flex-n fac">
				<view class="search_top_icon ml-35 mr-20 iconfont iconjuxing5"></view>
				<z-input class="flex-1 mr-35" placeholder="请输入关键字" align="left" v-model="searchText"></z-input>
			</view>
		</view>
		<scroll-view scroll-y class="search_content">
			<view v-if="once" class="flex-w fac">
				<checkbox-group class="mt-20" @change="checkboxAllChange">
					<label class="ml-20" style="font-size: 28rpx;">
						<checkbox value="checkedall" :checked="checkedAll" color="#2d8cf0"
							style="transform:scale(0.7)" />全部
					</label>
				</checkbox-group>
				<checkbox-group class="mt-20" @change="checkboxChange">
					<label v-for="(item,index) in houseTypeList" :key="index" class="ml-20" style="font-size: 28rpx;">
						<checkbox :value="item.houseTypeId" :checked="item.checked" color="#2d8cf0"
							style="transform:scale(0.7)" />{{item.houseTypeName}}
					</label>
				</checkbox-group>
				<z-button class="mt-80" @click="backSearch">确定筛选</z-button>
			</view>

			<view class="search_nocontent" v-if="!once&&list.length==0">
				<image class="search_nocontent_img" mode="widthFix" src="../../static/nocontent.png"></image>
				<view class="search_nocontent_notext">未搜索到相关结果</view>
			</view>
			<view v-else>
				<template v-if="type==0">
					<z-cell arrow v-for="(item,index) in list" :key="index" @click.native="gotoRemind(item.id)">
						<view class="search_item">
							<view class="flex-n fac">
								<view>{{item.customName}}</view>
								<view class="ml-36">{{item.phone}}</view>
								<view class="ml-36">{{item.wantDate}}</view>
							</view>
							<view class="flex-n fac">
								<view class="nowarp">{{item.wantHouseContent}}</view>
							</view>
						</view>
					</z-cell>
				</template>
				<template v-else-if="type==1">
					<z-cell arrow v-for="(item,index) in list" :key="index" @click.native="gotoOrder(item.id)">
						<view class="search_item">
							<view class="flex-n fac">
								<view>{{item.orderDate}}</view>
								<view class="ml-36">{{item.activityBeginTime}}-{{item.activityEndTime}}</view>
							</view>
							<view class="flex-n fac">
								<view class="nowarp">{{item.customName}}</view>
								<view class="ml-20 nowarp">{{item.houseName}}</view>
								<view class="ml-20 line-1">{{item.packageName}}{{item.paycontent}}</view>
							</view>
						</view>
					</z-cell>
				</template>
				<template v-else>
					<z-cell arrow v-for="(item,index) in list" :key="index" @click.native="gotoSettlement(item.id)">
						<view class="search_item">
							<view class="flex-n fac">
								<view>{{item.orderDate}}</view>
								<view class="ml-36">{{item.activityBeginTime}}-{{item.activityEndTime}}</view>
							</view>
							<view class="flex-n fac">
								<view class="nowarp">{{item.customName}}</view>
								<view class="ml-20 nowarp">{{item.houseName}}</view>
								<view class="ml-20 line-1">{{item.packageName}}{{item.paycontent}}</view>
							</view>
						</view>
					</z-cell>
				</template>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	const app = getApp({
		allowDefault: true
	});
	export default {
		data() {
			return {
				searchText: '',
				searchType: 0,
				nodata: false,
				type: 0, //0咨询提醒，1预定提醒，2预定查询

				list: [],

				houseTypeList: [],
				checkedAll: false,
				checkedList: [],

				once: true, //第一次进入
			}
		},
		onLoad(option) {
			this.type = option.type;
			this.gethouseTypeList();
		},
		watch: {
			searchText(newval, oldval) {
				this.once = false;
				if (this.type == 0) {
					this.searchRemind(newval);
				} else if (this.type == 1 || this.type == 2) {
					this.searchOrder(newval);
					this.searchType = 0;
				} else {
					this.searchOrder(newval);
					this.searchType = 1;
				}
			}
		},
		methods: {
			backSearch() {
				if (this.type == 1) {
					var pages = getCurrentPages();
					var prevPage = pages[pages.length - 2]; //上一个页面
					prevPage.$vm.backState = false;
					prevPage.$vm.tabInfo(); //重点$vm
				}
				uni.setStorage({
					key: 'searchField',
					data: this.checkedList
				})
				uni.navigateBack({
					delta: 1
				})
			},
			gethouseTypeList() {
				this.$axios.get("app/house/houseTypeListByStoreId/" + uni.getStorageSync('storeId')).then(res => {
					console.log('场地类型', res)
					this.houseTypeList = res.data.list;
					// if(this.$root.getStorage('checkedCities')){
					//     this.checkedList= this.$root.getStorage('checkedCities');
					// }
					uni.getStorage({
						key: 'searchField',
						success: (res) => {
							console.log(res.data)
							this.checkedList = res.data;
							for (var j in this.checkedList) {
								for (var i in this.houseTypeList) {
									var item = this.houseTypeList[i];
									if (item.houseTypeId == this.checkedList[j])
										this.$set(item, 'checked', true)
								}
							}

						}
					})
				}).catch(err => {
					console.log(err)
				})
			},
			checkboxAllChange: function(e) {
				console.log(e.detail.value.length)

				if (e.detail.value.length > 0) {
					for (var i in this.houseTypeList) {
						var item = this.houseTypeList[i];
						this.$set(item, 'checked', true)
					}
					this.checkedAll = true;
				} else {
					for (var i in this.houseTypeList) {
						var item = this.houseTypeList[i];
						this.$set(item, 'checked', false)
					}
					console.log(this.houseTypeList)
					this.checkedAll = false;
				}
			},
			checkboxChange: function(e) {
				this.checkedList = e.detail.value;
				var items = this.houseTypeList,
					values = e.detail.value;
				for (var i = 0, lenI = items.length; i < lenI; ++i) {
					const item = items[i]
					if (values.includes(item.houseTypeId)) {
						this.$set(item, 'checked', true)
					} else {
						this.$set(item, 'checked', false)
					}
				}
				if (e.detail.value.length == this.houseTypeList.length) {
					this.checkedAll = true;
				} else {
					this.checkedAll = false;
				}
				console.log(e.detail.value)
			},
			searchRemind(searchText) {
				this.$axios.post('app/preUserAsk/getFindAskList', {
					"searchText": searchText,
					"storeId": uni.getStorageSync('storeId')
				}).then(res => {
					console.log(res)
					this.list = res.data.list;


					for (var i in this.list) {
						var wantHouseContent = '';
						for (var j in this.list[i].wantHouse) {
							wantHouseContent += this.list[i].wantHouse[j].houseName + '、';
						}
						if (wantHouseContent.length > 0) {
							wantHouseContent = wantHouseContent.substring(0, wantHouseContent.length - 1);
						}
						this.list[i].wantHouseContent = wantHouseContent;

					}
				}).catch(err => {
					console.log(err)
				})
			},
			searchOrder(searchText) {
				this.$axios.post('app/order/findOrderList', {
					"searchText": searchText,
					"storeId": uni.getStorageSync('storeId'),
					"searchType": this.searchType
				}).then(res => {
					console.log(res)
					this.list = res.data.list;


					for (var i in this.list) {
						var paycontent = '';
						if (this.list[i].mainPayType == '03') {
							paycontent += '包场地'
							if (this.list[i].payTypes.length > 1) {
								paycontent += '('
							}
						}

						for (var j in this.list[i].payTypes) {
							if (this.list[i].payTypes[j].payTypeCode == '01') {
								paycontent += (this.list[i].payTypes[j].orderCount || 0) + '人、'
							}
							if (this.list[i].payTypes[j].payTypeCode == '02') {
								paycontent += (this.list[i].payTypes[j].orderCount || 0) + '桌、'
							}

						}

						if (paycontent.length > 0) {
							paycontent = paycontent.substring(0, paycontent.length - 1);
						}

						if (this.list[i].mainPayType == '03' && this.list[i].payTypes.length > 1) {
							paycontent += ')'
						}

						this.list[i].paycontent = paycontent.length > 0 ? ('[' + paycontent + ']') : ''
					}
				}).catch(err => {
					console.log(err)
				})
			},
			gotoRemind(id) {
				uni.navigateTo({
					url: '../remind/detail/index?id=' + id
				})
			},
			gotoOrder(id) {
				uni.navigateTo({
					url: '../book/detail/index?id=' + id
				})
			},
			gotoSettlement(id) {
				
				uni.navigateTo({
					url: '../settlement/detail/index?type=' + this.searchType + '&id=' + id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.search_top {
		height: 130rpx;
		background: #FAFBFF;

		.search_top_in {
			width: 690rpx;
			height: 84rpx;
			background: #E7E8EA;
			border-radius: 4rpx;

			.search_top_icon {
				width: 34rpx;
				height: 34rpx;
				color: #333333;
			}
		}
	}

	.search_content {
		height: calc(100vh - 214rpx - var(--status-bar-height));
		background: white;

		.search_nocontent {
			text-align: center;

			.search_nocontent_img {
				width: 448rpx;
				margin-top: 304rpx;
			}

			.search_nocontent_notext {
				color: #999999;
				font-size: 30rpx;
				margin-top: 65rpx;
			}
		}

		.search_item {
			font-size: 28rpx;
			color: #333333;
			text-align: left !important;
			width: 656rpx;
			padding: 20rpx 0;
		}

	}
</style>