前端:增加注册登陆

前端:个人信息修改
This commit is contained in:
YunaiV 2019-03-28 19:19:04 +08:00
parent 1900ccafe2
commit 366f7791fb
14 changed files with 272 additions and 70 deletions

View File

@ -22,6 +22,8 @@ export function getLoginToken() {
return res;
}
///
/// 设置 localStorage 公共方法
@ -40,3 +42,11 @@ function getLocalStorage(key) {
throw new Error(`localStorage 获取错误! ${e}`);
}
}
function removeLocalStorage(key) {
try {
localStorage.removeItem(key);
} catch (e) {
throw new Error(`localStorage 设置错误! ${e}`);
}
}

View File

@ -2,13 +2,19 @@ package cn.iocoder.mall.admin.application;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.ConfigurableApplicationContext;
@SpringBootApplication(scanBasePackages = {"cn.iocoder.mall.admin"})
//@EnableAdminServer
public class AdminApplication {
public static void main(String[] args) {
SpringApplication.run(AdminApplication.class, args);
ConfigurableApplicationContext ctx = SpringApplication.run(AdminApplication.class, args);
// Object bean = ctx.getBean("test");
// System.out.println(AopUtils.getTargetClass(bean));
// System.out.println(bean);
// ConfigurableApplicationContext ctx =
// System.out.println(); // TODO 后面去掉这里是临时的
}

View File

@ -28,7 +28,7 @@ import java.util.List;
import java.util.Set;
import java.util.stream.Collectors;
@Service
@Service("test")
@com.alibaba.dubbo.config.annotation.Service(validation = "true")
public class AdminServiceImpl implements AdminService {

View File

@ -75,8 +75,15 @@ export function getUserInfo() {
return request({
url: 'user-api/users/user/info',
method: 'get',
headers: {
test: 1,
});
}
export function doUserUpdateNickname(nickname) {
return request({
url: 'user-api/users/user/update_nickname',
method: 'post',
params: {
nickname,
}
});
}
@ -101,3 +108,4 @@ export function doPassportMobileSendRegisterCode(mobile) {
}
});
}

View File

@ -12,13 +12,13 @@ let dataSources='local';//local=本地,其他值代表非本地
if (process.env.NODE_ENV == 'development') {
baseUrl='';
baseUrl='http://127.0.0.1';
}else if(process.env.NODE_ENV == 'production'){
baseUrl = '';
baseUrl = 'http://http://180.167.213.26:18099';
}
baseUrl = 'http://127.0.0.1';
// baseUrl = 'http://127.0.0.1';
baseUrl = 'http://http://180.167.213.26:18099';
dataSources = 'remote';
// dataSources = 'local';

View File

