mz666
/
dandelionPlatformToB-uni-v3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

no message

Browse Source
cyl/job_im
jscyl13849007907 9 hours ago
parent 2b45a910e3
commit 867606c7f2
1 changed files with 24 additions and 35 deletions
Show Stats Download Patch File Download Diff File

59
components/myMain.vue
Unescape Escape View File

@ -3,12 +3,12 @@
:style="{ 'background-image': showBg ? 'url(' + cdnBaseImg + 'share_bg.svg)' : '' }" :style="{ 'background-image': showBg ? 'url(' + cdnBaseImg + 'share_bg.svg)' : '' }"
:class="showBg ? 'g_pt_32' : ''"> :class="showBg ? 'g_pt_32' : ''">
<!-- #ifdef MP-WEIXIN --> <!-- #ifdef MP-WEIXIN -->
<view class="g_position_rela" style="width: 343px; height: 635px; margin: 0 auto;"> <view class="g_position_rela" style="width: 343px; height: 567px; margin: 0 auto;">
<div style="height: 16px;"></div> <div style="height: 16px;"></div>
<view v-if="loading" class="g_position_abso g_top_0 g_left_0 g_w_all g_h_all g_flex_row_center flex_center" style="z-index: 10;"> <view v-if="loading" class="g_position_abso g_top_0 g_left_0 g_w_all g_h_all g_flex_row_center flex_center" style="z-index: 10;">
<rh-loading :loading="loading" /> <rh-loading :loading="loading" />
</view> </view>
<image v-show="!loading" :src="shareJobImg" show-menu-by-longpress style="width: 343px; height: 635px; display: block" <image v-show="!loading" :src="shareJobImg" show-menu-by-longpress style="width: 343px; height: 567px; display: block"
mode=""></image> mode=""></image>
</view> </view>
<view v-show="!loading" class="g_text_c g_fs_16 g_mt_28 g_mb_32 g_fw_600">长按图片转发给微信好友</view> <view v-show="!loading" class="g_text_c g_fs_16 g_mt_28 g_mb_32 g_fw_600">长按图片转发给微信好友</view>
@ -349,33 +349,31 @@
size: true, size: true,
}) })
.exec((res) => { .exec((res) => {
// console.log("uni 获取节点信息：", res);
// // console.log("sharelImg", sharelImg);
const canvas = res[0].node; const canvas = res[0].node;
const ctx = canvas.getContext("2d"); const ctx = canvas.getContext("2d");
// 元素整体上移偏移量
const offsetTop = 190;
new Promise(function(resolve) { new Promise(function(resolve) {
// 绘制背景图片
uni.getImageInfo({ uni.getImageInfo({
src: sharelImg, // 网络图片 src: sharelImg,
success(res) { success(res) {
// console.log("res111", res);
canvas.width = res.width; canvas.width = res.width;
canvas.height = res.height + 250; canvas.height = res.height + 250;
mycenter = canvas.width; mycenter = canvas.width;
myheight = canvas.height; myheight = canvas.height;
const img = canvas.createImage(); const img = canvas.createImage();
img.src = res.path; img.src = res.path;
// console.log("img111", img);
img.onload = (info) => { img.onload = (info) => {
// 绘制背景色 // 绘制背景色（圆角矩形）
canvasJS.roundRect1(ctx, 0, 0, canvas.width, canvas.height + 250, 0, baseColor); canvasJS.roundRect1(ctx, 0, 0, canvas.width, canvas.height, 30, baseColor);
// 绘制中间白色背景 // 绘制中间白色背景
canvasJS.roundRect1(ctx, (mycenter - canvas.width + 120) / 2, 280, canvas.width - const whiteTop = 120;
120, canvas.height - 360, 180, "#fff"); const whiteHeight = canvas.height - 240;
canvasJS.roundRect1(ctx, 60, whiteTop, canvas.width - 120, whiteHeight, 60, "#fff");
// 绘制关注发单号背景色 // 绘制关注发单号背景色
canvasJS.roundRect1(ctx, (mycenter - 800) / 2, canvas.height - 600, 800, 136, 135, canvasJS.roundRect1(ctx, (mycenter - 800) / 2, canvas.height - 540 - offsetTop, 800, 136, 135,
baseColor); baseColor);
let qrTop = 1145; let qrTop = 1145 - offsetTop;
// 二维码左上角的 // 二维码左上角的
canvasJS.roundRect1(ctx, (mycenter - 600) / 2 - 5, qrTop, 136, 136, 80, baseColor); canvasJS.roundRect1(ctx, (mycenter - 600) / 2 - 5, qrTop, 136, 136, 80, baseColor);
// 二维码右上角的 // 二维码右上角的
@ -388,40 +386,33 @@
baseColor); baseColor);
// 绘制关注发单号文字 // 绘制关注发单号文字
canvasJS.fillTextLineBreak(ctx, "扫一扫关注我的发单号", (mycenter - "扫一扫关注我的发单号".length * 54) / canvasJS.fillTextLineBreak(ctx, "扫一扫关注我的发单号", (mycenter - "扫一扫关注我的发单号".length * 54) /
2, canvas.height - 515, "扫一扫关注我的发单号".length * 54, 58, that.isLightColor( 2, canvas.height - 445 - offsetTop, "扫一扫关注我的发单号".length * 54, 58, that.isLightColor(
baseColor) ? "#333" : "#fff", 54, 600); // 总职位 baseColor) ? "#333" : "#fff", 54, 600);
canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 300, [{ canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 170 - offsetTop, [{
content: "该图片请不要发给工友", content: "该图片请不要发给工友",
color: "#d30000", color: "#d30000",
fontWeight: 500, fontWeight: 600,
fontSize: 72 fontSize: 72
}]); }]);
canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 200, [{ canvasJS.drawCenteredText(ctx, mycenter, canvas.height - 60 - offsetTop, [{
content: "关注后能直接看到单子的代理费/佣金", content: "关注后能直接看到单子的代理费/佣金",
color: "#333", color: "#333",
fontWeight: 500, fontWeight: 500,
fontSize: 48 fontSize: 48
}]); }]);
// 绘制头像背景色
// canvasJS.roundRect_yuan(ctx, (mycenter - 360) / 2, 110, 360, "#ffffff");
resolve(true); resolve(true);
}; };
}, },
fail(err) { fail(err) {},
// console.log("errerrerrerrerrerrerr", err);
},
}); });
}).then(() => { }).then(() => {
//使用： this.setShareJobImg(ctx, canvas, mycenter, offsetTop)
this.setShareJobImg(ctx, canvas, mycenter)
.then(function(canvas1) { .then(function(canvas1) {
// console.log("canvas1", canvas1);
uni.canvasToTempFilePath({ uni.canvasToTempFilePath({
canvas: canvas1, canvas: canvas1,
success(res) { success(res) {
// console.log("res222", res);
resolve(res); resolve(res);
}, },
fail(res) { fail(res) {
@ -521,17 +512,16 @@
return (num / 10000).toFixed(fixed); return (num / 10000).toFixed(fixed);
}, },
// 设置分享布局 // 设置分享布局
setShareJobImg(ctx, canvas, mycenter, funObj) { setShareJobImg(ctx, canvas, mycenter, offsetTop = 0) {
let that = this; let that = this;
return new Promise((imgres) => { return new Promise((imgres) => {
uni.getImageInfo({ uni.getImageInfo({
src: that.wxCode, src: that.wxCode,
success(res) { success(res) {
const img = canvas.createImage(); const img = canvas.createImage();
// console.log("res333", res);
img.src = res.path; img.src = res.path;
img.onload = () => { img.onload = () => {
canvasJS.roundRect(ctx, img, (mycenter - 600) / 2, 1150, 600, 600, 35); canvasJS.roundRect(ctx, img, (mycenter - 600) / 2, 1150 - offsetTop, 600, 600, 35);
let info = that.appInfo; let info = that.appInfo;
if (!info.logo) { if (!info.logo) {
info.logo = info.logo =
@ -544,13 +534,12 @@
img.src = res.path; img.src = res.path;
img.onload = () => { img.onload = () => {
let numBase = 150; let numBase = 150;
// canvasJS.roundRect(ctx, img, (mycenter - 300) / 2, 140, 300, 300, 150); // logo
canvasJS.fillTextLineBreak(ctx, info.fullName, (mycenter - info.fullName.length * canvasJS.fillTextLineBreak(ctx, info.fullName, (mycenter - info.fullName.length *
80) / 2, 600, info.fullName.length * 80, 200, "#333", 80, 600, "left"); // 企业名称 80) / 2, 600 - offsetTop, info.fullName.length * 80, 200, "#333", 80, 600, "left");
canvasJS.fillTextLineBreak(ctx, canvasJS.fillTextLineBreak(ctx,
`【${info.fullName}】新一代发单号（小程序），海量职位每日更新，线上报名方便快捷，工单状态实时查看。`, numBase - 25, 800, `【${info.fullName}】新一代发单号（小程序），海量职位每日更新，线上报名方便快捷，工单状态实时查看。`, numBase - 25, 800 - offsetTop,
mycenter - 260, 86, "#666", 56, 500, "center"); // slogan mycenter - 260, 86, "#666", 56, 500, "center");
const textSegments = [ const textSegments = [
{ {
content: that.formatNumberAdvanced(info.recruitmentJobNum).toString(), content: that.formatNumberAdvanced(info.recruitmentJobNum).toString(),

Write Preview
Loading…
Cancel
Save