<template>
|
<div class="custom-panel">
|
<div class="panel-content">
|
<el-switch
|
v-model="isDamEnabled"
|
active-text="开挖开启"
|
inactive-text="开挖关闭"
|
@change="handleSwitchChange"
|
/>
|
</div>
|
</div>
|
</template>
|
|
|
<script setup>
|
import { ref } from 'vue';
|
import { ElSwitch } from 'element-plus';
|
const isDamEnabled = ref(false);
|
function handleDamOn() {
|
console.log('开挖功能已开启');
|
earthCtrl.factory.createModelLibrary()
|
|
}
|
|
// 开关关闭时执行的函数
|
function handleDamOff() {
|
console.log('开挖功能已关闭');
|
}
|
|
// 监听 switch 变化
|
function handleSwitchChange(value) {
|
if (value) {
|
handleDamOn();
|
} else {
|
handleDamOff();
|
}
|
}
|
</script>
|
|
<style scoped>
|
.custom-panel {
|
padding: 20px;
|
width: 290px;
|
background: url("@/assets/img/tools/plotting_new.png") no-repeat;
|
filter: opacity(83%);
|
background-size: 100% 100%;
|
box-sizing: border-box;
|
}
|
|
.panel-content {
|
display: flex;
|
flex-direction: column;
|
}
|
</style>
|