@ -2,6 +2,7 @@ import axios from 'axios'
import {baseUrl, dataSources} from './env';
import datas from '../data/data';
import { getAccessToken } from '../utils/cache.js';
import { Dialog } from 'vant';
const service = axios.create({
baseURL: baseUrl, // api 的 base_url
@ -45,7 +46,15 @@ service.interceptors.request.use(
// config.headers['X-Token'] = getToken()
// }
debugger;
// debugger;
let url = config.url;
// TODO 芋艿,这些 url 不用增加认证 token 。可能这么写,有点脏,后面看看咋优化下。
if (url === 'user-api/users/passport/mobile/send_register_code'
|| url === 'user-api/users/passport/mobile/register') {
return config;
}
// debugger;
if (getAccessToken()) {
config.headers['Authorization'] = `Bearer ${getAccessToken()}`;
}
@ -71,12 +80,9 @@ service.interceptors.response.use(
response => {
// debugger;
const res = response.data;
if (res.code !== 0) {
// Message({
// message: res.message,
// type: 'error',
// duration: 5 * 1000
// })
const code = res.code;
if (code !== 0) {
// // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
// // 请自行在引入 MessageBox
@ -91,6 +97,32 @@ service.interceptors.response.use(
// })
// })
// }
// TODO token 过期
// TODO 需要拿 refresh token 置换
if (code === 1001001012) {
Dialog.confirm({
title: '系统提示',
message: res.message,
confirmButtonText: '重新登陆',
beforeClose: function (action, done) {
done();
if (action === 'confirm') {
// debugger;
// this.$router.push({ path: '/login' })
// TODO 跳转到登陆页.不是很优雅
location.replace('/#login');
}
}
});
} else {
Dialog.alert({
title: '系统提示',
message: res.message,
});
}
console.log(1);
return Promise.reject('error')
} else {

View File

@ -17,32 +17,32 @@ const routes = [
},
{
path: '/login',
component: () => import('../page/account/login'),
meta: {
title: '登录'
}
},
{
path: '/login/password',
component: () => import('../page/account/password'),
meta: {
title: '登录'
}
},
{
path: '/login/phone',
component: () => import('../page/account/phonelogin'),
meta: {
title: '手机号登录'
}
},
{
path: '/login/register',
component: () => import('../page/account/register'),
meta: {
title: '注册'
title: '登录'
}
},
// {
// path: '/login/password',
// component: () => import('../page/account/password'),
// meta: {
// title: '登录'
// }
// },
// {
// path: '/login/phone',
// component: () => import('../page/account/phonelogin'),
// meta: {
// title: '手机号登录'
// }
// },
// {
// path: '/login/register',
// component: () => import('../page/account/register'),
// meta: {
// title: '注册'
// }
// },
{
path: '/user/index',
component: () => import('../page/user/index'),
@ -56,7 +56,7 @@ const routes = [
component: () => import('../page/user/info/detail'),
name: 'user',
meta: {
title: '账号管理'
title: '个人信息'
}
},
{

View File

@ -5,9 +5,12 @@ import './config/rem';
import App from './App.vue';
import VueLazyload from 'vue-lazyload'
import components from './config/components.js';
import { Dialog } from 'vant';
Vue.use(components);
Vue.use(VueLazyload)
Vue.use(VueLazyload);
Vue.use(Dialog);
new Vue({
router,

View File

@ -1,31 +1,86 @@
<template>
<div>
<headerNav title="手机号登录"/>
<div style="background:url(https://haitao.nos.netease.com/f866dd18-12f0-4bb2-be6d-5cac85cf2627.png) center 18px no-repeat;background-size:161px;">
<div>
<div style="padding-top: 70px;">
<van-cell-group>
<van-field
placeholder="请输入手机号"
@input="inputMobile"
/>
<van-field
center
clearable
placeholder="请输入短信验证码"
@input="inputCode"
>
<van-button slot="button" size="small" type="primary">发送验证码</van-button>
<van-button slot="button" size="small" type="primary" @click="sendCode">发送验证码</van-button>
</van-field>
</van-cell-group>
<div style="margin: 10px;">
<van-button size="large" type="primary" style="height: 45px;line-height:45px;">登录</van-button>
<van-button size="large" type="primary" style="height: 45px;line-height:45px;" @click="submit">登录</van-button>
</div>
<div>1. 新注册的手机号验证后自动创建账户</div>
<div>2. 默认验证码是 9999</div>
</div>
</div>
</div>
</template>
<script>
import { doPassportMobileSendRegisterCode, doPassportMobileRegister } from '../../api/user';
import { Dialog } from 'vant';
import { setLoginToken } from '../../utils/cache';
export default {
data() {
return {
mobile: '',
code: '',
}
},
methods: {
inputMobile: function (value) {
this.mobile = value;
},
inputCode: function (value) {
this.code = value;
},
sendCode: function() {
if (!this.mobile || this.mobile.length !== 11) {
Dialog.alert({
title: '系统提示',
message: '手机号码不正确',
});
return;
}
let response = doPassportMobileSendRegisterCode(this.mobile);
response.then(data => {
Dialog.alert({
title: '系统提示',
message: '发送验证码成功',
});
});
},
submit: function () {
let that = this;
let response = doPassportMobileRegister(this.mobile, this.code);
response.then(data => {
setLoginToken(data.accessToken, data.refreshToken);
Dialog.alert({
title: '系统提示',
message: '登陆成功',
beforeClose: function (action, done) {
done();
// TODO callback
that.$router.push('/user/index');
}
});
});
}
}
}
</script>

View File

@ -165,14 +165,14 @@
</template>
<script>
import skuData from '../../data/sku';
// import skuData from '../../data/sku';
import { getProductSpuInfo } from '../../api/product';
export default {
components: {
},
data() {
this.skuData = skuData;
// this.skuData = skuData;
return {
spu: {}, //
vanSku: {
@ -191,21 +191,22 @@ export default {
},
attrValueMap: new Map(), //
show:false,
showTag:false,
goods: {
title: '【每日一粒益智又长高】 Lifeline Care 儿童果冻鱼油DHA维生素D3聪明长高 软糖 30粒 2件装',
subtitle:'【品牌直采】Q弹美味无腥味果冻鱼油每粒含足量鱼油DHA帮助视网膜和大脑健康发育让你的宝宝明眼又聪明同时补充400国际单位维生素D3强壮骨骼和牙齿。特含DPA让宝宝免疫力更强没病来扰。',
price: 2680,
market_price:9999,
express: '免运费',
remain: 19,
thumb: [
'https://img.yzcdn.cn/public_files/2017/10/24/e5a5a02309a41f9f5def56684808d9ae.jpeg',
'https://img.yzcdn.cn/public_files/2017/10/24/1791ba14088f9c2be8c610d0a6cc0f93.jpeg'
],
info:'<p style="text-align:center;"><img src="https://haitao.nosdn2.127.net/ac19460151ee4d95a6657202bcfc653c1531470912089jjjq8ml410763.jpg" ></p><p style="text-align:center;"><img src="https://haitao.nos.netease.com/2a91cfad22404e5498d347672b1440301531470912182jjjq8mnq10764.jpg" ></p><p style="text-align:center;"><img src="https://haitao.nos.netease.com/caddd5a213de4c1cb1347c267e8275731531470912412jjjq8mu410765.jpg" ></p>',
},
// show:false,
// showTag:false,
// goods: {
// title: ' Lifeline Care DHAD3 30 2',
// subtitle:'QDHA400D3齿DPA',
// price: 2680,
// market_price:9999,
// express: '',
// remain: 19,
// thumb: [
// 'https://img.yzcdn.cn/public_files/2017/10/24/e5a5a02309a41f9f5def56684808d9ae.jpeg',
// 'https://img.yzcdn.cn/public_files/2017/10/24/1791ba14088f9c2be8c610d0a6cc0f93.jpeg'
// ],
// info:'<p style="text-align:center;"><img src="https://haitao.nosdn2.127.net/ac19460151ee4d95a6657202bcfc653c1531470912089jjjq8ml410763.jpg" ></p><p style="text-align:center;"><img src="https://haitao.nos.netease.com/2a91cfad22404e5498d347672b1440301531470912182jjjq8mnq10764.jpg" ></p><p style="text-align:center;"><img src="https://haitao.nos.netease.com/caddd5a213de4c1cb1347c267e8275731531470912412jjjq8mu410765.jpg" ></p>',
// },
showBase: false, // sku
closeOnClickOverlay: true, //
hideStock: true, //

View File

@ -3,12 +3,12 @@
<div class="user-profile">
<div class="user-profile-avatar">
<a href="/#/user/info">
<img :src="data.Avatar" alt="用户头像">
<img :src="user && user.avatar ? user.avatar : 'http://static.iocoder.cn/1553652151601.jpg?imageView2/2/w/308/h/210/interlace/1/q/100'">
</a>
</div>
<div class="user-profile-username">
<a href="/#/user/info">
<span class="m-nick">{{data.UserName}}</span>
<span class="m-nick">{{user ? user.nickname : '未登陆'}}</span>
</a>
</div>
</div>
@ -75,7 +75,8 @@
</van-cell-group>
<van-cell-group>
<van-cell title="切换账号" is-link to="/login" />
<van-cell v-if="user" title="退出登录" @click="logout" />
<van-cell v-else title="登陆" is-link to="/login" />
</van-cell-group>
<navigate />
</div>
@ -83,18 +84,27 @@
<script>
// import { GetUserIndex } from "../../api/user.js";
import { getAccessToken } from '../../utils/cache.js';
import { getAccessToken, clearLoginToken } from '../../utils/cache.js';
import { getUserInfo } from '../../api/user.js';
export default {
data(){
return{
data: {},
user: {},
user: undefined,
}
},
components: {
},
methods: {
logout: function () {
// token
clearLoginToken();
// TODO token
//
this.$router.push('/login');
}
},
created:function(){
// GetUserIndex().then(response=>{
// this.data=response;

View File

@ -1,19 +1,83 @@
<template>
<div>
<headerNav title="账号管理"/>
<headerNav title="个人信息"/>
<van-cell-group>
<van-cell title="修改个人信息" is-link />
<!--<van-cell title="修改个人信息" is-link />-->
<!--<van-cell title="修改登录密码" is-link />-->
<!--<van-cell title="修改绑定手机" is-link />-->
<!--<van-cell title="关联账号" is-link />-->
<!--<van-cell title="切换账号" is-link to="/login" />-->
<van-cell title="昵称" :value="user.nickname" @click="onShowNicknameDialog" />
<van-cell title="头像" @click="onShowAvatarDialog" >
<img width="24px" :src="user.avatar" >
</van-cell>
</van-cell-group>
<!-- 昵称修改弹出 -->
<van-dialog
v-model="showNicknameDialog"
:before-close="onShowNicknameDialogClose"
show-cancel-button
>
<van-field
:value="user.nickname"
label="昵称"
placeholder="请输入昵称"
@input="inputNickname"
/>
</van-dialog>
<!---->
</div>
</template>
<script>
export default {
import { getUserInfo, doUserUpdateNickname } from '../../../api/user.js';
import { Dialog } from 'vant';
export default {
data() {
return {
user: {},
showNicknameDialog: false,
updateNickname: undefined,
};
},
methods: {
onShowNicknameDialog: function () {
this.showNicknameDialog = true;
this.updateNickname = this.user.nickname;
},
inputNickname: function (value) {
this.updateNickname = value;
},
onShowNicknameDialogClose: function (action, done) {
if (action === 'confirm') {
let that = this;
let response = doUserUpdateNickname(this.updateNickname);
response.then(data => {
//
that.user.nickname = that.updateNickname;
//
done();
});
} else {
done();
}
},
onShowAvatarDialog: function () {
// TODO
alert('头像上传暂未开发');
}
},
mounted() {
let response = getUserInfo();
response.then(data => {
this.user = data;
});
}
}
</script>

View File

@ -22,6 +22,11 @@ export function getLoginToken() {
return res;
}
export function clearLoginToken() {
removeLocalStorage(cacheKeys.accessTokenKey);
removeLocalStorage(cacheKeys.refreshTokenKey);
}
export function getAccessToken() {
return getLocalStorage(cacheKeys.accessTokenKey);
}
@ -44,3 +49,11 @@ function getLocalStorage(key) {
throw new Error(`localStorage 获取错误! ${e}`);
}
}
function removeLocalStorage(key) {
try {
localStorage.removeItem(key);
} catch (e) {
throw new Error(`localStorage 设置错误! ${e}`);
}
}

View File

@ -11,7 +11,7 @@
INSERT INTO users (
id, mobile, status, create_time, deleted
) VALUES (
#{id}, #{mobile}, #{status} #{createTime}, #{deleted}
#{id}, #{mobile}, #{status}, #{createTime}, #{deleted}
)
</insert>