wayne
/
utel_h5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增&修改會員中心-發送名片的版型，修改json資料轉換之對應程式，修正廣告頁面前後關係(z-index往前)

Browse Source
dev
bruce68410 3 years ago
parent 3e2fcfafeb
commit 1750234318
7 changed files with 1869 additions and 15008 deletions
Show Stats Download Patch File Download Diff File

15486
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

18
public/js/flex2html.min.js vendored
Unescape View File

@ -458,22 +458,30 @@ function button_object(json) {
switch (style) { switch (style) {
case "link": case "link":
ExBtn = "ExBtnL"; ExBtn = "ExBtnL";
if (color) {
style3 += `color:${color} !important;`;
}
break; break;
case "primary": case "primary":
ExBtn = "ExBtn1"; ExBtn = "ExBtn1";
if (color) {
style3 += `background-color:${color} !important;color:#ffffff !important;`;
}
break; break;
case "secondary": case "secondary":
ExBtn = "ExBtn2"; ExBtn = "ExBtn2";
if (color) {
style3 += `background-color:${color} !important;`;
}
break; break;
default: default:
ExBtn = "ExBtnL"; ExBtn = "ExBtnL";
// code block
}
}
if (color) { if (color) {
style3 += `color:${color} !important;`; style3 += `color:${color} !important;`;
} }
// code block
}
}
if ( if (
offsetTop && offsetTop &&
@ -907,7 +915,7 @@ function text_object(json) {
style2 += `margin-top:${margin};`; style2 += `margin-top:${margin};`;
exmgn = ""; exmgn = "";
} else { } else {
exmgn = margin ? "ExMgnL" + upperalldigit(margin) : ""; exmgn = margin ? "ExMgnT" + upperalldigit(margin) : "";
} }
alg = alg =

2
src/utils/card/card0.js
Unescape View File

@ -153,7 +153,7 @@ function genCard(vcard) {
} }
} }
], ],
"spacing": "lg", "spacing": "md",
"margin": "sm" "margin": "sm"
}, },
`; `;

646
src/utils/card/card1.js
Unescape View File

