海报推广

library/longPoster/index.css

@@ -0,0 +1,102 @@
+page{
+	background-color: #fff;
+}
+
+.search-box{
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	background-color: #fff;
+	z-index: 5;
+	padding: 30rpx;
+	background-color: #fff;
+}
+
+.search-text{
+	color: #999999;
+}
+
+
+.search-input{
+	height: 76rpx;
+	line-height: 76rpx;;
+	background: #F5F5F5;
+	border-radius: 70rpx;
+	padding: 0 26rpx;
+	font-size: 24rpx;
+}
+.search-input input{
+	font-size: 24rpx;
+}
+.search-input image{
+	width: 34rpx;
+	height: 34rpx;
+	margin-right: 26rpx;
+}
+.search-all{
+	color: #2a82fd;
+	font-size: 30rpx;
+	margin-left: 20rpx;
+}
+
+
+.poster-item{
+	width: 335rpx;
+	margin-right: calc(100% - 670rpx);
+	margin-bottom: 40rpx;
+}
+.poster-item:nth-child(2n){
+	margin-right: 0rpx;
+}
+.poster-item-pic{
+	width: 335rpx;
+	height: 609rpx;
+}
+.poster-item-title{
+	line-height: 37rpx;
+	font-size: 26rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #000000;
+	margin-top: 15rpx;
+	padding: 0 10rpx;
+}
+.poster-item-use{
+	line-height: 30rpx;
+	font-size: 22rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	margin-top: 12rpx;
+	padding: 0 10rpx;
+}
+
+.act-create{
+	width: 110rpx;
+	height: 110rpx;
+	background: var(--main);
+	box-shadow: 0rpx 4rpx 24rpx 1rpx rgba(0,155,98,0.2);
+	opacity: 1;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+	border-radius: 100%;
+	padding: 20rpx;
+	box-sizing: border-box;
+	position: fixed;
+	bottom: 200rpx;
+	right: 30rpx;
+}
+.act-create image{
+	width: 39rpx;
+	height: 39rpx;
+	margin: auto;
+}
+.ceng{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.5);z-index: 60;}
+.side{position: fixed;right: 165rpx;bottom: 16%;z-index: 61;width: 300rpx;height: 183rpx;background: #FFFFFF;border-radius: 20rpx;font-size: 30rpx;color: #000;align-items: flex-start;padding:0 20rpx;}
+.side::after{content: '';display: block;width: 0;height: 0;border: 10rpx solid rgba(255,255,255,0);border-right: none;border-left-color: #fff;position: absolute;bottom: 30rpx;right: -10rpx;}
+.side .li{width: 50%;text-align: center;}
+.side .li image{width: 38rpx;height: 38rpx;margin: 49rpx auto 15rpx;}

library/longPoster/index.vue

@@ -0,0 +1,78 @@
+<template>
+	<view>
+		<view class="search-box ddflex">
+			<view class="search-input ddflex fflex">
+				<image src="/static/images/ssico.png"></image>
+				<input @confirm="searchFn" confirm-type="search" @input="searchFn" v-model="searchVal" class="fflex"
+					placeholder="请输入关键词" />
+			</view>
+		</view>
+		<view style="height: 120rpx;"></view>
+		<view class="ddflex" style="padding: 30rpx;">
+			<view class="poster-item" v-for="item in 36" @click="jumpUrl('/library/longPosterService/longPosterService')">
+				<image class="poster-item-pic" src="http://img.zhiqiyun.com/test/2023/07/31/8b7ed072b68fe70f0d6f409a71a8b17b.png" mode="aspectFill"></image>
+				<view class="poster-item-title tover">年度理赔账单</view>
+				<!-- <view class="poster-item-use">2056 人正在使用</view> -->
+			</view>
+		</view>
+		
+		<view class="act-create" @click="showBtn">
+			<image src="../static/images/add.png"></image>
+			<view>发布</view>
+		</view>
+		<view class="ceng" v-if="isShowbtn" @click="hideBtn"></view>
+		<view class="side ddflex" v-if="isShowbtn">
+			<view class="li" @click="createJump('/office/createTeam/index')">
+				<image src="/static/images/ll_dt.png"></image>
+				<view>年度账单</view>
+			</view>
+			<view class="li" @click="createJump('/office/news/news?newsType=1')">
+				<image src="/static/images/ll_cz.png"></image>
+				<view>日/月/年报</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				isShowbtn:false
+			}
+		},
+		onLoad(options) {
+
+		},
+		onShow() {
+			
+		},
+		methods: {
+			jumpUrl(url){
+				uni.navigateTo({
+					url:url
+				})
+			},
+			showBtn() {
+				this.isShowbtn = true;
+			},
+			hideBtn() {
+				this.isShowbtn = false;
+			},
+		},
+		mounted() {
+			
+		},
+		onPageScroll: function(e) {
+		}
+	}
+</script>
+
+<style>
+	@import "./index.css";
+</style>

