lanan-system-vue/src/views/repair/Components/UserChoose.vue

<template>
  <el-select v-model="userSelected" clearable filterable >
    <el-option v-for="user in userList" :key="user.id" :label="user.cusName" :value="user.id" />
  </el-select>
</template>

<script>

import {getCustomerMainPage} from "@/api/base/customer";

export default {
  name: "UserChoose",
  props:{
    value:{
      type: Object,
    }
  },
  data() {
    return {
      userList: [],
      userSelected: undefined,
      queryParams:{
        pageNo: 1,
        pageSize: 10
      },
      total: 0
    }
  },
  watch:{
    userSelected(val){
      if (val){
        const user = this.userList.find(item => item.id === val)
        this.$emit("input", user)
      }
    },
    value(val){
      this.userSelected = val ? val.id : null
    }
  },
  mounted() {
    this.listCustomer()
  },
  methods: {
    async listCustomer(){
      const res = await getCustomerMainPage(this.queryParams)
      this.userList = res.data.records
      this.total = res.data.total
    }
  }
}
</script>

<style scoped lang="scss">

</style>