ynkszx-applet-study-player 1.0.0

package/src/components/jjb-player/video-comp/video-comp.js

@@ -0,0 +1,250 @@
+// plugin/components/jjb-player/video/video-comp.js
+import { handlePlayer } from "../../../api/player";
+import { oss } from "../../../utils/oss/index";
+/**
+ * @name 视频播放
+ * @param {number} isPlay 是否播放
+ */
+const defaultD = {
+  isPlay: false,
+  isEnd: false,
+  fullScreen: false,
+  saveFull: false,
+  currentTime: 0,
+  countHours: 0, // 已保存的进度
+  isValidate: 1, // 是否需要验证 0: 否, 1: 是
+  detail: {},
+};
+Component({
+  behaviors: ["wx://component-export"],
+  export() {
+    return {
+      start: this.handlePlayer.bind(this),
+    };
+  },
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    videoSty: {
+      type: String,
+      value: "width: 100%; height: 420rpx", // video样式,
+    },
+    code: {
+      type: String,
+      value: "",
+    },
+    poster: {
+      type: String,
+      value: "", // 封面地址,
+    },
+    url: {
+      type: String,
+      value: "", // 视频地址
+    },
+    title: {
+      type: String,
+      value: "",
+    },
+    duration: {
+      type: Number,
+      value: 0,
+    },
+  },
+
+  observers: {
+    code: function (code, poster, duration) {
+      this.setData({ ...defaultD });
+      this.onStop();
+    },
+    url: function (value) {
+      this.setData({ ...defaultD });
+    },
+  },
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    ico: {
+      play: oss("play", "sdk/player"),
+      pause: oss("pause", "sdk/player"),
+      full: oss("full", "sdk/player"),
+      exitfull: oss("exitfull", "sdk/player"),
+    },
+    isInit: false,
+    show: false,
+    safeArea: 0,
+    ...defaultD,
+  },
+  /**
+   * 组件的生命周期
+   */
+  lifetimes: {
+    ready() {
+      this.ctx = wx.createVideoContext("jjb-player", this);
+      const { screenHeight, safeArea } = wx.getWindowInfo();
+      this.setData({ safeArea: screenHeight - safeArea.bottom + 4 });
+    },
+  },
+  pageLifetimes: {
+    hide() {
+      const { isPlay } = this.data;
+      if (isPlay) this.onPause(false);
+    },
+  },
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    handlePlayer(detail) {
+      // const { duration } = this.data
+      // const isEnd = detail.progress >= duration
+      this.setData(
+        {
+          detail,
+          isPlay: false,
+          currentTime: detail.progress,
+          countHours: detail.progress,
+          // isEnd,
+          // isValidate: isEnd ? 2 : isValidate
+        },
+        async () => {
+          await this.onOpt(0);
+          this.onOpt(3);
+        }
+      );
+    },
+    async onOpt(type = 0) {
+      const { currentTime, detail } = this.data;
+      const { studyInfoId, sdkId } = detail;
+
+      if (!sdkId) return;
+      try {
+        const countHours = currentTime;
+        const data = await handlePlayer(
+          { countHours, studyInfoId, sdkId },
+          type
+        );
+        const conf = [
+          () => this.onStart(countHours), // 播放
+          () => this.onPause(false), // 暂停
+          () => {
+            this.triggerEvent("end");
+            wx.showToast({
+              title: "该视频学习完成",
+              icon: "success",
+              duration: 2000,
+            });
+          }, // 停止
+          () => {
+            // 保存进度
+            if (countHours > this.data.countHours) this.setData({ countHours });
+            this.onAuth(data);
+          },
+        ];
+        conf[type] && conf[type]();
+      } catch (msg) {
+        this.triggerEvent("error", { msg });
+        this.onStop();
+      }
+    },
+    // 播放
+    onPlay() {
+      this.setData({ isInit: true, show: true, isPlay: true });
+      const { isValidate } = this.data;
+      if (isValidate === 1) this.onPause(false);
+    },
+    // 暂停
+    onPause(_fetch = true) {
+      this.ctx.pause();
+      this.setData({ isPlay: false });
+      const { isValidate } = this.data;
+      if (isValidate !== 2 && _fetch) this.onOpt(1);
+    },
+    // 播放/暂停
+    togglePlay() {
+      const { isPlay, isValidate } = this.data;
+      if (isPlay) this.onPause();
+      else if (isValidate !== 2) this.onOpt(0);
+      else {
+        this.ctx.play();
+        this.setData({ isPlay: true });
+      }
+    },
+    // 观看结束
+    onEnd() {
+      this.setData({ isPlay: false });
+      const { isValidate } = this.data;
+      if (isValidate !== 2) this.onOpt(2);
+    },
+    // 保存实时进度
+    onTimeUpdate({ detail }) {
+      const _time = detail.currentTime;
+      const time = Math.floor(_time);
+      const { currentTime, isValidate } = this.data;
+      if (time === currentTime) return;
+      this.setData({ currentTime: time });
+      // 30S保存一次学习进度
+      if (_time && time % 30 === 0 && isValidate !== 2) {
+        this.onOpt(3);
+      }
+    },
+    // 控制进度
+    onProgress({ detail }) {
+      const { countHours, currentTime } = this.data;
+      const _currentTime =
+        detail.value <= countHours
+          ? detail.value
+          : countHours > currentTime
+          ? countHours
+          : currentTime;
+
+      this.setData({ currentTime: _currentTime });
+      this.ctx.seek(_currentTime);
+    },
+    onFullScreen({ detail }) {
+      this.setData({ fullScreen: detail.fullScreen });
+    },
+    // 全屏/退出全屏
+    toggleFull() {
+      const { fullScreen } = this.data;
+      fullScreen ? this.ctx.exitFullScreen() : this.ctx.requestFullScreen();
+      this.setData({ fullScreen: !fullScreen });
+    },
+    // 验证完成后播放
+    onStart(countHours) {
+      this.setData({ isValidate: 0, isInit: true, isPlay: true });
+      const { saveFull } = this.data;
+      if (saveFull) {
+        this.setData({ fullScreen: true });
+        this.ctx.requestFullScreen();
+      }
+      this.ctx.seek(countHours);
+      this.ctx.play();
+    },
+    // 保存实时进度后判断是否需要验证
+    onAuth(data) {
+      this.setData({ isValidate: data?.isValidate });
+      if (data?.isValidate !== 1) return;
+      this.onPause(false);
+      const { fullScreen, countHours } = this.data;
+      this.setData({ saveFull: fullScreen });
+      fullScreen && this.ctx.exitFullScreen();
+      this.triggerEvent("auth", { ...data, progress: countHours });
+    },
+    // 是否显示底部控制组件
+    toggleShow({ detail }) {
+      const { isInit } = this.data;
+      if (isInit) this.setData({ show: detail.show });
+    },
+    onStop() {
+      this.ctx?.stop();
+      this.setData({ isPlay: false });
+    },
+    // 视频播放出错
+    onError() {
+      this.triggerEvent("error", { msg: "视频播放出错啦，请重试", tag: 1 });
+      this.onStop();
+    },
+  },
+});

