修正名片分享跑版問題

main
bruce68410 2 years ago
parent 5f134c034b
commit c583ac9982

@ -10,16 +10,17 @@ function genAdCard(ctx,option) {
ctx.contents,
{
"type": "bubble",
"size":"mega",
"size":"giga",
"hero": {
"type": "image",
"url": option.ad_image,
"size": "full",
"aspectMode": "cover",
"aspectRatio": "19:11",
"aspectRatio": "5:2",
"action": {
"type": "uri",
"uri": option.link
"label": option.ad_title,
"uri": option.ad_link
}
},
"body": {
@ -41,40 +42,6 @@ function genAdCard(ctx,option) {
"wrap": true
}
]
},
"footer": {
"type": "box",
"layout": "vertical",
"spacing": "sm",
"color": "#6c6664",
"contents": [
{
"type": "button",
"style": "primary",
"height": "sm",
"color": "#6c6664",
"action": {
"type": "uri",
"label": "test link",
"uri": "https://linecorp.com"
}
},
{
"type": "box",
"layout": "vertical",
"contents": [],
"margin": "sm"
}
],
"flex": 0
},
"styles": {
"body": {
"backgroundColor": "#eeeeee"
},
"footer": {
"backgroundColor": "#eeeeee"
}
}
}
]

@ -153,7 +153,7 @@ function genCard(vcard) {
}
}
],
"spacing": "md",
"spacing": "lg",
"margin": "sm"
},
`;
@ -168,13 +168,13 @@ function genCard(vcard) {
{
"type": "image",
"url": "${vcard.avatar}",
"size": "xs",
"size": "full",
"action": {
"type": "uri",
"label": "action",
"uri": "${vcard.nfcurl}&cardid=1"
}
},
}
`;
} else {
vcardAvatar = "";
@ -241,11 +241,22 @@ function genCard(vcard) {
"uri": "${vcard.nfcurl}&cardid=1"
}
},
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [
${vcardAvatar}
],
"width": "80px",
"height": "80px",
"cornerRadius": "50px"
},
{
"type": "text",
"text": "${vcard.company}",
@ -254,18 +265,14 @@ function genCard(vcard) {
"weight": "bold",
"wrap": true,
"align": "center",
"margin": "sm",
"action": {
"type": "uri",
"label": "action",
"uri": "${vcard.nfcurl}&cardid=1"
}
"margin": "sm"
}
],
"position": "absolute",
"offsetTop": "13%",
"offsetStart": "3%",
"width": "26%"
"width": "26%",
"alignItems": "center"
},
{
"type": "box",
@ -284,7 +291,7 @@ function genCard(vcard) {
"margin": "xs"
}
],
"backgroundColor": "#06c755",
"backgroundColor": "#222222",
"width": "100%",
"cornerRadius": "5px",
"action": {
@ -308,7 +315,7 @@ function genCard(vcard) {
"margin": "xs"
}
],
"backgroundColor": "#ffcc5b",
"backgroundColor": "#222222",
"width": "100%",
"cornerRadius": "5px",
"margin": "md",
@ -367,7 +374,7 @@ function genCard(vcard) {
"layout": "baseline",
"contents": [],
"backgroundColor": "#d5602d",
"height": "3px",
"height": "1px",
"margin": "lg"
},
${vcardPhone}
@ -385,7 +392,7 @@ function genCard(vcard) {
],
"position": "absolute",
"offsetTop": "12%",
"offsetStart": "35%",
"offsetStart": "37%",
"offsetEnd": "5%"
}
],

