<template>
	<view class="p-root-sharejob g_w_all g_bg_f_5" hover-class="none" hover-stop-propagation="false">
		<div class="m-search g_p_10 g_pt_8 bg_shawdoc" style="" id="searchInputBox">
			<u-search height="40" @btnSearch="searchJob" @clear="searchJob" v-model="keyword" class="g_flex_1" placeholder="搜索职位名称" bg-color="#fff" :show-action="false" placeholder-class="g_c_c" search-icon-color="#999999" :maxlength="20"></u-search>
			<div class="g_w_all g_h_40 g_position_abso" style="left: 0; z-index: 9999" @click.stop="searchJob"></div>
		</div>
		<scroll-view class="m-list" id="listBox" :style="{ height: `calc(${navInfo.windowHeight}px - 145px)` }" :scroll-y="true" @scrolltolower="reachBottom">
			<!-- <div class="g_kuaishou"> -->

			<g-yi-list-job from="share" class="g_flex_1" :list="query.list" @clickCard="goDetail" @checkJob="checkJob" :loading="loading" :speed="speed" :query="query" :isShowLoginBtn="isLogin ? false : true" />
		</scroll-view>
		<div class="shareBottom g_flex_row_between flex_center" hover-class="none" hover-stop-propagation="false">
			<div class hover-class="none" hover-stop-propagation="false">
				已选
				<span class="g_c_main">{{ checkedList.length }}</span>
			</div>
			<div class="g_flex_row_start" hover-class="none" hover-stop-propagation="false">
				<!-- bindtap="shareJobList" -->
				<button :hover-class="checkedList.length > 0 ? 'btnHover' : ''" :open-type="checkedList.length > 0 ? 'share' : ''" :class="checkedList.length > 0 ? '' : 'ban'">分享职位</button>
				<button :hover-class="checkedList.length > 0 ? 'btnHover' : ''" @click="copyTrans" :class="checkedList.length > 0 ? '' : 'ban'">复制详单</button>
				<button :hover-class="checkedList.length > 0 && checkedList.length <= 3 ? 'btnHover' : ''" @click="sharePoster" :class="checkedList.length > 0 && checkedList.length <= 3 ? '' : 'ban'">分享海报</button>
			</div>
		</div>
		<!-- </div> -->
		<canvas type="2d" style="position: absolute; left: -2000px; width: 425px; height: 350px; background: #fff" id="canvasId"></canvas>
		<u-popup v-model="posterShow" mode="bottom" :closeable="true" uZindex="9999" width="694rpx" height="80vh" border-radius="12" :mask-close-able="true">
			<div class="g_text_c g_pt_24 g_pb_24">
				<image class="posterImg g_pb_24" :src="posterImg" :show-menu-by-longpress="true" mode="aspectFit|aspectFill|widthFix" lazy-load="false"></image>
				<g-button btnText="保存到相册" type="primary" class="g_mt_32" @clickBtn="saveToalbum"></g-button>
			</div>
		</u-popup>
	</view>
</template>

