投票完成

src/project/fengdu/AppVote/AppVote.vue

@@ -1,19 +1,19 @@
 <template>
   <section class="AppVote">
-    <AiGroup title="前置图文" noBorder description>
-      <u-parse :html="detail.frontDisplay"/>
+    <AiGroup noBorder description class="mar-b32">
+      <u-parse :html="detail.preface"/>
     </AiGroup>
-    <div class="voteItem" flex @click="handleDetail(1)">
+    <div class="voteItem" flex @click="handleDetail(row.id)" v-for="row in list" :key="row.id">
       <div class="fill">
-        <b class="mar-b8" v-text="`月落乌啼霜满天`"/>
-        <div class="color-999 line3" v-text="`微信公众号是开发者或商家在微信公众平台上申请的应用账号，该帐号与QQ账号互通，该帐号与账号互通…`"/>
+        <b class="mar-b16" v-text="row.videoName"/>
+        <div class="color-999 line3" v-text="row.videoIntroduction"/>
       </div>
-      <div class="thumb">
-        <span v-text="`12345票`"/>
+      <div class="thumb" :style="{backgroundImage:row.imageFileUrl}">
+        <span v-text="`${row.voteNumber}票`"/>
       </div>
     </div>
-    <AiGroup title="结尾图文" noBorder description>
-      <u-parse :html="detail.endDisplay"/>
+    <AiGroup noBorder description>
+      <u-parse :html="detail.ending"/>
     </AiGroup>
   </section>
 </template>
@@ -24,26 +24,38 @@ export default {
   appName: "公众投票",
   data() {
     return {
-      detail: {}
+      detail: {},
+      list: []
     }
   },
   methods: {
     getDetail() {
-      this.$http.post("/app/vote/detail", null, {})
+      this.$http.post("/app/appvideovoteconfig/queryDetailByCorpId", null, {
+        withoutToken: true
+      }).then(res => {
+        if (res?.data) {
+          this.detail = res.data
+        }
+      })
     },
     getList() {
-      this.$http.post("/app/vote/list", null, {})
+      this.$http.post("/app/appvideoinfo/list", null, {
+        withoutToken: true,
+        param: {size: 20}
+      }).then(res => {
+        if (res?.data) {
+          this.list = res.data.records
+        }
+      })
     },
     handleDetail(id) {
       uni.navigateTo({url: './voteDetail?id=' + id})
     }
   },
-  created() {
-    // this.getDetail()
-    // this.getList()
+  onShow() {
+    this.getDetail()
+    this.getList()
   },
-
-
 }
 </script>
 
@@ -52,6 +64,12 @@ export default {
   min-height: 100vh;
   background: #fff;
 
+  .AiGroup {
+    width: 100%;
+    padding-right: 32px;
+    box-sizing: border-box;
+  }
+
   .voteItem {
     height: 240px;
     border: 1px solid #CCCCCC;
@@ -60,6 +78,7 @@ export default {
     padding: 24px;
     box-sizing: border-box;
     font-family: PingFangSC;
+    align-items: flex-start;
 
     b {
       font-size: 34px;

src/project/fengdu/AppVote/voteDetail.vue

@@ -1,10 +1,13 @@
 <template>
   <section class="voteDetail">
-    <u-parse :html="detail.endDisplay"/>
+    <AiItem top-label :label="detail.videoName" :border="false" labelBold>
+      <u-parse class="mar-b8" :html="detail.videoIntroduction"/>
+      <video :src="detail.videoFileUrl"/>
+    </AiItem>
     <AiBottomBtn background="#fff">
       <div flex class="pad-l32 pad-r16 pad-b16 pad-t16">
-        <AiHighlight class="fill color-999" content="当前票数：@v" value="21345" color="#FF6900"/>
-        <div class="text circle mar-l16" @click="handleVote">投票</div>
+        <AiHighlight class="fill color-999" content="当前票数：@v" :value="detail.voteNumber" color="#FF6900"/>
+        <div class="text circle mar-l16" :class="{disabled:canotVote}" @click="handleVote">投票</div>
       </div>
     </AiBottomBtn>
   </section>
@@ -18,7 +21,8 @@ export default {
   appName: "投票详情",
   computed: {
     ...mapState(['user']),
-    wxCode: v => v.$route.query.code
+    wxCode: v => v.$route.query.code,
+    canotVote: v => v.detail.isVote == '0' && v.user.token
   },
   data() {
     return {
@@ -28,10 +32,11 @@ export default {
   methods: {
     ...mapActions(['getWechatToken', 'getCode']),
     getDetail() {
-      this.$http.post("/app/vote/detail", null, {}).then(res => {
+      const {id} = this.$route.query
+      this.$http.post("/app/appvideoinfo/queryDetailById", null, {params: {id}, withoutToken: true}).then(res => {
         if (res?.data) {
           this.detail = res.data
-          document.title = this.detail.name
+          document.title = this.detail.videoName
         }
       })
     },
@@ -43,7 +48,17 @@ export default {
           }
         })
       } else {//已登录,直接投票
-        console.log("投票")
+        if (!this.canotVote) {
+          const {id} = this.$route.query
+          this.$http.post("/app/appvideovoteinfo/voteByVideoId", null, {
+            params: {id}
+          }).then(res => {
+            if (res?.code == 0) {
+              this.$u.toast("投票成功!")
+              this.getDetail()
+            }
+          })
+        }
       }
     },
   },
@@ -60,5 +75,13 @@ export default {
 .voteDetail {
   background: #F3F6F9;
   min-height: 100vh;
+
+  ::v-deep.disabled {
+    filter: grayscale(100%);
+  }
+
+  ::v-deep video {
+    width: 100%;
+  }
 }
 </style>