SxhGroup / sxhPersonalCenterZLB

Download as
Browse Code »

Commit f859853f6a12ca9880abc7e756a770c5258edda1

Authored by 边
1 parent 3f05f4ac
Exists in master

feat：调整布局和接口

Showing 7 changed files with 295 additions and 215 deletions   Show diff stats
public/zwlogJS接入.html 0 → 100644
  Diff comments   View file @f859853
@@ -0,0 +1,43 @@ @@ -0,0 +1,43 @@
  1 +<!DOCTYPE html>
  2 +<html lang="en">
  3 +
  4 +<head>
  5 + <meta charset="UTF-8" />
  6 + <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  7 + <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  8 + <title>zwlog埋点上报方法Demo</title>
  9 + <script type="text/javascript" src="https://assets.zjzwfw.gov.cn/assets/ZWJSBridge/1.1.0/zwjsbridge.js"></script>
  10 + <script type="text/javascript" src="https://assets.zjzwfw.gov.cn/assets/zwlog/1.0.0/zwlog.js"></script>
  11 +</head>
  12 +
  13 +<body>
  14 + <script>
  15 + // 在声明Zwlog对象实例时，可以传入一些app或者用户信息
  16 + const zwlog = new ZwLog({
  17 + _user_id: "用户ID",
  18 + _user_nick: "用户昵称"
  19 + })
  20 +
  21 + //onReady表示zwlog加载完成后的函数，它接收一个匿名函数，而sendPV与record方法均要在匿名函数内调用。eg:
  22 + zwlog.onReady(function () {
  23 + //PV日志
  24 + zwlog.sendPV({
  25 + miniAppId: 'IRS服务侧应用appid',
  26 + Page_duration: '用户从进入到离开当前页面的时长',
  27 + t2: '页面启动到加载完成的时间',
  28 + t0: '页面启动到页面响应完成的时间',
  29 + log_status: 'IRS服务侧应用appid'
  30 + });
  31 + //令箭日志
  32 + zwlog.record('yourTrackerEventCode', 'CLK', {
  33 + Test1: '测试参数1',
  34 + });
  35 +
  36 + let { metaInfo } = zwlog; // SDK元配置的当前设置
  37 + })
  38 +
  39 +
  40 + </script>
  41 +</body>
  42 +
  43 +</html>
0 \ No newline at end of file 44 \ No newline at end of file
src/assets/1.png 0 → 100644
View file @f859853

636 Bytes
src/assets/dz_off.png 0 → 100644
View file @f859853

665 Bytes
src/assets/dz_on.png 0 → 100644
View file @f859853

687 Bytes
src/views/Service/ServiceKQ.vue
  Diff comments   View file @f859853
