|
|
@@ -1,30 +1,26 @@
|
|
1
|
1
|
<template>
|
|
2
|
2
|
<div id="root">
|
|
3
|
|
- <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-position="top" label-width="150px" class="ruleForm">
|
|
4
|
|
- <el-form-item prop="activityTitle">
|
|
5
|
|
- <div>活动标题 <el-input v-model="ruleForm.activityTitle" placeholder="20字以内" style="width: 80%;padding-left:5.5%;"/></div>
|
|
|
3
|
+ <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-position="left" label-width="180px" class="ruleForm">
|
|
|
4
|
+ <el-form-item label="活动标题" prop="activityTitle">
|
|
|
5
|
+ <el-input v-model="ruleForm.activityTitle" placeholder="20字以内" style="width: 620px;"/>
|
|
6
|
6
|
</el-form-item>
|
|
7
|
|
- <el-form-item prop="activityCarouselImg">
|
|
|
7
|
+ <el-form-item label="活动轮播图" prop="activityCarouselImg">
|
|
8
|
8
|
<div >
|
|
9
|
|
- <div style="transform:translateY(250%);">活动轮播图</div>
|
|
10
|
|
- <div style="width: 500px;padding-left:14%;">
|
|
11
|
|
- <el-upload
|
|
12
|
|
- :show-file-list="false"
|
|
13
|
|
- :on-success="handleAvatarSuccess"
|
|
14
|
|
- :before-upload="beforeAvatarUpload"
|
|
15
|
|
- class="avatar-uploader"
|
|
16
|
|
- name="uploadFiles"
|
|
17
|
|
- :action="uploadImgUrl">
|
|
18
|
|
- <img v-if="imageUrl" :src="imageUrl" class="avatar">
|
|
19
|
|
- <i v-else class="el-icon-plus avatar-uploader-icon"/>
|
|
20
|
|
- </el-upload>
|
|
21
|
|
- </div>
|
|
|
9
|
+ <el-upload
|
|
|
10
|
+ :show-file-list="false"
|
|
|
11
|
+ :on-success="handleAvatarSuccess"
|
|
|
12
|
+ :before-upload="beforeAvatarUpload"
|
|
|
13
|
+ :action="uploadImgUrl"
|
|
|
14
|
+ class="avatar-uploader"
|
|
|
15
|
+ name="uploadFiles">
|
|
|
16
|
+ <img v-if="imageUrl" :src="imageUrl" class="avatar">
|
|
|
17
|
+ <i v-else class="el-icon-plus avatar-uploader-icon"/>
|
|
|
18
|
+ </el-upload>
|
|
22
|
19
|
</div>
|
|
23
|
20
|
</el-form-item>
|
|
24
|
|
- <el-form-item>
|
|
25
|
|
- <span style="transform:translateY(700%)">活动详情描述</span>
|
|
26
|
|
- <div style="padding-left:14%;transform:translateY(-15%)"><wangeditor :content="ruleForm.activityContent" @wangeditorEvent="wangeditorValue"/></div>
|
|
27
|
|
- </el-form-item>
|
|
|
21
|
+ <el-form-item label="活动详情描述" prop="activityContent">
|
|
|
22
|
+ <div style="transform:translateY(-15%); margin-top: 60px;"><wangeditor :content="ruleForm.activityContent" @wangeditorEvent="wangeditorValue"/></div>
|
|
|
23
|
+ </el-form-item>
|
|
28
|
24
|
<!-- <el-form-item>
|
|
29
|
25
|
<div >
|
|
30
|
26
|
<div style="transform:translateY(250%);">活动配图</div>
|
|
|
@@ -44,15 +40,13 @@
|
|
44
|
40
|
<img :src="dialogImageUrl" width="100%" alt="">
|
|
45
|
41
|
</el-dialog>
|
|
46
|
42
|
</el-form-item> -->
|
|
47
|
|
- <el-form-item prop="signUpMax">
|
|
48
|
|
- <div style="display: flex;">
|
|
49
|
|
- <span style="width: 140px;">报名人数上限</span>
|
|
50
|
|
- <el-input v-model="ruleForm.signUpMax" placeholder="填写0则不限制报名人数"/>
|
|
|
43
|
+ <el-form-item label="报名人数上限" prop="signUpMax">
|
|
|
44
|
+ <div style="display: flex; width: 620px; justify-content: flex-end;">
|
|
|
45
|
+ <el-input v-model="ruleForm.signUpMax" style="width: 220px;" placeholder="填写0则不限制报名人数"/>
|
|
51
|
46
|
</div>
|
|
52
|
47
|
</el-form-item>
|
|
53
|
|
- <el-form-item prop="registrationEndTime">
|
|
54
|
|
- <div style="display: flex;">
|
|
55
|
|
- <span style="width: 120px;">报名截止时间</span>
|
|
|
48
|
+ <el-form-item label="报名截止时间" prop="registrationEndTime">
|
|
|
49
|
+ <div style="display: flex; width: 620px; justify-content: flex-end;">
|
|
56
|
50
|
<el-date-picker
|
|
57
|
51
|
v-model="ruleForm.registrationEndTime"
|
|
58
|
52
|
value-format="timestamp"
|
|
|
@@ -60,20 +54,24 @@
|
|
60
|
54
|
placeholder="选择日期"/>
|
|
61
|
55
|
</div>
|
|
62
|
56
|
</el-form-item>
|
|
63
|
|
- <el-form-item>
|
|
64
|
|
- <div style="display: flex;">
|
|
65
|
|
- <span style="width: 200px;transform:translateY(1%);">是否需要报名人扫码签到</span>
|
|
|
57
|
+ <el-form-item label="是否需要报名人扫码签到" prop="radio">
|
|
|
58
|
+ <div style="display: flex; width: 620px; justify-content: flex-end;">
|
|
66
|
59
|
<el-radio v-model="ruleForm.radio" label="1" style="padding-left:4%;font-weight:bold;font-size:12px;transform:translateY(30%);">需要</el-radio>
|
|
67
|
|
- <el-radio v-model="ruleForm.radio" label="2" style="padding-left:6%;font-weight:bold;font-size:12px;transform:translateY(30%);">不需要</el-radio>
|
|
|
60
|
+ <el-radio v-model="ruleForm.radio" label="2" style="padding-left:6%;font-weight:bold;font-size:12px;transform:translateY(30%);">不需要</el-radio>
|
|
68
|
61
|
</div>
|
|
69
|
62
|
</el-form-item>
|
|
70
|
|
- <el-form-item prop="sort">
|
|
71
|
|
- <div style="display: flex; justify-content: flex-start;">
|
|
72
|
|
- <span style="width: 120px;">权重值</span>
|
|
|
63
|
+ <div style="width: 500px;">
|
|
|
64
|
+ <span style="color: darkgray;">选择扫码签到，活动发布后点击活动详情可以下载二维码图片，打印图片放置到活动现场，参加活动的用户即可扫码签到，方便统计活动实际参与人数。</span>
|
|
|
65
|
+ </div>
|
|
|
66
|
+ <el-form-item label="权重值" prop="sort" style="margin-top: 20px;">
|
|
|
67
|
+ <div style="display: flex; width: 620px; justify-content: flex-end;">
|
|
73
|
68
|
<el-input-number v-model="ruleForm.sort" :min="1" label="权重值" @change="sortHandleChange"/>
|
|
74
|
69
|
</div>
|
|
75
|
70
|
</el-form-item>
|
|
76
|
|
- <el-form-item style="display: flex; justify-content: center;">
|
|
|
71
|
+ <div style="width: 500px;">
|
|
|
72
|
+ <span style="color: darkgray;">权重值越大，在活动列表中排序越靠前，权重相同时按发布时间排序</span>
|
|
|
73
|
+ </div>
|
|
|
74
|
+ <el-form-item style="display: flex; justify-content: center; margin-top: 20px;">
|
|
77
|
75
|
<el-button type="primary" @click="resetForm('ruleForm')">存为草稿</el-button>
|
|
78
|
76
|
<el-button type="primary" @click="submitForm('ruleForm')">发布</el-button>
|
|
79
|
77
|
</el-form-item>
|
|
|
@@ -97,7 +95,7 @@ export default {
|
|
97
|
95
|
registrationEndTime: '', // 报名活动结束时间
|
|
98
|
96
|
sort: 1, // 权重
|
|
99
|
97
|
status: '', // 状态 0 是已作废 1 是已发布 2 是草稿 3 是已修改
|
|
100
|
|
- radio:''
|
|
|
98
|
+ radio: ''
|
|
101
|
99
|
},
|
|
102
|
100
|
imageUrl: '', // 轮播图预览
|
|
103
|
101
|
dialogVisible: false, // 活动配图, 默认不显示 (以单张为单位)
|
|
|
@@ -118,9 +116,15 @@ export default {
|
|
118
|
116
|
],
|
|
119
|
117
|
sort: [
|
|
120
|
118
|
{ required: true, message: '请输入权重值', trigger: 'change' }
|
|
|
119
|
+ ],
|
|
|
120
|
+ activityCarouselImg: [
|
|
|
121
|
+ { required: true, message: '轮播图未上传', trigger: 'blur' }
|
|
|
122
|
+ ],
|
|
|
123
|
+ radio: [
|
|
|
124
|
+ { required: true, message: '请选择是否需要报名人扫码签到', trigger: 'blur' }
|
|
121
|
125
|
]
|
|
122
|
126
|
},
|
|
123
|
|
- uploadImgUrl: process.env.BASE_API + '/uploadimage',
|
|
|
127
|
+ uploadImgUrl: process.env.BASE_API + '/uploadimage'
|
|
124
|
128
|
}
|
|
125
|
129
|
},
|
|
126
|
130
|
methods: {
|
|
|
@@ -194,13 +198,13 @@ export default {
|
|
194
|
198
|
loading.close()
|
|
195
|
199
|
return
|
|
196
|
200
|
}
|
|
197
|
|
- console.log('this.ruleForm.activityContent',this.ruleForm.activityContent)
|
|
198
|
|
- if(this.ruleForm.activityContent == '<p><br></p>'){
|
|
199
|
|
- this.$message.error('活动详情描述不能为空!')
|
|
200
|
|
- loading.close()
|
|
201
|
|
- return
|
|
202
|
|
- }
|
|
203
|
|
- if (this.ruleForm.activityContent =='') {
|
|
|
201
|
+ console.log('this.ruleForm.activityContent', this.ruleForm.activityContent)
|
|
|
202
|
+ if (this.ruleForm.activityContent === '<p><br></p>') {
|
|
|
203
|
+ this.$message.error('活动详情描述不能为空!')
|
|
|
204
|
+ loading.close()
|
|
|
205
|
+ return
|
|
|
206
|
+ }
|
|
|
207
|
+ if (this.ruleForm.activityContent === '') {
|
|
204
|
208
|
this.$message.error('活动详情描述不能为空')
|
|
205
|
209
|
loading.close()
|
|
206
|
210
|
return
|
|
|
@@ -225,8 +229,8 @@ export default {
|
|
225
|
229
|
},
|
|
226
|
230
|
// 富文本
|
|
227
|
231
|
wangeditorValue(value) {
|
|
228
|
|
- console.log('value',value)
|
|
229
|
|
- this.ruleForm.activityContent = value // 在这里接受子组件传过来的参数，赋值给data里的参数
|
|
|
232
|
+ console.log('value', value)
|
|
|
233
|
+ this.ruleForm.activityContent = value // 在这里接受子组件传过来的参数，赋值给data里的参数
|
|
230
|
234
|
}
|
|
231
|
235
|
}
|
|
232
|
236
|
}
|
