bdqh-course-platform/src/render/components/SerialPortManagementDrawer/index.vue

49 lines
982 B
Vue

<template>
<n-button circle type="primary" size="large" :class=cvalue @click="show = true">
<template #icon>
<n-icon>
<Cable />
</n-icon>
</template>
</n-button>
<n-drawer v-model:show="show">
<n-drawer-content>
<SerialPortManagementView></SerialPortManagementView>
</n-drawer-content>
</n-drawer>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { NButton, NIcon, NDrawer, NDrawerContent } from 'naive-ui'
import { CableFilled as Cable } from '@vicons/material'
import { SerialPortManagementView } from '@/components/SerialPort'
const show = ref(false)
const cvalue = ref('drawer-control-button')
const appname = (name) => {
if(name == 'fontDesign'){
cvalue.value = 'tobottom'
}
}
defineExpose( { appname })
</script>
<style scoped lang="less">
.drawer-control-button {
position: fixed;
right: 60px;
top: 120px;
}
.tobottom {
position: fixed;
right: 49%;
bottom: 0.5%;
}
</style>