updates

learnOnline/components/share/index.js

@@ -62,9 +62,9 @@ Component({
   methods: {
     init() {
       this.getShare().then(res => {
-        // if (!this.data.isNeed && !res.data.need_share) {
-        //   return
-        // }
+        if (!this.data.isNeed && !res.data.need_share) {
+          return
+        }
         app.getUser().then(res => {
           res.realname = res.realname || res.nickname
           if (res.avatar) {
@@ -140,7 +140,7 @@ Component({
         this.widget = this.selectComponent('.widget')
         setTimeout(() => {
           this.widget
-            .renderToCanvas({ wxml: wxml(this.data), style })
+            .renderToCanvas({ wxml: wxml(this.data), style: style(this.data) })
             .then(res => {
               wx.hideLoading()
             })
@@ -162,7 +162,7 @@ Component({
             wx.showToast({ title: '保存成功', icon: 'none' })
           })
           .catch(error => {
-            wx.showToast({ title: '保存失败', icon: 'none' })
+            wx.showToast({ title: '保存失败，请检查相册权限', icon: 'none' })
           })
       })
     },

learnOnline/components/share/index.wxml

@@ -24,9 +24,8 @@
         <view class="text">{{ controls.text }}</view>
         <view class="footer">
           <view class="footer-left">
-            <view class="tips"
-              >我已坚持学习<text class="num">{{ share.used_day }}</text
-              >天</view
+            <view class="tips">
+              我已坚持学习<text class="num"> {{ share.used_day }} </text>天</view
             >
             <view>我离学位殿堂又近了一步</view>
           </view>

learnOnline/components/share/index.wxss

@@ -18,108 +18,111 @@
   overflow-y: auto;
 }
 .share {
-  width: 600rpx;
-  height: 1064rpx;
+  width: 300px;
+  height: 532px;
   position: relative;
   overflow: hidden;
 }
 .bg {
-  width: 600rpx;
-  height: 1064rpx;
+  width: 300px;
+  height: 532px;
 }
 .cover {
   position: absolute;
-  top: 70rpx;
-  left: 32rpx;
-  width: 534rpx;
-  height: 924rpx;
+  top: 36px;
+  left: 17px;
+  width: 267px;
+  height: 462px;
 }
 .main {
   position: absolute;
-  left: 82rpx;
-  top: 230rpx;
-  /* right: 82rpx; */
-  width: 436rpx;
+  left: 40px;
+  top: 120px;
+  /* right: 41px; */
+  width: 220px;
 }
 .teacher {
-  font-size: 26rpx;
+  font-size: 13px;
   font-weight: bold;
   color: #d78c4a;
-  line-height: 32rpx;
+  line-height: 16px;
 }
 .course {
-  font-size: 26rpx;
+  font-size: 13px;
   font-weight: bold;
   color: #d78c4a;
-  line-height: 32rpx;
+  line-height: 16px;
+  margin-left: -5px;
 }
 .user {
-  margin-top: 20rpx;
+  margin-top: 10px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
 }
 .avatar {
-  width: 130rpx;
-  height: 130rpx;
+  width: 65px;
+  height: 65px;
   border-radius: 50%;
   overflow: hidden;
 }
 .nickname {
-  font-size: 30rpx;
+  margin-top: 2px;
+  font-size: 15px;
   font-weight: bold;
   color: #d78c4a;
-  line-height: 48rpx;
+  line-height: 1;
 }
 .chapter {
-  margin-top: 10rpx;
-  margin-left: 18rpx;
-  margin-right: 18rpx;
-  height: 64rpx;
-  font-size: 28rpx;
+  margin-top: 6px;
+  margin-left: 8px;
+  margin-right: 8px;
+  height: 32px;
+  font-size: 14px;
   font-weight: bold;
   color: #1a1a1a;
-  line-height: 32rpx;
+  line-height: 16px;
   text-align: center;
+  overflow: hidden;
 }
 .text {
-  margin-top: 116rpx;
-  margin-left: 30rpx;
-  margin-right: 30rpx;
-  height: 72rpx;
-  font-size: 26rpx;
-  font-weight: 500;
+  margin-top: 56px;
+  margin-left: 12px;
+  margin-right: 12px;
+  height: 36px;
+  font-size: 13px;
+  font-weight: bold;
   /* font-style: italic; */
   color: #1a1a1a;
-  line-height: 36rpx;
+  line-height: 18px;
   overflow: hidden;
 }
 .footer {
   display: flex;
   align-items: center;
-  margin-top: 30rpx;
-  margin-left: 18rpx;
-  margin-right: 18rpx;
+  margin-top: 15px;
+  margin-left: 15px;
+  margin-right: 15px;
 }
 .footer-left {
   flex: 1;
-  font-size: 24rpx;
+  font-size: 12px;
   color: #1a1a1a;
-  line-height: 36rpx;
+  line-height: 18px;
 }
 .footer-left .tips {
   display: flex;
   align-items: center;
 }
 .num {
-  font-size: 34rpx;
+  font-size: 17px;
   color: #d78c4a;
-  font-weight: Bold;
+  font-weight: bold;
 }
 .footer-right {
-  width: 98rpx;
-  height: 98rpx;
+  width: 50px;
+  height: 50px;
 }
 .controls {
   position: relative;
@@ -134,36 +137,35 @@
   background-color: #fff;
 }
 .controls.is-show .controls-main {
-  height: 260rpx;
+  height: 130px;
 }
 .buttons {
   position: absolute;
-  top: -132rpx;
+  top: -66px;
   left: 0;
   right: 0;
   display: flex;
   justify-content: space-between;
-  padding: 16rpx 26rpx;
+  padding: 8px 13px;
 }
 .button {
   position: relative;
-  width: 100rpx;
-  height: 100rpx;
+  width: 50px;
+  height: 50px;
   background: #ffffff;
-  box-shadow: 0rpx 2rpx 8rpx 0rpx rgba(0, 0, 0, 0.2);
+  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);
   border-radius: 50%;
-  font-size: 26rpx;
-  font-weight: 400;
+  font-size: 13px;
   color: #d78c4a;
-  line-height: 30rpx;
+  line-height: 15px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
 }
 .wx-image {
-  width: 100rpx;
-  height: 100rpx;
+  width: 50px;
+  height: 50px;
 }
 .wx-button {
   position: absolute;
@@ -182,12 +184,12 @@ button::after {
 }
 .controls-tabs {
   display: flex;
-  height: 60rpx;
+  height: 30px;
   background: #ccc;
 }
 .controls-tab {
-  width: 150rpx;
-  line-height: 60rpx;
+  width: 75px;
+  line-height: 30px;
   text-align: center;
   background-color: #e6e6e6;
 }
@@ -197,57 +199,57 @@ button::after {
 }
 .controls-content {
   flex: 1;
-  height: 200rpx;
-  padding: 0 20rpx;
+  height: 100px;
+  padding: 0 10px;
   display: flex;
   align-items: center;
   flex-wrap: nowrap;
 }
 .controls-content .is-active {
-  border: 5rpx solid #d78c4a;
+  border: 3px solid #d78c4a;
 }
 .controls-bg-item {
-  flex: 0 0 92rpx;
-  width: 92rpx;
-  height: 162rpx;
-  margin: 0 30rpx;
-  border: 5rpx solid #fff;
-  border-radius: 5rpx;
+  flex: 0 0 46px;
+  width: 46px;
+  height: 80px;
+  margin: 0 15px;
+  border: 3px solid #fff;
+  border-radius: 3px;
   overflow: hidden;
 }
 .controls-text-item {
-  margin: 0 30rpx;
-  flex: 0 0 455rpx;
-  width: 455rpx;
-  height: 125rpx;
+  margin: 0 15px;
+  flex: 0 0 228px;
+  width: 228px;
+  height: 60px;
   display: flex;
   align-items: center;
   justify-content: center;
-  border: 5rpx solid #ccc;
-  border-radius: 12rpx;
+  border: 3px solid #ccc;
+  border-radius: 6px;
   overflow: hidden;
-  padding: 30rpx;
-  font-size: 26rpx;
+  padding: 12px;
+  font-size: 13px;
   color: #1a1a1a;
-  line-height: 36rpx;
+  line-height: 18px;
   box-sizing: border-box;
 }
 .controls-avatar-item {
   position: relative;
-  margin: 0 30rpx;
-  flex: 0 0 120rpx;
-  width: 120rpx;
-  height: 125rpx;
+  margin: 0 15px;
+  flex: 0 0 60px;
+  width: 60px;
+  height: 60px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  border: 5rpx solid #ccc;
+  border: 3px solid #ccc;
   border-radius: 50%;
   overflow: hidden;
-  font-size: 26rpx;
+  font-size: 13px;
   color: #1a1a1a;
-  line-height: 36rpx;
+  line-height: 18px;
   box-sizing: border-box;
 }
 .image {
@@ -266,14 +268,14 @@ button::after {
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  padding: 75rpx 0;
+  padding: 38px 0;
 }
 .close {
   position: absolute;
-  right: 16rpx;
-  top: 16rpx;
-  width: 96rpx;
-  height: 96rpx;
+  right: 8px;
+  top: 8px;
+  width: 48px;
+  height: 48px;
   background: url('https://webapp-pub.ezijing.com/weapp/share/close.png') no-repeat;
   background-size: contain;
   z-index: 999;
@@ -287,18 +289,18 @@ button::after {
   overflow-y: auto;
 }
 .share-preivew .button {
-  width: 500rpx;
-  height: 100rpx;
-  border-radius: 50rpx;
+  width: 250px;
+  height: 50px;
+  border-radius: 25px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  margin: 35rpx 0;
-  font-size: 26rpx;
+  margin: 18px 0;
+  font-size: 13px;
   font-weight: 400;
   color: #d78c4a;
-  line-height: 30rpx;
+  line-height: 15px;
 }
 .share-preivew .button-default {
   color: #d78c4a;
@@ -309,9 +311,9 @@ button::after {
   background: #d78c4a;
 }
 .share-preivew .tips {
-  font-size: 26rpx;
+  font-size: 13px;
   font-weight: 400;
   color: #fff;
-  line-height: 40rpx;
+  line-height: 15px;
   text-align: center;
 }

learnOnline/components/share/share.js

 const wxml = function (data) {
   return `
   <view class="share">
-    <image src="${data.controls.bg}?x-oss-process=image/resize,m_fill,h_530,w_300" class="bg"></image>
+    <image src="${data.controls.bg}?x-oss-process=image/resize,m_fill,h_532,w_300" class="bg"></image>
     <image src="https://webapp-pub.ezijing.com/weapp/share/cover.png" class="cover"></image>
     <view class="main">
       <text class="teacher">${data.share.lecturer.lecturer_name}</text>
@@ -23,140 +23,141 @@ const wxml = function (data) {
   </view>`
 }
 
-const style = {
-  share: {
-    position: 'relative',
-    width: 300,
-    height: 530
-  },
-  bg: {
-    width: 300,
-    height: 530
-  },
-  cover: {
-    position: 'absolute',
-    top: 35,
-    left: 17,
-    width: 267,
-    height: 462
-  },
-  main: {
-    position: 'absolute',
-    left: 40,
-    top: 119,
-    width: 220,
-    height: 300
-  },
-  teacher: {
-    height: 14,
-    fontSize: 13,
-    lineHeight: 1,
-    color: '#D78C4A',
-    verticalAlign: 'middle'
-  },
-  course: {
-    height: 14,
-    fontSize: 13,
-    lineHeight: 14,
-    color: '#D78C4A',
-    verticalAlign: 'middle'
-  },
-  user: {
-    marginTop: 12,
-    flexDirection: 'column',
-    alignItems: 'center'
-  },
-  avatar: {
-    width: 65,
-    height: 65,
-    borderRadius: 32.5
-  },
-  nickname: {
-    marginTop: 4,
-    width: 220,
-    height: 14,
-    textAlign: 'center',
-    verticalAlign: 'middle',
-    fontSize: 13,
-    lineHeight: 14,
-    color: '#D78C4A',
-    textAlign: 'center'
-  },
-  chapter: {
-    marginTop: 8,
-    width: 220,
-    height: 32,
-    fontSize: 14,
-    fontWeight: 'bold',
-    color: '#1A1A1A',
-    lineHeight: 16,
-    textAlign: 'center'
-  },
-  text: {
-    marginTop: 55,
-    marginLeft: 12,
-    width: 200,
-    height: 36,
-    fontSize: 13,
-    fontWeight: 'bold',
-    fontStyle: 'italic',
-    color: '#1A1A1A',
-    lineHeight: 18
-  },
-  footer: {
-    marginLeft: 15,
-    marginRight: 15,
-    width: 190,
-    height: 60,
-    marginTop: 12,
-    flexDirection: 'row',
-    alignItems: 'center'
-  },
-  footerLeft: {
-    width: 140,
-    height: 50,
-    justifyContent: 'center'
-  },
-  box: {
-    width: 140,
-    height: 20,
-    flexDirection: 'row'
-  },
-  t1: {
-    width: 72,
-    height: 20,
-    fontSize: 12,
-    lineHeight: 20,
-    color: '#1A1A1A',
-    verticalAlign: 'middle'
-  },
-  t2: {
-    width: 40,
-    height: 20,
-    fontSize: 17,
-    lineHeight: 20,
-    color: '#D78C4A',
-    textAlign: 'center'
-  },
-  t3: {
-    width: 40,
-    height: 20,
-    fontSize: 12,
-    lineHeight: 20,
-    color: '#1A1A1A',
-    verticalAlign: 'middle'
-  },
-  tips: {
-    width: 140,
-    height: 20,
-    fontSize: 12,
-    lineHeight: 20,
-    color: '#1A1A1A',
-    verticalAlign: 'middle'
-  },
-  footerRight: {
-    width: 50,
-    height: 50
+const style = function (data) {
+  const numLength = data.share.used_day.toString().length
+  return {
+    share: {
+      position: 'relative',
+      width: 300,
+      height: 532
+    },
+    bg: {
+      width: 300,
+      height: 532
+    },
+    cover: {
+      position: 'absolute',
+      top: 36,
+      left: 17,
+      width: 267,
+      height: 462
+    },
+    main: {
+      position: 'absolute',
+      left: 40,
+      top: 120,
+      width: 220,
+      height: 300
+    },
+    teacher: {
+      height: 16,
+      fontSize: 13,
+      fontWeight: 'bold',
+      lineHeight: 16,
+      color: '#D78C4A'
+    },
+    course: {
+      marginLeft: -5,
+      height: 16,
+      fontSize: 13,
+      fontWeight: 'bold',
+      lineHeight: 16,
+      color: '#D78C4A'
+    },
+    user: {
+      marginTop: 10,
+      flexDirection: 'column',
+      alignItems: 'center'
+    },
+    avatar: {
+      width: 65,
+      height: 65,
+      borderRadius: 32.5
+    },
+    nickname: {
+      marginTop: 2,
+      width: 220,
+      height: 16,
+      fontSize: 15,
+      fontWeight: 'bold',
+      lineHeight: 16,
+      color: '#D78C4A',
+      textAlign: 'center'
+    },
+    chapter: {
+      marginTop: 6,
+      width: 220,
+      height: 32,
+      fontSize: 14,
+      fontWeight: 'bold',
+      color: '#1A1A1A',
+      lineHeight: 16,
+      textAlign: 'center'
+    },
+    text: {
+      marginTop: 56,
+      marginLeft: 12,
+      width: 200,
+      height: 36,
+      fontSize: 13,
+      fontWeight: 'bold',
+      fontStyle: 'italic',
+      color: '#1A1A1A',
+      lineHeight: 18
+    },
+    footer: {
+      marginTop: 15,
+      marginLeft: 15,
+      marginRight: 15,
+      width: 190,
+      height: 50,
+      flexDirection: 'row',
+      alignItems: 'center'
+    },
+    footerLeft: {
+      width: 140,
+      height: 50,
+      justifyContent: 'center'
+    },
+    box: {
+      width: 140,
+      height: 20,
+      flexDirection: 'row'
+    },
+    t1: {
+      width: 72,
+      height: 20,
+      fontSize: 12,
+      lineHeight: 20,
+      color: '#1A1A1A'
+    },
+    t2: {
+      width: numLength * 12,
+      height: 20,
+      fontSize: 17,
+      fontWeight: 'bold',
+      lineHeight: 20,
+      color: '#D78C4A',
+      textAlign: 'center'
+    },
+    t3: {
+      width: 12,
+      height: 20,
+      fontSize: 12,
+      lineHeight: 20,
+      color: '#1A1A1A'
+    },
+    tips: {
+      width: 140,
+      height: 20,
+      fontSize: 12,
+      lineHeight: 20,
+      color: '#1A1A1A'
+    },
+    footerRight: {
+      width: 50,
+      height: 50
+    }
   }
 }
 

learnOnline/pages/learnSystem/courseContent/courseIntro/courseIntro.wxss

@@ -7,9 +7,9 @@
 .course-intro .list-teacher { margin-top: 50rpx; padding: 0 25rpx; }
 .course-intro .list-teacher .img { float: left; width: 150rpx; height: 150rpx; background: #c9c9c9; }
 .course-intro .list-teacher .ctx { position: relative; margin-left: 170rpx; height: 150rpx; }
-.course-intro .list-teacher .ctx .top-ctx { position: absolute; top: -4rpx; width: 100%; overflow: hidden; }
+.course-intro .list-teacher .ctx .top-ctx {}
 .course-intro .list-teacher .ctx .top-ctx .tit { font-size: 28rpx; color: #313131; line-height: 37rpx; overflow: hidden; word-break: break-all; }
-.course-intro .list-teacher .ctx .bottom-ctx { position: absolute; top: 50rpx; width: 100%; overflow: hidden; }
+.course-intro .list-teacher .ctx .bottom-ctx { }
 .course-intro .list-teacher .ctx .bottom-ctx .t1 { font-size: 22rpx; line-height: 30rpx; color: #707070; overflow: hidden; word-break: break-all; }
 .course-intro .list-teacher .ctx .bottom-ctx .t2 { font-size: 22rpx; line-height: 30rpx; color: #707070; overflow: hidden; word-break: break-all; }
 .course-intro .list-teacher .ctx .bottom-ctx .t3 { font-size: 22rpx; color: #707070; text-overflow: ellipsis; overflow: hidden; word-break: break-all; }
\ No newline at end of file