<script>
export default {
	onReady() {
		this.G.setNavStyle();
	},
	onShareAppMessage: function () {
		// `1231`
		// var path = commonUtil.getCurrentPageUrlWithArgs();
		// if (app.globalData.isLogin && app.globalData.agencyStatus - 0 != 0) {
		//   //当前用户是代理人
		//   path += (path.indexOf("?") >= 0 ? "&" : "?") + "agencyUserId=" + app.globalData.loginUserInfo.id;
		// }
		if (this.checkedList.length == 0) {
			throw Error;
		} else {
			return {
				promise: new Promise((resolve, reject) => {
					var arr = [];
					this.checkedList.forEach((item) => {
						arr.push(item.id);
					});
					this.getCanvas(this.shareJobBaseImg, "setJob").then((res) => {
						console.log(res);
						wx.hideLoading();
						resolve({
							title: "你想找的厂都有，立即查看??",
							imageUrl: res.tempFilePath,
							path: `/root/detail/shareList?scene=ids=${arr.join("_")},u=${this.userInfo.id}`,
							// path: '/pages/shareList/index'
						});
						// return
					});
				}),
			};
		}
	},
	data() {
		return {
			cdnBaseImg: this.G.store().cdnBaseImg,
			agencyId: uni.getStorageSync("apply-agencyId"),
			userInfo: uni.getStorageSync("apply-userinfo"),
			loading: true,
			speed: -1,
			query: {
				page: 1,
				size: 20,
				list: [],
				isFinish: -1,
				ujc: 0, // 0 全部 1收藏
			},
			isLogin: true,
			keyword: "",
			checkedList: [],
			posterShow: false,
			navInfo: {},
			shareJobBaseImg: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/1shoudan/poster0106.png", // 分享职位基础图片
			sharelImg: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/2023-09-01/7ca85384-9f22-474d-893f-092b61de684d_share.png", // 分享职位基础图片
			currCode: "",
			posterImg: "", // 海报图片
		};
	},
	onLoad(options) {
		console.log("options", options);
		this.navInfo = this.G.getNavInfo();

		this.getList();
	},
	onShow() {},
	methods: {
		getList($type = "init") {
			let that = this;
			that.G.Post(
				that.api.yi_job_list,
				{
					pageNum: that.query.page,
					pageSize: that.query.size,
					keys: that.keyword,
					// ujc: that.query.ujc,

					// recruitment: 1,
					// classify: 1,
					// sex: -1,
					// workTypeStr: "",
					// lat: "",
					// lng: "",
					// jobClassify: "",
					// sortTag: 0,
					// jobSpecialLabelIds: "",
					// cityName: "",
					// brandIds: "",
					// jobCategoryLabelIds: "",
				},
				(res) => {
					console.log("一才职位列表：", res);
					if (res.pageBean.recordCount == 0) {
						that.loading = false;
					} else {
						that.loading = true;
					}
					that.speed = res.pageBean.recordCount;
					that.query.isFinish = res.pageBean.recordList.length;
					if (res.pageBean.recordList && res.pageBean.recordList.length > 0) {
						res.pageBean.recordList = that.G.toGetAddress(res.pageBean.recordList);
						res.pageBean.recordList = that.G.toGetAge(res.pageBean.recordList);
						res.pageBean.recordList = that.G.yijobCopy(res.pageBean.recordList);
					}
					res.pageBean.recordList.forEach((item, index1) => {
						if (item.logo.indexOf("http:") > -1) {
							item.logo = item.logo.indexOf("http:") > -1 ? item.logo.replace("http:", "https:") : item.logo;
							console.log(item);
						}
						try {
							console.log(item1);
							that.checkedList.forEach((item1, index1) => {
								if (item1.id == item.id) {
									item.checked = true;
									throw Error;
								} else {
									item.checked = false;
								}
							});
						} catch (error) {}
					});
					if ($type == "init") {
						that.query.list = [];
						that.query.list = res.pageBean.recordList.map((item, index) => {
							return {
								...item,
								collected: item.collected ? true : false,
								cus_price: item.salaryClassify != 7 ? that.G.getSalaryClassifyValueHtml(item.salaryClassify, item.salaryClassifyValue) : "月薪",
								salaryClassifyValue: item.salaryClassify != 7 ? that.G.getSalaryClassifyValue(item.salaryClassify, item.salaryClassifyValue) : "月薪",
								jobDesp: item.jobDesp.replaceAll("*****", "").split("————————")[0],
                gender: that.G.getGenderByMinAge(item),
							};
						});
					} else {
						that.query.list = that.query.list.concat(
							res.pageBean.recordList.map((item, index) => {
								return {
									...item,
									collected: item.collected ? true : false,
									cus_price: item.salaryClassify != 7 ? that.G.getSalaryClassifyValueHtml(item.salaryClassify, item.salaryClassifyValue) : "月薪",
									salaryClassifyValue: item.salaryClassify != 7 ? that.G.getSalaryClassifyValue(item.salaryClassify, item.salaryClassifyValue) : "月薪",
									jobDesp: item.jobDesp.replaceAll("*****", "").split("————————")[0],
									gender: that.G.getGenderByMinAge(item),
								};
							})
						);
					}
				}
			);
		},
		searchJob(e) {
			console.log(e);
			this.query.page = 1;
			this.checkedList = [];
			this.getList();
		},
		reachBottom() {
			let that = this;
			// if (!uni.getStorageSync("apply-token") && that.tabInfo.active == 1) {
			// 	return false;
			// }
			that.query.page++;
			that.getList("concat");
		},
		checkJob(_item) {
			if (_item) {
				let index = this.query.list.findIndex((i) => {
					return i.id == _item.id;
				});
				this.query.list[index].checked = !this.query.list[index].checked;
				this.checkedList = [];
				this.query.list.forEach((item) => {
					if (item.checked == true) {
						this.checkedList.push(item);
					}
				});
				console.log(this.checkedList);
			}
		},

		/**
		 * 复制转发选中职位的通告信息
		 */
		copyTrans() {
			if (this.checkedList.length > 0) {
				let str = "";
				this.checkedList.forEach((item, index) => {
					console.log(item);
					console.log(item.jobDesp);
					let subStr;
					if (item.jobDesp) {
						subStr = item.jobDesp + (this.userInfo.agencyStatus == 1 ? (this.userInfo.noticeEndStr ? this.userInfo.noticeEndStr : "详情咨询：" + this.userInfo.tel) : "详情咨询：" + (this.serviceInfo.userName || "") + (this.serviceInfo.workPhone || "-")) + (index < this.checkedList.length - 1 ? "\n\n\n" : "");
					} else if (item.jobInfo) {
						// 通告中是否有职位名的判断, 没有就手动拼接
						// if (item.jobInfo.indexOf(item.jobName) > -1) {
						// 	subStr = item.jobInfo + (this.userInfo.agencyStatus == 1 ? (this.userInfo.noticeEndStr ? this.userInfo.noticeEndStr : "\n\n详情咨询：" + this.userInfo.tel) : "\n\n详情咨询：" + (this.serviceInfo.userName || "") + (this.serviceInfo.workPhone || "-")) + (index < this.checkedList.length - 1 ? "\n\n\n" : "");
						// } else {
						subStr = `【${item.jobName}】` + "\n\n" + item.jobInfo + (this.userInfo.agencyStatus == 1 ? (this.userInfo.noticeEndStr ? this.userInfo.noticeEndStr : "\n\n详情咨询：" + this.userInfo.tel) : "\n\n详情咨询：" + (this.serviceInfo.userName || "") + (this.serviceInfo.workPhone || "-")) + (index < this.checkedList.length - 1 ? "\n\n\n" : "");
						// }
					}
					str += subStr;
				});
				wx.setClipboardData({
					data: str,
					success(res) {
						wx.getClipboardData({
							success(res) {
								console.log(res.data); // data
								wx.showToast({
									title: "通告内容已复制",
									icon: "none",
									duration: 1500,
								});
							},
						});
					},
				});
			}
		},
		/**
		 * 分享海报生成海报图并转发
		 */
		sharePoster() {
			console.log(this.checkedList);
			if (this.checkedList.length == 0 || this.checkedList.length > 3) {
				return;
			}
			wx.showLoading({
				title: "生成中...",
			});

			this.getCode().then((res) => {
				setTimeout(() => {
					this.getCanvas(this.sharelImg, "setShare").then((res) => {
						console.log(res);
						wx.hideLoading();
						this.posterImg = res.tempFilePath;
						this.$forceUpdate();
						this.posterShow = true;
					});
				}, 10);
			});
			// this.setData({
			// });
		},
		getCode() {
			var that = this;
			return new Promise((resolve, reject) => {
				// if (this.checkedList.length == 1) {
				// 	that.G.Get(that.api.get_singlejob_QRcode + `/${that.checkedList[0].id}`, {}, (res) => {
				// 		console.log(res);
				// 		that.currCode = res.qrcode;
				// 		resolve();
				// 	});
				// } else {
				that.G.Get(that.api.get_job_QRcode, { storeJobIds: that.checkedList.map((item) => item.id).join(",") }, (res) => {
					console.log(res);
					that.currCode = res.qrcode;
					resolve();
				});
				// }
			});
		},
		getCanvas(sharelImg, type) {
			const that = this;
			console.log(sharelImg);
			return new Promise((resolve) => {
				var mycenter = 0; //文字左右居中显示
				var myheight = 0; //文字高度
				const query = wx.createSelectorQuery();
				query
					.select("#canvasId")
					.fields({ node: true, size: true })
					.exec((res) => {
						console.log(res);
						const canvas = res[0].node;
						const ctx = canvas.getContext("2d");
						new Promise(function (resolve) {
							// 绘制背景图片
							wx.getImageInfo({
								src: sharelImg, // 网络图片
								success(res) {
									console.log(res);
									var width = res.width;
									var height = res.height;
									mycenter = width / 2;
									myheight = height;
									canvas.width = width;
									canvas.height = height;
									const img = canvas.createImage();
									console.log(ctx);
									img.src = res.path;
									img.onload = (info) => {
										console.log(info);
										ctx.drawImage(img, 0, 0, width, height);
										resolve(true);
									};
								},
								fail(err) {
									console.log(err);
								},
							});
						}).then(() => {
							const fillTextLineBreak = (ctx, text, x, y, lw, lh, color = "#333", font = "32", weight = "500") => {
								var i = 0;
								var n = 0;
								var r = -1;
								var initHeight = 0;
								ctx.font = weight + " " + font + "px Arial"; //字体大小
								console.log("text", text);
								ctx.fillStyle = color; //字体颜色
								while (i < text.length) {
									while (ctx.measureText(text.substring(n, i)).width < lw && i < text.length) {
										i++;
									}
									r++;
									ctx.fillText(text.substring(n, i), x, y + lh * r);
									n = i;
								}
								initHeight = lh * r;
								// wx.setStorageSync("initHeight", initHeight);
							};
							const roundRect = (ctx, img, bg_x, bg_y, bg_w, bg_h, bg_r) => {
								// 开始绘制
								ctx.save();
								ctx.beginPath();
								ctx.arc(bg_x + bg_r, bg_y + bg_r, bg_r, Math.PI, Math.PI * 1.5);
								ctx.arc(bg_x + bg_w - bg_r, bg_y + bg_r, bg_r, Math.PI * 1.5, Math.PI * 2);
								ctx.arc(bg_x + bg_w - bg_r, bg_y + bg_h - bg_r, bg_r, 0, Math.PI * 0.5);
								ctx.arc(bg_x + bg_r, bg_y + bg_h - bg_r, bg_r, Math.PI * 0.5, Math.PI);
								ctx.clip();
								ctx.drawImage(img, bg_x, bg_y, bg_w, bg_h);
								// 恢复之前保存的绘图上下文
								ctx.restore();
							};
							const roundRect_yuan = (ctx, x, y, size) => {
								// 开始绘制
								ctx.save(); // 保存
								ctx.beginPath(); // 开始绘制
								// ctx.arc(100, 75, 50, 0, 2 * Math.PI)
								ctx.arc(size / 2 + x, size / 2 + y, size / 2, 0, Math.PI * 2, false);
								ctx.clip();
								// 恢复之前保存的绘图上下文
								ctx.restore();
							};
							function roundRect1(ctx, x, y, w, h, r, color) {
								//绘制圆角矩形(无填充色))
								ctx.save();
								ctx.fillStyle = color;
								ctx.strokeStyle = color;
								ctx.lineJoin = "round"; //交点设置成圆角
								ctx.lineWidth = r;
								ctx.strokeRect(x + r / 2, y + r / 2, w - r, h - r);
								ctx.fillRect(x + r, y + r, w - r * 2, h - r * 2);
								ctx.stroke();
								ctx.closePath();
							}
							//使用：
							console.log(canvas);
							if (type == "setJob") {
								this.setShareJobImg(ctx, canvas, { roundRect1, roundRect_yuan, roundRect, fillTextLineBreak })
									.then(function (canvas1) {
										wx.canvasToTempFilePath({
											canvas: canvas1,
											success(res) {
												console.log(res);
												resolve(res);
											},
											fail(res) {
												wx.hideLoading();
												wx.showToast({
													title: res.errMsg,
													icon: "error",
												});
											},
										});
									})
									.catch((err) => {
										console.log(err);
										wx.hideLoading();
										wx.showToast({
											title: "生成失败,请重试",
										});
									});
							} else if (type == "setShare") {
								this.setShareImg(ctx, canvas, mycenter, { roundRect1, roundRect_yuan, roundRect, fillTextLineBreak })
									.then(function (canvas1) {
										wx.canvasToTempFilePath({
											canvas: canvas1,
											success(res) {
												console.log(res);
												resolve(res);
											},
											fail(res) {
												wx.hideLoading();
												wx.showToast({
													title: res.errMsg,
													icon: "error",
												});
											},
										});
									})
									.catch((err) => {
										console.log(err);
										wx.hideLoading();
										wx.showToast({
											title: "生成失败,请重试",
										});
									});
							}
						});
					});
			});
		},
		/**
		 * 分享海报生成图片
		 */
		setShareImg(ctx, canvas, mycenter, funObj) {
			let that = this;
			return new Promise((imgres) => {
				// ctx.arcTo()
				let baseTop, logoLeft, logoSize, titleSize, ageTop, salaryClassifyValueLeft, salaryClassifyValueTop, monthlyPaySize, position, markTop, roundRectHeight, fubiaotiTop, bottomSloganTop, bottomSloganTop1, bottomSloganLeft, bottomSloganLeft1, QRSize, QRLeft, QRTop;
				let baseMiddle = 248 * 2;
				if (that.checkedList.length == 1) {
					baseTop = 2 * 370;
					bottomSloganTop = 2 * 355;
					bottomSloganTop1 = 2 * 700;
					QRSize = 2 * 260;
					QRTop = 770;
				} else {
					baseTop = 2 * 294;
					bottomSloganTop = 2 * 740;
					bottomSloganTop1 = 2 * 790;
					bottomSloganLeft = 64;
					bottomSloganLeft1 = 64;
					QRSize = 2 * 110;
					QRLeft = 900;
					QRTop = 1400;
				}
				fubiaotiTop = 2 * 213;
				logoLeft = 56 * 2;
				logoSize = 2 * 80;
				titleSize = 2 * 30;
				roundRectHeight = 2 * 226;
				ageTop = 2 * 92;
				salaryClassifyValueLeft = 2 * 156;
				salaryClassifyValueTop = 2 * 48;
				monthlyPaySize = 2 * 24;
				markTop = 2 * 115;
				console.log(123);
				console.log("https://daotian.matripe.com.cn" + that.currCode);
				wx.getImageInfo({
					// src: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/1shoudan/qrcode.png", //网络图片,如果不行请换一个
					src: "https://daotian.matripe.com.cn" + that.currCode,
					success(res) {
						console.log("currCode", res);
						const img = canvas.createImage();
						img.src = res.path;
						img.onload = () => {
							if (that.checkedList.length == 1) {
								funObj.roundRect1(ctx, mycenter - 580 / 2, baseTop + 740, 580, 580, 0, "#fff");
								// roundRect1(ctx, mycenter - 600 / 2, baseTop + 750, 600, 560, 0, "#fff");
								funObj.roundRect(ctx, img, mycenter - res.width / 2 - 120, baseTop + 770, QRSize, QRSize, 0);
								// funObj.roundRect(ctx, img, mycenter - res.width / 2 - 120, baseTop + 770, QRSize, QRSize, 0);
							} else {
								funObj.roundRect1(ctx, QRLeft - 10, baseTop + QRTop - 10, QRSize + 20, QRSize + 20, 0, "#fff");
								funObj.roundRect(ctx, img, QRLeft, baseTop + QRTop, QRSize, QRSize, 0);
							}
							that.checkedList.forEach((item, index) => {
								let labelLeft = 0;
								console.log("item", item);
								funObj.roundRect1(ctx, 24 * 2, baseTop - 100 + baseMiddle * index, 1104, roundRectHeight, 32, "#fff");
								item.jobSpecialLabelNameArray.forEach((item1) => {
									funObj.fillTextLineBreak(ctx, item1, 60 * 2 + labelLeft, baseTop + markTop + 30 * 2 + baseMiddle * index, 400 * 2, 20, "#333", monthlyPaySize); // 标签字符
									funObj.roundRect1(ctx, 52 * 2 + labelLeft, baseTop + markTop + baseMiddle * index, ctx.measureText(item1).width + 16 * 2, 40 * 2, 2 * 2, "#00000010"); // 标签背景色
									labelLeft += ctx.measureText(item1).width + 32 * 2;
								});

								funObj.fillTextLineBreak(ctx, item.jobName, logoLeft, baseTop + baseMiddle * index, 500 * 2, 20, "#333", titleSize, "600"); // 岗位标题

								funObj.fillTextLineBreak(ctx, item.salaryClassifyValue, salaryClassifyValueLeft, baseTop + salaryClassifyValueTop + baseMiddle * index, 400 * 2, 20, "#ff4400", titleSize - 4, "600"); // 时薪

								// setTimeout(() => {
								funObj.fillTextLineBreak(ctx, item.monthlyPay, salaryClassifyValueLeft + ctx.measureText(item.salaryClassifyValue + " ").width, baseTop + salaryClassifyValueTop + baseMiddle * index, 400 * 2, 20, "#ff4400", monthlyPaySize, "400"); // 月工资
								// }, 0);

								funObj.fillTextLineBreak(ctx, item.district, salaryClassifyValueLeft, baseTop + ageTop + baseMiddle * index, 500 * 2, 20, "#333", monthlyPaySize); // 省市

								funObj.fillTextLineBreak(ctx, item.age, salaryClassifyValueLeft + ctx.measureText(item.district).width, baseTop + ageTop + baseMiddle * index, 500 * 2, 20, "#333", monthlyPaySize); // 年龄

								funObj.fillTextLineBreak(ctx, that.userInfo.agencyName, mycenter - ctx.measureText(that.userInfo.agencyName).width / 2, fubiaotiTop, 400 * 2, 20, "#fff", monthlyPaySize, "600"); // 代理名称

								if (that.checkedList.length == 1) {
									// roundRect1(ctx, mycenter - 600 / 2, baseTop + 750, 600, 560, 32, "#fff");
									// funObj.fillTextLineBreak(ctx, "长按查看职位详情", mycenter - ctx.measureText("长按查看职位详情").width / 2, baseTop + bottomSloganTop, 300 * 2, 20, "#fff", monthlyPaySize); // 底部slogan
									funObj.fillTextLineBreak(ctx, "长按查看职位详情", mycenter - ctx.measureText("长按查看职位详情").width / 1.45, baseTop + bottomSloganTop1, 500 * 2, 20, "#fff", titleSize); // 底部slogan
								} else {
									funObj.fillTextLineBreak(ctx, "长按查看职位详情", bottomSloganLeft, baseTop + bottomSloganTop, 300 * 2, 20, "#fff", monthlyPaySize + 8); // 底部slogan
									funObj.fillTextLineBreak(ctx, "好工作 放心干", bottomSloganLeft1, baseTop + bottomSloganTop1, 500 * 2, 20, "#fff", titleSize); // 底部slogan
								}
								//生成logo图片
								wx.getImageInfo({
									src: item.logo, //网络图片,如果不行请换一个
									success(res) {
										// console.log(res);

										const img = canvas.createImage();
										// console.log(ctx);
										img.src = res.path;
										img.onload = () => {
											// setTimeout(() => {
											funObj.roundRect(ctx, img, logoLeft, baseTop + 40 + baseMiddle * index, logoSize, logoSize, 8);
											// }, 500);
											if (index == that.checkedList.length - 1) {
												setTimeout(() => {
													imgres(canvas);
												}, 100);
											}
										};
									},
									fail(err) {
										console.log(err);
									},
								});
							});
						};
					},
					fail(err) {
						console.log("err", err);
					},
				});

				// setTimeout(() => {
				// },500);
			});
		},
		/**
		 * 分享职位卡片
		 */
		setShareJobImg(ctx, canvas, funObj) {
			let that = this;
			return new Promise((imgres) => {
				// ctx.arcTo()
				let baseTop, logoLeft, titleSize, ageTop, salaryClassifyValueLeft, salaryClassifyValueTop, monthlyPaySize, roundRectHeight, fubiaotiTop;
				let baseMiddle = 175;
				baseTop = 204;
				logoLeft = 60;
				titleSize = 40;
				roundRectHeight = 156;
				ageTop = 62;
				salaryClassifyValueLeft = 56;
				salaryClassifyValueTop = 10;
				monthlyPaySize = 32;
				console.log(123);
				that.checkedList.forEach((item, index) => {
					if (index <= 2) {
						let labelLeft = 0;
						console.log("item", item);
						funObj.roundRect1(ctx, 32, baseTop - 60 + baseMiddle * index, 776, roundRectHeight, 24, "#fff");
						funObj.fillTextLineBreak(ctx, item.jobName, logoLeft, baseTop + baseMiddle * index, 500, 20, "#333", titleSize, "500"); // 岗位标题
						funObj.fillTextLineBreak(ctx, item.cus_price == "月薪" ? item.monthlyPay : item.salaryClassifyValue, salaryClassifyValueLeft + 500, baseTop - 10 + salaryClassifyValueTop + baseMiddle * index, 400, 20, "#ff4400", titleSize - 4, "600"); // 时薪
						// setTimeout(() => {
						// funObj.fillTextLineBreak(ctx, item.monthlyPay, salaryClassifyValueLeft + ctx.measureText(item.salaryClassifyValue + " ").width, baseTop + salaryClassifyValueTop + baseMiddle * index, 400 , 20, "#ff4400", monthlyPaySize, "400"); // 月工资
						// }, 0);
						funObj.fillTextLineBreak(ctx, item.district, logoLeft, baseTop + ageTop + baseMiddle * index, 500, 20, "#999", monthlyPaySize); // 省市
						funObj.fillTextLineBreak(ctx, item.age, logoLeft + ctx.measureText(item.district).width, baseTop + ageTop + baseMiddle * index, 500, 20, "#999", monthlyPaySize); // 年龄
					}
				});
				// setTimeout(() => {
				// },500);
				imgres(canvas);
			});
		},
		saveToalbum() {
			let that = this;
			uni.saveImageToPhotosAlbum({
				filePath: that.posterImg,
				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,
					});
				},
			});
		},
		goDetail($item) {
			console.log("前往详情页", $item);
			if (this.isLogin) {
				uni.navigateTo({
					url: "/root/detail/work?id=" + $item.id,
				});
			} else {
				uni.navigateTo({
					url: "/pages/login/index",
				});
			}
		},
	},
};
</script>

<style lang="scss" scoped>
.p-root-sharejob {
	// display: flex;
	// flex-direction: column;
	// height: calc(100vh - 20px);
	overflow: auto;
	// .g-components-panel-fixed {
	// 	border-top: 1rpx solid #fff;
	// }
	.m-search {
		position: sticky;
		top: 0;
		background: #f5f5f5;
		z-index: 999;
	}
	.shareBottom {
		position: fixed;
		bottom: 0px;
		width: 100vw;
		height: 84px;
		padding: 0 14px;
		background-color: #fff;
		box-sizing: border-box;
		border-top: 1px solid #eee;
		z-index: 9999;
		button {
			width: 80px;
			height: 32px;
			padding: 0;
			font-size: 14px;
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 0;
			font-weight: bold;
			margin-left: 10px;
			border-radius: 99px;
			border: 1px solid #3578f6;
			background-color: #fff;
			color: #3578f6;
		}
		> div {
			margin-top: -16px;
		}
		.ban {
			border-color: transparent;
			background-color: #f5f5f5;
			color: #999;
		}
		.btnHover {
			background-color: #3578f6;
			color: #fff;
		}
	}
}
.posterImg {
	height: 75vh;
	width: calc(75vh * 0.52);
}
</style>
