save

package.json

@@ -35,6 +35,7 @@
     "graphql-tag": "^2.10.0",
     "html-webpack-plugin": "4.0.0-alpha.2",
     "identity-obj-proxy": "3.0.0",
+    "input-moment": "^0.4.0",
     "jest": "23.6.0",
     "jest-pnp-resolver": "1.0.1",
     "jest-resolve": "23.6.0",

src/gql.js

@@ -266,8 +266,37 @@ const createserver = `
     }
 `;
 
+const servicebyid = `
+    query servicebyid($id: ID) {
+      servicebyid: service_by_id(id: $id) {
+        id
+        server_id {
+          id
+          name
+          description
+          img
+          createdAt
+          updatedAt
+        }
+        repertory_id {
+          id
+          count
+          createdAt
+          updatedAt
+        }
+        description
+        price
+        startTime
+        lastTime
+        createdAt
+        updatedAt
+      }
+    }
+`;
+
 
 export {
+    servicebyid,
     serverbyprops,
     servicebyprops,
     orderbyprops,

src/page/display/Display.js

@@ -57,11 +57,11 @@ class Display extends Component {
                                     }
 
                                     return (
-                                        <Server
-                                            servers={servers}
-                                            tip={tip}
-                                            pageSwitchToService={this.pageSwitchToService}
-                                        />
+                                            <Server
+                                                servers={servers}
+                                                tip={tip}
+                                                pageSwitchToService={this.pageSwitchToService}
+                                            />
                                     )
                                 }
                             }

src/page/display/Service.js

