<template>
|
<el-dialog
|
v-dialogDrag
|
:close-on-click-modal="false"
|
:visible.sync="editDialogVisible"
|
width="533px"
|
append-to-body
|
custom-class="add-event-dialog"
|
@close="handleClose"
|
>
|
<div class="dialog-content-box">
|
<el-form
|
:model="proForm"
|
:rules="rules"
|
ref="ruleForm"
|
label-width="60px"
|
label-position="right"
|
class="demo-ruleForm"
|
>
|
<el-row>
|
<el-col :span="11">
|
<el-form-item label="日期" prop="date">
|
<el-date-picker
|
type="date"
|
placeholder="年/月/日"
|
v-model="proForm.date"
|
size="small"
|
style="width: 100%"
|
></el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="9">
|
<el-form-item label="组别" prop="group">
|
<el-select v-model="proForm.group" placeholder="请选择组别" size="small">
|
<el-option v-for="item in groupOptions" :key="item.id" :label="item.value" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="11">
|
<el-form-item label="车间" prop="workshop">
|
<el-select v-model="proForm.workshop" placeholder="请选择车间" size="small">
|
<el-option label="车间一" value="车间一"></el-option>
|
<el-option label="车间二" value="车间二"></el-option>
|
<el-option label="车间三" value="车间三"></el-option>
|
<el-option label="车间四" value="车间四"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="9">
|
<el-form-item label="规格" prop="spec">
|
<el-input v-model="proForm.spec" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="20">
|
<el-form-item label="庄口" prop="lots">
|
<el-select v-model="proForm.lots" placeholder="请选择庄口" size="small" style="width: 100%">
|
<el-option label="庄口一" value="庄口一"></el-option>
|
<el-option label="庄口二" value="庄口二"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="4">
|
<el-form-item label="" label-width="20px">
|
<el-button type="primary" size="small">切换</el-button>
|
</el-form-item>
|
</el-col>
|
<el-col :span="20">
|
<el-form-item prop="tareWeight" label-width="80px">
|
<span slot="label">
|
<span class="formLabel">皮重</span>
|
</span>
|
<el-input v-model="proForm.tareWeight" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="20">
|
<el-form-item prop="netWeight" label-width="80px">
|
<span slot="label">
|
<span class="formLabel">净重</span>
|
</span>
|
<el-input v-model="proForm.netWeight" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="20">
|
<el-form-item prop="carNum" label-width="80px">
|
<span slot="label">
|
<span class="formLabel">车号</span>
|
</span>
|
<el-input v-model="proForm.carNum" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="20">
|
<el-form-item prop="numTimes" label-width="80px">
|
<span slot="label">
|
<span class="formLabel">回数</span>
|
</span>
|
<el-input v-model="proForm.numTimes" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="20">
|
<el-form-item prop="pieces" label-width="80px">
|
<span slot="label">
|
<span class="formLabel">片数</span>
|
</span>
|
<el-input v-model="proForm.pieces" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="handleClose" size="mini">取消</el-button>
|
<el-button type="primary" @click="onSubmit('form')" size="mini">确定</el-button>
|
</div>
|
</el-dialog>
|
</template>
|
<script>
|
export default {
|
props: {},
|
components: {},
|
data() {
|
return {
|
editDialogVisible: false,
|
proForm: {},
|
rules: {
|
date: [{ required: true, message: "请选择日期", trigger: "change" }],
|
number: [{ required: true, message: "请输入编号", trigger: "blur" }],
|
workshop: [{ type: "date", required: true, message: "请选择车间", trigger: "change" }]
|
},
|
groupOptions: [
|
{ id: 1, value: 1 },
|
{ id: 2, value: 2 },
|
{ id: 3, value: 3 },
|
{ id: 4, value: 4 },
|
{ id: 5, value: 5 },
|
{ id: 6, value: 6 },
|
{ id: 7, value: 7 },
|
{ id: 8, value: 8 },
|
{ id: 9, value: 9 }
|
]
|
}
|
},
|
created() {},
|
methods: {
|
handleClose() {
|
this.editDialogVisible = false
|
},
|
// 确定
|
onSubmit(form) {
|
console.log(form)
|
}
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
.add-event-dialog {
|
.formLabel {
|
font-size: 20px;
|
font-weight: 700;
|
color: #333;
|
}
|
.dialog-footer {
|
background-color: #fff;
|
}
|
}
|
::v-deep {
|
.el-dialog__header {
|
border-bottom: 0px solid #e5e5e5;
|
}
|
.el-dialog__body {
|
padding: 0px 20px 10px;
|
}
|
.el-form-item__label {
|
font-size: 16px;
|
color: #333;
|
font-weight: 700;
|
}
|
.add-event-dialog .el-dialog {
|
position: absolute;
|
right: 40px;
|
top: 40px;
|
}
|
}
|
</style>
|
<style>
|
/* .add-event-dialog.el-dialog {
|
position: absolute;
|
right: 40px;
|
top: 40px;
|
} */
|
/* .add-event-dialog .el-dialog__header {
|
display: none;
|
} */
|
</style>
|