package/src/components/jjb-player/video-comp/video-comp.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/src/components/jjb-player/video-comp/video-comp.wxml

@@ -0,0 +1,52 @@
+<!--plugin/components/jjb-player/video/video-comp.wxml-->
+<wxs src="./time.wxs" module="date" />
+<video
+  id="jjb-player"
+  title="{{title}}"
+  style="{{videoSty}}"
+  autoplay="{{false}}"
+  show-progress="{{false}}"
+  show-fullscreen-btn="{{false}}"
+  show-play-btn="{{false}}"
+  enable-progress-gesture="{{false}}"
+  src="{{url}}"
+  poster="{{poster}}"
+  bindplay="onPlay"
+  bindended="onEnd"
+  bindfullscreenchange="onFullScreen"
+  bindtimeupdate="onTimeUpdate"
+  bindcontrolstoggle="toggleShow"
+  binderror="onError"
+>
+  <view
+    wx:if="{{show}}"
+    class="jjb-player-control jjb-flex-center-between jjb-text-white"
+    style="padding-bottom: {{fullscreen ? safeArea : 4}}px"
+  >
+    <view style="padding-left: 16px">
+      <image
+        class="jjb-ico"
+        src="{{isPlay ? ico.pause : ico.play}}"
+        bindtap="togglePlay"
+      />
+    </view>
+    <view class="jjb-player-time">{{date.format(currentTime)}}</view>
+    <slider
+      style="flex: 1; margin-left: 0px; margin-right: 0px"
+      block-size="{{10}}"
+      backgroundColor="#ccc"
+      activeColor="#fff"
+      value="{{currentTime}}"
+      max="{{duration}}"
+      bindchange="onProgress"
+    />
+    <view class="jjb-player-time">{{date.format(duration)}}</view>
+    <view style="padding-right: 16px">
+      <image
+        class="jjb-ico"
+        src="{{fullscreen ? ico.exitfull : ico.full}}"
+        bindtap="toggleFull"
+      />
+    </view>
+  </view>
+</video>

package/src/components/jjb-player/video-comp/video-comp.wxss

@@ -0,0 +1,35 @@
+/* plugin/components/jjb-player/video/video-comp.wxss */
+@import "../../../style/common.wxss";
+#jjb-player {
+  width: 100vw;
+  height: 420rpx;
+  position: relative;
+}
+
+.jjb-player {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0px;
+  top: 0px;
+  font-size: 12px;
+}
+
+.jjb-player-control {
+  width: 100vw;
+  position: absolute;
+  bottom: 0px;
+  left: 0px;
+  padding: 4px 0px;
+  font-size: 12px;
+}
+
+.jjb-player-time {
+  width: 64px;
+  text-align: center;
+}
+
+.jjb-ico {
+  width: 20px;
+  height: 20px;
+}

package/src/components/jjb-verify/verify-idcard/verify-idcard.js