@@ -108,7 +108,11 @@ class OrderButton extends Component {
                             return (
                                 <Mutation
                                     mutation={gql(createorderAndupdaterepertory)}
-                                    refetchQueries={[{query: gql(orderbyprops), variables: {user_id: userID, orderStatus: 'success'}}]}
+                                    refetchQueries={[
+                                        {query: gql(orderbyprops), variables: {user_id: userID, orderStatus: 'success'}},
+                                        {query: gql(orderbyprops), variables: {orderStatus: 'success'}},
+                                        {query: gql(orderbyprops), variables: {}}
+                                    ]}
                                 >
                                     {(iwantu, {loading, error}) => {
                                         if (loading)

src/page/home/Ordered.js

@@ -114,7 +114,13 @@ class CancelButton extends Component {
                         return (
                             <Mutation
                                 mutation={gql(updateorderAndupdaterepertory)}
-                                refetchQueries={[{query: gql(orderbyprops), variables: {user_id: userID, orderStatus: 'success'}}, {query: gql(orderbyprops), variables: {user_id: userID, orderStatus: 'cancelled'}}]}
+                                refetchQueries={[
+                                        {query: gql(orderbyprops), variables: {user_id: userID, orderStatus: 'success'}},
+                                        {query: gql(orderbyprops), variables: {user_id: userID, orderStatus: 'cancelled'}},
+                                        {query: gql(orderbyprops), variables: {orderStatus: 'success'}},
+                                        {query: gql(orderbyprops), variables: {orderStatus: 'cancelled'}},
+                                        {query: gql(orderbyprops), variables: {}}
+                                    ]}
                             >
                                 {(updateBothTwo, {loading, error}) => {
                                     if (loading)

src/page/manage/Release.js

@@ -1,11 +1,13 @@
 import React, {Component} from 'react';
 import './index.css';
-import {NoticeBar, List, InputItem, ImagePicker, Button} from 'antd-mobile';
+import {NoticeBar, List, InputItem, ImagePicker, Button, Stepper} from 'antd-mobile';
 import {Query, Mutation} from "react-apollo";
 import {Spin} from 'antd';
 import gql from "graphql-tag";
-import {serverbyprops, servicebyprops, createserver} from "../../gql";
+import {servicebyid, serverbyprops, servicebyprops, createserver} from "../../gql";
 import {idGen} from "../../func";
+import InputMoment from 'input-moment';
+import moment from 'moment';
 
 const Item = List.Item;
 
@@ -96,6 +98,12 @@ class ServiceList extends Component {
         }
     }
 
+    componentWillReceiveProps() {
+        this.setState({
+            serviceID: ''
+        });
+    }
+
     render() {
         let {serverID} = this.props;
         return (
@@ -109,41 +117,50 @@ class ServiceList extends Component {
                             return 'error!';
                         }
                         return (
-                            <List renderHeader={() => 'TA的服务项'} className="my-list">
-                                {
-                                    data.servicebyprops.map(service =>
-                                        <Item
-                                            key={service.id}
-                                            arrow="horizontal"
-                                            multipleLine
-                                            onClick={() => {
-                                                this.setState({
-                                                    serviceID: service.id
-                                                })
-                                            }}
-                                        >
-                                            {service.description}
-                                        </Item>
-                                    )
-                                }
-
-                                <Item
-                                    arrow="horizontal"
-                                    multipleLine
-                                    onClick={() => {
-                                        this.setState({
-                                            serviceID: 'add'
-                                        })
-                                    }}
-                                >
+                            <div>
+                                <List renderHeader={() => 'TA的服务项'} className="my-list">
                                     {
-                                        data.servicebyprops.length === 0 ?
-                                            '没有服务项，点我添加' : '添加'
+                                        data.servicebyprops.map(service =>
+                                            <Item
+                                                key={service.id}
+                                                arrow="horizontal"
+                                                multipleLine
+                                                onClick={() => {
+                                                    this.setState({
+                                                        serviceID: service.id
+                                                    })
+                                                }}
+                                            >
+                                                {service.description}
+                                            </Item>
+                                        )
                                     }
-                                </Item>
+
+                                    <Item
+                                        arrow="horizontal"
+                                        multipleLine
+                                        onClick={() => {
+                                            this.setState({
+                                                serviceID: 'add'
+                                            })
+                                        }}
+                                    >
+                                        {
+                                            data.servicebyprops.length === 0 ?
+                                                '没有服务项，点我添加' : '添加'
+                                        }
+                                    </Item>
+                                </List>
+
+                                {
+                                    this.state.serviceID ?
+                                        <ServiceDetail serviceID={this.state.serviceID}/>
+                                        :
+                                        ''
+                                }
+                            </div>
 
 
-                            </List>
                         )
                     }
                 }
@@ -181,8 +198,12 @@ class AddServer extends Component {
         const {files, name, description} = this.state;
         return (
             <List renderHeader={() => '请输入服务信息'}>
-                <InputItem onChange={(e)=>{this.setState({name: e})}} value={name} placeholder="请输入名称">名称</InputItem>
-                <InputItem onChange={(e)=>{this.setState({description: e})}} value={description} placeholder="请输入简介">简介</InputItem>
+                <InputItem onChange={(e) => {
+                    this.setState({name: e})
+                }} value={name} placeholder="请输入名称">名称</InputItem>
+                <InputItem onChange={(e) => {
+                    this.setState({description: e})
+                }} value={description} placeholder="请输入简介">简介</InputItem>
                 <ImagePicker
                     files={files}
                     onChange={this.onChange}
@@ -191,8 +212,8 @@ class AddServer extends Component {
                     multiple={false}
                 />
                 <Item>
-                    <SubmitButton
-                        img={files[0]?files[0].url:''}
+                    <SubmitServerButton
+                        img={files[0] ? files[0].url : ''}
                         name={name}
                         description={description}
                     />
@@ -203,13 +224,250 @@ class AddServer extends Component {
     }
 }
 
-class SubmitButton extends Component {
+class SubmitServerButton extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {}
+    }
+
+    render() {
+        let {name, description, img} = this.props;
+        return (
+            <Mutation
+                mutation={gql(createserver)}
+                refetchQueries={[{query: gql(serverbyprops), variables: {}}]}
+            >
+                {(createserver, {loading, error}) => {
+                    if (loading)
+                        return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
+                    if (error)
+                        return 'error';
+                    let varObj = {
+                        id: idGen('server'),
+                        name,
+                        description,
+                        img,
+                        createdAt: new Date().getTime(),
+                        updatedAt: ''
+                    };
+                    return (
+                        <Button type="primary" size="small" inline onClick={() => {
+                            createserver({variables: varObj})
+                        }}>提交</Button>
+                    )
+                }}
+            </Mutation>
+        )
+    }
+}
+
+class ServiceDetail extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {}
+    }
+
+
+    render() {
+        let {serviceID} = this.props;
+        return (
+            <Query query={gql(servicebyid)} variables={{id: serviceID}}>
+                {
+                    ({loading, error, data}) => {
+                        if (loading) {
+                            return <Spin className={'spin'}/>
+                        }
+                        if (error) {
+                            return 'error!';
+                        }
+                        let service = data.servicebyid;
+
+                        var description = '',
+                            startTime = '',
+                            lastTime = '',
+                            price = '',
+                            repertory = '';
+
+                        if (service !== null) {
+                            description = service.description;
+                            startTime = service.startTime;
+                            lastTime = service.lastTime;
+                            price = service.price;
+                            repertory = service.repertory_id.count;
+                        }
+
+                        return (
+                            <ServiceDetailRender
+                                serviceID={serviceID}
+                                description={description}
+                                startTime={startTime}
+                                lastTime={lastTime}
+                                price={price}
+                                repertory={repertory}
+                            />
+                        )
+                    }
+                }
+            </Query>
+        )
+    }
+}
+
+class ServiceDetailRender extends Component {
     constructor(props) {
         super(props);
         this.state = {
+            serviceID: props.serviceID,
+            description: props.description,
+            lastTime: props.lastTime,
+            startTime: props.startTime,
+            price: props.price,
+            repertory: props.repertory,
+            showCalendar: false,
+            m: moment()
         }
     }
 
+    componentWillReceiveProps(next) {
+        this.setState({
+            serviceID: next.serviceID,
+            description: next.description,
+            lastTime: next.lastTime,
+            startTime: next.startTime,
+            price: next.price,
+            repertory: next.repertory,
+            showCalendar: false
+        })
+    }
+
+    onReset = () => {
+        this.setState({
+            startTime: '',
+            lastTime: '',
+            description: '',
+            price: '',
+            repertory: 1
+        })
+    };
+
+    handleChange = m => {
+        this.setState({ m });
+    };
+
+    handleSave = () => {
+        console.log('saved', this.state.m.format('llll'));
+    };
+
+    render() {
+        let {serviceID, description, startTime, lastTime, price, repertory} = this.state;
+        return (
+            <div>
+                <List renderHeader={() => '请输入服务项信息'}>
+                    <InputItem onChange={(e) => {
+                        this.setState({name: e})
+                    }} value={description} placeholder="请输入服务类型">服务类型</InputItem>
+                    <InputItem onChange={(e) => {
+                        this.setState({price: e})
+                    }} value={price} placeholder="请输入价格">价格</InputItem>
+                    <Item arrow="horizontal"
+                          onClick={() => {
+                              document.getElementsByTagName('body')[0].style.overflowY = 'hidden';
+                              this.setState({
+                                  showCalendar: true
+                              });
+                          }}
+                    >
+                        选择开放时间
+                    </Item>
+                    <Item
+                        wrap
+                        extra={
+                            <Stepper
+                                style={{ width: '100%', minWidth: '100px' }}
+                                showNumber
+                                min={0}
+                                value={repertory}
+                                onChange={(e)=>{
+                                    this.setState({repertory: e})
+                                }}
+                            />}
+                    >
+                        库存
+                    </Item>
+                    <Item>
+                        {
+                            serviceID === 'add'?
+                                <SubmitServiceCreateButton/>
+                                :
+                                <SubmitServiceUpdateButton/>
+                        }
+                        <Button size="small" inline style={{marginLeft: '2.5px'}} onClick={this.onReset}>重置</Button>
+                    </Item>
+                </List>
+                {
+                    this.state.showCalendar?
+                        <InputMoment
+                            moment={this.state.m}
+                            onChange={this.handleChange}
+                            minStep={5}
+                            onSave={this.handleSave}
+                            prevMonthIcon="ion-ios-arrow-left"
+                            nextMonthIcon="ion-ios-arrow-right"
+                            style={{position: 'absoluted', top: 0, left: 0}}
+                        />
+                        :
+                        ''
+                }
+
+            </div>
+
+        )
+    }
+}
+
+class SubmitServiceUpdateButton extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {}
+    }
+
+    render() {
+        let {name, description, img} = this.props;
+        return (
+            <Mutation
+                mutation={gql(createserver)}
+                refetchQueries={[{query: gql(serverbyprops), variables: {}}]}
+            >
+                {(createserver, {loading, error}) => {
+                    if (loading)
+                        return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
+                    if (error)
+                        return 'error';
+                    let varObj = {
+                        id: idGen('server'),
+                        name,
+                        description,
+                        img,
+                        createdAt: new Date().getTime(),
+                        updatedAt: ''
+                    };
+                    return (
+                        <Button type="primary" size="small" inline onClick={() => {
+                            createserver({variables: varObj})
+                        }}>提交</Button>
+                    )
+                }}
+            </Mutation>
+        )
+    }
+}
+
+class SubmitServiceCreateButton extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {}
+    }
+
     render() {
         let {name, description, img} = this.props;
         return (
@@ -231,7 +489,9 @@ class SubmitButton extends Component {
                         updatedAt: ''
                     };
                     return (
-                        <Button type="primary" size="small" inline onClick={()=>{createserver({variables: varObj})}}>提交</Button>
+                        <Button type="primary" size="small" inline onClick={() => {
+                            createserver({variables: varObj})
+                        }}>提交</Button>
                     )
                 }}
             </Mutation>