Commit 3032a8ac authored by Junling Bu's avatar Junling Bu
Browse files

chore[litemall-vue]: 调整代码

parent 8abfce1b
...@@ -13,19 +13,16 @@ ...@@ -13,19 +13,16 @@
"build:prod": "vue-cli-service build --mode production", "build:prod": "vue-cli-service build --mode production",
"lint": "vue-cli-service lint" "lint": "vue-cli-service lint"
}, },
"dependencies": { "dependencies": {
"@chenfengyuan/vue-countdown": "^1.1.2", "@chenfengyuan/vue-countdown": "^1.1.2",
"axios": "^0.18.0", "axios": "^0.18.0",
"dayjs": "^1.7.7", "dayjs": "^1.7.7",
"js-md5": "^0.7.3", "js-cookie": "2.2.0",
"lodash": "^4.17.11", "lodash": "^4.17.11",
"vant": "^1.6.15", "vant": "^1.6.15",
"vee-validate": "^2.1.4",
"vue": "^2.5.17", "vue": "^2.5.17",
"js-cookie": "2.2.0",
"vue-router": "^3.0.1", "vue-router": "^3.0.1",
"vuelidation": "^1.1.0" "vuelidate": "^0.7.4"
}, },
"devDependencies": { "devDependencies": {
"@vue/cli-plugin-babel": "^3.0.5", "@vue/cli-plugin-babel": "^3.0.5",
...@@ -43,4 +40,4 @@ ...@@ -43,4 +40,4 @@
"last 2 versions", "last 2 versions",
"not ie <= 8" "not ie <= 8"
] ]
} }
\ No newline at end of file
...@@ -50,7 +50,7 @@ export function authInfo() { ...@@ -50,7 +50,7 @@ export function authInfo() {
method: 'get' method: 'get'
}) })
} }
const AuthProfile='wx/auth/profile'; //验证码 const AuthProfile='wx/auth/profile'; //账号修改
export function authProfile(data) { export function authProfile(data) {
return request({ return request({
url: AuthProfile, url: AuthProfile,
...@@ -67,7 +67,7 @@ export function authReset(data) { ...@@ -67,7 +67,7 @@ export function authReset(data) {
data data
}) })
} }
const AuthRegisterCaptcha='wx/auth/regCaptcha'; //验证码 const AuthRegisterCaptcha='wx/auth/regCaptcha'; //注册验证码
export function authRegisterCaptcha(data) { export function authRegisterCaptcha(data) {
return request({ return request({
url: AuthRegisterCaptcha, url: AuthRegisterCaptcha,
...@@ -75,7 +75,14 @@ export function authRegisterCaptcha(data) { ...@@ -75,7 +75,14 @@ export function authRegisterCaptcha(data) {
data data
}) })
} }
const AuthBindPhone='wx/auth/bindPhone'; //绑定微信手机号 const AuthCaptcha='wx/auth/captcha'; //验证码
export function authCaptcha(data) {
return request({
url: AuthCaptcha,
method: 'post',
data
})
}
const GoodsCount='wx/goods/count'; //统计商品总数 const GoodsCount='wx/goods/count'; //统计商品总数
export function goodsCount() { export function goodsCount() {
......
...@@ -5,19 +5,13 @@ import 'vant/lib/icon/local.css'; ...@@ -5,19 +5,13 @@ import 'vant/lib/icon/local.css';
import '@/assets/scss/global.scss'; import '@/assets/scss/global.scss';
import '@/assets/scss/iconfont/iconfont.css'; import '@/assets/scss/iconfont/iconfont.css';
import VeeValidate, { Validator } from 'vee-validate';
import VueCountdown from '@chenfengyuan/vue-countdown'; import VueCountdown from '@chenfengyuan/vue-countdown';
import zhCN from 'vee-validate/dist/locale/zh_CN';
import filters from '@/filter'; import filters from '@/filter';
Vue.component(VueCountdown.name, VueCountdown); Vue.component(VueCountdown.name, VueCountdown);
Vue.use(filters); Vue.use(filters);
Validator.localize('zh-CN', zhCN);
Vue.use(VeeValidate, {
locale: 'zh-CN'
});
import { Lazyload, Icon, Cell, CellGroup, loading, Button, Toast } from 'vant'; import { Lazyload, Icon, Cell, CellGroup, loading, Button, Toast } from 'vant';
Vue.use(Icon); Vue.use(Icon);
......
...@@ -7,7 +7,6 @@ const UserHelp = () => import('@/views/user/module-help'); ...@@ -7,7 +7,6 @@ const UserHelp = () => import('@/views/user/module-help');
const UserFeedback = () => import('@/views/user/module-feedback'); const UserFeedback = () => import('@/views/user/module-feedback');
const UserInformation = () => import('@/views/user/user-information-set'); const UserInformation = () => import('@/views/user/user-information-set');
const UserInfo_SetBg = () => import('@/views/user/user-information-set/set-bg');
const UserInfo_SetMobile = () => import('@/views/user/user-information-set/set-mobile'); const UserInfo_SetMobile = () => import('@/views/user/user-information-set/set-mobile');
const UserInfo_SetNickname = () => import('@/views/user/user-information-set/set-nickname'); const UserInfo_SetNickname = () => import('@/views/user/user-information-set/set-nickname');
const UserInfo_SetPassword = () => import('@/views/user/user-information-set/set-password'); const UserInfo_SetPassword = () => import('@/views/user/user-information-set/set-password');
...@@ -75,11 +74,6 @@ export default [ ...@@ -75,11 +74,6 @@ export default [
}, },
component: UserInformation component: UserInformation
}, },
{
path: '/user/information/setbg',
name: 'user-info-setbg',
component: UserInfo_SetBg
},
{ {
path: '/user/information/setMobile', path: '/user/information/setMobile',
name: 'user-info-setMobile', name: 'user-info-setMobile',
......
<template>
<van-cell-group>
<van-cell>
<van-notice-bar
:text="notice"
background="white"
:leftIcon="trumpet"
style="padding-left: 0"
/>
</van-cell>
<van-cell :title="address" icon="dingwei" isLink :url="mapSrc"></van-cell>
<van-cell icon="phone" isLink>
<template slot="title">
<a :href="'tel:' + mobile" class="store_mobile">{{mobile}}</a>
</template>
</van-cell>
</van-cell-group>
</template>
<script>
import { NoticeBar } from 'vant';
import trumpet from '@/assets/images/trumpet.png';
export default {
name: 'shop-info-group',
props: {
address: {
type: String,
required: true
},
mobile: {
type: String,
required: true
},
notice: {
type: String,
default: ''
},
location: Object
},
data() {
const { location } = this;
const MAP_PATH = `http://m.amap.com/navi/?dest=${location.lat},${
location.lng
}&key=ab67b14d58d47912a9feb63ba862450c&destName=${location.name}`;
return {
trumpet,
mapSrc: location ? MAP_PATH : '#'
};
},
created() {},
components: {
[NoticeBar.name]: NoticeBar
}
};
</script>
<style lang="scss" scoped>
.store_mobile {
color: #0000a0;
text-decoration: underline;
}
</style>
<template>
<div class="signboard">
<img :src="boardUrl" :height="signboardHeight" width="100%">
<div class="store_opacity clearfix">
<div class="float-l">{{storeName}}</div>
<div class="float-r store_collect isCollect" @click="showCollect = true">
<van-icon name="shoucang-full" />
<span>收藏</span>
</div>
</div>
<van-popup v-model="showCollect" position="top" style="background-color: transparent">
<img :src="showCollect && collectImg" @click="showCollect = false" width="100%" alt="右上角收藏">
</van-popup>
</div>
</template>
<script>
import { Popup } from 'vant';
import collectImg from '@/assets/images/index_collect.png';
export default {
name: 'sign-board',
props: {
boardUrl: {
type: String,
required: true
},
storeName: {
type: String,
required: true
}
},
data() {
const clientW =
document.body.clientWidth || document.documentElement.clientWidth;
const signboardHeight = clientW ? (clientW * 2) / 3 : 250;
return {
signboardHeight,
showCollect: false,
collectImg
};
},
components: {
[Popup.name]: Popup
}
};
</script>
<style lang="scss" scoped>
.signboard {
position: relative;
min-height: 250px;
}
.store_opacity {
position: absolute;
bottom: 0;
color: #fff;
width: 100%;
background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
padding: 15px 10px;
box-sizing: border-box;
}
.isCollect i {
color: $red;
}
</style>
...@@ -13,7 +13,6 @@ ...@@ -13,7 +13,6 @@
icon="username" icon="username"
placeholder="请输入测试账号 user123" placeholder="请输入测试账号 user123"
right-icon="clear-full" right-icon="clear-full"
v-validate="'required'"
name="user" name="user"
data-vv-as="帐号" data-vv-as="帐号"
@right-click="clearText" @right-click="clearText"
...@@ -25,7 +24,6 @@ ...@@ -25,7 +24,6 @@
placeholder="请输入测试密码 user123" placeholder="请输入测试密码 user123"
:type="visiblePass ? 'text' : 'password'" :type="visiblePass ? 'text' : 'password'"
:right-icon="visiblePass ? 'eye-open' : 'eye-close'" :right-icon="visiblePass ? 'eye-open' : 'eye-close'"
v-validate="'required'"
data-vv-as="密码" data-vv-as="密码"
name="password" name="password"
@right-click="visiblePass = !visiblePass" @right-click="visiblePass = !visiblePass"
...@@ -82,13 +80,8 @@ export default { ...@@ -82,13 +80,8 @@ export default {
this.account = ''; this.account = '';
}, },
async validate() { validate() {
const result = await this.$validator.validate();
if (!result) {
const errMsg = this.errors.items[0].msg;
Toast(errMsg);
throw new Error(`表单验证: ${errMsg}`);
}
}, },
login() { login() {
...@@ -96,19 +89,22 @@ export default { ...@@ -96,19 +89,22 @@ export default {
authLoginByAccount(loginData).then(res => { authLoginByAccount(loginData).then(res => {
this.userInfo = res.data.data.userInfo; this.userInfo = res.data.data.userInfo;
setLocalStorage({ setLocalStorage({
Authorization: res.data.data.token Authorization: res.data.data.token,
avatar: this.userInfo.avatarUrl,
nickName: this.userInfo.nickName
}); });
this.getUserProfile();
this.routerRedirect();
}).catch(error => { }).catch(error => {
Toast.fail(error.data.errmsg); Toast.fail(error.data.errmsg);
}); });
}, },
async loginSubmit() { loginSubmit() {
this.isLogining = true; this.isLogining = true;
try { try {
await this.validate(); this.validate();
await this.login(); this.login();
this.isLogining = false; this.isLogining = false;
} catch (err) { } catch (err) {
console.log(err.message); console.log(err.message);
...@@ -116,19 +112,6 @@ export default { ...@@ -116,19 +112,6 @@ export default {
} }
}, },
getUserProfile() {
// const {
// data: { data }
// } = await this.$reqGet(USER_PROFILE);
setLocalStorage({
avatar: this.userInfo.avatarUrl,
// background_image: data.background_image,
nickName: this.userInfo.nickName
});
this.routerRedirect();
},
routerRedirect() { routerRedirect() {
// const { query } = this.$route; // const { query } = this.$route;
// this.$router.replace({ // this.$router.replace({
......
...@@ -41,7 +41,6 @@ ...@@ -41,7 +41,6 @@
import { Radio, RadioGroup, Dialog } from 'vant'; import { Radio, RadioGroup, Dialog } from 'vant';
import { orderDetail, orderPrepay } from '@/api/api'; import { orderDetail, orderPrepay } from '@/api/api';
import _ from 'lodash'; import _ from 'lodash';
import md5 from 'js-md5';
export default { export default {
name: 'payment', name: 'payment',
......
...@@ -39,20 +39,14 @@ export default { ...@@ -39,20 +39,14 @@ export default {
getUserInfo() { getUserInfo() {
const infoData = getLocalStorage( const infoData = getLocalStorage(
'nickName', 'nickName',
'background_image',
'avatar' 'avatar'
); );
this.avatar = avatar_default; this.avatar = avatar_default;
this.nickName = infoData.nickName || '昵称'; this.nickName = infoData.nickName || '昵称';
this.background_image = infoData.background_image || bg_default;
}, },
toSetting() { toSetting() {
this.$router.push({ name: 'user-information' }); this.$router.push({ name: 'user-information' });
} }
// toLogin() {
// !this.isLogin &&
// this.$router.push({ name: 'login', query: { redirect: 'user' } });
// }
} }
}; };
</script> </script>
......
...@@ -31,12 +31,6 @@ export default { ...@@ -31,12 +31,6 @@ export default {
methods: { methods: {
quit() { quit() {
authLogout(); authLogout();
removeLocalStorage(
'Authorization',
'avatar',
'background_image',
'nickName'
);
this.$router.push({ name: 'login' }); this.$router.push({ name: 'login' });
}, },
getLoginStatus() { getLoginStatus() {
......
...@@ -14,16 +14,10 @@ ...@@ -14,16 +14,10 @@
</van-uploader> </van-uploader>
</van-cell> </van-cell>
<!-- <van-cell title="背景图" to="/user/information/setbg" isLink></van-cell> --> <van-cell title="昵称" to="/user/information/setNickname" :value="nickName" isLink/>
<!-- <van-cell title="昵称" to="/user/information/setNickname" :value="nickName" isLink/> --> <van-cell title="性别" :value="genderText" @click="showSex = true" isLink/>
<!-- <van-cell title="性别" :value="genderText" @click="showSex = true" isLink/> --> <van-cell title="密码设置" to="/user/information/setPassword" isLink/>
<!-- <van-cell title="密码设置" to="/user/information/setPassword" isLink/> --> <van-cell title="手机号" to="/user/information/setMobile" :value="mobile" isLink></van-cell>
<!-- <van-cell title="手机号" to="/user/information/setMobile" :value="mobile" isLink></van-cell> -->
<van-cell title="背景图" isLink></van-cell>
<van-cell title="昵称" :value="nickName" isLink/>
<van-cell title="性别" isLink/>
<!-- <van-cell title="密码设置" to="/user/information/setPassword" isLink/> -->
<van-cell title="手机号" :value="mobile" isLink></van-cell>
</van-cell-group> </van-cell-group>
<van-button class="bottom_btn" @click="loginOut" type="primary" bottomAction>退出登录</van-button> <van-button class="bottom_btn" @click="loginOut" type="primary" bottomAction>退出登录</van-button>
<van-popup v-model="showSex" position="bottom"> <van-popup v-model="showSex" position="bottom">
...@@ -42,7 +36,7 @@ ...@@ -42,7 +36,7 @@
import { Uploader, Picker, Popup, Button } from 'vant'; import { Uploader, Picker, Popup, Button } from 'vant';
import { removeLocalStorage } from '@/utils/local-storage'; import { removeLocalStorage } from '@/utils/local-storage';
import { getLocalStorage } from '@/utils/local-storage'; import { getLocalStorage } from '@/utils/local-storage';
import { authLogout } from '@/api/api'; import { authInfo, authLogout, authProfile } from '@/api/api';
export default { export default {
data() { data() {
...@@ -56,7 +50,7 @@ export default { ...@@ -56,7 +50,7 @@ export default {
showSex: false, showSex: false,
avatar: '', avatar: '',
nickName: '', nickName: '',
gender: -1, gender: 0,
mobile: '' mobile: ''
}; };
}, },
...@@ -77,28 +71,18 @@ export default { ...@@ -77,28 +71,18 @@ export default {
console.log(file); console.log(file);
}, },
onSexConfirm(value, index) { onSexConfirm(value, index) {
this.showSex = false;
}, },
getUserInfo() { getUserInfo() {
const infoData = getLocalStorage( authInfo().then(res => {
'nickName', this.avatar = res.data.data.avatar;
'background_image', this.nickName = res.data.data.nickName;
'avatar' this.gender = res.data.data.gender;
); this.mobile = res.data.data.mobile;
// debugger; })
this.avatar = infoData.avatar;
this.nickName = infoData.nickName;
// this.gender = infoData.gender;
// this.mobile = infoData.mobile;
}, },
loginOut() { loginOut() {
authLogout(); authLogout();
removeLocalStorage(
'Authorization',
'avatar',
// 'background_image',
'nickName'
);
this.$router.push({ name: 'home' }); this.$router.push({ name: 'home' });
} }
}, },
......
<template>
<div>set mobile</div>
</template>
<script>
export default {};
</script>
...@@ -6,13 +6,13 @@ ...@@ -6,13 +6,13 @@
v-model="password" v-model="password"
type="password" type="password"
placeholder="请输入登录密码" placeholder="请输入登录密码"
:error="!!$vuelidation.error('password')" /> />
<van-field <van-field
label="新手机号" label="新手机号"
v-model="new_mobile" v-model="mobile"
placeholder="请输入新手机号" placeholder="请输入新手机号"
:error="!!$vuelidation.error('new_mobile')" /> />
<van-field <van-field
label="验证码" label="验证码"
...@@ -40,50 +40,40 @@ ...@@ -40,50 +40,40 @@
<script> <script>
import { authRegisterCaptcha } from '@/api/api'; import { authCaptcha } from '@/api/api';
import { Field } from 'vant'; import { Field } from 'vant';
export default { export default {
data: () => ({ data: () => ({
password: '', password: '',
new_mobile: '', mobile: '',
code: '', code: '',
counting: false counting: false
}), }),
vuelidation: {
data: {
password: {
required: true
},
new_mobile: {
required: true,
mobile: true
}
}
},
methods: { methods: {
getCode() { getCode() {
if (!this.counting && this.vuelidat()) { if (!this.counting && this.vuelidate()) {
authRegisterCaptcha({ authCaptcha({
mobile: this.new_mobile, mobile: this.mobile,
operation: 'changeMobile' type: 'bind-mobile'
}).then(() => { }).then(() => {
this.$toast.success('发送成功'); this.$toast.success('发送成功');
this.counting = true; this.counting = true;
}); }).catch(error => {
this.$toast.fail(error.data.errmsg);
this.counting = false;
})
} }
}, },
countdownend() { countdownend() {
this.counting = false; this.counting = false;
}, },
vuelidat() { vuelidate() {
this.$vuelidation.valid(); if(this.mobile === ''){
if (this.$vuelidation.error('new_mobile')) { this.$toast.fail('请输入号码');
const msg = this.$vuelidation.error('new_mobile');
this.$toast(msg == 'Required' ? '请输入手机号' : msg);
return false; return false;
} }
return true; return true;
......
<template> <template>
<div class="set_nickname"> <div class="set_nickname">
<van-cell-group> <van-cell-group>
<van-field v-model="nickName" label="昵称" :error="!!$vuelidation.error('nickName')"/> <van-field v-model="nickName" label="昵称"/>
</van-cell-group> </van-cell-group>
<div class="bottom_btn"> <div class="bottom_btn">
......
<template> <template>
<div> <div>
<van-cell-group> <van-cell-group>
<van-field
label="原密码"
v-model="password"
type="password"
placeholder="请输入原密码"
:error="!!$vuelidation.error('password')"
/>
<van-field <van-field
label="新密码" label="新密码"
v-model="new_password" v-model="password"
type="password" type="password"
placeholder="请输入新密码" placeholder="请输入新密码"
:error="!!$vuelidation.error('new_password')"
/> />
<van-field <van-field
label="确认密码" label="验证码"
v-model="repeat_password" v-model="code"
type="password" @click-icon="getCode"
placeholder="请再次输入密码" placeholder="请输入验证码">
:error="!!$vuelidation.error('repeat_password')"
/> <span slot="icon"
class="verifi_code red"
:class="{verifi_code_counting: counting}"
@click="getCode">
<countdown v-if="counting" :time="60000" @countdownend="countdownend">
<template slot-scope="props">{{ +props.seconds || 60 }}秒后获取</template>
</countdown>
<span v-else>获取验证码</span>
</span>
</van-field>
</van-cell-group> </van-cell-group>
<div class="bottom_btn"> <div class="bottom_btn">
...@@ -34,24 +35,25 @@ ...@@ -34,24 +35,25 @@
<script> <script>
import { authReset, authLogout } from '@/api/api'; import { authCaptcha, authReset, authLogout } from '@/api/api';
import { removeLocalStorage } from '@/utils/local-storage'; import { removeLocalStorage } from '@/utils/local-storage';
import { Field } from 'vant'; import { Field } from 'vant';
export default { export default {
data: () => ({ data: () => ({
password: '', password: '',
new_password: '', mobile: '',
repeat_password: '' code: '',
counting: false
}), }),
methods: { methods: {
modifypassword() { modifypassword() {
if (this.passwordValid()) { if (this.passwordValid()) {
authReset({ authReset({
old_password: this.password, password: this.password,
new_password: this.new_password mobile: this.mobile,
code: this.code
}) })
.then(() => { .then(() => {
this.$dialog.alert({ message: '保存成功, 请重新登录.' }) this.$dialog.alert({ message: '保存成功, 请重新登录.' })
...@@ -60,12 +62,28 @@ export default { ...@@ -60,12 +62,28 @@ export default {
} }
}, },
passwordValid() { passwordValid() {
if (this.new_password != this.repeat_password) {
this.$toast('密码不一致, 请再次确认密码');
return false;
}
return true; return true;
} },
getCode() {
if(this.mobile === ''){
this.$toast.fail('请输入号码');
return
}
if (!this.counting) {
authCaptcha({
mobile: this.mobile,
type: 'change-password'
}).then(() => {
this.$toast.success('发送成功');
this.counting = true;
}).catch(error => {
this.$toast.fail(error.data.errmsg);
this.counting = false;
})
}
},
}, },
components: { components: {
...@@ -74,8 +92,24 @@ export default { ...@@ -74,8 +92,24 @@ export default {
}; };
</script> </script>
<style scoped>
<style lang="scss" scoped>
@import '../../../../assets/scss/var';
@import '../../../../assets/scss/mixin';
.bottom_btn { .bottom_btn {
padding: 30px 15px 0 15px; padding: 30px 15px 0 15px;
} }
.verifi_code {
@include one-border;
padding-left: 10px;
&::after {
border-bottom: 0;
border-left: 1px solid $border-color;
}
&_counting {
color: $font-color-gray;
}
}
</style> </style>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment