{"version":3,"sources":["webpack:///./src/views/moment/MomentimagePage/images6.vue?b5ab","webpack:///src/views/moment/MomentimagePage/images6.vue","webpack:///./src/views/moment/MomentimagePage/images6.vue?e1fb","webpack:///./src/views/moment/MomentimagePage/images6.vue","webpack:///./src/views/moment/MomentimagePage/images6.vue?b4c9"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","ref","attrs","swiperOptionTop","_l","item","i","key","style","slot","swiperOptionThumbs","staticRenderFns","component"],"mappings":"kJAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,aAAa,CAACF,EAAG,MAAM,CAACE,YAAY,QAAQ,CAACF,EAAG,MAAM,CAACE,YAAY,iBAAiB,CAACF,EAAG,SAAS,CAACG,IAAI,YAAYD,YAAY,qBAAqBE,MAAM,CAAC,QAAUR,EAAIS,kBAAkB,CAACT,EAAIU,GAAIV,EAAW,SAAE,SAASW,EAAKC,GAAG,OAAOR,EAAG,eAAe,CAACS,IAAID,EAAEN,YAAY,UAAUQ,MAAM,CAAG,mBAAoB,OAAQH,EAAM,UAAUP,EAAG,MAAM,CAACE,YAAY,yCAAyCE,MAAM,CAAC,KAAO,eAAeO,KAAK,gBAAgBX,EAAG,MAAM,CAACE,YAAY,yCAAyCE,MAAM,CAAC,KAAO,eAAeO,KAAK,iBAAiB,GAAGX,EAAG,SAAS,CAACG,IAAI,eAAeD,YAAY,wBAAwBE,MAAM,CAAC,QAAUR,EAAIgB,qBAAqBhB,EAAIU,GAAIV,EAAW,SAAE,SAASW,EAAKC,GAAG,OAAOR,EAAG,eAAe,CAACS,IAAID,EAAEN,YAAY,UAAUQ,MAAM,CAAG,mBAAoB,OAAQH,EAAM,UAAU,IAAI,QACv6BM,EAAkB,G,YC4BtB,G,UAAA,CACE,KAAF,gCACE,MAAF,sCACE,WAAF,CACI,OAAJ,YACI,YAAJ,kBAEE,KAPF,WAQI,MAAJ,CACM,gBAAN,CACQ,MAAR,EACQ,aAAR,EACQ,aAAR,GACQ,WAAR,CACU,OAAV,sBACU,OAAV,uBAEQ,KAAR,CACU,cAAV,IAGM,mBAAN,CACQ,MAAR,EACQ,aAAR,EACQ,aAAR,GACQ,gBAAR,EACQ,cAAR,OACQ,WAAR,GACQ,qBAAR,GAEM,QAAN,CACA,yCACA,yCACA,yCACA,yCACA,yCACA,yCACA,yCACA,yCACA,yCACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,0CACA,6CAIE,QA5EF,WA4EI,IAAJ,OACI,KAAJ,sBACM,IAAN,4BACA,+BACM,EAAN,qBACM,EAAN,2BC9G+W,I,wBCQ3WC,EAAY,eACd,EACAnB,EACAkB,GACA,EACA,KACA,WACA,MAIa,aAAAC,E,2CCnBf,yBAAmlB,EAAG","file":"js/chunk-578befdc.712f9a18.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"container\"},[_c('div',{staticClass:\"main\"},[_c('div',{staticClass:\"thumb-example\"},[_c('swiper',{ref:\"swiperTop\",staticClass:\"swiper gallery-top\",attrs:{\"options\":_vm.swiperOptionTop}},[_vm._l((_vm.picData),function(item,i){return _c('swiper-slide',{key:i,staticClass:\"slide-2\",style:({ 'background-image': 'url('+ item +')'})})}),_c('div',{staticClass:\"swiper-button-next swiper-button-white\",attrs:{\"slot\":\"button-next\"},slot:\"button-next\"}),_c('div',{staticClass:\"swiper-button-prev swiper-button-white\",attrs:{\"slot\":\"button-prev\"},slot:\"button-prev\"})],2),_c('swiper',{ref:\"swiperThumbs\",staticClass:\"swiper gallery-thumbs\",attrs:{\"options\":_vm.swiperOptionThumbs}},_vm._l((_vm.picData),function(item,i){return _c('swiper-slide',{key:i,staticClass:\"slide-2\",style:({ 'background-image': 'url('+ item +')'})})}),1)],1)])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n<div class=\"container\">\n  <div class=\"main\">\n    <div class=\"thumb-example\">\n\n      <swiper class=\"swiper gallery-top\" :options=\"swiperOptionTop\" ref=\"swiperTop\">\n        <swiper-slide class=\"slide-2\" \n          v-for=\"(item,i) in picData\" :key=\"i\"\n          :style=\"{ 'background-image': 'url('+ item +')'}\"   \n        ></swiper-slide>\n        <div class=\"swiper-button-next swiper-button-white\" slot=\"button-next\"></div>\n        <div class=\"swiper-button-prev swiper-button-white\" slot=\"button-prev\"></div>\n      </swiper>\n      <!-- swiper2 Thumbs -->\n      <swiper class=\"swiper gallery-thumbs\" :options=\"swiperOptionThumbs\" ref=\"swiperThumbs\">\n        <swiper-slide class=\"slide-2\" v-for=\"(item,i) in picData\" :key=\"i\" \n          :style=\"{ 'background-image': 'url('+ item +')'}\">  \n        </swiper-slide>\n      </swiper>\n\n    </div>\n  </div>\n</div>\n\n</template>\n\n<script>\n  import { Swiper, SwiperSlide } from 'vue-awesome-swiper'\n  import 'swiper/css/swiper.css'\n  export default {\n    name: 'swiper-example-thumbs-gallery',\n    title: 'Thumbs gallery with Two-way control',\n    components: {\n      Swiper,\n      SwiperSlide\n    },\n    data() {\n      return {\n        swiperOptionTop: {\n          loop: true,\n          loopedSlides: 5, // looped slides should be the same\n          spaceBetween: 10,\n          navigation: {\n            nextEl: '.swiper-button-next',\n            prevEl: '.swiper-button-prev'\n          },\n          lazy: {\n            loadPrevNext: true\n          },\n        },\n        swiperOptionThumbs: {\n          loop: true,\n          loopedSlides: 5, // looped slides should be the same\n          spaceBetween: 10,\n          centeredSlides: true,\n          slidesPerView: 'auto',\n          touchRatio: 0.2,\n          slideToClickedSlide: true ,\n        } ,\n        picData : [\n          'http://images.dixcel.cn/2017赛事精选/1.jpg',\n          'http://images.dixcel.cn/2017赛事精选/2.jpg',\n          'http://images.dixcel.cn/2017赛事精选/3.jpg',\n          'http://images.dixcel.cn/2017赛事精选/4.jpg',\n          'http://images.dixcel.cn/2017赛事精选/5.jpg',\n          'http://images.dixcel.cn/2017赛事精选/6.jpg',\n          'http://images.dixcel.cn/2017赛事精选/7.jpg',\n          'http://images.dixcel.cn/2017赛事精选/8.jpg',\n          'http://images.dixcel.cn/2017赛事精选/9.jpg',\n          'http://images.dixcel.cn/2017赛事精选/10.jpg',\n          'http://images.dixcel.cn/2017赛事精选/11.jpg',\n          'http://images.dixcel.cn/2017赛事精选/12.jpg',\n          'http://images.dixcel.cn/2017赛事精选/13.jpg',\n          'http://images.dixcel.cn/2017赛事精选/14.jpg',\n          'http://images.dixcel.cn/2017赛事精选/15.jpg',\n          'http://images.dixcel.cn/2017赛事精选/16.jpg',\n          'http://images.dixcel.cn/2017赛事精选/17.jpg',\n          'http://images.dixcel.cn/2017赛事精选/18.jpg',\n          'http://images.dixcel.cn/2017赛事精选/19.jpg',\n          'http://images.dixcel.cn/2017赛事精选/20.jpg',\n          'http://images.dixcel.cn/2017赛事精选/21.jpg',\n          'http://images.dixcel.cn/2017赛事精选/22.jpg',\n          'http://images.dixcel.cn/2017赛事精选/23.jpg',\n          'http://images.dixcel.cn/2017赛事精选/24.jpg',\n          'http://images.dixcel.cn/2017赛事精选/25.jpg',\n          'http://images.dixcel.cn/2017赛事精选/26.jpg',\n          'http://images.dixcel.cn/2017赛事精选/27.jpg',\n          'http://images.dixcel.cn/2017赛事精选/28.jpg',\n          'http://images.dixcel.cn/2017赛事精选/29.jpg',\n          'http://images.dixcel.cn/2017赛事精选/30.jpg',\n          'http://images.dixcel.cn/2017赛事精选/31.jpg',\n          'http://images.dixcel.cn/2017赛事精选/32.jpg',\n          'http://images.dixcel.cn/2017赛事精选/33.jpg',\n          'http://images.dixcel.cn/2017赛事精选/34.jpg',\n          'http://images.dixcel.cn/2017赛事精选/35.jpg',\n          'http://images.dixcel.cn/2017赛事精选/36.jpg',\n          'http://images.dixcel.cn/2017赛事精选/37.jpg',\n          'http://images.dixcel.cn/2017赛事精选/38.jpg',\n          'http://images.dixcel.cn/2017赛事精选/39.jpg',\n          'http://images.dixcel.cn/2017赛事精选/40.jpg',\n          'http://images.dixcel.cn/2017赛事精选/41.jpg',\n          'http://images.dixcel.cn/2017赛事精选/42.jpg',\n        ]\n      }\n    },\n    mounted() {\n      this.$nextTick(() => {\n        const swiperTop = this.$refs.swiperTop.$swiper\n        const swiperThumbs = this.$refs.swiperThumbs.$swiper\n        swiperTop.controller.control = swiperThumbs\n        swiperThumbs.controller.control = swiperTop\n      })\n    }\n  }\n</script>\n\n<style lang=\"stylus\" scoped>\n  .container\n    background-color : #000\n    .box_one \n      width: 100%;\n\n    .box_bottom\n      width: 100%;\n      background-color #000\n\n\n  .main {\n    margin-bottom: 5px;\n    width: 1003px;\n    background-color: #fff;\n    margin: 0 auto;\n    position: relative;\n    box-sizing: border-box;\n    padding: 62px 50px 52px;\n  }\n\n  .thumb-example {\n    height: 680px;\n    background-color: $black;\n  }\n  .swiper {\n    .swiper-slide {\n      background-size: 100%;\n      background-position: center center;\n      background-repeat no-repeat\n    }\n    &.gallery-top {\n      height: 80%;\n      width: 100%;\n    }\n    &.gallery-thumbs {\n      height: 20%;\n      box-sizing: border-box;\n      padding: $gap 0;\n    }\n    &.gallery-thumbs .swiper-slide {\n      width: 20%;\n      height: 100%;\n      opacity: 0.4;\n    }\n    &.gallery-thumbs .swiper-slide-active {\n      opacity: 1;\n    }\n  }\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./images6.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./images6.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./images6.vue?vue&type=template&id=05e049e4&scoped=true&\"\nimport script from \"./images6.vue?vue&type=script&lang=js&\"\nexport * from \"./images6.vue?vue&type=script&lang=js&\"\nimport style0 from \"./images6.vue?vue&type=style&index=0&id=05e049e4&lang=stylus&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"05e049e4\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--11-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../../node_modules/stylus-loader/index.js??ref--11-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./images6.vue?vue&type=style&index=0&id=05e049e4&lang=stylus&scoped=true&\"; export default mod; export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--11-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../../node_modules/stylus-loader/index.js??ref--11-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./images6.vue?vue&type=style&index=0&id=05e049e4&lang=stylus&scoped=true&\""],"sourceRoot":""}