141 lines
3.4 KiB
Vue
141 lines
3.4 KiB
Vue
<template>
|
|
<el-form
|
|
:model="ruleForm"
|
|
ref="ruleForm"
|
|
label-width="150px"
|
|
class="demo-ruleForm"
|
|
>
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item
|
|
label="活动标题"
|
|
prop="activityTitle"
|
|
:rules="[
|
|
{
|
|
required: true,
|
|
message: '活动标题不能为空',
|
|
trigger: 'blur',
|
|
},
|
|
]"
|
|
>
|
|
<el-input v-model="ruleForm.activityTitle"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item
|
|
label="活动副标题"
|
|
prop="activitySubTitle"
|
|
label-width="150px"
|
|
>
|
|
<el-input v-model="ruleForm.activitySubTitle"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- 第二行 -->
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item
|
|
label="活动开始时间"
|
|
label-width="150px"
|
|
prop="activityStartTime"
|
|
:rules="[
|
|
{
|
|
required: true,
|
|
message: '活动开始时间不能为空',
|
|
trigger: 'blur',
|
|
},
|
|
]"
|
|
>
|
|
<el-date-picker
|
|
v-model="ruleForm.activityStartTime"
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
type="datetime"
|
|
placeholder="选择开始时间"
|
|
style="width: 100%"
|
|
>
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item
|
|
label="活动结束时间"
|
|
label-width="150px"
|
|
prop="activityEndTime"
|
|
:rules="[
|
|
{
|
|
required: true,
|
|
message: '活动结束时间不能为空',
|
|
trigger: 'blur',
|
|
},
|
|
]"
|
|
>
|
|
<el-date-picker
|
|
v-model="ruleForm.activityEndTime"
|
|
value-format="yyyy-MM-dd HH:mm:ss"
|
|
type="datetime"
|
|
placeholder="选择结束时间"
|
|
style="width: 100%"
|
|
>
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- 其余部分保留 -->
|
|
<el-row :gutter="20">
|
|
<el-col :span="12">
|
|
<el-form-item
|
|
label="活动封面图"
|
|
prop="avatarImgUrl"
|
|
label-width="150px"
|
|
>
|
|
<el-input v-model="ruleForm.avatarImgUrl"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="活动简介" prop="activityInfo" label-width="150px">
|
|
<el-input v-model="ruleForm.activityInfo"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- 其他代码按原样继续 -->
|
|
|
|
<!-- 底部 -->
|
|
<el-col :span="24">
|
|
<el-form-item label="活动详情" prop="activityDetails">
|
|
<el-input type="textarea" v-model="ruleForm.activityDetails"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-form>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "NewActivityForm",
|
|
props: {
|
|
ruleForm: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
isPriceDisabled: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
},
|
|
methods: {
|
|
handlePayTypeChange(value) {
|
|
this.$emit("pay-type-change", value); // 触发父组件的事件
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.demo-ruleForm {
|
|
padding: 20px;
|
|
}
|
|
</style>
|
|
|