订单2021-11-15

/*
 * @Author: your name
 * @Date: 2021-08-12 16:55:43
 * @LastEditTime: 2021-08-23 10:07:51
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \hzero-order-32920\packages\hzero-order\src\pages\order-mange\component\DetailPage.js
 */

import { Form, DatePicker, Button, Table, TextField, Lov, Output } from 'choerodon-ui/pro'
import { withRouter } from 'react-router-dom';
import React from 'react'
import intl from "utils/intl";
const DetailPage = (props) => {
    /**
     * @description: 删除行订单
     * @param {*}
     * @return {*}
     */
    const handleDeleteLine = () => {
        props.inLineDS.data.map((item) => {
            if (item.isSelected) {
                const fn = async () => {
                    const res = await props.inLineDS.delete(item)
                    if (res) {
                        props.inDetailHeadDS.query(1)
                        props.tableTotalDS.query(1)
                    }
                }
                fn()
            }
        })
    }
    /**
     * @description: 添加行订单
     * @param {*}
     * @return {*}
     */
    const handleAdd = () => {
        console.log(props.inLineDS);
        const record = props.inLineDS.create({}, 0);
        record.setState('editing', true);
    };
    /**
     * @description: 列订单按钮
     * @param {*}
     * @return {*}
     */
    const buttons = [
        <Button icon="playlist_add"
            onClick={handleAdd}
            key='add'
            disabled={(props.OrderStatus != "NEW" && props.OrderStatus != 'REJECTED')} >
            {intl.get('hzero.common.button.add').d('新增')}</ Button>,
        <Button icon="playlist_add" onClick={handleDeleteLine} key='delete'
            disabled={(props.OrderStatus != "NEW" && props.OrderStatus != 'REJECTED')}>
            {intl.get('hzero.common.button.delete').d('删除')}</Button>
    ]
    /**
     * @description: 编辑行订单
     * @param {*}
     * @return {*}
     */
    const handleEdit = (record) => {
        record.setState('editing', true);
    };
    /**
     * @description: 编辑取消回调函数
     * @param {*}
     * @return {*}
     */   
    const handleCancel = (record) => {
        if (record.status === 'add') {
            props.inLineDS.remove(record);
        } else {
            record.reset();
            record.setState('editing', false);
        }
    };
    /**
     * @description: 计算总金额
     * @param {*}
     * @return {*}
     */    
    const getToTalPrice = () => {
        if(props.inLineDS.records){
              let price = 0;
        for (let item of props.inLineDS.records) {
            if(item.get('unitSellingPrice')&&item.get('orderQuantity') ){
              price += item.get('orderQuantity') * item.get('unitSellingPrice');
            }
         
        }
        return  <span>{price}</span>
       
        }
      else{
          return <span>0</span>
      }
    };
    /**
     * @description: 行订单确认回调
     * @param {*}
     * @return {*}
     */   
    const handleSubmit = async () => {
        //等待验证字段是否符合规范
        const valid = !await props.inLineDS.validate();
        if (valid) {
            alert("输入数据有误,验证不成功,请重新输入")
        }
        else {
            const res = await props.inLineDS.submit();
            if (res) {
                props.inLineDS.query(1);
            }
        }
    };
   
    const columns = [
        { name: 'lineNumber', align: "left", editor: (record) => record.getState('editing') },
        { name: 'itemLOV', editor: (record) => record.getState('editing') },
        { name: 'itemDescription', },
        { name: 'orderQuantityUom' },
        { name: 'orderQuantity', align: "left", editor: (record) => record.getState('editing') },
        { name: 'unitSellingPrice', align: "left", editor: (record) => record.getState('editing') },
        {
            name: 'totalPrice', align: "left", renderer: ({ record }) => {
                //计算行订单金额
                if (record.get("orderQuantity") && record.get("unitSellingPrice")) {
                    return (
                        <p style={{ width: '300px' }}>
                            {record.get("orderQuantity") * record.get("unitSellingPrice")}
                        </p>
                    )
                } else {
                    return (
                        <p style={{ width: '300px' }}>0</p>
                    )
                }
            }
        },
        { name: 'description', editor: (record) => record.getState('editing'), align: "center", },
        {
            header: '操作', align: "center", lock: "right", text: '编辑',
            //操作列回调函数
            renderer: ({ record }) => {
                const btns = [];
                if (record.getState('editing')) {
                    btns.push(
                        <a onClick={handleSubmit} style={{ marginRight: '0.1rem' }}>
                            确认
                        </a>,
                        <a onClick={() => handleCancel(record)}>取消</a>,
                    );
                } else {
                    btns.push(
                        <a
                            onClick={() => handleEdit(record)}
                            disabled={(props.OrderStatus != "NEW" && props.OrderStatus != 'REJECTED')}
                        >
                            编辑
                        </a>,
                    );
                }
                return [<span className="action-link">{btns}</span>];
            }
        }

    ]
    return (
        <div>
            <Form id="basic"
                labelAlign='left'
                useColon={false}
                labelLayout='horizontal'
                columns={3}
                dataSet={props.inDetailHeadDS}
            >
                <TextField name='orderNumber' style={{ width: '300px' }} disabled></TextField>
                <Lov name='companyLOV' style={{ width: '300px' }}
                    disabled={(props.OrderStatus != "NEW" && props.OrderStatus != 'REJECTED')}></Lov>
                <Lov name='customerLOV' style={{ width: '300px' }}
                    disabled={(props.OrderStatus != "NEW" && props.OrderStatus != 'REJECTED')}></Lov>
                <DatePicker name='orderDate' style={{ width: '300px' }} mode='dateTime' min='2020'
                    disabled={(props.OrderStatus != "NEW" && props.OrderStatus != 'REJECTED')}></DatePicker>
                <Output name='orderPrice' disabled renderer={getToTalPrice}></Output>
                <TextField name='orderStatus' style={{ width: '300px' }} disabled></TextField>
            </Form>
            <Table dataSet={props.inLineDS} buttons={buttons} dragColumnAlign="left" key='DetailPage' columns={columns} sortable={true}>
            </Table>
        </div >
    )

}
export default withRouter(DetailPage)

