350 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			Vue
		
	
	
	
		
		
			
		
	
	
			350 lines
		
	
	
		
			10 KiB
		
	
	
	
		
			Vue
		
	
	
	
|  | <template> | ||
|  | 	<view> | ||
|  | 		<view class="top-box"> | ||
|  | 			<view class="search-box"> | ||
|  | 				<u-icon  @click="openPop()" name="search" size="36rpx" color="#999"></u-icon> | ||
|  | 				<input @confirm="searchName" confirm-type="search" class="search-input" type="text" | ||
|  | 					v-model="form.memberCode" value="" :placeholder="$t('w_0046')" /> | ||
|  | 			</view> | ||
|  | 			<view class="f26 gray9 ml20" style="flex-shrink: 0;" @click="openPop()">{{$t('MY_ORD_50')}}</view> | ||
|  | 		</view> | ||
|  | 		<view class="wallet-list"> | ||
|  | 			<view class="bonus-item" v-for="(item,index) in listData" :key="index"> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_124')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.memberCode}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('CK_KS_14')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.memberName}}</view> | ||
|  | 				</view> | ||
|  | 
 | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_164')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.parentCode}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_165')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.parentName}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_167')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.placeParentCode}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_166')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.placeParentName}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_168')}}</view> | ||
|  | 				<view class="bonus-item-content f26 gray3" v-if="item.placeDept >= 4"> | ||
|  |            			 {{ item.placeDept}}<span v-if="languages==='en-US'">th</span> {{ '' }} {{ $t("fn_011") }} | ||
|  |           		  </view> | ||
|  |           		<view class="bonus-item-content f26 gray3" v-else> | ||
|  |           			    {{ item.placeDept}}{{ $t("fn_011") }} | ||
|  |           		  </view> | ||
|  | 					<!-- <view class="bonus-item-content f26 gray3">{{$t('fn_010')}}{{item.placeDept}}{{$t('fn_011')}}</view> --> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('N_I_169')}}({{currencyIcon()}})</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{formatNum(item.regMoney)}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('PER_DA_10')}}(PV)</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{formatNum(item.regPv)}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('PER_DA_5')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.registerGradeVal}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('MY_ORD_3')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.payTime}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="bonus-item-item"> | ||
|  | 					<view class="bonus-item-name f26 gray9">{{$t('PER_DA_9')}}</view> | ||
|  | 					<view class="bonus-item-content f26 gray3">{{item.creationTime}}</view> | ||
|  | 				</view> | ||
|  | 			</view> | ||
|  | 		</view> | ||
|  | 		<view class="d-c-c p30" v-if="listData.length == 0 && !loading"> | ||
|  | 			<text class="iconfont icon-wushuju"></text> | ||
|  | 			<text class="cont">{{$t('w_0405')}}</text> | ||
|  | 		</view> | ||
|  | 		<uni-load-more v-else :loadingType="loadingType"></uni-load-more> | ||
|  | 		<!-- 筛选 --> | ||
|  | 		<u-popup :show="showPop" mode="right" @close="closePop" @open="openPop"> | ||
|  | 			<view class="pop-content rightpop"> | ||
|  | 				<view class="pop-title d-b-c"> | ||
|  | 					<view class="f28 gray3">{{$t('MY_ORD_50')}}</view> | ||
|  | 					<view class="f28 domation" @click="closePop">{{$t('N_I_241')}}</view> | ||
|  | 				</view> | ||
|  | 				<view class="right-item-title">{{ $t('MN_T_1') }}</view> | ||
|  | 				<view style="padding: 0 24rpx;"><u-search :placeholder="$t('w_0046')" :clearabled="true" :showAction="false" v-model="form.memberCode"></u-search></view> | ||
|  | 				<view class="right-item-title">{{ $t('CK_KS_14') }}</view> | ||
|  | 				<view style="padding: 0 24rpx;"><u-search :placeholder="$t('w_0060')" :clearabled="true" :showAction="false" v-model="form.memberName"></u-search></view> | ||
|  | 				<view class="right-item-title">{{$t('PER_DA_5')}}</view> | ||
|  | 				<view class="checkbox-list"> | ||
|  | 					<view v-for="(item, index) in registerType" :key="index" class="checkbox-item" | ||
|  | 						:class="{ active: item.pkId == form.pkRegisterGrade }" @click="bindregister(item)">{{item.gradeName}} | ||
|  | 					</view> | ||
|  | 				</view> | ||
|  | 				<view class="right-item-title">{{$t('w_0138')}}</view> | ||
|  | 				<view class="d-c-c"> | ||
|  | 					<picker mode="date" :value="form.startCreationTime" :start="startCreationTime" :end="endCreationTime" | ||
|  | 						@change="bindDateChange1"> | ||
|  | 						<view class="data-input">{{ form.startCreationTime || $t('CK_KS_3') }}</view> | ||
|  | 					</picker> | ||
|  | 					<view style="width: 30rpx;height: 1rpx;background-color: #333;margin: 0 24rpx;"></view> | ||
|  | 					<picker mode="date" :value="form.endCreationTime" :start="startCreationTime" :end="endCreationTime" | ||
|  | 						@change="bindDateChange2"> | ||
|  | 						<view class="data-input">{{ form.endCreationTime || $t('CK_KS_9') }}</view> | ||
|  | 					</picker> | ||
|  | 				</view> | ||
|  | 				<view class="pop-btns"> | ||
|  | 					<view class="pop-left-btn" @click="resetSubmit()">{{$t('w_0257')}}</view> | ||
|  | 					<view class="pop-right-btn" @click="searchSubmit()">{{$t('w_0035')}}</view> | ||
|  | 				</view> | ||
|  | 			</view> | ||
|  | 		</u-popup> | ||
|  | 	</view> | ||
|  | </template> | ||
|  | 
 | ||
