Add a filter with quasar framework Vue.js

Question

Good afternoon, I am trying to implement a filter in a list that contains several filters, however I am not able to pull the data to filter them, it seems to me you have to pull send for one component and receive in another?

Columns are the filters (What I’m trying to implement is the signifitive person)

data() {
return {
  columns: [
    {
      name: "id",
      required: true,
      label: "Numero OS",
      field: "id",
      type: "string",
      width: 3,
      align: "center",
      sortable: true,
      required: true
    },
    {
      name: "cliente",
      label: "Cliente",
      field: "cliente",
      type: "cliente",
      width: 6,
      sortable: true,
      required: true
    },
    {
      name: "matrizFilial",
      label: "Matriz / Filial",
      field: "matrizFilial",
      type: "matrizFilial", 
      width: 3,                   
      sortable: true
    },   
    { 
      name: "situacao",
      label: "Situação",
      field: "situacao",
      type: "situacao",
      width: 3,
      sortable: true,
      required: true
    },   
    {
      name: "tipo",
      label: "Tipo OS",
      field: "tipo",
      type: "tipo",
      width: 3,
      sortable: true,
      required: true
    }, 
    {
      name: "projeto",
      label: "Centro de Lucro",
      field: "projeto",
      type: "projeto",
      width: 3,
      align: "center",
      sortable: true
    },   
    {
      name: "especialidade",
      label: "Especialidade",
      field: "especialidade",
      type: "especialidade",
      width: 3,
      sortable: true
    }, 
    {
      name: "statusNegocio",
      label: "Status Negócio",
      field: "statusNegocio",
      type: "statusNegocio",
      width: 3,
      sortable: true
    },
    {
      name: "motivoPerda",
      label: "Motivo Perda",
      field: "motivoPerda",
      type: "motivoPerda",
      width: 3,
      sortable: true
    },
    {
      name: "datasignificativa",
      label: "Data Significativa",
      field: "datasignificativa",
      type: "datetime",
      dontbreak: true,
      width: 6,
      sortable: true,
      required: true
    },
    {
      name: "pessoasignificativa",
      label: "Pessoa Significativa",
      field: "pessoasignificativa",
      type: "isfuncionario", 
      width: 3,                   
      sortable: true,
    },

The component containing the functionaries is that person-select that contains the types of functionaries

export default {
  name: "pessoa-select",
  components: {
    PessoaLink,
    PessoaEdit
  },
  props: {
    value: {
      type: Object
    },
    isFornecedor: {
      type: Boolean,
      default: null
    },
    isTerceiro: {
      type: Boolean,
      default: null
    },
    isFuncionario: {
      type: Boolean,
      default: null
    },
    isCliente: {
      type: Boolean,
      default: null
    },
    readonly: {
      type: Boolean,
      default: false
    },
    status: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      stopLoading: debounce(() => {
        this.loading = false;
      }, 350),
      query: "",
      pessoas: [],
      loading: false
    };
  },
  methods: {
    showResults() {
      const popover = this.$refs.popover;

      if (popover.showing) {
        this.$nextTick(() => popover.showing && popover.reposition());
      } else {
        popover.show();
      }
    },
    focus() {
      clearTimeout(this.timer);

      if (this.$refs.input) {
        this.$refs.input.focus();
      }
    },
    saved(val) {
      this.$emit("input", val);
    },
    search(val) {
      this.showResults();

      this.loading = true;

      this.$axios
        .get("/Pessoa/Autocomplete", {
          params: {
            query: val,
            isCliente: this.isCliente,
            isFuncionario: this.isFuncionario,
            isFornecedor: this.isFornecedor,
            isTerceiro: this.isTerceiro,
            status: this.status
          }
        })