card.vue 901 Bytes
<template>
    <div class="row" style="text-align: center">
        <div class="dataModle0" v-for="row in rows">
            <div class="dataModle">
                <p>{{row.name}}</p>
                <h2>{{row.value}}</h2>
            </div>

            <div class="dataModle">
                <p>{{row.name1}}</p>
                <h2 v-show="row.value1> 0"><b class="_red">↑&nbsp;&nbsp;{{row.value1}}%</b></h2>
                <h2 v-show="row.value1< 0"><b class="_green">↓&nbsp;&nbsp;{{-row.value1}}%</b></h2>
                <h2 v-show="row.value1== 0"><b class="_blue">--&nbsp;&nbsp;{{row.value1}}%</b></h2>
                <h2 v-show="row.value1== 'no'"><b>--</b></h2>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        props: {
            rows: {
                type: Array,
                default: []
            }
        }
    }
</script>