|
|
@@ -9,15 +9,13 @@
|
|
|
<li class="clearfix">
|
|
|
<p>手机号：</p>
|
|
|
<div class="user_phone_box">
|
|
|
- <select class="countriesSerial" name="">
|
|
|
+ <select v-model="selected" class="countriesSerial" name="">
|
|
|
<template v-for="obj in countries">
|
|
|
- <option v-for="(item,index) in obj.list" :key="index" :value="item.id">{{item.code}}</option>
|
|
|
+ <!-- <option v-for="item in obj.list" v-if="item.id == 317" :value="item.code" disabled>{{item.code}}</option> -->
|
|
|
+ <option v-for="item in obj.list" :value="item.id">{{item.code}}</option>
|
|
|
</template>
|
|
|
|
|
|
</select>
|
|
|
- <!-- <select v-model="countryId" class="weui-select">
|
|
|
- <option v-for="country in countryList" v-bind:value="country.id">({{ country.code }}){{ country.name }}</option>
|
|
|
- </select> -->
|
|
|
<!-- <span class="area_code">+86</span>-->
|
|
|
<span class="triangle-down"/>
|
|
|
<span class="phone_line"/>
|
|
|
@@ -42,21 +40,21 @@
|
|
|
|
|
|
<script>
|
|
|
// 获取国家区号
|
|
|
-import Vue from 'vue'
|
|
|
import apis from '@/common/api.js'
|
|
|
import net from '@/common/net.js'
|
|
|
import utils from '@/common/utils.js'
|
|
|
-import { Toast } from 'mint-ui'
|
|
|
+import { Toast, Indicator } from 'mint-ui'
|
|
|
|
|
|
export default {
|
|
|
name: 'Login',
|
|
|
data () {
|
|
|
return {
|
|
|
+ selected: '317',
|
|
|
countries: [],
|
|
|
parms: {
|
|
|
phone: '',
|
|
|
name: '',
|
|
|
- address: ''
|
|
|
+ code: ''
|
|
|
},
|
|
|
timer: '获取验证码'
|
|
|
}
|
|
|
@@ -72,6 +70,7 @@ export default {
|
|
|
},
|
|
|
mounted () {
|
|
|
this.loadCountries()
|
|
|
+ console.log(this.selected)
|
|
|
},
|
|
|
methods: {
|
|
|
hideLogin: function () {
|
|
|
@@ -81,57 +80,67 @@ export default {
|
|
|
event.stopPropagation()
|
|
|
},
|
|
|
getCodeBtn () {
|
|
|
- let tm = 5
|
|
|
- let that = this
|
|
|
- that.timer = tm
|
|
|
- setInterval(function () {
|
|
|
- if (that.timer > 0) {
|
|
|
- that.timer--
|
|
|
- if (that.timer == 0) {
|
|
|
- that.timer = '获取验证码'
|
|
|
- return false
|
|
|
- }
|
|
|
+ let params = {}
|
|
|
+ params.url = apis.sms_send
|
|
|
+ params.data = {
|
|
|
+ mobile: this.parms.phone,
|
|
|
+ prefix: this.selected
|
|
|
+ }
|
|
|
+ params.method = 'POST'
|
|
|
+ net.req(params).then((data) => {
|
|
|
+ if (data.code == 0) {
|
|
|
+ let tm = 5
|
|
|
+ let that = this
|
|
|
+ that.timer = tm
|
|
|
+ setInterval(function () {
|
|
|
+ if (that.timer > 0) {
|
|
|
+ that.timer--
|
|
|
+ if (that.timer == 0) {
|
|
|
+ that.timer = '获取验证码'
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 1000)
|
|
|
}
|
|
|
- }, 1000)
|
|
|
+ }, (e) => {
|
|
|
+ console.log(111, e)
|
|
|
+ })
|
|
|
},
|
|
|
login () {
|
|
|
var reg = /^((13|14|15|17|18)[0-9]{1}\d{8})$/
|
|
|
if (!this.parms.name) {
|
|
|
Toast('请输入姓名')
|
|
|
- return
|
|
|
+ return false
|
|
|
}
|
|
|
|
|
|
if (!this.parms.phone) {
|
|
|
Toast('请输入手机号码')
|
|
|
return false
|
|
|
}
|
|
|
- if (!reg.test(this.parms.phone)) {
|
|
|
- console.log(typeof this.parms.phone)
|
|
|
- Toast('手机格式不正确')
|
|
|
- return false
|
|
|
- }
|
|
|
+ // if (!reg.test(this.parms.phone)) {
|
|
|
+ // // console.log(typeof this.parms.phone)
|
|
|
+ // Toast('手机格式不正确')
|
|
|
+ // return false
|
|
|
+ // }
|
|
|
if (!this.parms.code) {
|
|
|
Toast('请输入验证码')
|
|
|
return false
|
|
|
}
|
|
|
let params = {}
|
|
|
- params.url = apis.login
|
|
|
+ params.url = apis.sms_login
|
|
|
params.data = {
|
|
|
- mobile: '13263287080',
|
|
|
- cityId: '317'
|
|
|
- // prefix: $('#cityId').val()
|
|
|
- // type: '10000',
|
|
|
- // showType: 'mobile',
|
|
|
- // beautiful: true,
|
|
|
- // order: '0',
|
|
|
- // pageSize: '20',
|
|
|
- // page: '1'
|
|
|
+ mobile: this.parms.phone,
|
|
|
+ prefix: this.selected,
|
|
|
+ name: this.parms.name,
|
|
|
+ code: this.parms.code
|
|
|
}
|
|
|
params.method = 'POST'
|
|
|
net.req(params).then((data) => {
|
|
|
if (data.code == 0) {
|
|
|
- console.log(data)
|
|
|
- // this.list = data.data.list
|
|
|
+ // console.log(data)
|
|
|
+
|
|
|
+ utils.storage.save('userToken', data.data.token)
|
|
|
+ this.$emit('onLogin')
|
|
|
}
|
|
|
}, (e) => {
|
|
|
console.log(111, e)
|
|
|
@@ -146,145 +155,31 @@ export default {
|
|
|
path: '/Home'
|
|
|
})
|
|
|
} */
|
|
|
-
|
|
|
- this.$emit('onLogin')
|
|
|
},
|
|
|
-
|
|
|
+ // 请求国家的手机号前缀
|
|
|
loadCountries: function () {
|
|
|
- // let params = {}
|
|
|
- // params.url = apis.get_prefix2
|
|
|
- // params.data = {
|
|
|
- // t: 'wap',
|
|
|
- // c: 'phone',
|
|
|
- // l: 'cn',
|
|
|
- // v: '3.1.3',
|
|
|
- // apiVersion: 2,
|
|
|
- // sign: null
|
|
|
- // }
|
|
|
- // params.method = 'get'
|
|
|
- // net.req(params).then((data) => {
|
|
|
- // Indicator.close() // mint ui
|
|
|
- // let {code} = data
|
|
|
- // if (parseInt(code) == 0) {
|
|
|
- // console.log(data)
|
|
|
- // this.countries = data.data
|
|
|
- // this.showLogin = true
|
|
|
- // }
|
|
|
- // }, (e) => {
|
|
|
- // Indicator.close() // mint ui
|
|
|
- // console.log(111, e)
|
|
|
- // })
|
|
|
- // Indicator.open({
|
|
|
- // text: 'Loading...',
|
|
|
- // spinnerType: 'fading-circle'
|
|
|
- // })
|
|
|
+ let params = {}
|
|
|
+ params.url = apis.get_prefix
|
|
|
+ params.data = {
|
|
|
+ t: 'wap'
|
|
|
+ }
|
|
|
+ params.method = 'get'
|
|
|
+ net.req(params).then((data) => {
|
|
|
+ Indicator.close() // mint ui
|
|
|
+ let {code} = data
|
|
|
+ if (parseInt(code) == 0) {
|
|
|
+ this.countries = data.data
|
|
|
+ this.showLogin = true
|
|
|
+ }
|
|
|
+ }, (e) => {
|
|
|
+ Indicator.close() // mint ui
|
|
|
+ console.log(111, e)
|
|
|
+ })
|
|
|
+ Indicator.open({
|
|
|
+ text: 'Loading...',
|
|
|
+ spinnerType: 'fading-circle'
|
|
|
+ })
|
|
|
console.log('请求国家编号')
|
|
|
- this.countries = [{
|
|
|
- 'name': 'A',
|
|
|
- 'list': [{
|
|
|
- 'id': '3',
|
|
|
- 'name': '澳大利亚',
|
|
|
- 'code': '+61'
|
|
|
- }, {
|
|
|
- 'id': '767',
|
|
|
- 'name': '爱尔兰',
|
|
|
- 'code': '+353'
|
|
|
- }, {
|
|
|
- 'id': '834',
|
|
|
- 'name': '阿根廷',
|
|
|
- 'code': '+54'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'B',
|
|
|
- 'list': [{
|
|
|
- 'id': '836',
|
|
|
- 'name': '巴西',
|
|
|
- 'code': '+55'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'D',
|
|
|
- 'list': [{
|
|
|
- 'id': '785',
|
|
|
- 'name': '德国',
|
|
|
- 'code': '+0049'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'H',
|
|
|
- 'list': [{
|
|
|
- 'id': '343',
|
|
|
- 'name': '韩国',
|
|
|
- 'code': '+82'
|
|
|
- }, {
|
|
|
- 'id': '835',
|
|
|
- 'name': '荷兰',
|
|
|
- 'code': '+31'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'J',
|
|
|
- 'list': [{
|
|
|
- 'id': '4',
|
|
|
- 'name': '加拿大',
|
|
|
- 'code': '+1'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'M',
|
|
|
- 'list': [{
|
|
|
- 'id': '1',
|
|
|
- 'name': '美国',
|
|
|
- 'code': '+1'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'P',
|
|
|
- 'list': [{
|
|
|
- 'id': '786',
|
|
|
- 'name': '葡萄牙',
|
|
|
- 'code': '+351'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'R',
|
|
|
- 'list': [{
|
|
|
- 'id': '757',
|
|
|
- 'name': '日本',
|
|
|
- 'code': '+81'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'X',
|
|
|
- 'list': [{
|
|
|
- 'id': '5',
|
|
|
- 'name': '新西兰',
|
|
|
- 'code': '+64'
|
|
|
- }, {
|
|
|
- 'id': '730',
|
|
|
- 'name': '新加坡',
|
|
|
- 'code': '+65'
|
|
|
- }, {
|
|
|
- 'id': '833',
|
|
|
- 'name': '西班牙',
|
|
|
- 'code': '+34'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'Y',
|
|
|
- 'list': [{
|
|
|
- 'id': '2',
|
|
|
- 'name': '英国',
|
|
|
- 'code': '+44'
|
|
|
- }, {
|
|
|
- 'id': '339',
|
|
|
- 'name': '印度',
|
|
|
- 'code': '+888'
|
|
|
- }]
|
|
|
- }, {
|
|
|
- 'name': 'Z',
|
|
|
- 'list': [{
|
|
|
- 'id': '317',
|
|
|
- 'name': '中国',
|
|
|
- 'code': '+86'
|
|
|
- }]
|
|
|
- }]
|
|
|
- // console.log(this.countries[0].name) // 这个可以取到，但是俺找个这个格式写在页面上，说 Error in render: "TypeError: Cannot read property '0' of undefined"
|
|
|
-
|
|
|
- // console.log(this.countries.name) // 这样 直接就是 取不到
|
|
|
- // console.log(this.countries.name) // 这样 直接就是 取不到
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -350,7 +245,7 @@ export default {
|
|
|
|
|
|
}
|
|
|
.ct li input.user_phone {
|
|
|
- padding: 0.285rem 0 0.285rem 1.9rem;
|
|
|
+ padding: 0.285rem 0 0.285rem 2.5rem;
|
|
|
background: url(../assets/login/border_circle.png) no-repeat center center;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
@@ -401,7 +296,7 @@ export default {
|
|
|
width: 0.04rem;
|
|
|
height: 0.75rem;
|
|
|
position: absolute;
|
|
|
- left: 1.85rem;
|
|
|
+ left: 2.3rem;
|
|
|
top: .56rem;
|
|
|
display: inline-block;
|
|
|
}
|
|
|
@@ -415,7 +310,7 @@ export default {
|
|
|
}
|
|
|
.triangle-down {
|
|
|
position: absolute;
|
|
|
- left: 1.35rem;
|
|
|
+ left: 1.8rem;
|
|
|
top: .83rem;
|
|
|
width: 0;
|
|
|
height: 0;
|
|
|
@@ -425,7 +320,6 @@ border-top: 0.3rem solid #000000;
|
|
|
}
|
|
|
.countriesSerial {
|
|
|
position: absolute;
|
|
|
- left: .2rem;
|
|
|
top: .32rem;
|
|
|
font-size: 0.6rem;
|
|
|
color: #000000;
|
|
|
@@ -435,5 +329,8 @@ border-top: 0.3rem solid #000000;
|
|
|
line-height: 1.32rem;
|
|
|
width: 1.5rem;
|
|
|
border: none;
|
|
|
+ -webkit-appearance: none;
|
|
|
+ -moz-appearance: none;
|
|
|
+ outline: none;
|
|
|
}
|
|
|
</style>
|
huyajie
