Building Json Object from Vue input fields

Im trying to generate a JSON object with a vue method and using vue input data fields to build part of the JSON object. My input files accept a key and a value and i have two default values ‘zone’ and ‘capping’. My goal is for the JSON object to be like:

{
"zone":{
  "capping":{
    "duration": 300
  }
 }
}

But instead i get a JSON object like this:

{
   "zone":{
      "capping":{
         "values":[
            {
               "key":"duration",
               "value":"300"
            }
         ]
      }
   }
}

This is my vue method:

generateJson() {
      const values = this.inputs
      const loopedObj = values.forEach((item) => {
        const val = {
          ...item
        }
        return val
      })
      console.log(values)
      const jsonValues = {
        zone: {
          capping: {
            values
          }
        }
      }
      console.log(JSON.stringify(jsonValues))
    }

This is the Vue code for the input fields:

<div>
          <p>3- Add Data</p>
          <button @click="showInput">+</button>
          <div v-for="(input, k) in inputs" :key="k">
            <input v-model="input.key" type="text" @change="getKey($event)" />
            <input
              v-model="input.value"
              type="text"
              @change="getValue($event)"
            />
          </div>

Any advice? Many thanks.