ke_junjie
2025-06-04 84620534eb627e95811b971a4b552b6a177829bf
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<template>
    <el-dialog
        custom-class="sy-modal"
        
        title="新建非本体机序列号"
        :close-on-click-modal="false"
        width="400px"
        :before-close="onClose"
    >
        <div class="special-management-new-modal" v-loading="loading">
            <el-form ref="form" :model="form" :rules="rules" label-width="90px" size="small">
                <el-form-item label="序列号" prop="serialNumber">
                    <el-input v-model.trim="form.serialNumber" clearable placeholder="请输入..." ></el-input>
                </el-form-item>
            </el-form>
        </div>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="onClose">取&nbsp;消</el-button>
                <el-button type="primary" @click="onSubmit">确&nbsp;定</el-button>
            </span>
        </template>
    </el-dialog>
</template>
 
<script>
const defaultForm = {
    serialNumber:''
}
export default {
    name:'specialManagementNewModal',
    emits:['submitCallback','update:visible'],
    props:{
        visible:{
            type:Boolean,
            default:false
        }
    },
    data(){
        return {
            title:'',
            loading:false,
            form:{...defaultForm},
            rules:{
                serialNumber:[
                    { required: true, message: '请输入序列号!', trigger: 'blur' }
                ]
            }
        }
    },
    watch:{
        visible(newVal,oldVal){
            if (newVal!==oldVal) {
                if (newVal) {
                    this.initForm();
                } else {
                    this.clearForm();
                }
            }
        }
    },
    methods:{
        initForm(){
            
        },
        clearForm(){
            this.form = {...defaultForm}
        },
        close(){
            this.$emit('update:visible',false)
        },
        onClose(){
            this.close();
        },
        onSubmit(){
            this.$refs.form.validate((valid) => {
                if (valid) {
                    this.dealSubmit((f)=>{
                        if (f) {
                            this.$message.success('新增成功!')
                            this.close();
                            this.$emit('submitCallback')
                        }
                    })
                } 
            })
        },
        dealSubmit(callback){
            let params = {...this.form};
            this.loading = true
            this.$api.post('Post',params,{block:'special'}).then((d)=>{
                this.loading = false
                callback && callback(true)
            }).catch((err)=>{
                this.loading = false
                callback && callback(false)
            })
        }
    }
}
</script>
 
<style scoped lang="scss">
.special-management-new-modal{
    padding: 8px 16px 0 0;
}
</style>