宣传资讯

This commit is contained in:
liuye
2022-04-25 08:58:10 +08:00
parent 2c5542d985
commit ea36a748c8
9 changed files with 1329 additions and 208 deletions

View File

@@ -0,0 +1,194 @@
<template>
<section class="Add">
<ai-detail>
<ai-title slot="title" :title="addTitle" isShowBottomBorder isShowBack @onBackClick="back"/>
<template #content>
<el-form :model="form" ref="ruleForm" :rules="rules" label-width="130px" label-position="right" size="small">
<ai-card title="基本信息">
<template #content>
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" placeholder="请输入标题" :maxlength="50" />
</el-form-item>
<el-form-item label="发布地区" prop="areaId">
<ai-area-get :instance="instance" v-model="form.areaId" :root="rootArea" valueLevel="5"/>
</el-form-item>
<el-form-item label="文章类型" prop="moduleId" style="width:50%;">
<ai-select v-model="form.moduleId" :selectList="dict.getDict('sex')"/>
</el-form-item>
<el-form-item label="分类" prop="categoryId" style="width:50%;">
<ai-select v-model="form.categoryId" :selectList="dict.getDict('sex')"/>
</el-form-item>
<el-form-item label="正文" prop="content" style="width: 100%;">
<ai-editor v-model="form.content" :instance="instance"/>
</el-form-item>
<el-form-item label="封面图片最多1张" >
<ai-uploader
:isShowTip="true"
:instance="instance"
v-model="form.pictureUrlList"
fileType="img"
acceptType=".png,.jpg,.jpeg"
:limit="1">
<template slot="tips">最多上传1张图片,单张图片最大10MB<br/>支持.png,.jpg,.jpeg格式</template>
</ai-uploader>
</el-form-item>
<el-form-item label="附件附件" prop="fileList">
<el-upload
class="upload-demo"
action
multiple
accept=".zip,.rar,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf,.txt,.jpg,.png"
:http-request="uploadFile"
:on-exceed="()=>$message.error('最多只能上传9个附件!')"
:on-remove="handleRemove"
:on-change="handleChange"
:limit="9"
:file-list="form.files">
<el-button size="mini"> 添加附件</el-button>
<div slot="tip" class="el-upload__tip">
<p style="line-height: 0;">最多上传9个附件,单个文件最大10MB </p>
<p style="line-height: 40px;">
支持.zip.rar.doc.docx.xls.xlsx.ppt.pptx.pdf.txt.jpg.png格式</p>
</div>
</el-upload>
</el-form-item>
</template>
</ai-card>
</el-form>
</template>
<template #footer>
<el-button @click="back">取消</el-button>
<el-button type="primary" @click="submit">提交</el-button>
</template>
</ai-detail>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "Add",
props: {
instance: Function,
dict: Object,
permissions: Function
},
computed: {
...mapState(['user']),
isEdit() {
return !!this.$route.query.id
},
addTitle() {
return this.isEdit ? "编辑新闻发布" : "添加新闻发布"
},
rules() {
return {
title: [{required: true, message: "请输入标题"}],
areaId: [{required: true, message: "请选择发布地区"}],
moduleId: [{required: true, message: "请选择文章类型"}],
categoryId: [{required: true, message: "选择分类"}],
}
},
rootArea() {
return this.user.info?.areaId?.replace(/(\d{6})\d+/g, '$1' + Array(7).join("0")) || ""
}
},
data() {
return {
form: {
householdRelation: "",
healthyStatus: [],
file: []
},
}
},
methods: {
// 上传附件
uploadFile: function (file) {
const isLt10M = file.file.size / 1024 / 1024 < 10;
if (!isLt10M) {
this.$message.error("附件大小不超过10mb!");
for (let i = 0; i < this.fileList.length; i++) {
if (this.fileList[i].uid == file.file.uid) {
this.fileList.splice(i, 1);
}
}
return;
}
let formData = new FormData();
formData.append("file", file.file);
this.instance.post(`/admin/file/add`, formData, {withCredentials: false}).then(res => {
if (res && res.code == 0) {
let img = res.data[0].split(';');
this.fileList.forEach((item, index) => {
if (item.uid == file.file.uid) {
this.fileList[index].id = img[1];
}
})
}
});
},
handleRemove(file, fileList) {
this.fileList = fileList;
},
handleChange(file, fileList) {
this.fileList = fileList;
},
back() {
this.$router.push({})
},
getDetail() {
let {id} = this.$route.query
id && this.instance.post("/app/apppreventionreturntopoverty/queryDetailById", null, {
params: {id}
}).then(res => {
if (res?.data) {
this.form = res.data
}
})
},
submit() {
this.$refs.ruleForm.validate(v => {
if (v) {
if (this.form.isHousehold == 1) {
this.form.householdIdNumber = this.form.idNumber
}
this.instance.post(`/app/apppreventionreturntopoverty/addOrUpdate`, this.form).then(res => {
if (res.code == 0) {
this.$message.success('提交成功!');
this.back()
}
})
}
})
}
},
created() {
this.getDetail()
}
}
</script>
<style lang="scss" scoped>
.Add {
height: 100%;
.half {
align-items: flex-start;
& > .el-form-item, & > div {
width: 50%;
.el-form-item {
width: 100%;
}
}
}
.el-date-editor {
width: 100%;
}
}
</style>