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="popup-overlay" @click.self="handleClose">
<div class="popup-content">
<div class="card">
<div class="card-body">
<h2 class="card-title">반려 사유</h2>
<textarea v-model="rejectionReason" class="form-control" placeholder="반려 사유를 입력해주세요." />
<div class="buttons">
<button type="button" class="btn sm primary" @click="handleConfirm" :disabled="!isValidReason">등록</button>
<button type="button" class="btn sm tertiary" @click="handleClose"> 취소 </button>
</div>
</div>
</div>
<button @click="handleClose" class="close-btn">
<CloseCircleFilled />
</button>
</div>
</div>
</template>
<script>
import { CloseCircleFilled } from '@ant-design/icons-vue';
export default {
components: {
CloseCircleFilled
},
emits: ['close', 'confirm'],
data() {
return {
rejectionReason: ''
}
},
computed: {
isValidReason() {
return this.rejectionReason.trim().length > 0;
}
},
methods: {
handleClose() {
this.$emit('close');
},
handleConfirm() {
if (this.isValidReason) {
this.$emit('confirm', this.rejectionReason.trim());
}
},
}
}
</script>
<style scoped>
.popup-content {
width: 50%;
}
.form-control {
border-color: #C7CFE3;
min-height: 20rem;
}
</style>