people_detail.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <view class="container">
  3. <!-- 每一个人员区域 -->
  4. <view class="box" v-for="item in dataList" :key="item.id">
  5. <image class="img" src="@/static/images/9.png"></image>
  6. <view class="name">{{ item.name }}</view>
  7. <!-- <view class="time">{{ type == 1 ? '报名' : '签到' }}时间:2024-02-02 16:53</view> -->
  8. </view>
  9. </view>
  10. </template>
  11. <script setup>
  12. import { onLoad } from '@dcloudio/uni-app'
  13. import { ref } from 'vue'
  14. // 页面类型 1 报名页面 2 签到页面
  15. const type = ref()
  16. // 人员列表
  17. const dataList = ref([])
  18. onLoad((options) => {
  19. if (options.type == 1) {
  20. uni.setNavigationBarTitle({
  21. title: '已报名成员'
  22. })
  23. }
  24. if (options.type == 2) {
  25. uni.setNavigationBarTitle({
  26. title: '签到成员'
  27. })
  28. }
  29. if (options.type) {
  30. type.value = options.type
  31. }
  32. if (options.list) {
  33. dataList.value = JSON.parse(decodeURIComponent(options.list))
  34. }
  35. })
  36. </script>
  37. <style lang="scss" scoped>
  38. .container {
  39. padding: 20rpx 18rpx;
  40. min-height: 100vh;
  41. font-size: 28rpx;
  42. color: #808080;
  43. .box {
  44. display: flex;
  45. align-items: center;
  46. padding: 10rpx 0;
  47. margin-bottom: 20rpx;
  48. border-bottom: 2rpx solid #e5e5e5;
  49. .img {
  50. width: 80rpx;
  51. height: 80rpx;
  52. border-radius: 50%;
  53. }
  54. .name {
  55. margin-left: 50rpx;
  56. }
  57. .time {
  58. margin-left: 50rpx;
  59. }
  60. }
  61. }
  62. </style>