|  | <script> | ||
|  | 	import uniLoadMore from '@/components/uni-load-more.vue'; | ||
|  | 	export default { | ||
|  | 		components: { | ||
|  | 			uniLoadMore | ||
|  | 		}, | ||
|  | 		data() { | ||
|  | 			const currentDate = this.getDate({ | ||
|  | 				format: true | ||
|  | 			}); | ||
|  | 			return { | ||
|  | 				showPop: false, | ||
|  | 				date1: '', | ||
|  | 				date2: '', | ||
|  | 				/*有没有等多*/ | ||
|  | 				no_more: false, | ||
|  | 				languages:'', | ||
|  | 				/*是否正在加载*/ | ||
|  | 				loading: true, | ||
|  | 				listData: [], | ||
|  | 				form: { | ||
|  | 					pageNum: 1, | ||
|  | 					pageSize: 10, | ||
|  | 					startCreationTime: '', | ||
|  | 					endCreationTime: '', | ||
|  | 					pkRegisterGrade: '', | ||
|  | 					memberCode:'', | ||
|  | 					memberName:'' | ||
|  | 				}, | ||
|  | 				total: 0, | ||
|  | 				registerType: [] | ||
|  | 			}; | ||
|  | 		}, | ||
|  | 		onLoad(e) { | ||
|  | 			this.getRegisterData(); | ||
|  | 			this.languages= uni.getLocale(); | ||
|  | 		}, | ||
|  | 		onShow() { | ||
|  | 			/*获取数据*/ | ||
|  | 			this.listData = []; | ||
|  | 			this.form.pageNum = 1; | ||
|  | 			this.getData(); | ||
|  | 		}, | ||
|  | 		onReachBottom() { | ||
|  | 			let self = this; | ||
|  | 			if (self.form.pageNum * self.form.pageSize < self.total) { | ||
|  | 				self.form.pageNum++; | ||
|  | 				self.getData(); | ||
|  | 			} | ||
|  | 			self.no_more = true; | ||
|  | 		}, | ||
|  | 		computed: { | ||
|  | 			/*加载中状态*/ | ||
|  | 			loadingType() { | ||
|  | 				if (this.loading) { | ||
|  | 					return 1; | ||
|  | 				} else { | ||
|  | 					if (this.listData.length != 0 && this.no_more) { | ||
|  | 						return 2; | ||
|  | 					} else { | ||
|  | 						return 0; | ||
|  | 					} | ||
|  | 				} | ||
|  | 			}, | ||
|  | 			startCreationTime() { | ||
|  | 				return this.getDate('start'); | ||
|  | 			}, | ||
|  | 			endCreationTime() { | ||
|  | 				return this.getDate('end'); | ||
|  | 			} | ||
|  | 		}, | ||
|  | 		methods: { | ||
|  | 			getRegisterData() { | ||
|  | 				let self = this; | ||
|  | 				// self.loading = true;
 | ||
|  | 				self._get( | ||
|  | 					'system/api/grade/list', {}, | ||
|  | 					function(res) { | ||
|  | 						self.registerType = res.data; | ||
|  | 					}, {}, | ||
|  | 					() => { | ||
|  | 						// self.loading = false;
 | ||
|  | 					} | ||
|  | 				); | ||
|  | 			}, | ||
|  | 			getData() { | ||
|  | 				let self = this; | ||
|  | 				self.loading = true; | ||
|  | 				var formdata = self.form; | ||
|  | 				self._get( | ||
|  | 					'member/api/market-news/reg-list', formdata, | ||
|  | 					function(res) { | ||
|  | 						self.listData = [...self.listData, ...res.rows]; | ||
|  | 						self.total = res.total; | ||
|  | 						if (self.total < (self.form.pageNum * self.form.pageSize)) { | ||
|  | 							self.no_more = true; | ||
|  | 						} | ||
|  | 					}, {}, | ||
|  | 					() => { | ||
|  | 						self.loading = false; | ||
|  | 					} | ||
|  | 				); | ||
|  | 			}, | ||
|  | 			closePop() { | ||
|  | 				this.showPop = false; | ||
|  | 			}, | ||
|  | 			openPop() { | ||
|  | 				this.showPop = true; | ||
|  | 			}, | ||
|  | 			getDate(type) { | ||
|  | 				const date = new Date(); | ||
|  | 				let year = date.getFullYear(); | ||
|  | 				let month = date.getMonth() + 1; | ||
|  | 				let day = date.getDate(); | ||
|  | 
 | ||
|  | 				if (type === 'start') { | ||
|  | 					year = year - 60; | ||
|  | 				} else if (type === 'end') { | ||
|  | 					year = year + 2; | ||
|  | 				} | ||
|  | 				month = month > 9 ? month : '0' + month; | ||
|  | 				day = day > 9 ? day : '0' + day; | ||
|  | 				return `${year}-${month}-${day}`; | ||
|  | 			}, | ||
|  | 			bindDateChange1: function(e) { | ||
|  | 				this.form.startCreationTime = e.detail.value; | ||
|  | 			}, | ||
|  | 			bindDateChange2: function(e) { | ||
|  | 				this.form.endCreationTime = e.detail.value; | ||
|  | 			}, | ||
|  | 			bindregister: function(e) { | ||
|  | 				this.form.pkRegisterGrade = e.pkId; | ||
|  | 				// console.log(e);
 | ||
|  | 			}, | ||
|  | 			resetSubmit: function() { | ||
|  | 				this.form.pkRegisterGrade = ""; | ||
|  | 				this.form.startCreationTime = ""; | ||
|  | 				this.form.endCreationTime = ""; | ||
|  | 				this.form.memberCode = ""; | ||
|  | 				this.form.memberName = ""; | ||
|  | 			}, | ||
|  | 			searchSubmit: function() { | ||
|  | 				this.showPop = false; | ||
|  | 				/*获取数据*/ | ||
|  | 				this.listData = []; | ||
|  | 				this.form.pageNum = 1; | ||
|  | 				this.getData(); | ||
|  | 			}, | ||
|  | 			searchName: function() { | ||
|  | 				/*获取数据*/ | ||
|  | 				this.listData = []; | ||
|  | 				this.form.pageNum = 1; | ||
|  | 				this.getData(); | ||
|  | 			} | ||
|  | 		} | ||
|  | 	}; | ||
|  | </script> | ||
|  | 
 | ||
