6 changed files with 134 additions and 11 deletions
@ -0,0 +1,98 @@ |
|||
<template> |
|||
|
|||
<a-modal v-model:open="visible" :title="title" @ok="handleOk" @cancel="closeModal" width="50%"> |
|||
<div style="margin:20px"> |
|||
<a-form :model="form" layout="vertical" ref="formRef" :rules="rules"> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="24"> |
|||
<a-form-item label="任务名称" name="id"> |
|||
<a-select v-model:value="form.id" :options="idOptions" placeholder="请选择" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
<a-row :gutter="[16, 16]"> |
|||
<a-col :span="12"> |
|||
<a-form-item label="项目开始日期" name="scheduledStartTime"> |
|||
<a-date-picker v-model:value="form.scheduledStartTime" placeholder="请选择" valueFormat="YYYY-MM-DD" /> |
|||
</a-form-item> |
|||
</a-col> |
|||
<a-col :span="12"> |
|||
<a-form-item label="项目结束日期" name="scheduledEndTime"> |
|||
<a-date-picker v-model:value="form.scheduledEndTime" placeholder="请选择" valueFormat="YYYY-MM-DD"/> |
|||
</a-form-item> |
|||
</a-col> |
|||
</a-row> |
|||
</a-form> |
|||
</div> |
|||
</a-modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { reactive, ref } from 'vue'; |
|||
import { message } from 'ant-design-vue'; |
|||
import { getPlanNames, updateScheduledTime } from './projectPlan.api'; |
|||
export default { |
|||
setup(props, { emit }) { |
|||
const title = ref('新增'); |
|||
const formRef = ref(); |
|||
const visible = ref(false); |
|||
const form = reactive({ |
|||
scheduledStartTime: '', |
|||
scheduledEndTime: '', |
|||
id: null, |
|||
projectId: null, |
|||
}); |
|||
//下拉框 |
|||
const idOptions = ref([]); |
|||
const showModal = async (projectId) => { |
|||
visible.value = true; |
|||
form.projectId = projectId; |
|||
const res = await getPlanNames(projectId); |
|||
idOptions.value = res; |
|||
}; |
|||
const rules = { |
|||
id: [{ required: true, message: '请选择' }], |
|||
scheduledStartTime: [{ required: true, message: '请选择' }], |
|||
scheduledEndTime: [{ required: true, message: '请选择' }], |
|||
}; |
|||
const handleOk = () => { |
|||
formRef.value.validate().then((valid) => { |
|||
if (valid) { |
|||
let params = {}; |
|||
for (let i in form) { |
|||
params[i] = form[i]; |
|||
} |
|||
updateScheduledTime(params).then((_) => { |
|||
message.success('修改成功'); |
|||
emit('success'); |
|||
closeModal(); |
|||
}); |
|||
} |
|||
}); |
|||
}; |
|||
const closeModal = () => { |
|||
formRef.value.resetFields(); |
|||
visible.value = false; |
|||
}; |
|||
return { |
|||
visible, |
|||
title, |
|||
form, |
|||
showModal, |
|||
handleOk, |
|||
idOptions, |
|||
formRef, |
|||
closeModal, |
|||
rules, |
|||
}; |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 可选样式调整 */ |
|||
.ant-modal-body { |
|||
max-width: 600px; |
|||
margin: 0 auto; |
|||
} |
|||
</style> |
Loading…
Reference in new issue