目录代码整合
This commit is contained in:
aixianling
166
packages/conv/AppVillageActivity/components/Add.vue
Normal file
166
packages/conv/AppVillageActivity/components/Add.vue
Normal file
@@ -0,0 +1,166 @@
|
||||
<template>
|
||||
<ai-detail>
|
||||
<template slot="title">
|
||||
<ai-title :title="params.id ? '编辑居民活动' : '添加居民活动'" isShowBack isShowBottomBorder @onBackClick="cancel(false)">
|
||||
</ai-title>
|
||||
</template>
|
||||
<template slot="content">
|
||||
<ai-card title="活动信息">
|
||||
<template #content>
|
||||
<el-form class="ai-form" :model="form" label-width="120px" ref="form">
|
||||
<el-form-item label="活动标题" style="width: 100%;" prop="title" :rules="[{required: true, message: '请输入活动标题', trigger: 'blur'}]">
|
||||
<el-input type="input" size="small" v-model="form.title" clearable placeholder="请输入活动标题..." maxlength="60" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="areaId" style="width: 100%;" label="发布地区" :rules="[{required: true, message: '请选择发布地区', trigger: 'change'}]">
|
||||
<ai-area-select @fullname="e => form.areaName = e" clearable always-show :instance="instance" v-model="form.areaId" :disabled-level="disabledLevel"></ai-area-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="beginTime" label="活动开始时间" :rules="[{required: true, message: '活动开始时间', trigger: 'change'}]">
|
||||
<el-date-picker
|
||||
style="width: 100%"
|
||||
v-model="form.beginTime"
|
||||
type="datetime"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
size="small"
|
||||
placeholder="活动开始时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item prop="endTime" label="活动结束时间" :rules="[{required: true, message: '活动结束时间', trigger: 'change'}]">
|
||||
<el-date-picker
|
||||
v-model="form.endTime"
|
||||
style="width: 100%"
|
||||
type="datetime"
|
||||
size="small"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="活动开始时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="活动地点" style="width: 100%;" prop="address" :rules="[{required: true, message: '请输入活动地点题', trigger: 'blur'}]">
|
||||
<el-input type="input" size="small" v-model="form.address" clearable placeholder="请输入活动地点题" maxlength="30" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人" prop="contactPerson" :rules="[{required: true, message: '请输入联系人', trigger: 'blur'}]">
|
||||
<el-input type="input" size="small" v-model="form.contactPerson" clearable placeholder="请输入联系人" maxlength="30" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话" prop="contactPhone" :rules="[{required: true, message: '请输入联系电话', trigger: 'blur'}]">
|
||||
<el-input type="input" size="small" v-model="form.contactPhone" clearable placeholder="请输入联系电话" maxlength="30" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="活动介绍" style="width: 100%;" prop="content" :rules="[{required: true, message: '请输入内容', trigger: 'change'}]">
|
||||
<ai-editor v-model="form.content" :instance="instance"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="缩略图" style="width: 100%;" prop="url" :rules="[{required: true, message: '请上传缩略图', trigger: 'change'}]">
|
||||
<ai-uploader
|
||||
:instance="instance"
|
||||
isShowTip
|
||||
v-model="form.url"
|
||||
:limit="1">
|
||||
</ai-uploader>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</ai-card>
|
||||
</template>
|
||||
<template #footer>
|
||||
<el-button @click="cancel">取消</el-button>
|
||||
<el-button type="primary" @click="confirm">提交</el-button>
|
||||
</template>
|
||||
</ai-detail>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
export default {
|
||||
name: 'Add',
|
||||
|
||||
props: {
|
||||
instance: Function,
|
||||
dict: Object,
|
||||
params: Object,
|
||||
areaId: String,
|
||||
areaName: String
|
||||
},
|
||||
|
||||
data () {
|
||||
return {
|
||||
info: {},
|
||||
form: {
|
||||
title: '',
|
||||
content: '',
|
||||
areaId: '',
|
||||
areaName: '',
|
||||
beginTime: '',
|
||||
endTime: '',
|
||||
address: '',
|
||||
contactPerson: '',
|
||||
contactPhone: '',
|
||||
url: []
|
||||
},
|
||||
id: ''
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapState(['user'])
|
||||
},
|
||||
|
||||
created () {
|
||||
this.form.areaId = this.areaId
|
||||
this.form.areaName = this.areaName
|
||||
this.disabledLevel = this.user.info.areaList.length
|
||||
if (this.params && this.params.id) {
|
||||
this.id = this.params.id
|
||||
this.getInfo(this.params.id)
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
getInfo (id) {
|
||||
this.instance.post(`/app/appvillageactivityinfo/queryDetailById?id=${id}`).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.form = res.data
|
||||
this.form.url = res.data.url ? JSON.parse(res.data.url) : []
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
confirm () {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
const nowTime = new Date().getTime()
|
||||
const beginTime = new Date(this.form.beginTime).getTime()
|
||||
const endTime = new Date(this.form.endTime).getTime()
|
||||
|
||||
if (beginTime < nowTime) {
|
||||
return this.$message.error('活动开始时间不能早于当前时间')
|
||||
}
|
||||
if (endTime < beginTime) {
|
||||
return this.$message.error('活动结束时间不能早于活动开始时间')
|
||||
}
|
||||
|
||||
this.instance.post(`/app/appvillageactivityinfo/addOrUpdate`, {
|
||||
...this.form,
|
||||
url: this.form.url.length ? JSON.stringify([{
|
||||
url: this.form.url[0].url
|
||||
}]) : ''
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$message.success('提交成功')
|
||||
setTimeout(() => {
|
||||
this.cancel(true)
|
||||
}, 600)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
cancel (isRefresh) {
|
||||
this.$emit('change', {
|
||||
type: 'list',
|
||||
isRefresh: !!isRefresh
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
Reference in New Issue
Block a user