dandelionPlatformToB-uni-v3/root/merchantManagement/watchedMe.vue

<template>
	<div class="g_bg_page">
		<scroll-view :style="{ height: `calc(100vh )` }" @scrolltolower="reachBottomUserList" :scroll-y="true">
			<view class="g_m_10 g_bg_f g_radius_8">
				<view class="g_p_12 g_border_e_b" v-for="(item, index) in queryWithUserList.list" :key="index" @click="watchDetail(item)">
					<view class="g_flex_row_between g_fs_16 g_mb_4">
						<view>
							{{ item.userName || "-" }}
						</view>
						<view @click.stop="takeTel(item.tel)">
							{{ item.tel || "-" }}
						</view>
					</view>
					<view class="g_fs_14 g_c_6">
						最后访问时间:
						{{ item.lastViewTime || "-" }}
					</view>
				</view>
			</view>
			<view class="g_text_c">
				<view v-if="queryWithUserList.list.length > 0 && queryWithUserList.list.length < queryWithUserList.total && loading">
					<u-loading></u-loading>
					<view>加载中...</view>
				</view>
				<view v-else-if="queryWithUserList.list.length > 0 && queryWithUserList.list.length < queryWithUserList.total">上划加载更多</view>
				<view v-else-if="queryWithUserList.list.length == queryWithUserList.total && !loading">数据加载完了</view>
			</view>

			<view class="g_h_64"> </view>
		</scroll-view>
		<u-popup v-model="showPop" mode="bottom" :closeable="true" uZindex="9999" border-radius="12" @close="showPop = false" :mask-close-able="true" height="80vh">
			<scroll-view :style="{ height: `80vh` }" @scrolltolower="reachBottomJobList" :scroll-y="true">
				<view>
					<view class="g_text_c g_fs_18 g_fw_600 g_p_12 g_bg_f sticky">职位查看记录-{{ currentUser.userName + "（" + currentUser.tel + "）" }}</view>
					<view>
						<view class="g_p_12 g_border_e_b" v-for="(item, index) in queryWithUserJobList.list" :key="index" @click="goDetail(item)">
							<view class="g_flex_row_between g_fs_16 g_mb_4">
								<view class="g_ell_1" style="max-width: 60%">
									{{ item.jobName }}
								</view>
								<view class="g_fs_14 g_c_6">
									{{ item.viewTimeStr }}
								</view>
							</view>
							<view class="g_flex_row_between">
								<view class="g_c_f40 g_fs_16">{{ item.cus_price }} </view>
								<view class="g_fs_14">
									{{ item.gender + item.age }}
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="g_text_c g_pb_20 g_pt_12" v-if="queryWithUserJobList.list.length > 0 && queryWithUserJobList.list.length < queryWithUserJobList.total && loading">
					<u-loading></u-loading>
					<view>加载中...</view>
				</view>
				<view v-if="queryWithUserJobList.list.length == 0" style="padding-top: 120px">
					<rh-empty text="暂无更多"></rh-empty>
				</view>
				<view class="g_h_32"> </view>
			</scroll-view>
		</u-popup>
	</div>
</template>

<script>
export default {
	// 局部注册的组件
	components: {},
	// 组件参数 接收来自父组件的数据
	props: {},
	// 组件状态值
	data() {
		return {
			loading: true,
			queryWithUserList: {
				page: 1,
				size: 50,
				total: "",
				list: [],
			},
			queryWithUserJobList: {
				page: 1,
				size: 50,
				total: "",
				list: [],
			},
			currentUser: {},
			showPop: false,
		};
	},
	onLoad() {
		this.getViewJobUserPageForZgb();
	},
	// 组件方法
	methods: {
		takeTel(e) {
			console.log(e);
			if (e) {
				uni.makePhoneCall({
					phoneNumber: e,
				});
			}
		},
		reachBottomUserList() {
			if (this.queryWithUserList.list.length < this.queryWithUserList.total) {
				this.queryWithUserList.page++;
				this.getViewJobUserPageForZgb("concat");
			}
		},
		reachBottomJobList() {
			if (this.queryWithUserJobList.list.length < this.queryWithUserJobList.total) {
				this.queryWithUserJobList.page++;
				this.getDetail("concat");
			}
		},
		getViewJobUserPageForZgb(type) {
			let that = this;
			let params = {
				pageNum: that.queryWithUserList.page,
				pageSize: that.queryWithUserList.size,
			};
			that.loading = true;
			that.G.Post(that.api.user_getViewJobUserPageForZgb, params, (res) => {
				that.queryWithUserList.total = res.recordCount;

				if (type == "concat") {
					that.queryWithUserList.list = res.recordList.length > 0 ? that.queryWithUserList.list.concat(res.recordList) : that.queryWithUserList.list;
				} else {
					that.queryWithUserList.list = res.recordList;
				}
				console.log("that.queryWithUserList.list", that.queryWithUserList.list);
				console.log("res", res);
				that.loading = false;
			});
		},
		watchDetail(_item) {
			let that = this;
			that.currentUser = _item;
			that.getDetail();
		},
		getDetail(type) {
			let that = this;
			let params = {
				pageNum: that.queryWithUserJobList.page,
				pageSize: that.queryWithUserJobList.size,
				userId: that.currentUser.userId,
			};
			that.loading = true;
			that.G.Post(that.api.user_getUserViewJobPageForZgb, params, (res) => {
				console.log("res", res);
				that.queryWithUserJobList.total = res.recordCount;

				res.recordList = that.G.disposeJobListData(res.recordList);
				// res.recordList = that.G.toGetAge(res.recordList);
				res.recordList.forEach((item) => {
					item.cus_price = item.salaryClassify != 7 ? that.G.getSalaryClassifyValue(item.salaryClassify, item.salaryClassifyValue) : "月薪";
					item.viewTimeStr = that.G.getPointTime(item.viewTime, "YY--MM--DD HH:MM");
				});

				if (type == "concat") {
					that.queryWithUserJobList.list = res.recordList.length > 0 ? that.queryWithUserJobList.list.concat(res.recordList) : that.queryWithUserJobList.list;
				} else {
					that.queryWithUserJobList.list = res.recordList;
				}
				console.log("res.recordList", res.recordList);
				this.showPop = true;
				that.loading = false;
			});
		},
		goDetail($item) {
			console.log("前往详情页", $item);
			uni.navigateTo({
				url: "/root/detail/job?id=" + $item.id,
			});
		},
	},
};
</script>

<style scoped lang="less">
.sticky {
	position: sticky;
	top: 0px;
	left: 0;
	z-index: 99;
}
</style>