<template>
	<view class="search">
		<view>
			<u-search placeholder="客户姓名/手机号/订单号/订单名称" :show-action="false" v-model="searchInput" @change="change"
				shape="round"  class="Sitem" bg-color="#e7e7e7">
			</u-search>
		</view>
		<view :style="'width:'+width+'px'">
			<view v-for="(item,index) in Slist" :key="index"
				 @click="move(item.FID)" class="Vitem">
				<rich-text :nodes="item.ProNAme"  class="Ititle"></rich-text>
				<rich-text :nodes="'订单号：'+item.FBILLNO" style="display: block;" class="Icontent"></rich-text>
				<rich-text :nodes="'业主电话：'+item.FCUSTOMERPHONE" class="Icontent1">
				</rich-text>
				<rich-text :nodes="'业主：'+item.FCUSTOMERNAME"  class="Icontent1">
				</rich-text>
				<u-line color="info"  class="line" />
			</view>
			<view class="BottomText" v-show="flag">
				<text>以上为对应搜索结果</text>
			</view>
		</view>
	</view>

</template>

<script>
	import {
		search,
		SFView
	} from "../../api/apis.js"
	export default {
		onLoad() {
			uni.$u.mpShare.title = '页面分享';
			let that = this
			let obejectT={}
			SFView("").then((res) => {	
				if (res.data.code == 0) {
					console.log(res)
					that.list=Object.values(res.data.result)
					that.list=that.list.flat(Infinity)
					// that.list = res.data.result.待报价
					console.log(that.list)
				} else {
					console.log("出现错误", res)
				}
			})
			this.width = this.$store.state.sysInfo.windowWidth
			this.height = this.$store.state.sysInfo.screenHeight
		},
		data() {
			return {
				searchInput: "",
				list: [],
				Slist: [],
				flag:false
			}
		},
		methods: {
			join(str, key) {
			      var reg = new RegExp(`(${key})`, 'gm')
			      var replace = '<span style="color:#f02d06">$1</span>'
			      return str.replace(reg, replace)
			    },
			change(e) {
				console.log(e)
				var Ritem = "/" + e + "/g"
				var count = 0
				this.Slist = []
				let item = this.list
				this.flag=false
				for (var i = 0, len = item.length; i < len; i++) {
					let choice = {
						ProNAme: "",
						FID: "",
						FCUSTOMERPHONE: "",
						FCUSTOMERNAME: "",
						FBILLNO: ""
					}
					count = 0
					choice.ProNAme = item[i].ProNAme
					choice.FID = item[i].FID
					choice.FCUSTOMERPHONE = item[i].FCUSTOMERPHONE
					choice.FCUSTOMERNAME = item[i].FCUSTOMERNAME
					choice.FBILLNO = item[i].FBILLNO
					if (choice.ProNAme) {
						if (choice.ProNAme.indexOf(e) != -1) {

							choice.ProNAme = this.join(choice.ProNAme,e)
							count += 1
						}
					}
					if (choice.FBILLNO.indexOf(e) != -1) {
						choice.FBILLNO = this.join(choice.FBILLNO,e)
						count += 1

					}

					if (choice.FCUSTOMERPHONE.indexOf(e) != -1) {
						choice.FCUSTOMERPHONE = this.join(choice.FCUSTOMERPHONE,e)
						count += 1
					}

					if (choice.FCUSTOMERNAME.indexOf(e) != -1) {
						choice.FCUSTOMERNAME = this.join(choice.FCUSTOMERNAME,e)
						count += 1
					}
					if (count > 0 && e) {
						this.Slist.push(choice)
						this.flag=true
					}
				}
			},
			move(FID){
				console.log(FID)
				let url=FID
				uni.navigateTo({
					url:'../orderDetails/orderDetails?FID='+url
				})
			}
		},
	}
</script>

<style scoped>
	.Ititle {
		font-size: 35rpx;
		color: #3F536E;
		margin-bottom: 40rpx;
		display: block;
	}

	.Icontent{
		display: block;
		font-size: 20rpx;
		margin-right: 60rpx;
	}
	.Icontent1{
		display: inline-block;
		font-size: 20rpx;
		margin-right: 60rpx;
	}
	.line{
		margin-top: 40rpx;
		margin-bottom: 40rpx;
		display: block;
	}
	.Vitem{
		display: block;
		padding-left: 20rpx;
		padding-right: 20rpx;
	}
	.Sitem{
		display: block;
		padding-left: 20rpx;
		padding-right: 20rpx;
		margin-bottom: 40rpx;
	}
	.BottomText{
		font-size: 20rpx;
		text-align: center;
		vertical-align: middle;
		margin-bottom: 20rpx;
	}
</style>