85 lines
2.4 KiB
Vue
85 lines
2.4 KiB
Vue
<template>
|
|
<div class="container">
|
|
<svg
|
|
width="120px"
|
|
height="40px"
|
|
viewBox="0 0 88 26"
|
|
version="1.1"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
>
|
|
<defs>
|
|
<linearGradient
|
|
x1="100%"
|
|
y1="50%"
|
|
x2="-21.8928848%"
|
|
y2="50%"
|
|
id="linearGradient-XianSuoShangBao-mark-1"
|
|
>
|
|
<stop stop-color="#02221B" offset="0%"></stop>
|
|
<stop stop-color="#06463A" stop-opacity="0" offset="100%"></stop>
|
|
</linearGradient>
|
|
</defs>
|
|
<g id="监测平台" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
|
<g id="林业防火-智感-火情线索-切图版" transform="translate(-1782, -584)">
|
|
<g id="可视化" transform="translate(-8, -1)">
|
|
<g id="模块" transform="translate(53, 92)">
|
|
<g id="标题模块--右侧1" transform="translate(1449.5, 444)">
|
|
<g id="按钮" transform="translate(288, 49)">
|
|
<rect
|
|
id="矩形"
|
|
stroke="#06A475"
|
|
fill-opacity="0.4"
|
|
x="0.5"
|
|
y="0.5"
|
|
width="86"
|
|
height="25"
|
|
></rect>
|
|
<polygon
|
|
id="路径-11"
|
|
fill="#06A475"
|
|
points="0.5 0 0.5 7.33194884 8.38666648 0"
|
|
></polygon>
|
|
<polygon
|
|
id="路径-11"
|
|
fill="#06A475"
|
|
transform="translate(82.4433, 21.666) scale(-1, -1) translate(-82.4433, -21.666)"
|
|
points="78.5 18 78.5 25.3319488 86.3866665 18"
|
|
></polygon>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</g>
|
|
</svg>
|
|
<n-select
|
|
class="overlay-select"
|
|
v-model:value="props.type"
|
|
size="small"
|
|
:options="props.typeOptions"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps(['typeOptions', 'type']);
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.container {
|
|
position: absolute;
|
|
left: 245px;
|
|
display: inline-block;
|
|
|
|
.overlay-select {
|
|
position: absolute;
|
|
width: 115px;
|
|
top: 45%;
|
|
left: 15%;
|
|
transform: translate(-50%, -50%);
|
|
z-index: 10;
|
|
}
|
|
}
|
|
</style>
|