diff --git a/.github/workflows/npm-publish.yml b/.github/workflows/npm-publish.yml index 632866ef..71b6b9f7 100644 --- a/.github/workflows/npm-publish.yml +++ b/.github/workflows/npm-publish.yml @@ -1,5 +1,3 @@ -# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created -# For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages # 在创建 release 后自动发布 npm 包 @@ -36,17 +34,3 @@ jobs: - run: npm publish env: NODE_AUTH_TOKEN: ${{secrets.npm_token}} - - publish-gpr: - name: 发布到 github pkg - needs: build - runs-on: ubuntu-latest - steps: - - uses: actions/checkout@v2 - - uses: actions/setup-node@v1 - with: - node-version: 12 - registry-url: https://npm.pkg.github.com/ - - run: npm publish - env: - NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}} diff --git a/README.md b/README.md index 897a69ea..b7cd8d37 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@

+ class="QR-img" src="https://doc.mini.talelin.com/screenshots/readme/lin-ui小程序.jpg">

@@ -41,11 +41,11 @@ Lin UI 是基于 **微信小程序原生语法** 实现的组件库。遵循简 - +

QQ群号:643205479

- +

微信公众号:林间有风

@@ -58,7 +58,7 @@ Lin UI 是基于 **微信小程序原生语法** 实现的组件库。遵循简 - 风袖 + 风袖

风袖

