2月份的桂冠专属海报--图片替换，位置调整

src/views/ebiz/laurelClub/ExclusivePosters.vue

@@ -42,7 +42,7 @@ import config from '@/config'
 import FieldDatePicter from '@/components/ebiz/FieldDatePicter'
 import { queryPosterDataUrl } from '@/api/ebiz/laurelClub/laurelClub'
 import { uploadImg } from '@/api/ebiz/sale/sale'
-import backgroundImg from '../../../assets/images/laurelClub/posters-background-img.png'
+// import backgroundImg from '../../../assets/images/laurelClub/posters-background-img.png'
 import crownImg from '@/assets/images/laurelClub/crown.png'
 import nameCardImg from '../../../assets/images/laurelClub/posters-name-card-img.png'
 import beforeDate from '@/assets/js/utils/getBeforeDate.js'
@@ -61,7 +61,7 @@ export default {
       },
       // 海报canvas绘图工具中使用到的数据对象
       posterCanvasObj: {
-        backgroundImg: backgroundImg, // 背景图片
+        backgroundImg: '', // 背景图片
         agentHeadImg: '', // 用户头像图片
         crownImg: crownImg, // 皇冠图片
         nameCardImg: nameCardImg, // 展示地区，名称位置的背景图片
@@ -139,6 +139,8 @@ export default {
       let params = { 'mdType': 'd' }
       queryPosterDataUrl(params).then(res => {
         if (res.result == 0) {
+          // 获取背景图片路径地址
+          this.posterCanvasObj.backgroundImg = res.content.backGroundImgUrl
           // 获取用户头像路径地址
           this.posterCanvasObj.agentHeadImg = res.content.agentHeadImgUrl
           // 获取地区数据
@@ -212,20 +214,20 @@ export default {
 
       backgroundImg.onload = function() {
         setTimeout(function() {
-          ctx.drawImage(agentHeadImg, 215, 250, 320, 320) // 头像
+          ctx.drawImage(agentHeadImg, 175, 320, 400, 400) // 头像
           ctx.drawImage(backgroundImg, 0, 0, 750, 1271) // 背景图
-          ctx.drawImage(crownImg, 280, 135, 188, 134) // 皇冠
-          ctx.drawImage(nameCardImg, 210, 790, 328, 74) // 展示地区，名称位置的背景图片
-          ctx.drawImage(crownLevelImg, 320, 870) // 展示地区，名称位置的背景图片
-          ctx.drawImage(memberGradeImg, 280, 925) // 展示地区，名称位置的背景图片
-          ctx.fillStyle = '#FFCB6B'
+          ctx.drawImage(crownImg, 280, 175, 188, 134) // 皇冠
+          ctx.drawImage(nameCardImg, 210, 660, 328, 74) // 展示地区，名称位置的背景图片
+          ctx.drawImage(crownLevelImg, 320, 985) // 冠级
+          ctx.drawImage(memberGradeImg, 280, 1030) // 会员级别
+          ctx.fillStyle = '#921108'
           ctx.font = 'lighter 32px PingFangSC-Light, PingFang SC'
           ctx.textAlign = 'center'
-          ctx.fillText(that.posterCanvasObj.managerComName, 310, 830) // 地区名称
-          ctx.fillStyle = '#FFCB6B'
+          ctx.fillText(that.posterCanvasObj.managerComName, 320, 708) // 地区名称（南宁青秀）
+          ctx.fillStyle = '#921108'
           ctx.font = '32px SourceHanSerifCN-SemiBold'
           ctx.textAlign = 'center'
-          ctx.fillText(that.posterCanvasObj.name, 450, 830) // 名称
+          ctx.fillText(that.posterCanvasObj.name, 450, 708) // 名字（张洋溢）
           //生成src
           var genUrl = canvas.toDataURL()
           var element = document.getElementById('poster_main-image')
@@ -416,7 +418,7 @@ export default {
       color: #FFCB6B;
       border-radius: 0px;
       border: 1px solid #FFE97C;
-      background: linear-gradient(135deg, #30339A 0%, #181935 100%);
+      background: linear-gradient(135deg, #DD1818 0%, #910A0A 100%);
     }
   }
 }