<!-- 基础配置 -->
|
<template>
|
<div class="app-container">
|
|
<el-form ref="basicForm" label-position="left" :model="basicData" label-width="150px" :rules="rules">
|
|
<el-form-item label="分享标题：" prop="shareTitle">
|
<el-input v-model="basicData.shareTitle" placeholder="请输入分享标题" maxlength="100" class="com-edit-input" />
|
</el-form-item>
|
|
<el-form-item prop="uploadShareImgs">
|
<span slot="label">
|
分享图片：<br><span>(500*400像素)</span>
|
</span>
|
<!-- 上传图片组件(单图) -->
|
<UploadSingleImg
|
ref="refUploadImg"
|
v-model="basicData.uploadShareImgs"
|
@change.capture="$refs['basicForm'].clearValidate()"
|
/>
|
</el-form-item>
|
</el-form>
|
|
<div v-if="getAuthValueFN('system_set')" class="com-edit-bottom-btns flex flex-align-center">
|
<el-button size="mini" @click="jumpBack">取消</el-button>
|
<el-button size="mini" type="primary" @click="submit">提交</el-button>
|
</div>
|
|
<!-- upload放大图片 -->
|
<el-dialog :visible.sync="uploadPreviewVisible" style="text-align:center">
|
<img style="max-width:100%" :src="uploadPreviewUrl" alt="">
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import mixin_upload from '@/mixins/upload.js' // 通用上传图片预览
|
import UploadSingleImg from '@/components_simple/UploadSingleImg'
|
export default {
|
components: { UploadSingleImg },
|
mixins: [mixin_upload],
|
data() {
|
return {
|
basicData: {
|
shareTitle: '',
|
uploadShareImgs: [] // 上传分享图
|
},
|
|
// 表单校验
|
rules: {
|
shareTitle: [{
|
required: true, message: '请填写分享标题', trigger: 'change'
|
}],
|
uploadShareImgs: [{
|
required: true, message: '请选择图片'
|
}]
|
}
|
}
|
},
|
mounted() {
|
this.init()
|
},
|
methods: {
|
init() {
|
this.getBasicData()
|
},
|
|
// 获取基础配置数据
|
getBasicData() {
|
this.postFN({
|
url: 'admin/systemParameter/info',
|
params: {},
|
mockData: {
|
code: 100,
|
msg: '',
|
data: {
|
'shareImg': 'q1rYm',
|
'shareTitle': 'yaD(jiP'
|
}
|
}
|
}, (inf) => {
|
this.basicData.shareTitle = inf.shareTitle
|
if (inf.shareImg) this.basicData.uploadShareImgs = [{ url: inf.shareImg, status: 'success' }]
|
})
|
},
|
|
jumpBack() {
|
this.$router.go(-1)
|
},
|
|
// 提交编辑
|
submit() {
|
this.$refs['basicForm'].validate(valid => {
|
if (valid) {
|
// 上传图片
|
this.$refs.refUploadImg.runUploadImg((imgUrl) => {
|
imgUrl && this.$set(this.basicData, 'shareImg', imgUrl)
|
this.submitReq()
|
})
|
}
|
})
|
},
|
|
submitReq() {
|
var { basicData } = this
|
var {
|
shareTitle,
|
shareImg
|
} = basicData
|
|
const params = {
|
shareTitle: shareTitle,
|
shareImg: shareImg
|
}
|
|
this.postFN({
|
url: 'admin/systemParameter/edit',
|
params: params,
|
mockData: {
|
code: 100,
|
msg: '',
|
data: {}
|
}
|
}, () => {
|
this.getBasicData()
|
this.$messageSuc('保存成功')
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
|
</style>
|