diff --git a/dist/button/index.wxss b/dist/button/index.wxss index 2597fc32..21cfe7df 100644 --- a/dist/button/index.wxss +++ b/dist/button/index.wxss @@ -1 +1 @@ -.btn-hover::before{opacity:.15;position:absolute;top:50%;left:50%;width:100%;height:100%;border:inherit;border-radius:inherit;transform:translate(-50%,-50%);content:' ';background-color:#333;border-color:#333}.special-container{display:flex}.l-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;font-size:28rpx;position:relative;color:#fff;padding:0 12rpx;box-sizing:border-box}.l-btn-img-mini{width:30rpx;height:30rpx}.l-btn-img-medium{width:36rpx;height:36rpx}.l-btn-img-large{height:44rpx;width:44rpx}.l-btn-long{border-radius:0;margin:0;height:88rpx;width:100%}.l-btn-medium{height:72rpx;min-width:180rpx}.l-btn-large{height:88rpx;min-width:710rpx}.l-btn-mini{height:60rpx;min-width:140rpx;font-size:24rpx}.l-btn-default{background-color:#3963bc}.l-btn-success{background-color:#34bfa3}.l-btn-warning{background-color:#ffe57f;color:#333}.l-btn-error{background-color:#f4516c}.l-btn-square{border-radius:0}.l-btn-semicircle{border-radius:40rpx}.l-btn-large.l-btn-semicircle{border-radius:48rpx}.l-btn-mini.l-btn-semicircle{border-radius:30rpx}.l-btn-circle{border-radius:8rpx}.l-btn-large.l-btn-circle{border-radius:9.6rpx}.l-btn-mini.l-btn-circle{border-radius:6rpx}.l-btn-plain{background-color:#fff;color:#3963bc;border:2rpx solid #3963bc}.l-btn-success.l-btn-plain{background-color:#fff;color:#34bfa3;border:2rpx solid #34bfa3}.l-btn-error.l-btn-plain{background-color:#fff;color:#f4516c;border:2rpx solid #f4516c}.l-btn-warning.l-btn-plain{background-color:#fff;color:#ffe57f;border:2rpx solid #ffe57f}.l-btn-loading{opacity:.6;display:inline-block;vertical-align:middle;width:24rpx;height:24rpx;background:0 0;border-radius:50%;border:4rpx solid #fff;border-color:#fff #fff #fff transparent;animation:btn-spin .6s linear;animation-iteration-count:infinite}.l-btn-loading-default{border:4rpx solid #3963bc;border-color:#3963bc #3963bc #3963bc transparent}.l-btn-loading-success{border:4rpx solid #34bfa3;border-color:#34bfa3 #34bfa3 #34bfa3 transparent}.l-btn-loading-error{border:4rpx solid #f4516c;border-color:#f4516c #f4516c #f4516c transparent}.l-btn-loading-warning{border:4rpx solid #ffe57f;border-color:#ffe57f #ffe57f #ffe57f transparent}.l-btn-disabled{opacity:.8}.icon{display:flex!important}.margin-mini{margin-right:10rpx}.margin-medium{margin-right:18rpx}.margin-large{margin-right:24rpx}@keyframes btn-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}} \ No newline at end of file +.btn-hover::before{opacity:.15;position:absolute;top:50%;left:50%;width:100%;height:100%;border:inherit;border-radius:inherit;transform:translate(-50%,-50%);content:' ';background-color:#333;border-color:#333}.special-container{display:flex}.l-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;font-size:28rpx;position:relative;color:#fff;padding:0 12rpx;box-sizing:border-box}.l-btn-img-mini{width:30rpx;height:30rpx}.l-btn-img-medium{width:36rpx;height:36rpx}.l-btn-img-large{height:44rpx;width:44rpx}.l-btn-long{border-radius:0;height:88rpx;width:100%}.l-btn-medium{height:72rpx;min-width:180rpx}.l-btn-large{height:88rpx;min-width:710rpx}.l-btn-mini{height:60rpx;min-width:140rpx;font-size:24rpx}.l-btn-default{background-color:#3963bc}.l-btn-success{background-color:#34bfa3}.l-btn-warning{background-color:#ffe57f;color:#333}.l-btn-error{background-color:#f4516c}.l-btn-square{border-radius:0}.l-btn-semicircle{border-radius:40rpx}.l-btn-large.l-btn-semicircle{border-radius:48rpx}.l-btn-mini.l-btn-semicircle{border-radius:30rpx}.l-btn-circle{border-radius:8rpx}.l-btn-large.l-btn-circle{border-radius:9.6rpx}.l-btn-mini.l-btn-circle{border-radius:6rpx}.l-btn-plain{background-color:#fff;color:#3963bc;border:2rpx solid #3963bc}.l-btn-success.l-btn-plain{background-color:#fff;color:#34bfa3;border:2rpx solid #34bfa3}.l-btn-error.l-btn-plain{background-color:#fff;color:#f4516c;border:2rpx solid #f4516c}.l-btn-warning.l-btn-plain{background-color:#fff;color:#ffe57f;border:2rpx solid #ffe57f}.l-btn-loading{opacity:.6;display:inline-block;vertical-align:middle;width:24rpx;height:24rpx;background:0 0;border-radius:50%;border:4rpx solid #fff;border-color:#fff #fff #fff transparent;animation:btn-spin .6s linear;animation-iteration-count:infinite}.l-btn-loading-default{border:4rpx solid #3963bc;border-color:#3963bc #3963bc #3963bc transparent}.l-btn-loading-success{border:4rpx solid #34bfa3;border-color:#34bfa3 #34bfa3 #34bfa3 transparent}.l-btn-loading-error{border:4rpx solid #f4516c;border-color:#f4516c #f4516c #f4516c transparent}.l-btn-loading-warning{border:4rpx solid #ffe57f;border-color:#ffe57f #ffe57f #ffe57f transparent}.l-btn-disabled{opacity:.8}.icon{display:flex!important}.margin-mini{margin-right:10rpx}.margin-medium{margin-right:18rpx}.margin-large{margin-right:24rpx}.margin-long{margin-right:24rpx}@keyframes btn-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}} \ No newline at end of file diff --git a/dist/form/index.js b/dist/form/index.js index 2c029ecb..0ba109a1 100644 --- a/dist/form/index.js +++ b/dist/form/index.js @@ -1 +1 @@ -import eventBus from"../core/utils/event-bus.js";Component({externalClasses:["l-form-container-class","l-form-submit-class","l-form-reset-class","l-form-btn-class"],options:{multipleSlots:!0},relations:{"../form-item/index":{type:"child",linked:function(t){this._initItem(t)},linkChanged:function(){},unlinked:function(){}}},properties:{name:{type:String,value:""},isSubmitValidate:{type:Boolean,value:!0}},attached(){this._init()},detached(){for(let t in this._keys)Object.prototype.hasOwnProperty.call(this._keys,t)&&(eventBus.off("lin-form-blur-"+t),eventBus.off("lin-form-change-"+t))},data:{_this:null},methods:{_init(){wx.lin=wx.lin||{},wx.lin.forms=wx.lin.forms||{},wx.lin.forms[this.properties.name]=this,wx.lin.initValidateForm=t=>{wx.lin._instantiation=t},wx.lin.submitForm=function(t){wx.lin.forms[t].submit()},wx.lin.resetForm=function(t){wx.lin.forms[t].reset()}},_initItem(t){this._keys=this._keys||{},this._errors=this._errors||{};const e=t.properties.name;if(eventBus.on("lin-form-blur-"+e,t=>{this._validateItem(t,"blur")}),eventBus.on("lin-form-change-"+e,t=>{clearTimeout(this.change_time),this.change_time=setTimeout(()=>{this._validateItem(t,"change")},200)}),this._keys[e])throw new Error("表单项存在重复的name:"+e);this._keys[e]="",this._errors[e]=[]},_validateItem(t,e){let i=wx.lin._instantiation,s=this._getValues();const r=this.getRelationNodes("../form-item/index").find(e=>e.properties.name===t);if(!i.selectComponent("#"+t))throw new Error("表单项不存在name:"+t);return r.validatorData(s,e),this._errors[t]=r.data.errors,r.data.errors},_forEachNodes(t,e){let i=this.getRelationNodes("../form-item/index");e&&i.reverse(),i.forEach((e,i)=>{t(e,i)})},_validateForm(){let t=wx.lin._instantiation,e=[],i=this._getValues();return this._forEachNodes(s=>{const r=s.properties.name;if(!t.selectComponent("#"+r))throw new Error("表单项不存在name:"+r);s.validatorData(i),this._errors[r]=s.data.errors,e=e.concat(s.data.errors)},!0),e},_getValues(){let t={},e=wx.lin._instantiation;return this._forEachNodes(i=>{const s=i.properties.name,r=e.selectComponent("#"+s);r&&(t[s]=r.getValues())}),t},submit(){let t=this.data.isSubmitValidate?this._validateForm():[];this.triggerEvent("linsubmit",{values:this._getValues(),errors:this.data.isSubmitValidate?this._errors:{},isValidate:0===t.length})},reset(){let t=wx.lin._instantiation;this._forEachNodes(e=>{e.setData({errorText:""});const i=e.properties.name,s=t.selectComponent("#"+i);s&&s.reset()})}}}); \ No newline at end of file +import eventBus from"../core/utils/event-bus.js";import eventUtil from"../core/utils/event-util";Component({externalClasses:["l-form-container-class","l-form-submit-class","l-form-reset-class","l-form-btn-class"],options:{multipleSlots:!0},relations:{"../form-item/index":{type:"child",linked:function(t){this._initItem(t)},linkChanged:function(){},unlinked:function(){}}},properties:{name:{type:String,value:""},isSubmitValidate:{type:Boolean,value:!0}},attached(){this._init()},detached(){for(let t in this._keys)Object.prototype.hasOwnProperty.call(this._keys,t)&&(eventBus.off("lin-form-blur-"+t),eventBus.off("lin-form-change-"+t))},data:{_this:null},methods:{_init(){wx.lin=wx.lin||{},wx.lin.forms=wx.lin.forms||{},wx.lin.forms[this.properties.name]=this,wx.lin.initValidateForm=t=>{wx.lin._instantiation=t},wx.lin.submitForm=function(t){wx.lin.forms[t].submit()},wx.lin.resetForm=function(t){wx.lin.forms[t].reset()}},_initItem(t){this._keys=this._keys||{},this._errors=this._errors||{};const e=t.properties.name;if(eventBus.on("lin-form-blur-"+e,t=>{this._validateItem(t,"blur")}),eventBus.on("lin-form-change-"+e,t=>{clearTimeout(this.change_time),this.change_time=setTimeout(()=>{this._validateItem(t,"change")},200)}),this._keys[e])throw new Error("表单项存在重复的name:"+e);this._keys[e]="",this._errors[e]=[]},_validateItem(t,e){let i=wx.lin._instantiation,s=this._getValues();const r=this.getRelationNodes("../form-item/index").find(e=>e.properties.name===t);if(!i.selectComponent("#"+t))throw new Error("表单项不存在name:"+t);return r.validatorData(s,e),this._errors[t]=r.data.errors,r.data.errors},_forEachNodes(t,e){let i=this.getRelationNodes("../form-item/index");e&&i.reverse(),i.forEach((e,i)=>{t(e,i)})},_validateForm(){let t=wx.lin._instantiation,e=[],i=this._getValues();return this._forEachNodes(s=>{const r=s.properties.name;if(!t.selectComponent("#"+r))throw new Error("表单项不存在name:"+r);s.validatorData(i),this._errors[r]=s.data.errors,e=e.concat(s.data.errors)},!0),e},_getValues(){let t={},e=wx.lin._instantiation;return this._forEachNodes(i=>{const s=i.properties.name,r=e.selectComponent("#"+s);r&&(t[s]=r.getValues())}),t},submit(){let t=this.data.isSubmitValidate?this._validateForm():[];this.triggerEvent("linsubmit",{values:this._getValues(),errors:this.data.isSubmitValidate?this._errors:{},isValidate:0===t.length})},reset(){let t=wx.lin._instantiation;this._forEachNodes(e=>{e.setData({errorText:""});const i=e.properties.name,s=t.selectComponent("#"+i);s&&s.reset()}),eventUtil.emit(this,"linreset")}}}); \ No newline at end of file diff --git a/dist/image-picker/index.js b/dist/image-picker/index.js index 638f476d..33adb6c6 100644 --- a/dist/image-picker/index.js +++ b/dist/image-picker/index.js @@ -1 +1 @@ -import validator from"../behaviors/validator";Component({externalClasses:["l-class","l-item-class"],behaviors:["wx://form-field",validator],properties:{urls:{type:Array,value:[]},count:{type:[String,Number],value:9},clear:{type:Boolean,value:!1,observer:function(e){e&&this.handleClear()}},size:{type:[String,Number],value:3,options:[3,4,"3","4"]},sizeType:{type:String,value:"original",options:["original","compressed"]},mode:{type:String,value:"aspectFit",options:["scaleToFill","aspectFit","aspectFill","widthFix","top","bottom","center","left","right","top left","top right","bottom left","bottom right"]},custom:{type:Boolean,value:!1},preview:{type:Boolean,value:!0},maxImageSize:{type:Number,value:1e7}},data:{showBtn:!0,tempFilePath:""},lifetimes:{attached:function(){const e=this.judgeNewOrOld();this.setData({newOrOld:e}),"old"===e&&console.warn("image-picker组件已经升级,建议使用最新版本,当前用法会在后续版本中暂停支持")}},methods:{handleClear(){let e=this.data.urls;this.setData({urls:[],clear:!1,showBtn:!0});let t={all:e,current:e};this.triggerEvent("linclear",t,{})},onPreviewTap(e){const t=e.currentTarget.dataset.index,a=this.data.urls;let l="",i=[];if("old"===this.data.newOrOld)l=this.data.urls[t],i=this.data.urls;else{l=this.data.urls[t].url;for(let e=0;ee.data.maxImageSize;const i=e.data.urls.concat(l);i.length===parseInt(e.data.count)&&e.setData({showBtn:!1}),e.setData({urls:i,value:i,tempFilePath:l});let r={current:l,all:i},s={};e.triggerEvent("linchange",r,s),e.triggerEvent("linpush",r,s);let n=[];for(let e=0;e0){let t={current:l,all:i,overSizeList:n};e.triggerEvent("linoversize",t,s)}}})},onDelTap(e){const t=e.currentTarget.dataset.index,a=this.data.urls,l=a[t],i=this.handleSplice(a,l);i.lengthe.filter(e=>e!==t),judgeNewOrOld:function(){const e=this.data.urls;return 0!==e.length&&"object"!=typeof e[0]?"old":"new"}}}); \ No newline at end of file +import validator from"../behaviors/validator";Component({externalClasses:["l-class","l-item-class"],behaviors:["wx://form-field",validator],properties:{urls:{type:Array,value:[]},count:{type:[String,Number],value:9},clear:{type:Boolean,value:!1,observer:function(e){e&&this.handleClear()}},size:{type:[String,Number],value:3,options:[3,4,"3","4"]},sizeType:{type:String,value:"original",options:["original","compressed"]},mode:{type:String,value:"aspectFit",options:["scaleToFill","aspectFit","aspectFill","widthFix","top","bottom","center","left","right","top left","top right","bottom left","bottom right"]},custom:{type:Boolean,value:!1},preview:{type:Boolean,value:!0},maxImageSize:{type:Number,value:1e7},cells:{type:Array,value:null}},data:{showBtn:!0,tempFilePath:""},lifetimes:{attached:function(){let e=this.judgeNewOrOld();null!==this.data.cells?(e="new",this.setData({newOrOld:e,urls:this.data.cells})):this.setData({newOrOld:e})}},methods:{handleClear(){let e=this.data.urls;this.setData({urls:[],clear:!1,showBtn:!0});let t={all:e,current:e};this.triggerEvent("linclear",t,{})},onPreviewTap(e){const t=e.currentTarget.dataset.index,l=this.data.urls;let a="",s=[];const i=this.data.newOrOld;if(void 0!==this.data.cells){const e=this.data.cells;a=e[t].url;for(let t=0;te.data.maxImageSize;const s=e.data.urls.concat(a);s.length===parseInt(e.data.count)&&e.setData({showBtn:!1}),e.setData({urls:s,value:s,tempFilePath:a});let i={current:a,all:s},r={};e.triggerEvent("linchange",i,r),e.triggerEvent("linpush",i,r);let n=[];for(let e=0;e0){let t={current:a,all:s,overSizeList:n};e.triggerEvent("linoversize",t,r)}}})},onDelTap(e){const t=e.currentTarget.dataset.index,l=this.data.urls,a=l[t],s=this.handleSplice(l,a);s.lengthe.filter(e=>e!==t),judgeNewOrOld:function(){const e=this.data.urls;return 0!==e.length&&"object"!=typeof e[0]?"old":"new"}}}); \ No newline at end of file diff --git a/dist/image-picker/index.wxml b/dist/image-picker/index.wxml index 97a904be..6b3417ed 100644 --- a/dist/image-picker/index.wxml +++ b/dist/image-picker/index.wxml @@ -3,7 +3,7 @@ - + diff --git a/dist/list/index.js b/dist/list/index.js index 0d3e772b..f70ae4dd 100644 --- a/dist/list/index.js +++ b/dist/list/index.js @@ -1 +1 @@ -import hover from"../behaviors/hover";Component({behaviors:[hover],relations:{"../list/index":{type:"parent",linked(){},linkChanged(){},unlinked(){}}},options:{multipleSlots:!0},externalClasses:["l-class","l-class-icon","l-icon-class","l-class-image","l-image-class","l-class-right","l-right-class","l-class-content","l-content-class","l-class-desc","l-desc-class"],properties:{icon:String,iconColor:{type:String,value:"#3963BC"},iconSize:{type:String,value:"28"},image:String,title:String,desc:String,tagPosition:{type:String,value:"left"},tagContent:String,tagShape:{type:String,value:"square"},tagColor:String,tagPlain:Boolean,badgePosition:{type:String,value:"left"},dotBadge:Boolean,badgeCount:Number,badgeMaxCount:{type:Number,value:99},badgeCountType:{type:String,value:"overflow"},rightDesc:String,gap:Number,leftGap:Number,rightGap:Number,isLink:{type:Boolean,value:!0},linkType:{type:String,value:"navigateTo"},url:String},methods:{tapcell:function(e){const{linkType:t,url:l}=e.currentTarget.dataset;l&&wx[t]({url:l}),this.triggerEvent("lintap",{e:e},{bubbles:!0,composed:!0})}}}); \ No newline at end of file +import hover from"../behaviors/hover";Component({behaviors:[hover],relations:{"../list/index":{type:"parent",linked(){},linkChanged(){},unlinked(){}}},options:{multipleSlots:!0},externalClasses:["l-class","l-class-icon","l-icon-class","l-class-image","l-image-class","l-class-right","l-right-class","l-class-content","l-content-class","l-class-desc","l-desc-class","l-link-icon-class"],properties:{icon:String,iconColor:{type:String,value:"#3963BC"},iconSize:{type:String,value:"28"},image:String,title:String,desc:String,tagPosition:{type:String,value:"left"},tagContent:String,tagShape:{type:String,value:"square"},tagColor:String,tagPlain:Boolean,badgePosition:{type:String,value:"left"},dotBadge:Boolean,badgeCount:Number,badgeMaxCount:{type:Number,value:99},badgeCountType:{type:String,value:"overflow"},rightDesc:String,gap:Number,leftGap:Number,rightGap:Number,isLink:{type:Boolean,value:!0},linkType:{type:String,value:"navigateTo"},url:String},methods:{tapcell:function(e){const{linkType:t,url:l}=e.currentTarget.dataset;l&&wx[t]({url:l}),this.triggerEvent("lintap",{e:e},{bubbles:!0,composed:!0})}}}); \ No newline at end of file diff --git a/dist/list/index.wxml b/dist/list/index.wxml index ad29b2de..770beaa6 100644 --- a/dist/list/index.wxml +++ b/dist/list/index.wxml @@ -13,9 +13,9 @@ \ No newline at end of file + diff --git a/dist/popup/index.js b/dist/popup/index.js index 722617ce..7dbb14a1 100644 --- a/dist/popup/index.js +++ b/dist/popup/index.js @@ -1 +1 @@ -import zIndex from"../behaviors/zIndex";import validator from"../behaviors/validator";Component({behaviors:[zIndex,validator],externalClasses:["l-bg-class","l-panel-class","l-class"],properties:{show:{type:Boolean,value:!1},animation:{type:Boolean,value:!0},transition:{type:Boolean,value:null},contentAlign:{type:String,value:"center",options:["top","right","left","bottom","center"]},direction:{type:String,value:null,options:["top","right","left","bottom","center"]},locked:{type:Boolean,value:!1}},attached(){this._init()},pageLifetimes:{show(){this._init()}},data:{status:"show"},methods:{_init(){wx.lin=wx.lin||{},wx.lin.showPopup=t=>{const{zIndex:e=99,animation:o=!0,contentAlign:a="center",locked:s=!1}={...t};this.setData({zIndex:e,animation:o,contentAlign:a,locked:s,show:!0})},wx.lin.hidePopup=()=>{this.setData({status:"hide"}),setTimeout(()=>{this.setData({show:!1})},300)}},doNothingMove(){},doNothingTap(){},onPopupTap(){!0!==this.data.locked&&(this.data.show?(this.setData({status:"hide"}),setTimeout(()=>{this.setData({show:!1,status:"show"})},300)):this.setData({show:!0,status:"show"})),this.triggerEvent("lintap",!0,{bubbles:!0,composed:!0})}}}); \ No newline at end of file +import zIndex from"../behaviors/zIndex";import validator from"../behaviors/validator";import eventUtil from"../core/utils/event-util";Component({behaviors:[zIndex,validator],externalClasses:["l-bg-class","l-panel-class","l-class"],properties:{show:{type:Boolean,value:!1},animation:{type:Boolean,value:!0},transition:{type:Boolean,value:null},contentAlign:{type:String,value:"center",options:["top","right","left","bottom","center"]},direction:{type:String,value:null,options:["top","right","left","bottom","center"]},locked:{type:Boolean,value:!1}},attached(){this._init()},pageLifetimes:{show(){this._init()}},data:{status:"show"},methods:{_init(){wx.lin=wx.lin||{},wx.lin.showPopup=t=>{const{zIndex:e=99,animation:o=!0,contentAlign:i="center",locked:a=!1}={...t};this.setData({zIndex:e,animation:o,contentAlign:i,locked:a,show:!0})},wx.lin.hidePopup=()=>{this.setData({status:"hide"}),setTimeout(()=>{this.setData({show:!1})},300)}},doNothingMove(){},doNothingTap(){},onPopupTap(){!0!==this.data.locked&&(this.data.show?(this.setData({status:"hide"}),setTimeout(()=>{this.setData({show:!1,status:"show"})},300)):this.setData({show:!0,status:"show"})),eventUtil.emit(this,"lintap",!0)}}}); \ No newline at end of file diff --git a/dist/popup/index.wxss b/dist/popup/index.wxss index 406ca8ac..1d80b771 100644 --- a/dist/popup/index.wxss +++ b/dist/popup/index.wxss @@ -1 +1 @@ -.container-popup{visibility:hidden;position:fixed;top:0;left:0;right:0;bottom:0}.popup-show{visibility:visible}.popup-show .container-bg{display:block;opacity:1}.container-bg{opacity:0;position:fixed;top:0;left:0;right:0;bottom:0;z-index:6;background:rgba(0,0,0,.4);transition:all .3s ease-in-out}.popup-bg{height:100%;width:100%;position:absolute;z-index:90}.popup-content{position:absolute;z-index:100;width:100%;max-width:100%;height:100%}.center{display:flex;height:100%;width:100%;flex-direction:row;align-items:center;justify-content:center}.left{display:flex;flex-direction:row;height:100%}.right{display:flex;flex-direction:row;justify-content:flex-end;height:100%}.bottom{display:flex;flex-direction:column-reverse;width:100%}.popup-fade-center-active-show{animation:popup-center-fadein .4s}.popup-fade-center-active-hide{animation:popup-center-fadeout .4s}.popup-fade-top-active-show{animation:popup-top-fadein .3s ease-in-out}.popup-fade-top-active-hide{animation:popup-top-fadeout .3s ease-in-out}.popup-fade-right-active-show{animation:popup-right-fadein .3s ease-in-out}.popup-fade-right-active-hide{animation:popup-right-fadeout .3s ease-in-out}.popup-fade-left-active-show{animation:popup-left-fadein .3s ease-in-out}.popup-fade-left-active-hide{animation:popup-left-fadeout .3s ease-in-out}.popup-fade-bottom-active-show{animation:popup-bottom-fadein .3s ease-in-out}.popup-fade-bottom-active-hide{animation:popup-bottom-fadeout .3s ease-in-out}@keyframes popup-center-fadein{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}@keyframes popup-center-fadeout{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1)}100%{transform:scale(.8);opacity:0}}@keyframes popup-top-fadein{0%{transform:translate3d(0,-100%,0);opacity:.1}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-top-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-100%,0);opacity:.1}}@keyframes popup-left-fadein{0%{transform:translate3d(-100%,0,0);opacity:.1}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-left-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(-100%,0,0);opacity:.1}}@keyframes popup-right-fadein{0%{transform:translate3d(100%,0,0);opacity:.1}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-right-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(100%,0,0);opacity:.1}}@keyframes popup-bottom-fadein{0%{transform:translate3d(0,100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-bottom-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,100%,0);opacity:.1}} \ No newline at end of file +.popup-fade-center-active-show{animation:popup-center-fadein .3s forwards}.popup-fade-center-active-hide{animation:popup-center-fadeout .3s forwards}.popup-fade-top-active-show{animation:popup-top-fadein .3s forwards}.popup-fade-top-active-hide{animation:popup-top-fadeout .3s forwards}.popup-fade-left-active-show{animation:popup-left-fadein .3s forwards}.popup-fade-left-active-hide{animation:popup-left-fadeout .3s forwards}.popup-fade-right-active-show{animation:popup-right-fadein .3s forwards}.popup-fade-right-active-hide{animation:popup-right-fadeout .3s forwards}.popup-fade-bottom-active-show{animation:popup-bottom-fadein .3s forwards}.popup-fade-bottom-active-hide{animation:popup-bottom-fadeout .3s forwards}@keyframes popup-top-fadein{0%{transform:translate3d(0,-100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-top-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-100%,0);opacity:.1}}@keyframes popup-left-fadein{0%{transform:translate3d(-100%,0,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-left-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(-100%,0,0);opacity:.1}}@keyframes popup-right-fadein{0%{transform:translate3d(100%,0,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-right-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(100%,0,0);opacity:.1}}@keyframes popup-bottom-fadein{0%{transform:translate3d(0,100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-bottom-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,100%,0);opacity:.1}}@keyframes popup-center-fadein{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}@keyframes popup-center-fadeout{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1)}100%{transform:scale(.8);opacity:0}}.container-popup{visibility:hidden;position:fixed;top:0;left:0;right:0;bottom:0}.popup-show{visibility:visible}.popup-show .container-bg{display:block;opacity:1}.container-bg{opacity:0;position:fixed;top:0;left:0;right:0;bottom:0;z-index:6;background:rgba(0,0,0,.4);transition:all .3s ease-in-out}.popup-bg{height:100%;width:100%;position:absolute;z-index:90}.popup-content{position:absolute;z-index:100;width:100%;max-width:100%;height:100%}.center{display:flex;height:100%;width:100%;flex-direction:row;align-items:center;justify-content:center}.left{display:flex;flex-direction:row;height:100%}.right{display:flex;flex-direction:row;justify-content:flex-end;height:100%}.bottom{display:flex;flex-direction:column-reverse;width:100%} \ No newline at end of file diff --git a/dist/segment/index.js b/dist/segment/index.js index 92152001..249442e6 100644 --- a/dist/segment/index.js +++ b/dist/segment/index.js @@ -1 +1 @@ -import scrollCenter from"../behaviors/scrollCenter";Component({behaviors:[scrollCenter],externalClasses:["l-class","l-header-class","l-class-active","l-active-class","l-class-inactive","l-inactive-class","l-class-tabimage","l-tab-image-class","l-class-header-line","l-header-line-class","l-class-line","l-line-class","l-class-icon","l-icon-class","l-class-badge","l-badge-class"],options:{multipleSlots:!0,pureDataPattern:/^_/},relations:{"../segment-item/index":{type:"child",linked(e){this.initTabs(e)}}},properties:{activeKey:{type:String,value:"",observer:"changeCurrent"},placement:{type:String,value:"top"},scrollable:Boolean,hasLine:{type:Boolean,value:!0},animatedForLine:Boolean,activeColor:{type:String},inactiveColor:{type:String},equalWidth:{type:Boolean,value:!0},even:{type:Boolean,value:!0},width:Number,height:Number,itemHeight:Number,itemWidth:Number},observers:{activeKey:function(e){if(!e)return;const t=this.data.tabList.findIndex(t=>t.key===e);this.setData({currentIndex:t},()=>{this.data.scrollable&&this.queryMultipleNodes()})}},data:{tabList:[],currentIndex:0,_segmentItemInstances:[]},methods:{initTabs(e){const t=this.data.activeKey;let a=this.getRelationNodes("../segment-item/index");if(a.length>0){if(a.length===this.data.tabList.length&&this.data._segmentItemInstances.indexOf(e)>0)return;let s=t,i=this.data.currentIndex;const n=a.map((e,a)=>(s=t||0!==a?s:e.data.key,i=e.data.key===s?a:i,{...e.data}));this.setData({tabList:n,activeKey:s,currentIndex:i,_segmentItemInstances:a},()=>{this.data.scrollable&&this.queryMultipleNodes()})}},handleChange(e){const t=e.currentTarget.dataset.key,a=e.currentTarget.dataset.index;this._setChangeData({activeKey:t,currentIndex:a})},_setChangeData({activeKey:e,currentIndex:t}){this.setData({activeKey:e,currentIndex:t},()=>{this.data.scrollable&&this.queryMultipleNodes()}),this.triggerEvent("linchange",{activeKey:e,currentIndex:t})}}}); \ No newline at end of file +import scrollCenter from"../behaviors/scrollCenter";Component({behaviors:[scrollCenter],externalClasses:["l-class","l-header-class","l-class-active","l-active-class","l-class-inactive","l-inactive-class","l-class-tabimage","l-tab-image-class","l-class-header-line","l-header-line-class","l-class-line","l-line-class","l-class-icon","l-icon-class","l-class-badge","l-badge-class"],options:{multipleSlots:!0,pureDataPattern:/^_/},relations:{"../segment-item/index":{type:"child",linked(e){this.initTabs(e)}}},properties:{activeKey:{type:String,value:"",observer:"changeCurrent"},placement:{type:String,value:"top"},scrollable:Boolean,hasLine:{type:Boolean,value:!0},animatedForLine:Boolean,activeColor:{type:String},inactiveColor:{type:String},equalWidth:{type:Boolean,value:!0},even:{type:Boolean,value:!0},width:Number,height:Number,itemHeight:Number,itemWidth:Number},observers:{activeKey:function(e){if(!e)return;const t=this.data.tabList.findIndex(t=>t.key===e);this.setData({currentIndex:t},()=>{this.data.scrollable&&this.queryMultipleNodes()})}},data:{_cells:[],tabList:[],currentIndex:0,_segmentItemInstances:[]},methods:{initTabs(e){const t=this.data.activeKey;let a=this.getRelationNodes("../segment-item/index");if(a.length>0){if(a.length===this.data.tabList.length&&this.data._segmentItemInstances.indexOf(e)>0)return;let s=t,l=this.data.currentIndex,i=[];const n=a.map((e,a)=>(s=t||0!==a?s:e.data.key,l=e.data.key===s?a:l,i[a]=e.dataset.cell,{...e.data}));this.setData({_cells:i,activeKey:s,tabList:n,currentIndex:l,_segmentItemInstances:a},()=>{this.data.scrollable&&this.queryMultipleNodes()})}},handleChange(e){const t=e.currentTarget.dataset.key,a=e.currentTarget.dataset.index;this._setChangeData({activeKey:t,currentIndex:a})},_setChangeData({activeKey:e,currentIndex:t}){this.setData({activeKey:e,currentIndex:t},()=>{this.data.scrollable&&this.queryMultipleNodes()}),this.triggerEvent("linchange",{activeKey:e,currentIndex:t,cell:this.data._cells[t]})}}}); \ No newline at end of file diff --git a/dist/segment/index.wxml b/dist/segment/index.wxml index ae41f215..f631c388 100644 --- a/dist/segment/index.wxml +++ b/dist/segment/index.wxml @@ -19,6 +19,6 @@ diff --git a/dist/tabs/index.wxml b/dist/tabs/index.wxml index a4930b9a..598f81fb 100644 --- a/dist/tabs/index.wxml +++ b/dist/tabs/index.wxml @@ -4,7 +4,7 @@ - + {{item.tab}} diff --git a/examples/dist/button/index.wxss b/examples/dist/button/index.wxss index 2597fc32..21cfe7df 100644 --- a/examples/dist/button/index.wxss +++ b/examples/dist/button/index.wxss @@ -1 +1 @@ -.btn-hover::before{opacity:.15;position:absolute;top:50%;left:50%;width:100%;height:100%;border:inherit;border-radius:inherit;transform:translate(-50%,-50%);content:' ';background-color:#333;border-color:#333}.special-container{display:flex}.l-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;font-size:28rpx;position:relative;color:#fff;padding:0 12rpx;box-sizing:border-box}.l-btn-img-mini{width:30rpx;height:30rpx}.l-btn-img-medium{width:36rpx;height:36rpx}.l-btn-img-large{height:44rpx;width:44rpx}.l-btn-long{border-radius:0;margin:0;height:88rpx;width:100%}.l-btn-medium{height:72rpx;min-width:180rpx}.l-btn-large{height:88rpx;min-width:710rpx}.l-btn-mini{height:60rpx;min-width:140rpx;font-size:24rpx}.l-btn-default{background-color:#3963bc}.l-btn-success{background-color:#34bfa3}.l-btn-warning{background-color:#ffe57f;color:#333}.l-btn-error{background-color:#f4516c}.l-btn-square{border-radius:0}.l-btn-semicircle{border-radius:40rpx}.l-btn-large.l-btn-semicircle{border-radius:48rpx}.l-btn-mini.l-btn-semicircle{border-radius:30rpx}.l-btn-circle{border-radius:8rpx}.l-btn-large.l-btn-circle{border-radius:9.6rpx}.l-btn-mini.l-btn-circle{border-radius:6rpx}.l-btn-plain{background-color:#fff;color:#3963bc;border:2rpx solid #3963bc}.l-btn-success.l-btn-plain{background-color:#fff;color:#34bfa3;border:2rpx solid #34bfa3}.l-btn-error.l-btn-plain{background-color:#fff;color:#f4516c;border:2rpx solid #f4516c}.l-btn-warning.l-btn-plain{background-color:#fff;color:#ffe57f;border:2rpx solid #ffe57f}.l-btn-loading{opacity:.6;display:inline-block;vertical-align:middle;width:24rpx;height:24rpx;background:0 0;border-radius:50%;border:4rpx solid #fff;border-color:#fff #fff #fff transparent;animation:btn-spin .6s linear;animation-iteration-count:infinite}.l-btn-loading-default{border:4rpx solid #3963bc;border-color:#3963bc #3963bc #3963bc transparent}.l-btn-loading-success{border:4rpx solid #34bfa3;border-color:#34bfa3 #34bfa3 #34bfa3 transparent}.l-btn-loading-error{border:4rpx solid #f4516c;border-color:#f4516c #f4516c #f4516c transparent}.l-btn-loading-warning{border:4rpx solid #ffe57f;border-color:#ffe57f #ffe57f #ffe57f transparent}.l-btn-disabled{opacity:.8}.icon{display:flex!important}.margin-mini{margin-right:10rpx}.margin-medium{margin-right:18rpx}.margin-large{margin-right:24rpx}@keyframes btn-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}} \ No newline at end of file +.btn-hover::before{opacity:.15;position:absolute;top:50%;left:50%;width:100%;height:100%;border:inherit;border-radius:inherit;transform:translate(-50%,-50%);content:' ';background-color:#333;border-color:#333}.special-container{display:flex}.l-btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;font-size:28rpx;position:relative;color:#fff;padding:0 12rpx;box-sizing:border-box}.l-btn-img-mini{width:30rpx;height:30rpx}.l-btn-img-medium{width:36rpx;height:36rpx}.l-btn-img-large{height:44rpx;width:44rpx}.l-btn-long{border-radius:0;height:88rpx;width:100%}.l-btn-medium{height:72rpx;min-width:180rpx}.l-btn-large{height:88rpx;min-width:710rpx}.l-btn-mini{height:60rpx;min-width:140rpx;font-size:24rpx}.l-btn-default{background-color:#3963bc}.l-btn-success{background-color:#34bfa3}.l-btn-warning{background-color:#ffe57f;color:#333}.l-btn-error{background-color:#f4516c}.l-btn-square{border-radius:0}.l-btn-semicircle{border-radius:40rpx}.l-btn-large.l-btn-semicircle{border-radius:48rpx}.l-btn-mini.l-btn-semicircle{border-radius:30rpx}.l-btn-circle{border-radius:8rpx}.l-btn-large.l-btn-circle{border-radius:9.6rpx}.l-btn-mini.l-btn-circle{border-radius:6rpx}.l-btn-plain{background-color:#fff;color:#3963bc;border:2rpx solid #3963bc}.l-btn-success.l-btn-plain{background-color:#fff;color:#34bfa3;border:2rpx solid #34bfa3}.l-btn-error.l-btn-plain{background-color:#fff;color:#f4516c;border:2rpx solid #f4516c}.l-btn-warning.l-btn-plain{background-color:#fff;color:#ffe57f;border:2rpx solid #ffe57f}.l-btn-loading{opacity:.6;display:inline-block;vertical-align:middle;width:24rpx;height:24rpx;background:0 0;border-radius:50%;border:4rpx solid #fff;border-color:#fff #fff #fff transparent;animation:btn-spin .6s linear;animation-iteration-count:infinite}.l-btn-loading-default{border:4rpx solid #3963bc;border-color:#3963bc #3963bc #3963bc transparent}.l-btn-loading-success{border:4rpx solid #34bfa3;border-color:#34bfa3 #34bfa3 #34bfa3 transparent}.l-btn-loading-error{border:4rpx solid #f4516c;border-color:#f4516c #f4516c #f4516c transparent}.l-btn-loading-warning{border:4rpx solid #ffe57f;border-color:#ffe57f #ffe57f #ffe57f transparent}.l-btn-disabled{opacity:.8}.icon{display:flex!important}.margin-mini{margin-right:10rpx}.margin-medium{margin-right:18rpx}.margin-large{margin-right:24rpx}.margin-long{margin-right:24rpx}@keyframes btn-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}} \ No newline at end of file diff --git a/examples/dist/form/index.js b/examples/dist/form/index.js index de994d16..a3bd2dba 100644 --- a/examples/dist/form/index.js +++ b/examples/dist/form/index.js @@ -1,4 +1,5 @@ import eventBus from '../core/utils/event-bus.js'; +import eventUtil from '../core/utils/event-util'; Component({ /** * 组件的属性列表 @@ -10,12 +11,12 @@ Component({ relations: { '../form-item/index': { type: 'child', - linked: function(target) { + linked: function (target) { this._initItem(target); }, - linkChanged: function() { + linkChanged: function () { }, - unlinked: function() { + unlinked: function () { } } }, @@ -35,7 +36,7 @@ Component({ this._init(); }, detached() { - for(let key in this._keys) { + for (let key in this._keys) { if (Object.prototype.hasOwnProperty.call(this._keys, key)) { eventBus.off(`lin-form-blur-${key}`); eventBus.off(`lin-form-change-${key}`); @@ -83,11 +84,11 @@ Component({ }); eventBus.on(`lin-form-change-${key}`, (id) => { clearTimeout(this.change_time); - this.change_time = setTimeout(()=>{ + this.change_time = setTimeout(() => { this._validateItem(id, 'change'); }, 200); }); - if(this._keys[key]) { + if (this._keys[key]) { throw new Error(`表单项存在重复的name:${key}`); } this._keys[key] = ''; @@ -100,9 +101,9 @@ Component({ let params = this._getValues(); const items = this.getRelationNodes('../form-item/index'); - const currentTarget = items.find(item => item.properties.name === id); + const currentTarget = items.find(item => item.properties.name === id); const formItem = _this.selectComponent(`#${id}`); - if(formItem) { + if (formItem) { currentTarget.validatorData(params, type); } else { throw new Error(`表单项不存在name:${id}`); @@ -129,7 +130,7 @@ Component({ this._forEachNodes(item => { const id = item.properties.name; const formItem = _this.selectComponent(`#${id}`); - if(formItem) { + if (formItem) { item.validatorData(params); } else { throw new Error(`表单项不存在name:${id}`); @@ -147,7 +148,7 @@ Component({ this._forEachNodes(item => { const _id = item.properties.name; const formItem = _this.selectComponent(`#${_id}`); - if(formItem) { + if (formItem) { params[_id] = formItem.getValues(); } }); @@ -155,10 +156,10 @@ Component({ }, submit() { - let errors = this.data.isSubmitValidate ? this._validateForm(): []; + let errors = this.data.isSubmitValidate ? this._validateForm() : []; this.triggerEvent('linsubmit', { values: this._getValues(), - errors: this.data.isSubmitValidate ? this._errors: {}, + errors: this.data.isSubmitValidate ? this._errors : {}, isValidate: errors.length === 0 }); }, @@ -170,10 +171,11 @@ Component({ }); const _id = item.properties.name; const formItem = _this.selectComponent(`#${_id}`); - if(formItem) { + if (formItem) { formItem.reset(); } }); + eventUtil.emit(this, 'linreset'); } } }); diff --git a/examples/dist/image-picker/index.js b/examples/dist/image-picker/index.js index 3e5e394c..3a16e440 100644 --- a/examples/dist/image-picker/index.js +++ b/examples/dist/image-picker/index.js @@ -58,6 +58,11 @@ Component({ maxImageSize: { type: Number, value: 10000000, + }, + // 以对象方式传入图片链接 + cells: { + type: Array, + value: null } }, @@ -72,12 +77,19 @@ Component({ lifetimes: { attached: function () { // 在组件实例进入页面节点树时执行 - const newOrOld = this.judgeNewOrOld(); - this.setData({ - newOrOld - }); - if (newOrOld === 'old') { - console.warn('image-picker组件已经升级,建议使用最新版本,当前用法会在后续版本中暂停支持'); + let newOrOld = this.judgeNewOrOld(); + + // 对 cells 的兼容处理 + if (this.data.cells !== null) { + newOrOld = 'new'; + this.setData({ + newOrOld, + urls: this.data.cells + }); + } else { + this.setData({ + newOrOld + }); } }, }, @@ -110,7 +122,14 @@ Component({ let previewImageList = []; const newOrOld = this.data.newOrOld; - if (newOrOld === 'old') { + // 第一个 if 是对 cells 的兼容处理 + if (typeof (this.data.cells) !== 'undefined') { + const cells = this.data.cells; + tempFilePath = cells[index].url; + for (let i = 0; i < cells.length; i++) { + previewImageList.push(cells[i].url); + } + } else if (newOrOld === 'old') { tempFilePath = this.data.urls[index]; previewImageList = this.data.urls; diff --git a/examples/dist/image-picker/index.wxml b/examples/dist/image-picker/index.wxml index 821cc25f..4394cc00 100644 --- a/examples/dist/image-picker/index.wxml +++ b/examples/dist/image-picker/index.wxml @@ -3,7 +3,7 @@ - + diff --git a/examples/dist/list/index.js b/examples/dist/list/index.js index 72b360f4..6d430cc0 100644 --- a/examples/dist/list/index.js +++ b/examples/dist/list/index.js @@ -31,7 +31,8 @@ Component({ 'l-class-content', 'l-content-class', 'l-class-desc', - 'l-desc-class' + 'l-desc-class', + 'l-link-icon-class' ], properties: { icon: String, @@ -103,4 +104,4 @@ Component({ }, { bubbles: true, composed: true }); } } -}); \ No newline at end of file +}); diff --git a/examples/dist/list/index.wxml b/examples/dist/list/index.wxml index eaff0295..47600180 100644 --- a/examples/dist/list/index.wxml +++ b/examples/dist/list/index.wxml @@ -13,9 +13,9 @@ \ No newline at end of file + diff --git a/examples/dist/popup/index.js b/examples/dist/popup/index.js index b90a6fde..4ebf2b33 100644 --- a/examples/dist/popup/index.js +++ b/examples/dist/popup/index.js @@ -1,5 +1,6 @@ import zIndex from '../behaviors/zIndex'; import validator from '../behaviors/validator'; +import eventUtil from '../core/utils/event-util'; Component({ /** @@ -101,7 +102,6 @@ Component({ // 点击事件 onPopupTap() { let detail = true; - let option = {bubbles: true, composed: true}; if (this.data.locked !== true) { if (!this.data.show) { this.setData({ @@ -121,7 +121,7 @@ Component({ } } - this.triggerEvent('lintap', detail, option); + eventUtil.emit(this,'lintap', detail); } } }); diff --git a/examples/dist/popup/index.wxss b/examples/dist/popup/index.wxss index 406ca8ac..1d80b771 100644 --- a/examples/dist/popup/index.wxss +++ b/examples/dist/popup/index.wxss @@ -1 +1 @@ -.container-popup{visibility:hidden;position:fixed;top:0;left:0;right:0;bottom:0}.popup-show{visibility:visible}.popup-show .container-bg{display:block;opacity:1}.container-bg{opacity:0;position:fixed;top:0;left:0;right:0;bottom:0;z-index:6;background:rgba(0,0,0,.4);transition:all .3s ease-in-out}.popup-bg{height:100%;width:100%;position:absolute;z-index:90}.popup-content{position:absolute;z-index:100;width:100%;max-width:100%;height:100%}.center{display:flex;height:100%;width:100%;flex-direction:row;align-items:center;justify-content:center}.left{display:flex;flex-direction:row;height:100%}.right{display:flex;flex-direction:row;justify-content:flex-end;height:100%}.bottom{display:flex;flex-direction:column-reverse;width:100%}.popup-fade-center-active-show{animation:popup-center-fadein .4s}.popup-fade-center-active-hide{animation:popup-center-fadeout .4s}.popup-fade-top-active-show{animation:popup-top-fadein .3s ease-in-out}.popup-fade-top-active-hide{animation:popup-top-fadeout .3s ease-in-out}.popup-fade-right-active-show{animation:popup-right-fadein .3s ease-in-out}.popup-fade-right-active-hide{animation:popup-right-fadeout .3s ease-in-out}.popup-fade-left-active-show{animation:popup-left-fadein .3s ease-in-out}.popup-fade-left-active-hide{animation:popup-left-fadeout .3s ease-in-out}.popup-fade-bottom-active-show{animation:popup-bottom-fadein .3s ease-in-out}.popup-fade-bottom-active-hide{animation:popup-bottom-fadeout .3s ease-in-out}@keyframes popup-center-fadein{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}@keyframes popup-center-fadeout{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1)}100%{transform:scale(.8);opacity:0}}@keyframes popup-top-fadein{0%{transform:translate3d(0,-100%,0);opacity:.1}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-top-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-100%,0);opacity:.1}}@keyframes popup-left-fadein{0%{transform:translate3d(-100%,0,0);opacity:.1}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-left-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(-100%,0,0);opacity:.1}}@keyframes popup-right-fadein{0%{transform:translate3d(100%,0,0);opacity:.1}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-right-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(100%,0,0);opacity:.1}}@keyframes popup-bottom-fadein{0%{transform:translate3d(0,100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-bottom-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,100%,0);opacity:.1}} \ No newline at end of file +.popup-fade-center-active-show{animation:popup-center-fadein .3s forwards}.popup-fade-center-active-hide{animation:popup-center-fadeout .3s forwards}.popup-fade-top-active-show{animation:popup-top-fadein .3s forwards}.popup-fade-top-active-hide{animation:popup-top-fadeout .3s forwards}.popup-fade-left-active-show{animation:popup-left-fadein .3s forwards}.popup-fade-left-active-hide{animation:popup-left-fadeout .3s forwards}.popup-fade-right-active-show{animation:popup-right-fadein .3s forwards}.popup-fade-right-active-hide{animation:popup-right-fadeout .3s forwards}.popup-fade-bottom-active-show{animation:popup-bottom-fadein .3s forwards}.popup-fade-bottom-active-hide{animation:popup-bottom-fadeout .3s forwards}@keyframes popup-top-fadein{0%{transform:translate3d(0,-100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-top-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,-100%,0);opacity:.1}}@keyframes popup-left-fadein{0%{transform:translate3d(-100%,0,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-left-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(-100%,0,0);opacity:.1}}@keyframes popup-right-fadein{0%{transform:translate3d(100%,0,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-right-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(100%,0,0);opacity:.1}}@keyframes popup-bottom-fadein{0%{transform:translate3d(0,100%,0);opacity:0}100%{transform:translate3d(0,0,0);opacity:1}}@keyframes popup-bottom-fadeout{0%{transform:translate3d(0,0,0);opacity:1}100%{transform:translate3d(0,100%,0);opacity:.1}}@keyframes popup-center-fadein{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}100%{transform:scale(1);opacity:1}}@keyframes popup-center-fadeout{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1)}100%{transform:scale(.8);opacity:0}}.container-popup{visibility:hidden;position:fixed;top:0;left:0;right:0;bottom:0}.popup-show{visibility:visible}.popup-show .container-bg{display:block;opacity:1}.container-bg{opacity:0;position:fixed;top:0;left:0;right:0;bottom:0;z-index:6;background:rgba(0,0,0,.4);transition:all .3s ease-in-out}.popup-bg{height:100%;width:100%;position:absolute;z-index:90}.popup-content{position:absolute;z-index:100;width:100%;max-width:100%;height:100%}.center{display:flex;height:100%;width:100%;flex-direction:row;align-items:center;justify-content:center}.left{display:flex;flex-direction:row;height:100%}.right{display:flex;flex-direction:row;justify-content:flex-end;height:100%}.bottom{display:flex;flex-direction:column-reverse;width:100%} \ No newline at end of file diff --git a/examples/dist/segment/index.js b/examples/dist/segment/index.js index 19347525..014f0481 100644 --- a/examples/dist/segment/index.js +++ b/examples/dist/segment/index.js @@ -91,6 +91,8 @@ Component({ * 组件的初始数据 */ data: { + // segment-item 绑定的 data-cell 数据 + _cells:[], tabList: [], currentIndex: 0, _segmentItemInstances: [] @@ -107,16 +109,20 @@ Component({ if (items.length === this.data.tabList.length && this.data._segmentItemInstances.indexOf(segmentItemInstance) > 0) return; let activeKey = val, currentIndex = this.data.currentIndex; + let _cells = []; const tab = items.map((item, index) => { activeKey = !val && index === 0 ? item.data.key : activeKey; currentIndex = item.data.key === activeKey ? index : currentIndex; + // 存储 segment-item 绑定的 data-cell 数据 + _cells[index] = item.dataset.cell; return { ...item.data }; }); this.setData({ - tabList: tab, + _cells, activeKey, + tabList: tab, currentIndex, _segmentItemInstances: items }, () => { @@ -150,7 +156,8 @@ Component({ }); this.triggerEvent('linchange', { activeKey, - currentIndex + currentIndex, + cell:this.data._cells[currentIndex] }); } } diff --git a/examples/dist/segment/index.wxml b/examples/dist/segment/index.wxml index 3fe28734..74240e79 100644 --- a/examples/dist/segment/index.wxml +++ b/examples/dist/segment/index.wxml @@ -22,6 +22,6 @@ diff --git a/examples/dist/tabs/index.wxml b/examples/dist/tabs/index.wxml index b14e25dc..44fce1f5 100644 --- a/examples/dist/tabs/index.wxml +++ b/examples/dist/tabs/index.wxml @@ -20,8 +20,9 @@ - {{item.tab}} diff --git a/package.json b/package.json index 04522f4f..3a52b26c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "lin-ui", - "version": "0.8.5", + "version": "0.8.6", "description": "A high quality UI components library with MiniProgram", "main": "app.js", "directories": { @@ -48,7 +48,7 @@ "gulp-util": "^3.0.8", "husky": "^4.2.5", "jest": "^24.8.0", - "less": "^2.7.3", + "less": "^3.12.2", "lodash": "^4.17.15", "miniprogram-simulate": "^1.0.7" }, diff --git a/src/button/index.less b/src/button/index.less index 398eab2d..712015e7 100644 --- a/src/button/index.less +++ b/src/button/index.less @@ -39,7 +39,6 @@ // Size &-long{ border-radius: 0; - margin: 0; height: 88rpx; width: 100%; } @@ -51,7 +50,7 @@ height: @btn-height-large; min-width: @btn-width-large; } - &-mini { + &-mini { height: @btn-height-mini; min-width: @btn-width-mini; font-size: @size-font-mini; @@ -93,7 +92,7 @@ border-radius: @btn-circle-size/5; } &-large&-circle{ - border-radius: @btn-circle-size-large/5; + border-radius: @btn-circle-size-large/5; } &-mini&-circle{ border-radius: @btn-circle-size-mini/5; @@ -172,6 +171,9 @@ &-large{ margin-right: 24rpx } + &-long{ + margin-right: 24rpx + } } @keyframes btn-spin { diff --git a/src/form/index.js b/src/form/index.js index de994d16..a3bd2dba 100644 --- a/src/form/index.js +++ b/src/form/index.js @@ -1,4 +1,5 @@ import eventBus from '../core/utils/event-bus.js'; +import eventUtil from '../core/utils/event-util'; Component({ /** * 组件的属性列表 @@ -10,12 +11,12 @@ Component({ relations: { '../form-item/index': { type: 'child', - linked: function(target) { + linked: function (target) { this._initItem(target); }, - linkChanged: function() { + linkChanged: function () { }, - unlinked: function() { + unlinked: function () { } } }, @@ -35,7 +36,7 @@ Component({ this._init(); }, detached() { - for(let key in this._keys) { + for (let key in this._keys) { if (Object.prototype.hasOwnProperty.call(this._keys, key)) { eventBus.off(`lin-form-blur-${key}`); eventBus.off(`lin-form-change-${key}`); @@ -83,11 +84,11 @@ Component({ }); eventBus.on(`lin-form-change-${key}`, (id) => { clearTimeout(this.change_time); - this.change_time = setTimeout(()=>{ + this.change_time = setTimeout(() => { this._validateItem(id, 'change'); }, 200); }); - if(this._keys[key]) { + if (this._keys[key]) { throw new Error(`表单项存在重复的name:${key}`); } this._keys[key] = ''; @@ -100,9 +101,9 @@ Component({ let params = this._getValues(); const items = this.getRelationNodes('../form-item/index'); - const currentTarget = items.find(item => item.properties.name === id); + const currentTarget = items.find(item => item.properties.name === id); const formItem = _this.selectComponent(`#${id}`); - if(formItem) { + if (formItem) { currentTarget.validatorData(params, type); } else { throw new Error(`表单项不存在name:${id}`); @@ -129,7 +130,7 @@ Component({ this._forEachNodes(item => { const id = item.properties.name; const formItem = _this.selectComponent(`#${id}`); - if(formItem) { + if (formItem) { item.validatorData(params); } else { throw new Error(`表单项不存在name:${id}`); @@ -147,7 +148,7 @@ Component({ this._forEachNodes(item => { const _id = item.properties.name; const formItem = _this.selectComponent(`#${_id}`); - if(formItem) { + if (formItem) { params[_id] = formItem.getValues(); } }); @@ -155,10 +156,10 @@ Component({ }, submit() { - let errors = this.data.isSubmitValidate ? this._validateForm(): []; + let errors = this.data.isSubmitValidate ? this._validateForm() : []; this.triggerEvent('linsubmit', { values: this._getValues(), - errors: this.data.isSubmitValidate ? this._errors: {}, + errors: this.data.isSubmitValidate ? this._errors : {}, isValidate: errors.length === 0 }); }, @@ -170,10 +171,11 @@ Component({ }); const _id = item.properties.name; const formItem = _this.selectComponent(`#${_id}`); - if(formItem) { + if (formItem) { formItem.reset(); } }); + eventUtil.emit(this, 'linreset'); } } }); diff --git a/src/image-picker/index.js b/src/image-picker/index.js index 3e5e394c..3a16e440 100644 --- a/src/image-picker/index.js +++ b/src/image-picker/index.js @@ -58,6 +58,11 @@ Component({ maxImageSize: { type: Number, value: 10000000, + }, + // 以对象方式传入图片链接 + cells: { + type: Array, + value: null } }, @@ -72,12 +77,19 @@ Component({ lifetimes: { attached: function () { // 在组件实例进入页面节点树时执行 - const newOrOld = this.judgeNewOrOld(); - this.setData({ - newOrOld - }); - if (newOrOld === 'old') { - console.warn('image-picker组件已经升级,建议使用最新版本,当前用法会在后续版本中暂停支持'); + let newOrOld = this.judgeNewOrOld(); + + // 对 cells 的兼容处理 + if (this.data.cells !== null) { + newOrOld = 'new'; + this.setData({ + newOrOld, + urls: this.data.cells + }); + } else { + this.setData({ + newOrOld + }); } }, }, @@ -110,7 +122,14 @@ Component({ let previewImageList = []; const newOrOld = this.data.newOrOld; - if (newOrOld === 'old') { + // 第一个 if 是对 cells 的兼容处理 + if (typeof (this.data.cells) !== 'undefined') { + const cells = this.data.cells; + tempFilePath = cells[index].url; + for (let i = 0; i < cells.length; i++) { + previewImageList.push(cells[i].url); + } + } else if (newOrOld === 'old') { tempFilePath = this.data.urls[index]; previewImageList = this.data.urls; diff --git a/src/image-picker/index.wxml b/src/image-picker/index.wxml index 821cc25f..4394cc00 100644 --- a/src/image-picker/index.wxml +++ b/src/image-picker/index.wxml @@ -3,7 +3,7 @@ - + diff --git a/src/list/index.js b/src/list/index.js index 72b360f4..6d430cc0 100644 --- a/src/list/index.js +++ b/src/list/index.js @@ -31,7 +31,8 @@ Component({ 'l-class-content', 'l-content-class', 'l-class-desc', - 'l-desc-class' + 'l-desc-class', + 'l-link-icon-class' ], properties: { icon: String, @@ -103,4 +104,4 @@ Component({ }, { bubbles: true, composed: true }); } } -}); \ No newline at end of file +}); diff --git a/src/list/index.wxml b/src/list/index.wxml index eaff0295..47600180 100644 --- a/src/list/index.wxml +++ b/src/list/index.wxml @@ -13,9 +13,9 @@ \ No newline at end of file + diff --git a/src/popup/index.js b/src/popup/index.js index b90a6fde..4ebf2b33 100644 --- a/src/popup/index.js +++ b/src/popup/index.js @@ -1,5 +1,6 @@ import zIndex from '../behaviors/zIndex'; import validator from '../behaviors/validator'; +import eventUtil from '../core/utils/event-util'; Component({ /** @@ -101,7 +102,6 @@ Component({ // 点击事件 onPopupTap() { let detail = true; - let option = {bubbles: true, composed: true}; if (this.data.locked !== true) { if (!this.data.show) { this.setData({ @@ -121,7 +121,7 @@ Component({ } } - this.triggerEvent('lintap', detail, option); + eventUtil.emit(this,'lintap', detail); } } }); diff --git a/src/popup/index.less b/src/popup/index.less index 6e5f32d7..3b55fb52 100644 --- a/src/popup/index.less +++ b/src/popup/index.less @@ -1,3 +1,82 @@ +@positions: center, top, left, right, bottom; +@animationPostions: { + top: translate3d(0, -100%, 0); + left: translate3d(-100%, 0, 0); + right: translate3d(100%, 0, 0); + bottom: translate3d(0, 100%, 0); +}; + +// 不同位置的动画使用 +each(@positions,{ + .popup-fade-@{value}-active-show{ + animation: ~'popup-@{value}-fadein 0.3s forwards'; + } + + .popup-fade-@{value}-active-hide{ + animation: ~'popup-@{value}-fadeout 0.3s forwards'; + } + +}); + +// 不同位置的动画定义 +each(@animationPostions,{ + @keyframes ~'popup-@{key}-fadein' { + 0% { + transform: @value; + opacity: 0; + } + + 100% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + } + + @keyframes ~'popup-@{key}-fadeout' { + 0% { + transform: translate3d(0, 0, 0); + opacity: 1; + } + + 100% { + transform: @value; + opacity: 0.1; + } + } +}); + +@keyframes popup-center-fadein { + 0% { + transform: scale(0.8); + opacity: 0; + } + + 50% { + transform: scale(1.1); + } + + 100% { + transform: scale(1); + opacity: 1; + } +} + +@keyframes popup-center-fadeout { + 0% { + transform: scale(1); + opacity: 1; + } + + 50% { + transform: scale(1.1); + } + + 100% { + transform: scale(0.8); + opacity: 0; + } +} + .container-popup { visibility: hidden; position: fixed; @@ -70,187 +149,3 @@ flex-direction: column-reverse; width: 100%; } - -.popup-fade-center-active-show { - animation: popup-center-fadein 0.4s; -} - -.popup-fade-center-active-hide { - animation: popup-center-fadeout 0.4s; -} - -.popup-fade-top-active-show { - animation:popup-top-fadein 0.3s ease-in-out; -} - -.popup-fade-top-active-hide { - animation:popup-top-fadeout 0.3s ease-in-out; -} - -.popup-fade-right-active-show { - animation: popup-right-fadein 0.3s ease-in-out; -} - -.popup-fade-right-active-hide { - animation: popup-right-fadeout 0.3s ease-in-out; -} - -.popup-fade-left-active-show { - animation: popup-left-fadein 0.3s ease-in-out; -} - -.popup-fade-left-active-hide { - animation: popup-left-fadeout 0.3s ease-in-out; -} - -.popup-fade-bottom-active-show { - animation: popup-bottom-fadein 0.3s ease-in-out; -} - -.popup-fade-bottom-active-hide { - animation: popup-bottom-fadeout 0.3s ease-in-out; -} - -// .popup-fade-center-leave { -// opacity: 0; -// } - -@keyframes popup-center-fadein { - 0% { - transform: scale(0.8); - opacity: 0; - } - - 50% { - transform: scale(1.1); - } - - 100% { - transform: scale(1); - opacity: 1; - } -} - -@keyframes popup-center-fadeout { - 0% { - transform: scale(1); - opacity: 1; - } - - 50% { - transform: scale(1.1); - } - - 100% { - transform: scale(0.8); - opacity: 0; - } -} - -@keyframes popup-top-fadein { - 0% { - transform: translate3d(0, -100%, 0); - opacity: 0.1; - } - - 100% { - transform: translate3d(0, 0, 0); - opacity: 1; - } -} - -@keyframes popup-top-fadeout { - 0% { - transform: translate3d(0, 0, 0); - opacity: 1; - } - - 100% { - transform: translate3d(0, -100%, 0); - opacity: 0.1; - } -} - -@keyframes popup-left-fadein { - 0% { - transform: translate3d(-100%, 0, 0); - opacity: 0.1; - } - - - 100% { - transform: translate3d(0, 0, 0); - opacity: 1; - } -} - -@keyframes popup-left-fadeout { - 0% { - transform: translate3d(0, 0, 0); - opacity: 1; - } - - - 100% { - transform: translate3d(-100%, 0, 0); - opacity: 0.1; - } -} - - -@keyframes popup-right-fadein { - 0% { - transform: translate3d(100%, 0, 0); - opacity: 0.1; - } - - /* 50% { - transform: translate3d(25%, 0, 0); - opacity: 0.7; - } */ - - 100% { - transform: translate3d(0, 0, 0); - opacity: 1; - } -} - -@keyframes popup-right-fadeout { - 0% { - transform: translate3d(0, 0, 0); - opacity: 1; - } - - 100% { - transform: translate3d(100%, 0, 0); - opacity: 0.1; - } -} - -@keyframes popup-bottom-fadein { - 0% { - transform: translate3d(0, 100%, 0); - opacity: 0; - - } - - - 100% { - transform: translate3d(0, 0, 0); - opacity: 1; - } -} - - -@keyframes popup-bottom-fadeout { - 0% { - transform: translate3d(0, 0, 0); - opacity: 1; - } - - - 100% { - transform: translate3d(0, 100%, 0); - opacity: 0.1; - } -} diff --git a/src/segment/index.js b/src/segment/index.js index 19347525..014f0481 100644 --- a/src/segment/index.js +++ b/src/segment/index.js @@ -91,6 +91,8 @@ Component({ * 组件的初始数据 */ data: { + // segment-item 绑定的 data-cell 数据 + _cells:[], tabList: [], currentIndex: 0, _segmentItemInstances: [] @@ -107,16 +109,20 @@ Component({ if (items.length === this.data.tabList.length && this.data._segmentItemInstances.indexOf(segmentItemInstance) > 0) return; let activeKey = val, currentIndex = this.data.currentIndex; + let _cells = []; const tab = items.map((item, index) => { activeKey = !val && index === 0 ? item.data.key : activeKey; currentIndex = item.data.key === activeKey ? index : currentIndex; + // 存储 segment-item 绑定的 data-cell 数据 + _cells[index] = item.dataset.cell; return { ...item.data }; }); this.setData({ - tabList: tab, + _cells, activeKey, + tabList: tab, currentIndex, _segmentItemInstances: items }, () => { @@ -150,7 +156,8 @@ Component({ }); this.triggerEvent('linchange', { activeKey, - currentIndex + currentIndex, + cell:this.data._cells[currentIndex] }); } } diff --git a/src/segment/index.wxml b/src/segment/index.wxml index 3fe28734..74240e79 100644 --- a/src/segment/index.wxml +++ b/src/segment/index.wxml @@ -22,6 +22,6 @@ diff --git a/src/tabs/index.wxml b/src/tabs/index.wxml index b14e25dc..44fce1f5 100644 --- a/src/tabs/index.wxml +++ b/src/tabs/index.wxml @@ -20,8 +20,9 @@ - {{item.tab}}