ok

src/App.vue

@@ -0,0 +1,60 @@
+<template>
+  <div id="app">
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'app'
+}
+</script>
+
+<style>
+#app {
+  font-family: 'Avenir', Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+  min-width: 1200px;
+}
+.el-loading-spinner{
+  .path{
+    stroke:#c81118!important;
+  }
+}
+/*.rechange{
+  height: 50px;
+  li{
+    float: left;
+    height: 50px;
+    line-height: 50px;
+    text-align: center;
+    font-size: 18px;
+    color: #000;
+  }
+  .pleft{
+    width: 96px;
+    border-bottom: 3px solid #c81118;
+  }
+  .pright{
+    width:739px;
+    border-bottom: 3px solid #ccc; 
+  }
+}*/
+#app{
+  ::-webkit-scrollbar{
+    display:none;
+  }
+}
+
+scrollbar-arrow-color: rgba(15,15,15,15); 
+scrollbar-face-color: rgba(15,15,15,15); 
+scrollbar-3dlight-color: rgba(15,15,15,15); 
+scrollbar-highlight-color: rgba(15,15,15,15); 
+scrollbar-shadow-color: rgba(15,15,15,15); 
+scrollbar-darkshadow-color: rgba(15,15,15,15); 
+scrollbar-track-color: rgba(15,15,15,15); 
+scrollbar-base-color:rgba(15,15,15,15);
+</style>

src/assets/css/base.css

@@ -0,0 +1,163 @@
+/*!
+ * @名称：base.css
+ * @功能：1、重设浏览器默认样式
+ *       2、设置通用原子类
+ */
+/* 防止用户自定义背景颜色对网页的影响，添加让用户可以自定义字体 */
+html {
+    /*background:white;*/
+    color:black;
+    height: 100%;
+    background-color: #f5f8ff;
+}
+body{
+    height: 100%;
+}
+/* 内外边距通常让各个浏览器样式的表现位置不同 */
+body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
+    margin:0;
+    padding:0;
+}
+*{
+    box-sizing: border-box;
+}
+/* 要注意表单元素并不继承父级 font 的问题 */
+body,button,input,select,textarea {
+    font:12px Microsoft YaHei,\5b8b\4f53,arial,sans-serif;
+}
+input,select,textarea {
+    font-size:100%;
+}
+/* 去掉 table cell 的边距并让其边重合 */
+table {
+    border-collapse:collapse;
+    border-spacing:0;
+}
+/* ie bug：th 不继承 text-align */
+th {
+    text-align:inherit;
+}
+/* 去除默认边框 */
+fieldset,img {
+    border:none;
+}
+/* ie6 7 8(q) bug 显示为行内表现 */
+iframe {
+    display:block;
+}
+.el-select{
+    width: 100%;
+}
+/* 去掉 firefox 下此元素的边框 */
+abbr,acronym {
+    border:none;
+    font-variant:normal;
+}
+/* 一致的 del 样式 */
+del {
+    text-decoration:line-through;
+}
+address,caption,cite,code,dfn,em,th,var {
+    font-style:normal;
+    font-weight:500;
+}
+/* 去掉列表前的标识，li 会继承 */
+ol,ul {
+    list-style:none;
+}
+/* 对齐是排版最重要的因素，别让什么都居中 */
+caption,th {
+    text-align:left;
+}
+/* 来自yahoo，让标题都自定义，适应多个系统应用 */
+h1,h2,h3,h4,h5,h6 {
+    font-size:100%;
+    font-weight:500;
+}
+q:before,q:after {
+    content:'';
+}
+/* 统一上标和下标 */
+sub,sup {
+    font-size:75%;
+    line-height:0;
+    position:relative;
+    vertical-align:baseline;
+}
+sup {
+    top:-0.5em;
+}
+sub {
+    bottom:-0.25em;
+}
+/* 让链接在 hover 状态下不显示下划线 */
+a{
+    color:#333
+}
+a:hover,a:visited,a:active,a:link {
+    text-decoration: none!important
+}
+/* 默认不显示下划线，保持页面简洁 */
+ins,a {
+    text-decoration:none;
+}
+/* 去除 ie6 & ie7 焦点点状线 */
+a:focus,*:focus {
+    outline:none;
+}
+/* 清除浮动 */
+.clearfix:before,.clearfix:after {
+    content:"";
+    display:table;
+}
+.clearfix:after {
+    clear:both;
+    overflow:hidden;
+}
+.clearfix {
+    zoom:1; /* for ie6 & ie7 */
+}
+.clear {
+    clear:both;
+    display:block;
+    font-size:0;
+    height:0;
+    line-height:0;
+    overflow:hidden;
+}
+.el-loading-mask{
+        background-color: rgba(255,255,255,1);
+    }
+/* 设置显示和隐藏，通常用来与 js 配合 */
+.hide {
+    display:none;
+}
+.block {
+    display:block;
+}
+/* 设置浮动，减少浮动带来的 bug */
+.fl,.fr {
+    display:inline;
+}
+.fl {
+    float:left;
+}
+.fr {
+    float:right;
+}
+
+input::-webkit-outer-spin-button,
+input::-webkit-inner-spin-button{
+    -webkit-appearance: none !important;
+    margin: 0; 
+}
+input[type="number"]{-moz-appearance:textfield;}
+.pointer{
+    cursor: pointer;
+}
+.el-loading-spinner .el-loading-text{
+  color: #c81118!important;
+}
+
+
+

src/assets/js/bus.js

@@ -0,0 +1,9 @@
+import Vue from 'vue'
+var bus = new Vue();
+bus.menushow = true;
+bus.$on("routerc",function(msg,path){
+  bus.menushow = msg;
+  bus.$emit("menustaus",msg,path)
+})
+
+export default bus

src/assets/js/common.js

@@ -0,0 +1,767 @@
+import bus from "./bus.js"
+
+/* 组件时间格式转换 */
+var temptime=function(temptime){
+    var gettype=Object.prototype.toString;
+    if (temptime != '' && (gettype.call(temptime) == '[object Date]')) {
+        temptime = temptime.getFullYear() + '-' + (temptime.getMonth() + 1) + '-' + temptime.getDate();
+    }
+    return temptime;
+}
+/* 时间戳转换函数 */
+var getDataYear = function(format, timestamp) {
+  console.log(timestamp==0 )
+  if(timestamp == null||timestamp == undefined||timestamp == 0){
+    return ''
+  }
+    var date = new Date(timestamp ? (parseInt(timestamp) * 1000) : new Date().getTime());
+    var FORMAT = new Object();
+    FORMAT = {
+        'Y': "date.getFullYear()",
+        'M': "date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1",
+        'D': "date.getDate() < 10 ? '0' + date.getDate() : date.getDate()",
+        'h': "date.getHours() < 10 ? '0' + date.getHours() : date.getHours()",
+        'm': "date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()",
+        's': "date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()"
+    }
+    for (var i in FORMAT) {
+      if (format.indexOf(i) != -1) {
+        format = format.replace(i, eval(FORMAT[i]));
+      }
+    }
+    return format;
+}
+//设置cookie
+var setcookie=function(name,value){//设置cookie的值
+  name = "block_fxees" + name;
+  $.cookie(name, value);
+  if (localStorage) {
+    localStorage.setItem(name, value);
+  }
+  // var Days = 30;
+  // var exp = new Date();
+  // exp.setTime(exp.getTime() + Days*24*60*60*1000);
+  // document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
+}
+//获取cookie
+var getcookie=function(name){//获取cookie的值
+  name = "block_fxees" + name;
+  if ($.cookie(name)) {
+    return $.cookie(name);
+  } else if (localStorage) {
+    return localStorage.getItem(name);
+  } else {
+    return null;
+  }
+
+  // var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
+  // if(arr=document.cookie.match(reg)){
+  //   return unescape(arr[2]);
+  // } else{
+  //   return null;
+  // }
+}
+var delatecookie=function(){//清空cookie
+  var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
+  if (keys) {
+    for (var i = keys.length; i--;) {
+      document.cookie = keys[i] + '=0;expires=' + new Date(0).toUTCString();
+    }
+  }
+  localStorage.clear();
+}
+
+var savecookie = function(data) {
+  setcookie('username', data.base.username);
+  setcookie('adddate', data.base.adddate);
+  setcookie('addtime', data.base.addtime);
+  setcookie('email', data.base.email);
+  setcookie('group', data.base.group);
+  setcookie('regip', data.base.regip);
+  // setcookie('username', data.base.username);
+  // setcookie('phone', data.base.mobile);
+  // setcookie('country', 'CN');
+  // setcookie('email', data.base.email);
+  // setcookie('hmobile', data.base.hmobile);
+  // setcookie('lockname', (data.auth.lockname != null ? data.auth.lockname : ''), '/', false);
+  // setcookie('tradepwdstate', data.state.tradepwdstate);
+  // setcookie('emailstate', data.state.emailstate);
+  // setcookie('mobilestate', data.state.mobilestate);
+  // setcookie('personstate', data.state.personstate);
+  // setcookie('personintegrity', data.state.personintegrity);
+  // setcookie('businessstate', data.state.businessstate);//企业认证
+  // setcookie('enterprise_name', data.auth.enterprise_name);//企业名字
+  // setcookie('enterprise_id', data.auth.enterprise_id);//企业id
+  // setcookie('regtime', data.base.regtime);
+}
+
+/* ajax请求 */
+var ajax = function(that, url, params, success, method) {
+  var token = getcookie('token');
+  // console.log(url);
+  // console.log(params);
+  // var openId = sessionStorage.getItem('openId');
+  var headerParam;
+  if(token){
+    headerParam={
+      Authorization: 'Bearer ' + token,
+      'Content-Type':'application/x-www-form-urlencoded;',
+    };
+  }
+  else{
+    headerParam={
+      'Content-Type':'application/x-www-form-urlencoded;',
+    };
+  }
+  if(method=='GET'){
+    that.axios({
+      method: 'get',
+      url: url,
+      headers:headerParam,
+     params:params,
+    }).then((response) => {
+      // console.log(that.axios.headers)
+      // if(response.data.code==-2 && token){
+      //   delatecookie();
+      //   that.$alert(
+      //       '您长时间未登录，请先登录',
+      //       '提示',
+      //   ).then(() => {
+      //     that.$router.push({
+      //       path: '/'
+      //     });
+      //   });
+      // }else{
+      //   success(response.data);
+      // }
+      // if(response.data.code==-2){
+      //   that.$notify({
+      //     title: '提示',
+      //     message: '请重新登录',
+      //     type: 'warning',
+      //     duration:'2000'
+      //   });
+      //   // that.$router.push({path:"/index"});
+      //   return false;
+      // }
+      if(typeof(success)==="function"){
+        success(response.data);
+      }
+      if(response.data.code==200||response.data.code==-2){
+             
+      }
+      else{
+        that.$notify({
+          title: '提示',
+          message: response.data.message,
+          type: 'warning',
+          duration:'2000'
+        });
+      } 
+    }).catch(function(response){
+      console.log(response);
+    })
+  }else{
+    params=that.querystring.stringify(params);
+    that.axios({
+      method: "POST",
+      url: url,
+      headers:headerParam,
+     data:params,
+    }).then((response) => {
+      // if(response.data.code==-2 && token){
+      //   delatecookie();
+      //   that.$alert(
+      //       '您长时间未登录，请先登录',
+      //       '提示',
+      //   ).then(() => {
+      //     that.$router.push({
+      //       path: '/'
+      //     });
+      //   });
+      // }else{
+      //   success(response.data);
+      // }
+      // if(response.data.code==-2){
+      //   that.$notify({
+      //     title: '提示',
+      //     message: '请重新登录',
+      //     type: 'warning',
+      //     duration:'2000'
+      //   });
+      //   // that.$router.push({path:"/index"});
+      //   return false;
+      // }
+      if(typeof(success)==="function"){
+        success(response.data);
+      }
+      if(response.data.code==200||response.data.code==-2){
+
+      }
+      else{
+        that.$notify({
+          title: '提示',
+          message: response.data.message,
+          type: 'warning',
+          duration:'2000'
+        });
+      }     
+    }).catch(function(response){
+      // console.log(response);
+    })
+  }
+}
+
+/*发送短信*/
+var sendCode=function(that,params,success){
+  params.param=params.vparam;
+  delete params.vparam;
+  ajax(that,that.extendApi.phoneCheckedNum,params,function(res){
+    if(typeof(success)=='function'){
+      success(res);
+    }
+    if(res.code==200){
+      that.$notify({
+        title: '提示',
+        message: '发送成功',
+        type: 'success',
+        duration:'2000'
+      });
+      that.codestate=1;
+      that.secondNum=60;
+      clearInterval(that.reltime);
+      that.reltime=setInterval(function(){
+        that.secondNum--;
+        if(that.secondNum==0){
+          clearInterval(that.reltime);
+          that.codestate=0;
+          that.secondNum=60;
+        }
+      }, 1000);
+    }
+  },'post');
+};
+
+/*发送邮件*/
+var sendEmail=function(that,params,success){
+  params.param=params.vparam;
+  delete params.vparam;
+  ajax(that,that.extendApi.sendEmail,params,function(res){
+    if(typeof(success)=='function'){
+      success(res);
+    }
+    if(res.code==200){
+      that.$notify({
+        title: '提示',
+        message: '发送成功',
+        type: 'success',
+        duration:'2000'
+      });
+      that.codestate=1;
+      that.secondNum=60;
+      clearInterval(that.reltime);
+      that.reltime=setInterval(function(){
+        that.secondNum--;
+        if(that.secondNum==0){
+          clearInterval(that.reltime);
+          that.codestate=0;
+          that.secondNum=60;
+        }
+      }, 1000);
+    }
+  },'post');
+};
+
+/*登录*/
+var sublogion=function(_this,pageindex,params,success){
+  ajax(_this, _this.extendApi.userLogin,params, function(res) {
+    if(typeof(success)==="function"){
+      success(res);
+    }
+    if (res.code == 200) {
+      var data = res.data;
+      setcookie('token', data.access_token);
+      setcookie('refreshtoken', data.refresh_token);
+      var tokenexpressTime = parseInt(data.expires_in);
+      var logintime = parseInt(new Date().getTime() / 1000);
+      var deadtime = logintime + tokenexpressTime;
+      setcookie('deadtime', deadtime);
+      setcookie('id', data.userid);
+      ajax(_this, _this.extendApi.getUserInfo, '', function(data) {
+        if(data.code==200){
+          savecookie(data.data);
+          setcookie('quite', '4'); //登录状态为4.未登录为0
+          bus.$emit("login","h1");
+          if(_this.loginTab){
+            _this.loginTab=3;//首页登录框切换
+          }      
+          if(_this.islogoin){
+            _this.islogoin = 4;
+          }
+          if(_this.username){
+            _this.username = data.data.base.username;
+          }             
+          if (pageindex == 'index') {
+            // _this.$router.push({
+            //   path: '/usercenter/bcctrade'
+            // });
+          } else {
+            _this.$emit('tradeSuccess');
+          }
+        }
+        else if(data.code==-2){
+          delatecookie();
+          _this.$router.push({path:'/index'});
+          _this.$notify({
+            title: '提示',
+            message: "请重新登录",
+            type: 'warning',
+            duration: '1000'
+          });
+        }    
+      })
+    } else {
+      _this.$notify({
+        title: '提示',
+        message: res.message,
+        type: 'warning',
+        duration: '2000'
+      });
+    }
+  }, 'POST');
+
+  // ajax(_this,_this.extendApi.userLogin,params,function(res){
+  //   // console.log(_this.extendApi);
+  //   if(res.code==200){
+  //     // setcookie('token', data.access_token);
+  //     sessionStorage.setItem("token", res.data.access_token);
+  //     sessionStorage.setItem("userid", res.data.userid);
+  //     // sessionStorage.setItem("username",params.email);
+  //     if(_this.loginTab){
+  //       _this.loginTab=3;
+  //     }
+  //     _this.$notify({
+  //       title: '提示',
+  //       message: '登陆成功',
+  //       type: 'success',
+  //       duration:'2000'
+  //     });
+  //     if(typeof(success)==="function"){
+  //       success(res);
+  //     }
+  //   }
+  // },'POST');
+}
+var subloginup=function(_this,params,success){//注册
+  ajax(_this,_this.extendApi.userLoginUp,params,function(data){
+    if(typeof(success)==="function"){
+      success(data);
+    }
+    if(data.code == 200){
+      
+    }
+  },'POST')
+}
+
+var getUserData=function(that,success,param){
+  ajax(that,that.extendApi.getUserInfo,param,(data)=>{
+    if(typeof(success)==="function"){
+      success(data);
+    }
+    if(data.code==200){
+      
+    }
+    else if(data.code==-2){
+      delatecookie();
+      that.$router.push({path:'/index'});
+      that.$notify({
+        title: '提示',
+        message: "请重新登录",
+        type: 'warning',
+        duration: '1000'
+      });          
+    }
+  },"GET");
+};
+var goregister = function(_this, pageindex) { //注册接口
+  // var _this=this;
+  ajax(_this, _this.extendApi.userLoginUp, _this.regester, function(res) {
+    if (res.code == 200) {
+      _this.$notify({
+        title: '提示',
+        message: '注册成功',
+        type: 'success'
+      });
+      _this.login.email = _this.regester.email;
+      console.log();
+      _this.login.password = _this.regester.password;
+      sublogion(_this, pageindex);
+    } else {
+      _this.$notify({
+        title: '提示',
+        message: res.message,
+        type: 'warning'
+      });
+    }
+  })
+};
+
+  //价格框输入保留位数
+var formatcoinPrice = function(type, price) {
+  price = price.toString();
+  if (type == "ETH" || type == "ETC" || type == "ZEC" || type == "LTC" || type == "BTC" || type == "BCC") {
+    return (price.match(/\d+(\.\d{0,4})?/) || [''])[0];
+  }
+  // if(type=="BTC"){
+  //   return (price.match(/\d+$/) || [''])[0];
+  // }
+  // if(type=="BTS" || type=="NYCC"){
+  //   return (price.match(/\d+(\.\d{0,3})?/) || [''])[0];
+  // }
+  // if(type=="SC" || type=="WTC"){
+  //    return (price.match(/\d+(\.\d{0,4})?/) || [''])[0];
+  // }
+};
+
+  //格式化数量框
+var formatcoinNum = function(type) {
+  let coinlist = {
+    "BTC": '3',
+    "BCC": '3',
+    "ETH": '3',
+    "ETC": '3',
+    "ZEC": '3',
+    "LTC": '3'
+  }
+  if (coinlist[type] == undefined) {
+    console.log("缺少币种配对配置");
+    return false;
+  } else {
+    return coinlist[type];
+  }
+};
+
+  //格式化价格框保留位数
+var formatcoinprice = function(type) {
+  let coinlist = {
+    "BTC": '4',
+    "BCC": '4',
+    "ETH": '4',
+    "ETC": '4',
+    "ZEC": '4',
+    "LTC": '4'
+  }
+  if (coinlist[type] == undefined) {
+    console.log("缺少币种配对配置");
+    return false;
+  } else {
+    return coinlist[type];
+  }
+};
+
+var cannel = function(_this, id) {
+  _this.cancelparm.orderid = id;
+  _this.cancelparm.currency = sessionStorage.getItem('symbol');
+  ajax(_this, _this.extendApi.Cancel, _this.cancelparm, function(response) {
+    if (response.code == 200) {
+      setTimeout(function() {
+        _this.gethistorylist();
+        getusermoney(_this);
+      }, 1000)
+      _this.$notify({
+        title: '成功',
+        message: '撤单成功',
+        type: 'success',
+        duration: '1000',
+      });
+    } else {
+      _this.$notify({
+        title: '失败',
+        message: '撤单失败',
+        type: 'error',
+        duration: '1000',
+      });
+    }
+  })
+};
+
+var numjs = function(type) {
+  let coinlist = {
+    "BTC": 1000,
+    "BCC": 1000,
+    "ETH": 1000,
+    "ETC": 1000,
+    "ZEC": 1000,
+    "LTC": 1000
+  }
+  if (coinlist[type] == undefined) {
+    console.log("缺少币种配对配置");
+    return false;
+  } else {
+    return coinlist[type];
+  }
+};
+
+  //最小交易量
+var getmincoinNum = function(type, num) {
+  num = num.toString();
+  return (num.match(/\d+(\.\d{0,3})?/) || [''])[0];
+  // if(type=="ETH" || type=="ETC" ||type=="BTS"){
+  //   return (num.match(/\d+(\.\d{0,2})?/) || [''])[0];
+  // }
+  // if(type=="BTC"||type=="BCC"){
+  //   return (num.match(/\d+(\.\d{0,4})?/) || [''])[0];
+  // }
+  // if(type=="SC" || type=="NYCC" || type=="WTC"){
+  //   return num.replace(/[^\d]/g,'');
+  // }
+  // if(type=="ZEC"||type=="LTC"){
+  //   return (num.match(/\d+(\.\d{0,3})?/) || [''])[0];
+  // }
+};
+
+  //累加价格
+var addformatcoinprice = function(type) {
+  let coinlist = {
+    "BTC": '10',
+    "BCC": '1',
+    "ETH": '1',
+    "ETC": '1',
+    "SC": '0.0005',
+    "WTC": '0.0005',
+    "NYCC": '0.005',
+    "ZEC": '1',
+    "BTS": '0.1',
+    "LTC": '1'
+  }
+  if (coinlist[type] == undefined) {
+    console.log("缺少币种配对配置");
+    return false;
+  } else {
+    return coinlist[type];
+  }
+};
+
+var initCoinNum = function(type) {
+  let coinlist = {
+    "BTC": '0.0001',
+    "BCC": '0.0001',
+    "ETH": '0.0001',
+    "ETC": '0.0001',
+    "ZEC": '0.0001',
+    "LTC": '0.0001'
+  }
+  if (coinlist[type] == undefined) {
+    console.log("缺少币种配对配置");
+    return false;
+  } else {
+    return coinlist[type];
+  }
+};
+
+var getticket = function(_this, cointype, tradepage) {
+  cointype = cointype + 'BTC';
+  _this.ticket.symbol = cointype;
+  getticketcom(_this, _this.ticket, function(reponse) {
+    if (reponse.code == 200 && (_this.symbol + "BTC") == reponse.data.symbol) {
+      _this.tradeloading = false;
+      _this.newtrade = reponse.data.trade;
+      if (reponse.data.trade.length > 0) {
+        _this.newprice = reponse.data.trade[0].price.toFixed(formatcoinprice(sessionStorage.symbol));
+        _this.newtradenum = reponse.data.trade[0].am.toFixed(formatcoinNum(sessionStorage.symbol));
+        _this.isbuy = reponse.data.trade[0].type;
+      } else {
+        _this.newprice = 0;
+        _this.newtradenum = 0;
+      }
+      if (tradepage == 'fasttrade') {
+        reponse.data.marketdata.sell = reponse.data.marketdata.sell.reverse();
+      }
+      if (reponse.data.marketdata.buy.length > 0) {
+        _this.mountedBuyone = reponse.data.marketdata.buy[0].price;
+      } else {
+        _this.mountedBuyone = 0.00;
+      }
+      if (reponse.data.marketdata.sell.length > 0) {
+        if (tradepage == 'fasttrade') {
+          _this.mountedSellone = reponse.data.marketdata.sell[reponse.data.marketdata.sell.length - 1].price;
+        } else {
+          _this.mountedSellone = reponse.data.marketdata.sell[0].price;
+        }
+
+      } else {
+        _this.mountedSellone = 0.00;
+      }
+      _this.sellticket = reponse.data.marketdata.sell;
+      _this.buyticket = reponse.data.marketdata.buy;
+      for (let i = 0; i < _this.sellticket.length; i++) {
+        _this.sellticket[i].sellwtd = '';
+        _this.sellticket[i].buywtd = '';
+        var lprice = 0;
+
+        //根据后台给的小数点位数来控制比较好
+        lprice = _this.sellticket[i].price.toFixed(formatcoinpriceHQ(sessionStorage.symbol))
+
+        if (_this.amstat[lprice]) {
+          if (_this.amstat[lprice].buy != null) {
+            _this.sellticket[i].buywtd = _this.amstat[lprice]['buy'];
+          } else {
+            _this.sellticket[i].sellwtd = _this.amstat[lprice]['sell'];
+          }
+        }
+      }
+      for (let i = 0; i < _this.buyticket.length; i++) {
+        _this.buyticket[i].buywtd = '';
+        var lprice = 0;
+        lprice = _this.buyticket[i].price.toFixed(formatcoinpriceHQ(sessionStorage.symbol))
+        if (_this.amstat[lprice]) {
+          if (_this.amstat[lprice].buy != null) {
+            _this.buyticket[i].buywtd = _this.amstat[lprice]['buy'];
+          } else {
+            _this.buyticket[i].sellwtd = _this.amstat[lprice]['sell'];
+          }
+        }
+      }
+      _this.sellticket.amst = amst;
+      _this.buyticket.amst = amst;
+    } else {
+      _this.$notify({
+        title: '提示',
+        message: response.error,
+        type: 'error'
+      });
+    }
+  }, 'GET')
+};
+
+  //获取资金数据
+var getusermoney = function(_this) {
+  // var _this=this;
+  ajax(_this, _this.extendApi.userAssetlist, '', function(reponse) {
+    if (reponse.code == 200) {
+      var data = reponse.data;
+      for (let index in _this.moneyinfo) {
+        _this.moneyinfo[index] = data.list[index];
+      }
+      _this.moneyinfo.valuation = data.valuation;
+      _this.myAssets.availablemoney = data.list.BTC.active;
+      if (_this.buyprice > 0) {
+        _this.MaxBuyNum = parseInt(_this.myAssets.availablemoney / _this.buyprice * numjs(_this.symbol)) / numjs(_this.symbol);
+      }
+      if (_this.buynumm == 0) {
+        _this.nextMoney = _this.myAssets.availablemoney;
+      }
+      _this.myAssets.frozenmoney = data.list.BTC.frozen;
+      let symbol = sessionStorage.getItem('symbol');
+      _this.myAssets.availablecoin = data.list[symbol].active;
+      if (_this.sellScroll == 0) {
+        _this.nextcoin = _this.myAssets.availablecoin
+      }
+      _this.myAssets.frozencoin = data.list[symbol].frozen;
+    }
+
+    if (reponse.code == -2) {
+      delatecookie();
+    }
+  }, 'GET');
+}
+
+var initINput = function(type) {
+  return 0.001;
+  // if(type=="BTC"||type=="BCC"){
+  //   return 0.01;
+  // }
+  // if(type=='ETH' ||type=='ETC' ||type=='ZEC' ||type=='LTC'){
+  //   return 1;
+  // }
+  // if(type=='SC' ||type=='BTS' ||type=='NYCC' || type=='WTC'){
+  //   return 100;
+  // }
+};
+
+  //获取行情数据
+var getticketcom = function(that, params, callback) {
+  that.axios({
+    method: 'get',
+    url: that.extendApi.usertradeList,
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded;',
+    },
+    params: params,
+  }).then((response) => {
+    var reponse = response.data;
+    callback(reponse);
+  }).catch(function(response) {
+    // console.log(response);
+  })
+};
+
+/*获取认证状态*/
+var getstate=function(that,success){
+  ajax(that,that.extendApi.getState,"",function(data){    
+    if(data.code==200){
+      that.userState=data.data.states;
+    }
+    else{
+      // that.$notify({
+      //   title: '提示',
+      //   message: data.message,
+      //   type: 'error'
+      // });
+    }
+    if(typeof(success)=="function"){
+      success(data);
+    }
+  },"GET");
+};
+
+var quit=function(that,type){
+  ajax(that,that.extendApi.loginout,"",(data)=>{
+    if(data.code==200||data.code==-2){
+      if(type!=1){
+        that.$notify({
+          title: '提示',
+          message: '退出成功',
+          type: 'success',
+          duration:'1500'
+        });
+      }    
+      delatecookie();
+      that.$router.push({path:"/index"});
+      that.showstate=0;
+      bus.$emit("goout");
+    }
+  },"GET");
+};
+
+export{
+  quit,
+  getstate,
+  temptime,
+  getDataYear,
+  ajax,
+  delatecookie,
+  savecookie,
+  sublogion,
+  subloginup,
+  getcookie,
+  setcookie,
+  sendEmail,
+  sendCode,
+  getUserData,
+  goregister,
+  formatcoinPrice,
+  formatcoinNum,
+  formatcoinprice,
+  cannel,
+  numjs,
+  getmincoinNum,
+  addformatcoinprice,
+  initCoinNum,
+  getticket,
+  getusermoney,
+  initINput,
+  getticketcom
+  // subRegist,
+  // base64Sort,
+}

