静态页面

src/pages/Index/BookAnswer/index.vue

@@ -8,18 +8,22 @@
               <view class="Title">
                 <text>{{item.title}}</text>
               </view>
-              <!-- <label class="checkbox" v-if="item.answerType === 'checkbox'">
-                <checkbox value="cb" checked="false" />{{item.optionA}}
-              </label>
-              <label class="checkbox" v-if="item.answerType === 'checkbox'">
-                <checkbox value="cb" checked="false" />{{item.optionB}}
-              </label>
-              <label class="checkbox" v-if="item.answerType === 'checkbox'">
-                <checkbox value="cb" checked="false" />{{item.optionC}}
-              </label>
-              <label class="checkbox" v-if="item.answerType === 'checkbox'">
-                <checkbox value="cb" checked="false" />{{item.optionD}}
-              </label> -->
+
+              <checkbox-group @change="CheckboxChange(item, index, $event)" v-if="item.answerType === 'checkbox'" style="padding-top: 10px;">
+                <label class="checkbox">
+                  <checkbox value="A" :checked="false" />{{item.optionA}}
+                </label>
+                <label class="checkbox">
+                  <checkbox value="B" :checked="false" />{{item.optionB}}
+                </label>
+                <label class="checkbox">
+                  <checkbox value="C" :checked="false" />{{item.optionC}}
+                </label>
+                <label class="checkbox">
+                  <checkbox value="D" :checked="false" />{{item.optionD}}
+                </label>
+              </checkbox-group>
+
               <radio-group @change="RadioChange(item, index, $event)" v-if="item.answerType === 'radio'">
                 <label>
                   <view>
@@ -46,8 +50,27 @@
                   <view>{{item.optionD}}</view>
                 </label>
               </radio-group>
+
+              <radio-group @change="RadioChange(item, index, $event)" v-if="item.answerType === 'switch'">
+                <label>
+                  <view>
+                    <radio value="A" :checked="false" />
+                  </view>
+                  <view>{{item.optionA}}</view>
+                </label>
+                <label>
+                  <view>
+                    <radio value="B" :checked="false" />
+                  </view>
+                  <view>{{item.optionB}}</view>
+                </label>
+              </radio-group>
+
             </view>
           </view>
+          <view class="Submit">
+            <text @tap="Submit">提交</text>
+          </view>
         </scroll-view>
         <PageBottom></PageBottom>
       </view>
@@ -61,6 +84,7 @@ import MainPage from '../../../components/MainPage'
 import PageBottom from '../../../components/PageBottom'
 import { createNamespacedHelpers } from 'vuex'
 const { mapState: mapUserState, mapActions: mapUserActions, mapMutations: mapUserMutations } = createNamespacedHelpers('user')
