From f859853f6a12ca9880abc7e756a770c5258edda1 Mon Sep 17 00:00:00 2001
From: 边少东 <2879594283@qq.com>
Date: Sat, 8 Oct 2022 08:09:27 +0800
Subject: [PATCH] feat：调整布局和接口

---
 public/zwlogJS接入.html            |  43 +++++++++++++++++++++++++++++++++++++++++++
 src/assets/1.png                     | Bin 0 -> 636 bytes
 src/assets/dz_off.png                | Bin 0 -> 665 bytes
 src/assets/dz_on.png                 | Bin 0 -> 687 bytes
 src/views/Service/ServiceKQ.vue      |   4 ++--
 src/views/Yanxue/achievementsOne.vue |   3 ++-
 src/views/Yanxue/pageDetails.vue     | 460 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 7 files changed, 295 insertions(+), 215 deletions(-)
 create mode 100644 public/zwlogJS接入.html
 create mode 100644 src/assets/1.png
 create mode 100644 src/assets/dz_off.png
 create mode 100644 src/assets/dz_on.png
diff --git a/public/zwlogJS接入.html b/public/zwlogJS接入.html
new file mode 100644
index 0000000..ed41807
--- /dev/null
+++ b/public/zwlogJS接入.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>zwlog埋点上报方法Demo</title>
+  <script type="text/javascript" src="https://assets.zjzwfw.gov.cn/assets/ZWJSBridge/1.1.0/zwjsbridge.js"></script>
+  <script type="text/javascript" src="https://assets.zjzwfw.gov.cn/assets/zwlog/1.0.0/zwlog.js"></script>
+</head>
+
+<body>
+  <script>
+    // 在声明Zwlog对象实例时，可以传入一些app或者用户信息 
+    const zwlog = new ZwLog({
+      _user_id: "用户ID",
+      _user_nick: "用户昵称"
+    })
+
+    //onReady表示zwlog加载完成后的函数，它接收一个匿名函数，而sendPV与record方法均要在匿名函数内调用。eg:
+    zwlog.onReady(function () {
+      //PV日志
+      zwlog.sendPV({
+        miniAppId: 'IRS服务侧应用appid',
+        Page_duration: '用户从进入到离开当前页面的时长',
+        t2: '页面启动到加载完成的时间',
+        t0: '页面启动到页面响应完成的时间',
+        log_status: 'IRS服务侧应用appid'
+      });
+      //令箭日志
+      zwlog.record('yourTrackerEventCode', 'CLK', {
+        Test1: '测试参数1',
+      });
+
+      let { metaInfo } = zwlog; // SDK元配置的当前设置
+    })
+
+
+  </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/assets/1.png b/src/assets/1.png
new file mode 100644
index 0000000..3f9a263
Binary files /dev/null and b/src/assets/1.png differ
diff --git a/src/assets/dz_off.png b/src/assets/dz_off.png
new file mode 100644
index 0000000..450885f
Binary files /dev/null and b/src/assets/dz_off.png differ
diff --git a/src/assets/dz_on.png b/src/assets/dz_on.png
new file mode 100644
index 0000000..f6a26e5
Binary files /dev/null and b/src/assets/dz_on.png differ
diff --git a/src/views/Service/ServiceKQ.vue b/src/views/Service/ServiceKQ.vue
index d9b172d..3dd959f 100644
--- a/src/views/Service/ServiceKQ.vue
+++ b/src/views/Service/ServiceKQ.vue
@@ -52,8 +52,8 @@ export default {
         } else {
           alert('非浙里办渠道访问，显示测试用户数据')
           console.log('非浙里办渠道访问，显示测试用户数据',userData)
-          this.centerNo = '2021111017103639979048000010279'
-          localStorage.setItem('centerNo', '2021111017103639979048000010279')
+          this.centerNo = '2022031508525674030748540013076'
+          localStorage.setItem('centerNo', '2022031508525674030748540013076')
           let userInfo = JSON.stringify(userData)
           localStorage.setItem('userInfo', userInfo)
           this.getUserInfo()
diff --git a/src/views/Yanxue/achievementsOne.vue b/src/views/Yanxue/achievementsOne.vue
index e720119..15df219 100644
--- a/src/views/Yanxue/achievementsOne.vue
+++ b/src/views/Yanxue/achievementsOne.vue
@@ -18,7 +18,8 @@
           <div class="art_title">{{ v.titleDesc }}</div>
           <div class="art_bot">
             <!-- <div class="redSticky" v-if="v.readNumber">置顶</div> -->
-            <div class="greyTime">发布于 {{ v.createTime ? Moment(v.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}}</div>
+            <!-- <div class="greyTime">发布于 {{ v.createTime ? Moment(v.createTime).format('YYYY-MM-DD HH:mm:ss') : ''}}</div> -->
+            <div class="greyTime">点赞量 {{ v.likeNumber }}</div>
             <div class="greyFont">浏览量 {{ v.readNumber }}</div>
           </div>
         </div>
diff --git a/src/views/Yanxue/pageDetails.vue b/src/views/Yanxue/pageDetails.vue
index c907415..c00a97d 100644
--- a/src/views/Yanxue/pageDetails.vue
+++ b/src/views/Yanxue/pageDetails.vue
@@ -1,239 +1,275 @@
 <template>
-  <div class="box">
-    <div class="box_pic" v-if="background">
-      <img :src="background" />
-    </div>
-
-    <div class="contextCss">
-      <div class="modelBox" v-for="(v, i) in modelList" :key="i">
-        <div class="titleCss">{{ v.name }}</div>
-        <!--相册-->
-        <div v-if="v.type == 1" class="typeOne">
-          <div
-            class="pic"
-            v-for="(x, y) in v.imgList"
-            :key="y"
-            @click="openImg(x, y, v)"
-          >
-            <img :src="x.response" />
-          </div>
-        </div>
-        <!--视频-->
-        <div v-if="v.type == 2" class="typeTwo">
-          <div class="videoTwo" v-for="(x, y) in v.videoList" :key="y">
-            <video controls :poster='imgUrl' preload="none">
-              <source :src="x" type="video/mp4" />
-            </video>
-          </div>
+    <div class="box">
+        <div class="box_pic" v-if="background">
+            <img :src="background" />
         </div>
-        <!--图文-->
-        <div v-if="v.type == 3" class="typeThree">
-          <div class="contextThree" v-html="v.context"></div>
+
+        <div class="contextCss">
+            <div class="modelBox" v-for="(v, i) in modelList" :key="i">
+                <div class="titleCss">{{ v.name }}</div>
+                <!--相册-->
+                <div v-if="v.type == 1" class="typeOne">
+                    <div
+                        class="pic"
+                        v-for="(x, y) in v.imgList"
+                        :key="y"
+                        @click="openImg(x, y, v)"
+                    >
+                        <img :src="x.response" />
+                    </div>
+                </div>
+                <!--视频-->
+                <div v-if="v.type == 2" class="typeTwo">
+                    <div
+                        class="videoTwo"
+                        v-for="(x, y) in v.videoList"
+                        :key="y"
+                    >
+                        <video controls :poster="imgUrl" preload="none">
+                            <source :src="x" type="video/mp4" />
+                        </video>
+                    </div>
+                </div>
+                <!--图文-->
+                <div v-if="v.type == 3" class="typeThree">
+                    <div class="contextThree" v-html="v.context"></div>
+                </div>
+
+                <div class="thumbs" v-if="v.likeStatus">
+                    <img src="@/assets/dz_on.png" @click="toDZ(false)" />
+                    <span @click="toDZ(false)">{{
+                        v.likeNumber ? v.likeNumber : 0
+                    }}</span>
+                </div>
+                <div class="thumbs thumbs_grey" v-else>
+                    <img src="@/assets/dz_off.png" @click="toDZ(true)" />
+                    <span @click="toDZ(true)">{{
+                        v.likeNumber ? v.likeNumber : 0
+                    }}</span>
+                </div>
+            </div>
         </div>
-      </div>
     </div>
-  </div>
 </template>
 
 <script>
 import { ImagePreview } from "vant";
 export default {
-  data() {
-    return { arr: 0, modelList: [], background: "", imgUrl: "" };
-  },
-  methods: {
-    //获取数据
-    getTable() {
-      this.yxAxios
-        .get(`${this.kqUrl}/schoolConsult/consultDetails?consultId=`+this.$route.query.dataId)
-        .then((res) => {
-          if (res.data.code == 200) {
-            this.imgUrl = res.data.data.imgUrl;
-            if (!res.data.data.background) {
-              this.background = res.data.data.imgUrl;
-            } else {
-              this.background = res.data.data.background;
-            }
-            let arr = JSON.parse(res.data.data.modelList);
-            this.modelList = arr;
-            // this.showFrame();
-          } else {
-            this.$toast.fail(res.data.message);
-          }
-        });
-      // this.yxAxios
-      //   .post(`${this.dataUrl}/sys/yx/getConsultDetail`, {
-      //     id: this.$route.query.dataId,
-      //   })
-      //   .then((res) => {
-      //     if (res.data.success) {
-      //       this.imgUrl = res.data.data.imgUrl;
-      //       if (!res.data.data.background) {
-      //         this.background = res.data.data.imgUrl;
-      //       } else {
-      //         this.background = res.data.data.background;
-      //       }
-      //       let arr = JSON.parse(res.data.data.modelList);
-      //       this.modelList = arr;
-      //       // this.showFrame();
-      //     } else {
-      //       this.$toast.fail(res.data.message);
-      //     }
-      //   });
-    },
-    //打开图片
-    openImg(x, y, v) {
-      let imgList = v.imgList.map((v) => v.response);
-
-      ImagePreview({
-        images: imgList,
-        startPosition: y,
-      });
+    data() {
+        return {
+            arr: 0,
+            modelList: [],
+            background: "",
+            imgUrl: "",
+            // isOn: false,
+        };
     },
-    //添加浏览量
-    addReadNum() {
-      this.yxAxios
-        .post(`${this.kqUrl}/visitRecord/setConsultVisit`, {
-          consultId: this.$route.query.dataId,
-          userId: JSON.parse(localStorage.getItem('userInfo')).centerNo
-        })
-        .then((res) => {
-          if (res.data.success) {
-            console.log("阅读量成功");
-          } else {
-            console.log("阅读量失败");
-          }
-        });
-      // this.yxAxios
-      //   .post(`${this.dataUrl}/sys/yx/updateRead`, {
-      //     id: this.$route.query.dataId,
-      //   })
-      //   .then((res) => {
-      //     if (res.data.success) {
-      //       console.log("阅读量成功");
-      //     } else {
-      //       console.log("阅读量失败");
-      //     }
-      //   });
+    methods: {
+        //获取数据
+        getTable() {
+            this.yxAxios
+                .get(
+                    `${this.kqUrl}/schoolConsult/consultDetails?consultId=` +
+                        this.$route.query.dataId
+                )
+                .then((res) => {
+                    if (res.data.code == 200) {
+                        this.imgUrl = res.data.data.imgUrl;
+                        if (!res.data.data.background) {
+                            this.background = res.data.data.imgUrl;
+                        } else {
+                            this.background = res.data.data.background;
+                        }
+                        let arr = JSON.parse(res.data.data.modelList);
+                        this.modelList = arr;
+                        // this.showFrame();
+                    } else {
+                        this.$toast.fail(res.data.message);
+                    }
+                });
+        },
+        //打开图片
+        openImg(x, y, v) {
+            let imgList = v.imgList.map((v) => v.response);
+
+            ImagePreview({
+                images: imgList,
+                startPosition: y,
+            });
+        },
+        //添加浏览量
+        addReadNum() {
+            this.yxAxios
+                .post(`${this.kqUrl}/visitRecord/setConsultVisit`, {
+                    consultId: this.$route.query.dataId,
+                    userId: JSON.parse(localStorage.getItem("userInfo"))
+                        .centerNo,
+                })
+                .then((res) => {
+                    if (res.data.code == 200) {
+                        console.log("阅读量成功");
+                    } else {
+                        console.log("阅读量失败");
+                    }
+                });
+        },
+        //视频
+        showFrame() {
+            const video = document.createElement("video");
+            console.log("sfsddf");
+            video.addEventListener("loadeddata", function (e) {
+                canvas.width = this.videoWidth;
+                canvas.height = this.videoHeight;
+                width = this.videoWidth;
+                height = this.videoHeight;
+                ctx.drawImage(this, 0, 0, width, height);
+                var src = canvas.toDataURL("image/jpeg");
+                console.log("sfsf");
+                img.src = src;
+
+                // var currentTime = this.currentTime
+                // duration = this.duration
+                // var fps = duration / 30
+            });
+        },
+        //点赞 true点赞，false取消
+        toDZ(val) {
+            this.isOn = val;
+            this.yxAxios
+                .post(`${this.kqUrl}/visitRecord/setConsultLike`, {
+                    consultId: this.$route.query.dataId,
+                    userId: JSON.parse(localStorage.getItem("userInfo"))
+                        .centerNo,
+                    status: val ? 1 : 0,
+                })
+                .then((res) => {
+                    if (res.data.code == 200) {
+                        console.log("点赞成功");
+                    } else {
+                        this.$toast.fail(res.data.message);
+                        console.log("点赞失败");
+                    }
+                    this.getTable();
+                });
+        },
     },
-    //视频
-    showFrame() {
-      const video = document.createElement("video");
-      console.log("sfsddf");
-      video.addEventListener("loadeddata", function (e) {
-        canvas.width = this.videoWidth;
-        canvas.height = this.videoHeight;
-        width = this.videoWidth;
-        height = this.videoHeight;
-        ctx.drawImage(this, 0, 0, width, height);
-        var src = canvas.toDataURL("image/jpeg");
-        console.log("sfsf");
-        img.src = src;
-
-        // var currentTime = this.currentTime
-        // duration = this.duration
-        // var fps = duration / 30
-      });
+    mounted() {
+        this.getTable();
+        this.addReadNum();
     },
-  },
-  mounted() {
-    this.getTable();
-    this.addReadNum();
-  },
 };
 </script>
 
 <style lang="scss" scoped>
 .box {
-  background-color: #f5f6fa;
-  min-height: 100vh;
+    background-color: #f5f6fa;
+    min-height: 100vh;
 
-  .box_pic {
-    width: 100%;
-    height: 100vh;
-    background-color: #999;
+    .box_pic {
+        width: 100%;
+        height: 100vh;
+        background-color: #999;
 
-    img {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  .contextCss {
-    width: 90vw;
-    position: absolute;
-    top: 600px;
-    left: 5vw;
-    border-radius: 5vw;
-    background-color: #fff;
-    padding: 3vw;
-    box-sizing: border-box;
-    box-shadow: 1px 1px 1px 1px rgb(221, 220, 220);
-
-    .modelBox {
-      margin: 3vw;
-      display: flex;
-      justify-content: center;
-      flex-wrap: wrap;
-
-      .titleCss {
-        width: 60vw;
-        padding: 3.5vw;
-        box-sizing: border-box;
-        font-size: 4.6vw;
-        font-weight: bold;
-        background-image: url("../../assets/yxcg/red_title.png");
-        -moz-background-size: 100% 100%;
-        background-size: 100% 100%;
-        text-align: center;
-        margin-bottom: 5vw;
-        color: #fff;
-      }
-
-      .typeOne {
-        margin: 5vw;
-
-        .pic {
-          width: 90vw;
-          // height: 45vw;
-          margin-bottom: 5vw;
-
-          img {
+        img {
             width: 100%;
-            // height: 100%;
-          }
+            height: 100%;
         }
-      }
-      .typeTwo {
-        margin: 5vw;
+    }
 
-        .videoTwo {
-          width: 80vw;
-          height: 50vw;
-          margin-bottom: 5vw;
+    .contextCss {
+        width: 90vw;
+        position: absolute;
+        top: 600px;
+        left: 5vw;
+        border-radius: 5vw;
+        background-color: #fff;
+        padding: 3vw;
+        box-sizing: border-box;
+        box-shadow: 1px 1px 1px 1px rgb(221, 220, 220);
 
-          video {
-            width: 100%;
-            height: 100%;
-          }
-        }
-      }
-      .typeThree {
-        margin: 5vw;
-
-        .contextThree {
-          width: 70vw;
-          margin-bottom: 5vw;
-          font-size: 4.5vw;
-          overflow: auto;
-
-          ::v-deep img {
-            max-width: 60vw !important;
-            height: 50vw;
-          }
+        .modelBox {
+            margin: 3vw;
+            display: flex;
+            justify-content: center;
+            flex-wrap: wrap;
+
+            .titleCss {
+                width: 60vw;
+                padding: 3.5vw;
+                box-sizing: border-box;
+                font-size: 4.6vw;
+                font-weight: bold;
+                background-image: url("../../assets/yxcg/red_title.png");
+                -moz-background-size: 100% 100%;
+                background-size: 100% 100%;
+                text-align: center;
+                margin-bottom: 5vw;
+                color: #fff;
+            }
+
+            .typeOne {
+                margin: 5vw;
+
+                .pic {
+                    width: 90vw;
+                    // height: 45vw;
+                    margin-bottom: 5vw;
+
+                    img {
+                        width: 100%;
+                        // height: 100%;
+                    }
+                }
+            }
+            .typeTwo {
+                margin: 5vw;
+
+                .videoTwo {
+                    width: 80vw;
+                    height: 50vw;
+                    margin-bottom: 5vw;
+
+                    video {
+                        width: 100%;
+                        height: 100%;
+                    }
+                }
+            }
+            .typeThree {
+                margin: 5vw;
+
+                .contextThree {
+                    width: 70vw;
+                    margin-bottom: 5vw;
+                    font-size: 4.5vw;
+                    overflow: auto;
+
+                    ::v-deep img {
+                        max-width: 60vw !important;
+                        height: 50vw;
+                    }
+                }
+            }
+
+            .thumbs {
+                width: 100%;
+                font-size: 33px;
+                font-weight: bold;
+                color: #ed2323;
+                text-align: center;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+
+                img {
+                    width: 32px;
+                    margin-right: 13px;
+                }
+            }
+            .thumbs_grey {
+                color: #999;
+            }
         }
-      }
     }
-  }
 }
 </style>
\ No newline at end of file
--
libgit2 0.21.0