src/assets/js/filters.js

@@ -0,0 +1,37 @@
+
+/*
+ * 时间格式化
+ */
+exports.filterTime = (timestamp,format) => {
+  let date = new Date(timestamp ? (parseInt(timestamp)/1000000) : new Date().getTime());
+  let FORMAT = new Object();
+  FORMAT = {
+    'Y': "date.getFullYear()",
+    'M': "date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1",
+    'D': "date.getDate() < 10 ? '0' + date.getDate() : date.getDate()",
+    'h': "date.getHours() < 10 ? '0' + date.getHours() : date.getHours()",
+    'm': "date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()",
+    's': "date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()"
+  }
+  for (let i in FORMAT) {
+    if (format.indexOf(i) != -1) {
+      format = format.replace(i, eval(FORMAT[i]));
+    }
+  }
+  return format;
+}
+exports.filterStr=(value,length)=>{
+  value=value.toFixed(length);
+  return value;
+}
+exports.filterNumHide=(val,state)=>{
+  if(val){
+    if(state=='email'){
+        val=val.split('@')[0].substr(0,1)+'**@'+val.split('@')[1];
+    }
+    else{
+        val=val.substr(0,3)+'****'+val.substr(-4);
+    }
+    return val; 
+  } 
+}

src/assets/js/proesscom.js

@@ -0,0 +1,151 @@
+import {formatcoinprice,addformatcoinprice,initCoinNum,formatcoinNum,getmincoinNum,addtradeNum,numjs} from './common'
+//拖动卖出滑块
+var sellscrolles=function(val,_this){
+  // var _this=this;
+  _this.sellScroll=val;
+  if(_this.sellscrollchange){
+    setTimeout(function(){
+      if(formatcoinNum(_this.symbol)==0){
+        _this.sellnum=_this.tradenum=parseInt(_this.myAssets.availablecoin*_this.sellScroll/100);
+      }
+      else{
+        _this.sellnum=_this.tradenum=parseFloat(_this.myAssets.availablecoin*_this.sellScroll/100).toFixed(formatcoinNum(_this.symbol));
+      }
+      _this.nextcoin=(_this.myAssets.availablecoin-_this.sellnum).toFixed(formatcoinNum(_this.symbol));
+      if(_this.sellprice){
+        _this.sellmoney=parseFloat(_this.sellprice*_this.sellnum).toFixed(2);
+      }
+    }, 50);
+  }
+};
+//拖动买入滑块
+var buyscrolles=function(val,_this){
+  _this.buynumm=val;
+  // console.log(_this.rate);
+  // console.log("_this.buynum:"+_this.buyprice)
+  if(_this.buyscrollchange){
+    setTimeout(function(){
+      _this.buymoney=parseFloat(_this.myAssets.availablemoney*(1+_this.rate)*_this.buynumm/100).toFixed(2);
+      if(_this.buymoney-_this.myAssets.availablemoney>=0){
+        _this.buymoney=_this.myAssets.availablemoney;
+      }
+      _this.nextMoney=parseFloat(_this.myAssets.availablemoney-_this.buymoney).toFixed(2);
+      if(_this.buyprice!=0){
+        if(formatcoinNum(_this.symbol)==0){
+          _this.buynum=_this.tradenum=parseInt(_this.buymoney/(1+_this.rate)/_this.buyprice);
+        }
+        else{
+          _this.buynum=_this.tradenum=parseInt(_this.buymoney/(1+_this.rate)/_this.buyprice*numjs(_this.symbol))/numjs(_this.symbol);
+        }
+      }
+    }, 50);
+  }
+}
+
+var buycTradeCom=function(_this){
+  if(_this.buynum>0){
+     _this.buynum=_this.buynum
+  }else if( _this.tradenum>0){
+    _this.buynum= _this.tradenum;
+  }else{
+    _this.buynum=initCoinNum(_this.symbol);
+  }
+  var allmoney=parseFloat(Number(_this.buynum)*Number(_this.buyprice)*(1+_this.rate)).toFixed(2);//加入手续费计算
+  if(allmoney-_this.myAssets.availablemoney>=0){
+    _this.buymoney=_this.myAssets.availablemoney;
+    if(formatcoinNum(_this.symbol)==0){
+      _this.buynum=parseInt((parseFloat(_this.buymoney)/(1+_this.rate)/parseFloat(_this.buyprice)));
+    }
+    else{
+      _this.buynum=parseInt((parseFloat(_this.buymoney)/(1+_this.rate)/parseFloat(_this.buyprice))*numjs(_this.symbol))/numjs(_this.symbol);
+    }
+  }else{
+    _this.buymoney=allmoney;
+    _this.buynum=parseInt((parseFloat(_this.buymoney)/(1+_this.rate)/parseFloat(_this.buyprice))*numjs(_this.symbol))/numjs(_this.symbol);
+    if(isNaN(_this.buynum)){
+      _this.buynum=0;
+    }
+  }
+  if(_this.myAssets.availablemoney>0){
+    _this.buynumm=Number(parseFloat((parseFloat(_this.buymoney)/parseFloat(_this.myAssets.availablemoney))*100).toFixed(2));
+  }
+}
+
+var sellTradeCom=function(_this){
+  _this.sellnum=_this.sellnum || _this.tradenum;
+  _this.sellmoney=parseFloat(_this.sellprice*_this.sellnum).toFixed(2);
+  if(_this.myAssets.availablecoin>0){
+    _this.sellScroll=Number(parseFloat(_this.sellnum/_this.myAssets.availablecoin*100).toFixed(2));
+  } 
+}
+//点击买入价格向上调
+var priceComUp=function(tradetype,_this){
+  if(tradetype=='buy'){
+      _this.buyprice=parseFloat(parseFloat(_this.buyprice)+Number(addformatcoinprice(_this.symbol))).toFixed(formatcoinprice(_this.symbol))
+    if(_this.buynum>0){
+      buycTradeCom(_this);
+    }
+  }else{
+      _this.sellprice=parseFloat(parseFloat(_this.sellprice)+Number(addformatcoinprice(_this.symbol))).toFixed(formatcoinprice(_this.symbol))
+    if(_this.sellnum>0){
+      sellTradeCom(_this);
+    }
+  }
+}
+//点击买入价格向下调
+var priceComDown=function(tradetype,_this){
+  if(tradetype=='buy'){
+    _this.buyscrollchange=false;
+    if(_this.buyprice-Number(addformatcoinprice(_this.symbol))>0){
+        _this.buyprice=parseFloat(parseFloat(_this.buyprice)-Number(addformatcoinprice(_this.symbol))).toFixed(formatcoinprice(_this.symbol))
+    }else {
+      _this.buyprice=Number(addformatcoinprice(_this.symbol));
+    }
+    buycTradeCom(_this);
+  }else{
+    _this.sellscrollchange=false;
+    if(_this.sellprice-Number(addformatcoinprice(_this.symbol))>0){
+        _this.sellprice=(parseFloat(_this.sellprice)-addformatcoinprice(_this.symbol)).toFixed(formatcoinprice(_this.symbol))
+    }else{
+      _this.sellprice=Number(addformatcoinprice(_this.symbol))
+    }
+    sellTradeCom(_this);
+  }
+}
+var inputTradeNumCom=function(num,type,_this){
+  if(type=="BUY"){
+    _this.buyscrollchange=false;
+    _this.buynum=getmincoinNum(_this.symbol,num)
+    _this.buymoney=parseFloat(_this.buyprice*_this.buynum*(1+_this.rate)).toFixed(2);//加入手续费rate手续费比例
+    if(_this.buymoney-_this.myAssets.availablemoney>0){
+      _this.buymoney=_this.myAssets.availablemoney;
+      if(formatcoinNum(_this.symbol)==0){
+        _this.buynum=parseInt(_this.buymoney/(1+_this.rate)/_this.buyprice);
+      }
+      else{
+        _this.buynum=parseInt(_this.buymoney/(1+_this.rate)/_this.buyprice*numjs(_this.symbol))/numjs(_this.symbol);
+      }
+    }
+    _this.nextMoney=parseFloat(_this.myAssets.availablemoney-_this.buymoney).toFixed(formatcoinprice(_this.symbol));
+    _this.buynumm=Number(parseFloat((_this.buymoney/_this.myAssets.availablemoney)*100).toFixed(2));
+  }else{//卖
+    _this.sellscrollchange=false;
+    _this.sellnum=getmincoinNum(_this.symbol,num);
+    if(_this.sellnum-_this.myAssets.availablecoin>0){
+      _this.sellnum=_this.myAssets.availablecoin;
+    }
+    _this.sellmoney=parseFloat(_this.sellprice*_this.sellnum).toFixed(2);
+    _this.nextcoin=_this.myAssets.availablecoin-_this.sellnum;
+    _this.nextcoin=getmincoinNum(_this.symbol,_this.nextcoin);
+    _this.sellScroll=Number(parseFloat(_this.sellnum/_this.myAssets.availablecoin*100).toFixed(2));
+  }
+}
+export{
+  sellscrolles,
+  buyscrolles,
+  buycTradeCom,
+  sellTradeCom,
+  priceComUp,
+  priceComDown,
+  inputTradeNumCom
+}

