contact-mov.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <template>
  2. <view>
  3. <movable-area class="move-area-ser">
  4. <movable-view direction="all" :x="pageX" :y="pageY" class="move-view-ser">
  5. <!-- <view class="contact-block" @tap="goIM">
  6. <view class="contact-wrapper"> -->
  7. <image class="contact-img" mode="aspectFit"
  8. src="https://mall.zhaijieshi.cc/file/jzmall-dy/ser-online.png" @longpress="goIM" @tap="goIM">
  9. </image>
  10. <!-- </view>
  11. </view> -->
  12. </movable-view>
  13. </movable-area>
  14. </view>
  15. </template>
  16. <script>
  17. export default {
  18. props: {
  19. pageX: {
  20. type: Number,
  21. default: 0
  22. },
  23. pageY: {
  24. type: Number,
  25. default: 300
  26. }
  27. },
  28. methods: {
  29. goIM() {
  30. console.info('goIm');
  31. uni.navigateTo({
  32. url: '/pages/chat/im/im'
  33. });
  34. },
  35. }
  36. }
  37. </script>
  38. <style scoped>
  39. .move-area-ser {
  40. width: 750rpx;
  41. height: 100vh;
  42. top: 0rpx;
  43. /* pointer-events: auto; */
  44. position: fixed;
  45. pointer-events: none;
  46. }
  47. .move-view-ser {
  48. pointer-events: auto;
  49. width: 208rpx;
  50. height: 330rpx;
  51. }
  52. .contact-img {
  53. width: 208rpx;
  54. height: 330rpx;
  55. margin: 0;
  56. }
  57. </style>