apply-assistant-v3/components/list/job copy.vue

<template>
	<view class="g-components-list-job">
		<g-loading paddingBottom="g_pb_120" v-if="loading && speed == -1" />

		<view v-if="!loading && speed == 0" style="width: calc(100% - 20px); margin: 0 auto" class="g_h_all g_flex_column_center">
			<view>
				<g-panel-fond v-if="showShare && isHaveOrder" :showRemark="false" @clickCard="goPage" />
				<view class="g_h_60" style="width: 100%"></view>
			</view>
			<g-empty :text="emptyText" :subText="emptySubText" />
			<view class="g_mt_32" v-if="isShowLoginBtn">
				<g-button btnText="去登录" size="small" @clickBtn="goLogin" />
			</view>
		</view>
		<view v-if="speed > 0" class="link g_pl_10 g_pr_10">
			<view>
				<view v-for="(item, index) in jobArray" v-if="(from == 'record' && item.recruitmentImage == 1) || from != 'record'" :key="index" class="g_bg_f g_radius_8 g_mb_10 sitem" hover-class="g_bg_e" @click="handleCard(item)" style="box-shadow: 0px 2px 9px 0px #eeeeee; position: relative">
					<view class="g_pt_16 g_pb_16 g_pl_16 g_pr_16" @click="handleTop(item)">
						<topPanel :item="item" :from="from" :recordStatus="recordStatus" :isSelf="isSelf" />
						<view v-if="from == 'bill'" class="g_mt_6 g_flex_row_between">
							<view class="g_fs_14 g_flex_1 g_ell_1" style="color: rgba(0, 0, 0, 0.45)">
								<text class="g_c_f0">{{ item.applyNum }}</text
								>人已报名 &nbsp; <text class="g_c_f0 g_ml_8">-</text>人在职
							</view>
							<view class="g_fs_12 g_flex_none g_flex_column_center" style="color: rgba(0, 0, 0, 0.45)">
								{{ item.time }}
							</view>
						</view>
					</view>
					<infoPanel v-if="from == 'default' || from == 'user' || from == 'home' || from == 'record'" :recordStatus="recordStatus" :item="item" :from="from" @clickBottom="handleBotom" @clickMore="handleOpenStatus(item)" />
					<view class="g_flex_row_between g_p_10 g_border_e_t" style="padding-left: 16px; padding-right: 16px" hover-stop-propagation v-if="false && from == 'bill'">
						<view class="left g_flex_none g_flex_column_center">
							<u-switch v-model="item.recruitmentSwitch" activeColor="#00B666" inactiveColor="#e5e5e5" @change="(e) => handleSwitch(e, item, index)" :text="item.recruitmentSwitch ? '在招' : '停招'"></u-switch>
						</view>
						<view class="right g_flex_1 g_flex_column_center" @click="handleMore(item)">
							<!-- <view class="g_flex_row_end">
								<view class="g_flex_c g_w_39 g_h_24 g_radius_4 g_bg_f_5 g_c_9">
									<i class="iconfont icon-gengduo2" style="transform: rotate(90deg)"></i>
								</view>
							</view> -->
							<view class="g_flex_row_end g_h_all">
								<view class="g_flex_column_center"></view>
								<view class="g_flex_column_center g_pl_10 g_h_all">
									<i class="iconfont icon-gengduo2 icon g_c_b1" style="font-size: 24rpx"></i>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view>
				<view v-if="from == 'user'">
					<g-panel-hr :str="isSelf ? speed + '个职位' : '未关注用户仅展示预览职位'" />
				</view>
				<view v-else>
					<g-panel-hr :str="query.isFinish >= 0 && query.isFinish < query.size ? speed + '个职位' : '加载中'" />
				</view>
			</view>
			<view class="g_h_17" v-if="!emptyText && !emptySubText"></view>
			<!-- #ifdef H5 -->
			<view style="height: 50px"></view>
			<!-- #endif -->
		</view>
		<u-popup v-model="showSharePop" mode="bottom" uZindex="9999" border-radius="12" @close="watchClose" :mask-close-able="true" width="694rpx">
			<view class="g_fs_18 g_text_c g_bg_f_5">
				<view class="g_bg_f">
					<view class="g_h_56 g_flex_column_center g_border_e_b" v-for="(item, index) in statusList" :key="index" @click="handlerJob(item)">
						<view class="g_h_56 g_fs_18 g_c_3 g_flex_c">{{ item }}</view>
					</view>
				</view>
				<view class="g_h_64 g_mt_8 g_text_c g_pt_16 g_bg_f" @click="hideDrawer"> 取消 </view>
			</view>
		</u-popup>
	</view>
