Merge branch 'develop' of http://git.yoho.cn/fe/xianyu-ufo-app-web into develop

 import Vue from 'vue';
-import {get} from 'lodash';
+import { get } from 'lodash';
 import App from './app.vue';
-import {createRouter} from './router';
-import {createStore} from './store';
+import { createRouter } from './router';
+import { createStore } from './store';
 import 'filters';
 import 'directives';
 import titleMixin from './mixins/title';
@@ -12,7 +12,7 @@ import reportError from 'report-error';
 import ReportApp from './common/report-app';
 
 Vue.use(lazyload, {
-  preLoad: 2
+  preLoad: 2,
 });
 Vue.use(pluginCore);
 Vue.mixin(titleMixin);
@@ -21,7 +21,7 @@ export function createApp(context) {
   const router = createRouter();
   const store = createStore(context);
 
-  const reportApp = new ReportApp(store.$context.env);
+  const reportApp = new ReportApp('');
 
   const app = new Vue({
     router,
@@ -59,11 +59,11 @@ export function createApp(context) {
         reportApp.report(type, pt || 'BUSINESS', pn, params, get(user, 'uid'));
       },
       reportAppStart() {
-        this.reportApp('', 'BUSINESS_PLAN_A_ENTER', {locfun: 'mounted'});
-      }
+        this.reportApp('', 'BUSINESS_PLAN_A_ENTER', { locfun: 'mounted' });
+      },
     },
-    render: h => h(App)
+    render: h => h(App),
   });
 
-  return {app, router, store};
+  return { app, router, store };
 }

