提交 5bf8c29b authored 作者: pengxiaohui's avatar pengxiaohui

内容管理模块表单修改样式问题和增加字段

上级 cec980cd
......@@ -281,9 +281,6 @@ export default {
this.drawerVisible = true
},
HandleDrawFormSubmit(val) {
Object.keys(val).forEach(key => {
if (val[key] === '') delete val[key]
})
if (this.drawFormOptions.type === 'create') {
this.fetchCreateAd(val)
} else {
......
......@@ -291,9 +291,6 @@ export default {
this.drawerVisible = true
},
HandleDrawFormSubmit(val) {
Object.keys(val).forEach(key => {
if (val[key] === '') delete val[key]
})
if (this.drawFormOptions.type === 'create') {
this.fetchCreateArticle(val)
} else {
......
<template>
<el-form :model="form" :rules="rules" ref="ruleForm" label-width="120px" :class="`form-container ${options.page}-form`" >
<el-form :model="form" :rules="rules" ref="ruleForm" label-width="120px" :class="`form-container ${options.type}`" >
<div class="left">
<el-form-item label="项目:" prop="project_id">
<el-col :span="12">
......@@ -38,7 +38,7 @@
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="val => beforeUpload(val, 'web_img_uri')">
:before-upload="val => beforeUpload(val, 'web_img')">
<img v-if="form.web_img_uri" :src="form.web_img_uri" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
......@@ -62,7 +62,7 @@
action="#"
class="avatar-uploader"
:show-file-list="false"
:before-upload="val => beforeUpload(val, 'mobile_terminal_img_uri')">
:before-upload="val => beforeUpload(val, 'mobile_terminal_img')">
<img v-if="form.mobile_terminal_img_uri" :src="form.mobile_terminal_img_uri" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
......@@ -88,36 +88,36 @@
class="file-uploader"
ref="upload"
:show-file-list="false"
:before-upload="val => beforeUpload(val, 'enclosure_uri')">
:before-upload="val => beforeUpload(val, 'enclosure')">
<el-button slot="trigger" size="small" type="primary" :disabled="isDetails">上传文件</el-button>
</el-upload>
<p class="des">
<i class="el-icon-loading" v-if="form.enclosure_uri_loading"></i>
<i class="el-icon-circle-check" v-if="!form.enclosure_uri_loading && form.enclosure_uri"></i>
<i class="el-icon-loading" v-if="enclosure_loading"></i>
<i class="el-icon-circle-check" v-if="!enclosure_loading && form.enclosure_uri"></i>
请上传文件,最多上传一份<br>支持:word、excel、pdf
</p>
</div>
<div class="upload-file-display" v-if="form.enclosure_uri_name">
{{form.enclosure_uri_name}}
<div class="upload-file-display" v-if="form.enclosure_title">
{{form.enclosure_title}}
<span class="upload-file-bar">
<i :class="isFilePreview(form.enclosure_uri_name) ? 'el-icon-view':'el-icon-download'" @click="handleDownloadFile('enclosure_uri')"></i>
<i :class="isFilePreview(form.enclosure_title) ? 'el-icon-view':'el-icon-download'" @click="handleDownloadFile('enclosure_uri')"></i>
<i v-if="!isDetails" class="el-icon-circle-close" @click="handleClearFile('enclosure_uri')"></i>
</span>
</div>
</el-form-item>
<el-form-item label="上传视频:" class="file-upload">
<div style="padding-top:6px;height:36px;">
<el-upload :disabled="isDetails" action="#" class="file-uploader" ref="upload" :show-file-list="false" :before-upload="val => beforeUpload(val, 'video_uri')">
<el-upload :disabled="isDetails" action="#" class="file-uploader" ref="upload" :show-file-list="false" :before-upload="val => beforeUpload(val, 'video')">
<el-button slot="trigger" size="small" type="primary" :disabled="isDetails">上传视频</el-button>
</el-upload>
<p class="des">
<i class="el-icon-loading" v-if="form.video_uri_loading"></i>
<i class="el-icon-circle-check" v-if="!form.video_uri_loading && form.video_uri"></i>
<i class="el-icon-loading" v-if="video_loading"></i>
<i class="el-icon-circle-check" v-if="!video_loading && form.video_uri"></i>
请上传文件,最多上传一份<br>支持:MP4
</p>
</div>
<div class="upload-file-display" v-if="form.video_uri_name">
{{form.video_uri_name}}
<div class="upload-file-display" v-if="form.video_title">
{{form.video_title}}
<span class="upload-file-bar">
<i class="el-icon-view" @click="handleDownloadFile('video_uri')"></i>
<i v-if="!isDetails" class="el-icon-circle-close" @click="handleClearFile('video_uri')"></i>
......@@ -199,15 +199,17 @@ const defaultForm = {
remarks: '',
content: '',
web_img_uri: '',
web_img_uri_loading: '',
web_img_title: '',
web_img_size: '',
mobile_terminal_img_uri: '',
mobile_terminal_img_uri_loading: '',
mobile_terminal_img_title: '',
mobile_terminal_img_size: '',
enclosure_uri: '',
enclosure_uri_name: '',
enclosure_uri_loading: '',
enclosure_title: '',
enclosure_size: '',
video_uri: '',
video_uri_name: '',
video_uri_loading: '',
video_title: '',
video_size: '',
start_time: '',
hasEndDate: 0,
end_time: ''
......@@ -237,6 +239,10 @@ export default {
return {
typeList: [],
form: Object.assign({}, defaultForm),
web_img_loading: '',
mobile_terminal_img_loading: '',
enclosure_loading: '',
video_loading: '',
rules: {
project_id: [
{ required: true, message: '请选择项目', trigger: 'change' }
......@@ -320,12 +326,12 @@ export default {
} else {
this.form.start_time = formatToDate(this.form.start_time)
}
if (this.form.enclosure_uri) {
this.form.enclosure_uri_name = splitStrLast(this.form.enclosure_uri, '/')
}
if (this.form.video_uri) {
this.form.video_uri_name = splitStrLast(this.form.video_uri, '/')
}
// if (this.form.enclosure_uri) {
// this.form.enclosure_title = splitStrLast(this.form.enclosure_uri, '/')
// }
// if (this.form.video_uri) {
// this.form.video_title = splitStrLast(this.form.video_uri, '/')
// }
}
},
methods: {
......@@ -343,22 +349,15 @@ export default {
beforeUpload(file, target) {
let errorMsg = ''
const suffix = splitStrLast(file.name, '.')
if (target === 'web_img_uri' || target === 'mobile_terminal_img_uri') {
if (target === 'web_img' || target === 'mobile_terminal_img') {
if (['image/png', 'image/jpeg'].includes(file.type)) {
this.fetchUpload(file, 'image', target)
} else {
errorMsg = '上传图片格式错误,只允许png/jpg格式'
}
} else if (target === 'enclosure_uri') {
} else if (target === 'enclosure') {
const typeList = ['doc', 'docx', 'pdf', 'xls', 'xlsx']
let isType = false
for (const i in typeList) {
if (typeList[i] === suffix) {
isType = true
break
}
}
if (isType) {
if (typeList.includes(suffix)) {
this.fetchUpload(file, 'file', target)
} else {
errorMsg = '上传附件格式错误,只允许word/excel/pdf格式'
......@@ -449,14 +448,13 @@ export default {
const formData = new window.FormData()
formData.append('file', file)
formData.append('type', type)
this.form[target + '_loading'] = '1'
this[target + '_loading'] = '1'
fileUpload(formData).then(res => {
this.form[target + '_loading'] = ''
this[target + '_loading'] = ''
if (res.code === 0 && res.message === 'SUCCESS') {
this.form[target] = res.data[0].full_path
if (type === 'file') {
this.form[target + '_name'] = res.data[0].filename
}
this.form[target + '_uri'] = res.data[0].full_path
this.form[target + '_title'] = res.data[0].title
this.form[target + '_size'] = res.data[0].size + ''
}
})
}
......@@ -469,6 +467,15 @@ export default {
display:flex;
align-items: stretch;
}
.form-container.details ::-webkit-input-placeholder{
color:transparent;
}
.form-container.details :-ms-input-placeholder{
color:transparent;
}
.form-container.details ::placeholder{
color:transparent;
}
.form-container .left{
width:60%;
}
......
......@@ -254,9 +254,6 @@ export default {
this.drawerVisible = true
},
HandleDrawFormSubmit(val) {
Object.keys(val).forEach(key => {
if (val[key] === '') delete val[key]
})
if (this.drawFormOptions.type === 'create') {
this.fetchCreateImgText(val)
} else {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论