inleft
2022-02-21 552004d0902687de16cd50e3378d4d6671d7f015
commit | author | age
91dc6c 1 <template>
I 2   <a-modal title="编辑blog文章分类" :width="900" :visible="visible" :confirmLoading="confirmLoading" @ok="handleSubmit"
3     @cancel="handleCancel">
4     <a-spin :spinning="confirmLoading">
5       <a-form :form="form">
6         <a-form-item v-show="false">
7           <a-input v-decorator="['id']" />
8         </a-form-item>
9         <a-form-item label="分类名称" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
10           <a-input placeholder="请输入分类名称" v-decorator="['typeName', {rules: [{required: true, message: '请输入分类名称!'}]}]" />
11         </a-form-item>
12         <a-form-item label="公开类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
13           <a-radio-group placeholder="请选择公开类型"
14             v-decorator="['openType',{rules: [{ required: true, message: '请选择公开类型!' }]}]">
15             <a-radio v-for="(item,index) in openTypeData" :key="index" :value="item.code">{{ item.name }}</a-radio>
16           </a-radio-group>
17         </a-form-item>
18         <a-form-item label="置顶值" :labelCol="labelCol" :wrapperCol="wrapperCol" has-feedback>
19           <a-input placeholder="请输入置顶值" v-decorator="['topValue']" />
20         </a-form-item>
21         <a-form-item label="是否启用" :labelCol="labelCol" :wrapperCol="wrapperCol">
22           <a-radio-group placeholder="请选择是否启用"
23             v-decorator="['isEnable',{rules: [{ required: true, message: '请选择是否启用!' }]}]">
24             <a-radio v-for="(item,index) in isEnableData" :key="index" :value="item.code">{{ item.name }}</a-radio>
25           </a-radio-group>
26         </a-form-item>
27       </a-form>
28     </a-spin>
29   </a-modal>
30 </template>
31
32 <script>
33   import {
34     blogArticleTypeEdit
35   } from '@/api/modular/main/blogarticletype/blogArticleTypeManage'
36   export default {
37     data() {
38       return {
39         labelCol: {
40           xs: {
41             span: 24
42           },
43           sm: {
44             span: 5
45           }
46         },
47         wrapperCol: {
48           xs: {
49             span: 24
50           },
51           sm: {
52             span: 15
53           }
54         },
55         openTypeData: [],
56         isEnableData: [],
57         visible: false,
58         confirmLoading: false,
59         form: this.$form.createForm(this)
60       }
61     },
62     methods: {
63       // 初始化方法
64       edit(record) {
65         this.visible = true
66
67
68
69         const openTypeOption = this.$options
70         this.openTypeData = openTypeOption.filters['dictData']('blog_auth_status')
71         const isEnableOption = this.$options
72         this.isEnableData = isEnableOption.filters['dictData']('blog_yes_or_no')
73
74         this.form.getFieldDecorator('openType', {
75           valuePropName: 'checked',
76           initialValue: record.openType.toString()
77         })
78         this.form.getFieldDecorator('isEnable', {
79           valuePropName: 'checked',
80           initialValue: record.isEnable.toString()
81         })
82
83         setTimeout(() => {
84           this.form.setFieldsValue({
85             id: record.id,
86             typeName: record.typeName,
87             // openType: record.openType,
88             topValue: record.topValue,
89             // isEnable: record.isEnable
90           })
91
92
93         }, 100)
94
95       },
96       handleSubmit() {
97         const {
98           form: {
99             validateFields
100           }
101         } = this
102         this.confirmLoading = true
103         validateFields((errors, values) => {
104           if (!errors) {
105             for (const key in values) {
106               if (typeof(values[key]) === 'object' && values[key] != null) {
107                 values[key] = JSON.stringify(values[key])
108               }
109             }
110             blogArticleTypeEdit(values).then((res) => {
111               if (res.success) {
112                 this.$message.success('编辑成功')
113                 this.confirmLoading = false
114                 this.$emit('ok', values)
115                 this.handleCancel()
116               } else {
117                 this.$message.error('编辑失败') //  + res.message
118               }
119             }).finally((res) => {
120               this.confirmLoading = false
121             })
122           } else {
123             this.confirmLoading = false
124           }
125         })
126       },
127       handleCancel() {
128         this.form.resetFields()
129         this.visible = false
130       }
131     }
132   }
133 </script>