From f1b087d45ded835ccd6c875086b1f2e2b847f15a Mon Sep 17 00:00:00 2001
From: inleft <inleft@qq.com>
Date: Wed, 09 Feb 2022 18:27:16 +0800
Subject: [PATCH] 表单调整
---
_web/src/views/main/blogarticle/addForm.vue | 190 +++++++++++++++--------------------------------
1 files changed, 61 insertions(+), 129 deletions(-)
diff --git a/_web/src/views/main/blogarticle/addForm.vue b/_web/src/views/main/blogarticle/addForm.vue
index 979c70d..a1bcffc 100644
--- a/_web/src/views/main/blogarticle/addForm.vue
+++ b/_web/src/views/main/blogarticle/addForm.vue
@@ -1,6 +1,6 @@
<template>
<a-modal
- title="新增blog文章主体"
+ title="新增blog文章"
:width="900"
:visible="visible"
:confirmLoading="confirmLoading"
@@ -23,23 +23,24 @@
:wrapperCol="wrapperCol"
has-feedback
>
- <a-input placeholder="请输入文章文件id" v-decorator="['articleFileId', {rules: [{required: false, message: '请输入文章文件id！'}]}]" />
+ <a-input placeholder="请输入文章文件id" v-decorator="['articleFileId', {rules: [{required: true, message: '请输入文章文件id！'}]}]" />
</a-form-item>
<a-form-item
- label="文件类型 1:markdown 2:html"
+ label="文件类型"
+ :labelCol="labelCol"
+ :wrapperCol="wrapperCol"
+ >
+ <a-radio-group placeholder="请选择文件类型" v-decorator="['articleFileType']" >
+ <a-radio v-for="(item,index) in articleFileTypeData" :key="index" :value="item.code">{{ item.name }}</a-radio>
+ </a-radio-group>
+ </a-form-item>
+ <a-form-item
+ label="文章分类"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
- <a-input placeholder="请输入文件类型 1:markdown 2:html" v-decorator="['articleFileType', {rules: [{required: true, message: '请输入文件类型 1:markdown 2:html！'}]}]" />
- </a-form-item>
- <a-form-item
- label="文章分类id 0:没有分类"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入文章分类id 0:没有分类" v-decorator="['articleTypeId', {rules: [{required: true, message: '请输入文章分类id 0:没有分类！'}]}]" />
+ <a-input placeholder="请输入文章分类" v-decorator="['articleTypeId', {rules: [{required: true, message: '请输入文章分类！'}]}]" />
</a-form-item>
<a-form-item
label="文章引言"
@@ -47,119 +48,66 @@
:wrapperCol="wrapperCol"
has-feedback
>
- <a-input placeholder="请输入文章引言" v-decorator="['introduce', {rules: [{required: true, message: '请输入文章引言！'}]}]" />
+ <a-textarea placeholder="请输入文章引言" v-decorator="['introduce']" :auto-size="{ minRows: 3, maxRows: 6 }"/>
</a-form-item>
<a-form-item
- label="封面文件地址(id)"
+ label="封面文件"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
- <a-input placeholder="请输入封面文件地址(id)" v-decorator="['coverFileId', {rules: [{required: true, message: '请输入封面文件地址(id)！'}]}]" />
+ <a-input placeholder="请输入封面文件" v-decorator="['coverFileId']" />
</a-form-item>
<a-form-item
- label="上次编辑时间"
+ label="是否置顶"
+ :labelCol="labelCol"
+ :wrapperCol="wrapperCol"
+ >
+ <a-select style="width: 100%" placeholder="请选择是否置顶" v-decorator="['isTop', {rules: [{ required: true, message: '请选择是否置顶！' }]}]">
+ <a-select-option v-for="(item,index) in isTopData" :key="index" :value="item.code">{{ item.name }}</a-select-option>
+ </a-select>
+ </a-form-item>
+ <a-form-item
+ label="置顶值"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
- <a-date-picker style="width: 100%" placeholder="请选择上次编辑时间" v-decorator="['lastEditorDate',{rules: [{ required: true, message: '请选择上次编辑时间！' }]}]" @change="lastEditorDateOnChange"/>
+ <a-input placeholder="请输入置顶值" v-decorator="['topValue']" />
</a-form-item>
<a-form-item
- label="发布时间"
+ label="公开状态"
+ :labelCol="labelCol"
+ :wrapperCol="wrapperCol"
+ >
+ <a-radio-group placeholder="请选择公开状态" v-decorator="['authStatus']" >
+ <a-radio v-for="(item,index) in authStatusData" :key="index" :value="item.code">{{ item.name }}</a-radio>
+ </a-radio-group>
+ </a-form-item>
+ <a-form-item
+ label="授权密码"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
- <a-date-picker style="width: 100%" placeholder="请选择发布时间" v-decorator="['publishDate',{rules: [{ required: true, message: '请选择发布时间！' }]}]" @change="publishDateOnChange"/>
+ <a-input placeholder="请输入授权密码" v-decorator="['authPassword']" />
</a-form-item>
<a-form-item
- label="是否置顶 0:否 1:是"
+ label="编辑状态"
+ :labelCol="labelCol"
+ :wrapperCol="wrapperCol"
+ >
+ <a-radio-group placeholder="请选择编辑状态" v-decorator="['editorStatus']" >
+ <a-radio v-for="(item,index) in editorStatusData" :key="index" :value="item.code">{{ item.name }}</a-radio>
+ </a-radio-group>
+ </a-form-item>
+ <a-form-item
+ label="是否启用"
:labelCol="labelCol"
:wrapperCol="wrapperCol"
has-feedback
>
- <a-input placeholder="请输入是否置顶 0:否 1:是" v-decorator="['isTop', {rules: [{required: true, message: '请输入是否置顶 0:否 1:是！'}]}]" />
- </a-form-item>
- <a-form-item
- label="置顶值(越小越靠前)"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入置顶值(越小越靠前)" v-decorator="['topValue', {rules: [{required: true, message: '请输入置顶值(越小越靠前)！'}]}]" />
- </a-form-item>
- <a-form-item
- label="公开状态 1:公开 2:私密 3:密码授权"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入公开状态 1:公开 2:私密 3:密码授权" v-decorator="['authStatus', {rules: [{required: true, message: '请输入公开状态 1:公开 2:私密 3:密码授权！'}]}]" />
- </a-form-item>
- <a-form-item
- label="授权密码(在密码授权状态时)"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入授权密码(在密码授权状态时)" v-decorator="['authPassword', {rules: [{required: true, message: '请输入授权密码(在密码授权状态时)！'}]}]" />
- </a-form-item>
- <a-form-item
- label="编辑状态 0:草稿 1:发布"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入编辑状态 0:草稿 1:发布" v-decorator="['editorStatus', {rules: [{required: true, message: '请输入编辑状态 0:草稿 1:发布！'}]}]" />
- </a-form-item>
- <a-form-item
- label="归档年份(以初次发布时间为准)"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入归档年份(以初次发布时间为准)" v-decorator="['separateYear', {rules: [{required: true, message: '请输入归档年份(以初次发布时间为准)！'}]}]" />
- </a-form-item>
- <a-form-item
- label="归档月份"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入归档月份" v-decorator="['separateMonth', {rules: [{required: true, message: '请输入归档月份！'}]}]" />
- </a-form-item>
- <a-form-item
- label="归档日"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入归档日" v-decorator="['separateDay', {rules: [{required: true, message: '请输入归档日！'}]}]" />
- </a-form-item>
- <a-form-item
- label="是否启用 0:否 1:是"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-input placeholder="请输入是否启用 0:否 1:是" v-decorator="['isEnable', {rules: [{required: true, message: '请输入是否启用 0:否 1:是！'}]}]" />
- </a-form-item>
- <a-form-item
- label="更新时间"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-date-picker style="width: 100%" placeholder="请选择更新时间" v-decorator="['updateDate',{rules: [{ required: true, message: '请选择更新时间！' }]}]" @change="updateDateOnChange"/>
- </a-form-item>
- <a-form-item
- label="创建时间"
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- has-feedback
- >
- <a-date-picker style="width: 100%" placeholder="请选择创建时间" v-decorator="['createDate',{rules: [{ required: true, message: '请选择创建时间！' }]}]" @change="createDateOnChange"/>
+ <a-input placeholder="请输入是否启用" v-decorator="['isEnable']" />
</a-form-item>
</a-form>
</a-spin>
@@ -179,10 +127,10 @@
xs: { span: 24 },
sm: { span: 15 }
},
- lastEditorDateDateString: '',
- publishDateDateString: '',
- updateDateDateString: '',
- createDateDateString: '',
+ articleFileTypeData: [],
+ isTopData: [],
+ authStatusData: [],
+ editorStatusData: [],
visible: false,
confirmLoading: false,
form: this.$form.createForm(this)
@@ -192,6 +140,14 @@
// 初始化方法
add (record) {
this.visible = true
+ const articleFileTypeOption = this.$options
+ this.articleFileTypeData = articleFileTypeOption.filters['dictData']('blog_file_type')
+ const isTopOption = this.$options
+ this.isTopData = isTopOption.filters['dictData']('blog_yes_or_no')
+ const authStatusOption = this.$options
+ this.authStatusData = authStatusOption.filters['dictData']('blog_auth_status')
+ const editorStatusOption = this.$options
+ this.editorStatusData = editorStatusOption.filters['dictData']('blog_editor_status')
},
/**
* 提交表单
@@ -206,10 +162,6 @@
values[key] = JSON.stringify(values[key])
}
}
- values.lastEditorDate = this.lastEditorDateDateString || null
- values.publishDate = this.publishDateDateString || null
- values.updateDate = this.updateDateDateString || null
- values.createDate = this.createDateDateString || null
blogArticleAdd(values).then((res) => {
if (res.success) {
this.$message.success('新增成功')
@@ -227,27 +179,7 @@
}
})
},
- lastEditorDateOnChange(date, dateString) {
- this.lastEditorDateDateString = dateString
- },
- publishDateOnChange(date, dateString) {
- this.publishDateDateString = dateString
- },
- updateDateOnChange(date, dateString) {
- this.updateDateDateString = dateString
- },
- createDateOnChange(date, dateString) {
- this.createDateDateString = dateString
- },
handleCancel () {
- this.lastEditorDateDateString =''
- this.form.getFieldDecorator('lastEditorDate', { initialValue: null })
- this.publishDateDateString =''
- this.form.getFieldDecorator('publishDate', { initialValue: null })
- this.updateDateDateString =''
- this.form.getFieldDecorator('updateDate', { initialValue: null })
- this.createDateDateString =''
- this.form.getFieldDecorator('createDate', { initialValue: null })
this.form.resetFields()
this.visible = false
}
--
Gitblit v1.9.1