</template>

<script>
/* 职位列表
 * @params list 数组
 * @params loading
 * @params speed 加载进度
 * @params query 参数
 * @params showShare 是否展示分享面板（寻找发单号）
 * @params from 来源
 * @function clickCard 整个卡片的点击事件
 * @function clickTop 卡片上半部分的点击事件
 * @function clickBottom 卡片底部信息的点击事件
 * @function clickSwitch 开停招
 * @function clickMore 点击三个点
 * @function clickBtn 按钮点击事件
 */
import topPanel from "./jobChild/top.vue";
import infoPanel from "./jobChild/info.vue";
export default {
	components: {
		topPanel,
		infoPanel,
	},
	data() {
		return {
			cdnBaseImg: this.G.store().cdnBaseImg,
			statusList: [],
			editJobList: ["复制内容", "编辑", "删除"],
			showSharePop: false,
			currentJob: {},

			jobArray: [],
			loginId: "",
		};
	},
	props: {
		list: {
			type: Array,
			default: () => {
				return [];
			},
		},
		isSelf: {
			type: Boolean,
			default: () => {
				return false;
			},
		},
		loading: {
			type: Boolean,
			default: () => {
				return true;
			},
		},
		speed: {
			type: Number,
			default: () => {
				return -1;
			},
		},
		query: {
			type: Object,
			default: () => {
				return {
					page: 1,
					size: 10,
					list: [],
					isFinish: -1,
				};
			},
		},
		showShare: {
			type: Boolean,
			default: () => {
				return true;
			},
		},
		from: {
			type: String,
			default: () => {
				return "default";
			},
		},
		emptyText: {
			type: String,
			default: () => {
				return "嘿，这里还没有数据呢";
			},
		},
		emptySubText: {
			type: String,
			default: () => {
				return "关注发单号，我们会第一时间通知您新的动态";
			},
		},
		isHaveOrder: {
			default: () => {
				return false;
			},
		},
		active: {
			default: () => {
				return 0;
			},
		},
		recordStatus: {
			default: () => {
				return 1;
			},
		},
		bg: {
			default: () => {
				return "#ededed";
			},
		},
		isShowLoginBtn: {
			default: () => {
				return false;
			},
		},
	},
	watch: {
		list(val) {
			this.jobArray = val;
			this.$forceUpdate();
		},
		showSharePop(val) {
			if (val == false) {
				this.currentJob = {};
				setTimeout(() => {
					uni.showTabBar();
				}, 200);
			}
		},
	},
	created() {
		let that = this;
		this.jobArray = this.list;
	},
	methods: {
		handleCard($item) {
			this.$emit("clickCard", $item);
		},
		handleTop($item) {
			let that = this;
			this.G.isLogin();
			if (this.G.isLogin()) {
				if (that.from == "record") {
					uni.$emit("changeJobInfo", { info: $item });
					uni.navigateBack({
						delta: 1,
					});
					return;
				}
				if (that.recordStatus == 1 || that.recordStatus == 2 || that.isSelf) {
					uni.navigateTo({
						url: "/root/detail/job?id=" + $item.leafCateId + "&from=" + that.from,
					});
				} else {
					uni.showToast({
						title: "关注发单号后才可查看详情",
						icon: "none",
					});
				}
			}
		},
		handleBotom($item) {
			let that = this;
			this.G.isLogin();
			this.loginId = uni.getStorageSync("apply-userinfo").agencyId;
			if (this.loginId == $item.agencyId) {
				return;
			}
			if (this.G.isLogin()) {
				if (that.recordStatus == 1 || that.recordStatus == 2) {
					let params = {
						id: $item.agencyId,
						type: that.active + 1,
						bindid: $item.id,
						isShowMore: true,
						isShowJob: true,
					};
					uni.navigateTo({
						url: "/root/detail/user?" + that.G.objToStr(params),
					});
				} else {
					uni.showToast({
						title: "关注发单号后才可查看详情",
						icon: "none",
					});
				}
			}
		},
		handleOpenStatus(info) {
			let that = this;
			that.currentJob = info;
			let popList = [];
			if (info.tip == 0) {
				popList = that.setList(info);
			} else if (info.tip == 1) {
				popList = that.setList(info);
			} else if (info.tip == 2) {
				if (info.collect == 0) {
					// 未
					popList = ["复制内容", "收藏该职位"];
				} else if (info.collect == 1) {
					//
					popList = ["复制内容", "取消收藏"];
				}
			} else if (info.tip == 3) {
				popList = that.setList(info);
			} else {
				popList = that.setList(info);
			}
			that.statusList = popList;
			uni.showActionSheet({
				itemList: popList,
				success: function (res) {
					that.handlerJob(popList[res.tapIndex]);
				},
				fail: function (res) {},
			});
		},
		setList(info) {
			let that = this,
				popList = [];
			// popList = ["复制内容",  "转发到我的发单号", "转发到我的招工小程序", "忽略该职位", "收藏该职位"];
			if (info.collect == 0 && info.ignore == 0) {
				// 未
				popList = ["复制内容", "忽略该职位", "收藏该职位"];
			} else if (info.collect == 0 && info.ignore == 1) {
				// 未
				popList = ["复制内容", "取消忽略", "收藏该职位"];
			} else if (info.collect == 1 && info.ignore == 0) {
				// 未
				popList = ["复制内容", "忽略该职位", "取消收藏"];
			} else if (info.collect == 1 && info.ignore == 1) {
				// 未
				popList = ["复制内容", "取消忽略", "取消收藏"];
			}
			return popList;
		},
		watchClose(e) {},
		handlerJob(e) {
			let that = this;
			switch (e) {
				case "复制内容":
					that.getJobDetail("shareInfo");
					break;
				case "分享给老乡":
					console.log("that.currentJob", that.currentJob);
					that.getJobDetail("shareInfo");
					break;
				case "转发到我的发单号":
					break;
				case "转发到我的招工小程序":
					that.G.handleConfirm({
						content: "招工小程序正在建设中",
						showCancel: false,
						confirmText: "知道了",
						success: (res) => {
							if (res.confirm) {
							}
						},
					});
					break;
				case "忽略该职位":
					that.G.handleConfirm({
						content: "忽略该职位，将不在关注里显示",
						success: (res) => {
							if (res.confirm) {
								that.handleToggleJob("已忽略");
							}
						},
					});
					break;
				case "取消忽略":
					that.G.handleConfirm({
						content: "是否取消忽略",
						success: (res) => {
							if (res.confirm) {
								that.handleToggleJob("已显示");
							}
						},
					});
					break;
				case "收藏该职位":
					that.handleCollectionJob("收藏成功");
					break;
				case "取消收藏":
					that.handleCollectionJob("取消收藏");
					break;
				default:
					break;
			}
		},
		handleToggleJob($tip) {
			let that = this;
			that.G.Get(
				that.api.job_updateStatus + "/" + that.currentJob.leafCateId,
				{
					classify: 1,
				},
				(res) => {
					uni.showToast({
						title: $tip,
						icon: "success",
					});
					that.$emit("uploadList");
				}
			);
		},
		handleCollectionJob($tip) {
			let that = this;
			that.G.Get(
				that.api.job_updateStatus + "/" + that.currentJob.leafCateId,
				{
					classify: 0,
				},
				(res) => {
					uni.showToast({
						title: $tip,
						icon: "success",
					});
					that.$emit("uploadList");
				}
			);
		},
		/**
		 * 获取职位描述并复制
		 */
		getJobDetail(type) {
			let that = this;
			that.G.Get(that.api.job_getDetailInList + "/" + that.currentJob.leafCateId, "", (res) => {
				if (!res) {
					uni.showToast({
						title: "该职位无内容",
						icon: "none",
					});
				} else {
					if (type == "shareInfo") {
						let info = that.currentJob.title + "\n" + that.currentJob.address + "\n" + that.currentJob.price + "\n" + res;

						if (info.indexOf("————————" > -1)) {
							info = info.replace(/\*\*\*\*\*/g, "").split("————————")[0];
						} else {
							info = info.replace(/\*\*\*\*\*/g, "");
						}
						uni.setClipboardData({
							data: info,
							success(res) {
								uni.showToast({
									title: "内容已复制",
									icon: "none",
									duration: 1500,
								});
							},
							fail(err) {},
						});
					} else {
						uni.setClipboardData({
							data: res.replace(/\*\*\*\*\*/g, ""),
							success(res) {
								uni.showToast({
									title: "内容已复制",
									icon: "none",
									duration: 1500,
								});
							},
							fail(err) {},
						});
					}
				}
				that.showSharePop = false;
			});
		},
		hideDrawer() {
			let that = this;
			that.showSharePop = false;
		},
		/**
		 * 删除职位
		 */
		delJob() {
			let that = this;
			that.G.handleConfirm(
				"是否确定删除该职位",
				() => {
					that.G.Get(
						that.api.job_delJob + "/" + that.currentJob.leafCateId,
						"",
						(res) => {
							uni.showToast({
								title: "删除成功",
								icon: "success",
							});
							that.$emit("uploadDetail");
							that.$emit("uploadList");
						},
						(err) => {}
					);
				},
				() => {}
			);
		},
		goPage() {
			this.G.isLogin();
			if (this.G.isLogin()) {
				uni.navigateTo({
					url: "/root/bind/search?active=0",
				});
			}
		},
		// 开停招
		handleSwitch(e, $item, $index) {
			let that = this;
			if (e) {
				that.list.filter((item, index) => {
					return index == $index;
				})[0].recruitmentImage = 1;
			} else {
				that.list.filter((item, index) => {
					return index == $index;
				})[0].recruitmentImage = 2;
			}
			that.G.Get(
				that.api.job_setStatus + "/" + $item.jobId,
				{
					id: $item.jobId,
					recruitment: e ? 1 : 2,
				},

				() => {
					uni.showToast({
						icon: "success",
						title: e ? "在招中" : "已停招",
					});
					// that.$emit("uploadList");
					that.$emit("uploadDetail");
				}
			);
		},
		// 点击三个点
		handleMore(e) {
			let that = this;
			this.currentJob = e;
			uni.showActionSheet({
				itemList: that.editJobList,
				success: function (res) {
					if (res.tapIndex == 1) {
						uni.navigateTo({
							url: "/root/home/jobForm?id=" + e.jobId,
						});
					} else if (res.tapIndex == 0) {
						that.getJobDetail();
					} else if (res.tapIndex == 2) {
						that.delJob();
					}
				},
				fail: function (res) {},
			});
			// uni.navigateTo({
			// 	url: '/root/home/jobForm?id=' + e.jobId,
			// })
			// this.$emit('clickMore',e)
		},
		// 点击按钮
		handleBtn(e) {
			this.$emit("clickBtn", e);
		},
		goLogin() {
			uni.reLaunch({
				url: "/root/person/loginIndex",
			});
		},
	},
};
</script>

<style lang="scss">
.g-components-list-job {
	height: 100%;
}
.u-switch-text .u-switch {
	border: 0;
}
</style>