Commit 1399205cf6dfde309cce67823467298556dfa50f
1 parent
f0066638
Exists in
master
feat:研学成果改版
Showing
10 changed files
with
189 additions
and
134 deletions
Show diff stats
172 KB
1015 Bytes
1.13 KB
4.54 KB
src/assets/changeSchool.png
32.2 KB
src/router/index.js
... | ... | @@ -43,6 +43,7 @@ import dayStudy from '@/views/dayStudy/dayStudy.vue' //每日一习主页面 |
43 | 43 | import studyList from '@/views/dayStudy/studyList.vue' //每日一习主页面 |
44 | 44 | import ans_question from '@/views/answerRank/ans_question.vue' //答题 |
45 | 45 | import switchUser from '@/views/answerRank/switchUser.vue' //切换 |
46 | +import store from '../store' | |
46 | 47 | |
47 | 48 | Vue.use(VueRouter) |
48 | 49 | const [routerPush, routerReplace] = [VueRouter.prototype.push, VueRouter.prototype.replace]; | ... | ... |
src/store/index.js
src/views/Yanxue/achievementsOne.vue
1 | 1 | <template> |
2 | 2 | <div class="cardBox"> |
3 | - <!-- <van-tabs v-model="tabsName"> | |
4 | - <van-tab title="红色教育"></van-tab> | |
5 | - <van-tab title="劳动教育"></van-tab> | |
6 | - <van-tab title="课外实践"></van-tab> | |
7 | - <van-tab title="研学旅行"></van-tab> | |
8 | - </van-tabs> --> | |
9 | 3 | <van-tabs v-model="sort" @click="tabsClick"> |
10 | 4 | <van-tab title="发布时间">发布时间</van-tab> |
11 | 5 | <van-tab title="点赞量">点赞量</van-tab> |
... | ... | @@ -15,30 +9,9 @@ |
15 | 9 | <van-list |
16 | 10 | v-model="loading" |
17 | 11 | :finished="finished" |
18 | - finished-text="没有更多了" | |
12 | + :finished-text="finishedText" | |
19 | 13 | @load="getData" |
20 | 14 | > |
21 | - <!-- <div | |
22 | - class="art_card_pic" | |
23 | - v-for="(v, i) in newsList" | |
24 | - :key="i" | |
25 | - @click="toDetails(v)" | |
26 | - > | |
27 | - <div class="art_context"> | |
28 | - <div class="art_title">{{ v.titleDesc }}</div> | |
29 | - <div class="art_bot"> | |
30 | - <div class="greyTime"> | |
31 | - 点赞量 {{ v.likeNumber }} | |
32 | - </div> | |
33 | - <div class="greyFont"> | |
34 | - 浏览量 {{ v.readNumber }} | |
35 | - </div> | |
36 | - </div> | |
37 | - </div> | |
38 | - <div class="art_pic"> | |
39 | - <img :src="v.imgUrl" /> | |
40 | - </div> | |
41 | - </div> --> | |
42 | 15 | <div |
43 | 16 | class="new_card" |
44 | 17 | v-for="(v, i) in newsList" |
... | ... | @@ -50,24 +23,26 @@ |
50 | 23 | </div> |
51 | 24 | <div class="new_card_title">{{ v.titleDesc }}</div> |
52 | 25 | <div class="new_card_bot"> |
53 | - <div class="card_bot_L"></div> | |
26 | + <div class="card_bot_L">{{ v.schoolName }}</div> | |
54 | 27 | <div class="card_bot_R"> |
55 | 28 | <div class="greyTime"> |
56 | - 点赞量 {{ v.likeNumber }} | |
29 | + <img src="@/assets/Travel/dz.png" /> {{ v.likeNumber }} | |
57 | 30 | </div> |
58 | 31 | <div class="greyFont"> |
59 | - 浏览量 {{ v.readNumber }} | |
32 | + <img src="@/assets/Travel/ll.png" /> {{ v.readNumber }} | |
60 | 33 | </div> |
61 | 34 | </div> |
62 | 35 | </div> |
63 | 36 | </div> |
64 | 37 | </van-list> |
65 | - <div class="orgBtn" @click="toChoose" v-if="!schoolId">点击查看更多研学成果</div> | |
38 | + <div class="orgBtn" @click="toChoose" v-if="!schoolId"> | |
39 | + 点击查看更多研学成果 | |
40 | + </div> | |
66 | 41 | </div> |
67 | 42 | |
68 | 43 | <van-empty description="暂无数据" v-else /> |
69 | 44 | |
70 | - <div class="imgPic" @click="toChoose" v-if="schoolId"> | |
45 | + <div class="imgPic" @click="toQueryNull" v-if="schoolId"> | |
71 | 46 | <img src="@/assets/changeSchool.png" /> |
72 | 47 | </div> |
73 | 48 | |
... | ... | @@ -81,7 +56,6 @@ export default { |
81 | 56 | components: { Tabbar4 }, |
82 | 57 | data() { |
83 | 58 | return { |
84 | - tabsName: 1, | |
85 | 59 | newsList: [], |
86 | 60 | pageNum: 1, |
87 | 61 | pageSize: 10, |
... | ... | @@ -91,9 +65,12 @@ export default { |
91 | 65 | }; |
92 | 66 | }, |
93 | 67 | computed: { |
94 | - schoolId() { | |
95 | - return this.$route.query.schoolId ? this.$route.query.schoolId : '' | |
96 | - } | |
68 | + schoolId() { | |
69 | + return this.$route.query.schoolId ? this.$route.query.schoolId : ""; | |
70 | + }, | |
71 | + finishedText() { | |
72 | + return this.$route.query.schoolId ? '没有更多数据了': ""; | |
73 | + } | |
97 | 74 | }, |
98 | 75 | methods: { |
99 | 76 | //详情新闻 |
... | ... | @@ -107,6 +84,11 @@ export default { |
107 | 84 | toChoose() { |
108 | 85 | this.$router.push({ name: "chooseSchoolOne" }); |
109 | 86 | }, |
87 | + //选择 | |
88 | + toQueryNull() { | |
89 | + this.$router.push({ name: "achievementsOne" }); | |
90 | + location.reload() | |
91 | + }, | |
110 | 92 | tabsClick() { |
111 | 93 | this.newsList = []; |
112 | 94 | this.pageNum = 1; |
... | ... | @@ -118,11 +100,11 @@ export default { |
118 | 100 | // let schoolId = this.$route.query.schoolId |
119 | 101 | // ? this.$route.query.schoolId |
120 | 102 | // : ""; |
121 | - let pageSize = this.pageSize | |
122 | - let pageNum = this.pageNum | |
123 | - if(!this.schoolId){ | |
124 | - pageSize = 10 | |
125 | - pageNum = 1 | |
103 | + let pageSize = this.pageSize; | |
104 | + let pageNum = this.pageNum; | |
105 | + if (!this.schoolId) { | |
106 | + pageSize = 10; | |
107 | + pageNum = 1; | |
126 | 108 | } |
127 | 109 | this.yxAxios |
128 | 110 | .get( |
... | ... | @@ -133,18 +115,17 @@ export default { |
133 | 115 | ) |
134 | 116 | .then((res) => { |
135 | 117 | if (res.data.code == 200) { |
136 | - if(!this.schoolId) { | |
137 | - this.loading = false; | |
138 | - this.newsList = res.data.data.list | |
139 | - this.finished = true; | |
140 | - return | |
118 | + if (!this.schoolId) { | |
119 | + this.loading = false; | |
120 | + this.newsList = res.data.data.list; | |
121 | + this.finished = true; | |
122 | + return; | |
141 | 123 | } |
142 | 124 | |
143 | 125 | this.newsList = this.newsList.concat( |
144 | 126 | res.data.data.list |
145 | 127 | ); |
146 | 128 | this.loading = false; |
147 | - | |
148 | 129 | |
149 | 130 | if ( |
150 | 131 | this.pageSize * this.pageNum >= |
... | ... | @@ -174,7 +155,7 @@ export default { |
174 | 155 | .cardBox { |
175 | 156 | padding: 2vw 0; |
176 | 157 | box-sizing: border-box; |
177 | - background-color: #FEFEFE; | |
158 | + background-color: #fefefe; | |
178 | 159 | |
179 | 160 | .contextBox { |
180 | 161 | margin-top: 20px; |
... | ... | @@ -332,29 +313,53 @@ export default { |
332 | 313 | color: #999; |
333 | 314 | font-size: 24px; |
334 | 315 | margin: 0; |
316 | + max-width: 20vw; | |
317 | + white-space: nowrap; //文本强制不换行; | |
318 | + text-overflow: ellipsis; //文本溢出显示省略号; | |
319 | + overflow: hidden; //溢出的部分隐藏; | |
320 | + -webkit-line-clamp: 2; | |
321 | + display: flex; | |
322 | + align-items: center; | |
323 | + | |
324 | + img { | |
325 | + width: 24px; | |
326 | + margin-right: 7px; | |
327 | + } | |
335 | 328 | } |
336 | 329 | |
337 | 330 | .greyFont { |
338 | 331 | color: #999; |
339 | 332 | font-size: 24px; |
340 | 333 | margin-left: 20px; |
334 | + max-width: 20vw; | |
335 | + white-space: nowrap; //文本强制不换行; | |
336 | + text-overflow: ellipsis; //文本溢出显示省略号; | |
337 | + overflow: hidden; //溢出的部分隐藏; | |
338 | + -webkit-line-clamp: 2; | |
339 | + display: flex; | |
340 | + align-items: center; | |
341 | + | |
342 | + img { | |
343 | + width: 25px; | |
344 | + margin-right: 7px; | |
345 | + } | |
341 | 346 | } |
342 | 347 | } |
343 | 348 | } |
344 | 349 | } |
345 | 350 | .orgBtn { |
346 | - width: 80vw; | |
347 | - height: 80px; | |
348 | - margin-left: 10vw; | |
349 | - font-size: 33px; | |
350 | - background-color: #ff4444; | |
351 | - background: linear-gradient(to right,#FF3737,#FF6825); | |
352 | - color: #Fff; | |
353 | - display: flex; | |
354 | - justify-content: center; | |
355 | - align-items: center; | |
356 | - border-radius: 40px; | |
357 | - margin-bottom: 20px; | |
351 | + width: 80vw; | |
352 | + height: 80px; | |
353 | + margin-left: 10vw; | |
354 | + font-size: 33px; | |
355 | + background-color: #ff4444; | |
356 | + background: linear-gradient(to right, #ff3737, #ff6825); | |
357 | + color: #fff; | |
358 | + display: flex; | |
359 | + justify-content: center; | |
360 | + align-items: center; | |
361 | + border-radius: 40px; | |
362 | + margin-bottom: 20px; | |
358 | 363 | } |
359 | 364 | } |
360 | 365 | .imgPic { | ... | ... |
src/views/Yanxue/chooseSchoolOne.vue
1 | 1 | <template> |
2 | - <div class="cardBox"> | |
3 | - <van-tabs v-model="tabsName" @change="tabsChange"> | |
2 | + <div class="cardBox"> | |
3 | + <!-- <van-tabs v-model="tabsName" @change="tabsChange"> | |
4 | 4 | <van-tab title="小学"></van-tab> |
5 | 5 | <van-tab title="初中"></van-tab> |
6 | 6 | <van-tab title="高中"></van-tab> |
7 | - </van-tabs> | |
7 | + </van-tabs> --> | |
8 | + <div class="card"> | |
9 | + <div | |
10 | + :class=" | |
11 | + [ | |
12 | + 'card_item', | |
13 | + tabsName == v.value ? 'item_check' : 'item_nocheck', | |
14 | + ].join(' ') | |
15 | + " | |
16 | + v-for="(v, i) in typelist" | |
17 | + :key="i" | |
18 | + @click="tabsChange(v)" | |
19 | + > | |
20 | + {{ v.label }} | |
21 | + </div> | |
22 | + </div> | |
23 | + <div class="line"></div> | |
8 | 24 | |
9 | - <div class="schoolCss"> | |
10 | - <div | |
11 | - class="school-one" | |
12 | - v-for="(v, i) in schoolList" | |
13 | - :key="i" | |
14 | - @click="toActive(v)" | |
15 | - > | |
16 | - {{ v.name }} | |
17 | - </div> | |
25 | + <div :class="[schoolList.length != 0 ? 'schoolCss' : '']"> | |
26 | + <div | |
27 | + class="school-one" | |
28 | + v-for="(v, i) in schoolList" | |
29 | + :key="i" | |
30 | + @click="toActive(v)" | |
31 | + > | |
32 | + {{ v.name }} | |
33 | + </div> | |
34 | + </div> | |
18 | 35 | </div> |
19 | - </div> | |
20 | 36 | </template> |
21 | 37 | |
22 | 38 | <script> |
23 | 39 | export default { |
24 | - data() { | |
25 | - return { | |
26 | - tabsName: 0, | |
27 | - schoolList: [], | |
28 | - }; | |
29 | - }, | |
30 | - watch: { | |
31 | - tabsName(val) { | |
32 | - this.schoolList = []; | |
33 | - this.getList(); | |
40 | + data() { | |
41 | + return { | |
42 | + tabsName: 1, | |
43 | + schoolList: [], | |
44 | + typelist: [ | |
45 | + { label: "幼儿园", value: 0 }, | |
46 | + { label: "小学", value: 1 }, | |
47 | + { label: "初中", value: 2 }, | |
48 | + { label: "高中", value: 3 }, | |
49 | + ], | |
50 | + }; | |
34 | 51 | }, |
35 | - }, | |
36 | - methods: { | |
37 | - toActive(v) { | |
38 | - this.$router.push({ | |
39 | - name: "achievementsOne", | |
40 | - query: { schoolId: v.num }, | |
41 | - }); | |
52 | + watch: { | |
53 | + tabsName(val) { | |
54 | + this.schoolList = []; | |
55 | + this.getList(); | |
56 | + }, | |
42 | 57 | }, |
43 | - //切换 | |
44 | - tabsChange() {}, | |
45 | - getList() { | |
46 | - this.yxAxios | |
47 | - .get(`${this.kqUrl}/schoolConsult/schoolList?schoolType=`+ (this.tabsName +1)) | |
48 | - .then((res) => { | |
49 | - if (res.data.code == 200) { | |
50 | - this.schoolList = res.data.data; | |
51 | - console.log(this.schoolList) | |
52 | - } else { | |
53 | - this.$toast.fail(res.data.message); | |
54 | - } | |
55 | - }); | |
56 | - // this.yxAxios | |
57 | - // .post(`${this.dataUrl}/sys/yx/schoolList`, { | |
58 | - // page: 1, | |
59 | - // pageSize: 999, | |
60 | - // schoolType: this.tabsName +1 | |
61 | - // }) | |
62 | - // .then((res) => { | |
63 | - // if (res.data.success) { | |
64 | - // this.schoolList = res.data.data.list; | |
65 | - // } else { | |
66 | - // this.$toast.fail(res.data.message); | |
67 | - // } | |
68 | - // }); | |
58 | + methods: { | |
59 | + toActive(v) { | |
60 | + this.$router.push({ | |
61 | + name: "achievementsOne", | |
62 | + query: { schoolId: v.num }, | |
63 | + }); | |
64 | + }, | |
65 | + //切换 | |
66 | + tabsChange(v) { | |
67 | + this.tabsName = v.value; | |
68 | + }, | |
69 | + getList() { | |
70 | + this.yxAxios | |
71 | + .get( | |
72 | + `${this.kqUrl}/schoolConsult/schoolList?schoolType=` + | |
73 | + this.tabsName | |
74 | + ) | |
75 | + .then((res) => { | |
76 | + if (res.data.code == 200) { | |
77 | + this.schoolList = res.data.data; | |
78 | + console.log(this.schoolList); | |
79 | + } else { | |
80 | + this.$toast.fail(res.data.message); | |
81 | + } | |
82 | + }); | |
83 | + }, | |
84 | + }, | |
85 | + mounted() { | |
86 | + this.getList(); | |
69 | 87 | }, |
70 | - }, | |
71 | - mounted() { | |
72 | - this.getList(); | |
73 | - }, | |
74 | 88 | }; |
75 | 89 | </script> |
76 | 90 | |
77 | 91 | <style lang="scss" scoped> |
78 | 92 | .cardBox { |
79 | - padding: 2vw 0; | |
80 | - box-sizing: border-box; | |
93 | + padding: 2vw 0; | |
94 | + box-sizing: border-box; | |
95 | + background: url("~@/assets/Travel/cardBox.png"); | |
96 | + min-height: 100vh; | |
97 | + | |
98 | + .card { | |
99 | + display: flex; | |
100 | + justify-content: space-between; | |
101 | + padding: 10px 5vw 20px; | |
102 | + box-sizing: border-box; | |
103 | + | |
104 | + .card_item { | |
105 | + font-size: 4.3vw; | |
106 | + } | |
107 | + .item_check { | |
108 | + font-size: 4.4vw; | |
109 | + color: #fff; | |
110 | + } | |
111 | + .item_nocheck { | |
112 | + opacity: 0.5; | |
113 | + color: #fff; | |
114 | + } | |
115 | + } | |
116 | + .line { | |
117 | + width: 90vw; | |
118 | + border-bottom: 1px dashed #fff; | |
119 | + margin: 20px 5vw; | |
120 | + } | |
81 | 121 | |
82 | - .schoolCss { | |
83 | - font-size: 4.5vw; | |
84 | - margin: 5vw; | |
122 | + .schoolCss { | |
123 | + font-size: 4.5vw; | |
124 | + margin: 5vw; | |
125 | + padding: 0.5vw 4vw; | |
126 | + box-sizing: border-box; | |
127 | + border-radius: 20px; | |
128 | + background-color: #fff; | |
85 | 129 | |
86 | - .school-one { | |
87 | - margin: 4vw 0; | |
88 | - letter-spacing: 0.3vw; | |
89 | - color: #666; | |
90 | - font-size: 4.3vw; | |
130 | + .school-one { | |
131 | + width: 100%; | |
132 | + margin: 6vw 0; | |
133 | + padding: 22px 0 22px 60px; | |
134 | + box-sizing: border-box; | |
135 | + letter-spacing: 0.3vw; | |
136 | + color: #666; | |
137 | + font-size: 4.3vw; | |
138 | + background: url("~@/assets/Travel/schoolBox.png"); | |
139 | + -moz-background-size: 100% 100%; | |
140 | + background-size: 100% 100%; | |
141 | + } | |
91 | 142 | } |
92 | - } | |
93 | 143 | } |
94 | 144 | </style> |
95 | 145 | \ No newline at end of file | ... | ... |