<template>
  <div class="container">
    <!-- <van-pull-refresh v-model="isLoading" @refresh="onRefresh"> -->
    <van-button type="primary" style="width:50%" @click="checkAll">全选</van-button>
    <van-button type="info" style="width:50%"  @click="toggleAll">反选</van-button>
    <van-checkbox-group class="myGroup" v-model="result" ref="checkboxGroup">
      <van-checkbox class="myCheckbox" icon-size="24px" :name="item" v-for="(item,index) in rooms">{{ item.name }}</van-checkbox>
    </van-checkbox-group>
    <van-button class="submitbutton" type="info" @click="handOk">确定</van-button>

    
    <!-- </van-pull-refresh> -->
  </div>
</template>

<script>
export default {
  name: "selMetRooms",
  components: {

  },
  props: {
    participants: {
      type: Array,
    }
  },
  data() {
    return {
      rooms: [],
      result:[],
      isLoading: false,
      page: 1,
    }
  },
  computed: {},
  filters: {},
  watch: {},
  mounted(){
    window.scrollTo(0,0);
  },
  created() {
    this.loadData(1)
  },
  methods: {
    loadData(page) {
      let url = `${window.context.xqhk}/bizMeetingPlaceName/v1/getJson`
      this.$http.post(url, {
        groupRelation: "AND",
        groupTree: {},
        pageBean: {
          "page": 1,
          "pageSize": 100,
          "showTotal": true
        },
        params: {},
        querys: [

        ],
        sorter: [
        ]
      }).then(res => {
        console.log(res, 'res')
        if (res.status == 200) {
          let Arr = res.data.value
          Arr.forEach(e => {
            this.rooms.push(e)
          });
          // this.page++;
          // console.log(res.data.rows, 'res.data.value.row')
          // this.metDataList.forEach(e => {
          //   this.users.push(e.name)
          // })
        } else {
          Message.error(res.data.message)
        }

      })
    },
    handleRoom(item) {
      let roomArr = []
      roomArr.push(item)
      let jsonStr = JSON.stringify(JSON.stringify(roomArr))
      console.log(jsonStr, 'jsonStr')
      localStorage.setItem('room2', jsonStr)
      this.$router.push({
        name: 'order2',
        params: {
          room: item
        }
      })
    },
    onRefresh() {
      this.loadData(this.page)
      this.isLoading = false;
    },
    handOk(){
      console.log(this.result,'this.result')
      let roomArr = []
      this.result.forEach(item=>{
        roomArr.push(item)
      })
      
      let jsonStr = JSON.stringify(roomArr)
      console.log(jsonStr,'jsonStr')
      localStorage.setItem('room2', jsonStr)
      this.$router.push({
        name: 'order2',
        params: {
          room: jsonStr
        }
      })
    },
    checkAll() {
      this.$refs.checkboxGroup.toggleAll(true);
    },
    toggleAll() {
      this.$refs.checkboxGroup.toggleAll();
    },
  }
}
</script>

<style lang="scss" scoped>
.container {
  width:375PX;
  height: 100%;
  margin: 0 auto;
  margin-top: 55PX !important;
}

.rooms {
  border-bottom: 1px rgb(177, 176, 176) solid;
  width: 100%;
  height: 15vw;
  line-height: 15vw;
  margin-left: 3vw;
  font-weight: 600;
  padding-left: 3vw;
}
.myGroup{
  width:100%
}
.myCheckbox{
  height:62PX;
  border-bottom:1px rgb(177, 176, 176) solid;
}
.submitbutton{
  width:100%;
  text-align:center;
}
</style>
