<template>
  <view class="body-background"></view>
  <u-navbar
      :title="title"
      :auto-back="true"
      left-icon-size="40rpx"
      :safe-area-inset-top="true"
      :placeholder="true"
      bgColor="#ffffff"
  ></u-navbar>
  <view style="width:100%;height:16rpx;background-color:#F5F5F6; "></view>
  <view class="app-wallpaper">
    <view class="join-container">
<!--      <view class="join-title">-->
<!--        <u-text text="参加人员名单" color="#020B18" size="36" line-height="36"></u-text>-->
<!--      </view>-->
      <view class="join-consultant-title join-desc-title row" v-if="advisor_list.length > 0">
        <view class="icon">
          <u-image :src="staticImage.consultantIcon" mode="widthFix" width="48" height="48"></u-image>
        </view>
        <view class="title">
          <u-text text="顾问" color="#178AF2" size="32" line-height="36"></u-text>
        </view>
      </view>
      <view class="consultant-list">
        <view class="list-item row" v-for="item in advisor_list" v-if="advisor_list.length > 0">
          <view class="name">
            <u-text :text="item.name" color="#666" size="28" line-height="50"></u-text>
          </view>
<!--          <view class="position">-->
<!--            <u-text :text="item.age" color="#666" size="28" line-height="50"></u-text>-->
<!--          </view>-->
          <view class="time">
            <u-text :text="$u.timeFormat(item.create_time, 'yyyy/mm/dd')" color="#666" size="28" line-height="50"></u-text>
          </view>
        </view>
      </view>
      <view class="join-people-title join-desc-title row" v-if="user_list.length > 0">
        <view class="icon">
          <u-image :src="staticImage.peopleIcon" mode="widthFix" width="48" height="48"></u-image>
        </view>
        <view class="title">
          <u-text text="参加人员" color="#FF9545" size="32" line-height="36"></u-text>
        </view>
      </view>
      <view class="people-list">
        <view class="list-item row" v-for="item in user_list" v-if="user_list.length > 0">
          <view class="name">
            <u-text :text="item.name" color="#666" size="28" line-height="50"></u-text>
          </view>
<!--          <view class="position">-->
<!--            <u-text :text="item.age" color="#666" size="28" line-height="50"></u-text>-->
<!--          </view>-->
          <view class="time">
            <u-text :text="$u.timeFormat(item.create_time, 'yyyy/mm/dd')" color="#666" size="28" line-height="50"></u-text>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import {
  imghost
} from '@/config/host.js'
import MzSubsection from '@/components/MzSubsection/Index.vue';
import api from '@/utils/functions.js';
import {goodsOrder, orderLogistics, roomOrder, tabCount} from "@/api/user";
import {joinList} from "@/api/other";

export default {
  components: {
    MzSubsection
  },
  data() {
    return {
      listItem:[
        {name:'全部留言'},
        {name:'已回答'},
        {name:'未回答'},
      ],
      tabCheck:'room',
      title: '参加人员名单',
      loading: true,
      staticImage: {
        bg: imghost + '/BG.png',
        newIcon: imghost + '/new-icon.png',
        shopThumb: imghost + '/new-1.png',
        ask:imghost+ '/ask.png',
        answer:imghost+ '/answer.png',
        listPosition:imghost+'/service-position.png',
        listPhone:imghost+'/service-phone.png',
        rightRed:imghost+'/activity-red.png',
        rightBlue:imghost+'/activity-blue.png',
        rightGreen:imghost+'/activity-green.png',
        rightOrange:imghost+'/activity-orange.png',
        consultantIcon:imghost+'/consultant-icon.png',
        peopleIcon:imghost+'/people-icon.png',
      },
      // item:{
      //   status:1,
      //   type_name:'社区活动',
      //   community:'三元社区',
      //   title:'家庭教育培训课堂开课啦！',
      //   address:'asdasd',
      //   start_time:'2023-11-11',
      //   cover:imghost+'/activity-banner.png',
      // },
      id:'',
      advisor_list:[],
      user_list:[],
    }
  },
  onLoad(option) {
    this.id = option.id;
  },
  onReady() {

  },
  computed: {

  },
  methods: {
    getJoinList(){
      let that = this;
      joinList({relevancy_type:2,relevancy_id:this.id}).then(res => {
        that.user_list = res.data.user_list;
        that.advisor_list = res.data.advisor_list;
      })
    }
  },
  onReachBottom() {

  },
  onPageScroll(res) {

  },
  mounted() {
    this.getJoinList();
  },
  created() {

  }
}
</script>

<style lang="scss">
@import './components/join.scss';
</style>