/* 标注区 */
<template>
    <gy-card title="标注区" area-style="label" circle-style="yellow" content-style="25">
        <div v-for="mk in values" :key="mk" style="width:120px;margin-left:10px;margin-top:10px;">
            <img src="../../assets/img/LabelArea/flag.png" style="float:left;margin-top:5px;margin-left:15px;"/>
            <div style="text-align:center;">{{mk.title}}</div>
            <input v-model="mk.value" style="border:none;background-color:#292929;height:30px;border-radius:6px;text-align:center;outline:none;width:120px;color:rgb(220,220,220);"/>
        </div>
    </gy-card>
</template>

<script>
import BackgroundData from '../../assets/script/BackgroundData'

export default{
    name:'LabelArea',
    data(){
        return{
            values:new Array(),
        }
    },
    created(){
        this.refreshTimer = setInterval(this.refreshData,1000);
    },
    methods:{
        refreshData(){
            this.values=new Array();
            this.values=BackgroundData.getInstance().Marks;
        },
    }
}
</script>

<style scoped>

</style>