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 @@
  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 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 52 } else {
53 53 alert('非浙里办渠道访问，显示测试用户数据')
54 54 console.log('非浙里办渠道访问，显示测试用户数据',userData)
55   - this.centerNo = '2021111017103639979048000010279'
56   - localStorage.setItem('centerNo', '2021111017103639979048000010279')
  55 + this.centerNo = '2022031508525674030748540013076'
  56 + localStorage.setItem('centerNo', '2022031508525674030748540013076')
57 57 let userInfo = JSON.stringify(userData)
58 58 localStorage.setItem('userInfo', userInfo)
59 59 this.getUserInfo()
... ...
src/views/Yanxue/achievementsOne.vue
  Diff comments   View file @f859853
... ... @@ -18,7 +18,8 @@
18 18 <div class="art_title">{{ v.titleDesc }}</div>
19 19 <div class="art_bot">
20 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 23 <div class="greyFont">浏览量 {{ v.readNumber }}</div>
23 24 </div>
24 25 </div>
... ...
src/views/Yanxue/pageDetails.vue
  Diff comments   View file @f859853
1 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 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 51 </div>
33   - </div>
34 52 </div>
35   - </div>
36 53 </template>
37 54  
38 55 <script>
39 56 import { ImagePreview } from "vant";
40 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 161 </script>
145 162  
146 163 <style lang="scss" scoped>
147 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 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 275 </style>
240 276 \ No newline at end of file
... ...