198 lines
6.6 KiB
Vue
198 lines
6.6 KiB
Vue
<template>
|
|
<div>
|
|
<a-button size="small" type="primary" @click="show = true">
|
|
<template #icon>
|
|
<icon-edit />
|
|
</template>
|
|
创建任务
|
|
</a-button>
|
|
<a-modal
|
|
v-model:visible="show"
|
|
width="760px"
|
|
@close="this.$refs.form.resetFields()"
|
|
@before-ok="submit"
|
|
>
|
|
<a-form auto-label-width :model="form" ref="form">
|
|
<a-row gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item
|
|
label="任务标题"
|
|
:rules="[
|
|
{ required: true, message: '请输入任务标题' }
|
|
]"
|
|
field="name"
|
|
>
|
|
<a-input
|
|
placeholder="请输入任务标题"
|
|
v-model="form.name"
|
|
></a-input>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item
|
|
label="优先级"
|
|
:rules="[
|
|
{ required: true, message: '请选择优先级' }
|
|
]"
|
|
field="level"
|
|
>
|
|
<a-select
|
|
:options="levelOptions"
|
|
v-model="form.level"
|
|
placeholder="请选择优先级"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
<a-form-item
|
|
label="任务周期"
|
|
:rules="[{ required: true, message: '请选择任务周期' }]"
|
|
field="time"
|
|
>
|
|
<a-range-picker style="width: 100%" v-model="form.time" />
|
|
</a-form-item>
|
|
<a-row gutter="16">
|
|
<a-col :span="12">
|
|
<a-form-item
|
|
label="任务标签"
|
|
:rules="[
|
|
{ required: true, message: '请选择任务标签' }
|
|
]"
|
|
field="tag"
|
|
>
|
|
<a-select
|
|
:options="tagsOptions"
|
|
v-model="form.tag"
|
|
placeholder="请选择任务标签"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-form-item
|
|
label="执行人"
|
|
:rules="[
|
|
{ required: true, message: '请选择执行人' }
|
|
]"
|
|
field="executors"
|
|
>
|
|
<a-select
|
|
multiple
|
|
:options="userOptions"
|
|
allow-search
|
|
@search="handleSearch"
|
|
@focusin="handleFocus"
|
|
v-model="form.executors"
|
|
placeholder="请选择执行人"
|
|
/>
|
|
</a-form-item>
|
|
</a-col>
|
|
</a-row>
|
|
|
|
<a-form-item label="任务描述" field="remark">
|
|
<a-textarea
|
|
v-model="form.remark"
|
|
placeholder="请添加任务描述"
|
|
:auto-size="{ minRows: 4 }"
|
|
/>
|
|
</a-form-item>
|
|
</a-form>
|
|
</a-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
projectId: {
|
|
required: true,
|
|
type: String,
|
|
default: ''
|
|
}
|
|
},
|
|
watch: {
|
|
show: {
|
|
handler(val) {
|
|
if (val) {
|
|
this.form.projectId = this.projectId
|
|
this.fetchDict()
|
|
}
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
levelOptions: [],
|
|
tagsOptions: [],
|
|
userOptions: [],
|
|
show: false,
|
|
form: {
|
|
projectId: '',
|
|
name: '',
|
|
level: '2',
|
|
time: '',
|
|
tag: '',
|
|
executors: '',
|
|
remark: '',
|
|
files: null
|
|
}
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
fetchDict() {
|
|
this.$api.sys.dict({ code: 'project_task_level' }).then(res => {
|
|
if (res.code === 200) {
|
|
this.levelOptions = res.data.map(e => {
|
|
return { label: e.label, value: e.value }
|
|
})
|
|
}
|
|
})
|
|
|
|
this.$api.sys.dict({ code: 'project_task_type' }).then(res => {
|
|
if (res.code === 200) {
|
|
this.tagsOptions = res.data.map(e => {
|
|
return { label: e.label, value: e.value }
|
|
})
|
|
}
|
|
})
|
|
},
|
|
handleFocus(e) {
|
|
this.handleSearch('')
|
|
},
|
|
handleSearch(value) {
|
|
this.$api.user.list({ name: value }).then(res => {
|
|
if (res.code === 200) {
|
|
this.userOptions = res.data.map(e => {
|
|
return { label: e.name, value: e.id }
|
|
})
|
|
}
|
|
})
|
|
},
|
|
submit(done) {
|
|
this.$refs.form.validate(errors => {
|
|
if (errors === undefined) {
|
|
const data = { ...this.form }
|
|
data.startDate = data.time[0]
|
|
data.endDate = data.time[1]
|
|
data.executorIds = data.executors.join(',')
|
|
this.$api.task.submit(data).then(res => {
|
|
if (res.code === 200) {
|
|
this.$notification.success(res.msg)
|
|
this.$emit('ok')
|
|
done()
|
|
} else {
|
|
this.$notification.error(res.msg)
|
|
done(false)
|
|
}
|
|
})
|
|
} else {
|
|
done(false)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped></style>
|