src/assets/js/scroll.js

@@ -0,0 +1,125 @@
+var scrollMoveObj = null, scrollPageY = 0, scrollY = 0;
+var scrollDivList = new Array();
+// obj需要添加滚动条的对象 w滚动条宽度 className滚动条样式名称
+// obj元素 必须指定高度，并设置overflow:hidden;
+// 如要兼容IE6 必须给obj元素 指定 overflow:hidden; 
+function jsScroll(obj, w, className)
+{
+  console.log(123456);
+  if(typeof(obj) == 'string')  {
+    obj = document.getElementById(obj);
+  }
+  //当内容未超出现在高度时，不添加滚动条  
+  if(!obj || obj.scrollHeight <= obj.clientHeight || obj.clientHeight == 0) {
+    return;
+  }
+  obj.scrollBarWidth = w||6;
+  obj.style.overflow = 'hidden';
+  obj.scrollBar = document.createElement('div');
+  document.body.appendChild(obj.scrollBar);
+  obj.scrollBarIndex = document.createElement('div');
+  obj.scrollBar.appendChild(obj.scrollBarIndex);
+  obj.scrollBar.style.position = 'absolute';
+  obj.scrollBarIndex.style.position = 'absolute';
+  obj.scrollBar.className = className || '';
+  if(!className) {
+    obj.scrollBar.style.backgroundColor = '#ddd';
+    obj.scrollBarIndex.style.backgroundColor = '#aaa';
+  }
+  scrollDivList.push(obj);
+  scrollResetSize(obj);
+  //使用鼠标滚轮滚动
+  obj.scrollBar.scrollDiv = obj;
+  obj.scrollBarIndex.scrollDiv = obj;
+  obj.onmousewheel = scrollMove;
+  obj.scrollBar.onmousewheel = scrollMove;
+  obj.scrollBarIndex.onmousewheel = scrollMove;
+  //拖动滚动条滚动
+  obj.scrollBarIndex.onmousedown = function(evt){
+    evt = evt || event;
+    scrollPageY = evt.clientY;
+    scrollY = this.scrollDiv.scrollTop;
+    isScrollMove = true;
+    document.body.onselectstart = function(){return false};
+    scrollMoveObj = this.scrollDiv;
+    if(this.scrollDiv.scrollBar.className == '') {
+      this.scrollDiv.scrollBarIndex.style.backgroundColor = '#888';
+    }
+    return false;
+  }
+}
+//当页面大小发生变化时，重新计算滚动条位置
+window.onresize = function(){
+  for(var i=0; i<scrollDivList.length; i++) {
+    scrollResetSize(scrollDivList[i]);
+  }
+}
+//计算滚动条位置
+function scrollResetSize(o) {
+  if(o.scrollHeight <= o.clientHeight) {
+    o.scrollTop = 0;
+    o.scrollBar.style.display = 'none';
+  } else {
+    o.scrollBar.style.display = 'block';
+  }
+  var x=0, y=0;
+  var p = o;
+  while(p) {
+    x += p.offsetLeft;
+    y += p.offsetTop;
+    p = p.offsetParent;
+  }
+  var borderTop = parseInt(o.style.borderTopWidth||0);
+  var borderBottom = parseInt(o.style.borderBottomWidth||0);
+  o.scrollBar.style.width = o.scrollBarWidth + 'px';
+  o.scrollBar.style.height = o.clientHeight + 'px';
+  o.scrollBar.style.top = y + borderTop + 'px';
+  o.scrollBar.style.left = x + o.offsetWidth - o.scrollBarWidth + 'px';
+  o.scrollBarIndex.style.width = o.scrollBarWidth + 'px';
+  var h = o.clientHeight - (o.scrollHeight - o.clientHeight);
+  //当滚动条滑块最小20个像素
+  if(h < 20) {
+    h = 20;
+  }
+  o.scrollBarHeight = h;
+  o.scrollBarIndex.style.height = h + 'px';
+  o.scrollBarIndex.style.left = '0px';
+  setScrollPosition(o);
+}
+function setScrollPosition(o) {
+  o.scrollBarIndex.style.top = (o.clientHeight - o.scrollBarHeight) * o.scrollTop / (o.scrollHeight - o.clientHeight) + 'px';
+}
+document.documentElement.onmousemove = function(evt){
+  if(!scrollMoveObj)return;
+  evt = evt || event;
+  var per = (scrollMoveObj.scrollHeight - scrollMoveObj.clientHeight) / (scrollMoveObj.clientHeight - scrollMoveObj.scrollBarHeight)
+  scrollMoveObj.scrollTop = scrollY - (scrollPageY - evt.clientY) * per;
+  setScrollPosition(scrollMoveObj);
+}
+document.documentElement.onmouseup = function(evt){
+  if(!scrollMoveObj)return;
+  if(scrollMoveObj.scrollBar.className == '') {
+    scrollMoveObj.scrollBarIndex.style.backgroundColor = '#aaa';
+  }
+  scrollMoveObj = null;
+  document.body.onselectstart = function(){return true};
+}
+// 鼠标滚轮滚动
+function scrollMove(evt){
+  var div = this.scrollDiv || this;
+  if(div.scrollHeight <= div.clientHeight) return true;
+  evt = evt || event;
+  var step = 20;
+  if(evt.wheelDelta < 0) {
+    if(div.scrollTop >= (div.scrollHeight - div.clientHeight)) return true;
+    div.scrollTop += step;
+  } else {
+    if(div.scrollTop == 0) return true;
+    div.scrollTop -= step;
+  }
+  setScrollPosition(div);
+  return false;
+}
+export{
+  jsScroll,
+}

src/components/Hello.vue