@ -7,6 +7,8 @@ function genCard(vcard) {
{
"type": "box",
"layout": "baseline",
"margin": "md",
"paddingStart": "lg",
"contents": [
{
"type": "icon",
@ -21,9 +23,7 @@ function genCard(vcard) {
"color": "#6c6664",
"size": "md"
}
],
"margin": "md",
"paddingStart": "lg"
]
},
`;
} else {
@ -31,6 +31,8 @@ function genCard(vcard) {
{
"type": "box",
"layout": "baseline",
"margin": "md",
"paddingStart": "lg",
"contents": [
{
"type": "icon",
@ -50,9 +52,7 @@ function genCard(vcard) {
"uri": "${vcard.url}"
}
}
],
"margin": "md",
"paddingStart": "lg"
]
},
`;
}
@ -66,6 +66,8 @@ function genCard(vcard) {
{
"type": "box",
"layout": "baseline",
"margin": "md",
"paddingStart": "lg",
"contents": [
{
"type": "icon",
@ -79,19 +81,17 @@ function genCard(vcard) {
"text": "${vcard.address}",
"color": "#6c6664",
"size": "md",
"wrap": true,
"action": {
"type": "uri",
"label": "action",
"uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
vcard.address
)}"
},
"wrap": true
}
],
"margin": "md",
"paddingStart": "lg"
},
}
]
}
`;
} else {
vcardAddr = "";
@ -104,6 +104,8 @@ function genCard(vcard) {
{
"type": "box",
"layout": "baseline",
"margin": "md",
"paddingStart": "lg",
"contents": [
{
"type": "icon",
@ -123,9 +125,7 @@ function genCard(vcard) {
"uri": "tel:${vcard.tel}"
}
}
],
"margin": "md",
"paddingStart": "lg"
]
},
`;
} else {
@ -168,6 +168,8 @@ function genCard(vcard) {
"size": "full",
"aspectRatio": "1:1",
"aspectMode": "cover",
"align": "center",
"gravity": "center",
"action": {
"type": "uri",
"label": "action",
@ -186,6 +188,8 @@ function genCard(vcard) {
{
"type": "box",
"layout": "baseline",
"margin": "md",
"paddingStart": "lg",
"contents": [
{
"type": "icon",
@ -205,9 +209,7 @@ function genCard(vcard) {
"uri": "mailto:${vcard.email}"
}
}
],
"margin": "md",
"paddingStart": "lg"
]
},
`;
} else {
@ -228,16 +230,6 @@ function genCard(vcard) {
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [],
"height": "45%"
},
{
"type": "box",
"layout": "vertical",
@ -246,55 +238,15 @@ function genCard(vcard) {
"type": "image",
"size": "full",
"position": "relative",
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-03h.png"
}
],
"height": "55%"
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-03h.png",
"aspectRatio": "4:1",
"aspectMode": "cover"
}
],
"height": "100%",
"position": "absolute",
"width": "100%"
},
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "Company",
"size": "3xl",
"weight": "bold",
"offsetBottom": "md",
"color": "#c6b0c9"
},
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "${vcard.company}",
"color": "#ffffff",
"size": "md"
}
],
"backgroundColor": "#6c6d8b",
"paddingTop": "sm",
"paddingBottom": "sm",
"paddingStart": "lg",
"cornerRadius": "xxl",
"paddingEnd": "lg",
"offsetBottom": "xl"
}
],
"cornerRadius": "15px",
"paddingStart": "10px",
"paddingEnd": "10px",
"alignItems": "flex-end",
"offsetEnd": "none",
"position": "absolute",
"offsetTop": "none"
"width": "100%",
"justifyContent": "flex-end"
},
{
"type": "box",
@ -307,10 +259,11 @@ function genCard(vcard) {
{
"type": "box",
"layout": "vertical",
"contents": [${vcardAvatar}],
"cornerRadius": "10px",
"margin": "none",
"width": "100%"
"contents": [
${vcardAvatar}
],
"width": "90%",
"cornerRadius": "xxl"
},
{
"type": "box",
@ -357,12 +310,13 @@ function genCard(vcard) {
"margin": "xxl"
}
],
"paddingTop": "5%",
"paddingTop": "8%",
"paddingBottom": "8%",
"justifyContent": "flex-start",
"width": "30%",
"alignItems": "center",
"height": "95%"
"height": "100%",
"position": "relative"
},
{
"type": "box",
@ -370,40 +324,76 @@ function genCard(vcard) {
"contents": [
{
"type": "box",
"layout": "horizontal",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "Company",
"size": "3xl",
"weight": "bold",
"color": "#c6b0c9"
},
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "${vcard.name}",
"size": "xxl",
"weight": "bold"
"text": "${vcard.company}",
"color": "#ffffff",
"size": "md"
}
]
],
"backgroundColor": "#6c6d8b",
"paddingTop": "sm",
"paddingBottom": "sm",
"paddingStart": "lg",
"cornerRadius": "xxl",
"paddingEnd": "lg",
"offsetBottom": "md"
}
],
"cornerRadius": "15px",
"alignItems": "flex-end",
"position": "relative"
},
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "${vcard.title}",
"text": "前端布魯",
"size": "md",
"weight": "bold",
"color": "#888888",
"action": {
"type": "uri",
"label": "action",
"uri": "${vcard.nfcurl}&cardid=1"
"uri": "https://utel.zltest.com.tw/card/?params=TE%2BoyUn0Yl7Vj76pKdp9VaL0LtXOVTpMx5BbbOvd1yM%3D&cardid=1"
}
}
]
},
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "${vcard.name}",
"size": "xxl",
"weight": "bold"
}
]
}
],
"alignItems": "center"
"alignItems": "flex-start",
"justifyContent": "space-between"
},
{
"type": "separator",
@ -419,37 +409,28 @@ function genCard(vcard) {
${vcardLink}
${vcardEmail}
${vcardAddr}
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "separator"
}
]
}
],
"margin": "xs"
"margin": "xs",
"backgroundColor": "#ffffff95",
"paddingTop": "sm",
"paddingBottom": "lg"
}
],
"height": "84%",
"paddingStart": "xxl"
"height": "100%",
"position": "relative",
"width": "70%",
"paddingStart": "lg",
"paddingEnd": "md",
"paddingBottom": "lg"
}
],
"paddingAll": "xl",
"height": "100%",
"alignItems": "flex-end"
"alignItems": "flex-start"
}
],
"paddingAll": "0px",
"action": {
"type": "uri",
"label": "action",
"uri": "https://utel.zltest.com.tw/card/?params=i7Kq7O59hPX1MJ%2Bqd8zQKBwuyc%2F%2BZ%2BZs%2BZXtXBy4zvg%3D&cardid=1"
},
"justifyContent": "center",
"alignItems": "center",
"height": "420px"
"alignItems": "center"
}
}
}

@ -148,10 +148,11 @@ function genCard(vcard) {
"layout": "vertical",
"contents": [
{
"position": "absolute",
"type": "image",
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-02.png",
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-02h.png",
"size": "full",
"position": "absolute",
"aspectRatio": "2:3",
"aspectMode": "cover"
},
{
@ -230,7 +231,7 @@ function genCard(vcard) {
"borderWidth": "bold",
"borderColor": "#ffffff",
"margin": "none",
"width": "30%"
"width": "100px"
}
],
"alignItems": "center",
@ -295,7 +296,7 @@ function genCard(vcard) {
"style": "primary"
}
],
"width": "30%"
"width": "100px"
}
],
"alignItems": "flex-end"
@ -313,23 +314,26 @@ function genCard(vcard) {
"cornerRadius": "lg"
},
{
"position": "absolute",
"type": "box",
"layout": "vertical",
"height": "25px",
"justifyContent": "center",
"alignItems": "center",
"paddingStart": "lg",
"paddingEnd": "lg",
"offsetTop": "sm",
"offsetStart": "sm",
"cornerRadius": "15px",
"backgroundColor": "#ffffff",
"contents": [
{
"type": "text",
"text": "匯康科技",
"text": "${vcard.company}"
"color": "#e5b164",
"size": "md"
}
],
"position": "absolute",
"offsetTop": "sm",
"offsetStart": "sm",
"backgroundColor": "#ffffff",
"cornerRadius": "15px",
"paddingStart": "10px",
"paddingEnd": "10px"
]
}
],
"paddingAll": "0px",
@ -338,7 +342,6 @@ function genCard(vcard) {
"label": "action",
"uri": "https://utel.zltest.com.tw/card/?params=i7Kq7O59hPX1MJ%2Bqd8zQKBwuyc%2F%2BZ%2BZs%2BZXtXBy4zvg%3D&cardid=1"
},
"height": "280px",
"justifyContent": "center",
"alignItems": "center"
}

@ -79,7 +79,7 @@ function genCard(vcard) {
"type": "text",
"text": "${vcard.tel}",
"color": "#ffffff",
"size": "sm",
"size": "lg",
"wrap": true,
"action": {
"type": "uri",
@ -146,20 +146,27 @@ function genCard(vcard) {
"body": {
"type": "box",
"layout": "horizontal",
"height": "270px",
"paddingAll": "0px",
"contents": [
{
"position": "relative",
"type": "box",
"layout": "vertical",
"width": "35%",
"height": "100%",
"paddingAll": "15px",
"alignItems": "center",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [${vcardAvatar}],
"cornerRadius": "150px",
"width": "60%",
"width": "80%",
"margin": "none",
"borderWidth": "bold",
"borderColor": "#f5c520",
"margin": "none"
"cornerRadius": "150px",
"contents": [${vcardAvatar}]
},
{
"type": "text",
@ -181,15 +188,20 @@ function genCard(vcard) {
}
},
${vcardPhone}
],
"alignItems": "center",
"paddingTop": "5%",
"paddingBottom": "5%",
"width": "35%"
]
},
{
"position": "relative",
"type": "box",
"layout": "vertical",
"width": "66%",
"height": "100%",
"justifyContent": "space-between",
"paddingTop": "4%",
"paddingBottom": "5%",
"paddingStart": "5%",
"paddingEnd": "5%",
"backgroundColor": "#353e45",
"contents": [
{
"type": "box",
@ -216,89 +228,80 @@ function genCard(vcard) {
"type": "box",
"layout": "horizontal",
"justifyContent": "space-between",
"margin": "md",
"contents": [
{
"type": "box",
"layout": "vertical",
"width": "48%",
"height": "40px",
"justifyContent": "center",
"alignItems": "center",
"borderWidth": "light",
"borderColor": "#dddddd",
"cornerRadius": "lg",
"contents": [
{
"type": "button",
"type": "text",
"text": "加入好友",
"color": "#dddddd"
}
],
"action": {
"type": "uri",
"label": "加入好友",
"label": "action",
"uri": "http://linecorp.com/"
},
"color": "#dddddd",
"height": "sm",
"style": "link"
}
],
"borderWidth": "light",
"borderColor": "#dddddd",
"cornerRadius": "lg",
"width": "48%",
"height": "36px"
},
{
"type": "box",
"layout": "vertical",
"width": "48%",
"height": "40px",
"justifyContent": "center",
"alignItems": "center",
"borderWidth": "light",
"borderColor": "#dddddd",
"cornerRadius": "lg",
"contents": [
{
"type": "button",
"type": "text",
"text": "分享名片",
"color": "#dddddd"
}
],
"action": {
"type": "uri",
"label": "分享名片",
"label": "action",
"uri": "http://linecorp.com/"
},
"color": "#dddddd",
"height": "sm",
"style": "link"
}
],
"cornerRadius": "lg",
"borderColor": "#dddddd",
"borderWidth": "light",
"height": "36px",
"width": "48%"
}
],
"margin": "md"
]
}
]
}
],
"backgroundColor": "#353e45",
"paddingBottom": "4%",
"paddingStart": "5%",
"paddingEnd": "5%",
"width": "66%",
"justifyContent": "space-between",
"paddingTop": "4%"
]
},
{
"position": "absolute",
"type": "box",
"layout": "vertical",
"width": "67%",
"height": "100%",
"justifyContent": "flex-start",
"offsetEnd": "none",
"contents": [
{
"position": "relative",
"type": "image",
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-01.png",
"size": "full"
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-01s.png",
"size": "full",
"aspectRatio": "3:1",
"offsetTop": "15%"
}
],
"position": "absolute",
"width": "67%",
"height": "70%",
"offsetEnd": "none",
"justifyContent": "flex-end"
]
}
],
"paddingAll": "0px",
"action": {
"type": "uri",
"label": "action",
"uri": "https://utel.zltest.com.tw/card/?params=i7Kq7O59hPX1MJ%2Bqd8zQKBwuyc%2F%2BZ%2BZs%2BZXtXBy4zvg%3D&cardid=1"
},
"height": "270px"
]
}
}
}

@ -2,9 +2,9 @@ import { genCard as Card0 } from "./card0.js";
import { genCard as Card1 } from "./card1.js";
import { genCard as Card2 } from "./card2.js";
import { genCard as Card3 } from "./card3.js";
import { genCard as Card4 } from "./card4.js";
export function genCard(opt) {
console.log(opt.tid)
switch (opt.tid) {
case 0:
return Card0(opt.vcard);
@ -18,9 +18,6 @@ export function genCard(opt) {
case 3:
return Card3(opt.vcard);
break;
case 4:
return Card4(opt.vcard);
break;
default:
throw new Error("params error");
break;

Loading…
Cancel
Save