RequestItemActionForm.tsx 6.82 KB
Newer Older
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
import * as React from 'react';
import { Form, Field, FormProps, FormRenderProps } from 'react-final-form';
import { createStyles, withStyles } from '@material-ui/core/styles';
import { useTranslation, withTranslation } from 'react-i18next';

// Validation
import { required, validatePositiveNumber } from '@gringlobal-ce/client/utilities/validators';

// UI
import { Grid } from '@material-ui/core';
import { TextField } from '@gringlobal-ce/client/ui/common/form/TextField';
import { PageSection } from '@gringlobal-ce/client/ui/common/layout/Section';
import { CodeValueField } from 'common/CodeValue';

// Model
import { CooperatorAutocomplete } from 'common/Cooperator';
import DateAndFormatComponent from 'common/DateAndFormatComponent';
import OrderRequestItemAction from '@gringlobal-ce/client/model/gringlobal/OrderRequestItemAction';

/**
 * Form for OrderRequestItemAction
 *
Matija Obreza's avatar
Matija Obreza committed
23
 * GGCE API
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 */

const styles = (theme) => createStyles({
  textField: {
  },
  switchWrapper: {
    display: 'flex',
    flexDirection: 'row',
  },
});

interface IInternalProps {
  onCancelEdit: () => void;
  apiError: string;
}

function InternalForm({ handleSubmit, onCancelEdit, apiError }: IInternalProps & FormRenderProps) {
  const { t } = useTranslation();

  return (
    <form onSubmit={ handleSubmit } id="request-item-action-form">
      <Grid container spacing={ 4 }>

        <Grid item xs={ 12 }>
          { /* {"type":"string"} */ }
          <Field
50
51
            label={ t(['client:model.OrderRequestItemAction.actionNameCode', 'client:model.AbstractAction.actionNameCode', 'client:model._.actionNameCode']) }
            helperText={ t(['client:model.OrderRequestItemAction.actionNameCode_hint', 'client:model.AbstractAction.actionNameCode_hint', 'client:model._._hint']) }
52
53
54
55
56
57
58
59
60
61
62
63
            name="actionNameCode"
            type="text"
            component={ CodeValueField }
            codeGroup={ OrderRequestItemAction.CodeGroup.actionNameCode }
            sortByAlphabet
            required
            validate={ required }
          />
        </Grid>

        <DateAndFormatComponent
          name="notBeforeDate"
64
65
66
          label={ t(['client:model.OrderRequestItemAction.notBeforeDate', 'client:model.AbstractAction.notBeforeDate', 'client:model._.notBeforeDate']) }
          helperText={ t(['client:model.OrderRequestItemAction.notBeforeDate_hint', 'client:model.AbstractAction.notBeforeDate_hint', 'client:model._._hint']) }
          codeLabel={ t(['client:model.OrderRequestItemAction.notBeforeDateCode', 'client:model.AbstractAction.notBeforeDateCode', 'client:model._.notBeforeDateCode']) }
67
68
69
70
71
          codeGroup={ OrderRequestItemAction.CodeGroup.notBeforeDateCode }
          shrink
        />
        <DateAndFormatComponent
          name="startedDate"
72
73
74
          label={ t(['client:model.OrderRequestItemAction.startedDate', 'client:model.AbstractAction.startedDate', 'client:model._.startedDate']) }
          helperText={ t(['client:model.OrderRequestItemAction.startedDate_hint', 'client:model.AbstractAction.startedDate_hint', 'client:model._._hint']) }
          codeLabel={ t(['client:model.OrderRequestItemAction.startedDateCode', 'client:model.AbstractAction.startedDateCode', 'client:model._.startedDateCode']) }
75
76
77
78
79
          codeGroup={ OrderRequestItemAction.CodeGroup.startedDateCode }
          shrink
        />
        <DateAndFormatComponent
          name="completedDate"
80
81
82
          label={ t( ["client:model.OrderRequestItemAction.completedDate", 'client:model.AbstractAction.completedDate', 'client:model._.completedDate']) }
          helperText={ t(['client:model.OrderRequestItemAction.completedDateCode_hint', 'client:model.AbstractAction.completedDateCode_hint', 'client:model._._hint']) }
          codeLabel={ t(['client:model.OrderRequestItemAction.completedDateCode', 'client:model.AbstractAction.completedDateCode', 'client:model._.completedDate']) }
83
84
85
86
87
88
89
          codeGroup={ OrderRequestItemAction.CodeGroup.completedDateCode }
          shrink
        />

        <Grid item xs={ 12 }>
          { /* {"$ref":"#/components/schemas/Cooperator"} */ }
          <Field
90
91
            label={ t(['client:model.OrderRequestItemAction.cooperator', 'client:model.AbstractAction.cooperator', 'client:model._.cooperator']) }
            helperText={ t(['client:model.OrderRequestItemAction.cooperator_hint', 'client:model.AbstractAction.cooperator_hint', 'client:model._._hint']) }
92
93
94
95
96
97
98
            name="cooperator"
            component={ CooperatorAutocomplete }
          />
        </Grid>
        <Grid item xs={ 12 } sm={ 6 }>
          { /* {"type":"number","format":"double","nullable":true} */ }
          <Field
99
100
            label={ t(['client:model.OrderRequestItemAction.actionCost', 'client:model.AbstractAction.actionCost', 'client:model._.actionCost']) }
            helperText={ t(['client:model.OrderRequestItemAction.actionCost_hint', 'client:model.AbstractAction.actionCost_hint', 'client:model._._hint']) }
101
102
103
104
105
106
107
108
109
110
            name="actionCost"
            type="text"
            component={ TextField }
            validate={ validatePositiveNumber }
          />
        </Grid>

        <Grid item xs={ 12 } sm={ 6 }>
          { /* {"type":"string"} */ }
          <Field
111
112
            label={ t(['client:model.OrderRequestItemAction.actionInformation', 'client:model.AbstractAction.actionInformation', 'client:model._.actionInformation']) }
            helperText={ t(['client:model.OrderRequestItemAction.actionInformation_hint', 'client:model.AbstractAction.actionInformation_hint', 'client:model._._hint']) }
113
114
115
116
117
118
119
120
121
            name="actionInformation"
            type="text"
            component={ TextField }
          />
        </Grid>

        <Grid item xs={ 12 }>
          { /* {"type":"string"} */ }
          <Field
122
123
            label={ t(['client:model.OrderRequestItemAction.note', 'client:model.AbstractAction.note', 'client:model._.note']) }
            helperText={ t(['client:model.OrderRequestItemAction.note_hint', 'client:model.AbstractAction.note_hint', 'client:model._._hint']) }
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
            name="note"
            component={ TextField }
            type="text"
            multiline
          />
        </Grid>
      </Grid>

      { apiError && <PageSection title={ t('common:label.apiError') }>
        <Grid container spacing={ 2 }>
          <Grid item xs={ 12 } style={ { color: 'red' } }>{ apiError }</Grid>
        </Grid>
      </PageSection>
      }
    </form>
  );
}


interface IOrderRequestItemActionForm {
  initialValues: OrderRequestItemAction;
  onCancelEdit: () => void;
}

function OrderRequestItemActionForm({ onSubmit, initialValues, onCancelEdit, error }: IOrderRequestItemActionForm & FormProps) {

  return (
    <Form
      initialValues={ initialValues }
      onSubmit={ onSubmit }
      render={ (props) =>
        <InternalForm { ...props } onCancelEdit={ onCancelEdit } apiError={ error }/> }
    />
  );
}

export default withStyles(styles)(withTranslation()(OrderRequestItemActionForm));