diff --git a/package-lock.json b/package-lock.json
index 273812b..28701cb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -521,6 +521,7 @@
"version": "7.18.6",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-class-properties/-/plugin-proposal-class-properties-7.18.6.tgz",
"integrity": "sha512-cumfXOF0+nzZrrN8Rf0t7M+tF6sZc7vhQwYQck9q1/5w2OExlD+b4v4RpMJFaV1Z7WcDRgO6FqvxqxGlwo+RHQ==",
+ "deprecated": "This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.",
"dev": true,
"dependencies": {
"@babel/helper-create-class-features-plugin": "^7.18.6",
@@ -568,6 +569,7 @@
"version": "7.18.6",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-unicode-property-regex/-/plugin-proposal-unicode-property-regex-7.18.6.tgz",
"integrity": "sha512-2BShG/d5yoZyXZfVePH91urL5wTG6ASZU9M4o03lKK8u8UW1y08OMttBSOADTcJrnPMpvDXRG3G8fyLh4ovs8w==",
+ "deprecated": "This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-unicode-property-regex instead.",
"dev": true,
"dependencies": {
"@babel/helper-create-regexp-features-plugin": "^7.18.6",
@@ -8041,9 +8043,9 @@
"dev": true
},
"node_modules/fsevents": {
- "version": "2.3.2",
- "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
- "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "version": "2.3.3",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+ "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
"dev": true,
"hasInstallScript": true,
"optional": true,
@@ -10551,9 +10553,9 @@
}
},
"node_modules/nan": {
- "version": "2.17.0",
- "resolved": "https://registry.npmjs.org/nan/-/nan-2.17.0.tgz",
- "integrity": "sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ==",
+ "version": "2.18.0",
+ "resolved": "https://registry.npmjs.org/nan/-/nan-2.18.0.tgz",
+ "integrity": "sha512-W7tfG7vMOGtD30sHoZSSc/JVYiyDPEyQVso/Zz+/uQd0B0L46gtC+pHha5FFMRpil6fm/AoEcRWyOVi4+E/f8w==",
"dev": true,
"optional": true
},
@@ -23048,9 +23050,9 @@
"dev": true
},
"fsevents": {
- "version": "2.3.2",
- "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
- "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+ "version": "2.3.3",
+ "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+ "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
"dev": true,
"optional": true
},
@@ -24985,9 +24987,9 @@
}
},
"nan": {
- "version": "2.17.0",
- "resolved": "https://registry.npmjs.org/nan/-/nan-2.17.0.tgz",
- "integrity": "sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ==",
+ "version": "2.18.0",
+ "resolved": "https://registry.npmjs.org/nan/-/nan-2.18.0.tgz",
+ "integrity": "sha512-W7tfG7vMOGtD30sHoZSSc/JVYiyDPEyQVso/Zz+/uQd0B0L46gtC+pHha5FFMRpil6fm/AoEcRWyOVi4+E/f8w==",
"dev": true,
"optional": true
},
diff --git a/public/js/flex2html.min.js b/public/js/flex2html.min.js
index 5b2320f..a9462da 100644
--- a/public/js/flex2html.min.js
+++ b/public/js/flex2html.min.js
@@ -472,7 +472,7 @@ function button_object(json) {
}
if (color) {
- style3 += `background-color:${color} !important;`;
+ style3 += `color:${color} !important;`;
}
if (
diff --git a/src/assets/images/tpl/tpl1.png b/src/assets/images/tpl/tpl1.png
index 5fe0bb1..626c0f2 100644
Binary files a/src/assets/images/tpl/tpl1.png and b/src/assets/images/tpl/tpl1.png differ
diff --git a/src/assets/images/tpl/tpl2.png b/src/assets/images/tpl/tpl2.png
index 2acbd9e..7c1958b 100644
Binary files a/src/assets/images/tpl/tpl2.png and b/src/assets/images/tpl/tpl2.png differ
diff --git a/src/assets/images/tpl/tpl3.png b/src/assets/images/tpl/tpl3.png
index 0c2976a..19cc566 100644
Binary files a/src/assets/images/tpl/tpl3.png and b/src/assets/images/tpl/tpl3.png differ
diff --git a/src/utils/card/card0.js b/src/utils/card/card0.js
index ba82b5e..9ff3283 100644
--- a/src/utils/card/card0.js
+++ b/src/utils/card/card0.js
@@ -230,10 +230,10 @@ function genCard(vcard) {
"contents": [
{
"type": "image",
- "url": "https://369cycle.zltest.com.tw/tggo/template/utel_card-01.png",
+ "url": "https://demo.zltest.com.tw/line/bg02.jpg",
"size": "full",
"aspectMode": "cover",
- "aspectRatio": "10:7",
+ "aspectRatio": "4:3",
"gravity": "top",
"action": {
"type": "uri",
@@ -265,7 +265,7 @@ function genCard(vcard) {
"position": "absolute",
"offsetTop": "13%",
"offsetStart": "3%",
- "width": "36%"
+ "width": "26%"
},
{
"type": "box",
@@ -322,9 +322,9 @@ function genCard(vcard) {
}
],
"position": "absolute",
- "offsetStart": "5%",
- "width": "22%",
- "offsetBottom": "25%"
+ "offsetStart": "4%",
+ "width": "25%",
+ "offsetBottom": "5%"
},
{
"type": "box",
@@ -366,8 +366,8 @@ function genCard(vcard) {
"type": "box",
"layout": "baseline",
"contents": [],
- "backgroundColor": "#e3c2d6",
- "height": "2px",
+ "backgroundColor": "#d5602d",
+ "height": "3px",
"margin": "lg"
},
${vcardPhone}
@@ -384,9 +384,9 @@ function genCard(vcard) {
}
],
"position": "absolute",
- "offsetTop": "18%",
- "offsetStart": "30%",
- "offsetEnd": "0%"
+ "offsetTop": "12%",
+ "offsetStart": "35%",
+ "offsetEnd": "5%"
}
],
"paddingAll": "0px"
diff --git a/src/utils/card/card3.js b/src/utils/card/card3.js
index 64390ac..29ae201 100644
--- a/src/utils/card/card3.js
+++ b/src/utils/card/card3.js
@@ -1,348 +1,306 @@
function genCard(vcard) {
+ // 名片預覽
let vcardLink;
if (vcard.url.trim().length > 0) {
if (vcard.nc_func.indexOf("nourl") !== -1) {
- vcardLink = {
- type: "box",
- layout: "baseline",
- contents: [
- {
- type: "text",
- text: vcard.url,
- color: "#333334",
- size: "sm",
- weight: "bold",
- align: "end",
- },
- ],
- spacing: "lg",
- margin: "xs",
- };
+ vcardLink = `{
+ "type": "text",
+ "text": "${vcard.url}",
+ "color": "#ffffff",
+ "size": "sm"
+ },
+ `;
} else {
- vcardLink = {
- type: "box",
- layout: "baseline",
- contents: [
- {
- type: "text",
- text: vcard.url,
- color: "#333334",
- size: "sm",
- action: {
- type: "uri",
- label: "action",
- uri: vcard.url,
- },
- weight: "bold",
- align: "end",
- },
- ],
- spacing: "lg",
- margin: "xs",
- };
+ vcardLink = `
+ {
+ "type": "text",
+ "text": "${vcard.url}",
+ "color": "#ffffff",
+ "size": "sm",
+ "action": {
+ "type": "uri",
+ "label": "action",
+ "uri": "${vcard.url}"
+ }
+ },
+ `;
}
} else {
- vcardLink = {
- type: "box",
- layout: "baseline",
- contents: [
- {
- type: "text",
- text: " ",
- color: "#333334",
- size: "sm",
- weight: "bold",
- align: "end",
- },
- ],
- spacing: "lg",
- margin: "xs",
- };
+ vcardLink = "";
+ }
+
+ let vcardAvatar;
+ 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 {
+ vcardAvatar = "";
}
let vcardAddr;
if (vcard.address.trim().length > 0) {
- vcardAddr = {
- type: "box",
- layout: "vertical",
- contents: [
- {
- type: "text",
- text: vcard.address,
- weight: "bold",
- color: "#333334",
- size: "sm",
- align: "end",
- action: {
- type: "uri",
- label: "action",
- uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
+ vcardAddr = `
+ {
+ "type": "text",
+ "text": "${vcard.address}",
+ "color": "#ffffff",
+ "size": "sm",
+ "wrap": true,
+ "action": {
+ "type": "uri",
+ "label": "action",
+ "uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
vcard.address
- )}`,
- },
- wrap: true,
- },
- ],
- spacing: "lg",
- margin: "xs",
- };
+ )}"
+ }
+ },
+ `;
} else {
- vcardAddr = {
- type: "box",
- layout: "vertical",
- contents: [
- {
- type: "text",
- text: " ",
- weight: "bold",
- color: "#333334",
- size: "sm",
- align: "end",
- wrap: true,
- },
- ],
- spacing: "lg",
- margin: "xs",
- };
+ vcardAddr = "";
}
- if (vcard.title.trim().length == 0) {
- vcard.title = " ";
- }
-
- if (vcard.tel.trim().length == 0) {
- vcard.tel = " ";
+ let vcardTel;
+ 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;
-
- if (vcard.phone.trim().length == 0) {
- vcard.phone = " ";
- }
-
- let vcardAvatar;
- if (vcard.avatar.trim().length > 0) {
- vcardAvatar = {
- type: "image",
- url: vcard.avatar,
- action: {
- type: "uri",
- label: "action",
- uri: vcard.nfcurl + "&cardid=1",
- },
- };
+ if (vcard.phone.trim().length > 0) {
+ vcardPhone = `
+ {
+ "type": "text",
+ "text": "${vcard.phone}",
+ "size": "lg",
+ "margin": "sm",
+ "action": {
+ "type": "uri",
+ "label": "action",
+ "uri": "tel:${vcard.phone}"
+ }
+ }
+ `;
} else {
- vcardAvatar = {
- type: "text",
- text: " ",
- size: "xs",
- };
+ vcardPhone = "";
}
let vcardEmail;
-
if (vcard.email.trim().length > 0) {
- vcardEmail = {
- type: "text",
- text: vcard.email,
- color: "#333334",
- size: "sm",
- weight: "bold",
- action: {
- type: "uri",
- label: "action",
- uri: `mailto:${vcard.email}`,
- },
- align: "end",
- };
+ vcardEmail = `
+ {
+ "type": "text",
+ "text": "${vcard.email}",
+ "color": "#ffffff",
+ "size": "sm",
+ "action": {
+ "type": "uri",
+ "label": "action",
+ "data": "mailto:${vcard.email}"
+ }
+ },
+ `;
} else {
- vcardEmail = {
- type: "text",
- text: " ",
- color: "#333334",
- size: "sm",
- weight: "bold",
- align: "end",
- };
+ vcardEmail = "";
}
- let card = {
- altText: "UTel電子名片",
- type: "flex",
- contents: {
- type: "bubble",
- size: "giga",
- body: {
- type: "box",
- layout: "vertical",
- contents: [
- {
- type: "image",
- size: "full",
- aspectMode: "cover",
- aspectRatio: "4:3",
- gravity: "top",
- url: process.env.VUE_APP_BASE_URL+"/images/tpl03_bg.png?v=1",
- },
- {
- type: "box",
- layout: "vertical",
- contents: [
- {
- type: "text",
- text: vcard.company || " ",
- size: "xl",
- wrap: true,
- },
- ],
- 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",
+ // 名片發送
+
+ let card = `
+ {
+ "altText": "UTel電子名片",
+ "type": "flex",
+ "contents":
+ {
+ "type": "bubble",
+ "size": "giga",
+ "body": {
+ "type": "box",
+ "layout": "horizontal",
+ "contents": [
+ {
+ "type": "box",
+ "layout": "vertical",
+ "contents": [
+ {
+ "type": "box",
+ "layout": "vertical",
+ "contents": [${vcardAvatar}],
+ "cornerRadius": "150px",
+ "width": "60%",
+ "borderWidth": "bold",
+ "borderColor": "#f5c520",
+ "margin": "none"
},
- },
- {
- type: "box",
- layout: "vertical",
- contents: [
- {
- 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",
+ "text": "${vcard.name}",
+ "size": "xl",
+ "weight": "bold",
+ "margin": "md"
},
- },
- {
- type: "box",
- layout: "vertical",
- contents: [
- {
- type: "image",
- url: "https://utel.u168.vip/images/icons/email.png",
- align: "center",
- size: "xxs",
- },
- {
- type: "text",
- text: vcard.email,
- align: "center",
- color: "#FFFFFF",
- },
- ],
- flex: 1,
- action: {
- type: "uri",
- label: "action",
- uri: "mailto:" + vcard.email,
+ {
+ "type": "text",
+ "text": "${vcard.title}",
+ "size": "md",
+ "weight": "regular",
+ "color": "#666666",
+ "action": {
+ "type": "uri",
+ "label": "action",
+ "uri": "${vcard.nfcurl}&cardid=1"
+ }
+ },
+ ${vcardPhone}
+ ],
+ "alignItems": "center",
+ "paddingTop": "5%",
+ "paddingBottom": "8%",
+ "width": "35%"
+ },
+ {
+ "type": "box",
+ "layout": "vertical",
+ "contents": [
+ {
+ "type": "box",
+ "layout": "vertical",
+ "contents": [
+ {
+ "type": "text",
+ "text": "${vcard.company}",
+ "color": "#ffffff",
+ "size": "xl",
+ "weight": "bold"
+ }
+ ]
},
- },
- ],
- position: "absolute",
- width: "100%",
- offsetBottom: "5%",
+ {
+ "type": "box",
+ "layout": "vertical",
+ "contents": [
+ ${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"
},
- ],
- paddingAll: "0px",
- action: {
- type: "uri",
- label: "action",
- uri: vcard.nfcurl + "&cardid=1",
- },
- },
- },
- };
- console.log(JSON.stringify(card));
- return { card: JSON.stringify(card) };
+ "height": "250px"
+ }
+ }
+ }
+ `;
+ return { card };
}
export { genCard };
diff --git a/src/utils/card1.js b/src/utils/card1.js
index 37c6ca4..667e317 100644
--- a/src/utils/card1.js
+++ b/src/utils/card1.js
@@ -1,5 +1,6 @@
function genCard(vcard) {
// 名片預覽
+ console.log('test')
let vcardLink;
if (vcard.url.trim().length > 0) {
if (vcard.nc_func.indexOf("nourl") !== -1) {
diff --git a/src/views/Send/index.vue b/src/views/Send/index.vue
index 1b304eb..7760950 100644
--- a/src/views/Send/index.vue
+++ b/src/views/Send/index.vue
@@ -26,7 +26,7 @@
切換樣版
-
+
+ 
+ 