hz/ebiz-h5
1
0
Fork 0
mirror of http://112.124.100.131/GFRS/ebiz-h5.git synced 2025-12-10 09:16:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

【桂冠海报自动更新需求】按钮渐变颜色深色色号

Browse Source
This commit is contained in:
lyt
2023-02-03 17:01:04 +08:00
parent 59bb344f86
commit 77f4012b46
1 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/ebiz/laurelClub/ExclusivePosters.vue
View File

@@ -29,7 +29,7 @@
<img id='poster_main-image' src='' class='poster_main-image' style='display: none' />
<div class='bottom_btn'>
<van-button class='share-posters' type='default' @click='shareFunc()' v-no-more-click="1000">分享</van-button>
<van-button class='download-posters' type='default' @click='downLoadImagesFunc()' v-no-more-click="1000">下载</van-button>
<van-button class='download-posters' type='default' :style="{color:posterCanvasObj.fontColor,background:'linear-gradient(135deg, '+posterCanvasObj.lightColor+' 0%, '+posterCanvasObj.darkColor+' 100%)'}" @click='downLoadImagesFunc()' v-no-more-click="1000">下载</van-button>
</div>
</div>
<canvas id='canvas' width='750' height='1271' style='display: none'></canvas>
@@ -71,7 +71,10 @@ export default {
crownLevelImg: '', // 冠级图片地址
memberGradeImg: '', // 会员级别图片地址
imageUrl: '', // canvas绘图后生产的base64格式的图片链接地址
downLoadUrl: '' // 下载图片的链接地址
downLoadUrl: '', // 下载图片的链接地址
fontColor:'', //字体颜色色号
lightColor:'',//按钮渐变颜色浅色色号
darkColor:'' //按钮渐变颜色深色色号
}
}
},
@@ -155,6 +158,12 @@ export default {
this.posterCanvasObj.memberGradeImg = res.content.memberGradeUrl
// 展示地区，名称位置的背景图片
this.posterCanvasObj.nameCardImg = res.content.orthogonUrl
// 字体颜色色号
this.posterCanvasObj.fontColor = res.content.fontColor
// 按钮渐变颜色浅色色号
this.posterCanvasObj.lightColor = res.content.lightColor
// 按钮渐变颜色深色色号
this.posterCanvasObj.darkColor = res.content.darkColor
// 调用canvas绘制页面的方法
this.getCanvas()
} else {
@@ -417,13 +426,11 @@ export default {
font-size: 17px;
font-family: PingFangSC-Medium, PingFang SC;
letter-spacing: 1px;
color: #FFFFFF;
// color: #FFFFFF;
border-radius: 0px;
// border: 1px solid #FFE97C;
background: linear-gradient(135deg, #DD1818 0%, #910A0A 100%);
// background: linear-gradient(135deg, #DD1818 0%, #910A0A 100%);
}
}
}
</style>