@@ -19,9 +19,7 @@ export default {
   },
   mounted() {
     if (this.yoho.context.needLogin) {
-      this.$yoho.ready(() => {
-        this.$sdk.goLogin();
-      });
+      this.$yoho.auth();
     }
 
     this.$yoho.setWebview({
@@ -31,7 +29,7 @@ export default {
 
     // queryString中携带bind_code，则弹出绑定弹框
     if (this.$route.query.bind_code) {
-      this.$createThirdBind().show();
+      this.$root.$createThirdBind().open();
     }
   },
   watch: {
@@ -49,7 +47,7 @@ export default {
 .route-view-forword-leave-active,
 .route-view-back-enter-active,
 .route-view-back-leave-active {
-  will-change: true;
+  will-change: transform;
   width: 100%;
   height: 100%;
   position: absolute;
@@ -59,12 +57,12 @@ export default {
 
 .route-view-forword-leave-active,
 .route-view-back-leave-active {
-  transition: all 200ms;
+  transition: all 300ms ease;
 }
 
 .route-view-forword-enter-active,
 .route-view-back-enter-active {
-  transition: all 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
+  transition: all 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
 }
 
 .route-view-forword-enter {
@@ -81,12 +79,16 @@ export default {
 }
 
 .route-view-back-enter {
-  z-index: -1;
   transform: translate3d(-30%, 0, 0);
 }
 
+.route-view-back-enter-active {
+  z-index: -1;
+}
+
 .route-view-back-leave-active {
   transform: translate3d(100%, 0, 0);
   z-index: 2;
 }
+
 </style>

 <template>
-  <div v-if="showBind" class="third-bind-wrapper">
+  <div v-if="dialogEnable" class="third-bind-wrapper">
     <div class="bind-dialog">
+      <p class="bind-title">关联有货UFO账户</p>
       <div class="under-row">
-        <i class="iconfont iconphone2"></i>
-        <div class="select-block">
-          <CubeSelect class="area-code-select" v-model="code" :options="options" :title="selectTitle"></CubeSelect>
+        <div class="left-row-title">
+          <span @click="chooseArea">{{code}}</span>
+          <span class="iconfont icondownn"></span>
         </div>
-        <CubeInput class="bind-input" v-model="phone" placeholder="请输入手机号"></CubeInput>
+        <CubeInput class="bind-input" :class="phone ? '' : 'bind-input-phone'" v-model="phone"></CubeInput>
       </div>
       <div class="under-row">
-        <i class="iconfont iconyanzhengma"></i>
-        <CubeInput class="bind-input" v-model="smsCode" placeholder="请输入验证码"></CubeInput>
+        <div class="left-row-title">
+          验证码
+        </div>
+        <CubeInput class="bind-input" :class="smsCode ? '' : 'bind-input-code'" v-model="smsCode"></CubeInput>
         <CubeButton class="send-sms-btn" :disabled="!!sendBtnText" @click="sendSMS">{{sendBtnText || '获取验证码'}}</CubeButton>
       </div>
       <div class="submit-row">
-        <CubeButton class="bind-btn" @click="bindSubmit">登录</CubeButton>
+        <CubeButton class="bind-btn" :disabled="submitDisable" @click="bindSubmit">登录</CubeButton>
       </div>
     </div>
   </div>
@@ -22,69 +25,44 @@
 
 <script>
 
-import { Button, Input, Select } from 'cube-ui';
+import { Button, Input } from 'cube-ui';
 import { mapActions, mapState } from 'vuex';
 
-const areaList = [{
-      value: '+61',
-      name: '澳大利亚'
-  }, {
-      value: '+82',
-      text: '韩国'
-  }, {
-      value: '+1',
-      text: '加拿大'
-  }, {
-      value: '+60',
-      text: '马来西亚'
-  }, {
-      value: '+1',
-      text: '美国'
-  }, {
-      value: '+81',
-      text: '日本'
-  }, {
-      value: '+65',
-      text: '新加坡'
-  }, {
-      value: '+44',
-      text: '英国'
-  }, {
-      value: '+86',
-      text: '中国'
-  }, {
-      value: '+853',
-      text: '中国澳门'
-  }, {
-      value: '+886',
-      text: '中国台湾'
-  }, {
-      value: '+852',
-      text: '中国香港'
-  }];
-
 export default {
   name: 'ThirdBind',
   data() {
     return {
       showBind: false,
       code: '+86',
-      options: areaList,
-      selectTitle: '选择国家和地区',
       phone: '',
       smsCode: '',
-      sendBtnText: ''
+      sendBtnText: '',
+      binded: false
+    }
+  },
+  computed: {
+    dialogEnable() {
+      return this.showBind && !this.binded;
+    },
+    submitDisable() {
+      return !(this.phone && this.smsCode);
     }
   },
   methods: {
     ...mapActions(['sendBindSms', 'submitThirdBind']),
-    show() {
+    open() {
       this.bindCode = this.$route.query.bind_code;
-      this.showBind = true;
+      this.phone = '';
+      this.smsCode = '';
+      this.clearSendTimer();
+      this.show();
     },
     close() {
       this.showBind = false;
     },
+    show() {
+      this.showBind = true;
+    },
     toast(msg, time = 2000) {
       this.$createToast && this.$createToast({
         txt: msg,
@@ -92,23 +70,35 @@ export default {
         time
       }).show();
     },
+    chooseArea() {
+      this.$router.push({
+        name: 'passport.area'
+      });
+    },
+    changeArea(code) {
+      code && (this.code = code);
+    },
     sendSMS() {
       let total = 60;
-      let timer = setInterval(() => {
+
+      this.timer = setInterval(() => {
         if (--total) {
-          this.sendBtnText = '重新获取 ' + total;
+          this.sendBtnText = '重发' + total;
         } else {
-          this.sendBtnText = '';
-          clearInterval(timer);
+          this.clearSendTimer();
         }
       }, 1000);
-      this.sendBtnText = '重新获取 ' + total;
+      this.sendBtnText = '重发' + total;
 
       this.sendBindSms({
         mobile: this.phone,
         bindCode: this.bindCode
       });
     },
+    clearSendTimer() {
+      this.sendBtnText = '';
+      clearInterval(this.timer);
+    },
     bindSubmit() {
       if (this.phone && this.smsCode) {
         this.submitThirdBind({
@@ -117,6 +107,7 @@ export default {
           bindCode: this.bindCode
         }).then(res => {
           if (res.code === 200) {
+            this.binded = true;
             this.close();
           } else {
             this.toast(res.message);
@@ -129,7 +120,6 @@ export default {
   },
   components: {
     CubeInput: Input,
-    CubeSelect: Select,
     CubeButton: Button
   }
 };
@@ -151,54 +141,34 @@ export default {
 
 .bind-dialog {
   width: 670px;
-  height: 600px;
-  padding: 100px 60px;
-  font-size: 24px;
+  padding: 64px 48px 80px;
+  font-size: 28px;
   box-sizing: border-box;
   background-color: #fff;
-  color: #444;
+}
+
+.bind-title {
+  font-size: 48px;
+  line-height: 66px;
+  font-weight: 500;
+  margin-bottom: 32px;
 }
 
 .under-row {
-  line-height: 80px;
+  line-height: 120px;
   border-bottom: 1px solid #eaeaea;
-  margin-bottom: 20px;
   display: flex;
   justify-content: center;
   align-items: center;
-}
-
-.iconfont {
-  font-size: 40px;
-  margin-right: 10px;
-  vertical-align: middle;
-}
 
-.select-block {
-  min-width: 130px;
-  position: relative;
-  margin-right: 10px;
-
-  &:after {
-    content: "";
-    width: 1px;
-    background-color: #eaeaea;
-    position: absolute;
-    right: 0;
-    top: 30%;
-    bottom: 30%;
-  }
-}
-
-.area-code-select {
-  display: inline-block;
-
-  &:after {
-    border: 0;
+  .left-row-title {
+    width: 150px;
+    flex-shrink: 0;
+    color: #999;
   }
 
-  /deep/ .cube-select-text {
-    font-size: 12px;
+  .iconfont {
+    font-size: 28px;
   }
 }
 
@@ -206,22 +176,48 @@ export default {
   flex-grow: 1;
 
   &:after {
+    width: auto;
+    height: auto;
     border: 0;
+    font-size: 28px;
+    line-height: 40px;
+    transform: scale(1);
+    top: 50%;
+    margin-top: -20px;
+    color: #ccc;
+    font-weight: 300;
   }
 
   /deep/ .cube-input-field {
-    font-size: 12px;
+    font-size: 20px;
+    padding: 10px 0;
+    color: #000;
+    font-weight: 500;
   }
 }
 
+.bind-input-phone:after {
+  content: "请输入手机号";
+}
+
+.bind-input-code:after {
+  content: "请输入验证码";
+}
+
 .send-sms-btn {
   width: 180px;
   height: 54px;
   line-height: 54px;
+  font-size: 28px;
   padding: 0;
-  font-size: 12px;
-  border-radius: 27px;
-  transform: scale(0.9);
+  text-align: right;
+  background: none;
+  color: #000;
+  margin-left: 10px;
+
+  &.cube-btn_disabled {
+    color: #999;
+  }
 
   &:after {
     border: 0;
@@ -233,12 +229,17 @@ export default {
 }
 
 .bind-btn {
-  height: 120px;
+  height: 90px;
   font-size: 28px;
   background: #022c46;
+  border-radius: 46px;
 
   &.cube-btn_disabled {
     background: #ccc;
   }
+
+  &:after {
+    border: 0;
+  }
 }
 </style>

@@ -59,6 +59,7 @@ export default {
   text-align: center;
   line-height: 120px;
   color: #fff;
+  border-radius: 500px;
 
   &.enable {
     background: #002b47;

@@ -47,6 +47,7 @@ export default {
   font-size: 24px;
   display: flex;
   flex-direction: column;
+  background-color: #fff;
 
   .layout-context {
     flex: 1;

@@ -56,11 +56,8 @@ yoho.auth = async(loginUrl) => {
       domain: '.yohobuy.com',
       path: '/'
     });
-    console.log(location.href)
 
-    setTimeout(() => {
-      location.href = loginUrl || `${location.origin}/xianyu/passport/login/taobao`;
-    }, 100);
+    location.href = loginUrl || `${location.origin}/xianyu/passport/login/taobao`;
     return;
   }
 }
@@ -124,6 +121,13 @@ router.onReady(() => {
   }
 
   router.beforeResolve((to, from, next) => {
+
+    if (from.query.bind_code) {
+      app.$createThirdBind().close();
+    } else if (to.query.bind_code) {
+      app.$createThirdBind().show();
+    }
+
     try {
       trackPage(to.fullPath);
       const matched = router.getMatchedComponents(to);

 <!DOCTYPE html>
 <html lang="en">
-<head>
-    <meta charset="utf-8">
-    <title>{{title}}</title>
-    <meta name="keywords" content="">
-    <meta name="description" content="">
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
-    <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <meta content="yes" name="apple-mobile-web-app-capable">
-    <meta content="telephone=no" name="format-detection">
-    <meta content="email=no" name="format-detection">
+  <head>
+    <meta charset="utf-8" />
+    <title>{{ title }}</title>
+    <meta name="keywords" content="" />
+    <meta name="description" content="" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
+    />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+    <meta content="yes" name="apple-mobile-web-app-capable" />
+    <meta content="telephone=no" name="format-detection" />
+    <meta content="email=no" name="format-detection" />
     <script type="text/javascript">
-        (function(d,c){var e=d.documentElement,a="orientationchange" in window?"orientationchange":"resize",b=function(){var f=e.clientWidth;if(!f){return}if(f>=750){e.style.fontSize="40px"}else{e.style.fontSize=40*(f/750)+"px"}};if(!d.addEventListener){return}b();c.addEventListener(a,b,false);d.addEventListener("DOMContentLoaded",b,false)})(document,window);
+      (function(d, c) {
+        var e = d.documentElement,
+          a = 'orientationchange' in window ? 'orientationchange' : 'resize',
+          b = function() {
+            var f = e.clientWidth;
+            if (!f) {
+              return;
+            }
+            if (f >= 750) {
+              e.style.fontSize = '40px';
+            } else {
+              e.style.fontSize = 40 * (f / 750) + 'px';
+            }
+          };
+        if (!d.addEventListener) {
+          return;
+        }
+        b();
+        c.addEventListener(a, b, false);
+        d.addEventListener('DOMContentLoaded', b, false);
+      })(document, window);
     </script>
-</head>
-<body>
+  </head>
+  <body>
     <script type="text/javascript">
-        (function(d){if(/AliApp/i.test(navigator.userAgent||"")){d.getElementsByTagName("body")[0].className="aliapp-body"}})(document);
+      (function(d) {
+        if (/AliApp/i.test(navigator.userAgent || '')) {
+          d.getElementsByTagName('body')[0].className = 'aliapp-body';
+        }
+      })(document);
     </script>
     <!--vue-ssr-outlet-->
     <div id="degrade-app"></div>
     <div id="main-wrap">
-        <div id="no-download"></div>
+      <div id="no-download"></div>
     </div>
     <script>
-    (function (w, d, s, j) {
+      (function(w, d, s, j) {
         var a = d.createElement(s);
         var m = d.getElementsByTagName(s)[0];
 
         a.src = j;
         m.parentNode.insertBefore(a, m);
-    }(window, document, 'script', (document.location.protocol === 'https:' ? 'https:' : 'http:') + '//g.alicdn.com/mtb/lib-windvane/3.0.6/windvane.js'));
-
-    (function(w, d, s, j, f) {
+      })(
+        window,
+        document,
+        'script',
+        (document.location.protocol === 'https:' ? 'https:' : 'http:') +
+          '//g.alicdn.com/mtb/lib-windvane/3.0.6/windvane.js',
+      );
+
+      (function(w, d, s, j, f) {
         var a = d.createElement(s);
         var m = d.getElementsByTagName(s)[0];
 
         w.YohoAcquisitionObject = f;
 
         w[f] = function() {
-            w[f].p = arguments;
+          w[f].p = arguments;
         };
 
         a.async = 1;
         a.src = j;
         m.parentNode.insertBefore(a, m);
-    }(window, document, 'script', (document.location.protocol === 'https:' ? 'https:' : 'http:') + '//cdn.yoho.cn/yas-jssdk/2.4.18/yas.js', '_yas'));
-
-    var _hmt = _hmt || [];
-
-    (function() {
+      })(
+        window,
+        document,
+        'script',
+        (document.location.protocol === 'https:' ? 'https:' : 'http:') +
+          '//cdn.yoho.cn/yas-jssdk/2.4.18/yas.js',
+        '_yas',
+      );
+
+      var _hmt = _hmt || [];
+
+      (function() {
         function getUid() {
-            var uid,
-                name = 'app_uid',
-                cookies = (document.cookie && document.cookie.split(';')) || [];
-
-            for (var i = 0; i < cookies.length; i++) {
-                if (cookies[i].indexOf(name) > -1) {
-                    uid = decodeURIComponent(cookies[i].replace(name + '=', '').trim());
-                    break;
-                }
+          var uid,
+            name = 'app_uid',
+            cookies = (document.cookie && document.cookie.split(';')) || [];
+
+          for (var i = 0; i < cookies.length; i++) {
+            if (cookies[i].indexOf(name) > -1) {
+              uid = decodeURIComponent(
+                cookies[i].replace(name + '=', '').trim(),
+              );
+              break;
             }
+          }
 
-            if (!uid) return 0;
+          if (!uid) return 0;
 
-            uid = uid.split('::');
-            if (!uid || uid.length < 4) {
-                return 0;
-            }
-            return uid[1];
+          uid = uid.split('::');
+          if (!uid || uid.length < 4) {
+            return 0;
+          }
+          return uid[1];
         }
 
         function queryString() {
-            var vars = {},
-                hash,
-                i;
-            var hashes = window.location.search.slice(1).split('&');
-
-            for (i = 0; i < hashes.length; i++) {
-                hash = hashes[i].split('=');
-                vars[hash[0]] = hash[1];
-            }
-            return vars;
+          var vars = {},
+            hash,
+            i;
+          var hashes = window.location.search.slice(1).split('&');
+
+          for (i = 0; i < hashes.length; i++) {
+            hash = hashes[i].split('=');
+            vars[hash[0]] = hash[1];
+          }
+          return vars;
         }
 
         var uid = getUid() || queryString().uid;
@@ -89,41 +131,44 @@
         uid = uid === 0 ? '' : uid;
         window._ozuid = uid; // 暴露ozuid
         if (window._yas) {
-            window._yas(1 * new Date(), '2.4.16', 'yohoappweb', uid, '', '');
+          window._yas(1 * new Date(), '2.4.16', 'yohoappweb', uid, '', '');
         }
 
         (function() {
-            var hm = document.createElement("script");
-            hm.src = "https://hm.baidu.com/hm.js?65dd99e0435a55177ffda862198ce841";
-            var s = document.getElementsByTagName("script")[0];
-            s.parentNode.insertBefore(hm, s);
+          var hm = document.createElement('script');
+          hm.src =
+            'https://hm.baidu.com/hm.js?65dd99e0435a55177ffda862198ce841';
+          var s = document.getElementsByTagName('script')[0];
+          s.parentNode.insertBefore(hm, s);
         })();
-    }());
-
-    function isWeiXinAndIos() {
-      // window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
-      let ua = '' + window.navigator.userAgent.toLowerCase()
-      // 通过正则表达式匹配ua中是否含有MicroMessenger字符串且是IOS系统
-      let isIos = /\(i[^;]+;( U;)? CPU.+Mac OS X/i.test(ua) // 是IOS系统
-      return isIos
-    }
-
-    (function() {
-      let myFunction
-      let isWXAndIos = isWeiXinAndIos()
-      if (isWXAndIos) { // 既是微信浏览器 又是ios============（因为查到只有在微信环境下，ios手机上才会出现input失去焦点的时候页面被顶起）
-        document.body.addEventListener('focusin', () => { // 软键盘弹起事件
-          clearTimeout(myFunction);
-        });
-        document.body.addEventListener('focusout', () => { // 软键盘关闭事件
-          clearTimeout(myFunction)
-          myFunction = setTimeout(function() {
-            window.scrollTo({top: 0, left: 0, behavior: 'smooth'})// 重点  =======当键盘收起的时候让页面回到原始位置
-          }, 200);
-        });
+      })();
+
+      function isWeiXinAndIos() {
+        // window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
+        let ua = '' + window.navigator.userAgent.toLowerCase();
+        // 通过正则表达式匹配ua中是否含有MicroMessenger字符串且是IOS系统
+        let isIos = /\(i[^;]+;( U;)? CPU.+Mac OS X/i.test(ua); // 是IOS系统
+        return isIos;
       }
-    })();
 
+      (function() {
+        let myFunction;
+        let isWXAndIos = isWeiXinAndIos();
+        if (isWXAndIos) {
+          // 既是微信浏览器 又是ios============（因为查到只有在微信环境下，ios手机上才会出现input失去焦点的时候页面被顶起）
+          document.body.addEventListener('focusin', () => {
+            // 软键盘弹起事件
+            clearTimeout(myFunction);
+          });
+          document.body.addEventListener('focusout', () => {
+            // 软键盘关闭事件
+            clearTimeout(myFunction);
+            myFunction = setTimeout(function() {
+              window.scrollTo({ top: 0, left: 0, behavior: 'smooth' }); // 重点  =======当键盘收起的时候让页面回到原始位置
+            }, 200);
+          });
+        }
+      })();
     </script>
-</body>
+  </body>
 </html>

@@ -18,7 +18,7 @@ export default {
       return {
         pullDownRefresh: this.pullDownRefreshObj,
         pullUpLoad: this.pullUpLoadObj,
-        scrollbar: true
+        scrollbar: false
       };
     },
     pullDownRefreshObj: function() {

@@ -4,18 +4,21 @@
       <div class="scroll-list-wrap">
         <Scroll
           ref="scroll"
+          :scroll-events="scrollEvents"
+          @scroll="scrollHandler"
           :options="options"
           @pulling-up="onPullingUp"
           :data="channelList.productlist">
           <div class="body" ref="body">
             <div class="channel-top"></div>
+            <!-- <div class="html">qwdwqdwq、</div> -->
             <div v-for="(item, index) in channelList.list" :key="index">
-              <Slider :list="item.data"  v-if="item.template_name == 'focus'" />
-              <Hot :list="item.data" v-if="item.template_name == 'hotSeries'" />
+              <Swiper :list="item.data" v-if="item.template_name == 'threePicture'"/>
+              <Hot :list="item.data.list" v-if="item.template_name == 'image_list'" />
               <Banner :list="item.data" v-if="item.template_name == 'single_image'" />
               <TwoBanner :list="item.data" v-if="item.template_name == 'twoPicture'" />
+              <ScrollNav :list="item.data.list" v-if="item.template_name == 'guessLike'"></ScrollNav>
             </div>
-            <ScrollNav></ScrollNav>
             <ProductList :list="channelList.productlist"></ProductList>
           </div>
         </Scroll>
@@ -25,9 +28,9 @@
 </template>
 
 <script>
-import { Style, Scroll } from 'cube-ui'
+import { Style, Scroll, Sticky } from 'cube-ui'
 import { createNamespacedHelpers } from 'vuex';
-import Slider from './components/slider';
+import Swiper from './components/swiper';
 import Banner from './components/banner';
 import TwoBanner from './components/twoBanner';
 import Hot from './components/hot';
@@ -45,6 +48,8 @@ export default {
         },
         pullUpLoad: true
       },
+      scrollEvents: ['scroll'],
+      scrollY: 0,
     }
   },
   computed: {
@@ -56,11 +61,17 @@ export default {
     } 
     this.fetchChannelList();
     this.fetchProductList(params);
+    console.log(this.$refs.elememt);
+    console.log("elememt");
   },
   created() {
     
   },
   methods: {
+    scrollHandler({ y }) {
+      // console.log(y);
+      // this.scrollY = -y
+    },
     ...mapActions(['fetchChannelList','fetchProductList']),
     async onPullingUp() {
       const params = {
@@ -71,13 +82,16 @@ export default {
     }
   },
   components: {
-    Slider,
+    Swiper,
     Banner,
     TwoBanner,
     Hot,
     ScrollNav,
     Style,
     Scroll,
+    Sticky,
+    cubeSticky: Sticky,
+    cubeStickyEle: Sticky.Ele,
     ProductList
   }
 };
@@ -86,7 +100,7 @@ export default {
 <style lang="scss" scoped>
 .channel-top {
   width: 100%;
-  height: 400px;
+  height: 310px;
   background: #08304B;
 }
 .scroll-app {
@@ -121,4 +135,9 @@ export default {
   overflow-y: auto;
   // padding: 0 40px;
 }
+
+.html {
+  margin-top: -250px;
+  margin-bottom: 20px;
+}
 </style>

@@ -2,7 +2,7 @@
   <div class="banner" v-if="list.length > 0">
     <ul>
       <li v-for="(item, index) in list" :key="index" @click="jump(item)">
-        <ImageFormat :lazy="false" :src="item.src" :alt="item.alt" :width="item.width" :height="item.height" />
+        <ImageFormat :data-secc="item.src" :lazy="false" :src="item.src" :alt="item.alt" :width="item.width || 750" :height="item.height || 160" />
       </li>
     </ul>
   </div>
@@ -23,12 +23,6 @@ export default {
       console.log(src);
       console.log(url);
     }
-
-    // onClick() {
-    //   this.$yoho.goNewPage({
-    //     url: 'https://activity.yoho.cn/feature/5729.html?title=活动规则&openby:yohobuy={"action":"go.h5","params":{"title":"活动规则","url":"https://activity.yoho.cn/feature/5729.html"}}'
-    //   });
-    // }
   }
 };
 </script>

@@ -3,13 +3,13 @@
     <ul>
       <li v-for="(item, index) in list" :key="index" @click="goProduct(item)">
         <div class="hot-image">
-          <ImgSize class="item-imge" :src="item.image_url" :width="100" :height="80"/>
+          <ImageFormat :lazy="false" class="item-imge" :src="item.src" :alt="item.alt" :width="100" :height="100"></ImageFormat>
         </div>
-        <div class="hot-name">{{item.series_name}}</div>
+        <div class="hot-name">{{item.title}}</div>
       </li>
-      <li @click="goMore">
-        <div class="hot-image hot-more">更多</div>
-        <div class="hot-name">More</div>
+      <li @click="goMore" class="goMore">
+        <div class="hot-image">更多</div>
+        <div class="hot-name">MORE</div>
       </li>
     </ul>
   </div>
@@ -68,10 +68,22 @@ export default {
       }
       .hot-name {
         margin-top: 20px;
+        font-size: 24px;
+        color: #555;
       }
-      .hot-more {
-        line-height: 100px;
-        border: 1px solid #999;
+      &.goMore {
+        .hot-image {
+          width: 88px;
+          height: 56px;
+          line-height: 56px;
+          border: 1px solid #eee;
+          border-radius: 8px;
+          font-size: 22px;
+          margin-top: 25px;
+        }
+        .hot-name {
+          margin-top: 38px;
+        }
       }
     }
   }

@@ -18,15 +18,15 @@ const { mapState, mapActions } = createNamespacedHelpers('home/channel');
 export default {
   name: 'slide',
   props: {
-    // list: {
-    //   type: Array,
-    //   default: true
-    // },
+    list: {
+      type: Array,
+      default: true
+    },
   },
   data() {
     return {
       index: 0,
-      current: '快车',
+      current: this.list[0].tab_name,
       labels: [],
     }
   },
@@ -39,18 +39,8 @@ export default {
   },
   mounted() {
     // this.fetchProductList();
-    this.labels = [
-        '快车',
-        '小巴',
-        '专车',
-        '顺风车',
-        '代驾',
-        '公交',
-        '自驾租车',
-        '豪华车',
-        '二手车',
-        '出租车'
-      ]
+    // 遍历ScrollNavBar的key值，组装到labels中;
+    this.list.map((res) => { this.labels.push(res.tab_name) });
   },
   created() {
     
@@ -63,7 +53,8 @@ export default {
         isReset: true,
       }
       this.fetchProductList(params);
-      console.log(index);
+      console.log(this.list[index].tab_name);
+      // console.log(index);
      
     }
   }
@@ -72,7 +63,9 @@ export default {
 
 <style lang="scss" scoped>
 .ScrollNav {
-
+  position: relative;
+  top: 0;
+  left: 0;
 }
 
 </style>

 <template>
     <cube-slide ref="slide" :data="list">
-      <cube-slide-item v-for="(item, index) in list" :key="index" @click.native="clickHandler(item, index)">
-        <a :href="item.url">
-          <ImageFormat :lazy="false" class="item-imge" :src="item.src" :width="750" :height="200"></ImageFormat>
-        </a>
+      <cube-slide-item v-for="(item, index) in list" :key="index">
+        <ImageFormat @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="item.src" :width="750" :height="200"></ImageFormat>
       </cube-slide-item>
     </cube-slide>
 </template>
@@ -25,20 +23,7 @@ export default {
   },
   data() {
     return {
-      items: [
-        {
-          url: 'http://www.didichuxing.com/',
-          image: '//webapp.didistatic.com/static/webapp/shield/cube-ui-examples-slide01.png'
-        },
-        {
-          url: 'http://www.didichuxing.com/',
-          image: '//webapp.didistatic.com/static/webapp/shield/cube-ui-examples-slide02.png'
-        },
-        {
-          url: 'http://www.didichuxing.com/',
-          image: '//webapp.didistatic.com/static/webapp/shield/cube-ui-examples-slide03.png'
-        }
-      ]
+      
     }
   },
   components: {
@@ -52,7 +37,9 @@ export default {
     // ...mapState(['resource'])
   },
   methods: {
-    
+    clickHandler(item) {
+      console.log(item);
+    }
   }
 };
 </script>

+<template>
+  <div class="swiper">
+    <div class="swiper-item swiper-item-left">
+      <a :href="list[0].url">
+        <ImageFormat @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="list[0].src" :width="302" :height="402"></ImageFormat>
+      </a>
+    </div>
+    <div class="swiper-item swiper-item-right">
+      <a :href="list[1].url">
+        <ImageFormat @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="list[1].src" :width="374" :height="196"></ImageFormat>
+      </a>
+      <a :href="list[2].url">
+        <ImageFormat style="margin-top: 4px" @click="clickHandler(item, index)" :lazy="false" class="item-imge" :src="list[2].src" :width="374" :height="196"></ImageFormat>
+      </a>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'swiper',
+  props: {
+    list: {
+      type: Array,
+      default: true,
+    },
+  },
+  methods: {
+    jump(item) {
+      const { src, url } = item;
+      console.log(src);
+      console.log(url);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.swiper {
+  // margin-top: -250px;
+  padding: 0 32px;
+  overflow: hidden;
+  .swiper-item {
+    &.swiper-item-left {
+      width: 301px;
+      float: left;
+      img {
+        height: 402px;
+      }
+    }
+    &.swiper-item-right {
+      width: 374px;
+      float: right;
+      img {
+        height: 196px;
+      }
+    }
+    img {
+      width: 100%;
+      display: block;
+      border-radius: 4px;
+    }
+  }
+}
+</style>

 <template>
-  <div class="banner" v-if="list.length > 0">
+  <div class="twoBanner" v-if="list.length > 0">
     <ul>
-      <li v-for="(item, index) in list" :key="index" class="oneImg" @click="jump(item)">
-        <ImageFormat :lazy="false" :src="item.src" :alt="item.alt" :width="200" :height="200" />
+      <li v-for="(item, index) in list" :key="index">
+        <a :href="item.url">
+          <ImageFormat :lazy="false" :src="item.src" :alt="item.alt" :width="344" :height="160" />
+        </a>
       </li>
     </ul>
   </div>
@@ -14,40 +16,31 @@ export default {
   props: {
     list: {
       type: Array,
-      default: [1,2],
+      default: [],
     },
     
   },
   methods: {
-    jump(item) {
-      const { src, url } = item;
-      console.log(src);
-      console.log(url);
-    }
-    // onClick() {
-    //   this.$yoho.goNewPage({
-    //     url: 'https://activity.yoho.cn/feature/5729.html?title=活动规则&openby:yohobuy={"action":"go.h5","params":{"title":"活动规则","url":"https://activity.yoho.cn/feature/5729.html"}}'
-    //   });
+    // jump(item) {
+    //   const { src, url } = item;
+    //   console.log(src);
+    //   console.log(url);
     // }
   }
 };
 </script>
 
 <style lang="scss" scoped>
-.banner {
-  width: 100%;
-  margin: 20px 0;
-  overflow: hidden;
+.twoBanner {
   ul {
     display: flex;
+    justify-content: space-between;
     li {
-      width: 50%;
-      &.oneImg {
-        max-width: 100%;
-      }
+      width: 49%;
       img {
         max-width: 100%;
         display: block;
+        border-radius: 16px;
       }
     }
   }

 <template>
   <div class="income-filter">
-    <div class="month-filter"  @click="showDate">2019年9月 <i class="cubeic-select"></i></div>
-    <div class="type-filter"  @click="showPicker"><span class="filter-img"></span><span>筛选</span></div>
+    <div class="month-filter"  @click="showDate">{{monthPicker}}<i class="cubeic-select"></i></div>
+    <div class="type-filter"  @click="showPicker"><span class="filter-img"></span><span>{{typeFilter}}</span></div>
   </div>
 </template>
 
@@ -9,73 +9,64 @@
 import { Style, Picker } from 'cube-ui';
 import { createNamespacedHelpers } from 'vuex';
 const {mapState, mapGetters, mapActions} = createNamespacedHelpers('home/mine');
+import moment from 'moment';
 export default {
   name: 'income-filter',
   data() {
     return {
-      date: [
-        [{ text: '2019', value: '2019' }],
-        [{ text: '9', value: '9' }]
-      ]
+      monthPicker: '2019年9月 ',
+      typeFilter: '筛选',
     }
   },
   props: {
 
   },
   computed: {
-    ...mapState(['filterData'])
+    ...mapState(['filterData','walletData']),
+    ...mapGetters(['getYearMonth'])
   },
   created() {
     this.fetchWalletFilter()
   },
   methods: {
-    ...mapActions(['fetchWalletFilter']),
+    ...mapActions(['fetchWalletFilter','fetchWallet']),
     showDate() {
        if (!this.datePicker) {
         this.datePicker = this.$createPicker({
-          data: this.date,
-          onSelect: this.selectHandle,
-          onCancel: this.cancelHandle
+          data: this.getYearMonth,
+          onSelect: this.selectHandle
         })
       }
       this.datePicker.show()
     },
     selectHandle(selectedVal, selectedIndex, selectedText) {
-      this.$createDialog({
-        type: 'warn',
-        content: `Selected Item: <br/> - value: ${selectedVal.join(', ')} <br/> - index: ${selectedIndex.join(', ')} <br/> - text: ${selectedText.join(' ')}`,
-        icon: 'cubeic-alert'
-      }).show()
-    },
-    cancelHandle() {
-      this.$createToast({
-        type: 'correct',
-        txt: 'Picker canceled',
-        time: 1000
-      }).show()
-    },
+      this.monthPicker = selectedText[0]+'年'+selectedText[1] + '月 ';
 
+      let selected = selectedVal.join('-')
+      let days = moment(selected, "YYYY-MM").daysInMonth();
+      let startDay = selected+'-01';
+      let endDay = selected+'-'+days;
+      let startTime = moment(startDay).startOf('d').unix();
+      let endTime = moment(endDay).endOf('d').unix();
+      this.fetchWallet({isRefresh:true,tradeType: this.walletData.tradeType,startTime,endTime})
+    },
+    
     showPicker() {
        if (!this.picker) {
         this.picker = this.$createPicker({
-          title: 'Picker',
           data: [this.filterData.tradeTypes],
-          onSelect: this.selectHandle1,
-          onCancel: this.cancelHandle1
+          onSelect: this.selectHandle1
         })
       }
       this.picker.show()
     },
     selectHandle1(selectedVal, selectedIndex, selectedText) {
-      this.$createDialog({
-        type: 'warn',
-        content: `Selected Item: <br/> - value: ${selectedVal.join(', ')} <br/> - index: ${selectedIndex.join(', ')} <br/> - text: ${selectedText.join(' ')}`,
-        icon: 'cubeic-alert'
-      }).show()
+      this.typeFilter = selectedText.join(',');
+
+      let tradeType = selectedVal.join(',')
+      let {startTime,endTime} = this.walletData
+      this.fetchWallet({isRefresh:true,tradeType,startTime,endTime})
     },
-    cancelHandle1() {
-      
-    }
   },
   components: {
       Style,
@@ -89,7 +80,6 @@ export default {
 .income-filter {
     background-color: #F5F7F9;
     padding: 0 40px;
-    margin: 0 -40px;
     height: 90px;
     line-height: 90px;
     display: flex;
@@ -109,6 +99,7 @@ export default {
     .filter-img {
       display: inline-block;
       margin-right: 5px;
+      margin-top: -4px;
       width: 28px;
       height: 28px;
       background: url(~statics/image/list/filter@3x.png) no-repeat;

@@ -27,7 +27,7 @@ export default {
       }
   },
   created(){
-    console.log(this.data)
+
   },
   computed: {
     imgSrc() {
@@ -45,7 +45,7 @@ export default {
 <style lang="scss" scoped>
   .assets-record-container {
     display: flex;
-  width: 100%;
+  margin: 0 40px;
   justify-content: space-between;
   align-items: center;
   padding-top: 30px;

 <template>
   <LayoutApp :show-back="true">
     <div class="body" ref="body">
-      <incomeFilter></incomeFilter>
+      
       <Scroll
           ref="scroll"
           :data="walletData.list"
           :options="options"
           @pulling-down="onPullingDown"
           @pulling-up="onPullingUp">
+          <incomeFilter></incomeFilter>
         <template v-for="(item,index) in walletData.list">
             <incomeItem :data="item" :key="index"></incomeItem>
           </template> 
@@ -47,16 +48,16 @@ export default {
         
     },
     created() {
-      this.fetchWallet(true)
+      this.fetchWallet({isRefresh:true})
     },
     methods: {
       ...mapActions(['fetchWallet']),
       onPullingDown() {
-        this.fetchWallet(true)
+        this.fetchWallet({isRefresh:true})
       },
       onPullingUp() {
         if(!this.walletData.endReached) {
-          this.fetchWallet(false)
+          this.fetchWallet({isRefresh:false})
         } else {
           this.$refs.scroll.forceUpdate()
         }
@@ -77,7 +78,6 @@ export default {
   height: 100%;
   overflow-y: auto;
   background-color: white;
-  padding: 0 40px;
   color: #999;
 }
 </style>

@@ -36,10 +36,11 @@ import {createNamespacedHelpers} from 'vuex';
 const {mapState, mapActions} = createNamespacedHelpers('list');
 
 import ImgSize from '../../components/img-size';
+import {Scroll} from 'cube-ui';
 
 export default {
   name: 'Filtrate',
-  components: {ImgSize},
+  components: {ImgSize, Scroll},
   data() {
     return {
       showType: false
@@ -48,7 +49,7 @@ export default {
   mounted() {
   },
   methods: {
-    ...mapActions(['setFilterParam','fetchProductList']),
+    ...mapActions(['setFilterParam', 'fetchProductList']),
     clear() {
       this.setFilterParam({
         sort: [], // 品类id

@@ -56,7 +56,6 @@ export default {
       selectedType: 2,
       priceDesc: true,
       arrowImage: '',
-      searchKey: '',
       listType: 1,
       type: 6
     };
@@ -91,7 +90,6 @@ export default {
       }
       let params = {
         type: this.type,
-        query: this.searchKey,
         sort: this.filterParams.sort.join(','),
         brand: this.filterParams.brand.join(','), // 品牌id
         gender: this.filterParams.gender.join(','), // 性别

@@ -8,20 +8,24 @@
           <div class="search-clear" :class="query && 'search-clear-img'" @click="clear()"></div>
         </div>
       </form>
-      <Scroll v-if="!query.length" :options="scrollOptions">
+      <Scroll v-show="!query.length" :options="scrollOptions">
+        <div class="recent title middle" v-if="searchWord.length">热门推荐</div>
+        <div class="content middle">
+          <div class="item" v-if="searchWord.length" v-for="item of searchWord" @click="goSearch(item.search_word)">
+            {{item.search_word}}
+          </div>
+        </div>
         <div class="recent middle" v-if="localHistory.length">
           <div class="title">最近搜索</div>
-          <div class="clearSearch" @click="clearLocalHistory()">清除</div>
-        </div>
-        <div class="item middle" v-if="localHistory.length" v-for="item of localHistory" @click="goSearch(item)">{{item}}
+          <div class="search-clear search-clear-img" @click="clearLocalHistory()"></div>
         </div>
-        <div class="recent title middle" v-if="searchWord.length">热门推荐</div>
-        <div class="item middle" v-if="searchWord.length" v-for="item of searchWord" @click="goSearch(item.search_word)">
-          {{item.search_word}}
+        <div class="content middle">
+          <div class="item" v-if="localHistory.length" v-for="item of localHistory" @click="goSearch(item)">{{item}}
+          </div>
         </div>
       </Scroll>
-      <Scroll v-if="query.length" :options="scrollOptions" :data="searchSuggestList">
-        <div class="item middle" v-if="searchSuggestList.length" v-for="item of searchSuggestList" @click="goSearch(item.item)">
+      <Scroll v-show="query.length" :options="scrollOptions" :data="searchSuggestList">
+        <div class="item-line middle" v-if="searchSuggestList.length" v-for="item of searchSuggestList" @click="goSearch(item.item)">
           {{item.item}}
         </div>
       </Scroll>
@@ -49,7 +53,7 @@ export default {
       localHistory: []
     };
   },
-  mounted() {
+  activated() {
     this.fetchSearchWords();
     this.fetchDefaultSearchWords();
     this.setLocalList();
@@ -162,11 +166,15 @@ export default {
   }
 
   .item {
-    line-height: 88px;
-    height: 88px;
-    font-size: 28px;
-    color: #333;
-    border-bottom: 1px #eee solid;
+    line-height: 60px;
+    height: 60px;
+    font-size: 24px;
+    color: #000;
+    padding: 0 20px;
+    border-radius: 30px;
+    background: #f5f5f5;
+    margin-right: 20px;
+    margin-bottom: 30px;
   }
 
   .recent {
@@ -177,8 +185,23 @@ export default {
     margin-top: 60px;
   }
 
+  .content {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 30px;
+  }
+
   .clearSearch {
     font-size: 32px;
     color: #999;
   }
+
+  .item-line {
+    line-height: 88px;
+    height: 88px;
+    font-size: 28px;
+    color: #333;
+    border-bottom: 1px #eee solid;
+  }
+
 </style>

@@ -6,10 +6,11 @@
       </div>
       <div class="title">支付成功</div>
 
+      <div class="desc">如卖家原因导致交易失败，您可获赔付200元保证金，建议您设置支付宝账号作为赔偿收款账户，如未绑定银行卡则视为放弃赔偿</div>
+
       <YohoButton :txt="txt" class="btn-class" @on-click="onClick"></YohoButton>
 
       <div class="info">
-        <div class="item" @click="goPublish">继续发布</div>
         <div class="item" @click="goHome">随便逛逛</div>
       </div>
     </div>
@@ -19,10 +20,10 @@
 <script>
 
 export default {
-  name: 'PayOk',
+  name: 'BuyPayOk',
   data() {
     return {
-      txt: '查看商品'
+      txt: '返回首页'
     };
   },
   methods: {
@@ -42,13 +43,13 @@ export default {
 <style lang="scss" scoped>
 .body {
   height: 100%;
-  margin: 0 74px;
+  margin: 0 32px;
   padding-bottom: 140px;
   overflow-y: auto;
 }
 
 .header {
-  margin-top: 170px;
+  margin-top: 80px;
   text-align: center;
 }
 
@@ -62,6 +63,15 @@ export default {
   line-height: 100px;
 }
 
+.desc {
+  width: 560px;
+  margin: 60px auto;
+  font-size: 24px;
+  color: #999;
+  text-align: center;
+  line-height: 40px;
+}
+
 .title {
   font-size: 40px;
   font-weight: bold;
@@ -75,13 +85,9 @@ export default {
   margin-top: 30px;
 
   .item {
-    width: 50%;
+    width: 100%;
     text-align: center;
   }
-
-  .item + .item {
-    border-left: 1px solid black;
-  }
 }
 
 </style>

 <template>
-  <div class="count-down-wrapper">
-    <span></span>
+  <div class="count-down-wrapper" v-if="countDown !== ''">
+    <i v-if="isShowIcon" class="time-icon"></i>
+    <span>{{ countDown }}</span>
   </div>
 </template>
 
@@ -10,33 +11,41 @@ export default {
     leftTime: {
       type: Number,
       default: 0
+    },
+    isShowIcon: {
+      type: Boolean,
+      default: true
     }
   },
   data() {
     return {
-      remainTime: this.props.leftTime,
+      remainTime: this.$props.leftTime,
       countDown: "",
       timeoutId: null
     };
   },
   mounted() {
-    this.countDown = this.formatTime();
+    this.countDown = this.formatTime().join(":");
 
     this.timeoutId = setInterval(() => {
       this.remainTime--;
-      this.countDown = this.formatTime();
+      this.countDown = this.formatTime().join(":");
     }, 1000);
   },
   destroyed() {
     clearInterval(this.timeoutId);
   },
-  computed: {
-    timeList: function() {}
+  watch: {
+    countDown(val) {
+      if (val === "") {
+        clearInterval(this.timeoutId);
+      }
+    }
   },
   methods: {
     formatTime() {
-      if (this.remainTime < 0) {
-        return ["00", "00", "00"];
+      if (this.remainTime <= 0) {
+        return [];
       }
       let remainTime = this.remainTime;
 
@@ -49,7 +58,7 @@ export default {
 
       const numberOfSeconds = remainTime - numberOfMinutes * 60;
 
-      return [numberOfHour, numberOfMinute, numberOfSeconds].map(time => {
+      return [numberOfHours, numberOfMinutes, numberOfSeconds].map(time => {
         return time < 10 ? `0${time}` : `${time}`;
       });
     }
@@ -60,5 +69,21 @@ export default {
 <style lang="scss" scoped>
 .count-down-wrapper {
   display: flex;
+  font-size: 32px;
+  font-weight: bold;
+  align-items: center;
+
+  & > i {
+    width: 30px;
+    height: 30px;
+    display: block;
+    background: url("~statics/image/order/time-icon@3x.png");
+    background-size: contain;
+    background-position: center;
+  }
+
+  & > span {
+    padding: 0 9px;
+  }
 }
 </style>
\ No newline at end of file

@@ -11,7 +11,10 @@
 </template>
 
 <script>
-import { orderActionsMap } from "../../../../constants/order-constants";
+import {
+  orderActionsMap,
+  ownType
+} from "../../../../constants/order-constants";
 import { createNamespacedHelpers } from "vuex";
 import CancelConfirmInfo from "./order-list/cancel-confirm-info";
 
@@ -33,7 +36,7 @@ export default {
   methods: {
     ...mapActions(["deleteOrder", "cancelTradeConfirmInfo", "cancelTrade"]),
     async onAction(action) {
-      const { owner } = this.$route.params;
+      const { owner = ownType.SELL } = this.$route.params;
       const { orderCode } = this.order;
       const { productId, storageId } = this.order.goodsInfo;
 
@@ -161,7 +164,6 @@ export default {
 .actions-wrapper {
   display: flex;
   justify-content: flex-end;
-  margin-top: 40px;
 
   button {
     font-size: 24px;
@@ -171,7 +173,6 @@ export default {
     background: #fff;
     border: 1px solid #ccc;
     line-height: 1.4;
-    width: 224px;
     margin-right: 20px;
     white-space: nowrap;
     border-radius: 40px;

@@ -31,9 +31,20 @@ export default [
     })
   },
   {
-    name: 'PayOk',
-    path: '/xianyu/order/ok.html',
-    component: () => import(/* webpackChunkName: "order" */ './pay-ok'),
+    name: 'SellPayOk',
+    path: '/xianyu/order/sellpayok.html',
+    component: () => import(/* webpackChunkName: "order" */ './sell-pay-ok'),
+    props: route => ({
+      orderCode: route.query.orderCode,
+    })
+  },
+  {
+    name: 'BuyPayOk',
+    path: '/xianyu/order/buypayok.html',
+    component: () => import(/* webpackChunkName: "order" */ './buy-pay-ok'),
+    props: route => ({
+      orderCode: route.query.orderCode,
+    })
   },
   {
     name: 'buyerAskOrder', // 买家求购确认

 <template>
-  <div class="order-detail-wrapper">
-    <div class="content">
-      <!-- 状态信息 -->
-      <div class="status-info">
-        <p class="status">{{ statusDetail.statuStr }}</p>
-        <p class="status-desc">{{ statusDetail.detailDesc }}</p>
-      </div>
-      <!-- 物流信息 -->
-      <router-link
-        v-if="lastExpressInfo"
-        :to="{ name: 'orderLogisticsInfo', params: $route.params }"
-      >
-        <div class="logistics-info item-wrapper">
-          <div class="content">
-            <i class="logistics-icon"></i>
-            <div class="info">
-              <p>{{ lastExpressInfo.acceptRemark }}</p>
-              <p>{{ lastExpressInfo.createTimeStr }}</p>
+  <layout-app>
+    <div class="order-detail-wrapper">
+      <div class="content">
+        <!-- 状态信息 -->
+        <detail-header />
+        <!-- 物流信息 -->
+        <router-link
+          v-if="lastExpressInfo"
+          :to="{ name: 'orderLogisticsInfo', params: $route.params }"
+        >
+          <div class="logistics-info item-wrapper">
+            <div class="content">
+              <i class="logistics-icon"></i>
+              <div class="info">
+                <p>{{ lastExpressInfo.acceptRemark }}</p>
+                <p>{{ lastExpressInfo.createTimeStr }}</p>
+              </div>
             </div>
+            <i class="right-icon"></i>
           </div>
-          <i class="right-icon"></i>
+        </router-link>
+        <!-- 地址信息 -->
+        <address-info class="item-wrapper" />
+        <!-- 商品信息 -->
+        <order-item-info class="item-wrapper" />
+        <!-- 价格信息 -->
+        <div class="price-info item-wrapper">
+          <p>
+            <span class="label">商品金额:</span>
+            <span>¥{{ priceInfo.goodPrice }}</span>
+          </p>
+          <p class="delivery-fee">
+            <span class="label">运费:</span>
+            <span>¥{{ priceInfo.feePrice }}</span>
+          </p>
+          <p>
+            <span class="label">实际金额:</span>
+            <span class="pay-price">¥{{ priceInfo.realPayPrice }}</span>
+          </p>
+        </div>
+        <!-- 交易信息 -->
+        <div class="trade-info item-wrapper">
+          <p>
+            <span class="label">创建时间:</span>
+            <span>{{ orderDetail.createTime }}</span>
+          </p>
+          <p>
+            <span class="label">订单编号:</span>
+            <span>{{ orderDetail.orderCode }}</span>
+          </p>
+          <p v-if="orderDetail.paymentStr">
+            <span class="label">支付方式:</span>
+            <span>{{ orderDetail.paymentStr }}</span>
+          </p>
         </div>
-      </router-link>
-      <!-- 地址信息 -->
-      <address-info class="item-wrapper" />
-      <!-- 商品信息 -->
-      <order-item-info class="item-wrapper" />
-      <!-- 价格信息 -->
-      <div class="price-info item-wrapper">
-        <p>
-          <span class="label">商品金额:</span>
-          <span>¥{{ priceInfo.goodPrice }}</span>
-        </p>
-        <p class="delivery-fee">
-          <span class="label">运费:</span>
-          <span>¥{{ priceInfo.feePrice }}</span>
-        </p>
-        <p>
-          <span class="label">实际金额:</span>
-          <span class="pay-price">¥{{ priceInfo.realPayPrice }}</span>
-        </p>
-      </div>
-      <!-- 交易信息 -->
-      <div class="trade-info item-wrapper">
-        <p>
-          <span class="label">创建时间:</span>
-          <span>{{ orderDetail.createTime }}</span>
-        </p>
-        <p>
-          <span class="label">订单编号:</span>
-          <span>{{ orderDetail.orderCode }}</span>
-        </p>
-        <p>
-          <span class="label">支付方式:</span>
-          <span>{{ orderDetail.paymentStr }}</span>
-        </p>
       </div>
+      <!-- 操作 -->
+      <detail-footer>
+        <template #tip="{orderDetail, statusDetail}">
+          <div v-if="statusDetail.status === 0">
+            <p class="real-pay-price">
+              ¥{{ orderDetail.priceInfo.realPayPrice }}
+            </p>
+            <p>实付金额</p>
+          </div>
+        </template>
+      </detail-footer>
     </div>
-    <!-- 操作 -->
-    <div v-if="actionList.length" class="actions">
-      <order-actions class="detail-actions" :order="orderDetail" />
-    </div>
-  </div>
+  </layout-app>
 </template>
 
 <script>
 import { createNamespacedHelpers } from "vuex";
-import AddressInfo from "./components/address-info";
-import OrderItemInfo from "./components/order-detail-item";
 import { Button } from "cube-ui";
+
 import OrderActions from "../components/order-actions";
 
+import AddressInfo from "./components/address-info";
+import OrderItemInfo from "./components/order-detail-item";
+import DetailHeader from "./components/header";
+import DetailFooter from "./components//detail-footer";
+
 const { mapActions, mapState, mapGetters } = createNamespacedHelpers(
   "order/orderDetail"
 );
@@ -79,7 +89,9 @@ export default {
     AddressInfo,
     OrderItemInfo,
     Button,
-    OrderActions
+    OrderActions,
+    DetailHeader,
+    DetailFooter
   },
   asyncData({ store, router }) {
     // store.dispatch("order/orderDetail/fetchOrderDetail", router.params);
@@ -89,12 +101,7 @@ export default {
   },
   computed: {
     ...mapState(["orderDetail"]),
-    ...mapGetters([
-      "statusDetail",
-      "lastExpressInfo",
-      "priceInfo",
-      "actionList"
-    ])
+    ...mapGetters(["lastExpressInfo", "priceInfo", "actionList"])
   },
   methods: {
     ...mapActions(["fetchOrderDetail"])
@@ -117,24 +124,6 @@ export default {
     padding: 40px 0;
   }
 
-  .status-info {
-    margin-bottom: 40px;
-
-    .status {
-      font-size: 68px;
-      color: #000;
-      letter-spacing: 0.82px;
-      line-height: 82px;
-      font-weight: bold;
-    }
-
-    .status-desc {
-      color: #999;
-      letter-spacing: 0;
-      margin-top: 30px;
-    }
-  }
-
   .logistics-info {
     display: flex;
     align-items: center;
@@ -203,22 +192,9 @@ export default {
     margin-right: 12px;
   }
 
-  .actions {
-    display: flex;
-    justify-content: flex-end;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 120px;
-    background: #fff;
-    box-shadow: inset 0 1px 0 0 #eee;
-    padding: 20px;
-    z-index: 10;
-
-    .detail-actions {
-      margin-top: 0;
-    }
+  .real-pay-price {
+    font-size: 28px;
+    color: #d0021b;
   }
 }
 </style>
\ No newline at end of file

@@ -37,6 +37,7 @@ export default {
 
   .mobile {
     font: 28px;
+    font-weight: bold;
   }
 
   .address-icon {

+<template>
+  <div v-if="actionList.length" class="footer-wrapper">
+    <slot
+      name="tip"
+      :orderDetail="orderDetail"
+      :statusDetail="statusDetail"
+    ></slot>
+    <order-actions class="detail-actions" :order="orderDetail" />
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+
+const { mapActions, mapState, mapGetters } = createNamespacedHelpers(
+  "order/orderDetail"
+);
+
+import OrderActions from "../../components/order-actions";
+
+export default {
+  components: {
+    OrderActions
+  },
+  computed: {
+    ...mapState(["orderDetail"]),
+    ...mapGetters(["actionList", "statusDetail"])
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.footer-wrapper {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: 120px;
+  background: #fff;
+  box-shadow: inset 0 1px 0 0 #eee;
+  padding: 20px;
+  z-index: 10;
+
+  .detail-actions {
+    margin-top: 0;
+    flex: 1;
+  }
+}
+</style>
\ No newline at end of file

+<template>
+  <div class="detail-header-wrapper">
+    <div class="count-down-wrapper" v-if="statusDetail.status === 0">
+      <p class="status">{{ statusDetail.statuStr }}</p>
+      <count-down
+        class="count-down"
+        :leftTime="statusDetail.leftTime"
+        :isShowIcon="false"
+      />
+      <p class="status-desc">{{ statusDetail.detailDesc }}</p>
+    </div>
+    <div class="status-info" v-else>
+      <p class="status">{{ statusDetail.statuStr }}</p>
+      <p class="status-desc">{{ statusDetail.detailDesc }}</p>
+    </div>
+  </div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+import CountDown from "../../components/count-down";
+
+const { mapGetters } = createNamespacedHelpers("order/orderDetail");
+
+export default {
+  components: {
+    CountDown
+  },
+  computed: {
+    ...mapGetters(["statusDetail"])
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.detail-header-wrapper {
+  letter-spacing: 0;
+  margin-top: 10px;
+  margin-bottom: 40px;
+
+  .count-down-wrapper {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    font-size: 24px;
+
+    .status {
+      font-size: 36px;
+    }
+
+    .count-down {
+      font-size: 72px;
+    }
+
+    .status-desc {
+      color: #999;
+      margin-top: 20px;
+    }
+  }
+
+  .status-info {
+    margin-bottom: 40px;
+
+    .status {
+      font-size: 68px;
+      color: #000;
+      letter-spacing: 0.82px;
+      line-height: 82px;
+      font-weight: bold;
+    }
+
+    .status-desc {
+      color: #999;
+      letter-spacing: 0;
+      margin-top: 30px;
+    }
+  }
+}
+</style>
\ No newline at end of file

 export const routeNames = {
-  BUY_ORDER_DETAIL: 'buyerOrderDetail',
+  BUY_ORDER_DETAIL: 'buyOrderDetail',
   SELL_ORDER_DETIAL: 'sellOrderDetail',
 };
 
@@ -16,7 +16,7 @@ const routers = [
   // code: 订单编码
   {
     name: routeNames.SELL_ORDER_DETIAL,
-    path: '/xianyu/:owner/order/detail/:code',
+    path: '/xianyu/:owner/trade/detail/:code',
     component: () => import('./seller-order-detail'),
   },
 ];

 <template>
-  <div class="order-detail-wrapper">
-    <div class="content">
-      <!-- 状态信息 -->
-      <div class="status-info">
-        <p class="status">{{ statusDetail.statuStr }}</p>
-        <p class="status-desc">{{ statusDetail.detailDesc }}</p>
-      </div>
-      <!-- 物流信息 -->
-      <router-link
-        v-if="lastExpressInfo"
-        :to="{ name: 'orderLogisticsInfo', params: $route.params }"
-      >
-        <div class="logistics-info item-wrapper">
-          <div class="content">
-            <i class="logistics-icon"></i>
-            <div class="info">
-              <p>{{ lastExpressInfo.acceptRemark }}</p>
-              <p>{{ lastExpressInfo.createTimeStr }}</p>
+  <layout-app>
+    <div class="order-detail-wrapper">
+      <div class="content">
+        <!-- 状态信息 -->
+        <detail-header />
+        <!-- 物流信息 -->
+        <router-link
+          v-if="lastExpressInfo"
+          :to="{ name: 'orderLogisticsInfo', params: $route.params }"
+        >
+          <div class="logistics-info item-wrapper">
+            <div class="content">
+              <i class="logistics-icon"></i>
+              <div class="info">
+                <p>{{ lastExpressInfo.acceptRemark }}</p>
+                <p>{{ lastExpressInfo.createTimeStr }}</p>
+              </div>
             </div>
+            <i class="right-icon"></i>
           </div>
-          <i class="right-icon"></i>
+        </router-link>
+        <!-- 地址信息 -->
+        <address-info class="item-wrapper" />
+        <!-- 商品信息 -->
+        <order-item-info class="item-wrapper" />
+        <!-- 价格信息 -->
+        <div class="price-info item-wrapper">
+          <p>
+            <span class="label">平台费用:</span>
+            <span>{{ platformFee.amount }}</span>
+          </p>
+          <p class="delivery-fee">
+            <span class="label"
+              >银行转账费({{
+                parseInt(platformFee.payChannelPercentage)
+              }}%):</span
+            >
+            <span>{{ orderDetail.bankTransferFee }}</span>
+          </p>
+          <p>
+            <span class="label">实际收入:</span>
+            <span class="pay-price">{{ orderDetail.income }}</span>
+          </p>
+        </div>
+        <!-- 交易信息 -->
+        <div class="trade-info item-wrapper">
+          <p>
+            <span class="label">创建时间:</span>
+            <span>{{ orderDetail.createTime }}</span>
+          </p>
+          <p>
+            <span class="label">订单编号:</span>
+            <span>{{ orderDetail.orderCode }}</span>
+          </p>
+          <p v-if="orderDetail.paymentStr">
+            <span class="label">支付方式:</span>
+            <span>{{ orderDetail.paymentStr }}</span>
+          </p>
+          <p v-if="orderDetail.earnestMoneyStr">
+            <span class="label">保证金:</span>
+            <span class="earnest-price">{{ orderDetail.earnestMoneyStr }}</span>
+          </p>
+          <p v-if="statusDetail.paymentTips">
+            <span class="payment-tip">{{ statusDetail.paymentTips }}</span>
+          </p>
         </div>
-      </router-link>
-      <!-- 地址信息 -->
-      <address-info class="item-wrapper" />
-      <!-- 商品信息 -->
-      <order-item-info class="item-wrapper" />
-      <!-- 价格信息 -->
-      <div class="price-info item-wrapper">
-        <p>
-          <span class="label">商品金额:</span>
-          <span>¥{{ priceInfo.goodPrice }}</span>
-        </p>
-        <p class="delivery-fee">
-          <span class="label">运费:</span>
-          <span>¥{{ priceInfo.feePrice }}</span>
-        </p>
-        <p>
-          <span class="label">实际金额:</span>
-          <span class="pay-price">¥{{ priceInfo.realPayPrice }}</span>
-        </p>
-      </div>
-      <!-- 交易信息 -->
-      <div class="trade-info item-wrapper">
-        <p>
-          <span class="label">创建时间:</span>
-          <span>{{ orderDetail.createTime }}</span>
-        </p>
-        <p>
-          <span class="label">订单编号:</span>
-          <span>{{ orderDetail.orderCode }}</span>
-        </p>
-        <p>
-          <span class="label">支付方式:</span>
-          <span>{{ orderDetail.paymentStr }}</span>
-        </p>
       </div>
+      <!-- 操作 -->
+      <detail-footer>
+        <template #tip="{orderDetail, statusDetail}">
+          <div v-if="statusDetail.status === 0">
+            <p class="earnest-price">{{ orderDetail.earnestMoneyStr }}</p>
+            <p>{{ statusDetail.statuStr }}</p>
+          </div>
+        </template>
+      </detail-footer>
     </div>
-    <!-- 操作 -->
-    <div v-if="actionList.length" class="actions">
-      <order-actions class="detail-actions" :order="orderDetail" />
-    </div>
-  </div>
+  </layout-app>
 </template>
 
 <script>
 import { createNamespacedHelpers } from "vuex";
+import { Button } from "cube-ui";
+
 import AddressInfo from "./components/address-info";
 import OrderItemInfo from "./components/order-detail-item";
-import { Button } from "cube-ui";
-import OrderActions from "../components/order-actions";
+import DetailHeader from "./components/header";
+import DetailFooter from "./components//detail-footer";
 
 const { mapActions, mapState, mapGetters } = createNamespacedHelpers(
   "order/orderDetail"
@@ -79,7 +96,8 @@ export default {
     AddressInfo,
     OrderItemInfo,
     Button,
-    OrderActions
+    DetailHeader,
+    DetailFooter
   },
   asyncData({ store, router }) {
     // store.dispatch("order/orderDetail/fetchOrderDetail", router.params);
@@ -90,10 +108,10 @@ export default {
   computed: {
     ...mapState(["orderDetail"]),
     ...mapGetters([
-      "statusDetail",
       "lastExpressInfo",
       "priceInfo",
-      "actionList"
+      "statusDetail",
+      "platformFee"
     ])
   },
   methods: {
@@ -117,22 +135,9 @@ export default {
     padding: 40px 0;
   }
 
-  .status-info {
-    margin-bottom: 40px;
-
-    .status {
-      font-size: 68px;
-      color: #000;
-      letter-spacing: 0.82px;
-      line-height: 82px;
-      font-weight: bold;
-    }
-
-    .status-desc {
-      color: #999;
-      letter-spacing: 0;
-      margin-top: 30px;
-    }
+  .earnest-price {
+    font-size: 28px;
+    color: #d0021b;
   }
 
   .logistics-info {
@@ -193,32 +198,27 @@ export default {
   .trade-info {
     font-size: 28px;
 
-    & > :first-child + p {
+    & > p {
       margin: 20px 0;
     }
+
+    & > p:first-child {
+      margin-top: 0;
+    }
+
+    .earnest-price {
+      color: #d0021b;
+    }
+
+    .payment-tip {
+      font-size: 24px;
+      color: #999;
+    }
   }
 
   .label {
     font-size: 28px;
     margin-right: 12px;
   }
-
-  .actions {
-    display: flex;
-    justify-content: flex-end;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 120px;
-    background: #fff;
-    box-shadow: inset 0 1px 0 0 #eee;
-    padding: 20px;
-    z-index: 10;
-
-    .detail-actions {
-      margin-top: 0;
-    }
-  }
 }
 </style>
\ No newline at end of file

+<template>
+  <div class="footer-wrapper">
+    <count-down :leftTime="order.leftTime" />
+    <order-actions class="actions" :order="order" />
+  </div>
+</template>
+
+<script>
+import OrderActions from "../../components/order-actions";
+import CountDown from "../../components/count-down";
+
+export default {
+  props: {
+    order: {
+      type: Object,
+      default: {}
+    }
+  },
+  components: {
+    OrderActions,
+    CountDown
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.footer-wrapper {
+  display: flex;
+  margin-top: 40px;
+
+  .actions {
+    flex: 1;
+  }
+}
+</style>
\ No newline at end of file

 <template>
-  <div class="content-wrapper">
-    <scroll
-      @pulling-up="fetchData"
-      :options="options"
-      :data="orderList"
-      class="order-list-scroll-wrap"
-      v-show="!isShowEmpty"
-    >
-      <ul class="list-wrapper">
-        <li v-for="order in orderList" :key="order.orderCode">
-          <order-info :order="order" />
-          <order-list-item :order="order" />
-          <!-- 订单操作 -->
-          <order-actions :order="order" />
-        </li>
-      </ul>
-    </scroll>
-    <empty-list v-show="isShowEmpty" />
-  </div>
+  <layout-app>
+    <div class="content-wrapper">
+      <scroll
+        @pulling-up="fetchData"
+        :options="options"
+        :data="orderList"
+        class="order-list-scroll-wrap"
+        v-show="!isShowEmpty"
+      >
+        <ul class="list-wrapper">
+          <li v-for="order in orderList" :key="order.orderCode">
+            <order-info :order="order" />
+            <order-list-item :order="order" />
+            <!-- 订单操作 -->
+            <order-item-footer :order="order" />
+          </li>
+        </ul>
+      </scroll>
+      <empty-list v-show="isShowEmpty" />
+    </div>
+  </layout-app>
 </template>
 
 <script>
@@ -27,8 +29,7 @@ import { createNamespacedHelpers } from "vuex";
 import OrderListItem from "./components/order-item";
 import OrderInfo from "./components/order-info.vue";
 import EmptyList from "./components/empty";
-
-import OrderActions from "../components/order-actions";
+import OrderItemFooter from "./components/order-footer";
 
 const { mapActions, mapState, mapGetters } = createNamespacedHelpers(
   "order/inSaleOrderList"
@@ -38,9 +39,9 @@ export default {
   components: {
     Scroll,
     OrderListItem,
-    OrderActions,
     OrderInfo,
-    EmptyList
+    EmptyList,
+    OrderItemFooter
   },
   computed: {
     ...mapState(["entryOrder", "notEntryOrder", "isShowEmpty"]),
@@ -84,7 +85,7 @@ export default {
 </script>
 <style lang="scss" scoped>
 .content-wrapper {
-  height: calc(100vh);
+  height: calc(100vh - 200px);
   overflow-x: hidden;
   overflow-y: auto;
   -webkit-box-orient: vertical;

@@ -9,6 +9,7 @@ const routers = [
   },
 
   // 出售订单列表
+  // owner 默认为sell
   {
     name: 'InSaleOrderList',
     path: '/xianyu/in/sale/order/list',

 <template>
-  <div class="content-wrapper">
+  <layout-app>
     <status-nav />
+    <div class="content-wrapper">
+      <scroll
+        @pulling-up="fetchMore"
+        :options="options"
+        :data="orderList"
+        class="order-list-scroll-wrap"
+        v-show="!isShowEmpty"
+      >
+        <ul class="list-wrapper">
+          <li v-for="order in orderList" :key="order.orderCode">
+            <order-info :order="order" />
+            <order-list-item :order="order" />
+            <!-- 订单操作 -->
+            <order-item-footer :order="order" />
+          </li>
+        </ul>
+      </scroll>
 
-    <scroll
-      @pulling-up="fetchMore"
-      :options="options"
-      :data="orderList"
-      class="order-list-scroll-wrap"
-      v-show="!isShowEmpty"
-    >
-      <ul class="list-wrapper">
-        <li v-for="order in orderList" :key="order.orderCode">
-          <order-info :order="order" />
-          <order-list-item :order="order" />
-          <!-- 订单操作 -->
-          <order-actions :order="order" />
-        </li>
-      </ul>
-    </scroll>
-
-    <empty-list v-show="isShowEmpty" />
-  </div>
+      <empty-list v-show="isShowEmpty" />
+    </div>
+  </layout-app>
 </template>
 
 <script>
@@ -31,8 +32,7 @@ import OrderListItem from "./components/order-item";
 import StatusNav from "./components/status-nav";
 import OrderInfo from "./components/order-info.vue";
 import EmptyList from "./components/empty";
-
-import OrderActions from "../components/order-actions";
+import OrderItemFooter from "./components/order-footer";
 
 const { mapActions, mapState, mapMutations } = createNamespacedHelpers(
   "order/orderList"
@@ -43,9 +43,9 @@ export default {
     Scroll,
     OrderListItem,
     StatusNav,
-    OrderActions,
     OrderInfo,
-    EmptyList
+    EmptyList,
+    OrderItemFooter
   },
   computed: {
     ...mapState(["orderList", "pullUpLoad", "isShowEmpty"]),
@@ -86,7 +86,7 @@ export default {
 </script>
 <style lang="scss" scoped>
 .content-wrapper {
-  height: calc(100vh);
+  height: calc(100vh - 300px);
   overflow-x: hidden;
   overflow-y: auto;
   -webkit-box-orient: vertical;

@@ -7,16 +7,16 @@
 
 <script>
 
-const ALIPAY_DOMAIN = 'https://mapi.alipay.com/gateway.do';
+const ALIPAY_DOMAIN = 'https://openapi.alipay.com/gateway.do';
 
 export default {
   name: 'PayPage',
   props: ['orderCode', 'payParams'],
   mounted() {
     if (this.payParams) {
-      const url = ALIPAY_DOMAIN + '?' + encodeURIComponent(this.payParams);
+      const url = ALIPAY_DOMAIN + '?' + this.payParams;
 
-      console.log(url);
+      window.location.href = url;
     }
   },
   methods: {}

+<template>
+  <LayoutApp :show-back="true">
+    <div class="body">
+      <div class="header">
+        <i class="iconfont iconOk icon-class"></i>
+      </div>
+      <div class="title">上架成功</div>
+
+      <ProductInfo class="product-info" :data="product"></ProductInfo>
+
+      <YohoButton :txt="txt" class="btn-class" @on-click="onClick"></YohoButton>
+
+      <div class="info">
+        <div class="item" @click="goPublish">继续发布</div>
+        <div class="item" @click="goHome">随便逛逛</div>
+      </div>
+    </div>
+  </LayoutApp>
+</template>
+
+<script>
+
+import ProductInfo from './components/confirm/buyer-product';
+
+import { createNamespacedHelpers } from 'vuex';
+
+const { mapActions: mapOrderAction } = createNamespacedHelpers('order/orderConfirm');
+
+export default {
+  name: 'SellPayOk',
+  props: ['orderCode'],
+  data() {
+    return {
+      txt: '查看商品',
+      product: {}
+    };
+  },
+  components: {
+    ProductInfo
+  },
+  mounted() {
+    if (this.orderCode) {
+      this.fetchOrderGoods({ orderCode: this.orderCode }).then(result => {
+        this.product = result.data;
+      });
+    }
+  },
+  methods: {
+    ...mapOrderAction(['fetchOrderGoods']),
+    onClick() {
+    },
+    goPublish() {
+
+    },
+    goHome() {
+
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.body {
+  height: 100%;
+  margin: 0 32px;
+  padding-bottom: 140px;
+  overflow-y: auto;
+}
+
+.header {
+  margin-top: 80px;
+  text-align: center;
+}
+
+.icon-class {
+  font-size: 120px;
+}
+
+.btn-class {
+  height: 100px;
+  font-size: 32px;
+  line-height: 100px;
+}
+
+.title {
+  font-size: 40px;
+  font-weight: bold;
+  text-align: center;
+  margin-bottom: 60px;
+}
+
+.product-info {
+  margin-top: 140px;
+  margin-bottom: 74px;
+}
+
+.info {
+  font-size: 28px;
+  display: flex;
+  margin-top: 30px;
+
+  .item {
+    width: 50%;
+    text-align: center;
+  }
+
+  .item + .item {
+    border-left: 1px solid black;
+  }
+}
+
+</style>

+<template>
+    <LayoutApp class="yohoufo-area-choose-page" title="选择国家或地区">
+      <div class="area-list">
+        <div class="area-item" v-for="(item, index) in list" :key="index" @click="chooseArea(item.value)">
+          <span class="code">{{item.value}}</span>
+          {{item.name}}
+        </div>
+      </div>
+    </LayoutApp>
+</template>
+
+<script>
+const areaList = [{
+    value: '+61',
+    name: '澳大利亚'
+}, {
+    value: '+82',
+    name: '韩国'
+}, {
+    value: '+1',
+    name: '加拿大'
+}, {
+    value: '+60',
+    name: '马来西亚'
+}, {
+    value: '+1',
+    name: '美国'
+}, {
+    value: '+81',
+    name: '日本'
+}, {
+    value: '+65',
+    name: '新加坡'
+}, {
+    value: '+44',
+    name: '英国'
+}, {
+    value: '+86',
+    name: '中国'
+}, {
+    value: '+853',
+    name: '中国澳门'
+}, {
+    value: '+886',
+    name: '中国台湾'
+}, {
+    value: '+852',
+    name: '中国香港'
+}];
+
+export default {
+  name: 'areaChoose',
+  data() {
+    return {
+      list: areaList
+    };
+  },
+  mounted() {
+    // this.$yoho.authRealName();
+  },
+  methods: {
+    chooseArea(code) {
+      this.$root.$createThirdBind().changeArea(code);
+      this.$router.go(-1);
+    }
+  }
+};
+</script>
+
+
+<style lang="scss" scoped>
+.area-list {
+  padding: 0 40px;
+  max-height: 100%;
+  overflow-y: scroll;
+}
+
+.area-item {
+  height: 100px;
+  line-height: 100px;
+  font-size: 32px;
+  color: #222;
+  border-bottom: 1px solid #e8e8e8;
+
+  &:last-child {
+    border-bottom: 0;
+  }
+
+  .code {
+    float: right;
+  }
+}
+
+</style>

 <template>
-    <LayoutApp class="
-
-
-">
+    <LayoutApp class="yohoufo-real-auth-page" title="实名认证">
       <div class="auth-content">
-        <div class="auth-title">实名认证</div>
-        <p class="auth-sub-title">信息仅用于身份验证，不对外展示，有货UFO平台将严保您的信息安全，请认证填写如下信息，确保上传的图片文字清晰可见。</p>
+        <p class="auth-sub-title">UFO平台将严格保密您的认证信息，请按照种类分别填写以下信息，保证上传的图片文字清晰可见。</p>
         <div class="auth-form">
           <p class="form-title">姓名</p>
           <div class="form-input-block">
-            <CubeInput class="auth-input" v-model="name" :disabled="!!certName" placeholder="请输入真实姓名"></CubeInput>
+            <CubeInput class="auth-input" v-model="name" :disabled="!!certName" placeholder="请填写姓名"></CubeInput>
           </div>
           <p class="form-title">身份证号</p>
           <div class="form-input-block">
-            <CubeInput class="auth-input" v-model="idCode" :disabled="!!certIdCode" placeholder="请输入身份证号"></CubeInput>
+            <CubeInput class="auth-input" v-model="idCode" :disabled="!!certIdCode" placeholder="请填写身份证号"></CubeInput>
           </div>
-          <p class="form-title">上传身份证正面照片 <a :href="exampleLink" class="upload-intro">示例照片</a></p>
+          <p class="form-title">上传身份证正面照片 <a :href="exampleLink" class="upload-intro"><span class="iconfont iconquestion"></span>示例照片</a></p>
           <div class="form-input-block">
             <div class="upload-btn" @click="uploadFrontCard">
               <div v-if="idCardFrontUrl" class="delete-img" @click.stop="clearInfo(['idCardFront', 'idCardFrontUrl'])">ㄨ</div>
@@ -173,24 +169,18 @@ export default {
 };
 </script>
 
-
 <style lang="scss" scoped>
   .auth-content {
-    height: calc(100% - 200px);
+    height: calc(100% - 144px);
     padding: 0 40px;
     overflow-y: scroll;
 
-    .auth-title {
-      font-size: 68px;
-      line-height: 96px;
-      font-weight: 900;
-    }
-
     .auth-sub-title {
       font-size: 24px;
       color: #999;
       line-height: 1.5;
-      margin-top: 20px;
+      margin: 40px 0 10px;
+      text-align: center;
     }
 
     .auth-form {
@@ -201,11 +191,12 @@ export default {
       font-size: 36px;
       padding-top: 40px;
       line-height: 1.6;
+      font-weight: 500;
     }
 
     .form-input-block {
       padding-bottom: 16px;
-      border-bottom: 1px solid #f6f6f6;
+      border-bottom: 1px solid #eee;
       position: relative;
     }
 
@@ -223,10 +214,19 @@ export default {
     }
 
     .upload-intro {
-      font-size: 28px;
+      font-size: 24px;
       line-height: 58px;
       color: #999;
       float: right;
+      display: flex;
+      align-items: center;
+      font-weight: 300;
+
+      .iconfont {
+        font-size: 30px;
+        color: #d8d8d8;
+        margin-right: 10px;
+      }
     }
 
     .upload-btn {
@@ -319,11 +319,18 @@ export default {
   }
 
   .auth-footer {
-    padding: 40px;
+    padding: 28px 40px;
 
     .submit-btn {
-      height: 120px;
+      height: 88px;
+      line-height: 88px;
+      padding: 0;
       background: #022c46;
+      border-radius: 44px;
+
+      &:after {
+        border: 0;
+      }
 
       &.cube-btn_disabled {
         background: #ccc;

-<template>
-    <div class="yohoufo-bind-page">
-      <div class="ufo-logo">UFO飞碟好物</div>
-
-
-    </div>
-</template>
-
-<script>
-export default {
-  name: 'bind',
-  activated() {
-  },
-  beforeRouteUpdate(to, from, next) {
-  },
-  mounted() {
-    // this.$yoho.authRealName();
-  },
-  methods: {
-  }
-};
-</script>

 export default [{
-    name: 'passport.bind',
-    path: '/xianyu/passport/bind',
-    component: () => import(/* webpackChunkName: "passport.bind" */ './bind')
+    name: 'passport.area',
+    path: '/xianyu/passport/area/choose',
+    component: () => import(/* webpackChunkName: "passport.area" */ './area')
 }, {
     name: 'passport.auth',
     path: '/xianyu/passport/real/auth',

@@ -18,8 +18,8 @@
                    @select="onSelectSize"
                    @add="onAdd" />
         <div class="footer">
-          <cube-button v-if="config.type === 'sell'" @click="magic">变现 <span><i>¥</i>{{399}}</span></cube-button>
-          <cube-button @click="select" :class="{active: selectedSize.size_id }">{{config.title}}</cube-button>
+          <cube-button v-if="config.type === 'sell'" @click="convertToCash" :class="{active: isMarketable}">变现<span> <i>¥</i>{{cashPrice}}</span></cube-button>
+          <cube-button @click="select" :class="{active: isTradable }">{{config.title}}</cube-button>
         </div>
       </div>
     </div>
@@ -83,6 +83,31 @@ export default {
     },
     canAddSize() {
       return get(this.product, 'goods_list[0].canAddSize', false);
+    },
+
+    /**
+     * 可交易(购买|出售)
+     */
+    isTradable() {
+      return this.selectedSize && this.selectedSize.size_id;
+    },
+
+    /**
+     * 变现价格,使用bid_moster_price
+     */
+    cashPrice() {
+      if (this.selectedSize && this.selectedSize.hasOwnProperty('bid_moster_price')) {
+        return this.selectedSize.bid_moster_price;
+      }
+
+      return '-';
+    },
+
+    /**
+     * 是否可变现
+     */
+    isMarketable() {
+      return this.cashPrice !== '-' && this.cashPrice > 0;
     }
   },
   mounted() {
@@ -106,12 +131,18 @@ export default {
       this.$emit('add');
     },
     select() {
+      if (!this.isTradable) {
+        return;
+      }
       this.$emit('select', {
         productId: this.product.product_id,
         storageId: this.selectedSize.storage_id,
       });
     },
-    magic() {
+    convertToCash() {
+      if (!this.isMarketable) {
+        return;
+      }
       this.hide();
 
       // TODO: TBD

@@ -4,10 +4,14 @@
       <div class="title">相关商品</div>
       <div @click="onAllClick">全部 <i class="cubeic-arrow"></i></div>
     </div>
-    <div class="product-item" v-for="(product, idx) in list" :key="idx" @click="onItemClick(product)">
-      <square-img :src="product.default_images" :width="300" :height="300" />
-      <div class="name"><span>{{product.product_name}}</span></div>
-      <div class="price"><i>¥</i>{{product.price}}</div>
+    <div class="row">
+      <div class="col" v-for="(product, idx) in list" :key="idx">
+        <div class="product-item" @click="onItemClick(product)">
+          <square-img :src="product.default_images" :width="300" :height="300" />
+          <div class="name"><span>{{product.product_name}}</span></div>
+          <div class="price"><i>¥</i>{{product.price}}</div>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -42,9 +46,6 @@ export default {
 
   .associated-products {
     margin-top: 30px;
-    display: flex;
-    flex-flow: wrap;
-    justify-content: space-between;
 
     .header {
       padding: 20px 0;
@@ -61,9 +62,19 @@ export default {
       color: #000;
     }
 
+    .row {
+      overflow: hidden;
+      margin: 0 -8px;
+
+      .col {
+        width: 33.3333%;
+        padding: 0 8px;
+        float: left;
+      }
+    }
+
     .product-item {
       margin-top: 10px;
-      width: 30%;
       text-align: center;
       overflow: hidden;
     }

@@ -17,7 +17,7 @@ $sub-color : #64ad88;
     }
 
     &.active {
-      border: 0;
+      border-color: $primary-color;
       background: $primary-color;
       color: #fff;
     }

@@ -174,18 +174,13 @@ export default {
       return get(this.productDetail, 'goods_list[0].size_list', null);
     },
   },
-  beforeRouteUpdate(to, from, next) {
-    // const loading = this.createLoading();
-
-    this.loadData(to.params.productId);
-    next();
-  },
   mounted() {
-    this.loadData(this.productId);
     this.imageHideThreadhold = -window.innerWidth * 0.693;
   },
   activated() {
-    this.refresh();
+    if (this.productId !== this.productDetail.product_id) {
+      this.loadData(this.productId);
+    }
   },
   methods: {
     ...mapActions(['fetchProductInfo', 'fetchTop3', 'toggleFav', 'updateTradeInfo', 'getSelectedTradeProduct']),
@@ -239,11 +234,21 @@ export default {
       });
     },
     gotoBrand() {
+      // type: 4，品牌；5，系列
+      const query = {
+        type: 5,
+      };
+
+      if (this.productDetail.seriesId) {
+        query.series = this.productDetail.seriesId;
+      } else {
+        query.type = 4;
+        query.brand = this.productDetail.brandId;
+      }
+
       this.$router.push({
-        name: '',
-        params: {
-          productId: this.productDetail.product_id,
-        },
+        name: 'List',
+        query,
       });
     },
     showActivity() {
@@ -430,12 +435,13 @@ export default {
   }
 
   .recommend {
-    margin-top: 20px;
+    padding-top: 20px;
+    background: #f5f5f5;
 
     h2 {
       font-size: 36px;
       line-height: 50px;
-      padding: 20px 0;
+      padding: 20px 0 0;
       margin: 0 40px;
     }
   }

@@ -53,7 +53,7 @@ export default function() {
       },
       async fetchChannelList({ commit }) {
         const result = await this.$api.get('/api/ufo/channel/channelList', {
-          content_code: '9cb6138be8e60c96f48107da481816c3',
+          content_code: 'c07b807110b342a09bd65d13aeb118f6',
           // uid: '64668089',
           uid: '500031170',
         });

@@ -38,7 +38,10 @@ export default function() {
         list: [],
         currentPage: 1,
         pageSize: 20,
-        endReached: false
+        endReached: false,
+        tradeType: 0,
+        startTime: 0,
+        endTime: 0
       },
       userWalletInfo: {
         totalAmount: 0.00,
@@ -72,7 +75,7 @@ export default function() {
           sale: { title: '出售中', num: state.sellerNum, page: ''},
           order: {name: 'order'},
           resource1: {name: 'resource1', data: state.resource1},
-          income: {title: '交易收入', num: state.assetData.totalIncome, page: 'tradeIncome'},
+          income: {title: '交易收入', num: state.assetData.totalIncome, page: 'income'}, // 原交易收入 tradeIncome
           buyOrder: {title: '我购买的订单', num: state.buyNum, page: ''},
           buy: {name: 'buy', title: '我的求购', num: state.askBuyNum, page: ''},
           collect: {name: 'collect', title: '我的收藏', num: state.favoriteNum, page: 'favorite'},
@@ -80,6 +83,33 @@ export default function() {
         };
 
         return tabList;
+      },
+      getYearMonth(state) {
+        let beginTime = moment(new Date(state.filterData.beginTime * 1000)).format('YYYY-MM');
+        let endTime = moment(new Date(state.filterData.endTime * 1000)).format('YYYY-MM');
+
+        var a = moment(endTime.split('-'));
+        var b = moment(beginTime.split('-'));
+        let yearNum = a.diff(b, 'years');
+        let monthNum = a.diff(b, 'months');
+        let beginYear = beginTime.split('-')[0];
+        let beginMonth = beginTime.split('-')[1];
+        let yearsData = [];
+        let monthsData = [];
+
+        for (let i = 0; i <= yearNum; i++) {
+          let year = '' + (Number(beginYear) + i);
+
+          yearsData.push({text: year, value: year});
+        }
+        for (let i = 0; i <= monthNum; i++) {
+          let month = Number(beginMonth) + i;
+
+          month = month < 10 ? '0' + month : month;
+          monthsData.push({text: month, value: month});
+        }
+
+        return [yearsData, monthsData];
       }
     },
     mutations: {
@@ -153,6 +183,13 @@ export default function() {
         });
         state.walletData = Object.assign({}, state.walletData, walletData);
       },
+      changeWalletType(state, data) {
+        state.walletData.tradeType = data;
+      },
+      changeWalletTime(state, {startTime, endTime}) {
+        state.walletData.startTime = startTime;
+        state.walletData.endTime = endTime;
+      },
       addUserWalletInfo(state, data) {
         state.userWalletInfo = data;
       },
@@ -267,9 +304,16 @@ export default function() {
         }
       },
 
-      async fetchWallet({ commit, state }, isRefresh) {
+      async fetchWallet({ commit, state }, {isRefresh, tradeType = 0, startTime = 0, endTime = 0}) {
+        if (isRefresh) {
+          commit('changeWalletType', tradeType);
+          commit('changeWalletTime', {startTime, endTime});
+        }
         let {isFetching, endReached, currentPage, list, pageSize} = state.walletData;
 
+        tradeType = state.walletData.tradeType;
+        startTime = state.walletData.startTime;
+        endTime = state.walletData.endTime;
         if (isFetching || (!isRefresh && endReached)) {
           return;
         }
@@ -277,7 +321,7 @@ export default function() {
 
         // commit('assetFetching', {isFetching: true});
         let page = isRefresh ? 1 : currentPage + 1;
-        const result = await this.$api.get('/api/ufo/mine/wallet', {page, limit: pageSize, uid, tradeType: 0});
+        const result = await this.$api.get('/api/ufo/mine/wallet', {page, limit: pageSize, uid, tradeType, startTime, endTime});
 
         // commit('assetFetching', {isFetching: false});
         if (result.code === 200) {

@@ -82,7 +82,7 @@ export default function() {
         });
 
         if (res.code === 200) {
-          commit('setEntryOrder', res.data);
+          commit('setNotEntryOrder', res.data);
         }
       },
     },

@@ -211,6 +211,12 @@ export default function() {
         }
 
         return payResult;
+      },
+
+      async fetchOrderGoods(ctx, { orderCode }) {
+        return this.$api.get('/api/order/goods', {
+          orderCode
+        });
       }
     },
     getters: {},

@@ -16,6 +16,8 @@ export default function() {
       goodsInfo: state => state.orderDetail.goodsInfo || {}, // 商品信息
       priceInfo: state => state.orderDetail.priceInfo || {}, // 价格信息
       actionList: state => state.orderDetail.buttons || {}, // 允许操作
+      // 卖家订单价格字段
+      platformFee: state => state.orderDetail.platformFee || {},
     },
     actions: {
       /**

@@ -6,21 +6,25 @@ module.exports = {
   },
   '/api/ufo/mine/seller/orderSummary': {
     ufo: true,
+    auth: true,
     api: 'ufo.seller.orderSummary',
     params: {},
   },
   '/api/ufo/mine/favoriteNum': {
     ufo: true,
+    auth: true,
     api: 'ufo.user.favoriteNum',
     params: {},
   },
   '/api/ufo/mine/depositNum': {
     ufo: true,
+    auth: true,
     api: 'ufo.deposit.queryUserStorageCount',
     params: {},
   },
   '/api/ufo/mine/assets': {
     ufo: true,
+    auth: true,
     api: 'ufo.asssets.details',
     params: {
       limit: { type: Number },
@@ -29,6 +33,7 @@ module.exports = {
   },
   '/api/ufo/mine/wallet': {
     ufo: true,
+    auth: true,
     api: 'ufo.wallet.queryWalletDetailList',
     params: {
       tradeType: { type: Number },
@@ -40,16 +45,19 @@ module.exports = {
   },
   '/api/ufo/mine/userWalletInfo': {
     ufo: true,
+    auth: true,
     api: 'ufo.wallet.queryUserWalletInfo',
     params: {}
   },
   '/api/ufo/mine/walletFilter': {
     ufo: true,
+    auth: true,
     api: 'ufo.wallet.queryDateAndType',
     params: {}
   },
   '/api/ufo/mine/order/summary': {
     ufo: true,
+    auth: true,
     path: '/ufo-gateway/shopping',
     api: 'ufo.order.summary',
     params: {

@@ -302,6 +302,14 @@ module.exports = {
     params: {}
   },
 
+  // 定单商品详情
+  '/api/order/goods': {
+    ufo: true,
+    auth: true,
+    api: 'ufo.buyerOrder.goodsDetail',
+    params: {}
+  },
+
   // 订单物流信息
   '/api/order/express': {
     ufo: true,