91 lines
1.7 KiB
Vue
91 lines
1.7 KiB
Vue
<template>
|
|
<template v-if="mode === 'DESIGN'">
|
|
<el-rate
|
|
disabled
|
|
:show-score="showScore"
|
|
:allow-half="enableHalf"
|
|
:text-color="color"
|
|
text-color="#ff9900"
|
|
score-template="{value}">
|
|
</el-rate>
|
|
<p>{{ placeholder }}</p>
|
|
</template>
|
|
<template v-else>
|
|
<template v-if="perm === 'E'">
|
|
<el-rate
|
|
v-model="star"
|
|
:show-score="showScore"
|
|
:allow-half="enableHalf"
|
|
:text-color="color"
|
|
score-template="{value}">
|
|
</el-rate>
|
|
<p>{{ placeholder }}</p>
|
|
</template>
|
|
<template v-else-if="perm === 'R'">
|
|
<el-rate
|
|
v-model="star"
|
|
disabled
|
|
:show-score="showScore"
|
|
:allow-half="enableHalf"
|
|
:text-color="color"
|
|
score-template="{value}">
|
|
</el-rate>
|
|
</template>
|
|
</template>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {computed, defineEmits, defineProps} from "vue";
|
|
const emit = defineEmits(["input"])
|
|
const props = defineProps({
|
|
mode: {
|
|
type: String,
|
|
default: 'DESIGN'
|
|
},
|
|
required: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
value: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
perm: {
|
|
type: String,
|
|
default: 'E'
|
|
},
|
|
color: {
|
|
type: String,
|
|
default: '#f0a732'
|
|
},
|
|
placeholder: {
|
|
type: String,
|
|
default: '请打分!'
|
|
},
|
|
enableHalf: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
showScore: {
|
|
type: Boolean,
|
|
default: true
|
|
},
|
|
})
|
|
const star=ref(null)
|
|
const _value = computed({
|
|
get() {
|
|
return props.value;
|
|
},
|
|
set(val) {
|
|
emit("input", val);
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
p {
|
|
background-color: #fff;
|
|
}
|
|
|
|
</style>
|