@nutui/nutui 2.3.3 → 2.3.7-beta.0

package/dist/packages/magic/Cube/CubeItem.vue

@@ -32,202 +32,4 @@ export default {
 };
 </script>
 
-<style lang="scss">
-$module_name: '.cube-item';
-#{$module_name} {
-  height: 90px;
-  width: 88px;
-  // margin-left: auto;
-  // margin-right: 10px;
-  border-radius: 26px;
-  overflow: hidden;
-  position: relative;
-  transform: translateZ(0);
-  &::before {
-    content: '';
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 60px;
-    border-radius: 0 0 26px 26px;
-  }
-  &-box {
-    height: 63px;
-    width: 100%;
-    text-align: center;
-    position: absolute;
-    background: #fff;
-    border-radius: 26px 26px 11px 11px;
-    transform: translateZ(0);
-    background-size: cover;
-    background-repeat: no-repeat;
-    overflow: hidden;
-  }
-
-  .sub-name {
-    width: 100%;
-    position: absolute;
-    top: 63px;
-    padding: 0 10px;
-    box-sizing: border-box;
-    color: #fff;
-    font-size: 14px;
-    text-align: center;
-    line-height: 27px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    transform: translateZ(0);
-  }
-
-  .sub-image {
-    display: block;
-    width: 60px;
-    height: 60px;
-    margin: 0 auto;
-    background-color: #fff;
-    background-position: center;
-    background-size: 100%;
-    transform: translateY(6px);
-  }
-  .sub-desc {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 77px;
-    box-sizing: border-box;
-    height: 15px;
-    color: #fff;
-    border-radius: 6px;
-    font-size: 12px;
-    text-align: center;
-    position: absolute;
-    bottom: 29px;
-    left: 50%;
-    transform-origin: 0 center;
-    transform: translate3d(-50%, 0, 1px);
-    span {
-      width: 100%;
-      display: block;
-      line-height: normal;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      overflow: hidden;
-    }
-  }
-  // 图片
-  &--pic {
-    &::before {
-      background: url('https://img12.360buyimg.com/imagetools/jfs/t1/184083/34/6101/38841/60b065caEaaf7c5d0/eec4cd260f46d9f0.png') no-repeat
-        center/100%;
-      height: 100%;
-    }
-    .cube-item-box {
-      display: none;
-    }
-    .sub-desc {
-      display: none;
-    }
-    .sub-name {
-      display: none;
-    }
-  }
-  // 活动
-  &--act {
-    &::before {
-      background: url('https://img11.360buyimg.com/imagetools/jfs/t1/195605/17/5252/39357/60b065caEe0aa4c7e/04a341f4e51c6a9b.png') no-repeat
-        center/100%;
-    }
-    .sub-desc {
-      background: #ff5c17;
-    }
-  }
-  // 榜单
-  &--rank {
-    &::before {
-      background: url('https://img14.360buyimg.com/imagetools/jfs/t1/183388/37/6207/39741/60b065caEea1440a1/8860c63660fc9ac4.png') no-repeat
-        center/100%;
-    }
-    .sub-desc {
-      background: #1f95fb;
-    }
-  }
-  // shop
-  &--shop {
-    &::before {
-      background: url('https://img12.360buyimg.com/imagetools/jfs/t1/184083/34/6101/38841/60b065caEaaf7c5d0/eec4cd260f46d9f0.png') no-repeat
-        center/100%;
-    }
-    .sub-desc {
-      background: #ffd01f;
-      span {
-        color: #000;
-      }
-    }
-  }
-  // lbs
-  &--lbs {
-    &::before {
-      background: url('https://img10.360buyimg.com/imagetools/jfs/t1/129094/23/18726/38672/60b065caEb849e8cb/da761e3ebae5bc84.png') no-repeat
-        center/100%;
-    }
-    .sub-desc {
-      background: #ffd01f;
-      span {
-        color: #000;
-      }
-    }
-  }
-  // 未读
-  &--unread {
-    box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
-    animation: show 2s infinite;
-  }
-  &--special {
-    background-size: cover;
-    background-repeat: no-repeat;
-    &:before {
-      display: none;
-    }
-    .cube-item-box {
-      display: none;
-    }
-    .sub-desc {
-      display: none;
-    }
-  }
-  @keyframes show {
-    0% {
-      box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
-    }
-    50% {
-      box-shadow: 0 0 20px rgba(255, 255, 255, 0.5);
-    }
-    100% {
-      box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
-    }
-  }
-  @at-root .cube-wrapper--inited {
-    .cube-col {
-      .cube-item {
-        .sub-image {
-          animation: cube-image 0.2s cubic-bezier(0.33, 0, 0.67, 1) 1s forwards;
-        }
-      }
-    }
-  }
-
-  @keyframes cube-image {
-    0% {
-      transform: translateY(13px);
-    }
-    66% {
-      transform: translateY(-5px);
-    }
-    100% {
-      transform: translateY(0);
-    }
-  }
-}
-</style>
+<style lang="scss"></style>

package/dist/packages/magic/Cube/index.vue

@@ -466,146 +466,4 @@ export default {
 };
 </script>
 
-<style lang="scss">
-.adjust-position {
-  margin-top: -20px;
-  margin-bottom: -20px;
-}
-.header-wrap {
-  position: relative;
-  height: 710px;
-  .img-header {
-    position: absolute;
-    bottom: 0;
-    width: 100%;
-  }
-}
-$module_name: '.cube';
-
-#{$module_name} {
-  width: 100%;
-  // position: absolute;
-  z-index: 10;
-
-  &-container {
-    width: 100%;
-    padding: 15px 0;
-    box-sizing: border-box;
-    height: 100%;
-    overflow: hidden;
-  }
-  &-wrapper {
-    width: 100%;
-    white-space: nowrap;
-    perspective: 500px;
-    animation-play-state: paused;
-    transition-property: all;
-    transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
-  }
-  &-col {
-    display: inline-block;
-    width: 25%;
-    box-sizing: border-box;
-    // padding: 0 4px;
-    transition: inherit;
-
-    &--anime:nth-child(5) {
-      #{$module_name}-item-wrap {
-        animation: cube5 560ms cubic-bezier(0.33, 0, 0.67, 1) 1s both;
-      }
-    }
-    @keyframes cube5 {
-      0% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
-        transform: translate3d(733px, 0, 0);
-      }
-      57% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.67, 1);
-        transform: translate3d(-30px, 0, 0);
-      }
-      58% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(-30px, 0, 0);
-      }
-      100% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(0, 0, 0);
-      }
-    }
-
-    &--anime:nth-child(6) {
-      #{$module_name}-item-wrap {
-        animation: cube6 560ms cubic-bezier(0.33, 0, 0.83, 1) 1.08s both;
-      }
-    }
-    @keyframes cube6 {
-      0% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.83, 1);
-        transform: translate3d(554px, 0, 0);
-      }
-      57% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.83, 1);
-        transform: translate3d(-20px, 0, 0);
-      }
-      58% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(-20px, 0, 0);
-      }
-      100% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(0, 0, 0);
-      }
-    }
-
-    &--anime:nth-child(7) {
-      #{$module_name}-item-wrap {
-        animation: cube7 560ms cubic-bezier(0.33, 0, 0.83, 1) 1.16s both;
-      }
-    }
-    @keyframes cube7 {
-      0% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.83, 1);
-        transform: translate3d(378px, 0, 0);
-      }
-      57% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.83, 1);
-        transform: translate3d(-20px, 0, 0);
-      }
-      58% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(-20px, 0, 0);
-      }
-      100% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(0, 0, 0);
-      }
-    }
-    &--anime:nth-child(8) {
-      #{$module_name}-item-wrap {
-        animation: cube8 560ms cubic-bezier(0.33, 0, 0.83, 1) 1.28s both;
-      }
-    }
-    @keyframes cube8 {
-      0% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.83, 1);
-        transform: translate3d(205px, 0, 0);
-      }
-      57% {
-        animation-timing-function: cubic-bezier(0.33, 0, 0.83, 1);
-        transform: translate3d(-20px, 0, 0);
-      }
-      58% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(-20px, 0, 0);
-      }
-      100% {
-        animation-timing-function: cubic-bezier(0.17, 0, 0.67, 1);
-        transform: translate3d(0, 0, 0);
-      }
-    }
-  }
-  &-item-wrap {
-    margin-bottom: 16px;
-  }
-}
-</style>
+<style lang="scss"></style>

