<template>
|
<a-modal
|
:title="type=='edit'?'编辑班次':'新增班次'"
|
:width="600"
|
:visible="visible"
|
:confirmLoading="confirmLoading"
|
@ok="handleSubmit"
|
@cancel="handleCancel"
|
>
|
<a-spin :spinning="confirmLoading">
|
<a-form :form="form" :label-col="labelCol" :wrapper-col="wrapperCol">
|
<!-- <a-form-item label="班组编号" has-feedback>
|
<a-input disabled v-decorator="['shiftNo']" />
|
</a-form-item> -->
|
|
<a-form-item label="班次名称" has-feedback>
|
<a-select
|
:disabled="type=='edit'"
|
allow-clear
|
style="width: 100%"
|
v-decorator="['shiftName', { rules: [{ required: true, message: '请输入班次名称！' }] }]"
|
placeholder="请选择班次名称">
|
<a-select-option value="白班">
|
白班
|
</a-select-option>
|
<a-select-option value="晚班">
|
晚班
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
|
<a-form-item label="开始时间" has-feedback>
|
<a-time-picker
|
style="width: 100%"
|
placeholder="请选择开始时间"
|
v-decorator="['shiftStartTime', { rules: [{ required: true, message: '请选择开始时间！' }] }]"
|
format="HH:mm"
|
/>
|
</a-form-item>
|
|
<!-- @change="handleEndOpenChange" @change="handleEndOpenChange"-->
|
<a-form-item label="结束时间" has-feedback>
|
<a-time-picker
|
style="width: 100%"
|
placeholder="请选择结束时间"
|
v-decorator="['shiftEndTime', { rules: [{ required: true, message: '请选择结束时间！' }] }]"
|
format="HH:mm"
|
/>
|
</a-form-item>
|
|
<a-form-item label="是否隔日" has-feedback>
|
<a-select
|
allow-clear
|
style="width: 100%"
|
v-decorator="['isNextDay', { rules: [{ required: true, message: '请选择是否隔日！' }] }]"
|
placeholder="请选择是否隔日">
|
<a-select-option :value="1">
|
是
|
</a-select-option>
|
<a-select-option :value="0">
|
否
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
|
<a-form-item label="班组长" has-feedback>
|
<a-input
|
allow-clear=""
|
placeholder="请输入班组长"
|
v-decorator="['shiftRemark', { rules: [{ required: true, message: '请输入班组长！' }] }]"
|
/>
|
</a-form-item>
|
|
<a-form-item label="id" has-feedback v-show="false">
|
<a-input
|
|
v-decorator="['id']"
|
/>
|
</a-form-item>
|
</a-form>
|
</a-spin>
|
</a-modal>
|
</template>
|
|
<script>
|
import moment from 'moment'
|
// import { getUserList } from '@/api/modular/system/userManage'
|
import { addShiftInfo, editShiftInfo } from '@/api/modular/main/ShiftManage'
|
export default {
|
name: 'EditForm',
|
data() {
|
return {
|
labelCol: {
|
xs: { span: 24 },
|
sm: { span: 5 }
|
},
|
wrapperCol: {
|
xs: { span: 24 },
|
sm: { span: 15 }
|
},
|
confirmLoading: false,
|
visible: false,
|
form: this.$form.createForm(this),
|
type: '',
|
userList: [],
|
shiftSystemType: [{
|
name: '白班'
|
},
|
{
|
name: '晚班'
|
}]
|
}
|
},
|
created() {
|
// this.getUserList()
|
},
|
methods: {
|
// 显示对话框
|
showModal(type, record = {}) {
|
this.visible = true
|
this.type = type
|
console.log(record)
|
if (this.type == 'edit') {
|
this.$nextTick(() => {
|
this.form.setFieldsValue({
|
id: record.id + '',
|
shiftName: record.shiftName,
|
shiftStartTime: moment(record.shiftStartTime, 'HH:mm:ss'),
|
shiftEndTime: moment(record.shiftEndTime, 'HH:mm:ss'),
|
isNextDay: record.isNextDay ? 1 : 0,
|
shiftRemark: record.shiftRemark + ''
|
})
|
})
|
}
|
},
|
// 确定
|
handleSubmit() {
|
const { form: { validateFields } } = this
|
validateFields(async (errors, values) => {
|
values.shiftStartTime = moment(values.shiftStartTime).format('HH:mm')
|
values.shiftEndTime = moment(values.shiftEndTime).format('HH:mm')
|
values.isNextDay = values.isNextDay === 1
|
if (!errors) {
|
this.confirmLoading = true
|
try {
|
if (values.id) {
|
// 编辑
|
await editShiftInfo(values)
|
this.$message.success('编辑班次数据成功')
|
this.$emit('reflesh', 1)
|
} else {
|
// 新增
|
await addShiftInfo(values)
|
this.$message.success('新增班次数据成功')
|
this.$emit('reflesh', 1)
|
}
|
this.handleCancel()
|
this.confirmLoading = false
|
} catch (error) {
|
console.log(error)
|
this.confirmLoading = false
|
}
|
}
|
})
|
|
this.handleCancel()
|
},
|
// 取消
|
handleCancel() {
|
this.visible = false
|
this.form.resetFields()
|
}
|
// 获取人员列表
|
// async getUserList() {
|
// try {
|
// const { data } = await getUserList()
|
// this.userList = data
|
// } catch (error) {
|
// console.log(error)
|
// }
|
// }
|
}
|
}
|
</script>
|
|
<style></style>
|