|  | <style lang="scss"> | ||
|  | 	.top-box { | ||
|  | 		width: 750rpx; | ||
|  | 		padding: 0 30rpx 0 23rpx; | ||
|  | 		box-sizing: border-box; | ||
|  | 		height: 102rpx; | ||
|  | 		background: #ffffff; | ||
|  | 		display: flex; | ||
|  | 		justify-content: center; | ||
|  | 		align-items: center; | ||
|  | 		border-bottom: 1rpx solid #eee; | ||
|  | 		margin-bottom: 24rpx; | ||
|  | 	} | ||
|  | 
 | ||
|  | 	.search-box { | ||
|  | 		flex: 1; | ||
|  | 		height: 65rpx; | ||
|  | 		background: #f5f6f8; | ||
|  | 		border-radius: 33rpx; | ||
|  | 		padding: 0 52rpx; | ||
|  | 		box-sizing: border-box; | ||
|  | 		display: flex; | ||
|  | 		justify-content: center; | ||
|  | 		align-items: center; | ||
|  | 
 | ||
|  | 		.search-input { | ||
|  | 			font-size: 26rpx; | ||
|  | 			color: #333; | ||
|  | 			margin-left: 14rpx; | ||
|  | 			flex: 1; | ||
|  | 		} | ||
|  | 	} | ||
|  | 
 | ||
