signUserInfo.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <template>
  2. <view class="sign-user-info" @click.stop="$emit('click')">
  3. <wk-avatar
  4. :name="itemData.realname"
  5. :avatar="itemData.img"
  6. class="avatar" />
  7. <view class="info">
  8. <text class="name">
  9. {{ itemData.realname }}
  10. </text>
  11. <text class="group-name">
  12. {{ itemData.attendance_name }}
  13. </text>
  14. </view>
  15. <slot :scope-data="itemData" />
  16. </view>
  17. </template>
  18. <script>
  19. /**
  20. * 单个用户考勤组信息 box
  21. */
  22. export default {
  23. name: 'SignUserInfo',
  24. props: {
  25. itemData: {
  26. type: Object,
  27. default: () => {
  28. return {
  29. realname: ''
  30. }
  31. }
  32. }
  33. },
  34. }
  35. </script>
  36. <style scoped lang="scss">
  37. .sign-user-info {
  38. width: 100%;
  39. color: #333;
  40. font-size: 30rpx;
  41. padding: 24rpx 32rpx;
  42. border-bottom: 1rpx solid $border-color;
  43. background-color: white;
  44. @include left;
  45. .avatar {
  46. width: 80rpx;
  47. height: 80rpx;
  48. margin-right: 16rpx;
  49. }
  50. .info {
  51. flex: 1;
  52. display: flex;
  53. flex-direction: column;
  54. .name {}
  55. .group-name {
  56. color: #999;
  57. font-size: 26rpx;
  58. }
  59. }
  60. }
  61. </style>