初始化代码

front/mine/components/xt-verify-code.js

@@ -0,0 +1,10 @@
+(global["webpackJsonp"]=global["webpackJsonp"]||[]).push([["mine/components/xt-verify-code"],{"1d16":function(t,e,i){"use strict";i.d(e,"b",(function(){return n})),i.d(e,"c",(function(){return r})),i.d(e,"a",(function(){}));var n=function(){var t=this,e=t.$createElement,i=(t._self._c,t.cursorVisible&&"middle"!==t.type?t.code.length:null),n=t.__map(t.itemSize,(function(e,i){var n=t.__get_orig(e),r=t.code.length===i&&t.cursorVisible,o=t._f("codeFormat")(t.code[i],t.isPassword);return{$orig:n,g1:r,f0:o}}));t.$mp.data=Object.assign({},{$root:{g0:i,l0:n}})},r=[]},"292a":function(t,e,i){},"665e":function(t,e,i){"use strict";i.r(e);var n=i("83f5"),r=i.n(n);for(var o in n)["default"].indexOf(o)<0&&function(t){i.d(e,t,(function(){return n[t]}))}(o);e["default"]=r.a},"83f5":function(t,e,i){"use strict";(function(t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0;var i={name:"xt-verify-code",props:{value:{type:String,default:function(){return""}},type:{type:String,default:function(){return"box"}},inputType:{type:String,default:function(){return"number"}},size:{type:Number,default:function(){return 6}},isFocus:{type:Boolean,default:function(){return!0}},isPassword:{type:Boolean,default:function(){return!1}},cursorColor:{type:String,default:function(){return"#cccccc"}},boxNormalColor:{type:String,default:function(){return"#f7f7f7"}},boxActiveColor:{type:String,default:function(){return"#39b54a"}}},model:{prop:"value",event:"input"},data:function(){return{cursorVisible:!1,cursorHeight:35,code:"",codeCursorLeft:[],itemSize:6}},created:function(){this.cursorVisible=this.isFocus,this.validatorSize()},mounted:function(){this.init()},methods:{validatorSize:function(){this.size<=6&&this.size>0?this.itemSize=Math.floor(this.size):this.itemSize=6},init:function(){this.getCodeCursorLeft(),this.setCursorHeight()},getElement:function(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"single",n=arguments.length>2?arguments[2]:void 0;t.createSelectorQuery().in(this)["array"===i?"selectAll":"select"](e).boundingClientRect().exec((function(t){n(t[0])}))},setCursorHeight:function(){var t=this;this.getElement(".xt__box","single",(function(e){t.cursorHeight=.6*e.height}))},getCodeCursorLeft:function(){var t=this;this.getElement("#xt__input-ground","single",(function(e){var i=e.left;t.getElement(".xt__box","array",(function(e){t.codeCursorLeft=[],e.forEach((function(e){t.codeCursorLeft.push(e.left-i+e.width/2)}))}))}))},input:function(t){var e=t.detail.value;this.cursorVisible=e.length!==this.itemSize,this.$emit("input",e),this.inputSuccess(e)},inputSuccess:function(t){t.length===this.itemSize&&this.$emit("confirm",t)},inputFocus:function(){this.cursorVisible=this.code.length!==this.itemSize},inputBlur:function(){this.cursorVisible=!1}},watch:{value:function(t){this.code=t}},filters:{codeFormat:function(t,e){var i="";return t&&(i=e?"*":t),i}}};e.default=i}).call(this,i("543d")["default"])},b3a2:function(t,e,i){"use strict";var n=i("292a"),r=i.n(n);r.a},ffa1:function(t,e,i){"use strict";i.r(e);var n=i("1d16"),r=i("665e");for(var o in r)["default"].indexOf(o)<0&&function(t){i.d(e,t,(function(){return r[t]}))}(o);i("b3a2");var u=i("f0c5"),c=Object(u["a"])(r["default"],n["b"],n["c"],!1,null,"600e40b6",null,!1,n["a"],void 0);e["default"]=c.exports}}]);
+;(global["webpackJsonp"] = global["webpackJsonp"] || []).push([
+    'mine/components/xt-verify-code-create-component',
+    {
+        'mine/components/xt-verify-code-create-component':(function(module, exports, __webpack_require__){
+            __webpack_require__('543d')['createComponent'](__webpack_require__("ffa1"))
+        })
+    },
+    [['mine/components/xt-verify-code-create-component']]
+]);