library/longPosterContent/longPosterContent.css

@@ -0,0 +1,47 @@
+page{
+	background-color: #fff;
+}
+.form-input{
+	margin:40rpx 30rpx;
+}
+.input-label{
+	line-height: 45rpx;
+	font-size: 32rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #333333;
+}
+.input-box{
+	background: #F8F8F8;
+	border-radius: 8rpx 8rpx 8rpx 8rpx;
+	margin-top: 20rpx;
+	padding: 23rpx;
+}
+.input-box textarea{
+	width: 100%;
+}
+.rico{
+	width: 12rpx;
+	height: 22rpx;
+	margin-left: 20rpx;
+}
+
+.share-btn{
+	background-color: #fff;
+	padding: 30rpx 40rpx;
+	position: fixed;
+	bottom: 0;
+	left: 0;
+	right: 0;
+}
+.btn{
+	line-height: 80rpx;
+	background: #27D699;
+	border-radius: 40rpx 40rpx 40rpx 40rpx;
+	opacity: 1;
+	font-size: 32rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+}

library/longPosterContent/longPosterContent.vue

@@ -0,0 +1,83 @@
+<template>
+	<view>
+		<view class="form-input">
+			<view class="input-label">文本一</view>
+			<picker :range="yearList" range-key="label" @change="yearChange">
+				<view class="input-box ddflex">
+					<view class="fflex">{{yearIndex>-1?yearList[yearIndex].label:'请选择'}}</view>
+					<image class="rico" src="../../static/pages/images/more.png"></image>
+				</view>
+			</picker>
+		</view>
+		<view class="form-input">
+			<view class="input-label">文本二</view>
+			<view class="input-box ddflex">
+				<input v-model="textTitle" placeholder="请填写"/>
+			</view>
+			<view class="input-box ddflex">
+				<textarea v-model="textContent" placeholder="请填写"></textarea>
+			</view>
+		</view>
+		<view class="form-input">
+			<view class="input-label">文本三</view>
+			<picker :range="yearList" range-key="label" @change="yearChange">
+				<view class="input-box ddflex">
+					<view class="fflex">{{yearIndex>-1?yearList[yearIndex].label:'请选择'}}</view>
+					<image class="rico" src="../../static/pages/images/more.png"></image>
+				</view>
+			</picker>
+		</view>
+		
+		<view style="height: 150rpx;"></view>
+		<view class="share-btn">
+			<view class="btn" @click="">保存</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				yearIndex:-1,
+				yearList:[{
+					label:'2023年合计理赔金额（元）',
+					value:'23396.5',
+					year:2023
+				},{
+					label:'2022年合计理赔金额（元）',
+					value:'33396.5',
+					year:2022
+				},{
+					label:'2021年合计理赔金额（元）',
+					value:'46396.5',
+					year:2021
+				}],
+				textTitle:'',
+				textContent:''
+			}
+		},
+		onLoad(options) {
+		
+		},
+		onShow() {
+			
+		},
+		methods: {
+			yearChange(e){
+				this.yearIndex = e.detail.value
+			}
+		},
+		mounted() {
+		}
+	}
+</script>
+
+<style>
+	@import "./longPosterContent.css";
+</style>

library/longPosterService/longPosterService.css

