春风项目四线(合箱线、总装线)
懒羊羊
2024-01-15 1558d8b4bb1f928a79b6c3c03ae1aa0f3c5b4a83
提交 | 用户 | 时间
fd2207 1 <template>
2   <div>
3     <el-dialog
4       v-bind="$attrs"
5       width="500px"
6       :close-on-click-modal="false"
7       :modal-append-to-body="false"
8       v-on="$listeners"
9       @open="onOpen"
10       @close="onClose"
11     >
12       <el-row :gutter="15">
13         <el-form
14           ref="elForm"
15           :model="formData"
16           :rules="rules"
17           size="medium"
18           label-width="100px"
19         >
20           <el-col :span="24">
21             <el-form-item label="生成类型" prop="type">
22               <el-radio-group v-model="formData.type">
23                 <el-radio-button
24                   v-for="(item, index) in typeOptions"
25                   :key="index"
26                   :label="item.value"
27                   :disabled="item.disabled"
28                 >
29                   {{ item.label }}
30                 </el-radio-button>
31               </el-radio-group>
32             </el-form-item>
33             <el-form-item v-if="showFileName" label="文件名" prop="fileName">
34               <el-input v-model="formData.fileName" placeholder="请输入文件名" clearable />
35             </el-form-item>
36           </el-col>
37         </el-form>
38       </el-row>
39
40       <div slot="footer">
41         <el-button @click="close">
42           取消
43         </el-button>
44         <el-button type="primary" @click="handleConfirm">
45           确定
46         </el-button>
47       </div>
48     </el-dialog>
49   </div>
50 </template>
51 <script>
52 export default {
53   inheritAttrs: false,
54   props: ['showFileName'],
55   data() {
56     return {
57       formData: {
58         fileName: undefined,
59         type: 'file'
60       },
61       rules: {
62         fileName: [{
63           required: true,
64           message: '请输入文件名',
65           trigger: 'blur'
66         }],
67         type: [{
68           required: true,
69           message: '生成类型不能为空',
70           trigger: 'change'
71         }]
72       },
73       typeOptions: [{
74         label: '页面',
75         value: 'file'
76       }, {
77         label: '弹窗',
78         value: 'dialog'
79       }]
80     }
81   },
82   computed: {
83   },
84   watch: {},
85   mounted() {},
86   methods: {
87     onOpen() {
88       if (this.showFileName) {
89         this.formData.fileName = `${+new Date()}.vue`
90       }
91     },
92     onClose() {
93     },
94     close(e) {
95       this.$emit('update:visible', false)
96     },
97     handleConfirm() {
98       this.$refs.elForm.validate(valid => {
99         if (!valid) return
100         this.$emit('confirm', { ...this.formData })
101         this.close()
102       })
103     }
104   }
105 }
106 </script>