81 lines
2.2 KiB
Vue
81 lines
2.2 KiB
Vue
<template>
|
|
<el-dialog
|
|
v-model="visible"
|
|
:show-close="true"
|
|
width="4.8rem"
|
|
class="dislike-dialog"
|
|
:close-on-click-modal="true"
|
|
>
|
|
<!-- 弹窗标题 -->
|
|
<div class="dislike-dialog__title dislike-dialog__title--center">问题反馈</div>
|
|
|
|
<!-- 反馈原因选项列表 — 单选 -->
|
|
<div class="dislike-dialog__options">
|
|
<label
|
|
v-for="option in feedbackOptions"
|
|
:key="option.value"
|
|
class="dislike-dialog__option"
|
|
:class="{ 'dislike-dialog__option--active': feedbackReason === option.value }"
|
|
>
|
|
<el-radio v-model="feedbackReason" :value="option.value">{{ option.label }}</el-radio>
|
|
</label>
|
|
</div>
|
|
|
|
<!-- 底部按钮 -->
|
|
<div class="dislike-dialog__footer">
|
|
<button class="dislike-dialog__btn dislike-dialog__btn--cancel" @click="visible = false">取消</button>
|
|
<button class="dislike-dialog__btn dislike-dialog__btn--submit" @click="handleFeedbackSubmit">提交</button>
|
|
</div>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, computed } from 'vue'
|
|
|
|
const props = defineProps<{
|
|
modelValue: boolean
|
|
jobId: string | null
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'update:modelValue', value: boolean): void
|
|
}>()
|
|
|
|
const visible = computed({
|
|
get: () => props.modelValue,
|
|
set: (val: boolean) => emit('update:modelValue', val),
|
|
})
|
|
|
|
/** 问题反馈的原因（单选） */
|
|
const feedbackReason = ref('')
|
|
|
|
/** 问题反馈原因选项列表 */
|
|
const feedbackOptions = [
|
|
{ value: 'fraud', label: '怀疑是诈骗或虚假岗位' },
|
|
{ value: 'inaccurate', label: '公司信息或职位描述有误' },
|
|
{ value: 'expired', label: '该职位已停止招聘/职位已失效' },
|
|
]
|
|
|
|
/** 提交问题反馈 */
|
|
function handleFeedbackSubmit() {
|
|
if (!feedbackReason.value) {
|
|
ElMessage.warning('请选择一个反馈原因')
|
|
return
|
|
}
|
|
// TODO: 调用接口提交问题反馈，参数：props.jobId, feedbackReason.value
|
|
console.log('提交问题反馈', {
|
|
jobId: props.jobId,
|
|
reason: feedbackReason.value,
|
|
})
|
|
ElMessage.success('问题反馈已提交，感谢您的反馈')
|
|
visible.value = false
|
|
}
|
|
|
|
/** 弹窗打开时重置表单 */
|
|
function resetForm() {
|
|
feedbackReason.value = ''
|
|
}
|
|
|
|
defineExpose({ resetForm })
|
|
</script>
|