|
@@ -1,14 +1,18 @@
|
1
|
1
|
<template>
|
2
|
2
|
<div id="root">
|
3
|
|
- <span class="activityTile">{{ ruleForm.activityTitle }}</span>
|
4
|
|
- <img :src="ruleForm.activityCarouselImg" width="700" height="500">
|
|
3
|
+ <img :src="ruleForm.announcementCarouselImg" width="500" height="500">
|
|
4
|
+ <span class="activityTile">{{ ruleForm.announcementTitle }}</span>
|
5
|
5
|
<div class="activityContext">
|
6
|
|
- {{ ruleForm.activityContent }}
|
|
6
|
+ {{ ruleForm.announcementContent }}
|
7
|
7
|
</div>
|
8
|
|
- <div class="activityContextImg">
|
9
|
|
- <img v-for="item in ruleForm.contentImg" :src="item" width="700" height="500" >
|
|
8
|
+ <div>
|
|
9
|
+ <template v-for="site in ruleForm.contentImg">
|
|
10
|
+ <img :src="site.url" width="500" height="500" >
|
|
11
|
+ </template>
|
|
12
|
+
|
|
13
|
+ <!-- <img :src="item" width="500" height="500" > -->
|
10
|
14
|
</div>
|
11
|
|
- <div class="progress">
|
|
15
|
+ <!-- <div class="progress">
|
12
|
16
|
<div class="text-progress">
|
13
|
17
|
<span class="people-number">已报名人数 {{ ruleForm.signUpCount }}</span>
|
14
|
18
|
<div class="outer-layer"/>
|
|
@@ -17,10 +21,10 @@
|
17
|
21
|
<div class="circular"/>
|
18
|
22
|
<div class="people-limit">限制{{ ruleForm.signUpMax }}人</div>
|
19
|
23
|
<el-button type="primary" style="float: left;">查看报名名单</el-button>
|
20
|
|
- </div>
|
21
|
|
- <span>报名截止时间:{{ formatDate(ruleForm.registrationEndTime) }}</span>
|
|
24
|
+ </div> -->
|
|
25
|
+ <!-- <span>报名截止时间:{{ formatDate(ruleForm.registrationEndTime) }}</span> -->
|
22
|
26
|
<div class="bom-button">
|
23
|
|
- <el-button type="primary" style="width: 100px;" @click="ediActivity">修改</el-button>
|
|
27
|
+ <el-button type="primary" style="width: 150px;" @click="ediActivity">修改</el-button>
|
24
|
28
|
</div>
|
25
|
29
|
</div>
|
26
|
30
|
</template>
|
|
@@ -33,12 +37,11 @@ export default {
|
33
|
37
|
asOfdate: '2018/10/10 23:59:59',
|
34
|
38
|
ruleForm: {
|
35
|
39
|
id: '',
|
36
|
|
- activityTitle: '',
|
37
|
|
- activityCarouselImg: '', // 轮播图
|
38
|
|
- activityContent: '', // 活动内容详细
|
39
|
|
- contentImg: [], // 活动内容配图
|
|
40
|
+ announcementTitle: '',
|
|
41
|
+ announcementCarouselImg: '', // 轮播图
|
|
42
|
+ announcementContent: '', // 内容详细
|
|
43
|
+ contentImg: [], // 内容配图
|
40
|
44
|
signUpCount: '', // 报名人数统计
|
41
|
|
- signUpMax: '', // 活动人数上限
|
42
|
45
|
registrationEndTime: '', // 报名活动结束时间
|
43
|
46
|
sort: 1, // 权重
|
44
|
47
|
status: '' // 状态 0 是已作废 1 是已发布 2 是草稿 3 是已修改
|
|
@@ -47,17 +50,28 @@ export default {
|
47
|
50
|
},
|
48
|
51
|
mounted() {
|
49
|
52
|
this.getById(this.$route.params.id)
|
50
|
|
- console.log("this.$route.params.id",this.$route.params.id)
|
|
53
|
+ console.log("id",this.id)
|
51
|
54
|
},
|
52
|
55
|
methods: {
|
53
|
56
|
getById(id) { // 根据ID获取活动信息
|
54
|
57
|
console.log(123)
|
55
|
58
|
console.log(id)
|
56
|
|
- this.$store.dispatch('ActivityById', id).then((res) => {
|
57
|
|
- const resData = res.data
|
58
|
|
- this.ruleForm = resData.info
|
59
|
|
- this.ruleForm.contentImg = resData.contentImg
|
|
59
|
+ this.ruleForm.id=this.$route.params.id
|
|
60
|
+ this.$store.dispatch('AnnouncementById', this.ruleForm).then((res) => {
|
|
61
|
+ const resData = res.data
|
|
62
|
+ this.ruleForm.announcementTitle=resData.tpAnnouncement.announcementTitle// 标题
|
|
63
|
+ this.ruleForm.announcementContent=resData.tpAnnouncement.announcementContent// 内容
|
|
64
|
+ this.ruleForm.announcementCarouselImg=resData.tpAnnouncement.announcementCarouselImg // 轮播图
|
|
65
|
+ this.sort=resData.tpAnnouncement.sort// 权重
|
|
66
|
+ //多张图片进行遍历
|
|
67
|
+ for (let i = 0; i <=resData.studentList.length; i++) {
|
|
68
|
+ // this.ruleForm.contentImg.push({ url: resData.studentList[i].imageUrl })
|
|
69
|
+
|
|
70
|
+ console.log("sssss:",resData.studentList.imageUrl[i])
|
|
71
|
+ }
|
60
|
72
|
})
|
|
73
|
+
|
|
74
|
+ console.log(this.ruleForm.contentImg)
|
61
|
75
|
},
|
62
|
76
|
formatDate(val) {
|
63
|
77
|
var value = new Date(val)
|
|
@@ -81,7 +95,7 @@ export default {
|
81
|
95
|
#root {
|
82
|
96
|
display: flex;
|
83
|
97
|
flex-flow: column;
|
84
|
|
- width: 700px;
|
|
98
|
+ width: 500px;
|
85
|
99
|
margin-top: 50px;
|
86
|
100
|
margin-left: auto;
|
87
|
101
|
margin-right: auto;
|
|
@@ -97,30 +111,30 @@ export default {
|
97
|
111
|
font-size: 20px;
|
98
|
112
|
justify-items: center;
|
99
|
113
|
}
|
100
|
|
-.progress {
|
|
114
|
+/* .progress {
|
101
|
115
|
display: flex;
|
102
|
116
|
justify-content: space-between;
|
103
|
117
|
margin-top: 20px;
|
104
|
118
|
margin-bottom: 20px;
|
105
|
|
-}
|
106
|
|
-.text-progress {
|
|
119
|
+} */
|
|
120
|
+/* .text-progress {
|
107
|
121
|
width: 500px;
|
108
|
122
|
float: left;
|
109
|
123
|
align-content: center;
|
110
|
124
|
position: absolute;
|
111
|
125
|
margin-top: 12px;
|
112
|
|
-}
|
113
|
|
-.people-number {
|
|
126
|
+} */
|
|
127
|
+/* .people-number {
|
114
|
128
|
position: relative;
|
115
|
129
|
margin-left: 180px;
|
116
|
|
-}
|
117
|
|
-.outer-layer {
|
|
130
|
+} */
|
|
131
|
+/* .outer-layer {
|
118
|
132
|
background-color: gainsboro;
|
119
|
133
|
height: 3px;
|
120
|
134
|
width: 450px;
|
121
|
135
|
margin-top: -10px;
|
122
|
136
|
position: relative;
|
123
|
|
-}
|
|
137
|
+} */
|
124
|
138
|
.inner-layer {
|
125
|
139
|
background-color: aquamarine;
|
126
|
140
|
height: 6px;
|
|
@@ -128,20 +142,20 @@ export default {
|
128
|
142
|
position: relative;
|
129
|
143
|
margin-top: -4px;
|
130
|
144
|
}
|
131
|
|
-.circular {
|
|
145
|
+/* .circular {
|
132
|
146
|
border: 1px #001528 solid;
|
133
|
147
|
border-radius: 10px;
|
134
|
148
|
/*background-color: chartreuse;*/
|
135
|
|
- width: 20px;
|
|
149
|
+ /* width: 20px;
|
136
|
150
|
height: 20px;
|
137
|
151
|
position: relative;
|
138
|
152
|
margin-left: 452px;
|
139
|
153
|
margin-top: 11px;
|
140
|
154
|
float: left;
|
141
|
|
-}
|
142
|
|
-.people-limit {
|
|
155
|
+} */
|
|
156
|
+/* .people-limit {
|
143
|
157
|
margin-top: 13px;
|
144
|
|
-}
|
|
158
|
+} */
|
145
|
159
|
.bom-button{
|
146
|
160
|
display: flex;
|
147
|
161
|
justify-content: center;
|