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.
610 lines
17 KiB
Vue
610 lines
17 KiB
Vue
<template>
|
|
<view class="p-person-inedx g_w_all g_bg_f_5 g_kuaishou" :style="{ minHeight: `calc(100vh - ${tabbarHeight}px)` }">
|
|
<view class="g_h_10"></view>
|
|
<!-- 基本信息 -->
|
|
<view style="" class="">
|
|
<g-panel-card-info
|
|
:info="{
|
|
avatar: userinfo.avatar ? userinfo.avatar : svgBaseImg + 'defaultAva.svg',
|
|
title: userinfo.name,
|
|
num: userinfo.tel,
|
|
isHaveOrder: false,
|
|
}"
|
|
@clickCard="goPage('/root/person/info')"
|
|
/>
|
|
</view>
|
|
<!-- <view class="g_mt_10 g_mb_10">
|
|
<g-panel-form-item
|
|
:list="[
|
|
{
|
|
icon: 'wodegongzuo2',
|
|
label: '我的报名',
|
|
result: '',
|
|
path: '/root/person/enrollList',
|
|
tip: 'set',
|
|
pRow: 12,
|
|
},
|
|
]"
|
|
@clickItem="goPage('/root/person/enrollList')"
|
|
/>
|
|
</view> -->
|
|
<view class="g_mt_10" v-if="hasPermission">
|
|
<g-panel-poster-card :list="poastList" subhead="更多" cardType="img" titleNav="/root/merchantManagement/posterShare" :speed="1" :marginBottom="16" :num="4" cusTitle="分享海报" @clickImg="clickImg" @clickItem="handleClickNum" />
|
|
</view>
|
|
<view class="g_mt_10">
|
|
<g-panel-card-num :list="cardList" :speed="1" :marginBottom="16" cusType="image" :height="26" :num="4" cusTitle="我的卡包" @clickItem="handleClickNum" />
|
|
</view>
|
|
<view class="g_mt_10" hover-class="none" hover-stop-propagation="false">
|
|
<g-panel-card-num :list="serverList" :marginBottom="16" class="" :height="26" :speed="1" :num="4" cusType="image" cusTitle="我的服务" @clickItem="handleClickNum" />
|
|
</view>
|
|
|
|
<view class="g_mt_10">
|
|
<g-panel-form-item
|
|
:list="[
|
|
{
|
|
icon: 'fankuiyujianyi',
|
|
label: '反馈与建议',
|
|
result: '',
|
|
path: '/root/person/feedback',
|
|
tip: 'set',
|
|
pRow: 12,
|
|
},
|
|
]"
|
|
@clickItem="goPage('/root/person/feedback')"
|
|
/>
|
|
</view>
|
|
<view class="g_mt_10">
|
|
<g-panel-form-item
|
|
:list="[
|
|
{
|
|
icon: 'shezhi',
|
|
label: '设置',
|
|
result: '',
|
|
path: '/root/person/set',
|
|
tip: 'set',
|
|
pRow: 12,
|
|
},
|
|
]"
|
|
@clickItem="goPage('/root/person/set')"
|
|
/>
|
|
</view>
|
|
<view class="g_bg_f g_h_56 g_ml_12 g_mr_12 g_mt_24 g_radius_8 g_flex_row_center flex_center g_position_rela" @click="goPage('/root/merchantManagement/merchantManagement')" hover-class="thover" v-if="hasPermission">
|
|
<view class="iconfont icon-shangjiahoutai g_mr_6 g_mt_2"></view>
|
|
<view class="g_fw_600 g_fs_17">商家管理后台</view>
|
|
<view v-if="hasNewResume > 0" class="g_ml_4" style="font-size: 12px; color: #ffffff; background-color: #fa3534; display: inline-flex; justify-content: center; align-items: center; line-height: 24rpx; padding: 4rpx 8rpx; border-radius: 100rpx; z-index: 9">
|
|
{{ hasNewResume }}
|
|
</view>
|
|
<!-- <u-badge v-if="hasNewResume > 0" :offset="[20, 200]" :count="hasNewResume"></u-badge> -->
|
|
</view>
|
|
<view class="g_mt_12" v-if="corpUserFlag">
|
|
<g-panel-form-item
|
|
:list="[
|
|
{
|
|
icon: 'shezhi',
|
|
label: '会员',
|
|
result: '',
|
|
path: '/root/vip/indexnew',
|
|
tip: 'set',
|
|
pRow: 12,
|
|
},
|
|
]"
|
|
@clickItem="goPage('/root/vip/indexnew')"
|
|
/>
|
|
</view>
|
|
|
|
<view class="g_h_100"></view>
|
|
<u-popup v-model="posterShow" mode="center" :closeable="true" uZindex="9999" width="90%" height="87%" border-radius="12" :mask-close-able="true" @close="currentImg = ''">
|
|
<div v-if="currentImg" class="g_pt_36 g_pb_12 g_text_c g_position_abso" style="height: calc(100% - 66px); width: 100%; box-sizing: border-box; left: 0%; top: 0px; z-index: 999">
|
|
<view class="fakerClose g_w_36 g_h_36" style="position: absolute; top: 0; right: 0; z-index: 999" @click="posterShow = false"></view>
|
|
<image class="g_position_abso" style="height: 92%; left: 50%; top: 36px; transform: translateX(-50%)" :show-menu-by-longpress="true" :src="currentImg" mode="aspectFit" lazy-load binderror="" bindload=""> </image>
|
|
</div>
|
|
<!-- v-else -->
|
|
<div class="g_w_all g_flex_row_center g_pt_36 g_pb_12" style="height: calc(100% - 56px); box-sizing: border-box">
|
|
<div class="g_position_rela" style="height: 100%; aspect-ratio: 9 / 16">
|
|
<img :src="fakeImg" class="g_h_all g_w_all" alt="" />
|
|
<div class="g_position_abso g_bg_f g_radius_6 g_flex_row_between flex_center" style="width: 94%; height: 18%; padding: 0 4%; transform: translateX(-50%); left: 50%; bottom: 3%; box-sizing: border-box">
|
|
<div class="g_flex_row_start flex_center g_flex_1 g_h_all">
|
|
<!-- <img style="width: 17%; height: 40%" :src="miniAppInfo.logo || 'https://matripe.oss-cn-beijing.aliyuncs.com/default.png'" alt="" /> -->
|
|
<div class="g_ml_4 g_c_6">
|
|
<div class="g_fw_600" :style="{ fontSize: '100%' }">
|
|
{{ miniAppInfo.fullName || miniAppInfo.agencyName }}
|
|
</div>
|
|
<div :style="{ fontSize: '60%' }">
|
|
{{ miniAppInfo.slogan || "全心全意为老乡服务" }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<img style="width: 22%; height: 60%" :src="miniAppInfo.qrCode" alt="" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="g_flex_row_center">
|
|
<rh-button primaryColor="#3578f6" :btnText="fakeImg ? '生成中...' : '保存图片'" :loading="fakeImg ? true : false" @clickBtn="saveImg" type="primary" size="160" class="" />
|
|
<!-- <rh-button primaryColor='#3578f6' btnText="保存图片" @clickBtn="saveImg" type="primary" size="160" class="" /> -->
|
|
<!-- <rh-button primaryColor='#3578f6' btnText="分享图片" size="small" class="" /> -->
|
|
</div>
|
|
</u-popup>
|
|
<canvas type="2d" style="position: absolute; left: -2000px; width: 425px; height: 350px; background: #fff" id="canvasId" ref="canvasId"></canvas>
|
|
</view>
|
|
<!-- <g-tabbar class="tabbar" :isShow="tabbarShow"></g-tabbar> -->
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
onShareAppMessage() {
|
|
return this.G.shareFun();
|
|
},
|
|
onReady() {},
|
|
data() {
|
|
return {
|
|
tabbarShow: true,
|
|
corpUserFlag: false,
|
|
fakeImg: "", // 站位虚拟分享图
|
|
posterShow: false, // 海报分享弹窗
|
|
currentImg: "", // 海报分享临时图片
|
|
tabbarHeight: uni.getStorageSync("TABBAR_HEIGHT"),
|
|
hasNewResume: 0,
|
|
isAdmin: uni.getStorageSync("IS_MINIAPP_ADMIN"),
|
|
hasPermission: uni.getStorageSync("HAS_PERMISSION") == 1 ? true : false, // 登陆者是否有权限查看
|
|
miniAppInfo: uni.getStorageSync("miniApp-info"),
|
|
pageSpeed: -1,
|
|
isLogin: null,
|
|
localBaseImg: this.G.store().localBaseImg,
|
|
cdnBaseImg: this.G.store().cdnBaseImg,
|
|
svgBaseImg: this.G.store().svgBaseImg,
|
|
speed: -1,
|
|
navInfo: {},
|
|
userinfo: {
|
|
all: {},
|
|
avatar: "",
|
|
name: "微信用户",
|
|
tel: "全心全意为老乡服务",
|
|
num: [
|
|
{
|
|
name: "",
|
|
num: "",
|
|
},
|
|
],
|
|
agencyName: "",
|
|
teamType: 0,
|
|
},
|
|
numList: [
|
|
{
|
|
name: "完单数",
|
|
num: 28,
|
|
},
|
|
{
|
|
name: "工作时长",
|
|
num: 10,
|
|
},
|
|
{
|
|
name: "好评率",
|
|
num: 100,
|
|
},
|
|
{
|
|
name: "履约率",
|
|
num: 100,
|
|
},
|
|
],
|
|
renList: [
|
|
{
|
|
name: "岗位认证",
|
|
image: "job.svg",
|
|
},
|
|
{
|
|
name: "资质认证",
|
|
image: "zizhirenzheng.svg",
|
|
},
|
|
{
|
|
name: "我的商家",
|
|
image: "myshop.svg",
|
|
},
|
|
{
|
|
name: "更多功能",
|
|
image: "more.svg",
|
|
},
|
|
],
|
|
poastList: [],
|
|
cardList: [
|
|
{
|
|
name: "证件",
|
|
icon: "zhengjian",
|
|
path: "/root/person/idcardList",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "银行卡",
|
|
icon: "yinhangka",
|
|
path: "/root/person/bankList",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "工资条",
|
|
icon: "gongzitiao",
|
|
path: "/root/other/empty?type=工资条",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "优惠券",
|
|
icon: "youhuiquan",
|
|
path: "/root/other/empty?type=优惠券",
|
|
iconType: 1,
|
|
},
|
|
],
|
|
serverList: [
|
|
// {
|
|
// name:'证件',
|
|
// icon:'zj911.svg',
|
|
// path:'/root/person/idcardList'
|
|
// },
|
|
{
|
|
name: "报名记录",
|
|
icon: "wodebaoming",
|
|
path: "/root/person/enrollList?from=toc",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "想去职位",
|
|
icon: "heart",
|
|
path: "/root/person/collect",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "我的简历",
|
|
icon: "wodejianli",
|
|
path: "/root/other/empty?type=我的简历",
|
|
iconType: 1,
|
|
},
|
|
|
|
{
|
|
name: "当前工作",
|
|
icon: "wodeshoucang1",
|
|
path: "/root/other/empty?type=当前工作",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "地址本",
|
|
icon: "dizhiben",
|
|
path: "/root/person/addressList",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "费用报销",
|
|
icon: "feiyongbaoxiao",
|
|
path: "/root/other/empty?type=费用报销",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "我的合同",
|
|
icon: "hetong",
|
|
path: "/root/other/empty?type=我的合同",
|
|
iconType: 1,
|
|
},
|
|
{
|
|
name: "预支薪资",
|
|
icon: "shouye",
|
|
path: "/root/other/empty?type=预支薪资",
|
|
iconType: 1,
|
|
},
|
|
],
|
|
};
|
|
},
|
|
onLoad() {
|
|
let that = this;
|
|
that.navInfo = that.G.getNavInfo();
|
|
if (uni.getStorageSync("apply-token")) {
|
|
that.G.checkToken();
|
|
}
|
|
if (uni.getStorageSync("apply-userinfo")) {
|
|
this.corpUserFlag = uni.getStorageSync("apply-userinfo").corpUserFlag;
|
|
}
|
|
|
|
if (this.isAdmin && this.hasPermission) {
|
|
// this.serverList.push({
|
|
// name: "海报分享",
|
|
// icon: "sharing",
|
|
// path: "/root/merchantManagement/posterShare",
|
|
// iconType: 1,
|
|
// });
|
|
}
|
|
},
|
|
onShow() {
|
|
let that = this;
|
|
// if (typeof that.$mp.page.getTabBar === "function" && that.$mp.page.getTabBar()) {
|
|
// that.$mp.page.getTabBar().setData({
|
|
// selected: uni.getAccountInfoSync().miniProgram.appId == "wxb0c590fd696b79be" ? 2 : 3,
|
|
// isShow: true,
|
|
// });
|
|
// }
|
|
if (uni.getStorageSync("apply-token")) {
|
|
this.getPoastList();
|
|
that.setUserInfo();
|
|
that.getResumeInfo();
|
|
} else {
|
|
that.pageSpeed = 1;
|
|
that.isLogin = false;
|
|
that.userinfo.avatar = that.G.store().svgBaseImg + "defaultAva.svg";
|
|
that.userinfo.name = "微信用户";
|
|
that.userinfo.tel = that.miniAppInfo.slogan || "全心全意为老乡服务";
|
|
// that.userinfo.tel = "钱多 活少 离家近";
|
|
that.userinfo.agencyName = "";
|
|
that.userinfo.teamType = 0;
|
|
that.speed = 0;
|
|
}
|
|
},
|
|
methods: {
|
|
getPoastList() {
|
|
let that = this;
|
|
that.G.Post(`/poster/getList`, { pageNum: 1, pageSize: 50, classify: 1 }, (res) => {
|
|
// console.log("resresresresres", res);
|
|
that.poastList = res
|
|
.filter((item, index) => {
|
|
if (index <= 3) {
|
|
return item;
|
|
}
|
|
})
|
|
.map((item) => {
|
|
return {
|
|
url: item.img,
|
|
};
|
|
});
|
|
// console.log("that.poastList", that.poastList);
|
|
});
|
|
},
|
|
getResumeInfo() {
|
|
let that = this;
|
|
that.G.Get(`/yishoudan/order/helper/check/neworder`, {}, (resorder) => {
|
|
that.G.Get(that.api.order_getNewApplyNumNotViewed, {}, (resapply) => {
|
|
that.hasNewResume = resorder + resapply;
|
|
// console.log("that.hasNewResume", that.hasNewResume);
|
|
that.$forceUpdate();
|
|
});
|
|
});
|
|
},
|
|
setUserInfo() {
|
|
let that = this;
|
|
that.speed = 1;
|
|
let userInfo = uni.getStorageSync("apply-userinfo");
|
|
that.isLogin = true;
|
|
that.userinfo.agencyName = userInfo.agencyName;
|
|
that.userinfo.user = userInfo.user;
|
|
that.userinfo.avatar = uni.getStorageSync("apply-userinfo").imgSrc;
|
|
that.userinfo.name = userInfo.userName || userInfo.aliasName;
|
|
that.userinfo.tel = userInfo.tel;
|
|
that.userinfo.agencyName = userInfo.agencyName;
|
|
that.userinfo.teamType = userInfo.teamType;
|
|
},
|
|
goPage($path) {
|
|
this.G.isLogin();
|
|
if (this.G.isLogin()) {
|
|
uni.navigateTo({
|
|
url: $path,
|
|
});
|
|
}
|
|
},
|
|
handleClickNum(e) {
|
|
// console.log("我的服务：", e);
|
|
this.G.isLogin();
|
|
if (this.G.isLogin()) {
|
|
uni.navigateTo({
|
|
url: e.item.path,
|
|
});
|
|
}
|
|
},
|
|
getPoster(e) {
|
|
const that = this;
|
|
this.fakeImg = e;
|
|
that.posterShow = true;
|
|
// uni.showLoading({
|
|
// title: "生成中...",
|
|
// mask: true,
|
|
// });
|
|
that.getWXCanvas(e).then((res) => {
|
|
// console.log("res", res);
|
|
that.currentImg = res.tempFilePath;
|
|
setTimeout(() => {
|
|
this.fakeImg = "";
|
|
}, 100);
|
|
uni.hideLoading();
|
|
});
|
|
},
|
|
// 微信端绘制
|
|
getWXCanvas(sharelImg, type) {
|
|
const that = this;
|
|
return new Promise((resolve) => {
|
|
var mycenter = 0; //文字左右居中显示
|
|
var myheight = 0; //文字高度
|
|
const query = uni.createSelectorQuery().in(this);
|
|
query
|
|
.select("#canvasId")
|
|
.fields({
|
|
node: true,
|
|
size: true,
|
|
})
|
|
.exec((res) => {
|
|
// console.log("uni 获取节点信息：", res);
|
|
// console.log("sharelImg", sharelImg);
|
|
const canvas = res[0].node;
|
|
const ctx = canvas.getContext("2d");
|
|
new Promise(function (resolve) {
|
|
// 绘制背景图片
|
|
uni.getImageInfo({
|
|
src: sharelImg, // 网络图片
|
|
success(res) {
|
|
// console.log("res111", res);
|
|
canvas.width = res.width;
|
|
canvas.height = res.height;
|
|
mycenter = canvas.width / 2;
|
|
myheight = canvas.height;
|
|
const img = canvas.createImage();
|
|
img.src = res.path;
|
|
// console.log("img111", img);
|
|
img.onload = (info) => {
|
|
ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
|
|
// console.log("info111", info);
|
|
resolve(true);
|
|
};
|
|
},
|
|
fail(err) {},
|
|
});
|
|
}).then(() => {
|
|
// console.log("inthen");
|
|
//使用：
|
|
that
|
|
.setShareJobImg(ctx, canvas, mycenter)
|
|
.then(function (canvas1) {
|
|
// console.log("canvas1", canvas1);
|
|
uni.canvasToTempFilePath({
|
|
canvas: canvas1,
|
|
success(res) {
|
|
// console.log("res222", res);
|
|
resolve(res);
|
|
},
|
|
fail(res) {
|
|
uni.hideLoading();
|
|
uni.showToast({
|
|
title: res.errMsg,
|
|
icon: "error",
|
|
});
|
|
},
|
|
});
|
|
})
|
|
.catch((err) => {
|
|
// console.log(err);
|
|
uni.hideLoading();
|
|
uni.showToast({
|
|
title: "生成失败,请重试",
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|
|
},
|
|
// 设置分享布局
|
|
setShareJobImg(ctx, canvas, mycenter, funObj) {
|
|
let that = this;
|
|
let labelLeft = 0;
|
|
// ctx.arcTo()
|
|
let baseTop, QRSize, baseLeft, titleFontSize, contentFontSize;
|
|
baseTop = canvas.height - 412;
|
|
// baseTop = 1470;
|
|
QRSize = 144;
|
|
baseLeft = 80;
|
|
titleFontSize = 54;
|
|
contentFontSize = 36;
|
|
that.G.roundRect1(ctx, mycenter - (canvas.width - 60) / 2, baseTop, canvas.width - 60, 360, 48, "#fff");
|
|
that.G.fillTextLineBreak(ctx, that.miniAppInfo.fullName || that.miniAppInfo.agencyName, baseLeft + 20, baseTop + 162, 300, 64, "#000", titleFontSize, "500"); // 代理名字
|
|
let slogan = that.miniAppInfo.slogan || "全心全意为老乡服务";
|
|
// let slogan = '全新全意为老乡服务'
|
|
that.G.fillTextLineBreak(ctx, slogan, baseLeft + 20, baseTop + 168 + titleFontSize, 600, 48, "#666", contentFontSize, "500"); // slogan
|
|
// miniAppInfo
|
|
return new Promise((imgres) => {
|
|
let p1 = new Promise((resolve) => {
|
|
uni.getImageInfo({
|
|
// src: "https://bocai-cms.oss-cn-beijing.aliyuncs.com/web-resource/dailibaoming/poster/renhaiQRCode.png",
|
|
src: that.miniAppInfo.qrCode,
|
|
success(res) {
|
|
// console.log("res333", res);
|
|
const img = canvas.createImage();
|
|
img.src = res.path;
|
|
img.onload = () => {
|
|
// console.log("ctx", ctx);
|
|
// console.log("canvas", canvas);
|
|
// console.log("that.miniAppInfo.logo", that.miniAppInfo.logo);
|
|
// that.G.roundRect1(ctx, mycenter - 580 / 2, baseTop + 740, 580, 580, 0, "#fff");
|
|
that.G.roundRect(ctx, img, canvas.width - 320, baseTop + 60, 240, 240, 0);
|
|
resolve();
|
|
};
|
|
},
|
|
fail(err) {
|
|
// console.log(err);
|
|
},
|
|
});
|
|
});
|
|
let p2 = new Promise((resolve) => {
|
|
uni.downloadFile({
|
|
url: that.miniAppInfo.logo || "https://matripe.oss-cn-beijing.aliyuncs.com/default.png",
|
|
success(res) {
|
|
// // console.log(res);
|
|
// const img = canvas.createImage();
|
|
// img.src = res.tempFilePath;
|
|
// img.onload = () => {
|
|
// that.G.roundRect(ctx, img, baseLeft, baseTop + 108, QRSize, QRSize, 0);
|
|
// };
|
|
resolve();
|
|
},
|
|
fail(err) {
|
|
// console.log(err);
|
|
},
|
|
});
|
|
});
|
|
Promise.all([p1, p2]).then(() => {
|
|
// setTimeout(() => {
|
|
imgres(canvas);
|
|
// }, 300);
|
|
});
|
|
});
|
|
},
|
|
saveImg() {
|
|
let that = this;
|
|
// console.log("saveImg");
|
|
if (that.fakeImg) return false;
|
|
uni.saveImageToPhotosAlbum({
|
|
filePath: that.currentImg,
|
|
success(res) {
|
|
// console.log(res);
|
|
if (res.errMsg == "saveImageToPhotosAlbum:ok") {
|
|
uni.showToast({
|
|
title: "保存成功 ",
|
|
icon: "none",
|
|
duration: 1500,
|
|
});
|
|
}
|
|
},
|
|
fail(res) {
|
|
// console.log(res);
|
|
uni.showToast({
|
|
title: "图片保存失败",
|
|
icon: "none",
|
|
duration: 1500,
|
|
});
|
|
},
|
|
});
|
|
},
|
|
clickImg(_item) {
|
|
if (uni.getStorageSync("user_qrcode")) {
|
|
this.miniAppInfo.qrCode = uni.getStorageSync("user_qrcode");
|
|
}
|
|
this.getPoster(_item.url);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #ededed;
|
|
}
|
|
.p-person-inedx {
|
|
// min-height: 100vh;
|
|
background-repeat: no-repeat;
|
|
background-size: 100% 100%;
|
|
.m-money {
|
|
width: calc(100vw - 20px);
|
|
margin: 10px auto 0;
|
|
height: 84px;
|
|
background-repeat: no-repeat;
|
|
background-size: 100% 100%;
|
|
overflow: hidden;
|
|
border-radius: 6px;
|
|
.con {
|
|
left: 0;
|
|
top: 50%;
|
|
width: 100%;
|
|
height: 200%;
|
|
transform: translateY(-50%);
|
|
}
|
|
}
|
|
}
|
|
</style>
|