Как вывести пустые не достающие объекты в массив?

Я использую pinia , а в ней я не могу использовать computed , в чем суть вопрос , у меня в сторедже pinia хранится массив , мне надо сделать так , что если в данном массиве объектов меньше 7 , то оно должно добавит не достающие кол-во пустых объектов , вот метод и сам сторедж

import {defineStore} from 'pinia'

export const useBusinessStore = defineStore('business', {
   state: () => {
      return {
         orderingProducts: [
            {idOrder: 1, productName: 'Cок', countProduct: 10, orderAmount: 10000, deliveryPrice: 500},
            {idOrder: 2, productName: 'Кола', countProduct: 10, orderAmount: 10000, deliveryPrice: 500},
            {idOrder: 3, productName: 'Лимонад', countProduct: 10, orderAmount: 10000, deliveryPrice: 500},
            {idOrder: 4, productName: 'Квас', countProduct: 10, orderAmount: 10000, deliveryPrice: 500},
            {idOrder: 5, productName: 'Фанта', countProduct: 10, orderAmount: 10000, deliveryPrice: 500}
         ],
      }                          
   },
   actions: {
      getPerfectOrderProduct() {
         if (this.orderingProducts.length < 7) {
            const numberOfMissingElements = 7 - this.orderingProducts.length;
            for (let i = 0; i < numberOfMissingElements; i++) {
               console.log(numberOfMissingElements)
               this.orderingProducts.push({
                  idOrder: null,
                  productName: '',
                  countProduct: null,
                  orderAmount: null,
                  deliveryPrice: null,
               });
            }
         }
      },
   },
})

вот так я объявляю pinia в компоненте

<script setup>
import { useBusinessStore } from '@/stores/PropertyStore/business'

const bizStore = useBusinessStore()
</script>

Вот так вывожу данный массив

<div class="table__main-item deliver" v-for="(order, index) in bizStore.orderingProducts" :key="index">
            <div class="table__main-block">{{order.idOrder}}</div>
            <div class="table__main-block">{{order.productName}}</div>
            <div class="table__main-block">{{order.idOrder != null ? order.orderAmount / order.countProduct : null}}</div>
            <div class="table__main-block">{{order.countProduct}}</div>
            <div class="table__main-block">{{order.orderAmount}}</div>
            <div class="table__main-block">{{order.deliveryPrice}}</div>
         </div>

Подумал что я могу сделать в computed метод вот такой

computed: {
         perfectOrderProduct() {
            this.bizStore.getPerfectOrderProduct()
            return this.bizStore.orderingProducts;
         }
      }

и заменить в v-for bizStore.orderingProducts на perfectOrderProduct чтобы оно сразу выводило не достающее кол-во объектов, если их меньше 7 , но оно ругается на

Cannot read properties of undefined (reading 'getPerfectOrderProduct')
TypeError: Cannot read properties of undefined (reading 'getPerfectOrderProduct')