<template>
  <Select
    v-model="sels"
    style="width:150px"
    @on-change="onchange"
    clearable
    filterable
    remote
    :remote-method="remoteMethod"
    :loading="loading2"
    :multiple="isMulti"
    :placeholder="placeHolder"
  >
    <Option v-for="item in transdatas" :value="item.value" :key="item.value">{{ item.label }}</Option>
  </Select>
</template>
<script>
import { refQuery } from "@/api/meta";
export default {
  name: "modelselects",
  components: {},
  model: {
    prop: "value",
    event: "change"
  },
  props:["labelField","valueField","value","refModel","placeHolder","isMulti"], 
  data() {
    return {
      sels: this.value? this.value:[],
      datasource: [],
      loading2:false
    };
  },
    computed:{
    transdatas(){
       if(this.labelField && this.valueField){
           let mrtn= this.datasource.map(item=>{
              return {
                value:item[this.valueField],
                label:item[this.labelField]
              }
          })
          return mrtn
       }else{
         return this.datasource
       }
    }
  },
  watch: {
    value(nv, ov) {
      this.sels = nv;
    }
  },
  methods: {
    remoteMethod(q){
       this.loading2=true
        setTimeout(()=>{
           this.initDataSource(q)
        },500)
    },
    onchange(v) {
      console.log("=============", v);
      this.$emit("change", this.sels);
    },
    initDataSource(slike) {
      // this.datasource=[]
      let query = {};
      let url = "/web/common/" + this.refModel + "Ctl/refQuery";
      query.fields = [this.labelField, this.valueField];
      query.likestr = slike;
      query.refwhere = this.refwhere ? this.refwhere : {};
      refQuery(url, query).then(r => {
        if (r.data) {
          this.datasource = r.data;
          this.loading2=false
        }
      });
    }
  },
  created() {
   
  },
  mounted() {}
};
</script>

<style>
</style>
