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.
duomendian/pages/index/components/customerService.vue

109 lines
2.6 KiB

3 months ago
<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>