Добавление блока индексируемного Vue js

Как сделать такое добавление блока при нажатии на кнопку добавить блок как здесь, чтобы присваивался id и можно было перемещать блоки

компонент перемещения использую вот этот

<template>
    <form class="form-add side">
        <div class="form-wrapper pr-50">
            <div class="form--text_data">
                <div class="form--container__data">
                    <div class="form--item">
                        <div class="item pos-r">
                            <input type="text" :maxlength="max" v-model="form.title" placeholder="Введите заголовок поста*">
                            <span class="count" v-text="(max - form.title.length)"></span>
                            <span class="help--info" v-if="helpInfo">Введите название своего поста, используя не больше 100 символов.</span>
                        </div>
                        <div class="item descripton pos-r">
                            <textarea name="description" id="description" :maxlength="maxDescription" v-model="form.description" cols="30" rows="10" placeholder="Введите описание поста*"></textarea>
                            <span class="count" v-text="(maxDescription - form.description.length)"></span>
                            <span class="help--info" v-if="helpInfo">Напишите небольшое вступление. Это именно тот текст, который будет выводиться в общей ленте вместе с заголовком.</span>
                        </div>
                        <div class="item-upload">
                            <p class="upload--title">Добавить изображения:</p>
                            <span class="upload--description">Вы можете загрузить до 5 изображений. Размер каждого не более 2048 Kb</span>
                            <div class="data-gallery">
                                <label for="gallery_id" class="gallery_id">
                                    <input type="file" v-model="form.galleryIndex" name="galleryIndex" multiple accept="image/*" id="gallery_id"/>
                                    <span><svg><use xlink:href="#camera"></use></svg> Нажмите для загрузки изображений</span>
                                </label>
                            </div>
                        </div>
                        <p class="help--required"><span>*</span> Поля, обязательные для заполнения</p>
                    </div>
                </div>
                <div class="form-btn-action">
                    <button class="add-block" type="button" @click.prevent="addGallery"><span><svg><use xlink:href="#plus"></use></svg></span> добавить блок</button>
                </div>
                <button class="btn-blue">сохранить и перейти в предпросмотр</button>
            </div>
        </div>
    </form>
</template>
export default {
        name: "addArticle",
        data: function(){
            return {
                max: 100,
                maxDescription: 400,
                tagsBase: [],
                helpInfo: true,
                checkHelp: true,
                form:{
                    title: '',
                    description: '',
                    tagsselect: [],
                    galleryId: 0,
                    galleryIndex: [],
                },
                items: []
            }
        },
        computed: {
        },
        mounted() {
            this.getTags();
        },
        methods: {
            addGallery: function() {
                this.items.push(1);
            },
        }
    }