轮播图完成

4e876d58 · xd · aada0365 · 9b29ea89 · 4e876d58 · 4e876d58
Commit 4e876d58 authored Apr 02, 2020 by xd
44 changed files
--- a/wx_application/.env
+++ b/wx_application/.env
@@ -6,4 +6,4 @@ VUE_APP_TITLE = 亿百分-dev

 VUE_APP_OY_API = /api/
 VUE_APP_API_A = http://139.155.48.151:8085
-VUE_APP_API_B = http://111.26.165.55:8010/crminterface.ashx
+VUE_APP_API_B = http://139.155.48.151:8084
--- a/wx_application/.env.dev
+++ b/wx_application/.env.dev
@@ -6,4 +6,4 @@ VUE_APP_TITLE = 亿百分-dev

 VUE_APP_OY_API = http://111.26.165.55:8010/crminterface.ashx
 VUE_APP_API_A = http://139.155.48.151:8085
-VUE_APP_API_B = http://111.26.165.55:8010/crminterface.ashx
+VUE_APP_API_B = http://139.155.48.151:8084
--- a/wx_application/.env.prod
+++ b/wx_application/.env.prod
@@ -6,4 +6,4 @@ VUE_APP_TITLE =  亿百分-prod

 VUE_APP_OY_API = http://111.26.165.55:8010/crminterface.ashx
 VUE_APP_API_A = http://139.155.48.151:8085
-VUE_APP_API_B = http://111.26.165.55:8010/crminterface.ashx
+VUE_APP_API_B = http://139.155.48.151:8084
--- a/wx_application/package.json
+++ b/wx_application/package.json
@@ -11,30 +11,30 @@
    "build:prod": "vue-cli-service build --mode prod"
  },
  "dependencies": {
-    "axios": "^0.19.1",
+    "axios": "^0.19.2",
    "core-js": "^3.4.4",
    "js-md5": "^0.7.3",
    "jssdk": "^0.0.1",
-    "qrcode": "^1.4.4",
-    "vant": "^2.3.3",
+    "vant": "^2.5.9",
+    "vconsole": "^3.3.4",
    "vue": "^2.6.10",
    "vue-quill-editor": "^3.0.6",
-    "vue-router": "^3.1.3",
-    "vuex": "^3.1.2",
+    "vue-router": "^3.1.6",
+    "vuex": "^3.1.3",
    "wangeditor": "^3.1.1"
  },
  "devDependencies": {
-    "@vue/cli-plugin-babel": "^4.1.0",
-    "@vue/cli-plugin-eslint": "^4.1.0",
-    "@vue/cli-service": "^4.1.0",
-    "babel-eslint": "^10.0.3",
+    "@vue/cli-plugin-babel": "^4.2.3",
+    "@vue/cli-plugin-eslint": "^4.2.3",
+    "@vue/cli-service": "^4.2.3",
+    "babel-eslint": "^10.1.0",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
-    "node-sass": "^4.13.0",
+    "node-sass": "^4.13.1",
    "postcss-loader": "^3.0.0",
    "postcss-pxtorem": "^4.0.1",
    "quill-image-extend-module": "^1.1.2",
-    "sass-loader": "^8.0.0",
+    "sass-loader": "^8.0.2",
    "vue-template-compiler": "^2.6.10"
  }
 }
