<template>
|
<el-dialog
|
:visible.sync="dialogVisible"
|
:title="type === 'add' ? '新增其他任务' : '其他任务详情'"
|
width="70%"
|
@open='open'
|
@close="handleClose"
|
>
|
<div class="content-box">
|
<div class="header-title-left">
|
<img src="@/assets/public/headercard.png" />
|
<div>所属项目组</div>
|
</div>
|
<Table :data="criteriaList" :height="null">
|
<el-table-column prop="teamName" label="项目组名称" />
|
<el-table-column prop="personCharge" label="项目负责人" />
|
<el-table-column prop="staffName" label="项目组成员" />
|
<el-table-column prop="createTime" label="创建时间" />
|
</Table>
|
|
<el-row>
|
<el-col :span="2"> </el-col>
|
<el-col :span="12" :offset="1">
|
<el-form
|
:model="form"
|
:rules="rules"
|
ref="formRef"
|
label-width="100px"
|
:span="12"
|
label-position="top"
|
style="margin-top: 20px"
|
>
|
<el-form-item label="任务人" prop="assignee" required>
|
<el-select
|
v-model="form.assignee"
|
placeholder="请选择"
|
:disabled="type === 'detail'"
|
>
|
<el-option
|
v-for="member in memberList"
|
:key="member.userId"
|
:label="member.nickName"
|
:value="member.userId"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="任务内容" prop="taskContent" required>
|
<el-input
|
type="textarea"
|
v-model="form.taskContent"
|
placeholder="请输入"
|
:disabled="type === 'detail'"
|
/>
|
</el-form-item>
|
<el-form-item label="任务时间" prop="taskTime" required>
|
<el-date-picker
|
v-model="form.taskTime"
|
type="datetime"
|
placeholder="请选择"
|
style="width: 100%"
|
:disabled="type === 'detail'"
|
/>
|
</el-form-item>
|
<el-form-item label="评定积分" prop="score" required>
|
<el-input
|
type="number"
|
v-model="form.score"
|
placeholder="请输入"
|
:disabled="type === 'detail'"
|
/>
|
</el-form-item>
|
</el-form>
|
</el-col>
|
</el-row>
|
</div>
|
<template v-slot:footer>
|
<el-button v-if="type === 'add'" type="primary" @click="handleSave">确认</el-button>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script>
|
import {getDetailByUserId, add, update, getDetailById} from '../service.js'
|
import moment from 'moment'
|
export default {
|
name: "Detail",
|
props: {
|
modelValue: {
|
type: Boolean,
|
default: false,
|
},
|
id: {
|
type: String,
|
default: () => (''),
|
},
|
type: {
|
type: String,
|
default: "detail", // 'add' 或 'detail'
|
},
|
},
|
data() {
|
return {
|
dialogVisible: false,
|
form: {
|
id: '',
|
teamId: '',
|
assignee: "", // 实际为 testerId
|
taskContent: "",
|
taskTime: "",
|
score: "", // 实际为 evaluateScore
|
},
|
rules: {
|
assignee: [
|
{ required: true, message: "请选择任务人", trigger: "change" },
|
],
|
taskContent: [
|
{ required: true, message: "请输入任务内容", trigger: "blur" },
|
],
|
taskTime: [
|
{ required: true, message: "请选择任务时间", trigger: "change" },
|
],
|
score: [{ required: true, message: "请输入评定积分", trigger: "blur" }],
|
},
|
criteriaList: [],
|
memberList: [],
|
};
|
},
|
watch: {
|
modelValue: {
|
handler(val) {
|
this.dialogVisible = val;
|
},
|
immediate: true,
|
},
|
},
|
methods: {
|
open(){
|
getDetailByUserId().then(res=>{
|
this.criteriaList=[{...res}]
|
this.memberList=res.staffs.filter(item => item.roleType == '5') || []
|
this.form.teamId = res.id || ''
|
})
|
// 如果是详情，获取详情数据
|
if(this.type === 'detail' && this.id){
|
getDetailById({id: this.id}).then(res => {
|
if(res && res){
|
this.form = {
|
id: res.id || '',
|
teamId: res.teamId || '',
|
assignee: res.testerId || '',
|
taskContent: res.taskContent || '',
|
taskTime: res.taskTime || '',
|
score: res.evaluateScore || '',
|
}
|
}
|
})
|
} else if(this.type === 'add') {
|
// 新增时清空表单
|
this.form = {
|
id: '',
|
teamId: this.form.teamId,
|
assignee: '',
|
taskContent: '',
|
taskTime: '',
|
score: '',
|
}
|
}
|
},
|
handleSave() {
|
this.$refs.formRef.validate(valid => {
|
if (!valid) return;
|
const params = {
|
id: this.form.id,
|
teamId: this.form.teamId,
|
taskContent: this.form.taskContent,
|
taskTime: this.form.taskTime ? moment(this.form.taskTime).format('YYYY-MM-DD HH:mm:ss') : '',
|
testerId: this.form.assignee,
|
evaluateScore: this.form.score,
|
};
|
const api = this.type === 'add' ? add : update;
|
api(params).then(res => {
|
if(res && res.code === 200){
|
this.$message.success('保存成功');
|
this.$emit('close');
|
this.$emit('update:modelValue', false);
|
}
|
})
|
})
|
},
|
handleClose() {
|
this.$emit("update:modelValue", false);
|
},
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.header-title-left {
|
display: flex;
|
align-items: center;
|
gap: 13px;
|
margin: 10px 0;
|
|
img {
|
width: 12px;
|
height: 19px;
|
}
|
|
div {
|
flex-shrink: 0;
|
font-weight: bold;
|
font-size: 18px;
|
color: #222222;
|
line-height: 27px;
|
font-family: "Source Han Sans CN Bold Bold";
|
}
|
}
|
</style>
|
