xiaoe_mp_npm 0.1.1 → 0.1.2

package/src/SharePoster/PosterDom/index.js

@@ -1,1863 +1,1863 @@
-import  objToPoster from '../createPoster/index'
-import { posterInfo } from '../libs/positionMap';
-import { TYPES,POSTER_CLS, } from '../libs/constant';
-const computedBehavior = require('miniprogram-computed').behavior;
-const POSTER_WIDTH = 750;
-const POSTER_HEIGHT = 1344;
-
-let ID = 0
-
-Component({
-    behaviors: [computedBehavior],
-    /**
-     * 组件的属性列表
-     */
-    /**
-   * 组件的属性列表
-   */
-    properties: {
-        isSinglePoster: {
-            type: Boolean,
-            value: false
-        },
-        motiveInfo: {
-            type: Array,
-            value: () => {
-                return [];
-            }
-        },
-        posterItem: {
-            type: Object,
-            value: () => {},
-        },
-        promotionInfo:{
-            type: Object,
-            value: () => {
-                return {};
-            }
-        },
-        showPopup:{
-            type: Boolean,
-            value: false 
-        }
-    },
-    observers: {
-        posterItem(newData) {
-            if(Object.getOwnPropertyNames(newData).length){
-                this.setData({
-                    isVisible :true,
-                    posterItemData:newData,
-                    posterStyle:newData.default_poster_mark
-                })
-            }
-            if(Object.getOwnPropertyNames(newData).length && Object.getOwnPropertyNames(this.properties.promotionInfo).length && this.properties.promotionInfo.resource_info.qr_code.includes("myqcloud")){
-                if(this.properties.showPopup){
-                    this.generatePoster(15);  
-                }
-            }
-        },
-        promotionInfo(newData){
-            if(Object.getOwnPropertyNames(newData).length && newData.resource_info.qr_code.includes("myqcloud") && Object.getOwnPropertyNames(this.properties.posterItem).length){
-                if(this.properties.showPopup){
-                    this.generatePoster(15);  
-                }
-            }
-        },
-    },
-    lifetimes: {
-        attached(){
-            var app = getApp()
-            app.globalData[`poster${ID++}`] = this
-        },
-        ready(){
-            this.cleanUpWxFileSystemMemory(2);
-        }
-    },
-    /**
-     * 组件的初始数据
-     */
-    data: {
-        imgSrc:'',
-        imageUrl:'',
-        isVisible:true,
-        posterMapInfo: posterInfo,
-        motiveInfoData:{"text":"世上没有任何伟业的成就能够离得开激情。","auther":"黑格尔"},
-        shareAddInfo:{},
-        posterObj:{},
-        isSwitchBtnShow:false,
-        posterItemData:{},
-        posterStyle:"",
-        defaultAvatarUrl: 'https://wechatavator-1252524126.cos.ap-shanghai.myqcloud.com/dasda.jpg',
-    },
-    computed:{
-        posterData(data) {
-            let temInfo = data.posterItemData;
-            let defaultPoster = data.posterMapInfo[data.posterItemData.default_poster_mark];
-            temInfo = {...data.posterItemData, ...defaultPoster};
-            console.log(temInfo,'teninfo');
-            return temInfo;
-        },
-        // 根据不同商品类型展示不同邀请文案
-        shareHint(data) {
-            let resType = data.promotionInfo && data.promotionInfo.resource_info && data.promotionInfo.resource_info.resource_type;
-            let shareTxt = '';
-            if (data.posterData.is_default === 1) {
-                switch (resType) {
-                case 2:
-                    shareTxt = '邀请你一起收听';
-                    break;
-                case 4:
-                    shareTxt = '邀请你一起观看';
-                    break;
-                case 20:
-                    shareTxt = '邀请你一起阅读';
-                    break;
-                case 21:
-                    shareTxt = '邀请你一起购买';
-                    break;
-                case 31:
-                case 29:
-                case 25:
-                case 35:
-                    shareTxt = '邀请你一起参加';
-                    break;
-                default:
-                    shareTxt = '邀请你一起学习';
-                    break;
-                }
-            }
-
-            return shareTxt;
-        },
-        userInfo(data) {
-            return data.promotionInfo.user_info || { wx_avatar: '', wx_nickname: '' };
-        },
-        // posterStyle(data) {
-        //     return data.posterData && data.posterData.default_poster_mark || "";
-        // },
-        showGoods(data) {
-            let showGood = data.posterData.is_show_goods;
-            if (data.posterStyle !== POSTER_CLS.USER_CUSTOM) {
-                showGood = data.posterData.goods_position;
-            }
-            return showGood;
-        },
-        showGoodsImg(data) {
-            let showImg = true;
-            if (data.posterData.is_default === 1) {
-                showImg = data.posterData.show_goods_img;
-            }
-            return showImg;
-        },
-        showFinger(data) {
-            return data.posterData.qr_code_type === 1 && data.posterData.is_default === 0;
-        },
-        resource_info(data) {
-            return data.promotionInfo && data.promotionInfo.resource_info;
-        },
-        isShowPrice(data) {
-            let showPrcie = true;
-            let payment_type = data.resource_info && data.resource_info.payment_type || 2; //仅关联不展示价格
-            if (data.posterStyle !== POSTER_CLS.USER_CUSTOM) {
-                showPrcie = data.posterData.has_price_info;
-            } else {
-                showPrcie = data.posterData.is_show_price && payment_type != 3;
-            }
-            return showPrcie;
-        },
-        activityLable(data) {
-            return data.resource_info && data.resource_info.activity_label || '';
-        },
-        zbStartAt(data) {
-            return data.resource_info && data.resource_info.zb_start_at && data.resource_info.zb_start_at.split(' ');
-        },
-        resourceLinePrice(data) {
-            return data.resource_info && data.resource_info.line_price ? String((data.resource_info.line_price / 100).toFixed(2)) : '';
-        }
-      },
-  
-    /**
-     * 组件的方法列表
-     */
-    methods: {
-        getPosterData() {
-            let temInfo = this.data.posterItemData;
-            let defaultPoster = this.data.posterMapInfo[this.data.posterItemData.default_poster_mark];
-            temInfo = {...this.data.posterItemData, ...defaultPoster};
-            return temInfo;
-        },
-        // 价格的 单位、整数、小数部分字体大小不同，需分别绘制再拼接
-        // x，y 表示起始位置
-        getResourcePrice(x, y, color,poster) {
-            const { price } = this.data.resource_info;
-            if (price === 0) {
-                return [
-                    {
-                        label: 'free',
-                        type: "font",
-                        x,
-                        y,
-                        value: '免费',
-                        size: 40,
-                        color
-                    }
-                ];
-            }
-            const [priceInt, priceFloat] = String((price / 100).toFixed(2)).split('.');
-            const unitProps = {
-                label: 'priceUnit',
-                type: "font",
-                x,
-                y,
-                value: '¥',
-                size: 40,
-                fontWeight: 'normal',
-                color
-            };
-            const MARGIN_RIGHT = 8;
-            const priceIntProps = {
-                label: 'priceInt',
-                type: "font",
-                x: x + poster.getTextRect(unitProps).width + MARGIN_RIGHT,
-                y: y - 10,
-                value: priceInt,
-                size: 60,
-                fontWeight: 'normal',
-                color
-            };
-            const priceFloatProps = {
-                label: 'priceFloat',
-                type: "font",
-                x:
-                    x +
-                    poster.getTextRect(priceIntProps).width +
-                    poster.getTextRect(unitProps).width +
-                    MARGIN_RIGHT,
-                y,
-                value: `.${priceFloat}`,
-                size: 40,
-                fontWeight: 'normal',
-                color
-            };
-            return [unitProps, priceIntProps, priceFloatProps];
-        },
-        // 实际渲染的价格包含三个部分：整数、小数点、小数点后两位
-        getResourcePriceRect(poster) {
-            const [unitProps, priceIntProps, priceFloatProps] = this.getResourcePrice(0, 0, 'black',poster);
-            const unitTextRect = poster.getTextRect(unitProps);
-            const priceIntTextRect = poster.getTextRect(priceIntProps);
-            const priceFloatTextRect = poster.getTextRect(priceFloatProps);
-            return {
-                width: unitTextRect.width + priceIntTextRect.width + priceFloatTextRect.width,
-                height: Math.max(unitTextRect.height, priceIntTextRect.height, priceFloatTextRect.height)
-            };
-        },
-        generatePoster(random){
-            const that = this
-            this.triggerEvent('drawPosterBegin');
-            new objToPoster(POSTER_WIDTH,POSTER_HEIGHT,1,this).initCanvas(this,1).then(res=>{
-                this.posterObj =  this.getPosterConfig(res);
-                return this.posterObj && res.convertToImg(this.posterObj)
-            }).then(response=>{
-                if(response){
-                    this.cleanUpWxFileSystemMemory(43);
-                    this.getWxFilesListAndWriteFile(response,random);
-                }
-            })
-        },
-        getImageSrc(response) {
-            console.log('getImageSrc: ', response)
-            this.setData({
-                imgSrc: response,
-                imageUrl: response,
-                isVisible: false
-            },()=>{
-
-                console.log('imageUrl', this.data.imageUrl)
-            })
-        },
-        getWxFilesListAndWriteFile(response,random){
-            let that = this;
-            const fs = wx.getFileSystemManager();
-            fs.readdir({
-                dirPath: wx.env.USER_DATA_PATH,
-                success(res) {
-                    //res.files为存入的列表路径
-                    let filesList = res.files;
-                    let isOtherPosterExist = false;
-                    let isStudyPosterExist = false;
-                    if(filesList.length>2){
-                        isStudyPosterExist = that.data.posterStyle === POSTER_CLS.STUDY && filesList.some(item=>{
-                            let num = +(item.replace(/[^0-9]/ig,""))
-                            return num === random && item.includes(that.data.posterStyle)
-                        })
-                        isOtherPosterExist = that.data.posterStyle !== POSTER_CLS.STUDY && filesList.some(item=>{
-                            return item.includes(that.data.posterStyle)
-                        })
-                        if(!(isStudyPosterExist || isOtherPosterExist)){
-                            that.wxWriteFile(response,random)
-                        }else{
-                            if(isStudyPosterExist){
-                                that.setData({
-                                    imageUrl:wx.env.USER_DATA_PATH + '/'+ that.data.posterStyle + random +'.png'
-                                })
-                            }else if(isOtherPosterExist){
-                                that.setData({
-                                    imageUrl:wx.env.USER_DATA_PATH + '/'+ that.data.posterData.id +'.png'
-                                })
-                            }
-                            let isShow = that.data.posterData && that.data.posterData.default_poster_mark === POSTER_CLS.STUDY;
-                            that.setData({
-                                isSwitchBtnShow: isShow,
-                                isVisible: false
-                            })
-                            that.triggerEvent('drawPosterFulfilled');
-                        }
-                    }else{
-                        that.wxWriteFile(response,random)
-                    }
-                }
-            })
-        },
-        cleanUpWxFileSystemMemory(n){
-            const fs = wx.getFileSystemManager();
-            fs.readdir({
-                dirPath: wx.env.USER_DATA_PATH,
-                success(res) {
-                    //res.files为存入的列表路径
-                    let indexVal = res.files.length;
-                    //由于微信本地存储超过10M时，写入文件失败，10M大概是43张海报的内存，所以大于42时，清除垃圾文件，再写入
-                    if(indexVal>n){
-                        res.files.forEach((el) => {
-                            let name = (wx.env.USER_DATA_PATH+el).replace(/usr/g, "usr/");
-                            fs.unlink({
-                                filePath:name,
-                                fail(e) {
-                                    console.log('文件删除失败：', e)
-                                },
-                                success(succ){
-                                    console.log('文件删除成功：', succ);
-                                }
-                            })
-                        })
-                    } 
-                }
-            })
-        },
-        wxWriteFile(response,random){
-            const fs = wx.getFileSystemManager();
-            //随机定义路径名称
-            let codeimg =this.data.posterStyle === POSTER_CLS.STUDY ? wx.env.USER_DATA_PATH + '/' + this.data.posterStyle + random + '.png': wx.env.USER_DATA_PATH + '/' + this.data.posterData.id + '.png';
-            //将base64图片写入
-            fs.writeFile({
-                filePath: codeimg,
-                data: response.slice(22),
-                encoding: 'base64',
-                success: (res) => {
-                    //写入成功了的话，新的图片路径就能用了
-                    console.log(res)
-                    console.log("codeimg: ",codeimg)
-                    // this.imgSrc=codeimg;
-                    this.setData({
-                        imageUrl:codeimg
-                    })
-                    let isShow = this.data.posterData && this.data.posterData.default_poster_mark === POSTER_CLS.STUDY;
-                    this.setData({
-                        isSwitchBtnShow:isShow
-                    })
-                    this.triggerEvent('drawPosterFulfilled');
-                },
-                fail:(error)=>{
-                    console.log(error);
-                }
-            })
-        },
-        getPosterConfig(poster){
-            const drawPosterFnMaps = {
-                [POSTER_CLS.USER_CUSTOM]: this.drawUserCustomPoster,
-                [POSTER_CLS.STUDY]: this.drawStudyPoster,
-                [POSTER_CLS.PRICE_ONE]: this.drawPriceOnePoster,
-                [POSTER_CLS.INTERACT_ONE]: this.drawInteractOnePoster,
-                [POSTER_CLS.INTERACT_TWO]: this.drawInteractTwoPoster,
-                [POSTER_CLS.PRICE_TWO]: this.drawPriceTwoPoster,
-                [POSTER_CLS.INTERACT_THREE]: this.drawInteractThreePoster,
-                [POSTER_CLS.ENTITY]: this.drawEntityPoster,
-                [POSTER_CLS.ALIVE]: this.drawAlivePoster,
-                [POSTER_CLS.ALIVE_GENERAL]: this.drawAliveGeneralPoster,
-                [POSTER_CLS.ALIVE_SPECIFIC]: this.drawAliveSpecificPoster
-            };
-            console.log(this.data.posterStyle,'this.data.posterStyle')
-            if(!this.data.posterStyle){
-                return
-            }
-            const drawFn = drawPosterFnMaps[this.data.posterStyle].bind(this);
-            if (!drawFn) {
-                console.warn('未知的海报类型', this.data.posterStyle);
-                return;
-            }
-            let posterConfigObj = drawFn(poster);
-            return posterConfigObj;
-        },
-        // 绘制自定义海报
-        // 自定义海报的 头像、昵称、二维码，是否展示、位置、宽高都是取的接口数据。
-        // 其中 二维码类型需要单独区分 并计算位置和宽高
-        // 条件渲染约定的值比较混乱
-        drawUserCustomPoster(poster) {
-            const isShowAvatar = [1, 2].includes(this.data.posterData.is_show_avatar); // 1和2 展示
-            const isShowNickname = [1, 2].includes(this.data.posterData.is_show_nickname); // 1和2 展示
-            const isShowGoods = this.data.posterData.is_show_goods === 1;
-            const isShowPrice = this.data.posterData.is_show_price === 1;
-            const isHideQrcode = this.data.posterData.qr_code_type === 2; // 0和1 展示
-            const isShowFingerprints = this.data.posterData.is_show_fingerprints === 1; // 0和2 不展示
-
-           
-            const LINE_PRICE_MARGIN_RIGHT = 80;
-            const linePriceProps = {
-                label: 'resourceLinePrice',
-                type: TYPES.TEXT,
-                value: this.data.resourceLinePrice,
-                size: 32,
-                fontWeight: 'bold',
-                color: '#777',
-                textStyle: 'stroke'
-            };
-
-            // 部分公共数据提取出来，包含：背景图、价格、划线价、资源图、标题
-            const commonWidgets = [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                isShowGoods && isShowPrice &&
-                    this.data.resourceLinePrice && {
-                    ...linePriceProps,
-                    x: POSTER_WIDTH - poster.getTextRect(linePriceProps).width - LINE_PRICE_MARGIN_RIGHT,
-                    y: 830
-                },
-                ...(isShowGoods && isShowPrice ? this.getResourcePrice(88, 830, '#FE8946',poster) : []),
-                isShowGoods && {
-                    label: 'goodsName',
-                    type: TYPES.TEXT,
-                    x: 88,
-                    y: !isShowPrice ? 826 : 890,
-                    value: this.data.resource_info.title,
-                    size: 32,
-                    fontWeight: 'normal',
-                    color: 'black',
-                    maxWidth: 550,
-                    textOverflow: 'ellipsis'
-                },
-                isShowGoods && {
-                    label: 'goodsImg',
-                    type: TYPES.IMG,
-                    imgRoundType:'halfRoundRect',
-                    src: this.data.resource_info && this.data.resource_info.img_url,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 310,
-                    width: 640,
-                    height: 640 * 0.75,
-                },
-                isShowGoods && {
-                    label: 'resourceAdditionalBackground',
-                    type: TYPES.SHAPE,
-                    width: 640,
-                    height: !isShowPrice ? 100 : 180,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 790,
-                    r:20,
-                    color: 'white',
-                    shape:'bottomRoundRect',
-                }
-            ];
-
-            // 新老数据逻辑上分开渲染，方便后续维护
-            const isNewDataSource = Boolean(
-                this.data.posterData.qrcode_size && this.data.posterData.avatar_size && this.data.posterData.nickname_size
-            );
-
-            console.log('isNewDataSource: ', isNewDataSource);
-            if (isNewDataSource) {
-                // 昵称最长不超出海报边界
-                // 省略号...约等于一个字的宽度
-                const NICKNAME_MARGIN_RIGHT = this.data.posterData.nickname_size.size;
-                let nicknameMaxWidth = 400;
-                if (this.data.posterData.is_show_avatar === 1) {
-                    const centralPoint = this.data.posterData.avatar_position.x + this.data.posterData.avatar_size.w / 2;
-                    nicknameMaxWidth = 2 * Math.min(POSTER_WIDTH - centralPoint, centralPoint) - NICKNAME_MARGIN_RIGHT*2;
-                }
-                if (this.data.posterData.is_show_avatar === 2) {
-                    nicknameMaxWidth = POSTER_WIDTH - this.data.posterData.nickname_position.x - NICKNAME_MARGIN_RIGHT;
-                }
-                const nicknameProps = {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    value: this.data.userInfo.wx_nickname,
-                    size: this.data.posterData.nickname_size.size,
-                    fontWeight: 'normal',
-                    color: this.data.posterData.nickname_color === 1 ? 'black' : 'white', // 0 | 1 | 2
-                    maxWidth:  nicknameMaxWidth,
-                    textOverflow: 'ellipsis'
-                };
-                const nicknameRect = poster.getTextRect(nicknameProps);
-                let nicknameX = this.data.posterData.nickname_position.x;
-                // is_show_avatar === 1 时，昵称相对于头像 居中展示
-                if (this.data.posterData.is_show_avatar === 1) {
-                    nicknameX =
-                        this.data.posterData.avatar_position.x + this.data.posterData.avatar_size.w / 2 - nicknameRect.width / 2;
-                }
-                return [
-                    ...commonWidgets,
-                    isShowNickname && {
-                        ...nicknameProps,
-                        x: nicknameX,
-                        y: this.data.posterData.nickname_position.y,
-                    },
-                    isShowAvatar && {
-                        label: 'avatar',
-                        type: TYPES.IMG,
-                        src: this.data.userInfo.wx_avatar,
-                        x: this.data.posterData.avatar_position.x,
-                        y: this.data.posterData.avatar_position.y,
-                        width: this.data.posterData.avatar_size.w,
-                        height: this.data.posterData.avatar_size.h,
-                        border:this.data.posterData.avatar_size.w
-                    },
-                    // 二维码和指纹宽高 需单独计算
-                    // 已知：二维码 和 指纹宽高一致，且能拿到整体宽高 qrcode_size.x qrcode_size.y
-                    // 间隙需动态调整
-                    isHideQrcode || {
-                        label: 'qrcode',
-                        type: TYPES.IMG,
-                        imgRoundType : 'fullRoundRect',
-                        src: this.data.resource_info && this.data.resource_info.qr_code,
-                        x: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.x,
-                        y: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.y,
-                        width: this.data.posterData.qrcode_size.h,
-                        height: this.data.posterData.qrcode_size.h,
-                    },
-                    isShowFingerprints && {
-                        label: 'fingerprint',
-                        type: TYPES.IMG,
-                        // 新数据 fingerprint_position 废弃不用
-                        x:
-                            this.data.posterData.qrcode_position.x +
-                            this.data.posterData.qrcode_size.w -
-                            this.data.posterData.qrcode_size.h,
-                        // 注意：顶部和二维码对齐，这里是之前已有的逻辑（由于fingerprint_position和qrcode_position数据y不一致，直接采用二维码的y值定位）
-                        y: this.data.posterData.qrcode_position.y,
-                        width: this.data.posterData.qrcode_size.h,
-                        height: this.data.posterData.qrcode_size.h,
-                        src: 'http://wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/859093d21aee5d46f4a58d3842f81d0d.png'
-                    }
-                ];
-            } else {
-                // 注意：以下代码为兼容海报旧数据（已废弃）的特殊逻辑。
-                // 由于旧数据及其不准确，之前是前端对错误的数据进行兜底特殊处理，几乎无法维护。
-                // 以下逻辑完全照搬旧代码，非必要勿动。
-                const NICKNAME_MARGIN_RIGHT = 36;
-                const nicknameProps = {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    x: this.data.posterData.nickname_position.x,
-                    y: this.data.posterData.nickname_position.y,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 32,
-                    fontWeight: 'normal',
-                    color: this.data.posterData.nickname_color === 1 ? 'black' : 'white', // 0 | 1 | 2
-                    textOverflow: 'ellipsis'
-                };
-                const nicknameRect = poster.getTextRect(nicknameProps);
-                let nicknameX = this.data.posterData.nickname_position.x;
-                let nicknameY = this.data.posterData.nickname_position.y;
-                let align = this.data.posterData.nickname_position.align || 'left';
-                if (align === 'center') {
-                    nicknameX = nicknameX - nicknameRect.width / 2;
-                }
-                // 由于b端自定义海报时，昵称距离海报边框有距离，所以如果left小于/等于18，则left取值为18
-                nicknameX = Math.max(18, nicknameX);
-                nicknameY = nicknameY - nicknameRect.height / 4;
-                return [
-                    ...commonWidgets,
-                    isShowNickname && {
-                        ...nicknameProps,
-                        x: nicknameX,
-                        y: nicknameY,
-                        maxWidth: POSTER_WIDTH - nicknameX - NICKNAME_MARGIN_RIGHT
-                    },
-                    isShowAvatar && {
-                        label: 'avatar',
-                        type: TYPES.IMG,
-                        x: this.data.posterData.avatar_position.x,
-                        y: this.data.posterData.avatar_position.y-10,
-                        width: 90,
-                        height: 90,
-                        src: this.data.userInfo.wx_avatar,
-                        border:90
-                    },
-                    isHideQrcode || {
-                        label: 'qrcode',
-                        type: TYPES.IMG,
-                        imgRoundType : 'fullRoundRect',
-                        x: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.x,
-                        y: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.y,
-                        width: 150,
-                        height: 150,
-                        src: this.data.resource_info && this.data.resource_info.qr_code,
-                    },
-                    isShowFingerprints && {
-                        label: 'fingerprint',
-                        type: TYPES.IMG,
-                        x: this.data.posterData.fingerprint_position.x,
-                        y: this.data.posterData.fingerprint_position.y,
-                        width: 140,
-                        height: 140,
-                        src: 'http://wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/859093d21aee5d46f4a58d3842f81d0d.png'
-                    }
-                ];
-            }
-        },
-        //实物商品只有一张海报的场景
-        drawEntityPoster(poster) {
-            const LABEL_PADDING = 16;
-            const LINE_PRICE_MARGIN_LEFT = 120;
-            const shopNameProps = {
-                label: 'shopName',
-                type: TYPES.TEXT,
-                y: 196,
-                value: this.data.posterData.shop_name,
-                size: 30,
-                fontWeight: 'normal',
-                color: 'white',
-                maxWidth: 500
-            };
-            const shopNameRect = poster.getTextRect(shopNameProps);
-            const linePriceProps = {
-                label: 'resourceLinePrice',
-                type: TYPES.TEXT,
-                value: this.data.resourceLinePrice,
-                size: 32,
-                fontWeight: 'bold',
-                color: '#777',
-                textStyle: 'stroke'
-            };
-            return [{
-                label: 'posterBg',
-                type: TYPES.BG_IMG,
-                src: this.data.posterData.poster_url,
-                x:0,
-                y:0,
-                width:POSTER_WIDTH,
-                height:POSTER_HEIGHT
-            },
-            {
-                label: 'avatar',
-                type: TYPES.IMG,
-                x: 48,
-                y: 32,
-                width: 100,
-                height: 100,
-                src: this.data.userInfo.wx_avatar,
-                border: 50
-            },
-            {
-                label: 'nickname',
-                type: TYPES.TEXT,
-                x: 170,
-                y: 48,
-                value: this.data.userInfo.wx_nickname,
-                size: 36,
-                fontWeight: 'bold',
-                color: 'black',
-                maxWidth: 500,
-                textOverflow: 'ellipsis'
-            },
-            {
-                label: 'sharePrompt',
-                type: TYPES.TEXT,
-                x: 170,
-                y: 96,
-                value: this.data.shareHint,
-                size: 28,
-                color: '#444'
-            },
-            {
-                label: 'goodsImg',
-                type: TYPES.IMG,
-                imgRoundType : 'fullRoundRect',
-                src: this.data.resource_info.img_url,
-                x: POSTER_WIDTH / 2 - 620 / 2,
-                y: 180,
-                width: 620,
-                height: 620  
-            },
-            {
-                label: 'goodsName',
-                type: TYPES.TEXT,
-                x: 80,
-                y: 950,
-                value: this.data.resource_info.title,
-                size: 32,
-                fontWeight: 'normal',
-                color: 'black',
-                maxWidth: 600,
-                textOverflow: 'wrap',
-                lineHeight:48
-            },
-            {
-                label: 'shopNameLabel',
-                type: TYPES.SHAPE,
-                x: POSTER_WIDTH - shopNameRect.width - 82 - LABEL_PADDING*2,
-                y: shopNameProps.y - LABEL_PADDING/2-4,
-                r: 4,
-                width: shopNameRect.width + 2 * LABEL_PADDING,
-                height: shopNameProps.size + LABEL_PADDING/2,
-                shape:'diagonalRoundRect',
-                color: '#FD822B'
-            },
-            {
-                ...shopNameProps,
-                x: POSTER_WIDTH - shopNameRect.width - 80
-            },
-            this.data.resourceLinePrice && {
-                ...linePriceProps,
-                x: this.getResourcePriceRect(poster).width + LINE_PRICE_MARGIN_LEFT,
-                y: 884
-
-            },
-            ...this.getResourcePrice(80, 880, '#FD822B',poster),
-            {
-                label: 'qrcode',
-                type: TYPES.IMG,
-                src: this.data.resource_info.qr_code,
-                x: 80,
-                y: 1080,
-                width: 160,
-                height: 160,
-            }
-            ];
-        },
-        // drawStudyPoster(poster) {
-        //     const motiveTextProps = {
-        //         label: 'motiveText',
-        //         type: TYPES.TEXT,
-        //         x: 80,
-        //         y: 510,
-        //         value: this.data.motiveInfoData.text,
-        //         size: 32,
-        //         color: 'black',
-        //         lineHeight: 48,
-        //         maxWidth: 590,
-        //         textOverflow: 'wrap' // wrap ellipsis
-        //     };
-        //     const motiveTextAuthorProps = {
-        //         label: 'motiveTextAuthor',
-        //         type: TYPES.TEXT,
-        //         value: `—— ${this.data.motiveInfoData.auther}`,
-        //         size: 32,
-        //         color: 'black',
-        //         maxWidth: 600
-        //     };
-        //     const motiveTextAuthorRect = poster.getTextRect(motiveTextAuthorProps);
-        //     const motiveTextRect = poster.getTextRect(motiveTextProps);
-        //     return [{
-        //         label: 'posterBg',
-        //         type: TYPES.BG_IMG,
-        //         src: this.data.posterData.poster_url,
-        //         x:0,
-        //         y:0,
-        //         width:POSTER_WIDTH,
-        //         height:POSTER_HEIGHT
-        //     },
-        //     {
-        //         label: 'avatar',
-        //         type: TYPES.IMG,
-        //         x: 122,
-        //         y: 256,
-        //         width: 160,
-        //         height: 160,
-        //         src: this.data.userInfo.wx_avatar,
-        //         border: 80
-        //     },
-        //     {
-        //         label: 'nickname',
-        //         type: TYPES.TEXT,
-        //         x: 320,
-        //         y: 280,
-        //         value: this.data.userInfo.wx_nickname,
-        //         size: 44,
-        //         fontWeight: 'bold',
-        //         color: 'black',
-        //         maxWidth: 280,
-        //         textOverflow: 'ellipsis'
-        //     },
-        //     {
-        //         label: 'sharePrompt',
-        //         type: TYPES.TEXT,
-        //         x: 320,
-        //         y: 340,
-        //         value: this.data.shareHint,
-        //         size: 40,
-        //         color: 'black'
-        //     },
-        //     motiveTextProps,
-        //     {
-        //         label: 'resourceTitle',
-        //         type: TYPES.TEXT,
-        //         x: 80,
-        //         y: 800,
-        //         value: this.data.resource_info.title,
-        //         size: 36,
-        //         fontWeight: 'normal',
-        //         color: 'black',
-        //         maxWidth: 590,
-        //         textOverflow: 'ellipsis'
-        //     },
-        //     // {
-        //     //     label: 'qrcode',
-        //     //     type: TYPES.IMG,
-        //     //     x: POSTER_WIDTH / 2 - 168 / 2,
-        //     //     y: 928,
-        //     //     width: 168,
-        //     //     height: 168,
-        //     //     src: this.data.resource_info.qr_code
-        //     // },
-        //     {
-        //         label: 'scanPrompt',
-        //         type: TYPES.TEXT,
-        //         x: 0,
-        //         y: 1110,
-        //         value: '长按扫码查看详情',
-        //         size: 24,
-        //         fontWeight: 'bold',
-        //         color: 'black',
-        //         textAlign: "center"
-        //     },
-        //     {
-        //         label: 'shopName',
-        //         type: TYPES.TEXT,
-        //         y: 898,
-        //         value: this.data.posterData.shop_name,
-        //         size: 32,
-        //         fontWeight: 'bold',
-        //         color: 'black',
-        //         maxWidth: 590,
-        //         textAlign: "center"
-        //     },
-        //     {
-        //         ...motiveTextAuthorProps,
-        //         x: POSTER_WIDTH - motiveTextAuthorRect.width - 80,
-        //         y: 500 + motiveTextRect.height
-        //     }
-        //     ];
-        // },
-        drawPriceOnePoster(poster) {
-            const shopNameProps = {
-                label: 'shopName',
-                type: TYPES.TEXT,
-                y: 346,
-                value: this.data.posterData.shop_name,
-                size: 32,
-                fontWeight: 'bold',
-                color: 'white',
-                maxWidth: 500
-            };
-            const shopNameRect = poster.getTextRect(shopNameProps);
-            const LABEL_PADDING = 4;
-            const LINE_PRICE_MARGIN_RIGHT = 56;
-            const linePriceProps = {
-                label: 'resourceLinePrice',
-                type: TYPES.TEXT,
-                value: this.data.resourceLinePrice,
-                size: 32,
-                fontWeight: 'bold',
-                color: '#777',
-                textStyle: 'stroke'
-            };
-            let posterConfigArr =  [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 160 / 2,
-                    y: 25,
-                    width: 160,
-                    height: 160,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 80
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    y: 200,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 44,
-                    fontWeight: 'bold',
-                    color: 'white',
-                    maxWidth: 600,
-                    textOverflow: 'ellipsis',
-                    textAlign: "center"
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    y: 260,
-                    value: this.data.shareHint,
-                    size:40,
-                    color: 'white',
-                    textAlign:"center"
-                },
-                {
-                    label: 'resourceAdditionalBackground',
-                    type: TYPES.IMG,
-                    x: 34,
-                    y: 804,
-                    width: 684,
-                    height: 184,
-                    src: this.data.posterData.goods_add_bg
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 324,
-                    width: 640,
-                    height: 640 * 0.75,
-                    src: this.data.resource_info.img_url,
-                    imgRoundType:'halfRoundRect'
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    x: 66,
-                    y: 840,
-                    value: this.data.resource_info.title,
-                    size: 32,
-                    fontWeight: 'bold',
-                    color: 'black',
-                    maxWidth: 600,
-                    textOverflow: 'ellipsis'
-                },
-                this.data.resourceLinePrice && {
-                    ...linePriceProps,
-                    x: POSTER_WIDTH - poster.getTextRect(linePriceProps).width - LINE_PRICE_MARGIN_RIGHT,
-                    y: 900
-                },
-                ...this.getResourcePrice(66, 900, '#fd0300',poster),
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 144 / 2,
-                    y: 1026,
-                    width: 144,
-                    height: 144,
-                    src: this.data.resource_info.qr_code
-                },
-                {
-                    label: 'shopNameLabel',
-                    type: TYPES.SHAPE,
-                    x: POSTER_WIDTH - shopNameRect.width - 77 - LABEL_PADDING,
-                    y: shopNameProps.y - LABEL_PADDING,
-                    r: 8,
-                    width: shopNameRect.width + 2 * LABEL_PADDING,
-                    height: 40,
-                    shape: 'diagonalRoundRect',
-                    color: '#FA6A4A'
-                },
-                {
-                    ...shopNameProps,
-                    x: POSTER_WIDTH - shopNameRect.width - 77
-                }
-            ];
-            if (this.data.resource_info.activityLabel) {
-                const activityTitleProps = {
-                    label: 'activityTitle',
-                    type: TYPES.TEXT,
-                    x: 240,
-                    y: 890,
-                    value: this.data.resource_info.activityLabel,
-                    fontSize: 32,
-                    fontWeight: 'bold',
-                    color: 'white',
-                    maxWidth: 500,
-                    textOverflow: 'ellipsis'
-                };
-                const activityTitleRect = poster.getTextRect(activityTitleProps);
-                
-                posterConfigArr.concat([activityTitleProps,{
-                    label: 'activityLabel',
-                    type: TYPES.SHAPE,
-                    x: 240 - LABEL_PADDING,
-                    y: activityTitleProps.y - LABEL_PADDING,
-                    r: 12,
-                    width: activityTitleRect.width + 2 * LABEL_PADDING,
-                    height: 40,
-                    shape: 'fullRoundRect',
-                    color: '#FA6A48'
-                }]);
-            }
-            return posterConfigArr;
-        },
-        drawInteractOnePoster(poster) {
-            const shopNameProps = {
-                label: 'shopName',
-                type: TYPES.TEXT,
-                y: 414,
-                value: this.data.posterData.shop_name,
-                size: 32,
-                fontWeight: 'bold',
-                color: 'white',
-                maxWidth: 500
-            };
-            const shopNameRect = poster.getTextRect(shopNameProps);
-            const LABEL_PADDING = 4;
-            return [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 160 / 2,
-                    y: 35,
-                    width: 160,
-                    height: 160,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 80
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    y: 220,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 44,
-                    fontWeight: 'bold',
-                    color: 'white',
-                    maxWidth: 600,
-                    textOverflow: 'ellipsis',
-                    textAlign: "center"
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    y: 280,
-                    value: this.data.shareHint,
-                    size: 40,
-                    color: 'white',
-                    textAlign: "center"
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    x: 66,
-                    y: 908,
-                    value: this.data.resource_info.title,
-                    size: 32,
-                    fontWeight: 'normal',
-                    color: 'black',
-                    maxWidth: 620,
-                    textAlign: "center",
-                    textOverflow: 'wrap',
-                    lineHeight: 48
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 392,
-                    width: 640,
-                    height: 640 * 0.75,
-                    src:  this.data.resource_info.img_url,
-                    imgRoundType:'fullRoundRect',
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 180 / 2,
-                    y: 1016,
-                    width: 180,
-                    height: 180,
-                    src: this.data.resource_info.qr_code
-                },
-                {
-                    label: 'scanPrompt',
-                    type: TYPES.TEXT,
-                    x: POSTER_WIDTH / 2 - 144 / 2,
-                    y: 1208,
-                    value: '长按扫码查看详情',
-                    size: 22,
-                    fontWeight: 'normal',
-                    color: 'black',
-                    textAlign: "center"
-                },
-                {
-                    label: 'shopNameLabel',
-                    type: TYPES.SHAPE,
-                    x: POSTER_WIDTH - shopNameRect.width - 74 - LABEL_PADDING,
-                    y: shopNameProps.y - LABEL_PADDING,
-                    r: 8,
-                    width: shopNameRect.width + 2 * LABEL_PADDING,
-                    height: 40,
-                    shape: 'diagonalRoundRect',
-                    color: '#308EF9'
-                },
-                {
-                    ...shopNameProps,
-                    x: POSTER_WIDTH - shopNameRect.width - 74
-                }
-            ];
-        },
-        drawInteractTwoPoster(poster) {
-            return [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: 60,
-                    y: 40,
-                    width: 160,
-                    height: 160,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 80
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    x: 80,
-                    y: 240,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 44,
-                    fontWeight: 'bold',
-                    color: 'white',
-                    maxWidth: 600,
-                    textOverflow: 'ellipsis'
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    x: 80,
-                    y: 300,
-                    value: this.data.shareHint,
-                    size: 40,
-                    color: 'white'
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    x: 80,
-                    y: 860,
-                    value: this.data.resource_info.title,
-                    size: 32,
-                    fontWeight: 'normal',
-                    color: 'white',
-                    maxWidth: 600,
-                    textOverflow: 'wrap',
-                    lineHeight:48
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 350,
-                    width: 640,
-                    height: 640 * 0.75,
-                    src: this.data.resource_info.img_url,
-                    imgRoundType:'halfRoundRect',
-                },
-                {
-                    label: 'resourceAdditionalBackground',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 830,
-                    width: 640,
-                    height: 180,
-                    src: this.data.posterData.goods_add_bg,
-                },
-                {
-                    label: 'shopName',
-                    type: TYPES.TEXT,
-                    x: 56,
-                    y: 1100,
-                    value: this.data.posterData.shop_name,
-                    size: 32,
-                    fontWeight: 'bold',
-                    color: 'white',
-                    maxWidth: 440
-                },
-                {   
-                    label:"whiteLine",
-                    type:TYPES.SHAPE,
-                    width:84,
-                    height:6,
-                    x:56,
-                    y:1155,
-                    r:3,
-                    color:'white',
-                    shape:'fullRoundRect'
-                },
-                {
-                    label: 'scanPrompt',
-                    type: TYPES.TEXT,
-                    x: 56,
-                    y: 1190,
-                    value: '长按扫码查看详情',
-                    size: 32,
-                    fontWeight: 'bold',
-                    color: 'white'
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: 540,
-                    y: 1070,
-                    width: 160,
-                    height: 160,
-                    src: this.data.resource_info.qr_code
-                }
-            ];
-        },
-        drawPriceTwoPoster(poster) {
-            const LINE_PRICE_MARGIN_RIGHT = 56;
-            const linePriceProps = {
-                label: 'resourceLinePrice',
-                type: TYPES.TEXT,
-                value: this.data.resourceLinePrice,
-                size: 32,
-                fontWeight: 'bold',
-                color: '#777',
-                textStyle: 'stroke'
-            };
-            return[
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: 60,
-                    y: 40,
-                    width: 160,
-                    height: 160,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 80
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    x: 80,
-                    y: 240,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 44,
-                    fontWeight: 'bold',
-                    color: 'white',
-                    maxWidth: 600,
-                    textOverflow: 'ellipsis'
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    x: 80,
-                    y: 300,
-                    value: this.data.shareHint,
-                    size: 40,
-                    color: 'white'
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    x: 80,
-                    y: 860,
-                    value: this.data.resource_info.title,
-                    size: 32,
-                    fontWeight: 'normal',
-                    color: 'white',
-                    maxWidth: 550,
-                    textOverflow: 'ellipsis'
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 350,
-                    width: 640,
-                    height: 640 * 0.75,
-                    src: this.data.resource_info.img_url,
-                    imgRoundType:'halfRoundRect',
-                },
-                {
-                    label: 'resourceAdditionalBackground',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 640 / 2,
-                    y: 830,
-                    width: 640,
-                    height: 88,
-                    src: this.data.posterData.goods_add_bg,
-                },
-                this.data.resourceLinePrice && {
-                    ...linePriceProps,
-                    x: POSTER_WIDTH - poster.getTextRect(linePriceProps).width - LINE_PRICE_MARGIN_RIGHT,
-                    y: 980
-                },
-                ...this.getResourcePrice(60, 980, '#FA5988',poster),
-                {
-                    label: 'shopName',
-                    type: TYPES.TEXT,
-                    x: 56,
-                    y: 1132,
-                    value: this.data.posterData.shop_name,
-                    size: 32,
-                    fontWeight: 'bold',
-                    color: 'black',
-                    maxWidth: 440
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: 540,
-                    y: 1100,
-                    width: 160,
-                    height: 160,
-                    src: this.data.resource_info.qr_code
-                }
-            ];
-        },
-        drawInteractThreePoster(poster) {
-            return [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: 54,
-                    y: 120,
-                    width: 160,
-                    height: 160,
-                    src: this.data.userInfo.wx_avatar
-                },
-                {
-                    label: 'avatarBorder',
-                    type: TYPES.IMG,
-                    x: 54,
-                    y: 120,
-                    width: 160,
-                    height: 160,
-                    src: 'http://wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/eafb3f4d43f8101dd2eaff99a149c021.png'
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    x: 60,
-                    y: 320,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 44,
-                    fontWeight: 'bold',
-                    color: '#FCCD9B',
-                    maxWidth: 600,
-                    textOverflow: 'ellipsis'
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    x: 60,
-                    y: 380,
-                    value: this.data.shareHint,
-                    size: 40,
-                    color: '#FCCD9B'
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    y: 520,
-                    value: this.data.resource_info.title,
-                    size: 32,
-                    fontWeight: 'normal',
-                    color: 'black',
-                    maxWidth: 550,
-                    textOverflow: 'wrap',
-                    textAlign: "center",
-                    lineHeight:48
-                },
-                {
-                    label: 'shopName',
-                    type: TYPES.TEXT,
-                    y: 800,
-                    value: this.data.posterData.shop_name,
-                    size: 32,
-                    fontWeight: 'bold',
-                    color: 'black',
-                    maxWidth: 500,
-                    textAlign: "center"
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 240 / 2,
-                    y: 850,
-                    width: 240,
-                    height: 240,
-                    src: this.data.resource_info.qr_code
-                }
-            ];
-        },
-        drawAlivePoster(poster) {
-            const shopNameProps = {
-                label: 'shopName',
-                type: TYPES.TEXT,
-                y: 760,
-                value: `来自「${this.data.posterData.shop_name}」`,
-                size: 24,
-                fontWeight: 'bold',
-                color: '#1560F4',
-                maxWidth: 340
-            };
-            return [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: 40,
-                    y: 40,
-                    width: 140,
-                    height: 140,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 70
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    x: 210,
-                    y: 70,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 48,
-                    fontWeight: 'bold',
-                    color: 'black',
-                    maxWidth: 470,
-                    textOverflow: 'ellipsis'
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    x: 210,
-                    y: 130,
-                    value: this.data.shareHint,
-                    size: 36,
-                    color: 'black'
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 700 / 2,
-                    y: 200,
-                    width: 700,
-                    height: 700 * 0.75,
-                    src: this.data.resource_info.img_url,
-                    imgRoundType:'fullRoundRect',
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    x: 40,
-                    y: 840,
-                    value: this.data.resource_info.title,
-                    size: 40,
-                    fontWeight: 'bold',
-                    color: 'black',
-                    maxWidth: 664,
-                    textOverflow: 'wrap',
-                    lineHeight: 48
-                },
-                {
-                    ...shopNameProps,
-                    x: POSTER_WIDTH - poster.getTextRect(shopNameProps).width - 20
-                },
-                {
-                    label: 'aliveStartTime',
-                    type: TYPES.TEXT,
-                    x: 88,
-                    y: 1148,
-                    value: this.data.resource_info.zb_start_at,
-                    size: 30,
-                    fontWeight: 'bold',
-                    color: '#3B4C6E'
-                },
-                {
-                    label: 'scanPrompt',
-                    type: TYPES.TEXT,
-                    x: 512,
-                    y: 1240,
-                    value: '长按扫码查看详情',
-                    size: 24,
-                    fontWeight: 'bold',
-                    color: 'black'
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: 510,
-                    y: 1020,
-                    width: 200,
-                    height: 200,
-                    imgRoundType:'fullRoundRect',
-                    src: this.data.resource_info.qr_code
-                }
-            ];
-        },
-        drawAliveGeneralPoster(poster) {
-            console.log(this,'this??????????');
-            const nicknameProps = {
-                label: 'nickname',
-                type: TYPES.TEXT,
-                x: 140,
-                y: 712,
-                value: this.data.userInfo.wx_nickname,
-                size: 32,
-                fontWeight: 'normal',
-                color: '#777',
-                maxWidth: 300,
-                textOverflow: 'ellipsis'
-            };
-            return [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: 40,
-                    y: 680,
-                    width: 80,
-                    height: 80,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 40
-                },
-                nicknameProps,
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    x: 160 + poster.getTextRect(nicknameProps).width,
-                    y: 712,
-                    value: this.data.shareHint,
-                    size: 32,
-                    color: '#777'
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 750 / 2,
-                    y: 0,
-                    width: 750,
-                    height: 750 * 0.75,
-                    src: this.data.resource_info.img_url,
-                    imgRoundType: 'top'
-                },
-                {
-                    label: 'resourceTitle',
-                    type: TYPES.TEXT,
-                    x: 40,
-                    y: 860,
-                    value: this.data.resource_info.title,
-                    size: 36,
-                    fontWeight: 'bold',
-                    color: 'black',
-                    maxWidth: 680,
-                    textOverflow: 'wrap',
-                    lineHeight: 48
-                },
-                {
-                    label: 'shopName',
-                    type: TYPES.TEXT,
-                    x: 40,
-                    y: 1000,
-                    value: `- ${this.data.posterData.shop_name}`,
-                    size: 30,
-                    fontWeight: 'normal',
-                    color: '#777',
-                    maxWidth: 500
-                },
-                {
-                    label: 'scanPrompt',
-                    type: TYPES.TEXT,
-                    y: 1230,
-                    value: '长按扫码查看详情',
-                    size: 20,
-                    fontWeight: 'normal',
-                    color: '#777',
-                    textAlign: "center"
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: 750 / 2 - 140 / 2,
-                    y: 1070,
-                    width: 140,
-                    height: 140,
-                    imgRoundType:'fullRoundRect',
-                    src: this.data.resource_info.qr_code
-                }
-            ];
-        },
-        drawAliveSpecificPoster() {
-            return [
-                {
-                    label: 'posterBg',
-                    type: TYPES.BG_IMG,
-                    src: this.data.posterData.poster_url,
-                    x:0,
-                    y:0,
-                    width:POSTER_WIDTH,
-                    height:POSTER_HEIGHT
-                },
-                {
-                    label: 'avatar',
-                    type: TYPES.IMG,
-                    x: 40,
-                    y: 730,
-                    width: 80,
-                    height: 80,
-                    src: this.data.userInfo.wx_avatar,
-                    border: 40
-                },
-                {
-                    label: 'nickname',
-                    type: TYPES.TEXT,
-                    x: 140,
-                    y: 748,
-                    value: this.data.userInfo.wx_nickname,
-                    size: 28,
-                    fontWeight: 'bold',
-                    color: '#3B4C6E',
-                    maxWidth: 400,
-                    textOverflow: 'ellipsis'
-                },
-                {
-                    label: 'sharePrompt',
-                    type: TYPES.TEXT,
-                    x: 140,
-                    y: 782,
-                    value: this.data.shareHint,
-                    size: 24,
-                    color: '#3B4C6E'
-                },
-                {
-                    label: 'resourcePic',
-                    type: TYPES.IMG,
-                    x: POSTER_WIDTH / 2 - 720 / 2,
-                    y: 134,
-                    width: 720,
-                    height: 720 * 0.75,
-                    src: this.data.resource_info.img_url,
-                    imgRoundType:'fullRoundRect',
-                },
-                {
-                    label: 'aliveStartTime',
-                    type: TYPES.TEXT,
-                    x: 56,
-                    y: 1048,
-                    value: this.data.resource_info.zb_start_at,
-                    size: 28,
-                    fontWeight: 'bold',
-                    color: '#3B4C6E'
-                },
-                {
-                    label: 'scanPrompt',
-                    type: TYPES.TEXT,
-                    x: 510,
-                    y: 1160,
-                    value: '长按扫码查看详情',
-                    size: 24,
-                    fontWeight: 'bold',
-                    color: '#3B4C6E'
-                },
-                {
-                    label: 'qrcode',
-                    type: TYPES.IMG,
-                    x: 500,
-                    y: 930,
-                    width: 220,
-                    height: 220,
-                    roundRectType: 'full',
-                    borderRadius: 12,
-                    src: this.data.resource_info.qr_code
-                }
-            ];
-        },
-        drawStudyPoster(poster) {
-            const motiveTextProps = {
-                label: 'motiveText',
-                type: TYPES.TEXT,
-                x: 80,
-                y: 510,
-                value: this.data.motiveInfoData.text,
-                size: 32,
-                color: 'black',
-                lineHeight: 48,
-                maxWidth: 590,
-                textOverflow: 'wrap' // wrap ellipsis
-            };
-            const motiveTextAuthorProps = {
-                label: 'motiveTextAuthor',
-                type: TYPES.TEXT,
-                value: `—— ${this.data.motiveInfoData.auther}`,
-                size: 32,
-                color: 'black',
-                maxWidth: 600
-            };
-            const motiveTextAuthorRect = poster.getTextRect(motiveTextAuthorProps);
-            const motiveTextRect = poster.getTextRect(motiveTextProps);
-            return [{
-                label: 'posterBg',
-                type: TYPES.BG_IMG,
-                src: this.data.posterData.poster_url,
-                x:0,
-                y:0,
-                width:POSTER_WIDTH,
-                height:POSTER_HEIGHT
-            },
-            {
-                label: 'avatar',
-                type: TYPES.IMG,
-                x: 122,
-                y: 256,
-                width: 160,
-                height: 160,
-                src: this.data.userInfo.wx_avatar,
-                border: 80
-            },
-            {
-                label: 'nickname',
-                type: TYPES.TEXT,
-                x: 320,
-                y: 280,
-                value: this.data.userInfo.wx_nickname,
-                size: 44,
-                fontWeight: 'bold',
-                color: 'black',
-                maxWidth: 280,
-                textOverflow: 'ellipsis'
-            },
-            {
-                label: 'sharePrompt',
-                type: TYPES.TEXT,
-                x: 320,
-                y: 340,
-                value: this.data.shareHint,
-                size: 40,
-                color: 'black'
-            },
-            motiveTextProps,
-            {
-                label: 'resourceTitle',
-                type: TYPES.TEXT,
-                x: 80,
-                y: 800,
-                value: this.data.resource_info.title,
-                size: 36,
-                fontWeight: 'normal',
-                color: 'black',
-                maxWidth: 590,
-                textOverflow: 'ellipsis'
-            },
-            {
-                label: 'qrcode',
-                type: TYPES.IMG,
-                x: POSTER_WIDTH / 2 - 168 / 2,
-                y: 928,
-                width: 168,
-                height: 168,
-                src: this.data.resource_info.qr_code
-            },
-            {
-                label: 'scanPrompt',
-                type: TYPES.TEXT,
-                x: 0,
-                y: 1110,
-                value: '长按扫码查看详情',
-                size: 24,
-                fontWeight: 'bold',
-                color: 'black',
-                textAlign: "center"
-            },
-            {
-                label: 'shopName',
-                type: TYPES.TEXT,
-                y: 898,
-                value: this.data.posterData.shop_name,
-                size: 32,
-                fontWeight: 'bold',
-                color: 'black',
-                maxWidth: 590,
-                textAlign: "center"
-            },
-            {
-                ...motiveTextAuthorProps,
-                x: POSTER_WIDTH - motiveTextAuthorRect.width - 80,
-                y: 500 + motiveTextRect.height
-            }
-            ];
-        },
-        // 换一条励志语
-        changeRecTxt() {
-            let temInfo = this.data.motiveInfo || [];
-            let random = Math.floor(Math.random() * temInfo.length);
-            this.data.motiveInfoData = temInfo[random] || {};
-            this.data.motiveInfoData.id = `study_${random}`;
-            this.setData({
-                isVisible : true
-            })
-            this.generatePoster(random);
-        },
-    }
+import  objToPoster from '../createPoster/index'
+import { posterInfo } from '../libs/positionMap';
+import { TYPES,POSTER_CLS, } from '../libs/constant';
+const computedBehavior = require('miniprogram-computed').behavior;
+const POSTER_WIDTH = 750;
+const POSTER_HEIGHT = 1344;
+
+let ID = 0
+
+Component({
+    behaviors: [computedBehavior],
+    /**
+     * 组件的属性列表
+     */
+    /**
+   * 组件的属性列表
+   */
+    properties: {
+        isSinglePoster: {
+            type: Boolean,
+            value: false
+        },
+        motiveInfo: {
+            type: Array,
+            value: () => {
+                return [];
+            }
+        },
+        posterItem: {
+            type: Object,
+            value: () => {},
+        },
+        promotionInfo:{
+            type: Object,
+            value: () => {
+                return {};
+            }
+        },
+        showPopup:{
+            type: Boolean,
+            value: false 
+        }
+    },
+    observers: {
+        posterItem(newData) {
+            if(Object.getOwnPropertyNames(newData).length){
+                this.setData({
+                    isVisible :true,
+                    posterItemData:newData,
+                    posterStyle:newData.default_poster_mark
+                })
+            }
+            if(Object.getOwnPropertyNames(newData).length && Object.getOwnPropertyNames(this.properties.promotionInfo).length && this.properties.promotionInfo.resource_info.qr_code.includes("myqcloud")){
+                if(this.properties.showPopup){
+                    this.generatePoster(15);  
+                }
+            }
+        },
+        promotionInfo(newData){
+            if(Object.getOwnPropertyNames(newData).length && newData.resource_info.qr_code.includes("myqcloud") && Object.getOwnPropertyNames(this.properties.posterItem).length){
+                if(this.properties.showPopup){
+                    this.generatePoster(15);  
+                }
+            }
+        },
+    },
+    lifetimes: {
+        attached(){
+            var app = getApp()
+            app.globalData[`poster${ID++}`] = this
+        },
+        ready(){
+            this.cleanUpWxFileSystemMemory(2);
+        }
+    },
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        imgSrc:'',
+        imageUrl:'',
+        isVisible:true,
+        posterMapInfo: posterInfo,
+        motiveInfoData:{"text":"世上没有任何伟业的成就能够离得开激情。","auther":"黑格尔"},
+        shareAddInfo:{},
+        posterObj:{},
+        isSwitchBtnShow:false,
+        posterItemData:{},
+        posterStyle:"",
+        defaultAvatarUrl: 'https://wechatavator-1252524126.cos.ap-shanghai.myqcloud.com/dasda.jpg',
+    },
+    computed:{
+        posterData(data) {
+            let temInfo = data.posterItemData;
+            let defaultPoster = data.posterMapInfo[data.posterItemData.default_poster_mark];
+            temInfo = {...data.posterItemData, ...defaultPoster};
+            console.log(temInfo,'teninfo');
+            return temInfo;
+        },
+        // 根据不同商品类型展示不同邀请文案
+        shareHint(data) {
+            let resType = data.promotionInfo && data.promotionInfo.resource_info && data.promotionInfo.resource_info.resource_type;
+            let shareTxt = '';
+            if (data.posterData.is_default === 1) {
+                switch (resType) {
+                case 2:
+                    shareTxt = '邀请你一起收听';
+                    break;
+                case 4:
+                    shareTxt = '邀请你一起观看';
+                    break;
+                case 20:
+                    shareTxt = '邀请你一起阅读';
+                    break;
+                case 21:
+                    shareTxt = '邀请你一起购买';
+                    break;
+                case 31:
+                case 29:
+                case 25:
+                case 35:
+                    shareTxt = '邀请你一起参加';
+                    break;
+                default:
+                    shareTxt = '邀请你一起学习';
+                    break;
+                }
+            }
+
+            return shareTxt;
+        },
+        userInfo(data) {
+            return data.promotionInfo.user_info || { wx_avatar: '', wx_nickname: '' };
+        },
+        // posterStyle(data) {
+        //     return data.posterData && data.posterData.default_poster_mark || "";
+        // },
+        showGoods(data) {
+            let showGood = data.posterData.is_show_goods;
+            if (data.posterStyle !== POSTER_CLS.USER_CUSTOM) {
+                showGood = data.posterData.goods_position;
+            }
+            return showGood;
+        },
+        showGoodsImg(data) {
+            let showImg = true;
+            if (data.posterData.is_default === 1) {
+                showImg = data.posterData.show_goods_img;
+            }
+            return showImg;
+        },
+        showFinger(data) {
+            return data.posterData.qr_code_type === 1 && data.posterData.is_default === 0;
+        },
+        resource_info(data) {
+            return data.promotionInfo && data.promotionInfo.resource_info;
+        },
+        isShowPrice(data) {
+            let showPrcie = true;
+            let payment_type = data.resource_info && data.resource_info.payment_type || 2; //仅关联不展示价格
+            if (data.posterStyle !== POSTER_CLS.USER_CUSTOM) {
+                showPrcie = data.posterData.has_price_info;
+            } else {
+                showPrcie = data.posterData.is_show_price && payment_type != 3;
+            }
+            return showPrcie;
+        },
+        activityLable(data) {
+            return data.resource_info && data.resource_info.activity_label || '';
+        },
+        zbStartAt(data) {
+            return data.resource_info && data.resource_info.zb_start_at && data.resource_info.zb_start_at.split(' ');
+        },
+        resourceLinePrice(data) {
+            return data.resource_info && data.resource_info.line_price ? String((data.resource_info.line_price / 100).toFixed(2)) : '';
+        }
+      },
+  
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        getPosterData() {
+            let temInfo = this.data.posterItemData;
+            let defaultPoster = this.data.posterMapInfo[this.data.posterItemData.default_poster_mark];
+            temInfo = {...this.data.posterItemData, ...defaultPoster};
+            return temInfo;
+        },
+        // 价格的 单位、整数、小数部分字体大小不同，需分别绘制再拼接
+        // x，y 表示起始位置
+        getResourcePrice(x, y, color,poster) {
+            const { price } = this.data.resource_info;
+            if (price === 0) {
+                return [
+                    {
+                        label: 'free',
+                        type: "font",
+                        x,
+                        y,
+                        value: '免费',
+                        size: 40,
+                        color
+                    }
+                ];
+            }
+            const [priceInt, priceFloat] = String((price / 100).toFixed(2)).split('.');
+            const unitProps = {
+                label: 'priceUnit',
+                type: "font",
+                x,
+                y,
+                value: '¥',
+                size: 40,
+                fontWeight: 'normal',
+                color
+            };
+            const MARGIN_RIGHT = 8;
+            const priceIntProps = {
+                label: 'priceInt',
+                type: "font",
+                x: x + poster.getTextRect(unitProps).width + MARGIN_RIGHT,
+                y: y - 10,
+                value: priceInt,
+                size: 60,
+                fontWeight: 'normal',
+                color
+            };
+            const priceFloatProps = {
+                label: 'priceFloat',
+                type: "font",
+                x:
+                    x +
+                    poster.getTextRect(priceIntProps).width +
+                    poster.getTextRect(unitProps).width +
+                    MARGIN_RIGHT,
+                y,
+                value: `.${priceFloat}`,
+                size: 40,
+                fontWeight: 'normal',
+                color
+            };
+            return [unitProps, priceIntProps, priceFloatProps];
+        },
+        // 实际渲染的价格包含三个部分：整数、小数点、小数点后两位
+        getResourcePriceRect(poster) {
+            const [unitProps, priceIntProps, priceFloatProps] = this.getResourcePrice(0, 0, 'black',poster);
+            const unitTextRect = poster.getTextRect(unitProps);
+            const priceIntTextRect = poster.getTextRect(priceIntProps);
+            const priceFloatTextRect = poster.getTextRect(priceFloatProps);
+            return {
+                width: unitTextRect.width + priceIntTextRect.width + priceFloatTextRect.width,
+                height: Math.max(unitTextRect.height, priceIntTextRect.height, priceFloatTextRect.height)
+            };
+        },
+        generatePoster(random){
+            const that = this
+            this.triggerEvent('drawPosterBegin');
+            new objToPoster(POSTER_WIDTH,POSTER_HEIGHT,1,this).initCanvas(this,1).then(res=>{
+                this.posterObj =  this.getPosterConfig(res);
+                return this.posterObj && res.convertToImg(this.posterObj)
+            }).then(response=>{
+                if(response){
+                    this.cleanUpWxFileSystemMemory(43);
+                    this.getWxFilesListAndWriteFile(response,random);
+                }
+            })
+        },
+        getImageSrc(response) {
+            console.log('getImageSrc: ', response)
+            this.setData({
+                imgSrc: response,
+                imageUrl: response,
+                isVisible: false
+            },()=>{
+
+                console.log('imageUrl', this.data.imageUrl)
+            })
+        },
+        getWxFilesListAndWriteFile(response,random){
+            let that = this;
+            const fs = wx.getFileSystemManager();
+            fs.readdir({
+                dirPath: wx.env.USER_DATA_PATH,
+                success(res) {
+                    //res.files为存入的列表路径
+                    let filesList = res.files;
+                    let isOtherPosterExist = false;
+                    let isStudyPosterExist = false;
+                    if(filesList.length>2){
+                        isStudyPosterExist = that.data.posterStyle === POSTER_CLS.STUDY && filesList.some(item=>{
+                            let num = +(item.replace(/[^0-9]/ig,""))
+                            return num === random && item.includes(that.data.posterStyle)
+                        })
+                        isOtherPosterExist = that.data.posterStyle !== POSTER_CLS.STUDY && filesList.some(item=>{
+                            return item.includes(that.data.posterStyle)
+                        })
+                        if(!(isStudyPosterExist || isOtherPosterExist)){
+                            that.wxWriteFile(response,random)
+                        }else{
+                            if(isStudyPosterExist){
+                                that.setData({
+                                    imageUrl:wx.env.USER_DATA_PATH + '/'+ that.data.posterStyle + random +'.png'
+                                })
+                            }else if(isOtherPosterExist){
+                                that.setData({
+                                    imageUrl:wx.env.USER_DATA_PATH + '/'+ that.data.posterData.id +'.png'
+                                })
+                            }
+                            let isShow = that.data.posterData && that.data.posterData.default_poster_mark === POSTER_CLS.STUDY;
+                            that.setData({
+                                isSwitchBtnShow: isShow,
+                                isVisible: false
+                            })
+                            that.triggerEvent('drawPosterFulfilled');
+                        }
+                    }else{
+                        that.wxWriteFile(response,random)
+                    }
+                }
+            })
+        },
+        cleanUpWxFileSystemMemory(n){
+            const fs = wx.getFileSystemManager();
+            fs.readdir({
+                dirPath: wx.env.USER_DATA_PATH,
+                success(res) {
+                    //res.files为存入的列表路径
+                    let indexVal = res.files.length;
+                    //由于微信本地存储超过10M时，写入文件失败，10M大概是43张海报的内存，所以大于42时，清除垃圾文件，再写入
+                    if(indexVal>n){
+                        res.files.forEach((el) => {
+                            let name = (wx.env.USER_DATA_PATH+el).replace(/usr/g, "usr/");
+                            fs.unlink({
+                                filePath:name,
+                                fail(e) {
+                                    console.log('文件删除失败：', e)
+                                },
+                                success(succ){
+                                    console.log('文件删除成功：', succ);
+                                }
+                            })
+                        })
+                    } 
+                }
+            })
+        },
+        wxWriteFile(response,random){
+            const fs = wx.getFileSystemManager();
+            //随机定义路径名称
+            let codeimg =this.data.posterStyle === POSTER_CLS.STUDY ? wx.env.USER_DATA_PATH + '/' + this.data.posterStyle + random + '.png': wx.env.USER_DATA_PATH + '/' + this.data.posterData.id + '.png';
+            //将base64图片写入
+            fs.writeFile({
+                filePath: codeimg,
+                data: response.slice(22),
+                encoding: 'base64',
+                success: (res) => {
+                    //写入成功了的话，新的图片路径就能用了
+                    console.log(res)
+                    console.log("codeimg: ",codeimg)
+                    // this.imgSrc=codeimg;
+                    this.setData({
+                        imageUrl:codeimg
+                    })
+                    let isShow = this.data.posterData && this.data.posterData.default_poster_mark === POSTER_CLS.STUDY;
+                    this.setData({
+                        isSwitchBtnShow:isShow
+                    })
+                    this.triggerEvent('drawPosterFulfilled');
+                },
+                fail:(error)=>{
+                    console.log(error);
+                }
+            })
+        },
+        getPosterConfig(poster){
+            const drawPosterFnMaps = {
+                [POSTER_CLS.USER_CUSTOM]: this.drawUserCustomPoster,
+                [POSTER_CLS.STUDY]: this.drawStudyPoster,
+                [POSTER_CLS.PRICE_ONE]: this.drawPriceOnePoster,
+                [POSTER_CLS.INTERACT_ONE]: this.drawInteractOnePoster,
+                [POSTER_CLS.INTERACT_TWO]: this.drawInteractTwoPoster,
+                [POSTER_CLS.PRICE_TWO]: this.drawPriceTwoPoster,
+                [POSTER_CLS.INTERACT_THREE]: this.drawInteractThreePoster,
+                [POSTER_CLS.ENTITY]: this.drawEntityPoster,
+                [POSTER_CLS.ALIVE]: this.drawAlivePoster,
+                [POSTER_CLS.ALIVE_GENERAL]: this.drawAliveGeneralPoster,
+                [POSTER_CLS.ALIVE_SPECIFIC]: this.drawAliveSpecificPoster
+            };
+            console.log(this.data.posterStyle,'this.data.posterStyle')
+            if(!this.data.posterStyle){
+                return
+            }
+            const drawFn = drawPosterFnMaps[this.data.posterStyle].bind(this);
+            if (!drawFn) {
+                console.warn('未知的海报类型', this.data.posterStyle);
+                return;
+            }
+            let posterConfigObj = drawFn(poster);
+            return posterConfigObj;
+        },
+        // 绘制自定义海报
+        // 自定义海报的 头像、昵称、二维码，是否展示、位置、宽高都是取的接口数据。
+        // 其中 二维码类型需要单独区分 并计算位置和宽高
+        // 条件渲染约定的值比较混乱
+        drawUserCustomPoster(poster) {
+            const isShowAvatar = [1, 2].includes(this.data.posterData.is_show_avatar); // 1和2 展示
+            const isShowNickname = [1, 2].includes(this.data.posterData.is_show_nickname); // 1和2 展示
+            const isShowGoods = this.data.posterData.is_show_goods === 1;
+            const isShowPrice = this.data.posterData.is_show_price === 1;
+            const isHideQrcode = this.data.posterData.qr_code_type === 2; // 0和1 展示
+            const isShowFingerprints = this.data.posterData.is_show_fingerprints === 1; // 0和2 不展示
+
+           
+            const LINE_PRICE_MARGIN_RIGHT = 80;
+            const linePriceProps = {
+                label: 'resourceLinePrice',
+                type: TYPES.TEXT,
+                value: this.data.resourceLinePrice,
+                size: 32,
+                fontWeight: 'bold',
+                color: '#777',
+                textStyle: 'stroke'
+            };
+
+            // 部分公共数据提取出来，包含：背景图、价格、划线价、资源图、标题
+            const commonWidgets = [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                isShowGoods && isShowPrice &&
+                    this.data.resourceLinePrice && {
+                    ...linePriceProps,
+                    x: POSTER_WIDTH - poster.getTextRect(linePriceProps).width - LINE_PRICE_MARGIN_RIGHT,
+                    y: 830
+                },
+                ...(isShowGoods && isShowPrice ? this.getResourcePrice(88, 830, '#FE8946',poster) : []),
+                isShowGoods && {
+                    label: 'goodsName',
+                    type: TYPES.TEXT,
+                    x: 88,
+                    y: !isShowPrice ? 826 : 890,
+                    value: this.data.resource_info.title,
+                    size: 32,
+                    fontWeight: 'normal',
+                    color: 'black',
+                    maxWidth: 550,
+                    textOverflow: 'ellipsis'
+                },
+                isShowGoods && {
+                    label: 'goodsImg',
+                    type: TYPES.IMG,
+                    imgRoundType:'halfRoundRect',
+                    src: this.data.resource_info && this.data.resource_info.img_url,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 310,
+                    width: 640,
+                    height: 640 * 0.75,
+                },
+                isShowGoods && {
+                    label: 'resourceAdditionalBackground',
+                    type: TYPES.SHAPE,
+                    width: 640,
+                    height: !isShowPrice ? 100 : 180,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 790,
+                    r:20,
+                    color: 'white',
+                    shape:'bottomRoundRect',
+                }
+            ];
+
+            // 新老数据逻辑上分开渲染，方便后续维护
+            const isNewDataSource = Boolean(
+                this.data.posterData.qrcode_size && this.data.posterData.avatar_size && this.data.posterData.nickname_size
+            );
+
+            console.log('isNewDataSource: ', isNewDataSource);
+            if (isNewDataSource) {
+                // 昵称最长不超出海报边界
+                // 省略号...约等于一个字的宽度
+                const NICKNAME_MARGIN_RIGHT = this.data.posterData.nickname_size.size;
+                let nicknameMaxWidth = 400;
+                if (this.data.posterData.is_show_avatar === 1) {
+                    const centralPoint = this.data.posterData.avatar_position.x + this.data.posterData.avatar_size.w / 2;
+                    nicknameMaxWidth = 2 * Math.min(POSTER_WIDTH - centralPoint, centralPoint) - NICKNAME_MARGIN_RIGHT*2;
+                }
+                if (this.data.posterData.is_show_avatar === 2) {
+                    nicknameMaxWidth = POSTER_WIDTH - this.data.posterData.nickname_position.x - NICKNAME_MARGIN_RIGHT;
+                }
+                const nicknameProps = {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    value: this.data.userInfo.wx_nickname,
+                    size: this.data.posterData.nickname_size.size,
+                    fontWeight: 'normal',
+                    color: this.data.posterData.nickname_color === 1 ? 'black' : 'white', // 0 | 1 | 2
+                    maxWidth:  nicknameMaxWidth,
+                    textOverflow: 'ellipsis'
+                };
+                const nicknameRect = poster.getTextRect(nicknameProps);
+                let nicknameX = this.data.posterData.nickname_position.x;
+                // is_show_avatar === 1 时，昵称相对于头像 居中展示
+                if (this.data.posterData.is_show_avatar === 1) {
+                    nicknameX =
+                        this.data.posterData.avatar_position.x + this.data.posterData.avatar_size.w / 2 - nicknameRect.width / 2;
+                }
+                return [
+                    ...commonWidgets,
+                    isShowNickname && {
+                        ...nicknameProps,
+                        x: nicknameX,
+                        y: this.data.posterData.nickname_position.y,
+                    },
+                    isShowAvatar && {
+                        label: 'avatar',
+                        type: TYPES.IMG,
+                        src: this.data.userInfo.wx_avatar,
+                        x: this.data.posterData.avatar_position.x,
+                        y: this.data.posterData.avatar_position.y,
+                        width: this.data.posterData.avatar_size.w,
+                        height: this.data.posterData.avatar_size.h,
+                        border:this.data.posterData.avatar_size.w
+                    },
+                    // 二维码和指纹宽高 需单独计算
+                    // 已知：二维码 和 指纹宽高一致，且能拿到整体宽高 qrcode_size.x qrcode_size.y
+                    // 间隙需动态调整
+                    isHideQrcode || {
+                        label: 'qrcode',
+                        type: TYPES.IMG,
+                        imgRoundType : 'fullRoundRect',
+                        src: this.data.resource_info && this.data.resource_info.qr_code,
+                        x: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.x,
+                        y: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.y,
+                        width: this.data.posterData.qrcode_size.h,
+                        height: this.data.posterData.qrcode_size.h,
+                    },
+                    isShowFingerprints && {
+                        label: 'fingerprint',
+                        type: TYPES.IMG,
+                        // 新数据 fingerprint_position 废弃不用
+                        x:
+                            this.data.posterData.qrcode_position.x +
+                            this.data.posterData.qrcode_size.w -
+                            this.data.posterData.qrcode_size.h,
+                        // 注意：顶部和二维码对齐，这里是之前已有的逻辑（由于fingerprint_position和qrcode_position数据y不一致，直接采用二维码的y值定位）
+                        y: this.data.posterData.qrcode_position.y,
+                        width: this.data.posterData.qrcode_size.h,
+                        height: this.data.posterData.qrcode_size.h,
+                        src: 'http://wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/859093d21aee5d46f4a58d3842f81d0d.png'
+                    }
+                ];
+            } else {
+                // 注意：以下代码为兼容海报旧数据（已废弃）的特殊逻辑。
+                // 由于旧数据及其不准确，之前是前端对错误的数据进行兜底特殊处理，几乎无法维护。
+                // 以下逻辑完全照搬旧代码，非必要勿动。
+                const NICKNAME_MARGIN_RIGHT = 36;
+                const nicknameProps = {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    x: this.data.posterData.nickname_position.x,
+                    y: this.data.posterData.nickname_position.y,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 32,
+                    fontWeight: 'normal',
+                    color: this.data.posterData.nickname_color === 1 ? 'black' : 'white', // 0 | 1 | 2
+                    textOverflow: 'ellipsis'
+                };
+                const nicknameRect = poster.getTextRect(nicknameProps);
+                let nicknameX = this.data.posterData.nickname_position.x;
+                let nicknameY = this.data.posterData.nickname_position.y;
+                let align = this.data.posterData.nickname_position.align || 'left';
+                if (align === 'center') {
+                    nicknameX = nicknameX - nicknameRect.width / 2;
+                }
+                // 由于b端自定义海报时，昵称距离海报边框有距离，所以如果left小于/等于18，则left取值为18
+                nicknameX = Math.max(18, nicknameX);
+                nicknameY = nicknameY - nicknameRect.height / 4;
+                return [
+                    ...commonWidgets,
+                    isShowNickname && {
+                        ...nicknameProps,
+                        x: nicknameX,
+                        y: nicknameY,
+                        maxWidth: POSTER_WIDTH - nicknameX - NICKNAME_MARGIN_RIGHT
+                    },
+                    isShowAvatar && {
+                        label: 'avatar',
+                        type: TYPES.IMG,
+                        x: this.data.posterData.avatar_position.x,
+                        y: this.data.posterData.avatar_position.y-10,
+                        width: 90,
+                        height: 90,
+                        src: this.data.userInfo.wx_avatar,
+                        border:90
+                    },
+                    isHideQrcode || {
+                        label: 'qrcode',
+                        type: TYPES.IMG,
+                        imgRoundType : 'fullRoundRect',
+                        x: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.x,
+                        y: this.data.posterData && this.data.posterData.qrcode_position && this.data.posterData.qrcode_position.y,
+                        width: 150,
+                        height: 150,
+                        src: this.data.resource_info && this.data.resource_info.qr_code,
+                    },
+                    isShowFingerprints && {
+                        label: 'fingerprint',
+                        type: TYPES.IMG,
+                        x: this.data.posterData.fingerprint_position.x,
+                        y: this.data.posterData.fingerprint_position.y,
+                        width: 140,
+                        height: 140,
+                        src: 'http://wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/859093d21aee5d46f4a58d3842f81d0d.png'
+                    }
+                ];
+            }
+        },
+        //实物商品只有一张海报的场景
+        drawEntityPoster(poster) {
+            const LABEL_PADDING = 16;
+            const LINE_PRICE_MARGIN_LEFT = 120;
+            const shopNameProps = {
+                label: 'shopName',
+                type: TYPES.TEXT,
+                y: 196,
+                value: this.data.posterData.shop_name,
+                size: 30,
+                fontWeight: 'normal',
+                color: 'white',
+                maxWidth: 500
+            };
+            const shopNameRect = poster.getTextRect(shopNameProps);
+            const linePriceProps = {
+                label: 'resourceLinePrice',
+                type: TYPES.TEXT,
+                value: this.data.resourceLinePrice,
+                size: 32,
+                fontWeight: 'bold',
+                color: '#777',
+                textStyle: 'stroke'
+            };
+            return [{
+                label: 'posterBg',
+                type: TYPES.BG_IMG,
+                src: this.data.posterData.poster_url,
+                x:0,
+                y:0,
+                width:POSTER_WIDTH,
+                height:POSTER_HEIGHT
+            },
+            {
+                label: 'avatar',
+                type: TYPES.IMG,
+                x: 48,
+                y: 32,
+                width: 100,
+                height: 100,
+                src: this.data.userInfo.wx_avatar,
+                border: 50
+            },
+            {
+                label: 'nickname',
+                type: TYPES.TEXT,
+                x: 170,
+                y: 48,
+                value: this.data.userInfo.wx_nickname,
+                size: 36,
+                fontWeight: 'bold',
+                color: 'black',
+                maxWidth: 500,
+                textOverflow: 'ellipsis'
+            },
+            {
+                label: 'sharePrompt',
+                type: TYPES.TEXT,
+                x: 170,
+                y: 96,
+                value: this.data.shareHint,
+                size: 28,
+                color: '#444'
+            },
+            {
+                label: 'goodsImg',
+                type: TYPES.IMG,
+                imgRoundType : 'fullRoundRect',
+                src: this.data.resource_info.img_url,
+                x: POSTER_WIDTH / 2 - 620 / 2,
+                y: 180,
+                width: 620,
+                height: 620  
+            },
+            {
+                label: 'goodsName',
+                type: TYPES.TEXT,
+                x: 80,
+                y: 950,
+                value: this.data.resource_info.title,
+                size: 32,
+                fontWeight: 'normal',
+                color: 'black',
+                maxWidth: 600,
+                textOverflow: 'wrap',
+                lineHeight:48
+            },
+            {
+                label: 'shopNameLabel',
+                type: TYPES.SHAPE,
+                x: POSTER_WIDTH - shopNameRect.width - 82 - LABEL_PADDING*2,
+                y: shopNameProps.y - LABEL_PADDING/2-4,
+                r: 4,
+                width: shopNameRect.width + 2 * LABEL_PADDING,
+                height: shopNameProps.size + LABEL_PADDING/2,
+                shape:'diagonalRoundRect',
+                color: '#FD822B'
+            },
+            {
+                ...shopNameProps,
+                x: POSTER_WIDTH - shopNameRect.width - 80
+            },
+            this.data.resourceLinePrice && {
+                ...linePriceProps,
+                x: this.getResourcePriceRect(poster).width + LINE_PRICE_MARGIN_LEFT,
+                y: 884
+
+            },
+            ...this.getResourcePrice(80, 880, '#FD822B',poster),
+            {
+                label: 'qrcode',
+                type: TYPES.IMG,
+                src: this.data.resource_info.qr_code,
+                x: 80,
+                y: 1080,
+                width: 160,
+                height: 160,
+            }
+            ];
+        },
+        // drawStudyPoster(poster) {
+        //     const motiveTextProps = {
+        //         label: 'motiveText',
+        //         type: TYPES.TEXT,
+        //         x: 80,
+        //         y: 510,
+        //         value: this.data.motiveInfoData.text,
+        //         size: 32,
+        //         color: 'black',
+        //         lineHeight: 48,
+        //         maxWidth: 590,
+        //         textOverflow: 'wrap' // wrap ellipsis
+        //     };
+        //     const motiveTextAuthorProps = {
+        //         label: 'motiveTextAuthor',
+        //         type: TYPES.TEXT,
+        //         value: `—— ${this.data.motiveInfoData.auther}`,
+        //         size: 32,
+        //         color: 'black',
+        //         maxWidth: 600
+        //     };
+        //     const motiveTextAuthorRect = poster.getTextRect(motiveTextAuthorProps);
+        //     const motiveTextRect = poster.getTextRect(motiveTextProps);
+        //     return [{
+        //         label: 'posterBg',
+        //         type: TYPES.BG_IMG,
+        //         src: this.data.posterData.poster_url,
+        //         x:0,
+        //         y:0,
+        //         width:POSTER_WIDTH,
+        //         height:POSTER_HEIGHT
+        //     },
+        //     {
+        //         label: 'avatar',
+        //         type: TYPES.IMG,
+        //         x: 122,
+        //         y: 256,
+        //         width: 160,
+        //         height: 160,
+        //         src: this.data.userInfo.wx_avatar,
+        //         border: 80
+        //     },
+        //     {
+        //         label: 'nickname',
+        //         type: TYPES.TEXT,
+        //         x: 320,
+        //         y: 280,
+        //         value: this.data.userInfo.wx_nickname,
+        //         size: 44,
+        //         fontWeight: 'bold',
+        //         color: 'black',
+        //         maxWidth: 280,
+        //         textOverflow: 'ellipsis'
+        //     },
+        //     {
+        //         label: 'sharePrompt',
+        //         type: TYPES.TEXT,
+        //         x: 320,
+        //         y: 340,
+        //         value: this.data.shareHint,
+        //         size: 40,
+        //         color: 'black'
+        //     },
+        //     motiveTextProps,
+        //     {
+        //         label: 'resourceTitle',
+        //         type: TYPES.TEXT,
+        //         x: 80,
+        //         y: 800,
+        //         value: this.data.resource_info.title,
+        //         size: 36,
+        //         fontWeight: 'normal',
+        //         color: 'black',
+        //         maxWidth: 590,
+        //         textOverflow: 'ellipsis'
+        //     },
+        //     // {
+        //     //     label: 'qrcode',
+        //     //     type: TYPES.IMG,
+        //     //     x: POSTER_WIDTH / 2 - 168 / 2,
+        //     //     y: 928,
+        //     //     width: 168,
+        //     //     height: 168,
+        //     //     src: this.data.resource_info.qr_code
+        //     // },
+        //     {
+        //         label: 'scanPrompt',
+        //         type: TYPES.TEXT,
+        //         x: 0,
+        //         y: 1110,
+        //         value: '长按扫码查看详情',
+        //         size: 24,
+        //         fontWeight: 'bold',
+        //         color: 'black',
+        //         textAlign: "center"
+        //     },
+        //     {
+        //         label: 'shopName',
+        //         type: TYPES.TEXT,
+        //         y: 898,
+        //         value: this.data.posterData.shop_name,
+        //         size: 32,
+        //         fontWeight: 'bold',
+        //         color: 'black',
+        //         maxWidth: 590,
+        //         textAlign: "center"
+        //     },
+        //     {
+        //         ...motiveTextAuthorProps,
+        //         x: POSTER_WIDTH - motiveTextAuthorRect.width - 80,
+        //         y: 500 + motiveTextRect.height
+        //     }
+        //     ];
+        // },
+        drawPriceOnePoster(poster) {
+            const shopNameProps = {
+                label: 'shopName',
+                type: TYPES.TEXT,
+                y: 346,
+                value: this.data.posterData.shop_name,
+                size: 32,
+                fontWeight: 'bold',
+                color: 'white',
+                maxWidth: 500
+            };
+            const shopNameRect = poster.getTextRect(shopNameProps);
+            const LABEL_PADDING = 4;
+            const LINE_PRICE_MARGIN_RIGHT = 56;
+            const linePriceProps = {
+                label: 'resourceLinePrice',
+                type: TYPES.TEXT,
+                value: this.data.resourceLinePrice,
+                size: 32,
+                fontWeight: 'bold',
+                color: '#777',
+                textStyle: 'stroke'
+            };
+            let posterConfigArr =  [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 160 / 2,
+                    y: 25,
+                    width: 160,
+                    height: 160,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 80
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    y: 200,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 44,
+                    fontWeight: 'bold',
+                    color: 'white',
+                    maxWidth: 600,
+                    textOverflow: 'ellipsis',
+                    textAlign: "center"
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    y: 260,
+                    value: this.data.shareHint,
+                    size:40,
+                    color: 'white',
+                    textAlign:"center"
+                },
+                {
+                    label: 'resourceAdditionalBackground',
+                    type: TYPES.IMG,
+                    x: 34,
+                    y: 804,
+                    width: 684,
+                    height: 184,
+                    src: this.data.posterData.goods_add_bg
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 324,
+                    width: 640,
+                    height: 640 * 0.75,
+                    src: this.data.resource_info.img_url,
+                    imgRoundType:'halfRoundRect'
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    x: 66,
+                    y: 840,
+                    value: this.data.resource_info.title,
+                    size: 32,
+                    fontWeight: 'bold',
+                    color: 'black',
+                    maxWidth: 600,
+                    textOverflow: 'ellipsis'
+                },
+                this.data.resourceLinePrice && {
+                    ...linePriceProps,
+                    x: POSTER_WIDTH - poster.getTextRect(linePriceProps).width - LINE_PRICE_MARGIN_RIGHT,
+                    y: 900
+                },
+                ...this.getResourcePrice(66, 900, '#fd0300',poster),
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 144 / 2,
+                    y: 1026,
+                    width: 144,
+                    height: 144,
+                    src: this.data.resource_info.qr_code
+                },
+                {
+                    label: 'shopNameLabel',
+                    type: TYPES.SHAPE,
+                    x: POSTER_WIDTH - shopNameRect.width - 77 - LABEL_PADDING,
+                    y: shopNameProps.y - LABEL_PADDING,
+                    r: 8,
+                    width: shopNameRect.width + 2 * LABEL_PADDING,
+                    height: 40,
+                    shape: 'diagonalRoundRect',
+                    color: '#FA6A4A'
+                },
+                {
+                    ...shopNameProps,
+                    x: POSTER_WIDTH - shopNameRect.width - 77
+                }
+            ];
+            if (this.data.resource_info.activityLabel) {
+                const activityTitleProps = {
+                    label: 'activityTitle',
+                    type: TYPES.TEXT,
+                    x: 240,
+                    y: 890,
+                    value: this.data.resource_info.activityLabel,
+                    fontSize: 32,
+                    fontWeight: 'bold',
+                    color: 'white',
+                    maxWidth: 500,
+                    textOverflow: 'ellipsis'
+                };
+                const activityTitleRect = poster.getTextRect(activityTitleProps);
+                
+                posterConfigArr.concat([activityTitleProps,{
+                    label: 'activityLabel',
+                    type: TYPES.SHAPE,
+                    x: 240 - LABEL_PADDING,
+                    y: activityTitleProps.y - LABEL_PADDING,
+                    r: 12,
+                    width: activityTitleRect.width + 2 * LABEL_PADDING,
+                    height: 40,
+                    shape: 'fullRoundRect',
+                    color: '#FA6A48'
+                }]);
+            }
+            return posterConfigArr;
+        },
+        drawInteractOnePoster(poster) {
+            const shopNameProps = {
+                label: 'shopName',
+                type: TYPES.TEXT,
+                y: 414,
+                value: this.data.posterData.shop_name,
+                size: 32,
+                fontWeight: 'bold',
+                color: 'white',
+                maxWidth: 500
+            };
+            const shopNameRect = poster.getTextRect(shopNameProps);
+            const LABEL_PADDING = 4;
+            return [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 160 / 2,
+                    y: 35,
+                    width: 160,
+                    height: 160,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 80
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    y: 220,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 44,
+                    fontWeight: 'bold',
+                    color: 'white',
+                    maxWidth: 600,
+                    textOverflow: 'ellipsis',
+                    textAlign: "center"
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    y: 280,
+                    value: this.data.shareHint,
+                    size: 40,
+                    color: 'white',
+                    textAlign: "center"
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    x: 66,
+                    y: 908,
+                    value: this.data.resource_info.title,
+                    size: 32,
+                    fontWeight: 'normal',
+                    color: 'black',
+                    maxWidth: 620,
+                    textAlign: "center",
+                    textOverflow: 'wrap',
+                    lineHeight: 48
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 392,
+                    width: 640,
+                    height: 640 * 0.75,
+                    src:  this.data.resource_info.img_url,
+                    imgRoundType:'fullRoundRect',
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 180 / 2,
+                    y: 1016,
+                    width: 180,
+                    height: 180,
+                    src: this.data.resource_info.qr_code
+                },
+                {
+                    label: 'scanPrompt',
+                    type: TYPES.TEXT,
+                    x: POSTER_WIDTH / 2 - 144 / 2,
+                    y: 1208,
+                    value: '长按扫码查看详情',
+                    size: 22,
+                    fontWeight: 'normal',
+                    color: 'black',
+                    textAlign: "center"
+                },
+                {
+                    label: 'shopNameLabel',
+                    type: TYPES.SHAPE,
+                    x: POSTER_WIDTH - shopNameRect.width - 74 - LABEL_PADDING,
+                    y: shopNameProps.y - LABEL_PADDING,
+                    r: 8,
+                    width: shopNameRect.width + 2 * LABEL_PADDING,
+                    height: 40,
+                    shape: 'diagonalRoundRect',
+                    color: '#308EF9'
+                },
+                {
+                    ...shopNameProps,
+                    x: POSTER_WIDTH - shopNameRect.width - 74
+                }
+            ];
+        },
+        drawInteractTwoPoster(poster) {
+            return [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: 60,
+                    y: 40,
+                    width: 160,
+                    height: 160,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 80
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    x: 80,
+                    y: 240,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 44,
+                    fontWeight: 'bold',
+                    color: 'white',
+                    maxWidth: 600,
+                    textOverflow: 'ellipsis'
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    x: 80,
+                    y: 300,
+                    value: this.data.shareHint,
+                    size: 40,
+                    color: 'white'
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    x: 80,
+                    y: 860,
+                    value: this.data.resource_info.title,
+                    size: 32,
+                    fontWeight: 'normal',
+                    color: 'white',
+                    maxWidth: 600,
+                    textOverflow: 'wrap',
+                    lineHeight:48
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 350,
+                    width: 640,
+                    height: 640 * 0.75,
+                    src: this.data.resource_info.img_url,
+                    imgRoundType:'halfRoundRect',
+                },
+                {
+                    label: 'resourceAdditionalBackground',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 830,
+                    width: 640,
+                    height: 180,
+                    src: this.data.posterData.goods_add_bg,
+                },
+                {
+                    label: 'shopName',
+                    type: TYPES.TEXT,
+                    x: 56,
+                    y: 1100,
+                    value: this.data.posterData.shop_name,
+                    size: 32,
+                    fontWeight: 'bold',
+                    color: 'white',
+                    maxWidth: 440
+                },
+                {   
+                    label:"whiteLine",
+                    type:TYPES.SHAPE,
+                    width:84,
+                    height:6,
+                    x:56,
+                    y:1155,
+                    r:3,
+                    color:'white',
+                    shape:'fullRoundRect'
+                },
+                {
+                    label: 'scanPrompt',
+                    type: TYPES.TEXT,
+                    x: 56,
+                    y: 1190,
+                    value: '长按扫码查看详情',
+                    size: 32,
+                    fontWeight: 'bold',
+                    color: 'white'
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: 540,
+                    y: 1070,
+                    width: 160,
+                    height: 160,
+                    src: this.data.resource_info.qr_code
+                }
+            ];
+        },
+        drawPriceTwoPoster(poster) {
+            const LINE_PRICE_MARGIN_RIGHT = 56;
+            const linePriceProps = {
+                label: 'resourceLinePrice',
+                type: TYPES.TEXT,
+                value: this.data.resourceLinePrice,
+                size: 32,
+                fontWeight: 'bold',
+                color: '#777',
+                textStyle: 'stroke'
+            };
+            return[
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: 60,
+                    y: 40,
+                    width: 160,
+                    height: 160,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 80
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    x: 80,
+                    y: 240,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 44,
+                    fontWeight: 'bold',
+                    color: 'white',
+                    maxWidth: 600,
+                    textOverflow: 'ellipsis'
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    x: 80,
+                    y: 300,
+                    value: this.data.shareHint,
+                    size: 40,
+                    color: 'white'
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    x: 80,
+                    y: 860,
+                    value: this.data.resource_info.title,
+                    size: 32,
+                    fontWeight: 'normal',
+                    color: 'white',
+                    maxWidth: 550,
+                    textOverflow: 'ellipsis'
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 350,
+                    width: 640,
+                    height: 640 * 0.75,
+                    src: this.data.resource_info.img_url,
+                    imgRoundType:'halfRoundRect',
+                },
+                {
+                    label: 'resourceAdditionalBackground',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 640 / 2,
+                    y: 830,
+                    width: 640,
+                    height: 88,
+                    src: this.data.posterData.goods_add_bg,
+                },
+                this.data.resourceLinePrice && {
+                    ...linePriceProps,
+                    x: POSTER_WIDTH - poster.getTextRect(linePriceProps).width - LINE_PRICE_MARGIN_RIGHT,
+                    y: 980
+                },
+                ...this.getResourcePrice(60, 980, '#FA5988',poster),
+                {
+                    label: 'shopName',
+                    type: TYPES.TEXT,
+                    x: 56,
+                    y: 1132,
+                    value: this.data.posterData.shop_name,
+                    size: 32,
+                    fontWeight: 'bold',
+                    color: 'black',
+                    maxWidth: 440
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: 540,
+                    y: 1100,
+                    width: 160,
+                    height: 160,
+                    src: this.data.resource_info.qr_code
+                }
+            ];
+        },
+        drawInteractThreePoster(poster) {
+            return [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: 54,
+                    y: 120,
+                    width: 160,
+                    height: 160,
+                    src: this.data.userInfo.wx_avatar
+                },
+                {
+                    label: 'avatarBorder',
+                    type: TYPES.IMG,
+                    x: 54,
+                    y: 120,
+                    width: 160,
+                    height: 160,
+                    src: 'http://wechatapppro-1252524126.file.myqcloud.com/appAKLWLitn7978/image/eafb3f4d43f8101dd2eaff99a149c021.png'
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    x: 60,
+                    y: 320,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 44,
+                    fontWeight: 'bold',
+                    color: '#FCCD9B',
+                    maxWidth: 600,
+                    textOverflow: 'ellipsis'
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    x: 60,
+                    y: 380,
+                    value: this.data.shareHint,
+                    size: 40,
+                    color: '#FCCD9B'
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    y: 520,
+                    value: this.data.resource_info.title,
+                    size: 32,
+                    fontWeight: 'normal',
+                    color: 'black',
+                    maxWidth: 550,
+                    textOverflow: 'wrap',
+                    textAlign: "center",
+                    lineHeight:48
+                },
+                {
+                    label: 'shopName',
+                    type: TYPES.TEXT,
+                    y: 800,
+                    value: this.data.posterData.shop_name,
+                    size: 32,
+                    fontWeight: 'bold',
+                    color: 'black',
+                    maxWidth: 500,
+                    textAlign: "center"
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 240 / 2,
+                    y: 850,
+                    width: 240,
+                    height: 240,
+                    src: this.data.resource_info.qr_code
+                }
+            ];
+        },
+        drawAlivePoster(poster) {
+            const shopNameProps = {
+                label: 'shopName',
+                type: TYPES.TEXT,
+                y: 760,
+                value: `来自「${this.data.posterData.shop_name}」`,
+                size: 24,
+                fontWeight: 'bold',
+                color: '#1560F4',
+                maxWidth: 340
+            };
+            return [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: 40,
+                    y: 40,
+                    width: 140,
+                    height: 140,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 70
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    x: 210,
+                    y: 70,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 48,
+                    fontWeight: 'bold',
+                    color: 'black',
+                    maxWidth: 470,
+                    textOverflow: 'ellipsis'
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    x: 210,
+                    y: 130,
+                    value: this.data.shareHint,
+                    size: 36,
+                    color: 'black'
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 700 / 2,
+                    y: 200,
+                    width: 700,
+                    height: 700 * 0.75,
+                    src: this.data.resource_info.img_url,
+                    imgRoundType:'fullRoundRect',
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    x: 40,
+                    y: 840,
+                    value: this.data.resource_info.title,
+                    size: 40,
+                    fontWeight: 'bold',
+                    color: 'black',
+                    maxWidth: 664,
+                    textOverflow: 'wrap',
+                    lineHeight: 48
+                },
+                {
+                    ...shopNameProps,
+                    x: POSTER_WIDTH - poster.getTextRect(shopNameProps).width - 20
+                },
+                {
+                    label: 'aliveStartTime',
+                    type: TYPES.TEXT,
+                    x: 88,
+                    y: 1148,
+                    value: this.data.resource_info.zb_start_at,
+                    size: 30,
+                    fontWeight: 'bold',
+                    color: '#3B4C6E'
+                },
+                {
+                    label: 'scanPrompt',
+                    type: TYPES.TEXT,
+                    x: 512,
+                    y: 1240,
+                    value: '长按扫码查看详情',
+                    size: 24,
+                    fontWeight: 'bold',
+                    color: 'black'
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: 510,
+                    y: 1020,
+                    width: 200,
+                    height: 200,
+                    imgRoundType:'fullRoundRect',
+                    src: this.data.resource_info.qr_code
+                }
+            ];
+        },
+        drawAliveGeneralPoster(poster) {
+            console.log(this,'this??????????');
+            const nicknameProps = {
+                label: 'nickname',
+                type: TYPES.TEXT,
+                x: 140,
+                y: 712,
+                value: this.data.userInfo.wx_nickname,
+                size: 32,
+                fontWeight: 'normal',
+                color: '#777',
+                maxWidth: 300,
+                textOverflow: 'ellipsis'
+            };
+            return [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: 40,
+                    y: 680,
+                    width: 80,
+                    height: 80,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 40
+                },
+                nicknameProps,
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    x: 160 + poster.getTextRect(nicknameProps).width,
+                    y: 712,
+                    value: this.data.shareHint,
+                    size: 32,
+                    color: '#777'
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 750 / 2,
+                    y: 0,
+                    width: 750,
+                    height: 750 * 0.75,
+                    src: this.data.resource_info.img_url,
+                    imgRoundType: 'top'
+                },
+                {
+                    label: 'resourceTitle',
+                    type: TYPES.TEXT,
+                    x: 40,
+                    y: 860,
+                    value: this.data.resource_info.title,
+                    size: 36,
+                    fontWeight: 'bold',
+                    color: 'black',
+                    maxWidth: 680,
+                    textOverflow: 'wrap',
+                    lineHeight: 48
+                },
+                {
+                    label: 'shopName',
+                    type: TYPES.TEXT,
+                    x: 40,
+                    y: 1000,
+                    value: `- ${this.data.posterData.shop_name}`,
+                    size: 30,
+                    fontWeight: 'normal',
+                    color: '#777',
+                    maxWidth: 500
+                },
+                {
+                    label: 'scanPrompt',
+                    type: TYPES.TEXT,
+                    y: 1230,
+                    value: '长按扫码查看详情',
+                    size: 20,
+                    fontWeight: 'normal',
+                    color: '#777',
+                    textAlign: "center"
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: 750 / 2 - 140 / 2,
+                    y: 1070,
+                    width: 140,
+                    height: 140,
+                    imgRoundType:'fullRoundRect',
+                    src: this.data.resource_info.qr_code
+                }
+            ];
+        },
+        drawAliveSpecificPoster() {
+            return [
+                {
+                    label: 'posterBg',
+                    type: TYPES.BG_IMG,
+                    src: this.data.posterData.poster_url,
+                    x:0,
+                    y:0,
+                    width:POSTER_WIDTH,
+                    height:POSTER_HEIGHT
+                },
+                {
+                    label: 'avatar',
+                    type: TYPES.IMG,
+                    x: 40,
+                    y: 730,
+                    width: 80,
+                    height: 80,
+                    src: this.data.userInfo.wx_avatar,
+                    border: 40
+                },
+                {
+                    label: 'nickname',
+                    type: TYPES.TEXT,
+                    x: 140,
+                    y: 748,
+                    value: this.data.userInfo.wx_nickname,
+                    size: 28,
+                    fontWeight: 'bold',
+                    color: '#3B4C6E',
+                    maxWidth: 400,
+                    textOverflow: 'ellipsis'
+                },
+                {
+                    label: 'sharePrompt',
+                    type: TYPES.TEXT,
+                    x: 140,
+                    y: 782,
+                    value: this.data.shareHint,
+                    size: 24,
+                    color: '#3B4C6E'
+                },
+                {
+                    label: 'resourcePic',
+                    type: TYPES.IMG,
+                    x: POSTER_WIDTH / 2 - 720 / 2,
+                    y: 134,
+                    width: 720,
+                    height: 720 * 0.75,
+                    src: this.data.resource_info.img_url,
+                    imgRoundType:'fullRoundRect',
+                },
+                {
+                    label: 'aliveStartTime',
+                    type: TYPES.TEXT,
+                    x: 56,
+                    y: 1048,
+                    value: this.data.resource_info.zb_start_at,
+                    size: 28,
+                    fontWeight: 'bold',
+                    color: '#3B4C6E'
+                },
+                {
+                    label: 'scanPrompt',
+                    type: TYPES.TEXT,
+                    x: 510,
+                    y: 1160,
+                    value: '长按扫码查看详情',
+                    size: 24,
+                    fontWeight: 'bold',
+                    color: '#3B4C6E'
+                },
+                {
+                    label: 'qrcode',
+                    type: TYPES.IMG,
+                    x: 500,
+                    y: 930,
+                    width: 220,
+                    height: 220,
+                    roundRectType: 'full',
+                    borderRadius: 12,
+                    src: this.data.resource_info.qr_code
+                }
+            ];
+        },
+        drawStudyPoster(poster) {
+            const motiveTextProps = {
+                label: 'motiveText',
+                type: TYPES.TEXT,
+                x: 80,
+                y: 510,
+                value: this.data.motiveInfoData.text,
+                size: 32,
+                color: 'black',
+                lineHeight: 48,
+                maxWidth: 590,
+                textOverflow: 'wrap' // wrap ellipsis
+            };
+            const motiveTextAuthorProps = {
+                label: 'motiveTextAuthor',
+                type: TYPES.TEXT,
+                value: `—— ${this.data.motiveInfoData.auther}`,
+                size: 32,
+                color: 'black',
+                maxWidth: 600
+            };
+            const motiveTextAuthorRect = poster.getTextRect(motiveTextAuthorProps);
+            const motiveTextRect = poster.getTextRect(motiveTextProps);
+            return [{
+                label: 'posterBg',
+                type: TYPES.BG_IMG,
+                src: this.data.posterData.poster_url,
+                x:0,
+                y:0,
+                width:POSTER_WIDTH,
+                height:POSTER_HEIGHT
+            },
+            {
+                label: 'avatar',
+                type: TYPES.IMG,
+                x: 122,
+                y: 256,
+                width: 160,
+                height: 160,
+                src: this.data.userInfo.wx_avatar,
+                border: 80
+            },
+            {
+                label: 'nickname',
+                type: TYPES.TEXT,
+                x: 320,
+                y: 280,
+                value: this.data.userInfo.wx_nickname,
+                size: 44,
+                fontWeight: 'bold',
+                color: 'black',
+                maxWidth: 280,
+                textOverflow: 'ellipsis'
+            },
+            {
+                label: 'sharePrompt',
+                type: TYPES.TEXT,
+                x: 320,
+                y: 340,
+                value: this.data.shareHint,
+                size: 40,
+                color: 'black'
+            },
+            motiveTextProps,
+            {
+                label: 'resourceTitle',
+                type: TYPES.TEXT,
+                x: 80,
+                y: 800,
+                value: this.data.resource_info.title,
+                size: 36,
+                fontWeight: 'normal',
+                color: 'black',
+                maxWidth: 590,
+                textOverflow: 'ellipsis'
+            },
+            {
+                label: 'qrcode',
+                type: TYPES.IMG,
+                x: POSTER_WIDTH / 2 - 168 / 2,
+                y: 928,
+                width: 168,
+                height: 168,
+                src: this.data.resource_info.qr_code
+            },
+            {
+                label: 'scanPrompt',
+                type: TYPES.TEXT,
+                x: 0,
+                y: 1110,
+                value: '长按扫码查看详情',
+                size: 24,
+                fontWeight: 'bold',
+                color: 'black',
+                textAlign: "center"
+            },
+            {
+                label: 'shopName',
+                type: TYPES.TEXT,
+                y: 898,
+                value: this.data.posterData.shop_name,
+                size: 32,
+                fontWeight: 'bold',
+                color: 'black',
+                maxWidth: 590,
+                textAlign: "center"
+            },
+            {
+                ...motiveTextAuthorProps,
+                x: POSTER_WIDTH - motiveTextAuthorRect.width - 80,
+                y: 500 + motiveTextRect.height
+            }
+            ];
+        },
+        // 换一条励志语
+        changeRecTxt() {
+            let temInfo = this.data.motiveInfo || [];
+            let random = Math.floor(Math.random() * temInfo.length);
+            this.data.motiveInfoData = temInfo[random] || {};
+            this.data.motiveInfoData.id = `study_${random}`;
+            this.setData({
+                isVisible : true
+            })
+            this.generatePoster(random);
+        },
+    }
   })