You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
apply-assistant-v3/root/detail/userShare.vue

773 lines
22 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="g_flex_row_center" style="margin-top: 120px" v-if="!showPage">
<g-loading text="加载中..."></g-loading>
</div>
<div class="p-root-detail-user g_w_all g_bg_page g_kuaishou" v-if="showPage">
<u-navbar backIconColor="#333" :borderBottom="false" :immersive="true" :customBack="goHome" :background="background" :backIconName="fromShare ? 'home' : 'arrow-left'"></u-navbar>
<view class="scroll-container" @touchstart="onTouchStart" @touchmove="onTouchMove" @touchend="onTouchEnd">
<view class="background-container" style="width: 100%; overflow: hidden">
<view
class="u-navbar-fixed"
:style="{
'background-image': 'url(https://matripe-cms.oss-cn-beijing.aliyuncs.com/dailibaoming/v3/mbg.jpg)',
'background-size': '100% 100%',
width: 'calc(100vw + ' + backgroundScale + 'px)',
height: 'calc(' + (100 / 1.78).toFixed(2) + 'vw + ' + backgroundScale + 'px)',
zoom: 1 + backgroundScale * 0.018,
}"
>
</view>
</view>
<div class="con-obj" style="background-color: #caf1e0 !important">
<view class="m-info g_p_20 g_pt_12 g_pb_0 g_bg_f g_position_rela" hover-class="none" style="margin-top: 0; border-radius: 8px 8px 0 0; width: calc(100% - 40px)">
<view class="g_flex_row_start">
<view class="g_w_71">
<view class="g_position_abso g_p_4 g_radius_50 g_bg_f" style="top: -20px">
<g-panel-image :radius="50" :size="128" :url="info.logo" />
</view>
</view>
<view class="g_flex_1 g_ml_11">
<view class="g_flex_row_between flex_center">
<view class="g_flex_row_start flex_center" style="line-height: 22px">
<view class="g_flex_none g_ell_1 g_fs_18 g_fw_bold g_c_3" style="max-width: 300rpx">{{ info.fullName || info.agencyName || "-" }}</view>
</view>
</view>
</view>
</view>
<view class="g_flex_row_start flex_center g_mt_18 g_fs_14 g_c_8" hover-class="thover" @click="goMore">
<view class>{{ info.agencyName || info.fullName || "-" }}</view>
<i class="iconfont icon-gengduo11" style="line-height: 22px; font-size: 10px"></i>
</view>
<div style>
<div class="g_pt_12" style="height: 100%">
<div class="g_flex_row_between">
<div v-for="(item, index) in numSlot" :key="index" class="g_flex_row_center g_position_rela">
<div class="g_flex_row_center flex_end">
<div class="g_c_3 g_fw_600 g_mr_2 g_fs_20" style="line-height: 1">{{ item.num }}</div>
<div class="g_fs_12 g_c_6 g_flex_column_end">{{ item.name }}</div>
</div>
</div>
</div>
</div>
<div class="g_pt_12 g_fs_14" style="height: 100%">{{ info.agencyDesp }}</div>
</div>
<div class="g_h_10"></div>
<div class>
<quickLogin @successLogin="successLogin" v-if="!isLogin">
<div style="width: calc(100vw - 40px)" class>
<g-button btnText="申请关注" size="auto" type="primary" class></g-button>
</div>
</quickLogin>
<div style="width: calc(100vw - 40px)" v-else-if="isSelf">
<!-- <g-button btnText="不能关注自己" size="auto" type="disabled"></g-button> -->
</div>
<!-- -->
<div v-else>
<div class="g_flex_row_center" v-if="info.recordStatus == 1">
<!-- 已关注 1 -->
<!-- class="g_mr_10" -->
<div style="width: calc(100vw - 40px)" @click="handleCancel">
<g-button btnText="已关注发单号" size="auto" type="disabled" class></g-button>
</div>
<!-- <div style="width:calc((100vw - 50px) / 2);">
<g-button btnText="联系客服" size="auto" type="disabled" class></g-button>
</div>-->
</div>
<div style="width: calc(100vw - 40px)" v-else-if="info.recordStatus == 2" @click="handleCancel">
<g-button btnText="互相关注" size="auto" type="disabled" class></g-button>
</div>
<div style="width: calc(100vw - 40px)" v-else-if="(info.recordStatus == 3 || info.recordStatus == 4) && !isSelf">
<g-button btnText="申请关注" size="auto" :loading="btnLoading" type="primary" class @clickBtn="handleSubmit"></g-button>
</div>
<!-- -->
<div style="width: calc(100vw - 40px)" v-else-if="info.recordStatus == 5">
<g-button btnText="申请中" icon="icon-time-circle g_mr_4" size="auto" type="disabled" class></g-button>
</div>
<div style="width: calc(100vw - 40px)" v-else-if="info.recordStatus == 6 && !isSelf">
<g-button btnText="申请关注" size="auto" type="primary" :loading="btnLoading" class @clickBtn="handleSubmit"></g-button>
</div>
</div>
</div>
</view>
<div class="g_bg_f g_pt_8">
<!-- <u-tabs bg-color="transparent" from="index" gutter="20" :list="tabInfo.list" :is-scroll="true" :current="tabInfo.active" active-color="#000" bar-width="64" bar-height="6" @change="handleUpdateTab" font-size="32" duration="0.05" height="56"></u-tabs> -->
</div>
<!-- 基本信息 -->
<div class="g_h_all">
<div v-if="jobDetailShow || jobDetailShow == 'true'">
<!-- 正常职位 -->
<div class="m-detail">
<div class="g_h_10"></div>
<g-list-job :recordStatus="info.recordStatus" @successLogin="jobLogin" :isSelf="isSelf" :showShare="false" :list="query.list" :loading="loading" :speed="speed" :isShowLoginBtn="isLogin ? false : true" :query="query" emptyText="暂无职位" emptySubText=" " />
</div>
<div v-if="info.himSeeBtn == 0" style="padding-top: 260rpx">
<g-empty text="您关注的发单号暂未发布职位" />
</div>
</div>
</div>
</div>
</view>
<applyFlow ref="applyFlow" @updateInfo="updateInfo" :userInfo="userInfo" :shareAgencyId="uid" :agencyInfo="agencyInfo"></applyFlow>
</div>
</template>
<script>
import quickLogin from "../../components/quickLogin.vue";
import applyFlow from "../components/applyFlow.vue";
export default {
components: {
quickLogin,
applyFlow,
},
onReady() {
this.G.setNavStyle();
},
// onShareAppMessage(){
// return this.G.shareFun();
// },
data() {
return {
numSlot: [],
showPage: false,
fromShare: false,
btnLoading: false,
background: {
backgroundColor: "transparent",
},
userInfo: {},
navColor: "rgb(255,255,255,0)",
isLogin: null,
isShowMore: true,
isShowJob: true,
loading: true,
keyword: "", // 搜索内容
speed: -1,
query: {
page: 1,
size: 20,
list: [],
isFinish: -1,
},
agencyInfo: {},
info: {
avatar: "",
agencyName: "",
jobUpdateNum: 0,
},
uid: 0,
type: 0,
bindid: 0,
dataArray: [
{
name: "职位",
num: 120,
},
{
name: "在招",
num: 120,
},
{
name: "关注",
num: 108,
},
{
name: "粉丝",
num: 250,
},
],
from: "",
fromQRCode: false, // 是否来自扫码的判断
jobDetailShow: true,
isSelf: false, // 是否是自己的信息判断
scene: "",
tabInfo: {
list: [
{
name: "最新",
num: 0,
tip: 0,
classify: 2,
},
{
name: "最热",
num: 0,
tip: 1,
classify: 3,
},
{
name: "专属",
num: 0,
tip: 2,
classify: 1,
},
],
active: 0,
},
disabled: false,
inviteUserId: 0,
refreshing: false,
mtScroll: 0,
backgroundScale: 0, // 背景缩放比例
startY: 0, // 触摸起始位置
moveY: 0, // 触摸移动位置
isTouching: false, // 是否正在触摸
};
},
onPageScroll(e) {
if (e.scrollTop <= 100) {
this.navColor = `rgb(255,255,255,${e.scrollTop / 50})`;
}
},
onLoad(options) {
let that = this;
console.log("用户详情页:", options, " version:", 1);
this.loginId = uni.getStorageSync("apply-agencyId");
that.isLogin = uni.getStorageSync("apply-token") ? true : false; // uni.getStorageSync("apply-token");
this.userInfo = uni.getStorageSync("apply-userinfo");
if (this.loginId == options.id && options.id) {
this.isSelf = true;
}
if (options.scene) {
var sceneStr = decodeURIComponent(options.scene);
var sceneJson = this.G.sceneToJson(sceneStr);
this.scene = options.scene;
this.fromShare = true;
console.log("sceneJson===", sceneJson);
this.inviteUserId = sceneJson.id.split("_")[1]; //被关注团队的邀请人id
this.uid = sceneJson.id.split("_")[0]; // 被关注团队的id
this.fromQRCode = true; // 被关注团队的id
} else {
this.uid = options.id;
this.isShowMore = options.isShowMore ? true : false;
this.isShowJob = options.isShowJob;
this.fromShare = false;
this.showPage = true;
}
this.type = options.type ? options.type : "";
this.jobDetailShow = options.jobDetailShow || true;
this.from = options.shareForm;
if (options.bindid) {
this.bindid = options.bindid;
}
},
onShow() {
let that = this;
console.log("that.isLogin", that.isLogin);
that.G.Get("/checkUserLogin", {}, (res) => {
console.log("checkUserLogin", res);
if (res) {
// 已登录状态
that.getAgencyInfo().then(() => {
that.getAgencyById().then(() => {
if (that.fromQRCode) {
if (that.info.recordStatus == 1) {
uni.switchTab({
url: "/pages/home/index",
});
return;
}
}
if (that.isLogin) {
that.getDefault("init");
} else {
that.setJobList(that.info.jobList);
}
});
});
} else {
// 未登录状态
that.getAgencyById().then(() => {
that.setJobList(that.info.jobList);
});
}
});
// if (!that.isLogin) {
// that.loading = false;
// that.speed = 0;
// } else {
// }
},
onReachBottom() {
let that = this;
if (!that.isLogin) {
return false;
}
if (that.query.isFinish == -1 || that.query.isFinish == that.query.size) {
that.query.page++;
that.getDefault("concat");
}
},
methods: {
// 触摸开始事件
onTouchStart(e) {
this.mtScroll = 0;
this.backgroundScale = 0;
this.isTouching = true;
if (e.touches && e.touches.length > 0) {
this.startY = e.touches[0].pageY;
}
},
// 触摸移动事件
onTouchMove(e) {
if (!this.isTouching) return;
if (e.touches && e.touches.length > 0) {
this.moveY = e.touches[0].pageY;
const moveDistance = this.moveY - this.startY;
// 只有向下移动moveDistance > 0且移动距离合理时才触发下拉效果
if (moveDistance > 0 && moveDistance < 200) {
// 限制最大下拉距离
const query = uni.createSelectorQuery().in(this);
query
.select(".scroll-container")
.boundingClientRect((data) => {
if (data) {
const scrollTop = data.scrollTop || 0;
// 只有在滚动到顶部且向下拉动时才执行缩放
if (scrollTop <= 0) {
// 根据移动距离计算缩放值,使效果更自然
this.backgroundScale = Math.min(moveDistance * 0.2, 800); // 限制最大缩放值
this.mtScroll = Math.min(moveDistance * 0.2, 800);
}
}
})
.exec();
}
}
},
// 触摸结束事件
onTouchEnd() {
let that = this;
that.isTouching = false;
const animationDuration = 300; // 动画持续时间(ms)
const frameDuration = 16; // 每帧间隔(约60fps)
const totalFrames = Math.ceil(animationDuration / frameDuration);
let currentFrame = 0;
const startScale = that.backgroundScale;
const startScroll = that.mtScroll;
const animate = () => {
currentFrame++;
const progress = Math.min(currentFrame / totalFrames, 1);
const easeOutQuart = 1 - Math.pow(1 - progress, 4);
that.backgroundScale = startScale * (1 - easeOutQuart);
that.mtScroll = startScroll * (1 - easeOutQuart);
if (progress < 1) {
setTimeout(animate, frameDuration);
} else {
that.backgroundScale = 0;
that.mtScroll = 0;
}
};
animate();
},
onScrollToLower() {
let that = this;
if (!that.isLogin) {
return false;
}
if (that.query.isFinish == -1 || that.query.isFinish == that.query.size) {
that.query.page++;
that.getDefault("concat");
}
},
goHome() {
if (this.fromShare) {
uni.switchTab({
url: "/pages/home/index",
});
} else {
uni.navigateBack({
delta: 1,
});
}
},
/**
* 获取登录人的团队信息
*/
getAgencyInfo() {
let that = this;
return new Promise((reso, reject) => {
that.G.Get(that.api.login_agencyInfo, {}, (aRes) => {
console.log("获取团队信息:", aRes);
if (aRes.agency) {
that.disabled = aRes.agency.fullName ? true : false;
that.agencyInfo = { ...aRes.agency, fullName: aRes.agency.fullName ? aRes.agency.fullName : that.agencyInfo.fullName };
uni.setStorageSync("agencyInfo", aRes.agency);
}
setTimeout(() => {
reso();
}, 200);
});
});
},
goMore() {
let that = this,
str = "";
if (this.fromShare || this.isSelf) {
return false;
}
this.G.isLogin();
if (this.G.isLogin()) {
console.log(that.isShowMore);
console.log(that.info);
if (that.isShowMore == true) {
if (that.info.recordStatus == 2) {
str = 3;
} else {
str = that.info.up;
}
console.log("that.type", that.type);
uni.navigateTo({
url: "/root/bind/more?delta=2&id=" + that.info.id + "&himSee=" + that.info.himSee + "&lookHim=" + that.info.lookHim + "&type=" + str + "&from=" + that.type + "&lid=" + that.info.lookHimOperateId + "&hid=" + that.info.himSeeOperateId,
});
}
}
},
handleCancel() {
let that = this;
this.G.isLogin();
if (this.G.isLogin()) {
that.G.handleConfirm({
content: "是否取消关注该发单号?",
success: (res) => {
if (res.confirm) {
that.G.Get(
that.api.bind_cancelApply + "/" + that.info.id,
{
agencyId: that.info.id,
},
() => {
uni.showToast({
icon: "success",
title: "取消关注成功",
});
setTimeout(() => {
that.getAgencyById();
that.getDefault("init");
// that.getList();
}, 1500);
}
);
}
},
});
}
},
goDetailUser() {
let that = this;
return false;
this.G.isLogin();
if (this.G.isLogin()) {
if (this.info.recordStatus == 1 || this.info.recordStatus == 2) {
let params = {
id: that.info.agencyId,
type: that.type,
bindid: that.info.id,
isShowMore: true,
isShowJob: true,
};
uni.navigateTo({
url: "/root/detail/user?" + that.G.objToStr(params),
});
} else {
if (that.isSelf) {
} else {
uni.showToast({
title: "关注发单号后才可查看详情",
icon: "none",
});
}
}
}
},
setJobList(recordList, $type) {
let that = this;
that.query.isFinish = recordList.length;
recordList = that.G.toGetAddressv3(recordList);
recordList = that.G.toGetAge(recordList);
recordList = that.G.yijobCopy(recordList);
if ($type == "init") {
that.query.list = [];
that.query.list =
recordList.length > 0
? recordList.map((item, index) => {
return {
...item,
title: item.jobName,
address: item.district + item.age,
price: item.salaryClassify != 7 ? that.G.getSalaryClassifyValue(item.salaryClassify, item.salaryClassifyValue) : that.G.getSalaryClassifyValue(item.salaryClassify, item.minMonthlyPay, item.maxMonthlyPay),
fuWuFei: that.G.setReturnFee(item.returnFee, item.returnFeeType),
cus_price: item.salaryClassify != 7 ? that.G.getSalaryClassifyValueHtml(item.salaryClassify, item.salaryClassifyValue) : "月薪",
gender: that.G.getGenderByMinAge(item),
logo: item.agencyLogo,
time: that.G.setDeadLine(item.updateTime, "jiaofu"),
leafCateId: item.id,
// serverPrice: that.G.setReturnFee(item.returnFee, item.returnFeeType),
serverPrice: that.G.setReturnFee(item.agencyReturnFee, item.agencyReturnFeeType),
recruitmentSwitch: item.recruitment == 1 ? true : false,
recruitmentImage: item.recruitment,
isToday: item.today == 0 ? false : true,
active: 0,
};
})
: [];
} else {
that.query.list = that.query.list.concat(
recordList.length > 0
? recordList.map((item, index) => {
return {
...item,
title: item.jobName,
address: item.district + item.age,
price: item.salaryClassify != 7 ? that.G.getSalaryClassifyValue(item.salaryClassify, item.salaryClassifyValue) : that.G.getSalaryClassifyValue(item.salaryClassify, item.minMonthlyPay, item.maxMonthlyPay),
fuWuFei: that.G.setReturnFee(item.returnFee, item.returnFeeType),
gender: that.G.getGenderByMinAge(item),
logo: item.agencyLogo,
time: that.G.setDeadLine(item.updateTime, "jiaofu"),
leafCateId: item.id,
// serverPrice: that.G.setReturnFee(item.returnFee, item.returnFeeType),
serverPrice: that.G.setReturnFee(item.agencyReturnFee, item.agencyReturnFeeType),
recruitmentSwitch: item.recruitment == 1 ? true : false,
recruitmentImage: item.recruitment,
isToday: item.today == 0 ? false : true,
active: 0,
};
})
: []
);
}
},
getDefault($type) {
let that = this;
console.log("$type", $type);
this.G.isLogin();
if (this.G.isLogin()) {
that.G.Post(
that.api.job_list,
{
pageNum: that.query.page,
pageSize: that.query.size,
agencyId: that.info.id,
},
(res) => {
console.log("resresresresresres", res);
if (res.recordCount == 0) {
that.loading = false;
} else {
that.loading = true;
}
that.speed = res.recordCount;
that.setJobList(res.recordList, $type);
console.log("query.list", that.query.list);
}
);
}
},
checkLength(e) {
if (e.length == 0) {
this.keyword = "";
this.getList();
}
},
getList($type = "init") {
let that = this;
return;
this.G.isLogin();
if (this.G.isLogin()) {
if (this.info.recordStatus == 1 || this.info.recordStatus == 2) {
that.getDefault($type);
}
}
},
goDetailJob($item) {
let that = this;
return false;
this.G.isLogin();
if (this.G.isLogin()) {
if (that.isSelf) {
uni.navigateTo({
url: "/root/detail/job?id=" + $item.leafCateId,
});
} else if (this.info.recordStatus == 1 || this.info.recordStatus == 2) {
uni.navigateTo({
url: "/root/detail/job?id=" + $item.leafCateId,
});
} else {
uni.showToast({
title: "关注发单号后才可查看详情",
icon: "none",
});
}
}
},
inviteSubmit() {
let that = this;
console.log("info", that.info);
// return;
uni.showModal({
title: "关注发单号",
content: "关注发单号后,您可以查看该账号职位的更新,确定要关注吗?",
confirmColor: "#576B95",
success(modalRes) {
if (modalRes.confirm) {
that.G.Post(
that.api.user_updateInviteId,
{
agencyIds: that.info.agencyId,
},
(res) => {
uni.showToast({
title: "关注成功",
});
setTimeout(() => {
that.getAgencyById();
}, 800);
}
);
} else if (modalRes.cancel) {
console.log("用户点击取消");
}
},
fail() {},
});
},
// 获取分享人团队信息(包含与登录者的关注关系)
getAgencyById() {
let that = this;
return new Promise((reso, reject) => {
this.G.Get(this.api.order_getAgencyByIdForApply, { agencyId: that.uid, inviteUserId: this.inviteUserId }, (res) => {
console.log("resresresresresres++++++++++++++", res);
console.log("resresresresresres++++++++++++++", that.agencyInfo);
console.log("resresresresresres++++++++++++++", that.isSelf);
that.info = res;
that.speed = res.jobList.length;
that.showPage = true;
if (res.id == that.agencyInfo.id) {
that.isSelf = true;
}
that.numSlot = [
{
name: "总职位",
num: that.info.jobNum,
},
{
name: "在招",
num: that.info.recruitmentJobNum,
},
{
name: "关注",
num: that.info.upNum,
},
{
name: "粉丝",
num: that.info.downNum,
},
];
// that.getList()
reso();
});
});
},
successLogin(e) {
let that = this;
this.isLogin = true;
console.log("successLogin", e);
this.userInfo = uni.getStorageSync("apply-userinfo");
that.getAgencyInfo().then(() => {
that.getAgencyById().then(() => {
// that.query.page++;
console.log("Boolean(e.agencyId)", Boolean(e.agencyId));
if (Boolean(e.agencyId) == false || that.info.recordStatus == 3 || that.info.recordStatus == 4 || that.info.recordStatus == 6) {
that.handleSubmit();
} else {
if (that.info.recordStatus == 5) {
uni.showToast({
title: "已发起关注申请, 正在等待通过",
icon: "none",
});
}
}
that.getDefault("init");
});
});
},
// 组件关注后更新信息
updateInfo() {
let that = this;
that.getAgencyInfo().then(() => {
that.getAgencyById().then(() => {
that.G.checkToken();
});
});
},
jobLogin() {
let that = this;
this.isLogin = true;
this.userInfo = uni.getStorageSync("apply-userinfo");
that.getAgencyInfo().then(() => {
that.getAgencyById().then(() => {
// that.query.page++;
that.getDefault("init");
});
});
},
handleSubmit() {
let that = this;
this.G.isLogin();
if (this.G.isLogin()) {
if (that.userInfo.agencyId) {
// that.submitConfirm = true;
that.$refs.applyFlow.applyFlowConfirm();
} else {
that.$refs.applyFlow.applyFlowWidthoutAgencyConfirm();
}
}
},
handleUpdateTab() {},
},
};
</script>
<style lang="scss">
.p-root-detail-user {
}
.m-detail {
background: #ededed;
}
.m-info {
width: calc(100%);
margin: 0 auto;
.data-box {
.item {
width: 33.3333%;
}
}
}
.scroll-area {
height: 100vh;
}
</style>