<template>
    <el-dialog title="模具申报" append-to-body :modelValue="openShow" width="40%" @close="closeDialog">
        <el-form ref="form" :model="form" label-width="100px" :rules="rules">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="零件编码:">21E8-040-17188-A1</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="零件名称:">21E8-040-17188-A1</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="工装号:">21E8-040-17188-A1</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="工装名称:">21E8-040-17188-A1</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="数量:" prop="shuliang">
                        <el-input-number v-model="form.shuliang" :min="1" controls-position="right" style="width: 80%;"
                            @change="handleChange" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="计划类型:" prop="moCode">
                        <el-select v-model="form.moCode" :filterable="true" allow-create @change="frockChange(form)" style="width: 80%;">
                            <el-option label="计划类型一" value="1" />
                            <el-option label="计划类型二" value="2" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="需求日期:" prop="needDate">
                        <el-date-picker v-model="form.needDate" type="date" placeholder="请选择" style="width: 80%;" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="生产标识:" prop="quaLevel">
                        <el-input v-model="form.quaLevel" style="width: 80%;" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="保管员:" prop="userName">
                        <el-select v-model="form.userName" :filterable="true" allow-create @change="frockChange(form)" style="width: 80%;">
                            <el-option label="人员一" value="1" />
                            <el-option label="人员二" value="2" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="备注:">
                        <el-input v-model="form.memo" type="textarea" />
                    </el-form-item>
                </el-col>

            </el-row>

        </el-form>


        <template #footer>
            <span class="dialog-footer">
                <el-button @click="closeDialog">取 消</el-button>
                <el-button type="primary" @click="submit">确 定</el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script>
export default {
    props: {
        showDialog: {
            type: Boolean,
            default: false
        },
    },
    data() {
        return {
            openShow: false,
            form: {

            },
            tableData: [],
            rules: {
                shuliang: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                moCode: [
                    { required: true, message: '请选择', trigger: 'blur' },
                ],
                needDate:[
                    { required: true, message: '请选择', trigger: 'blur' },
                ],
                quaLevel:[
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                userName:[
                    { required: true, message: '请输入', trigger: 'blur' },
                ],

            }

        }
    },
    mounted() {
        this.openShow = this.showDialog
    },
    methods: {
        closeDialog() {
            this.openShow = false
            this.$emit('closeDialog');
        },
        addTable() {
            this.tableData.push({
                code: '3',
                No: '3',
                number: '3',
                shuliang: '',
                shuliang: 0

            })
        },
        delTable(row, index) {
            this.tableData.splice(index, 1)
        },
    }
}
</script>
<style lang="scss" scoped></style>