领取结果页面接口联调

assets/style/index.less

@@ -366,4 +366,74 @@
       }
     }
   }
-}
\ No newline at end of file
+}
+.wx-share-result{
+  width: 375px;
+  height: 601.5px;
+  section{
+    width: 375px;
+    height: 601.5px;
+    padding-top: 40px;
+    .res-wrap{
+      img{
+        width: 70px;
+        height: 60px;
+        display: block;
+        margin: 0 auto;
+      }
+      h1{
+        font-size:20px;
+        font-weight:700;
+        color:rgba(55,56,57,1);
+        line-height:20px;
+        margin: 20px 0;
+        text-align: center;
+      }
+      h3{
+        font-size:13px;
+        line-height:13px;
+        text-align: center;
+        margin-bottom: 30px;
+        color:rgba(151,152,153,1);
+      }
+    }
+    .btn-app{
+      width: 335px;
+      height: 40px;
+      line-height:40px;
+      border-radius:22.5px;
+      font-size:16px;
+      font-weight:700;
+      text-align: center;
+      margin: 0 auto;
+    }
+    .down-app{
+      background:linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%);
+      color:rgba(255,255,255,1);
+    }
+    .has-app{
+      margin-top: 12px;
+      margin-bottom: 40px;
+      border:1px solid rgba(151,152,153,1);
+      color:rgba(103,104,105,1);
+    }
+    .line{
+      width: 375px;
+      height: 5px;
+      background:rgba(248,249,250,1);
+    }
+    .more-course{
+      padding: 30px 15px;
+      header{
+        font-size:18px;
+        font-weight:700;
+        color:rgba(51,51,51,1);
+        line-height:18px;
+      }
+      .course-list{
+        .course-item{
+        }
+      }
+    }
+  }
+}

pages/shareResult.vue

 <template>
-	<div>
-		<h1>result-share</h1>
+	<div class="wx-share-result">
+		<section>
+			<div class="res-wrap">
+				<img src="../assets/img/resimg0.png">
+				<h1>领取成功</h1>
+				<h3>登录云鹊医APP立即开始学习</h3>
+			</div>
+			
+			<div class="btn-app down-app">下载APP</div>
+			<div class="btn-app has-app">已有APP</div>
+
+			<div class="line"></div>
+			
+			<div class="more-course">
+				<header>更多精彩好课推荐</header>
+				<div class="course-list">
+					<div class="course-item">
+						<div>
+							<h1>高血压系列课程</h1>
+							<h3>《高血压的发病机制》等总计4门课程</h3>
+						</div>
+						<div><img src="../assets/img/resimg1.png"></div>
+					</div>
+
+					<div class="course-item">
+						<div>
+							<h1>糖尿病系列课程</h1>
+							<h3>《胰岛素的选择和管理》等总计4门课程</h3>
+						</div>
+						<div><img src="../assets/img/resimg2.png"></div>
+					</div>
+
+					<div class="course-item">
+						<div>
+							<h1>中医系列课程</h1>
+							<h3>《慢性胃炎的中医治疗》等总计3门课程</h3>
+						</div>
+						<div><img src="../assets/img/resimg3.png"></div>
+					</div>
+
+					<div class="course-item">
+						<div>
+							<h1>全科系列课程</h1>
+							<h3>《胸痛原因待查》等总计3门课程</h3>
+						</div>
+						<div><img src="../assets/img/resimg4.png"></div>
+					</div>
+				</div>
+			</div>
+		</section>
 	</div>
 </template>
 
@@ -11,4 +59,11 @@
 			const { status } = query; // 上个页面传递过来领取结果， false 为已领取， true 为领取成功
 		}
 	}
-</script>
\ No newline at end of file
+</script>
+
+<style lang="less" scoped>
+@import '../assets/style/index.less';
+</style>
+<style lang="less">
+@import '../assets/style/revant.less';
+</style>
\ No newline at end of file