75 |
78 | 申请列表
76 |这里可以查看和审核业主租房申请,如果经过核实为真实信息,可以批准,并加入到民宿列表
77 |
79 |
99 |
100 | )
101 | }
102 | }
103 | //接受ajax的状态，请求回来的东西，通过this.props.ajaxStatus获取请求回来的东西
104 | let mapStateToProps = (state) =>{
105 | // console.log(state.loginReducer)//,给个判断，让请求中underfined的时候不报错
106 | return{
107 | ajaxStatus:state.checkReducer.status,
108 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
109 | }
110 | }
111 | //把组件，状态，方法发射出去（代替export default class Component）
112 | export default connect(mapStateToProps,actions)(CheckHomestay);
113 |
--------------------------------------------------------------------------------
/src/components/controldetalist/checkReducer.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | //深拷贝原始状态
3 | export default function checkReducer(state={},action){
4 |
5 | let newState = JSON.parse(JSON.stringify(state))
6 | switch(action.type){
7 | case ajaxConstants.AJAX_REQUESTING:
8 | newState.status = 0;
9 | break;
10 | case ajaxConstants.AJAX_REQUESTED:
11 | newState.status = 1;
12 | newState.result = action.result;
13 | break;
14 | case ajaxConstants.AJAX_REQUESTERROR:
15 | newState.status = -1;
16 | newState.result = action.result;
17 | break;
18 |
19 |
20 | }
21 | return newState;
22 | }
23 | //状态正在请求中 0
--------------------------------------------------------------------------------
/src/components/controldetalist/editAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as performanceConstants from '../../constaints/performanceConstants'
3 |
4 | export function selectPage(page){
5 | return{
6 | url:'selectpage',
7 | data:{page:page}
8 | }
9 | }
10 | export function deleteHomestray(hid){
11 | return{
12 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
13 | url:'delethomestray',
14 | data:{
15 | hid:hid
16 | }
17 | }
18 | }
19 | export function editHomestay(hid,city,price,title){
20 | return{
21 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
22 | url:'edithhomestay',
23 | data:{
24 | hid:hid,
25 | city:city,
26 | price:price,
27 | title:title
28 | }
29 | }
30 | }
31 | //假如需要传参
32 | //data:{}
--------------------------------------------------------------------------------
/src/components/controldetalist/editComponent.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 | import { Button,Icon,Rate,Pagination,Modal } from 'antd';
3 |
4 | import {connect} from 'react-redux'
5 | import * as actions from './editAction';
6 |
7 | class EditComponent extends Component{
8 |
9 | componentWillMount(){
10 | this.props.selectPage()
11 | this.setState({
12 | adminPermission:window.localStorage.Permission,
13 | })
14 | }
15 | state = {
16 | current:1,
17 | price:'',
18 | city:'',
19 | title:'',
20 | adminPermission:0,
21 | }
22 | onChange = (page) => {
23 | this.setState({
24 | current: page,
25 | });
26 | this.props.selectPage(page);
27 | }
28 | error(){
29 | Modal.error({
30 | title: '错误提示',
31 | content: '你不是又酷又帅气能旋转跳跃飞舞的鱼露，你没权操作'
32 | })
33 | }
34 | success(){
35 | Modal.success({
36 | title: '温馨提示',
37 | content: '你已经成功操作',
38 | });
39 | }
40 | delclick(hid){
41 | if(this.state.adminPermission==1){
42 | this.props.deleteHomestray(hid).then(function(){
43 | this.success();
44 |
45 | this.props.selectPage(this.current)
46 | }.bind(this))
47 |
48 | }else{
49 | this.error();
50 | }
51 | }
52 | saveclick(hid,hcity,htitle,hprice){
53 | var city = this.state.city;
54 | var price = this.state.price;
55 | var title = this.state.title;
56 | city = city != '' ? this.state.city : hcity;
57 | price = price != '' ? this.state.price : hprice;
58 | title = title != '' ? this.state.title : htitle;
59 | if(this.state.adminPermission==1){
60 | this.props.editHomestay(hid,city,this.state.price,this.state.title).then(function(){
61 | this.success()
62 | }.bind(this))
63 | }else{
64 | this.error();
65 | }
66 | }
67 | editTab(event){
68 | if(event.target.tagName=='TD'&&(event.target.className!='1'&&event.target.className!='5')){
69 | // console.log(event.target);
70 | let input = document.createElement('input');
71 | input.type = 'text';
72 | input.value = event.target.innerText;
73 | event.target.innerHTML = '';
74 | event.target.appendChild(input);
75 | input.focus();
76 |
77 | var self = this;
78 |
79 | input.onblur = function(){
80 | // console.log(this.parentNode.className);
81 | if(this.parentNode.className=='2'){
82 | self.setState({
83 | title:this.value,
84 | })
85 | }else if(this.parentNode.className=='3'){
86 | self.setState({
87 | price:this.value,
88 | })
89 | }else if(this.parentNode.className=='4'){
90 | self.setState({
91 | city:this.value,
92 | })
93 | }
94 | this.parentNode.innerHTML = this.value;
95 | }
96 |
97 |
98 | }
99 | }
100 | render(){
101 | return(
102 | -
80 | {
81 | this.props.ajaxResult.map(item =>{
82 | return (
83 |
-
84 |
85 |
民宿地址:{item.address}
86 |预算价格:{item.budget}
87 |所在城市:{item.city}
88 | 89 | 90 | 91 |
92 | )
93 | })
94 | }
95 |
96 |
97 |
103 |
144 | )
145 | }
146 | }
147 | let mapStateToProps = (state) =>{
148 | return{
149 | ajaxStatus:state.checkReducer.status,
150 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
151 | }
152 | }
153 | //把组件，状态，方法发射出去（代替export default class Component）
154 | export default connect(mapStateToProps,actions)(EditComponent);
--------------------------------------------------------------------------------
/src/components/controldetalist/employee.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 | import { Button,Icon,Rate,Modal } from 'antd';
3 |
4 | import {connect} from 'react-redux'
5 | import * as actions from './employeeAction';
6 |
7 | class Employee extends Component{
8 | state = {
9 | adminPermission:0,
10 | }
11 | componentWillMount(){
12 | this.props.getadmin()
13 | this.setState({
14 | adminPermission:window.localStorage.Permission,
15 | })
16 | }
17 | error(){
18 | Modal.error({
19 | title: '错误提示',
20 | content: '你不是又酷又帅气能旋转跳跃飞舞的鱼露，你没权操作'
21 | })
22 | }
23 | success(){
24 | Modal.success({
25 | title: '温馨提示',
26 | content: '你已经成功操作',
27 | });
28 | }
29 | delectclick(aid){
30 | if(this.state.adminPermission==1){
31 | this.props.dismissal(aid).then(function(){
32 | this.props.getadmin().then(function(){
33 | this.success();
34 |
35 | }.bind(this))
36 | }.bind(this));
37 | }else{
38 | this.error();
39 | console.log(this.state.adminPermission)
40 | }
41 | }
42 | render(){
43 | return(
44 |
104 |
107 | 编辑民宿信息
105 |你可以在这里修改已上线的民宿信息,或者删除信息错误的民宿
106 |
108 |
110 |
111 |
112 |
113 |
114 |
142 |
143 | | 序号 | 116 |酒店名称 | 117 |价格 | 118 |城市 | 119 |操作 | 120 |
|---|---|---|---|---|
| {idx+1} | 128 |{item.title} | 129 |{item.price} | 130 |{item.city} | 131 |132 | 133 | 134 | | 135 |
45 |
81 | )
82 | }
83 | }
84 | let mapStateToProps = (state) =>{
85 | return{
86 | ajaxStatus:state.checkReducer.status,
87 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
88 | }
89 | }
90 | //把组件，状态，方法发射出去（代替export default class Component）
91 | export default connect(mapStateToProps,actions)(Employee);
--------------------------------------------------------------------------------
/src/components/controldetalist/employeeAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as performanceConstants from '../../constaints/performanceConstants'
3 |
4 | export function getadmin(){
5 | return{
6 | url:'getadmin'
7 | }
8 | }
9 |
10 | export function dismissal(aid){
11 | return{
12 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
13 | url:'dismissal',
14 | data:{
15 | aid:aid,
16 | }
17 | }
18 | }
19 | //假如需要传参
20 | //data:{}
--------------------------------------------------------------------------------
/src/components/controldetalist/getPlanAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as performanceConstants from '../../constaints/performanceConstants'
3 |
4 | export function getplan(){
5 | return{
6 | url:'getplan'
7 | }
8 | }
9 |
10 | export function closePlan(wid){
11 | return{
12 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
13 | url:'closeplan',
14 | data:{
15 | wid:wid
16 | }
17 | }
18 | }
19 | //假如需要传参
20 | //data:{}
--------------------------------------------------------------------------------
/src/components/controldetalist/getPlanComponent.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 | import { Progress,Button,Icon,Modal } from 'antd';
3 |
4 | import {connect} from 'react-redux'
5 | import * as actions from './getPlanAction';
6 |
7 | const confirm = Modal.confirm;
8 | class GetPlanComponent extends Component{
9 | componentWillMount(){
10 | this.props.getplan()
11 | }
12 | deletplane(wid){
13 | this.props.closePlan(wid).then(function(){
14 | this.props.getplan()
15 |
16 | }.bind(this));
17 | }
18 | showConfirm(wid){
19 | var self = this;
20 | confirm({
21 | title: 'Do you want to delete these items?',
22 | content: 'When clicked the OK button,it will be delete!',
23 | onOk() {
24 | return new Promise((resolve, reject) => {
25 | setTimeout(Math.random() > 0.5 ? resolve : reject, 1000);
26 | self.deletplane(wid)
27 | }).catch(() => console.log('Oops errors!'));
28 | },
29 | onCancel() {},
30 | });
31 | }
32 | render(){
33 | return(
34 |
46 |
49 | 在职员工信息
47 |你可以查看到先公司的在员工信息,,以及他们的权限
48 |
50 |
51 |
52 |
79 |
80 | | 工号 | 54 |人员 | 55 |权限 | 56 |绩效 | 57 |操作 | 58 |
|---|---|---|---|---|
| {item.aid} | 66 |{item.username} | 67 |{item.permission} | 68 |70 | 71 | | 72 |
35 |
62 | )
63 | }
64 | }
65 | let mapStateToProps = (state) =>{
66 | return{
67 | ajaxStatus:state.checkReducer.status,
68 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
69 | }
70 | }
71 | //把组件，状态，方法发射出去（代替export default class Component）
72 | export default connect(mapStateToProps,actions)(GetPlanComponent);
73 |
--------------------------------------------------------------------------------
/src/components/controldetalist/goodTalk.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 |
3 | // 引入 ECharts 主模块
4 | import echarts from 'echarts/lib/echarts';
5 | // 引入柱状图
6 | import 'echarts/lib/chart/bar';
7 | // 引入提示框和标题组件
8 | import 'echarts/lib/component/tooltip';
9 | import 'echarts/lib/component/title';
10 |
11 | export default class GoodTalk extends Component{
12 | componentDidMount() {
13 | // 基于准备好的dom，初始化echarts实例
14 | var myChart = echarts.init(document.getElementById('datalist'));
15 | // 绘制图表
16 | myChart.setOption({
17 | title: { text: '热门城市的民宿好评率' },
18 | tooltip: {},
19 | xAxis: {
20 | data: ["广州", "上海", "北京", "三亚", "重庆", "武汉"]
21 | },
22 | yAxis: {},
23 | series: [{
24 | name: '好评率',
25 | type: 'bar',
26 | data: [65, 20, 36, 10, 50, 20],
27 | itemStyle:{
28 | normal:{
29 | color:'#4ad2ff'
30 | }
31 | },
32 | }]
33 | });
34 | }
35 | render(){
36 | return(
37 |
36 |
39 | 查看工作计划
37 |在这里你可以看到你记录下来的工作计划,以及它们的进度条
38 |
40 |
61 | -
41 | {
42 | this.props.ajaxResult.map(item => {
43 | return (
44 |
-
45 |
任务标题:{item.title}
起止日期: 46 | 47 | {item.deadline} 48 | 49 |
50 | 51 |任务内容:
52 | {item.content} 53 |进度条:54 | 55 |
56 | )
57 | })
58 | }
59 |
38 |
46 |
47 | )
48 | }
49 | }
--------------------------------------------------------------------------------
/src/components/controldetalist/performance.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 | import { Rate } from 'antd';
3 |
4 | import {connect} from 'react-redux';
5 | import * as actions from './performanceAction';
6 |
7 | class Performance extends Component{
8 | componentWillMount(){
9 | this.props.getperformance()
10 | }
11 | handleChange = (value,aid) => {
12 | // console.log(value,aid)
13 | this.props.changeRate(value,aid).then(function(){
14 | this.props.getperformance()
15 | }.bind(this))
16 | }
17 | render(){
18 | return(
19 |
39 |
42 | 各地民宿的好评率
40 |在这里可以查看各地民宿到各地城市民宿的好评率
41 |
43 |
44 |
45 |
20 |
52 | )
53 | }
54 | }
55 |
56 | let mapStateToProps = (state) =>{
57 | // console.log(state);
58 | return{
59 | ajaxStatus:state.checkReducer.status,
60 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
61 |
62 | }
63 | }
64 | //把组件，状态，方法发射出去（代替export default class Component）
65 | export default connect(mapStateToProps,actions)(Performance);
--------------------------------------------------------------------------------
/src/components/controldetalist/performanceAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as performanceConstants from '../../constaints/performanceConstants'
3 |
4 |
5 | export function getperformance(){
6 | return{
7 | url:'getadmin'
8 | }
9 | }
10 |
11 | export function changeRate(aid,value){
12 | return{
13 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
14 | url:'changerate',
15 | data:{aid:aid,rate:value}
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/src/components/controldetalist/performanceReducer.js:
--------------------------------------------------------------------------------
1 | import * as performanceConstants from '../../constaints/performanceConstants'
2 |
3 | export default function checkReducer(state={},action){
4 |
5 | let newState = JSON.parse(JSON.stringify(state))
6 | switch(action.type){
7 | case performanceConstants.PERFORMANCE_REQUESTING:
8 | newState.status = 0;
9 | break;
10 | case performanceConstants.PERFORMANCE_REQUESTED:
11 | newState.status = 1;
12 | newState.result = action.result;
13 | break;
14 | case performanceConstants.PERFORMANCE_REQUESTERROR:
15 | newState.status = -1;
16 | newState.result = action.result;
17 | break;
18 |
19 |
20 | }
21 | return newState;
22 | }
23 |
--------------------------------------------------------------------------------
/src/components/controldetalist/sell.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 |
3 | // 引入 ECharts 主模块
4 | import echarts from 'echarts/lib/echarts';
5 | // 引入柱状图
6 | import 'echarts/lib/chart/bar';
7 | // 引入提示框和标题组件
8 | import 'echarts/lib/component/tooltip';
9 | import 'echarts/lib/component/title';
10 |
11 | export default class Sell extends Component{
12 | componentDidMount() {
13 | // 基于准备好的dom，初始化echarts实例
14 | var myChart = echarts.init(document.getElementById('datalist'));
15 | // 绘制图表
16 | myChart.setOption({
17 | title: { text: '热门城市已拥有的民宿数' },
18 | tooltip: {},
19 | xAxis: {
20 | data: ["广州", "上海", "北京", "三亚", "重庆", "武汉"]
21 | },
22 | yAxis: {},
23 | series: [{
24 | name: '已拥有的民宿数目',
25 | type: 'bar',
26 | data: [365, 220, 236, 110, 150, 320]
27 | }]
28 | });
29 | }
30 | render(){
31 | return(
32 |
21 |
24 | 员工评分
22 |对所有在职的员工进行评分
23 |
25 |
26 |
27 |
49 |
50 |
51 | | 员工 | 29 |评分 | 30 |
|---|---|
| {item.username} | 40 |
33 |
41 | )
42 | }
43 | }
--------------------------------------------------------------------------------
/src/components/controldetalist/setPlanAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as performanceConstants from '../../constaints/performanceConstants'
3 |
4 | export function setPlan(title,content,deadline){
5 | console.log(title,content,deadline);
6 | return{
7 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
8 | url:'setplan',
9 | data:{
10 | title:title,
11 | content:content,
12 | deadline:deadline,
13 | }
14 | }
15 | }
--------------------------------------------------------------------------------
/src/components/controldetalist/setPlanComponent.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 | import { DatePicker,Input,Button,Modal} from 'antd';
3 | import './../control/control.scss';
4 |
5 | import {connect} from 'react-redux';
6 | import * as actions from './setPlanAction';
7 |
8 | import $ from 'jquery';
9 | const { MonthPicker, RangePicker, WeekPicker } = DatePicker;
10 |
11 | class SetPlanComponent extends Component{
12 | state = {
13 | title:'',
14 | content:'',
15 | deadline:'',
16 | }
17 | onChange(date,dateString){
18 | console.log(dateString)
19 | var d = dateString.join(',')
20 | this.setState({
21 | deadline:d
22 | })
23 | }
24 | success(){
25 | Modal.success({
26 | title: '温馨提示',
27 | content: '保存成功',
28 | });
29 | }
30 | error(){
31 | Modal.error({
32 | title: '错误提示',
33 | content: '内容不能为空'
34 | })
35 | }
36 | title(e){
37 | this.setState({
38 | title:e.target.value
39 | })
40 | }
41 | setplan(){
42 | if(this.state.deadline!=''&&this.state.title!=''&&this.state.content!=''){
43 | this.props.setPlan(this.state.title,this.state.content,this.state.deadline).then(function(){
44 |
45 | this.success();
46 | console.log($('input'))
47 | $('input').val("");
48 | $('textarea').val("");
49 | }.bind(this))
50 | }else{
51 | this.error();
52 | }
53 | }
54 | content(e){
55 | this.setState({
56 | content:e.target.value
57 | })
58 | }
59 | render(){
60 | return(
61 |
34 |
37 | 各城市民宿的营业状况
35 |在这里可以看到各城市民宿的营业状况,然后对以后的工作攻略进行修改
36 |
38 |
39 |
40 |
62 |
87 | )
88 | }
89 | }
90 |
91 | let mapStateToProps = (state) =>{
92 | // console.log(state);
93 | return{
94 | ajaxStatus:state.checkReducer.status,
95 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
96 |
97 | }
98 | }
99 | //把组件，状态，方法发射出去（代替export default class Component）
100 | export default connect(mapStateToProps,actions)(SetPlanComponent);
--------------------------------------------------------------------------------
/src/components/home/homeComponent.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react'
2 | //引入字体
3 | import {Icon} from 'antd';
4 |
5 |
6 | //这里不引的话，就用不了Link
7 | import {Link} from 'react-router'
8 |
9 | export default class HomeComponent extends Component{
10 | render(){
11 | return(
12 |
63 |
66 | 计划表单
64 |你可以在这里制定你的工作计划
65 |
67 |
86 | 68 | 69 | 70 | 71 |
72 |
73 |
74 |
75 |
78 | 79 | 80 | 81 | 82 | 83 |
84 | 85 |
13 |
25 | )
26 | }
27 | }
28 |
--------------------------------------------------------------------------------
/src/components/login/loginAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as loginConstants from '../../constaints/loginConstants'
3 |
4 | export function loginAdmin(username,password){
5 | return{
6 | url:'loginadmin',
7 | method:'post',
8 | types:[loginConstants.LOGIN_REQUESTING,loginConstants.LOGIN_REQUESTED,loginConstants.LOGIN_REQUESTERROR],
9 | data:{
10 | username:username,
11 | password:password
12 | }
13 | }
14 | }
--------------------------------------------------------------------------------
/src/components/login/loginComponent.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react';
2 |
3 | import { Form, Icon, Input, Button, Checkbox,Alert } from 'antd';
4 | import {Link,hashHistory} from 'react-router'
5 | import {connect} from 'react-redux'
6 |
7 | import * as actions from './loginAction';
8 |
9 | class LoginComponent extends Component{
10 | state = {
11 | username:'',
12 | password:'',
13 | display:'none',
14 | }
15 | changeA(){
16 | this.setState({
17 | username:this.refs.username.value,
18 | password:this.refs.password.value
19 | })
20 | }
21 | checklogin(){
22 | var reg=/^[a-zA-Z]{3,7}$/;
23 |
24 | if(reg.test(this.refs.username.value)==true){
25 | this.setState({
26 | display:'none'
27 | })
28 |
29 | }else{
30 | this.setState({
31 | display:'block'
32 | })
33 | }
34 | }
35 | login(){
36 | this.props.loginAdmin(this.state.username,this.state.password).then(function(res){
37 |
38 | if(res==false){
39 | alert("登录失败，请检查用户名或密码")
40 | }else{
41 | window.localStorage.aid = res[0].aid
42 | window.localStorage.Permission = res[0].permission
43 | alert('登录成功，正在进入..')
44 | hashHistory.push({
45 | pathname:'/control',
46 | // query:{
47 | // aidnumber:res[0].aid
48 | // }
49 | })
50 |
51 | }
52 | })
53 |
54 | }
55 | render(){
56 |
57 | return(
58 |
14 |
15 |
18 |
23 |
15 |
18 | -
19 |
登录
20 | 注册
21 |
{this.props.children}
24 |
59 |
92 | )
93 |
94 | }
95 | }
96 |
97 | let mapStateToProps = (state) =>{
98 | // console.log(state);
99 | return{
100 | ajaxStatus:state.checkReducer.status,
101 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
102 |
103 | }
104 | }
105 | //把组件，状态，方法发射出去（代替export default class Component）
106 | export default connect(mapStateToProps,actions)(LoginComponent);
--------------------------------------------------------------------------------
/src/components/login/loginReducer.js:
--------------------------------------------------------------------------------
1 | import * as loginConstants from '../../constaints/loginConstants'
2 |
3 | export default function loginReducer(state={},action){
4 |
5 | let newState = JSON.parse(JSON.stringify(state))
6 | switch(action.type){
7 | case loginConstants.LOGIN_REQUESTING:
8 | newState.status = 0;
9 | break;
10 | case loginConstants.LOGIN_REQUESTED:
11 | newState.status = 1;
12 | newState.result = action.result;
13 | break;
14 | case loginConstants.LOGIN_REQUESTERROR:
15 | newState.status = -1;
16 | newState.result = action.result;
17 | break;
18 |
19 |
20 | }
21 | return newState;
22 | }
23 |
--------------------------------------------------------------------------------
/src/components/register/registerAction.js:
--------------------------------------------------------------------------------
1 | import * as ajaxConstants from '../../constaints/ajaxConstants'
2 | import * as performanceConstants from '../../constaints/performanceConstants'
3 |
4 | export function insertReister(username,password){
5 | console.log(username,password)
6 | return{
7 | url:'registeradmin',
8 | method:'post',
9 | data:{
10 | types:[performanceConstants.PERFORMANCE_REQUESTING,performanceConstants.PERFORMANCE_REQUESTED,performanceConstants.PERFORMANCE_REQUESTERROR],
11 | username:username,
12 | password:password
13 | }
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/components/register/registerCompoent.js:
--------------------------------------------------------------------------------
1 | import React,{Component} from 'react';
2 |
3 | import { Form, Icon, Input, Button, Checkbox, Alert } from 'antd';
4 | import {Link,hashHistory} from 'react-router'
5 | import {connect} from 'react-redux'
6 |
7 | import * as actions from './registerAction';
8 |
9 | class RegisterComponent extends Component{
10 | state = {
11 | username:'',
12 | password:'',
13 | display:'none',
14 | repeat:'none',
15 | }
16 | changeA(){
17 | this.setState({
18 | username:this.refs.username.value,
19 | password:this.refs.password.value
20 | })
21 | }
22 | checkregister(){
23 | var reg=/^[a-zA-Z]{3,7}$/;
24 |
25 | if(reg.test(this.refs.username.value)==true){
26 | this.setState({
27 | display:'none'
28 | })
29 | }else{
30 | this.setState({
31 | display:'block'
32 | })
33 | }
34 | }
35 | register(){
36 |
37 | this.props.insertReister(this.state.username,this.state.password).then(function(res){
38 | if(res==false){
39 | this.setState({
40 | repeat:'block'
41 | })
42 | }else if(res==true){
43 | this.setState({
44 | repeat:'none'
45 | })
46 | alert('注册成功，正在跳转到登录页面..')
47 | hashHistory.push({
48 | pathname:'/login'
49 | })
50 |
51 | }
52 | }.bind(this))
53 | }
54 | render(){
55 | return(
56 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
91 |
69 |
85 | 70 | 71 | 72 |
73 |
74 |
76 | 77 | 78 | 79 |
80 |81 | 82 | new employee? 83 |
84 |
86 | Welcome to Homestay Master
87 |
88 |
89 |
90 |
57 |
93 | )
94 |
95 | }
96 | }
97 |
98 | let mapStateToProps = (state) =>{
99 | // console.log(state);
100 | return{
101 | ajaxStatus:state.checkReducer.status,
102 | ajaxResult:state.checkReducer.result == undefined ? [] : state.checkReducer.result.news
103 |
104 | }
105 | }
106 | //把组件，状态，方法发射出去（代替export default class Component）
107 | export default connect(mapStateToProps,actions)(RegisterComponent);
--------------------------------------------------------------------------------
/src/constaints/ajaxConstants.js:
--------------------------------------------------------------------------------
1 | //定义action
2 | export const AJAX_REQUESTING = 'AJAX_REQUESTING'
3 | export const AJAX_REQUESTED = 'AJAX_REQUESTED'
4 | export const AJAX_REQUESTERROR = 'AJAX_REQUESTERROR'
--------------------------------------------------------------------------------
/src/constaints/loginConstants.js:
--------------------------------------------------------------------------------
1 | //定义action
2 | export const LOGIN_REQUESTING = 'LOGIN_REQUESTING'
3 | export const LOGIN_REQUESTED = 'LOGIN_REQUESTED'
4 | export const LOGIN_REQUESTERROR = 'LOGIN_REQUESTERROR'
--------------------------------------------------------------------------------
/src/constaints/performanceConstants.js:
--------------------------------------------------------------------------------
1 | //定义action
2 | export const PERFORMANCE_REQUESTING = 'PERFORMANCE_REQUESTING'
3 | export const PERFORMANCE_REQUESTED = 'PERFORMANCE_REQUESTED'
4 | export const PERFORMANCE_REQUESTERROR = 'PERFORMANCE_REQUESTERROR'
--------------------------------------------------------------------------------
/src/redux/configstore.js:
--------------------------------------------------------------------------------
1 | //步骤1
2 | import React from 'react';
3 | import {createStore,applyMiddleware} from 'redux'
4 |
5 | //引入中间件，中间件有做什么作用叻？
6 | import middleware from './middleware'
7 |
8 | //引入reducer，有什么作用叻？
9 | //一个纯函数，通过对应的action，type执行相对应的方法，从而改变state的值
10 | //接受两个参数，旧状态的state，一个action对象，返回一个新的state
11 | import rootReducer from './rootReducer'
12 |
13 |
14 | //生成一个store
15 | const store = createStore(rootReducer,applyMiddleware(middleware));
16 |
17 | export default store;
--------------------------------------------------------------------------------
/src/redux/middleware.js:
--------------------------------------------------------------------------------
1 | /*
2 | 为什么需要中间件？
3 | 一个确定的纯对象，而例如异步ajax请求，
4 | 可能会包含了很多种的行为（请求中，请求成功，请求失败等···），
5 | 因此我们需要使用中间件将一个不确定的action转变或拆分成多个标准的plain object交由reducer处理。）
6 | */
7 | //把前端的网络配置引进来
8 | import http from '../utils/httpclient';
9 |
10 | import * as ajaxContants from '../constaints/ajaxConstants'
11 | //定义一个方法
12 | export default function middleware(api){
13 | return function(dispatch){
14 | return function(action){
15 | let {type,types,method = 'get',data={},url} =action;
16 |
17 | if(!url){
18 | return dispatch(action)
19 | }
20 | let defaultConstants = [ajaxContants.AJAX_REQUESTING, ajaxContants.AJAX_REQUESTED, ajaxContants.AJAX_REQUESTERROR];
21 | //如果有就使用传过来的，没有就使用默认的，是由Action.js传过来的
22 | let [requesting, requested, requesterror] = types ? types : defaultConstants;
23 |
24 | api.dispatch({type:requesting});
25 | if(url){
26 | return new Promise((resolve, reject) => {
27 | http[method](url, data).then(res => {
28 | api.dispatch({
29 | type: requested,
30 | result: JSON.parse(res.text)
31 | })
32 | resolve(JSON.parse(res.text))
33 | }).catch(error => {
34 | api.dispatch({
35 | type: requesterror,
36 | result: error
37 | })
38 | reject(error)
39 | })
40 | })
41 | // http[method](url,data).then(res => {
42 | // console.log(JSON.parse(res.text));
43 | // api.dispatch({
44 | // type:requested,
45 | // result:JSON.parse(res.text)
46 | // })
47 | // }).catch(error => {
48 | // api.dispatch({
49 | // type: requesterror,
50 | // result:error
51 | // })
52 | // })
53 | }
54 | }
55 | }
56 | }
57 |
--------------------------------------------------------------------------------
/src/redux/rootReducer.js:
--------------------------------------------------------------------------------
1 | //所有的reducer的汇总
2 | import {combineReducers} from 'redux'
3 |
4 | import checkReducer from '../components/controldetalist/checkReducer'
5 | import performanceReducer from '../components/controldetalist/performanceReducer'
6 | import loginReducer from '../components/login/loginReducer'
7 |
8 | export default combineReducers({
9 | checkReducer,
10 | performanceReducer,
11 | loginReducer
12 | })
13 |
14 |
--------------------------------------------------------------------------------
/src/router/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import {Route,Redirect,IndexRoute} from 'react-router'
3 |
4 |
5 |
6 | //引入字体图标
7 | import {Icon} from 'antd';
8 | import 'antd/dist/antd.css';
9 |
10 | import HomeComponent from '../components/home/homeComponent'
11 | import RegisterComponent from '../components/register/registerCompoent'
12 | import LoginComponent from '../components/login/loginComponent'
13 | import ControlComponent from '../components/control/ControlComponent'
14 | //控制台的详情页
15 | import SetPlanComponent from '../components/controldetalist/setPlanComponent'
16 | import GetPlanComponent from '../components/controldetalist/getPlanComponent'
17 | import CheckHomestay from '../components/controldetalist/checkHomestay'
18 | import Employee from '../components/controldetalist/employee'
19 | import Performance from '../components/controldetalist/performance'
20 | import GoodTalk from '../components/controldetalist/GoodTalk'
21 | import Sell from '../components/controldetalist/sell'
22 | import Edit from '../components/controldetalist/editComponent'
23 |
24 | const routes = (
25 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
92 |
67 |
86 | 68 | 69 | 70 |
71 |
72 |
74 |
75 |
77 | 78 | 79 | 80 |
81 |82 | 83 | already have? 84 |
85 |
87 |
88 | Join in Homestay Master
89 |
90 |
91 |