Vuetify how can I disable button till all validation rules are true?

You can create a computed property do to it. Lets say name and site are requireds, so:

<temlate>
  <v-btn :disabled="isAddButtonDisabled" @click="submit" color="grey darken-4" class="green--text text--accent-2" dark>Add</v-btn>
</template>

<script>
export default {
  data() {
    return {
      addTool: {
        name: "",
        categories: [],
        created_on: "",
        site: ""
      },
    };
  },
  computed: {
    isAddButtonDisabled() {
      return !(this.addTool.name || this.addTool.site);
      // means u have neither name nor site  
    },
  },
};
</script>

If you need to check if form is valid, you can do:

export default {
  computed: {
    formValid () {
      // loop over all contents of the fields object and check if they exist and valid.
      return Object.keys(this.addTool).every(field => {
        return this.addTool[field] && this.addTool[field].valid;
      });
    }
  }
}

From here: https://github.com/logaretm/vee-validate/issues/853

Vuetify will track the validity of form if you wrap input elements in v-form and then attach v-model to form like this:

<v-form v-model="isFormValid">
  <!-- all input elements go here -->
</v-form>

<!-- disable if form is not valid -->
<v-btn :disabled="!isFormValid">Add</v-btn>

You also need to add isFormValid to the component's data field:

data: () => ({
  isFormValid: false,
})

You can read more here: https://vuetifyjs.com/en/components/forms