This is the API call that I am making, I am unable to call it in vue.js the schema of graphql is given below

mutation{ tokenAuth(username:"name", password:"jasdasa") { token success errors } }

const data = axios({
  url: "https://indev-xyz-grapql.herokuapp.com/authgraphql",
  method: 'post',
  data: {
    query: `mutation{
  tokenAuth(username: this., password:this.password) {
    token
    success
    errors
  }
}`
  }
}).then((result) => {
  console.log(result.data)
});

This is the error I am getting in the console

utils.js?c786:151 
        
       Uncaught (in promise) Error: Request failed with status code 404
    at createAxiosError (utils.js?c786:151)
    at Object.settle (utils.js?c786:142)
    at handleRequest (handle_request.js?da0c:127)
    at eval (index.js?94db:26)
    at new Promise (<anonymous>)
    at MockAdapter.eval (index.js?94db:25)
    at dispatchRequest (dispatchRequest.js?5270:53)
    at Axios.request (Axios.js?0a06:108)
    at wrap (bind.js?1d2b:9)
    at eval (SignIn.vue?d20b:49)
createAxiosError @ utils.js?c786:151
settle @ utils.js?c786:142
handleRequest @ handle_request.js?da0c:127
eval @ index.js?94db:26
eval @ index.js?94db:25
dispatchRequest @ dispatchRequest.js?5270:53
request @ Axios.js?0a06:108
wrap @ bind.js?1d2b:9
eval @ SignIn.vue?d20b:49
Promise.then (async)
eval @ SignIn.vue?d20b:61
setTimeout (async)
onSubmitLogin @ SignIn.vue?d20b:48
eval @ vee-validate.esm.js?7bb1:2110
Promise.then (async)
submissionHandler @ vee-validate.esm.js?7bb1:2108
callWithErrorHandling @ runtime-core.esm-bundler.js?5c40:6668
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js?5c40:6677
invoker @ runtime-dom.esm-bundler.js?830f:347