inleft
2022-02-09 9bcb19959eeb9da9bde2561e7278f6d0a55eb151
commit | author | age
9bcb19 1 <template>
I 2   <a-modal
3     title="编辑机构"
4     :width="900"
5     :visible="visible"
6     :confirmLoading="confirmLoading"
7     @ok="handleSubmit"
8     @cancel="handleCancel"
9   >
10     <a-spin :spinning="formLoading">
11       <a-form :form="form">
12
13         <a-form-item
14           style="display: none;"
15           :labelCol="labelCol"
16           :wrapperCol="wrapperCol"
17           has-feedback
18         >
19           <a-input v-decorator="['id']" />
20         </a-form-item>
21
22         <a-form-item
23           label="机构名称"
24           :labelCol="labelCol"
25           :wrapperCol="wrapperCol"
26           has-feedback
27         >
28           <a-input placeholder="请输入机构名称" v-decorator="['name', {rules: [{required: true, message: '请输入机构名称!'}]}]" />
29         </a-form-item>
30
31         <a-form-item
32           label="唯一编码"
33           :labelCol="labelCol"
34           :wrapperCol="wrapperCol"
35           has-feedback
36         >
37           <a-input placeholder="请输入唯一编码" v-decorator="['code', {rules: [{required: true, message: '请输入唯一编码!'}]}]" />
38         </a-form-item>
39
40         <a-form-item
41           label="上级机构"
42           :labelCol="labelCol"
43           :wrapperCol="wrapperCol"
44           has-feedback
45         >
46           <a-tree-select
47             v-decorator="['pid', {rules: [{ required: true, message: '请选择上级机构!' }]}]"
48             style="width: 100%"
49             :dropdownStyle="{ maxHeight: '300px', overflow: 'auto' }"
50             :treeData="orgTree"
51             placeholder="请选择上级机构"
52             treeDefaultExpandAll
53           >
54             <span slot="title" slot-scope="{ id }">{{ id }}
55             </span>
56           </a-tree-select>
57         </a-form-item>
58
59         <a-form-item
60           :labelCol="labelCol"
61           :wrapperCol="wrapperCol"
62           label="排序"
63         >
64           <a-input-number placeholder="请输入排序" style="width: 100%" v-decorator="['sort', { initialValue: 100 }]" :min="1" :max="1000" />
65         </a-form-item>
66
67         <a-form-item
68           label="备注"
69           :labelCol="labelCol"
70           :wrapperCol="wrapperCol"
71           has-feedback
72         >
73           <a-textarea :rows="4" placeholder="请输入备注" v-decorator="['remark']"></a-textarea>
74         </a-form-item>
75
76       </a-form>
77
78     </a-spin>
79   </a-modal>
80 </template>
81
82 <script>
83   import store from '@/store'
84   import { sysOrgEdit, getOrgTree } from '@/api/modular/system/orgManage'
85   export default {
86     data () {
87       return {
88         labelCol: {
89           xs: { span: 24 },
90           sm: { span: 5 }
91         },
92         wrapperCol: {
93           xs: { span: 24 },
94           sm: { span: 15 }
95         },
96         orgTree: [],
97         visible: false,
98         confirmLoading: false,
99         formLoading: true,
100         form: this.$form.createForm(this)
101       }
102     },
103     methods: {
104       // 初始化方法
105       edit (record) {
106         this.visible = true
107         this.getOrgTree()
108         setTimeout(() => {
109           this.form.setFieldsValue(
110             {
111               id: record.id,
112               name: record.name,
113               code: record.code,
114               sort: record.sort,
115               pid: record.pid,
116               remark: record.remark
117             }
118           )
119         }, 100)
120       },
121
122       /**
123        * 获取机构树,并加载于表单中
124        */
125       getOrgTree () {
126         getOrgTree().then((res) => {
127           this.formLoading = false
128           if (!res.success) {
129             this.orgTree = []
130             return
131           }
132           const admintype = store.getters.admintype
133           // eslint-disable-next-line eqeqeq
134           if (admintype == '1') {
135             this.orgTree = [{
136               'id': '-1',
137               'parentId': '0',
138               'title': '顶级',
139               'value': '0',
140               'pid': '0',
141               'children': res.data
142             }]
143           } else {
144             this.orgTree = res.data
145           }
146         })
147       },
148
149       handleSubmit () {
150         const { form: { validateFields } } = this
151         this.confirmLoading = true
152         validateFields((errors, values) => {
153           if (!errors) {
154             sysOrgEdit(values).then((res) => {
155               if (res.success) {
156                 this.$message.success('编辑成功')
157                 this.visible = false
158                 this.confirmLoading = false
159                 this.$emit('ok', values)
160                 this.form.resetFields()
161               } else {
162                 this.$message.error('编辑失败:' + res.message)
163               }
164             }).finally((res) => {
165               this.confirmLoading = false
166             })
167           } else {
168             this.confirmLoading = false
169           }
170         })
171       },
172       handleCancel () {
173         this.form.resetFields()
174         this.visible = false
175       }
176     }
177   }
178 </script>