@ -0,0 +1,3 @@
|
|||||||
|
> 1%
|
||||||
|
last 2 versions
|
||||||
|
not dead
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
NODE_ENV = production
|
||||||
|
|
||||||
|
VUE_APP_LINE_LIFF_ID = 1656907652-VJq33Pdg
|
||||||
|
|
||||||
|
VUE_APP_BASE_URL = https://card.h888.fun
|
||||||
|
|
||||||
|
VUE_APP_SEND_URL = https://liff.line.me/1657876696-564NGMxy
|
||||||
|
|
||||||
|
VUE_APP_API_URL = https://card.h888.fun/appapi/v1
|
||||||
|
|
||||||
|
VUE_APP_IMAGE_URL = https://card.h888.fun/storage
|
||||||
|
|
||||||
|
VUE_APP_MC_URL = https://liff.line.me/1657876696-MKYDJKgm
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
NODE_ENV = production
|
||||||
|
|
||||||
|
VUE_ENV = production
|
||||||
|
|
||||||
|
VUE_APP_LINE_LIFF_ID = 1656969446-mg36Maav
|
||||||
|
|
||||||
|
VUE_APP_BASE_URL = https://utel.vip
|
||||||
|
|
||||||
|
VUE_APP_SEND_URL = https://liff.line.me/1656969446-mg36Maav
|
||||||
|
|
||||||
|
VUE_APP_API_URL = https://utel.vip/appapi/v1
|
||||||
|
|
||||||
|
VUE_APP_IMAGE_URL = https://utel.vip/storage
|
||||||
|
|
||||||
|
VUE_APP_MC_URL = https://liff.line.me/1656969446-nQYlz77R
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
NODE_ENV = development
|
||||||
|
|
||||||
|
VUE_ENV = u168
|
||||||
|
|
||||||
|
VUE_APP_LINE_LIFF_ID = 1656907652-VJq33Pdg
|
||||||
|
|
||||||
|
VUE_APP_BASE_URL = https://card.h888.fun
|
||||||
|
|
||||||
|
VUE_APP_SEND_URL = https://liff.line.me/1656907652-VJq33Pdg
|
||||||
|
|
||||||
|
VUE_APP_API_URL = https://card.h888.fun/appapi/v1
|
||||||
|
|
||||||
|
VUE_APP_IMAGE_URL = https://card.h888.fun/storage
|
||||||
|
|
||||||
|
VUE_APP_MC_URL = https://liff.line.me/1656907652-p38ddKzQ
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
NODE_ENV = production
|
||||||
|
|
||||||
|
VUE_ENV = stage
|
||||||
|
|
||||||
|
VUE_APP_LINE_LIFF_ID = 1656948609-BYr8Nynp
|
||||||
|
|
||||||
|
VUE_APP_BASE_URL = https://utel.zltest.com.tw
|
||||||
|
|
||||||
|
VUE_APP_SEND_URL = https://liff.line.me/1656948609-BYr8Nynp
|
||||||
|
|
||||||
|
VUE_APP_API_URL = https://utel.zltest.com.tw/appapi/v1
|
||||||
|
|
||||||
|
VUE_APP_IMAGE_URL = https://utel.zltest.com.tw/storage
|
||||||
|
|
||||||
|
VUE_APP_MC_URL = https://liff.line.me/1656948609-xMp7dWAz
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
NODE_ENV = development
|
||||||
|
|
||||||
|
VUE_ENV = u168
|
||||||
|
|
||||||
|
VUE_APP_LINE_LIFF_ID = 1656907652-VJq33Pdg
|
||||||
|
|
||||||
|
VUE_APP_BASE_URL = https://u168.vip
|
||||||
|
|
||||||
|
VUE_APP_SEND_URL = https://liff.line.me/1656907652-VJq33Pdg
|
||||||
|
|
||||||
|
VUE_APP_API_URL = https://u168.vip/appapi/v1
|
||||||
|
|
||||||
|
VUE_APP_IMAGE_URL = https://u168.vip/storage
|
||||||
|
|
||||||
|
VUE_APP_MC_URL = https://liff.line.me/1656907652-p38ddKzQ
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
.DS_Store
|
||||||
|
node_modules
|
||||||
|
/dist
|
||||||
|
|
||||||
|
|
||||||
|
# local env files
|
||||||
|
.env.local
|
||||||
|
.env.*.local
|
||||||
|
|
||||||
|
# Log files
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
@ -0,0 +1,19 @@
|
|||||||
|
# card
|
||||||
|
|
||||||
|
## Project setup
|
||||||
|
```
|
||||||
|
npm install
|
||||||
|
```
|
||||||
|
|
||||||
|
### Compiles and hot-reloads for development
|
||||||
|
```
|
||||||
|
npm run serve
|
||||||
|
```
|
||||||
|
|
||||||
|
### Compiles and minifies for production
|
||||||
|
```
|
||||||
|
npm run build
|
||||||
|
```
|
||||||
|
|
||||||
|
### Customize configuration
|
||||||
|
See [Configuration Reference](https://cli.vuejs.org/config/).
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
module.exports = {
|
||||||
|
presets: [
|
||||||
|
'@vue/cli-plugin-babel/preset'
|
||||||
|
],
|
||||||
|
plugins: [
|
||||||
|
[
|
||||||
|
"import",
|
||||||
|
{
|
||||||
|
"libraryName": "vant",
|
||||||
|
"libraryDirectory": "es",
|
||||||
|
"style": true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -0,0 +1,31 @@
|
|||||||
|
{
|
||||||
|
"name": "card",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"serve": "vue-cli-service serve",
|
||||||
|
"build": "vue-cli-service build",
|
||||||
|
"build:slash": "vue-cli-service build --mode slash",
|
||||||
|
"build:u168": "vue-cli-service build --mode u168",
|
||||||
|
"build:dev": "vue-cli-service build --mode development",
|
||||||
|
"build:sta": "vue-cli-service build --mode stage"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"axios": "^0.26.1",
|
||||||
|
"core-js": "^3.6.5",
|
||||||
|
"vant": "^3.4.7",
|
||||||
|
"vue": "^3.0.0",
|
||||||
|
"vue-router": "^4.0.0-0",
|
||||||
|
"vuex": "^4.0.0-0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@vue/cli-plugin-babel": "~4.5.15",
|
||||||
|
"@vue/cli-plugin-router": "~4.5.15",
|
||||||
|
"@vue/cli-plugin-vuex": "~4.5.15",
|
||||||
|
"@vue/cli-service": "~4.5.15",
|
||||||
|
"@vue/compiler-sfc": "^3.0.0",
|
||||||
|
"babel-plugin-import": "^1.13.3",
|
||||||
|
"less": "^3.0.4",
|
||||||
|
"less-loader": "^5.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,24 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||||
|
<link rel="icon" href="/favicon.ico">
|
||||||
|
<link rel="stylesheet" href="./css/flex2html.css">
|
||||||
|
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||||
|
<style>
|
||||||
|
[v-cloak] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<noscript>
|
||||||
|
<strong>UTel感應式電子名片</strong>
|
||||||
|
</noscript>
|
||||||
|
<div id="app"></div>
|
||||||
|
<!-- built files will be auto injected -->
|
||||||
|
<script src="./js/flex2html.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
<template>
|
||||||
|
<router-view/>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="less">
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -0,0 +1,19 @@
|
|||||||
|
import ajax from './ajax'
|
||||||
|
|
||||||
|
export const login = async (params)=> ajax(`/auth/login`,params,"POST")
|
||||||
|
|
||||||
|
export const checkLineId = async (lineid)=> ajax(`/auth/checkLineId`,{lineid},"GET")
|
||||||
|
|
||||||
|
export const getUserInfo = async ()=> ajax(`/user/getUserInfo`)
|
||||||
|
|
||||||
|
export const setUserLevel = async (level)=> ajax(`/user/setUserLevel`,{level},"POST")
|
||||||
|
|
||||||
|
//取得名片資料
|
||||||
|
export const checkUser = async (token)=> ajax(`/card/checkUser`,{token},"GET")
|
||||||
|
|
||||||
|
export const getCard = async (params)=> ajax(`/card/getCard`,params,"GET")
|
||||||
|
|
||||||
|
export const getCusCard = async (params)=> ajax(`/card/getCusCard`,params,"GET")
|
||||||
|
export const getVipCard = async (params)=> ajax(`/card/getVipCard`,params,"GET")
|
||||||
|
|
||||||
|
export const getCard1 = async (userid)=> ajax(`/card/getCard1`,{userid},"GET")
|
||||||
@ -0,0 +1,22 @@
|
|||||||
|
html{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
body{
|
||||||
|
max-width: 640px;
|
||||||
|
margin: 0 auto;
|
||||||
|
line-height: 1.5;
|
||||||
|
padding-bottom: 49px;
|
||||||
|
background: url('~@/assets/images/bg.png') repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0
|
||||||
|
}
|
||||||
|
|
||||||
|
:root{
|
||||||
|
--van-nav-bar-background-color: #000;
|
||||||
|
--van-nav-bar-title-text-color: #FFF;
|
||||||
|
}
|
||||||
@ -0,0 +1,229 @@
|
|||||||
|
@charset "utf-8";
|
||||||
|
article,
|
||||||
|
aside,
|
||||||
|
audio,
|
||||||
|
body,
|
||||||
|
canvas,
|
||||||
|
caption,
|
||||||
|
details,
|
||||||
|
div,
|
||||||
|
p,
|
||||||
|
figure,
|
||||||
|
footer,
|
||||||
|
header,
|
||||||
|
hgroup,
|
||||||
|
html,
|
||||||
|
iframe,
|
||||||
|
img,
|
||||||
|
mark,
|
||||||
|
menu,
|
||||||
|
nav,
|
||||||
|
object,
|
||||||
|
section,
|
||||||
|
span,
|
||||||
|
summary,
|
||||||
|
table,
|
||||||
|
tbody,
|
||||||
|
td,
|
||||||
|
tfoot,
|
||||||
|
thead,
|
||||||
|
tr,
|
||||||
|
video,
|
||||||
|
dl,
|
||||||
|
dd {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.5;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-webkit-touch-callout: none;
|
||||||
|
background-color: #f4f4f4;
|
||||||
|
padding-bottom: 49px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a,
|
||||||
|
a:visited,
|
||||||
|
a:hover {
|
||||||
|
color: #999;
|
||||||
|
text-decoration: none;
|
||||||
|
outline: 0;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
border-spacing: 0;
|
||||||
|
}
|
||||||
|
.footerMenu {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
z-index: 900;
|
||||||
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||||
|
height: 49px;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 750px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.footerMenu ul {
|
||||||
|
margin: auto;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
display: -webkit-box;
|
||||||
|
/* display: box; */
|
||||||
|
-webkit-box-orient: horizontal;
|
||||||
|
background-color: #222;
|
||||||
|
/*background-color: #F9F9F9;*/
|
||||||
|
border-top: 1px solid #cecece;
|
||||||
|
}
|
||||||
|
.footerMenu ul li {
|
||||||
|
float: left;
|
||||||
|
width: 19%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu ul li.voiceBox {
|
||||||
|
width: 24%;
|
||||||
|
}
|
||||||
|
.footerMenu.wap li {
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.footerMenu.wap .voiceBox {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu ul li a {
|
||||||
|
line-height: 20px;
|
||||||
|
text-align: center;
|
||||||
|
display: block;
|
||||||
|
text-decoration: none;
|
||||||
|
padding-top: 2px;
|
||||||
|
font-size: 13px;
|
||||||
|
position: relative;
|
||||||
|
height: 46px;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em {
|
||||||
|
margin: 0 auto;
|
||||||
|
display: block;
|
||||||
|
height: 20px;
|
||||||
|
width: 22px;
|
||||||
|
margin-top: 3px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
border-bottom: 0px;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.home {
|
||||||
|
/* background-image: url(../images/f01-1.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.home,
|
||||||
|
.footerMenu ul li a.hover em.home {
|
||||||
|
/* background-image: url(../images/f01-2.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.my {
|
||||||
|
/* background-image: url(../images/f02-1.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.my {
|
||||||
|
/* background-image: url(../images/f02-2.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.bbs {
|
||||||
|
/* background-image: url(../images/f03-1.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.bbs,
|
||||||
|
.footerMenu ul li a.hover em.bbs {
|
||||||
|
/* background-image: url(../images/f03-2.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.back {
|
||||||
|
/* background-image: url(../images/f04.png); */
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu ul li a em.act {
|
||||||
|
/* background-image: url(../images/f05-1.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.act,
|
||||||
|
.footerMenu ul li a.hover em.act {
|
||||||
|
/* background-image: url(../images/f05-2.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.buy {
|
||||||
|
/* background-image: url(../images/f06-1.png); */
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.buy,
|
||||||
|
.footerMenu ul li a.hover em.buy {
|
||||||
|
/* background-image: url(../images/f06-2.png); */
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu ul li a p {
|
||||||
|
color: #fff;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active p,
|
||||||
|
.footerMenu ul li a.hover p {
|
||||||
|
/*color:#cf3435;*/
|
||||||
|
color: #fdaf00;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
.footerMenu ul li.voiceBox {
|
||||||
|
}
|
||||||
|
.footerMenu ul li.voiceBox a {
|
||||||
|
padding: 1px;
|
||||||
|
/* background:url(../images/footer_voice.png) no-repeat; */
|
||||||
|
background-size: 38px;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu.house {
|
||||||
|
height: 59px;
|
||||||
|
}
|
||||||
|
.footerMenu.house .footer_top {
|
||||||
|
height: 10px;
|
||||||
|
background: -webkit-gradient(linear, 0 0, 0 100%, from(#e9f9f8), to(#d8f5f3));
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
.footerMenu.house ul {
|
||||||
|
background: #fff;
|
||||||
|
border-top: 0px;
|
||||||
|
}
|
||||||
|
.footerMenu.house.wap li {
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
.footerMenu.house.wap li.phoneBtn {
|
||||||
|
margin-top: -15px;
|
||||||
|
padding-top: 15px;
|
||||||
|
background: white;
|
||||||
|
z-index: 111;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.phoneBtn {
|
||||||
|
/* background-image: url(../images/footer_phone.png); */
|
||||||
|
width: 30px;
|
||||||
|
height: 26px;
|
||||||
|
margin-top: -3px;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.hover em.phoneBtn {
|
||||||
|
/* background-image: url(../images/footer_phone_active.png); */
|
||||||
|
width: 30px;
|
||||||
|
height: 26px;
|
||||||
|
margin-top: -3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu ul li a em.marketBtn {
|
||||||
|
/* background-image: url(../images/footer_market.png); */
|
||||||
|
width: 30px;
|
||||||
|
height: 26px;
|
||||||
|
margin-top: -3px;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.hover em.marketBtn {
|
||||||
|
/* background-image: url(../images/footer_market_active.png); */
|
||||||
|
width: 30px;
|
||||||
|
height: 26px;
|
||||||
|
margin-top: -3px;
|
||||||
|
}
|
||||||
@ -0,0 +1,349 @@
|
|||||||
|
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
||||||
|
|
||||||
|
/* Document
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the line height in all browsers.
|
||||||
|
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
html {
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
-webkit-text-size-adjust: 100%; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Sections
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the margin in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Render the `main` element consistently in IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
main {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the font size and margin on `h1` elements within `section` and
|
||||||
|
* `article` contexts in Chrome, Firefox, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2em;
|
||||||
|
margin: 0.67em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Grouping content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in Firefox.
|
||||||
|
* 2. Show the overflow in Edge and IE.
|
||||||
|
*/
|
||||||
|
|
||||||
|
hr {
|
||||||
|
box-sizing: content-box; /* 1 */
|
||||||
|
height: 0; /* 1 */
|
||||||
|
overflow: visible; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
pre {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text-level semantics
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the gray background on active links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
a {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Remove the bottom border in Chrome 57-
|
||||||
|
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
abbr[title] {
|
||||||
|
border-bottom: none; /* 1 */
|
||||||
|
text-decoration: underline; /* 2 */
|
||||||
|
text-decoration: underline dotted; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
b,
|
||||||
|
strong {
|
||||||
|
font-weight: bolder;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||||
|
* 2. Correct the odd `em` font sizing in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd,
|
||||||
|
samp {
|
||||||
|
font-family: monospace, monospace; /* 1 */
|
||||||
|
font-size: 1em; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct font size in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
small {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||||
|
* all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
sub,
|
||||||
|
sup {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
position: relative;
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Embedded content
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the border on images inside links in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Forms
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Change the font styles in all browsers.
|
||||||
|
* 2. Remove the margin in Firefox and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input,
|
||||||
|
optgroup,
|
||||||
|
select,
|
||||||
|
textarea {
|
||||||
|
font-family: inherit; /* 1 */
|
||||||
|
font-size: 100%; /* 1 */
|
||||||
|
line-height: 1.15; /* 1 */
|
||||||
|
margin: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Show the overflow in IE.
|
||||||
|
* 1. Show the overflow in Edge.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
input { /* 1 */
|
||||||
|
overflow: visible;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||||
|
* 1. Remove the inheritance of text transform in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
select { /* 1 */
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button,
|
||||||
|
[type="button"],
|
||||||
|
[type="reset"],
|
||||||
|
[type="submit"] {
|
||||||
|
-webkit-appearance: button;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner border and padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button::-moz-focus-inner,
|
||||||
|
[type="button"]::-moz-focus-inner,
|
||||||
|
[type="reset"]::-moz-focus-inner,
|
||||||
|
[type="submit"]::-moz-focus-inner {
|
||||||
|
border-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Restore the focus styles unset by the previous rule.
|
||||||
|
*/
|
||||||
|
|
||||||
|
button:-moz-focusring,
|
||||||
|
[type="button"]:-moz-focusring,
|
||||||
|
[type="reset"]:-moz-focusring,
|
||||||
|
[type="submit"]:-moz-focusring {
|
||||||
|
outline: 1px dotted ButtonText;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the padding in Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
padding: 0.35em 0.75em 0.625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the text wrapping in Edge and IE.
|
||||||
|
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||||
|
* 3. Remove the padding so developers are not caught out when they zero out
|
||||||
|
* `fieldset` elements in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
legend {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
color: inherit; /* 2 */
|
||||||
|
display: table; /* 1 */
|
||||||
|
max-width: 100%; /* 1 */
|
||||||
|
padding: 0; /* 3 */
|
||||||
|
white-space: normal; /* 1 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||||
|
*/
|
||||||
|
|
||||||
|
progress {
|
||||||
|
vertical-align: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the default vertical scrollbar in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Add the correct box sizing in IE 10.
|
||||||
|
* 2. Remove the padding in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="checkbox"],
|
||||||
|
[type="radio"] {
|
||||||
|
box-sizing: border-box; /* 1 */
|
||||||
|
padding: 0; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="number"]::-webkit-inner-spin-button,
|
||||||
|
[type="number"]::-webkit-outer-spin-button {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the odd appearance in Chrome and Safari.
|
||||||
|
* 2. Correct the outline style in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"] {
|
||||||
|
-webkit-appearance: textfield; /* 1 */
|
||||||
|
outline-offset: -2px; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Remove the inner padding in Chrome and Safari on macOS.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||||
|
* 2. Change font properties to `inherit` in Safari.
|
||||||
|
*/
|
||||||
|
|
||||||
|
::-webkit-file-upload-button {
|
||||||
|
-webkit-appearance: button; /* 1 */
|
||||||
|
font: inherit; /* 2 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Interactive
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in Edge, IE 10+, and Firefox.
|
||||||
|
*/
|
||||||
|
|
||||||
|
details {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add the correct display in all browsers.
|
||||||
|
*/
|
||||||
|
|
||||||
|
summary {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Misc
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10+.
|
||||||
|
*/
|
||||||
|
|
||||||
|
template {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Add the correct display in IE 10.
|
||||||
|
*/
|
||||||
|
|
||||||
|
[hidden] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
@ -0,0 +1,308 @@
|
|||||||
|
@charset "utf-8";
|
||||||
|
body,
|
||||||
|
div,
|
||||||
|
dl,
|
||||||
|
footer,
|
||||||
|
html,
|
||||||
|
img,
|
||||||
|
menu,
|
||||||
|
p,
|
||||||
|
span {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.5;
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-webkit-touch-callout: none;
|
||||||
|
background-color: #fffff6 !important;
|
||||||
|
padding-bottom: 49px;
|
||||||
|
}
|
||||||
|
a,
|
||||||
|
a:hover,
|
||||||
|
a:visited {
|
||||||
|
color: #999;
|
||||||
|
text-decoration: none;
|
||||||
|
outline: 0;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
@-webkit-keyframes pop-hide {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: scale(0.8);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
2% {
|
||||||
|
-webkit-transform: scale(1.1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
6% {
|
||||||
|
-webkit-transform: scale(1);
|
||||||
|
}
|
||||||
|
90% {
|
||||||
|
-webkit-transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: scale(0.9);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes pop {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: scale(0.8);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: scale(1.1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes slideup {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translateY(100%);
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
-webkit-transform: translateY(-10%);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.rel {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
a,
|
||||||
|
a:visited {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.text-icon {
|
||||||
|
font-family: base_icon;
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
.my-account {
|
||||||
|
color: #333;
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
height: 6rem;
|
||||||
|
}
|
||||||
|
.account-bg {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
.account-bg img {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.my-account > img {
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
.my-account .user-info {
|
||||||
|
z-index: 1;
|
||||||
|
position: absolute;
|
||||||
|
top: 20px;
|
||||||
|
left: 70px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 1.9em;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
.my-account .uname {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #fff;
|
||||||
|
margin-top: 0.1em;
|
||||||
|
margin-bottom: 0.2em;
|
||||||
|
text-shadow: 0.07em 0.07em #333;
|
||||||
|
}
|
||||||
|
.my-account .umoney {
|
||||||
|
color: #fff;
|
||||||
|
margin-bottom: 0.06em;
|
||||||
|
text-shadow: 0.05em 0.05em #333;
|
||||||
|
}
|
||||||
|
.my-account .avatar_box {
|
||||||
|
position: absolute;
|
||||||
|
top: 1em;
|
||||||
|
left: 1em;
|
||||||
|
width: 5em;
|
||||||
|
height: 5em;
|
||||||
|
z-index: 1;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 2px solid #ffd44a;
|
||||||
|
-moz-border-radius: 100%;
|
||||||
|
-webkit-border-radius: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.my-account .avater {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.phone {
|
||||||
|
width: 105px;
|
||||||
|
float: left;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
.set {
|
||||||
|
position: absolute;
|
||||||
|
width: 60px;
|
||||||
|
right: 10px;
|
||||||
|
top: 20px;
|
||||||
|
z-index: 100;
|
||||||
|
color: #fff;
|
||||||
|
border: none;
|
||||||
|
border-radius: 15px;
|
||||||
|
background-color: #fdaf00;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: -7px;
|
||||||
|
padding: 2px 2px;
|
||||||
|
}
|
||||||
|
.set a {
|
||||||
|
color: #fff !important;
|
||||||
|
}
|
||||||
|
.dl01 {
|
||||||
|
padding: 0 10px 10px;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
.titleImg {
|
||||||
|
width: 25px;
|
||||||
|
height: 25px;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-top: 15px;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.dl02 {
|
||||||
|
padding: 0 10px;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.dl02 a .menu {
|
||||||
|
border-bottom: 1px solid #ffe9b7;
|
||||||
|
background: url(../images/right.png) no-repeat right center;
|
||||||
|
background-size: 10px;
|
||||||
|
}
|
||||||
|
.dl02 a .menu div {
|
||||||
|
padding-top: 16px;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
.dl02 a .menu div.left {
|
||||||
|
float: left;
|
||||||
|
width: 40%;
|
||||||
|
}
|
||||||
|
.dl02 a .menu div.right {
|
||||||
|
float: left;
|
||||||
|
text-align: right;
|
||||||
|
width: 45%;
|
||||||
|
padding-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footerMenu {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
z-index: 900;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
height: 49px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.footerMenu ul {
|
||||||
|
margin: auto;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
display: -webkit-box;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-orient: horizontal;
|
||||||
|
background-color: #222;
|
||||||
|
border-top: 1px solid #cecece;
|
||||||
|
}
|
||||||
|
.footerMenu ul li {
|
||||||
|
float: left;
|
||||||
|
width: 19%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.footerMenu.wap li {
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a {
|
||||||
|
line-height: 20px;
|
||||||
|
text-align: center;
|
||||||
|
display: block;
|
||||||
|
text-decoration: none;
|
||||||
|
padding-top: 2px;
|
||||||
|
font-size: 13px;
|
||||||
|
position: relative;
|
||||||
|
height: 46px;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em {
|
||||||
|
margin: 0 auto;
|
||||||
|
display: block;
|
||||||
|
height: 20px;
|
||||||
|
width: 22px;
|
||||||
|
margin-top: 3px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100%;
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.home {
|
||||||
|
background-image: url(../images/f01-1.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.home {
|
||||||
|
background-image: url(../images/f01-2.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.my {
|
||||||
|
background-image: url(../images/f02-1.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.my {
|
||||||
|
background-image: url(../images/f02-2.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.back {
|
||||||
|
background-image: url(../images/f04.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.act {
|
||||||
|
background-image: url(../images/f05-1.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.act {
|
||||||
|
background-image: url(../images/f05-2.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a em.buy {
|
||||||
|
background-image: url(../images/f06-1.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active em.buy {
|
||||||
|
background-image: url(../images/f06-2.png);
|
||||||
|
}
|
||||||
|
.footerMenu ul li a p {
|
||||||
|
color: #fff;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
.footerMenu ul li a.active p {
|
||||||
|
color: #fdaf00;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 486 B |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1018 B |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 6.5 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 5.6 KiB |
|
After Width: | Height: | Size: 5.5 KiB |
|
After Width: | Height: | Size: 7.1 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 9.8 KiB |
|
After Width: | Height: | Size: 683 B |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 5.1 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 8.5 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 6.7 KiB |
|
After Width: | Height: | Size: 6.7 KiB |
@ -0,0 +1,59 @@
|
|||||||
|
<template>
|
||||||
|
<div class="hello">
|
||||||
|
<h1>{{ msg }}</h1>
|
||||||
|
<p>
|
||||||
|
For a guide and recipes on how to configure / customize this project,<br>
|
||||||
|
check out the
|
||||||
|
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
|
||||||
|
</p>
|
||||||
|
<h3>Installed CLI Plugins</h3>
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
|
||||||
|
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
|
||||||
|
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
|
||||||
|
</ul>
|
||||||
|
<h3>Essential Links</h3>
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
|
||||||
|
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
|
||||||
|
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
|
||||||
|
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
|
||||||
|
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
|
||||||
|
</ul>
|
||||||
|
<h3>Ecosystem</h3>
|
||||||
|
<ul>
|
||||||
|
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
|
||||||
|
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
|
||||||
|
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
|
||||||
|
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
|
||||||
|
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'HelloWorld',
|
||||||
|
props: {
|
||||||
|
msg: String
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
<style scoped lang="less">
|
||||||
|
h3 {
|
||||||
|
margin: 40px 0 0;
|
||||||
|
}
|
||||||
|
ul {
|
||||||
|
list-style-type: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
color: #42b983;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,15 @@
|
|||||||
|
import { createApp } from 'vue'
|
||||||
|
import App from './App.vue'
|
||||||
|
import router from './router'
|
||||||
|
import store from './store'
|
||||||
|
|
||||||
|
import { vant } from '@/plugins/vant'
|
||||||
|
|
||||||
|
import '@/assets/css/normalize.css'
|
||||||
|
import '@/assets/css/common.less'
|
||||||
|
|
||||||
|
const vue = createApp(App)
|
||||||
|
|
||||||
|
vant(vue)
|
||||||
|
|
||||||
|
vue.use(store).use(router).mount('#app')
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
import {
|
||||||
|
Locale , Button , Toast, ShareSheet , NavBar ,
|
||||||
|
Tab, Tabs, Form, Field, CellGroup , Uploader ,
|
||||||
|
Dialog
|
||||||
|
} from 'vant'
|
||||||
|
|
||||||
|
import zhTW from 'vant/es/locale/lang/zh-TW';
|
||||||
|
|
||||||
|
Locale.use('zh-TW', zhTW);
|
||||||
|
|
||||||
|
export function vant(app){
|
||||||
|
app.use(Button)
|
||||||
|
.use(Toast)
|
||||||
|
.use(ShareSheet)
|
||||||
|
.use(NavBar)
|
||||||
|
.use(Tab)
|
||||||
|
.use(Tabs)
|
||||||
|
.use(Form)
|
||||||
|
.use(Field)
|
||||||
|
.use(CellGroup)
|
||||||
|
.use(Uploader)
|
||||||
|
.use(Dialog)
|
||||||
|
}
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
import { createRouter, createWebHistory } from 'vue-router'
|
||||||
|
import Home from '../views/Home.vue'
|
||||||
|
|
||||||
|
const routes = [
|
||||||
|
{
|
||||||
|
path: '/',
|
||||||
|
name: 'Home',
|
||||||
|
component: Home
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// path: '/about',
|
||||||
|
// name: 'About',
|
||||||
|
// // route level code-splitting
|
||||||
|
// // this generates a separate chunk (about.[hash].js) for this route
|
||||||
|
// // which is lazy-loaded when the route is visited.
|
||||||
|
// component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
|
||||||
|
// }
|
||||||
|
]
|
||||||
|
|
||||||
|
const router = createRouter({
|
||||||
|
history: createWebHistory(process.env.BASE_URL),
|
||||||
|
routes
|
||||||
|
})
|
||||||
|
|
||||||
|
export default router
|
||||||
@ -0,0 +1,12 @@
|
|||||||
|
import { createStore } from 'vuex'
|
||||||
|
|
||||||
|
export default createStore({
|
||||||
|
state: {
|
||||||
|
},
|
||||||
|
mutations: {
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
},
|
||||||
|
modules: {
|
||||||
|
}
|
||||||
|
})
|
||||||
@ -0,0 +1,12 @@
|
|||||||
|
import liff from "@line/liff"
|
||||||
|
|
||||||
|
|
||||||
|
export function login(){
|
||||||
|
liff.init({
|
||||||
|
liffId: "1656907652-p38ddKzQ"
|
||||||
|
})
|
||||||
|
|
||||||
|
if (!liff.isLoggedIn())
|
||||||
|
liff.login({ redirectUri: window.location.href })
|
||||||
|
}
|
||||||
|
|
||||||
@ -0,0 +1,7 @@
|
|||||||
|
import { genCard } from "./card/index";
|
||||||
|
|
||||||
|
function cardFactory(option) {
|
||||||
|
return genCard(option);
|
||||||
|
}
|
||||||
|
|
||||||
|
export { cardFactory };
|
||||||
@ -0,0 +1,400 @@
|
|||||||
|
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": "icon",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/icon02.png",
|
||||||
|
"offsetTop": "3px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.url}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "sm",
|
||||||
|
"weight": "bold"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardLink = `
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/icon02.png",
|
||||||
|
"offsetTop": "3px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.url}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "sm",
|
||||||
|
"weight": "bold",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.url}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
vcardLink = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardAddr;
|
||||||
|
if (vcard.address.trim().length > 0) {
|
||||||
|
vcardAddr = `
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/icon04.png",
|
||||||
|
"offsetTop": "3px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.address}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "sm",
|
||||||
|
"weight": "bold",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "https://www.google.com.tw/maps/place/${encodeURIComponent(
|
||||||
|
vcard.address
|
||||||
|
)}"
|
||||||
|
},
|
||||||
|
"wrap": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardAddr = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardTel;
|
||||||
|
|
||||||
|
if (vcard.tel.trim().length > 0) {
|
||||||
|
vcardTel = `
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/icon01.png",
|
||||||
|
"offsetTop": "3px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.tel}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "sm",
|
||||||
|
"weight": "bold",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "tel:${vcard.tel}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardTel = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardPhone;
|
||||||
|
|
||||||
|
if (vcard.phone.trim().length > 0) {
|
||||||
|
vcardPhone = `
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/icon01.png",
|
||||||
|
"offsetTop": "3px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.phone}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "sm",
|
||||||
|
"weight": "bold",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "tel:${vcard.phone}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardPhone = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardAvatar;
|
||||||
|
|
||||||
|
if (vcard.avatar.trim().length > 0) {
|
||||||
|
vcardAvatar = `
|
||||||
|
{
|
||||||
|
"type": "image",
|
||||||
|
"url": "${vcard.avatar}",
|
||||||
|
"size": "xs",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardAvatar = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardEmail;
|
||||||
|
|
||||||
|
if (vcard.email.trim().length > 0) {
|
||||||
|
vcardEmail = `
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "icon",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/icon03.png",
|
||||||
|
"offsetTop": "3px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.email}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "sm",
|
||||||
|
"weight": "bold",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "mailto:${vcard.email}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
},
|
||||||
|
`;
|
||||||
|
} else {
|
||||||
|
vcardEmail = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
// 名片發送
|
||||||
|
|
||||||
|
let card = `
|
||||||
|
{
|
||||||
|
"altText": "UTel電子名片",
|
||||||
|
"type": "flex",
|
||||||
|
"contents":
|
||||||
|
{
|
||||||
|
"type": "bubble",
|
||||||
|
"size": "giga",
|
||||||
|
"body": {
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "image",
|
||||||
|
"url": "https://demo.zltest.com.tw/line/bg02.jpg",
|
||||||
|
"size": "full",
|
||||||
|
"aspectMode": "cover",
|
||||||
|
"aspectRatio": "4:3",
|
||||||
|
"gravity": "top",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
${vcardAvatar}
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.company}",
|
||||||
|
"color": "#ffffff",
|
||||||
|
"size": "md",
|
||||||
|
"weight": "bold",
|
||||||
|
"wrap": true,
|
||||||
|
"align": "center",
|
||||||
|
"margin": "sm",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"position": "absolute",
|
||||||
|
"offsetTop": "13%",
|
||||||
|
"offsetStart": "3%",
|
||||||
|
"width": "26%"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "加入好友",
|
||||||
|
"align": "center",
|
||||||
|
"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}"
|
||||||
|
},
|
||||||
|
"paddingTop": "5px",
|
||||||
|
"paddingBottom": "5px"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "分享名片",
|
||||||
|
"align": "center",
|
||||||
|
"color": "#ffffff",
|
||||||
|
"weight": "bold",
|
||||||
|
"margin": "xs"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"backgroundColor": "#ffcc5b",
|
||||||
|
"width": "100%",
|
||||||
|
"cornerRadius": "5px",
|
||||||
|
"margin": "md",
|
||||||
|
"paddingTop": "5px",
|
||||||
|
"paddingBottom": "5px",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${process.env.VUE_APP_SEND_URL}/?userid=${vcard.user_id}&cardid=1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"position": "absolute",
|
||||||
|
"offsetStart": "4%",
|
||||||
|
"width": "25%",
|
||||||
|
"offsetBottom": "5%"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.title}",
|
||||||
|
"color": "#333334",
|
||||||
|
"size": "md",
|
||||||
|
"weight": "bold"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"spacing": "lg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "vertical",
|
||||||
|
"contents": [
|
||||||
|
{
|
||||||
|
"type": "text",
|
||||||
|
"text": "${vcard.name}",
|
||||||
|
"size": "xxl",
|
||||||
|
"color": "#333334",
|
||||||
|
"weight": "bold",
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"label": "action",
|
||||||
|
"uri": "${vcard.nfcurl}"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [],
|
||||||
|
"backgroundColor": "#d5602d",
|
||||||
|
"height": "3px",
|
||||||
|
"margin": "lg"
|
||||||
|
},
|
||||||
|
${vcardPhone}
|
||||||
|
${vcardTel}
|
||||||
|
${vcardLink}
|
||||||
|
${vcardEmail}
|
||||||
|
${vcardAddr}
|
||||||
|
{
|
||||||
|
"type": "box",
|
||||||
|
"layout": "baseline",
|
||||||
|
"contents": [],
|
||||||
|
"spacing": "lg",
|
||||||
|
"margin": "sm"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"position": "absolute",
|
||||||
|
"offsetTop": "12%",
|
||||||
|
"offsetStart": "35%",
|
||||||
|
"offsetEnd": "5%"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"paddingAll": "0px"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
return { card };
|
||||||
|
}
|
||||||
|
|
||||||
|
export { genCard };
|
||||||
@ -0,0 +1,339 @@
|
|||||||
|
function genCard(vcard) {
|
||||||
|
let vcardLink;
|
||||||
|
if (vcard.url.trim().length > 0) {
|
||||||
|
if (vcard.nc_func.indexOf("nourl") !== -1) {
|
||||||
|
vcardLink = {
|
||||||
|
type: "text",
|
||||||
|
text: vcard.url,
|
||||||
|
color: "#FFFFFF",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardLink = {
|
||||||
|
type: "text",
|
||||||
|
text: vcard.url,
|
||||||
|
color: "#FFFFFF",
|
||||||
|
align: "end",
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: vcard.url,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
vcardLink = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
color: "#FFFFFF",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardAddr;
|
||||||
|
if (vcard.address.trim().length > 0) {
|
||||||
|
vcardAddr = {
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text: vcard.address.substr(0, 3),
|
||||||
|
size: "sm",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text:
|
||||||
|
vcard.address.substr(3).length > 0 ? vcard.address.substr(3) : " ",
|
||||||
|
size: "sm",
|
||||||
|
wrap: true,
|
||||||
|
maxLines: 2,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
position: "absolute",
|
||||||
|
offsetTop: "30%",
|
||||||
|
offsetStart: "25%",
|
||||||
|
width: "40%",
|
||||||
|
height: "60px",
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: `https://www.google.com.tw/maps/place/${encodeURIComponent(
|
||||||
|
vcard.address
|
||||||
|
)}`,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
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;
|
||||||
|
|
||||||
|
if (vcard.tel.trim().length == 0) {
|
||||||
|
vcardTel = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardTel = {
|
||||||
|
type: "text",
|
||||||
|
text: vcard.tel,
|
||||||
|
align: "end",
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: "tel:" + vcard.tel,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardPhone;
|
||||||
|
|
||||||
|
if (vcard.phone.trim().length == 0) {
|
||||||
|
vcardPhone = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardPhone = {
|
||||||
|
type: "text",
|
||||||
|
text: vcard.phone,
|
||||||
|
align: "end",
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: "tel:" + vcard.phone,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
let vcardAvatar;
|
||||||
|
if (vcard.avatar.trim().length > 0) {
|
||||||
|
vcardAvatar = {
|
||||||
|
type: "image",
|
||||||
|
url: vcard.avatar,
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: vcard.nfcurl,
|
||||||
|
},
|
||||||
|
aspectMode: "cover",
|
||||||
|
size: "full",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardAvatar = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
size: "xs",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
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",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardEmail = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
color: "#333334",
|
||||||
|
size: "sm",
|
||||||
|
weight: "bold",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
let card = {
|
||||||
|
altText: "UTel電子名片",
|
||||||
|
type: "flex",
|
||||||
|
contents: {
|
||||||
|
type: "bubble",
|
||||||
|
size: "giga",
|
||||||
|
body: {
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "image",
|
||||||
|
url: "https://utel.u168.vip/images/tpl02_bg.png",
|
||||||
|
size: "full",
|
||||||
|
aspectMode: "cover",
|
||||||
|
aspectRatio: "4:3",
|
||||||
|
gravity: "top",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [vcardAvatar],
|
||||||
|
position: "absolute",
|
||||||
|
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: "text",
|
||||||
|
text: "分享名片",
|
||||||
|
align: "center",
|
||||||
|
color: "#ffffff",
|
||||||
|
weight: "bold",
|
||||||
|
margin: "xs",
|
||||||
|
size: "xs",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
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: vcard.name,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
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,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
return { card: JSON.stringify(card) };
|
||||||
|
}
|
||||||
|
|
||||||
|
export { genCard };
|
||||||
@ -0,0 +1,368 @@
|
|||||||
|
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",
|
||||||
|
};
|
||||||
|
} 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",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
vcardLink = {
|
||||||
|
type: "box",
|
||||||
|
layout: "baseline",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
color: "#333334",
|
||||||
|
size: "sm",
|
||||||
|
weight: "bold",
|
||||||
|
align: "end",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
spacing: "lg",
|
||||||
|
margin: "xs",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
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(
|
||||||
|
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",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
if (vcard.title.trim().length == 0) {
|
||||||
|
vcard.title = " ";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (vcard.tel.trim().length == 0) {
|
||||||
|
vcard.tel = " ";
|
||||||
|
}
|
||||||
|
|
||||||
|
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,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardAvatar = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
size: "xs",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
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",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardEmail = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
color: "#333334",
|
||||||
|
size: "sm",
|
||||||
|
weight: "bold",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
let card = {
|
||||||
|
altText: "UTel電子名片",
|
||||||
|
type: "flex",
|
||||||
|
contents: {
|
||||||
|
type: "bubble",
|
||||||
|
size: "giga",
|
||||||
|
body: {
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "image",
|
||||||
|
url: "https://utel.u168.vip/images/jcibg.png",
|
||||||
|
size: "full",
|
||||||
|
aspectMode: "fit",
|
||||||
|
aspectRatio: "4:3",
|
||||||
|
gravity: "top",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
vcardAvatar,
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text: "大同國際\n青年商會",
|
||||||
|
wrap: true,
|
||||||
|
align: "center",
|
||||||
|
margin: "md",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
position: "absolute",
|
||||||
|
offsetTop: "13%",
|
||||||
|
offsetStart: "2%",
|
||||||
|
width: "21%",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text: "加入好友",
|
||||||
|
align: "center",
|
||||||
|
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",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text: "分享名片",
|
||||||
|
align: "center",
|
||||||
|
color: "#ffffff",
|
||||||
|
weight: "bold",
|
||||||
|
margin: "xs",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
backgroundColor: "#ffcc5b",
|
||||||
|
width: "100%",
|
||||||
|
cornerRadius: "5px",
|
||||||
|
margin: "md",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
position: "absolute",
|
||||||
|
offsetStart: "2%",
|
||||||
|
width: "20%",
|
||||||
|
offsetBottom: "8%",
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: `${process.env.VUE_APP_SEND_URL}/?userid=${vcard.user_id}&cardid=1`,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "box",
|
||||||
|
layout: "vertical",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
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,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
return { card: JSON.stringify(card) };
|
||||||
|
}
|
||||||
|
|
||||||
|
export { genCard };
|
||||||
@ -0,0 +1,344 @@
|
|||||||
|
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",
|
||||||
|
};
|
||||||
|
} 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",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
vcardLink = {
|
||||||
|
type: "box",
|
||||||
|
layout: "baseline",
|
||||||
|
contents: [
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
color: "#333334",
|
||||||
|
size: "sm",
|
||||||
|
weight: "bold",
|
||||||
|
align: "end",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
spacing: "lg",
|
||||||
|
margin: "xs",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
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(
|
||||||
|
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",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
if (vcard.title.trim().length == 0) {
|
||||||
|
vcard.title = " ";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (vcard.tel.trim().length == 0) {
|
||||||
|
vcard.tel = " ";
|
||||||
|
}
|
||||||
|
|
||||||
|
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,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardAvatar = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
size: "xs",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
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",
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
vcardEmail = {
|
||||||
|
type: "text",
|
||||||
|
text: " ",
|
||||||
|
color: "#333334",
|
||||||
|
size: "sm",
|
||||||
|
weight: "bold",
|
||||||
|
align: "end",
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
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: "https://utel.u168.vip/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 || vcard.nfcurl,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
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: "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,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
position: "absolute",
|
||||||
|
width: "100%",
|
||||||
|
offsetBottom: "5%",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
paddingAll: "0px",
|
||||||
|
action: {
|
||||||
|
type: "uri",
|
||||||
|
label: "action",
|
||||||
|
uri: vcard.nfcurl,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
return { card: JSON.stringify(card) };
|
||||||
|
}
|
||||||
|
|
||||||
|
export { genCard };
|
||||||