@@ -0,0 +1,47 @@
+// plugin/components/jjb-verify/verify-number/verify-number.js
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    validateId: {
+      type: String,
+      value: '',
+      observer() {
+        this.setData({ value: '' })
+      }
+    },
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    loading: false,
+    value: '',
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    onChange(e) {
+      this.setData({
+        value: e.detail.value
+      })
+    },
+    onConfirm() {
+      const { value } = this.data
+      const _value = value.trim()
+      if (!_value || _value.length !== 4) {
+        wx.showToast({
+          title: '请输入身份证号后四位',
+          icon: 'none',
+          duration: 2e3
+        })
+        return
+      }
+      this.triggerEvent('confirm', _value)
+    }
+  }
+})

package/src/components/jjb-verify/verify-idcard/verify-idcard.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/src/components/jjb-verify/verify-idcard/verify-idcard.wxml

@@ -0,0 +1,3 @@
+<!--plugin/components/jjb-verify/verify-number/verify-number.wxml-->
+<view><input value="{{value}}" type="idcard" bindinput="onChange" maxlength="{{4}}" bindconfirm="onConfirm" class="jjb-input" placeholder="请输入身份证号后四位" /></view>
+<button class="jjb-btn" style="margin-top: 40rpx" bindtap="onConfirm">确认输入</button>

package/src/components/jjb-verify/verify-idcard/verify-idcard.wxss

@@ -0,0 +1,2 @@
+/* plugin/components/jjb-verify/verify-number/verify-number.wxss */
+@import "../../../style/common.wxss";

package/src/components/jjb-verify/verify-move/verify-move.js

@@ -0,0 +1,44 @@
+const defaultData = {
+  x: 0, oldx: 0, isOk: false, size: {}
+}
+
+Component({
+  /*** 组件的属性*/
+  properties: {
+    validateId: {
+      type: String,
+      value: '',
+      observer() {
+        this.setData({ ...defaultData })
+      }
+    },
+  },
+  /*** 组件的初始数据*/
+  data: {...defaultData},
+  ready() {
+     this.initMove()
+  },
+  /*** 组件的方法列表*/
+  methods: {
+    async initMove() {
+      const getSize = (selector) => {
+        return new Promise((resolve) => {
+          let view = wx.createSelectorQuery().in(this).select(selector);
+          view.fields({ size: true, }, (res) => { resolve(res.width); }).exec();
+        });
+      }
+      const [pathway, track] = await Promise.all([getSize('#pathway'), getSize('#track')])
+      return new Promise((resolve) => {
+        this.setData({ size: { pathway, track }}, () => resolve(true))
+      })
+    },
+    onChange(e) { this.setData({ oldx: e.detail.x }) },
+    async onEnd() {
+      if (!this.data.size.pathway || !this.data.size.track) await this.initMove();
+      if (this.data.isOk) { return; }
+      if ((this.data.oldx + 1) > (this.data.size.pathway - this.data.size.track)) {
+        this.setData({ isOk: true }, () => this.triggerEvent('confirm', 'TRUE'));
+      } else { this.setData({ x: 0, oldx: 0 }) } 
+    } 
+  }
+})

package/src/components/jjb-verify/verify-move/verify-move.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/src/components/jjb-verify/verify-move/verify-move.wxml

@@ -0,0 +1,3 @@
+<view class="pathway" bindtouchend="onEnd" id="pathway">
+  <view class="tips"><text wx:if="{{isOk}}" style="color: #FFFFFF;">验证通过</text><text wx:else>向右滑块验证</text></view><view class="track" style="transform:translateX({{oldx}}px)"></view><movable-area><movable-view x="{{x}}"  direction="horizontal" bindchange="onChange"  class="{{isOk ? 'active' : ''}}" id="track"></movable-view></movable-area><view class="disabled" wx:if="{{isOk}}"></view>
+</view>

package/src/components/jjb-verify/verify-move/verify-move.wxss

@@ -0,0 +1,9 @@
+/* plugin/components/jjb-verify/verify-move/verify-move.wxss */
+.pathway {height: 80rpx;width: 100%;background-color: #07C160;position: relative;overflow: hidden;
+}.pathway .tips {position: absolute;top: 0;left: 0;width: 100%;line-height: 80rpx;text-align: center;color: #666;font-size: 32rpx;z-index: 3;
+}.pathway .track {position: absolute;top: 0;left: 0;background-color: #eee;width: 100%;height: 100%;padding-left: 0;box-sizing: content-box;transform: translateX(0);
+}.pathway movable-area {position: absolute;top: 0;left: 0;height: 100%;width: 100%;background: none;z-index: 5;
+}.pathway movable-view {height: 100%;width: 100rpx;box-sizing: border-box;background-color: #fff;border: #ddd solid 1px;background-position: center;background-repeat: no-repeat;background-size: auto 32rpx;background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==");
+}.pathway movable-view.active {border: #07C160 solid 1px;background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDlBRDI3NjVGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDlBRDI3NjRGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDphNWEzMWNhMC1hYmViLTQxNWEtYTEwZS04Y2U5NzRlN2Q4YTEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+k+sHwwAAASZJREFUeNpi/P//PwMyKD8uZw+kUoDYEYgloMIvgHg/EM/ptHx0EFk9I8wAoEZ+IDUPiIMY8IN1QJwENOgj3ACo5gNAbMBAHLgAxA4gQ5igAnNJ0MwAVTsX7IKyY7L2UNuJAf+AmAmJ78AEDTBiwGYg5gbifCSxFCZoaBMCy4A4GOjnH0D6DpK4IxNSVIHAfSDOAeLraJrjgJp/AwPbHMhejiQnwYRmUzNQ4VQgDQqXK0ia/0I17wJiPmQNTNBEAgMlQIWiQA2vgWw7QppBekGxsAjIiEUSBNnsBDWEAY9mEFgMMgBk00E0iZtA7AHEctDQ58MRuA6wlLgGFMoMpIG1QFeGwAIxGZo8GUhIysmwQGSAZgwHaEZhICIzOaBkJkqyM0CAAQDGx279Jf50AAAAAABJRU5ErkJggg==");
+}.pathway .disabled {position: absolute;z-index: 10;height: 100%;width: 100%;top: 0;left: 0;
+}

