From 8ee1a513247b9f034e5c3cd8b2d68f3a2a75835c Mon Sep 17 00:00:00 2001
From: jscyl_mac <13849007907@163.com>
Date: Wed, 2 Jul 2025 17:24:34 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=B7=A5=E5=8D=95=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 root/detail/apply.vue  |  67 ++++++++---
 root/detail/myMain.vue | 293 +++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 346 insertions(+), 14 deletions(-)
 create mode 100644 root/detail/myMain.vue

diff --git a/root/detail/apply.vue b/root/detail/apply.vue
index 6ac9567..e8a3929 100644
--- a/root/detail/apply.vue
+++ b/root/detail/apply.vue
@@ -157,7 +157,7 @@
 			<view class="g_h_10 g_bg_f_5"></view>
 			<!-- 跟进记录 -->
 			<view class="m-reord">
-				<view class="g_bg_f" style="padding-bottom: 10px; margin-bottom: 60px; padding-top: 32rpx">
+				<view class="g_bg_f" style="padding-bottom: 10px; margin-bottom: 0px; padding-top: 32rpx">
 					<view class="g_flex_row_between" style="padding-top: 0; padding-bottom: 0; padding-right: 32rpx; position: relative; margin-left: 20px; margin-bottom: 36rpx">
 						<view class="g_fs_16 g_c_3 g_flex_column_center">跟进记录</view>
 						<view @click="handleOpenRemarkModal">
@@ -353,25 +353,34 @@
 		</u-popup>
 		
 		<view class="g_h_104" style="background-color: #ededed;"></view>
-				<g-panel-fixed style="box-shadow: 0 -4px 12px #ededed;">
-					<slot>
-						<view class="g_pl_20 g_pr_20 g_flex_row_center flex_center flex_nw" style="width: 100%">
-							<view class="g_flex_1 g_flex_column_center">
-								<view class="">
-									<button open-type="share" 
-													class="g_flex_c"
-													style="background-color: #00b666;color: #fff;width: 250px;height: 42px;font-size: 18px;border-radius: 60px;"
-									>分享</button>
-								</view>
-							</view>
+		<g-panel-fixed style="box-shadow: 0 -4px 12px #ededed;">
+			<slot>
+				<view class="g_pl_20 g_pr_20 g_flex_row_center flex_center flex_nw" style="width: 100%">
+					<view class="g_flex_1 g_flex_column_center">
+						<view class="">
+							<button 
+							    @click="createImage"
+								class="g_flex_c"
+								style="background-color: #00b666;color: #fff;width: 250px;height: 42px;font-size: 18px;border-radius: 60px;"
+							>分享</button>
 						</view>
-					</slot>
-				</g-panel-fixed>
+					</view>
+				</view>
+			</slot>
+		</g-panel-fixed>
+
+		<u-popup v-model="shareModal.isShow" mode="bottom" border-radius="16" height='600px' :mask-close-able="true">
+			<mainPanel :showBg="true" :active="1" :recommendList="recommendList[0]" />
+		</u-popup>
 	</view>
 </template>
 
 <script>
