猫妈狗爸伴宠师小程序前端代码
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.

159 lines
4.7 KiB

  1. <template>
  2. <view class="bind-user">
  3. <view class="bind-user-header">
  4. <view class="flex mb28">
  5. <up-image width="139rpx" height="139rpx" :src="userInfo?.userImage" shape="circle"></up-image>
  6. <view class="header-name">
  7. <view class="font32 mb20" :style="{color:'#000'}">{{ userInfo?.userName}}</view>
  8. <view class="label1">
  9. {{ baseInfo.partner_level }}
  10. </view>
  11. <view class="flex font24">
  12. <view :style="{color:'#A55822'}">当前分成比例
  13. <text :style="{color:'#C12525'}">25%</text>
  14. </view>
  15. <view :style="{color:'#A55822'}">晋级后分成比例
  16. <text :style="{color:'#C12525'}">30%</text>
  17. </view>
  18. </view>
  19. </view>
  20. </view>
  21. <view class="flex flex-evenly mt60">
  22. <view class="header-card card-left box-size"
  23. @click="configPopupRef.open('pet_attention_details')">
  24. <view class="flex-between flex">
  25. <view class="mr20">
  26. <view class="mb20 ml20" :style="{color:'#A55822',fontWeight:'bold',fontSize:'30rpx'}">推广攻略
  27. </view>
  28. <view :style="{color:'#A55822',fontSize:'22rpx'}">快速定位宠友群体</view>
  29. </view>
  30. <up-image :show-loading="true" src="https://cdn.catmdogd.com/Work/image/work/icon1.png"
  31. width="71rpx" height="85rpx"></up-image>
  32. </view>
  33. </view>
  34. <view class="header-card card-right box-size"
  35. @click="configPopupRef.open('pet_attention_details')">
  36. <view class="flex flex-between">
  37. <view class="mr20">
  38. <view class="mb20 ml20" :style="{color:'#A55822',fontWeight:'bold',fontSize:'30rpx'}">推广教程
  39. </view>
  40. <view :style="{color:'#A55822',fontSize:'22rpx'}">推广问题一目了然</view>
  41. </view>
  42. <up-image :show-loading="true" src="https://cdn.catmdogd.com/Work/image/work/icon2.png"
  43. width="71rpx" height="85rpx"></up-image>
  44. </view>
  45. </view>
  46. </view>
  47. </view>
  48. <!--
  49. :style="{'background-image' : `url(${configList.background_popularize_one.paramValueImage})`}" -->
  50. <view class="bind-main">
  51. <view class="bind-main-one mb10"
  52. :style="{'background-image' : `url('${configList.background_popularize_one.paramValueImage}')`}">
  53. <view class="mb20 font32">邀请码邀请</view>
  54. <view class="mb20">用户输入邀请码直接完成绑定</view>
  55. <up-input disabled v-model="dataF.code">
  56. <template #suffix>
  57. <up-button @click="copyMessage(dataF.code)" text="复制" type="success" size="small" shape="circle"></up-button>
  58. </template>
  59. </up-input>
  60. </view>
  61. <view class="bind-main-two mb10"
  62. :style="{'background-image' : `url('${configList.background_popularize_two.paramValueImage}')`}">
  63. <view class="mb20 font32">分享海报邀请</view>
  64. <view class="mb20">扫码进入猫妈狗爸完成绑定</view>
  65. <up-button @click="toSharing" text="保存海报" type="primary" shape="circle" plain style="background: transparent;"></up-button>
  66. </view>
  67. <view class="bind-main-three"
  68. :style="{'background-image' : `url('${configList.background_popularize_three.paramValueImage}')`}">
  69. <view class="mb20 font32">分享链接邀请</view>
  70. <view class="mb20">复制链接给好友进入直接绑定</view>
  71. <up-input disabled v-model="dataF.code">
  72. <template #suffix>
  73. <up-button @click="copyMessage(dataF.code)" text="复制" type="success" size="small" shape="circle"></up-button>
  74. </template>
  75. </up-input>
  76. </view>
  77. </view>
  78. <configPopup ref="configPopupRef" />
  79. </view>
  80. </template>
  81. <script setup>
  82. import {
  83. computed,
  84. ref,
  85. onMounted,
  86. } from "vue";
  87. import {
  88. useStore
  89. } from "vuex"
  90. import {
  91. binBaseInfo,
  92. bindCode,
  93. } from "@/api/home.js"
  94. import configPopup from '@/components/configPopup.vue'
  95. const store = useStore();
  96. const dataF = ref({})
  97. const baseInfo = ref({})
  98. const configPopupRef = ref(null)
  99. const configList = computed(() => {
  100. return store.getters.configList
  101. })
  102. const userInfo = computed(() => {
  103. return store.getters.userInfo
  104. })
  105. //复制
  106. const copyMessage = (value) => {
  107. uni.setClipboardData({
  108. data: value,
  109. success: function(res) {
  110. uni.getClipboardData({
  111. success: function(res) {
  112. uni.showToast({
  113. icon: 'none',
  114. title: "复制成功",
  115. });
  116. },
  117. });
  118. },
  119. });
  120. }
  121. const getBaseInfo = () => {
  122. binBaseInfo(baseInfo.value.userId).then(res => {
  123. baseInfo.value = res.data
  124. })
  125. bindCode(baseInfo.value.userId).then(res => {
  126. dataF.value = res.data
  127. })
  128. }
  129. function toSharing(){
  130. uni.navigateTo({
  131. url: `/otherPages/workbenchManage/bindUser/sharing`
  132. })
  133. }
  134. onMounted(() => {
  135. baseInfo.value = JSON.parse(uni.getStorageSync("baseInfo"))
  136. getBaseInfo()
  137. })
  138. </script>
  139. <style scoped lang="scss">
  140. @import "index";
  141. </style>