52 lines
1.2 KiB
Vue
52 lines
1.2 KiB
Vue
<template>
|
|
<div class="select">
|
|
<el-select v-model="modelValue" clearable :placeholder="label" @change="onChange">
|
|
<el-option v-for="item in options" :key="item.id" :label="item.ssname" :value="item.id" />
|
|
</el-select>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
defineProps({
|
|
label: {
|
|
type: String,
|
|
default: '选择排队景区'
|
|
},
|
|
options: {
|
|
type: Array,
|
|
default: () => []
|
|
}
|
|
})
|
|
let modelValue = defineModel()
|
|
let emit = defineEmits(['on-change'])
|
|
const onChange = (e) => {
|
|
emit('on-change', e)
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.select {
|
|
:deep(.el-select__wrapper) {
|
|
min-width: vw(180);
|
|
padding: vh(4) vw(20);
|
|
min-height: vh(30) !important;
|
|
line-height: vh(30) !important;
|
|
font-size: vw(14) !important;
|
|
border-radius: vw(100) !important;
|
|
box-shadow: none;
|
|
border: 1px solid rgba(0, 114, 220, 0.3);
|
|
background: linear-gradient(270deg, rgba(8, 41, 86, 0.16) 0%, #0b61b4 100%);
|
|
}
|
|
:deep(.el-select__placeholder) {
|
|
font-weight: 400;
|
|
font-size: vw(20);
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
|
|
.label {
|
|
font-weight: 400;
|
|
font-size: vw(24);
|
|
}
|
|
</style>
|