@@ -0,0 +1,115 @@
+page{
+	background-color: #333333;
+	padding: 30rpx;
+}
+.poster{
+	position: relative;
+	overflow: hidden;
+}
+.poster-pic{
+	width: 100%;
+}
+.option{
+	line-height: 33rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+}
+.option image{
+	width: 48rpx;
+	height: 48rpx;
+	margin-right: 20rpx;
+	opacity: 1;
+}
+.line{
+	width: 2rpx;
+	height: 48rpx;
+	opacity: 1;
+	background-color: #707070;
+	margin: 0 50rpx;
+}
+.option-btn{
+	width: 155rpx;
+	height: 56rpx;
+	line-height: 56rpx;
+	background: var(--main);
+	border-radius: 28rpx 28rpx 28rpx 28rpx;
+	opacity: 1;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+}
+
+.table-th{
+	margin-top: 70rpx;
+	width: 604rpx;
+	height: 73rpx;
+	background: rgba(255, 255, 255, 0.8);
+}
+.table-th-item{
+	font-size: 24rpx;
+	font-weight: bold;
+	color: #333333;
+	line-height: 33rpx;
+	text-align: left;
+	padding: 0 30rpx;
+}
+.table-th-item:first-child{
+	text-align: left;
+}
+.table-th-item:last-child{
+	text-align: right;
+}
+
+.table-td{
+	background: #FFFFFF;
+}
+.table-td:first-child{
+	padding-top: 30rpx;
+}
+.table-td:last-child{
+	padding-bottom: 30rpx;
+}
+.table-td-item{
+	font-size: 22rpx;
+	font-weight: bold;
+	color: #333333;
+	line-height: 33rpx;
+	text-align: left;
+	padding: 13rpx 30rpx 13rpx;
+}
+.table-td-item-border{
+	height: 2rpx;
+	margin: 0 30rpx;
+	background-color: #EAEAEA;
+}
+.table-td-item:first-child{
+	text-align: left;
+}
+.table-td-item:last-child{
+	text-align: right;
+}
+
+.poster-title{
+	line-height: 50rpx;
+	font-size: 36rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: bold;
+	color: #FFFFFF;
+}
+.poster-note{
+	line-height: 37rpx;
+	font-size: 26rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	margin-top:12rpx;
+}
+.poster-code{
+	width: 126rpx;
+	height: 126rpx;
+	margin-left: 20rpx;
+}

library/longPosterService/longPosterService.vue

