<template>
    <el-dialog title="加急" append-to-body :modelValue="openShow" width="40%" @close="closeDialog">
        <el-form ref="form" :model="form" label-width="80px">
            <el-row>
                <el-col>
                    <el-form-item label="零件名称:">21E8-040-17188-A1</el-form-item>
                </el-col>
            </el-row>

        </el-form>
        <div style="margin-bottom: 12px;">
            <el-button type="primary" @click="addTable">插入一行</el-button>
        </div>
        <el-table :data="tableData" style="width: 100%">
            <el-table-column type="index" width="80" label="序号" align="center">
            </el-table-column>
            <el-table-column prop="code" label="计划单号" align="center">
            </el-table-column>
            <el-table-column prop="No" label="批次号" align="center">
            </el-table-column>
            <el-table-column prop="number" label="生产数量" align="center">
            </el-table-column>
            <el-table-column prop="youxianji" label="优先级" align="center">
                <template #default="scope">
                    <el-select v-model="scope.row.youxianji" placeholder="请选择" size="small">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                </template>
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="100" align="left">
                <template #default="scope">
                    <el-button type="text" size="small" @click.prevent="delTable(scope.row,scope.$index)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <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: [],
            options: [

                {
                    value: '优先级1',
                    label: '1',
                },
                {
                    value: '优先级2',
                    label: '2',
                },
                {
                    value: '优先级3',
                    label: '3',
                },

            ]

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

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