|
@@ -47,12 +47,20 @@
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <template
|
|
|
|
|
|
|
+ <!-- <template
|
|
|
v-for="(item, index) in reportTarget.reportContents"
|
|
v-for="(item, index) in reportTarget.reportContents"
|
|
|
v-if="reportTarget.reportContents && reportTarget.reportContents.length > 0">
|
|
v-if="reportTarget.reportContents && reportTarget.reportContents.length > 0">
|
|
|
<div :class="['text']">{{ filterText(index) }}</div>
|
|
<div :class="['text']">{{ filterText(index) }}</div>
|
|
|
<div class="content">{{ item.dayContent }}</div>
|
|
<div class="content">{{ item.dayContent }}</div>
|
|
|
- </template>
|
|
|
|
|
|
|
+ </template> -->
|
|
|
|
|
+ <div :class="['text']">今日机会与挑战总结</div>
|
|
|
|
|
+ <div class="content">
|
|
|
|
|
+ {{ reportTarget.reportContents ? reportTarget.reportContents[0].dayContent : '' }}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div :class="['text']">明日工作计划</div>
|
|
|
|
|
+ <div class="content">
|
|
|
|
|
+ {{ reportTarget.reportContents ? reportTarget.reportContents[1].dayContent : '' }}
|
|
|
|
|
+ </div>
|
|
|
<div class="text">今日拜访照片</div>
|
|
<div class="text">今日拜访照片</div>
|
|
|
<div class="content-photos">
|
|
<div class="content-photos">
|
|
|
<template v-for="item in photosData">
|
|
<template v-for="item in photosData">
|
|
@@ -87,7 +95,7 @@
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="html2canvasBox" v-if="false">
|
|
|
|
|
|
|
+ <div class="html2canvasBox">
|
|
|
<div class="closeShare" @click="closeShare"><van-icon name="close" /></div>
|
|
<div class="closeShare" @click="closeShare"><van-icon name="close" /></div>
|
|
|
<div id="html2canvas" ref="html2canvas">
|
|
<div id="html2canvas" ref="html2canvas">
|
|
|
<div class="scroll-container">
|
|
<div class="scroll-container">
|
|
@@ -132,14 +140,14 @@ export default {
|
|
|
this.canvasImageUrl = '';
|
|
this.canvasImageUrl = '';
|
|
|
},
|
|
},
|
|
|
mounted() {
|
|
mounted() {
|
|
|
- // this.toastLoading(0, '生成中...', true);
|
|
|
|
|
|
|
+ this.toastLoading(0, '生成中...', true);
|
|
|
// 二维码
|
|
// 二维码
|
|
|
this.creatQrCode();
|
|
this.creatQrCode();
|
|
|
getReportImg({ reportId: this.reportId }).then((res) => {
|
|
getReportImg({ reportId: this.reportId }).then((res) => {
|
|
|
if (res.data) {
|
|
if (res.data) {
|
|
|
this.photosData = res.data;
|
|
this.photosData = res.data;
|
|
|
this.$nextTick(async () => {
|
|
this.$nextTick(async () => {
|
|
|
- // await this.htmlToCanvas();
|
|
|
|
|
|
|
+ await this.htmlToCanvas();
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
@@ -234,15 +242,24 @@ export default {
|
|
|
// let proText = 'https://suishenbang.nipponpaint.com.cn';
|
|
// let proText = 'https://suishenbang.nipponpaint.com.cn';
|
|
|
let path =
|
|
let path =
|
|
|
process.env.VUE_APP_Target +
|
|
process.env.VUE_APP_Target +
|
|
|
- '/mobile/dailyHistoricalDetails?source=share&reportId=' +
|
|
|
|
|
|
|
+ '/mobile/dailyHistoricalDetails&source=share&reportId=' +
|
|
|
this.reportId || '';
|
|
this.reportId || '';
|
|
|
var qrcode = new QRCode(this.$refs.QRcodes, {
|
|
var qrcode = new QRCode(this.$refs.QRcodes, {
|
|
|
- text: process.env.VUE_APP_SSB_LINK + '/homeIndex?path=' + path, // 需要转换为二维码的内容
|
|
|
|
|
|
|
+ text: process.env.VUE_APP_SSB_LINK + '/homeIndex?path=' + path,
|
|
|
colorDark: '#000000',
|
|
colorDark: '#000000',
|
|
|
- colorLight: '#ffffff',
|
|
|
|
|
|
|
+ colorLight: 'rgba(255,255,255,0)', // 完全透明背景
|
|
|
correctLevel: QRCode.CorrectLevel.H,
|
|
correctLevel: QRCode.CorrectLevel.H,
|
|
|
- width: 70,
|
|
|
|
|
- height: 70,
|
|
|
|
|
|
|
+ width: 400 * window.devicePixelRatio, // 根据设备像素比放大
|
|
|
|
|
+ height: 400 * window.devicePixelRatio,
|
|
|
|
|
+ margin: 0, // 去除内置边距
|
|
|
|
|
+ render: 'canvas',
|
|
|
|
|
+ // 添加canvas样式配置
|
|
|
|
|
+ onRenderingEnd: () => {
|
|
|
|
|
+ const canvas = this.$refs.QRcodes.querySelector('canvas');
|
|
|
|
|
+ canvas.style.width = '300px';
|
|
|
|
|
+ canvas.style.height = '300px';
|
|
|
|
|
+ canvas.style.imageRendering = 'crisp-edges';
|
|
|
|
|
+ },
|
|
|
});
|
|
});
|
|
|
},
|
|
},
|
|
|
closeShare() {
|
|
closeShare() {
|
|
@@ -268,7 +285,7 @@ export default {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
padding-bottom: vw(190);
|
|
padding-bottom: vw(190);
|
|
|
top: 0;
|
|
top: 0;
|
|
|
- // z-index: -10;
|
|
|
|
|
|
|
+ z-index: -10;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.header {
|
|
.header {
|
|
@@ -455,16 +472,17 @@ export default {
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
|
.share {
|
|
.share {
|
|
|
.QRcodes {
|
|
.QRcodes {
|
|
|
- width: vw(140);
|
|
|
|
|
- height: vw(140);
|
|
|
|
|
|
|
+ width: vw(200); // 匹配二维码实际尺寸
|
|
|
|
|
+ height: vw(200);
|
|
|
margin-right: vw(12.5);
|
|
margin-right: vw(12.5);
|
|
|
position: relative;
|
|
position: relative;
|
|
|
- // padding: 2px;
|
|
|
|
|
- // background: #fff;
|
|
|
|
|
|
|
+ background: #ffffff;
|
|
|
|
|
+ padding: 2px;
|
|
|
|
|
+ image-rendering: crisp-edges;
|
|
|
.logo {
|
|
.logo {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
- top: vw(70);
|
|
|
|
|
- left: vw(70);
|
|
|
|
|
|
|
+ top: vw(100);
|
|
|
|
|
+ left: vw(100);
|
|
|
margin: vw(-17.5) 0 0 vw(-17.5);
|
|
margin: vw(-17.5) 0 0 vw(-17.5);
|
|
|
z-index: 3;
|
|
z-index: 3;
|
|
|
img {
|
|
img {
|