<template>
    <div>
        <table class="table">
            <tr>
                <td rowspan="2" colspan="2"></td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">≤60㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">60-80㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">80-90㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">90-100㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">100-120㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">120-144㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">144-180㎡</td>
                <td colspan="2" style="border-bottom: 0px;text-align: left;padding-left: 20px">＞180㎡</td>
                <td rowspan="2">合计</td>
            </tr>
            <tr>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
                <td style="border: 0px"></td>
                <td>占比</td>
            </tr>
            <tr>
                <td rowspan="3" style="width: 140px">当期上市面积</td>
                <td style="width: 130px">批准预（销）售</td>
                <td :class="props.udata[`approveSixArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveSixArea }}</td>
                <td :class="props.udata[`approveSixProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveSixProportion }}</td>
                <td :class="props.udata[`approveEightyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveEightyArea }}</td>
                <td :class="props.udata[`approveEightyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveEightyProportion }}</td>
                <td :class="props.udata[`approveNinetyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveNinetyArea }}</td>
                <td :class="props.udata[`approveNinetyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveNinetyProportion }}</td>
                <td :class="props.udata[`approveHunArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunArea }}</td>
                <td :class="props.udata[`approveHunProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunProportion }}</td>
                <td :class="props.udata[`approveHunTwentyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunTwentyArea }}</td>
                <td :class="props.udata[`approveHunTwentyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunTwentyProportion }}</td>
                <td :class="props.udata[`approveHunFortyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunFortyArea }}</td>
                <td :class="props.udata[`approveHunFortyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunFortyProportion }}</td>
                <td :class="props.udata[`approveHunEightyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunEightyArea }}</td>
                <td :class="props.udata[`approveHunEightyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunEightyProportion }}</td>
                <td :class="props.udata[`approveMaxArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveMaxArea }}</td>
                <td :class="props.udata[`approveMaxProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveMaxProportion }}</td>
                <td :class="props.udata[`approveArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveArea }}</td>
            </tr>
            <tr>
                <td>月末累计可售</td>
                <td :class="props.udata[`inventorySixArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventorySixArea }}</td>
                <td :class="props.udata[`inventorySixProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventorySixProportion }}</td>
                <td :class="props.udata[`inventoryEightyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryEightyArea }}</td>
                <td :class="props.udata[`inventoryEightyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryEightyProportion }}</td>
                <td :class="props.udata[`inventoryNinetyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryNinetyArea }}</td>
                <td :class="props.udata[`inventoryNinetyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryNinetyProportion }}</td>
                <td :class="props.udata[`inventoryHunArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunArea }}</td>
                <td :class="props.udata[`inventoryHunProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunProportion }}</td>
                <td :class="props.udata[`inventoryHunTwentyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunTwentyArea }}</td>
                <td :class="props.udata[`inventoryHunTwentyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunTwentyProportion }}</td>
                <td :class="props.udata[`inventoryHunFortyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunFortyArea }}</td>
                <td :class="props.udata[`inventoryHunFortyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunFortyProportion }}</td>
                <td :class="props.udata[`inventoryHunEightyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunEightyArea }}</td>
                <td :class="props.udata[`inventoryHunEightyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunEightyProportion }}</td>
                <td :class="props.udata[`inventoryMaxArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryMaxArea }}</td>
                <td :class="props.udata[`inventoryMaxProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryMaxProportion }}</td>
                <td :class="props.udata[`inventoryArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryArea }}</td>
            </tr>
            <tr>
                <td>登记销售</td>
                <td :class="props.udata[`saleSixArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleSixArea }}</td>
                <td :class="props.udata[`saleSixProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleSixProportion }}</td>
                <td :class="props.udata[`saleEightyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleEightyArea }}</td>
                <td :class="props.udata[`saleEightyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleEightyProportion }}</td>
                <td :class="props.udata[`saleNinetyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleNinetyArea }}</td>
                <td :class="props.udata[`saleNinetyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleNinetyProportion }}</td>
                <td :class="props.udata[`saleHunArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunArea }}</td>
                <td :class="props.udata[`saleHunProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunProportion }}</td>
                <td :class="props.udata[`saleHunTwentyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunTwentyArea }}</td>
                <td :class="props.udata[`saleHunTwentyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunTwentyProportion }}</td>
                <td :class="props.udata[`saleHunFortyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunFortyArea }}</td>
                <td :class="props.udata[`saleHunFortyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunFortyProportion }}</td>
                <td :class="props.udata[`saleHunEightyArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunEightyArea }}</td>
                <td :class="props.udata[`saleHunEightyProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunEightyProportion }}</td>
                <td :class="props.udata[`saleMaxArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleMaxArea }}</td>
                <td :class="props.udata[`saleMaxProportion` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleMaxProportion }}</td>
                <td :class="props.udata[`saleArea` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleArea }}</td>
            </tr>
            <tr>
                <td rowspan="3">套数</td>
                <td>批准预（销）售</td>
                <td :class="props.udata[`approveSixCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveSixCount }}</td>
                <td></td>
                <td :class="props.udata[`approveEightyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveEightyCount }}</td>
                <td></td>
                <td :class="props.udata[`approveNinetyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveNinetyCount }}</td>
                <td></td>
                <td :class="props.udata[`approveHunCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunCount }}</td>
                <td></td>
                <td :class="props.udata[`approveHunTwentyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunTwentyCount }}</td>
                <td></td>
                <td :class="props.udata[`approveHunFortyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunFortyCount }}</td>
                <td></td>
                <td :class="props.udata[`approveHunEightyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveHunEightyCount }}</td>
                <td></td>
                <td :class="props.udata[`approveMaxCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveMaxCount }}</td>
                <td></td>
                <td :class="props.udata[`approveCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.approveCount }}</td>
            </tr>
            <tr>
                <td>月末累计可售</td>
                <td :class="props.udata[`inventorySixCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventorySixCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryEightyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryEightyCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryNinetyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryNinetyCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryHunCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryHunTwentyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunTwentyCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryHunFortyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunFortyCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryHunEightyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryHunEightyCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryMaxCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryMaxCount }}</td>
                <td></td>
                <td :class="props.udata[`inventoryCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.inventoryCount }}</td>
            </tr>
            <tr>
                <td>登记销售</td>
                <td :class="props.udata[`saleSixCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleSixCount }}</td>
                <td></td>
                <td :class="props.udata[`saleEightyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleEightyCount }}</td>
                <td></td>
                <td :class="props.udata[`saleNinetyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleNinetyCount }}</td>
                <td></td>
                <td :class="props.udata[`saleHunCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunCount }}</td>
                <td></td>
                <td :class="props.udata[`saleHunTwentyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunTwentyCount }}</td>
                <td></td>
                <td :class="props.udata[`saleHunFortyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunFortyCount }}</td>
                <td></td>
                <td :class="props.udata[`saleHunEightyCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunEightyCount }}</td>
                <td></td>
                <td :class="props.udata[`saleMaxCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleMaxCount }}</td>
                <td></td>
                <td :class="props.udata[`saleTotalCount` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleTotalCount }}</td>
            </tr>
            <tr>
                <td>房产价值</td>
                <td>登记销售</td>
                <td :class="props.udata[`saleSixTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleSixTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleEightyTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleEightyTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleNinetyTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleNinetyTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleHunTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleHunTwentyTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunTwentyTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleHunFortyTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunFortyTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleHunEightyTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunEightyTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleMaxTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleMaxTotal }}</td>
                <td></td>
                <td :class="props.udata[`saleTotal` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleTotal }}</td>
            </tr>
            <tr>
                <td>平均成交价格</td>
                <td>登记销售</td>
                <td :class="props.udata[`saleSixPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleSixPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleEightyPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleEightyPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleNinetyPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleNinetyPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleHunPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleHunTwentyPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunTwentyPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleHunFortyPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunFortyPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleHunEightyPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleHunEightyPrice }}</td>
                <td></td>
                <td :class="props.udata[`saleMaxPrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.saleMaxPrice }}</td>
                <td></td>
                <td :class="props.udata[`salePrice` + `tag`] == 1 ? 'redbg' : ''">{{ props.udata.salePrice }}</td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import { defineProps } from 'vue';
const props = defineProps({
    udata: {
        type: Object,
        default: {},
    },
});
</script>

<style scoped lang="scss"></style>