--- a/wx_application/public/counterPageHome/index.html
+++ b/wx_application/public/counterPageHome/index.html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <title>会员拉新</title>
+  <link rel="stylesheet" href="../css/swiper.css" />
+  <link rel="stylesheet" href="../css/iconfont.css">
+  <script src="../js/jquery-3.4.1.min.js"></script>
+  <script src="../js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
+  <style>
+    body {
+      padding: 0;
+      margin: 0;
+    }
+    /* .swiper-container {
+      height: 400px;
+    } */
+    .list {
+      height: auto;
+      width: 100%;
+      background-color: #fff;
+      display: flex;
+      justify-content: flex-start;
+      border-bottom: 1px solid rgba(238, 238, 238, 1);
+      box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
+      border-radius: 4px;
+      z-index: 100;
+    }
+
+    .left {
+      width: 30%;
+    }
+
+    .left img {
+      width: 160px;
+    }
+
+    .right {
+      width: 76%;
+      padding: 20px;
+      background-color: #fff;
+      height: auto;
+    }
+    .flex {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .title {
+      font-size: 28px;
+      font-weight: bold;
+      color: rgba(45, 71, 106, 1);
+    }
+
+    .txt {
+      margin-top: 20px;
+      font-size: 24px;
+      color: rgba(45, 71, 106, 0.8);
+    }
+  </style>
+</head>
+
+<body>
+  <div class="swiper-container">
+    <div class="swiper-wrapper">
+      <div class="swiper-slide">
+        <img src="http://files.cailiao.com/vue/cailiao/pc_21/images/ba1.jpg" alt="">
+      </div>
+      <div class="swiper-slide">
+        <img src="http://files.cailiao.com/vue/cailiao/pc_21/images/ba2.png" alt="">
+      </div>
+      <div class="swiper-slide">
+        <img src="http://files.cailiao.com/vue/cailiao/pc_21/images/ba3.png" alt="">
+      </div>
+    </div>
+    <div class="swiper-pagination"></div>
+  </div>
+  <div class="list">
+    <div class="left flex">
+      <img src="../img/counter.png" alt="" />
+    </div>
+    <div class="right">
+      <div class="title">欧亚一号专柜</div>
+      <div class="txt">
+        <i class="iconfont icon-dianhua" style="font-size: 16px;"></i>
+        <span>18888888888</span>
+      </div>
+      <div class="txt">
+        <i class="iconfont icon-dizhi" style="font-size: 16px;"></i>
+        <span>欧亚商场一楼181号</span>
+      </div>
+    </div>
+  </div>
+  <script>
+    function GetQueryString(name) {
+      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
+      var r = window.location.search.substr(1).match(reg)
+      var context = ""
+      if (r != null)
+        context = r[2]
+      reg = null
+      r = null
+      return context == null || context == "" || context == "undefined" ? "" : context;
+    }
+    // alert(GetQueryString("storeCode"))
+    const storecode = GetQueryString("storeCode")
+    $(function () {
+      showQRInfo()
+    });
+    const showQRInfo = () => {
+      // let pageUri = `${nowUrl}&detailid=${voucherId}&actionid=${activeId}&unionid=${unionId}`;
+      // let storecode = "181"
+      let pageUri = `pages/user/register/register?storeCode=${storecode}`
+      let pageUrl = `http://139.155.48.151:8085/workWx/auth/oauth2/wxMiniQrCode?pageUri=${pageUri}`;
+
+      $.ajax({
+        type: "POST",
+        url: pageUrl,
+        data: {},
+        success: function (res) {
+          $('#image').attr('src', res.data)
+        },
+        error: function (data) {
+
+        }
+      });
+    }
+    // 轮播图
+    /* swiper轮播组件 */
+    var swiper = new Swiper('.swiper-container', {
+      autoplay: true,
+      pagination: {
+        el: '.swiper-pagination',
+      },
+    });
+    /*鼠标移入停止轮播，鼠标离开 继续轮播*/
+    $('.swiper-container').mouseenter(function () {
+      swiper.stopAutoplay();
+    }).mouseleave(function () {
+      swiper.startAutoplay();
+    })
+
+    // $(function () {
+    //   $.ajax({
+    //       type: 'GET',
+    //       url: 'a.json',
+    //       success: function (data) {
+    //               var str = "";
+    //               for (i = 0; i < data.list.length; i++) {
+    //                   var _data = data.list[i];
+    //                   str += '<div class="swiper-slide"><a href="'+_data.URL+'">' +
+    //                       '<img src="'+_data.Pic+'" alt=""></a></div>';
+    //               };
+    //               $("#slider").append(str);
+
+    //               if(data.data.list.length > 1){
+    //                   var mySwiper = new Swiper('.swiper-container', {
+    //                       loop: true,
+    //                       autoplay: 2000,
+    //                       pagination: '.swiper-pagination',
+    //                   })
+    //               }
+    //           }
+    //   })
+    // })
+  </script>
+</body>
+
+</html>
\ No newline at end of file
--- a/wx_application/public/css/animate.min.css
+++ b/wx_application/public/css/animate.min.css
+@charset "UTF-8";/*!
+Animate.css - http://daneden.me/animate
+Licensed under the MIT license - http://opensource.org/licenses/MIT
+
+Copyright (c) 2015 Daniel Eden
+*/.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes bounce{0%,100%,20%,53%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}@keyframes bounce{0%,100%,20%,53%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-30px,0);-ms-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}70%{-webkit-transition-timing-function:cubic-bezier(0.755,.050,.855,.060);transition-timing-function:cubic-bezier(0.755,.050,.855,.060);-webkit-transform:translate3d(0,-15px,0);-ms-transform:translate3d(0,-15px,0);transform:translate3d(0,-15px,0)}90%{-webkit-transform:translate3d(0,-4px,0);-ms-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes pulse{0%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);-ms-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}100%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes rubberBand{0%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);-ms-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(0.75,1.25,1);-ms-transform:scale3d(0.75,1.25,1);transform:scale3d(0.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);-ms-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);-ms-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);-ms-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);-ms-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);-ms-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);-ms-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);-ms-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);-ms-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);-ms-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}100%{-webkit-transform:rotate3d(0,0,1,0deg);-ms-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes tada{0%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);-ms-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);-ms-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);-ms-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}100%{-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;transform:none}}@keyframes wobble{0%{-webkit-transform:none;-ms-transform:none;transform:none}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);-ms-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);-ms-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);-ms-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);-ms-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);-ms-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes bounceIn{0%,100%,20%,40%,60%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceIn{0%,100%,20%,40%,60%,80%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);-ms-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);-ms-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);-ms-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);-ms-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}100%{opacity:1;-webkit-transform:scale3d(1,1,1);-ms-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn;-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInDown{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0);-ms-transform:translate3d(0,-3000px,0);transform:translate3d(0,-3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0);-ms-transform:translate3d(0,25px,0);transform:translate3d(0,25px,0)}75%{-webkit-transform:translate3d(0,-10px,0);-ms-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}90%{-webkit-transform:translate3d(0,5px,0);-ms-transform:translate3d(0,5px,0);transform:translate3d(0,5px,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInLeft{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0);-ms-transform:translate3d(-3000px,0,0);transform:translate3d(-3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0);-ms-transform:translate3d(25px,0,0);transform:translate3d(25px,0,0)}75%{-webkit-transform:translate3d(-10px,0,0);-ms-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}90%{-webkit-transform:translate3d(5px,0,0);-ms-transform:translate3d(5px,0,0);transform:translate3d(5px,0,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;transform:none}}@keyframes bounceInRight{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0);-ms-transform:translate3d(3000px,0,0);transform:translate3d(3000px,0,0)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0);-ms-transform:translate3d(-25px,0,0);transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);-ms-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);-ms-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}100%{-webkit-transform:none;-ms-transform:none;transform:none}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInUp{0%,100%,60%,75%,90%{-webkit-transition-timing-function:cubic-bezier(0.215,.61,.355,1);transition-timing-function:cubic-bezier(0.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0);-ms-transform:translate3d(0,3000px,0);transform:translate3d(0,3000px,0)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0);-ms-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}75%{-webkit-transform:translate3d(0,10px,0);-ms-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}90%{-webkit-transform:translate3d(0,-5px,0);-ms-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}100%{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);-ms-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);-ms-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}100%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut;-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0);-ms-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0);-ms-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);-ms-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0);-ms-transform:translate3d(20px,0,0);transform:translate3d(20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);-ms-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0);-ms-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);-ms-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0);-ms-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0);-ms-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);-ms-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);-ms-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);-ms-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);-ms-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);-ms-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);-ms-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);-ms-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);-ms-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);-ms-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,100%,0);-ms-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,2000px,0);-ms-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);-ms-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);-ms-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);-ms-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(2000px,0,0);-ms-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-100%,0);-ms-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);-ms-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-ms-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-ms-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);-ms-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;-ms-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);-ms-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);-ms-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);-ms-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);-ms-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}100%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);-ms-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);-ms-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}100%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);-ms-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);-ms-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px);-ms-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);-ms-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}100%{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);-ms-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY;-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;transform:none;opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);-ms-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);-ms-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);-ms-transform:skewX(-5deg);transform:skewX(-5deg);opacity:1}100%{-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOut{0%{opacity:1}100%{-webkit-transform:translate3d(100%,0,0) skewX(30deg);-ms-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,-200deg);-ms-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}100%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);-ms-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,45deg);-ms-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);-ms-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;transform:none;opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-90deg);-ms-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:none;-ms-transform:none;transform:none;opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;opacity:1}100%{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:rotate3d(0,0,1,200deg);-ms-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,45deg);-ms-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,-45deg);-ms-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate3d(0,0,1,-45deg);-ms-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate3d(0,0,1,90deg);-ms-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge{0%{-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);-ms-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);-ms-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translate3d(0,700px,0);-ms-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;transform:none}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);-ms-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}100%{opacity:1;-webkit-transform:none;-ms-transform:none;transform:none}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}@keyframes rollOut{0%{opacity:1}100%{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);-ms-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-ms-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-ms-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);-ms-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);-ms-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0);-webkit-transform-origin:left center;-ms-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);-ms-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}100%{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);-ms-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0);-webkit-transform-origin:right center;-ms-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-ms-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}100%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-ms-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom;-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%);visibility:visible}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInDown{0%{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);visibility:visible}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{-webkit-transform:translateX(-100%);transform:translateX(-100%);visibility:visible}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInLeft{0%{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);visibility:visible}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{-webkit-transform:translateX(100%);transform:translateX(100%);visibility:visible}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInRight{0%{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);visibility:visible}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{0%{-webkit-transform:translateY(100%);transform:translateY(100%);visibility:visible}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInUp{0%{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);visibility:visible}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{visibility:hidden;-webkit-transform:translateY(100%);transform:translateY(100%)}}@keyframes slideOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{visibility:hidden;-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{visibility:hidden;-webkit-transform:translateX(-100%);transform:translateX(-100%)}}@keyframes slideOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{visibility:hidden;-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{visibility:hidden;-webkit-transform:translateX(100%);transform:translateX(100%)}}@keyframes slideOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{visibility:hidden;-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{visibility:hidden;-webkit-transform:translateY(-100%);transform:translateY(-100%)}}@keyframes slideOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{visibility:hidden;-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}
--- a/wx_application/public/css/demo.css
+++ b/wx_application/public/css/demo.css
+/* Logo 字体 */
+@font-face {
+  font-family: "iconfont logo";
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
+}
+
+.logo {
+  font-family: "iconfont logo";
+  font-size: 160px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* tabs */
+.nav-tabs {
+  position: relative;
+}
+
+.nav-tabs .nav-more {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 42px;
+  line-height: 42px;
+  color: #666;
+}
+
+#tabs {
+  border-bottom: 1px solid #eee;
+}
+
+#tabs li {
+  cursor: pointer;
+  width: 100px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  font-size: 16px;
+  border-bottom: 2px solid transparent;
+  position: relative;
+  z-index: 1;
+  margin-bottom: -1px;
+  color: #666;
+}
+
+
+#tabs .active {
+  border-bottom-color: #f00;
+  color: #222;
+}
+
+.tab-container .content {
+  display: none;
+}
+
+/* 页面布局 */
+.main {
+  padding: 30px 100px;
+  width: 960px;
+  margin: 0 auto;
+}
+
+.main .logo {
+  color: #333;
+  text-align: left;
+  margin-bottom: 30px;
+  line-height: 1;
+  height: 110px;
+  margin-top: -50px;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.main .logo a {
+  font-size: 160px;
+  color: #333;
+}
+
+.helps {
+  margin-top: 40px;
+}
+
+.helps pre {
+  padding: 20px;
+  margin: 10px 0;
+  border: solid 1px #e7e1cd;
+  background-color: #fffdef;
+  overflow: auto;
+}
+
+.icon_lists {
+  width: 100% !important;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.icon_lists li {
+  width: 100px;
+  margin-bottom: 10px;
+  margin-right: 20px;
+  text-align: center;
+  list-style: none !important;
+  cursor: default;
+}
+
+.icon_lists li .code-name {
+  line-height: 1.2;
+}
+
+.icon_lists .icon {
+  display: block;
+  height: 100px;
+  line-height: 100px;
+  font-size: 42px;
+  margin: 10px auto;
+  color: #333;
+  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
+  -moz-transition: font-size 0.25s linear, width 0.25s linear;
+  transition: font-size 0.25s linear, width 0.25s linear;
+}
+
+.icon_lists .icon:hover {
+  font-size: 100px;
+}
+
+.icon_lists .svg-icon {
+  /* 通过设置 font-size 来改变图标大小 */
+  width: 1em;
+  /* 图标和文字相邻时，垂直对齐 */
+  vertical-align: -0.15em;
+  /* 通过设置 color 来改变 SVG 的颜色/fill */
+  fill: currentColor;
+  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
+      normalize.css 中也包含这行 */
+  overflow: hidden;
+}
+
+.icon_lists li .name,
+.icon_lists li .code-name {
+  color: #666;
+}
+
+/* markdown 样式 */
+.markdown {
+  color: #666;
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.highlight {
+  line-height: 1.5;
+}
+
+.markdown img {
+  vertical-align: middle;
+  max-width: 100%;
+}
+
+.markdown h1 {
+  color: #404040;
+  font-weight: 500;
+  line-height: 40px;
+  margin-bottom: 24px;
+}
+
+.markdown h2,
+.markdown h3,
+.markdown h4,
+.markdown h5,
+.markdown h6 {
+  color: #404040;
+  margin: 1.6em 0 0.6em 0;
+  font-weight: 500;
+  clear: both;
+}
+
+.markdown h1 {
+  font-size: 28px;
+}
+
+.markdown h2 {
+  font-size: 22px;
+}
+
+.markdown h3 {
+  font-size: 16px;
+}
+
+.markdown h4 {
+  font-size: 14px;
+}
+
+.markdown h5 {
+  font-size: 12px;
+}
+
+.markdown h6 {
+  font-size: 12px;
+}
+
+.markdown hr {
+  height: 1px;
+  border: 0;
+  background: #e9e9e9;
+  margin: 16px 0;
+  clear: both;
+}
+
+.markdown p {
+  margin: 1em 0;
+}
+
+.markdown>p,
+.markdown>blockquote,
+.markdown>.highlight,
+.markdown>ol,
+.markdown>ul {
+  width: 80%;
+}
+
+.markdown ul>li {
+  list-style: circle;
+}
+
+.markdown>ul li,
+.markdown blockquote ul>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown>ul li p,
+.markdown>ol li p {
+  margin: 0.6em 0;
+}
+
+.markdown ol>li {
+  list-style: decimal;
+}
+
+.markdown>ol li,
+.markdown blockquote ol>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown code {
+  margin: 0 3px;
+  padding: 0 5px;
+  background: #eee;
+  border-radius: 3px;
+}
+
+.markdown strong,
+.markdown b {
+  font-weight: 600;
+}
+
+.markdown>table {
+  border-collapse: collapse;
+  border-spacing: 0px;
+  empty-cells: show;
+  border: 1px solid #e9e9e9;
+  width: 95%;
+  margin-bottom: 24px;
+}
+
+.markdown>table th {
+  white-space: nowrap;
+  color: #333;
+  font-weight: 600;
+}
+
+.markdown>table th,
+.markdown>table td {
+  border: 1px solid #e9e9e9;
+  padding: 8px 16px;
+  text-align: left;
+}
+
+.markdown>table th {
+  background: #F7F7F7;
+}
+
+.markdown blockquote {
+  font-size: 90%;
+  color: #999;
+  border-left: 4px solid #e9e9e9;
+  padding-left: 0.8em;
+  margin: 1em 0;
+}
+
+.markdown blockquote p {
+  margin: 0;
+}
+
+.markdown .anchor {
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  margin-left: 8px;
+}
+
+.markdown .waiting {
+  color: #ccc;
+}
+
+.markdown h1:hover .anchor,
+.markdown h2:hover .anchor,
+.markdown h3:hover .anchor,
+.markdown h4:hover .anchor,
+.markdown h5:hover .anchor,
+.markdown h6:hover .anchor {
+  opacity: 1;
+  display: inline-block;
+}
+
+.markdown>br,
+.markdown>p>br {
+  clear: both;
+}
+
+
+.hljs {
+  display: block;
+  background: white;
+  padding: 0.5em;
+  color: #333333;
+  overflow-x: auto;
+}
+
+.hljs-comment,
+.hljs-meta {
+  color: #969896;
+}
+
+.hljs-string,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-strong,
+.hljs-emphasis,
+.hljs-quote {
+  color: #df5000;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-type {
+  color: #a71d5d;
+}
+
+.hljs-literal,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-attribute {
+  color: #0086b3;
+}
+
+.hljs-section,
+.hljs-name {
+  color: #63a35c;
+}
+
+.hljs-tag {
+  color: #333333;
+}
+
+.hljs-title,
+.hljs-attr,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #795da3;
+}
+
+.hljs-addition {
+  color: #55a532;
+  background-color: #eaffea;
+}
+
+.hljs-deletion {
+  color: #bd2c00;
+  background-color: #ffecec;
+}
+
+.hljs-link {
+  text-decoration: underline;
+}
+
+/* 代码高亮 */
+/* PrismJS 1.15.0
+https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
+/**
+ * prism.js default theme for JavaScript, CSS and HTML
+ * Based on dabblet (http://dabblet.com)
+ * @author Lea Verou
+ */
+code[class*="language-"],
+pre[class*="language-"] {
+  color: black;
+  background: none;
+  text-shadow: 0 1px white;
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  word-wrap: normal;
+  line-height: 1.5;
+
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  tab-size: 4;
+
+  -webkit-hyphens: none;
+  -moz-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+}
+
+pre[class*="language-"]::-moz-selection,
+pre[class*="language-"] ::-moz-selection,
+code[class*="language-"]::-moz-selection,
+code[class*="language-"] ::-moz-selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+pre[class*="language-"]::selection,
+pre[class*="language-"] ::selection,
+code[class*="language-"]::selection,
+code[class*="language-"] ::selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+@media print {
+
+  code[class*="language-"],
+  pre[class*="language-"] {
+    text-shadow: none;
+  }
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+  padding: 1em;
+  margin: .5em 0;
+  overflow: auto;
+}
+
+:not(pre)>code[class*="language-"],
+pre[class*="language-"] {
+  background: #f5f2f0;
+}
+
+/* Inline code */
+:not(pre)>code[class*="language-"] {
+  padding: .1em;
+  border-radius: .3em;
+  white-space: normal;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: slategray;
+}
+
+.token.punctuation {
+  color: #999;
+}
+
+.namespace {
+  opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #9a6e3a;
+  background: hsla(0, 0%, 100%, .5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: #07a;
+}
+
+.token.function,
+.token.class-name {
+  color: #DD4A68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+  color: #e90;
+}
+
+.token.important,
+.token.bold {
+  font-weight: bold;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+.token.entity {
+  cursor: help;
+}
--- a/wx_application/public/css/demo_index.html
+++ b/wx_application/public/css/demo_index.html
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>IconFont Demo</title>
+  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
+  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
+  <link rel="stylesheet" href="demo.css">
+  <link rel="stylesheet" href="iconfont.css">
+  <script src="iconfont.js"></script>
+  <!-- jQuery -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
+  <!-- 代码高亮 -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
+</head>
+<body>
+  <div class="main">
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
+    <div class="nav-tabs">
+      <ul id="tabs" class="dib-box">
+        <li class="dib active"><span>Unicode</span></li>
+        <li class="dib"><span>Font class</span></li>
+        <li class="dib"><span>Symbol</span></li>
+      </ul>
+      
+    </div>
+    <div class="tab-container">
+      <div class="content unicode" style="display: block;">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe681;</span>
+                <div class="name">地址</div>
+                <div class="code-name">&amp;#xe681;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe630;</span>
+                <div class="name">电话</div>
+                <div class="code-name">&amp;#xe630;</div>
+              </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="unicode-">Unicode 引用</h2>
+          <hr>
+
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
+          <ul>
+            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
+            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
+          </ul>
+          <blockquote>
+            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
+          </blockquote>
+          <p>Unicode 使用步骤如下：</p>
+          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
+<pre><code class="language-css"
+>@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.eot');
+  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
+      url('iconfont.woff2') format('woff2'),
+      url('iconfont.woff') format('woff'),
+      url('iconfont.ttf') format('truetype'),
+      url('iconfont.svg#iconfont') format('svg');
+}
+</code></pre>
+          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
+<pre><code class="language-css"
+>.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
+<pre>
+<code class="language-html"
+>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
+</code></pre>
+          <blockquote>
+            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+          </blockquote>
+          </div>
+      </div>
+      <div class="content font-class">
+        <ul class="icon_lists dib-box">
+          
+          <li class="dib">
+            <span class="icon iconfont icon-dizhi"></span>
+            <div class="name">
+              地址
+            </div>
+            <div class="code-name">.icon-dizhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-dianhua"></span>
+            <div class="name">
+              电话
+            </div>
+            <div class="code-name">.icon-dianhua
+            </div>
+          </li>
+          
+        </ul>
+        <div class="article markdown">
+        <h2 id="font-class-">font-class 引用</h2>
+        <hr>
+
+        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
+        <p>与 Unicode 使用方式相比，具有如下特点：</p>
+        <ul>
+          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
+          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
+        </ul>
+        <p>使用步骤如下：</p>
+        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
+<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
+</code></pre>
+        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
+</code></pre>
+        <blockquote>
+          <p>"
+            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+        </blockquote>
+      </div>
+      </div>
+      <div class="content symbol">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-dizhi"></use>
+                </svg>
+                <div class="name">地址</div>
+                <div class="code-name">#icon-dizhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-dianhua"></use>
+                </svg>
+                <div class="name">电话</div>
+                <div class="code-name">#icon-dianhua</div>
+            </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="symbol-">Symbol 引用</h2>
+          <hr>
+
+          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
+            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
+          <ul>
+            <li>支持多色图标了，不再受单色限制。</li>
+            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
+            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
+            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
+          </ul>
+          <p>使用步骤如下：</p>
+          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
+<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
+</code></pre>
+          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
+<pre><code class="language-html">&lt;style&gt;
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+&lt;/style&gt;
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
+  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
+&lt;/svg&gt;
+</code></pre>
+          </div>
+      </div>
+
+    </div>
+  </div>
+  <script>
+  $(document).ready(function () {
+      $('.tab-container .content:first').show()
+
+      $('#tabs li').click(function (e) {
+        var tabContent = $('.tab-container .content')
+        var index = $(this).index()
+
+        if ($(this).hasClass('active')) {
+          return
+        } else {
+          $('#tabs li').removeClass('active')
+          $(this).addClass('active')
+
+          tabContent.hide().eq(index).fadeIn()
+        }
+      })
+    })
+  </script>
+</body>
+</html>
--- a/wx_application/public/css/iconfont.css
+++ b/wx_application/public/css/iconfont.css
+@font-face {font-family: "iconfont";
+  src: url('iconfont.eot?t=1585738608197'); /* IE9 */
+  src: url('iconfont.eot?t=1585738608197#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAQQAAsAAAAACCQAAAPDAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqECINRATYCJAMMCwgABCAFhG0HORsaB8gOJQXpwADgAaNgPHy/3//WPufc+0UkqXafbopKCa+SoBIhFEKkVIbpXsIbalMvoWJCZ4JUXEg2j0DiMHI1masDycxffe5X+ePe8V/nYTYfUC5jLpuT2hhg3HkX0NiLsoBLGFMBzxHpQP/rCbSbNonsqLiyEbgp0C0Q7w06FXDLaZWW1NAq1DVjS4pPoNKaPshf4GP4+/hvK9xIqgwbHb8s0oLcX8TfuUjfcJ/7vAg05jNDmkTGCqAQD2ut15DYvwLRbkid2mNrRUhzuYaHCbmmuKY/PJIgakjuBAtcIPGLcLmpbC7Lv2vey3Wu0YovgH+qbhDuWZQ+rwivSZMR+bvlT2+e7Ttz48myZ7fOzT1/+3mCIDSKYpPdrpAkarnILAI+C4TQeEeYdErKl6hzUuRcewOnB/nP+OP/PO3LxkgUPezvx7Gh5+1NF7M2ngw+GX02akfmOFFMO57xvOypKKI7Jh25EbThSccGYWL2jIs9Dw3dfHuiHTslJV8Sxm04ELJJqn5l19kWOvF05H7q2K0xVRPb585tkQ0vnECaiGSiCUkOI083yFhW1kBqlvXy0n068yChUJIwTx5cOTxZWcO2lE4/c6Z0GlPLyfMPBVfJ80ioUEIiN2cf4viBfA09V3PFZnNZIYv/IIcDbDRafcBZqzqhNXdZb1RkcHY7uNemLXM9pB7cc8ohBLy8HC1LMxyY/+jb3CNqUlmQqTi06OPqpwXUcXx9cYJXUWhv+/NVi9a0vV87x10b6Oe3cDpR+HFBReouY9mImcrEDWjJ2JSX79NyY4q51ysvrPyeXDajX/w1tQpfPwKA1lsAHgNoNjJlDA80l+RhZNE/vJ2Bb9GvZ/lm/m/tKODnsQ1cyO5H6isgkVaJ3rz/s1pxbQ5QZAF0uehSrWmB7KGJvQnt5KIJzn5fx9uHgNQcWmUeC0mLKchazSCFWIFKhx2otdqFdstKJncYwENEacOShQyEXqch6fYdsl4vkUJ8gcqwfqj1BgLtLiNwzg5zYfAo4GkVpLWouh01aFgr4xigR5RaT+uazSo+KwgpFM3bDC6UxIhiqIS20vwcA2wtungIGZThWQtazGxGm80syvGskdZATA8hl47jTN2LMA1rAR4O8WgqEE0LpdYOZaDBsmL88pBH6fv1aDrNzFT4lqIGM4XGszHUjiJhiB5IidTaq+heLrFpoRMPghgoBo9lgSpmzDQz+Vkorr6VEU0DwuhHeDnpcK4U01eKrS+3fN8KaId+OVLkKKrnhg69wdWPVVn1zSoAAAA=') format('woff2'),
+  url('iconfont.woff?t=1585738608197') format('woff'),
+  url('iconfont.ttf?t=1585738608197') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+  url('iconfont.svg?t=1585738608197#iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-dizhi:before {
+  content: "\e681";
+}
+
+.icon-dianhua:before {
+  content: "\e630";
+}
+
--- a/wx_application/public/css/iconfont.eot
+++ b/wx_application/public/css/iconfont.eot
--- a/wx_application/public/css/iconfont.js
+++ b/wx_application/public/css/iconfont.js
+!function(s){var e,d='<svg><symbol id="icon-dizhi" viewBox="0 0 1024 1024"><path d="M512 249.8c35.8 0 69.5 13.9 94.8 39.3 25.3 25.3 39.3 59 39.3 94.8s-13.9 69.5-39.3 94.8C581.5 504 547.8 518 512 518s-69.5-13.9-94.8-39.3c-25.3-25.3-39.3-59-39.3-94.8s13.9-69.5 39.3-94.8c25.3-25.4 59-39.3 94.8-39.3m0-64c-109.4 0-198.1 88.7-198.1 198.1s88.7 198 198.1 198 198.1-88.7 198.1-198.1-88.7-198-198.1-198z" fill="" ></path><path d="M512 64c43.2 0 85.1 8.4 124.5 25.1 38.1 16.1 72.3 39.2 101.7 68.6 29.4 29.4 52.5 63.6 68.6 101.7 16.7 39.4 25.1 81.3 25.1 124.5 0 26.1-9.1 75-52.7 159.7-30.3 59-72.9 126.8-126.6 201.6-51.9 72.3-104.3 137.2-140.6 180.6-36.1-43.2-88.2-107.6-139.9-179.7-53.9-75-96.6-143-127-202-43.7-85-52.9-134-52.9-160.2 0-43.2 8.4-85.1 25.1-124.5 16.1-38.1 39.2-72.3 68.6-101.7 29.4-29.4 63.6-52.5 101.7-68.6C426.9 72.4 468.8 64 512 64m0-64C300 0 128.2 171.9 128.2 383.8S512 1024 512 1024s383.8-428.2 383.8-640.2S724 0 512 0z" fill="" ></path></symbol><symbol id="icon-dianhua" viewBox="0 0 1031 1024"><path d="M775.908525 1015.269821c-9.545802 0-19.685698-0.483332-30.429759-1.55069-55.71405-5.538176-117.298567-26.099913-183.041751-61.101185-80.16258-42.684233-167.34354-107.370128-259.106081-192.275401-406.320868-375.911247-288.659802-603.590697-283.453917-613.09622 0.231596-0.432985 0.483332-0.8559 0.735067-1.278816C58.382444 84.584381 148.181451-14.840982 245.220363 1.86417c28.999903 4.994428 55.643565 18.698896 81.451465 41.898819 21.417637 19.252714 39.1398 42.321734 54.072736 62.430347 20.602015 27.741227 34.930786 53.075865 43.801938 77.44384 12.465931 34.215858 14.157592 66.931374 5.024636 97.210092-8.337472 27.660672-22.968326 54.978983-46.037347 85.992769-1.268746 1.7118-2.698602 3.322906-7.964904 9.213511-2.003813 2.235409-5.185747 5.81005-8.317333 9.374622 70.153586 140.357518 214.740257 230.871453 267.816121 260.525868 19.695768-21.256526 44.043603-38.525566 70.475807-49.722751 38.888065-16.473556 78.551474-18.557924 114.680521-6.051716 67.575816 23.401311 131.858936 72.167468 171.975468 130.449218 20.007919 29.080459 26.301301 62.057779 18.688827 98.015645-5.558315 26.281162-18.708965 53.881418-39.089453 82.025421-30.993647 42.805066-69.267477 73.879268-75.258777 78.63203-7.783655 6.716297-46.097763 35.967936-120.631543 35.967936zM71.009486 175.52123c-2.587839 5.538176-23.330825 53.810932-4.581582 138.222804 18.849937 84.895203 82.136185 223.853073 276.55637 403.733029C536.075297 896.118482 667.581803 945.126305 743.907938 954.7728c76.144885 9.626357 111.065602-16.906541 114.438854-19.64542 0.664581-0.644442 0.795483-0.704859 1.631245-1.349302 0.34236-0.271874 37.115849-29.161014 65.159158-68.220258 32.504058-45.262002 38.888065-82.881321 18.97077-111.820808-32.806141-47.668591-87.593805-89.194842-142.975565-108.37707-50.07518-17.339526-106.816311 15.134325-134.789134 54.495652-8.236778 11.589892-23.622838 15.55724-36.441198 9.414899-2.38645-1.147913-59.087303-28.587058-127.17666-80.83723-40.066186-30.741911-75.842803-63.809857-106.353118-98.267381-38.555774-43.550202-68.794215-89.517063-89.869492-136.621767-4.79304-10.723923-3.061101-21.69958 5.145469-32.624891 1.54062-2.04409 3.59478-4.581582 6.303451-7.763516 4.44061-5.226024 9.777398-11.207254 14.066967-16.010363 1.88298-2.104507 4.178806-4.672207 5.064914-5.709356 18.678757-25.173527 30.308927-46.621372 36.58217-67.444915 10.008994-33.208917-3.010754-73.436214-39.804382-122.987784-28.989834-39.049175-58.352236-74.674751-98.549324-81.592437-61.201879-10.532604-131.466229 63.266109-164.302577 116.110377z m787.166126 759.777329c-0.010069 0-0.010069 0 0 0-0.010069 0-0.010069 0 0 0z m-521.394095-603.439655l-0.080556 0.110763c0.030208-0.040278 0.050347-0.080555 0.080556-0.110763z"  ></path></symbol></svg>',t=(e=document.getElementsByTagName("script"))[e.length-1].getAttribute("data-injectcss");if(t&&!s.__iconfont__svg__cssinject__){s.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(e){console&&console.log(e)}}!function(e){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(e,0);else{var t=function(){document.removeEventListener("DOMContentLoaded",t,!1),e()};document.addEventListener("DOMContentLoaded",t,!1)}else document.attachEvent&&(i=e,o=s.document,c=!1,(d=function(){try{o.documentElement.doScroll("left")}catch(e){return void setTimeout(d,50)}n()})(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,n())});function n(){c||(c=!0,i())}var i,o,c,d}(function(){var e,t,n,i,o,c;(e=document.createElement("div")).innerHTML=d,d=null,(t=e.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",n=t,(i=document.body).firstChild?(o=n,(c=i.firstChild).parentNode.insertBefore(o,c)):i.appendChild(n))})}(window);
\ No newline at end of file
--- a/wx_application/public/css/iconfont.json
+++ b/wx_application/public/css/iconfont.json
+{
+  "id": "",
+  "name": "",
+  "font_family": "iconfont",
+  "css_prefix_text": "icon-",
+  "description": "",
+  "glyphs": [
+    {
+      "icon_id": "5809159",
+      "name": "地址",
+      "font_class": "dizhi",
+      "unicode": "e681",
+      "unicode_decimal": 59009
+    },
+    {
+      "icon_id": "13604087",
+      "name": "电话",
+      "font_class": "dianhua",
+      "unicode": "e630",
+      "unicode_decimal": 58928
+    }
+  ]
+}
--- a/wx_application/public/css/iconfont.svg
+++ b/wx_application/public/css/iconfont.svg
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<!--
+2013-9-30: Created.
+-->
+<svg>
+<metadata>
+Created by iconfont
+</metadata>
+<defs>
+
+<font id="iconfont" horiz-adv-x="1024" >
+  <font-face
+    font-family="iconfont"
+    font-weight="500"
+    font-stretch="normal"
+    units-per-em="1024"
+    ascent="896"
+    descent="-128"
+  />
+    <missing-glyph />
+    
+    <glyph glyph-name="dizhi" unicode="&#59009;" d="M512 646.2c35.8 0 69.5-13.9 94.8-39.3 25.3-25.3 39.3-59 39.3-94.8s-13.9-69.5-39.3-94.8C581.5 392 547.8 378 512 378s-69.5 13.9-94.8 39.3c-25.3 25.3-39.3 59-39.3 94.8s13.9 69.5 39.3 94.8c25.3 25.4 59 39.3 94.8 39.3m0 64c-109.4 0-198.1-88.7-198.1-198.1s88.7-198 198.1-198 198.1 88.7 198.1 198.1-88.7 198-198.1 198zM512 832c43.2 0 85.1-8.4 124.5-25.1 38.1-16.1 72.3-39.2 101.7-68.6 29.4-29.4 52.5-63.6 68.6-101.7 16.7-39.4 25.1-81.3 25.1-124.5 0-26.1-9.1-75-52.7-159.7-30.3-59-72.9-126.8-126.6-201.6-51.9-72.3-104.3-137.2-140.6-180.6-36.1 43.2-88.2 107.6-139.9 179.7-53.9 75-96.6 143-127 202-43.7 85-52.9 134-52.9 160.2 0 43.2 8.4 85.1 25.1 124.5 16.1 38.1 39.2 72.3 68.6 101.7 29.4 29.4 63.6 52.5 101.7 68.6C426.9 823.6 468.8 832 512 832m0 64C300 896 128.2 724.1 128.2 512.2S512-128 512-128s383.8 428.2 383.8 640.2S724 896 512 896z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="dianhua" unicode="&#58928;" d="M775.908525-119.269821c-9.545802 0-19.685698 0.483332-30.429759 1.55069-55.71405 5.538176-117.298567 26.099913-183.041751 61.101185-80.16258 42.684233-167.34354 107.370128-259.106081 192.275401-406.320868 375.911247-288.659802 603.590697-283.453917 613.09622 0.231596 0.432985 0.483332 0.8559 0.735067 1.278816C58.382444 811.415619 148.181451 910.840982 245.220363 894.13583c28.999903-4.994428 55.643565-18.698896 81.451465-41.898819 21.417637-19.252714 39.1398-42.321734 54.072736-62.430347 20.602015-27.741227 34.930786-53.075865 43.801938-77.44384 12.465931-34.215858 14.157592-66.931374 5.024636-97.210092-8.337472-27.660672-22.968326-54.978983-46.037347-85.992769-1.268746-1.7118-2.698602-3.322906-7.964904-9.213511-2.003813-2.235409-5.185747-5.81005-8.317333-9.374622 70.153586-140.357518 214.740257-230.871453 267.816121-260.525868 19.695768 21.256526 44.043603 38.525566 70.475807 49.722751 38.888065 16.473556 78.551474 18.557924 114.680521 6.051716 67.575816-23.401311 131.858936-72.167468 171.975468-130.449218 20.007919-29.080459 26.301301-62.057779 18.688827-98.015645-5.558315-26.281162-18.708965-53.881418-39.089453-82.025421-30.993647-42.805066-69.267477-73.879268-75.258777-78.63203-7.783655-6.716297-46.097763-35.967936-120.631543-35.967936zM71.009486 720.47877c-2.587839-5.538176-23.330825-53.810932-4.581582-138.222804 18.849937-84.895203 82.136185-223.853073 276.55637-403.733029C536.075297-0.118482 667.581803-49.126305 743.907938-58.7728c76.144885-9.626357 111.065602 16.906541 114.438854 19.64542 0.664581 0.644442 0.795483 0.704859 1.631245 1.349302 0.34236 0.271874 37.115849 29.161014 65.159158 68.220258 32.504058 45.262002 38.888065 82.881321 18.97077 111.820808-32.806141 47.668591-87.593805 89.194842-142.975565 108.37707-50.07518 17.339526-106.816311-15.134325-134.789134-54.495652-8.236778-11.589892-23.622838-15.55724-36.441198-9.414899-2.38645 1.147913-59.087303 28.587058-127.17666 80.83723-40.066186 30.741911-75.842803 63.809857-106.353118 98.267381-38.555774 43.550202-68.794215 89.517063-89.869492 136.621767-4.79304 10.723923-3.061101 21.69958 5.145469 32.624891 1.54062 2.04409 3.59478 4.581582 6.303451 7.763516 4.44061 5.226024 9.777398 11.207254 14.066967 16.010363 1.88298 2.104507 4.178806 4.672207 5.064914 5.709356 18.678757 25.173527 30.308927 46.621372 36.58217 67.444915 10.008994 33.208917-3.010754 73.436214-39.804382 122.987784-28.989834 39.049175-58.352236 74.674751-98.549324 81.592437-61.201879 10.532604-131.466229-63.266109-164.302577-116.110377z m787.166126-759.777329c-0.010069 0-0.010069 0 0 0-0.010069 0-0.010069 0 0 0z m-521.394095 603.439655l-0.080556-0.110763c0.030208 0.040278 0.050347 0.080555 0.080556 0.110763z"  horiz-adv-x="1031" />
+
+    
+
+
+  </font>
+</defs></svg>
--- a/wx_application/public/css/iconfont.ttf
+++ b/wx_application/public/css/iconfont.ttf
--- a/wx_application/public/css/iconfont.woff
+++ b/wx_application/public/css/iconfont.woff
--- a/wx_application/public/css/iconfont.woff2
+++ b/wx_application/public/css/iconfont.woff2
--- a/wx_application/public/css/swiper.css
+++ b/wx_application/public/css/swiper.css
+/**
+ * Swiper 5.3.6
+ * Most modern mobile touch slider and framework with hardware accelerated transitions
+ * http://swiperjs.com
+ *
+ * Copyright 2014-2020 Vladimir Kharlampidi
+ *
+ * Released under the MIT License
+ *
+ * Released on: February 29, 2020
+ */
+
+@font-face {
+  font-family: 'swiper-icons';
+  src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
+  font-weight: 400;
+  font-style: normal;
+}
+:root {
+  --swiper-theme-color: #007aff;
+}
+.swiper-container {
+  margin-left: auto;
+  margin-right: auto;
+  position: relative;
+  overflow: hidden;
+  list-style: none;
+  padding: 0;
+  /* Fix of Webkit flickering */
+  z-index: 1;
+}
+.swiper-container-vertical > .swiper-wrapper {
+  flex-direction: column;
+}
+.swiper-wrapper {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+  display: flex;
+  transition-property: transform;
+  box-sizing: content-box;
+}
+.swiper-container-android .swiper-slide,
+.swiper-wrapper {
+  transform: translate3d(0px, 0, 0);
+}
+.swiper-container-multirow > .swiper-wrapper {
+  flex-wrap: wrap;
+}
+.swiper-container-multirow-column > .swiper-wrapper {
+  flex-wrap: wrap;
+  flex-direction: column;
+}
+.swiper-container-free-mode > .swiper-wrapper {
+  transition-timing-function: ease-out;
+  margin: 0 auto;
+}
+.swiper-slide {
+  flex-shrink: 0;
+  width: 100%;
+  height: 100%;
+  position: relative;
+  transition-property: transform;
+}
+.swiper-slide-invisible-blank {
+  visibility: hidden;
+}
+/* Auto Height */
+.swiper-container-autoheight,
+.swiper-container-autoheight .swiper-slide {
+  height: auto;
+}
+.swiper-container-autoheight .swiper-wrapper {
+  align-items: flex-start;
+  transition-property: transform, height;
+}
+/* 3D Effects */
+.swiper-container-3d {
+  perspective: 1200px;
+}
+.swiper-container-3d .swiper-wrapper,
+.swiper-container-3d .swiper-slide,
+.swiper-container-3d .swiper-slide-shadow-left,
+.swiper-container-3d .swiper-slide-shadow-right,
+.swiper-container-3d .swiper-slide-shadow-top,
+.swiper-container-3d .swiper-slide-shadow-bottom,
+.swiper-container-3d .swiper-cube-shadow {
+  transform-style: preserve-3d;
+}
+.swiper-container-3d .swiper-slide-shadow-left,
+.swiper-container-3d .swiper-slide-shadow-right,
+.swiper-container-3d .swiper-slide-shadow-top,
+.swiper-container-3d .swiper-slide-shadow-bottom {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  pointer-events: none;
+  z-index: 10;
+}
+.swiper-container-3d .swiper-slide-shadow-left {
+  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
+}
+.swiper-container-3d .swiper-slide-shadow-right {
+  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
+}
+.swiper-container-3d .swiper-slide-shadow-top {
+  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
+}
+.swiper-container-3d .swiper-slide-shadow-bottom {
+  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
+}
+/* CSS Mode */
+.swiper-container-css-mode > .swiper-wrapper {
+  overflow: auto;
+  scrollbar-width: none;
+  /* For Firefox */
+  -ms-overflow-style: none;
+  /* For Internet Explorer and Edge */
+}
+.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {
+  display: none;
+}
+.swiper-container-css-mode > .swiper-wrapper > .swiper-slide {
+  scroll-snap-align: start start;
+}
+.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {
+  scroll-snap-type: x mandatory;
+}
+.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {
+  scroll-snap-type: y mandatory;
+}
+:root {
+  --swiper-navigation-size: 44px;
+  /*
+  --swiper-navigation-color: var(--swiper-theme-color);
+  */
+}
+.swiper-button-prev,
+.swiper-button-next {
+  position: absolute;
+  top: 50%;
+  width: calc(var(--swiper-navigation-size) / 44 * 27);
+  height: var(--swiper-navigation-size);
+  margin-top: calc(-1 * var(--swiper-navigation-size) / 2);
+  z-index: 10;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--swiper-navigation-color, var(--swiper-theme-color));
+}
+.swiper-button-prev.swiper-button-disabled,
+.swiper-button-next.swiper-button-disabled {
+  opacity: 0.35;
+  cursor: auto;
+  pointer-events: none;
+}
+.swiper-button-prev:after,
+.swiper-button-next:after {
+  font-family: swiper-icons;
+  font-size: var(--swiper-navigation-size);
+  text-transform: none !important;
+  letter-spacing: 0;
+  text-transform: none;
+  font-variant: initial;
+}
+.swiper-button-prev,
+.swiper-container-rtl .swiper-button-next {
+  left: 10px;
+  right: auto;
+}
+.swiper-button-prev:after,
+.swiper-container-rtl .swiper-button-next:after {
+  content: 'prev';
+}
+.swiper-button-next,
+.swiper-container-rtl .swiper-button-prev {
+  right: 10px;
+  left: auto;
+}
+.swiper-button-next:after,
+.swiper-container-rtl .swiper-button-prev:after {
+  content: 'next';
+}
+.swiper-button-prev.swiper-button-white,
+.swiper-button-next.swiper-button-white {
+  --swiper-navigation-color: #ffffff;
+}
+.swiper-button-prev.swiper-button-black,
+.swiper-button-next.swiper-button-black {
+  --swiper-navigation-color: #000000;
+}
+.swiper-button-lock {
+  display: none;
+}
+:root {
+  /*
+  --swiper-pagination-color: var(--swiper-theme-color);
+  */
+}
+.swiper-pagination {
+  position: absolute;
+  text-align: center;
+  transition: 300ms opacity;
+  transform: translate3d(0, 0, 0);
+  z-index: 10;
+}
+.swiper-pagination.swiper-pagination-hidden {
+  opacity: 0;
+}
+/* Common Styles */
+.swiper-pagination-fraction,
+.swiper-pagination-custom,
+.swiper-container-horizontal > .swiper-pagination-bullets {
+  bottom: 10px;
+  left: 0;
+  width: 100%;
+}
+/* Bullets */
+.swiper-pagination-bullets-dynamic {
+  overflow: hidden;
+  font-size: 0;
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
+  transform: scale(0.33);
+  position: relative;
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
+  transform: scale(1);
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
+  transform: scale(1);
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
+  transform: scale(0.66);
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
+  transform: scale(0.33);
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
+  transform: scale(0.66);
+}
+.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
+  transform: scale(0.33);
+}
+.swiper-pagination-bullet {
+  width: 8px;
+  height: 8px;
+  display: inline-block;
+  border-radius: 100%;
+  background: #000;
+  opacity: 0.2;
+}
+button.swiper-pagination-bullet {
+  border: none;
+  margin: 0;
+  padding: 0;
+  box-shadow: none;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+}
+.swiper-pagination-clickable .swiper-pagination-bullet {
+  cursor: pointer;
+}
+.swiper-pagination-bullet-active {
+  opacity: 1;
+  background: var(--swiper-pagination-color, var(--swiper-theme-color));
+}
+.swiper-container-vertical > .swiper-pagination-bullets {
+  right: 10px;
+  top: 50%;
+  transform: translate3d(0px, -50%, 0);
+}
+.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
+  margin: 6px 0;
+  display: block;
+}
+.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
+  top: 50%;
+  transform: translateY(-50%);
+  width: 8px;
+}
+.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
+  display: inline-block;
+  transition: 200ms transform, 200ms top;
+}
+.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
+  margin: 0 4px;
+}
+.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
+  left: 50%;
+  transform: translateX(-50%);
+  white-space: nowrap;
+}
+.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
+  transition: 200ms transform, 200ms left;
+}
+.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
+  transition: 200ms transform, 200ms right;
+}
+/* Progress */
+.swiper-pagination-progressbar {
+  background: rgba(0, 0, 0, 0.25);
+  position: absolute;
+}
+.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
+  background: var(--swiper-pagination-color, var(--swiper-theme-color));
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  transform: scale(0);
+  transform-origin: left top;
+}
+.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
+  transform-origin: right top;
+}
+.swiper-container-horizontal > .swiper-pagination-progressbar,
+.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
+  width: 100%;
+  height: 4px;
+  left: 0;
+  top: 0;
+}
+.swiper-container-vertical > .swiper-pagination-progressbar,
+.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
+  width: 4px;
+  height: 100%;
+  left: 0;
+  top: 0;
+}
+.swiper-pagination-white {
+  --swiper-pagination-color: #ffffff;
+}
+.swiper-pagination-black {
+  --swiper-pagination-color: #000000;
+}
+.swiper-pagination-lock {
+  display: none;
+}
+/* Scrollbar */
+.swiper-scrollbar {
+  border-radius: 10px;
+  position: relative;
+  -ms-touch-action: none;
+  background: rgba(0, 0, 0, 0.1);
+}
+.swiper-container-horizontal > .swiper-scrollbar {
+  position: absolute;
+  left: 1%;
+  bottom: 3px;
+  z-index: 50;
+  height: 5px;
+  width: 98%;
+}
+.swiper-container-vertical > .swiper-scrollbar {
+  position: absolute;
+  right: 3px;
+  top: 1%;
+  z-index: 50;
+  width: 5px;
+  height: 98%;
+}
+.swiper-scrollbar-drag {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  background: rgba(0, 0, 0, 0.5);
+  border-radius: 10px;
+  left: 0;
+  top: 0;
+}
+.swiper-scrollbar-cursor-drag {
+  cursor: move;
+}
+.swiper-scrollbar-lock {
+  display: none;
+}
+.swiper-zoom-container {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+.swiper-zoom-container > img,
+.swiper-zoom-container > svg,
+.swiper-zoom-container > canvas {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+}
+.swiper-slide-zoomed {
+  cursor: move;
+}
+/* Preloader */
+:root {
+  /*
+  --swiper-preloader-color: var(--swiper-theme-color);
+  */
+}
+.swiper-lazy-preloader {
+  width: 42px;
+  height: 42px;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  margin-left: -21px;
+  margin-top: -21px;
+  z-index: 10;
+  transform-origin: 50%;
+  animation: swiper-preloader-spin 1s infinite linear;
+  box-sizing: border-box;
+  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
+  border-radius: 50%;
+  border-top-color: transparent;
+}
+.swiper-lazy-preloader-white {
+  --swiper-preloader-color: #fff;
+}
+.swiper-lazy-preloader-black {
+  --swiper-preloader-color: #000;
+}
+@keyframes swiper-preloader-spin {
+  100% {
+    transform: rotate(360deg);
+  }
+}
+/* a11y */
+.swiper-container .swiper-notification {
+  position: absolute;
+  left: 0;
+  top: 0;
+  pointer-events: none;
+  opacity: 0;
+  z-index: -1000;
+}
+.swiper-container-fade.swiper-container-free-mode .swiper-slide {
+  transition-timing-function: ease-out;
+}
+.swiper-container-fade .swiper-slide {
+  pointer-events: none;
+  transition-property: opacity;
+}
+.swiper-container-fade .swiper-slide .swiper-slide {
+  pointer-events: none;
+}
+.swiper-container-fade .swiper-slide-active,
+.swiper-container-fade .swiper-slide-active .swiper-slide-active {
+  pointer-events: auto;
+}
+.swiper-container-cube {
+  overflow: visible;
+}
+.swiper-container-cube .swiper-slide {
+  pointer-events: none;
+  -webkit-backface-visibility: hidden;
+          backface-visibility: hidden;
+  z-index: 1;
+  visibility: hidden;
+  transform-origin: 0 0;
+  width: 100%;
+  height: 100%;
+}
+.swiper-container-cube .swiper-slide .swiper-slide {
+  pointer-events: none;
+}
+.swiper-container-cube.swiper-container-rtl .swiper-slide {
+  transform-origin: 100% 0;
+}
+.swiper-container-cube .swiper-slide-active,
+.swiper-container-cube .swiper-slide-active .swiper-slide-active {
+  pointer-events: auto;
+}
+.swiper-container-cube .swiper-slide-active,
+.swiper-container-cube .swiper-slide-next,
+.swiper-container-cube .swiper-slide-prev,
+.swiper-container-cube .swiper-slide-next + .swiper-slide {
+  pointer-events: auto;
+  visibility: visible;
+}
+.swiper-container-cube .swiper-slide-shadow-top,
+.swiper-container-cube .swiper-slide-shadow-bottom,
+.swiper-container-cube .swiper-slide-shadow-left,
+.swiper-container-cube .swiper-slide-shadow-right {
+  z-index: 0;
+  -webkit-backface-visibility: hidden;
+          backface-visibility: hidden;
+}
+.swiper-container-cube .swiper-cube-shadow {
+  position: absolute;
+  left: 0;
+  bottom: 0px;
+  width: 100%;
+  height: 100%;
+  background: #000;
+  opacity: 0.6;
+  -webkit-filter: blur(50px);
+  filter: blur(50px);
+  z-index: 0;
+}
+.swiper-container-flip {
+  overflow: visible;
+}
+.swiper-container-flip .swiper-slide {
+  pointer-events: none;
+  -webkit-backface-visibility: hidden;
+          backface-visibility: hidden;
+  z-index: 1;
+}
+.swiper-container-flip .swiper-slide .swiper-slide {
+  pointer-events: none;
+}
+.swiper-container-flip .swiper-slide-active,
+.swiper-container-flip .swiper-slide-active .swiper-slide-active {
+  pointer-events: auto;
+}
+.swiper-container-flip .swiper-slide-shadow-top,
+.swiper-container-flip .swiper-slide-shadow-bottom,
+.swiper-container-flip .swiper-slide-shadow-left,
+.swiper-container-flip .swiper-slide-shadow-right {
+  z-index: 0;
+  -webkit-backface-visibility: hidden;
+          backface-visibility: hidden;
+}
--- a/wx_application/public/img/activeDetail_bg.jpg
+++ b/wx_application/public/img/activeDetail_bg.jpg
--- a/wx_application/public/img/coupon.png
+++ b/wx_application/public/img/coupon.png
--- a/wx_application/public/img/split.png
+++ b/wx_application/public/img/split.png
--- a/wx_application/public/img/success.png
+++ b/wx_application/public/img/success.png
--- a/wx_application/public/img/wheel.png
+++ b/wx_application/public/img/wheel.png
--- a/wx_application/public/js/swiper.animate1.0.3.min.js
+++ b/wx_application/public/js/swiper.animate1.0.3.min.js
+//本插件由www.swiper.com.cn提供
+//版本1.03
+function swiperAnimateCache(a){for(j=0;j<a.slides.length;j++)for(allBoxes=a.slides[j].querySelectorAll(".ani"),i=0;i<allBoxes.length;i++)allBoxes[i].attributes["style"]?allBoxes[i].setAttribute("swiper-animate-style-cache",allBoxes[i].attributes["style"].value):allBoxes[i].setAttribute("swiper-animate-style-cache"," "),allBoxes[i].style.visibility="hidden"}function swiperAnimate(a){clearSwiperAnimate(a);var b=a.slides[a.activeIndex].querySelectorAll(".ani");for(i=0;i<b.length;i++)b[i].style.visibility="visible",effect=b[i].attributes["swiper-animate-effect"]?b[i].attributes["swiper-animate-effect"].value:"",b[i].className=b[i].className+"  "+effect+" "+"animated",style=b[i].attributes["style"].value,duration=b[i].attributes["swiper-animate-duration"]?b[i].attributes["swiper-animate-duration"].value:"",duration&&(style=style+"animation-duration:"+duration+";-webkit-animation-duration:"+duration+";"),delay=b[i].attributes["swiper-animate-delay"]?b[i].attributes["swiper-animate-delay"].value:"",delay&&(style=style+"animation-delay:"+delay+";-webkit-animation-delay:"+delay+";"),b[i].setAttribute("style",style)}function clearSwiperAnimate(a){for(j=0;j<a.slides.length;j++)for(allBoxes=a.slides[j].querySelectorAll(".ani"),i=0;i<allBoxes.length;i++)allBoxes[i].attributes["swiper-animate-style-cache"]&&allBoxes[i].setAttribute("style",allBoxes[i].attributes["swiper-animate-style-cache"].value),allBoxes[i].style.visibility="hidden",allBoxes[i].className=allBoxes[i].className.replace("animated"," "),allBoxes[i].attributes["swiper-animate-effect"]&&(effect=allBoxes[i].attributes["swiper-animate-effect"].value,allBoxes[i].className=allBoxes[i].className.replace(effect," "))}
\ No newline at end of file
--- a/wx_application/public/js/swiper.min.js
+++ b/wx_application/public/js/swiper.min.js
--- a/wx_application/src/assets/style/public.scss
+++ b/wx_application/src/assets/style/public.scss
@@ -66,4 +66,9 @@ input:focus{ outline: none;}
  flex-direction: column;
  width: 100%;
  background-color: #fff;
+}
+.flex {
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
\ No newline at end of file
--- a/wx_application/src/main.js
+++ b/wx_application/src/main.js
@@ -5,11 +5,13 @@ import router from './router'
 import store from './store'
 import './lib/rem';
 import Vant from 'vant';
+import { Toast } from 'vant';
 import 'vant/lib/index.css';

 Vue.config.productionTip = false

 Vue.use(Vant);
+Vue.use(Toast);

 const originalPush = Router.prototype.push
 Router.prototype.push = function push(location) {

--- a/wx_application/src/router/index.js
+++ b/wx_application/src/router/index.js
@@ -3,7 +3,7 @@ import VueRouter from 'vue-router'
 import Home from '../views/home.vue'

 import { getXToken, configWx } from '@/utils/aCommon'
-
+// import mineRoute from  './mine'
 Vue.use(VueRouter)

 const routes = [
@@ -37,6 +37,16 @@ const routes = [
    name: 'createBigWheelActive',
    component: () => import('../views/active/createBigWheelActive.vue')
  },
+  {
+    path: '/createSuccess',
+    name: 'createSuccess',
+    component: () => import('@/views/active/createSuccess')
+  },
+  {
+    path: '/activeDetail',
+    name: 'activeDetail',
+    component: () => import('@/views/active/activeDetail')
+  },
  {
    path: '/mainSale',
    name: 'MainSale',
@@ -57,6 +67,11 @@ const routes = [
    name: 'counterMaintain',
    component: () => import('@/views/counter/counterMaintain')
  },
+  {
+    path: '/counterHome',
+    name: 'counterHome',
+    component: () => import('@/views/counter/counterHomePage')
+  },
  {
    path: '/counterEdit',
    name: 'counterEdit',
@@ -141,7 +156,8 @@ const routes = [
    path: '/qrCode',
    name: 'qrCode',
    component: () => import('@/views/qrCode/index')
-  }
+  },
+  // ...mineRoute
  // {
  //   path: '/about',
  //   name: 'about',

--- a/wx_application/src/store/modules/message.js
+++ b/wx_application/src/store/modules/message.js
+export default {
+  namespaced: true,
+  state: {
+    title:'',
+    content:''
+  },
+  mutations: {
+    title(state, title) {
+      state.title = title
+    },
+    content(state, content) {
+      state.content = content
+    },
+  }
+}
--- a/wx_application/src/utils/aCommon.js
+++ b/wx_application/src/utils/aCommon.js
@@ -18,14 +18,11 @@ async function getXToken() {
    corpId: INFO.corpId,
    agentId: INFO.agentId,
  }
-  alert('获取token')
-  await wxRequest('/workWx/auth/oauth2/getAccessToken', postData,'get').then(res => {
+  await wxRequest('/workWx/auth/oauth2/getAccessToken', qs.stringify(postData)).then(res => {
    if (res.result === 'success') {
-      alert('token获取成功')
      sessionStorage.setItem('XToken', res.data)
      console.log('%c--->getXToken: RD =', 'background: limegreen;', res)
    } else {
-      alert('token获取失败')
      console.log('%c--->getXToken: N/A. ', 'background: red;')

      // this.$message({
@@ -34,13 +31,12 @@ async function getXToken() {
      // })
    }
  }).catch(err => {
-    alert('TOKEN失败')
-    console.log('!==>getXToken: err:', err)
+    console.log(err,'err');    
  })
 }

 function isIosOrAndroid() {
-  alert('isIosOrAndroid')
+  // alert('isIosOrAndroid')
  let u = navigator.userAgent;
  let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1 // android终端
  let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) // ios终端
@@ -55,12 +51,13 @@ function isIosOrAndroid() {
 }

 Vue.prototype.getAgentAuth = function () {
+  // alert(location.href)
  let postData = {
    // businessId: sessionStorage.getItem('businessId'),
    // pageUrl: encodeURIComponent(this.isIosOrAndroid() === 'android' ? location.href.split('#')[0] : window.initUrl)
    pageUrl: encodeURIComponent(location.href.split('#')[0])
  }
-  alert(`--->zCommon.js: postData =${JSON.stringify(postData)}`)
+  // alert(`--->zCommon.js: postData =${JSON.stringify(postData)}`)

  let header = {
    token: sessionStorage.getItem('XToken'),
@@ -74,7 +71,7 @@ Vue.prototype.getAgentAuth = function () {
  wxRequest('/workWx/auth/base/getJsSdkSignature', qs.stringify(postData), header)
    .then(res => {
      // alert(`--->zCommon.js: getJsSdkSignature: then.`)
-      alert(`--->zCommon.js: getJsSdkSignature: then: res =${JSON.stringify(res)}`)
+      // alert(`--->zCommon.js: getJsSdkSignature: then: res =${JSON.stringify(res)}`)

      if (res.result === 'success') {
        console.log('%c--->getAgentAuth: getJsSdkSignature: RD =', 'background: limegreen;', res.data)
@@ -83,7 +80,7 @@ Vue.prototype.getAgentAuth = function () {
        let config = res.data
        wx.config({
          beta: true,
-          debug: true, //调试的时候可以开启
+          debug: false, //调试的时候可以开启
          appId: config.jsApiSignature.appId, // 必填，公众号的唯一标识
          timestamp: config.jsApiSignature.timestamp, // 必填，生成签名的时间戳
          nonceStr: config.jsApiSignature.nonceStr, // 必填，生成签名的随机串
@@ -96,14 +93,14 @@ Vue.prototype.getAgentAuth = function () {
          }
        })

-         alert(`--->zCommon.js: getJsSdkSignature: then: wx.config: end.`)
+        //  alert(`--->zCommon.js: getJsSdkSignature: then: wx.config: end.`)
        wx.ready(function () {
          zlog('%c--->getAgentAuth: getJsSdkSignature: Ready.', 'color: red;')
-          alert(`--->zCommon.js: getJsSdkSignature: then: wx.ready: IN.`)
+          // alert(`--->zCommon.js: getJsSdkSignature: then: wx.ready: IN.`)

          // JS-SDK配置信息验证失败时会进入此方法
          wx.error(function (res) {
-            alert('sdk配置失败')
+            // alert('sdk配置失败')
          })

          // 配置成功后验证API接口在当前客户端是否支持：判断当前客户端版本是否支持指定JS接口
@@ -120,7 +117,7 @@ Vue.prototype.getAgentAuth = function () {
                    // alert(`!-->zCommon.js: getJsSdkSignature: then: wx.ready: wx.checkJsApi: getAgentJsSdkSignature: res.`)
                    // alert(`!-->zCommon.js: getJsSdkSignature: then: wx.ready: wx.checkJsApi: getAgentJsSdkSignature: res =${JSON.stringify(res)}`)

-                    alert('getAgentJsSdkSignature:ok')
+                    // alert('getAgentJsSdkSignature:ok')
                    if (res.result === 'success') {
                      let agentConfig = res.data
                      wx.agentConfig({
@@ -131,7 +128,7 @@ Vue.prototype.getAgentAuth = function () {
                        signature: agentConfig.agentJsApiSignature.signature,// 必填，签名，agentConfig所以为应用签名
                        jsApiList: ['sendChatMessage'], //必填
                        success: function (res) {
-                          alert('agentConfigSuccess')
+                          // alert('agentConfigSuccess')
                          // alert(`!-->zCommon.js: getJsSdkSignature: then: wx.ready: wx.checkJsApi: getAgentJsSdkSignature: wx.agentConfig: res.`)
                          // alert(`!-->zCommon.js: getJsSdkSignature: then: wx.ready: wx.checkJsApi: getAgentJsSdkSignature: wx.agentConfig: res =${JSON.stringify(res)}`)
                          // alert('agentConfig:ok')
@@ -139,10 +136,10 @@ Vue.prototype.getAgentAuth = function () {
                          // 回调
                          //1、发起申请申请时后，审批状态发生变化时
                          //2、发起申请申请时后，在“审批中”状态，有任意审批人进行审批操作时
-                          alert('wx.agentConfig 回调'+res.errMsg);
+                          // alert('wx.agentConfig 回调'+res.errMsg);
                        },
                        fail: function (res) {
-                          alert('agentConfigFailed')
+                          // alert('agentConfigFailed')
                          // alert('回调失败：'+res.errMsg)
                          if (res.errMsg.indexOf('is not a function') > -1) {
                            alert('<i class="weui-icon-warn">版本过低请升级</i>')
@@ -207,11 +204,11 @@ function configWx(to) {
        wx.checkJsApi({
          jsApiList: ['agentConfig', 'getCurExternalContact'],
          success: function (res) {
-            alert(`--->wx.checkJsApi: success. res =${JSON.stringify(res)}`);
+            // alert(`--->wx.checkJsApi: success. res =${JSON.stringify(res)}`);
            // router.push(to)

            if (res.errMsg != "checkJsApi:ok") {
-              alert("JS-SDK接口检测失败:" + JSON.stringify(res));
+              // alert("JS-SDK接口检测失败:" + JSON.stringify(res));
              return false;
            }
          }

--- a/wx_application/src/utils/bRequest.js
+++ b/wx_application/src/utils/bRequest.js
+import axios from 'axios'
+import envConfig from '@/config/env-config'
+
+let INFO = {
+  // corpId: 'wwd1cdbca7b8b2b6c4',
+  // agentId: '1000015',
+  corpId: 'ww4df265003b43fa0d',
+  agentId: '1000033',
+  url: envConfig.appBaseUrlB,
+}
+
+// 创建axios实例
+const service = axios.create({
+  baseURL: INFO.url, // api 的 base_url
+  timeout: 50000 // 请求超时时间
+})
+
+// request拦截器
+service.interceptors.request.use(
+  (config) => {
+    if (sessionStorage['token']) {
+      config.headers['token'] = sessionStorage['token']
+      config.headers['businessId'] = sessionStorage['businessId']
+    } else {
+      config.headers['businessId'] = '10'
+    }
+    return config;
+  },
+  (error) => {
+    Promise.reject(error)
+  }
+)
+
+// response 拦截器
+service.interceptors.response.use(
+  response => {
+    console.log(response)
+    if(response.status == 200) {
+      return response.data
+    } else {
+      Message({
+        message: response.data.msg,
+        type: 'error',
+        duration: 5 * 1000
+      })
+    }
+  },
+  error => {
+    console.log(error)
+  }
+)
+export default service
--- a/wx_application/src/utils/utils.Request.aApi.js
+++ b/wx_application/src/utils/utils.Request.aApi.js
+/**
+ * Created by supervisor on 2020/3/31
+ */
+import requestAPI from '@/utils/bRequest'
+
+export function getMessageByClerkId(params) {
+  return requestAPI({
+    url: '/admin/auth/marketing/getMessageByClerkId',
+    method: 'get',
+    params
+  })
+}
+
+export function getClerkInfoBySupervisorId(params) {
+  return requestAPI({
+    url: '/admin/auth/addressbook/clerk/getClerkInfoBySupervisorId',
+    method: 'get',
+    params
+  })
+}
+
+export function newTask(data) {
+  return requestAPI({
+    url: '/admin/auth/marketing/newTask',
+    method: 'post',
+    data
+  })
+}
--- a/wx_application/src/views/active/activeDetail.vue
+++ b/wx_application/src/views/active/activeDetail.vue
+<template>
+  <div id="active-detail">
+    <img class="bg" src="../../../public/img/activeDetail_bg.jpg" alt="bg">
+    <template v-if="type === 'coupon'">
+      <div class="coupon">
+        <div class="user-icon">用户头像</div>
+        <p class="slogan">送你限量优惠券，手慢无～</p>
+        <div class="coupon-content">
+          <img src="../../../public/img/coupon.png" alt="coupon_bg">
+          <div class="content">
+            <div class="money">10元</div>
+            <div class="split">
+              <img src="../../../public/img/split.png" alt="split">
+            </div>
+            <div class="other">
+              <p>满50元可用</p>
+              <p>有效期：09.09-09.10</p>
+              <p>全店通用</p>
+            </div>
+          </div>
+        </div>
+        <div class="btn">立即领取</div>
+      </div>
+    </template>
+    <template v-if="type === 'wheel'">
+      <div class="wheel-container">
+        <p class="title">幸运大抽奖！</p>
+        <div class="wheel">
+          <img src="../../../public/img/wheel.png" alt="wheel">
+        </div>
+        <div class="awards">
+          <ul>
+            <li><span>一等奖：</span><span>价值280元的优惠券</span></li>
+          </ul>
+        </div>
+        <div class="time-line">距离结束仅剩 <span>16天10:45:38</span></div>
+        <div class="description">
+          <div class="t">活动介绍</div>
+          <div class="content">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magn
+          </div>
+        </div>
+      </div>
+    </template>
+    <div class="btn-share" :style="type === 'coupon'? 'bottom: 0': ''">立即分享</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'active-detail',
+  components: {},
+  data() {
+    return {
+      type: 'coupon'
+    }
+  },
+  created() {
+    this.type = this.$route.query.type;
+  }
+}
+</script>
+
+<style lang="scss">
+#active-detail {
+  height: 100%;
+  .bg {
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    z-index: -10;
+  }
+  .coupon {
+    position: relative;
+    top: 15%;
+    width: 90%;
+    margin: 0 auto;
+    background: #fff;
+    border: 1px solid #000;
+
+    .user-icon {
+      position: absolute;
+      top: -54px;
+      left: 0;
+      right: 0;
+      display: block;
+      width: 100px;
+      height: 100px;
+      margin: 0 auto;
+      text-align: center;
+      line-height: 100px;
+      font-size: 18px;
+      border: 1px solid;
+      border-radius: 50%;
+      background: #fff;
+      // filter: blur(2px);
+    }
+
+    .slogan {
+      height: 80px;
+      padding-top: 25px;
+      line-height: 80px;
+      font-size: 16px;
+      text-align: center;
+    }
+    
+    .coupon-content {
+      position: relative;
+      width: 90%;
+      margin: 10px auto;
+      img {
+        width: 100%;
+      }
+      .content {
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        width: 80%;
+        height: 92%;
+        margin: 0 auto;
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        .money {
+          font-size: 32px;
+          font-weight: bold;
+        }
+        .split > img {
+          height: 70px;
+        }
+        .other {
+          font-size: 14px;
+          font-weight: 400;
+          p {
+            margin-bottom: 5%;
+          }
+        }
+      }
+    }
+
+    .btn {
+      width: 85%;
+      height: 50px;
+      margin: 10px auto 30px;
+      line-height: 50px;
+      text-align: center;
+      font-size: 0.5625rem;
+      background-color: #fc0;
+      border-radius: 4px;
+    }
+  }
+
+  .wheel-container {
+    .title {
+      padding-top: 15%;
+      font-size: 40px;
+      text-align: center;
+      color: #fff;
+    }
+
+    .wheel {
+      width: 100%;
+      img {
+        width: 100%;
+      }
+    }
+
+    .awards {
+      width: 80%;
+      min-height: 100px;
+      background: #ff9;
+      margin: 0 auto 10px;
+      border-radius: 10px;
+      li {
+        padding: 10px 20px;
+        font-size: 0.5rem;
+        font-weight: bold;
+      }
+    }
+    
+    .time-line {
+      width: 80%;
+      text-align: center;
+      font-size: 16px;
+      margin: 0 auto 20px;
+      border-radius: 4px;
+      background: #fff;
+      span {
+        color: #f00;
+        font-size: 18px;
+      }
+    }
+
+    .description {
+      width: 100%;
+      padding: 5px 1px;
+      background: #fff;
+      .t {
+          position: relative;
+          font-size: 16px;
+          font-weight: bold;
+          padding-left: 20px;
+        &::before {
+          content: '';
+          display: block;
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 8px;
+          height: 21px;
+          background: #fc0;
+        }
+      }
+      .content {
+        padding: 10px;
+        font-size: 14px;
+      }
+    }
+  }
+
+  .btn-share {
+    position: absolute;
+    display: block;
+    width: 100%;
+    height: 45px;
+    margin: 0.3125rem auto;
+    text-align: center;
+    font-size: 18px;
+    line-height: 45px;
+    background-color: #169bd5;
+  }
+}
+</style>
--- a/wx_application/src/views/active/activeList.vue
+++ b/wx_application/src/views/active/activeList.vue
@@ -5,25 +5,11 @@
      <span class="fr">查看更多<span class="icon">></span></span>
    </div>
    <div class="active">
-      <div class="list">
-          <div class="left"></div>
-          <div class="right">
-            <h3>砍价</h3>
-            <p>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状。</p>
-          </div>
-      </div>
-      <div class="list">
+      <div class="list" v-for="item in activeList" :key="item.id" @click="toDetail(item.id, item.type)">
          <div class="left"></div>
          <div class="right">
-            <h3>集赞</h3>
-            <p>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状。</p>
-          </div>
-      </div>
-      <div class="list list3">
-          <div class="left"></div>
-          <div class="right">
-            <h3>推荐有礼</h3>
-            <p>由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状。</p>
+            <h3>{{ item.activeName }}</h3>
+            <p>{{ item.description }}</p>
          </div>
      </div>
    </div>
@@ -48,7 +34,37 @@
 </template>

 <script>
-export default {};
+export default {
+  data() {
+    return {
+      activeList: [
+        {
+          id: 1,
+          type: 'coupon',
+          activeName: '砍价',
+          description: '由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状。'
+        },
+        {
+          id: 2,
+          type: 'wheel',
+          activeName: '集赞',
+          description: '由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状。'
+        }
+      ]
+    }
+  },
+  methods: {
+    toDetail(active_id, type) {
+      this.$router.push({
+        path: '/activeDetail',
+        query: {
+          id: active_id,
+          type: type
+        }
+      })
+    }
+  }
+};
 </script>

 <style scoped>

--- a/wx_application/src/views/active/createBigWheelActive.vue
+++ b/wx_application/src/views/active/createBigWheelActive.vue
@@ -260,7 +260,18 @@
        </div>
      </div>

-      <van-cell title="开始时间" style="font-size:14px;">
+     <div class="yhbr" style="padding: 0.4375rem;">
+       <div class="top">
+          <span style="color:#2d476a;">券有效期</span>
+          <van-radio-group v-model="prizeList[index].timeline_type" class="right" @change="radioChange">
+            <van-radio name="1" style="float:left;margin-right:10px;">指定日期</van-radio>
+            <van-radio name="2" style="float:right;">有效天数</van-radio>
+          </van-radio-group>
+       </div>
+      </div>
+
+      <template v-if="prizeList[index].timeline_type == 1">
+        <van-cell title="开始时间" style="font-size:14px;">
        <template slot="default">
          <div class="jpsl">
            <van-field
@@ -285,33 +296,38 @@
            </van-popup>
          </div>
        </template>
-      </van-cell>
-      <van-cell title="结束时间" style="font-size:14px;">
-        <template slot="default">
-          <div class="jpsl">
-            <van-field
-              class="right"
-              v-model="prizeList[index].endTime1"
-              placeholder="选择活动结束时间"
-              readonly="readonly"
-              @click="prizeList[index].endShow = true"
-            />
-            <van-popup
-              v-model="prizeList[index].endShow"
-              position="bottom"
-              :overlay="true"
-            >
-              <van-datetime-picker
-                v-model="prizeList[index].endTime"
-                type="date"
-                @cancel="prizeList[index].endShow = false"
-                @confirm="handleEndTime(prizeList[index].endTime,index)"
-                @change="endTimeChange2(prizeList[index].endTime, index)"
+        </van-cell>
+        <van-cell title="结束时间" style="font-size:14px;">
+          <template slot="default">
+            <div class="jpsl">
+              <van-field
+                class="right"
+                v-model="prizeList[index].endTime1"
+                placeholder="选择活动结束时间"
+                readonly="readonly"
+                @click="prizeList[index].endShow = true"
              />
-            </van-popup>
-          </div>
-        </template>
-      </van-cell>
+              <van-popup
+                v-model="prizeList[index].endShow"
+                position="bottom"
+                :overlay="true"
+              >
+                <van-datetime-picker
+                  v-model="prizeList[index].endTime"
+                  type="date"
+                  @cancel="prizeList[index].endShow = false"
+                  @confirm="handleEndTime(prizeList[index].endTime,index)"
+                  @change="endTimeChange2(prizeList[index].endTime, index)"
+                />
+              </van-popup>
+            </div>
+          </template>
+        </van-cell>
+      </template>
+      <template v-else>
+        
+      </template>
+
      <van-cell title="奖品数量" style="font-size:14px;">
        <template slot="default">
          <div class="jpsl">
@@ -332,28 +348,26 @@
          </div>
        </template>
      </van-cell>
-      <van-cell style="font-size:14px;" center class="cs">
+      <van-cell style="font-size:14px;" center class="cs" label="此奖项每天最多可抽中的数量">
        <template slot="title">
          <span class="custom-title">每日上限</span>
-          <span class="small">（此奖项每天最多可抽中的数量）</span>
+          <!-- <span class="small"></span> -->
+        </template>
+        <template slot="default">
+          <van-field
+            class="right noborder"
+            readonly
+            clickable
+            :value="prizeList[index].limit"
+            placeholder="请输入次数"
+            @touchstart.native.stop="prizeList[index].limitShow = true"
+          />
+          <van-number-keyboard
+            v-model="prizeList[index].limit"
+            :show="prizeList[index].limitShow"
+            @blur="prizeList[index].limitShow = false"
+          />
        </template>
-        <div class="jpsl">
-          <template slot="default">
-            <van-field
-              class="right noborder"
-              readonly
-              clickable
-              :value="prizeList[index].limit"
-              placeholder="请输入次数"
-              @touchstart.native.stop="prizeList[index].limitShow = true"
-            />
-            <van-number-keyboard
-              v-model="prizeList[index].limit"
-              :show="prizeList[index].limitShow"
-              @blur="prizeList[index].limitShow = false"
-            />
-          </template>
-        </div>
      </van-cell>
      <div class="add" @click="addPrice">添加奖项</div>
    </van-cell-group>
@@ -375,7 +389,7 @@
      <div class="des">活动图片</div>
      <van-uploader v-model="fileList" multiple :max-count="9" />
    </div>
-    <div class="creat">创建活动</div>
+    <div class="creat" @click="handleCreate">创建活动</div>
  </div>
 </template>

@@ -406,6 +420,7 @@ export default {
      prizeList: [
        {
          name: "",
+          timeLine_type: "",
          type: "",
          discountsMoney: "",
          discountsShow: false,
@@ -440,6 +455,12 @@ export default {
    };
  },
  methods: {
+    radioChange(val) {
+      // console.log(val);
+    },
+    handleCreate() {
+      this.$router.push('/createSuccess');
+    },
    startTimeChange(e) {
      let startTimeArr = e.getValues();
      this.basicInfo.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]}`;
@@ -774,3 +795,13 @@ export default {
  align-items: center;
 }
 </style>
+
+<style lang="scss">
+.container {
+  .cs {
+    .van-cell__value {
+      flex: 2
+    }
+  }
+}
+</style>
\ No newline at end of file
--- a/wx_application/src/views/active/createSuccess.vue
+++ b/wx_application/src/views/active/createSuccess.vue
+<template>
+  <div id="create-success">
+    <div v-show="step === 2" class="box one">
+      <van-cell-group class="input-cell">
+        <van-field v-model="newTemplateName" placeholder="请输入新的模板名称！" />
+      </van-cell-group>
+    </div>
+    <div v-show="step === 1" class="box two">
+      <div class="success-icon">
+        <img class="fg" src="../../../public/img/success.png" alt="success-fg">
+        <p>创建活动成功！</p>
+      </div>
+    </div>
+    <div class="box three">
+      <div class="btn-group">
+        <van-button v-if="step === 2" type="info">取消</van-button>
+        <van-button v-if="step === 1" type="info" @click="saveNewTemplate">保存为新的模板</van-button>
+        <van-button type="info">完成</van-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "createSuccess",
+  components: {},
+  data() {
+    return {
+      newTemplateName: '',
+      step: 1
+    };
+  },
+  methods: {
+    saveNewTemplate() {
+      this.step = 2;
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+#create-success {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  .box {
+    margin-bottom: 20px;
+  }
+  
+  .one { 
+    flex: 1;
+    .input-cell {
+      width: 90%;
+      margin: 20px auto;
+      border: 1px solid #d4cfcf;
+    }
+  }
+
+  .two {
+    flex: 3;
+    .success-icon {
+      margin-top: 100px;
+      text-align: center;
+      img {
+        margin: 0 auto;
+      }
+      p {
+        font-size: 14px;
+      }
+    }
+  }
+
+  .three { 
+    display: flex;
+    justify-content: center;
+    padding: 0 20px;
+    .btn-group {
+
+      .van-button {
+        width: 150px;
+        &:first-child{
+          margin-right: 10px;
+        }
+      }
+    }
+  }
+}
+</style>
--- a/wx_application/src/views/counter/counterHomePage.vue
+++ b/wx_application/src/views/counter/counterHomePage.vue
+<template>
+  <div class="container">
+    <div class="flex-start">
+      <div class="img">
+        <van-swipe :autoplay="3000">
+          <van-swipe-item>
+            <img src="../../../public/img/cswiper.png" />
+          </van-swipe-item>
+          <van-swipe-item>
+            <img src="../../../public/img/cswiper.png" />
+          </van-swipe-item>
+          <van-swipe-item>
+            <img src="../../../public/img/cswiper.png" />
+          </van-swipe-item>
+          <van-swipe-item>
+            <img src="../../../public/img/cswiper.png" />
+          </van-swipe-item>
+        </van-swipe>
+    </div>
+    <div class="list">
+      <div class="left flex">
+        <img src="../../../public/img/counter.png" alt="" />
+      </div>
+      <div class="right">
+        <h3>欧亚一号专柜</h3>
+        <div class="txt">
+          <van-icon name="phone-o" size="16" style="vertical-align: middle;" />
+          <span>18888888888</span>
+        </div>        
+        <div class="txt">
+          <van-icon name="location-o" size="16" style="vertical-align: middle;"  />
+          <span>欧亚商场一楼181号</span>
+        </div> 
+      </div>
+    </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+ .container {
+  background: #f8f8f8;
+  height: auto;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  flex-direction: column;
+  min-height: 100%;
+}
+.img {
+  width: 100%;
+  height: 200px;
+  /* background-color: pink; */
+}
+.img img {
+  width: 100%;
+}
+.list {
+  height: auto;
+  width: 100%;
+  background-color: #fff;
+  display: flex;
+  justify-content: flex-start;
+  border-bottom: 1px solid rgba(238, 238, 238, 1);
+  box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
+  border-radius: 2px;
+  z-index: 100;
+}
+.left {
+  width: 30%;
+}
+.left img {
+  width: 80px;
+}
+.right {
+  width: 76%;
+  padding: 10px;
+  background-color: #fff;
+  height: auto;
+}
+h3 {
+  font-size: 14px;
+  font-weight: bold;
+  color: rgba(45, 71, 106, 1);
+}
+.txt {
+  margin-top: 10px;
+  font-size: 12px;
+  color: rgba(45, 71, 106, 0.8);
+}
+</style>
--- a/wx_application/src/views/counter/counterInfo.vue
+++ b/wx_application/src/views/counter/counterInfo.vue
@@ -24,7 +24,7 @@
    </div>
    <van-cell-group class="gn">
      <van-cell title="专柜信息" is-link value="详细信息" @click="handleEdit" />
-      <van-cell title="访问专柜首页" is-link value="详细信息" />
+      <van-cell title="访问专柜首页" is-link value="详细信息" @click="handleCounterHome" />
      <van-cell title="专柜收款码" is-link value="详细信息" @click="getChargeCode" />
      <van-cell title="推送门店信息" is-link value="详细信息" @click="handlePushInfo" />
    </van-cell-group>
@@ -32,10 +32,10 @@
 </template>

 <script>
-import { quillEditor } from "vue-quill-editor";
-import "quill/dist/quill.core.css";
-import "quill/dist/quill.snow.css";
-import "quill/dist/quill.bubble.css";
+import { quillEditor } from "vue-quill-editor"
+import "quill/dist/quill.core.css"
+import "quill/dist/quill.snow.css"
+import "quill/dist/quill.bubble.css"
 export default {
  data() {
    return {};
@@ -49,6 +49,9 @@ export default {
    },
    handlePushInfo() { 
      this.$router.push("pushStoreInfo")
+    },
+    handleCounterHome() { 
+      this.$router.push("counterHome")
    }
  }
 };

--- a/wx_application/src/views/counter/pushStoreInfo.vue
+++ b/wx_application/src/views/counter/pushStoreInfo.vue
@@ -20,6 +20,7 @@
 </template>

 <script>
+import axios from "axios";
 export default {
    data() {
        return {
@@ -37,7 +38,8 @@ export default {
                }
            ],
            list: [],
-            info: ''
+            info: '',
+            userId: ''
        }
    },
    mounted() {
@@ -46,19 +48,23 @@ export default {
    },
    methods: {
      getList() {
-        alert('getList')
-        wx.invoke('selectExternalContact', {
-          "filterType": 0, 
-        }, 
-        function(res){
-          if(res.err_msg == "selectExternalContact:ok"){
-            alert(`${JSON.stringify(res)}`)
-            this.info = `${JSON.stringify(res)}`
-          }else {
-              //错误处理
-              alert('获取失败')
-          }
+        alert('获取外部联系人')
+        alert(sessionStorage.getItem('userId'))
+        sessionStorage.getItem('userId')
+        this.userId = sessionStorage.getItem('userId')
+        axios({
+          url: "/workWx/auth/contact/listExternalContacts?userId=" + this.userId,
+          method: "get",
+          headers: headerData
        })
+          .then(res => {
+            alert('获取外部联系人成功')
+            alert('JSON.stringify(res)')
+            this.userInfo = JSON.stringify(res)
+          })
+          .catch(err => {
+            this.zcache.userInfoResNew = "RESERR.";
+          });
      },
      onChange(val) { },      
      toggle(event) {

--- a/wx_application/src/views/mainSale/me/main/index.vue
+++ b/wx_application/src/views/mainSale/me/main/index.vue
@@ -36,7 +36,7 @@
      <div class="list list-latest">
        <div class="list-title">我的收益</div>
        <img class="list-icon" :src="cache.icon.arrowRightDark" />
-      </div>     
+      </div>
    </div>

    <div class="main-menuBar">
@@ -65,55 +65,56 @@
 </template>

 <script>
-import { configWx, getUserInfo } from "@/utils/aCommon";
-import axios from "axios";
-export default {
-  name: "me",
-  data() {
-    return {
-      cache: {
-        icon: {
-          testImg: "/mainSale/test-city.png",
-          arrowRightLight: "/mainSale/icon-arrow-right-light.png",
-          arrowRightDark: "/mainSale/icon-arrow-right-dark.png"
-        }
-      },
-      userInfo: '',
-      menuBarInfo: {
-        list: {
-          main: [
-            {
-              name: "",
-              iconUaUrl: "",
-              iconAcUrl: ""
-            }
-          ]
+  import {configWx, getUserInfo} from "@/utils/aCommon";
+  import axios from "axios";
+
+  export default {
+    name: "me",
+    data() {
+      return {
+        cache: {
+          icon: {
+            testImg: "/mainSale/test-city.png",
+            arrowRightLight: "/mainSale/icon-arrow-right-light.png",
+            arrowRightDark: "/mainSale/icon-arrow-right-dark.png"
+          }
        },
-        icon: {
-          now: {
-            "1": "",
-            "2": "",
-            "3": "",
-            "4": "",
-            "5": ""
+        userInfo: '',
+        menuBarInfo: {
+          list: {
+            main: [
+              {
+                name: "",
+                iconUaUrl: "",
+                iconAcUrl: ""
+              }
+            ]
          },
-          ua: {
-            "1": "/mainSale/icon-menuBar-1-ua.png",
-            "2": "/mainSale/icon-menuBar-2-ua.png",
-            "3": "/mainSale/icon-menuBar-3-ua.png",
-            "4": "/mainSale/icon-menuBar-4-ua.png",
-            "5": "/mainSale/icon-menuBar-5-ua.png"
-          },
-          ac: {
-            "1": "/mainSale/icon-menuBar-1-ac.png",
-            "2": "/mainSale/icon-menuBar-2-ac.png",
-            "3": "/mainSale/icon-menuBar-3-ac.png",
-            "4": "/mainSale/icon-menuBar-4-ac.png",
-            "5": "/mainSale/icon-menuBar-5-ac.png"
+          icon: {
+            now: {
+              "1": "",
+              "2": "",
+              "3": "",
+              "4": "",
+              "5": ""
+            },
+            ua: {
+              "1": "/mainSale/icon-menuBar-1-ua.png",
+              "2": "/mainSale/icon-menuBar-2-ua.png",
+              "3": "/mainSale/icon-menuBar-3-ua.png",
+              "4": "/mainSale/icon-menuBar-4-ua.png",
+              "5": "/mainSale/icon-menuBar-5-ua.png"
+            },
+            ac: {
+              "1": "/mainSale/icon-menuBar-1-ac.png",
+              "2": "/mainSale/icon-menuBar-2-ac.png",
+              "3": "/mainSale/icon-menuBar-3-ac.png",
+              "4": "/mainSale/icon-menuBar-4-ac.png",
+              "5": "/mainSale/icon-menuBar-5-ac.png"
+            }
          }
-        }
-      },
-       zcache: {
+        },
+        zcache: {
          nowUrl: "",
          preAuthCodeUrl: "",
          code: "",
@@ -125,11 +126,11 @@ export default {
  },
  mounted() {
    this.checkNowMenuBar()
-    this.zReadyUserId()
+    // this.zReadyUserId()
    this.zTestGetNowUrlInfo()
-    
+
  },
-  methods: {  
+  methods: {
    checkNowMenuBar() {
      let inData = "5";
      this.menuBarInfo.icon.now = this.menuBarInfo.icon.ua;
@@ -157,7 +158,7 @@ export default {
        "color: orange;",
        this.$route.query.code
      ) */
-      
+
      if (this.$route.query.code === undefined){
        // alert('没code')
        this.zTestPreAuthCode()
@@ -172,10 +173,10 @@ export default {
        // alert('获取url')
        this.zcache.nowUrl = JSON.stringify(this.$route.query);
        this.zcache.code = String(this.$route.query.code);
-        this.url = this.zcache.nowUrl 
+        this.url = this.zcache.nowUrl
      },
      zTestPreAuthCode() {
-        // alert('获取code')      
+        // alert('获取code')
        const basicInfo = {
          head: "https://open.weixin.qq.com/connect/oauth2/authorize?",
          // appId: "wwd1cdbca7b8b2b6c4",
@@ -230,8 +231,13 @@ export default {
            this.zcache.userInfoResNew = "RESERR.";
          });
      },
-  }
-};
+      handleDetail(type){
+        if(type === 'message'){
+          this.$router.push('/message')
+        }
+      }
+    }
+  };
 </script>

 <style scoped>

--- a/wx_application/src/views/mainSale/message/addMessage.vue
+++ b/wx_application/src/views/mainSale/message/addMessage.vue
+<template>
+    <div class="add-message-container">
+        <van-nav-bar left-text="取消" right-text="下一步"
+                     @click-left="onClickLeft"
+                     @click-right="onClickRight"
+        />
+        <van-panel class="van-panel">
+            <template #header>
+                <van-field class="message-title" v-model="title" placeholder="请输入标题" />
+            </template>
+
+            <van-field class="message-content" v-model="content" placeholder="请输入内容"  input-align="left"  type="textarea"
+            />
+        </van-panel>
+    </div>
+</template>
+
+<script>
+  export default {
+    name: 'addMessage',
+    data() {
+      return {
+        title:'',
+        content:''
+      }
+    },
+    methods: {
+      onClickLeft() {
+        this.$router.back()
+      },
+      onClickRight() {
+        //发布  全员发送 获取全部id  部分可见 获取check 的id
+        if(!this.title){
+          this.$toast("请输入标题")
+          return false
+        }
+        if(!this.content){
+          this.$toast("请输入内容")
+          return false
+        }
+        this.$store.commit('message/title',this.title)
+        this.$store.commit('message/content',this.content)
+        this.$router.push('/releaseMessage')
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+    .add-message-container {
+        height: 100%;
+        overflow: hidden;
+        .van-nav-bar {
+            padding: 0 20px;
+            &:after {
+                border: none;
+            }
+        }
+        /deep/.van-panel{
+            padding: 0 20px;
+            &:after{
+                border: none;
+            }
+            .message-title{
+                &:after{
+                    left: 0;
+                    border-color: #ccc;
+                }
+                .van-field__control{
+                    height: 45px;
+                }
+            }
+            .message-content{
+                padding-top: 10px;
+                .van-field__control{
+                    height: calc(100vh - 110px);
+                }
+            }
+        }
+    }
+</style>
--- a/wx_application/src/views/mainSale/message/index.vue
+++ b/wx_application/src/views/mainSale/message/index.vue
+<template>
+    <div class="message-container">
+        <div class="message-list">
+            <div class="message-panel-box" v-for="(item,index) in messageList" :key="index">
+                <div class="message-panel-box-left">
+                    <p class="message-title"></p>
+                    <p class="message-content"></p>
+                </div>
+                <div class="message-panel-box-right">
+                    <span></span>
+                </div>
+            </div>
+        </div>
+        <div class="btn-plus" @click="handleAddMessage"> <span>+</span> </div>
+    </div>
+</template>
+
+<script>
+  import {getMessageByClerkId} from '@/utils/utils.Request.aApi'
+
+  export default {
+    name: 'index',
+    data() {
+      return {
+        clerkId: '2003160512400400000',
+        messageList: []
+      }
+    },
+    mounted() {
+      this.handleGetMessageByClerkId()
+    },
+    methods: {
+      handleGetMessageByClerkId() {
+        let _this = this
+        getMessageByClerkId({clerkId: _this.clerkId})
+          .then(res => {
+            if (res.result == 'success') {
+              _this.messageList = res.data
+            } else {
+              _this.messageList = []
+              _this.$toast(res.errorMsg);
+            }
+          })
+          .catch(err => {
+
+          })
+      },
+      handleAddMessage(){
+        this.$router.push('/addMessage')
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+.message-container{
+    height: 100%;
+    .btn-plus{
+        position: fixed;
+        right: 30px;
+        bottom: 30px;
+        font-size: 40px;
+        font-weight: bold;
+        width: 50px;
+        height: 50px;
+        border: 2px solid #ccc;
+        border-radius: 50%;
+        text-align: center;
+        color: green;
+        line-height: 1;
+    }
+}
+</style>
--- a/wx_application/src/views/mainSale/message/releaseMessage.vue
+++ b/wx_application/src/views/mainSale/message/releaseMessage.vue
+<template>
+    <div class="release-message-container">
+        <van-nav-bar left-text="取消" right-text="发布"
+                     @click-left="onClickLeft"
+                     @click-right="onClickRight"
+        />
+        <div class="radio-group">
+            <van-radio-group v-model="radio" direction="horizontal" @change="handleChangeRadio">
+                <van-radio name="1">全员发送</van-radio>
+                <van-radio name="2">部分可见</van-radio>
+            </van-radio-group>
+        </div>
+        <div class="userlist">
+            <van-checkbox-group v-model="checkIds">
+                <van-checkbox :name="item.userId" shape="square" v-for="(item,index) in userList" :key="index">{{item.userName}}</van-checkbox>
+            </van-checkbox-group>
+        </div>
+    </div>
+</template>
+
+<script>
+  import {getClerkInfoBySupervisorId,newTask} from '@/utils/utils.Request.aApi'
+  export default {
+    name: 'releaseMessage',
+    data() {
+      return {
+        radio: '1',
+        checkIds:[],
+        supervisorId:'2003160512400400000',
+        userList:[]
+      }
+    },
+    mounted(){
+        this.getClerkInfoBySupervisorId()
+    },
+    methods: {
+      // 根据主管id获取所属部门全部员工信息
+      getClerkInfoBySupervisorId(){
+        let _this = this
+        getClerkInfoBySupervisorId({supervisorId: _this.supervisorId})
+          .then(res => {
+            if (res.result == 'success') {
+              _this.userList = res.data
+              _this.checkIds = res.data.map(v=>{
+                return v.userId
+              })
+            } else {
+              _this.userList = []
+              _this.$toast(res.errorMsg);
+            }
+          })
+          .catch(err => {
+
+          })
+      },
+      onClickLeft() {
+        this.$router.back()
+      },
+      onClickRight() {
+        //发布  全员发送 获取全部id  部分可见 获取check 的id
+        let title = this.$store.state.title
+        let content = this.$store.state.content
+        let supervisorId = this.supervisorId
+        let clerkIds = this.checkIds
+        debugger
+        let requestParam = {
+          title:title,
+          content:content,
+          supervisorId:supervisorId,
+          clerkIds:clerkIds
+        }
+        let _this = this
+
+
+        // newTask(requestParam)
+        //   .then(res => {
+        //     if (res.result == 'success') {
+        //       _this.$toast('发布成功');
+        //       _this.$router.push('/message')
+        //     } else {
+        //       _this.$toast(res.errorMsg);
+        //     }
+        //   })
+        //   .catch(err => {
+        //
+        //   })
+
+      },
+      handleChangeRadio(val){
+        if(val == '1'){
+          this.checkIds = this.userList.map(v=>{
+            return v.userId
+          })
+        }
+      },
+    }
+  }
+</script>
+
+<style  lang="scss">
+    .release-message-container {
+        height: 100%;
+        overflow: hidden;
+        .van-nav-bar {
+            padding: 0 20px;
+            /*&:after{*/
+                /*border: none;*/
+            /*}*/
+        }
+        .radio-group {
+            margin: 10px 0 20px 0;
+            .van-radio-group--horizontal{
+                padding: 0 20px;
+                justify-content: space-around;
+            }
+            .van-radio__icon{
+                font-size: 18px;
+            }
+            .van-radio__label {
+                font-size: 14px;
+            }
+
+        }
+        .userlist{
+            height: calc(100% - 66px);
+            overflow-x: hidden;
+            overflow-y: scroll;
+            .van-checkbox-group{
+                padding: 0 30px;
+                .van-checkbox{
+                    margin-bottom: 10px;
+                    .van-checkbox__icon{
+                        font-size: 18px;
+                    }
+                    .van-checkbox__label{
+                        font-size: 14px;
+                    }
+                }
+
+            }
+        }
+    }
+</style>
--- a/ybf_admin/src/pages/in/contact/components/deleteGroup.vue
+++ b/ybf_admin/src/pages/in/contact/components/deleteGroup.vue
@@ -32,7 +32,7 @@ export default {
    },
    nowNode: {
      type: Object,
-      default: {}
+      default: () =>({})
    }
  },
  data() {

--- a/ybf_wx/src/utils/aWxRequest.js
+++ b/ybf_wx/src/utils/aWxRequest.js
@@ -9,7 +9,7 @@ export function wxRequest(inUrl, data = {}, header = {}, method = 'post') {
    // corpId: 'wwd1cdbca7b8b2b6c4',
    // agentId: '1000015',
    corpId: 'ww4df265003b43fa0d',
-    agentId: '1000032',
+    agentId: '100003',
    // url: 'http://139.155.48.151:8085' + inUrl,
    url: envConfig.appBaseUrlA + inUrl,
  }