apply-assistant-v3/root/components/applyFlow.vue

<template>
	<div class="">
		<!-- 关注并创建团队确认框 -->
		<u-modal v-model="submitConfirm" width="90%" negativeTop="150" confirmText="发布职位" :showTitle="false" :confirmStyle="{ color: '#576b95', 'font-weight': 600 }" :cancelStyle="{ color: '#000', 'font-weight': 600 }" :showConfirmButton="false">
			<div class="g_fs_17 g_text_c">
				<div class style="padding: 42px 24px 36px">
					<div class="g_text_c g_fw_600 g_c_0">创建公司账号</div>
					<div class="g_text_l g_c_6 g_mb_8 g_mt_24 g_pl_12">您的公司简称：</div>
					<div class="g_fs_14 g_pl_12 g_bg_f2 g_border_d g_radius_4 g_flex_row_start flex_center">
						<u-input v-model="agencyInfo.fullName" :customStyle="{ color: disabled ? '#999' : '#333', fontSize: '17px' }" :disabled="disabled" height="96" placeholder="如：上海发财劳务"></u-input>
					</div>
					<div class="g_text_l g_c_9 g_mt_8 g_fs_14 g_pl_12">报名助手需以公司身份使用，创建公司后可关注发单号，浏览职位及工单报名。</div>
				</div>
				<div class="g_flex_row_center flex_center g_fw_600 g_border_e_t">
					<div class="g_flex_1 g_h_50 g_text_c g_c_0 g_border_e_r" hover-class="thover" @click="submitConfirm = false" style="line-height: 50px">取消</div>
					<div class="g_flex_1 g_h_50 g_text_c g_c_sub" hover-class="thover" @click="finallySubmit" style="line-height: 50px">确定</div>
				</div>
			</div>
		</u-modal>
		<!-- 非代理分流弹窗 -->
		<u-modal v-model="confirmWithoutAgency" width="90%" negativeTop="150" :showTitle="false" :confirmStyle="{ color: '#576b95', 'font-weight': 600 }" :maskCloseAble="true" :cancelStyle="{ color: '#000', 'font-weight': 600 }" :showConfirmButton="false">
			<div class="g_fs_17">
				<div class style="padding: 24px 24px">
					<div class="g_text_c g_fw_600 g_c_0 g_position_rela">
						报名助手温馨提示
						<div class="g_position_abso" style="right: -4px; top: -10px; font-size: 12px; width: 32px; height: 32px" @click="confirmWithoutAgency = false">
							<i class="iconfont icon-guanbi"></i>
						</div>
					</div>
					<div class="g_c_9 g_mt_16 g_fs_16">报名助手需以企业身份使用，请确认本人所在公司是否已创建团队</div>
					<div class="g_mt_16 g_fs_14 g_flex_row_between g_p_16 g_bg_f_5 g_radius_8">
						<div class="g_flex_row_start flex_center"><i class="iconfont icon-sousuo1 g_mr_8" style="color: #307bf6"></i>已有团队？</div>
						<div
							class=""
							style="color: #307bf6"
							@click="
								() => {
									joinTeamConfirm = true;
									confirmWithoutAgency = false;
								}
							"
						>
							直接搜索加入
						</div>
					</div>
					<div class="g_mt_16 g_fs_14 g_flex_row_between g_p_16 g_bg_f_5 g_radius_8">
						<div class="g_flex_row_start flex_center"><i class="iconfont icon-tianjia g_mr_8" style="color: #0bb87e"></i>还没团队？</div>
						<div
							class=""
							style="color: #0bb87e"
							@click="
								() => {
									submitConfirm = true;
									confirmWithoutAgency = false;
								}
							"
						>
							立即创建团队
						</div>
					</div>
					<!-- <div class="g_mt_24">
						<g-button btnText="稍后再说" size="auto" class @clickBtn="confirmWithoutAgency = false"></g-button>
					</div> -->
				</div>
			</div>
		</u-modal>
		<!-- 加入别人团队确认框 -->
		<u-modal v-model="joinTeamConfirm" width="90%" negativeTop="150" :showTitle="false" :confirmStyle="{ color: '#576b95', 'font-weight': 600 }" :cancelStyle="{ color: '#000', 'font-weight': 600 }" :showConfirmButton="false">
			<div class="g_fs_17 g_text_c">
				<div class style="padding: 42px 24px 36px">
					<div class="g_text_c g_fw_600 g_c_0 g_pb_20">加入团队/企业</div>
					<div class="g_text_l g_c_6 g_mb_8 g_pl_12">团队创建人手机号</div>
					<div class="g_flex_row_center">
						<div class="g_flex_1 g_bg_f_5 g_radius_6 g_pl_12 g_pr_12">
							<u-input v-model="teamInfo.tel" type="number" backgroundColor="#ededed" height="80" placeholder="搜索创建人手机号"></u-input>
						</div>
						<div class="g_w_90 g_ml_16">
							<g-button btnText="搜索" size="auto" type="primary" class @clickBtn="searchTeamByTel"></g-button>
						</div>
					</div>
					<div class="g_text_l g_mt_8 g_fs_14" v-if="chooseTeam.fullName">当前选择团队: {{ chooseTeam.fullName || chooseTeam.agencyName }}</div>
					<div class="">
						<div class="g_text_l g_c_6 g_mb_8 g_mt_12 g_pl_12">昵称</div>
						<div class="g_bg_f_5 g_radius_6 g_pl_12 g_pr_12">
							<u-input v-model="teamInfo.userName" backgroundColor="#ededed" height="80" placeholder="请输入您的昵称"></u-input>
						</div>
					</div>
				</div>
				<div class="g_flex_row_center flex_center g_fw_600 g_border_e_t">
					<div class="g_flex_1 g_h_50 g_text_c g_c_0 g_border_e_r" hover-class="thover" @click="joinTeamConfirm = false" style="line-height: 50px">取消</div>
					<div class="g_flex_1 g_h_50 g_text_c g_c_sub" hover-class="thover" @click="joinTeam" style="line-height: 50px">确定</div>
				</div>
			</div>
		</u-modal>
		<u-popup v-model="joinTeamDrawerShow" mode="bottom" z-index="999999" border-radius="12" :closeable="false" :mask-close-able="true" @close="joinTeamDrawerShow = false">
			<view class="g_text_c g_bg_f_5 g_fs_17">
				<view class="g_bg_f">
					<view class="g_c_3">
						<view v-for="item in teamList" class="g_p_16 g_border_e_t" @click="clickTeam(item)">{{ item.fullName || item.agencyName }}</view>
					</view>
				</view>
				<view class="g_p_16 g_mt_10 g_bg_f" style="padding-bottom: calc(constant(safe-area-inset-bottom) + 16px); padding-bottom: calc(env(safe-area-inset-bottom) + 16px)" @click="joinTeamDrawerShow = false">取消</view>
			</view>
		</u-popup>
	</div>
