<template>
    <div class="row">
        <div class="col-2 q-pa-lg"></div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[0]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[1]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[2]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[3]" label="" lazy-rules />
        </div>

        

        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg"> </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[3]" label="" lazy-rules />
        </div>



        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[4]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[5]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[6]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[7]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg">
            <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[8]" label="" lazy-rules />
        </div>
        <div class="col-2 q-pa-lg">
            <!-- <q-input filled type="number" class="q-pt-md" :dense="true" v-model="value[9]" label="" lazy-rules /> -->
        </div>



    </div>
</template>

<style scoped>

</style>
<script lang="ts">
import { defineComponent, ref, watch, computed, defineProps, withDefaults, reactive} from "vue";
import { useStore } from "src/store";
import { useI18n } from "vue-i18n";


export default defineComponent({
    name: "ComponentDensityCorrection",
    setup() {
        let $store = useStore();
        let $t = useI18n();
        const value=reactive([0,0,0,0,0,0,0,0,0,0,0]);
        let model = ref(null);
        let options = ref(['10', '20', '30', '40', '50']);
        return {
            model,
            options,
            value
        };
    },
});
</script>