File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="node">
<div class="header">
<button @click="$emit('openSetup', node.id)">
<img src="../../../resources/img/option.png" alt="옵션" />
</button>
<button
v-if="node.label !== 'DATASET_UPDATE'"
@click="$emit('removeNode', node.id)"
>
<img src="../../../resources/img/delete.png" alt="삭제" />
</button>
</div>
<hr />
<div class="content">
<h3>{{ node.label }}</h3>
</div>
<Handle
v-if="node.label !== 'DATASET_UPDATE'"
type="source"
position="right"
/>
<Handle
v-if="node.label === 'DATASET_UPDATE' || node.label !== 'DATASET_UPDATE'"
type="target"
position="left"
/>
</div>
</template>
<script setup>
import { Handle, Position } from "@vue-flow/core";
</script>
<script>
export default {
components: { Handle, Position },
props: {
node: Object,
},
};
</script>
<style scoped>
.node {
border: 1px solid #ddd;
border-radius: 5px;
padding: 20px;
background-color: #f9f9f9;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
width: 300px;
height: 150px;
}
.header {
display: flex;
justify-content: flex-end;
}
.header button {
width: 20px;
height: 20px;
margin: 0 0 5px 10px;
}
.header button img {
width: 100%;
height: 100%;
}
.content {
margin-top: 20px;
}
</style>