You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
72 lines
1.6 KiB
72 lines
1.6 KiB
11 months ago
|
<script setup lang="ts">
|
||
|
|
import { ref, watch } from "vue";
|
||
|
|
|
||
|
|
const props = defineProps({
|
||
|
|
editData: Object,
|
||
|
|
mode: String,
|
||
|
|
userOption: Array,
|
||
|
|
});
|
||
|
|
|
||
|
|
const emit = defineEmits(["handle-data", "close-modal"]);
|
||
|
|
|
||
|
|
const visible = ref(true);
|
||
|
|
|
||
|
|
const form = ref({
|
||
|
|
name: "",
|
||
|
|
description: "",
|
||
|
|
});
|
||
|
|
|
||
|
|
const submit = () => {
|
||
|
|
emit("handle-data", form.value);
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<v-card class="rounded-lg overflow-hidden">
|
||
|
|
<!-- 타이틀 영역 -->
|
||
|
|
<v-card-title
|
||
|
|
class="text-white font-weight-bold text-h6"
|
||
|
|
style="background-color: #1976d2"
|
||
|
|
>
|
||
|
|
Create Experiment
|
||
|
|
</v-card-title>
|
||
|
|
|
||
|
|
<v-card-text class="pa-6">
|
||
|
|
<v-form @submit.prevent="submit">
|
||
|
|
<div class="mb-5">
|
||
|
|
<label class="text-subtitle-2 font-weight-medium mb-1 d-block"
|
||
|
|
>Experiment Name</label
|
||
|
|
>
|
||
|
|
<v-text-field
|
||
|
|
v-model="form.name"
|
||
|
|
variant="outlined"
|
||
|
|
dense
|
||
|
|
hide-details
|
||
|
|
required
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<label class="text-subtitle-2 font-weight-medium mb-1 d-block"
|
||
|
|
>Description</label
|
||
|
|
>
|
||
|
|
<v-textarea
|
||
|
|
v-model="form.description"
|
||
|
|
variant="outlined"
|
||
|
|
rows="3"
|
||
|
|
dense
|
||
|
|
hide-details
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</v-form>
|
||
|
|
</v-card-text>
|
||
|
|
|
||
|
|
<v-card-actions class="justify-end" style="padding: 16px 24px">
|
||
|
|
<v-btn color="success" @click="submit">Save</v-btn>
|
||
|
|
<v-btn text class="white--text" @click="$emit('close-modal')"
|
||
|
|
>Close</v-btn
|
||
|
|
>
|
||
|
|
</v-card-actions>
|
||
|
|
</v-card>
|
||
|
|
</template>
|