@ -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),
size: "sm",
},
{ {
type: "text", "type": "icon",
text: "url": "https://369cycle.zltest.com.tw/tggo/template/icon/map.png",
vcard.address.substr(3).length > 0 ? vcard.address.substr(3) : " ", "size": "sm",
size: "sm", "offsetTop": "xs",
wrap: true, "offsetEnd": "md"
maxLines: 2,
}, },
], {
position: "absolute", "type": "text",
offsetTop: "30%", "text": "${vcard.address}",
offsetStart: "25%", "color": "#6c6664",
width: "40%", "size": "md",
height: "60px", "action": {
action: { "type": "uri",
type: "uri", "label": "action",
label: "action", "uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
vcard.address vcard.address
)}`, )}"
},
};
} else {
vcardAddr = {
type: "box",
layout: "vertical",
contents: [
{
type: "text",
text: " ",
size: "sm",
}, },
"wrap": true
}
], ],
position: "absolute", "margin": "md",
offsetTop: "30%", "paddingStart": "lg"
offsetStart: "25%",
width: "40%",
height: "60px",
};
} }
`;
if (vcard.title.trim().length == 0) { } else {
vcard.title = " "; vcardAddr = "";
} }
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": [
} else { {
vcardTel = { "type": "icon",
type: "text", "url": "https://369cycle.zltest.com.tw/tggo/template/icon/phone.png",
text: vcard.tel, "size": "sm",
align: "end", "offsetTop": "xs",
action: { "offsetEnd": "md"
type: "uri",
label: "action",
uri: "tel:" + vcard.tel,
}, },
}; {
"type": "text",
"text": "${vcard.tel}",
"color": "#6c6664",
"size": "md",
"action": {
"type": "uri",
"label": "action",
"uri": "tel:${vcard.tel}"
}
}
],
"margin": "md",
"paddingStart": "lg"
},
`;
} else {
vcardTel = "";
} }
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": [
} else { {
vcardPhone = { "type": "text",
type: "text", "text": "${vcard.phone}",
text: vcard.phone, "size": "xxl",
align: "end", "color": "#93476e",
action: { "action": {
type: "uri", "type": "uri",
label: "action", "label": "action",
uri: "tel:" + vcard.phone, "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": {
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"
},
{
"type": "text",
"text": "${vcard.email}",
"color": "#6c6664",
"size": "md",
"action": {
"type": "uri",
"label": "action",
"uri": "mailto:${vcard.email}"
}
}
],
"margin": "md",
"paddingStart": "lg"
}, },
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",
size: "giga",
body: {
type: "box",
layout: "vertical",
contents: [
{
type: "image",
url: process.env.VUE_APP_BASE_URL+"/images/tpl02_bg.png",
size: "full",
aspectMode: "cover",
aspectRatio: "4:3",
gravity: "top",
},
{ {
type: "box", "altText": "UTel電子名片",
layout: "vertical", "type": "flex",
contents: [vcardAvatar], "contents":
position: "absolute", {
offsetTop: "13%", "type": "bubble",
offsetStart: "3%", "size": "giga",
width: "75px", "body": {
height: "75px", "type": "box",
cornerRadius: "100px", "layout": "vertical",
}, "contents": [
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [],
{ "height": "45%"
type: "text",
text: "加入好友",
align: "center",
color: "#ffffff",
weight: "bold",
margin: "xs",
size: "xs",
}, },
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "image",
"size": "full",
"position": "relative",
"url": "https://369cycle.zltest.com.tw/tggo/template/bg-03h.png"
}
], ],
backgroundColor: "#ffcc5b", "height": "55%"
width: "100%", }
cornerRadius: "5px", ],
action: { "height": "100%",
type: "uri", "position": "absolute",
label: "action", "width": "100%"
uri: "https://line.naver.jp/ti/p/~" + vcard.line,
},
paddingTop: "5px",
paddingBottom: "5px",
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "text", "type": "text",
text: "分享名片", "text": "Company",
align: "center", "size": "3xl",
color: "#ffffff", "weight": "bold",
weight: "bold", "offsetBottom": "md",
margin: "xs", "color": "#c6b0c9"
size: "xs",
}, },
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "text",
"text": "${vcard.company}",
"color": "#ffffff",
"size": "md"
}
], ],
backgroundColor: "#ffcc5b", "backgroundColor": "#6c6d8b",
width: "100%", "paddingTop": "sm",
cornerRadius: "5px", "paddingBottom": "sm",
margin: "md", "paddingStart": "lg",
paddingTop: "5px", "cornerRadius": "xxl",
paddingBottom: "5px", "paddingEnd": "lg",
}, "offsetBottom": "xl"
}
], ],
position: "absolute", "cornerRadius": "15px",
offsetStart: "10%", "paddingStart": "10px",
width: "20%", "paddingEnd": "10px",
offsetBottom: "16%", "alignItems": "flex-end",
action: { "offsetEnd": "none",
type: "uri", "position": "absolute",
label: "action", "offsetTop": "none"
uri: `${process.env.VUE_APP_SEND_URL}/?userid=${vcard.user_id}&cardid=1`,
}, },
{
"type": "box",
"layout": "horizontal",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [
{
"type": "box",
"layout": "vertical",
"contents": [${vcardAvatar}],
"cornerRadius": "10px",
"margin": "none",
"width": "100%"
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "justifyContent": "space-between",
"contents": [
{ {
type: "text", "type": "button",
text: vcard.name, "action": {
"type": "uri",
"label": "加入好友",
"uri": "http://linecorp.com/"
}, },
], "color": "#755483",
position: "absolute", "height": "sm",
offsetTop: "13%", "style": "primary",
offsetStart: "25%", "margin": "md"
width: "90px",
}, },
{ {
type: "box", "type": "button",
layout: "vertical", "action": {
contents: [ "type": "uri",
"label": "分享名片",
"uri": "http://linecorp.com/"
},
"color": "#93476e",
"height": "sm",
"style": "primary",
"margin": "md"
},
{ {
type: "text", "type": "button",
text: vcard.title, "action": {
"type": "uri",
"label": "其他連結",
"uri": "http://linecorp.com/"
}, },
"color": "#c73f6d",
"height": "sm",
"style": "primary",
"margin": "md"
}
], ],
position: "absolute", "margin": "xxl"
offsetTop: "13%", }
offsetStart: "51%", ],
width: "50%", "paddingTop": "5%",
}, "paddingBottom": "8%",
vcardAddr, "justifyContent": "flex-start",
{ "width": "30%",
type: "box", "alignItems": "center",
layout: "vertical", "height": "95%"
contents: [vcardPhone, vcardTel],
position: "absolute",
offsetTop: "30%",
offsetEnd: "5%",
width: "30%",
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "text", "type": "box",
text: vcard.company, "layout": "horizontal",
size: "lg", "contents": [
color: "#EFEFEF", {
align: "end", "type": "box",
weight: "bold", "layout": "vertical",
}, "contents": [
vcardLink, {
], "type": "text",
position: "absolute", "text": "${vcard.name}",
offsetTop: "65%", "size": "xxl",
offsetEnd: "5%", "weight": "bold"
width: "60%", }
]
}, },
{
"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"
}
}
]
}
], ],
paddingAll: "0px", "alignItems": "center"
action: {
type: "uri",
label: "action",
uri: vcard.nfcurl + "&cardid=1",
}, },
{
"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",
return { card: JSON.stringify(card) }; "alignItems": "center",
"height": "420px"
}
}
}
`;
return { card };
} }
export { genCard }; export { genCard };

