blog的后端代码
view | history | commit | commitdiff
inleft
2022-02-09 9bcb19959eeb9da9bde2561e7278f6d0a55eb151
commit | author | age
9bcb19 1 <template>
I 2   <a-modal
3     title="新增blog文章主体"
4     :width="900"
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="['title', {rules: [{required: true, message: '请输入文章标题！'}]}]" />
19         </a-form-item>
20         <a-form-item
21           label="文章文件id"
22           :labelCol="labelCol"
23           :wrapperCol="wrapperCol"
24           has-feedback
25         >
26           <a-input placeholder="请输入文章文件id" v-decorator="['articleFileId', {rules: [{required: false, message: '请输入文章文件id！'}]}]" />
27         </a-form-item>
28         <a-form-item
29           label="文件类型 1:markdown 2:html"
30           :labelCol="labelCol"
31           :wrapperCol="wrapperCol"
32           has-feedback
33         >
34           <a-input placeholder="请输入文件类型 1:markdown 2:html" v-decorator="['articleFileType', {rules: [{required: true, message: '请输入文件类型 1:markdown 2:html！'}]}]" />
35         </a-form-item>
36         <a-form-item
37           label="文章分类id 0:没有分类"
38           :labelCol="labelCol"
39           :wrapperCol="wrapperCol"
40           has-feedback
41         >
42           <a-input placeholder="请输入文章分类id 0:没有分类" v-decorator="['articleTypeId', {rules: [{required: true, message: '请输入文章分类id 0:没有分类！'}]}]" />
43         </a-form-item>
44         <a-form-item
45           label="文章引言"
46           :labelCol="labelCol"
47           :wrapperCol="wrapperCol"
48           has-feedback
49         >
50           <a-input placeholder="请输入文章引言" v-decorator="['introduce', {rules: [{required: true, message: '请输入文章引言！'}]}]" />
51         </a-form-item>
52         <a-form-item
53           label="封面文件地址(id)"
54           :labelCol="labelCol"
55           :wrapperCol="wrapperCol"
56           has-feedback
57         >
58           <a-input placeholder="请输入封面文件地址(id)" v-decorator="['coverFileId', {rules: [{required: true, message: '请输入封面文件地址(id)！'}]}]" />
59         </a-form-item>
60         <a-form-item
61           label="上次编辑时间"
62           :labelCol="labelCol"
63           :wrapperCol="wrapperCol"
64           has-feedback
65         >
66           <a-date-picker style="width: 100%" placeholder="请选择上次编辑时间" v-decorator="['lastEditorDate',{rules: [{ required: true, message: '请选择上次编辑时间！' }]}]" @change="lastEditorDateOnChange"/>
67         </a-form-item>
68         <a-form-item
69           label="发布时间"
70           :labelCol="labelCol"
71           :wrapperCol="wrapperCol"
72           has-feedback
73         >
74           <a-date-picker style="width: 100%" placeholder="请选择发布时间" v-decorator="['publishDate',{rules: [{ required: true, message: '请选择发布时间！' }]}]" @change="publishDateOnChange"/>
75         </a-form-item>
76         <a-form-item
77           label="是否置顶 0:否 1:是"
78           :labelCol="labelCol"
79           :wrapperCol="wrapperCol"
80           has-feedback
81         >
82           <a-input placeholder="请输入是否置顶 0:否 1:是" v-decorator="['isTop', {rules: [{required: true, message: '请输入是否置顶 0:否 1:是！'}]}]" />
83         </a-form-item>
84         <a-form-item
85           label="置顶值(越小越靠前)"
86           :labelCol="labelCol"
87           :wrapperCol="wrapperCol"
88           has-feedback
89         >
90           <a-input placeholder="请输入置顶值(越小越靠前)" v-decorator="['topValue', {rules: [{required: true, message: '请输入置顶值(越小越靠前)！'}]}]" />
91         </a-form-item>
92         <a-form-item
93           label="公开状态 1:公开 2:私密 3:密码授权"
94           :labelCol="labelCol"
95           :wrapperCol="wrapperCol"
96           has-feedback
97         >
98           <a-input placeholder="请输入公开状态 1:公开 2:私密 3:密码授权" v-decorator="['authStatus', {rules: [{required: true, message: '请输入公开状态 1:公开 2:私密 3:密码授权！'}]}]" />
99         </a-form-item>
100         <a-form-item
101           label="授权密码(在密码授权状态时)"
102           :labelCol="labelCol"
103           :wrapperCol="wrapperCol"
104           has-feedback
105         >
106           <a-input placeholder="请输入授权密码(在密码授权状态时)" v-decorator="['authPassword', {rules: [{required: true, message: '请输入授权密码(在密码授权状态时)！'}]}]" />
107         </a-form-item>
108         <a-form-item
109           label="编辑状态 0:草稿 1:发布"
110           :labelCol="labelCol"
111           :wrapperCol="wrapperCol"
112           has-feedback
113         >
114           <a-input placeholder="请输入编辑状态 0:草稿 1:发布" v-decorator="['editorStatus', {rules: [{required: true, message: '请输入编辑状态 0:草稿 1:发布！'}]}]" />
115         </a-form-item>
116         <a-form-item
117           label="归档年份(以初次发布时间为准)"
118           :labelCol="labelCol"
119           :wrapperCol="wrapperCol"
120           has-feedback
121         >
122           <a-input placeholder="请输入归档年份(以初次发布时间为准)" v-decorator="['separateYear', {rules: [{required: true, message: '请输入归档年份(以初次发布时间为准)！'}]}]" />
123         </a-form-item>
124         <a-form-item
125           label="归档月份"
126           :labelCol="labelCol"
127           :wrapperCol="wrapperCol"
128           has-feedback
129         >
130           <a-input placeholder="请输入归档月份" v-decorator="['separateMonth', {rules: [{required: true, message: '请输入归档月份！'}]}]" />
131         </a-form-item>
132         <a-form-item
133           label="归档日"
134           :labelCol="labelCol"
135           :wrapperCol="wrapperCol"
136           has-feedback
137         >
138           <a-input placeholder="请输入归档日" v-decorator="['separateDay', {rules: [{required: true, message: '请输入归档日！'}]}]" />
139         </a-form-item>
140         <a-form-item
141           label="是否启用 0:否 1:是"
142           :labelCol="labelCol"
143           :wrapperCol="wrapperCol"
144           has-feedback
145         >
146           <a-input placeholder="请输入是否启用 0:否 1:是" v-decorator="['isEnable', {rules: [{required: true, message: '请输入是否启用 0:否 1:是！'}]}]" />
147         </a-form-item>
148         <a-form-item
149           label="更新时间"
150           :labelCol="labelCol"
151           :wrapperCol="wrapperCol"
152           has-feedback
153         >
154           <a-date-picker style="width: 100%" placeholder="请选择更新时间" v-decorator="['updateDate',{rules: [{ required: true, message: '请选择更新时间！' }]}]" @change="updateDateOnChange"/>
155         </a-form-item>
156         <a-form-item
157           label="创建时间"
158           :labelCol="labelCol"
159           :wrapperCol="wrapperCol"
160           has-feedback
161         >
162           <a-date-picker style="width: 100%" placeholder="请选择创建时间" v-decorator="['createDate',{rules: [{ required: true, message: '请选择创建时间！' }]}]" @change="createDateOnChange"/>
163         </a-form-item>
164       </a-form>
165     </a-spin>
166   </a-modal>
167 </template>
168
169 <script>
170   import { blogArticleAdd } from '@/api/modular/main/blogarticle/blogArticleManage'
171   export default {
172     data () {
173       return {
174         labelCol: {
175           xs: { span: 24 },
176           sm: { span: 5 }
177         },
178         wrapperCol: {
179           xs: { span: 24 },
180           sm: { span: 15 }
181         },
182         lastEditorDateDateString: '',
183         publishDateDateString: '',
184         updateDateDateString: '',
185         createDateDateString: '',
186         visible: false,
187         confirmLoading: false,
188         form: this.$form.createForm(this)
189       }
190     },
191     methods: {
192       // 初始化方法
193       add (record) {
194         this.visible = true
195       },
196       /**
197        * 提交表单
198        */
199       handleSubmit () {
200         const { form: { validateFields } } = this
201         this.confirmLoading = true
202         validateFields((errors, values) => {
203           if (!errors) {
204             for (const key in values) {
205               if (typeof (values[key]) === 'object' && values[key] != null) {
206                 values[key] = JSON.stringify(values[key])
207               }
208             }
209             values.lastEditorDate = this.lastEditorDateDateString || null
210             values.publishDate = this.publishDateDateString || null
211             values.updateDate = this.updateDateDateString || null
212             values.createDate = this.createDateDateString || null
213             blogArticleAdd(values).then((res) => {
214               if (res.success) {
215                 this.$message.success('新增成功')
216                 this.confirmLoading = false
217                 this.$emit('ok', values)
218                 this.handleCancel()
219               } else {
220                 this.$message.error('新增失败')// + res.message
221               }
222             }).finally((res) => {
223               this.confirmLoading = false
224             })
225           } else {
226             this.confirmLoading = false
227           }
228         })
229       },
230       lastEditorDateOnChange(date, dateString) {
231         this.lastEditorDateDateString = dateString
232       },
233       publishDateOnChange(date, dateString) {
234         this.publishDateDateString = dateString
235       },
236       updateDateOnChange(date, dateString) {
237         this.updateDateDateString = dateString
238       },
239       createDateOnChange(date, dateString) {
240         this.createDateDateString = dateString
241       },
242       handleCancel () {
243         this.lastEditorDateDateString =''
244         this.form.getFieldDecorator('lastEditorDate', { initialValue: null })
245         this.publishDateDateString =''
246         this.form.getFieldDecorator('publishDate', { initialValue: null })
247         this.updateDateDateString =''
248         this.form.getFieldDecorator('updateDate', { initialValue: null })
249         this.createDateDateString =''
250         this.form.getFieldDecorator('createDate', { initialValue: null })
251         this.form.resetFields()
252         this.visible = false
253       }
254     }
255   }
256 </script>