<template>
|
<div class="container">
|
<div class="title" v-if="!editId">
|
新建日志{{ editId }}
|
<span class="back" @click="back"> <i class="iconfont icon-fanhui"></i> 返回 </span>
|
</div>
|
<div class="title" v-else>
|
<span v-if="!actualHourFlag">修改日志</span>
|
<span v-if="actualHourFlag">提交工时</span>
|
<span class="back" @click="back"> <i class="iconfont icon-fanhui"></i> 返回 </span>
|
</div>
|
|
<div class="wrap">
|
<el-row>
|
<el-col :lg="16" :md="20" :sm="24" :xs="24">
|
<el-form :model="daily" status-icon ref="form" label-width="auto" @submit.prevent :rules="rules">
|
<el-form-item label="日志日期" prop="daily_date">
|
<!-- <el-date-picker
|
v-model="daily.daily_date"
|
type="date"
|
placeholder="输入日期"
|
size="default"
|
value-format="YYYY-MM-DD"
|
:disabled="actualHourFlag"
|
/> -->
|
<el-date-picker
|
v-model="daily.daily_date"
|
type="date"
|
placeholder="输入日期"
|
size="default"
|
value-format="YYYY-MM-DD"
|
:disabled="true"
|
/>
|
</el-form-item>
|
|
<el-form-item label="日志类型" prop="daily_type">
|
<el-select
|
:disabled="actualHourFlag"
|
v-model="daily.daily_type"
|
placeholder="日志类型"
|
clearable
|
filterable
|
>
|
<el-option v-for="item in dailyTypeArr" :key="item.value" :label="item.label" :value="item.value" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="所属项目" prop="project_id">
|
<el-select
|
:disabled="actualHourFlag"
|
v-model="daily.project_id"
|
placeholder="所属项目"
|
clearable
|
filterable
|
>
|
<el-option v-for="item in projectInfoArr" :key="item.id" :label="item.project_name" :value="item.id" />
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="任务" prop="task_id">
|
<el-select :disabled="actualHourFlag" v-model="daily.task_id" placeholder="任务" clearable filterable>
|
<el-option v-for="item in projectTypeArr" :key="item.value" :label="item.label" :value="item.value" />
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="状态" prop="daily_status">
|
<el-select v-model="daily.daily_status" placeholder="状态" clearable filterable>
|
<el-option v-for="item in dailyStatusArr" :key="item.value" :label="item.label" :value="item.value" />
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="日志内容" prop="daily_content">
|
<el-input
|
type="textarea"
|
:autosize="{ minRows: 4, maxRows: 8 }"
|
placeholder="请输入日志内容"
|
v-model="daily.daily_content"
|
:disabled="actualHourFlag"
|
>
|
</el-input>
|
</el-form-item>
|
|
<el-form-item label="计划用时" prop="estimated_hours">
|
<el-input-number
|
v-model="daily.estimated_hours"
|
:disabled="actualHourFlag"
|
:step="0.5"
|
:min="0"
|
label="计划用时"
|
placeholder="计划用时"
|
class="input-number-class"
|
/>
|
</el-form-item>
|
<el-form-item v-if="actualHourFlag" label="实际用时" prop="actual_hours">
|
<el-input-number
|
v-model="daily.actual_hours"
|
:step="0.5"
|
:min="0"
|
label="实际用时"
|
placeholder="实际用时"
|
class="input-number-class"
|
/>
|
</el-form-item>
|
|
<el-form-item label="备注" prop="remark">
|
<el-input
|
type="textarea"
|
:autosize="{ minRows: 4, maxRows: 8 }"
|
placeholder="请输入备注"
|
v-model="daily.remark"
|
>
|
</el-input>
|
</el-form-item>
|
|
<el-form-item class="submit">
|
<el-button type="primary" @click="submitForm">保 存</el-button>
|
<el-button @click="resetForm">重 置</el-button>
|
</el-form-item>
|
</el-form>
|
</el-col>
|
</el-row>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { reactive, ref, onMounted } from 'vue'
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
import projectInfo from '@/model/projectInfo'
|
import sysDictItemModel from '@/model/sysDictItem'
|
import projectDaily from '@/model/projectDaily'
|
|
export default {
|
props: {
|
editId: {
|
type: String,
|
default: null,
|
},
|
actualHourFlag: {
|
type: Boolean,
|
default: false,
|
},
|
editDailyDate: {
|
type: String,
|
default: null,
|
},
|
},
|
setup(props, context) {
|
const form = ref(null)
|
const loading = ref(false)
|
const daily = reactive({
|
id: '',
|
project_id: '',
|
task_id: '',
|
task_desc: '',
|
daily_date: getDefaultDate(),
|
daily_type: '1',
|
daily_content: '',
|
daily_status: '0',
|
estimated_hours: 0,
|
actual_hours: 0,
|
remark: '',
|
})
|
|
const dailyTypeArr = ref([])
|
const dailyStatusArr = ref([])
|
const projectInfoArr = ref([])
|
|
const listAssign = (a, b) => Object.keys(a).forEach(key => {
|
a[key] = b[key] || a[key]
|
})
|
|
/**
|
* 表单规则验证
|
*/
|
const { rules } = getRules()
|
|
onMounted(() => {
|
if (props.editId) {
|
getdaily()
|
}
|
|
if (props.editDailyDate) {
|
// 设定当天的日志只能是传过来的值
|
|
daily.daily_date = props.editDailyDate
|
}
|
|
loadDictDitems()
|
})
|
|
// 根据字典类型查询字典
|
const loadDictDitems = async () => {
|
dailyTypeArr.value = await sysDictItemModel.getSysDictItemListByType('daily_type')
|
dailyStatusArr.value = await sysDictItemModel.getSysDictItemListByType('daily_status')
|
const params = { status: '1,2,3,4' }
|
projectInfoArr.value = await projectInfo.getProjectInfoList(params)
|
}
|
|
const getdaily = async () => {
|
loading.value = true
|
const res = await projectDaily.getProjectDaily(props.editId)
|
listAssign(daily, res)
|
loading.value = false
|
}
|
|
// 重置表单
|
const resetForm = () => {
|
form.value.resetFields()
|
}
|
|
const submitForm = async formName => {
|
form.value.validate(async valid => {
|
if (valid) {
|
let res = {}
|
if (props.editId) {
|
// 确认工时操作
|
if (props.actualHourFlag) {
|
// 确认实际工时不能小于6小时
|
const existHours = await projectDaily.getExistsHours(daily.daily_date, props.editId)
|
let actualHours = daily.actual_hours
|
if (existHours) {
|
actualHours += existHours.actual_hours
|
}
|
if (actualHours < 6) {
|
ElMessage.error(`实际用时小于6小时不能保存,${daily.daily_date}实际工时数为${actualHours}小时！`)
|
return
|
}
|
|
// 如果日志状态是关闭的情况不需要填写工时，但是需要填写备注
|
if (daily.daily_status == '3' && isBlank(daily.remark)) {
|
ElMessage.error('关闭的日志需要填写备注！')
|
return
|
}
|
if (daily.daily_status == '0' && isBlank(daily.remark)) {
|
ElMessage.error('未完成的日志需要填写备注！')
|
return
|
}
|
if (daily.daily_status == '1' && isBlank(daily.remark)) {
|
ElMessage.error('进行中的日志需要填写备注！')
|
return
|
}
|
if (daily.daily_status != '3' && daily.actual_hours <= 0) {
|
ElMessage.error('请填写工时！')
|
return
|
}
|
res = await projectDaily.editProjectDailyActualHours(props.editId, daily)
|
context.emit('editClose')
|
} else {
|
let planHours = daily.estimated_hours
|
// 工时不满6个小时的不可以保存，数据库加当前，区分新增和修改情况
|
const existHours = await projectDaily.getExistsHours(daily.daily_date, props.editId)
|
if (existHours) {
|
planHours += existHours.estimated_hours
|
}
|
if (planHours < 6) {
|
ElMessage.error(`计划用时小于6小时不能保存,${daily.daily_date}的计划工时数为${planHours}小时！`)
|
return
|
}
|
|
// 编辑操作，如果保存的话则需要重新提交和确认
|
// ElMessageBox.confirm('保存后当日日志需重新提交，如是未在计划内的请走补录流程, 是否继续?', '提示', {
|
ElMessageBox.confirm('确认保存吗, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(async () => {
|
loading.value = true
|
|
res = await projectDaily.editProjectDaily(props.editId, daily)
|
|
if (res.code < window.MAX_SUCCESS_CODE) {
|
// 重新初始化
|
resetForm()
|
ElMessage.success(`${res.message}`)
|
loading.value = false
|
context.emit('editClose')
|
} else {
|
ElMessage.error(`${res.message}`)
|
loading.value = false
|
}
|
})
|
.catch(() => {
|
// 用户点击取消按钮时执行的操作
|
// 可以选择不做任何事情，也可以显示取消消息
|
// ElMessage.info('操作已取消'); // 如果需要显示取消消息，可以取消注释
|
})
|
}
|
} else {
|
let planHours = daily.estimated_hours
|
// 工时不满6个小时的不可以保存，数据库加当前，区分新增和修改情况
|
const existHours = await projectDaily.getExistsHours(daily.daily_date, '')
|
|
if (existHours) {
|
planHours += existHours.estimated_hours
|
}
|
if (planHours < 6) {
|
ElMessage.error(`计划用时小于6小时不能保存,${daily.daily_date}的计划工时数为${planHours}小时！`)
|
return
|
}
|
|
// 新增操作，如果保存的话则需要重新提交和确认
|
// ElMessageBox.confirm('保存后当日日志需重新提交，如是未在计划内的请走补录流程, 是否继续?', '提示', {
|
ElMessageBox.confirm('确认保存吗, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(async () => {
|
loading.value = true
|
|
res = await projectDaily.createProjectDaily(daily)
|
|
if (res.code < window.MAX_SUCCESS_CODE) {
|
// 重新初始化
|
resetForm(formName)
|
ElMessage.success(`${res.message}`)
|
loading.value = false
|
context.emit('editClose')
|
} else {
|
ElMessage.error(`${res.message}`)
|
loading.value = false
|
}
|
})
|
.catch(() => {
|
// 用户点击取消按钮时执行的操作
|
// 可以选择不做任何事情，也可以显示取消消息
|
// ElMessage.info('操作已取消'); // 如果需要显示取消消息，可以取消注释
|
})
|
}
|
if (res.code < window.MAX_SUCCESS_CODE) {
|
ElMessage.success(`${res.message}`)
|
}
|
} else {
|
console.error('error submit!!')
|
ElMessage.error('请将信息填写完整')
|
}
|
})
|
}
|
|
const back = () => {
|
context.emit('editClose')
|
}
|
|
return {
|
back,
|
daily,
|
form,
|
rules,
|
resetForm,
|
submitForm,
|
|
dailyTypeArr,
|
dailyStatusArr,
|
projectInfoArr,
|
}
|
},
|
}
|
|
function getDefaultDate() {
|
const today = new Date()
|
const year = today.getFullYear()
|
const month = String(today.getMonth() + 1).padStart(2, '0')
|
const day = String(today.getDate()).padStart(2, '0')
|
const now = `${year}-${month}-${day}`
|
return now
|
}
|
|
function isBlank(str) {
|
return !str || str.replace(/\s/g, '').length === 0
|
}
|
|
/**
|
* 表单验证规则
|
*/
|
function getRules() {
|
/**
|
* 验证回调函数
|
*/
|
const checkInfo = (rule, value, callback) => {
|
if (!value) {
|
callback(new Error('信息不能为空'))
|
}
|
callback()
|
}
|
const rules = {
|
daily_date: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
daily_type: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
project_id: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
daily_status: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
daily_content: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
estimated_hours: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
}
|
return { rules }
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.container {
|
.title {
|
height: 59px;
|
line-height: 59px;
|
color: $parent-title-color;
|
font-size: 16px;
|
font-weight: 500;
|
text-indent: 40px;
|
border-bottom: 1px solid #dae1ec;
|
|
.back {
|
float: right;
|
margin-right: 40px;
|
cursor: pointer;
|
}
|
}
|
|
.wrap {
|
padding: 20px;
|
}
|
|
.submit {
|
float: left;
|
}
|
|
.input-number-class {
|
height: 100%;
|
}
|
}
|
</style>
|