front/mine/components/xt-verify-code.json

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

front/mine/components/xt-verify-code.wxml

@@ -0,0 +1 @@
+<view class="xt__verify-code data-v-600e40b6"><input class="xt__input data-v-600e40b6" id="xt__input" focus="{{isFocus}}" password="{{isPassword}}" type="{{inputType}}" maxlength="{{itemSize}}" data-event-opts="{{[['input',[['input',['$event']]]],['focus',[['inputFocus',['$event']]]],['blur',[['inputBlur',['$event']]]]]}}" value="{{code}}" bindinput="__e" bindfocus="__e" bindblur="__e"/><block wx:if="{{cursorVisible&&type!=='middle'}}"><view class="xt__cursor data-v-600e40b6" style="{{'left:'+(codeCursorLeft[$root.g0]+'px')+';'+('height:'+(cursorHeight+'px')+';')+('background-color:'+(cursorColor)+';')}}" id="xt__cursor"></view></block><view class="xt__input-ground data-v-600e40b6" id="xt__input-ground"><block wx:for="{{$root.l0}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="{{['data-v-600e40b6','xt__box','xt__box-'+(type+''),'xt__box::after']}}" style="{{'border-color:'+(item.g1?boxActiveColor:boxNormalColor)+';'}}"><block wx:if="{{type==='middle'&&!code[index]}}"><view class="xt__middle-line data-v-600e40b6" style="{{'border-color:'+(boxActiveColor)+';'}}"></view></block><text class="xt__code-text data-v-600e40b6">{{item.f0}}</text></view></block></view></view>

front/mine/components/xt-verify-code.wxss

@@ -0,0 +1 @@
+.xt__verify-code.data-v-600e40b6{position:relative;width:100%;box-sizing:border-box}.xt__verify-code .xt__input.data-v-600e40b6{height:100%;width:200%;position:absolute;left:-100%;z-index:1}.xt__verify-code .xt__cursor.data-v-600e40b6{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);display:inline-block;width:2px;-webkit-animation-name:cursor-data-v-600e40b6;animation-name:cursor-data-v-600e40b6;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.xt__verify-code .xt__input-ground.data-v-600e40b6{display:flex;justify-content:space-between;align-items:center;width:100%;box-sizing:border-box}.xt__verify-code .xt__input-ground .xt__box.data-v-600e40b6{position:relative;display:inline-block;width:88rpx;height:100rpx;background:#f7f7f7;border-radius:12rpx;margin-left:20rpx}.xt__verify-code .xt__input-ground .xt__box-bottom.data-v-600e40b6{border-bottom:1rpx solid #39b54a}.xt__verify-code .xt__input-ground .xt__box-box.data-v-600e40b6{border:1rpx solid #39b54a}.xt__verify-code .xt__input-ground .xt__box-middle.data-v-600e40b6{border:none}.xt__verify-code .xt__input-ground .xt__box .xt__middle-line.data-v-600e40b6{position:absolute;top:50%;left:50%;width:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-bottom-width:2px;border-bottom-style:solid}.xt__verify-code .xt__input-ground .xt__box .xt__code-text.data-v-600e40b6{position:absolute;top:50%;left:50%;font-size:58rpx;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.xt__verify-code .xt__input-ground .xt__box.data-v-600e40b6:nth-child(1){margin-left:0}@-webkit-keyframes cursor-data-v-600e40b6{0%{opacity:1}100%{opacity:0}}@keyframes cursor-data-v-600e40b6{0%{opacity:1}100%{opacity:0}}