customerService.vue 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <template>
  2. <view style="touch-action: none;" v-if="is_open_service != '0' || merId != '0'">
  3. <view class="customerService" @touchmove.stop.prevent="setTouchMove" :style="{top:topConfig}">
  4. <navigator class="pictrue" :url="'/pages/chat/customer_list/chat?mer_id='+merId" hover-class="none">
  5. <image :src="logoConfig"></image>
  6. </navigator>
  7. </view>
  8. </view>
  9. </template>
  10. <script>
  11. import { configMap } from '@/utils/index';
  12. export default {
  13. name: 'customerService',
  14. props: {
  15. dataConfig: {
  16. type: Object,
  17. default: () => {}
  18. },
  19. merId: {
  20. type: [String, Number],
  21. default: '0'
  22. }
  23. },
  24. computed: configMap({ is_open_service:0 }),
  25. data() {
  26. return {
  27. logoConfig: this.dataConfig.logoConfig.url,
  28. topConfig: (this.dataConfig.topConfig.val || 75)+'%'
  29. };
  30. },
  31. created() {},
  32. methods: {
  33. setTouchMove(e) {
  34. var that = this;
  35. if (e.touches[0].clientY < 545 && e.touches[0].clientY > 66) {
  36. that.topConfig = e.touches[0].clientY+'px'
  37. }
  38. },
  39. }
  40. }
  41. </script>
  42. <style lang="scss">
  43. .customerService {
  44. position: fixed;
  45. right: 20rpx;
  46. z-index: 999;
  47. /* #ifdef MP || APP-PLUS */
  48. top: 160rpx;
  49. right: 0;
  50. /* #endif */
  51. .pictrue {
  52. width: 86rpx;
  53. height: 86rpx;
  54. border-radius: 50%;
  55. image {
  56. width: 100%;
  57. height: 100%;
  58. }
  59. }
  60. }
  61. </style>