SxhGroup / sxhPersonalCenterZLB

Download as
Browse Code »

Commit b083c5499560e7e505596fe07a5ac7d76c1badb1

Authored by 边
1 parent f859853f
Exists in master

feat：柯桥点赞功能

Showing 2 changed files with 258 additions and 200 deletions   Show diff stats
src/views/Yanxue/achievementsOne.vue
  Diff comments   View file @b083c54
1 1 <template>
2   - <div class="cardBox">
3   - <!-- <van-tabs v-model="tabsName">
  2 + <div class="cardBox">
  3 + <!-- <van-tabs v-model="tabsName">
4 4 <van-tab title="红色教育"></van-tab>
5 5 <van-tab title="劳动教育"></van-tab>
6 6 <van-tab title="课外实践"></van-tab>
7 7 <van-tab title="研学旅行"></van-tab>
8 8 </van-tabs> -->
9 9  
10   - <div class="contextBox" v-if="newsList.length != 0">
11   - <div
12   - class="art_card_pic"
13   - v-for="(v, i) in newsList"
14   - :key="i"
15   - @click="toDetails(v)"
16   - >
17   - <div class="art_context">
18   - <div class="art_title">{{ v.titleDesc }}</div>
19   - <div class="art_bot">
20   - <!-- <div class="redSticky" v-if="v.readNumber">置顶</div> -->
21   - <!-- <div class="greyTime">发布于 {{ v.createTime ? Moment(v.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}}</div> -->
22   - <div class="greyTime">点赞量 {{ v.likeNumber }}</div>
23   - <div class="greyFont">浏览量 {{ v.readNumber }}</div>
24   - </div>
  10 + <div class="contextBox" v-if="newsList.length != 0" @load="getData">
  11 + <van-list
  12 + v-model="loading"
  13 + :finished="finished"
  14 + finished-text="没有更多了"
  15 + @load="getData"
  16 + >
  17 + <div
  18 + class="art_card_pic"
  19 + v-for="(v, i) in newsList"
  20 + :key="i"
  21 + @click="toDetails(v)"
  22 + >
  23 + <div class="art_context">
  24 + <div class="art_title">{{ v.titleDesc }}</div>
  25 + <div class="art_bot">
  26 + <!-- <div class="redSticky" v-if="v.readNumber">置顶</div> -->
  27 + <!-- <div class="greyTime">发布于 {{ v.createTime ? Moment(v.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}}</div> -->
  28 + <div class="greyTime">
  29 + 点赞量 {{ v.likeNumber }}
  30 + </div>
  31 + <div class="greyFont">
  32 + 浏览量 {{ v.readNumber }}
  33 + </div>
  34 + </div>
  35 + </div>
  36 + <div class="art_pic">
  37 + <img :src="v.imgUrl" />
  38 + </div>
  39 + </div>
  40 + </van-list>
  41 + <!-- <div
  42 + class="art_card_pic"
  43 + v-for="(v, i) in newsList"
  44 + :key="i"
  45 + @click="toDetails(v)"
  46 + >
  47 + <div class="art_context">
  48 + <div class="art_title">{{ v.titleDesc }}</div>
  49 + <div class="art_bot">
  50 + <div class="greyTime">点赞量 {{ v.likeNumber }}</div>
  51 + <div class="greyFont">浏览量 {{ v.readNumber }}</div>
  52 + </div>
  53 + </div>
  54 + <div class="art_pic">
  55 + <img :src="v.imgUrl" />
  56 + </div>
  57 + </div> -->
25 58 </div>
26   - <div class="art_pic">
27   - <img :src="v.imgUrl" />
28   - </div>
29   - </div>
30   - </div>
31 59  
32   - <van-empty description="暂无数据" v-else/>
  60 + <van-empty description="暂无数据" v-else />
33 61  
34   - <div class="imgPic" @click="toChoose">
35   - <img src="@/assets/changeSchool.png" />
36   - </div>
  62 + <div class="imgPic" @click="toChoose">
  63 + <img src="@/assets/changeSchool.png" />
  64 + </div>
37 65  
38   - <tabbar4 active="fruit"></tabbar4>
39   - </div>
  66 + <tabbar4 active="fruit"></tabbar4>
  67 + </div>
40 68 </template>
41 69  
42 70 <script>
43 71 import Tabbar4 from "@/component/Tabbar4";
44 72 export default {
45   - components: { Tabbar4 },
46   - data() {
47   - return {
48   - tabsName: 1,
49   - newsList: [],
50   - };
51   - },
52   - methods: {
53   - //详情新闻
54   - toDetails(v) {
55   - this.$router.push({ name: "pageDetails" ,query: {schoolId:v.schoolId,dataId: v.id}});
  73 + components: { Tabbar4 },
  74 + data() {
  75 + return {
  76 + tabsName: 1,
  77 + newsList: [],
  78 + pageNum: 1,
  79 + pageSize: 10,
  80 + finished: false,
  81 + loading: false,
  82 + };
56 83 },
57   - //选择
58   - toChoose() {
59   - this.$router.push({ name: "chooseSchoolOne" });
  84 + methods: {
  85 + //详情新闻
  86 + toDetails(v) {
  87 + this.$router.push({
  88 + name: "pageDetails",
  89 + query: { schoolId: v.schoolId, dataId: v.id },
  90 + });
  91 + },
  92 + //选择
  93 + toChoose() {
  94 + this.$router.push({ name: "chooseSchoolOne" });
  95 + },
  96 + getData() {
  97 + this.loading = true;
  98 + let schoolId = this.$route.query.schoolId
  99 + ? this.$route.query.schoolId
  100 + : "";
  101 +
  102 + this.yxAxios
  103 + .get(
  104 + `${this.kqUrl}/schoolConsult/consultList?pageNum=${this.pageNum}&pageSize=${this.pageSize}&schoolId=` +
  105 + schoolId
  106 + )
  107 + .then((res) => {
  108 + if (res.data.code == 200) {
  109 + this.newsList = this.newsList.concat(
  110 + res.data.data.list
  111 + );
  112 + this.loading = false;
  113 + if (
  114 + this.pageSize * this.pageNum >=
  115 + res.data.data.total
  116 + ) {
  117 + this.finished = true;
  118 + } else {
  119 + this.pageNum++;
  120 + }
  121 + } else {
  122 + this.$toast.fail(res.data.message);
  123 + }
  124 + });
  125 + // this.yxAxios
  126 + // .post(`${this.dataUrl}/sys/yx/consultList`, {
  127 + // page: 1,
  128 + // pageSize: 999,
  129 + // schoolId: this.$route.query.schoolId*1
  130 + // })
  131 + // .then((res) => {
  132 + // if (res.data.success) {
  133 + // this.newsList = res.data.data.list;
  134 + // } else {
  135 + // this.$toast.fail(res.data.message);
  136 + // }
  137 + // });
  138 + },
60 139 },
61   - getData() {
62   - let schoolId = this.$route.query.schoolId?this.$route.query.schoolId: ''
63   -
64   - this.yxAxios
65   - .get(`${this.kqUrl}/schoolConsult/consultList?pageNum=1&pageSize=999&schoolId=`+schoolId)
66   - .then((res) => {
67   - if (res.data.code == 200) {
68   - this.newsList = res.data.data.list;
69   - } else {
70   - this.$toast.fail(res.data.message);
71   - }
72   - });
73   - // this.yxAxios
74   - // .post(`${this.dataUrl}/sys/yx/consultList`, {
75   - // page: 1,
76   - // pageSize: 999,
77   - // schoolId: this.$route.query.schoolId*1
78   - // })
79   - // .then((res) => {
80   - // if (res.data.success) {
81   - // this.newsList = res.data.data.list;
82   - // } else {
83   - // this.$toast.fail(res.data.message);
84   - // }
85   - // });
  140 + mounted() {
  141 + this.getData();
86 142 },
87   - },
88   - mounted() {
89   - this.getData()
90   - }
91 143 };
92 144 </script>
93 145  
94 146 <style lang="scss" scoped>
95 147 .cardBox {
96   - padding: 2vw 0;
97   - box-sizing: border-box;
98   -
99   - .contextBox {
100   - margin-bottom: 140px;
101   - .art_card {
102   - padding: 28px;
103   - box-sizing: border-box;
104   -
105   - .art_title {
106   - width: 100%;
107   - font-size: 34px;
108   - font-weight: bold;
109   - display: -webkit-box;
110   - -webkit-box-orient: vertical;
111   - -webkit-line-clamp: 1; //限制行数
112   - overflow: hidden; //超出部分隐藏
113   - text-overflow: ellipsis; //用一个省略号代替超出的内容
114   - }
115   -
116   - .art_bot {
117   - padding-top: 22px;
118   - box-sizing: border-box;
119   - display: flex;
120   - align-items: center;
121   -
122   - .redSticky {
123   - color: #ff4444;
124   - font-size: 24px;
125   - padding: 2px;
126   - box-sizing: border-box;
127   - border: 1px solid #ff4444;
128   - }
  148 + padding: 2vw 0;
  149 + box-sizing: border-box;
129 150  
130   - .greyTime {
131   - color: #999;
132   - font-size: 24px;
133   - margin: 0 20px;
134   - }
  151 + .contextBox {
  152 + margin-bottom: 140px;
  153 + .art_card {
  154 + padding: 28px;
  155 + box-sizing: border-box;
135 156  
136   - .greyFont {
137   - color: #999;
138   - font-size: 24px;
139   -
140   - }
141   - }
142   - }
143   - .art_card_pic {
144   - padding: 28px;
145   - box-sizing: border-box;
146   - display: flex;
147   - justify-content: space-between;
148   -
149   - .art_context {
150   - height: 180px;
151   - display: flex;
152   - align-content: space-between;
153   - flex-wrap: wrap;
154   -
155   - .art_title {
156   - width: 100%;
157   - font-size: 34px;
158   - font-weight: bold;
159   - display: -webkit-box;
160   - -webkit-box-orient: vertical;
161   - -webkit-line-clamp: 2; //限制行数
162   - overflow: hidden; //超出部分隐藏
163   - text-overflow: ellipsis; //用一个省略号代替超出的内容
164   - }
  157 + .art_title {
  158 + width: 100%;
  159 + font-size: 34px;
  160 + font-weight: bold;
  161 + display: -webkit-box;
  162 + -webkit-box-orient: vertical;
  163 + -webkit-line-clamp: 1; //限制行数
  164 + overflow: hidden; //超出部分隐藏
  165 + text-overflow: ellipsis; //用一个省略号代替超出的内容
  166 + }
165 167  
166   - .art_bot {
167   - padding-top: 22px;
168   - box-sizing: border-box;
169   - display: flex;
170   - align-items: center;
  168 + .art_bot {
  169 + padding-top: 22px;
  170 + box-sizing: border-box;
  171 + display: flex;
  172 + align-items: center;
171 173  
172   - .redSticky {
173   - color: #ff4444;
174   - font-size: 24px;
175   - padding: 2px;
  174 + .redSticky {
  175 + color: #ff4444;
  176 + font-size: 24px;
  177 + padding: 2px;
  178 + box-sizing: border-box;
  179 + border: 1px solid #ff4444;
  180 + }
  181 +
  182 + .greyTime {
  183 + color: #999;
  184 + font-size: 24px;
  185 + margin: 0 20px;
  186 + }
  187 +
  188 + .greyFont {
  189 + color: #999;
  190 + font-size: 24px;
  191 + }
  192 + }
  193 + }
  194 + .art_card_pic {
  195 + padding: 28px;
176 196 box-sizing: border-box;
177   - border: 1px solid #ff4444;
178   - }
179   -
180   - .greyTime {
181   - color: #999;
182   - font-size: 24px;
183   - margin: 0 ;
184   - }
185   -
186   - .greyFont {
187   - color: #999;
188   - font-size: 24px;
189   - margin-left: 20px;
190   - }
  197 + display: flex;
  198 + justify-content: space-between;
  199 +
  200 + .art_context {
  201 + height: 180px;
  202 + display: flex;
  203 + align-content: space-between;
  204 + flex-wrap: wrap;
  205 +
  206 + .art_title {
  207 + width: 100%;
  208 + font-size: 34px;
  209 + font-weight: bold;
  210 + display: -webkit-box;
  211 + -webkit-box-orient: vertical;
  212 + -webkit-line-clamp: 2; //限制行数
  213 + overflow: hidden; //超出部分隐藏
  214 + text-overflow: ellipsis; //用一个省略号代替超出的内容
  215 + }
  216 +
  217 + .art_bot {
  218 + padding-top: 22px;
  219 + box-sizing: border-box;
  220 + display: flex;
  221 + align-items: center;
  222 +
  223 + .redSticky {
  224 + color: #ff4444;
  225 + font-size: 24px;
  226 + padding: 2px;
  227 + box-sizing: border-box;
  228 + border: 1px solid #ff4444;
  229 + }
  230 +
  231 + .greyTime {
  232 + color: #999;
  233 + font-size: 24px;
  234 + margin: 0;
  235 + }
  236 +
  237 + .greyFont {
  238 + color: #999;
  239 + font-size: 24px;
  240 + margin-left: 20px;
  241 + }
  242 + }
  243 + }
  244 + .art_pic {
  245 + width: 180px;
  246 + height: 180px;
  247 + flex-shrink: 0;
  248 + background-color: #ff4444;
  249 +
  250 + img {
  251 + width: 100%;
  252 + height: 100%;
  253 + }
  254 + }
191 255 }
192   - }
193   - .art_pic {
194   - width: 180px;
195   - height: 180px;
196   - flex-shrink: 0;
197   - background-color: #ff4444;
  256 + }
  257 + .imgPic {
  258 + position: fixed;
  259 + right: 2vw;
  260 + bottom: 40vw;
  261 + width: 26vw;
  262 + height: 26vw;
198 263  
199 264 img {
200   - width: 100%;
201   - height: 100%;
  265 + width: 100%;
  266 + height: 100%;
202 267 }
203   - }
204   - }
205   - }
206   - .imgPic {
207   - position: fixed;
208   - right: 2vw;
209   - bottom: 40vw;
210   - width: 26vw;
211   - height: 26vw;
212   -
213   - img {
214   - width: 100%;
215   - height: 100%;
216 268 }
217   - }
218 269 }
219 270 </style>
220 271 \ No newline at end of file
... ...
src/views/Yanxue/pageDetails.vue
  Diff comments   View file @b083c54
... ... @@ -34,19 +34,19 @@
34 34 <div v-if="v.type == 3" class="typeThree">
35 35 <div class="contextThree" v-html="v.context"></div>
36 36 </div>
  37 + </div>
37 38  
38   - <div class="thumbs" v-if="v.likeStatus">
39   - <img src="@/assets/dz_on.png" @click="toDZ(false)" />
40   - <span @click="toDZ(false)">{{
41   - v.likeNumber ? v.likeNumber : 0
42   - }}</span>
43   - </div>
44   - <div class="thumbs thumbs_grey" v-else>
45   - <img src="@/assets/dz_off.png" @click="toDZ(true)" />
46   - <span @click="toDZ(true)">{{
47   - v.likeNumber ? v.likeNumber : 0
48   - }}</span>
49   - </div>
  39 + <div class="thumbs" v-if="resData.likeStatus">
  40 + <img src="@/assets/dz_on.png" @click="toDZ(false)" />
  41 + <span @click="toDZ(false)">{{
  42 + resData.likeNumber ? resData.likeNumber : 0
  43 + }}</span>
  44 + </div>
  45 + <div class="thumbs thumbs_grey" v-else>
  46 + <img src="@/assets/dz_off.png" @click="toDZ(true)" />
  47 + <span @click="toDZ(true)">{{
  48 + resData.likeNumber ? resData.likeNumber : 0
  49 + }}</span>
50 50 </div>
51 51 </div>
52 52 </div>
... ... @@ -61,7 +61,10 @@ export default {
61 61 modelList: [],
62 62 background: "",
63 63 imgUrl: "",
64   - // isOn: false,
  64 + resData: {
  65 + likeStatus: 0,
  66 + likeNumber: 0,
  67 + }
65 68 };
66 69 },
67 70 methods: {
... ... @@ -70,7 +73,9 @@ export default {
70 73 this.yxAxios
71 74 .get(
72 75 `${this.kqUrl}/schoolConsult/consultDetails?consultId=` +
73   - this.$route.query.dataId
  76 + this.$route.query.dataId +
  77 + `&userNum=` +
  78 + JSON.parse(localStorage.getItem("userInfo")).centerNo
74 79 )
75 80 .then((res) => {
76 81 if (res.data.code == 200) {
... ... @@ -82,6 +87,7 @@ export default {
82 87 }
83 88 let arr = JSON.parse(res.data.data.modelList);
84 89 this.modelList = arr;
  90 + this.resData = res.data.data;
85 91 // this.showFrame();
86 92 } else {
87 93 this.$toast.fail(res.data.message);
... ... @@ -134,7 +140,7 @@ export default {
134 140 },
135 141 //点赞 true点赞，false取消
136 142 toDZ(val) {
137   - this.isOn = val;
  143 +
138 144 this.yxAxios
139 145 .post(`${this.kqUrl}/visitRecord/setConsultLike`, {
140 146 consultId: this.$route.query.dataId,
... ... @@ -251,7 +257,9 @@ export default {
251 257 }
252 258 }
253 259  
254   - .thumbs {
  260 +
  261 + }
  262 + .thumbs {
255 263 width: 100%;
256 264 font-size: 33px;
257 265 font-weight: bold;
... ... @@ -269,7 +277,6 @@ export default {
269 277 .thumbs_grey {
270 278 color: #999;
271 279 }
272   - }
273 280 }
274 281 }
275 282 </style>
276 283 \ No newline at end of file
... ...