diff --git a/common.scss b/common.scss
index 44fd493..fb16052 100644
--- a/common.scss
+++ b/common.scss
@@ -1,4 +1,3 @@
-
 // 文字益处处理
 .text-ellipsis{
 	overflow:hidden; //超出的文本隐藏
diff --git a/components/base/navbar.vue b/components/base/navbar.vue
index 34d6fee..4517a01 100644
--- a/components/base/navbar.vue
+++ b/components/base/navbar.vue
@@ -110,7 +110,7 @@
 	left: 0;
 	padding-top: calc(var(--status-bar-height) + 20rpx);
 	width: 100%;
-	height: 100rpx;
+	height: $navbar-height;
 	background-color: #fff;
 	display: flex;
 	justify-content: center;
diff --git a/pages/index/center.vue b/pages/index/center.vue
index e5b45cb..f72f717 100644
--- a/pages/index/center.vue
+++ b/pages/index/center.vue
@@ -197,7 +197,7 @@
 						state: 1,
 					},
 					{
-						id: '003',
+						id: '004',
 						imageUrl: '../../static/image/center/temp.png',
 						times: 10,
 						qrCode: null,
diff --git a/pages_order/components/popupQrCode.vue b/pages_order/components/popupQrCode.vue
new file mode 100644
index 0000000..012bc6d
--- /dev/null
+++ b/pages_order/components/popupQrCode.vue
@@ -0,0 +1,53 @@
+<template>
+  <uv-popup 
+    ref="popup"
+    :overlayOpacity="0.8"
+    mode="bottom"
+    round="20rpx"
+  >
+    <view class="flex qr-popup">
+      <text class="tips">长按识别二维码，了解更多内容！</text>
+      <image class="qr" :src="src"></image>
+    </view>
+  </uv-popup>
+</template>
+
+<script>
+	export default {
+    props: {
+      src: {
+        type: String,
+        default: null
+      }
+    },
+		data() {
+			return {
+      }
+    },
+    methods: {
+      open() {
+        this.$refs.popup.open();
+      },
+      close() {
+        this.$refs.popup.close();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+.qr-popup {
+  flex-direction: column;
+
+  .tips {
+    margin-top: 75rpx;
+    color: #1B1B1B;
+    font-size: 32rpx;
+  }
+  .qr {
+    margin-top: 40rpx;
+    width: 350rpx;
+    height: 350rpx;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/pages_order/components/popupUnlock.vue b/pages_order/components/popupUnlock.vue
new file mode 100644
index 0000000..ccfd890
--- /dev/null
+++ b/pages_order/components/popupUnlock.vue
@@ -0,0 +1,62 @@
+<template>
+  <uv-popup 
+    ref="popup"
+    :overlayOpacity="0.8"
+    :customStyle="{
+      backgroundColor: 'transparent',
+    }"
+  >
+    <view>
+      <image class="popup-bg" :src="src"></image>
+      <view class="flex popup-btns">
+        <button plain class="btn-simple" @click="close">
+          <image class="popup-btn" src="../static/sharing/cancel.png"></image>
+        </button>
+        <button plain class="btn-simple" open-type="share">
+          <image class="popup-btn" src="../static/sharing/forward.png"></image>
+        </button>
+      </view>
+    </view>
+  </uv-popup>
+</template>
+
+<script>
+	export default {
+    props: {
+      src: {
+        type: String,
+        default: null
+      }
+    },
+		data() {
+			return {
+      }
+    },
+    methods: {
+      open() {
+        this.$refs.popup.open();
+      },
+      close() {
+        this.$refs.popup.close();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+.popup {
+  &-bg {
+    width: 578rpx; height: 317rpx;
+  }
+
+  &-btns {
+    justify-content: space-between; 
+    margin-top: 56rpx;
+  }
+
+  &-btn {
+    width: 265rpx; 
+    height: 84rpx;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/pages_order/record/articleSharing.vue b/pages_order/record/articleSharing.vue
index cb79527..0cf72ab 100644
--- a/pages_order/record/articleSharing.vue
+++ b/pages_order/record/articleSharing.vue
@@ -204,6 +204,10 @@
           const description = (await this.getEditroContents())?.html
           // todo: decode?
 
+          console.log(description)
+
+          return
+
           const params = { ...this.form, description }
         
           // todo
diff --git a/pages_order/sharing/article.vue b/pages_order/sharing/article.vue
index f1a3067..49dad42 100644
--- a/pages_order/sharing/article.vue
+++ b/pages_order/sharing/article.vue
@@ -1,18 +1,169 @@
 <template>
   <view>
-		<navbar leftClick @leftClick="$utils.navigateBack" />
+    <view class="content">
+      <view class="title">{{ detail.title || '' }}</view>
 
+      <view class="desc">{{ detail.publishTime ? `发布于${detail.publishTime}` : '' }}</view>
+
+        <editor id="editor" class="editor" 
+          :read-only="true"
+          @ready="onEditorReady"
+        ></editor>
+    </view>
+
+    <uv-overlay :show="true" :opacity="0">
+      <navbar leftClick @leftClick="$utils.navigateBack" />
+
+      <button class="btn" type="success" @click="openPopup">查看更多</button>
+  
+      <popupUnlock ref="popupUnlock" src="../static/sharing/unlock-article.png"></popupUnlock>
+   
+      <popupQrCode ref="popupQrCode" :src="detail.qrCode"></popupQrCode>
+   
+    </uv-overlay>
+    
   </view>
 </template>
 
 <script>
+  import popupUnlock from '../components/popupUnlock.vue'
+  import popupQrCode from '../components/popupQrCode.vue'
+
 	export default {
+    components: {
+      popupUnlock,
+      popupQrCode,
+    },
 		data() {
 			return {
+        detail: {
+          id: null,
+          groupName: null,
+          imageUrl: null,
+          times: null,
+          qrCode: null,
+          title: null,
+          description: null,
+          auditStatus: null,
+          createTime: null,
+          publishTime: null,
+          state: null,
+        },
+        isLocked: true,
+      }
+    },
+    async onLoad(option) {
+      const { id } = option
+      
+      await this.fetchSharingDetail(id)
+
+      this.initEditor(this.detail.description)
+    },
+    onShareAppMessage(res) {
+      const {
+        title,
+        imageUrl,
+      } = this.detail
+
+      // todo: check
+      let o = {
+        title : title,
+        imageUrl: imageUrl,
+        query: `id=${this.detail.id}`,
+      }
+
+      // todo: check callback? settimeout?
+
+      // todo: get times and check is unlocked
+
+      this.isLocked = false
+      
+      this.$refs.popupQrCode.open()
+
+      return o
+    },
+    methods: {
+      onEditorReady() {
+				uni.createSelectorQuery().select('#editor').context((res) => {
+					this.editorCtx = res.context
+				}).exec()
+			},
+      initEditor(html) {
+        if (!this.editorCtx) {
+          setTimeout(() => {
+            this.initEditor(html)
+          }, 200)
+
+          return
+        }
+
+        this.editorCtx.setContents({ html })
+      },
+      async fetchSharingDetail(id) {
+        // todo: init data by id
+
+        this.detail = {
+          id: '001',
+          groupName: '裂变星创业服务交流群',
+          imageUrl: 'http://gips3.baidu.com/it/u=70459541,3412285454&fm=3028&app=3028&f=JPEG&fmt=auto?w=960&h=1280',
+          times: 10,
+          qrCode: '../static/temp-qrcode.png',
+          title: '裂变星轻松获客',
+          description: '<p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p><br></p><p>aaaaaaaaa</p><p><br></p><p><br></p><p>bbbbbbb</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p><br></p><p>aaaaaaaaa</p><p><br></p><p><br></p><p>bbbbbbb</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p><p>文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本内容文本</p>',
+          auditStatus: 2,
+          createTime: '2025年2月1日',
+          publishTime: '2024年11月13日 11:29',
+          state: 2,
+        }
+      },
+      openPopup() {
+        if (this.isLocked) {
+          this.$refs.popupUnlock.open();
+        } else {
+          this.$refs.popupQrCode.open()
+        }
       }
     }
   }
 </script>
 
 <style scoped lang="scss">
+.content {
+  padding: 40rpx 20rpx;
+  padding-top: calc(#{$navbar-height} + var(--status-bar-height) + 20rpx + 40rpx);
+}
+
+.title {
+  color: #474747;
+  font-size: 36rpx;
+  font-weight: 700;
+}
+
+.desc {
+  color: #A2A2A2;
+  font-size: 24rpx;
+  margin-top: 6rpx;
+}
+
+.editor {
+  margin-top: 22rpx;
+  height: 40vh;
+}
+
+.btn {
+  position: absolute;
+  width: calc(100% - 60rpx*2);
+  height: auto;
+  left: 60rpx;
+  bottom: 292rpx;
+
+  background-color: #07C160;
+  border: none;
+  color: #FFFFFF;
+  font-size: 28rpx;
+  line-height: 1;
+  border-radius: 45rpx;
+  padding: 25rpx 0;
+  box-sizing: border-box;
+}
 </style>
\ No newline at end of file
diff --git a/pages_order/sharing/group.vue b/pages_order/sharing/group.vue
index f1a3067..30caee1 100644
--- a/pages_order/sharing/group.vue
+++ b/pages_order/sharing/group.vue
@@ -1,18 +1,154 @@
 <template>
-  <view>
+  <view class="page">
 		<navbar leftClick @leftClick="$utils.navigateBack" />
 
+    <view class="content">
+      <image class="avatar" :src="detail.imageUrl"></image>
+      <text class="nick-name">{{ detail.groupName }}</text>
+
+      <template v-if="isLocked">
+        <button class="btn" type="success" @click="openPopup">加入</button>
+      </template>
+      <view v-else class="group-info flex">
+        <text>扫一扫，加群主审核进群</text>
+        <image class="qr" :src="detail.qrCode"></image>
+      </view>
+    </view>
+
+    <popupUnlock ref="popupUnlock" src="../static/sharing/unlock-group.png"></popupUnlock>
+
   </view>
 </template>
 
 <script>
+  import popupUnlock from '../components/popupUnlock.vue'
+
 	export default {
+    components: {
+      popupUnlock,
+    },
 		data() {
 			return {
+        detail: {
+          id: null,
+          avatarUrl: null,
+          nickName: null,
+          imageUrl: null,
+          times: 10,
+          qrCode: null,
+          description: null,
+        },
+        isLocked: true,
+      }
+    },
+    onLoad(option) {
+      const { id } = option
+      
+      this.fetchSharingDetail(id)
+    },
+    onShareAppMessage(res) {
+      const {
+        description,
+        imageUrl,
+      } = this.detail
+
+      // todo: check
+      let o = {
+        title : description,
+        imageUrl: imageUrl,
+        // path: `/pages_order/sharing/personal?id=${this.detail.id}`
+        query: `id=${this.detail.id}`,
       }
-    }
+
+      // todo: check callback? settimeout?
+
+      // todo: get times and check is unlocked
+
+      this.isLocked = false
+
+      return o
+    },
+    methods: {
+      async fetchSharingDetail(id) {
+        // todo: init data by id
+
+        this.detail = {
+          id: '001',
+          groupName: '裂变星创业服务交流群',
+          imageUrl: 'http://gips3.baidu.com/it/u=70459541,3412285454&fm=3028&app=3028&f=JPEG&fmt=auto?w=960&h=1280',
+          times: 10,
+          qrCode: '../static/temp-qrcode.png',
+          // title: '裂变星轻松获客',
+          description: '如此好用的赚钱项目，赶快加入吧！',
+          auditStatus: 2,
+          createTime: '2025年2月1日',
+          state: 2,
+        }
+      },
+      openPopup() {
+        this.$refs.popupUnlock.open();
+      },
+    },
   }
 </script>
 
 <style scoped lang="scss">
+.page {
+  position: relative;
+  height: 100vh;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.avatar {
+  width: 180rpx;
+  height: 180rpx;
+  margin-top: 127rpx;
+}
+
+.nick-name {
+  color: #1B1B1B;
+  font-size: 32rpx;
+  margin-top: 30rpx;
+}
+
+.btn, .group-info {
+  position: absolute;
+}
+
+.btn {
+  width: calc(100% - 60rpx*2);
+  height: auto;
+  left: 60rpx;
+  bottom: 292rpx;
+
+  background-color: #07C160;
+  border: none;
+  color: #FFFFFF;
+  font-size: 28rpx;
+  line-height: 1;
+  border-radius: 45rpx;
+  padding: 25rpx 0;
+  box-sizing: border-box;
+}
+
+.group-info {
+  bottom: 269rpx;
+
+  flex-direction: column;
+
+  color: #1B1B1B;
+  font-size: 32rpx;
+}
+
+.qr {
+  margin-top: 40rpx;
+
+  width: 350rpx;
+  height: 350rpx;
+}
 </style>
\ No newline at end of file
diff --git a/pages_order/sharing/personal.vue b/pages_order/sharing/personal.vue
index 88772a1..8b33abc 100644
--- a/pages_order/sharing/personal.vue
+++ b/pages_order/sharing/personal.vue
@@ -14,30 +14,18 @@
       </template>
     </view>
 
-    <uv-popup 
-      ref="popup"
-      :overlayOpacity="0.8"
-      :customStyle="{
-        backgroundColor: 'transparent',
-      }"
-    >
-      <view>
-        <image class="popup-bg" src="../static/sharing/add-user.png"></image>
-        <view class="flex popup-btns">
-          <button plain class="btn-simple" @click="closePopup">
-            <image class="popup-btn" src="../static/sharing/cancel.png"></image>
-          </button>
-          <button plain class="btn-simple" open-type="share">
-            <image class="popup-btn" src="../static/sharing/forward.png"></image>
-          </button>
-        </view>
-      </view>
-    </uv-popup>
+    <popupUnlock ref="popupUnlock" src="../static/sharing/unlock-user.png"></popupUnlock>
+
   </view>
 </template>
 
 <script>
+  import popupUnlock from '../components/popupUnlock.vue'
+
 	export default {
+    components: {
+      popupUnlock,
+    },
 		data() {
 			return {
         detail: {
@@ -76,6 +64,8 @@
 
       // todo: get times and check is unlocked
 
+      this.isLocked = false
+
       return o
     },
     methods: {
@@ -97,10 +87,7 @@
         }
       },
       openPopup() {
-        this.$refs.popup.open();
-      },
-      closePopup() {
-        this.$refs.popup.close();
+        this.$refs.popupUnlock.open();
       },
     },
   }
@@ -155,20 +142,4 @@
   height: 350rpx;
   bottom: 269rpx;
 }
-
-.popup {
-  &-bg {
-    width: 578rpx; height: 317rpx;
-  }
-
-  &-btns {
-    justify-content: space-between; 
-    margin-top: 56rpx;
-  }
-
-  &-btn {
-    width: 265rpx; 
-    height: 84rpx;
-  }
-}
 </style>
\ No newline at end of file
diff --git a/pages_order/sharing/video.vue b/pages_order/sharing/video.vue
index a9dcbc5..5e5e69f 100644
--- a/pages_order/sharing/video.vue
+++ b/pages_order/sharing/video.vue
@@ -1,19 +1,38 @@
 <template>
-  <view>
+  <view class="page">
 		<navbar leftClick @leftClick="$utils.navigateBack" />
 
     <view class="content">
-      <video 
+      <video class="video"
+        id="video"
         :src="detail.videoUrl" 
         autoplay
+        :show-fullscreen-btn="false"
         @timeupdate="onTimeupdate"
       ></video>
+      <view class="info">
+        <view class="author">{{ detail.author }}</view>
+        <view class="title">{{ detail.title }}</view>
+        <view class="desc">{{ detail.description }}</view>
+      </view>
     </view>
+
+    <popupUnlock ref="popupUnlock" src="../static/sharing/unlock-video.png"></popupUnlock>
+
+    <popupQrCode ref="popupQrCode" :src="detail.qrCode"></popupQrCode>
+
   </view>
 </template>
 
 <script>
+  import popupUnlock from '../components/popupUnlock.vue'
+  import popupQrCode from '../components/popupQrCode.vue'
+
 	export default {
+    components: {
+      popupUnlock,
+      popupQrCode,
+    },
 		data() {
 			return {
         detail: {
@@ -25,25 +44,32 @@
           description: null,
         },
         isLocked: true,
+        videoContext: null
       }
     },
-    onLoad(option) {
+    async onLoad(option) {
       console.log('--option', option)
       const { id } = option
       
-      this.fetchSharingDetail(id)
+      await this.fetchSharingDetail(id)
+
+      this.videoContext = uni.createVideoContext('video');
+      
+      console.log('--videoContext', this.videoContext)
+
+      // this.videoContext.requestFullScreen()
+
     },
     onShareAppMessage(res) {
       const {
-        description,
-        imageUrl,
+        title,
+        coverImageUrl,
       } = this.detail
 
       // todo: check
       let o = {
-        title : description,
-        imageUrl: imageUrl,
-        // path: `/pages_order/sharing/personal?id=${this.detail.id}`
+        title : title,
+        imageUrl: coverImageUrl,
         query: `id=${this.detail.id}`,
       }
 
@@ -51,6 +77,10 @@
 
       // todo: get times and check is unlocked
 
+      this.isLocked = false
+      
+      this.$refs.popupQrCode.open()
+
       return o
     },
     methods: {
@@ -59,29 +89,54 @@
 
         this.detail = {
           id: '001',
+          author: '@裂变星',
           coverImageUrl: 'http://gips3.baidu.com/it/u=70459541,3412285454&fm=3028&app=3028&f=JPEG&fmt=auto?w=960&h=1280',
-          videoUrl: '../static/temp-video.mp4',
+          videoUrl: 'http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400',
+          mins: 10,
           times: 10,
           qrCode: '../static/temp-qrcode.png',
-          title: '裂变星轻松获客',
-          description: '如此好用的赚钱项目，赶快加入吧！',
+          title: '20秒学会日赚1000+，全自动获客',
+          description: '裂变获客，轻松引流！',
           auditStatus: 2,
           createTime: '2025年2月1日',
-          state: -1,
+          state: 1,
         }
       },
       onTimeupdate(e) {
-        console.log('--onTimeupdate', e)
-      },
-      openPopup() {
-        this.$refs.popup.open();
-      },
-      closePopup() {
-        this.$refs.popup.close();
+        const { currentTime } = e.target
+
+        if (currentTime >= this.detail.mins) {
+          this.videoContext.pause()
+
+          if (this.isLocked) {
+            this.$refs.popupUnlock.open();
+          } else {
+            this.$refs.popupQrCode.open()
+          }
+        }
       },
     },
   }
 </script>
 
 <style scoped lang="scss">
+.video {
+  width: 100%;
+  height: calc(100vh - #{$navbar-height} - var(--status-bar-height) - 20rpx);
+}
+
+.info {
+  color: #FFFFFF;
+  font-size: 28rpx;
+
+  position: fixed;
+  left: 40rpx;
+  bottom: 100rpx;
+
+  .title {
+    font-size: 32rpx;
+    margin: 5rpx 0;
+  }
+}
+
 </style>
\ No newline at end of file
diff --git a/pages_order/static/sharing/unlock-article.png b/pages_order/static/sharing/unlock-article.png
new file mode 100644
index 0000000..f684ca9
Binary files /dev/null and b/pages_order/static/sharing/unlock-article.png differ
diff --git a/pages_order/static/sharing/unlock-group.png b/pages_order/static/sharing/unlock-group.png
new file mode 100644
index 0000000..178a88f
Binary files /dev/null and b/pages_order/static/sharing/unlock-group.png differ
diff --git a/pages_order/static/sharing/add-user.png b/pages_order/static/sharing/unlock-user.png
similarity index 100%
rename from pages_order/static/sharing/add-user.png
rename to pages_order/static/sharing/unlock-user.png
diff --git a/pages_order/static/sharing/unlock-video.png b/pages_order/static/sharing/unlock-video.png
new file mode 100644
index 0000000..0bd85c0
Binary files /dev/null and b/pages_order/static/sharing/unlock-video.png differ
diff --git a/pages_order/static/temp-video-2.mp4 b/pages_order/static/temp-video-2.mp4
deleted file mode 100644
index 8fdb490..0000000
Binary files a/pages_order/static/temp-video-2.mp4 and /dev/null differ
diff --git a/pages_order/static/temp-video.mp4 b/pages_order/static/temp-video.mp4
deleted file mode 100644
index 542fddd..0000000
Binary files a/pages_order/static/temp-video.mp4 and /dev/null differ
diff --git a/uni.scss b/uni.scss
index 0c6593f..6d44c21 100644
--- a/uni.scss
+++ b/uni.scss
@@ -96,4 +96,6 @@ $uni-font-size-paragraph:15px;
 	color: $uni-color;
 	text-align: center;
 	font-size: 28rpx;
-}
\ No newline at end of file
+}
+
+$navbar-height: 100rpx;