aboutOther.vue 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <template>
  2. <div class="about-me">
  3. <back-bar title="用户信息"></back-bar>
  4. <div class="pub-user-top" v-if="userInfo">
  5. <div class="avatar-wrap">
  6. <img class="user-avatar" v-if="userInfo.cover_photo" :src="userInfo.cover_photo" alt="" @click.stop="$showImgPreview(userInfo.cover_photo)">
  7. <div v-else class="user-avatar"
  8. :class="'avatar_bg' + userInfo.user_id % 9"
  9. :data-name="userInfo.nick_name.slice(0,2).toUpperCase()"
  10. ></div>
  11. </div>
  12. <div class="top-info">
  13. <div class="name">{{userInfo.nick_name}}</div>
  14. <div class="code">{{$t('h5.username')}}:@{{userInfo.user_name}}</div>
  15. </div>
  16. </div>
  17. <ul class="pub-account-list" v-if="userInfo">
  18. <li class="list-item" v-for="(item, key) in userInfo.binds" :key="key">
  19. <div class="icon-wrap">
  20. <i :class="`${item.type}-icon`"></i>
  21. </div>
  22. <div class="info">
  23. <div class="title-wrap">
  24. <h4>{{item.type.toUpperCase()}}</h4>
  25. <p>{{item.account || $t('h5.notBind')}}</p>
  26. </div>
  27. <div class="opetate" v-if="item.account">
  28. <i :class="item.is_visible === 0 ? 'unopen' : 'open'"></i>
  29. <p>{{item.is_visible === 0 ? $t('userinfo.private') : $t('userinfo.public')}}</p>
  30. </div>
  31. </div>
  32. </li>
  33. </ul>
  34. <div class="pub-bottom-btn ext-send" @click="sendMsg">{{$t('public.sendMessage')}}</div>
  35. </div>
  36. </template>
  37. <script>
  38. // import { mapState } from 'vuex'
  39. // import API from '@/api'
  40. import backBar from '@/components/backBar'
  41. import { otherInfoMixins } from '@/mixins/user'
  42. export default {
  43. name: 'aboutOther',
  44. mixins: [otherInfoMixins],
  45. components: {
  46. backBar
  47. },
  48. data () {
  49. return {
  50. userId: this.$route.params.id
  51. }
  52. },
  53. computed: {
  54. },
  55. methods: {
  56. }
  57. }
  58. </script>
  59. <style lang="scss" scoped>
  60. </style>