DESKTOP-8UQ1PPR\09158
3 years ago
parent
ad56c70b7c
commit
3e2fcfafeb
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 51 KiB |
|
Before Width: | Height: | Size: 63 KiB After Width: | Height: | Size: 86 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 51 KiB |
@ -1,348 +1,306 @@
|
|||||||
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": "#ffffff",
|
||||||
{
|
"size": "sm"
|
||||||
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": "#ffffff",
|
||||||
type: "text",
|
"size": "sm",
|
||||||
text: vcard.url,
|
"action": {
|
||||||
color: "#333334",
|
"type": "uri",
|
||||||
size: "sm",
|
"label": "action",
|
||||||
action: {
|
"uri": "${vcard.url}"
|
||||||
type: "uri",
|
}
|
||||||
label: "action",
|
},
|
||||||
uri: vcard.url,
|
`;
|
||||||
},
|
}
|
||||||
weight: "bold",
|
} else {
|
||||||
align: "end",
|
vcardLink = "";
|
||||||
},
|
}
|
||||||
],
|
|
||||||
spacing: "lg",
|
let vcardAvatar;
|
||||||
margin: "xs",
|
if (vcard.avatar.trim().length > 0) {
|
||||||
};
|
vcardAvatar = `
|
||||||
|
{
|
||||||
|
"type": "image",
|
||||||
|
"url": "${vcard.avatar}",
|
||||||
|
"size": "full",
|
||||||
|
"aspectRatio": "1:1",
|
||||||
|
"aspectMode": "cover",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}&cardid=1"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
`;
|
||||||
} else {
|
} else {
|
||||||
vcardLink = {
|
vcardAvatar = "";
|
||||||
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": "#ffffff",
|
||||||
type: "text",
|
"size": "sm",
|
||||||
text: vcard.address,
|
"wrap": true,
|
||||||
weight: "bold",
|
"action": {
|
||||||
color: "#333334",
|
"type": "uri",
|
||||||
size: "sm",
|
"label": "action",
|
||||||
align: "end",
|
"uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
|
|
||||||
vcard.address
|
vcard.address
|
||||||
)}`,
|
)}"
|
||||||
},
|
}
|
||||||
wrap: true,
|
},
|
||||||
},
|
`;
|
||||||
],
|
|
||||||
spacing: "lg",
|
|
||||||
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) {
|
|
||||||
vcard.title = " ";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (vcard.tel.trim().length == 0) {
|
let vcardTel;
|
||||||
vcard.tel = " ";
|
if (vcard.tel.trim().length > 0) {
|
||||||
|
vcardTel = `
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.tel}",
|
||||||
|
"color": "#ffffff",
|
||||||
|
"size": "sm",
|
||||||
|
"wrap": true,
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
|
||||||
|
vcard.address
|
||||||
|
)}"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardTel = "";
|
||||||
}
|
}
|
||||||
|
|
||||||
let vcardPhone;
|
let vcardPhone;
|
||||||
|
if (vcard.phone.trim().length > 0) {
|
||||||
if (vcard.phone.trim().length == 0) {
|
vcardPhone = `
|
||||||
vcard.phone = " ";
|
{
|
||||||
}
|
"type": "text",
|
||||||
|
"text": "${vcard.phone}",
|
||||||
let vcardAvatar;
|
"size": "lg",
|
||||||
if (vcard.avatar.trim().length > 0) {
|
"margin": "sm",
|
||||||
vcardAvatar = {
|
"action": {
|
||||||
type: "image",
|
"type": "uri",
|
||||||
url: vcard.avatar,
|
"label": "action",
|
||||||
action: {
|
"uri": "tel:${vcard.phone}"
|
||||||
type: "uri",
|
}
|
||||||
label: "action",
|
}
|
||||||
uri: vcard.nfcurl + "&cardid=1",
|
`;
|
||||||
},
|
|
||||||
};
|
|
||||||
} else {
|
} else {
|
||||||
vcardAvatar = {
|
vcardPhone = "";
|
||||||
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": "#ffffff",
|
||||||
weight: "bold",
|
"size": "sm",
|
||||||
action: {
|
"action": {
|
||||||
type: "uri",
|
"type": "uri",
|
||||||
label: "action",
|
"label": "action",
|
||||||
uri: `mailto:${vcard.email}`,
|
"data": "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",
|
||||||
size: "full",
|
"layout": "horizontal",
|
||||||
aspectMode: "cover",
|
"contents": [
|
||||||
aspectRatio: "4:3",
|
{
|
||||||
gravity: "top",
|
"type": "box",
|
||||||
url: process.env.VUE_APP_BASE_URL+"/images/tpl03_bg.png?v=1",
|
"layout": "vertical",
|
||||||
},
|
"contents": [
|
||||||
{
|
{
|
||||||
type: "box",
|
"type": "box",
|
||||||
layout: "vertical",
|
"layout": "vertical",
|
||||||
contents: [
|
"contents": [${vcardAvatar}],
|
||||||
{
|
"cornerRadius": "150px",
|
||||||
type: "text",
|
"width": "60%",
|
||||||
text: vcard.company || " ",
|
"borderWidth": "bold",
|
||||||
size: "xl",
|
"borderColor": "#f5c520",
|
||||||
wrap: true,
|
"margin": "none"
|
||||||
},
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "5%",
|
|
||||||
offsetStart: "5%",
|
|
||||||
width: "60%",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [vcardAvatar],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "5%",
|
|
||||||
offsetEnd: "5%",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "horizontal",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.name,
|
|
||||||
size: "lg",
|
|
||||||
weight: "bold",
|
|
||||||
align: "center",
|
|
||||||
},
|
|
||||||
// {
|
|
||||||
// type: "text",
|
|
||||||
// text: " ",
|
|
||||||
// size: "lg",
|
|
||||||
// weight: "bold",
|
|
||||||
// color: "#F71646",
|
|
||||||
// },
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetStart: "40%",
|
|
||||||
offsetTop: "45%",
|
|
||||||
width: "20%",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.title || " ",
|
|
||||||
align: "center",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
position: "absolute",
|
|
||||||
offsetTop: "55%",
|
|
||||||
offsetStart: "40%",
|
|
||||||
width: "20%",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "horizontal",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "box",
|
|
||||||
layout: "vertical",
|
|
||||||
contents: [
|
|
||||||
{
|
|
||||||
type: "image",
|
|
||||||
url: "https://utel.u168.vip/images/icons/web.png",
|
|
||||||
align: "center",
|
|
||||||
size: "xxs",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "我的網站",
|
|
||||||
align: "center",
|
|
||||||
color: "#FFFFFF",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
flex: 1,
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri:
|
|
||||||
vcard.url.trim().length > 0
|
|
||||||
? vcard.url
|
|
||||||
: vcard.nfcurl + "&cardid=1",
|
|
||||||
},
|
},
|
||||||
},
|
{
|
||||||
{
|
"type": "text",
|
||||||
type: "box",
|
"text": "${vcard.name}",
|
||||||
layout: "vertical",
|
"size": "xl",
|
||||||
contents: [
|
"weight": "bold",
|
||||||
{
|
"margin": "md"
|
||||||
type: "image",
|
|
||||||
url: "https://utel.u168.vip/images/icons/phone.png",
|
|
||||||
align: "center",
|
|
||||||
size: "xxs",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: vcard.phone,
|
|
||||||
align: "center",
|
|
||||||
color: "#FFFFFF",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
flex: 1,
|
|
||||||
action: {
|
|
||||||
type: "uri",
|
|
||||||
label: "action",
|
|
||||||
uri: "tel:" + vcard.phone,
|
|
||||||
},
|
},
|
||||||
},
|
{
|
||||||
{
|
"type": "text",
|
||||||
type: "box",
|
"text": "${vcard.title}",
|
||||||
layout: "vertical",
|
"size": "md",
|
||||||
contents: [
|
"weight": "regular",
|
||||||
{
|
"color": "#666666",
|
||||||
type: "image",
|
"action": {
|
||||||
url: "https://utel.u168.vip/images/icons/email.png",
|
"type": "uri",
|
||||||
align: "center",
|
"label": "action",
|
||||||
size: "xxs",
|
"uri": "${vcard.nfcurl}&cardid=1"
|
||||||
},
|
}
|
||||||
{
|
},
|
||||||
type: "text",
|
${vcardPhone}
|
||||||
text: vcard.email,
|
],
|
||||||
align: "center",
|
"alignItems": "center",
|
||||||
color: "#FFFFFF",
|
"paddingTop": "5%",
|
||||||
},
|
"paddingBottom": "8%",
|
||||||
],
|
"width": "35%"
|
||||||
flex: 1,
|
},
|
||||||
action: {
|
{
|
||||||
type: "uri",
|
"type": "box",
|
||||||
label: "action",
|
"layout": "vertical",
|
||||||
uri: "mailto:" + vcard.email,
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.company}",
|
||||||
|
"color": "#ffffff",
|
||||||
|
"size": "xl",
|
||||||
|
"weight": "bold"
|
||||||
|
}
|
||||||
|
]
|
||||||
},
|
},
|
||||||
},
|
{
|
||||||
],
|
"type": "box",
|
||||||
position: "absolute",
|
"layout": "vertical",
|
||||||
width: "100%",
|
"contents": [
|
||||||
offsetBottom: "5%",
|
${vcardTel}
|
||||||
|
${vcardLink}
|
||||||
|
${vcardEmail}
|
||||||
|
${vcardAddr}
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "horizontal",
|
||||||
|
"justifyContent": "space-between",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "button",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "加入好友",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#dddddd",
|
||||||
|
"height": "sm",
|
||||||
|
"style": "link"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"borderWidth": "light",
|
||||||
|
"borderColor": "#dddddd",
|
||||||
|
"cornerRadius": "lg",
|
||||||
|
"width": "48%",
|
||||||
|
"height": "36px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "button",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "分享名片",
|
||||||
|
"uri": "http://linecorp.com/"
|
||||||
|
},
|
||||||
|
"color": "#dddddd",
|
||||||
|
"height": "sm"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"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%"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "image",
|
||||||
|
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-01.png",
|
||||||
|
"size": "full"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"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": "250px"
|
||||||
paddingAll: "0px",
|
}
|
||||||
action: {
|
}
|
||||||
type: "uri",
|
}
|
||||||
label: "action",
|
`;
|
||||||
uri: vcard.nfcurl + "&cardid=1",
|
return { card };
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
console.log(JSON.stringify(card));
|
|
||||||
return { card: JSON.stringify(card) };
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export { genCard };
|
export { genCard };
|
||||||
|
|||||||
Loading…
Reference in new issue