@@ -0,0 +1,176 @@
+<template>
+	<view>
+		<view class="poster" id="poster">
+			<image class="poster-pic" :src="posterBg" mode="widthFix"></image>
+			
+			<view style="position: absolute;top: 912rpx;left: 50%;transform: translateX(-50%);">
+				<view style="font-size: 36rpx;font-weight: bold;text-align: center;">合计理赔金额（元）</view>
+				<view style="font-size: 90rpx;font-weight: bold;color: #FF5700;margin-top: 5rpx;line-height: 126rpx;text-align: center;">340895.2</view>
+				
+				<view style="font-size: 33rpx;font-weight: bold;margin-top: 78rpx;text-align: center;">理赔概况</view>
+				<view style="width:522rpx;font-size: 26rpx;font-weight: 400;color: #333;line-height: 48rpx;margin: 17rpx auto 0;">
+					这里是理赔经过的概况描述文案这里是理赔经过的概况描述文案这里是理赔经过的概况描述文案这里是理赔经过的概况描述文案这里是理赔经过的概况描述文案这里是理赔经过的概况这里是理赔经过的概况描述文案
+				</view>
+				
+				
+				<view class="table-th ddflex">
+					<view class="table-th-item fflex">赔付事件</view>
+					<view class="table-th-item fflex">赔付金额</view>
+				</view>
+				
+				<view>
+					<view class="table-td" v-for="item,index in 10">
+						<view class="ddflex">
+							<view class="table-td-item fflex">L女士 32岁 福建人 甲状腺癌</view>
+							<view class="table-td-item">14826元</view>
+						</view>
+						<view v-if="index!=10-1" class="table-td-item-border"></view>
+					</view>
+				</view>
+				
+				<view class="ddflex" style="margin-top: 40rpx;">
+					<view class="flex">
+						<view class="poster-title">杜平 | 18665676418</view>
+						<view class="poster-note">扫码即可咨询理赔事宜</view>
+					</view>
+					<image class="poster-code" src="https://img.zhiqiyun.com/test/2023/08/23/d44ab2b86522a05ee6bd026cf04ec8bd.png"></image>
+				</view>
+			</view>
+			
+			
+		</view>
+		<view class="ddflex" style="margin: 30rpx 0 10rpx;justify-content: space-between;">
+			<view class="ddflex">
+				<view class="option ddflex" @click="uploadImage">
+					<image mode="aspectFit" src="../static/images/opt1.png"></image>
+					更换背景
+				</view>
+				<view class="line"></view>
+				<view class="option ddflex" @click="jumpUrl('/library/longPosterContent/longPosterContent')">
+					<image mode="aspectFit" src="../static/images/opt2.png"></image>
+					编辑内容
+				</view>
+			</view>
+			<view class="option-btn" @click="toImg">发布</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+	import html2canvas from '../static/html2canvas.min.js';
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				systems: {},
+				isTop:0,
+				productLink:'',
+				posterBg:'',
+				base64:''
+			}
+		},
+		onLoad(options) {
+			this.posterBg = 'https://img.zhiqiyun.com/test/2023/08/23/e5705790f7614ebede4c06073b7abd50.png'
+		},
+		onShow() {
+			
+		},
+		methods: {
+			jumpUrl(url){
+				uni.navigateTo({
+					url:url
+				})
+			},
+			creatCode(){
+				
+			},
+			toImg() {
+				// 使页面滑到顶部，避免顶部出现白边
+				uni.pageScrollTo({
+					scrollTop: 0,
+					duration: 0
+				})
+				var dom = document.querySelector('#poster'); // 获取dom元素
+				html2canvas(dom, {
+					width: dom.clientWidth, //dom 原始宽度
+					height: dom.clientHeight,
+					scrollY: 0, // html2canvas默认绘制视图内的页面，需要把scrollY，scrollX设置为0
+					scrollX: 0,
+					useCORS: true, //支持跨域，但好像没什么用
+				}).then((canvas) => {
+					// 将生产的canvas转为base64图片
+					this.base64 = canvas.toDataURL('image/png')
+					console.log(this.base64)
+					uni.downloadFile({
+						url: this.base64, //仅为示例，并非真实的资源
+						success: (res) => {
+							console.log(res)
+							if (res.statusCode === 200) {
+								console.log('下载成功');
+								var oA = document.createElement("a");
+								oA.download = ''; // 设置下载的文件名，默认是'下载'
+								oA.href = res.tempFilePath; //临时路径再保存到本地
+								document.body.appendChild(oA);
+								oA.click();
+								oA.remove(); // 下载之后把创建的元素删除
+							}
+					
+						}
+					});
+				});
+			},
+			uploadImage(){
+				let that = this;
+				let count = 1
+				uni.chooseImage({
+					count: count,
+					sizeType: ['original', 'compressed'],
+					sourceType: ['album', 'camera'],
+					success: function({ tempFilePaths }) {
+						var promise = Promise.all(
+							tempFilePaths.map(tempFilePath => {
+								return new Promise(function(resolve, reject) {
+									req.uploadFile('/api/nocheck/upload', tempFilePath, res => {
+										that.posterBg = res.src
+									});
+								});
+							})
+						);
+						promise
+							.then(function(results) {
+								console.log(results);
+							})
+							.catch(function(err) {
+								console.log(err);
+							});
+					}
+				});
+			},
+		},
+		mounted() {
+			const systemInfo = uni.getSystemInfoSync();
+			// px转换到rpx的比例
+			let pxToRpxScale = 750 / systemInfo.windowWidth;
+			let systems = {
+				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
+				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
+			};
+			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
+			this.systems = systems;
+		},
+		onPageScroll: function(e) {
+			if (e.scrollTop > this.systems.barHeight) {
+				this.isTop = 1;
+			} else {
+				this.isTop = 0;
+			}
+		}
+	}
+</script>
+<style>
+	@import "./longPosterService.css";
+</style>

library/poster/index.css