@@ -0,0 +1,54 @@
+<template>
+  <div class="hello">
+    <h1>{{ msg }}</h1>
+    <h2>Essential Links</h2>
+    <ul>
+      <li><a href="https://vuejs.org" target="_blank">Core Docs</a></li>
+      <li><a href="https://forum.vuejs.org" target="_blank">Forum</a></li>
+      <li><a href="https://gitter.im/vuejs/vue" target="_blank">Gitter Chat</a></li>
+      <li><a href="https://twitter.com/vuejs" target="_blank">Twitter</a></li>
+      <br>
+      <li><a href="http://vuejs-templates.github.io/webpack/" target="_blank">Docs for This Template</a></li>
+    </ul>
+    <h2>Ecosystem</h2>
+    <ul>
+      <li><a href="http://router.vuejs.org/" target="_blank">vue-router</a></li>
+      <li><a href="http://vuex.vuejs.org/" target="_blank">vuex</a></li>
+      <li><a href="http://vue-loader.vuejs.org/" target="_blank">vue-loader</a></li>
+      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank">awesome-vue</a></li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'hello',
+  data () {
+    return {
+      msg: 'Welcome to Your Vue.js App'
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+h1, h2 {
+  font-weight: normal;
+}
+
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+
+a {
+  color: #42b983;
+}
+</style>
+

src/components/contact.vue

@@ -0,0 +1,128 @@
+<template>
+  <div class="contact-block">
+    <ul class="contact-list">
+      <li v-for="(item,index) in contactList" @mouseenter="item.state=true" @mouseleave="item.state=false">
+        <i class="iconfont" :class="item.icon"></i>
+        <span>{{item.name}}</span>
+        <div class="open-box" v-show="item.state&&index!=0">
+          <em class="iconfont" :class="item.icon"></em>
+          <div class="msg-box" v-html="item.text" :class="{twoLine:item.icon=='icon-QQqun'}"></div>
+        </div>
+      </li>
+      <!-- <li>
+        <i class="iconfont icon-kefu"></i>
+        <span>在线客服</span>
+        <div class="open-box">的开始大客户大厦电话撒娇hd</div>
+      </li>
+      <li>
+        <i class="iconfont icon-phone"></i>
+        <span>热线电话</span>
+      </li>
+      <li>
+        <i class="iconfont icon-QQqun"></i>
+        <span>官方QQ群</span>
+      </li>
+      <li>
+        <i class="iconfont icon-weixin"></i>
+        <span>微信咨询</span>       
+      </li> -->
+    </ul>
+  </div>
+</template>
+
+<script> 
+export default{
+  data(){
+    return{
+      contactList:[
+        {
+          icon:"icon-kefu",
+          name:"在线客服",
+          text:"",
+          state:false,
+        },
+        {
+          icon:"icon-phone",
+          name:"热线电话",
+          text:"400-1566-899",
+          state:false,
+        },
+        {
+          icon:"icon-QQqun",
+          name:"官方QQ群",
+          text:"①&nbsp;345106800<br/>②&nbsp;545967811",
+          state:false,
+        },
+        {
+          icon:"icon-weixin",
+          name:"微信咨询",
+          text:"yfx0323",
+          state:false,
+        },
+      ],
+    }
+  }
+}
+</script>
+<style>
+.contact-block{
+  position:fixed;
+  top:50%;
+  right: 20px;
+  transform: translateY(-50%);
+  z-index:102;
+  .contact-list{
+    li{
+      width: 60px;
+      height: 60px;
+      background-color: #1a6fa6;
+      color: #fff;
+      font-size: 12px;
+      margin-bottom: 1px;
+      position: relative;
+      span{
+        display: block;
+      }
+      i{
+        display: inline-block;
+        padding-top: 9px;
+        font-size: 26px;
+      }
+      .open-box{
+        width: 160px;
+        background-color: #1792e2;
+        position: absolute;
+        right: 0;
+        top: 0;
+        height: 60px;
+        em{
+          font-size: 26px;
+          float: left;
+          line-height: 60px;
+          height: 60px;
+          padding:0 10px;
+        }
+        .msg-box{
+          text-align: left;
+          font-size: 16px;
+          line-height: 60px;
+        }
+        .twoLine{
+          padding-top: 6px;
+          line-height: 1.5;
+          span{
+            display: inline-block;
+            width: 14px;
+            height: 14px;
+            text-align: center;
+            line-height: 14px;
+            border:1px solid #fff;
+            border-radius: 50%;
+            font-size: 12px;
+          }
+        }
+      }
+    }   
+  }
+}
+</style>

src/components/footer.vue

@@ -0,0 +1,116 @@
+<template>
+  <div class="bottom-foot">
+    <div class="foot-content">
+      <div class="foot-content-in">
+        <div class="foot-left">
+          <h3>联系我们</h3>
+          <div class="contact">
+            <ul class="line">
+              <li>
+                <span><i class="iconfont icon-kefuQQ"></i>客服QQ:</span>
+                <span>4001566899</span>
+              </li>
+              <li>
+                <span><i class="iconfont icon-hotphone"></i>热线电话:</span>
+                <span>400-1566-899</span>
+              </li>
+            </ul>
+            <ul class="line">
+              <li>
+                <span><i class="iconfont icon-weixin1"></i>微信咨询:</span>
+                <span>公众号在线客服</span>
+              </li>
+              <li>
+                <span><i class="iconfont icon-tubiao01"></i>客服邮箱:</span>
+                <span>support@licai.cn</span>
+              </li>
+            </ul>
+          </div>
+          <p>©2017杭州本链科技有限公司 All Rights Reserved <span>浙ICP备07503793</span><span>市场有风险&nbsp;投资需谨慎</span></p>
+        </div>
+        <div class="foot-right">
+          <h3>手机应用</h3>
+          <div> 
+            <div class="rightan">
+              <img src="../assets/img/andriod.png" height="110" width="109" alt="">
+              <p>安卓APP下载</p>
+            </div>
+            <div class="rightios">
+              <img src="../assets/img/ios.png" height="107" width="107" alt="">
+              <p>IOSAPP下载</p>
+            </div> 
+          </div>
+        </div>  
+      </div>
+        
+    </div>
+        
+  </div>
+</template>
+
+<style>
+.bottom-foot{
+  height: 300px;
+  background-color: #073571;
+  color: #fff;
+  .foot-content{
+    text-align: left;
+    width: 1200px;
+    margin: 0 auto;
+    &-in{
+      width: 1200px;
+      margin: 0 auto;
+      padding-top: 46px;
+      display: flex;
+      justify-content: space-between;
+      h3{
+        font-size: 18px;
+        font-weight: bold;
+        line-height: 1;
+        margin-bottom: 35px;
+      }
+      .foot-right{
+        .rightios{
+          float: right;
+          margin: 2px 20px 0 0;
+          p{
+            text-align: center;
+          }
+        }
+        .rightan{
+          float: right;
+          p{
+            text-align: center;
+          }
+        }
+      }
+      .foot-left{
+        p{
+          font-size: 14px;
+          margin-top: 30px;
+          span{
+            margin-left: 40px;
+          }
+        }
+      }
+      .contact{
+        .line:first-child{
+          margin-bottom: 20px;
+        }
+        .line{
+          display: flex;
+          font-size: 14px;
+          li{
+            width: 244px;
+          }
+          i{
+            font-style: normal;
+            margin-right: 10px;
+            font-size: 18px;
+          }
+        }      
+      }
+    }
+  }
+}
+</style>

src/components/header.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="top-header-box" :class="{init:isIndex===true&&scrollState===false}">
+    <div class="top-header">
+      <div class="logo">
+        <img v-show="isIndex===true&&scrollState===false" src="../assets/img/mainLogo.png" alt="">
+        <img v-show="!(isIndex===true&&scrollState===false)" src="../assets/img/logo2.png" alt="">
+      </div>
+      <ul class="nav-line">
+        <li v-for="item in navlist" @click="golink(item.link)" :class="{active:item.link==currentPath}">
+          <span>{{item.name}}</span>
+          <i class="badge" v-if="item.badge==true">HOT</i>
+        </li>
+      </ul>
+      <div class="userMsg" v-show="showstate===1">
+        <div class="item" @click="golink('/usercenter')">
+          <i class="iconfont icon-user"></i>
+          <span >{{username}}</span>
+        </div>
+        <div class="item" @click="quit">
+          <i class="iconfont icon-tuichu"></i>
+          <span>退出</span>
+        </div>
+      </div>
+      <div class="userMsg" v-show="showstate===0&&isIndex===false">
+        <div class="item">
+          <span @click="golink('/index')">登录</span>
+        </div>
+        <div class="item">
+          <span @click="golink('/index')">注册</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  
+</template>
+
+<script>
+import {ajax,getUserData,delatecookie,getcookie} from "../assets/js/common.js"
+import bus from "../assets/js/bus.js"
+export default{
+  data(){
+    return{
+      navlist:[
+        {
+          name:"首页",
+          link:"/index",
+        },
+        {
+          name:"申请代理",
+          link:"/apply",
+          badge:true,
+        },
+      ],
+      isIndex:false,
+      scrollState:false,
+      currentPath:"",
+      showstate:0,
+      username:"",
+    }
+  },
+  mounted(){
+    this.$nextTick(()=>{
+      javascript:scrollTo(0,0);
+      if(this.$route.path=="/index"){
+        this.isIndex=true;
+      }
+      let mainword=this.$route.path.split("/")[1];
+      this.currentPath="/"+mainword;
+      window.addEventListener("scroll",this.menuchange);      
+      let token=getcookie("token");
+      if(token){
+        this.showstate=1;
+      }
+      else{
+        this.showstate=0;
+      }
+      bus.$on("login",()=>{
+        this.showstate=1;
+        this.username=getcookie("username");    
+      });
+      this.username=getcookie("username");      
+    })
+  },
+  methods:{
+    menuchange(){
+      if(document.documentElement.scrollTop>0){
+        this.scrollState=true;
+      }
+      else{
+        this.scrollState=false;
+      }
+    },
+    quit(){
+      ajax(this,this.extendApi.loginout,"",(data)=>{
+        if(data.code==200||data.code==-2){
+          this.$notify({
+            title: '提示',
+            message: '退出成功',
+            type: 'success',
+            duration:'1500'
+          });
+          delatecookie();
+          this.$router.push({path:"/index"});
+          this.showstate=0;
+          bus.$emit("goout");
+        }
+      },"GET");
+    },
+    golink(val){
+      let token=getcookie('token');
+      if(token){
+        this.$router.push({path:val});
+      }
+      else{
+        if(val=='/apply'||val=='/myassets'){
+          this.$notify({
+            title: '提示',
+            message: '请先登录',
+            type: 'warning',
+            duration: '2000'
+          });
+        }
+        else{
+          this.$router.push({path:val});
+        }
+      }     
+    },
+  }
+}
+</script>
+
+<style scoped>
+.top-header-box{
+  background-color:#fff;
+  overflow: hidden;
+  position: fixed;
+  z-index: 100;
+  width: 100%;
+  &.init{
+    background-color:rgba(0,0,0,0.2);
+    .nav-line{
+      li{
+        color: #fff;        
+      }
+      .active{
+        color:#1a6fa6;
+        background-color: #fff;
+      }
+    }
+    .userMsg{
+      color: #fff;
+      .iconfont{
+        color: #fff !important;
+      }
+    }
+  }
+}
+.top-header{
+  text-align: left;
+  width: 1200px;
+  margin: 0 auto;
+  .logo{
+    float: left;
+    width: 98px;
+    line-height: 75px;
+    height: 75px;
+    display: flex;
+    align-items: center;
+    margin-right: 55px;
+    img{
+      width: 100%;
+    }
+
+  }
+  .nav-line{
+    /*overflow: hidden;
+    position: relative;*/
+    li{
+      float: left;
+      position: relative;
+      line-height: 75px;
+      font-size: 14px;
+      width: 118px;
+      text-align: center;
+      cursor: pointer;
+      color: #333;
+    }
+    .active{
+      color:#fff;
+      background-color: #1a6fa6;
+    }
+    .badge{
+      position: absolute;
+      background-color: #ff4e00;
+      color: #fff;
+      display: block;
+      width: 38px;
+      height: 18px;
+      line-height: 18px;
+      font-size: 12px;
+      border-radius: 2px;
+      top: 8px;
+      right: 0;
+    }
+    .badge:after{
+      content:"";
+      width: 0;
+      height: 0;
+      position: absolute;
+      z-index:-1;      
+      bottom: 0;
+      left: 30%;
+      border-left:5px solid transparent;
+      border-right:5px solid transparent;
+      border-top:14px solid #ff4e00;   
+      margin-bottom: -8px;
+      transform:rotate(30deg);
+    }
+  }
+  .userMsg{
+    float: right;
+    line-height: 72px;
+    color: #333;
+    .item{
+      float: left;
+      font-size: 14px;
+      cursor: pointer;
+    }
+    .item+.item{
+      margin-left: 30px;
+    }
+    .iconfont{
+      font-size: 20px;
+      color: #999;
+    }
+  }
+}
+</style>

src/components/location.vue

@@ -0,0 +1,56 @@
+<template>
+  <div class="location-block">
+    <div class="img-box">
+      <img src="../assets/img/location.png" alt="">
+    </div>
+    <div class="word">
+      <i>当前位置：</i>
+      <span v-for="(item,index) in dataArr">
+        <router-link :to="item.link">{{item.name}}</router-link> 
+        <em v-show="index!==arrLength-1">&gt;&gt;</em>
+      </span>
+    </div>  
+  </div>
+</template>
+
+<script>
+export default{
+  data(){
+    return{
+      dataArr:[],
+      arrLength:0,
+    }
+  },
+  props:["dataList"],
+  mounted(){
+    this.dataArr=this.dataList;
+    this.arrLength=this.dataArr.length;
+  },
+}
+</script>
+
+<style>
+.location-block{
+  background-image:linear-gradient(0deg,
+    rgba(244, 243, 243, 1) 0%, 
+    rgba(250, 249, 249, 1) 8%, 
+    rgba(255, 255, 255, 1) 100%);
+  width: 1200px;
+  margin: 0 auto;
+  height: 60px;
+  display: flex;
+  align-items: center;
+  text-align: left;
+  padding-left: 10px;
+  font-size: 14px;
+  .img-box{
+    margin-right: 10px;
+  }
+  i{
+    font-style: normal;
+  }
+  span:last-child a{
+    color: #1a6fa6;
+  }
+}
+</style>

src/components/scrollcom.vue

@@ -0,0 +1,72 @@
+<template>
+  <div class="proess" @click="iscanchange()">
+    <div class="range" :class="bgclass" id="sellSlider"><!-- 买单滑动杆 -->
+
+      <span class="sellPercent colormoney" v-if="showcionType=='WTC'">剩余{{nextnum}} WDT</span>
+      <span class="sellPercent colormoney" v-if="showcionType=='NYCC'">剩余{{nextnum}} YCC</span>
+      <span class="sellPercent colormoney" v-if="showcionType!='NYCC' && showcionType!='WTC'">剩余{{nextnum}} {{showcionType}}</span>
+      <el-slider v-model="proessNumber" :step="1" @change="scroll"></el-slider>
+      <div class="comcrice onec stop" @click="changeproess(0)" :class="{'criceactive':proessNumber>0}"></div>
+      <div class="comcrice twoc stop" @click="changeproess(25)" :class="{'criceactive':proessNumber>25 || proessNumber==25}"></div>
+      <div class="comcrice threec stop" @click="changeproess(50)" :class="{'criceactive':proessNumber>50 || proessNumber==50}"></div>
+      <div class="comcrice fourc stop" @click="changeproess(75)" :class="{'criceactive':proessNumber>75 || proessNumber==75}"></div>
+      <div class="comcrice fivec stop" @click="changeproess(100)" :style="[{'left':lastleng+'px'}]" :class="{'criceactive':proessNumber>100 || proessNumber==100}"></div>
+    </div>
+    <div class="row-control fn-clear numtop">
+      <span id="bty-cost">{{coastnum}} BTC</span>
+      <span id="bty-remain" style="float:right;">{{proessNumber}}%</span>
+    </div>
+  </div>
+</template>
+<script>
+  export default{
+    //proessnum滑动条滑动的长度，coastnum消耗的数量，nextnum剩余的数量,showcionType显示的币种类型,bgclass用于控制滚动条的背景色
+    props:['proessnum','coastnum','nextnum','showcionType','proessbg','bgclass','lastleng'],
+    data(){
+      return{
+        proessNumber:0,
+        usemon:0,
+      }
+    },
+    watch:{
+      // coastnum:function(val){
+
+      //   this.usemon=parseFloat(val).tofixed(2);
+      // },
+      proessnum:function(val){
+        if(isNaN(val)){
+          this.proessNumber=0;
+        }else{
+          this.proessNumber=val;
+        }
+      },
+    },
+    mounted(){
+      this.proessNumber=this.proessnum; 
+    },
+    
+    methods:{
+      iscanchange(){
+        this.$emit('proessClick');
+      },
+      scroll(){
+        console.log(this.proessNumber);
+        this.$emit('change',this.proessNumber);
+      },
+      changeproess(val){
+        this.proessNumber=val;
+      },
+      clickscroll(val){
+        console.log(22222);
+        console.log(val);
+      },
+    },
+  }
+</script>
+<style scoped>
+  .sellPercent{
+    display: inline-block;
+    width: 100%;
+    text-align: right;
+  }
+</style>

src/components/title.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="title-block">
+    <div class="line-box">
+      <hr/>
+      <span></span>
+    </div>
+    <h3>我的代理</h3><div class="line-box line-box2">
+      <span></span>     
+      <hr/>         
+    </div>
+  </div>
+</template>
+
+<style>
+.title-block{
+  background-color: rgba(31, 118, 175, 0.3);
+  width: 530px;
+  margin: 35px auto;
+  height: 70px;
+  line-height: 70px;
+  h3{
+    font-size: 37px;
+    color: #fff;
+    font-weight: bold;
+    display: inline-block;
+  }
+  .line-box{
+    float: left;
+    line-height: 70px;
+    hr{
+      width: 176px;
+      height: 1px;
+      border: 0;
+      margin-top: 35px;
+      background-color: #5ea9c2;
+      float: left;     
+    }
+    span{
+      display: inline-block;
+      width: 6px;
+      height: 6px;
+      border-radius: 50%;
+      background-color: #5ea9c2;
+    }
+  }
+  .line-box2{
+    float: right;
+    hr{
+      float: right;
+    }
+  }
+}
+</style>

src/config/api-config.js

@@ -0,0 +1,94 @@
+/*
+ * 端口域名配置
+ * @type Object
+ */
+var apiUrl = {
+    basehostUrl: 'https://dev407.33.cn',
+    // basehostUrl: 'https://kdata.fxee.com',
+    uploadUrl:"https://oss.33.cn",
+}
+export default {
+
+   userLogin:apiUrl.basehostUrl+'/api/member/login',//用户登录
+
+   // getToken:apiUrl.basehostUrl+'/api/member/login',//用户登录
+
+   userLoginUp:apiUrl.basehostUrl+'/api/member/reg',//用户注册
+
+   // userReg:apiUrl.basehostUrl+'/api/member/reg',//用户注册
+
+   // getMoneyInfo:apiUrl.basehostUrl + '/api/Account/Asset',//获取资产信息
+
+   userAssetlist:apiUrl.basehostUrl+'/api/Account/Asset',//用户资产列表
+
+   userAssethist:apiUrl.basehostUrl+'/api/Pay/CoinRecord',//我的资产历史记录
+
+   usertradeList:apiUrl.basehostUrl+'/api/data/market',////获取行情
+
+   // tradecoin:apiUrl.basehostUrl+'/api/trade/place',//买卖币
+
+   // tradeOrder:apiUrl.basehostUrl+'/api/trade/OrderList',//交易明细
+   
+   // indexticker:apiUrl.basehostUrl+'/api/data/Ticker',//首页ticker数据
+
+   getcoindata:apiUrl.basehostUrl+'/api/data/Ticker',//首页ticker数据
+
+   // getBtcMarketData:apiUrl.basehostUrl+"/api/data/market",//获取行情
+
+   sendEmail: apiUrl.basehostUrl + '/api/send/mail', //发送邮件通知
+
+   getUserInfo: apiUrl.basehostUrl + "/api/member/info",//获取用户信息
+
+   loginout: apiUrl.basehostUrl + '/api/member/loginout',//账户退出
+
+   Cancel: apiUrl.basehostUrl+'/api/trade/cancel',//撤单接口
+
+   hisorder: apiUrl.basehostUrl + "/api/trade/OrderList",//交易历史
+
+   place: apiUrl.basehostUrl+'/api/trade/place',//交易接口
+
+   changePassword: apiUrl.basehostUrl+'/api/member/editpassword',//修改密码
+
+   loginrecord: apiUrl.basehostUrl+'/api/account/loginrecord',//登陆日志
+
+   chargecoin: apiUrl.basehostUrl+'/api/account/myaddress',//充币
+
+   adressList: apiUrl.basehostUrl+'/api/account/addresslist',//地址列表
+
+   mancoinmon: apiUrl.basehostUrl+'/api/data/fees',//提币手续费
+
+   phoneCountry: apiUrl.basehostUrl+'/api/data/country',//国家信息
+
+   phoneCheckedNum: apiUrl.basehostUrl+'/api/send/sms',//手机验证码
+
+   phoneCommit:apiUrl.basehostUrl+'/api/certification/mobile',//手机验证提交
+
+   getState:apiUrl.basehostUrl+'/api/certification/states',//验证状态
+
+   // emailSend:apiUrl.basehostUrl+'/api/send/mail',//发送邮件
+
+   emailCommit:apiUrl.basehostUrl+'/api/certification/email',//邮件验证
+
+   uploadImg:apiUrl.uploadUrl+'/upload/certificate',//上传图片
+
+   getImgToken:apiUrl.basehostUrl + "/api/certification/UploadToken",//获取图片上传token
+
+   cardType:apiUrl.basehostUrl + '/api/data/cardtypes', //获取证件类型
+
+   ocr:apiUrl.basehostUrl + '/api/Certification/Ocr', //证件OCR
+
+   Certification: apiUrl.basehostUrl + '/api/certification/identity', //提交认证信息
+
+   resetPwd:apiUrl.basehostUrl + '/api/member/resetpassword', //重置密码
+
+   pwdSend:apiUrl.basehostUrl + '/api/send/reset', // 密码找回（邮件短信）发送
+
+   txFees:apiUrl.basehostUrl + '/api/data/txfees',//提币手续费
+
+   getFaceAmount:apiUrl.basehostUrl + '/api/data/faceamount',//获取人脸额度
+
+   getOutCin:apiUrl.basehostUrl + '/api/pay/Withdrawcoin',//提币接口
+
+   addAdress:apiUrl.basehostUrl + '/Applications/account/ManageAdress',//新增地址
+
+}

src/main.js

@@ -0,0 +1,33 @@
+import Vue from 'vue'
+import App from './App'
+import router from './router'
+import ElementUI from 'element-ui'
+import "./assets/css/base.css"
+import 'element-ui/lib/theme-default/index.css'
+import echarts from 'echarts'
+// import common from "./assets/js/common.js"
+import Apiconfig from "./config/api-config.js"
+import axios from "axios"
+import VueClipboard from "vue-clipboard2"
+
+import "./assets/css/base.css"
+// 注册全局过滤器
+import filters from './assets/js/filters.js';
+Object.keys(filters).forEach((k) => Vue.filter(k, filters[k]));
+
+Vue.use(ElementUI)
+Vue.use(VueClipboard)
+Vue.config.productionTip = false
+Vue.prototype.$echarts = echarts
+// Vue.prototype.common = common;
+Vue.prototype.extendApi = Apiconfig;
+Vue.prototype.axios = axios;
+
+let querystring=require("querystring");
+Vue.prototype.querystring = querystring;
+/* eslint-disable no-new */
+new Vue({
+  el: '#app',
+  router,
+  render: h => h(App)
+})

src/router/index.js

@@ -0,0 +1,38 @@
+import Vue from 'vue'
+import Router from 'vue-router'
+import Hello from '@/components/Hello'
+
+Vue.use(Router)
+
+export default new Router({
+  routes: [
+    {
+      path: '/',
+      redirect:"/index"
+    },
+    {
+      path:"/index",
+      component: function(resolve){
+        require(['../views/home/home.vue'],resolve);
+      }
+    },
+    {
+      path:"/setPwd",
+      component: function(resolve){
+        require(['../views/home/setPwdMail.vue'],resolve);
+      }
+    },
+    {
+      path:"/apply",
+      component: function(resolve){
+        require(['../views/agent/applyAgent.vue'],resolve);
+      }
+    },
+    {
+      path:"/myAgent",
+      component: function(resolve){
+        require(['../views/agent/myAgent.vue'],resolve);
+      }
+    },
+  ]
+})

src/views/agent/applyAgent.vue

@@ -0,0 +1,531 @@
+<template>
+  <div class="apply-block">
+    <indexHeader></indexHeader>
+    <div class="apply-content">
+      <div class="banner-box">
+        <img src="../../assets/img/apply/banner.png" alt="">
+      </div>
+      <div class="indextab">
+        <el-steps :active="2" :align-center="true">
+          <el-step title="填写申请信息"></el-step>
+          <el-step title="审核中"></el-step>
+          <el-step title="申请通过"></el-step>
+        </el-steps>
+      </div>
+      <div class="apply-form" v-if="show1">
+        <div class="tab-line">
+          <h2>经纪商申请</h2>
+        </div>
+        <div class="apply-form-box">
+          <div class="left-part part2">
+            <h4>经济商申请标准:</h4>
+            <h5>经纪商是需要具有一定资源并能独立运营的公司、机构或团体。</h5>
+            <p>1.经纪商所辖客户交易手续费的70%为返佣；</p>
+            <p>2.经纪商可自行设置客户的提款手续费标准；</p>
+            <p>3.经纪商可招募代理商，并在经纪商后台调整代理商返佣标准；</p>
+            <p>4.经纪商所辖客户有不当得利的行为（恶意刷单、利用BUG等），手续费不返还；</p>
+            <p>5.经纪商可在后台查看直发客户及代理客户的交易统计表；</p>
+          </div>
+          <div class="right-part" id="containDiv">
+            <el-form v-model="applyform" label-width="138px">
+              <el-form-item label="公司/机构名称:">
+                <el-input v-model="applyform.name" placeholder="请输入您所在的公司或者机构名称"></el-input>
+              </el-form-item>
+              <el-form-item label="姓名:">
+                <el-input v-model="applyform.name" placeholder="请输入您的姓名"></el-input>
+              </el-form-item>
+              <el-form-item label="手机号:">
+                <el-input v-model="applyform.name" placeholder="请输入您的手机号码"></el-input>
+              </el-form-item>
+              <el-form-item label="其他联系方式:" class="textareabox">
+                <textarea  cols="30" rows="2" v-model="applyform.desc" placeholder="请输入您的其他联系方式 如：微信、邮箱等"></textarea>
+              </el-form-item>
+              <el-form-item label="所在地:" class="location-box">
+                <el-select v-model="locationGroup.country" class="firstbox" clearable placeholder="所属国家">
+                  <el-option
+                    v-for="item in countryOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+                <el-select v-model="locationGroup.city" class="firstbox" clearable placeholder="所属城市">
+                  <el-option
+                    v-for="item in cityOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-button @click="applyNow">立即申请</el-button>  
+              </el-form-item>
+            </el-form>
+            <p class="tip">
+              *您好，我们尊重每一个客户的隐私。
+              一旦提交了以上内容则表明您同意FX66使用以上提供的信息与您联系，为您解答您所咨询的产品及服务。
+            </p>
+          </div>
+        </div>
+        <div class="server-block">
+          <div class="tt-line">
+            <hr>
+            <h3>联系我们 快速申请</h3>
+            <hr>
+          </div>         
+          <h4 class="sub-title">Contact us for quick application</h4>
+          <ul class="serverList">
+            <li 
+              v-for="(item,index) in contactList" 
+              @mouseenter="showBtn3('contactList',1,index)" 
+              @mouseleave="showBtn3('contactList',0,index)">
+              <img v-show="item.state===0" :src="item.baseUrl" alt="">
+              <img v-show="item.state===1" :src="item.hoverUrl" alt="">
+              <p v-for="i in item.text">{{i}}</p>
+            </li>
+          </ul>
+        </div>
+      </div>
+      <div class="success-apply" v-if="show3">
+        <div class="tab-line">
+          <h2>经纪商申请</h2>
+        </div>
+        <p>
+          <i class="el-icon-circle-check"></i>
+        </p>
+        <h5>恭喜您已经成功申请成为经济商！</h5>
+        <p>您可用现在的账号和密码登录后台！如有疑问，可联系我们！</p>
+        <button>登录后台</button>
+      </div>
+      <!-- 弹框立即申请 -->
+      <div class="dialogapply">
+        <el-dialog
+        class="dialog-content"
+          :visible.sync="dialogVisible">
+          <span class="content"><i class="el-icon-circle-check"></i>您的申请已经提交成功！</span>
+          <p>我们会尽快通过电话与您沟通，请保持手机畅通，谢谢！</p>
+        </el-dialog>
+      </div>
+      <!-- 弹框登录提示 -->
+      <div class="dialogapply">
+        <el-dialog
+        class="dialog-content"
+          :visible.sync="dialogtit">
+          <span class="content"><i class="el-icon-information"></i>登陆后才可申请经济商！</span><br>
+          <button>立即登陆</button>
+        </el-dialog>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import indexHeader from "../../components/header.vue"
+// import indexFooter from "../../components/footer.vue"
+import location from "../../components/location.vue"
+export default{
+  data(){
+    return{
+      dialogtit:false,
+      dialogVisible:false,
+      show3: false,
+      show1: true,
+      applycheck:true,
+      applyItem:1,
+      locationData:[
+        {
+          name:"申请代理",
+          link:"/apply"
+        },
+      ],
+      contactList:[
+        {
+          baseUrl:"static/img/apply/phone.png",
+          hoverUrl:"static/img/apply/phoneHover.png",
+          state:0,
+          text:["400-1566-899"],
+        },
+        {
+          baseUrl:"static/img/apply/qq.png",
+          hoverUrl:"static/img/apply/qqHover.png",
+          state:0,
+          text:["345106800","545967811"],
+        },
+        {
+          baseUrl:"static/img/apply/wx.png",
+          hoverUrl:"static/img/apply/wxHover.png",
+          state:0,
+          text:["326982014@qq.com"],
+        },
+      ],
+      applyform:{
+        name:"",
+        desc:'',
+      },
+      locationGroup:{
+        country:"",
+        city:""
+      },
+      countryOptions:[
+        {
+          value: '选项1',
+          label: '黄金糕'
+        },
+        {
+          value: '选项2',
+          label: '双皮奶'
+        },
+        {
+          value: '选项3',
+          label: '蚵仔煎'
+        },
+        {
+          value: '选项4',
+          label: '龙须面'
+        },
+      ],
+      cityOptions:[
+        {
+          value: '选项1',
+          label: '黄金糕'
+        },
+        {
+          value: '选项2',
+          label: '双皮奶'
+        },
+        {
+          value: '选项3',
+          label: '蚵仔煎'
+        },
+        {
+          value: '选项4',
+          label: '龙须面'
+        },
+      ],
+      serverBlock:[
+        {
+          name:'1',
+          text:"FX66具备一键交易功能，<br/>闪电交易，专业快捷!",
+          state:0,
+        },
+        {
+          name:'2',
+          text:"FX66具备一键交易功能，<br/>闪电交易，专业快捷!",
+          state:0,
+        },
+        {
+          name:'3',
+          text:"FX66具备一键交易功能，<br/>闪电交易，专业快捷!",
+          state:0,
+        },
+        {
+          name:'4',
+          text:"FX66具备一键交易功能，<br/>闪电交易，专业快捷!",
+          state:0,
+        },
+      ],
+    }
+  },
+  components:{
+    indexHeader,
+    // indexFooter,
+    location
+  },
+  mounted(){
+  },
+  methods:{
+    showBtn3(key,val,index){
+      this[key][index].state=val;     
+    },
+    applyNow(){
+      this.dialogtit=true;
+    }
+  }
+}
+</script>
+
+<style scoped>
+.apply-content{
+  padding-top:75px;
+  .tt-line{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    h3{
+      font-size: 35px;
+      font-weight: bold;
+      line-height: 1;
+    }
+    hr{
+      width: 420px;
+      height: 1px;
+      background-color: #e5e5e5;
+      border:0;
+    }
+  }
+  .sub-title{
+    font-size: 20px;
+    color: #999;
+    margin-top: 12px;
+  }
+  .server-block{
+    /*height: 600px;*/
+    width: 1200px;
+    margin: 0 auto;
+    padding-top: 50px;
+    .serverList{
+      margin-top: 50px;
+      padding: 0 188px 70px 188px;
+      display: flex;
+      justify-content:space-between;
+      img{
+        margin-bottom:20px;
+      }
+      p{
+        line-height: 1;
+        font-size: 20px;
+        margin-bottom: 10px;
+      }
+      p:last-child{
+        margin-bottom: 0;
+      }
+    }
+  }
+  .apply-form{
+    background: #fff;
+    width: 1200px;
+    margin: 0 auto 20px auto;
+    .tab-line{
+      border-bottom: 1px solid #e5e5e5;
+      margin-bottom: 50px;
+      height: 80px;
+      h2{
+        line-height: 80px;
+        font-size: 24px;
+        font-weight: bold;
+      }
+    }
+    &-box{
+      text-align: left;
+      margin: 0 75px;            
+      color: #333;
+      display: flex;
+      .change-box{
+        text-align: center;
+        font-size: 28px;
+        line-height: 80px;
+        color: #fff;
+        width: 30px;
+        height: 80px;
+        background: #1697f3;
+        margin-top: 180px;
+      }
+      .right-part{
+        width: 480px !important;
+        /*margin: 0 auto;*/
+        /*flex: 1;*/
+        margin-left: 40px;
+        .tip{
+          padding-left: 28px;
+          color: #3884d3;
+          font-size: 14px;
+        }
+        .el-form{
+          .el-input__inner{
+            border-radius: 0;
+            border-color: #bfbfbf;
+          }
+          .el-button{
+            display: block;
+            width: 100%;
+            border: 0;
+            border-radius: 0;
+            background-color: #0176c3;
+            color: #fff;
+            height: 40px;
+            line-height: 40px;
+            padding-top: 0;
+          }
+          .textareabox{
+            textarea{
+              width: 342px!important;
+              min-height: 70px;
+              max-height: 120px;
+              border:1px solid #bfcbd9;
+              border-radius: 4px;
+              padding:8px 10px;
+            }
+          }
+          .location-box{
+            .firstbox{
+              width: 165px;
+            }
+            .el-form-item__content{
+              display: flex;
+            }
+            .el-select+.el-select{
+              margin-left: 8px;
+            }
+          }
+          
+        }
+      }
+      .left-part{
+        width: 530px;
+        border:1px solid #e5e5e5;
+        padding: 20px;
+        position: relative;
+        &.part2{
+          height: 320px;
+        }
+        h4{
+          font-size: 16px;
+          line-height: 1;
+        }
+        h5{
+          color:#0176c3;
+          margin-top: 20px;
+          font-size: 14px;
+        }
+        p{
+          margin-top: 20px;
+          font-size: 14px;
+        }
+        &:before{
+          content: "";
+          position: absolute;
+          top: 50%;
+          right: -10px;
+          transform: translateY(-50%);
+          display: block;
+          border-left: 10px solid #e5e5e5;
+          border-top: 10px solid transparent;
+          border-bottom: 10px solid transparent;
+        }
+        &:after{
+          content: "";
+          position: absolute;
+          top: 50%;
+          right: -8px;
+          transform: translateY(-50%);
+          display: block;
+          border-left: 8px solid #fff;
+          border-top: 8px solid transparent;
+          border-bottom: 8px solid transparent;
+        }
+      }     
+    }
+  }
+  .indextab{
+    width: 1200px;
+    height: 110px;
+    background: #fff;
+    margin: 0 auto;
+    margin-bottom: 10px;
+    padding-left: 280px;
+    padding-top: 20px;  
+  }
+  .success-apply{
+    width: 1200px;
+    background: #fff;
+    margin: 0 auto;
+    margin-bottom: 10px;
+    .tab-line{
+      border-bottom: 1px solid #e5e5e5;
+      margin-bottom: 50px;
+      height: 80px;
+      h2{
+        line-height: 80px;
+        font-size: 24px;
+        font-weight: bold;
+      }
+    }
+    p{
+      color: #666;
+      font-size: 12px;
+      i{
+        font-size: 50px;
+        color: green;
+      }
+    }
+    h5{
+        line-height: 80px;
+        font-size: 24px;
+        font-weight: bold;
+    }
+    button{
+      border: 1px solid #e5e5e5;
+      color: #1a6fa6;
+      height: 35px;
+      width: 120px;
+      border-radius: 25px;
+      margin-top: 30px;
+      margin-bottom: 60px;
+      font-size: 16px;
+      font-weight: bold;
+      transition: all 0.3s ease 0s;
+      -moz-transition: all 0.3s ease 0s;
+      -webkit-transition: all 0.3s ease 0s;
+      -o-transition: all 0.3s ease 0s;
+      cursor: pointer;
+    }
+    button:hover{
+      background: #1a6fa6;
+      color: #fff;
+    }
+  }
+  .dialogapply{
+    .dialog-content{
+      width: 1200px!important;
+      left: 50%;
+      margin-left: -600px;
+      button{
+        border: 1px solid #e5e5e5;
+        color: #1a6fa6;
+        height: 35px;
+        width: 120px;
+        border-radius: 25px;
+        margin-top: 30px;
+        margin-bottom: 40px;
+        font-size: 16px;
+        font-weight: bold;
+        transition: all 0.3s ease 0s;
+        -moz-transition: all 0.3s ease 0s;
+        -webkit-transition: all 0.3s ease 0s;
+        -o-transition: all 0.3s ease 0s;
+        cursor: pointer;
+      }
+      button:hover{
+        background: #1a6fa6;
+        color: #fff;
+      }
+    }
+    .content{
+      font-size: 24px;
+      color: #1a6fa6;
+      i{
+        font-size: 26px;
+        margin-right: 10px;
+      }
+
+    }
+    p{
+      margin-top: 20px;
+      margin-bottom: 70px;
+    }
+  }
+  .banner-box{
+    height: 400px;
+    position: relative;
+    overflow: hidden;
+    margin-bottom: 10px;
+    img{
+      height: 100%;
+      position: relative;
+      left: 50%;
+      transform: translateX(-50%);
+    }
+  } 
+}
+</style> 

src/views/agent/myAgent.vue

@@ -0,0 +1,335 @@
+<template>
+  <div class="my-agent">
+    <indexHeader></indexHeader>
+    <div class="agent-content">
+      <titleBox></titleBox>
+      <div class="agent-list">
+        <!-- <location :dataList="locationData"></location> -->
+        <div class="agent-list-box">
+          <ul class="count-num">
+            <li v-for="item in countList">
+              <p class="num-line">
+                <em>{{item.amount}}</em>{{item.tip}}
+              </p>
+              <p class="word-line">{{item.word}}</p>
+            </li>
+          </ul>
+        </div>
+        <div class="table-title">
+          <span>返佣列表</span>
+        </div>
+        <div class="toolLine">
+          <div class="time item">
+            <span class="prompt-word">时间：</span>
+            <el-date-picker
+              v-model="value1"
+              type="date"
+              placeholder="选择日期">
+            </el-date-picker>
+            <el-date-picker
+              v-model="value2"
+              type="date"
+              placeholder="选择日期">
+            </el-date-picker>
+          </div>
+          <div class="timeSlot item">
+            <span 
+            :class="{active:index==timeTab}" 
+            v-for="(item,index) in timeList"
+            @click="timeTab=index">
+            {{item}}
+          </span>
+          </div>
+          <div class="state-box item">
+            <span class="prompt-word">结算状态：</span>
+            <el-select v-model="value" placeholder="请选择">
+              <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </div>
+          <div class="submit-block">
+            <el-button>结算</el-button>
+          </div>
+        </div>
+        <table class="commision-list">
+          <thead>
+            <tr>
+              <th>流水编号</th>
+              <th>被推荐人UID</th>
+              <th>被推荐人姓名</th>
+              <th>返佣比例</th>
+              <th>累计返佣</th>
+              <th>本期返佣</th>
+              <th>结算状态</th>
+              <th>结算时间</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="item in 8">
+              <td>2017080623</td>
+              <td>236987</td>
+              <td>张*</td>
+              <td>20%</td>
+              <td>0.0002BTC</td>
+              <td>0.0001BTC</td>
+              <td>审核中</td>
+              <td>2017-09-19</td>
+            </tr>
+          </tbody>
+        </table>
+        <div class="block">
+          <el-pagination
+            layout="prev, pager, next"
+            :total="500">
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+    <indexFooter></indexFooter>
+  </div>
+</template>
+
+<script>
+import indexHeader from "../../components/header.vue"
+import indexFooter from "../../components/footer.vue"
+import location from "../../components/location.vue"
+import titleBox from "../../components/title.vue"
+export default{
+  data(){
+    return{
+      timeTab:0,
+      timeList:["今天","7天","15天","30天"],
+      activeName:"first",
+      value:"",
+      value1:"",
+      value2:"",
+      options: [{
+        value: '选项1',
+        label: '黄金糕'
+      }, {
+        value: '选项2',
+        label: '双皮奶'
+      }, {
+        value: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤鸭'
+      }],
+      countList:{
+        people:{
+          amount:10,
+          tip:"人",
+          word:"累计推广人数",
+        },
+        currency:{
+          amount:0.553,
+          tip:"BTC",
+          word:"累计返佣额",
+        },
+        lastCurrency:{
+          amount:0.0001,
+          tip:"BTC",
+          word:"上月返佣",
+        }
+      },
+      locationData:[
+        {
+          name:"申请代理",
+          link:"/apply"
+        },
+      ],
+    }
+  },
+  components:{
+    indexHeader,
+    indexFooter,
+    location,
+    titleBox
+  },
+} 
+</script>
+
+<style>
+.agent-content{
+  padding-top: 75px;
+  background: url("../../assets/img/myAgent/banner.png") no-repeat center 70px;
+  background-size: auto 400px;
+  .agent-list{
+    width: 1200px;
+    margin: 0 auto 20px auto;
+    padding: 0 40px;
+    background-color: #fff;
+    .tabs{
+      .el-tabs__item.is-active{
+        color: #1a6fa6;
+      }
+      .el-tabs__active-bar{
+        background-color:#1f76af;
+        height: 2px; 
+      }
+      .el-tabs__item{
+        font-size: 16px;
+        color: #1a6fa6;
+      }
+      .el-tabs__active-bar{
+        width: 96px !important;
+      }
+    }
+    .table-title{
+      text-align: left;
+      border-bottom: 2px solid #e5e5e5;
+      margin-bottom: 10px;
+      position: relative;
+      .scroll-bar{
+        position: absolute;
+        bottom: -2px;
+        width: 120px;
+        height: 2px;
+        background-color: #1f76af;
+      }
+      span{
+        display: inline-block;
+        width: 120px;
+        height: 30px;
+        line-height: 30px;
+        font-size: 16px;
+        text-align: center;
+        color: #1a6fa6;
+        border-bottom: 2px solid #1f76af;
+        margin-bottom: -2px;
+      }
+    }
+    .block{
+      padding-bottom: 30px;
+    }
+    .toolLine{
+      overflow: hidden;
+      color: #333;
+      .item{
+        float: left;
+      }
+      .prompt-word{
+        font-size: 14px;
+        color: #333;
+      }
+      .submit-block{
+        float: right;
+      }
+      .el-input__inner{
+        border-radius: 0;
+      }
+      .submit-block{
+        .el-button{
+          border-radius:16px;
+          background-color: #1a6fa6;
+          border: 0;
+          color: #fff;
+          width: 120px;
+          height: 36px;
+          font-size: 16px;
+        }
+      }
+      
+      .el-date-editor.el-input{
+        width: 150px;
+      }
+      .state-box{
+        margin-left: 40px;
+        span{
+          line-height: 36px;
+        }
+        .el-select{
+          width: 200px;
+        }
+      }
+      .timeSlot{
+        padding:6px 0;
+        margin-left: 20px;
+        span{
+          display: inline-block;
+          width: 60px;
+          font-size: 14px;
+          height: 24px;
+          color: #333;
+          line-height: 24px;         
+          cursor: pointer;
+          &.active{
+            background-color: #1a6fa6;
+            color: #fff;
+          }
+        }
+      }
+    }
+    .commision-list{
+      clear: both;
+      width: 100%;
+      text-align: center;
+      margin-top: 30px;
+      margin-bottom: 30px;
+      thead{
+        tr{
+          background-color: #eee;
+        }
+      }
+      tbody{
+        tr:nth-child(even){
+          background-color:#f7f7f7;
+        };
+      }
+      tr{
+        font-size: 14px;
+        color: #333;
+        th{
+          text-align: center;
+          line-height: 40px;
+        }
+        td{
+          line-height: 45px;
+        }
+      }
+    }
+    &-box{
+      /*     */
+      margin: 0 auto;
+      padding: 30px 0;
+      background-color: #fff;
+      .count-num{
+        display: flex;
+        li:first-child{
+          border-left: 1px solid #e5e5e5;
+        }
+        li{
+          flex: 1;
+          border: 1px solid #e5e5e5;
+          border-left:0;
+          padding: 30px 0;
+          .num-line{
+            font-size: 16px;
+            color: #333;
+            line-height: 1;
+            em{
+              font-size: 48px;
+              color: #ef5b50;
+            }
+          }
+          .word-line{
+            line-height: 1;
+            margin-top: 20px;
+            font-size: 18px;
+            color: #1a6fa6;
+          }
+        }
+        
+      }
+    }
+  }
+}
+</style>

src/views/home/addUs.vue

@@ -0,0 +1,68 @@
+<template>
+  <div class="add-block">
+    <div class="tt-line">
+      <hr>
+      <h3>加入我们，可以获得</h3>
+      <hr>
+    </div>         
+    <h4 class="sub-title">To join our agent you will gain the following advantages</h4>
+    <div class="content-box">
+      <div class="adv-line">
+        <div class="adv-line-item" @mouseenter="showBtn('showBtnState',1)" @mouseleave="showBtn('showBtnState',0)">
+          <h4>超高返佣</h4>
+          <h5>High commission</h5>
+          <p>推荐FX66给他人，可以获取被推荐人等比例交易的手续费做为佣金。</p>
+          <img src="../../assets/img/home/add01.png" alt="">
+          <div class="apply-btn" v-if="showBtnState==1">
+            <span class="word" @click="golink('/apply')">立即加入代理</span>
+            <i class="el-icon-arrow-right"></i>
+          </div>
+        </div>
+        <div class="adv-line-item">
+          <h4>VIP奖励</h4>
+          <h5>VIP rewards</h5>
+          <p>每个代理商都会有相应的业绩排名，凡是每个月业绩排名靠前者，均可以得到我们平台的VIP级别奖励。</p>
+          <img src="../../assets/img/home/add02.png" alt="">
+        </div>
+      </div>
+      <div class="adv-line">
+        <div class="adv-line-item">
+          <h4>市场支持</h4>
+          <h5>Marketing support</h5>
+          <p>FX66代理商可以使用我们所可以提供的全部交易工具和交易资源，并且会在市场宣传方面给予相应的支持！</p>
+          <img src="../../assets/img/home/add03.png" alt="">
+        </div>
+        <div class="adv-line-item">
+          <h4>技术支持</h4>
+          <h5>Technical support</h5>
+          <p>我们拥有强大的技术开发团队，可以制定符合客户营销特点的网站，只收成本费。</p>
+          <img src="../../assets/img/home/add04.png" alt="">
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default{
+  data(){
+    return{
+      showBtnState:0,
+    }
+  },
+  methods:{
+    showBtn(key,val){
+      this[key]=val;
+    },
+    golink(val){
+      this.$router.push({path:val});
+    }
+  }
+}
+</script>
+
+<style>
+.add-block{
+  
+}
+</style>

src/views/home/home.vue

@@ -0,0 +1,746 @@
+<template>
+  <div>
+    <index-header></index-header>
+    <div class="home-content">
+      <!-- <div class="section-box">
+        <ol>
+          <li :class="{active:sectionState==item}"  v-for="(item,index) in 5">
+            <div class="item">0{{item}}</div>
+          </li>
+        </ol>
+      </div> -->
+      <div class="banner-block">
+        <el-carousel trigger="click" height="900px" :autoplay="false" indicator-position="none" arrow="never">
+          <el-carousel-item v-for="item in 4" :key="item">
+            <!-- <img src="../assets/img/banner1.png" alt=""> -->
+            <div class="banner"></div>
+          </el-carousel-item>
+        </el-carousel>
+        
+        <div class="button-line-box">
+          <div class="button-line">
+            <div class="about-line">
+              <h3>ABOUT</h3>
+              <h4>Mainstream reliable trading currencies</h4>
+              <p class="word">交易币种</p>
+              <hr>
+              <p class="word-tip">精选主流币种</p>
+              <p class="word-tip">多种报价模式</p>
+            </div>
+            <div class="button-line">         
+              <button class="btn1">申请代理</button>
+              <button class="btn2">在线咨询</button>
+              <span class="phoneNum">热线电话：4001-566-899</span>
+            </div>          
+          </div>       
+        </div>       
+        <loginPart></loginPart>                
+      </div>
+      <div class="coin-block">
+        <div class="tras-block">
+          <ul v-for="(item,index) in coinBlock">
+            <li 
+              :class="{lastBlock:i.normal,noCoin:i.nocoin}" 
+              v-for="(i,num) in item" 
+              @mouseenter="showBtn2('coinBlock',1,index,num,i)" 
+              @mouseleave="showBtn2('coinBlock',0,index,num,i)"
+              @click="gohelp(i.coinname,i.normal)">
+              <div class="part" v-if="i.state!==1">
+                <p class="name">{{i.name}}</p>
+                <p class="coin-name">{{i.coinname}}</p>
+                <div class="icon iconfont" :class="i.coin" v-if="!i.nocoin"></div>
+              </div>
+              <!-- <div class="part2" v-if="i.state===1&&!i.normal">
+                <div class="icon iconfont" :class="i.coin" v-if="!i.nocoin"></div>
+                <p class="price" v-if="!i.nocoin">
+                  <span>{{i.coinname}}/BTC：</span>
+                  <em v-if='marketData[i.coinname+"BTC"].last'>{{marketData[i.coinname+"BTC"].last}}</em>
+                </p>
+                <p v-if="!i.nocoin" class="range">{{marketData[i.coinname+"BTC"].range|filterCoin}}</p>
+                <p v-if="i.nocoin" class="expect-line">敬请期待</p>
+              </div> -->
+            </li>
+          </ul>
+        </div>
+      </div>
+      <addUs></addUs>
+      <plat></plat>
+      <server></server>
+      <contactUs></contactUs>
+    </div>  
+    <index-footer></index-footer>
+  </div>
+</template>
+
+<script>
+import indexHeader from "../../components/header.vue"
+import indexFooter from "../../components/footer.vue"
+import loginPart from "./login.vue"
+import addUs from "./addUs.vue"
+import plat from "./plat.vue"
+import server from "./server-block.vue"
+import contactUs from "../../components/contact.vue"
+import {ajax} from "../../assets/js/common.js"
+export default{
+  data(){
+    return{
+      // dialogVisible:true,
+      showBtnState:0,
+      coinchange:0,
+      marketData:{
+        BCCBTC:{},
+        LTCBTC:{},
+        ZECBTC:{},
+        ETHBTC:{},
+        ETCBTC:{},
+        BTCBTC:{},
+        SCBTC:{},
+        BTSBTC:{},
+      },
+      coinBlock:[
+        [
+          {
+            name:"比特现金",
+            coinname:"BCC",
+            coin:"icon-BCC",
+            state:0,
+          },         
+          {
+            name:"以太坊经典",
+            coinname:"ETC",
+            coin:"icon-ETC",
+            state:0,
+          },
+          // {
+          //   name:"比特股",
+          //   coinname:"BTS",
+          //   coin:"icon-BTS",
+          //   state:0,
+          // },
+          {
+            state:0,
+            nocoin:true,
+          },
+        ],
+        [
+          {
+            name:"以太坊",
+            coinname:"ETH",
+            coin:"icon-ETH",
+            state:0,
+          },
+          {
+            name:"零币",
+            coinname:"ZEC",
+            coin:"icon-ZEC",
+            state:0,
+          },
+          // {
+          //   name:"比特币",
+          //   coinname:"BTC",
+          //   coin:"icon-BTC",
+          //   state:0,
+          // },
+          {
+            state:0,
+            nocoin:true,
+          },
+        ],
+        [
+          {
+            name:"莱特币",
+            coinname:"LTC",
+            coin:"icon-LTC",
+            state:0,
+          },
+          // {
+          //   name:"云储币",
+          //   coinname:"SC",
+          //   coin:"icon-SC",
+          //   state:0,
+          // },
+          {
+            state:0,
+            nocoin:true,
+          },       
+          {
+            name:"主流",
+            coinname:"交易币种",
+            state:0,
+            normal:true,
+          },
+        ],
+      ],
+      sectionState:1,
+      requtime:'',//轮询计时器
+    }
+  },
+  watch:{
+    sectionState(val){
+      console.log(val);
+    }
+  },
+  components:{
+    indexHeader,
+    indexFooter,
+    loginPart,
+    contactUs,
+    addUs,
+    plat,
+    server
+  },
+  filters:{
+    filterCoin(val){
+      if(val){
+        let state=val.toString().indexOf("-");
+        if(state===-1){
+          val="+"+val;
+        }
+        return val;
+      }    
+    },
+  },
+  destroyed:function(){
+    clearInterval(this.requtime);
+  },
+  mounted(){
+    this.$nextTick(()=>{
+      this.windowScroll();
+      this.getHomeMarket();
+      this.requtime=setInterval(()=>{
+        this.getHomeMarket();
+      },5000);
+    })
+  },
+  methods:{
+    gohelp(coin,state){
+      if(state){
+        this.$router.push({path:"/help/coinintroduce"});
+      }
+      else{
+        this.$router.push({path:"/help/coinintroduce",query:{"type":coin}});
+      }
+      
+    },
+    getHomeMarket(){
+      let param={
+        sort:"plat",
+      };
+      ajax(this,this.extendApi.getcoindata,param,(data)=>{
+        if(data.code==200){         
+          for(let i=0;i<data.data.fxee.length;i++){
+            this.marketData[data.data.fxee[i].symbol]=data.data.fxee[i];
+            // for(let j=0;j<this.coinBlock.length;j++){
+            //   for(let k=0;k<this.coinBlock[j].length;k++){
+            //     if(this.coinBlock[j][k].coinname+"BTC"==data.data.fxee[i].symbol){
+            //       this.coinBlock[j][k]=object.assign(this.coinBlock[j][k],data.data.fxee[i]);
+            //     }
+            //   }              
+            // }           
+          }
+          // console.log(this.coinBlock);
+        }
+      }, "GET");
+    },
+    windowScroll(){
+      let that=this;
+      window.onscroll=()=>{
+        let num=parseInt(document.documentElement.scrollTop);
+        if(num<=800){
+          this.sectionState=1;
+        }
+        if(num>800&&num<=1600){
+          this.sectionState=2;
+        }
+        if(num>1600&&num<=2400){
+          this.sectionState=3;
+        }
+        if(num>2400&&num<=3200){
+          this.sectionState=4;
+        }
+        if(num>3200){
+          this.sectionState=5;
+        }        
+      };
+    },
+    
+    /*showBtn2(key,val,index,num,item){
+      //最后一个方块不做hover效果
+      if(!item.normal){
+        this[key][index][num].state=val;
+      }
+      // if(index!==2||num!==2){
+      //   this[key][index][num].state=val;
+      // }     
+    },*/
+    // showBtn(key,val){
+    //   this[key]=val;
+    // },
+  }
+}
+</script>
+<style>
+.home-content{
+  /*padding-top: 75px;*/
+  .statement-box{
+    .el-dialog{
+      width: 1100px; 
+    }
+    .el-dialog__header{
+      padding-top: 30px;
+    }    
+    .el-dialog__title{
+      color: #165e8d;
+      font-size: 24px;
+    }
+    .el-dialog__footer{
+      text-align: center;
+      .el-button{
+        font-size: 18px;
+      }
+    }
+    .el-dialog__body{
+      padding-bottom:5px;
+    }
+    .el-button{
+      width: 140px;
+      height: 40px;
+      border-radius: 20px;
+      background-color: #1a6fa6;
+      border:0;
+    }    
+  }
+  .section-box{
+    position: fixed;
+    left: 60px;
+    top: 50%;
+    transform: translateY(-50%);
+    z-index: 50;
+    color: #666;
+    height: 570px;   
+    /*line-height: 114px;*/
+    background: url("../../assets/img/home/secBg.png") no-repeat 0 top;
+    padding-left: 1px;
+    li{
+      /*padding-left: 16px;
+      margin: 35px 0;*/
+      height: 114px;
+      padding:35px 0;
+      .item{
+        line-height: 44px;
+        padding-left: 16px;
+      }
+    }
+    li.active{
+      .item{
+        color: #1a6fa6;
+        border-left:3px solid #1a6fa6; 
+      }
+      
+    }
+  }
+  .el-carousel__item{
+    img{
+      position: relative;
+      left:50%;
+      transform: translateX(-50%);
+    }
+  }
+  .banner-block{
+    position: relative;
+    .banner{
+      background:url("../../assets/img/banner1.png") no-repeat center center;
+      background-size: auto 100%;
+      height: 900px;
+    }
+  }
+  .server-block{
+    height: 600px;
+    width: 1200px;
+    margin: 0 auto;
+    padding-top: 68px;
+    .serverList{
+      margin-top: 80px;
+      display: flex;
+      justify-content: center;
+      li{
+        border:1px solid #dcdcdc;
+        width: 176px;
+        height: 176px;
+        transform: rotate(45deg);
+        margin-right: 72px;
+        background-color: #fff;
+        .item{
+          width: 100%;
+          height: 100%;
+          line-height: 176px;
+          transform: rotate(-45deg);
+          .iconfont{
+            font-size: 60px;
+            color: #2580bb;
+          }
+        }
+        .item2{
+          width: 100%;
+          height: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          transform: rotate(-45deg);
+          color: #fff;
+          font-size: 15px;
+        }
+        &:hover{
+          background-color: #1a6fa6;
+        }
+      }
+    }
+  }
+  .coin-block{
+    height: 900px; 
+    background: url("../../assets/img/home/coinBg.png") no-repeat center bottom;
+    position: relative;
+    .tras-block{
+      position: absolute;
+      top: 360px;
+      left:50%;
+      transform: rotate(45deg) translateX(-50%);
+      /*border:1px solid #dcdcdc;*/
+      ul{
+        display: flex;
+        margin-bottom: 24px;
+        li{
+          width: 185px;
+          height: 185px;
+          margin-right: 24px;
+          border:1px solid #dcdcdc;
+          position: relative;
+          cursor: pointer;       
+          .part{
+            position: absolute;
+            left:50%;
+            margin-left: -40%;
+            top: 50%;
+            margin-top: -40%;
+            width: 80%;
+            height: 80%;
+            transform: rotate(-45deg);
+            line-height: 1;
+            /*background-color: #ff0000;*/
+          }
+          .part2{
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            /*top: 10;*/
+            /*margin-top: 10px;
+            margin-left:10px;*/
+            transform: rotate(-45deg);
+            color: #fff;
+          }
+          .expect-line{
+            position: absolute;
+            left: 50%;
+            top:50%;
+            width: 100%;
+            transform: translateX(-50%) translateY(-50%);
+            font-size: 24px;
+          }
+          .icon{
+            font-size: 50px;
+            margin-top: 10px;
+            margin-bottom: 10px;
+          }
+          .price{
+            font-size: 16px;
+            margin-bottom: 20px;
+            em{
+              color:#ffc600;
+              font-size: 22px;
+            }
+          }
+          .range{
+            font-size: 25px;
+          }
+          .name{
+            font-size: 17px;
+            color: #666;
+            padding-top: 20px;
+          }
+          .coin-name{
+            font-size: 40px;
+            color: #1a6fa6;
+            margin-top: 20px;
+          }
+          /* &:hover{
+            background-color:rgba(26,111,166,0.95);
+            border-color: #1a6fa6;
+          } */
+          &.noCoin{
+            background-image: url("../../assets/img/home/no-coin.png");
+            background-repeat: no-repeat;
+            background-position: center;
+          }
+          /* &.noCoin:hover{
+            background-image: none;
+          } */
+          &.lastBlock{
+            background-color: #fff;
+            .name{
+              font-size: 30px;
+              color: #1a6fa6;
+              padding-top: 45px;
+            }
+            .coin-name{
+              font-size: 30px;
+              color: #333;
+              margin-top: 20px;
+            }
+          }
+          &.lastBlock:hover{
+            border-color: #dcdcdc;
+          };
+        }
+        li:last-child{
+          margin-right: 0;
+        }
+      }
+      ul:last-child{
+        margin-bottom: 0;
+      }
+    }
+  }
+  .plat-block{
+    height: 900px;
+    background: url("../../assets/img/home/platBg.png") no-repeat center bottom;
+    background-size: auto;
+    position: relative;
+    .word-box{
+      width: 1200px;
+      height: 250px;
+      position: absolute;
+      left:50%;
+      transform: translateX(-50%);
+      bottom: 85px;
+      background-color:rgba(2,134,219,0.83);
+      padding-left: 195px;
+      text-align: left;
+      color: #fff;
+      img{
+        position: absolute;
+        top:-37px;
+        left: 158px;
+      }
+      .tip1{
+        line-height: 1;
+      }
+      .word1{
+        font-size: 35px;
+        margin-top: 30px;
+        font-weight: bold;
+      }
+      .word2{
+        font-size: 24px;
+        margin-left: 80px;
+        margin-top: 10px;
+        font-weight: bold;
+      }
+      .word3{
+        margin-top: 16px;
+        font-size: 12px;
+        line-height: 1.5;
+      }
+      hr{
+        width: 45px;
+        height: 2px;
+        background-color: #fff;
+        border:0;
+        margin-top: 20px;
+      }
+      .ins-box{
+        position: absolute;
+        width: 380px;
+        right: 250px;
+        top:56px;
+        font-size: 18px;
+        text-align: center;
+        line-height: 1.6;
+      }
+    }
+  }
+  .tt-line{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    h3{
+      font-size: 35px;
+      font-weight: bold;
+      line-height: 1;
+    }
+    hr{
+      width: 420px;
+      height: 1px;
+      background-color: #e5e5e5;
+      border:0;
+    }
+  }
+  .sub-title{
+    font-size: 20px;
+    color: #999;
+    margin-top: 12px;
+  }
+  .add-block{
+    height: 900px;
+    width: 1200px;
+    padding-top: 60px;
+    margin: 0 auto;   
+    .adv-line{
+      display: flex;
+      margin-top: 80px;
+      .apply-btn{
+        position: absolute;
+        bottom:-22px;
+        width: 170px;
+        height: 45px;
+        background-color: #1a6fa6;
+        color: #fff;
+        padding-left: 18px;
+        cursor: pointer;
+        span{
+          line-height: 45px;
+          font-size: 15px;
+        }
+        i{
+          display: inline-block;
+          width: 45px;
+          height: 45px;
+          text-align: center;
+          line-height: 45px;
+          font-size: 16px;
+          position: absolute;
+          right: 0;
+          top: 0;          
+          background-color: #2580bb;
+          
+        }
+      }
+      &-item:first-child{
+        margin-right:200px;
+      }
+      &-item:hover{
+        border:1px solid #1a6fa6;
+        border-left:3px solid #1a6fa6;
+        box-shadow: 0 0 20px 1px #e5e5e5;
+      }
+      &-item{
+        
+        position: relative;
+        text-align: left;
+        width: 430px;
+        height: 250px;
+        border:1px solid #eee;
+        color: #333;
+        padding: 32px 0 0 20px;
+        background-color: #fff;
+        h4{
+          font-size: 25px;
+          font-weight: bold;
+          line-height: 1;
+        }
+        h5{
+          font-size: 20px;
+          line-height: 1;
+          color: #999;
+          font-weight: 500;
+          margin-top: 10px;
+          margin-bottom: 40px;
+        }
+        p{
+          width: 255px;
+          font-size: 15px;
+        }
+        img{
+          position: absolute;
+          top:20px;
+          right: -135px;
+          width: 270px;
+        }
+      }
+    }
+  }
+  
+  .button-line-box{
+    background-color: rgba(0,0,0,0.46);
+    position: absolute;
+    bottom: 0;
+    z-index: 10;
+    height: 100px;
+    text-align: center;
+    width: 100%;
+    color: #fff;  
+    padding: 30px 0;
+    .about-line{
+      position: absolute;
+      top:-20px;
+      width: 200px;
+      height: 450px;
+      background:#1a6fa6 url("../../assets/img/home/aboutBg.png") no-repeat left 125%;
+      text-align: left;
+      padding: 0 20px;
+      h3{
+        font-size: 45px;
+        padding-top: 124px;
+        line-height: 1;
+        margin-bottom: 15px;    
+      }
+      h4{
+        font-size: 12px;
+        margin-bottom: 30px;
+      }
+      .word{
+        font-size: 30px;
+        font-weight: bold;
+      }
+      .word-tip{
+        color: #a8ddff;
+        font-size: 18px;
+      }
+      hr{
+        height: 2px;
+        width: 60px;
+        background-color: #fff;
+        border: 0;
+        margin: 20px 0;
+      }
+    }
+  }
+  .button-line{
+    width: 1200px;
+    margin: 0 auto;
+    position: relative;
+
+    button{
+      width: 140px;
+      height: 40px;
+      border-radius: 20px;
+      border: 0;
+      font-size: 18px;
+      font-weight: bold;
+      margin-right: 60px;
+      cursor: pointer;
+    }
+    .btn1{
+      background-color: #1a6fa6;
+      color: #fff;
+    }
+    .btn2{
+      color: #1a6fa6;
+      background-color: #fff;
+    }
+    .phoneNum{
+      font-size: 25px;
+      font-weight: bold;
+    }
+  }
+}
+</style>

src/views/home/login.vue

@@ -0,0 +1,897 @@
+<template>
+  <div class="home-wrap">
+    <!-- 注册页面 -->
+    <div class="login-block" v-if="loginTab===0">
+      <div class="contain">
+        <!-- <h2>FX66&nbsp;欢迎您注册</h2>
+        <h4>Welcome you to join</h4> -->
+        <div class="tab-box">
+          <span :class='{active:operateType=="email"}' @click="operateType='email'">邮箱注册</span>
+          <span :class='{active:operateType=="mobile"}' @click="operateType='mobile'">手机注册</span>
+        </div>
+        <div class="login-line">
+          <span v-if="operateType=='email'"><i class="iconfont icon-tubiao01"></i></span>
+          <span class="areaBlock" v-if="operateType=='mobile'">
+            <el-select class="areaSelect" v-model="area" placeholder="">
+              <el-option
+                v-for="item in areaOptions"
+                :key="item.code"
+                :label="item.ch_name"
+                :value="item.code">
+              </el-option>
+            </el-select>
+          </span>
+          <input class="input" type="text" v-model="regParam.email" :placeholder="tipWord" @blur="checkPhoneNumber()">
+        </div>
+        <div class="yanz-line">
+          <input class="input" type="text" v-model="regParam.code" placeholder="请输入验证码">
+          <button v-if="codestate===0" @click="sendCode()">发送验证码</button>
+          <button :class="{bgGrey:codestate===1}" v-if="codestate===1">已发送{{secondNum}}</button>
+        </div>
+        <div class="login-line">
+          <span><i class="iconfont icon-mima"></i></span>
+          <input class="input" type="password" v-model="regParam.password" placeholder="请输入您的密码">
+          <i class="iconfont icon-keyboard keyboradIcon"></i>
+          <!-- <el-input class="input" type="text" v-model="regParam.password" placeholder="请输入您的密码">
+            <i slot="suffix-icon" class="iconfont icon-keyboard"></i>
+          </el-input> -->
+        </div>
+        <div class="tip-line">
+          <input v-model="tipNeed" class="input" type="checkbox" id="tip">
+          <!-- <label for="tip">
+            <span>我已了解风险提示!</span>
+          </label> -->
+          <span>我已了解<i @click="dialogVisible=true">风险提示</i>!</span>        
+          <div class="switch-box">
+            <span class="cursor" @click="loginTab=1">立即登录!</span>
+          </div>
+          <p class="warning" v-show="isRegisted">*该邮箱已注册</p>
+          <p class="warning" v-show="isError">*您输入的手机号有误，请重新输入</p>
+        </div>
+        <div class="submit-line">
+          <!-- <button class="loginBtn">登录</button> -->
+          <el-button class="regBtn" @click="goreg" :loading="regLoad">注册</el-button>
+        </div>
+      </div>
+    </div>
+    <!-- 登录页面 -->
+    <div class="login-block" v-if="loginTab===1">
+      <div class="contain">
+        <!-- <h2>FX66&nbsp;欢迎您登录</h2>
+        <h4>Welcome you to join</h4> -->
+        <div class="tab-box">
+          <span :class='{active:operateType=="email"}' @click="operateType='email'">邮箱登录</span>
+          <span :class='{active:operateType=="mobile"}' @click="operateType='mobile'">手机登录</span>
+        </div>
+        <div class="login-line">
+          <span v-if="operateType=='email'"><i class="iconfont icon-tubiao01"></i></span>
+          <span class="areaBlock" v-if="operateType=='mobile'">
+            <!-- <select v-model="area">
+              <option :value="item.code" v-for="item in areaOptions">{{item.ch_name}}</option>
+            </select> -->
+            <el-select class="areaSelect" v-model="area" placeholder="">
+              <el-option
+                v-for="item in areaOptions"
+                :key="item.code"
+                :label="item.ch_name"
+                :value="item.code">
+              </el-option>
+            </el-select>
+          </span>
+          <input class="input" v-model="loginParam.username" type="text" :placeholder="tipWord">
+        </div>
+        <!-- <div class="login-line">
+          <span><i class="iconfont icon-mima"></i></span>
+          <input class="input" v-model="loginParam.password" type="password" placeholder="请输入您的密码">
+        </div> -->
+        <div class="yanz-line">
+          <input class="input" type="text" v-model="loginParam.password" placeholder="请输入验证码">
+          <button v-if="codestate===0" @click="sendLoginCode()">发送验证码</button>
+          <button :class="{bgGrey:codestate===1}" v-if="codestate===1">已发送{{secondNum}}</button>
+        </div>
+        <div class="tip-line">
+          <span class="cursor" @click="toForgetPassWord()">忘记密码？</span>
+          <div class="switch-box">
+            <span class="cursor" @click="loginTab=0">立即注册!</span>
+          </div>
+          <!-- <p class="warning" v-show="">*该邮箱还未注册</p> -->
+        </div>
+        <div class="submit-line">
+          <el-button class="loginBtn cursor" @click="gologin" :loading="buttonLoad">登录</el-button>
+        </div>
+      </div>
+    </div>
+    <!-- 手机找回密码 -->
+    <div class="login-block" v-if="loginTab===2">
+      <div class="contain">
+        <h2>找回密码</h2>
+        <h4>Retrieve password</h4>
+        <!-- <div class="tab-box">
+          <span :class='{active:operateType=="mobile"}' @click="operateType='mobile'">手机找回</span>
+          <span :class='{active:operateType=="email"}' @click="operateType='email'">邮箱找回</span>
+        </div> -->
+        <div class="login-line" v-if="operateType=='email'">
+          <span><i class="iconfont icon-tubiao01"></i></span>
+          <input class="input" v-model="setParam.username" type="text" placeholder="请输入您的邮箱">
+        </div>
+        <div v-if="operateType=='mobile'">
+          <div class="login-line">
+            <span v-if="operateType=='email'"><i class="iconfont icon-tubiao01"></i></span>
+            <span class="areaBlock" v-if="operateType=='mobile'">
+              <el-select class="areaSelect" v-model="area" placeholder="">
+                <el-option
+                  v-for="item in areaOptions"
+                  :key="item.code"
+                  :label="item.ch_name"
+                  :value="item.code">
+                </el-option>
+              </el-select>
+            </span>
+            <input class="input" type="text" v-model="setParam.username" :placeholder="tipWord">
+          </div>
+          <div class="yanz-line">
+            <input class="input" type="text" v-model="setParam.resettoken" placeholder="请输入验证码">
+            <button v-if="codestate===0" @click="pwdSend()" :loading="codeLoad">发送验证码</button>
+            <button :class="{bgGrey:codestate===1}" v-if="codestate===1">已发送{{secondNum}}</button>
+          </div>
+          <div class="login-line">
+            <span><i class="iconfont icon-mima"></i></span>
+            <input class="input" type="password" v-model="setParam.password" placeholder="请输入您的新密码">
+            <i class="iconfont icon-keyboard keyboradIcon"></i>
+          </div>
+          <div class="login-line">
+            <span><i class="iconfont icon-mima"></i></span>
+            <input class="input" type="password" v-model="setParam.password2" placeholder="请再次输入您的新密码">
+            <i class="iconfont icon-keyboard keyboradIcon"></i>
+          </div>
+        </div>
+        
+        <div class="tip-line">
+          <div class="switch-box">
+            <span class="cursor" @click="loginTab=1">返回登录!</span>
+          </div>
+          <p class="warning" v-show="messageCodeisError">*短信验证码错误</p>
+        </div>
+        <div class="submit-line">
+          <el-button class="loginBtn cursor" @click="" v-if="operateType=='email'" :loading="codeLoad">
+            <span v-if="codestate===0" @click="pwdSend()">发送邮件</span>
+            <span v-if="codestate===1">已发送{{secondNum}}</span>
+          </el-button>
+          <el-button class="loginBtn cursor" @click="reSetPwd" v-if="operateType=='mobile'" :loading="setLoad">修改密码</el-button>
+        </div>
+      </div>
+    </div>
+    <!-- 邮箱找回密码 -->
+    <div class="login-block" v-if="loginTab===4">
+      <div class="contain">
+        <h2>找回密码</h2>
+        <h4>Retrieve password</h4>
+        <div class="login-line">
+          <span><i class="iconfont icon-tubiao01"></i></span>
+          <input class="input" v-model="setParam.username" type="text" placeholder="请输入您的邮箱">
+        </div>
+        <div class="tip-line">
+          <div class="switch-box">
+            <span class="cursor" @click="loginTab=1">返回登录!</span>
+          </div>                
+        </div>
+        <div class="submit-line">
+          <el-button class="loginBtn cursor" @click="" v-if="operateType=='email'" :loading="codeLoad">
+            <span v-if="codestate===0" @click="pwdSend()">发送邮件</span>
+            <span v-if="codestate===1">已发送{{secondNum}}</span>
+          </el-button>
+          <el-button class="loginBtn cursor" @click="reSetPwd" v-if="operateType=='mobile'" :loading="setLoad">发送邮件</el-button>
+        </div>
+      </div>
+    </div>
+    <!-- 登录成功页面 -->
+    <div class="login-block" v-if="loginTab===3">
+      <div class="contain">
+        <p class="user-msg">欢迎您，{{userInfo.base.username}}</p>
+        <div class="whole-line">
+          <button class="whole-btn cursor" @click="golink('/apply')">申请代理</button>
+          <!-- <button class="whole-btn cursor" @click="golink('/tradecenter')">立即交易</button> -->
+        </div>       
+        <div class="operate-line">
+          <!-- <button class="deep cursor" @click="golink('/myassets')">充币</button>
+          <button class="cursor" @click="golink('/myassets')">提币</button> -->
+        </div>
+      </div>
+    </div>
+    <el-dialog
+      class="statement-box"
+      title="FX66平台风险提示及免责声明"
+      :visible.sync="dialogVisible">
+        <publicWord></publicWord>
+        <span slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="readSure()">我已阅读</el-button>
+        </span>
+      </el-dialog>
+  </div>
+</template>
+
+<script>
+import {sublogion,sendEmail,sendCode,ajax,subloginup, getUserData,getcookie} from "../../assets/js/common.js"
+import bus from "../../assets/js/bus.js"
+import publicWord from "./public.vue"
+export default{
+  data(){
+    return{
+      regLoad:false,
+      buttonLoad:false,
+      setLoad:false,
+      codeLoad:false,    
+      dialogVisible:false,
+      codestate:0,
+      secondNum:60,
+      reltime:"",
+      loginTab:0,
+      loginParam:{
+        'username':"",
+        'password':"",
+      },
+      regParam:{
+        'email':"",
+        'password':"",
+        'code':"",
+      },
+      setParam:{
+        "username":"",
+        'password':"",
+        "password2":"",
+        "resettoken":"",
+      },
+      userInfo:{
+        base:{}
+      },
+      operateType:"email",
+      areaOptions:{},
+      area:"86",
+      gid:"",
+      tipNeed:false,
+      isRegisted:false,//邮箱是否已被注册
+      isError:false,   //手机号对不对
+      messageCodeisError:false, //找回密码短信验证码错误
+    }
+  },
+  components:{
+    publicWord
+  },
+  computed:{  
+    tipWord:function(){
+      let val="";
+      if(this.operateType=="mobile"){
+        val="请输入您的手机号码";
+      }
+      else{
+        val="请输入您的邮箱";
+      }
+      return val;
+    }
+  },
+  watch:{
+    area(val){
+      // console.log(val);
+    },
+    operateType(val){
+      for(let x in this.loginParam){
+        this.loginParam[x]="";
+      }
+      for(let x in this.regParam){
+        this.regParam[x]="";
+      }
+      for(let x in this.setParam){
+        this.setParam[x]="";
+      }    
+    },
+    loginTab(val){    
+      this.area="86";
+      this.operateType="mobile";
+      /*if(val!=2){
+        this.operateType="mobile";
+      }*/
+      if(val===1){
+        for(let x in this.loginParam){
+          this.loginParam[x]="";
+        }
+      }
+      if(val===0){
+        for(let x in this.regParam){
+          this.regParam[x]="";
+        }
+      }
+      if(val==2){
+        for(let x in this.setParam){
+          this.setParam[x]="";
+        }
+      }
+    }
+  },
+  mounted(){
+    this.$nextTick(()=>{
+      let token=getcookie("token");
+      if(token){
+        this.getUserInfo();
+        this.loginTab=3;
+      }
+      else{
+        this.loginTab=1;
+      }
+      bus.$on("goout",()=>{
+        this.loginTab=1;
+      });
+      this.country();
+    })   
+  },
+  methods:{
+    toForgetPassWord(){
+      if(this.operateType=='mobile'){
+        this.loginTab = 2;
+      }else if(this.operateType=='email'){
+        this.loginTab = 4;
+      }
+      
+    },
+    //正则表达式验证手机号码是否正确
+    checkPhoneNumber(){
+      if(!(/^1[3|5|7|8][0-9]\d{4,8}$/.test(this.regParam.email))&&this.regParam.email!=''){
+        this.isError = true;
+        return false;
+      }else{
+        this.isError = false;
+      }
+    },
+    //重置密码
+    reSetPwd(){
+      if(this.setParam.resettoken==""){
+        this.$notify({
+          title: '提示',
+          message: '验证码不能为空',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      }
+      if(this.setParam.password==""){
+        this.$notify({
+          title: '提示',
+          message: '请输入新密码',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      }
+      if(this.setParam.password2==""){
+        this.$notify({
+          title: '提示',
+          message: '请再次输入新密码',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      }
+      if(this.setParam.password!=this.setParam.password2){
+        this.$notify({
+          title: '提示',
+          message: '两次输入的密码不同',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      }
+      let postdata = {
+        resettoken:this.setParam.resettoken,
+        password:this.setParam.password,
+        password2:this.setParam.password2,
+        os:"web",
+        type:"sms",
+      };
+      this.setLoad=true;
+      ajax(this,this.extendApi.resetPwd,postdata,(data)=>{
+        this.setLoad=false;
+        if(data.code==200){
+          this.$notify({
+            title: '提示',
+            message: '修改密码成功,请使用新密码登录',
+            type: 'success',
+            duration:'1500'
+          });
+          this.loginTab=1;
+          this.messageCodeisError = false;
+        }else if(data.code==1024){  //该状态码为 验证码错误
+          this.messageCodeisError = true;
+        }
+      },'post');
+    },
+    //发送验证码
+    pwdSend(){
+      if(this.setParam.username==""){
+        this.$notify({
+          title: '提示',
+          message: this.tipWord,
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      }
+      let param={
+        os:'web'
+      };
+      if(this.operateType=='email'){
+        param.email=this.setParam.username;
+        param.type="email";
+      }
+      else{
+        param.mobile=this.setParam.username;
+        param.area=this.area;
+        param.type="sms";
+      };
+      this.codeLoad=true;
+      ajax(this,this.extendApi.pwdSend,param,(data)=>{
+        this.codeLoad=false;
+        if(data.code==200){
+          this.codestate=1;
+          this.secondNum=60;
+          clearInterval(this.reltime);
+          this.reltime=setInterval(()=>{
+            this.secondNum--;
+            if(this.secondNum==0){
+              clearInterval(this.reltime);
+              this.codestate=0;
+              this.secondNum=60;
+            }
+          }, 1000);
+        }     
+      },'post');
+    },
+    readSure(){
+      this.dialogVisible = false;
+      this.tipNeed=true;
+    },
+    // 获取国家
+    country(){
+      ajax(this,this.extendApi.phoneCountry,'',(res)=>{
+        if(res.code == 200){
+          this.areaOptions = res.data;
+        }
+      },'GET');
+    },
+    golink(val){
+      this.$router.push({path:val});
+    },
+    //注册时~发送验证码
+    sendCode(){
+      if(this.regParam.email==""){
+        this.$notify({
+          title: '提示',
+          message: this.tipWord,
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      };
+      let param={};
+      if(this.operateType=='email'){
+        param={
+          codetype:'validate',
+          vparam:"FzmDateTime|FzmRandom",
+          email:this.regParam.email
+        };
+        sendEmail(this,param,(data)=>{});
+      }
+      else{
+        param={
+          codetype:'validate',
+          vparam:"FzmRandom",
+          mobile:this.regParam.email,
+          area:this.area
+        };       
+        sendCode(this,param,(data)=>{});
+      }
+    },
+    //登录时~发送验证码
+    sendLoginCode(){
+      if(this.loginParam.username==""){
+        this.$notify({
+          title: '提示',
+          message: this.tipWord,
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      };
+      let param={};
+      if(this.operateType=='email'){
+        param={
+          codetype:'validate',
+          vparam:"FzmDateTime|FzmRandom",
+          email:this.loginParam.username
+        };
+        sendEmail(this,param,(data)=>{});
+      }
+      else{
+        param={
+          codetype:'validate',
+          vparam:"FzmRandom",
+          mobile:this.loginParam.username,
+          area:this.area
+        };       
+        sendCode(this,param,(data)=>{});
+      }
+    },
+    //注册按钮
+    goreg(){
+      if(this.regParam.email==""){
+        this.$notify({
+          title: '提示',
+          message: this.tipWord,
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      };
+      if(this.regParam.code==""){
+        this.$notify({
+          title: '提示',
+          message: '验证码不能为空',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      };
+      if(this.regParam.password==""){
+        this.$notify({
+          title: '提示',
+          message: '密码不能为空',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      };
+      if(this.tipNeed==false){
+        this.$notify({
+          title: '提示',
+          message: '请阅读风险提示',
+          type: 'warning',
+          duration:'1500'
+        })
+        return false;
+      }
+      let param={};
+      if(this.operateType=="email"){
+        param={
+          'email':this.regParam.email,
+          'password':this.regParam.password,
+          'code':this.regParam.code,
+          'type':"email",
+          "checkmethod":"data",
+        };
+      }
+      else{
+        param={
+          mobile:this.regParam.email,
+          password:this.regParam.password,
+          code:this.regParam.code,
+          checkmethod:"data",
+          type:"sms",
+          area:this.area,
+        };
+      }
+      this.regLoad=true;
+      subloginup(this,param,(data)=>{
+        this.regLoad=false;
+        if(data.code==200){         
+          this.gologin('reg');
+          this.isRegisted = false;
+        }else if(data.code == 1001){  //code=1001 代表该邮箱已被注册
+          this.isRegisted = true;
+        }
+      })
+    },
+    //登录按钮
+    gologin(state){
+      if(state!='reg'){
+        if(this.loginParam.username===""){
+          this.$notify({
+            title: '提示',
+            message:this.tipWord,
+            type: 'warning',
+            duration:'1500'
+          })
+          return false;
+        }
+        if(this.loginParam.password===""){
+          this.$notify({
+            title: '提示',
+            message: '密码不能为空',
+            type: 'warning',
+            duration:'1500'
+          })
+          return false;
+        }
+      }
+      let param={
+        'redirect_uri':'http://33.cn',
+        'os':'web',
+      };
+      if(this.operateType=='mobile'){
+        param.type="sms";
+        param.area=this.area;
+        if(state=='reg'){
+          param.password=this.regParam.password;
+          param.mobile=this.regParam.email;
+        }
+        else{
+          param.password=this.loginParam.password;
+          param.mobile=this.loginParam.username;
+        }      
+      }
+      else{
+        param.type="email";
+        if(state=='reg'){
+          param.password=this.regParam.password;
+          param.email=this.regParam.email;
+        }
+        else{
+          param.password=this.loginParam.password;       
+          param.email=this.loginParam.username;
+        }  
+      }      
+      this.buttonLoad=true;      
+      sublogion(this,'index',param,(data)=>{
+        this.buttonLoad=false;
+        if(data.code==200){         
+          this.$router.push("/tradecenter/entrustment");
+        }  
+      });
+    },
+    getUserInfo(){
+      getUserData(this,(data)=>{
+        this.userInfo.base=data.data.base;
+        sessionStorage.setItem("username",data.data.base.username);
+        bus.$emit("login","h1");
+      });
+    },
+  }
+}
+</script>
+
+<style>
+.home-wrap{
+  width: 1200px;
+  margin: 0 auto;
+  position:absolute;
+  left: 50%;
+  margin-left: -600px;
+  top: 0;
+  margin-top: 180px;
+  .cursor{
+    cursor: pointer;
+  }
+  .login-block{
+    width: 390px;
+    background-color: rgba(255,255,255,0.4);
+    padding: 15px;
+    position: absolute;
+    right: 0;
+    top: 0;
+    z-index:50;
+    .areaSelect{
+      .el-input .el-input__icon{
+        font-size: 8px !important;
+        right: 2px;
+        width: 14px;
+      }
+      input{
+        padding: 0;
+        padding-left: 4px;
+        padding-right: 14px;
+        font-size: 12px;
+        border: none;
+      }
+    }
+    .areaBlock{
+      select{
+        width: 100%;
+        height: 96%;
+        border: none;
+      }
+    }
+    .tab-box{
+      border-bottom: 2px solid #e5e5e5;
+      margin-bottom: 30px;
+      span{
+        display: inline-block;
+        font-size: 20px;
+        color: #333;
+        width: 110px;
+        padding-bottom: 20px;
+        cursor: pointer;
+      }
+      span.active{
+        border-bottom: 2px solid #1a6fa6;
+        margin-bottom: -2px;
+      }
+    }
+    .user-msg{
+      font-size: 25px;
+      color: #1a6fa6;
+    }
+    .whole-line{
+      margin-top: 50px;
+
+    }
+    .operate-line{
+      padding-bottom: 50px;
+      font-size: 0;
+      button{
+        width: 150px;
+        height: 50px;
+        font-size: 18px;
+        line-height: 50px;
+        background-color: transparent;
+        border: 1px solid #d2d2d2;
+      }
+      button+button{
+        margin-left: 20px;
+      }
+      .deep{
+        background-color: #1a6fa6;
+        color: #fff;
+      }
+    }
+    .whole-btn{
+      width: 100%;
+      height: 50px;
+      line-height: 50px;
+      border:1px solid #d2d2d2;
+      background-color: transparent;
+      margin-bottom: 20px;
+      font-size: 18px;
+    }
+    .contain{
+      background-color: #fff;
+      padding: 50px 20px 0 20px;
+      color: #333;
+      h2{
+        font-size: 30px;
+        line-height: 1;
+      }
+      h4{
+        line-height: 1;
+        font-size: 16px;
+        color: #b0b0b0;
+        margin-top: 7px;
+        margin-bottom: 23px;
+      }
+      .login-line{
+        position: relative;
+        width: 310px;
+        height: 50px;
+        line-height: 50px;
+        margin: 0 auto;
+        border:1px solid #dcdcdc;
+        text-align: left;
+        margin-bottom: 10px;
+        span{
+          display: inline-block;
+          width: 50px;
+          height: 50px;
+          text-align: center;
+          border-right: 1px solid #dcdcdc;
+          i{
+            font-size: 24px;
+            color: #ccc;
+          }
+        }
+        .input{
+          position: absolute;
+          margin-top: 10px;
+          padding-left: 10px;  
+          line-height: 30px;
+          border:0;
+          font-size: 14px;
+          width: 250px;
+        }
+        .keyboradIcon{
+          font-size: 30px;
+          color: #B4B4B4;
+          position: absolute;
+          left: 270px;
+          top: 0px;
+        }
+      }
+      /* .input:focus .login-line{
+        border: 1px solid #235ADA;
+      } */
+      .yanz-line{
+        width: 310px;
+        height: 50px;
+        line-height: 50px;
+        margin: 0 auto;
+        text-align: left;
+        margin-bottom: 10px;
+        input{
+          border:1px solid #dcdcdc;
+          height: 50px;
+          /*position: absolute;*/
+          /*width: 250px;*/
+          padding-left: 10px;  
+          line-height: 30px;
+          font-size: 14px;
+        }
+        button{
+          width: 130px;
+          height: 50px;
+          background: #ffe366;
+          border: 0;
+          position: absolute;
+          /*margin-top: -2px;*/
+          margin-left: 10px;
+          font-size: 14px;
+          color: #666;
+          cursor: pointer;
+        }
+        .bgGrey{
+          background-color: #eee;
+        }
+      }
+      .tip-line{
+        width: 310px;
+        margin: 0 auto;
+        margin-top: 10px;
+        margin-bottom: 26px;
+        text-align: left;
+        line-height: 1;
+        /* display: flex; */
+        align-items: center;
+        justify-content: space-between;
+        font-size: 14px;
+        input{
+          margin-right: 10px;
+        }
+        i{
+          color: #1a6fa6;
+          cursor: pointer;
+          font-style: normal;
+        }
+        .switch-box{
+          /* flex:1; */
+          display: inline-block;
+          float: right;
+          span{
+            color: #1a6fa6;
+          }
+        }
+        .warning{
+          color:red;
+          padding-top:10px;
+        }
+      }
+      .submit-line{
+        padding-bottom: 30px;
+        font-size: 0;
+        button{
+          width: 150px;
+          height: 50px;
+          font-size: 18px;
+          background-color: #1a6fa6;
+          border: 0;
+          color: #fff;
+          border-radius: 0;
+        }
+        button+button{
+          margin-left: 10px;
+        }
+        /*.loginBtn{
+          
+        }
+        .regBtn{
+          
+        }*/
+      }
+    }
+  }
+}
+
+</style>

src/views/home/plat.vue

@@ -0,0 +1,24 @@
+<template>
+  <div class="plat-block">
+    <div class="word-box">
+      <img src="../../assets/img/home/platBlock.png" alt="">
+      <div class="tip1">
+        <p class="word1">专业严谨</p>
+        <p class="word2">的交易平台</p>
+        <p class="word3">Professional and rigorous trading <br/> platform</p>
+        <hr />
+      </div>
+      <p class="ins-box">
+        Fx66基于区块链底层技术的数字货币交易所，<br/>
+
+        座落于美丽的西子湖畔-杭州，<br/>
+
+        拥有撮合交易系统低延时、高并发的核心技术，<br/>
+
+        我们突破传统交易所的局限，<br/>
+
+        把交易、资产写入区块链当中。
+      </p>
+    </div>
+  </div>
+</template>

src/views/home/public.vue

@@ -0,0 +1,102 @@
+<template>
+  <div class="statement-public">
+    <h4>尊敬的FX66平台用户：</h4>
+    <p>
+      由于数字资产具有极高的投资风险，实行7*24小时连续交易，它没有像中国股市有涨跌停限制，且易受外界因素影响，价格波动较大！
+      比特币不由货币当局发行，不具有法偿性与强制性，请务必在了解数字资产市场风险与风险自担的前提下谨慎、理性投资。
+    </p>
+    <h4 class="part-name">一、风险提示：</h4>
+    <p>
+      1 、数字资产市场是全新的、未经确认的，而且可能不会增长。目前，数字资产主要由投机者大量使用，零售和商业市场使用相对较少。因此，数字资产价格易产生波动，并进而对数字资产投资产生不利影响。
+    </p>
+    <p>
+      2、因各国法律、法规和规范性文件的制定或者修改，数字资产交易随时可能被暂停、或被禁止。因此造成的经济损失全部由用户自行承担。
+    </p>
+    <p>
+      3、用户参与数字资产交易，需承受较高风险。用户应了解和理解此投资有可能导致部分损失或全部损失，所以用户应该以能承受的损失程度来决定投资的金额。用户应了解和理解数字资产会产生衍生风险，所以如有任何疑问，建议先寻求理财顾问的协助。此外，除了上述提及过的风险以外，还会有未能预测的风险存在。
+    </p>  
+    <p>
+      4 、用户应慎重考虑并用清晰的判断能力去评估自己的财政状况及上述各项风险而作出任何买卖数字资产的决定，并承担由此产生的全部损失，FX66对此不承担任何责任。
+    </p>
+    <p>
+      5 、用户了解FX66仅作为用户获取数字资产信息、寻找交易方、就数字资产的交易进行协商及开展交易的场所，FX66不参与用户的任何交易，故用户应自行谨慎判断确定相关数字资产及/或信息的真实性、合法性和有效性，并自行承担因此产生的责任与损失。
+    </p> 
+    <p>
+      6、 FX66的任何意见、消息、探讨、分析、价格、建议和其他资讯均是一般的市场评论，并不构成投资建议。FX66不承担任何因依赖该资讯直接或间接而产生的损失，包括但不限于任何利润损失。
+    </p>  
+    <p>
+       7、FX66的内容会随时更改并不作另行通知，FX66已采取合理措施确保网站资讯的准确性，但并不能保证其准确性程度，亦不会承担任何因FX66的资讯或因未能链结互联网、传送或接收任何通知和信息时的延误或失败而直接或间接产生的损失。
+    </p>  
+    <p>
+      8、使用互联网形式的交易系统亦存有风险，包括但不限于软件，硬件和互联网链结的失败等。由于FX66不能控制互联网的可靠性和可用性，FX66不会对失真，延误和链结失败而承担任何责任。
+    </p>
+    <h4 class="part-name">二、反洗钱：</h4>
+    <p>    
+      为了维护金融稳定，防范洗钱风险。FXEE将严格遵循相关法律，严格实行账户实名制，防范可能存在的金融风险。
+    </p>
+    <p>   
+      1、FXEE遵守和执行反洗钱法的规定，对用户进行身份识别、客户身份资料和交易记录保存制度，以及大额的和可疑交易报告的制度。
+    </p>
+    <p>
+      2、用户注册、挂失交易密码或者资金密码时，应当提供并上传身份证复印件，FXEE对用户提供的身份证信息进行识别和比对。FXEE有合理的理由怀疑用户使用虚假身份注册时，有权拒绝注册或者注销已经注册的账户。
+    </p>
+    <p>
+      3、FXEE参照《金融机构大额交易和可疑交易报告管理办法》的规定，保存大额交易和有洗钱嫌疑的交易记录，在监管机构要求提供大额交易和可疑交易的记录时，向监管机构提供。
+    </p>  
+    <p>
+      4、FXEE对用户身份信息以及大额交易、可疑交易记录进行保存，依法协助、配合司法机关和行政执法机关打击洗钱活动，依照法律法规的规定协助司法机关、海关、税务等部门查询、冻结和扣划客户存款。
+    </p>
+    <p>
+      5、用户需要承诺在FXEE注册的账户为本人操作，提供的所有证件，信息均真实有效。若在验证账户时发现提供的信息为虚假， 伪造或拒绝，虚假陈述资金来源及去向等，FXEE有权在不通知用户的情况下冻结账户，并向公安机关举报。
+    </p>
+    <h4 class="part-name">三、免责声明：</h4>
+    <p>  
+      1、FXEE提供的信息（包括且不限于币种介绍、投资分析报告、预测文章信息及其他评论、数据、图表、指标、理论、直接的或暗示的指示）等仅供参考，FXEE力求但不保证信息的准确性、完整。FXEE不对因使用本网站全部或部分内容产生的或因依赖本网站内容而引致的任何损失承担任何责任。
+    </p>
+    <p> 
+      2、FXEE可能提供部分与其他网站的链接，前述链接仅为方便您的使用，FXEE不对所链接网站的信息的真实性、有效性、合法性承担任何责任。
+    </p>
+    <p>
+      3、通过FXEE服务购买或获取任何数据、信息或进行交易等行为或替代行为产生的费用及损失，包括但不限于收入损失，交易利润或合同损失，业务中断，预期可节省的货币的损失， 信息的损失，机会、商誉或声誉的损失，数据的损坏或损失，购买替代产品或服务的成本，数字资产消亡或退出市场，任何由于侵权（包括过失）、违约或其他任何原因产生的间接的、特殊的或附带性的损失或损害。
+    </p>  
+    <p>
+      4、不论在何种情况下，FXEE均不对由于信息网络正常的设备维护，信息网络连接故障，电脑、通讯或其他系统的故障，电力故障，罢工，劳动争议，暴乱，起义，骚乱，生产力或生产资料不足，火灾，洪水，风暴，爆炸，战争，政府行为，司法行政机关的命令或第三方的不作为而造成的不能服务或延迟服务承担责任。
+    </p>
+    <p>
+      5、基于互联网的特殊性，FXEE不担保服务不会受中断，对服务的及时性、安全性都不作担保。FXEE力图使用户能对本网站进行安全访问和使用，但FXEE不能保证FXEE包含的全部信息、程序、文本等完全安全，不受任何病毒、木马等恶意程序的干扰和破坏，故用户登陆、使用FXEE任何服务或下载及使用该下载的任何程序、信息、数据等均是用户个人的决定并自行承担风险及可能产生的损失。
+    </p> 
+    <p>
+      6、基于区块链交易平台的特殊性，FXEE力图确保平台 365*24 小时保持在线。但FXEE不能保证因 DDoS 攻击、服务器供应商暂停服务、网络供应商暂停服务或其他不可抗力等原因造成网站无法访问，交易大厅无法正常挂单、撤单，已挂单交易未能正常成交，区块链资产充提币长时间未到账等情况。由于以上原因造成用户资产损失的情况，FXEE不承担任何责任。
+    </p>  
+    <p>
+      7、用户有义务妥善保管好用户名和密码。通过用户的用户名和密码编辑、发布的任何信息或做出的任何行为都将被视为是用户自己的行为，对因此产生的任何损失FXEE不承担任何责任。
+    </p>  
+    <p>
+      8、任何非因FXEE的原因而引起的与FXEE服务有关的其它损失。
+    </p>
+    <p>
+      数字货币可能存在矿工预挖、庄家操控、团队解散、技术缺陷等问题，其价格波动较大，可能发生资产归零的风险。因此我们强烈建议您在自身能承受的风险范围内参与数字货币交易。请注意止盈止损，合理评估风险，请勿投入高于个人承受能力的金额！ 最终解释权归FXEE所有。FXEE感谢有您的陪伴！
+    </p>
+  </div>
+</template>
+
+<style>
+.statement-public{
+  text-align: left;
+  background-color: #f6f6f6;
+  padding: 30px;
+  height: 500px;
+  overflow: auto;
+  h4{
+    font-size: 16px;
+    color: #165e8d;
+    line-height: 24px;
+  }
+  p{
+    line-height: 24px;
+  }
+  .part-name{
+    margin-top: 30px;
+  }
+}
+</style>

src/views/home/server-block.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="server-block">
+    <div class="tt-line">
+      <hr>
+      <h3>全方位 一站式服务</h3>
+      <hr>
+    </div>         
+    <h4 class="sub-title">All-around one-stop service</h4>
+    <ul class="serverList">
+      <li 
+        v-for="(item,index) in serverBlock" 
+        @mouseenter="showBtn3('serverBlock',1,index)" 
+        @mouseleave="showBtn3('serverBlock',0,index)">
+        <div class="item" v-show="item.state!==1">
+          <i class="iconfont" :class="item.icon"></i>
+        </div>
+        <div class="item2" v-show="item.state===1" v-html="item.text"></div>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default{
+  data(){
+    return{
+      serverBlock:[
+        {
+          icon:'icon-shandian',
+          text:"FX66具备一键交易功能，<br/>闪电交易，专业快捷!",
+          state:0,
+        },
+        {
+          icon:'icon-shouji',
+          text:"手机客户端，<br/>随时随地，紧跟市场!",
+          state:0,
+        },
+        {
+          icon:'icon-jiazhipinggu-',
+          text:"专业分析指导，<br/>价值评估市场!",
+          state:0,
+        },
+        {
+          icon:'icon-kefu1',
+          text:"新手帮帮帮，<br/>一小时教您炒币入门",
+          state:0,
+        },
+      ],
+    }
+  },
+  methods:{
+    showBtn3(key,val,index){
+      this[key][index].state=val;     
+    },
+  }
+}
+</script>

src/views/home/setPwdMail.vue

@@ -0,0 +1,170 @@
+<template>
+  <div class="set-pwd-mail">
+    <index-header></index-header>
+    <div class="content-box">
+      <div class="content-box-in">
+        <h2>修改密码</h2>
+        <div class="login-line">
+          <span><i class="iconfont icon-mima"></i></span>
+          <input class="input" v-model="setParam.password" type="password" placeholder="请输入您的新密码">
+        </div>
+        <div class="login-line">
+          <span><i class="iconfont icon-mima"></i></span>
+          <input class="input" v-model="setParam.password2" type="password" placeholder="请重复输入您的新密码">
+        </div>
+        <div class="btn-line">
+          <el-button :loading="setLoad" @click="reSetPwd">确定</el-button>
+        </div>
+      </div>
+      
+    </div>
+    <index-footer></index-footer>
+  </div>
+</template>
+
+<script>
+import indexHeader from "../../components/header.vue"
+import indexFooter from "../../components/footer.vue"
+import {ajax} from "../../assets/js/common.js"
+  export default{
+    data(){
+      return{
+        setParam:{
+          password:"",
+          password2:"",         
+        },
+        setLoad:false,
+        setToken:""
+      }
+    },
+    mounted(){
+      this.$nextTick(()=>{
+        let route=this.$route;
+        console.log(route);
+        this.setToken=route.query.resettoken;
+      })
+    },
+    methods:{
+      reSetPwd(){
+        if(this.setParam.password==""){
+          this.$notify({
+            title: '提示',
+            message: '请输入新密码',
+            type: 'warning',
+            duration:'1500'
+          })
+          return false;
+        }
+        if(this.setParam.password2==""){
+          this.$notify({
+            title: '提示',
+            message: '请再次输入新密码',
+            type: 'warning',
+            duration:'1500'
+          })
+          return false;
+        }
+        if(this.setParam.password!=this.setParam.password2){
+          this.$notify({
+            title: '提示',
+            message: '两次输入的密码不同',
+            type: 'warning',
+            duration:'1500'
+          })
+          return false;
+        }
+        let postdata = {
+          resettoken:this.setToken,
+          password:this.setParam.password,
+          password2:this.setParam.password2,
+          os:"web",
+          type:"email",
+        };
+        this.setLoad=true;
+        ajax(this,this.extendApi.resetPwd,postdata,(data)=>{
+          this.setLoad=false;
+          if(data.code==200){
+            this.$notify({
+              title: '提示',
+              message: '修改密码成功,请使用新密码登录',
+              type: 'success',
+              duration:'1500'
+            });
+            this.$router.push("/index");
+          }
+        },'post');
+      },
+    },
+    components:{
+      indexHeader,
+      indexFooter,
+    },
+  }
+</script>
+<style>
+  .set-pwd-mail{
+    .login-line{
+      width: 330px;
+      height: 50px;
+      line-height: 50px;
+      margin: 0 auto;
+      border:1px solid #dcdcdc;
+      text-align: left;
+      margin-bottom: 20px;
+      span{
+        display: inline-block;
+        width: 50px;
+        height: 50px;
+        text-align: center;
+        border-right: 1px solid #dcdcdc;
+        i{
+          font-size: 24px;
+          color: #ccc;
+        }
+      }
+      .input{
+        position: absolute;
+        margin-top: 10px;
+        padding-left: 10px;  
+        line-height: 30px;
+        border:0;
+        font-size: 14px;
+        width: 250px;
+      }
+    }
+    .content-box{
+      padding-top: 225px;
+      width: 900px;   
+      margin:0 auto 150px;
+      /*background-color: #fff;*/
+      h2{
+        height: 80px;
+        line-height: 80px;
+        font-size: 24px;
+        background-color: #1a5f9b;
+        color: #fff;
+        margin-bottom: 60px;
+      }
+      .btn-line{
+        margin-top: 50px;
+        width: 330px;
+        margin: 50px auto 0;
+        button{
+          width: 100%;
+          border: none;
+          background-color: #1a5f9b;
+          color: #fff;
+          border-radius: 0;
+          height: 50px;
+          line-height: 50px;
+          padding-top: 0;
+        }
+      }
+      &-in{
+        /*margin-top: 200px;*/
+        height: 400px;
+        background-color: #fff;
+      }
+    }
+  }
+</style>