|  | 	.bonus-item { | ||
|  | 		padding: 20rpx 25rpx 20rpx 23rpx; | ||
|  | 		background-color: #fff; | ||
|  | 		margin-bottom: 20rpx; | ||
|  | 
 | ||
|  | 		.bonus-bottom { | ||
|  | 			height: 104rpx; | ||
|  | 
 | ||
|  | 			.order-btn { | ||
|  | 				box-sizing: border-box; | ||
|  | 				padding: 0 26rpx; | ||
|  | 				min-width: 146rpx; | ||
|  | 				height: 52rpx; | ||
|  | 				line-height: 52rpx; | ||
|  | 				text-align: center; | ||
|  | 				border-radius: 26rpx; | ||
|  | 				font-size: 24rpx; | ||
|  | 				color: #fff; | ||
|  | 				border: 1rpx solid #eee; | ||
|  | 				margin-left: 18rpx; | ||
|  | 				background: #fb3024; | ||
|  | 				border: 1rpx solid #fb3024; | ||
|  | 				flex-shrink: 0; | ||
|  | 				display: flex; | ||
|  | 				justify-content: center; | ||
|  | 				align-items: center; | ||
|  | 			} | ||
|  | 		} | ||
|  | 	} | ||
|  | 
 | ||
|  | 	.bonus-item-item { | ||
|  | 		display: flex; | ||
|  | 		justify-content: space-between; | ||
|  | 		align-items: center; | ||
|  | 		margin-bottom: 30rpx; | ||
|  | 	} | ||
|  | 
 | ||
|  | 	.bonus-item-name { | ||
|  | 		width: 30%; | ||
|  | 		flex-shrink: 0; | ||
|  | 	} | ||
|  | 
 | ||
|  | 	.bonus-item-content { | ||
|  | 		width: 70%; | ||
|  | 		flex-shrink: 0; | ||
|  | 	} | ||
|  | </style> |