5 changed files with 604 additions and 578 deletions
@ -1,286 +1,269 @@ |
|||||
<template> |
<template> |
||||
<div> |
<div> |
||||
<div class="dialog-h-content scroll-h"> |
<div class="dialog-h-content scroll-h"> |
||||
|
<el-form |
||||
<el-form ref="ref_form" |
ref="ref_form" |
||||
:inline="true" |
:inline="true" |
||||
:model="formData" |
:model="formData" |
||||
:rules="dataRule" |
:rules="dataRule" |
||||
class="div_form"> |
class="div_form" |
||||
|
> |
||||
<el-form-item label="日程标题" |
<el-form-item |
||||
|
label="日程标题" |
||||
prop="title" |
prop="title" |
||||
label-width="150px" |
label-width="150px" |
||||
style="display: block"> |
style="display: block" |
||||
<el-input class="item_width_1" |
> |
||||
|
<el-input |
||||
|
class="item_width_1" |
||||
placeholder="请输入活动标题" |
placeholder="请输入活动标题" |
||||
v-model="formData.title"> |
v-model="formData.title" |
||||
|
> |
||||
</el-input> |
</el-input> |
||||
</el-form-item> |
</el-form-item> |
||||
<el-form-item label="日程时间" |
<el-form-item |
||||
|
label="日程时间" |
||||
style="display: block" |
style="display: block" |
||||
prop="happenedTime" |
prop="happenedTime" |
||||
label-width="150px"> |
label-width="150px" |
||||
<el-date-picker v-model="formData.happenedTime" |
> |
||||
|
<el-date-picker |
||||
|
v-model="formData.happenedTime" |
||||
value-format="yyyy-MM-dd HH:mm:ss" |
value-format="yyyy-MM-dd HH:mm:ss" |
||||
format="yyyy-MM-dd" |
format="yyyy-MM-dd" |
||||
type="date" |
type="date" |
||||
placeholder="选择时间"> |
placeholder="选择时间" |
||||
|
> |
||||
</el-date-picker> |
</el-date-picker> |
||||
</el-form-item> |
</el-form-item> |
||||
<el-form-item label="提醒时间" |
<el-form-item |
||||
|
label="提醒时间" |
||||
style="display: block" |
style="display: block" |
||||
prop="remindTime" |
prop="remindTime" |
||||
label-width="150px"> |
label-width="150px" |
||||
<el-date-picker v-model="formData.remindTime" |
> |
||||
|
<el-date-picker |
||||
|
v-model="formData.remindTime" |
||||
value-format="yyyy-MM-dd HH:mm:ss" |
value-format="yyyy-MM-dd HH:mm:ss" |
||||
format="yyyy-MM-dd" |
format="yyyy-MM-dd" |
||||
placeholder="选择时间"> |
placeholder="选择时间" |
||||
|
> |
||||
</el-date-picker> |
</el-date-picker> |
||||
</el-form-item> |
</el-form-item> |
||||
|
|
||||
<el-form-item label="是否公开" |
<el-form-item label="是否公开" label-width="150px" prop="isPublic"> |
||||
label-width="150px" |
<el-select |
||||
prop="isPublic"> |
v-model="formData.isPublic" |
||||
<el-select v-model="formData.isPublic" |
|
||||
placeholder="请选择" |
placeholder="请选择" |
||||
clearable |
clearable |
||||
class="item_width_1"> |
class="item_width_1" |
||||
<el-option v-for="item in gongkaiArray" |
> |
||||
|
<el-option |
||||
|
v-for="item in gongkaiArray" |
||||
:key="item.value" |
:key="item.value" |
||||
:label="item.label" |
:label="item.label" |
||||
:value="item.value"> |
:value="item.value" |
||||
|
> |
||||
</el-option> |
</el-option> |
||||
</el-select> |
</el-select> |
||||
</el-form-item> |
</el-form-item> |
||||
|
|
||||
<el-form-item label="日程介绍" |
<el-form-item |
||||
|
label="日程介绍" |
||||
prop="remark" |
prop="remark" |
||||
label-width="150px" |
label-width="150px" |
||||
style="display: block"> |
style="display: block" |
||||
<el-input class="item_width_1" |
> |
||||
|
<el-input |
||||
|
class="item_width_1" |
||||
type="textarea" |
type="textarea" |
||||
maxlength="500" |
maxlength="500" |
||||
show-word-limit |
show-word-limit |
||||
:rows="3" |
:rows="3" |
||||
placeholder="请输入日程介绍，不超过500字" |
placeholder="请输入日程介绍，不超过500字" |
||||
v-model="formData.remark"></el-input> |
v-model="formData.remark" |
||||
|
></el-input> |
||||
</el-form-item> |
</el-form-item> |
||||
|
|
||||
</el-form> |
</el-form> |
||||
|
|
||||
</div> |
</div> |
||||
|
|
||||
<div class="div_btn"> |
<div class="div_btn"> |
||||
<el-button size="small" |
<el-button size="small" @click="handleCancle">取 消</el-button> |
||||
@click="handleCancle">取 消</el-button> |
<el-button |
||||
<el-button size="small" |
size="small" |
||||
type="primary" |
type="primary" |
||||
:disabled="btnDisable" |
:disabled="btnDisable" |
||||
@click="handleComfirm">确 定</el-button> |
@click="handleComfirm" |
||||
|
>确 定</el-button |
||||
|
> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { mapGetters } from 'vuex' |
import { mapGetters } from "vuex"; |
||||
import { Loading } from 'element-ui' // 引入Loading服务 |
import { Loading } from "element-ui"; // 引入Loading服务 |
||||
import { requestPost, requestGet } from '@/js/dai/request' |
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
|
||||
|
|
||||
|
|
||||
|
let loading; // 加载动画 |
||||
let loading // 加载动画 |
|
||||
export default { |
export default { |
||||
data() { |
data() { |
||||
return { |
return { |
||||
btnDisable: false, |
btnDisable: false, |
||||
|
|
||||
|
|
||||
formData: { |
formData: { |
||||
title: '',// |
title: "", // |
||||
remindTime: '',// |
remindTime: "", // |
||||
isPublic: '',// |
isPublic: "", // |
||||
remark: '',// |
remark: "", // |
||||
scheduleId: '', |
scheduleId: "", |
||||
happenedTime: '' |
happenedTime: "", |
||||
}, |
}, |
||||
|
|
||||
|
|
||||
gongkaiArray: [ |
gongkaiArray: [ |
||||
{ |
{ |
||||
value: '0', |
value: "0", |
||||
label: '仅自己可见' |
label: "仅自己可见", |
||||
}, |
}, |
||||
{ |
{ |
||||
value: '1', |
value: "1", |
||||
label: '组织内其他人可见' |
label: "组织内其他人可见", |
||||
}, |
}, |
||||
|
|
||||
], |
], |
||||
|
}; |
||||
} |
|
||||
}, |
}, |
||||
|
|
||||
watch: { |
watch: {}, |
||||
|
|
||||
}, |
|
||||
components: {}, |
components: {}, |
||||
async mounted() { |
async mounted() { |
||||
|
|
||||
if (this.scheduleId) { |
if (this.scheduleId) { |
||||
this.formData.scheduleId = this.scheduleId |
this.formData.scheduleId = this.scheduleId; |
||||
await this.loadInfo() |
await this.loadInfo(); |
||||
|
|
||||
} else { |
} else { |
||||
this.$refs.ref_form.resetFields(); |
this.$refs.ref_form.resetFields(); |
||||
} |
} |
||||
|
|
||||
}, |
}, |
||||
|
|
||||
|
|
||||
methods: { |
methods: { |
||||
|
|
||||
async handleComfirm() { |
async handleComfirm() { |
||||
|
this.handleAdd(); |
||||
this.handleAdd() |
|
||||
}, |
}, |
||||
|
|
||||
async loadInfo() { |
async loadInfo() { |
||||
const url = `/resi/partymember/icSchedule/${this.scheduleId}`; |
const url = `/resi/partymember/icSchedule/${this.scheduleId}`; |
||||
// const url = `http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
// const url = `http://yapi.elinkservice.cn/mock/245/resi/partymember/icPartyAct/act-detail/${this.icPartyActId}`; |
||||
|
|
||||
let params = {} |
let params = {}; |
||||
|
|
||||
const { data, code, msg } = await requestPost(url, params) |
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
if (code === 0) { |
if (code === 0) { |
||||
this.formData = { ...data } |
this.formData = { ...data }; |
||||
this.formData.scheduleId = this.scheduleId |
this.formData.scheduleId = this.scheduleId; |
||||
|
|
||||
} else { |
} else { |
||||
this.$message.error(msg) |
this.$message.error(msg); |
||||
} |
} |
||||
}, |
}, |
||||
|
|
||||
async handleAdd() { |
async handleAdd() { |
||||
|
this.btnDisable = true; |
||||
this.btnDisable = true |
|
||||
setTimeout(() => { |
setTimeout(() => { |
||||
this.btnDisable = false |
this.btnDisable = false; |
||||
}, 10000) |
}, 10000); |
||||
this.$refs['ref_form'].validate((valid, messageObj) => { |
this.$refs["ref_form"].validate((valid, messageObj) => { |
||||
if (!valid) { |
if (!valid) { |
||||
|
this.btnDisable = false; |
||||
this.btnDisable = false |
|
||||
} else { |
} else { |
||||
|
this.addSchedule(); |
||||
this.addSchedule() |
|
||||
|
|
||||
} |
} |
||||
|
}); |
||||
}) |
|
||||
|
|
||||
}, |
}, |
||||
|
|
||||
async addSchedule() { |
async addSchedule() { |
||||
|
console.log(this.formData); |
||||
|
|
||||
console.log(this.formData) |
const url = "/resi/partymember/icSchedule/addOrEdit"; |
||||
|
|
||||
|
|
||||
const url = '/resi/partymember/icSchedule/addOrEdit' |
|
||||
// const url = 'http://yapi.elinkservice.cn/mock/245/icSchedule/addOrEdit' |
// const url = 'http://yapi.elinkservice.cn/mock/245/icSchedule/addOrEdit' |
||||
let params = { |
let params = { |
||||
|
...this.formData, |
||||
...this.formData |
}; |
||||
} |
|
||||
//params.happenedTime = this.formData+" 08:00:00" |
//params.happenedTime = this.formData+" 08:00:00" |
||||
|
|
||||
const { data, code, msg } = await requestPost(url, params) |
const { data, code, msg } = await requestPost(url, params); |
||||
|
|
||||
if (code === 0) { |
if (code === 0) { |
||||
this.$message.success('操作成功') |
this.$message.success("操作成功"); |
||||
this.resetData() |
this.resetData(); |
||||
this.$emit('handleOk') |
this.$emit("handleOk"); |
||||
} else { |
} else { |
||||
this.$message.error(msg) |
this.$message.error(msg); |
||||
} |
} |
||||
}, |
}, |
||||
|
|
||||
|
|
||||
|
|
||||
handleCancle() { |
handleCancle() { |
||||
this.resetData() |
this.resetData(); |
||||
this.$emit('handleClose') |
this.$emit("handleClose"); |
||||
|
|
||||
}, |
}, |
||||
|
|
||||
resetData() { |
resetData() { |
||||
this.scheduleId = '' |
this.scheduleId = ""; |
||||
this.formData = { |
this.formData = { |
||||
title: '',// |
title: "", // |
||||
remindTime: '',// |
remindTime: "", // |
||||
isPublic: '',// |
isPublic: "", // |
||||
remark: '',// |
remark: "", // |
||||
scheduleId: '', |
scheduleId: "", |
||||
} |
}; |
||||
|
|
||||
}, |
}, |
||||
// 开启加载动画 |
// 开启加载动画 |
||||
startLoading() { |
startLoading() { |
||||
loading = Loading.service({ |
loading = Loading.service({ |
||||
lock: true, // 是否锁定 |
lock: true, // 是否锁定 |
||||
text: '正在加载……', // 加载中需要显示的文字 |
text: "正在加载……", // 加载中需要显示的文字 |
||||
background: 'rgba(0,0,0,.7)' // 背景颜色 |
background: "rgba(0,0,0,.7)", // 背景颜色 |
||||
}) |
}); |
||||
}, |
}, |
||||
// 结束加载动画 |
// 结束加载动画 |
||||
endLoading() { |
endLoading() { |
||||
// clearTimeout(timer); |
// clearTimeout(timer); |
||||
if (loading) { |
if (loading) { |
||||
loading.close() |
loading.close(); |
||||
} |
|
||||
} |
} |
||||
}, |
}, |
||||
|
}, |
||||
computed: { |
computed: { |
||||
dataRule() { |
dataRule() { |
||||
return { |
return { |
||||
|
|
||||
title: [ |
title: [ |
||||
{ required: true, message: '日程标题不能为空', trigger: 'change' }, |
{ required: true, message: "日程标题不能为空", trigger: "change" }, |
||||
], |
], |
||||
remindTime: [ |
remindTime: [ |
||||
{ required: true, message: '提醒时间不能为空', trigger: 'change' } |
{ required: true, message: "提醒时间不能为空", trigger: "change" }, |
||||
], |
], |
||||
happenedTime: [ |
happenedTime: [ |
||||
{ required: true, message: '日程时间不能为空', trigger: 'change' } |
{ required: true, message: "日程时间不能为空", trigger: "change" }, |
||||
], |
], |
||||
isPublic: [ |
isPublic: [ |
||||
{ required: true, message: '是否公开不能为空', trigger: 'change' } |
{ required: true, message: "是否公开不能为空", trigger: "change" }, |
||||
], |
], |
||||
|
}; |
||||
} |
|
||||
}, |
}, |
||||
|
|
||||
}, |
}, |
||||
props: { |
props: { |
||||
|
formType: { |
||||
|
//表单操作类型 add新增，edit编辑，detail详情,feedback反馈 |
||||
formType: { //表单操作类型 add新增，edit编辑，detail详情,feedback反馈 |
|
||||
type: String, |
type: String, |
||||
required: '' |
required: "", |
||||
}, |
}, |
||||
scheduleId: { //表单操作类型 add新增，edit编辑，detail详情,feedback反馈 |
scheduleId: { |
||||
|
//表单操作类型 add新增，edit编辑，detail详情,feedback反馈 |
||||
type: String, |
type: String, |
||||
required: '' |
required: "", |
||||
}, |
}, |
||||
|
}, |
||||
|
}; |
||||
} |
|
||||
} |
|
||||
</script> |
</script> |
||||
|
|
||||
|
|
||||
<style lang="scss" scoped> |
<style lang="scss" scoped> |
||||
@import "@/assets/scss/modules/management/form-main.scss"; |
@import "@/assets/scss/modules/management/form-main.scss"; |
||||
</style> |
</style> |
||||
|
|||||
Loading…
Reference in new issue