<template>
<span class="stay" v-if="stay">
    留
</span>
<span class="over" v-if="over">
    结
</span>
<span class="need" v-if="need">
    待
</span>
</template>
  
<script setup name="Tag">
import { computed } from 'vue';
const props = defineProps({
    row: Object,
});
const stay = computed(() => {
    if (props.row && props.row.caseStatus && props.row.caseStatus === 'stay') {
        return true
    }
    return false
})
const over = computed(() => {
    if (props.row && props.row.repayStatus && props.row.repayStatus === 'over') {
        return true
    }
    return false
})
const need = computed(() => {
    if (props.row && props.row.borrower && props.row.borrower.phoneNull === "Y") {
        return true
    }
    return false
})
</script>
<style lang="scss" scoped>
.stay {
    padding: 0 3px;
    line-height: 18px;
    display: inline-block;
    background: #0267ff;
    color: #fff;
    margin-left: 2px;
}
.over {
    padding: 0 3px;
    line-height: 18px;
    display: inline-block;
    background: #f12d2d;
    color: #fff;
    margin-left: 2px;
}
.need {
    padding: 0 3px;
    line-height: 18px;
    display: inline-block;
    color: rgb(0, 0, 0);
    margin-left: 2px;
    background: #cbec10;
}
  </style>
  