package/src/components/jjb-verify/verify-number/verify-number.js

@@ -0,0 +1,60 @@
+// plugin/components/jjb-verify/verify-number/verify-number.js
+import { getCaptcha } from '../../../api/auth'
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    validateId: {
+      type: String,
+      value: '',
+      observer(value) {
+        value && this.getCapt()
+      }
+    },
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    loading: false,
+    url: '',
+    value: '',
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    async getCapt() {
+      const { loading } = this.data
+      if (loading) return
+      this.setData({ loading: true, value: '' })
+      try {
+        const { validateId } = this.data
+        const url = await getCaptcha({ validateId })
+        this.setData({ url })
+      } finally {
+        this.setData({ loading: false })
+      }
+    },
+    onChange(e) {
+      this.setData({
+        value: e.detail.value
+      })
+    },
+    onConfirm() {
+      const { value } = this.data
+      if (!value.trim()) {
+        wx.showToast({
+          title: '请输入验证码',
+          icon: 'none',
+          duration: 2e3
+        })
+        return
+      }
+      this.triggerEvent('confirm', value.trim())
+    }
+  }
+})

package/src/components/jjb-verify/verify-number/verify-number.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

package/src/components/jjb-verify/verify-number/verify-number.wxml

@@ -0,0 +1,9 @@
+<!--plugin/components/jjb-verify/verify-number/verify-number.wxml-->
+<view class="jjb-flex-center-between">
+  <view><input value="{{value}}" maxlength="{{6}}" bindinput="onChange" bindconfirm="onConfirm" class="jjb-input" placeholder="请输入验证码" /></view>
+  <image src="{{url}}" style="width: 220rpx; height: 96rpx; margin-left: 20rpx" />
+</view>
+<view class="jjb-flex-center-between" style="justify-content: flex-end">
+  <view bindtap="getCapt" class="jjb-text-size-s jjb-text-grey" style="margin-top: 20rpx">看不清？<text class="jjb-text-primary">换一张</text></view>
+</view>
+<button class="jjb-btn" style="margin-top: 40rpx" bindtap="onConfirm">确认输入</button>

package/src/components/jjb-verify/verify-number/verify-number.wxss

@@ -0,0 +1,2 @@
+/* plugin/components/jjb-verify/verify-number/verify-number.wxss */
+@import "../../../style/common.wxss";

package/src/lib/crypto.js

