21 changed files with 236 additions and 98 deletions
@ -0,0 +1,92 @@ |
|||||
|
<template> |
||||
|
<div class="full-code"> |
||||
|
<div class="code-wrapper"> |
||||
|
<img :src="icon" class="img" alt="" v-if="icon.length" /> |
||||
|
<img src="../../assets/images/nodata.svg" class="img nodata" alt="" v-else /> |
||||
|
|
||||
|
<p class="youhui" v-if="icon.length">{{ title }}</p> |
||||
|
<slot /> |
||||
|
<div class="close" @click="handleClose"> |
||||
|
<img src="../../assets/images/detail/yellow_close.png" alt="" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script setup> |
||||
|
defineProps({ |
||||
|
title: { |
||||
|
type: String, |
||||
|
default: '扫码排队' |
||||
|
}, |
||||
|
icon: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
} |
||||
|
}) |
||||
|
const emits = defineEmits(['close']) |
||||
|
|
||||
|
function handleClose() { |
||||
|
emits('close') |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.full-code { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
z-index: 10; |
||||
|
animation-duration: 0.2s; |
||||
|
} |
||||
|
.code-wrapper { |
||||
|
position: absolute; |
||||
|
top: 50%; |
||||
|
left: 50%; |
||||
|
width: 480px; |
||||
|
min-height: 366px; |
||||
|
transform: translate3d(-50%, -50%, 0); |
||||
|
background: #ffffff; |
||||
|
box-shadow: 0 40px 60px rgba(0, 0, 0, 0.08); |
||||
|
border-radius: 12px; |
||||
|
padding-top: 80px; |
||||
|
z-index: 10; |
||||
|
.img { |
||||
|
display: block; |
||||
|
margin: 0 auto 49px; |
||||
|
width: 150px; |
||||
|
height: 150px; |
||||
|
&.nodata { |
||||
|
width: 300px; |
||||
|
height: 300px; |
||||
|
} |
||||
|
} |
||||
|
.youhui { |
||||
|
font-weight: 700; |
||||
|
font-family: 'font_bold'; |
||||
|
font-size: 20px; |
||||
|
line-height: 23px; |
||||
|
text-align: center; |
||||
|
color: rgba(0, 0, 0, 0.8); |
||||
|
} |
||||
|
|
||||
|
.close { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
position: absolute; |
||||
|
top: 12px; |
||||
|
right: 12px; |
||||
|
width: 56px; |
||||
|
height: 56px; |
||||
|
background: rgba(0, 0, 0, 0.02); |
||||
|
border-radius: 12px; |
||||
|
img { |
||||
|
width: 56px; |
||||
|
height: 56px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,18 @@ |
|||||
|
import { storeToRefs } from 'pinia' |
||||
|
import { useStore } from '@/store/root' |
||||
|
import { getStatistics } from '@/http/api' |
||||
|
|
||||
|
/** |
||||
|
* @param {string} tag 设备点击量:device,导航使用次数:navigation,店铺点击次数:shop,业态点击次数:industry |
||||
|
*/ |
||||
|
export const useStatistics = tag => { |
||||
|
const store = useStore() |
||||
|
const { currentFloor } = storeToRefs(store) |
||||
|
const { projectCode, deviceCode } = currentFloor.value |
||||
|
const params = { |
||||
|
projectCode, |
||||
|
deviceCode, |
||||
|
tag |
||||
|
} |
||||
|
getStatistics(params) |
||||
|
} |
||||
Loading…
Reference in new issue