</template>

<script>
export default {
	// 组件名称
	name: "",
	// 局部注册的组件
	components: {},
	// 组件参数 接收来自父组件的数据
	props: {
    // 用户信息
		userInfo: {
			type: Object,
			default: () => {
				return {};
			},
		},
    // 用户的代理信息
		agencyInfo: {
			type: Object,
			default: () => {
				return {};
			},
		},
    // 被邀请方的代理信息
		shareAgencyId: {
			type: String,
			default: "",
		},
    // 是否需要跳转申请成功页
		navNewPage: {
			type: Boolean,
			default: true,
		},
	},
	// 组件状态值
	data() {
		return {
			joinTeamDrawerShow: false,
			joinTeamConfirm: false,
			confirmWithoutAgency: false,

			submitConfirm: false,
			btnLoading: false,
			teamList: [],
			teamInfo: {
				tel: "",
				userName: "",
			},
			chooseTeam: {},
		};
	},
	// 计算属性
	computed: {},
	// 侦听器
	watch: {
		joinTeamConfirm(newVal) {
			if (newVal) {
				this.teamInfo = {};
				this.chooseTeam = {};
			}
		},
		submitConfirm(newVal) {
			if (newVal) {
				this.agencyInfo.fullName = "";
			}
		},
	},
	created() {
		console.log("alsdfjlasdjfl;askdfjo");
	},
	mounted() {},
	// 组件方法
	methods: {
		searchTeamByTel() {
			let that = this;
			if (!that.teamInfo.tel || !that.G.setReg(that.teamInfo.tel, "tel")) {
				uni.showToast({
					title: "请输入正确的手机号",
					icon: "none",
				});
				return;
			}
			uni.hideKeyboard();
			that.G.Get(that.api.bind_getAgencyByAdminTel, { tel: that.teamInfo.tel }, (res) => {
				that.teamList = res;
				that.joinTeamDrawerShow = true;
				console.log(res);
			});
		},
		clickTeam(_item) {
			let that = this;
			that.chooseTeam = _item;
			that.joinTeamDrawerShow = false;
		},
		joinTeam() {
			let that = this;
			console.log("that.chooseTeam", that.chooseTeam);
			if (!that.chooseTeam.agencyId) {
				uni.showToast({
					title: "请选择一个团队",
					icon: "none",
				});
				return;
			}
			if (!that.teamInfo.userName) {
				uni.showToast({
					title: "请输入您的昵称",
					icon: "none",
				});
				return;
			}
			this.G.Post(this.api.order_addApply, { agencyId: that.chooseTeam.agencyId, username: this.teamInfo.userName }, (res) => {
				uni.showToast({
					title: "申请成功",
					icon: "none",
				});
				this.joinTeamConfirm = false;
				that.G.handleConfirm({
					confirmText: "确认",
					showCancel: false,
					content: "您已发起申请,审核通过即可加入该团队",
					success: (res) => {
						if (res.confirm) {
							if (that.navNewPage) {
								uni.switchTab({
									url: "/pages/home/index",
								});
							}
						}
					},
				});
				console.log(res);
			});
		},
		// 是代理直接关注确认框
		applyFlowConfirm() {
			let that = this;
			that.G.handleConfirm({
				confirmText: "确认",
				title: "是否确认关注该发单号？",
				content: "关注发单号后可浏览职位详情及工单报名",
				success: (res) => {
					if (res.confirm) {
						this.finallySubmit();
					}
				},
			});
		},
		// 不是代理询问是否创建或加入团队
		applyFlowWidthoutAgencyConfirm() {
			let that = this;
			// this.confirmWithoutAgency = true;
			this.submitConfirm = true;
      
			return;
			that.G.handleConfirm({
				cancelText: "创建团队",
				confirmText: "加入团队",
				content: "请确认公司是否已创建团队，如果有可直接加入，如果没有可创建。",
				success: (res) => {
					if (res.confirm) {
						this.joinTeamConfirm = true;
					} else {
						this.submitConfirm = true;
					}
				},
			});
		},
		finallySubmit() {
			let that = this;
			if (!this.agencyInfo.fullName) {
				uni.showToast({
					title: "请输入企业简称",
					icon: "none",
				});
				return;
			}
			let _code = 1; // 账号搜索
			if (this.from == "friend") {
				_code = 2; // 名片分享
			} else {
				if (this.scene) {
					_code = 3; // 扫一扫
				} else {
					_code = 1; // 账号搜索
				}
			}
			if (that.btnLoading) {
				return;
			}
			that.btnLoading = true;
			this.G.Get(this.api.bind_subscribeSubmit + "/" + that.shareAgencyId, { agencyId: that.agencyInfo.id, agencyName: that.agencyInfo.fullName, source: 3, remark: " " }, (res) => {
				that.$emit("updateInfo");
				uni.showToast({
					title: "关注成功",
					icon: "none",
				});
				that.btnLoading = false;
				that.submitConfirm = false;
				if (that.navNewPage) {
					uni.navigateTo({
						url: "/root/person/inviteFollowSuccess",
					});
				}

				// reso();
				// that.checkHasApply();
				console.log(res);
			});
		},
	},
};
</script>

<style scoped lang="less"></style>