bruce68410
3 years ago
parent
3e2fcfafeb
commit
1750234318
File diff suppressed because it is too large
Load Diff
@ -1,339 +1,451 @@
|
|||||||
function genCard(vcard) {
|
function genCard(vcard) {
|
||||||
|
// 名片預覽
|
||||||
let vcardLink;
|
let vcardLink;
|
||||||
if (vcard.url.trim().length > 0) {
|
if (vcard.url.trim().length > 0) {
|
||||||
if (vcard.nc_func.indexOf("nourl") !== -1) {
|
if (vcard.nc_func.indexOf("nourl") !== -1) {
|
||||||
vcardLink = {
|
vcardLink = `
|
||||||
type: "text",
|
{
|
||||||
text: vcard.url,
|
"type": "box",
|
||||||
color: "#FFFFFF",
|
"layout": "baseline",
|
||||||
align: "end",
|
"contents": [
|
||||||
};
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://369cycle.zltest.com.tw/tggo/template/icon/link.png",
|
||||||
|
"size": "sm",
|
||||||
|
"offsetTop": "xs",
|
||||||
|
"offsetEnd": "md"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.url}",
|
||||||
|
"color": "#6c6664",
|
||||||
|
"size": "md"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"margin": "md",
|
||||||
|
"paddingStart": "lg"
|
||||||
|
},
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardLink = {
|
vcardLink = `
|
||||||
type: "text",
|
{
|
||||||
text: vcard.url,
|
"type": "box",
|
||||||
color: "#FFFFFF",
|
"layout": "baseline",
|
||||||
align: "end",
|
"contents": [
|
||||||
action: {
|
{
|
||||||
type: "uri",
|
"type": "icon",
|
||||||
label: "action",
|
"url": "https://369cycle.zltest.com.tw/tggo/template/icon/link.png",
|
||||||
uri: vcard.url,
|
"size": "sm",
|
||||||
},
|
"offsetTop": "xs",
|
||||||
};
|
"offsetEnd": "md"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.url}",
|
||||||
|
"color": "#6c6664",
|
||||||
|
"size": "md",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "yahoo",
|
||||||
|
"uri": "${vcard.url}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"margin": "md",
|
||||||
|
"paddingStart": "lg"
|
||||||
|
},
|
||||||
|
`;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
vcardLink = {
|
vcardLink = "";
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
color: "#FFFFFF",
|
|
||||||
align: "end",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardAddr;
|
let vcardAddr;
|
||||||
if (vcard.address.trim().length > 0) {
|
if (vcard.address.trim().length > 0) {
|
||||||
vcardAddr = {
|
vcardAddr = `
|
||||||
type: "box",
|
{
|
||||||
layout: "vertical",
|
"type": "box",
|
||||||
contents: [
|
"layout": "baseline",
|
||||||
{
|
"contents": [
|
||||||
type: "text",
|
{
|
||||||
text: vcard.address.substr(0, 3),
|
"type": "icon",
|
||||||
size: "sm",
|
"url": "https://369cycle.zltest.com.tw/tggo/template/icon/map.png",
|
||||||
},
|
"size": "sm",
|
||||||
{
|
"offsetTop": "xs",
|
||||||
type: "text",
|
"offsetEnd": "md"
|
||||||
text:
|
},
|
||||||
vcard.address.substr(3).length > 0 ? vcard.address.substr(3) : " ",
|
{
|
||||||
size: "sm",
|
"type": "text",
|
||||||
wrap: true,
|
"text": "${vcard.address}",
|
||||||
maxLines: 2,
|
"color": "#6c6664",
|
||||||
},
|
"size": "md",
|
||||||
],
|
"action": {
|
||||||
position: "absolute",
|
"type": "uri",
|
||||||
offsetTop: "30%",
|
"label": "action",
|
||||||
offsetStart: "25%",
|
"uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
|
||||||
width: "40%",
|
vcard.address
|
||||||
height: "60px",
|
)}"
|
||||||
action: {
|
},
|
||||||
type: "uri",
|
"wrap": true
|
||||||
label: "action",
|
}
|
||||||
uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
|
],
|
||||||
vcard.address
|
"margin": "md",
|
||||||
)}`,
|
"paddingStart": "lg"
|
||||||
},
|
}
|
||||||
};
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardAddr = {
|
vcardAddr = "";
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
size: "sm",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "30%",
|
|
||||||
offsetStart: "25%",
|
|
||||||
width: "40%",
|
|
||||||
height: "60px",
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
if (vcard.title.trim().length == 0) {
|
|
||||||
vcard.title = " ";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardTel;
|
let vcardTel;
|
||||||
|
|
||||||
if (vcard.tel.trim().length == 0) {
|
if (vcard.tel.trim().length > 0) {
|
||||||
vcardTel = {
|
vcardTel = `
|
||||||
type: "text",
|
{
|
||||||
text: " ",
|
"type": "box",
|
||||||
align: "end",
|
"layout": "baseline",
|
||||||
};
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://369cycle.zltest.com.tw/tggo/template/icon/phone.png",
|
||||||
|
"size": "sm",
|
||||||
|
"offsetTop": "xs",
|
||||||
|
"offsetEnd": "md"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.tel}",
|
||||||
|
"color": "#6c6664",
|
||||||
|
"size": "md",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "tel:${vcard.tel}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"margin": "md",
|
||||||
|
"paddingStart": "lg"
|
||||||
|
},
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardTel = {
|
vcardTel = "";
|
||||||
type: "text",
|
|
||||||
text: vcard.tel,
|
|
||||||
align: "end",
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: "tel:" + vcard.tel,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardPhone;
|
let vcardPhone;
|
||||||
|
|
||||||
if (vcard.phone.trim().length == 0) {
|
if (vcard.phone.trim().length > 0) {
|
||||||
vcardPhone = {
|
vcardPhone = `
|
||||||
type: "text",
|
{
|
||||||
text: " ",
|
"type": "box",
|
||||||
align: "end",
|
"layout": "vertical",
|
||||||
};
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.phone}",
|
||||||
|
"size": "xxl",
|
||||||
|
"color": "#93476e",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "tel:${vcard.phone}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardPhone = {
|
vcardPhone = "";
|
||||||
type: "text",
|
|
||||||
text: vcard.phone,
|
|
||||||
align: "end",
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: "tel:" + vcard.phone,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardAvatar;
|
let vcardAvatar;
|
||||||
|
|
||||||
if (vcard.avatar.trim().length > 0) {
|
if (vcard.avatar.trim().length > 0) {
|
||||||
vcardAvatar = {
|
vcardAvatar = `
|
||||||
type: "image",
|
{
|
||||||
url: vcard.avatar,
|
"type": "image",
|
||||||
action: {
|
"url": "${vcard.avatar}",
|
||||||
type: "uri",
|
"size": "full",
|
||||||
label: "action",
|
"aspectRatio": "1:1",
|
||||||
uri: vcard.nfcurl + "&cardid=1",
|
"aspectMode": "cover",
|
||||||
},
|
"action": {
|
||||||
aspectMode: "cover",
|
"type": "uri",
|
||||||
size: "full",
|
"label": "action",
|
||||||
};
|
"uri": "${vcard.nfcurl}&cardid=1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardAvatar = {
|
vcardAvatar = "";
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
size: "xs",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardEmail;
|
let vcardEmail;
|
||||||
|
|
||||||
if (vcard.email.trim().length > 0) {
|
if (vcard.email.trim().length > 0) {
|
||||||
vcardEmail = {
|
vcardEmail = `
|
||||||
type: "text",
|
{
|
||||||
text: vcard.email,
|
"type": "box",
|
||||||
color: "#333334",
|
"layout": "baseline",
|
||||||
size: "sm",
|
"contents": [
|
||||||
weight: "bold",
|
{
|
||||||
action: {
|
"type": "icon",
|
||||||
type: "uri",
|
"url": "https://369cycle.zltest.com.tw/tggo/template/icon/mail.png",
|
||||||
label: "action",
|
"size": "sm",
|
||||||
uri: `mailto:${vcard.email}`,
|
"offsetTop": "xs",
|
||||||
},
|
"offsetEnd": "md"
|
||||||
align: "end",
|
},
|
||||||
};
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.email}",
|
||||||
|
"color": "#6c6664",
|
||||||
|
"size": "md",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "mailto:${vcard.email}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"margin": "md",
|
||||||
|
"paddingStart": "lg"
|
||||||
|
},
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardEmail = {
|
vcardEmail = "";
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
color: "#333334",
|
|
||||||
size: "sm",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let card = {
|
// 名片發送
|
||||||
altText: "UTel電子名片",
|
|
||||||
type: "flex",
|
let card = `
|
||||||
contents: {
|
{
|
||||||
type: "bubble",
|
"altText": "UTel電子名片",
|
||||||
size: "giga",
|
"type": "flex",
|
||||||
body: {
|
"contents":
|
||||||
type: "box",
|
{
|
||||||
layout: "vertical",
|
"type": "bubble",
|
||||||
contents: [
|
"size": "giga",
|
||||||
{
|
"body": {
|
||||||
type: "image",
|
"type": "box",
|
||||||
url: process.env.VUE_APP_BASE_URL+"/images/tpl02_bg.png",
|
"layout": "vertical",
|
||||||
size: "full",
|
"contents": [
|
||||||
aspectMode: "cover",
|
{
|
||||||
aspectRatio: "4:3",
|
"type": "box",
|
||||||
gravity: "top",
|
"layout": "vertical",
|
||||||
},
|
"contents": [
|
||||||
{
|
{
|
||||||
type: "box",
|
"type": "box",
|
||||||
layout: "vertical",
|
"layout": "vertical",
|
||||||
contents: [vcardAvatar],
|
"contents": [],
|
||||||
position: "absolute",
|
"height": "45%"
|
||||||
offsetTop: "13%",
|
|
||||||
offsetStart: "3%",
|
|
||||||
width: "75px",
|
|
||||||
height: "75px",
|
|
||||||
cornerRadius: "100px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "加入好友",
|
|
||||||
align: "center",
|
|
||||||
color: "#ffffff",
|
|
||||||
weight: "bold",
|
|
||||||
margin: "xs",
|
|
||||||
size: "xs",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
backgroundColor: "#ffcc5b",
|
|
||||||
width: "100%",
|
|
||||||
cornerRadius: "5px",
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: "https://line.naver.jp/ti/p/~" + vcard.line,
|
|
||||||
},
|
},
|
||||||
paddingTop: "5px",
|
{
|
||||||
paddingBottom: "5px",
|
"type": "box",
|
||||||
},
|
"layout": "vertical",
|
||||||
{
|
"contents": [
|
||||||
type: "box",
|
{
|
||||||
layout: "vertical",
|
"type": "image",
|
||||||
contents: [
|
"size": "full",
|
||||||
{
|
"position": "relative",
|
||||||
type: "text",
|
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-03h.png"
|
||||||
text: "分享名片",
|
}
|
||||||
align: "center",
|
],
|
||||||
color: "#ffffff",
|
"height": "55%"
|
||||||
weight: "bold",
|
}
|
||||||
margin: "xs",
|
],
|
||||||
size: "xs",
|
"height": "100%",
|
||||||
},
|
"position": "absolute",
|
||||||
],
|
"width": "100%"
|
||||||
backgroundColor: "#ffcc5b",
|
|
||||||
width: "100%",
|
|
||||||
cornerRadius: "5px",
|
|
||||||
margin: "md",
|
|
||||||
paddingTop: "5px",
|
|
||||||
paddingBottom: "5px",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetStart: "10%",
|
|
||||||
width: "20%",
|
|
||||||
offsetBottom: "16%",
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: `${process.env.VUE_APP_SEND_URL}/?userid=${vcard.user_id}&cardid=1`,
|
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"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"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "horizontal",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [${vcardAvatar}],
|
||||||
|
"cornerRadius": "10px",
|
||||||
|
"margin": "none",
|
||||||
|
"width": "100%"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"justifyContent": "space-between",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "button",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "加入好友",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#755483",
|
||||||
|
"height": "sm",
|
||||||
|
"style": "primary",
|
||||||
|
"margin": "md"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "button",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "分享名片",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#93476e",
|
||||||
|
"height": "sm",
|
||||||
|
"style": "primary",
|
||||||
|
"margin": "md"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "button",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "其他連結",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#c73f6d",
|
||||||
|
"height": "sm",
|
||||||
|
"style": "primary",
|
||||||
|
"margin": "md"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"margin": "xxl"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"paddingTop": "5%",
|
||||||
|
"paddingBottom": "8%",
|
||||||
|
"justifyContent": "flex-start",
|
||||||
|
"width": "30%",
|
||||||
|
"alignItems": "center",
|
||||||
|
"height": "95%"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "horizontal",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.name}",
|
||||||
|
"size": "xxl",
|
||||||
|
"weight": "bold"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.title}",
|
||||||
|
"size": "md",
|
||||||
|
"weight": "bold",
|
||||||
|
"color": "#888888",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}&cardid=1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"alignItems": "center"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "separator",
|
||||||
|
"color": "#93476e",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
${vcardPhone}
|
||||||
|
${vcardTel}
|
||||||
|
${vcardLink}
|
||||||
|
${vcardEmail}
|
||||||
|
${vcardAddr}
|
||||||
|
],
|
||||||
|
"margin": "xs"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"height": "84%",
|
||||||
|
"paddingStart": "xxl"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"paddingAll": "xl",
|
||||||
|
"height": "100%",
|
||||||
|
"alignItems": "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"
|
||||||
},
|
},
|
||||||
{
|
"justifyContent": "center",
|
||||||
type: "box",
|
"alignItems": "center",
|
||||||
layout: "vertical",
|
"height": "420px"
|
||||||
contents: [
|
}
|
||||||
{
|
}
|
||||||
type: "text",
|
}
|
||||||
text: vcard.name,
|
`;
|
||||||
},
|
return { card };
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "13%",
|
|
||||||
offsetStart: "25%",
|
|
||||||
width: "90px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.title,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "13%",
|
|
||||||
offsetStart: "51%",
|
|
||||||
width: "50%",
|
|
||||||
},
|
|
||||||
vcardAddr,
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [vcardPhone, vcardTel],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "30%",
|
|
||||||
offsetEnd: "5%",
|
|
||||||
width: "30%",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.company,
|
|
||||||
size: "lg",
|
|
||||||
color: "#EFEFEF",
|
|
||||||
align: "end",
|
|
||||||
weight: "bold",
|
|
||||||
},
|
|
||||||
vcardLink,
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "65%",
|
|
||||||
offsetEnd: "5%",
|
|
||||||
width: "60%",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
paddingAll: "0px",
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: vcard.nfcurl + "&cardid=1",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
return { card: JSON.stringify(card) };
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export { genCard };
|
export { genCard };
|
||||||
|
|||||||
@ -1,368 +1,342 @@
|
|||||||
function genCard(vcard) {
|
function genCard(vcard) {
|
||||||
|
// 名片預覽
|
||||||
let vcardLink;
|
let vcardLink;
|
||||||
if (vcard.url.trim().length > 0) {
|
if (vcard.url.trim().length > 0) {
|
||||||
if (vcard.nc_func.indexOf("nourl") !== -1) {
|
if (vcard.nc_func.indexOf("nourl") !== -1) {
|
||||||
vcardLink = {
|
vcardLink = `{
|
||||||
type: "box",
|
"type": "text",
|
||||||
layout: "baseline",
|
"text": "${vcard.url}",
|
||||||
contents: [
|
"color": "#6c6664",
|
||||||
{
|
"size": "md"
|
||||||
type: "text",
|
},
|
||||||
text: vcard.url,
|
`;
|
||||||
color: "#333334",
|
|
||||||
size: "sm",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
margin: "xs",
|
|
||||||
};
|
|
||||||
} else {
|
} else {
|
||||||
vcardLink = {
|
vcardLink = `
|
||||||
type: "box",
|
{
|
||||||
layout: "baseline",
|
"type": "text",
|
||||||
contents: [
|
"text": "${vcard.url}",
|
||||||
{
|
"color": "#6c6664",
|
||||||
type: "text",
|
"size": "md",
|
||||||
text: vcard.url,
|
"action": {
|
||||||
color: "#333334",
|
"type": "uri",
|
||||||
size: "sm",
|
"label": "yahoo",
|
||||||
action: {
|
"uri": "${vcard.url}"
|
||||||
type: "uri",
|
}
|
||||||
label: "action",
|
},
|
||||||
uri: vcard.url,
|
`;
|
||||||
},
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
margin: "xs",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
vcardLink = {
|
vcardLink = "";
|
||||||
type: "box",
|
|
||||||
layout: "baseline",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
color: "#333334",
|
|
||||||
size: "sm",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
margin: "xs",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardAddr;
|
let vcardAddr;
|
||||||
if (vcard.address.trim().length > 0) {
|
if (vcard.address.trim().length > 0) {
|
||||||
vcardAddr = {
|
vcardAddr = `
|
||||||
type: "box",
|
{
|
||||||
layout: "vertical",
|
"type": "text",
|
||||||
contents: [
|
"text": "${vcard.address}",
|
||||||
{
|
"color": "#6c6664",
|
||||||
type: "text",
|
"size": "md",
|
||||||
text: vcard.address,
|
"action": {
|
||||||
weight: "bold",
|
"type": "uri",
|
||||||
color: "#333334",
|
"label": "action",
|
||||||
size: "sm",
|
"uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
|
||||||
align: "end",
|
vcard.address
|
||||||
action: {
|
)}"
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
|
|
||||||
vcard.address
|
|
||||||
)}`,
|
|
||||||
},
|
|
||||||
wrap: true,
|
|
||||||
},
|
},
|
||||||
],
|
"wrap": true,
|
||||||
spacing: "lg",
|
"align": "end"
|
||||||
margin: "xs",
|
}
|
||||||
};
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardAddr = {
|
vcardAddr = "";
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
weight: "bold",
|
|
||||||
color: "#333334",
|
|
||||||
size: "sm",
|
|
||||||
align: "end",
|
|
||||||
wrap: true,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
margin: "xs",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (vcard.title.trim().length == 0) {
|
let vcardTel;
|
||||||
vcard.title = " ";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (vcard.tel.trim().length == 0) {
|
if (vcard.tel.trim().length > 0) {
|
||||||
vcard.tel = " ";
|
vcardTel = `
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.tel}",
|
||||||
|
"color": "#6c6664",
|
||||||
|
"size": "md",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "tel:${vcard.tel}"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardTel = "";
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardPhone;
|
let vcardPhone;
|
||||||
|
|
||||||
if (vcard.phone.trim().length == 0) {
|
if (vcard.phone.trim().length > 0) {
|
||||||
vcard.phone = " ";
|
vcardPhone = `
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.phone}",
|
||||||
|
"size": "lg",
|
||||||
|
"color": "#ffffff",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "tel:${vcard.phone}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardPhone = "";
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardAvatar;
|
let vcardAvatar;
|
||||||
|
|
||||||
if (vcard.avatar.trim().length > 0) {
|
if (vcard.avatar.trim().length > 0) {
|
||||||
vcardAvatar = {
|
vcardAvatar = `
|
||||||
type: "image",
|
{
|
||||||
url: vcard.avatar,
|
"type": "image",
|
||||||
action: {
|
"url": "${vcard.avatar}",
|
||||||
type: "uri",
|
"size": "full",
|
||||||
label: "action",
|
"aspectRatio": "1:1",
|
||||||
uri: vcard.nfcurl + "&cardid=1",
|
"aspectMode": "cover",
|
||||||
},
|
"action": {
|
||||||
};
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}&cardid=1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardAvatar = {
|
vcardAvatar = "";
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
size: "xs",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardEmail;
|
let vcardEmail;
|
||||||
|
|
||||||
if (vcard.email.trim().length > 0) {
|
if (vcard.email.trim().length > 0) {
|
||||||
vcardEmail = {
|
vcardEmail = `
|
||||||
type: "text",
|
{
|
||||||
text: vcard.email,
|
"type": "text",
|
||||||
color: "#333334",
|
"text": "${vcard.email}",
|
||||||
size: "sm",
|
"color": "#6c6664",
|
||||||
weight: "bold",
|
"size": "md",
|
||||||
action: {
|
"action": {
|
||||||
type: "uri",
|
"type": "postback",
|
||||||
label: "action",
|
"label": "action",
|
||||||
uri: `mailto:${vcard.email}`,
|
"uri": "mailto:${vcard.email}"
|
||||||
},
|
}
|
||||||
align: "end",
|
},
|
||||||
};
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardEmail = {
|
vcardEmail = "";
|
||||||
type: "text",
|
|
||||||
text: " ",
|
|
||||||
color: "#333334",
|
|
||||||
size: "sm",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let card = {
|
// 名片發送
|
||||||
altText: "UTel電子名片",
|
|
||||||
type: "flex",
|
let card = `
|
||||||
contents: {
|
{
|
||||||
type: "bubble",
|
"altText": "UTel電子名片",
|
||||||
size: "giga",
|
"type": "flex",
|
||||||
body: {
|
"contents":
|
||||||
type: "box",
|
{
|
||||||
layout: "vertical",
|
"type": "bubble",
|
||||||
contents: [
|
"size": "giga",
|
||||||
{
|
"body": {
|
||||||
type: "image",
|
"type": "box",
|
||||||
url: process.env.VUE_APP_BASE_URL+"/images/jcibg.png",
|
"layout": "vertical",
|
||||||
size: "full",
|
"contents": [
|
||||||
aspectMode: "fit",
|
{
|
||||||
aspectRatio: "4:3",
|
"type": "image",
|
||||||
gravity: "top",
|
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-02.png",
|
||||||
},
|
"size": "full",
|
||||||
{
|
"position": "absolute",
|
||||||
type: "box",
|
"aspectMode": "cover"
|
||||||
layout: "vertical",
|
},
|
||||||
contents: [
|
{
|
||||||
vcardAvatar,
|
"type": "box",
|
||||||
{
|
"layout": "vertical",
|
||||||
type: "text",
|
"contents": [
|
||||||
text: "大同國際\n青年商會",
|
{
|
||||||
wrap: true,
|
"type": "box",
|
||||||
align: "center",
|
"layout": "horizontal",
|
||||||
margin: "md",
|
"contents": [
|
||||||
},
|
{
|
||||||
],
|
"type": "box",
|
||||||
position: "absolute",
|
"layout": "vertical",
|
||||||
offsetTop: "13%",
|
"contents": [
|
||||||
offsetStart: "2%",
|
{
|
||||||
width: "21%",
|
"type": "box",
|
||||||
},
|
"layout": "vertical",
|
||||||
{
|
"contents": [
|
||||||
type: "box",
|
{
|
||||||
layout: "vertical",
|
"type": "text",
|
||||||
contents: [
|
"text": "${vcard.name}",
|
||||||
{
|
"size": "xl",
|
||||||
type: "box",
|
"weight": "bold",
|
||||||
layout: "vertical",
|
"color": "#ffffff",
|
||||||
contents: [
|
"margin": "sm"
|
||||||
{
|
}
|
||||||
type: "text",
|
],
|
||||||
text: "加入好友",
|
"backgroundColor": "#bf4c32",
|
||||||
align: "center",
|
"paddingStart": "10px",
|
||||||
color: "#ffffff",
|
"paddingEnd": "5px"
|
||||||
weight: "bold",
|
},
|
||||||
margin: "xs",
|
{
|
||||||
},
|
"type": "box",
|
||||||
],
|
"layout": "vertical",
|
||||||
backgroundColor: "#06c755",
|
"contents": [
|
||||||
width: "100%",
|
{
|
||||||
cornerRadius: "5px",
|
"type": "text",
|
||||||
action: {
|
"text": "${vcard.title}",
|
||||||
type: "uri",
|
"size": "md",
|
||||||
label: "action",
|
"weight": "regular",
|
||||||
uri: "https://line.naver.jp/ti/p/~" + vcard.line,
|
"color": "#ffffff",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}&cardid=1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"backgroundColor": "#e5b164",
|
||||||
|
"paddingStart": "xxl",
|
||||||
|
"paddingEnd": "5px",
|
||||||
|
"offsetEnd": "5px",
|
||||||
|
"margin": "sm",
|
||||||
|
"paddingBottom": "xs",
|
||||||
|
"paddingTop": "2px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [${vcardPhone}],
|
||||||
|
"backgroundColor": "#7aa567",
|
||||||
|
"margin": "xs",
|
||||||
|
"paddingStart": "5px",
|
||||||
|
"paddingEnd": "5px"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"alignItems": "flex-end",
|
||||||
|
"width": "50%",
|
||||||
|
"paddingEnd": "xl"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [${vcardAvatar}],
|
||||||
|
"cornerRadius": "150px",
|
||||||
|
"borderWidth": "bold",
|
||||||
|
"borderColor": "#ffffff",
|
||||||
|
"margin": "none",
|
||||||
|
"width": "30%"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"alignItems": "center",
|
||||||
|
"paddingTop": "3%",
|
||||||
|
"justifyContent": "center"
|
||||||
},
|
},
|
||||||
},
|
{
|
||||||
{
|
"type": "box",
|
||||||
type: "box",
|
"layout": "vertical",
|
||||||
layout: "vertical",
|
"contents": [
|
||||||
contents: [
|
{
|
||||||
{
|
"type": "box",
|
||||||
type: "text",
|
"layout": "horizontal",
|
||||||
text: "分享名片",
|
"contents": [
|
||||||
align: "center",
|
{
|
||||||
color: "#ffffff",
|
"type": "box",
|
||||||
weight: "bold",
|
"layout": "vertical",
|
||||||
margin: "xs",
|
"contents": [
|
||||||
},
|
${vcardTel}
|
||||||
],
|
${vcardLink}
|
||||||
backgroundColor: "#ffcc5b",
|
${vcardEmail}
|
||||||
width: "100%",
|
${vcardAddr}
|
||||||
cornerRadius: "5px",
|
],
|
||||||
margin: "md",
|
"alignItems": "flex-end",
|
||||||
},
|
"paddingEnd": "xl"
|
||||||
],
|
},
|
||||||
position: "absolute",
|
{
|
||||||
offsetStart: "2%",
|
"type": "box",
|
||||||
width: "20%",
|
"layout": "vertical",
|
||||||
offsetBottom: "8%",
|
"justifyContent": "space-between",
|
||||||
action: {
|
"contents": [
|
||||||
type: "uri",
|
{
|
||||||
label: "action",
|
"type": "button",
|
||||||
uri: `${process.env.VUE_APP_SEND_URL}/?userid=${vcard.user_id}&cardid=1`,
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "加入好友",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#6c6664",
|
||||||
|
"height": "sm",
|
||||||
|
"style": "primary"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "button",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "分享名片",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#6c6664",
|
||||||
|
"height": "sm",
|
||||||
|
"margin": "sm",
|
||||||
|
"style": "primary"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"width": "30%"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"alignItems": "flex-end"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"justifyContent": "space-between"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"width": "95%",
|
||||||
|
"height": "92%",
|
||||||
|
"borderWidth": "light",
|
||||||
|
"borderColor": "#bbbbbb",
|
||||||
|
"paddingAll": "10px",
|
||||||
|
"justifyContent": "space-between",
|
||||||
|
"cornerRadius": "lg"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "匯康科技",
|
||||||
|
"color": "#e5b164",
|
||||||
|
"size": "md"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"position": "absolute",
|
||||||
|
"offsetTop": "sm",
|
||||||
|
"offsetStart": "sm",
|
||||||
|
"backgroundColor": "#ffffff",
|
||||||
|
"cornerRadius": "15px",
|
||||||
|
"paddingStart": "10px",
|
||||||
|
"paddingEnd": "10px"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"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": "280px",
|
||||||
type: "box",
|
"justifyContent": "center",
|
||||||
layout: "vertical",
|
"alignItems": "center"
|
||||||
contents: [
|
}
|
||||||
{
|
}
|
||||||
type: "box",
|
}
|
||||||
layout: "vertical",
|
`;
|
||||||
contents: [
|
return { card };
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.name,
|
|
||||||
size: "lg",
|
|
||||||
color: "#4EA2D9",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "baseline",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.title,
|
|
||||||
color: "#333334",
|
|
||||||
size: "md",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "separator",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
height: "20px",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.company,
|
|
||||||
color: "#4EA2D9",
|
|
||||||
size: "md",
|
|
||||||
weight: "bold",
|
|
||||||
align: "end",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
margin: "xs",
|
|
||||||
},
|
|
||||||
vcardAddr,
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "horizontal",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.tel,
|
|
||||||
align: "end",
|
|
||||||
size: "sm",
|
|
||||||
color: "#333334",
|
|
||||||
weight: "bold",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.phone,
|
|
||||||
size: "sm",
|
|
||||||
align: "end",
|
|
||||||
weight: "bold",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
vcardLink,
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "baseline",
|
|
||||||
contents: [vcardEmail],
|
|
||||||
spacing: "lg",
|
|
||||||
margin: "xs",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "30%",
|
|
||||||
offsetStart: "35%",
|
|
||||||
offsetEnd: "5%",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
paddingAll: "0px",
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: vcard.nfcurl + "&cardid=1",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
return { card: JSON.stringify(card) };
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export { genCard };
|
export { genCard };
|
||||||
|
|||||||
Loading…
Reference in new issue