inleft
2022-03-01 88f419df77ade235ea5e5e24be204842a24b7b33
commit | author | age
9bcb19 1 <template>
I 2   <a-modal
3     title="新增职位"
4     :width="500"
5     :visible="visible"
6     :confirmLoading="confirmLoading"
7     @ok="handleSubmit"
8     @cancel="handleCancel"
9   >
10     <a-spin :spinning="confirmLoading">
11       <a-form :form="form">
12         <a-form-item
13           label="职位名称"
14           :labelCol="labelCol"
15           :wrapperCol="wrapperCol"
16           has-feedback
17         >
18           <a-input placeholder="请输入职位名称" v-decorator="['name', {rules: [{required: true, message: '请输入职位名称!'}]}]" />
19         </a-form-item>
20
21         <a-form-item
22           label="唯一编码"
23           :labelCol="labelCol"
24           :wrapperCol="wrapperCol"
25           has-feedback
26         >
27           <a-input placeholder="请输入唯一编码" v-decorator="['code', {rules: [{required: true, message: '请输入唯一编码!'}]}]" />
28         </a-form-item>
29
30         <a-form-item
31           :labelCol="labelCol"
32           :wrapperCol="wrapperCol"
33           label="排序"
34         >
35           <a-input-number placeholder="请输入排序" style="width: 100%" v-decorator="['sort', { initialValue: 100 }]" :min="1" :max="1000" />
36         </a-form-item>
37
38         <a-form-item
39           label="备注"
40           :labelCol="labelCol"
41           :wrapperCol="wrapperCol"
42           has-feedback
43         >
44           <a-textarea :rows="4" placeholder="请输入备注" v-decorator="['remark']"></a-textarea>
45         </a-form-item>
46
47       </a-form>
48
49     </a-spin>
50   </a-modal>
51 </template>
52
53 <script>
54   import { sysPosAdd } from '@/api/modular/system/posManage'
55   export default {
56     data () {
57       return {
58         labelCol: {
59           xs: { span: 24 },
60           sm: { span: 5 }
61         },
62         wrapperCol: {
63           xs: { span: 24 },
64           sm: { span: 18 }
65         },
66         visible: false,
67         confirmLoading: false,
68         form: this.$form.createForm(this)
69       }
70     },
71     methods: {
72       // 初始化方法
73       add (record) {
74         this.visible = true
75       },
76
77       handleSubmit () {
78         const { form: { validateFields } } = this
79         this.confirmLoading = true
80         validateFields((errors, values) => {
81           if (!errors) {
82             sysPosAdd(values).then((res) => {
83               if (res.success) {
84                 this.$message.success('新增成功')
85                 this.visible = false
86                 this.confirmLoading = false
87                 this.$emit('ok', values)
88                 this.form.resetFields()
89               } else {
90                 this.$message.error('新增失败:' + res.message)
91               }
92             }).finally((res) => {
93               this.confirmLoading = false
94             })
95           } else {
96             this.confirmLoading = false
97           }
98         })
99       },
100       handleCancel () {
101         this.form.resetFields()
102         this.visible = false
103       }
104     }
105   }
106 </script>