63 lines
817 B
Plaintext
63 lines
817 B
Plaintext
<template>
|
|
<view class="status-tag" :class="'tag-' + tone">
|
|
<text class="status-text">{{ text }}</text>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
defineProps({
|
|
text: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
tone: {
|
|
type: String,
|
|
default: 'neutral'
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.status-tag {
|
|
padding: 8rpx 20rpx;
|
|
border-radius: 999rpx;
|
|
align-self: flex-start;
|
|
}
|
|
|
|
.status-text {
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.tag-primary {
|
|
background-color: #e8f2ff;
|
|
}
|
|
|
|
.tag-primary .status-text {
|
|
color: #2563eb;
|
|
}
|
|
|
|
.tag-warning {
|
|
background-color: #fff4e5;
|
|
}
|
|
|
|
.tag-warning .status-text {
|
|
color: #b45309;
|
|
}
|
|
|
|
.tag-success {
|
|
background-color: #e8f7ef;
|
|
}
|
|
|
|
.tag-success .status-text {
|
|
color: #15803d;
|
|
}
|
|
|
|
.tag-neutral {
|
|
background-color: #eef2f6;
|
|
}
|
|
|
|
.tag-neutral .status-text {
|
|
color: #475569;
|
|
}
|
|
</style> |