wangluohuoyun-huozhuapp/pages/mine/cargoowner/selectcompany.vue

<template>
	<view class="center">
		<!-- <view class="fixed1"></view> -->
		<luo-nav-bar @leftClick='navback' :searchText='searchText' @rightClick='cancel' @input='companyInput'
			:isSearch="true" :isPlaceText='true' placeText='输入企业名称' rightText='取消' leftIcon='back'></luo-nav-bar>
		<view v-if='searching' style='padding:10px;'>
			<view style='color:#999;margin-bottom:40px;font-size:14px;' v-if='more'>#输入更多关键字精准获取企业</view>
			<view @click='checkcompany(item)' class='company' v-for='item in companyList'>
				<rich-text :nodes="item.colorcompanyName"></rich-text>
				<view class='flex items-center align-center'>
					<view class='legal_person'>法人</view>
					<view>{{item.legalPersonName1}}</view>
				</view>
			</view>
		</view>
		<view style='margin-left:20px;' v-if='!searching'>
			<view>最近搜索</view>
			<view @click='clicksearch(item)' class='historysearch' :style="{'margin-left':index==0 ? '0':'10px'}"
				v-for='(item,index) in history'>{{item.searchContent}}</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import luoNavBar from '@/components/luo-navBar/components/luo-navBar/luo-navBar.vue';
	export default {
		data() {
			return {
				more: false,
				companyList: [],
				lastTime: 0,
				history: [],
				searching: false,
				searchText: ''
			}
		},
		components: {
			luoNavBar
		},
		computed: {
			...mapState(['hasLogin', 'userInfo']),
		},
		onLoad() {
			this.$request.baseRequest('get', '/searchRecordsInfo/selectSearchRecordsInfo', {
					functionType: 1,
					commonId: this.userInfo.id
				}).then(res => {
					this.history = res.data.records
				})
				.catch(res => {
					uni.showToast({
						title: res.message,
						icon: 'none',
						duration: 2000
					})
				});
		},
		methods: {
			navback() {
				uni.navigateBack({})
			},
			cancel() {
				this.searchText = ''
				this.searching = false
				this.companyList = []
			},
			join(str, key) {
				var reg = new RegExp((`(${key})`), "gm");
				var replace = '<span style="color:#2772FB;">$1</span>';
				return str.replace(reg, replace);
			},
			clicksearch(item) {
				this.searchText = item.searchContent
				this.companyInput('', this.searchText)
				// this.s
			},
			checkcompany(item) {
				var that=this
				// console.log(item,this.userInfo)
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				this.$request.baseRequest('get', '/cargoOwnerInfo/selectCargoOwner', {
						commonId: this.userInfo.id
					}).then(res => {
						
						uni.hideLoading()
						if (res.data) {
							if(res.data.name==item.legalPersonName){
								uni.showToast({
									title: '您已经具备该公司货主身份',
									icon: 'none',
									duration: 2000
								})
							}else if(res.data.hyCargoOwnerCompInfoList){
								res.data.hyCargoOwnerCompInfoList.every(items=>{
									 console.log(items.company,item.companyName)
								})
								if(res.data.hyCargoOwnerCompInfoList.every(items=>{
									return items.company!=item.companyName
								})){

									uni.setStorageSync('currectcompany', item)
									that.goDetailPage('pages/mine/cargoowner/addEnerprise')
								}else{
									for (var i = 0; i < res.data.hyCargoOwnerCompInfoList.length; i++) {
										if(res.data.hyCargoOwnerCompInfoList[i].company==item.companyName){
											uni.showToast({
												title: '该企业已认证过,删除后才可以再次选中该企业',
												icon: 'none',
												duration: 2000
											})
										}
									}
								}
								
							}else{
								uni.setStorageSync('currectcompany', item)
								that.goDetailPage('pages/mine/cargoowner/addEnerprise')
							}
						}
					})
					.catch(res => {
						uni.hideLoading()
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 2000
						})
					});
				// if(){
					
				// }
				console.log(12331)
				
			},
			goDetailPage(src) {
				// uni.$u.route(src);
				uni.navigateBack({
					delta:1
				})
			},
			currectsearch(value) {
				var _this = this
				var arr = [],
					filterArr = []
					if(value){
						this.$request.baseRequest('post', '/searchRecordsInfo/api/addInfo', {
						functionType: 1,
						commonId: this.userInfo.id,
						searchContent: value
					}).then(res => {})
					.catch(res => {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 2000
						})
					});
					}
				
				this.$request.baseRequest('get', '/companyInfo/selectAllCompany', {
						searchKeyWord: value
					}).then(res => {
						uni.hideLoading()
						var len = 0
						console.log(res)
						if (res.data.records.length > 10) {
							_this.more = true
							len = 10
						} else {
							len = res.data.records.length
							_this.more = false
						}
						for (var i = 0; i < len; i++) {
							var len2=res.data.records[i].legalPersonName.length
							var name=''
							for (var q = 0; q < len2; q++) {
								name+='*'
							}
							res.data.records[i].legalPersonName1=name.substr(0, name.length - 1) + res.data.records[i].legalPersonName[len2-1]
							// console.log(res.data.records[i])
							res.data.records[i].colorcompanyName = res.data.records[i].companyName
							res.data.records[i].colorcompanyName = _this.join(res.data.records[i].colorcompanyName,
								value)
							arr.push(res.data.records[i])
						}
						_this.companyList = arr
						console.log(arr)
					})
					.catch(res => {
						uni.hideLoading()
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 2000
						})
					});
			},
			companyInput(e, value) {
				var _this = this
				this.searching = true
				uni.showLoading({
					title: '加载中',
					mask: true
				})
					if (this.lastTime == 0) {
						this.lastTime = setTimeout(() => {
							if(e){
								_this.currectsearch(e.detail.value)
							}else{
								_this.currectsearch(value)
							}
							
						}, 2000)
					} else {
						clearTimeout(this.lastTime)
						this.lastTime = setTimeout(() => {
							if(e){
								_this.currectsearch(e.detail.value)
							}else{
								_this.currectsearch(value)
							}
						}, 2000)
					}
				
			}
		}
	}
</script>

<style lang='scss' scoped>
	/deep/.u-navbar__content {
		/deep/>.u-nav-solt {
			width: 90%;
		}
	}
	.center{
		margin-top:30px;
	}
	.legal_person {
		color: #2772FB;
		font-size: 20rpx;
		border: 1px solid #2772FB;
		padding: 4rpx 6rpx;
		border-radius: 10rpx;
		margin: 8rpx 10rpx 8rpx 0;
	}

	.company {
		padding-bottom: 80rpx;
	}

	.historysearch {
		background: #F5F6FA;
		display: inline-block;
		padding: 10rpx 20rpx;
		margin: 15rpx 20rpx;
		border-radius: 10rpx;
	}
	.fixed1 {
		top: 0;
		height: var(--status-bar-height);
	}
</style>