@@ -52,8 +52,8 @@ export default { @@ -52,8 +52,8 @@ export default {
52 } else { 52 } else {
53 alert('非浙里办渠道访问，显示测试用户数据') 53 alert('非浙里办渠道访问，显示测试用户数据')
54 console.log('非浙里办渠道访问，显示测试用户数据',userData) 54 console.log('非浙里办渠道访问，显示测试用户数据',userData)
55 - this.centerNo = '2021111017103639979048000010279'  
56 - localStorage.setItem('centerNo', '2021111017103639979048000010279') 55 + this.centerNo = '2022031508525674030748540013076'
  56 + localStorage.setItem('centerNo', '2022031508525674030748540013076')
57 let userInfo = JSON.stringify(userData) 57 let userInfo = JSON.stringify(userData)
58 localStorage.setItem('userInfo', userInfo) 58 localStorage.setItem('userInfo', userInfo)
59 this.getUserInfo() 59 this.getUserInfo()
src/views/Yanxue/achievementsOne.vue
  Diff comments   View file @f859853
@@ -18,7 +18,8 @@ @@ -18,7 +18,8 @@
18 <div class="art_title">{{ v.titleDesc }}</div> 18 <div class="art_title">{{ v.titleDesc }}</div>
19 <div class="art_bot"> 19 <div class="art_bot">
20 <!-- <div class="redSticky" v-if="v.readNumber">置顶</div> --> 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> 21 + <!-- <div class="greyTime">发布于 {{ v.createTime ? Moment(v.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}}</div> -->
  22 + <div class="greyTime">点赞量 {{ v.likeNumber }}</div>
22 <div class="greyFont">浏览量 {{ v.readNumber }}</div> 23 <div class="greyFont">浏览量 {{ v.readNumber }}</div>
23 </div> 24 </div>
24 </div> 25 </div>
src/views/Yanxue/pageDetails.vue
  Diff comments   View file @f859853
1 <template> 1 <template>
2 - <div class="box">  
3 - <div class="box_pic" v-if="background">  
4 - <img :src="background" />  
5 - </div>  
6 -  
7 - <div class="contextCss">  
8 - <div class="modelBox" v-for="(v, i) in modelList" :key="i">  
9 - <div class="titleCss">{{ v.name }}</div>  
10 - <!--相册-->  
11 - <div v-if="v.type == 1" class="typeOne">  
12 - <div  
13 - class="pic"  
14 - v-for="(x, y) in v.imgList"  
15 - :key="y"  
16 - @click="openImg(x, y, v)"  
17 - >  
18 - <img :src="x.response" />  
19 - </div>  
20 - </div>  
21 - <!--视频-->  
22 - <div v-if="v.type == 2" class="typeTwo">  
23 - <div class="videoTwo" v-for="(x, y) in v.videoList" :key="y">  
24 - <video controls :poster='imgUrl' preload="none">  
25 - <source :src="x" type="video/mp4" />  
26 - </video>  
27 - </div> 2 + <div class="box">
  3 + <div class="box_pic" v-if="background">
  4 + <img :src="background" />
28 </div> 5 </div>
29 - <!--图文-->  
30 - <div v-if="v.type == 3" class="typeThree">  
31 - <div class="contextThree" v-html="v.context"></div> 6 +
  7 + <div class="contextCss">
  8 + <div class="modelBox" v-for="(v, i) in modelList" :key="i">
  9 + <div class="titleCss">{{ v.name }}</div>
  10 + <!--相册-->
  11 + <div v-if="v.type == 1" class="typeOne">
  12 + <div
  13 + class="pic"
  14 + v-for="(x, y) in v.imgList"
  15 + :key="y"
  16 + @click="openImg(x, y, v)"
  17 + >
  18 + <img :src="x.response" />
  19 + </div>
  20 + </div>
  21 + <!--视频-->
  22 + <div v-if="v.type == 2" class="typeTwo">
  23 + <div
  24 + class="videoTwo"
  25 + v-for="(x, y) in v.videoList"
  26 + :key="y"
  27 + >
  28 + <video controls :poster="imgUrl" preload="none">
  29 + <source :src="x" type="video/mp4" />
  30 + </video>
  31 + </div>
  32 + </div>
  33 + <!--图文-->
  34 + <div v-if="v.type == 3" class="typeThree">
  35 + <div class="contextThree" v-html="v.context"></div>
  36 + </div>
  37 +
  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>
  50 + </div>
32 </div> 51 </div>
33 - </div>  
34 </div> 52 </div>
35 - </div>  
36 </template> 53 </template>
37 54
38 <script> 55 <script>
39 import { ImagePreview } from "vant"; 56 import { ImagePreview } from "vant";
40 export default { 57 export default {
41 - data() {  
42 - return { arr: 0, modelList: [], background: "", imgUrl: "" };  
43 - },  
44 - methods: {  
45 - //获取数据  
46 - getTable() {  
47 - this.yxAxios  
48 - .get(`${this.kqUrl}/schoolConsult/consultDetails?consultId=`+this.$route.query.dataId)  
49 - .then((res) => {  
50 - if (res.data.code == 200) {  
51 - this.imgUrl = res.data.data.imgUrl;  
52 - if (!res.data.data.background) {  
53 - this.background = res.data.data.imgUrl;  
54 - } else {  
55 - this.background = res.data.data.background;  
56 - }  
57 - let arr = JSON.parse(res.data.data.modelList);  
58 - this.modelList = arr;  
59 - // this.showFrame();  
60 - } else {  
61 - this.$toast.fail(res.data.message);  
62 - }  
63 - });  
64 - // this.yxAxios  
65 - // .post(`${this.dataUrl}/sys/yx/getConsultDetail`, {  
66 - // id: this.$route.query.dataId,  
67 - // })  
68 - // .then((res) => {  
69 - // if (res.data.success) {  
70 - // this.imgUrl = res.data.data.imgUrl;  
71 - // if (!res.data.data.background) {  
72 - // this.background = res.data.data.imgUrl;  
73 - // } else {  
74 - // this.background = res.data.data.background;  
75 - // }  
76 - // let arr = JSON.parse(res.data.data.modelList);  
77 - // this.modelList = arr;  
78 - // // this.showFrame();  
79 - // } else {  
80 - // this.$toast.fail(res.data.message);  
81 - // }  
82 - // });  
83 - },  
84 - //打开图片  
85 - openImg(x, y, v) {  
86 - let imgList = v.imgList.map((v) => v.response);  
87 -  
88 - ImagePreview({  
89 - images: imgList,  
90 - startPosition: y,  
91 - }); 58 + data() {
  59 + return {
  60 + arr: 0,
  61 + modelList: [],
  62 + background: "",
  63 + imgUrl: "",
  64 + // isOn: false,
  65 + };
92 }, 66 },
93 - //添加浏览量  
94 - addReadNum() {  
95 - this.yxAxios  
96 - .post(`${this.kqUrl}/visitRecord/setConsultVisit`, {  
97 - consultId: this.$route.query.dataId,  
98 - userId: JSON.parse(localStorage.getItem('userInfo')).centerNo  
99 - })  
100 - .then((res) => {  
101 - if (res.data.success) {  
102 - console.log("阅读量成功");  
103 - } else {  
104 - console.log("阅读量失败");  
105 - }  
106 - });  
107 - // this.yxAxios  
108 - // .post(`${this.dataUrl}/sys/yx/updateRead`, {  
109 - // id: this.$route.query.dataId,  
110 - // })  
111 - // .then((res) => {  
112 - // if (res.data.success) {  
113 - // console.log("阅读量成功");  
114 - // } else {  
115 - // console.log("阅读量失败");  
116 - // }  
117 - // }); 67 + methods: {
  68 + //获取数据
  69 + getTable() {
  70 + this.yxAxios
  71 + .get(
  72 + `${this.kqUrl}/schoolConsult/consultDetails?consultId=` +
  73 + this.$route.query.dataId
  74 + )
  75 + .then((res) => {
  76 + if (res.data.code == 200) {
  77 + this.imgUrl = res.data.data.imgUrl;
  78 + if (!res.data.data.background) {
  79 + this.background = res.data.data.imgUrl;
  80 + } else {
  81 + this.background = res.data.data.background;
  82 + }
  83 + let arr = JSON.parse(res.data.data.modelList);
  84 + this.modelList = arr;
  85 + // this.showFrame();
  86 + } else {
  87 + this.$toast.fail(res.data.message);
  88 + }
  89 + });
  90 + },
  91 + //打开图片
  92 + openImg(x, y, v) {
  93 + let imgList = v.imgList.map((v) => v.response);
  94 +
  95 + ImagePreview({
  96 + images: imgList,
  97 + startPosition: y,
  98 + });
  99 + },
  100 + //添加浏览量
  101 + addReadNum() {
  102 + this.yxAxios
  103 + .post(`${this.kqUrl}/visitRecord/setConsultVisit`, {
  104 + consultId: this.$route.query.dataId,
  105 + userId: JSON.parse(localStorage.getItem("userInfo"))
  106 + .centerNo,
  107 + })
  108 + .then((res) => {
  109 + if (res.data.code == 200) {
  110 + console.log("阅读量成功");
  111 + } else {
  112 + console.log("阅读量失败");
  113 + }
  114 + });
  115 + },
  116 + //视频
  117 + showFrame() {
  118 + const video = document.createElement("video");
  119 + console.log("sfsddf");
  120 + video.addEventListener("loadeddata", function (e) {
  121 + canvas.width = this.videoWidth;
  122 + canvas.height = this.videoHeight;
  123 + width = this.videoWidth;
  124 + height = this.videoHeight;
  125 + ctx.drawImage(this, 0, 0, width, height);
  126 + var src = canvas.toDataURL("image/jpeg");
  127 + console.log("sfsf");
  128 + img.src = src;
  129 +
  130 + // var currentTime = this.currentTime
  131 + // duration = this.duration
  132 + // var fps = duration / 30
  133 + });
  134 + },
  135 + //点赞 true点赞，false取消
  136 + toDZ(val) {
  137 + this.isOn = val;
  138 + this.yxAxios
  139 + .post(`${this.kqUrl}/visitRecord/setConsultLike`, {
  140 + consultId: this.$route.query.dataId,
  141 + userId: JSON.parse(localStorage.getItem("userInfo"))
  142 + .centerNo,
  143 + status: val ? 1 : 0,
  144 + })
  145 + .then((res) => {
  146 + if (res.data.code == 200) {
  147 + console.log("点赞成功");
  148 + } else {
  149 + this.$toast.fail(res.data.message);
  150 + console.log("点赞失败");
  151 + }
  152 + this.getTable();
  153 + });
  154 + },
118 }, 155 },
119 - //视频  
120 - showFrame() {  
121 - const video = document.createElement("video");  
122 - console.log("sfsddf");  
123 - video.addEventListener("loadeddata", function (e) {  
124 - canvas.width = this.videoWidth;  
125 - canvas.height = this.videoHeight;  
126 - width = this.videoWidth;  
127 - height = this.videoHeight;  
128 - ctx.drawImage(this, 0, 0, width, height);  
129 - var src = canvas.toDataURL("image/jpeg");  
130 - console.log("sfsf");  
131 - img.src = src;  
132 -  
133 - // var currentTime = this.currentTime  
134 - // duration = this.duration  
135 - // var fps = duration / 30  
136 - }); 156 + mounted() {
  157 + this.getTable();
  158 + this.addReadNum();
137 }, 159 },
138 - },  
139 - mounted() {  
140 - this.getTable();  
141 - this.addReadNum();  
142 - },  
143 }; 160 };
144 </script> 161 </script>
145 162
146 <style lang="scss" scoped> 163 <style lang="scss" scoped>
147 .box { 164 .box {
148 - background-color: #f5f6fa;  
149 - min-height: 100vh; 165 + background-color: #f5f6fa;
  166 + min-height: 100vh;
150 167
151 - .box_pic {  
152 - width: 100%;  
153 - height: 100vh;  
154 - background-color: #999; 168 + .box_pic {
  169 + width: 100%;
  170 + height: 100vh;
  171 + background-color: #999;
155 172
156 - img {  
157 - width: 100%;  
158 - height: 100%;  
159 - }  
160 - }  
161 -  
162 - .contextCss {  
163 - width: 90vw;  
164 - position: absolute;  
165 - top: 600px;  
166 - left: 5vw;  
167 - border-radius: 5vw;  
168 - background-color: #fff;  
169 - padding: 3vw;  
170 - box-sizing: border-box;  
171 - box-shadow: 1px 1px 1px 1px rgb(221, 220, 220);  
172 -  
173 - .modelBox {  
174 - margin: 3vw;  
175 - display: flex;  
176 - justify-content: center;  
177 - flex-wrap: wrap;  
178 -  
179 - .titleCss {  
180 - width: 60vw;  
181 - padding: 3.5vw;  
182 - box-sizing: border-box;  
183 - font-size: 4.6vw;  
184 - font-weight: bold;  
185 - background-image: url("../../assets/yxcg/red_title.png");  
186 - -moz-background-size: 100% 100%;  
187 - background-size: 100% 100%;  
188 - text-align: center;  
189 - margin-bottom: 5vw;  
190 - color: #fff;  
191 - }  
192 -  
193 - .typeOne {  
194 - margin: 5vw;  
195 -  
196 - .pic {  
197 - width: 90vw;  
198 - // height: 45vw;  
199 - margin-bottom: 5vw;  
200 -  
201 - img { 173 + img {
202 width: 100%; 174 width: 100%;
203 - // height: 100%;  
204 - } 175 + height: 100%;
205 } 176 }
206 - }  
207 - .typeTwo {  
208 - margin: 5vw; 177 + }
209 178
210 - .videoTwo {  
211 - width: 80vw;  
212 - height: 50vw;  
213 - margin-bottom: 5vw; 179 + .contextCss {
  180 + width: 90vw;
  181 + position: absolute;
  182 + top: 600px;
  183 + left: 5vw;
  184 + border-radius: 5vw;
  185 + background-color: #fff;
  186 + padding: 3vw;
  187 + box-sizing: border-box;
  188 + box-shadow: 1px 1px 1px 1px rgb(221, 220, 220);
214 189
215 - video {  
216 - width: 100%;  
217 - height: 100%;  
218 - }  
219 - }  
220 - }  
221 - .typeThree {  
222 - margin: 5vw;  
223 -  
224 - .contextThree {  
225 - width: 70vw;  
226 - margin-bottom: 5vw;  
227 - font-size: 4.5vw;  
228 - overflow: auto;  
229 -  
230 - ::v-deep img {  
231 - max-width: 60vw !important;  
232 - height: 50vw;  
233 - } 190 + .modelBox {
  191 + margin: 3vw;
  192 + display: flex;
  193 + justify-content: center;
  194 + flex-wrap: wrap;
  195 +
  196 + .titleCss {
  197 + width: 60vw;
  198 + padding: 3.5vw;
  199 + box-sizing: border-box;
  200 + font-size: 4.6vw;
  201 + font-weight: bold;
  202 + background-image: url("../../assets/yxcg/red_title.png");
  203 + -moz-background-size: 100% 100%;
  204 + background-size: 100% 100%;
  205 + text-align: center;
  206 + margin-bottom: 5vw;
  207 + color: #fff;
  208 + }
  209 +
  210 + .typeOne {
  211 + margin: 5vw;
  212 +
  213 + .pic {
  214 + width: 90vw;
  215 + // height: 45vw;
  216 + margin-bottom: 5vw;
  217 +
  218 + img {
  219 + width: 100%;
  220 + // height: 100%;
  221 + }
  222 + }
  223 + }
  224 + .typeTwo {
  225 + margin: 5vw;
  226 +
  227 + .videoTwo {
  228 + width: 80vw;
  229 + height: 50vw;
  230 + margin-bottom: 5vw;
  231 +
  232 + video {
  233 + width: 100%;
  234 + height: 100%;
  235 + }
  236 + }
  237 + }
  238 + .typeThree {
  239 + margin: 5vw;
  240 +
  241 + .contextThree {
  242 + width: 70vw;
  243 + margin-bottom: 5vw;
  244 + font-size: 4.5vw;
  245 + overflow: auto;
  246 +
  247 + ::v-deep img {
  248 + max-width: 60vw !important;
  249 + height: 50vw;
  250 + }
  251 + }
  252 + }
  253 +
  254 + .thumbs {
  255 + width: 100%;
  256 + font-size: 33px;
  257 + font-weight: bold;
  258 + color: #ed2323;
  259 + text-align: center;
  260 + display: flex;
  261 + justify-content: center;
  262 + align-items: center;
  263 +
  264 + img {
  265 + width: 32px;
  266 + margin-right: 13px;
  267 + }
  268 + }
  269 + .thumbs_grey {
  270 + color: #999;
  271 + }
234 } 272 }
235 - }  
236 } 273 }
237 - }  
238 } 274 }
239 </style> 275 </style>
240 \ No newline at end of file 276 \ No newline at end of file