@@ -0,0 +1,55 @@
+/*
+CryptoJS v3.1.2
+code.google.com/p/crypto-js
+(c) 2009-2013 by Jeff Mott. All rights reserved.
+code.google.com/p/crypto-js/wiki/License
+*/
+var CryptoJS=CryptoJS||function(u,p){var d={},l=d.lib={},s=function(){},t=l.Base={extend:function(a){s.prototype=this;var c=new s;a&&c.mixIn(a);c.hasOwnProperty("init")||(c.init=function(){c.$super.init.apply(this,arguments)});c.init.prototype=c;c.$super=this;return c},create:function(){var a=this.extend();a.init.apply(a,arguments);return a},init:function(){},mixIn:function(a){for(var c in a)a.hasOwnProperty(c)&&(this[c]=a[c]);a.hasOwnProperty("toString")&&(this.toString=a.toString)},clone:function(){return this.init.prototype.extend(this)}},
+r=l.WordArray=t.extend({init:function(a,c){a=this.words=a||[];this.sigBytes=c!=p?c:4*a.length},toString:function(a){return(a||v).stringify(this)},concat:function(a){var c=this.words,e=a.words,j=this.sigBytes;a=a.sigBytes;this.clamp();if(j%4)for(var k=0;k<a;k++)c[j+k>>>2]|=(e[k>>>2]>>>24-8*(k%4)&255)<<24-8*((j+k)%4);else if(65535<e.length)for(k=0;k<a;k+=4)c[j+k>>>2]=e[k>>>2];else c.push.apply(c,e);this.sigBytes+=a;return this},clamp:function(){var a=this.words,c=this.sigBytes;a[c>>>2]&=4294967295<<
+32-8*(c%4);a.length=u.ceil(c/4)},clone:function(){var a=t.clone.call(this);a.words=this.words.slice(0);return a},random:function(a){for(var c=[],e=0;e<a;e+=4)c.push(4294967296*u.random()|0);return new r.init(c,a)}}),w=d.enc={},v=w.Hex={stringify:function(a){var c=a.words;a=a.sigBytes;for(var e=[],j=0;j<a;j++){var k=c[j>>>2]>>>24-8*(j%4)&255;e.push((k>>>4).toString(16));e.push((k&15).toString(16))}return e.join("")},parse:function(a){for(var c=a.length,e=[],j=0;j<c;j+=2)e[j>>>3]|=parseInt(a.substr(j,
+2),16)<<24-4*(j%8);return new r.init(e,c/2)}},b=w.Latin1={stringify:function(a){var c=a.words;a=a.sigBytes;for(var e=[],j=0;j<a;j++)e.push(String.fromCharCode(c[j>>>2]>>>24-8*(j%4)&255));return e.join("")},parse:function(a){for(var c=a.length,e=[],j=0;j<c;j++)e[j>>>2]|=(a.charCodeAt(j)&255)<<24-8*(j%4);return new r.init(e,c)}},x=w.Utf8={stringify:function(a){try{return decodeURIComponent(escape(b.stringify(a)))}catch(c){throw Error("Malformed UTF-8 data");}},parse:function(a){return b.parse(unescape(encodeURIComponent(a)))}},
+q=l.BufferedBlockAlgorithm=t.extend({reset:function(){this._data=new r.init;this._nDataBytes=0},_append:function(a){"string"==typeof a&&(a=x.parse(a));this._data.concat(a);this._nDataBytes+=a.sigBytes},_process:function(a){var c=this._data,e=c.words,j=c.sigBytes,k=this.blockSize,b=j/(4*k),b=a?u.ceil(b):u.max((b|0)-this._minBufferSize,0);a=b*k;j=u.min(4*a,j);if(a){for(var q=0;q<a;q+=k)this._doProcessBlock(e,q);q=e.splice(0,a);c.sigBytes-=j}return new r.init(q,j)},clone:function(){var a=t.clone.call(this);
+a._data=this._data.clone();return a},_minBufferSize:0});l.Hasher=q.extend({cfg:t.extend(),init:function(a){this.cfg=this.cfg.extend(a);this.reset()},reset:function(){q.reset.call(this);this._doReset()},update:function(a){this._append(a);this._process();return this},finalize:function(a){a&&this._append(a);return this._doFinalize()},blockSize:16,_createHelper:function(a){return function(b,e){return(new a.init(e)).finalize(b)}},_createHmacHelper:function(a){return function(b,e){return(new n.HMAC.init(a,
+e)).finalize(b)}}});var n=d.algo={};return d}(Math);
+(function(){var u=CryptoJS,p=u.lib.WordArray;u.enc.Base64={stringify:function(d){var l=d.words,p=d.sigBytes,t=this._map;d.clamp();d=[];for(var r=0;r<p;r+=3)for(var w=(l[r>>>2]>>>24-8*(r%4)&255)<<16|(l[r+1>>>2]>>>24-8*((r+1)%4)&255)<<8|l[r+2>>>2]>>>24-8*((r+2)%4)&255,v=0;4>v&&r+0.75*v<p;v++)d.push(t.charAt(w>>>6*(3-v)&63));if(l=t.charAt(64))for(;d.length%4;)d.push(l);return d.join("")},parse:function(d){var l=d.length,s=this._map,t=s.charAt(64);t&&(t=d.indexOf(t),-1!=t&&(l=t));for(var t=[],r=0,w=0;w<
+l;w++)if(w%4){var v=s.indexOf(d.charAt(w-1))<<2*(w%4),b=s.indexOf(d.charAt(w))>>>6-2*(w%4);t[r>>>2]|=(v|b)<<24-8*(r%4);r++}return p.create(t,r)},_map:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="}})();
+(function(u){function p(b,n,a,c,e,j,k){b=b+(n&a|~n&c)+e+k;return(b<<j|b>>>32-j)+n}function d(b,n,a,c,e,j,k){b=b+(n&c|a&~c)+e+k;return(b<<j|b>>>32-j)+n}function l(b,n,a,c,e,j,k){b=b+(n^a^c)+e+k;return(b<<j|b>>>32-j)+n}function s(b,n,a,c,e,j,k){b=b+(a^(n|~c))+e+k;return(b<<j|b>>>32-j)+n}for(var t=CryptoJS,r=t.lib,w=r.WordArray,v=r.Hasher,r=t.algo,b=[],x=0;64>x;x++)b[x]=4294967296*u.abs(u.sin(x+1))|0;r=r.MD5=v.extend({_doReset:function(){this._hash=new w.init([1732584193,4023233417,2562383102,271733878])},
+_doProcessBlock:function(q,n){for(var a=0;16>a;a++){var c=n+a,e=q[c];q[c]=(e<<8|e>>>24)&16711935|(e<<24|e>>>8)&4278255360}var a=this._hash.words,c=q[n+0],e=q[n+1],j=q[n+2],k=q[n+3],z=q[n+4],r=q[n+5],t=q[n+6],w=q[n+7],v=q[n+8],A=q[n+9],B=q[n+10],C=q[n+11],u=q[n+12],D=q[n+13],E=q[n+14],x=q[n+15],f=a[0],m=a[1],g=a[2],h=a[3],f=p(f,m,g,h,c,7,b[0]),h=p(h,f,m,g,e,12,b[1]),g=p(g,h,f,m,j,17,b[2]),m=p(m,g,h,f,k,22,b[3]),f=p(f,m,g,h,z,7,b[4]),h=p(h,f,m,g,r,12,b[5]),g=p(g,h,f,m,t,17,b[6]),m=p(m,g,h,f,w,22,b[7]),
+f=p(f,m,g,h,v,7,b[8]),h=p(h,f,m,g,A,12,b[9]),g=p(g,h,f,m,B,17,b[10]),m=p(m,g,h,f,C,22,b[11]),f=p(f,m,g,h,u,7,b[12]),h=p(h,f,m,g,D,12,b[13]),g=p(g,h,f,m,E,17,b[14]),m=p(m,g,h,f,x,22,b[15]),f=d(f,m,g,h,e,5,b[16]),h=d(h,f,m,g,t,9,b[17]),g=d(g,h,f,m,C,14,b[18]),m=d(m,g,h,f,c,20,b[19]),f=d(f,m,g,h,r,5,b[20]),h=d(h,f,m,g,B,9,b[21]),g=d(g,h,f,m,x,14,b[22]),m=d(m,g,h,f,z,20,b[23]),f=d(f,m,g,h,A,5,b[24]),h=d(h,f,m,g,E,9,b[25]),g=d(g,h,f,m,k,14,b[26]),m=d(m,g,h,f,v,20,b[27]),f=d(f,m,g,h,D,5,b[28]),h=d(h,f,
+m,g,j,9,b[29]),g=d(g,h,f,m,w,14,b[30]),m=d(m,g,h,f,u,20,b[31]),f=l(f,m,g,h,r,4,b[32]),h=l(h,f,m,g,v,11,b[33]),g=l(g,h,f,m,C,16,b[34]),m=l(m,g,h,f,E,23,b[35]),f=l(f,m,g,h,e,4,b[36]),h=l(h,f,m,g,z,11,b[37]),g=l(g,h,f,m,w,16,b[38]),m=l(m,g,h,f,B,23,b[39]),f=l(f,m,g,h,D,4,b[40]),h=l(h,f,m,g,c,11,b[41]),g=l(g,h,f,m,k,16,b[42]),m=l(m,g,h,f,t,23,b[43]),f=l(f,m,g,h,A,4,b[44]),h=l(h,f,m,g,u,11,b[45]),g=l(g,h,f,m,x,16,b[46]),m=l(m,g,h,f,j,23,b[47]),f=s(f,m,g,h,c,6,b[48]),h=s(h,f,m,g,w,10,b[49]),g=s(g,h,f,m,
+E,15,b[50]),m=s(m,g,h,f,r,21,b[51]),f=s(f,m,g,h,u,6,b[52]),h=s(h,f,m,g,k,10,b[53]),g=s(g,h,f,m,B,15,b[54]),m=s(m,g,h,f,e,21,b[55]),f=s(f,m,g,h,v,6,b[56]),h=s(h,f,m,g,x,10,b[57]),g=s(g,h,f,m,t,15,b[58]),m=s(m,g,h,f,D,21,b[59]),f=s(f,m,g,h,z,6,b[60]),h=s(h,f,m,g,C,10,b[61]),g=s(g,h,f,m,j,15,b[62]),m=s(m,g,h,f,A,21,b[63]);a[0]=a[0]+f|0;a[1]=a[1]+m|0;a[2]=a[2]+g|0;a[3]=a[3]+h|0},_doFinalize:function(){var b=this._data,n=b.words,a=8*this._nDataBytes,c=8*b.sigBytes;n[c>>>5]|=128<<24-c%32;var e=u.floor(a/
+4294967296);n[(c+64>>>9<<4)+15]=(e<<8|e>>>24)&16711935|(e<<24|e>>>8)&4278255360;n[(c+64>>>9<<4)+14]=(a<<8|a>>>24)&16711935|(a<<24|a>>>8)&4278255360;b.sigBytes=4*(n.length+1);this._process();b=this._hash;n=b.words;for(a=0;4>a;a++)c=n[a],n[a]=(c<<8|c>>>24)&16711935|(c<<24|c>>>8)&4278255360;return b},clone:function(){var b=v.clone.call(this);b._hash=this._hash.clone();return b}});t.MD5=v._createHelper(r);t.HmacMD5=v._createHmacHelper(r)})(Math);
+(function(){var u=CryptoJS,p=u.lib,d=p.Base,l=p.WordArray,p=u.algo,s=p.EvpKDF=d.extend({cfg:d.extend({keySize:4,hasher:p.MD5,iterations:1}),init:function(d){this.cfg=this.cfg.extend(d)},compute:function(d,r){for(var p=this.cfg,s=p.hasher.create(),b=l.create(),u=b.words,q=p.keySize,p=p.iterations;u.length<q;){n&&s.update(n);var n=s.update(d).finalize(r);s.reset();for(var a=1;a<p;a++)n=s.finalize(n),s.reset();b.concat(n)}b.sigBytes=4*q;return b}});u.EvpKDF=function(d,l,p){return s.create(p).compute(d,
+l)}})();
+CryptoJS.lib.Cipher||function(u){var p=CryptoJS,d=p.lib,l=d.Base,s=d.WordArray,t=d.BufferedBlockAlgorithm,r=p.enc.Base64,w=p.algo.EvpKDF,v=d.Cipher=t.extend({cfg:l.extend(),createEncryptor:function(e,a){return this.create(this._ENC_XFORM_MODE,e,a)},createDecryptor:function(e,a){return this.create(this._DEC_XFORM_MODE,e,a)},init:function(e,a,b){this.cfg=this.cfg.extend(b);this._xformMode=e;this._key=a;this.reset()},reset:function(){t.reset.call(this);this._doReset()},process:function(e){this._append(e);return this._process()},
+finalize:function(e){e&&this._append(e);return this._doFinalize()},keySize:4,ivSize:4,_ENC_XFORM_MODE:1,_DEC_XFORM_MODE:2,_createHelper:function(e){return{encrypt:function(b,k,d){return("string"==typeof k?c:a).encrypt(e,b,k,d)},decrypt:function(b,k,d){return("string"==typeof k?c:a).decrypt(e,b,k,d)}}}});d.StreamCipher=v.extend({_doFinalize:function(){return this._process(!0)},blockSize:1});var b=p.mode={},x=function(e,a,b){var c=this._iv;c?this._iv=u:c=this._prevBlock;for(var d=0;d<b;d++)e[a+d]^=
+c[d]},q=(d.BlockCipherMode=l.extend({createEncryptor:function(e,a){return this.Encryptor.create(e,a)},createDecryptor:function(e,a){return this.Decryptor.create(e,a)},init:function(e,a){this._cipher=e;this._iv=a}})).extend();q.Encryptor=q.extend({processBlock:function(e,a){var b=this._cipher,c=b.blockSize;x.call(this,e,a,c);b.encryptBlock(e,a);this._prevBlock=e.slice(a,a+c)}});q.Decryptor=q.extend({processBlock:function(e,a){var b=this._cipher,c=b.blockSize,d=e.slice(a,a+c);b.decryptBlock(e,a);x.call(this,
+e,a,c);this._prevBlock=d}});b=b.CBC=q;q=(p.pad={}).Pkcs7={pad:function(a,b){for(var c=4*b,c=c-a.sigBytes%c,d=c<<24|c<<16|c<<8|c,l=[],n=0;n<c;n+=4)l.push(d);c=s.create(l,c);a.concat(c)},unpad:function(a){a.sigBytes-=a.words[a.sigBytes-1>>>2]&255}};d.BlockCipher=v.extend({cfg:v.cfg.extend({mode:b,padding:q}),reset:function(){v.reset.call(this);var a=this.cfg,b=a.iv,a=a.mode;if(this._xformMode==this._ENC_XFORM_MODE)var c=a.createEncryptor;else c=a.createDecryptor,this._minBufferSize=1;this._mode=c.call(a,
+this,b&&b.words)},_doProcessBlock:function(a,b){this._mode.processBlock(a,b)},_doFinalize:function(){var a=this.cfg.padding;if(this._xformMode==this._ENC_XFORM_MODE){a.pad(this._data,this.blockSize);var b=this._process(!0)}else b=this._process(!0),a.unpad(b);return b},blockSize:4});var n=d.CipherParams=l.extend({init:function(a){this.mixIn(a)},toString:function(a){return(a||this.formatter).stringify(this)}}),b=(p.format={}).OpenSSL={stringify:function(a){var b=a.ciphertext;a=a.salt;return(a?s.create([1398893684,
+1701076831]).concat(a).concat(b):b).toString(r)},parse:function(a){a=r.parse(a);var b=a.words;if(1398893684==b[0]&&1701076831==b[1]){var c=s.create(b.slice(2,4));b.splice(0,4);a.sigBytes-=16}return n.create({ciphertext:a,salt:c})}},a=d.SerializableCipher=l.extend({cfg:l.extend({format:b}),encrypt:function(a,b,c,d){d=this.cfg.extend(d);var l=a.createEncryptor(c,d);b=l.finalize(b);l=l.cfg;return n.create({ciphertext:b,key:c,iv:l.iv,algorithm:a,mode:l.mode,padding:l.padding,blockSize:a.blockSize,formatter:d.format})},
+decrypt:function(a,b,c,d){d=this.cfg.extend(d);b=this._parse(b,d.format);return a.createDecryptor(c,d).finalize(b.ciphertext)},_parse:function(a,b){return"string"==typeof a?b.parse(a,this):a}}),p=(p.kdf={}).OpenSSL={execute:function(a,b,c,d){d||(d=s.random(8));a=w.create({keySize:b+c}).compute(a,d);c=s.create(a.words.slice(b),4*c);a.sigBytes=4*b;return n.create({key:a,iv:c,salt:d})}},c=d.PasswordBasedCipher=a.extend({cfg:a.cfg.extend({kdf:p}),encrypt:function(b,c,d,l){l=this.cfg.extend(l);d=l.kdf.execute(d,
+b.keySize,b.ivSize);l.iv=d.iv;b=a.encrypt.call(this,b,c,d.key,l);b.mixIn(d);return b},decrypt:function(b,c,d,l){l=this.cfg.extend(l);c=this._parse(c,l.format);d=l.kdf.execute(d,b.keySize,b.ivSize,c.salt);l.iv=d.iv;return a.decrypt.call(this,b,c,d.key,l)}})}();
+(function(){for(var u=CryptoJS,p=u.lib.BlockCipher,d=u.algo,l=[],s=[],t=[],r=[],w=[],v=[],b=[],x=[],q=[],n=[],a=[],c=0;256>c;c++)a[c]=128>c?c<<1:c<<1^283;for(var e=0,j=0,c=0;256>c;c++){var k=j^j<<1^j<<2^j<<3^j<<4,k=k>>>8^k&255^99;l[e]=k;s[k]=e;var z=a[e],F=a[z],G=a[F],y=257*a[k]^16843008*k;t[e]=y<<24|y>>>8;r[e]=y<<16|y>>>16;w[e]=y<<8|y>>>24;v[e]=y;y=16843009*G^65537*F^257*z^16843008*e;b[k]=y<<24|y>>>8;x[k]=y<<16|y>>>16;q[k]=y<<8|y>>>24;n[k]=y;e?(e=z^a[a[a[G^z]]],j^=a[a[j]]):e=j=1}var H=[0,1,2,4,8,
+16,32,64,128,27,54],d=d.AES=p.extend({_doReset:function(){for(var a=this._key,c=a.words,d=a.sigBytes/4,a=4*((this._nRounds=d+6)+1),e=this._keySchedule=[],j=0;j<a;j++)if(j<d)e[j]=c[j];else{var k=e[j-1];j%d?6<d&&4==j%d&&(k=l[k>>>24]<<24|l[k>>>16&255]<<16|l[k>>>8&255]<<8|l[k&255]):(k=k<<8|k>>>24,k=l[k>>>24]<<24|l[k>>>16&255]<<16|l[k>>>8&255]<<8|l[k&255],k^=H[j/d|0]<<24);e[j]=e[j-d]^k}c=this._invKeySchedule=[];for(d=0;d<a;d++)j=a-d,k=d%4?e[j]:e[j-4],c[d]=4>d||4>=j?k:b[l[k>>>24]]^x[l[k>>>16&255]]^q[l[k>>>
+8&255]]^n[l[k&255]]},encryptBlock:function(a,b){this._doCryptBlock(a,b,this._keySchedule,t,r,w,v,l)},decryptBlock:function(a,c){var d=a[c+1];a[c+1]=a[c+3];a[c+3]=d;this._doCryptBlock(a,c,this._invKeySchedule,b,x,q,n,s);d=a[c+1];a[c+1]=a[c+3];a[c+3]=d},_doCryptBlock:function(a,b,c,d,e,j,l,f){for(var m=this._nRounds,g=a[b]^c[0],h=a[b+1]^c[1],k=a[b+2]^c[2],n=a[b+3]^c[3],p=4,r=1;r<m;r++)var q=d[g>>>24]^e[h>>>16&255]^j[k>>>8&255]^l[n&255]^c[p++],s=d[h>>>24]^e[k>>>16&255]^j[n>>>8&255]^l[g&255]^c[p++],t=
+d[k>>>24]^e[n>>>16&255]^j[g>>>8&255]^l[h&255]^c[p++],n=d[n>>>24]^e[g>>>16&255]^j[h>>>8&255]^l[k&255]^c[p++],g=q,h=s,k=t;q=(f[g>>>24]<<24|f[h>>>16&255]<<16|f[k>>>8&255]<<8|f[n&255])^c[p++];s=(f[h>>>24]<<24|f[k>>>16&255]<<16|f[n>>>8&255]<<8|f[g&255])^c[p++];t=(f[k>>>24]<<24|f[n>>>16&255]<<16|f[g>>>8&255]<<8|f[h&255])^c[p++];n=(f[n>>>24]<<24|f[g>>>16&255]<<16|f[h>>>8&255]<<8|f[k&255])^c[p++];a[b]=q;a[b+1]=s;a[b+2]=t;a[b+3]=n},keySize:8});u.AES=p._createHelper(d)})();
+CryptoJS.mode.ECB = (function () {
+  var ECB = CryptoJS.lib.BlockCipherMode.extend();
+
+  ECB.Encryptor = ECB.extend({
+    processBlock: function (words, offset) {
+      this._cipher.encryptBlock(words, offset);
+    }
+  });
+
+  ECB.Decryptor = ECB.extend({
+    processBlock: function (words, offset) {
+      this._cipher.decryptBlock(words, offset);
+    }
+  });
+
+  return ECB;
+}());
+module.exports = {
+  CryptoJS: CryptoJS
+}