<template>
  <div>
    <slot></slot>
    <el-drawer append-to-body :show-close="false" :visible.sync="dialogFormVisible" size="60%">
      <div slot="title" style="font-size: 15px">
        选择团队人员
      </div>
      <div class="drawer__panel">
        <el-input style="width:250px;margin-bottom:10px" size="small" placeholder="请输入搜索内容" clearable @clear="getOrderList(params.content.pageNumber=1)" v-model="params.content.where.condition" @keyup.enter.native="getOrderList(params.content.pageNumber=1)"></el-input>
        <selectTable @selectChange="selectChange" v-if="dialogFormVisible" idName="userid" ref="table" v-model="result" :layout="tablecols" :data="teamList" :custom="true" height="500px"  @upDateData="upDateData">
           <template v-slot:customcol="scope">
              <div>{{scope.column.data[scope.column.columnname]}}</div>
            </template>
        </selectTable>
        <div class="container normal-panel" style="text-align:right">
          <el-pagination
              style="text-align:right"
              background
              small
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="params.content.pageNumber"
              :page-size="params.content.pageSize"
              layout="total, prev, pager, next, jumper"
              :total="total">
          </el-pagination>
        </div>
      </div>
      <div class="fixed__btn__panel">
        <el-button size="small" @click="dialogFormVisible = false" class="normal-btn-width">取 消</el-button>
        <el-button size="small" type="primary" @click="onSubmit" :disabled="selectArr.length <=0" class="normal-btn-width">确 定</el-button>
      </div>
    </el-drawer>
  </div>
</template>

<script>
import selectTable from '@/components/selectTable/index'
export default {
  props:[],
  components:{selectTable},
  data(){
    return {
      dialogFormVisible:false,
      tablecols:[],
      teamList:[],
      total:0,
      params: {
        "id": 20221102090303,
        "content": {
          containssub:true,
          departmentids:[1],
            where: {
              isworker:0
            }
        }
      },
      result:'',
      selectArr:[]
    }
  },
  methods:{
    onSubmit () {
      if(this.selectArr.length <= 0) return
      this.$emit('teamChange',this.selectArr)
    },
    async getOrderList () {
      let res = await this.$api.requested(this.params)
      console.log(res.data);
      
      this.teamList = res.data
      this.total = res.total
      console.log(res);
    },
    selectChange (data) {
      this.selectArr = data
      console.log(this.selectArr);

    },
    upDateData (data) {
      this.selectArr = data
    },
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.params.content.pageSize = val
      this.getOrderList()
    },
    handleCurrentChange(val) {
      // console.log(`当前页: ${val}`);
      this.params.content.pageNumber = val
      this.getOrderList()
    },
  },
  created () {
    this.getOrderList()
    this.tablecols = this.tool.tabelCol(this.$route.name).staffTable.tablecols
  }
}
</script>

<style scoped>
</style>