You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
108 lines
2.6 KiB
108 lines
2.6 KiB
<template>
|
|
<!-- 在线客服 -->
|
|
<view class="custmer" v-show="!isSortType">
|
|
<!-- #ifdef H5 || APP-PLUS -->
|
|
<view class="customerService" :class="positions?'':'on'" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove" @click="licks">
|
|
<view class="pictrue">
|
|
<image :src="logoConfig"></image>
|
|
</view>
|
|
</view>
|
|
<!-- #endif -->
|
|
<!-- #ifdef MP -->
|
|
<view class="customerService" :class="positions?'':'on'" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove" v-if="routineContact === 0" @click="licks">
|
|
<view class="pictrue">
|
|
<image :src="logoConfig"></image>
|
|
</view>
|
|
</view>
|
|
<button class="customerService-sty" :class="positions?'':'on'" :style="'top:'+topConfig" @touchmove.stop.prevent="setTouchMove" open-type='contact' v-if="routineContact === 1">
|
|
<image class="pictrue" :src="logoConfig"></image>
|
|
</button>
|
|
<!-- #endif -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
mapGetters
|
|
} from "vuex";
|
|
export default {
|
|
name: 'customerService',
|
|
computed: mapGetters(['userInfo']),
|
|
props: {
|
|
dataConfig: {
|
|
type: Object,
|
|
default: () => {}
|
|
},
|
|
isSortType:{
|
|
type: String | Number,
|
|
default:0
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
routineContact: parseFloat(this.dataConfig.routine_contact_type),
|
|
logoConfig: this.dataConfig.logoConfig.url,
|
|
topConfig: this.dataConfig.topConfig.val?this.dataConfig.topConfig.val>=80?80+'%':this.dataConfig.topConfig.val+'%':'30%',
|
|
positions: this.dataConfig.locationConfig.tabVal
|
|
};
|
|
},
|
|
created() {
|
|
},
|
|
methods: {
|
|
licks(){
|
|
if (this.dataConfig.buttonConfig.tabVal) {
|
|
let userInfo = {}
|
|
if(typeof this.userInfo === 'string'){
|
|
userInfo = JSON.parse(this.userInfo)
|
|
}else{
|
|
userInfo = this.userInfo
|
|
}
|
|
this.$util.getCustomer(userInfo)
|
|
} else{
|
|
this.$util.JumpPath(this.dataConfig.logoConfig.link);
|
|
}
|
|
// let userInfo = {}
|
|
// if(typeof this.userInfo === 'string'){
|
|
// userInfo = JSON.parse(this.userInfo)
|
|
// }else{
|
|
// userInfo = this.userInfo
|
|
// }
|
|
// this.$util.getCustomer(userInfo)
|
|
},
|
|
setTouchMove(e) {
|
|
var that = this;
|
|
if (e.touches[0].clientY < 545 && e.touches[0].clientY > 66) {
|
|
that.topConfig = e.touches[0].clientY+'px'
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.custmer {
|
|
touch-action: none;
|
|
}
|
|
.customerService,.customerService-sty {
|
|
position: fixed;
|
|
right: 20rpx;
|
|
z-index: 40;
|
|
&.on {
|
|
left:20rpx;
|
|
}
|
|
.pictrue {
|
|
width: 86rpx;
|
|
height: 86rpx;
|
|
border-radius: 50%;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
}
|
|
.customerService-sty{
|
|
background-color: rgba(0,0,0,0) !important;
|
|
}
|
|
</style>
|
|
|