@@ -0,0 +1,120 @@
+page{
+	background-color: #fff;
+}
+.top-sort{
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	background-color: #fff;
+	z-index: 5;
+}
+.top-sort-item{
+	text-align: center;
+	line-height: 45rpx;
+	font-size: 32rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #666666;
+	padding:21rpx 0 16rpx;
+}
+.top-sort-item-active{
+	color: var(--main);
+	position: relative;
+}
+.top-sort-item-active::after{
+	position: absolute;
+	bottom: 0;
+	left: 50%;
+	transform: translateX(-50%);
+	content: '';
+	width: 58rpx;
+	height: 4rpx;
+	opacity: 1;
+	background-color:var(--main) ;
+}
+
+.search-box{
+	padding: 30rpx;
+	background-color: #fff;
+}
+
+.search-text{
+	color: #999999;
+}
+
+
+.search-input{
+	height: 76rpx;
+	line-height: 76rpx;;
+	background: #F5F5F5;
+	border-radius: 70rpx;
+	padding: 0 26rpx;
+	font-size: 24rpx;
+}
+.search-input input{
+	font-size: 24rpx;
+}
+.search-input image{
+	width: 34rpx;
+	height: 34rpx;
+	margin-right: 26rpx;
+}
+.search-all{
+	color: #2a82fd;
+	font-size: 30rpx;
+	margin-left: 46rpx;
+}
+
+
+.search-tag{
+	padding: 0 14rpx;
+	height: 61rpx;
+	line-height: 61rpx;
+	background: #F6F7F9;
+	border-radius: 4rpx 4rpx 4rpx 4rpx;
+	opacity: 1;
+	text-align: center;
+	margin-right: 10rpx;
+	margin-bottom: 10rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #919191;
+}
+.search-tag-active{
+	background: #3B8DFF;
+	color: #fff;
+}
+
+
+.poster-item{
+	width: 208rpx;
+	margin-right: 30rpx;
+	margin-bottom: 40rpx;
+}
+.poster-item:nth-child(3n){
+	margin-right: 0rpx;
+}
+.poster-item-pic{
+	width: 208rpx;
+	height: 378rpx;
+}
+.poster-item-title{
+	line-height: 37rpx;
+	font-size: 26rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #000000;
+	margin-top: 15rpx;
+	padding: 0 10rpx;
+}
+.poster-item-use{
+	line-height: 30rpx;
+	font-size: 22rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	margin-top: 12rpx;
+	padding: 0 10rpx;
+}

library/poster/index.vue

@@ -0,0 +1,80 @@
+<template>
+	<view>
+		<view class="top-sort ddflex">
+			<view class="top-sort-item flex top-sort-item-active">海报</view>
+			<view class="top-sort-item flex">产品宣传</view>
+		</view>
+		<view style="height: 85rpx;"></view>
+		<view style="border-top: 20rpx solid #F4F5F9;">
+			<view class="search-box ddflex">
+				<view class="search-input ddflex fflex">
+					<image src="/static/images/ssico.png"></image>
+					<input @confirm="searchFn" confirm-type="search" @input="searchFn" v-model="searchVal" class="fflex"
+						placeholder="请输入关键词" />
+				</view>
+			</view>
+			<view class="ddflex" style="padding: 0 30rpx;">
+				<view class="search-tag search-tag-active">全部</view>
+				<view class="search-tag" v-for="item in 12">问候日签</view>
+			</view>
+			<view class="ddflex" style="padding: 30rpx;">
+				<view class="poster-item" v-for="item in 6" @click="jumpUrl('/library/posterService/posterService')">
+					<image class="poster-item-pic" src="http://img.zhiqiyun.com/test/2023/07/31/8b7ed072b68fe70f0d6f409a71a8b17b.png" mode="aspectFill"></image>
+					<view class="poster-item-title tover">海报名称</view>
+					<view class="poster-item-use">2056 人正在使用</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				systems: {},
+				isTop:0,
+			}
+		},
+		onLoad(options) {
+
+		},
+		onShow() {
+			
+		},
+		methods: {
+			jumpUrl(url){
+				uni.navigateTo({
+					url:url
+				})
+			}
+		},
+		mounted() {
+			const systemInfo = uni.getSystemInfoSync();
+			// px转换到rpx的比例
+			let pxToRpxScale = 750 / systemInfo.windowWidth;
+			let systems = {
+				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
+				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
+			};
+			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
+			this.systems = systems;
+		},
+		onPageScroll: function(e) {
+			if (e.scrollTop > this.systems.barHeight) {
+				this.isTop = 1;
+			} else {
+				this.isTop = 0;
+			}
+		}
+	}
+</script>
+
+<style>
+	@import "./index.css";
+</style>

