commit | author | age
|
9bcb19
|
1 |
<template> |
I |
2 |
<a-modal |
f1b087
|
3 |
title="编辑blog文章" |
9bcb19
|
4 |
:width="900" |
I |
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 v-show="false"><a-input v-decorator="['id']" /></a-form-item> |
|
13 |
<a-form-item |
|
14 |
label="文章标题" |
|
15 |
:labelCol="labelCol" |
|
16 |
:wrapperCol="wrapperCol" |
|
17 |
has-feedback |
|
18 |
> |
|
19 |
<a-input placeholder="请输入文章标题" v-decorator="['title', {rules: [{required: true, message: '请输入文章标题!'}]}]" /> |
|
20 |
</a-form-item> |
|
21 |
<a-form-item |
|
22 |
label="文章文件id" |
|
23 |
:labelCol="labelCol" |
|
24 |
:wrapperCol="wrapperCol" |
|
25 |
has-feedback |
|
26 |
> |
|
27 |
<a-input placeholder="请输入文章文件id" v-decorator="['articleFileId', {rules: [{required: true, message: '请输入文章文件id!'}]}]" /> |
|
28 |
</a-form-item> |
|
29 |
<a-form-item |
f1b087
|
30 |
label="文件类型" |
9bcb19
|
31 |
:labelCol="labelCol" |
I |
32 |
:wrapperCol="wrapperCol" |
|
33 |
> |
f1b087
|
34 |
<a-radio-group placeholder="请选择文件类型" v-decorator="['articleFileType']" > |
I |
35 |
<a-radio v-for="(item,index) in articleFileTypeData" :key="index" :value="item.code">{{ item.name }}</a-radio> |
|
36 |
</a-radio-group> |
9bcb19
|
37 |
</a-form-item> |
I |
38 |
<a-form-item |
f1b087
|
39 |
label="文章分类" |
9bcb19
|
40 |
:labelCol="labelCol" |
I |
41 |
:wrapperCol="wrapperCol" |
|
42 |
has-feedback |
|
43 |
> |
f1b087
|
44 |
<a-input placeholder="请输入文章分类" v-decorator="['articleTypeId', {rules: [{required: true, message: '请输入文章分类!'}]}]" /> |
9bcb19
|
45 |
</a-form-item> |
I |
46 |
<a-form-item |
|
47 |
label="文章引言" |
|
48 |
:labelCol="labelCol" |
|
49 |
:wrapperCol="wrapperCol" |
|
50 |
has-feedback |
|
51 |
> |
f1b087
|
52 |
<a-textarea placeholder="请输入文章引言" v-decorator="['introduce']" :auto-size="{ minRows: 3, maxRows: 6 }"/> |
9bcb19
|
53 |
</a-form-item> |
I |
54 |
<a-form-item |
f1b087
|
55 |
label="封面文件" |
9bcb19
|
56 |
:labelCol="labelCol" |
I |
57 |
:wrapperCol="wrapperCol" |
|
58 |
has-feedback |
|
59 |
> |
f1b087
|
60 |
<a-input placeholder="请输入封面文件" v-decorator="['coverFileId']" /> |
9bcb19
|
61 |
</a-form-item> |
I |
62 |
<a-form-item |
f1b087
|
63 |
label="是否置顶" |
I |
64 |
:labelCol="labelCol" |
|
65 |
:wrapperCol="wrapperCol" |
|
66 |
> |
|
67 |
<a-select style="width: 100%" placeholder="请选择是否置顶" v-decorator="['isTop', {rules: [{ required: true, message: '请选择是否置顶!' }]}]"> |
|
68 |
<a-select-option v-for="(item,index) in isTopData" :key="index" :value="item.code">{{ item.name }}</a-select-option> |
|
69 |
</a-select> |
|
70 |
</a-form-item> |
|
71 |
<a-form-item |
|
72 |
label="置顶值" |
9bcb19
|
73 |
:labelCol="labelCol" |
I |
74 |
:wrapperCol="wrapperCol" |
|
75 |
has-feedback |
|
76 |
> |
f1b087
|
77 |
<a-input placeholder="请输入置顶值" v-decorator="['topValue']" /> |
9bcb19
|
78 |
</a-form-item> |
I |
79 |
<a-form-item |
f1b087
|
80 |
label="公开状态" |
I |
81 |
:labelCol="labelCol" |
|
82 |
:wrapperCol="wrapperCol" |
|
83 |
> |
|
84 |
<a-radio-group placeholder="请选择公开状态" v-decorator="['authStatus']" > |
|
85 |
<a-radio v-for="(item,index) in authStatusData" :key="index" :value="item.code">{{ item.name }}</a-radio> |
|
86 |
</a-radio-group> |
|
87 |
</a-form-item> |
|
88 |
<a-form-item |
|
89 |
label="授权密码" |
9bcb19
|
90 |
:labelCol="labelCol" |
I |
91 |
:wrapperCol="wrapperCol" |
|
92 |
has-feedback |
|
93 |
> |
f1b087
|
94 |
<a-input placeholder="请输入授权密码" v-decorator="['authPassword']" /> |
9bcb19
|
95 |
</a-form-item> |
I |
96 |
<a-form-item |
f1b087
|
97 |
label="编辑状态" |
I |
98 |
:labelCol="labelCol" |
|
99 |
:wrapperCol="wrapperCol" |
|
100 |
> |
|
101 |
<a-radio-group placeholder="请选择编辑状态" v-decorator="['editorStatus']" > |
|
102 |
<a-radio v-for="(item,index) in editorStatusData" :key="index" :value="item.code">{{ item.name }}</a-radio> |
|
103 |
</a-radio-group> |
|
104 |
</a-form-item> |
|
105 |
<a-form-item |
|
106 |
label="是否启用" |
9bcb19
|
107 |
:labelCol="labelCol" |
I |
108 |
:wrapperCol="wrapperCol" |
|
109 |
has-feedback |
|
110 |
> |
f1b087
|
111 |
<a-input placeholder="请输入是否启用" v-decorator="['isEnable']" /> |
9bcb19
|
112 |
</a-form-item> |
I |
113 |
</a-form> |
|
114 |
</a-spin> |
|
115 |
</a-modal> |
|
116 |
</template> |
|
117 |
|
|
118 |
<script> |
|
119 |
import { blogArticleEdit } from '@/api/modular/main/blogarticle/blogArticleManage' |
|
120 |
export default { |
|
121 |
data () { |
|
122 |
return { |
|
123 |
labelCol: { |
|
124 |
xs: { span: 24 }, |
|
125 |
sm: { span: 5 } |
|
126 |
}, |
|
127 |
wrapperCol: { |
|
128 |
xs: { span: 24 }, |
|
129 |
sm: { span: 15 } |
|
130 |
}, |
f1b087
|
131 |
articleFileTypeData: [], |
I |
132 |
isTopData: [], |
|
133 |
authStatusData: [], |
|
134 |
editorStatusData: [], |
9bcb19
|
135 |
visible: false, |
I |
136 |
confirmLoading: false, |
|
137 |
form: this.$form.createForm(this) |
|
138 |
} |
|
139 |
}, |
|
140 |
methods: { |
|
141 |
// 初始化方法 |
|
142 |
edit (record) { |
|
143 |
this.visible = true |
f1b087
|
144 |
const articleFileTypeOption = this.$options |
I |
145 |
this.articleFileTypeData = articleFileTypeOption.filters['dictData']('blog_file_type') |
|
146 |
const isTopOption = this.$options |
|
147 |
this.isTopData = isTopOption.filters['dictData']('blog_yes_or_no') |
|
148 |
const authStatusOption = this.$options |
|
149 |
this.authStatusData = authStatusOption.filters['dictData']('blog_auth_status') |
|
150 |
const editorStatusOption = this.$options |
|
151 |
this.editorStatusData = editorStatusOption.filters['dictData']('blog_editor_status') |
9bcb19
|
152 |
setTimeout(() => { |
I |
153 |
this.form.setFieldsValue( |
|
154 |
{ |
|
155 |
id: record.id, |
|
156 |
title: record.title, |
|
157 |
articleFileId: record.articleFileId, |
|
158 |
articleFileType: record.articleFileType, |
|
159 |
articleTypeId: record.articleTypeId, |
|
160 |
introduce: record.introduce, |
|
161 |
coverFileId: record.coverFileId, |
|
162 |
isTop: record.isTop, |
|
163 |
topValue: record.topValue, |
|
164 |
authStatus: record.authStatus, |
|
165 |
authPassword: record.authPassword, |
|
166 |
editorStatus: record.editorStatus, |
|
167 |
isEnable: record.isEnable |
|
168 |
} |
|
169 |
) |
|
170 |
}, 100) |
|
171 |
}, |
|
172 |
handleSubmit () { |
|
173 |
const { form: { validateFields } } = this |
|
174 |
this.confirmLoading = true |
|
175 |
validateFields((errors, values) => { |
|
176 |
if (!errors) { |
|
177 |
for (const key in values) { |
|
178 |
if (typeof (values[key]) === 'object' && values[key] != null) { |
|
179 |
values[key] = JSON.stringify(values[key]) |
|
180 |
} |
|
181 |
} |
|
182 |
blogArticleEdit(values).then((res) => { |
|
183 |
if (res.success) { |
|
184 |
this.$message.success('编辑成功') |
|
185 |
this.confirmLoading = false |
|
186 |
this.$emit('ok', values) |
|
187 |
this.handleCancel() |
|
188 |
} else { |
|
189 |
this.$message.error('编辑失败')// + res.message |
|
190 |
} |
|
191 |
}).finally((res) => { |
|
192 |
this.confirmLoading = false |
|
193 |
}) |
|
194 |
} else { |
|
195 |
this.confirmLoading = false |
|
196 |
} |
|
197 |
}) |
|
198 |
}, |
|
199 |
handleCancel () { |
|
200 |
this.form.resetFields() |
|
201 |
this.visible = false |
|
202 |
} |
|
203 |
} |
|
204 |
} |
|
205 |
</script> |