index.js:

/*
 * @Author: your name
 * @Date: 2021-08-12 16:55:43
 * @LastEditTime: 2021-08-23 14:44:04
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \hzero-order-32920\packages\hzero-order\src\pages\order-mange\component\index.js
 */
import React, { useState } from 'react';
import { PageHeaderWrapper } from 'hzero-boot/lib/components/Page';
import CreatePage from './CreatePage';
import DetailPage from './DetailPage';
import { Button, DataSet, Icon } from 'choerodon-ui/pro';
import intl from "utils/intl";
import notification from 'utils/notification'
import { totalDS } from '../store/totalDS'
import { detailHeadDS } from '../store/detailHeadDS'
import { lineDS } from '../store/lineDS'
import { closeTab } from 'utils/menuTab';

const index = (props) => {
    if (props.location.query) {
        var [OrderStatus, setOrderStatus] = useState(props.location.query.record.data.orderStatus)
        /**
         * @description: 定义头订单，行订单ds
         * @param {*}
         * @return {*}
         */       
        var inDetailHeadDS = new DataSet(detailHeadDS(props.location.query.record.data.soHeaderId))
        var inLineDS = new DataSet(lineDS(props.location.query.record.data.soHeaderId))
        /**
         * @description: 处理头订单确认信息
         * @param {*}
         * @return {*}
         */       
        var handleListSubmit = async () => {
            if (inLineDS) {
                const res = await inDetailHeadDS.submit();
                if (res) {
                    const fn = async () => {
                        await inDetailHeadDS.query(1)
                        inLineDS.query(1)
                    }
                    fn()
                }
            }
            
            else {
                notification.warn({
                    message: "还没添加行订单"
                })
            }
        };
        /**
         * @description: 更改头订单状态为已提交的函数
         * @param {*}
         * @return {*}
         */      
        var handleStatusToSubmited = () => {
            notification.info({
                message: '正在处理，请勿重复点击',
            });
            if (inLineDS.records[0]) {
                const fn = async () => {
                    inDetailHeadDS.records[0].set("orderStatus", "SUBMITED");
                    const res = await inDetailHeadDS.submit();
                    if (res) {
                        setOrderStatus('SUBMITED')
                        // back()
                        inDetailHeadDS.query(1)
                        inLineDS.query(1)
                        tableTotalDS.query(1)
                    }
                }
                fn()
            }
            else {
                notification.warning({
                    message: "还没添加行订单"
                })
            }
        }
        /**
         * @description:删除头订单
         * @param {*}
         * @return {*}
         */    
        var handleDeleteList = async () => {
            const res = await inDetailHeadDS.delete(inDetailHeadDS.current)
            if (res) {
                back()
                inDetailHeadDS.query(1)
                tableTotalDS.query(1)
            }
        }

    }
    /**
     * @description: 定义订单管理列表的ds和新增页面的ds，和新增数据的record
     * @param {*}
     * @return {*}
     */    
    const tableTotalDS = new DataSet(totalDS())
    const newHeadDS = new DataSet(detailHeadDS())
    const currentRecord = newHeadDS.create({});
    const back = () => {
        props.history.push({ pathname: '/hzero-order-32920/list' })
        closeTab('/hzero-order-32920/detail')
        tableTotalDS.query(1)
    }
    /**
     * @description: 新订单保存按钮，同时跳转路由
     * @param {*}
     * @return {*}
     */    
    const handleNewListSubmit = async () => {
        notification.info({
            message: '正在处理，请勿重复点击',
        });
        const res = await newHeadDS.submit()
        if (res) {
            props.history.push({
                pathname: '/hzero-order-32920/toDetail', query: { record: newHeadDS.records[0] }
            })
        }
    };
    
    return (props.location.query ?
        <PageHeaderWrapper
            title={<div><Icon type="arrow_back" onClick={back} style={{ cursor: 'pointer', width: '20px', position: 'relative', top: '-2px' }} />订单详情</div>}
            header={
                <div>
                    <Button onClick={handleListSubmit}>{intl.get(`hzero.common.button.save`).d('保存')}</Button>,
                    <Button
                        onClick={handleStatusToSubmited}
                        disabled={(OrderStatus != "NEW" && OrderStatus != 'REJECTED')}>
                        {intl.get('hzero.common.button.submit').d('提交')}</Button>,
                    <Button
                        onClick={handleDeleteList}
                        disabled={(OrderStatus != "NEW" && OrderStatus != 'REJECTED')}>
                        {intl.get('hzero.common.button.delete').d('删除')}</Button></div>}
        >
            <DetailPage record={props.location.query.record} OrderStatus={OrderStatus} inDetailHeadDS={inDetailHeadDS} inLineDS={inLineDS} tableTotalDS={tableTotalDS} />
        </PageHeaderWrapper >
        :
        <PageHeaderWrapper title={<div><Icon type="arrow_back" onClick={back} style={{ cursor: 'pointer', width: '20px', position: 'relative', top: '-2px' }} />新增订单页面</div>}
            header={<Button onClick={handleNewListSubmit}>{intl.get(`hzero.common.button.save`).d('保存')}</Button>}>
            <CreatePage record={currentRecord} newHeadDS={newHeadDS} />
        </PageHeaderWrapper>)
};

export default index;