library/posterService/posterService.css

@@ -0,0 +1,66 @@
+.poster{
+	margin: 30rpx 40rpx;
+	background-color: #fff;
+}
+.poster-pic{
+	width: 100%;
+}
+.poster-title{
+	line-height: 40rpx;
+	font-size: 28rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #333333;
+	margin-top: 20rpx;
+}
+.poster-note{
+	line-height: 37rpx;
+	font-size: 26rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	margin-top: 20rpx;
+}
+.poster-code{
+	width: 126rpx;
+	height: 126rpx;
+	margin-left: 20rpx;
+}
+
+.change-product{
+	position: absolute;
+	right: 0;
+	top:0;
+	padding: 4rpx 18rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	line-height: 45rpx;
+	background: rgba(0,0,0,0.7);
+}
+.change-product image{
+	width: 24rpx;
+	height: 25rpx;
+	margin-right: 10rpx;
+}
+	
+.share-btn{
+	background-color: #fff;
+	padding: 30rpx 40rpx;
+	position: fixed;
+	bottom: 0;
+	left: 0;
+	right: 0;
+}
+.btn{
+	line-height: 80rpx;
+	background: #27D699;
+	border-radius: 40rpx 40rpx 40rpx 40rpx;
+	opacity: 1;
+	font-size: 32rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+}

library/posterService/posterService.vue

@@ -0,0 +1,109 @@
+<template>
+	<view>
+		<view class="poster" id="poster">
+			<image class="poster-pic" :src="posterBg" mode="widthFix"></image>
+			<view class="ddflex" style="padding: 22rpx 35rpx;position: relative;">
+				<view class="flex">
+					<view class="poster-title">杜平 | 中国人寿股份湖南分公司</view>
+					<view class="poster-note">长按小程序码了解更多</view>
+				</view>
+				<image class="poster-code" src="/static/images/lj_img.png"></image>
+				<view class="change-product ddflex" @click="jumpUrl('/library/productLink/productLink')" data-html2canvas-ignore="true">
+					<image src="/static/images/edit1.png"></image>
+					产品链接</view>
+			</view>
+		</view>
+		
+		<view style="height: 150rpx;"></view>
+		<view class="share-btn">
+			<view class="btn" @click="toImg">立即分享</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+	import html2canvas from '../static/html2canvas.min.js';
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				systems: {},
+				isTop:0,
+				productLink:'',
+				posterBg:'',
+				base64:''
+			}
+		},
+		onLoad(options) {
+			this.posterBg = 'http://img.zhiqiyun.com/test/2023/07/31/8b7ed072b68fe70f0d6f409a71a8b17b.png'
+			// this.posterBg = 'https://hxdms.oss-cn-hangzhou.aliyuncs.com/hxdms/2986a2805d414b75952d609381f2d280.png'
+			this.imageChange(this.posterBg)
+		},
+		onShow() {
+			
+		},
+		methods: {
+			jumpUrl(url){
+				uni.navigateTo({
+					url:url
+				})
+			},
+			creatCode(){
+				
+			},
+			toImg() {
+				// 使页面滑到顶部，避免顶部出现白边
+				uni.pageScrollTo({
+					scrollTop: 0,
+					duration: 0
+				})
+				var dom = document.querySelector('#poster'); // 获取dom元素
+				html2canvas(dom, {
+					width: dom.clientWidth, //dom 原始宽度
+					height: dom.clientHeight,
+					scrollY: 0, // html2canvas默认绘制视图内的页面，需要把scrollY，scrollX设置为0
+					scrollX: 0,
+					useCORS: true, //支持跨域，但好像没什么用
+				}).then((canvas) => {
+					// 将生产的canvas转为base64图片
+					this.base64 = canvas.toDataURL('image/png')
+					console.log(this.base64)
+				});
+			},
+			imageChange(img){
+				// let imagePromise = this.getCoverSrc(img);
+				// Promise.all([imagePromise]).then(([image]) => {
+				// 	console.log(image)
+				// 	this.posterBg = image
+				// })
+				// this.posterBg = image
+				//创建xhr对象
+			}
+		},
+		mounted() {
+			const systemInfo = uni.getSystemInfoSync();
+			// px转换到rpx的比例
+			let pxToRpxScale = 750 / systemInfo.windowWidth;
+			let systems = {
+				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
+				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
+			};
+			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
+			this.systems = systems;
+		},
+		onPageScroll: function(e) {
+			if (e.scrollTop > this.systems.barHeight) {
+				this.isTop = 1;
+			} else {
+				this.isTop = 0;
+			}
+		}
+	}
+</script>
+<style>
+	@import "./posterService.css";
+</style>

