<template>
  <el-select v-model="localUserId" placeholder="请选择完善人" clearable @change="handleChange">
    <el-option
      v-for="user in userList"
      :key="user.userId"
      :label="user.nickName"
      :value="user.userId"
    />
  </el-select>
</template>
<script>
import { listAllUser } from '@/api/system/user'

export default {
  name: 'SelectUser',
  model: {
    prop: 'userId',
    event: 'update:userId'
  },
  props: {
    userId: String
  },
  data() {
    return {
      userList: []
    }
  },
  computed: {
    localUserId: {
      get() {
        return this.userId
      },
      set(val) {
        this.$emit('update:userId', val)
      }
    }
  },
  created() {
    this.getUserList()
  },
  methods: {
    getUserList() {
      this.userList = []
      listAllUser().then(({ data }) => {
        this.userList = data && data.length > 0 ? data : []
      })
    },
    handleChange(val) {
      const user = this.userList.find(item => item.userId === val)
      this.$emit('change', user)
    }
  }
}
</script>
<style scoped lang="scss">

</style>