package/dist/packages/magic/index.js

@@ -1,8 +1,12 @@
 import Magic from './magic.vue';
+import Cube from './Cube/index.vue';
+import CubeItem from './Cube/CubeItem.vue';
 import './magic.scss';
 
 Magic.install = function(Vue) {
   Vue.component(Magic.name, Magic);
+  Vue.component('Cube', Cube);
+  Vue.component('CubeItem', CubeItem);
 };
 
 export default Magic;

package/dist/packages/magic/magic.css

@@ -1,5 +1,5 @@
 /*!
- * @nutui/nutui v2.3.3 - magic.css, e117e9f35e9fba61a92d, Tue Jun 22 2021 19:07:24 GMT+0800 (中国标准时间)
+ * @nutui/nutui v2.3.7-beta.0 - magic.css, 78f455d4cba8a497b5f5, Mon Oct 25 2021 13:46:52 GMT+0800 (中国标准时间)
  * (c) 2017-2020 JDC
  * Released under the MIT License.
- */.cube-item{height:90px;width:88px;-webkit-border-radius:26px;border-radius:26px;overflow:hidden;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0)}.cube-item:before{content:"";position:absolute;bottom:0;left:0;width:100%;height:60px;-webkit-border-radius:0 0 26px 26px;border-radius:0 0 26px 26px}.cube-item-box{height:63px;background:#fff;-webkit-border-radius:26px 26px 11px 11px;border-radius:26px 26px 11px 11px;background-size:cover;background-repeat:no-repeat}.cube-item-box,.cube-item .sub-name{width:100%;text-align:center;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hidden}.cube-item .sub-name{top:63px;padding:0 10px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;font-size:14px;line-height:27px;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}.cube-item .sub-image{display:block;width:60px;height:60px;margin:0 auto;background-color:#fff;background-position:50%;background-size:100%;-webkit-transform:translateY(6px);-ms-transform:translateY(6px);transform:translateY(6px)}.cube-item .sub-desc{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:77px;-webkit-box-sizing:border-box;box-sizing:border-box;height:15px;color:#fff;-webkit-border-radius:6px;border-radius:6px;font-size:12px;text-align:center;position:absolute;bottom:29px;left:50%;-webkit-transform-origin:0 center;-ms-transform-origin:0 center;transform-origin:0 center;-webkit-transform:translate3d(-50%,0,1px);transform:translate3d(-50%,0,1px)}.cube-item .sub-desc span{width:100%;display:block;line-height:normal;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.cube-item--pic:before{background:url(https://img12.360buyimg.com/imagetools/jfs/t1/184083/34/6101/38841/60b065caEaaf7c5d0/eec4cd260f46d9f0.png) no-repeat 50%/100%;height:100%}.cube-item--pic .cube-item-box,.cube-item--pic .sub-desc,.cube-item--pic .sub-name{display:none}.cube-item--act:before{background:url(https://img11.360buyimg.com/imagetools/jfs/t1/195605/17/5252/39357/60b065caEe0aa4c7e/04a341f4e51c6a9b.png) no-repeat 50%/100%}.cube-item--act .sub-desc{background:#ff5c17}.cube-item--rank:before{background:url(https://img14.360buyimg.com/imagetools/jfs/t1/183388/37/6207/39741/60b065caEea1440a1/8860c63660fc9ac4.png) no-repeat 50%/100%}.cube-item--rank .sub-desc{background:#1f95fb}.cube-item--shop:before{background:url(https://img12.360buyimg.com/imagetools/jfs/t1/184083/34/6101/38841/60b065caEaaf7c5d0/eec4cd260f46d9f0.png) no-repeat 50%/100%}.cube-item--shop .sub-desc{background:#ffd01f}.cube-item--shop .sub-desc span{color:#000}.cube-item--lbs:before{background:url(https://img10.360buyimg.com/imagetools/jfs/t1/129094/23/18726/38672/60b065caEb849e8cb/da761e3ebae5bc84.png) no-repeat 50%/100%}.cube-item--lbs .sub-desc{background:#ffd01f}.cube-item--lbs .sub-desc span{color:#000}.cube-item--unread{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2);-webkit-animation:show 2s infinite;animation:show 2s infinite}.cube-item--special{background-size:cover;background-repeat:no-repeat}.cube-item--special .cube-item-box,.cube-item--special .sub-desc,.cube-item--special:before{display:none}@-webkit-keyframes show{0%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}50%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.5);box-shadow:0 0 20px hsla(0,0%,100%,.5)}to{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}}@keyframes show{0%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}50%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.5);box-shadow:0 0 20px hsla(0,0%,100%,.5)}to{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}}.cube-wrapper--inited .cube-col .cube-item .sub-image{-webkit-animation:cube-image .2s cubic-bezier(.33,0,.67,1) 1s forwards;animation:cube-image .2s cubic-bezier(.33,0,.67,1) 1s forwards}@-webkit-keyframes cube-image{0%{-webkit-transform:translateY(13px);transform:translateY(13px)}66%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes cube-image{0%{-webkit-transform:translateY(13px);transform:translateY(13px)}66%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}.adjust-position{margin-top:-20px;margin-bottom:-20px}.header-wrap{position:relative;height:710px}.header-wrap .img-header{position:absolute;bottom:0;width:100%}.cube{width:100%;z-index:10}.cube-container{width:100%;padding:15px 0;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;overflow:hidden}.cube-wrapper{width:100%;white-space:nowrap;-webkit-perspective:500px;perspective:500px;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-transition-property:all;-o-transition-property:all;transition-property:all;-webkit-transition-timing-function:cubic-bezier(.39,.575,.565,1);-o-transition-timing-function:cubic-bezier(.39,.575,.565,1);transition-timing-function:cubic-bezier(.39,.575,.565,1)}.cube-col{display:inline-block;width:25%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:inherit;-o-transition:inherit;transition:inherit}.cube-col--anime:nth-child(5) .cube-item-wrap{-webkit-animation:cube5 .56s cubic-bezier(.33,0,.67,1) 1s both;animation:cube5 .56s cubic-bezier(.33,0,.67,1) 1s both}@-webkit-keyframes cube5{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(733px,0,0);transform:translate3d(733px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube5{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(733px,0,0);transform:translate3d(733px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-col--anime:nth-child(6) .cube-item-wrap{-webkit-animation:cube6 .56s cubic-bezier(.33,0,.83,1) 1.08s both;animation:cube6 .56s cubic-bezier(.33,0,.83,1) 1.08s both}@-webkit-keyframes cube6{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(554px,0,0);transform:translate3d(554px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube6{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(554px,0,0);transform:translate3d(554px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-col--anime:nth-child(7) .cube-item-wrap{-webkit-animation:cube7 .56s cubic-bezier(.33,0,.83,1) 1.16s both;animation:cube7 .56s cubic-bezier(.33,0,.83,1) 1.16s both}@-webkit-keyframes cube7{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(378px,0,0);transform:translate3d(378px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube7{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(378px,0,0);transform:translate3d(378px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-col--anime:nth-child(8) .cube-item-wrap{-webkit-animation:cube8 .56s cubic-bezier(.33,0,.83,1) 1.28s both;animation:cube8 .56s cubic-bezier(.33,0,.83,1) 1.28s both}@-webkit-keyframes cube8{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(205px,0,0);transform:translate3d(205px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube8{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(205px,0,0);transform:translate3d(205px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-item-wrap{margin-bottom:16px}
+ */.adjust-position{margin-top:-20px;margin-bottom:-20px}.header-wrap{position:relative;height:710px}.header-wrap .img-header{position:absolute;bottom:0;width:100%}.cube-item{height:90px;width:88px;-webkit-border-radius:26px;border-radius:26px;overflow:hidden;position:relative;-webkit-transform:translateZ(0);transform:translateZ(0)}.cube-item:before{content:"";position:absolute;bottom:0;left:0;width:100%;height:60px;-webkit-border-radius:0 0 26px 26px;border-radius:0 0 26px 26px}.cube-item-box{height:63px;background:#fff;-webkit-border-radius:26px 26px 11px 11px;border-radius:26px 26px 11px 11px;background-size:cover;background-repeat:no-repeat}.cube-item-box,.cube-item .sub-name{width:100%;text-align:center;position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0);overflow:hidden}.cube-item .sub-name{top:63px;padding:0 10px;-webkit-box-sizing:border-box;box-sizing:border-box;color:#fff;font-size:14px;line-height:27px;white-space:nowrap;-o-text-overflow:ellipsis;text-overflow:ellipsis}.cube-item .sub-image{display:block;width:60px;height:60px;margin:0 auto;background-color:#fff;background-position:50%;background-size:100%;-webkit-transform:translateY(6px);-ms-transform:translateY(6px);transform:translateY(6px)}.cube-item .sub-desc{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:77px;-webkit-box-sizing:border-box;box-sizing:border-box;height:15px;color:#fff;-webkit-border-radius:6px;border-radius:6px;font-size:12px;text-align:center;position:absolute;bottom:29px;left:50%;-webkit-transform-origin:0 center;-ms-transform-origin:0 center;transform-origin:0 center;-webkit-transform:translate3d(-50%,0,1px);transform:translate3d(-50%,0,1px)}.cube-item .sub-desc span{width:100%;display:block;line-height:normal;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.cube-item--pic:before{background:url(https://img12.360buyimg.com/imagetools/jfs/t1/184083/34/6101/38841/60b065caEaaf7c5d0/eec4cd260f46d9f0.png) no-repeat 50%/100%;height:100%}.cube-item--pic .cube-item-box,.cube-item--pic .sub-desc,.cube-item--pic .sub-name{display:none}.cube-item--act:before{background:url(https://img11.360buyimg.com/imagetools/jfs/t1/195605/17/5252/39357/60b065caEe0aa4c7e/04a341f4e51c6a9b.png) no-repeat 50%/100%}.cube-item--act .sub-desc{background:#ff5c17}.cube-item--rank:before{background:url(https://img14.360buyimg.com/imagetools/jfs/t1/183388/37/6207/39741/60b065caEea1440a1/8860c63660fc9ac4.png) no-repeat 50%/100%}.cube-item--rank .sub-desc{background:#1f95fb}.cube-item--shop:before{background:url(https://img12.360buyimg.com/imagetools/jfs/t1/184083/34/6101/38841/60b065caEaaf7c5d0/eec4cd260f46d9f0.png) no-repeat 50%/100%}.cube-item--shop .sub-desc{background:#ffd01f}.cube-item--shop .sub-desc span{color:#000}.cube-item--lbs:before{background:url(https://img10.360buyimg.com/imagetools/jfs/t1/129094/23/18726/38672/60b065caEb849e8cb/da761e3ebae5bc84.png) no-repeat 50%/100%}.cube-item--lbs .sub-desc{background:#ffd01f}.cube-item--lbs .sub-desc span{color:#000}.cube-item--unread{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2);-webkit-animation:show 2s infinite;animation:show 2s infinite}.cube-item--special{background-size:cover;background-repeat:no-repeat}.cube-item--special .cube-item-box,.cube-item--special .sub-desc,.cube-item--special:before{display:none}@-webkit-keyframes show{0%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}50%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.5);box-shadow:0 0 20px hsla(0,0%,100%,.5)}to{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}}@keyframes show{0%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}50%{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.5);box-shadow:0 0 20px hsla(0,0%,100%,.5)}to{-webkit-box-shadow:0 0 20px hsla(0,0%,100%,.2);box-shadow:0 0 20px hsla(0,0%,100%,.2)}}.cube-wrapper--inited .cube-col .cube-item .sub-image{-webkit-animation:cube-image .2s cubic-bezier(.33,0,.67,1) 1s forwards;animation:cube-image .2s cubic-bezier(.33,0,.67,1) 1s forwards}@-webkit-keyframes cube-image{0%{-webkit-transform:translateY(13px);transform:translateY(13px)}66%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes cube-image{0%{-webkit-transform:translateY(13px);transform:translateY(13px)}66%{-webkit-transform:translateY(-5px);transform:translateY(-5px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}.cube{width:100%;z-index:10}.cube-container{width:100%;padding:15px 0;-webkit-box-sizing:border-box;box-sizing:border-box;height:100%;overflow:hidden}.cube-wrapper{width:100%;white-space:nowrap;-webkit-perspective:500px;perspective:500px;-webkit-animation-play-state:paused;animation-play-state:paused;-webkit-transition-property:all;-o-transition-property:all;transition-property:all;-webkit-transition-timing-function:cubic-bezier(.39,.575,.565,1);-o-transition-timing-function:cubic-bezier(.39,.575,.565,1);transition-timing-function:cubic-bezier(.39,.575,.565,1)}.cube-col{display:inline-block;width:25%;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:inherit;-o-transition:inherit;transition:inherit}.cube-col--anime:nth-child(5) .cube-item-wrap{-webkit-animation:cube5 .56s cubic-bezier(.33,0,.67,1) 1s both;animation:cube5 .56s cubic-bezier(.33,0,.67,1) 1s both}@-webkit-keyframes cube5{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(733px,0,0);transform:translate3d(733px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube5{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(733px,0,0);transform:translate3d(733px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.67,1);animation-timing-function:cubic-bezier(.33,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-col--anime:nth-child(6) .cube-item-wrap{-webkit-animation:cube6 .56s cubic-bezier(.33,0,.83,1) 1.08s both;animation:cube6 .56s cubic-bezier(.33,0,.83,1) 1.08s both}@-webkit-keyframes cube6{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(554px,0,0);transform:translate3d(554px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube6{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(554px,0,0);transform:translate3d(554px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-col--anime:nth-child(7) .cube-item-wrap{-webkit-animation:cube7 .56s cubic-bezier(.33,0,.83,1) 1.16s both;animation:cube7 .56s cubic-bezier(.33,0,.83,1) 1.16s both}@-webkit-keyframes cube7{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(378px,0,0);transform:translate3d(378px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube7{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(378px,0,0);transform:translate3d(378px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-col--anime:nth-child(8) .cube-item-wrap{-webkit-animation:cube8 .56s cubic-bezier(.33,0,.83,1) 1.28s both;animation:cube8 .56s cubic-bezier(.33,0,.83,1) 1.28s both}@-webkit-keyframes cube8{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(205px,0,0);transform:translate3d(205px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes cube8{0%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(205px,0,0);transform:translate3d(205px,0,0)}57%{-webkit-animation-timing-function:cubic-bezier(.33,0,.83,1);animation-timing-function:cubic-bezier(.33,0,.83,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}58%{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}to{-webkit-animation-timing-function:cubic-bezier(.17,0,.67,1);animation-timing-function:cubic-bezier(.17,0,.67,1);-webkit-transform:translateZ(0);transform:translateZ(0)}}.cube-item-wrap{margin-bottom:16px}

package/dist/packages/magic/magic.js

@@ -1,7 +1,7 @@
 /*!
- * @nutui/nutui v2.3.3 - magic.js, e117e9f35e9fba61a92d, Tue Jun 22 2021 19:07:24 GMT+0800 (中国标准时间)
+ * @nutui/nutui v2.3.7-beta.0 - magic.js, 78f455d4cba8a497b5f5, Mon Oct 25 2021 13:46:52 GMT+0800 (中国标准时间)
  * (c) 2017-2020 JDC
  * Released under the MIT License.
  */
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("magic",[],e):"object"==typeof exports?exports.magic=e():t.magic=e()}("undefined"!=typeof self?self:this,(function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(i,r,function(e){return t[e]}.bind(null,r));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="./",n(n.s=159)}({0:function(t,e,n){"use strict";function i(t,e,n,i,r,a,o,s){var c,l="function"==typeof t?t.options:t;if(e&&(l.render=e,l.staticRenderFns=n,l._compiled=!0),i&&(l.functional=!0),a&&(l._scopeId="data-v-"+a),o?(c=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),r&&r.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},l._ssrRegister=c):r&&(c=s?function(){r.call(this,(l.functional?this.parent:this).$root.$options.shadowRoot)}:r),c)if(l.functional){l._injectStyles=c;var u=l.render;l.render=function(t,e){return c.call(e),u(t,e)}}else{var p=l.beforeCreate;l.beforeCreate=p?[].concat(p,c):[c]}return{exports:t,options:l}}n.d(e,"a",(function(){return i}))},13:function(t,e,n){var i=n(9);t.exports=function(t,e){if(t){if("string"==typeof t)return i(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(t,e):void 0}},t.exports.default=t.exports,t.exports.__esModule=!0},154:function(t,e,n){"use strict";n(75)},155:function(t,e,n){"use strict";n(76)},156:function(t,e,n){},159:function(t,e,n){"use strict";n.r(e);var i=n(4),r=n.n(i),a={name:"CubeItem",props:{item:{type:Object,default:null}},data:function(){return{}},methods:{cubeClick:function(t){this.$emit("clickEvent",t)}}},o=(n(154),n(0)),s=Object(o.a)(a,(function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{class:"cube-item cube-item--"+t.item.type,on:{click:function(e){return t.cubeClick(t.item)}}},[n("div",{staticClass:"cube-item-box"},[n("div",{staticClass:"sub-image",style:{backgroundImage:"url("+t.item.pictureUrl+")"}})]),t._v(" "),t.item.desc?n("div",{staticClass:"sub-desc"},[n("span",[t._v(t._s(t.item.desc))])]):t._e(),t._v(" "),t.item.name?n("div",{staticClass:"sub-name"},[n("span",[t._v(t._s(t.item.name))])]):t._e()])}),[],!1,null,null,null).exports;function c(t,e,n,i){return-n*(t/=i)*(t-2)+e}function l(t,e){var n=window.getComputedStyle(t,null),i=n.getPropertyValue("-webkit-"+e)||n.getPropertyValue("-moz-"+e)||n.getPropertyValue("-ms-"+e)||n.getPropertyValue("-o-"+e)||n.getPropertyValue(e);return i&&"none"!=i?i:null}var u={props:{dataMagic:{type:[Object,Array],default:null},type:{type:String,default:"rank"},overflow:{type:[String,Number],default:1.4,validator:function(t){return t>=1&&t<1.5}},autoplay:{type:Boolean,default:!1},interval:{type:[String,Number],default:3e3}},components:{CubeItem:s},data:function(){return{clone:4}},computed:{data_top:function(){return this.dataMagic.filter((function(t,e){return e%2==0}))},data_bottom:function(){return this.dataMagic.filter((function(t,e){return e%2==1}))}},watch:{autoplay:function(t){t?this.startPlay():this.clearPlayer()}},mounted:function(){var t=this;this.$nextTick((function(){t.canMove=!0,t.$wrapper=t.$refs.wrapper,t.$cubes=r()(t.$wrapper.children),t.ITEM_WIDTH=t.$wrapper.clientWidth/4,t.computeWidth={"-2":2*-t.ITEM_WIDTH,"-1":-t.ITEM_WIDTH,0:0,1:t.ITEM_WIDTH,2:2*t.ITEM_WIDTH,3:3*t.ITEM_WIDTH,4:4*t.ITEM_WIDTH,5:5*t.ITEM_WIDTH},t.current=t.clone,t.endX=-t.ITEM_WIDTH*t.current,t.offsetX=t.endX,t.$wrapper.style.transitionDuration=null,t.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})),t.setWrapper(t.endX),t.setCube(t.endX),t.$wrapper.style.webkitPerspectiveOrigin="".concat(t.current*t.ITEM_WIDTH+t.$wrapper.clientWidth/2,"px center"),setTimeout((function(){t.startPlay(),t.$wrapper.classList.add("cube-wrapper--inited")}),1e3),t.bindEvent()})),this.initWQVisibleEvent(),document.addEventListener("visibilitychange",(function(e){e.hidden?t.clearPlayer():t.startPlay()}))},methods:{clickEvent:function(t){this.$emit("clickItem",t)},bindEvent:function(){this.$wrapper.addEventListener("touchstart",this.touchStartHandler),this.$wrapper.addEventListener("touchmove",this.touchMoveHandler),this.$wrapper.addEventListener("touchend",this.touchEndHandler)},initWQVisibleEvent:function(){document.addEventListener("qbrowserVisibilityChange",(function(t){var e=document.createEvent("HTMLEvents");e.initEvent("visibilitychange",!1,!1),e.hidden=t.hidden,document.dispatchEvent(e)}),!0),document.addEventListener("visibilitychange",(function(t){t.hidden=void 0===t.hidden?document.hidden:t.hidden}),!0)},startPlay:function(){var t=this;this.autoplay&&(this.clearPlayer(),this.player=setInterval((function(){t.canMove=!0,t.goto(t.current+1,600,!0)}),this.interval))},clearPlayer:function(){clearInterval(this.player),this.player=null},touchStartHandler:function(t){this.canMove&&(this.clearPlayer(),this.touching=!0,this.$wrapper.style.transitionDuration,this.startX=t.touches[0].pageX,this.startY=t.touches[0].pageY,this.$wrapper.style.transitionDuration=null,this.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})))},touchMoveHandler:function(t){if(this.canMove&&this.touching){var e=t.touches[0].pageX-this.startX,n=t.touches[0].pageY-this.startY;if(Math.abs(n)>1.5*Math.abs(e)||t.cancelable&&t.preventDefault(),(e/=3)>0)this.direction=-1;else{if(!(e<0))return;this.direction=1}this.offsetX=e+this.endX;this.getMiddleRotate(e);this.setWrapper(this.offsetX),this.setCube(this.offsetX,this.offsetX>0?e:-e)}},touchEndHandler:function(t){if(this.canMove&&this.touching){var e,n=this.offsetX%this.ITEM_WIDTH*this.direction;((e=-(e=0==n?this.offsetX/this.ITEM_WIDTH:n>0&&n<this.ITEM_WIDTH*(3/4)||n<0&&n>=-this.ITEM_WIDTH*(1/4)?Math.ceil(this.offsetX/this.ITEM_WIDTH):Math.floor(this.offsetX/this.ITEM_WIDTH)))>=this.data_bottom.length+this.clone||e<=this.clone-1)&&(this.canMove=!1),this.goto(e,400),this.startPlay(),this.touching=!1}},continueTransition:function(){var t=l(this.$wrapper,"transform"),e=l(this.$wrapper,"perspective-origin");t&&this.$wrapper.style.transitionDuration&&(this.$wrapper.style.transform=t,this.$wrapper.style.perspectiveOrigin=e,this.$cubes.forEach((function(t){t.style.transform=l(t,"transform"),t.style.opacity=+l(t,"opacity"),t.style.transformOrigin=l(t,"transform-origin")})),this.endX=0)},setWrapper:function(t,e,n){var i=this;this.offsetX=t,e>0&&(this.$wrapper.style.transitionDuration="".concat(e,"ms")),n?setTimeout((function(){i.$wrapper.style.transform="translate3d(".concat(t,"px, 0, 0)")}),0):this.$wrapper.style.transform="translate3d(".concat(t,"px, 0, 0)")},setCube:function(t){var e=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;this.$cubes.forEach((function(i,r){i.style.transition&&(i.style.transition=null);var a=r*e.ITEM_WIDTH+t;if(a>e.computeWidth[-1]&&a<e.computeWidth[0]){var o=c(a%e.ITEM_WIDTH,0,-e.ITEM_WIDTH,-e.ITEM_WIDTH);i.style.transform="rotateY(".concat(e.getBetweenRotate(a),"deg) translate3d(0, ").concat(e.getTranslate(a),"px, 0)"),i.style.opacity=e.getOpacity(o)}else if(a>e.computeWidth[3]&&a<e.computeWidth[4]){var s=c(a%e.ITEM_WIDTH,0,e.ITEM_WIDTH,e.ITEM_WIDTH);i.style.transform="rotateY(".concat(e.getBetweenRotate(a),"deg) translate3d(0, ").concat(e.getTranslate(a),"px, 0)"),i.style.opacity=e.getOpacity(s)}else a>=e.computeWidth[4]&&a<e.computeWidth[5]?(i.style.transform="rotateY(60deg) translate3d(0, ".concat(e.getTranslate(a),"px, 0)"),i.style.opacity=0):a>e.computeWidth[-2]&&a<=e.computeWidth[-1]?(i.style.transform="rotateY(-60deg) translate3d(0, ".concat(e.getTranslate(a),"px, 0)"),i.style.opacity=0):a>=e.computeWidth[0]&&a<=e.computeWidth[3]&&(i.style.transform="rotateY(".concat(e.getMiddleRotate(n),"deg) translate3d(0, ").concat(e.getTranslate(a),"px, 0)"),i.style.opacity=1);i.style.transformOrigin=e.getTransformOrigin(a)}))},getTransformOrigin:function(t,e){if(t>=this.computeWidth[-1]&&t<=this.computeWidth[4]){var n=this.ITEM_WIDTH-t/3;return n<this.computeWidth[0]?n=this.computeWidth[0]:n>this.computeWidth[1]&&(n=this.computeWidth[1]),"".concat(n,"px center")}},getBetweenRotate:function(t){return t%this.ITEM_WIDTH*(360/this.$wrapper.clientWidth)*70/90},getMiddleRotate:function(t){var e=.35;return t>5*this.ITEM_WIDTH/10?.35*(this.ITEM_WIDTH-t):t<5*-this.ITEM_WIDTH/10?-.35*(this.ITEM_WIDTH+t):e*t},getOpacity:function(t){return 1-Math.abs(t)/this.ITEM_WIDTH%1},getTranslate:function(t){return t>this.computeWidth[2]?t>this.computeWidth[3]?(this.computeWidth[3]-t)/5:(this.computeWidth[3]-t)/7:t<this.computeWidth[1]?t<0?t/5:t/7:this.ITEM_WIDTH/7},transitionEndHandler:function(t){var e=this;t.target===this.$wrapper&&(this.$wrapper.style.transitionDuration=null,this.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})),this.$wrapper.style.webkitPerspectiveOrigin="".concat(this.current*this.ITEM_WIDTH+this.$wrapper.clientWidth/2,"px center"),this.current>=this.data_bottom.length+this.clone?(this.goto(this.current%this.data_bottom.length,0),setTimeout((function(){e.canMove=!0}),0)):this.current<=this.clone-1&&(this.goto(this.data_bottom.length+this.current,0),setTimeout((function(){e.canMove=!0}),0)))},goto:function(t){var e=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:400,i=arguments.length>2?arguments[2]:void 0,r=i?t-.5:t;this.$wrapper.style.webkitPerspectiveOrigin="".concat(r*this.ITEM_WIDTH+this.$wrapper.clientWidth/2,"px center"),this.current=t,this.endX=-t*this.ITEM_WIDTH,n?(this.setWrapper(this.endX,n),this.$cubes.forEach((function(r,a){var o=a*e.ITEM_WIDTH+e.endX;r.style.transformOrigin=e.getTransformOrigin(o),t-1==a?(r.style.transition="all ".concat(n,"ms cubic-bezier(0.215, 0.610, 0.355, 1.000)"),r.style.transform="rotateY(-60deg) translate3d(0, ".concat(e.getTranslate(r.offsetLeft+e.endX),"px, 0)"),r.style.opacity=0):t+4==a?(r.style.transition="all ".concat(n,"ms cubic-bezier(0.215, 0.610, 0.355, 1.000)"),r.style.transform="rotateY(60deg) translate3d(0, ".concat(e.getTranslate(r.offsetLeft+e.endX),"px, 0)"),r.style.opacity=0):a>t-1&&a<t+4?(r.style.transition=i?"transform ".concat(n,"ms cubic-bezier(0.22, 0.01, 0.68, 1.00), opacity ").concat(.9*n,"ms cubic-bezier(0.62, 0.02, 0.68, 1.00)"):"all ".concat(n,"ms cubic-bezier(0.390, 0.575, 0.565, 1.000)"),r.style.transform="rotateY(0.1deg) translate3d(0, ".concat(e.getTranslate(r.offsetLeft+e.endX),"px, 0)"),r.style.opacity=1):(r.style.transition=null,r.style.transform=null,r.style.opacity=null,r.style.transformOrigin=null)}))):(this.$wrapper.style.transitionDuration=null,this.$wrapper.style.transitionDuration=null,this.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})),this.setCube(this.endX,0),this.setWrapper(this.endX,0,!0))}}},p=(n(155),{name:"nut-magic",components:{Cube:Object(o.a)(u,(function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"cube"},[n("div",{ref:"container",staticClass:"adjust-position cube-container"},[n("div",{ref:"wrapper",staticClass:"cube-wrapper",on:{transitionend:t.transitionEndHandler}},[t._l(t.clone,(function(e){return n("div",{key:"clone-prev-"+e,staticClass:"cube-col"},[n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_top[e+t.data_bottom.length-t.clone-1]},on:{clickEvent:t.clickEvent}}),t._v(" "),n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_bottom[e+t.data_bottom.length-t.clone-1]},on:{clickEvent:t.clickEvent}})],1)})),t._v(" "),t._l(t.data_bottom,(function(e,i){return n("div",{key:i,staticClass:"cube-col cube-col--anime"},[n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_top[i]},on:{clickEvent:t.clickEvent}}),t._v(" "),n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_bottom[i]},on:{clickEvent:t.clickEvent}})],1)})),t._v(" "),t._l(t.data_bottom.slice(0,t.clone),(function(e,i){return n("div",{key:"clone-next-"+i,staticClass:"cube-col"},[n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_top[i]},on:{clickEvent:t.clickEvent}}),t._v(" "),n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_bottom[i]},on:{clickEvent:t.clickEvent}})],1)}))],2)])])}),[],!1,null,null,null).exports},props:{data:{type:[Object,Array],default:function(){return[]}},type:{type:String,default:"rank"},autoplay:{default:!0}},computed:{},data:function(){return{}},watch:{data:function(t,e){}},methods:{clickItem:function(t){this.$emit("click",t)}}}),d=Object(o.a)(p,(function(){var t=this.$createElement,e=this._self._c||t;return this.data&&this.data.length>=8?e("Cube",{attrs:{dataMagic:this.data,type:this.type,autoplay:this.autoplay},on:{clickItem:this.clickItem}}):this._e()}),[],!1,null,"601c4726",null).exports;n(156);d.install=function(t){t.component(d.name,d)};e.default=d},4:function(t,e,n){var i=n(46),r=n(47),a=n(13),o=n(48);t.exports=function(t){return i(t)||r(t)||a(t)||o()},t.exports.default=t.exports,t.exports.__esModule=!0},46:function(t,e,n){var i=n(9);t.exports=function(t){if(Array.isArray(t))return i(t)},t.exports.default=t.exports,t.exports.__esModule=!0},47:function(t,e){t.exports=function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)},t.exports.default=t.exports,t.exports.__esModule=!0},48:function(t,e){t.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},t.exports.default=t.exports,t.exports.__esModule=!0},75:function(t,e,n){},76:function(t,e,n){},9:function(t,e){t.exports=function(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i},t.exports.default=t.exports,t.exports.__esModule=!0}})}));
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("magic",[],e):"object"==typeof exports?exports.magic=e():t.magic=e()}("undefined"!=typeof self?self:this,(function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var r=e[i]={i:i,l:!1,exports:{}};return t[i].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)n.d(i,r,function(e){return t[e]}.bind(null,r));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="./",n(n.s=158)}({0:function(t,e,n){"use strict";function i(t,e,n,i,r,a,o,s){var c,l="function"==typeof t?t.options:t;if(e&&(l.render=e,l.staticRenderFns=n,l._compiled=!0),i&&(l.functional=!0),a&&(l._scopeId="data-v-"+a),o?(c=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),r&&r.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},l._ssrRegister=c):r&&(c=s?function(){r.call(this,(l.functional?this.parent:this).$root.$options.shadowRoot)}:r),c)if(l.functional){l._injectStyles=c;var u=l.render;l.render=function(t,e){return c.call(e),u(t,e)}}else{var p=l.beforeCreate;l.beforeCreate=p?[].concat(p,c):[c]}return{exports:t,options:l}}n.d(e,"a",(function(){return i}))},13:function(t,e,n){var i=n(9);t.exports=function(t,e){if(t){if("string"==typeof t)return i(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(t,e):void 0}},t.exports.default=t.exports,t.exports.__esModule=!0},154:function(t,e,n){},158:function(t,e,n){"use strict";n.r(e);var i=n(4),r=n.n(i),a={name:"CubeItem",props:{item:{type:Object,default:null}},data:function(){return{}},methods:{cubeClick:function(t){this.$emit("clickEvent",t)}}},o=n(0),s=Object(o.a)(a,(function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{class:"cube-item cube-item--"+t.item.type,on:{click:function(e){return t.cubeClick(t.item)}}},[n("div",{staticClass:"cube-item-box"},[n("div",{staticClass:"sub-image",style:{backgroundImage:"url("+t.item.pictureUrl+")"}})]),t._v(" "),t.item.desc?n("div",{staticClass:"sub-desc"},[n("span",[t._v(t._s(t.item.desc))])]):t._e(),t._v(" "),t.item.name?n("div",{staticClass:"sub-name"},[n("span",[t._v(t._s(t.item.name))])]):t._e()])}),[],!1,null,null,null).exports;function c(t,e,n,i){return-n*(t/=i)*(t-2)+e}function l(t,e){var n=window.getComputedStyle(t,null),i=n.getPropertyValue("-webkit-"+e)||n.getPropertyValue("-moz-"+e)||n.getPropertyValue("-ms-"+e)||n.getPropertyValue("-o-"+e)||n.getPropertyValue(e);return i&&"none"!=i?i:null}var u={props:{dataMagic:{type:[Object,Array],default:null},type:{type:String,default:"rank"},overflow:{type:[String,Number],default:1.4,validator:function(t){return t>=1&&t<1.5}},autoplay:{type:Boolean,default:!1},interval:{type:[String,Number],default:3e3}},components:{CubeItem:s},data:function(){return{clone:4}},computed:{data_top:function(){return this.dataMagic.filter((function(t,e){return e%2==0}))},data_bottom:function(){return this.dataMagic.filter((function(t,e){return e%2==1}))}},watch:{autoplay:function(t){t?this.startPlay():this.clearPlayer()}},mounted:function(){var t=this;this.$nextTick((function(){t.canMove=!0,t.$wrapper=t.$refs.wrapper,t.$cubes=r()(t.$wrapper.children),t.ITEM_WIDTH=t.$wrapper.clientWidth/4,t.computeWidth={"-2":2*-t.ITEM_WIDTH,"-1":-t.ITEM_WIDTH,0:0,1:t.ITEM_WIDTH,2:2*t.ITEM_WIDTH,3:3*t.ITEM_WIDTH,4:4*t.ITEM_WIDTH,5:5*t.ITEM_WIDTH},t.current=t.clone,t.endX=-t.ITEM_WIDTH*t.current,t.offsetX=t.endX,t.$wrapper.style.transitionDuration=null,t.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})),t.setWrapper(t.endX),t.setCube(t.endX),t.$wrapper.style.webkitPerspectiveOrigin="".concat(t.current*t.ITEM_WIDTH+t.$wrapper.clientWidth/2,"px center"),setTimeout((function(){t.startPlay(),t.$wrapper.classList.add("cube-wrapper--inited")}),1e3),t.bindEvent()})),this.initWQVisibleEvent(),document.addEventListener("visibilitychange",(function(e){e.hidden?t.clearPlayer():t.startPlay()}))},methods:{clickEvent:function(t){this.$emit("clickItem",t)},bindEvent:function(){this.$wrapper.addEventListener("touchstart",this.touchStartHandler),this.$wrapper.addEventListener("touchmove",this.touchMoveHandler),this.$wrapper.addEventListener("touchend",this.touchEndHandler)},initWQVisibleEvent:function(){document.addEventListener("qbrowserVisibilityChange",(function(t){var e=document.createEvent("HTMLEvents");e.initEvent("visibilitychange",!1,!1),e.hidden=t.hidden,document.dispatchEvent(e)}),!0),document.addEventListener("visibilitychange",(function(t){t.hidden=void 0===t.hidden?document.hidden:t.hidden}),!0)},startPlay:function(){var t=this;this.autoplay&&(this.clearPlayer(),this.player=setInterval((function(){t.canMove=!0,t.goto(t.current+1,600,!0)}),this.interval))},clearPlayer:function(){clearInterval(this.player),this.player=null},touchStartHandler:function(t){this.canMove&&(this.clearPlayer(),this.touching=!0,this.$wrapper.style.transitionDuration,this.startX=t.touches[0].pageX,this.startY=t.touches[0].pageY,this.$wrapper.style.transitionDuration=null,this.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})))},touchMoveHandler:function(t){if(this.canMove&&this.touching){var e=t.touches[0].pageX-this.startX,n=t.touches[0].pageY-this.startY;if(Math.abs(n)>1.5*Math.abs(e)||t.cancelable&&t.preventDefault(),(e/=3)>0)this.direction=-1;else{if(!(e<0))return;this.direction=1}this.offsetX=e+this.endX;this.getMiddleRotate(e);this.setWrapper(this.offsetX),this.setCube(this.offsetX,this.offsetX>0?e:-e)}},touchEndHandler:function(t){if(this.canMove&&this.touching){var e,n=this.offsetX%this.ITEM_WIDTH*this.direction;((e=-(e=0==n?this.offsetX/this.ITEM_WIDTH:n>0&&n<this.ITEM_WIDTH*(3/4)||n<0&&n>=-this.ITEM_WIDTH*(1/4)?Math.ceil(this.offsetX/this.ITEM_WIDTH):Math.floor(this.offsetX/this.ITEM_WIDTH)))>=this.data_bottom.length+this.clone||e<=this.clone-1)&&(this.canMove=!1),this.goto(e,400),this.startPlay(),this.touching=!1}},continueTransition:function(){var t=l(this.$wrapper,"transform"),e=l(this.$wrapper,"perspective-origin");t&&this.$wrapper.style.transitionDuration&&(this.$wrapper.style.transform=t,this.$wrapper.style.perspectiveOrigin=e,this.$cubes.forEach((function(t){t.style.transform=l(t,"transform"),t.style.opacity=+l(t,"opacity"),t.style.transformOrigin=l(t,"transform-origin")})),this.endX=0)},setWrapper:function(t,e,n){var i=this;this.offsetX=t,e>0&&(this.$wrapper.style.transitionDuration="".concat(e,"ms")),n?setTimeout((function(){i.$wrapper.style.transform="translate3d(".concat(t,"px, 0, 0)")}),0):this.$wrapper.style.transform="translate3d(".concat(t,"px, 0, 0)")},setCube:function(t){var e=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;this.$cubes.forEach((function(i,r){i.style.transition&&(i.style.transition=null);var a=r*e.ITEM_WIDTH+t;if(a>e.computeWidth[-1]&&a<e.computeWidth[0]){var o=c(a%e.ITEM_WIDTH,0,-e.ITEM_WIDTH,-e.ITEM_WIDTH);i.style.transform="rotateY(".concat(e.getBetweenRotate(a),"deg) translate3d(0, ").concat(e.getTranslate(a),"px, 0)"),i.style.opacity=e.getOpacity(o)}else if(a>e.computeWidth[3]&&a<e.computeWidth[4]){var s=c(a%e.ITEM_WIDTH,0,e.ITEM_WIDTH,e.ITEM_WIDTH);i.style.transform="rotateY(".concat(e.getBetweenRotate(a),"deg) translate3d(0, ").concat(e.getTranslate(a),"px, 0)"),i.style.opacity=e.getOpacity(s)}else a>=e.computeWidth[4]&&a<e.computeWidth[5]?(i.style.transform="rotateY(60deg) translate3d(0, ".concat(e.getTranslate(a),"px, 0)"),i.style.opacity=0):a>e.computeWidth[-2]&&a<=e.computeWidth[-1]?(i.style.transform="rotateY(-60deg) translate3d(0, ".concat(e.getTranslate(a),"px, 0)"),i.style.opacity=0):a>=e.computeWidth[0]&&a<=e.computeWidth[3]&&(i.style.transform="rotateY(".concat(e.getMiddleRotate(n),"deg) translate3d(0, ").concat(e.getTranslate(a),"px, 0)"),i.style.opacity=1);i.style.transformOrigin=e.getTransformOrigin(a)}))},getTransformOrigin:function(t,e){if(t>=this.computeWidth[-1]&&t<=this.computeWidth[4]){var n=this.ITEM_WIDTH-t/3;return n<this.computeWidth[0]?n=this.computeWidth[0]:n>this.computeWidth[1]&&(n=this.computeWidth[1]),"".concat(n,"px center")}},getBetweenRotate:function(t){return t%this.ITEM_WIDTH*(360/this.$wrapper.clientWidth)*70/90},getMiddleRotate:function(t){var e=.35;return t>5*this.ITEM_WIDTH/10?.35*(this.ITEM_WIDTH-t):t<5*-this.ITEM_WIDTH/10?-.35*(this.ITEM_WIDTH+t):e*t},getOpacity:function(t){return 1-Math.abs(t)/this.ITEM_WIDTH%1},getTranslate:function(t){return t>this.computeWidth[2]?t>this.computeWidth[3]?(this.computeWidth[3]-t)/5:(this.computeWidth[3]-t)/7:t<this.computeWidth[1]?t<0?t/5:t/7:this.ITEM_WIDTH/7},transitionEndHandler:function(t){var e=this;t.target===this.$wrapper&&(this.$wrapper.style.transitionDuration=null,this.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})),this.$wrapper.style.webkitPerspectiveOrigin="".concat(this.current*this.ITEM_WIDTH+this.$wrapper.clientWidth/2,"px center"),this.current>=this.data_bottom.length+this.clone?(this.goto(this.current%this.data_bottom.length,0),setTimeout((function(){e.canMove=!0}),0)):this.current<=this.clone-1&&(this.goto(this.data_bottom.length+this.current,0),setTimeout((function(){e.canMove=!0}),0)))},goto:function(t){var e=this,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:400,i=arguments.length>2?arguments[2]:void 0,r=i?t-.5:t;this.$wrapper.style.webkitPerspectiveOrigin="".concat(r*this.ITEM_WIDTH+this.$wrapper.clientWidth/2,"px center"),this.current=t,this.endX=-t*this.ITEM_WIDTH,n?(this.setWrapper(this.endX,n),this.$cubes.forEach((function(r,a){var o=a*e.ITEM_WIDTH+e.endX;r.style.transformOrigin=e.getTransformOrigin(o),t-1==a?(r.style.transition="all ".concat(n,"ms cubic-bezier(0.215, 0.610, 0.355, 1.000)"),r.style.transform="rotateY(-60deg) translate3d(0, ".concat(e.getTranslate(r.offsetLeft+e.endX),"px, 0)"),r.style.opacity=0):t+4==a?(r.style.transition="all ".concat(n,"ms cubic-bezier(0.215, 0.610, 0.355, 1.000)"),r.style.transform="rotateY(60deg) translate3d(0, ".concat(e.getTranslate(r.offsetLeft+e.endX),"px, 0)"),r.style.opacity=0):a>t-1&&a<t+4?(r.style.transition=i?"transform ".concat(n,"ms cubic-bezier(0.22, 0.01, 0.68, 1.00), opacity ").concat(.9*n,"ms cubic-bezier(0.62, 0.02, 0.68, 1.00)"):"all ".concat(n,"ms cubic-bezier(0.390, 0.575, 0.565, 1.000)"),r.style.transform="rotateY(0.1deg) translate3d(0, ".concat(e.getTranslate(r.offsetLeft+e.endX),"px, 0)"),r.style.opacity=1):(r.style.transition=null,r.style.transform=null,r.style.opacity=null,r.style.transformOrigin=null)}))):(this.$wrapper.style.transitionDuration=null,this.$wrapper.style.transitionDuration=null,this.$cubes.forEach((function(t,e){t.style.transition&&(t.style.transition=null)})),this.setCube(this.endX,0),this.setWrapper(this.endX,0,!0))}}},p=Object(o.a)(u,(function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"cube"},[n("div",{ref:"container",staticClass:"adjust-position cube-container"},[n("div",{ref:"wrapper",staticClass:"cube-wrapper",on:{transitionend:t.transitionEndHandler}},[t._l(t.clone,(function(e){return n("div",{key:"clone-prev-"+e,staticClass:"cube-col"},[n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_top[e+t.data_bottom.length-t.clone-1]},on:{clickEvent:t.clickEvent}}),t._v(" "),n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_bottom[e+t.data_bottom.length-t.clone-1]},on:{clickEvent:t.clickEvent}})],1)})),t._v(" "),t._l(t.data_bottom,(function(e,i){return n("div",{key:i,staticClass:"cube-col cube-col--anime"},[n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_top[i]},on:{clickEvent:t.clickEvent}}),t._v(" "),n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_bottom[i]},on:{clickEvent:t.clickEvent}})],1)})),t._v(" "),t._l(t.data_bottom.slice(0,t.clone),(function(e,i){return n("div",{key:"clone-next-"+i,staticClass:"cube-col"},[n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_top[i]},on:{clickEvent:t.clickEvent}}),t._v(" "),n("CubeItem",{staticClass:"cube-item-wrap",attrs:{item:t.data_bottom[i]},on:{clickEvent:t.clickEvent}})],1)}))],2)])])}),[],!1,null,null,null).exports,d={name:"nut-magic",components:{Cube:p},props:{data:{type:[Object,Array],default:function(){return[]}},type:{type:String,default:"rank"},autoplay:{default:!0}},computed:{},data:function(){return{}},watch:{data:function(t,e){}},methods:{clickItem:function(t){this.$emit("click",t)}}},h=Object(o.a)(d,(function(){var t=this.$createElement,e=this._self._c||t;return this.data&&this.data.length>=8?e("Cube",{attrs:{dataMagic:this.data,type:this.type,autoplay:this.autoplay},on:{clickItem:this.clickItem}}):this._e()}),[],!1,null,"601c4726",null).exports;n(154);h.install=function(t){t.component(h.name,h),t.component("Cube",p),t.component("CubeItem",s)};e.default=h},4:function(t,e,n){var i=n(46),r=n(47),a=n(13),o=n(48);t.exports=function(t){return i(t)||r(t)||a(t)||o()},t.exports.default=t.exports,t.exports.__esModule=!0},46:function(t,e,n){var i=n(9);t.exports=function(t){if(Array.isArray(t))return i(t)},t.exports.default=t.exports,t.exports.__esModule=!0},47:function(t,e){t.exports=function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)},t.exports.default=t.exports,t.exports.__esModule=!0},48:function(t,e){t.exports=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")},t.exports.default=t.exports,t.exports.__esModule=!0},9:function(t,e){t.exports=function(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i},t.exports.default=t.exports,t.exports.__esModule=!0}})}));
 //# sourceMappingURL=magic.js.map