library/productLink/productLink.css

@@ -0,0 +1,176 @@
+page{
+	background-color: #fff;
+}
+.form{
+	padding: 30rpx;
+}
+.form-title{
+	line-height: 50rpx;
+	font-size: 36rpx;
+	font-family: PingFang SC-Bold, PingFang SC;
+	font-weight: bold;
+	color: #333333;
+}
+.form-item-title{
+	line-height: 45rpx;
+	font-size: 32rpx;
+	font-family: PingFang SC-Medium, PingFang SC;
+	font-weight: 500;
+	color: #333333;
+	margin-top: 32rpx;
+}
+.upload-pic{
+	width: 690rpx;
+	height: 400rpx;
+	background: #F8F8F8;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin:30rpx auto 0;
+	text-align: center;
+	line-height: 45rpx;
+	font-size: 32rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	flex-direction: column;
+	justify-content: center;
+}
+.upload-pic image{
+	width: 59rpx;
+	height: 62rpx;
+}
+.upload-image{
+	width: 690rpx;
+	height: 400rpx;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin:30rpx auto 0;
+}
+.form-limit{
+	line-height: 33rpx;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	margin-top: 20rpx;
+}
+.upload-photo{
+	width: 120rpx;
+	height: 120rpx;
+	background: #F8F8F8;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin-bottom: 20rpx;
+}
+.upload-photo image{
+	width: 46rpx;
+	height: 35rpx;
+	margin: auto;
+}
+.upload-photo-image{
+	width: 120rpx;
+	height: 120rpx;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+	opacity: 1;
+	margin-right: 20rpx;
+	position: relative;
+	margin-bottom: 20rpx;
+}
+.upload-photo-image image{
+	width: 120rpx;
+	height: 120rpx;
+	border-radius: 10rpx 10rpx 10rpx 10rpx;
+}
+.upload-photo-close{
+	width: 28rpx !important;
+	height: 28rpx !important;
+	position: absolute;
+	top:-14rpx;
+	right: -14rpx;
+}
+.form-border{
+	height: 20rpx;
+	background: #F8F8F8;
+	border-radius: 0rpx 0rpx 0rpx 0rpx;
+	opacity: 1;
+}
+.form-input-box{
+	padding: 30rpx 0;
+	border-bottom: 2rpx solid #DEDEDE;
+	line-height: 45rpx;
+	font-size: 32rpx;
+}
+.form-input-placeholder{
+	color: #CCCCCC;
+}
+.more{
+	float: right;
+}
+.more image{
+	width: 14rpx;
+	height: 22rpx;
+	margin-left: 10rpx;
+}
+.next-btn{
+	position: fixed;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	height: 88rpx;
+	line-height: 88rpx;
+	background: #27D699;
+	border-radius: 44rpx 44rpx 44rpx 44rpx;
+	font-size: 36rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FFFFFF;
+	text-align: center;
+	margin: 150rpx 30rpx 30rpx;
+}
+.form-number-select{
+	margin-top: 30rpx;
+}
+.form-number-select view:first-child,.form-number-select view:last-child{
+	width: 80rpx;
+	height: 67rpx;
+	line-height: 67rpx;
+	background: #F8F8F8;
+	border-radius: 4rpx 4rpx 4rpx 4rpx;
+	opacity: 1;
+	text-align: center;
+	color: #B3B3B3;
+	font-size: 40rpx;
+}
+.form-number-select input{
+	width: 112rpx;
+	height: 63rpx;
+	background: #FFFFFF;
+	border-radius: 4rpx 4rpx 4rpx 4rpx;
+	opacity: 1;
+	border: 2rpx solid #DEDEDE;
+	margin: 0 20rpx;
+	text-align: center;
+}
+.form-date-select{
+	background: #F8F8F8;
+	border-radius: 5rpx 5rpx 5rpx 5rpx;
+	text-align: center;
+	line-height: 76rpx;
+	height: 76rpx;
+	color: #CCCCCC;
+	font-size: 32rpx;
+}
+.clear-btn{
+	width: 104rpx;
+	line-height: 56rpx;
+	background: #FFFFFF;
+	border-radius: 28rpx 28rpx 28rpx 28rpx;
+	opacity: 1;
+	border: 1rpx solid #707070;
+	text-align: center;
+	font-size: 24rpx;
+	font-family: PingFang SC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #333333;
+	margin-left: 10rpx;
+}

