Skip to content

GitLab

A
ant-design-pro
Commit 09c7235c authored by 陈帅's avatar 陈帅 Committed by ddcat1115
Browse files
Options

features add userinfo page (#880) 

* features add userinfo page

* Delete unnecessary objects

* Modify the title style

* Meun using antd

* userinfo/base/:page -> userinfo/:page

* itemview -> list

* userinfo add upload

* meun -> menu

* use getRoutes & rename files
parent 28d3327d
Hide whitespace changes
Inline Side-by-side
Showing with 2728 additions and 50 deletions
.gitignore
View file @ 09c7235c
...@@ -20,3 +20,4 @@ yarn.lock ...@@ -20,3 +20,4 @@ yarn.lock
package-lock.json package-lock.json
*bak *bak
jsconfig.json jsconfig.json
.prettierrc
.roadhogrc.mock.js
View file @ 09c7235c
...@@ -7,6 +7,7 @@ import { getProfileBasicData } from './mock/profile'; ...@@ -7,6 +7,7 @@ import { getProfileBasicData } from './mock/profile';
import { getProfileAdvancedData } from './mock/profile'; import { getProfileAdvancedData } from './mock/profile';
import { getNotices } from './mock/notices'; import { getNotices } from './mock/notices';
import { format, delay } from 'roadhog-api-doc'; import { format, delay } from 'roadhog-api-doc';
import { getProvince, getCity, getArea } from './mock/geographic/geographic';
// 是否禁用代理 // 是否禁用代理
const noProxy = process.env.NO_PROXY === 'true'; const noProxy = process.env.NO_PROXY === 'true';
...@@ -15,7 +16,7 @@ const noProxy = process.env.NO_PROXY === 'true'; ...@@ -15,7 +16,7 @@ const noProxy = process.env.NO_PROXY === 'true';
const proxy = { const proxy = {
// 支持值为 Object 和 Array // 支持值为 Object 和 Array
'GET /api/currentUser': { 'GET /api/currentUser': {
$desc: "获取当前用户接口", $desc: '获取当前用户接口',
$params: { $params: {
pageSize: { pageSize: {
desc: '分页', desc: '分页',
...@@ -24,28 +25,48 @@ const proxy = { ...@@ -24,28 +25,48 @@ const proxy = {
}, },
$body: { $body: {
name: 'Serati Ma', name: 'Serati Ma',
avatar: 'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png', avatar:
'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png',
userid: '00000001', userid: '00000001',
email: 'antdesign@alipay.com',
profile: '简单的介绍下自己',
notifyCount: 12, notifyCount: 12,
country: 'China',
geographic: {
province: {
label: '浙江省',
key: '330000',
},
city: {
label: '杭州市',
key: '330100',
},
},
address: '西湖区工专路 77 号',
phone: '0752-268888888',
}, },
}, },
// GET POST 可省略 // GET POST 可省略
'GET /api/users': [{ 'GET /api/users': [
key: '1', {
name: 'John Brown', key: '1',
age: 32, name: 'John Brown',
address: 'New York No. 1 Lake Park', age: 32,
}, { address: 'New York No. 1 Lake Park',
key: '2', },
name: 'Jim Green', {
age: 42, key: '2',
address: 'London No. 1 Lake Park', name: 'Jim Green',
}, { age: 42,
key: '3', address: 'London No. 1 Lake Park',
name: 'Joe Black', },
age: 32, {
address: 'Sidney No. 1 Lake Park', key: '3',
}], name: 'Joe Black',
age: 32,
address: 'Sidney No. 1 Lake Park',
},
],
'GET /api/project/notice': getNotice, 'GET /api/project/notice': getNotice,
'GET /api/activities': getActivities, 'GET /api/activities': getActivities,
'GET /api/rule': getRule, 'GET /api/rule': getRule,
...@@ -62,7 +83,7 @@ const proxy = { ...@@ -62,7 +83,7 @@ const proxy = {
res.send({ message: 'Ok' }); res.send({ message: 'Ok' });
}, },
'GET /api/tags': mockjs.mock({ 'GET /api/tags': mockjs.mock({
'list|100': [{ name: '@city', 'value|1-100': 150, 'type|0-2': 1 }] 'list|100': [{ name: '@city', 'value|1-100': 150, 'type|0-2': 1 }],
}), }),
'GET /api/fake_list': getFakeList, 'GET /api/fake_list': getFakeList,
'POST /api/fake_list': postFakeList, 'POST /api/fake_list': postFakeList,
...@@ -71,26 +92,26 @@ const proxy = { ...@@ -71,26 +92,26 @@ const proxy = {
'GET /api/profile/advanced': getProfileAdvancedData, 'GET /api/profile/advanced': getProfileAdvancedData,
'POST /api/login/account': (req, res) => { 'POST /api/login/account': (req, res) => {
const { password, userName, type } = req.body; const { password, userName, type } = req.body;
if(password === '888888' && userName === 'admin'){ if (password === '888888' && userName === 'admin') {
res.send({ res.send({
status: 'ok', status: 'ok',
type, type,
currentAuthority: 'admin' currentAuthority: 'admin',
}); });
return ; return;
} }
if(password === '123456' && userName === 'user'){ if (password === '123456' && userName === 'user') {
res.send({ res.send({
status: 'ok', status: 'ok',
type, type,
currentAuthority: 'user' currentAuthority: 'user',
}); });
return ; return;
} }
res.send({ res.send({
status: 'error', status: 'error',
type, type,
currentAuthority: 'guest' currentAuthority: 'guest',
}); });
}, },
'POST /api/register': (req, res) => { 'POST /api/register': (req, res) => {
...@@ -99,40 +120,42 @@ const proxy = { ...@@ -99,40 +120,42 @@ const proxy = {
'GET /api/notices': getNotices, 'GET /api/notices': getNotices,
'GET /api/500': (req, res) => { 'GET /api/500': (req, res) => {
res.status(500).send({ res.status(500).send({
"timestamp": 1513932555104, timestamp: 1513932555104,
"status": 500, status: 500,
"error": "error", error: 'error',
"message": "error", message: 'error',
"path": "/base/category/list" path: '/base/category/list',
}); });
}, },
'GET /api/404': (req, res) => { 'GET /api/404': (req, res) => {
res.status(404).send({ res.status(404).send({
"timestamp": 1513932643431, timestamp: 1513932643431,
"status": 404, status: 404,
"error": "Not Found", error: 'Not Found',
"message": "No message available", message: 'No message available',
"path": "/base/category/list/2121212" path: '/base/category/list/2121212',
}); });
}, },
'GET /api/403': (req, res) => { 'GET /api/403': (req, res) => {
res.status(403).send({ res.status(403).send({
"timestamp": 1513932555104, timestamp: 1513932555104,
"status": 403, status: 403,
"error": "Unauthorized", error: 'Unauthorized',
"message": "Unauthorized", message: 'Unauthorized',
"path": "/base/category/list" path: '/base/category/list',
}); });
}, },
'GET /api/401': (req, res) => { 'GET /api/401': (req, res) => {
res.status(401).send({ res.status(401).send({
"timestamp": 1513932555104, timestamp: 1513932555104,
"status": 401, status: 401,
"error": "Unauthorized", error: 'Unauthorized',
"message": "Unauthorized", message: 'Unauthorized',
"path": "/base/category/list" path: '/base/category/list',
}); });
}, },
'GET /api/geographic/province': getProvince,
'GET /api/geographic/city/:province': getCity,
}; };
export default noProxy ? {} : delay(proxy, 1000); export default (noProxy ? {} : delay(proxy, 1000));
mock/geographic/city.json 0 → 100644
View file @ 09c7235c
{
"110000": [
{
"province": "北京市",
"name": "市辖区",
"id": "110100"
}
],
"120000": [
{
"province": "天津市",
"name": "市辖区",
"id": "120100"
}
],
"130000": [
{
"province": "河北省",
"name": "石家庄市",
"id": "130100"
},
{
"province": "河北省",
"name": "唐山市",
"id": "130200"
},
{
"province": "河北省",
"name": "秦皇岛市",
"id": "130300"
},
{
"province": "河北省",
"name": "邯郸市",
"id": "130400"
},
{
"province": "河北省",
"name": "邢台市",
"id": "130500"
},
{
"province": "河北省",
"name": "保定市",
"id": "130600"
},
{
"province": "河北省",
"name": "张家口市",
"id": "130700"
},
{
"province": "河北省",
"name": "承德市",
"id": "130800"
},
{
"province": "河北省",
"name": "沧州市",
"id": "130900"
},
{
"province": "河北省",
"name": "廊坊市",
"id": "131000"
},
{
"province": "河北省",
"name": "衡水市",
"id": "131100"
},
{
"province": "河北省",
"name": "省直辖县级行政区划",
"id": "139000"
}
],
"140000": [
{
"province": "山西省",
"name": "太原市",
"id": "140100"
},
{
"province": "山西省",
"name": "大同市",
"id": "140200"
},
{
"province": "山西省",
"name": "阳泉市",
"id": "140300"
},
{
"province": "山西省",
"name": "长治市",
"id": "140400"
},
{
"province": "山西省",
"name": "晋城市",
"id": "140500"
},
{
"province": "山西省",
"name": "朔州市",
"id": "140600"
},
{
"province": "山西省",
"name": "晋中市",
"id": "140700"
},
{
"province": "山西省",
"name": "运城市",
"id": "140800"
},
{
"province": "山西省",
"name": "忻州市",
"id": "140900"
},
{
"province": "山西省",
"name": "临汾市",
"id": "141000"
},
{
"province": "山西省",
"name": "吕梁市",
"id": "141100"
}
],
"150000": [
{
"province": "内蒙古自治区",
"name": "呼和浩特市",
"id": "150100"
},
{
"province": "内蒙古自治区",
"name": "包头市",
"id": "150200"
},
{
"province": "内蒙古自治区",
"name": "乌海市",
"id": "150300"
},
{
"province": "内蒙古自治区",
"name": "赤峰市",
"id": "150400"
},
{
"province": "内蒙古自治区",
"name": "通辽市",
"id": "150500"
},
{
"province": "内蒙古自治区",
"name": "鄂尔多斯市",
"id": "150600"
},
{
"province": "内蒙古自治区",
"name": "呼伦贝尔市",
"id": "150700"
},
{
"province": "内蒙古自治区",
"name": "巴彦淖尔市",
"id": "150800"
},
{
"province": "内蒙古自治区",
"name": "乌兰察布市",
"id": "150900"
},
{
"province": "内蒙古自治区",
"name": "兴安盟",
"id": "152200"
},
{
"province": "内蒙古自治区",
"name": "锡林郭勒盟",
"id": "152500"
},
{
"province": "内蒙古自治区",
"name": "阿拉善盟",
"id": "152900"
}
],
"210000": [
{
"province": "辽宁省",
"name": "沈阳市",
"id": "210100"
},
{
"province": "辽宁省",
"name": "大连市",
"id": "210200"
},
{
"province": "辽宁省",
"name": "鞍山市",
"id": "210300"
},
{
"province": "辽宁省",
"name": "抚顺市",
"id": "210400"
},
{
"province": "辽宁省",
"name": "本溪市",
"id": "210500"
},
{
"province": "辽宁省",
"name": "丹东市",
"id": "210600"
},
{
"province": "辽宁省",
"name": "锦州市",
"id": "210700"
},
{
"province": "辽宁省",
"name": "营口市",
"id": "210800"
},
{
"province": "辽宁省",
"name": "阜新市",
"id": "210900"
},
{
"province": "辽宁省",
"name": "辽阳市",
"id": "211000"
},
{
"province": "辽宁省",
"name": "盘锦市",
"id": "211100"
},
{
"province": "辽宁省",
"name": "铁岭市",
"id": "211200"
},
{
"province": "辽宁省",
"name": "朝阳市",
"id": "211300"
},
{
"province": "辽宁省",
"name": "葫芦岛市",
"id": "211400"
}
],
"220000": [
{
"province": "吉林省",
"name": "长春市",
"id": "220100"
},
{
"province": "吉林省",
"name": "吉林市",
"id": "220200"
},
{
"province": "吉林省",
"name": "四平市",
"id": "220300"
},
{
"province": "吉林省",
"name": "辽源市",
"id": "220400"
},
{
"province": "吉林省",
"name": "通化市",
"id": "220500"
},
{
"province": "吉林省",
"name": "白山市",
"id": "220600"
},
{
"province": "吉林省",
"name": "松原市",
"id": "220700"
},
{
"province": "吉林省",
"name": "白城市",
"id": "220800"
},
{
"province": "吉林省",
"name": "延边朝鲜族自治州",
"id": "222400"
}
],
"230000": [
{
"province": "黑龙江省",
"name": "哈尔滨市",
"id": "230100"
},
{
"province": "黑龙江省",
"name": "齐齐哈尔市",
"id": "230200"
},
{
"province": "黑龙江省",
"name": "鸡西市",
"id": "230300"
},
{
"province": "黑龙江省",
"name": "鹤岗市",
"id": "230400"
},
{
"province": "黑龙江省",
"name": "双鸭山市",
"id": "230500"
},
{
"province": "黑龙江省",
"name": "大庆市",
"id": "230600"
},
{
"province": "黑龙江省",
"name": "伊春市",
"id": "230700"
},
{
"province": "黑龙江省",
"name": "佳木斯市",
"id": "230800"
},
{
"province": "黑龙江省",
"name": "七台河市",
"id": "230900"
},
{
"province": "黑龙江省",
"name": "牡丹江市",
"id": "231000"
},
{
"province": "黑龙江省",
"name": "黑河市",
"id": "231100"
},
{
"province": "黑龙江省",
"name": "绥化市",
"id": "231200"
},
{
"province": "黑龙江省",
"name": "大兴安岭地区",
"id": "232700"
}
],
"310000": [
{
"province": "上海市",
"name": "市辖区",
"id": "310100"
}
],
"320000": [
{
"province": "江苏省",
"name": "南京市",
"id": "320100"
},
{
"province": "江苏省",
"name": "无锡市",
"id": "320200"
},
{
"province": "江苏省",
"name": "徐州市",
"id": "320300"
},
{
"province": "江苏省",
"name": "常州市",
"id": "320400"
},
{
"province": "江苏省",
"name": "苏州市",
"id": "320500"
},
{
"province": "江苏省",
"name": "南通市",
"id": "320600"
},
{
"province": "江苏省",
"name": "连云港市",
"id": "320700"
},
{
"province": "江苏省",
"name": "淮安市",
"id": "320800"
},
{
"province": "江苏省",
"name": "盐城市",
"id": "320900"
},
{
"province": "江苏省",
"name": "扬州市",
"id": "321000"
},
{
"province": "江苏省",
"name": "镇江市",
"id": "321100"
},
{
"province": "江苏省",
"name": "泰州市",
"id": "321200"
},
{
"province": "江苏省",
"name": "宿迁市",
"id": "321300"
}
],
"330000": [
{
"province": "浙江省",
"name": "杭州市",
"id": "330100"
},
{
"province": "浙江省",
"name": "宁波市",
"id": "330200"
},
{
"province": "浙江省",
"name": "温州市",
"id": "330300"
},
{
"province": "浙江省",
"name": "嘉兴市",
"id": "330400"
},
{
"province": "浙江省",
"name": "湖州市",
"id": "330500"
},
{
"province": "浙江省",
"name": "绍兴市",
"id": "330600"
},
{
"province": "浙江省",
"name": "金华市",
"id": "330700"
},
{
"province": "浙江省",
"name": "衢州市",
"id": "330800"
},
{
"province": "浙江省",
"name": "舟山市",
"id": "330900"
},
{
"province": "浙江省",
"name": "台州市",
"id": "331000"
},
{
"province": "浙江省",
"name": "丽水市",
"id": "331100"
}
],
"340000": [
{
"province": "安徽省",
"name": "合肥市",
"id": "340100"
},
{
"province": "安徽省",
"name": "芜湖市",
"id": "340200"
},
{
"province": "安徽省",
"name": "蚌埠市",
"id": "340300"
},
{
"province": "安徽省",
"name": "淮南市",
"id": "340400"
},
{
"province": "安徽省",
"name": "马鞍山市",
"id": "340500"
},
{
"province": "安徽省",
"name": "淮北市",
"id": "340600"
},
{
"province": "安徽省",
"name": "铜陵市",
"id": "340700"
},
{
"province": "安徽省",
"name": "安庆市",
"id": "340800"
},
{
"province": "安徽省",
"name": "黄山市",
"id": "341000"
},
{
"province": "安徽省",
"name": "滁州市",
"id": "341100"
},
{
"province": "安徽省",
"name": "阜阳市",
"id": "341200"
},
{
"province": "安徽省",
"name": "宿州市",
"id": "341300"
},
{
"province": "安徽省",
"name": "六安市",
"id": "341500"
},
{
"province": "安徽省",
"name": "亳州市",
"id": "341600"
},
{
"province": "安徽省",
"name": "池州市",
"id": "341700"
},
{
"province": "安徽省",
"name": "宣城市",
"id": "341800"
}
],
"350000": [
{
"province": "福建省",
"name": "福州市",
"id": "350100"
},
{
"province": "福建省",
"name": "厦门市",
"id": "350200"
},
{
"province": "福建省",
"name": "莆田市",
"id": "350300"
},
{
"province": "福建省",
"name": "三明市",
"id": "350400"
},
{
"province": "福建省",
"name": "泉州市",
"id": "350500"
},
{
"province": "福建省",
"name": "漳州市",
"id": "350600"
},
{
"province": "福建省",
"name": "南平市",
"id": "350700"
},
{
"province": "福建省",
"name": "龙岩市",
"id": "350800"
},
{
"province": "福建省",
"name": "宁德市",
"id": "350900"
}
],
"360000": [
{
"province": "江西省",
"name": "南昌市",
"id": "360100"
},
{
"province": "江西省",
"name": "景德镇市",
"id": "360200"
},
{
"province": "江西省",
"name": "萍乡市",
"id": "360300"
},
{
"province": "江西省",
"name": "九江市",
"id": "360400"
},
{
"province": "江西省",
"name": "新余市",
"id": "360500"
},
{
"province": "江西省",
"name": "鹰潭市",
"id": "360600"
},
{
"province": "江西省",
"name": "赣州市",
"id": "360700"
},
{
"province": "江西省",
"name": "吉安市",
"id": "360800"
},
{
"province": "江西省",
"name": "宜春市",
"id": "360900"
},
{
"province": "江西省",
"name": "抚州市",
"id": "361000"
},
{
"province": "江西省",
"name": "上饶市",
"id": "361100"
}
],
"370000": [
{
"province": "山东省",
"name": "济南市",
"id": "370100"
},
{
"province": "山东省",
"name": "青岛市",
"id": "370200"
},
{
"province": "山东省",
"name": "淄博市",
"id": "370300"
},
{
"province": "山东省",
"name": "枣庄市",
"id": "370400"
},
{
"province": "山东省",
"name": "东营市",
"id": "370500"
},
{
"province": "山东省",
"name": "烟台市",
"id": "370600"
},
{
"province": "山东省",
"name": "潍坊市",
"id": "370700"
},
{
"province": "山东省",
"name": "济宁市",
"id": "370800"
},
{
"province": "山东省",
"name": "泰安市",
"id": "370900"
},
{
"province": "山东省",
"name": "威海市",
"id": "371000"
},
{
"province": "山东省",
"name": "日照市",
"id": "371100"
},
{
"province": "山东省",
"name": "莱芜市",
"id": "371200"
},
{
"province": "山东省",
"name": "临沂市",
"id": "371300"
},
{
"province": "山东省",
"name": "德州市",
"id": "371400"
},
{
"province": "山东省",
"name": "聊城市",
"id": "371500"
},
{
"province": "山东省",
"name": "滨州市",
"id": "371600"
},
{
"province": "山东省",
"name": "菏泽市",
"id": "371700"
}
],
"410000": [
{
"province": "河南省",
"name": "郑州市",
"id": "410100"
},
{
"province": "河南省",
"name": "开封市",
"id": "410200"
},
{
"province": "河南省",
"name": "洛阳市",
"id": "410300"
},
{
"province": "河南省",
"name": "平顶山市",
"id": "410400"
},
{
"province": "河南省",
"name": "安阳市",
"id": "410500"
},
{
"province": "河南省",
"name": "鹤壁市",
"id": "410600"
},
{
"province": "河南省",
"name": "新乡市",
"id": "410700"
},
{
"province": "河南省",
"name": "焦作市",
"id": "410800"
},
{
"province": "河南省",
"name": "濮阳市",
"id": "410900"
},
{
"province": "河南省",
"name": "许昌市",
"id": "411000"
},
{
"province": "河南省",
"name": "漯河市",
"id": "411100"
},
{
"province": "河南省",
"name": "三门峡市",
"id": "411200"
},
{
"province": "河南省",
"name": "南阳市",
"id": "411300"
},
{
"province": "河南省",
"name": "商丘市",
"id": "411400"
},
{
"province": "河南省",
"name": "信阳市",
"id": "411500"
},
{
"province": "河南省",
"name": "周口市",
"id": "411600"
},
{
"province": "河南省",
"name": "驻马店市",
"id": "411700"
},
{
"province": "河南省",
"name": "省直辖县级行政区划",
"id": "419000"
}
],
"420000": [
{
"province": "湖北省",
"name": "武汉市",
"id": "420100"
},
{
"province": "湖北省",
"name": "黄石市",
"id": "420200"
},
{
"province": "湖北省",
"name": "十堰市",
"id": "420300"
},
{
"province": "湖北省",
"name": "宜昌市",
"id": "420500"
},
{
"province": "湖北省",
"name": "襄阳市",
"id": "420600"
},
{
"province": "湖北省",
"name": "鄂州市",
"id": "420700"
},
{
"province": "湖北省",
"name": "荆门市",
"id": "420800"
},
{
"province": "湖北省",
"name": "孝感市",
"id": "420900"
},
{
"province": "湖北省",
"name": "荆州市",
"id": "421000"
},
{
"province": "湖北省",
"name": "黄冈市",
"id": "421100"
},
{
"province": "湖北省",
"name": "咸宁市",
"id": "421200"
},
{
"province": "湖北省",
"name": "随州市",
"id": "421300"
},
{
"province": "湖北省",
"name": "恩施土家族苗族自治州",
"id": "422800"
},
{
"province": "湖北省",
"name": "省直辖县级行政区划",
"id": "429000"
}
],
"430000": [
{
"province": "湖南省",
"name": "长沙市",
"id": "430100"
},
{
"province": "湖南省",
"name": "株洲市",
"id": "430200"
},
{
"province": "湖南省",
"name": "湘潭市",
"id": "430300"
},
{
"province": "湖南省",
"name": "衡阳市",
"id": "430400"
},
{
"province": "湖南省",
"name": "邵阳市",
"id": "430500"
},
{
"province": "湖南省",
"name": "岳阳市",
"id": "430600"
},
{
"province": "湖南省",
"name": "常德市",
"id": "430700"
},
{
"province": "湖南省",
"name": "张家界市",
"id": "430800"
},
{
"province": "湖南省",
"name": "益阳市",
"id": "430900"
},
{
"province": "湖南省",
"name": "郴州市",
"id": "431000"
},
{
"province": "湖南省",
"name": "永州市",
"id": "431100"
},
{
"province": "湖南省",
"name": "怀化市",
"id": "431200"
},
{
"province": "湖南省",
"name": "娄底市",
"id": "431300"
},
{
"province": "湖南省",
"name": "湘西土家族苗族自治州",
"id": "433100"
}
],
"440000": [
{
"province": "广东省",
"name": "广州市",
"id": "440100"
},
{
"province": "广东省",
"name": "韶关市",
"id": "440200"
},
{
"province": "广东省",
"name": "深圳市",
"id": "440300"
},
{
"province": "广东省",
"name": "珠海市",
"id": "440400"
},
{
"province": "广东省",
"name": "汕头市",
"id": "440500"
},
{
"province": "广东省",
"name": "佛山市",
"id": "440600"
},
{
"province": "广东省",
"name": "江门市",
"id": "440700"
},
{
"province": "广东省",
"name": "湛江市",
"id": "440800"
},
{
"province": "广东省",
"name": "茂名市",
"id": "440900"
},
{
"province": "广东省",
"name": "肇庆市",
"id": "441200"
},
{
"province": "广东省",
"name": "惠州市",
"id": "441300"
},
{
"province": "广东省",
"name": "梅州市",
"id": "441400"
},
{
"province": "广东省",
"name": "汕尾市",
"id": "441500"
},
{
"province": "广东省",
"name": "河源市",
"id": "441600"
},
{
"province": "广东省",
"name": "阳江市",
"id": "441700"
},
{
"province": "广东省",
"name": "清远市",
"id": "441800"
},
{
"province": "广东省",
"name": "东莞市",
"id": "441900"
},
{
"province": "广东省",
"name": "中山市",
"id": "442000"
},
{
"province": "广东省",
"name": "潮州市",
"id": "445100"
},
{
"province": "广东省",
"name": "揭阳市",
"id": "445200"
},
{
"province": "广东省",
"name": "云浮市",
"id": "445300"
}
],
"450000": [
{
"province": "广西壮族自治区",
"name": "南宁市",
"id": "450100"
},
{
"province": "广西壮族自治区",
"name": "柳州市",
"id": "450200"
},
{
"province": "广西壮族自治区",
"name": "桂林市",
"id": "450300"
},
{
"province": "广西壮族自治区",
"name": "梧州市",
"id": "450400"
},
{
"province": "广西壮族自治区",
"name": "北海市",
"id": "450500"
},
{
"province": "广西壮族自治区",
"name": "防城港市",
"id": "450600"
},
{
"province": "广西壮族自治区",
"name": "钦州市",
"id": "450700"
},
{
"province": "广西壮族自治区",
"name": "贵港市",
"id": "450800"
},
{
"province": "广西壮族自治区",
"name": "玉林市",
"id": "450900"
},
{
"province": "广西壮族自治区",
"name": "百色市",
"id": "451000"
},
{
"province": "广西壮族自治区",
"name": "贺州市",
"id": "451100"
},
{
"province": "广西壮族自治区",
"name": "河池市",
"id": "451200"
},
{
"province": "广西壮族自治区",
"name": "来宾市",
"id": "451300"
},
{
"province": "广西壮族自治区",
"name": "崇左市",
"id": "451400"
}
],
"460000": [
{
"province": "海南省",
"name": "海口市",
"id": "460100"
},
{
"province": "海南省",
"name": "三亚市",
"id": "460200"
},
{
"province": "海南省",
"name": "三沙市",
"id": "460300"
},
{
"province": "海南省",
"name": "儋州市",
"id": "460400"
},
{
"province": "海南省",
"name": "省直辖县级行政区划",
"id": "469000"
}
],
"500000": [
{
"province": "重庆市",
"name": "市辖区",
"id": "500100"
},
{
"province": "重庆市",
"name": "县",
"id": "500200"
}
],
"510000": [
{
"province": "四川省",
"name": "成都市",
"id": "510100"
},
{
"province": "四川省",
"name": "自贡市",
"id": "510300"
},
{
"province": "四川省",
"name": "攀枝花市",
"id": "510400"
},
{
"province": "四川省",
"name": "泸州市",
"id": "510500"
},
{
"province": "四川省",
"name": "德阳市",
"id": "510600"
},
{
"province": "四川省",
"name": "绵阳市",
"id": "510700"
},
{
"province": "四川省",
"name": "广元市",
"id": "510800"
},
{
"province": "四川省",
"name": "遂宁市",
"id": "510900"
},
{
"province": "四川省",
"name": "内江市",
"id": "511000"
},
{
"province": "四川省",
"name": "乐山市",
"id": "511100"
},
{
"province": "四川省",
"name": "南充市",
"id": "511300"
},
{
"province": "四川省",
"name": "眉山市",
"id": "511400"
},
{
"province": "四川省",
"name": "宜宾市",
"id": "511500"
},
{
"province": "四川省",
"name": "广安市",
"id": "511600"
},
{
"province": "四川省",
"name": "达州市",
"id": "511700"
},
{
"province": "四川省",
"name": "雅安市",
"id": "511800"
},
{
"province": "四川省",
"name": "巴中市",
"id": "511900"
},
{
"province": "四川省",
"name": "资阳市",
"id": "512000"
},
{
"province": "四川省",
"name": "阿坝藏族羌族自治州",
"id": "513200"
},
{
"province": "四川省",
"name": "甘孜藏族自治州",
"id": "513300"
},
{
"province": "四川省",
"name": "凉山彝族自治州",
"id": "513400"
}
],
"520000": [
{
"province": "贵州省",
"name": "贵阳市",
"id": "520100"
},
{
"province": "贵州省",
"name": "六盘水市",
"id": "520200"
},
{
"province": "贵州省",
"name": "遵义市",
"id": "520300"
},
{
"province": "贵州省",
"name": "安顺市",
"id": "520400"
},
{
"province": "贵州省",
"name": "毕节市",
"id": "520500"
},
{
"province": "贵州省",
"name": "铜仁市",
"id": "520600"
},
{
"province": "贵州省",
"name": "黔西南布依族苗族自治州",
"id": "522300"
},
{
"province": "贵州省",
"name": "黔东南苗族侗族自治州",
"id": "522600"
},
{
"province": "贵州省",
"name": "黔南布依族苗族自治州",
"id": "522700"
}
],
"530000": [
{
"province": "云南省",
"name": "昆明市",
"id": "530100"
},
{
"province": "云南省",
"name": "曲靖市",
"id": "530300"
},
{
"province": "云南省",
"name": "玉溪市",
"id": "530400"
},
{
"province": "云南省",
"name": "保山市",
"id": "530500"
},
{
"province": "云南省",
"name": "昭通市",
"id": "530600"
},
{
"province": "云南省",
"name": "丽江市",
"id": "530700"
},
{
"province": "云南省",
"name": "普洱市",
"id": "530800"
},
{
"province": "云南省",
"name": "临沧市",
"id": "530900"
},
{
"province": "云南省",
"name": "楚雄彝族自治州",
"id": "532300"
},
{
"province": "云南省",
"name": "红河哈尼族彝族自治州",
"id": "532500"
},
{
"province": "云南省",
"name": "文山壮族苗族自治州",
"id": "532600"
},
{
"province": "云南省",
"name": "西双版纳傣族自治州",
"id": "532800"
},
{
"province": "云南省",
"name": "大理白族自治州",
"id": "532900"
},
{
"province": "云南省",
"name": "德宏傣族景颇族自治州",
"id": "533100"
},
{
"province": "云南省",
"name": "怒江傈僳族自治州",
"id": "533300"
},
{
"province": "云南省",
"name": "迪庆藏族自治州",
"id": "533400"
}
],
"540000": [
{
"province": "西藏自治区",
"name": "拉萨市",
"id": "540100"
},
{
"province": "西藏自治区",
"name": "日喀则市",
"id": "540200"
},
{
"province": "西藏自治区",
"name": "昌都市",
"id": "540300"
},
{
"province": "西藏自治区",
"name": "林芝市",
"id": "540400"
},
{
"province": "西藏自治区",
"name": "山南市",
"id": "540500"
},
{
"province": "西藏自治区",
"name": "那曲地区",
"id": "542400"
},
{
"province": "西藏自治区",
"name": "阿里地区",
"id": "542500"
}
],
"610000": [
{
"province": "陕西省",
"name": "西安市",
"id": "610100"
},
{
"province": "陕西省",
"name": "铜川市",
"id": "610200"
},
{
"province": "陕西省",
"name": "宝鸡市",
"id": "610300"
},
{
"province": "陕西省",
"name": "咸阳市",
"id": "610400"
},
{
"province": "陕西省",
"name": "渭南市",
"id": "610500"
},
{
"province": "陕西省",
"name": "延安市",
"id": "610600"
},
{
"province": "陕西省",
"name": "汉中市",
"id": "610700"
},
{
"province": "陕西省",
"name": "榆林市",
"id": "610800"
},
{
"province": "陕西省",
"name": "安康市",
"id": "610900"
},
{
"province": "陕西省",
"name": "商洛市",
"id": "611000"
}
],
"620000": [
{
"province": "甘肃省",
"name": "兰州市",
"id": "620100"
},
{
"province": "甘肃省",
"name": "嘉峪关市",
"id": "620200"
},
{
"province": "甘肃省",
"name": "金昌市",
"id": "620300"
},
{
"province": "甘肃省",
"name": "白银市",
"id": "620400"
},
{
"province": "甘肃省",
"name": "天水市",
"id": "620500"
},
{
"province": "甘肃省",
"name": "武威市",
"id": "620600"
},
{
"province": "甘肃省",
"name": "张掖市",
"id": "620700"
},
{
"province": "甘肃省",
"name": "平凉市",
"id": "620800"
},
{
"province": "甘肃省",
"name": "酒泉市",
"id": "620900"
},
{
"province": "甘肃省",
"name": "庆阳市",
"id": "621000"
},
{
"province": "甘肃省",
"name": "定西市",
"id": "621100"
},
{
"province": "甘肃省",
"name": "陇南市",
"id": "621200"
},
{
"province": "甘肃省",
"name": "临夏回族自治州",
"id": "622900"
},
{
"province": "甘肃省",
"name": "甘南藏族自治州",
"id": "623000"
}
],
"630000": [
{
"province": "青海省",
"name": "西宁市",
"id": "630100"
},
{
"province": "青海省",
"name": "海东市",
"id": "630200"
},
{
"province": "青海省",
"name": "海北藏族自治州",
"id": "632200"
},
{
"province": "青海省",
"name": "黄南藏族自治州",
"id": "632300"
},
{
"province": "青海省",
"name": "海南藏族自治州",
"id": "632500"
},
{
"province": "青海省",
"name": "果洛藏族自治州",
"id": "632600"
},
{
"province": "青海省",
"name": "玉树藏族自治州",
"id": "632700"
},
{
"province": "青海省",
"name": "海西蒙古族藏族自治州",
"id": "632800"
}
],
"640000": [
{
"province": "宁夏回族自治区",
"name": "银川市",
"id": "640100"
},
{
"province": "宁夏回族自治区",
"name": "石嘴山市",
"id": "640200"
},
{
"province": "宁夏回族自治区",
"name": "吴忠市",
"id": "640300"
},
{
"province": "宁夏回族自治区",
"name": "固原市",
"id": "640400"
},
{
"province": "宁夏回族自治区",
"name": "中卫市",
"id": "640500"
}
],
"650000": [
{
"province": "新疆维吾尔自治区",
"name": "乌鲁木齐市",
"id": "650100"
},
{
"province": "新疆维吾尔自治区",
"name": "克拉玛依市",
"id": "650200"
},
{
"province": "新疆维吾尔自治区",
"name": "吐鲁番市",
"id": "650400"
},
{
"province": "新疆维吾尔自治区",
"name": "哈密市",
"id": "650500"
},
{
"province": "新疆维吾尔自治区",
"name": "昌吉回族自治州",
"id": "652300"
},
{
"province": "新疆维吾尔自治区",
"name": "博尔塔拉蒙古自治州",
"id": "652700"
},
{
"province": "新疆维吾尔自治区",
"name": "巴音郭楞蒙古自治州",
"id": "652800"
},
{
"province": "新疆维吾尔自治区",
"name": "阿克苏地区",
"id": "652900"
},
{
"province": "新疆维吾尔自治区",
"name": "克孜勒苏柯尔克孜自治州",
"id": "653000"
},
{
"province": "新疆维吾尔自治区",
"name": "喀什地区",
"id": "653100"
},
{
"province": "新疆维吾尔自治区",
"name": "和田地区",
"id": "653200"
},
{
"province": "新疆维吾尔自治区",
"name": "伊犁哈萨克自治州",
"id": "654000"
},
{
"province": "新疆维吾尔自治区",
"name": "塔城地区",
"id": "654200"
},
{
"province": "新疆维吾尔自治区",
"name": "阿勒泰地区",
"id": "654300"
},
{
"province": "新疆维吾尔自治区",
"name": "自治区直辖县级行政区划",
"id": "659000"
}
]
}
\ No newline at end of file
mock/geographic/geographic.js 0 → 100644
View file @ 09c7235c
const fs = require('fs');
function getJson(infoType) {
const json = fs.readFileSync(`${__dirname}/${infoType}.json`, 'utf8');
return JSON.parse(json);
}
export function getProvince(req, res) {
res.json(getJson('province'));
}
export function getCity(req, res) {
res.json(getJson('city')[req.params.province]);
}
export default {
getProvince,
getCity,
};
mock/geographic/province.json 0 → 100644
View file @ 09c7235c
[
{
"name": "北京市",
"id": "110000"
},
{
"name": "天津市",
"id": "120000"
},
{
"name": "河北省",
"id": "130000"
},
{
"name": "山西省",
"id": "140000"
},
{
"name": "内蒙古自治区",
"id": "150000"
},
{
"name": "辽宁省",
"id": "210000"
},
{
"name": "吉林省",
"id": "220000"
},
{
"name": "黑龙江省",
"id": "230000"
},
{
"name": "上海市",
"id": "310000"
},
{
"name": "江苏省",
"id": "320000"
},
{
"name": "浙江省",
"id": "330000"
},
{
"name": "安徽省",
"id": "340000"
},
{
"name": "福建省",
"id": "350000"
},
{
"name": "江西省",
"id": "360000"
},
{
"name": "山东省",
"id": "370000"
},
{
"name": "河南省",
"id": "410000"
},
{
"name": "湖北省",
"id": "420000"
},
{
"name": "湖南省",
"id": "430000"
},
{
"name": "广东省",
"id": "440000"
},
{
"name": "广西壮族自治区",
"id": "450000"
},
{
"name": "海南省",
"id": "460000"
},
{
"name": "重庆市",
"id": "500000"
},
{
"name": "四川省",
"id": "510000"
},
{
"name": "贵州省",
"id": "520000"
},
{
"name": "云南省",
"id": "530000"
},
{
"name": "西藏自治区",
"id": "540000"
},
{
"name": "陕西省",
"id": "610000"
},
{
"name": "甘肃省",
"id": "620000"
},
{
"name": "青海省",
"id": "630000"
},
{
"name": "宁夏回族自治区",
"id": "640000"
},
{
"name": "新疆维吾尔自治区",
"id": "650000"
},
{
"name": "台湾省",
"id": "710000"
},
{
"name": "香港特别行政区",
"id": "810000"
},
{
"name": "澳门特别行政区",
"id": "820000"
}
]
src/common/router.js
View file @ 09c7235c
...@@ -160,6 +160,21 @@ export const getRouterData = (app) => { ...@@ -160,6 +160,21 @@ export const getRouterData = (app) => {
'/user/register-result': { '/user/register-result': {
component: dynamicWrapper(app, [], () => import('../routes/User/RegisterResult')), component: dynamicWrapper(app, [], () => import('../routes/User/RegisterResult')),
}, },
'/userinfo': {
component: dynamicWrapper(app, ['geographic'], () => import('../routes/Userinfo/Info')),
},
'/userinfo/base': {
component: dynamicWrapper(app, ['geographic'], () => import('../routes/Userinfo/BaseView')),
},
'/userinfo/safe': {
component: dynamicWrapper(app, ['geographic'], () => import('../routes/Userinfo/SafeView')),
},
'/userinfo/account': {
component: dynamicWrapper(app, ['geographic'], () => import('../routes/Userinfo/AccountView')),
},
'/userinfo/message': {
component: dynamicWrapper(app, ['geographic'], () => import('../routes/Userinfo/MessageView')),
},
// '/user/:id': { // '/user/:id': {
// component: dynamicWrapper(app, [], () => import('../routes/User/SomeComponent')), // component: dynamicWrapper(app, [], () => import('../routes/User/SomeComponent')),
// }, // },
......
src/components/GlobalHeader/index.js
View file @ 09c7235c
...@@ -58,7 +58,7 @@ export default class GlobalHeader extends PureComponent { ...@@ -58,7 +58,7 @@ export default class GlobalHeader extends PureComponent {
const menu = ( const menu = (
<Menu className={styles.menu} selectedKeys={[]} onClick={onMenuClick}> <Menu className={styles.menu} selectedKeys={[]} onClick={onMenuClick}>
<Menu.Item disabled><Icon type="user" />个人中心</Menu.Item> <Menu.Item disabled><Icon type="user" />个人中心</Menu.Item>
<Menu.Item disabled><Icon type="setting" />设置</Menu.Item> <Menu.Item key="userinfo"><Icon type="setting" />设置</Menu.Item>
<Menu.Item key="triggerError"><Icon type="close-circle" />触发报错</Menu.Item> <Menu.Item key="triggerError"><Icon type="close-circle" />触发报错</Menu.Item>
<Menu.Divider /> <Menu.Divider />
<Menu.Item key="logout"><Icon type="logout" />退出登录</Menu.Item> <Menu.Item key="logout"><Icon type="logout" />退出登录</Menu.Item>
......
src/layouts/BasicLayout.js
View file @ 09c7235c
...@@ -131,6 +131,10 @@ class BasicLayout extends React.PureComponent { ...@@ -131,6 +131,10 @@ class BasicLayout extends React.PureComponent {
this.props.dispatch(routerRedux.push('/exception/trigger')); this.props.dispatch(routerRedux.push('/exception/trigger'));
return; return;
} }
if (key === 'userinfo') {
this.props.dispatch(routerRedux.push('/userinfo/base'));
return;
}
if (key === 'logout') { if (key === 'logout') {
this.props.dispatch({ this.props.dispatch({
type: 'login/logout', type: 'login/logout',
......
src/models/geographic.js 0 → 100644
View file @ 09c7235c
import { queryProvince, queryCity } from '../services/geographic';
export default {
namespace: 'geographic',
state: {
province: [],
city: [],
isLoading: false,
},
effects: {
*fetchProvince(_, { call, put }) {
yield put({
type: 'changeLoading',
payload: true,
});
const response = yield call(queryProvince);
yield put({
type: 'setProvince',
payload: response,
});
yield put({
type: 'changeLoading',
payload: false,
});
},
*fetchCity({ payload }, { call, put }) {
yield put({
type: 'changeLoading',
payload: true,
});
const response = yield call(queryCity, payload);
yield put({
type: 'setCity',
payload: response,
});
yield put({
type: 'changeLoading',
payload: false,
});
},
},
reducers: {
setProvince(state, action) {
return {
...state,
province: action.payload,
};
},
setCity(state, action) {
return {
...state,
city: action.payload,
};
},
changeLoading(state, action) {
return {
...state,
isLoading: action.payload,
};
},
},
};
src/routes/Forms/StepForm/index.js
View file @ 09c7235c
...@@ -2,7 +2,6 @@ import React, { PureComponent } from 'react'; ...@@ -2,7 +2,6 @@ import React, { PureComponent } from 'react';
import { Route, Redirect, Switch } from 'dva/router'; import { Route, Redirect, Switch } from 'dva/router';
import { Card, Steps } from 'antd'; import { Card, Steps } from 'antd';
import PageHeaderLayout from '../../../layouts/PageHeaderLayout'; import PageHeaderLayout from '../../../layouts/PageHeaderLayout';
import NotFound from '../../Exception/404';
import { getRoutes } from '../../../utils/utils'; import { getRoutes } from '../../../utils/utils';
import styles from '../style.less'; import styles from '../style.less';
...@@ -43,7 +42,7 @@ export default class StepForm extends PureComponent { ...@@ -43,7 +42,7 @@ export default class StepForm extends PureComponent {
)) ))
} }
<Redirect exact from="/form/step-form" to="/form/step-form/info" /> <Redirect exact from="/form/step-form" to="/form/step-form/info" />
<Route render={NotFound} /> <Redirect to="/exception/404" />
</Switch> </Switch>
</div> </div>
</Card> </Card>
......
src/routes/Userinfo/AccountView.js 0 → 100644
View file @ 09c7235c
import React, { Component, Fragment } from 'react';
import { Icon, List } from 'antd';
export default class AccountView extends Component {
getData = () => {
return [
{
title: '绑定淘宝',
description: '当前未绑定淘宝账号',
actions: [<a>绑定</a>],
avatar: <Icon type="taobao" className="taobao" />,
},
{
title: '绑定支付宝',
description: '当前未绑定支付宝账号',
actions: [<a>绑定</a>],
avatar: <Icon type="alipay" className="alipay" />,
},
{
title: '绑定钉钉',
description: '当前未绑定钉钉账号',
actions: [<a>绑定</a>],
avatar: <Icon type="dingding" className="dingding" />,
},
];
};
render() {
return (
<Fragment>
<List
itemLayout="horizontal"
dataSource={this.getData()}
renderItem={item => (
<List.Item actions={item.actions}>
<List.Item.Meta
avatar={item.avatar}
title={item.title}
description={item.description}
/>
</List.Item>
)}
/>
</Fragment>
);
}
}
src/routes/Userinfo/BaseView.js 0 → 100644
View file @ 09c7235c
import React, { Component, Fragment } from 'react';
import { Form, Input, Upload, Select, Button } from 'antd';
import styles from './BaseView.less';
import GeographicView from './GeographicView';
import PhoneView from './PhoneView';
const FormItem = Form.Item;
const { Option } = Select;
// 头像组件 方便以后独立，增加裁剪之类的功能
const AvatarView = ({ avatar }) => (
<Fragment>
<div className={styles.avatar_title}>头像</div>
<div className={styles.avatar}>
<img src={avatar} alt="avatar" />
</div>
<Upload fileList={[]}>
<div className={styles.button_view}>
<Button icon="upload">更换头像</Button>
</div>
</Upload>
</Fragment>
);
const validatorGeographic = (rule, value, callback) => {
const { province, city } = value;
if (!province.key) {
callback('Please input your province!');
}
if (!city.key) {
callback('Please input your city!');
}
callback();
};
const validatorPhone = (rule, value, callback) => {
const values = value.split('-');
if (!values[0]) {
callback('Please input your area code!');
}
if (!values[1]) {
callback('Please input your phone number!');
}
callback();
};
@Form.create()
export default class BaseView extends Component {
componentDidMount() {
this.setBaseInfo();
}
setBaseInfo = () => {
const { currentUser } = this.props;
Object.keys(this.props.form.getFieldsValue()).forEach((key) => {
const obj = {};
obj[key] = currentUser[key] || null;
this.props.form.setFieldsValue(obj);
});
};
getAvatarURL() {
if (this.props.currentUser.avatar) {
return this.props.currentUser.avatar;
}
const url =
'https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png';
return url;
}
render() {
const { getFieldDecorator } = this.props.form;
return (
<div className={styles.baseView}>
<div className={styles.left}>
<Form layout="vertical" onSubmit={this.handleSubmit} hideRequiredMark>
<FormItem label="邮箱">
{getFieldDecorator('email', {
rules: [
{ required: true, message: 'Please input your email!' },
],
})(<Input />)}
</FormItem>
<FormItem label="昵称">
{getFieldDecorator('name', {
rules: [
{ required: true, message: 'Please input your nick name!' },
],
})(<Input />)}
</FormItem>
<FormItem label="个人简介">
{getFieldDecorator('profile', {
rules: [
{ required: true, message: 'Please input personal profile!' },
],
})(<Input.TextArea rows={4} />)}
</FormItem>
<FormItem label="国家/地区">
{getFieldDecorator('country', {
rules: [
{ required: true, message: 'Please input your country!' },
],
})(
<Select style={{ width: 220 }}>
<Option value="China">中国</Option>
<Option value="USA">美国</Option>
<Option value="France">法国</Option>
<Option value="Russian">俄罗斯</Option>
<Option value="UK">英国</Option>
</Select>,
)}
</FormItem>
<FormItem label="所在省市">
{getFieldDecorator('geographic', {
rules: [
{
required: true,
message: 'Please input your geographic info!',
},
{
validator: validatorGeographic,
},
],
})(<GeographicView />)}
</FormItem>
<FormItem label="街道地址">
{getFieldDecorator('address', {
rules: [
{ required: true, message: 'Please input your address!' },
],
})(<Input />)}
</FormItem>
<FormItem label="联系电话">
{getFieldDecorator('phone', {
rules: [
{ required: true, message: 'Please input your phone!' },
{ validator: validatorPhone },
],
})(<PhoneView />)}
</FormItem>
<Button type="primary">更新信息</Button>
</Form>
</div>
<div className={styles.right}>
<AvatarView avatar={this.getAvatarURL()} />
</div>
</div>
);
}
}
src/routes/Userinfo/BaseView.less 0 → 100644
View file @ 09c7235c
@import '~antd/lib/style/themes/default.less';
.baseView {
display: flex;
.left {
width: 448px;
}
.right {
flex: 1;
padding-left: 104px;
.avatar_title {
height: 22px;
width: 28px;
font-size: 14px;
color: rgba(0, 0, 0, 0.85);
line-height: 22px;
margin-bottom: 8px;
}
.avatar {
width: 144px;
height: 144px;
margin-bottom: 12px;
overflow: hidden;
img {
width: 100%;
}
}
.button_view {
width: 144px;
text-align: center;
}
}
}
src/routes/Userinfo/GeographicView.js 0 → 100644
View file @ 09c7235c
import React, { PureComponent } from 'react';
import { Select, Spin } from 'antd';
import { connect } from 'dva';
const { Option } = Select;
const nullSlectItem = {
label: '',
key: '',
};
@connect(({ geographic }) => {
const { province, isLoading, city } = geographic;
return {
province,
city,
isLoading,
};
})
export default class ProvinceSelect extends PureComponent {
componentDidMount = () => {
this.props.dispatch({
type: 'geographic/fetchProvince',
});
};
getProvinceOption() {
return this.getOption(this.props.province);
}
getCityOption = () => {
return this.getOption(this.props.city);
};
getOption = (list) => {
if (!list || list.length < 1) {
return (
<Option key={0} value={0}>
没有找到选项
</Option>
);
}
return list.map((item) => {
return (
<Option key={item.id} value={item.id}>
{item.name}
</Option>
);
});
};
selectProvinceItem = (item) => {
this.props.dispatch({
type: 'geographic/fetchCity',
payload: item.key,
});
this.props.onChange({
province: item,
city: nullSlectItem,
});
};
selectCityItem = (item) => {
this.props.onChange({
province: this.props.value.province,
city: item,
});
};
conversionObject() {
const { value } = this.props;
if (!value) {
return {
province: nullSlectItem,
city: nullSlectItem,
};
}
const { province, city } = value;
return {
province: province || nullSlectItem,
city: city || nullSlectItem,
};
}
render() {
const { province, city } = this.conversionObject();
return (
<Spin spinning={this.props.isLoading}>
<Select
value={province}
labelInValue
showSearch
onSelect={this.selectProvinceItem}
style={{ width: 220, marginRight: 8 }}
>
{this.getProvinceOption()}
</Select>
<Select
value={city}
labelInValue
showSearch
onSelect={this.selectCityItem}
style={{ width: 220 }}
>
{this.getCityOption()}
</Select>
</Spin>
);
}
}
src/routes/Userinfo/Info.js 0 → 100644
View file @ 09c7235c
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { Route, routerRedux, Switch, Redirect } from 'dva/router';
import { Menu } from 'antd';
import styles from './Info.less';
import { getRoutes } from '../../utils/utils';
const { Item } = Menu;
const menuMap = {
base: '基本设置',
safe: '安全设置',
account: '账号绑定',
message: '新消息通知',
};
@connect(({ user }) => ({
currentUser: user.currentUser,
}))
export default class Info extends PureComponent {
constructor(props) {
super(props);
const { match, location } = props;
let key = location.pathname.replace(`${match.path}/`, '');
key = menuMap[key] ? key : 'base';
this.state = {
selectKey: key,
};
}
getmenu = () => {
return Object.keys(menuMap).map(item => <Item key={item}>{menuMap[item]}</Item>);
};
getRightTitle = () => {
return menuMap[this.state.selectKey];
};
selectKey = ({ key }) => {
this.props.dispatch(routerRedux.push(`/userinfo/${key}`));
this.setState({
selectKey: key,
});
};
render() {
const { match, routerData, currentUser } = this.props;
if (!currentUser.userid) {
return '';
}
return (
<div className={styles.main}>
<div className={styles.leftmenu}>
<Menu
mode="inline"
selectedKeys={[this.state.selectKey]}
onClick={this.selectKey}
>
{this.getmenu()}
</Menu>
</div>
<div className={styles.right}>
<div className={styles.title}>{this.getRightTitle()}</div>
<Switch>
{
getRoutes(match.path, routerData).map(item => (
<Route
key={item.key}
path={item.path}
render={props => <item.component {...props} currentUser={currentUser} />}
exact={item.exact}
/>
))
}
<Redirect exact from="/userinfo" to="/userinfo/base" />
<Redirect to="/exception/404" />
</Switch>
</div>
</div>
);
}
}
src/routes/Userinfo/Info.less 0 → 100644
View file @ 09c7235c
@import '~antd/lib/style/themes/default.less';
.main {
width: 100%;
height: 100%;
background-color: #fff;
display: flex;
padding-top: 15px;
padding-bottom: 15px;
.leftmenu {
width: 224px;
border-right: 1px solid #e8e8e8;
:global {
.ant-menu-inline {
border: none;
}
}
}
.right {
flex: 1;
padding-left: 40px;
padding-right: 40px;
padding-top: 9px;
padding-bottom: 9px;
.title {
font-size: 20px;
color: rgba(0, 0, 0, 0.85);
line-height: 28px;
width: 100px;
height: 28px;
font-weight: bold;
margin-bottom: 24px;
}
}
}
:global {
.ant-list-item-meta {
// 账号绑定图标
.taobao {
color: #ff4000;
display: block;
font-size: 48px;
line-height: 48px;
border-radius: 4px;
}
.dingding {
background-color: #2eabff;
color: #fff;
font-size: 32px;
line-height: 32px;
padding: 6px;
margin: 2px;
border-radius: 4px;
}
.alipay {
color: #2eabff;
font-size: 48px;
line-height: 48px;
border-radius: 4px;
}
}
// 密码强度
font.strong {
color: #52c41a;
}
font.medium {
color: yellow;
}
font.weak {
color: red;
}
}
src/routes/Userinfo/MessageView.js 0 → 100644
View file @ 09c7235c
import React, { Component, Fragment } from 'react';
import { Switch, List } from 'antd';
const Action = <Switch defaultChecked />;
export default class MessageView extends Component {
getData = () => {
return [
{
title: '账户密码',
description: '其他用户的消息将以站内信的形式通知',
actions: [Action],
},
{
title: '消息通知',
description: '已绑定手机：138****8293',
actions: [Action],
},
{
title: '系统消息',
description: '系统消息将以站内信的形式通知',
actions: [Action],
},
{
title: '待办通知',
description: '待办事项将以站内信的形式通知',
actions: [Action],
},
];
};
render() {
return (
<Fragment>
<List
itemLayout="horizontal"
dataSource={this.getData()}
renderItem={item => (
<List.Item actions={item.actions}>
<List.Item.Meta
title={item.title}
description={item.description}
/>
</List.Item>
)}
/>
</Fragment>
);
}
}
src/routes/Userinfo/PhoneView.js 0 → 100644
View file @ 09c7235c
import React, { Fragment, PureComponent } from 'react';
import { Input } from 'antd';
class PhoneView extends PureComponent {
render() {
const { value, onChange } = this.props;
let values = ['', ''];
if (value) {
values = value.split('-');
}
return (
<Fragment>
<Input
value={values[0]}
onChange={(e) => {
onChange(`${e.target.value}-${values[1]}`);
}}
style={{ width: 128, marginRight: 8 }}
/>
<Input
onChange={(e) => {
onChange(`${values[0]}-${e.target.value}`);
}}
value={values[1]}
style={{ width: 312 }}
/>
</Fragment>
);
}
}
export default PhoneView;
src/routes/Userinfo/SafeView.js 0 → 100644
View file @ 09c7235c
import React, { Component, Fragment } from 'react';
import { List } from 'antd';
const passwordStrength = {
strong: <font className="strong">强</font>,
medium: <font className="medium">中文</font>,
weak: <font className="weak">弱</font>,
};
export default class SafeView extends Component {
getData = () => {
return [
{
title: '账户密码',
description: (
<Fragment> 当前密码强度：{passwordStrength.strong}</Fragment>
),
actions: [<a>修改</a>],
},
{
title: '密保手机',
description: '已绑定手机：138****8293',
actions: [<a>修改</a>],
},
{
title: '密保问题',
description: '未设置密保问题，密保问题可有效保护账户安全',
actions: [<a>设置</a>],
},
{
title: '备用邮箱',
description: '已绑定邮箱：ant***sign.com',
actions: [<a>修改</a>],
},
{
title: 'MFA 设备',
description: '未绑定 MFA 设备，绑定后，可以进行二次确认',
actions: [<a>绑定</a>],
},
];
};
render() {
return (
<Fragment>
<List
itemLayout="horizontal"
dataSource={this.getData()}
renderItem={item => (
<List.Item actions={item.actions}>
<List.Item.Meta
title={item.title}
description={item.description}
/>
</List.Item>
)}
/>
</Fragment>
);
}
}
src/services/geographic.js 0 → 100644
View file @ 09c7235c
import request from '../utils/request';
export async function queryProvince() {
return request('/api/geographic/province');
}
export async function queryCity(province) {
return request(`/api/geographic/city/${province}`);
}
Markdown is supported
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