|
|
|
|
@ -7,9 +7,9 @@
|
|
|
|
|
<van-tabs :lazy-render="true" v-model:active="activeName" v-show="user.level > 0">
|
|
|
|
|
<van-tab title="我的名片" name="0">
|
|
|
|
|
</van-tab>
|
|
|
|
|
<van-tab :title="state.card_title" name="1" v-if="state.showCusCard">
|
|
|
|
|
<van-tab :title="card_title" name="1" v-if="showCusCard">
|
|
|
|
|
</van-tab>
|
|
|
|
|
<van-tab :title="card.title" :name="card.id.toString()" v-for="card of state.vip_card" :key="card.id">
|
|
|
|
|
<van-tab :title="card.title" :name="card.id.toString()" v-for="card of vip_card" :key="card.id">
|
|
|
|
|
</van-tab>
|
|
|
|
|
</van-tabs>
|
|
|
|
|
<div class="flex-section" v-if="activeName != '0'">
|
|
|
|
|
@ -32,7 +32,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn-area" v-if="user.level > 0">
|
|
|
|
|
<dl class="dl02">
|
|
|
|
|
<a :href="`${state.imgUrl}/${user.user_id}/${user.user_id}.vcf`">
|
|
|
|
|
<a :href="`${imgUrl}/${user.user_id}/${user.user_id}.vcf`">
|
|
|
|
|
<div class="menu main">加入通訊錄</div>
|
|
|
|
|
</a>
|
|
|
|
|
</dl>
|
|
|
|
|
@ -90,7 +90,7 @@
|
|
|
|
|
</van-popup>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup>
|
|
|
|
|
<script>
|
|
|
|
|
import dayjs from 'dayjs'
|
|
|
|
|
import Cookies from 'js-cookie'
|
|
|
|
|
|
|
|
|
|
@ -107,197 +107,249 @@ import { genVipCard } from '@/utils/vipcard'
|
|
|
|
|
|
|
|
|
|
import { Toast } from 'vant'
|
|
|
|
|
|
|
|
|
|
const token = encodeURIComponent(new URLSearchParams(window.location.search).get('params'))
|
|
|
|
|
const cardid = encodeURIComponent(new URLSearchParams(window.location.search).get('cardid'))
|
|
|
|
|
const nouc = encodeURIComponent(new URLSearchParams(window.location.search).get('nouc'))
|
|
|
|
|
|
|
|
|
|
const state = reactive({
|
|
|
|
|
imgUrl: process.env.VUE_APP_IMAGE_URL,
|
|
|
|
|
user: {},
|
|
|
|
|
showCusCard: false,
|
|
|
|
|
card_title: '',
|
|
|
|
|
vip_card: [],
|
|
|
|
|
flexContent: {}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const activeName = ref('0')
|
|
|
|
|
const cid = ref(null)
|
|
|
|
|
const isIOs = ref(null)
|
|
|
|
|
const flexRef = ref(null)
|
|
|
|
|
const uc_temp = ref(null)
|
|
|
|
|
const nolog = ref(encodeURIComponent(new URLSearchParams(window.location.search).get('nolog')))
|
|
|
|
|
const showUserConn = ref(false)
|
|
|
|
|
|
|
|
|
|
const handleAddFavorite = async (userid) => {
|
|
|
|
|
if (!Cookies.get('token')) {
|
|
|
|
|
return Toast('您尚未登入Slash會員中心,請按左上角Slash會員中心登入或加入')
|
|
|
|
|
}
|
|
|
|
|
const res = await addFavorite(state.user.user_id)
|
|
|
|
|
if (res.code === 200) {
|
|
|
|
|
return Toast('收藏成功')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
export default {
|
|
|
|
|
name: 'LineCard',
|
|
|
|
|
setup() {
|
|
|
|
|
const state = reactive({
|
|
|
|
|
imgUrl: process.env.VUE_APP_IMAGE_URL,
|
|
|
|
|
user: {},
|
|
|
|
|
showCusCard: false,
|
|
|
|
|
card_title: '',
|
|
|
|
|
vip_card: [],
|
|
|
|
|
flexContent: {}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const goSlash = () => {
|
|
|
|
|
window.location.href = 'https://card.slash1000.com/home/?refer=' + state.user.code
|
|
|
|
|
}
|
|
|
|
|
const activeName = ref('0');
|
|
|
|
|
|
|
|
|
|
const goUC = (url) => {
|
|
|
|
|
showUserConn.value = false
|
|
|
|
|
window.location.href = url + '&nouc=1'
|
|
|
|
|
}
|
|
|
|
|
let cid = ref(null)
|
|
|
|
|
|
|
|
|
|
const saveConnection = async (data) => {
|
|
|
|
|
const 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 isIOs = ref(null)
|
|
|
|
|
|
|
|
|
|
let n_user_conn = []
|
|
|
|
|
let flexRef = ref(null)
|
|
|
|
|
|
|
|
|
|
if (localStorage.getItem('user_conn')) {
|
|
|
|
|
let i = 0
|
|
|
|
|
const 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]
|
|
|
|
|
}
|
|
|
|
|
//取得user id
|
|
|
|
|
let token = encodeURIComponent(new URLSearchParams(window.location.search).get('params'))
|
|
|
|
|
let cardid = encodeURIComponent(new URLSearchParams(window.location.search).get('cardid'))
|
|
|
|
|
let nouc = encodeURIComponent(new URLSearchParams(window.location.search).get('nouc'))
|
|
|
|
|
let nolog = ref(encodeURIComponent(new URLSearchParams(window.location.search).get('nolog')))
|
|
|
|
|
|
|
|
|
|
localStorage.setItem('user_conn', JSON.stringify(n_user_conn))
|
|
|
|
|
cid.value = cardid
|
|
|
|
|
|
|
|
|
|
if (Cookies.get('token')) {
|
|
|
|
|
const res = await uploadUserConnections(JSON.stringify(n_user_conn))
|
|
|
|
|
if (res.code === 200) {
|
|
|
|
|
uc_temp.value = n_user_conn
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
//取得是否為iphone
|
|
|
|
|
var u = navigator.userAgent;
|
|
|
|
|
isIOs.value = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
|
|
|
|
|
|
|
|
|
|
onBeforeMount(async () => {
|
|
|
|
|
const uc_temp = ref()
|
|
|
|
|
|
|
|
|
|
const chkRes = await checkUser(token)
|
|
|
|
|
|
|
|
|
|
if (chkRes.code !== 200) {
|
|
|
|
|
if (chkRes.code !== 201) {
|
|
|
|
|
window.location.replace('/error.html')
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
onBeforeMount(async () => {
|
|
|
|
|
|
|
|
|
|
//開卡頁面
|
|
|
|
|
window.location.replace(`${process.env.VUE_APP_BASE_URL}/home/activation?params=${token}`)
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
const chkRes = await checkUser(token)
|
|
|
|
|
|
|
|
|
|
const userid = chkRes.data
|
|
|
|
|
if (chkRes.code !== 200) {
|
|
|
|
|
if (chkRes.code !== 201) {
|
|
|
|
|
window.location.replace('/error.html')
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
window.location.replace(`${process.env.VUE_APP_MC_URL}/?act=openright&verify=${chkRes.data.verify.toUpperCase()}`)
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const card1Res = await getCard({userid})
|
|
|
|
|
let userid = chkRes.data
|
|
|
|
|
|
|
|
|
|
if (card1Res.code !== 200) {
|
|
|
|
|
Toast('操作錯誤')
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
let params = {}
|
|
|
|
|
|
|
|
|
|
changeMeta({
|
|
|
|
|
site_name: "Utel電子名片",
|
|
|
|
|
title: card1Res.data.name + " " + card1Res.data.company,
|
|
|
|
|
description: card1Res.data.mark,
|
|
|
|
|
image: card1Res.data.avatar
|
|
|
|
|
})
|
|
|
|
|
if (userid) {
|
|
|
|
|
params = { userid }
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
state.user = card1Res.data
|
|
|
|
|
const card1Res = await getCard(params)
|
|
|
|
|
|
|
|
|
|
if (card1Res.data.level > 0 && card1Res.data.has_cuscard === 1 && card1Res.data.show_cus === 1) {
|
|
|
|
|
state.showCusCard = true
|
|
|
|
|
state.card_title = card1Res.data.card_title
|
|
|
|
|
}
|
|
|
|
|
if (card1Res.code !== 200) {
|
|
|
|
|
Toast('操作錯誤')
|
|
|
|
|
return
|
|
|
|
|
// window.location.replace('https://liff.line.me/1656948609-xMp7dWAz')
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (card1Res.data.nc_type > 2) {
|
|
|
|
|
const vipCardRes = await getVipCard({ userid: state.user.user_id })
|
|
|
|
|
changeMeta({
|
|
|
|
|
site_name: "Utel電子名片",
|
|
|
|
|
title: card1Res.data.name + " " + card1Res.data.company,
|
|
|
|
|
description: card1Res.data.mark,
|
|
|
|
|
image: card1Res.data.avatar
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
state.vip_card = vipCardRes.data.filter(item => item.nfc_show === 1)
|
|
|
|
|
} else {
|
|
|
|
|
state.vip_card = []
|
|
|
|
|
}
|
|
|
|
|
state.user = card1Res.data
|
|
|
|
|
|
|
|
|
|
if (nouc !== '1') {
|
|
|
|
|
saveConnection(card1Res.data)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
if (card1Res.data.level > 0 && card1Res.data.has_cuscard === 1 && card1Res.data.show_cus === 1) {
|
|
|
|
|
state.showCusCard = true
|
|
|
|
|
state.card_title = card1Res.data.card_title
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
watch(() => activeName.value, (newVal, oldVal) => {
|
|
|
|
|
if (newVal !== oldVal) {
|
|
|
|
|
if (newVal>0) {
|
|
|
|
|
showFlex(newVal)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}, { immediate: true })
|
|
|
|
|
|
|
|
|
|
const showFlex = async (id) => {
|
|
|
|
|
switch (id) {
|
|
|
|
|
case '0':
|
|
|
|
|
// let { card } = cardFactory({ tid: state.user.nc_template, vcard: state.user })
|
|
|
|
|
// state.flexContent = JSON.parse(card)
|
|
|
|
|
// flexRef.value.innerHTML = ''
|
|
|
|
|
// flex2html("flex", JSON.parse(card))
|
|
|
|
|
break
|
|
|
|
|
case '1':
|
|
|
|
|
if (state.user.level > 0) {
|
|
|
|
|
const card2Res = await getCusCard({ userid: state.user.user_id })
|
|
|
|
|
if (card2Res.code === 200) {
|
|
|
|
|
if (card2Res.data.cus_card) {
|
|
|
|
|
state.flexContent = genCard1(JSON.parse(card2Res.data.cus_card))
|
|
|
|
|
await nextTick()
|
|
|
|
|
flexRef.value.innerHTML = ''
|
|
|
|
|
flex2html("flex", state.flexContent)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (card1Res.data.nc_type > 2) {
|
|
|
|
|
let vipCardRes = await getVipCard({ userid: state.user.user_id })
|
|
|
|
|
|
|
|
|
|
state.vip_card = vipCardRes.data.filter(item => item.nfc_show === 1)
|
|
|
|
|
} else {
|
|
|
|
|
// flexRef.value.innerHtml = ''
|
|
|
|
|
state.vip_card = []
|
|
|
|
|
}
|
|
|
|
|
break
|
|
|
|
|
default:
|
|
|
|
|
if (state.user.nc_type > 2) {
|
|
|
|
|
const res = state.vip_card.find(item => item.id == id)
|
|
|
|
|
if (res.type === 0) {
|
|
|
|
|
state.flexContent = genCard1(JSON.parse(res.content))
|
|
|
|
|
await nextTick()
|
|
|
|
|
flexRef.value.innerHTML = ''
|
|
|
|
|
flex2html("flex", state.flexContent)
|
|
|
|
|
} else {
|
|
|
|
|
state.flexContent = genVipCard(JSON.parse(res.content))
|
|
|
|
|
await nextTick()
|
|
|
|
|
if (flexRef.value) {
|
|
|
|
|
flexRef.value.innerHTML = ''
|
|
|
|
|
|
|
|
|
|
//儲存人脈
|
|
|
|
|
if(nouc != '1'){
|
|
|
|
|
saveConnection(card1Res.data)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// activeName.value = '0'
|
|
|
|
|
watch(() => activeName.value, function (newVal, oldVal) {
|
|
|
|
|
if (newVal !== oldVal) {
|
|
|
|
|
if (newVal) {
|
|
|
|
|
showFlex(newVal)
|
|
|
|
|
}
|
|
|
|
|
flex2html("flex", state.flexContent)
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
flexRef.value.innerHtml = ''
|
|
|
|
|
}, { immediate: true })
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
async function showFlex(id) {
|
|
|
|
|
|
|
|
|
|
switch (id) {
|
|
|
|
|
case '0':
|
|
|
|
|
// let { card } = cardFactory({ tid: state.user.nc_template, vcard: state.user })
|
|
|
|
|
|
|
|
|
|
// state.flexContent = JSON.parse(card)
|
|
|
|
|
// flexRef.value.innerHTML = ''
|
|
|
|
|
// flex2html("flex", JSON.parse(card))
|
|
|
|
|
break
|
|
|
|
|
case '1':
|
|
|
|
|
if (state.user.level > 0) {
|
|
|
|
|
let card2Res = await getCusCard({ userid: state.user.user_id })
|
|
|
|
|
if (card2Res.code === 200) {
|
|
|
|
|
if (card2Res.data.cus_card) {
|
|
|
|
|
state.flexContent = genCard1(JSON.parse(card2Res.data.cus_card))
|
|
|
|
|
await nextTick()
|
|
|
|
|
flexRef.value.innerHTML = ''
|
|
|
|
|
flex2html("flex", state.flexContent)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
// flexRef.value.innerHtml = ''
|
|
|
|
|
}
|
|
|
|
|
break
|
|
|
|
|
default:
|
|
|
|
|
if (state.user.nc_type > 2) {
|
|
|
|
|
let res = state.vip_card.find(item => { return item.id == id })
|
|
|
|
|
if (res.type === 0) {
|
|
|
|
|
state.flexContent = genCard1(JSON.parse(res.content))
|
|
|
|
|
|
|
|
|
|
await nextTick()
|
|
|
|
|
|
|
|
|
|
flexRef.value.innerHTML = ''
|
|
|
|
|
flex2html("flex", state.flexContent)
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
state.flexContent = genVipCard(JSON.parse(res.content))
|
|
|
|
|
|
|
|
|
|
await nextTick()
|
|
|
|
|
|
|
|
|
|
if (flexRef.value) {
|
|
|
|
|
flexRef.value.innerHTML = ''
|
|
|
|
|
}
|
|
|
|
|
flex2html("flex", state.flexContent)
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
flexRef.value.innerHtml = ''
|
|
|
|
|
}
|
|
|
|
|
break
|
|
|
|
|
}
|
|
|
|
|
break
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const userConnections = computed(() => {
|
|
|
|
|
if (uc_temp.value && uc_temp.value.length > 0) {
|
|
|
|
|
return uc_temp.value
|
|
|
|
|
}
|
|
|
|
|
return JSON.parse(localStorage.getItem('user_conn'))
|
|
|
|
|
})
|
|
|
|
|
//人脈紀錄
|
|
|
|
|
const showUserConn = ref(false)
|
|
|
|
|
|
|
|
|
|
async 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')
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const {user} = toRefs(state)
|
|
|
|
|
let n_user_conn = []
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
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))
|
|
|
|
|
|
|
|
|
|
if(Cookies.get('token')){
|
|
|
|
|
let res = await uploadUserConnections(JSON.stringify(n_user_conn))
|
|
|
|
|
if(res.code === 200){
|
|
|
|
|
uc_temp.value = n_user_conn
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const userConnections = computed(()=>{
|
|
|
|
|
if(uc_temp.value && uc_temp.value.length > 0){
|
|
|
|
|
return uc_temp.value
|
|
|
|
|
}
|
|
|
|
|
return JSON.parse(localStorage.getItem('user_conn'))
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const goUC = (url)=>{
|
|
|
|
|
showUserConn.value = false
|
|
|
|
|
window.location.href = url + '&nouc=1'
|
|
|
|
|
// window.location.href = url
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const handleAddFavorite = async (userid)=>{
|
|
|
|
|
if(!Cookies.get('token')){
|
|
|
|
|
return Toast('您尚未登入Slash會員中心,請按左上角Slash會員中心登入或加入')
|
|
|
|
|
}
|
|
|
|
|
let res = await addFavorite(state.user.user_id)
|
|
|
|
|
if(res.code === 200){
|
|
|
|
|
return Toast('收藏成功')
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const goSlash=()=>{
|
|
|
|
|
window.location.href = 'https://card.slash1000.com/home/?refer=' + state.user.code
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
...toRefs(state),
|
|
|
|
|
showUserConn,
|
|
|
|
|
activeName,
|
|
|
|
|
cid,
|
|
|
|
|
nolog,
|
|
|
|
|
flexRef,
|
|
|
|
|
isIOs,
|
|
|
|
|
userConnections,
|
|
|
|
|
goUC,
|
|
|
|
|
goSlash,
|
|
|
|
|
handleAddFavorite
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="less" scoped>
|
|
|
|
|
[v-cloak] {
|
|
|
|
|
display: none;
|
|
|
|
|
|