+const { mapActions: mapIndexActions } = createNamespacedHelpers('index')
 export default {
   name: 'BookDetail',
   data () {
@@ -90,8 +114,42 @@ export default {
     ]),
     ...mapUserMutations([
     ]),
-    RadioChange (item, index, e) {
-      console.log(item, index, e.detail.value)
+    ...mapIndexActions([
+      'PostArticleAnswer'
+    ]),
+    Submit () {
+      let Bool = true
+      this.ArticleInfo.postTestList.map((item) => {
+        if (item.correctAnswers === null || item.correctAnswers === '') {
+          Bool = false
+        }
+      })
+      if (Bool && !this.DataLock) {
+        this.DataLock = true
+        this.PostArticleAnswer({ data: { data: this.ArticleInfo.postTestList } }).then(() => {
+          wx.showToast({
+            title: '提交成功',
+            icon: 'none',
+            duration: 2000
+          })
+          this.DataLock = false
+          wx.navigateBack({ changed: true })
+        }).catch(() => {
+          this.DataLock = false
+        })
+      }
+    },
+    RadioChange (item, index, e) { // 单选
+      item.correctAnswers = e.detail.value
+    },
+    CheckboxChange (item, index, e) { // 多选
+      let Arr = []
+      if (item.correctAnswers !== null && item.correctAnswers !== '') {
+        Arr = item.correctAnswers.split(',')
+      }
+      Arr.push(e.detail.value)
+      Arr = [...new Set(Arr)]
+      item.correctAnswers = Arr[Arr.length - 1].join(',')
     },
     Init () {
       if (this.UserInfo !== null) {

src/pages/Index/BookAnswer/page.scss

@@ -3,186 +3,66 @@
   height: 100%;
   overflow: hidden;
   background: #f8f8f8;
-  > .flex-item {
+  .QuestionList {
     position: relative;
     overflow: hidden;
+    padding: 0 30px;
     > view {
-      width: 100%;
-      position: absolute;
-      left: 0;
-      top: 0;
-      bottom: 0;
-      overflow-y: scroll;
-      -webkit-overflow-scrolling: touch;
-      > .FrontInfo {
+      position: relative;
+      overflow: hidden;
+      border-bottom: 2px solid #eee;
+      padding: 30px 0;
+      > .Title {
         position: relative;
         overflow: hidden;
-        > .Img {
-          padding: 30px 120px;
-          > view {
-            width: 100%;
-            padding-bottom: 120%;
-            position: relative;
-            overflow: hidden;
-            > image {
-              width: 100%;
-              height: 100%;
-            }
-          }
-        }
-        > .SubInfo {
-          position: relative;
-          overflow: hidden;
-          > .Tag {
-            font-size: 0;
-            white-space: nowrap;
-            padding: 0 30px;
-            > text {
-              display: inline-block;
-              vertical-align: middle;
-              font-size: 28px;
-              font-weight: bold;
-              line-height: 60px;
-              margin-right: 10px;
-              &.iconfont {
-                font-weight: normal;
-                font-size: 40px;
-              }
-            }
-          }
-          > .flex-h {
-            align-items: center;
-            padding: 0 30px;
-            > view {
-              align-items: center;
-              > text {
-                font-size: 28px;
-                line-height: 40px;
-                white-space: nowrap;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                color: #999;
-                &:first-child {
-                  margin-right: 10px;
-                }
-              }
-            }
-          }
-          > .Desc {
-            padding: 0 30px;
-            position: relative;
-            overflow: hidden;
-            > text {
-              width: 100%;
-              display: block;
-              font-size: 28px;
-              line-height: 40px;
-              color: #999;
-            }
-          }
-        }
-        > .Article {
-          position: relative;
-          overflow: hidden;
-          border-top: 2px solid #eee;
-          padding: 30px;
-          margin-top: 30px;
-        }
-        > .ToAnswer {
-          padding: 30px;
-          position: relative;
-          overflow: hidden;
-          > navigator {
-            display: block;
-            text-align: center;
-            font-size: 28px;
-            background: #f4c819;
-            line-height: 80px;
-            border-radius: 40px;
-            color: #333;
-          }
-        }
-      }
-    }
-  }
-  > .Bottom {
-    position: relative;
-    overflow: hidden;
-    background: #fff;
-    align-items: center;
-    padding-left: 30px;
-    z-index: 2;
-    box-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.05);
-    > .Share,
-    .Like {
-      font-size: 0;
-      white-space: nowrap;
-      margin-right: 30px;
-      > text {
-        display: inline-block;
-        vertical-align: middle;
-        font-size: 28px;
-        color: #333;
-        line-height: 40px;
-        &:first-child {
-          font-size: 36px;
-          &.active {
-            color: #f4c819;
-          }
+        > text {
+          font-size: 28px;
+          line-height: 40px;
+          display: block;
         }
       }
-    }
-    > .Answer {
-      position: relative;
-      overflow: hidden;
-      > navigator {
-        display: block;
-        width: 180px;
-        text-align: center;
-        line-height: 100px;
-        background: #f4c819;
-        color: #333;
+      > checkbox-group {
         font-size: 28px;
-      }
-    }
-    > .ReadInfo {
-      position: relative;
-      overflow: hidden;
-      > text {
-        display: block;
         white-space: nowrap;
-        font-size: 26px;
-        color: #333;
-        line-height: 32px;
+        display: block;
+        position: relative;
         overflow: hidden;
-        text-overflow: ellipsis;
-        text-align: right;
+        > view {
+          display: inline-block;
+          vertical-align: middle;
+        }
       }
-      > .Progress {
-        align-items: center;
-        margin-top: 10px;
-        > .flex-item {
-          height: 10px;
-          background: rgba(41, 141, 248, 0.5);
-          border-radius: 10px;
+      > radio-group {
+        position: relative;
+        overflow: hidden;
+        > label {
+          display: block;
           position: relative;
           overflow: hidden;
-          margin-right: 20px;
+          font-size: 28px;
+          white-space: nowrap;
+          margin-top: 20px;
           > view {
-            width: 0;
-            height: 100%;
-            position: absolute;
-            left: 0;
-            top: 0;
-            background: rgba(41, 141, 248, 1);
+            display: inline-block;
+            vertical-align: middle;
+            font-size: 28px;
           }
         }
-        > text {
-          font-size: 26px;
-          color: #333;
-          line-height: 32px;
-        }
       }
     }
   }
+  .Submit {
+    padding: 30px;
+    position: relative;
+    overflow: hidden;
+    > text {
+      display: block;
+      text-align: center;
+      font-size: 28px;
+      color: #333;
+      background: #f4c819;
+      line-height: 80px;
+      border-radius: 40px;
+    }
+  }
 }

src/pages/Index/BookDetail/index.config.js

@@ -1,4 +1,5 @@
 export default {
   // navigationStyle: 'custom',
+  enableShareAppMessage: true,
   navigationBarTitleText: '详情'
 }

src/pages/Index/BookDetail/index.vue

@@ -62,7 +62,7 @@
 
         <!-- 底部 -->
         <view class="flex-h Bottom">
-          <view class="Share">
+          <view class="Share" @tap="ShareArticle">
             <text class="iconfont iconfenxiang"></text>
             <text>分享</text>
           </view>
@@ -113,6 +113,13 @@ export default {
     MainPage,
     PageBottom
   },
+  onShareAppMessage () {
+    return {
+      title: this.ArticleInfo.shareSetting === null ? this.ArticleInfo.name : this.ArticleInfo.shareSetting.title,
+      imageUrl:this.ArticleInfo.shareSetting === null ? this.ArticleInfo.poster : this.ArticleInfo.shareSetting.imageUrl,
+      path: `/pages/Index/BookDetail/index?id=${Taro.getCurrentInstance().router.params.id}`
+    }
+  },
   created () {
   },
   mounted () {
@@ -138,6 +145,9 @@ export default {
           }
         }
       }
+    },
+    ShareArticle () { // 分享
+
     },
     TriggerSave () {
       if (!this.DataLock && this.ArticleInfo.postId) {

src/store/index/index.js

@@ -28,6 +28,11 @@ export default {
       return new Promise((resolve, reject) => {
         ToolClass.ToolRequest({ url: Api.GetSearchArticleList.url, method: Api.GetSearchArticleList.method, ...payload, success (res) { resolve(res) }, error (res) { reject(res) } })
       })
+    },
+    PostArticleAnswer (context, payload) { // 提交答题结果
+      return new Promise((resolve, reject) => {
+        ToolClass.ToolRequest({ url: Api.PostArticleAnswer.url, method: Api.PostArticleAnswer.method, ...payload, success (res) { resolve(res) }, error (res) { reject(res) } })
+      })
     }
   }
 }

src/util/Api/index.js

@@ -66,6 +66,10 @@ const Api = {
     method: 'get',
     url: `${prefix}/ma/post-type`
   },
+  PostArticleAnswer: { // 提交答题结果
+    method: 'post',
+    url: `${prefix}/ma/answer-test`
+  },
   // GetMyBodyCheckList: { // 获取我的体检记录
   //   method: 'get',
   //   url: `${prefix}/ma/medical-log`