558
src/utils/card/card2.js
Unescape View File

@ -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",
contents: [
{ {
type: "text", "type": "text",
text: vcard.url, "text": "${vcard.url}",
color: "#333334", "color": "#6c6664",
size: "sm", "size": "md",
action: { "action": {
type: "uri", "type": "uri",
label: "action", "label": "yahoo",
uri: vcard.url, "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",
contents: [
{ {
type: "text", "type": "text",
text: vcard.address, "text": "${vcard.address}",
weight: "bold", "color": "#6c6664",
color: "#333334", "size": "md",
size: "sm", "action": {
align: "end", "type": "uri",
action: { "label": "action",
type: "uri", "uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
label: "action",
uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
vcard.address vcard.address
)}`, )}"
}, },
wrap: true, "wrap": true,
}, "align": "end"
], }
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) { 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",
size: "giga",
body: {
type: "box",
layout: "vertical",
contents: [
{ {
type: "image", "altText": "UTel電子名片",
url: process.env.VUE_APP_BASE_URL+"/images/jcibg.png", "type": "flex",
size: "full", "contents":
aspectMode: "fit",
aspectRatio: "4:3",
gravity: "top",
},
{ {
type: "box", "type": "bubble",
layout: "vertical", "size": "giga",
contents: [ "body": {
vcardAvatar, "type": "box",
"layout": "vertical",
"contents": [
{ {
type: "text", "type": "image",
text: "大同國際\n青年商會", "url": "https://369cycle.zltest.com.tw/tggo/template/bg-02.png",
wrap: true, "size": "full",
align: "center", "position": "absolute",
margin: "md", "aspectMode": "cover"
},
],
position: "absolute",
offsetTop: "13%",
offsetStart: "2%",
width: "21%",
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "horizontal",
contents: [ "contents": [
{ {
type: "text", "type": "box",
text: "加入好友", "layout": "vertical",
align: "center", "contents": [
color: "#ffffff",
weight: "bold",
margin: "xs",
},
],
backgroundColor: "#06c755",
width: "100%",
cornerRadius: "5px",
action: {
type: "uri",
label: "action",
uri: "https://line.naver.jp/ti/p/~" + vcard.line,
},
},
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "text", "type": "text",
text: "分享名片", "text": "${vcard.name}",
align: "center", "size": "xl",
color: "#ffffff", "weight": "bold",
weight: "bold", "color": "#ffffff",
margin: "xs", "margin": "sm"
}, }
],
backgroundColor: "#ffcc5b",
width: "100%",
cornerRadius: "5px",
margin: "md",
},
], ],
position: "absolute", "backgroundColor": "#bf4c32",
offsetStart: "2%", "paddingStart": "10px",
width: "20%", "paddingEnd": "5px"
offsetBottom: "8%",
action: {
type: "uri",
label: "action",
uri: `${process.env.VUE_APP_SEND_URL}/?userid=${vcard.user_id}&cardid=1`,
},
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "box", "type": "text",
layout: "vertical", "text": "${vcard.title}",
contents: [ "size": "md",
{ "weight": "regular",
type: "text", "color": "#ffffff",
text: vcard.name, "action": {
size: "lg", "type": "uri",
color: "#4EA2D9", "label": "action",
weight: "bold", "uri": "${vcard.nfcurl}&cardid=1"
align: "end", }
}, }
], ],
"backgroundColor": "#e5b164",
"paddingStart": "xxl",
"paddingEnd": "5px",
"offsetEnd": "5px",
"margin": "sm",
"paddingBottom": "xs",
"paddingTop": "2px"
}, },
{ {
type: "box", "type": "box",
layout: "baseline", "layout": "vertical",
contents: [ "contents": [${vcardPhone}],
{ "backgroundColor": "#7aa567",
type: "text", "margin": "xs",
text: vcard.title, "paddingStart": "5px",
color: "#333334", "paddingEnd": "5px"
size: "md", }
weight: "bold",
align: "end",
},
], ],
spacing: "lg", "alignItems": "flex-end",
"width": "50%",
"paddingEnd": "xl"
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [${vcardAvatar}],
{ "cornerRadius": "150px",
type: "separator", "borderWidth": "bold",
}, "borderColor": "#ffffff",
"margin": "none",
"width": "30%"
}
], ],
height: "20px", "alignItems": "center",
"paddingTop": "3%",
"justifyContent": "center"
}, },
{ {
type: "box", "type": "box",
layout: "vertical", "layout": "vertical",
contents: [ "contents": [
{ {
type: "text", "type": "box",
text: vcard.company, "layout": "horizontal",
color: "#4EA2D9", "contents": [
size: "md", {
weight: "bold", "type": "box",
align: "end", "layout": "vertical",
}, "contents": [
${vcardTel}
${vcardLink}
${vcardEmail}
${vcardAddr}
], ],
spacing: "lg", "alignItems": "flex-end",
margin: "xs", "paddingEnd": "xl"
}, },
vcardAddr,
{ {
type: "box", "type": "box",
layout: "horizontal", "layout": "vertical",
contents: [ "justifyContent": "space-between",
"contents": [
{ {
type: "text", "type": "button",
text: vcard.tel, "action": {
align: "end", "type": "uri",
size: "sm", "label": "加入好友",
color: "#333334", "uri": "http://linecorp.com/"
weight: "bold",
}, },
{ "color": "#6c6664",
type: "text", "height": "sm",
text: vcard.phone, "style": "primary"
size: "sm",
align: "end",
weight: "bold",
}, },
{
"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"
}, },
vcardLink,
{ {
type: "box", "type": "box",
layout: "baseline", "layout": "vertical",
contents: [vcardEmail], "contents": [
spacing: "lg", {
margin: "xs", "type": "text",
}, "text": "匯康科技",
"color": "#e5b164",
"size": "md"
}
], ],
position: "absolute", "position": "absolute",
offsetTop: "30%", "offsetTop": "sm",
offsetStart: "35%", "offsetStart": "sm",
offsetEnd: "5%", "backgroundColor": "#ffffff",
}, "cornerRadius": "15px",
"paddingStart": "10px",
"paddingEnd": "10px"
}
], ],
paddingAll: "0px", "paddingAll": "0px",
action: { "action": {
type: "uri", "type": "uri",
label: "action", "label": "action",
uri: vcard.nfcurl + "&cardid=1", "uri": "https://utel.zltest.com.tw/card/?params=i7Kq7O59hPX1MJ%2Bqd8zQKBwuyc%2F%2BZ%2BZs%2BZXtXBy4zvg%3D&cardid=1"
}, },
}, "height": "280px",
}, "justifyContent": "center",
}; "alignItems": "center"
return { card: JSON.stringify(card) }; }
}
}
`;
return { card };
} }
export { genCard }; export { genCard };

13
src/utils/card/card3.js
Unescape View File

@ -57,6 +57,7 @@ function genCard(vcard) {
"text": "${vcard.address}", "text": "${vcard.address}",
"color": "#ffffff", "color": "#ffffff",
"size": "sm", "size": "sm",
"margin": "sm",
"wrap": true, "wrap": true,
"action": { "action": {
"type": "uri", "type": "uri",
@ -120,10 +121,11 @@ function genCard(vcard) {
"text": "${vcard.email}", "text": "${vcard.email}",
"color": "#ffffff", "color": "#ffffff",
"size": "sm", "size": "sm",
"margin": "sm",
"action": { "action": {
"type": "uri", "type": "uri",
"label": "action", "label": "action",
"data": "mailto:${vcard.email}" "uri": "mailto:${vcard.email}"
} }
}, },
`; `;
@ -182,7 +184,7 @@ function genCard(vcard) {
], ],
"alignItems": "center", "alignItems": "center",
"paddingTop": "5%", "paddingTop": "5%",
"paddingBottom": "8%", "paddingBottom": "5%",
"width": "35%" "width": "35%"
}, },
{ {
@ -193,6 +195,7 @@ function genCard(vcard) {
"type": "box", "type": "box",
"layout": "vertical", "layout": "vertical",
"contents": [ "contents": [
${vcardTel}
{ {
"type": "text", "type": "text",
"text": "${vcard.company}", "text": "${vcard.company}",
@ -206,7 +209,6 @@ function genCard(vcard) {
"type": "box", "type": "box",
"layout": "vertical", "layout": "vertical",
"contents": [ "contents": [
${vcardTel}
${vcardLink} ${vcardLink}
${vcardEmail} ${vcardEmail}
${vcardAddr} ${vcardAddr}
@ -249,7 +251,8 @@ function genCard(vcard) {
"uri": "http://linecorp.com/" "uri": "http://linecorp.com/"
}, },
"color": "#dddddd", "color": "#dddddd",
"height": "sm" "height": "sm",
"style": "link"
} }
], ],
"cornerRadius": "lg", "cornerRadius": "lg",
@ -295,7 +298,7 @@ function genCard(vcard) {
"label": "action", "label": "action",
"uri": "https://utel.zltest.com.tw/card/?params=i7Kq7O59hPX1MJ%2Bqd8zQKBwuyc%2F%2BZ%2BZs%2BZXtXBy4zvg%3D&cardid=1" "uri": "https://utel.zltest.com.tw/card/?params=i7Kq7O59hPX1MJ%2Bqd8zQKBwuyc%2F%2BZ%2BZs%2BZXtXBy4zvg%3D&cardid=1"
}, },
"height": "250px" "height": "270px"
} }
} }
} }

2
src/views/Home/index.vue
Unescape View File

@ -336,7 +336,7 @@ const handleLogout = () => {
<qrcode-vue :value="userInfo.nfcurl" :size="200" level="M" /> <qrcode-vue :value="userInfo.nfcurl" :size="200" level="M" />
</div> </div>
</van-dialog> </van-dialog>
<van-overlay :show="popShow" z-index="100" :style="{background:'rgba(0, 0, 0, .85)'}"> <van-overlay :show="popShow" z-index="1000" :style="{background:'rgba(0, 0, 0, .85)'}">
<div class="wrapper" @click.stop> <div class="wrapper" @click.stop>
<div class="block"> <div class="block">
<span class="van-icon van-icon-cross" @click="popShow = false" v-show="current.seconds == 0"></span> <span class="van-icon van-icon-cross" @click="popShow = false" v-show="current.seconds == 0"></span>

Write Preview
Loading…
Cancel
Save