library/productLink/productLink.vue

@@ -0,0 +1,72 @@
+<template>
+	<view>
+		<view class="form">
+			<view class="form-item-title">产品标题</view>
+			<view class="form-input-box">
+				<input placeholder-class="form-input-placeholder" placeholder="请输入产品标题"/>
+			</view>
+			<view class="form-item-title">产品链接</view>
+			<view class="form-input-box ddflex">
+				<input class="flex" v-model="productLink" placeholder-class="form-input-placeholder" placeholder="请填写或粘贴产品链接"/>
+				<view class="clear-btn">清空</view>
+			</view>
+			<view class="next-btn" @click="submit">保存</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	const app = getApp();
+	const req = require("../../utils/request.js");
+
+	export default {
+		components: {},
+		props: {},
+		data() {
+			return {
+				systems: {},
+				isTop:0,
+				productLink:''
+			}
+		},
+		onLoad(options) {
+
+		},
+		onShow() {
+			
+		},
+		methods: {
+			submit(){
+				let pages = getCurrentPages();
+				var prevPage = pages[pages.length - 2];
+				if (prevPage) {
+					prevPage.$vm.setData({
+						productLink: this.productLink
+					});
+				}
+			}
+		},
+		mounted() {
+			const systemInfo = uni.getSystemInfoSync();
+			// px转换到rpx的比例
+			let pxToRpxScale = 750 / systemInfo.windowWidth;
+			let systems = {
+				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
+				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
+			};
+			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
+			this.systems = systems;
+		},
+		onPageScroll: function(e) {
+			if (e.scrollTop > this.systems.barHeight) {
+				this.isTop = 1;
+			} else {
+				this.isTop = 0;
+			}
+		}
+	}
+</script>
+
+<style>
+	@import "./productLink.css";
+</style>

pages.json

@@ -48,6 +48,40 @@
 					"navigationBarTitleText": "活动详情"
 				}
 			}]
+		},
+		{
+			"root": "library",
+			"pages": [{
+				"path": "poster/index",
+				"style": {
+					"navigationBarTitleText": ""
+				}
+			}, {
+				"path": "posterService/posterService",
+				"style": {
+					"navigationBarTitleText": "海报"
+				}
+			}, {
+				"path": "productLink/productLink",
+				"style": {
+					"navigationBarTitleText": "产品链接"
+				}
+			},{
+				"path": "longPoster/index",
+				"style": {
+					"navigationBarTitleText": "长图海报"
+				}
+			},{
+				"path": "longPosterService/longPosterService",
+				"style": {
+					"navigationBarTitleText": "长图海报"
+				}
+			},{
+				"path": "longPosterContent/longPosterContent",
+				"style": {
+					"navigationBarTitleText": "编辑内容"
+				}
+			}]
 		}
 	],
 	"globalStyle": {

utils/request.js

@@ -10,6 +10,7 @@ const env = {
 	},
 	pota: {
 		apiUrl: 'http://192.168.110.180:8098' ,//wjg
+		// apiUrl: 'http://10.17.56.92:8098' ,//人寿内网
 	}
 }