How to edit a field mongodb, nodejs with vuejs using Id

I am working on a application using mongodb, nodejs, and vuejs(with vuetify). I have currently set up my backend API which is working correctly when I tested with postman .Below is the code;

const express = require('express');
const router = express.Router();
const {Client, Provider} = require('../models/Client');

// Edit a Client from List

router.post("/edit/:clientId", async (req, res) => {
    try{
    const editClient = await Client.updateMany(
        {"client._id": req.params.clientId},
        {   
            $set:
            {
                "client.$.name": req.body.name,
                "client.$.email": req.body.email,
                "client.$.phone": req.body.phone,
                "client.$.providers.0.pname": req.body.pname,
            }
        }   
        );
        res.json(editClient);
            }catch (err) {
                res.json({ message: err });
    }
});

module.exports = router;

I also have a file(clientService.js) to import the url using axios. the code is below;

import axios from 'axios';

const url = 'http://127.0.0.1:2111/api/clients/';

    // Edit client
    static async editClient(
            name,
            email,
            phone,
            pname,
            id
    ){
        return axios.post(url+"edit/"+`${id}`),{
            name,
            email,
            phone,
            pname
        }
    }
}

export default clientService;

I also created a frontend file(Editclient.vue) with vuejs to edit. Below is the code;

<template>
    <v-container fluid class="editclient">
        <v-card
            elevation="2"
            outlined
            min-width="500"
            min-height="400"
            class= "my-12 px-2 pb-2"
        >
<form >
    <v-text-field
      :counter="50"
      label="Name"
      required
      name="name"
      v-model="name"
      clearable
    ></v-text-field>
    <v-text-field
      label="E-mail"
      required
      name="email"
      v-model="email"
      clearable
    ></v-text-field>
    <v-text-field
      label="Phone"
      required
      name="phone"
      v-model="phone"
      clearable
    ></v-text-field>
    <v-text-field
      required
      name="pname"
      label="Provider"
      v-model="pname"
      clearable
    ></v-text-field>

    <v-row class="mt-12">
        <v-btn
        class="white--text ml-3"
        color="red"
      >
        delete
      </v-btn>
    <v-spacer></v-spacer>
    <v-btn
        class="white--text mr-3"
        color="teal"
        @click="edit(rou)"
      >
        Edit Client
     </v-btn>
      <v-btn
        class="white--text mr-3"
        color="teal"
       to = "/"
      >
        return
      </v-btn>
    </v-row>      
  </form>
</v-card>
    </v-container>
</template>


<script>
  import clientService from '../clientService'

  export default {
    data () {
      return {
        clients: [],
        providers: [],
        name: [],
        email: [],
        phone: [],
        pname:[],
        idy:[],
        rou: '',
      }
    },
    async created() {
      try {
        var clientData = await clientService.getClients();
        this.clients = clientData[0].client;
        this.providers = clientData[0].providers;
        var client = this.clients;
        //var providers = this.providers;
        console.log(this.$route.params.id);
        console.log(client)


        var name = client.map(names => names.name);
        var email = client.map(emails => emails.email);
        var phone = client.map(phones => phones.phone);
        var idy = client.map(ids => ids._id);
        this.rou = this.$route.params.id;

        var i;
        for(i=0;i<idy.length;i++) {
        if(this.$route.params.id == idy[i]){
                this.name = name[i];
                this.email = email[i];
                this.phone = phone[i];
                this.idy = idy[i];
            }
        }       
        //console.log(idy);
        console.log(this.rou);
      }
      catch(err){
        this.error = err.message;
      }
    },
    methods: {
       async edit(id) {
        await clientService.editClient(
          this.name,
          this.email,
          this.phone,
          this.pname,
          id,
        );
        prompt('submitted')
      },
    }
  }
</script>

I want to edit from my vuejs frontend using ID but it is not working, thought the backend works from my postman test. Please I need help on how to implement the backend to work.

Thanks for your support in advance.