+import mainPanel from "./myMain.vue";
 export default {
+	components:{
+		mainPanel
+	},
 	onReady() {
 		this.G.setNavStyle();
 	},
@@ -380,6 +389,10 @@ export default {
 	},
 	data() {
 		return {
+			recommendList:[],
+			shareModal:{
+				isShow:false,
+			},
 			cdnBaseImg: this.G.store().cdnBaseImg,
 			agencyId: uni.getStorageSync("apply-agencyId"),
 			isCreator: false, //管理人员判断
@@ -466,15 +479,41 @@ export default {
 		this.type = options.type;
 	},
 	onShow() {
+		let that = this;
 		this.isCreator = uni.getStorageSync("IS_CREATOR") == 1 ? true : false;
 		this.getResident();
 		this.getPeople();
 		this.getDetail();
+		that.G.Get(
+			that.api.bind_enterpriseDetail + "/" + uni.getStorageSync("apply-agencyId"),
+			{
+				agencyId: uni.getStorageSync("apply-agencyId"),
+				type: 1,
+			},
+			(res) => {
+				console.log("recommendList", res);
+				that.recommendList = [res];
+				console.log("--", that.recommendList);
+			}
+		);
 		uni.$on("infoUpdate", () => {
 			this.getDetail();
 		});
 	},
 	methods: {
+		setShareImg(e) {
+			console.log(e);
+			this.shareImg = e;
+		},
+		getCode(e) {
+			console.log("获取返回数据：", e);
+			this.wxCode = e.code;
+			this.agencyName = e.agencyName;
+		},
+		createImage(){
+			let that = this;
+			that.shareModal.isShow = true;
+		},
 		handleClickLabelBtn($data) {
 			var that = this;
 			var text = "";
diff --git a/root/detail/myMain.vue b/root/detail/myMain.vue
new file mode 100644
index 0000000..4cabe58
--- /dev/null
+++ b/root/detail/myMain.vue
@@ -0,0 +1,293 @@
+<template>
+	<view class="p-root-bind-my-main g_w_all g_h_all g_bg_f_5 g_kuaishou" 
+	      :class="showBg ? 'g_pt_32' : ''"
+	>
+		<image :src="shareJobImg" show-menu-by-longpress style="width: 343px; height: 555px; margin: 0 auto; display: block" mode=""></image>
+		<view class="g_text_c g_fs_16 g_mt_12 g_fw_600" style="background-color: #ededed;">长按图片转发给微信好友</view>
+		<view v-if="allowClick">
+			<view class="g_h_100" style="background-color: #ededed;"></view>
+			<g-panel-fixed>
+				<slot>
+					<view class="g_flex_row_center">
+						<g-button btnText="保存图片" size="small" type="default" @clickBtn="saveWXImageToAlbum"></g-button>
+						<g-button btnText="直接转发" class="g_ml_16" size="small" openType="share" type="primary"></g-button>
+					</view>
+				</slot>
+			</g-panel-fixed>
+		</view>
+		<canvas type="2d" style="position: absolute; left: -2000px; width: 425px; height: 350px; " id="canvasId" ref="canvasId"></canvas>
+	</view>
+</template>
+<script>
+export default {
+	onReady() {
+		this.G.setNavStyle();
+	},
+	onShareAppMessage() {
+		return this.G.shareFun();
+	},
+	data() {
+		return {
+			localBaseImg: this.G.store().localBaseImg,
+			cdnBaseImg: this.G.store().cdnBaseImg,
+			wxCode: "",
+			appCodeSize: 0,
+			appLogoSize: 0,
+			appCodeTop: 0,
+			appLogoTop: 0,
+			appLogoLeft: 0,
+			agencyName: "",
+			shareJobImg: "",
+			allowClick: false,
+			appInfo: {},
+			appfile: null,
+			canvasWidth: 0,
+			canvasHeight: 0,
+		};
+	},
+	props: {
+		showBg: {
+			type: Boolean,
+			default: () => {
+				return true;
+			},
+		},
+		active: {
+			default: 0,
+		},
+		recommendList: {
+			type: Object,
+			default: () => {
+				return {
+					logo: "",
+					jobNum: 0,
+					jobUpdateNum: 0,
+					recruitmentJobNum: 0,
+					downNum: 0,
+				};
+			},
+		},
+	},
+	created() {
+		let that = this;
+		uni.getImageInfo({
+			src: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/dailibaoming/canvasBg.png", // 网络图片
+			success(res) {
+				that.canvasWidth = res.width;
+				that.canvasHeight = res.height;
+			},
+		});
+		this.init();
+		// uni.showLoading({
+		// 	title: "生成中...",
+		// });
+	},
+	watch: {
+		shareJobImg(newValue, oldValue) {
+			if (newValue) {
+				uni.hideLoading();
+			}
+		},
+		recommendList(val) {
+			let that = this;
+			console.log("watch:", val);
+			// uni.showLoading({
+			// 	title: "生成中...",
+			// });
+			that.appInfo = val;
+			this.init();
+		},
+	},
+	methods: {
+		init() {
+			let that = this;
+			that.appInfo = that.recommendList;
+			console.log("that.appInfo", that.appInfo);
+			let _env = uni.getAccountInfoSync().miniProgram.envVersion;
+			that.G.Get(
+				that.api.bind_getCode,
+				{
+					env: _env,
+				},
+				(res) => {
+					console.log("获取邀请码：", res);
+					that.wxCode = "https://daotian.matripe.com.cn" + res.qrcode;
+					that.agencyName = res.agencyName;
+					// #ifdef MP-WEIXIN
+					console.log("canvasRes1");
+
+					that.getWXCanvas("https://matripe-cms.oss-cn-beijing.aliyuncs.com/dailibaoming/canvasBg.png").then((canvasRes) => {
+						console.log("canvasRes", canvasRes);
+						that.shareJobImg = canvasRes.tempFilePath;
+						that.allowClick = true;
+						that.$emit("setImg", that.shareJobImg);
+					});
+					that.$emit("exportCode", {
+						code: res.code,
+						agencyName: res.agencyName,
+					});
+					// #endif
+				}
+			);
+		},
+		// 微信端绘制
+		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;
+									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(() => {
+							//使用：
+							this.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) => {
+									uni.hideLoading();
+									uni.showToast({
+										title: "生成失败,请重试",
+									});
+								});
+						});
+					});
+			});
+		},
+
+		// 微信端下载
+		saveWXImageToAlbum() {
+			let that = this;
+			uni.saveImageToPhotosAlbum({
+				filePath: that.shareJobImg,
+				success() {
+					uni.showToast({
+						title: "保存成功",
+					});
+				},
+				fail(err) {
+					uni.showToast({
+						title: "保存失败, 请重试",
+					});
+				},
+			});
+		},
+		// 设置分享布局
+		setShareJobImg(ctx, canvas, mycenter, funObj) {
+			let that = this;
+			return new Promise((imgres) => {
+				uni.getImageInfo({
+					src: that.wxCode,
+					success(res) {
+						const img = canvas.createImage();
+						console.log("res333", res);
+						img.src = res.path;
+						img.onload = () => {
+							that.G.roundRect(ctx, img, (mycenter - 488) / 2, 1160, 488, 488, 0);
+							let info = that.recommendList;
+							console.log("info", info);
+							if (!info.logo) {
+								info.logo = "https://matripe-cms.oss-cn-beijing.aliyuncs.com/ibocai/defaultAvatar.png";
+							}
+							console.log("that.recommendList333", that.recommendList);
+							uni.getImageInfo({
+								src: info.logo,
+								success(res) {
+									console.log("res444", res);
+									const img = canvas.createImage();
+									img.src = res.path;
+									img.onload = () => {
+										that.G.roundRect(ctx, img, 915, 218, 272, 272, 136); // logo
+										that.G.fillTextLineBreak(ctx, info.fullName, 140, 300, info.fullName.length * 80, 80, "#333", 80, 600, "left"); // 企业名称
+										that.G.fillTextLineBreak(ctx, "今日更新职位" + info.jobUpdateNum, 140, 400, ("今日更新职位" + info.jobUpdateNum).length * 56, 56, "#999", 56, 500, "left"); // 今日更新职位
+
+										that.G.fillTextLineBreak(ctx, info.jobNum.toString(), 230, 620, info.jobNum.toString().length * 88, 88, "#333", 88, 600); // 总职位
+										that.G.fillTextLineBreak(ctx, info.recruitmentJobNum.toString(), 480, 620, info.recruitmentJobNum.toString().length * 88, 88, "#333", 88, 600); // 在招数
+										that.G.fillTextLineBreak(ctx, info.downNum.toString(), 730, 620, info.downNum.toString().length * 88, 88, "#333", 88, 600); // 粉丝数
+
+										that.G.fillTextLineBreak(ctx, "总职位", 230, 700, "总职位".length * 56, 56, "#999", 56, 500); // 总职位
+										that.G.fillTextLineBreak(ctx, "在招数", 480, 700, "在招数".length * 56, 56, "#999", 56, 500); // 在招数
+										that.G.fillTextLineBreak(ctx, "粉丝数", 730, 700, "粉丝数".length * 56, 56, "#999", 56, 500); // 粉丝数
+										imgres(canvas);
+									};
+								},
+								fail(err) {},
+							});
+						};
+					},
+					fail(err) {},
+				});
+			});
+		},
+		// 扫一扫
+		handleOpenCamera() {
+			let that = this;
+			that.G.handleScanCode();
+		},
+	},
+};
+</script>
+
+<style lang="scss">
+.p-root-bind-my-main {
+	background-size: 100% 100%;
+	background-repeat: no-repeat;
+	.canvas-card {
+		background-size: 100% 100%;
+		background-repeat: no-repeat;
+		width: calc(100vw - 32px);
+		height: calc(calc(100vw - 32px) * 2248 / 1372);
+	}
+	.m-card {
+		top: calc(calc(calc(100vw - 32px) * 2248 / 1372) * (36 / 562));
+		border-radius: 15px;
+		width: calc(100vw - 74px);
+		height: calc(calc(calc(100vw - 32px) * 2248 / 1372) * (198 / 562));
+	}
+}
+</style>