48 lines
1013 B
Vue
48 lines
1013 B
Vue
<template>
|
|
<Select
|
|
v-model="model"
|
|
:options="options"
|
|
width="auto"
|
|
class="quality-select"
|
|
position="top"
|
|
>
|
|
<template #prefix>
|
|
<span class="quality-label">画质</span>
|
|
</template>
|
|
</Select>
|
|
</template>
|
|
|
|
<script setup>
|
|
import Select from '@/components/Select/index.vue'
|
|
|
|
const props = defineProps({
|
|
modelValue: { type: String, default: 'medium' },
|
|
options: { type: Array, default: () => [] }
|
|
})
|
|
|
|
const emit = defineEmits(['update:modelValue'])
|
|
const model = computed({
|
|
get: () => props.modelValue,
|
|
set: (v) => emit('update:modelValue', v)
|
|
})
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.quality-select {
|
|
:deep(.select-header) {
|
|
height: 40px;
|
|
padding: 0 15px;
|
|
border-radius: 10px;
|
|
border: 1px solid #E8E9EB;
|
|
background: #f5f6f7;
|
|
&:hover { background: #e9eaeb; }
|
|
}
|
|
:deep(.select-text) { font-size: 14px; }
|
|
}
|
|
.quality-label {
|
|
font-family: "Microsoft YaHei";
|
|
font-size: 12px;
|
|
color: #999;
|
|
}
|
|
</style>
|