canvas.js 11.9 KB
// canvas.js
module.exports = data => {
    const views = [{
        "type": "image",
        "url": data.imgUrl,
        "css": {
            "width": "210px",
            "height": "168px",
            "top": "0px",
            "left": "0px",
            "mode": "aspectFill"
        }
    }, ]
    // 原来的样式1,2,3
    if (data.type1 && !data.type2) {
        views.push({
            "type": "image",
            "url": 'https://nosqn.colorcun.com/rectangleBj.png',
            "css": {
                "width": "210px",
                "height": "168px",
                "top": "0px",
                "left": "0px",
                "mode": "aspectFill"
            }
        }, {
            "type": "text",
            "text": data.info.sellerName,
            "css": {
                "color": "#FFEFC5",
                "width": "190px",
                "top": "10px",
                "left": "10px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "12px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        }, {
            "type": "text",
            "text": data.info.date,
            "css": {
                "color": "#FFEFC5",
                "width": "210px",
                "height": "168px",
                "top": "60px",
                "borderColor": "#000000",
                "fontSize": "36px",
                "fontWeight": "bold",
                "maxLines": "3",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        }, {
            "type": "text",
            "text": data.info.time,
            "css": {
                "color": "#FFEFC5",
                "width": "210px",
                "height": "168px",
                "top": "110px",
                "borderColor": "#000000",
                "fontSize": "18px",
                "fontWeight": "bold",
                "maxLines": "3",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        })
    }
    // 新的样式1-1至1-4
    if (data.type1 == '1' && data.type2) {
        views.push({
            "type": "image",
            "url": 'https://qn.colorcun.com/rectangleBj1.png',
            "css": {
                "width": "210px",
                "height": "26px",
                "top": "0px",
                "left": "0px",
                "mode": "aspectFill"
            }
        }, {
            "type": "image",
            "url": 'https://qn.colorcun.com/rectangleBj1.png',
            "css": {
                "width": "210px",
                "height": "26px",
                "top": "142px",
                "left": "0px",
                "mode": "aspectFill"
            }
        }, {
            "type": "text",
            "text": data.info.sellerName,
            "css": {
                "color": "#FFEFC5",
                "width": "190px",
                "top": "6px",
                "left": "10px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        }, {
            "type": "text",
            "text": data.info.time,
            "css": {
                "color": "#FFEFC5",
                "width": "210px",
                "height": "168px",
                "top": "146px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "bold",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        });
    }
    // 新的样式2-1至2-4
    if (data.type1 == '2' && data.type2) {
        views.push({
            "type": "image",
            "url": 'https://qn.colorcun.com/rectangleBj3.png',
            "css": {
                "width": "210px",
                "height": "168px",
                "top": "0px",
                "left": "0px",
                "mode": "aspectFill"
            }
        }, {
            "type": "text",
            "text": data.info.sellerName,
            "css": {
                "color": "#FFEFC5",
                "width": "190px",
                "top": "33px",
                "left": "10px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        }, {
            "type": "text",
            "text": data.date2,
            "css": {
                "color": "#FFEFC5",
                "width": "190px",
                "top": "65px",
                "left": "10px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "36px",
                "fontWeight": "normal",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        }, {
            "type": "text",
            "text": data.info.time,
            "css": {
                "color": "#FFEFC5",
                "width": "210px",
                "height": "168px",
                "top": "118px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "bold",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        });
    }
    // 新的样式3-1至3-4
    if (data.type1 == '3' && data.type2) {
        views.push({
            "type": "image",
            "url": 'https://qn.colorcun.com/rectangleBj3.png',
            "css": {
                "width": "210px",
                "height": "168px",
                "top": "0px",
                "left": "0px",
                "mode": "aspectFill"
            }
        }, {
            "type": "text",
            "text": data.info.sellerName,
            "css": {
                "color": "#FFEFC5",
                "width": "190px",
                "top": "20px",
                "left": "12px",
                "right": "12px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
            }
        }, {
            "type": "text",
            "text": data.date2,
            "css": {
                "color": "#FFEFC5",
                "width": "130px",
                "top": "85px",
                "left": "40px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "40px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
            }
        }, {
            "type": "text",
            "text": '周',
            "css": {
                "color": "#FFEFC5",
                "width": "10px",
                "top": "88px",
                "left": "60px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
            }
        }, {
            "type": "text",
            "text": data.day2,
            "css": {
                "color": "#FFEFC5",
                "width": "10px",
                "top": "105px",
                "left": "60px",
                "right": "10px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "2",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
            }
        }, {
            "type": "text",
            "text": data.info.time,
            "css": {
                "color": "#FFEFC5",
                "minWidth": "90px",
                "top": "140px",
                "lineHeight": "20px",
                "right": "18px",
                "padding": "2px 6px",
                "borderColor": "#000000",
                "borderRadius": "3px",
                "fontSize": "16px",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                'background': 'rgba(255, 239, 197, 0.4)',
                "textAlign": "center",
                "verticalAlign": "middle",
            }
        }, );
    }
    // 新的样式4-1至4-4
    if (data.type1 == '4' && data.type2) {
        views.push({
            "type": "image",
            "url": 'https://qn.colorcun.com/rectangleBj2.png',
            "css": {
                "width": "210px",
                "height": "56px",
                "top": "112px",
                "left": "0px",
                "mode": "aspectFill"
            }
        }, {
            "type": "text",
            "text": data.info.sellerName,
            "css": {
                "color": "#FFEFC5",
                "width": "190px",
                "top": "114px",
                "left": "8px",
                "right": "8px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                "textAlign": "center",
            }
        }, {
            "type": "text",
            "text": data.date2 + data.week,
            "css": {
                "color": "#FFEFC5",
                "width": "180px",
                "top": "140px",
                "left": "14px",
                "borderColor": "#000000",
                "fontSize": "16px",
                "fontWeight": "normal",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
            }
        }, {
            "type": "text",
            "text": data.info.time,
            "css": {
                "color": "#FFEFC5",
                "width": "90px",
                "top": "142px",
                "lineHeight": "20px",
                "right": "14px",
                "padding": "1px 2px",
                "borderColor": "#000000",
                "borderRadius": "3px",
                "fontSize": "16px",
                "maxLines": "1",
                "textStyle": "fill",
                "textDecoration": "none",
                "fontFamily": "PingFang SC",
                'background': 'rgba(255, 239, 197, 0.4)',
                "textAlign": "center",
                "verticalAlign": "middle",
            }
        }, );
    }
    return {
        "width": "210px",
        "height": "168px",
        "views": views
    };
}