加入人脈紀錄

sta
Wayne Hsu 3 years ago
parent b24e5bbccf
commit 9493be2150

11
package-lock.json generated

@ -10,6 +10,7 @@
"dependencies": { "dependencies": {
"axios": "^0.26.1", "axios": "^0.26.1",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"dayjs": "^1.11.7",
"vant": "^3.4.7", "vant": "^3.4.7",
"vue": "^3.0.0", "vue": "^3.0.0",
"vue-router": "^4.0.0-0", "vue-router": "^4.0.0-0",
@ -5422,6 +5423,11 @@
"node": ">=0.10" "node": ">=0.10"
} }
}, },
"node_modules/dayjs": {
"version": "1.11.7",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz",
"integrity": "sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ=="
},
"node_modules/debug": { "node_modules/debug": {
"version": "4.3.4", "version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
@ -19164,6 +19170,11 @@
"assert-plus": "^1.0.0" "assert-plus": "^1.0.0"
} }
}, },
"dayjs": {
"version": "1.11.7",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.7.tgz",
"integrity": "sha512-+Yw9U6YO5TQohxLcIkrXBeY73WP3ejHWVvx8XCk3gxvQDCTEmS48ZrSZCKciI7Bhl/uCMyxYtE9UqRILmFphkQ=="
},
"debug": { "debug": {
"version": "4.3.4", "version": "4.3.4",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",

@ -13,6 +13,7 @@
"dependencies": { "dependencies": {
"axios": "^0.26.1", "axios": "^0.26.1",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"dayjs": "^1.11.7",
"vant": "^3.4.7", "vant": "^3.4.7",
"vue": "^3.0.0", "vue": "^3.0.0",
"vue-router": "^4.0.0-0", "vue-router": "^4.0.0-0",

@ -1,11 +1,14 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang=""> <html lang="">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <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" /> <meta
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> name="viewport"
<link rel="stylesheet" href="<%= BASE_URL %>css/flex2html.css"> content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<link rel="stylesheet" href="<%= BASE_URL %>css/flex2html.css" />
<title><%= htmlWebpackPlugin.options.title %></title> <title><%= htmlWebpackPlugin.options.title %></title>
<style> <style>
[v-cloak] { [v-cloak] {

@ -19,4 +19,5 @@ p {
:root{ :root{
--van-nav-bar-background-color: #000; --van-nav-bar-background-color: #000;
--van-nav-bar-title-text-color: #FFF; --van-nav-bar-title-text-color: #FFF;
--van-nav-bar-text-color: #fff;
} }

@ -1,59 +0,0 @@
<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>

@ -1,7 +1,7 @@
import { import {
Locale , Button , Toast, ShareSheet , NavBar , Locale , Button , Toast, ShareSheet , NavBar ,
Tab, Tabs, Form, Field, CellGroup , Uploader , Tab, Tabs, Form, Field, CellGroup , Uploader ,
Dialog Dialog, Popup, List, Step, Steps
} from 'vant' } from 'vant'
import zhTW from 'vant/es/locale/lang/zh-TW'; import zhTW from 'vant/es/locale/lang/zh-TW';
@ -20,4 +20,9 @@ export function vant(app){
.use(CellGroup) .use(CellGroup)
.use(Uploader) .use(Uploader)
.use(Dialog) .use(Dialog)
.use(Popup)
.use(List)
.use(Step)
.use(Steps)
} }

@ -1,6 +1,6 @@
<template> <template>
<div id="home"> <div id="home">
<van-nav-bar title="我的名片" /> <van-nav-bar title="我的名片" right-text="" @click-right="showUserConn = true"/>
<div class="tab-section" v-cloak> <div class="tab-section" v-cloak>
<van-tabs :lazy-render="true" v-model:active="activeName" v-show="user.nc_type > 1 && cid !== '1'"> <van-tabs :lazy-render="true" v-model:active="activeName" v-show="user.nc_type > 1 && cid !== '1'">
<van-tab title="我的名片" name="0"> <van-tab title="我的名片" name="0">
@ -18,6 +18,7 @@
</div> </div>
</div> </div>
<div class="recommend" v-if="activeName == '0'"> <div class="recommend" v-if="activeName == '0'">
<div>
<img class="avatar" :src="user.avatar" style="display:block; margin:auto;"> <img class="avatar" :src="user.avatar" style="display:block; margin:auto;">
<br /> <br />
<p style="text-align: center; font-size: 35px; "><strong>{{ user.name }}</strong><br /></p> <p style="text-align: center; font-size: 35px; "><strong>{{ user.name }}</strong><br /></p>
@ -27,8 +28,6 @@
<p style="text-align: center; font-size: 15px;" v-html="user.mark"> <p style="text-align: center; font-size: 15px;" v-html="user.mark">
</p> </p>
</div> </div>
</div>
<div class="btn-area" v-if="user.level > 0"> <div class="btn-area" v-if="user.level > 0">
<dl class="dl02"> <dl class="dl02">
<a :href="`${imgUrl}/${user.user_id}/${user.user_id}.vcf`"> <a :href="`${imgUrl}/${user.user_id}/${user.user_id}.vcf`">
@ -70,10 +69,28 @@
</div> </div>
</div> </div>
</div>
</div>
<van-popup v-model:show="showUserConn" position="right" :style="{ width: '70%',height: '100%' }">
<van-steps direction="vertical" :active="0">
<van-step v-for="(v,i) in userConnections" :key="i">
<div class="user-conn">
<div class="user-conn-left">{{ v.name }}</div>
<div class="user-conn-right" @click="goUC(v.nfcurl)">
查看
</div>
</div>
<p>{{ v.company }}</p>
<p>{{ v.time }}</p>
</van-step>
</van-steps>
</van-popup>
</template> </template>
<script> <script>
import { nextTick, onBeforeMount, reactive, ref, toRefs, watch } from 'vue' import dayjs from 'dayjs'
import { nextTick, onBeforeMount, reactive, ref, toRefs, watch, computed } from 'vue'
import { checkUser, getCard, getCusCard, getVipCard } from '@/api' import { checkUser, getCard, getCusCard, getVipCard } from '@/api'
@ -109,6 +126,7 @@ export default {
//user id //user id
let token = encodeURIComponent(new URLSearchParams(window.location.search).get('params')) let token = encodeURIComponent(new URLSearchParams(window.location.search).get('params'))
let cardid = encodeURIComponent(new URLSearchParams(window.location.search).get('cardid')) let cardid = encodeURIComponent(new URLSearchParams(window.location.search).get('cardid'))
let nouc = encodeURIComponent(new URLSearchParams(window.location.search).get('nouc'))
cid.value = cardid cid.value = cardid
@ -141,7 +159,6 @@ export default {
const card1Res = await getCard(params) const card1Res = await getCard(params)
console.log('card1Res', card1Res)
if (card1Res.code !== 200) { if (card1Res.code !== 200) {
Toast('操作錯誤') Toast('操作錯誤')
return return
@ -170,6 +187,12 @@ export default {
state.vip_card = [] state.vip_card = []
} }
//
if(nouc != '1'){
saveConnection(card1Res.data)
}
})
// activeName.value = '0' // activeName.value = '0'
watch(() => activeName.value, function (newVal, oldVal) { watch(() => activeName.value, function (newVal, oldVal) {
@ -180,7 +203,6 @@ export default {
} }
}, { immediate: true }) }, { immediate: true })
})
async function showFlex(id) { async function showFlex(id) {
@ -236,12 +258,58 @@ export default {
} }
} }
//
const showUserConn = ref(false)
function saveConnection(data){
let connData = {
userid: data.user_id,
name: data.name,
nfcurl: data.nfcurl,
company: data.company,
title: data.title,
avatar: data.avatar,
time: dayjs().format('YYYY/MM/DD HH:mm')
}
let n_user_conn = []
if(localStorage.getItem('user_conn')){
//
let i = 0
let t_connData = JSON.parse(localStorage.getItem('user_conn')).filter(item=>{
i++
return item.userid !=connData.userid && i < 5
})
n_user_conn = [connData,...t_connData]
}else{
n_user_conn = [connData]
}
localStorage.setItem('user_conn',JSON.stringify(n_user_conn))
}
const userConnections = computed(()=>{
return JSON.parse(localStorage.getItem('user_conn'))
})
const goUC = (url)=>{
showUserConn.value = false
window.location.href = url + '&nouc=1'
}
return { return {
...toRefs(state), ...toRefs(state),
showUserConn,
activeName, activeName,
cid, cid,
flexRef, flexRef,
isIOs isIOs,
userConnections,
goUC
} }
} }
} }
@ -334,9 +402,23 @@ export default {
.recommend { .recommend {
width: 100%; width: 100%;
padding-top: 20px; padding-top: 20px;
.avatar { .avatar {
width: 50%; width: 50%;
border-radius: 50%; border-radius: 50%;
} }
} }
.user-conn{
display: flex;
margin-bottom: 10px;
.user-conn-left{
flex: 1;
font-size: 18px;
font-weight: 500;
}
.user-conn-right{
width: 50px
}
}
</style> </style>

Loading…
Cancel
Save