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/bind/order.vue

517 lines
15 KiB
Vue

6 months ago
<template>
<view class="p-bind-inedx g_w_all g_h_all g_bg_f_5 g_kuaishou">
<!-- 搜索栏 -->
<view class="m-top">
<view class="m-search g_p_10 g_pb_0 g_position_rela g_p_12 g_bg_f_5">
<u-search height="80" v-model="keyword" :placeholder="tabInfo.active == 0 ? '搜索已关注的发单号' : '搜索我的粉丝'" @btnSearch="getSearch" bg-color="#fff" :show-action="false" @change="getSearch" @clear="getSearch" @custom="getSearch" @search="getSearch" search-icon-color="#999999" :maxlength="20"></u-search>
</view>
</view>
<view class="m-panel">
<view class="center">
<!-- 列表区 -->
<view class="m-list">
<view class="link" :class="isShow ? '' : ''">
<view class="item g_flex_row_between g_pt_12 g_pb_12 g_pl_16 g_pr_16 g_bg_f" @click="goApply" style="border-bottom: 1rpx solid #eee" v-if="tabInfo.active == 1">
<view class="g_flex_1 g_flex_row_start">
<view class="g_flex_column_center g_pr_16 g_flex_none">
<view class="g_w_48 g_h_48 g_radius_8 g_flex_c" style="background-color: #ffeceb">
<i class="iconfont icon-xindeshenqing g_fs_22" style="color: #ff7b7b; font-size: 22px"></i>
</view>
</view>
<view class="g_flex_column_center g_flex_1">
<view class="g_ell_1 g_fs_18 g_c_3">{{ tabInfo.active == 0 ? "新的关注" : "新的粉丝" }}</view>
<view
class="g_ell_1 g_fs_14 g_c_9 g_mt_4"
v-if="tabInfo.active == 0"
:style="{
color: Number(waitNum_downs) == 0 ? '#fff' : '#999',
}"
>您有{{ waitNum_downs }}条信息等待对方通过</view
>
<view
class="g_ell_1 g_fs_14 g_c_9 g_mt_4"
v-else
:style="{
color: Number(waitNum_downs) == 0 ? '#fff' : '#999',
}"
>您有{{ waitNum_downs }}条新的粉丝申请</view
>
</view>
</view>
<view class="g_flex_none g_h_all g_flex_column_center g_pl_20 g_h_48" v-if="Number(waitNum_ups) > 0">
<view class="tip g_w_16 g_h_16 g_bg_f0a g_c_f g_flex_c g_fs_14 g_radius_50">{{ waitNum_ups }}</view>
</view>
</view>
<g-loading :loading="loading" v-if="loading && speed == -1" />
<view v-if="!loading && speed == 0 && inviteNum <= 0" class="g_pt_130">
<g-empty :text="isLogin ? '暂无数据' : '请登录'" />
</view>
<view v-if="speed > 0 || inviteNum > 0">
<view v-if="inviteNum > 0" class="item g_flex_row_between flex_center g_pl_16 g_pr_16 g_pb_12 g_pt_12 g_bg_f g_border_e_b" @click="goInviteList">
<view class="g_flex_row_start flex_center">
<g-panel-image size="96" radius="6" />
<view class="g_ml_16">
<view class="g_ell_1 g_fs_18 g_c_0 g_flex_none" style="max-width: 460rpx">关注邀请</view>
<view class="g_mt_4 g_text_c">{{ inviteNum }}个发单号向你发出邀请</view>
</view>
</view>
<view class="g_dot_18 g_bg_f40 g_c_f g_text_c" v-if="showDot">
{{ inviteNum }}
</view>
</view>
5 months ago
<div class="r_box g_ml_10 g_mr_10" style="overflow: hidden">
<view class="item g_flex_row_between g_pl_16 g_pr_16 g_pb_6 g_pt_6 g_bg_f" hover-class="g_bg_e" v-for="(item, index) in query.list" :key="index" @click="goMain(item)" :class="index == 0 ? 'g_pt_12' : ''" :style="{ 'border-bottom': index == query.list.length - 1 ? '1rpx solid #fff' : '1rpx solid #eee' }">
<view class="g_flex_none g_flex_row_start">
<view class="g_flex_column_center g_pr_16 g_flex_none" style="position: relative">
<g-panel-image :url="item.logo || 'https://matripe-cms.oss-cn-beijing.aliyuncs.com/dailibaoming/qiyelogo0610.svg'" size="96" radius="50" />
6 months ago
5 months ago
<!-- <view v-if="item.supplierAccount == 1" style="position: absolute; left: 0; width: 48px; height: 48px" class="g_flex_row_end">
6 months ago
<view class="g_flex_c" style="position: absolute; overflow: hidden; width: 20px; height: 10px; right: -2px; top: 0px">
<image :src="cdnBaseImg + 'fadanhao.svg'" mode="widthFix" style="width: 16px; height: 13px"></image>
</view>
5 months ago
</view> -->
6 months ago
</view>
</view>
5 months ago
<view class="g_flex_1 g_h_all g_flex_column_center g_h_60 _right">
<view class="g_flex_row_between">
<view class="g_flex_column_center g_flex_1 g_mr_12">
<view class="g_flex_row_start flex_center">
<view class="g_ell_1 g_fs_18 g_c_0 g_flex_none" style="max-width: 100%">{{ item.fullName || item.agencyName || "-" }} </view>
<!-- <view class="g_ml_6 g_text_c g_flex_1">
6 months ago
<view class="g_w_36 g_h_18 g_fs_12 g_redius_4" style="background-color: #f2f7ff; color: #1677ff" v-if="item.teamType == 2"></view>
<view class="g_w_36 g_h_18 g_fs_12 g_redius_4" style="background-color: #fff5f5; color: #ff4d4f" v-if="item.teamType == 1"></view>
5 months ago
</view> -->
6 months ago
</view>
5 months ago
<view class="g_fs_14 g_c_9 g_mt_4">
6 months ago
<view class="g_flex_row_start">
5 months ago
<view class="g_flex_row_start">
<view> 总职位 </view>
<view class="g_mr_8">
{{ item.jobNum ? item.jobNum : "0" }}
</view>
6 months ago
</view>
5 months ago
<view class="g_flex_row_start">
<view> 在招 </view>
<view class="g_mr_8">
{{ item.recruitmentJobNum ? item.recruitmentJobNum : "0" }}
</view>
6 months ago
</view>
5 months ago
<view class="g_flex_row_start">
<view> 粉丝 </view>
<view class="g_mr_8">
{{ item.downNum ? item.downNum : "0" }}
</view>
6 months ago
</view>
</view>
</view>
</view>
5 months ago
<view class="g_flex_column_center g_mb_12" v-if="tabInfo.active == 1">
<view v-if="item.recordStatus == 1 && item.supplierAccount == 1 && item.recordStatus == 5">
<view class="g_radius_14 g_h_28 g_border_e g_fs_14 g_c_main g_pr_8 g_pl_8 g_flex_row_center flex_center" @click.stop="goApplyForm(item, index)" hover-class="g_bg_f_5" hover-stop-propagation>
<i class="iconfont icon-tianjia g_fsi_12 g_mr_6"></i>
等待通过
</view>
6 months ago
</view>
5 months ago
<view v-if="item.recordStatus == 1 && item.supplierAccount == 1 && item.recordStatus == 6">
<view class="g_radius_14 g_h_28 g_border_e g_fs_14 g_c_main g_pr_8 g_pl_8 g_flex_row_center flex_center" @click.stop="goApplyForm(item, index)" hover-class="g_bg_f_5" hover-stop-propagation>
<i class="iconfont icon-tianjia g_fsi_12 g_mr_6"></i>
已过期
</view>
6 months ago
</view>
5 months ago
<view v-if="item.recordStatus == 1 && item.supplierAccount == 1">
<view class="g_radius_14 g_h_28 g_border_e g_fs_14 g_c_main g_pr_8 g_pl_8 g_flex_row_center flex_center" @click.stop="goApplyForm(item, index)" hover-class="g_bg_f_5" hover-stop-propagation>
<i class="iconfont icon-tianjia g_fsi_12 g_mr_6"></i>
关注
</view>
6 months ago
</view>
5 months ago
<view v-if="item.recordStatus == 2">
<view class="g_radius_14 g_h_28 g_border_e g_fs_14 g_c_6 g_pr_8 g_pl_8 g_flex_row_center flex_center">
<i class="iconfont icon-a-bianzu11beifen2 g_fsi_12 g_mr_6"></i>
互相关注
</view>
6 months ago
</view>
</view>
</view>
</view>
</view>
5 months ago
</div>
6 months ago
</view>
</view>
</view>
<view v-if="isShow && speed > 0" class="g_bg_f_5">
<g-panel-hr :str="query.isFinish >= 0 && query.isFinish < query.size ? speed + '个发单号' : '加载中'" />
</view>
<!-- #ifdef H5 -->
<view style="height: 50px"></view>
<!-- #endif -->
</view>
</view>
</view>
</template>
<script>
export default {
onReady() {
this.G.setNavStyle();
},
onShareAppMessage() {
return this.G.shareFun();
},
data() {
return {
cdnBaseImg: this.G.store().cdnBaseImg,
isLogin: null,
isShow: false,
loading: true,
showDot: true,
speed: -1,
query: {
page: 1,
size: 50,
list: [],
isFinish: -1,
},
keyword: "",
scrollTop: 0,
domHeight: 0,
waitNum_downs: 0,
waitNum_ups: 0,
cardTab: [
{
icon: "t-icon-xunzhaoshangyou",
title: "搜索发单号",
remark: "关注更多单子的更新",
},
{
icon: "t-icon-fazhanxiayou",
title: "发展代理",
remark: "让更多代理关注我",
},
],
tabInfo: {
list: [
{
name: "关注(0)",
num: 0,
tip: 0,
cate_count: 0,
},
{
name: "粉丝(0)",
num: 0,
tip: 1,
cate_count: 0,
},
],
active: 0,
},
tabFansInfo: {
list: [
{
name: "新的代理",
},
{
name: "全部粉丝",
},
],
active: 0,
},
inviteNum: 0, //邀请关注粉丝的数量
};
},
onLoad(options) {
let that = this;
that.tabInfo.active = options.active;
5 months ago
// if (that.tabInfo.active == 0) {
// uni.setNavigationBarTitle({
// title: "发单号",
// });
// } else {
// if (that.tabInfo.active == 1) {
// uni.setNavigationBarTitle({
// title: "我的粉丝",
// });
// }
// }
6 months ago
const query = uni.createSelectorQuery().in(this);
query
.select(".m-top")
.boundingClientRect((data) => {
that.domHeight = data.height + 34;
})
.exec();
},
onShow() {
let that = this;
that.isLogin = uni.getStorageSync("apply-token");
if (uni.getStorageSync("watch_invite")) {
if (uni.getStorageSync("watch_invite") == 1) {
that.showDot = false; // 小红点数字显示
}
}
if (!that.isLogin) {
that.waitNum_downs = 0;
that.waitNum_ups = 0;
that.tabInfo.list[0].name = "关注(0)";
that.tabInfo.list[1].name = "粉丝(0)";
that.isShow = true;
that.speed = 0;
that.loading = false;
that.query.list = [];
} else {
that.query.page = 1;
that.getWaitNum();
that.getNum();
that.getList();
that.getInviteNum();
that.getPoint();
}
},
onReachBottom() {
let that = this;
if (that.query.isFinish == -1 || that.query.isFinish == that.query.size) {
that.query.page++;
that.getList("concat");
}
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
methods: {
handleUpdateFensTab(e) {},
getPoint() {
let that = this;
that.G.Get(
that.api.bind_getWaitNum + "/2",
{
type: 2,
},
(res) => {
that.tabInfo.list[1].cate_count = res.unread;
}
);
},
getWaitNum() {
let that = this;
that.G.Get(
that.api.bind_getWaitNum + "/" + (that.tabInfo.active * 1 + 1),
{
type: that.tabInfo.active * 1 + 1,
},
(res) => {
that.waitNum_downs = res.total;
that.waitNum_ups = res.unread;
console.log("获取指定数量:", res);
that.$forceUpdate();
}
);
},
getNum() {
let that = this;
that.G.Post(
that.api.bind_getListNum,
{
keys: that.keyword,
},
(res) => {
that.tabInfo.list[0].name = "关注(" + res.ups + ")";
that.tabInfo.list[1].name = "粉丝(" + res.downs + ")";
}
);
},
getInviteNum() {
let that = this;
that.G.Get(that.api.user_getInviteNum, {}, (res) => {
console.log(res);
that.inviteNum = res;
});
},
getList($type = "init") {
let that = this;
that.isShow = false;
that.G.Post(
that.api.bind_list,
{
pageNum: that.query.page,
pageSize: that.query.size,
keys: that.keyword,
platform: "pc",
type: that.tabInfo.active * 1 + 1,
formdata: true,
},
(res) => {
that.isShow = true;
that.speed = res.recordCount;
if (that.speed == 0) {
that.loading = false;
} else {
that.loading = true;
}
that.query.isFinish = res.recordList.length;
if ($type == "init") {
that.query.list = [];
that.query.list = res.recordList;
} else {
that.query.list = that.query.list.concat(res.recordList);
}
}
);
},
getSearch(e) {
if (e == "string") {
this.keyword = e;
}
this.G.isLogin();
if (this.G.isLogin()) {
this.speed = -1;
this.query.page = 1;
this.getList();
}
},
handleUpdateTab(e) {
this.G.isLogin();
if (this.G.isLogin()) {
this.tabInfo.active = e;
this.speed = -1;
this.query.page = 1;
this.getList();
this.getWaitNum();
this.getNum();
this.getPoint();
}
},
goMain($item) {
let that = this;
this.G.isLogin();
if (this.G.isLogin()) {
if ($item.supplierAccount == 1) {
let params = {
id: $item.agencyId,
type: that.tabInfo.active * 1 + 1,
bindid: $item.id,
isShowMore: false,
isShowJob: false,
};
if (that.tabInfo.active == 0) {
// 关注
params.isShowMore = true;
params.isShowJob = true;
} else {
// 粉丝
if ($item.recordStatus == 1) {
// 已关注
params.isShowMore = true;
params.isShowJob = false;
} else {
// 相互关注
params.isShowMore = true;
params.isShowJob = true;
}
}
uni.navigateTo({
url: "/root/detail/user?" + that.G.objToStr(params),
});
} else {
// 直接前往操作页
uni.navigateTo({
url: "/root/bind/more?delta=1&id=" + $item.agencyId + "&himSee=" + $item.himSee + "&lookHim=" + $item.lookHim + "&type=" + 2 + "&hid=" + $item.id,
});
}
}
},
goApply() {
let that = this,
str = "";
this.G.isLogin();
if (this.G.isLogin()) {
uni.navigateTo({
url: "/root/bind/applyList?active=2",
});
}
},
goSearch($item, $index) {
let that = this;
that.G.isLogin();
if (that.G.isLogin()) {
uni.navigateTo({
url: "/root/bind/search?active=" + $index,
});
}
},
goApplyForm($item, $index) {
let that = this;
if ($item.recordStatus == 5 || $item.recordStatus == 6) {
} else {
uni.navigateTo({
url: "/root/bind/applyForm?code=" + $item.agencyId + "&form=1",
});
}
},
goInviteList() {
uni.navigateTo({
url: "/root/bind/inviteList?active=0",
});
},
},
};
</script>
<style lang="scss">
.p-bind-inedx {
.m-card {
padding-left: 10px;
padding-right: 10px;
.item {
width: calc(50% - 5px);
}
}
.showdoc {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04), 0 0 6px rgba(0, 0, 0, 0.02);
}
.suffix {
position: absolute;
right: 20rpx;
top: 50%;
transform: translateY(-50%);
z-index: 1;
border-top-right-radius: 110rpx;
border-bottom-right-radius: 110rpx;
}
.tab-fixed {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 44px;
background-color: #fff;
z-index: 1;
}
.m-search {
// .u-icon-wrap{
// position: absolute;
// left: 190rpx;
// }
}
.m-search-active {
.u-icon-wrap {
position: inherit;
left: 0rpx;
}
}
}
</style>