ordo
/
surveyor_indonesia_frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

changed styling form proyek

pull/2/head
wahyuun 1 year ago
parent
d48322a6a8
commit
58ca6e4b74
1 changed files with 176 additions and 168 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 344
      src/views/SimproV2/CreatedProyek/DialogFormProyek.js

344
src/views/SimproV2/CreatedProyek/DialogFormProyek.js
Unescape View File

@ -200,6 +200,7 @@ const DialogFormProyek = ({
setFinance(""); setFinance("");
setWorkArea(""); setWorkArea("");
setProjectDuration(""); setProjectDuration("");
setDivisiProject(null);
setProjectStructureOrg(null); setProjectStructureOrg(null);
setCompany(""); setCompany("");
setCurrency(""); setCurrency("");
@ -611,7 +612,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize"> <Label className="capitalize" style={{ fontWeight: "bold" }}>
Project Name<span style={{ color: "red" }}>*</span> Project Name<span style={{ color: "red" }}>*</span>
</Label> </Label>
<Input <Input
@ -623,7 +624,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">Code / Short Name<span style={{ color: "red" }}>*</span></Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Code / Short Name<span style={{ color: "red" }}>*</span></Label>
<Input <Input
type="text" type="text"
value={shortName} value={shortName}
@ -635,7 +636,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize"> <Label className="capitalize" style={{ fontWeight: "bold" }}>
Project Type<span style={{ color: "red" }}>*</span> Project Type<span style={{ color: "red" }}>*</span>
</Label> </Label>
<Select <Select
@ -658,7 +659,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">PM</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>PM</Label>
<Select <Select
showSearch showSearch
filterOption={(inputValue, option) => filterOption={(inputValue, option) =>
@ -681,7 +682,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize"> <Label className="capitalize" style={{ fontWeight: "bold" }}>
Start Date<span style={{ color: "red" }}>*</span> Start Date<span style={{ color: "red" }}>*</span>
</Label> </Label>
<DatePicker <DatePicker
@ -694,7 +695,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize"> <Label className="capitalize" style={{ fontWeight: "bold" }}>
End Date<span style={{ color: "red" }}>*</span> End Date<span style={{ color: "red" }}>*</span>
</Label> </Label>
<DatePicker <DatePicker
@ -716,7 +717,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">Work Area</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Work Area</Label>
<Input <Input
type="text" type="text"
value={workArea} value={workArea}
@ -726,7 +727,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">Company</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Company</Label>
<Input <Input
type="text" type="text"
value={company} value={company}
@ -738,7 +739,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize"> <Label className="capitalize" style={{ fontWeight: "bold" }}>
Budget<span style={{ color: "red" }}>*</span> Budget<span style={{ color: "red" }}>*</span>
</Label> </Label>
<Row> <Row>
@ -768,8 +769,14 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label>Handled By Division</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>
Handled By Division<span style={{ color: "red" }}>*</span>
</Label>
<Select <Select
showSearch
filterOption={(inputValue, option) =>
option.children.toLowerCase().includes(inputValue.toLowerCase())
}
value={divisiProject} value={divisiProject}
defaultValue={divisiProject} defaultValue={divisiProject}
onChange={onChangeDivisiProject} onChange={onChangeDivisiProject}
@ -785,7 +792,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">Project Duration</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Project Duration</Label>
<Input <Input
type="number" type="number"
min="1" min="1"
@ -798,7 +805,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">Organizational Structure</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Organizational Structure</Label>
<Input <Input
type="file" type="file"
accept="image/*" accept="image/*"
@ -809,7 +816,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label className="capitalize">Description</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Description</Label>
<Input <Input
type="textarea" type="textarea"
value={description} value={description}
@ -820,7 +827,7 @@ const DialogFormProyek = ({
</Row> </Row>
<Row> <Row>
<Col md={12}> <Col md={12}>
<Label className="capitalize">Late Consequence</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Late Consequence</Label>
<CKEditor <CKEditor
editor={ ClassicEditor } editor={ ClassicEditor }
data={ late } data={ late }
@ -832,9 +839,9 @@ const DialogFormProyek = ({
/> />
</Col> </Col>
</Row> </Row>
<Row> <Row style={{ marginTop: "20px"}}>
<Col md={12}> <Col md={12}>
<Label className="capitalize">Assumtion</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Assumtion</Label>
<CKEditor <CKEditor
editor={ClassicEditor} editor={ClassicEditor}
data={assumtion} data={assumtion}
@ -846,18 +853,18 @@ const DialogFormProyek = ({
/> />
</Col> </Col>
</Row> </Row>
<Row> <Row style={{ marginTop: "20px"}}>
<Col md={12}> <Col md={12}>
<Label className="capitalize">Project Checklist</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Project Checklist</Label>
<Row> <Row>
<Col md={5}> <Col md={5}>
<b>Item</b> <p>Item</p>
</Col> </Col>
<Col md={4}> <Col md={4}>
<b>Availability</b> <p>Availability</p>
</Col> </Col>
<Col md={2}> <Col md={2}>
<b>Action</b> <p>Action</p>
</Col> </Col>
<Col md={1}> <Col md={1}>
<Tooltip title="Add row"> <Tooltip title="Add row">
@ -877,16 +884,16 @@ const DialogFormProyek = ({
<Divider orientation="left" plain></Divider> <Divider orientation="left" plain></Divider>
<Row> <Row>
<Col md={12}> <Col md={12}>
<Label className="capitalize">Issues & Obstacles</Label> <Label className="capitalize" style={{ fontWeight: "bold" }}>Issues & Obstacles</Label>
<Row> <Row>
<Col md={5}> <Col md={5}>
<b>Issu Level</b> <p>Issue Level</p>
</Col> </Col>
<Col md={4}> <Col md={4}>
<b>Description</b> <p>Description</p>
</Col> </Col>
<Col md={2}> <Col md={2}>
<b>Action</b> <p>Action</p>
</Col> </Col>
<Col md={1}> <Col md={1}>
<Tooltip title="Add row"> <Tooltip title="Add row">
@ -909,7 +916,7 @@ const DialogFormProyek = ({
<Row> <Row>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label>Phase</Label> <Label style={{ fontWeight: "bold" }}>Phase</Label>
<Select <Select
value={phaseProject} value={phaseProject}
defaultValue={phaseProject} defaultValue={phaseProject}
@ -926,7 +933,7 @@ const DialogFormProyek = ({
</Col> </Col>
<Col md={6}> <Col md={6}>
<FormGroup> <FormGroup>
<Label>Cost Health</Label> <Label style={{ fontWeight: "bold" }}>Cost Health</Label>
<Select <Select
value={budgetHealth} value={budgetHealth}
defaultValue={budgetHealth} defaultValue={budgetHealth}
@ -949,130 +956,131 @@ const DialogFormProyek = ({
</Form> </Form>
<Form style={{ display: step === 2 ? 'block' : 'none' }}> <Form style={{ display: step === 2 ? 'block' : 'none' }}>
<Row> <Row >
<Col md={3}> <Col md={3}>
<b>Project Objectives</b> <b>Project Objectives</b>
</Col> </Col>
<Col md={9}> <Col md={9}>
<FormGroup> <CKEditor
<Input editor={ClassicEditor}
type="textarea" data={objectives}
value={objectives} config={editorConfig}
onChange={(e) => setObjectives(e.target.value)} onChange={ ( event, editor ) => {
/> const data = editor.getData();
</FormGroup> setObjectives(data);
</Col> } }
</Row> />
<Row> </Col>
<Col md={3}> </Row>
<b>Project is considered successful when</b> <Row style={{ marginTop: "20px" }}>
</Col> <Col md={3}>
<Col md={9}> <b>Project is considered successful when</b>
<FormGroup> </Col>
<Input <Col md={9}>
type="textarea" <CKEditor
value={projectIsConsideredSuccessful} editor={ClassicEditor}
onChange={(e) => data={projectIsConsideredSuccessful}
setProjectIsConsideredSuccessful(e.target.value) config={editorConfig}
} onChange={ ( event, editor ) => {
placeholder={`List of indicators`} const data = editor.getData();
rows={5} setProjectIsConsideredSuccessful(data);
/> } }
</FormGroup> />
</Col> </Col>
</Row> </Row>
<Row> <Row style={{ marginTop:"20px" }}>
<Col md={3}> <Col md={3}>
<b>Project Participants</b> <b>Project Participants</b>
</Col> </Col>
<Col md={9}> <Col md={9}>
<Row> <Row>
<Col md={5}> <Col md={5}>
<b>Title</b> <p>Title</p>
</Col> </Col>
<Col md={4}> <Col md={4}>
<b>Name</b> <p>Name</p>
</Col> </Col>
<Col md={2}> <Col md={2}>
<b>Action</b> <p>Action</p>
</Col> </Col>
<Col md={1}> <Col md={1}>
<Tooltip title="Add row"> <Tooltip title="Add row">
<Button <Button
size="sm" size="sm"
color="primary" color="primary"
onClick={() => addParticipant()} onClick={() => addParticipant()}
> >
<i className="fa fa-plus"></i> <i className="fa fa-plus"></i>
</Button> </Button>
</Tooltip> </Tooltip>
</Col> </Col>
</Row> </Row>
<div style={{ marginBottom: 50 }}>{RenderParticipants()}</div> <div style={{ marginBottom: 50 }}>{RenderParticipants()}</div>
</Col> </Col>
</Row> </Row>
<Row> <Row style={{ marginTop:"20px" }}>
<Col md={3}> <Col md={3}>
<b>Testing Environment</b> <b>Testing Environment</b>
</Col> </Col>
<Col md={9}> <Col md={9}>
<FormGroup> <CKEditor
<Input editor={ClassicEditor}
type="textarea" data={testingEnv}
value={testingEnv} config={editorConfig}
onChange={(e) => setTestingEnv(e.target.value)} onChange={ ( event, editor ) => {
rows={5} const data = editor.getData();
/> setTestingEnv(data);
</FormGroup> } }
</Col> />
</Row> </Col>
<Row> </Row>
<Col md={3}> <Row style={{ marginTop:"20px" }}>
<b>Milestones</b> <Col md={3}>
</Col> <b>Milestones</b>
<Col md={9}> </Col>
<Row> <Col md={9}>
<Col md={4}> <Row>
<b>Status</b> <Col md={4}>
</Col> <p>Status</p>
<Col md={4}> </Col>
<b>Deadline</b> <Col md={4}>
</Col> <p>Deadline</p>
<Col md={3}> </Col>
<b>Action</b> <Col md={3}>
</Col> <p>Action</p>
<Col md={1}> </Col>
<Tooltip title="Add row"> <Col md={1}>
<Button <Tooltip title="Add row">
size="sm" <Button
color="primary" size="sm"
onClick={() => addMilestone()} color="primary"
> onClick={() => addMilestone()}
<i className="fa fa-plus"></i> >
</Button> <i className="fa fa-plus"></i>
</Tooltip> </Button>
</Col> </Tooltip>
</Row> </Col>
<div style={{ marginBottom: 50 }}>{RenderMilestones()}</div> </Row>
</Col> <div style={{ marginBottom: 50 }}>{RenderMilestones()}</div>
</Row> </Col>
<Row> </Row>
<Row style={{ marginTop:"20px" }}>
<Col md={3}> <Col md={3}>
<b>Potential Risk</b> <b>Potential Risk</b>
</Col> </Col>
<Col md={9}> <Col md={9}>
<Row> <Row>
<Col md={3}> <Col md={3}>
<b>Risk Level</b> <p>Risk Level</p>
</Col> </Col>
<Col md={3}> <Col md={3}>
<b>Description</b> <p>Description</p>
</Col> </Col>
<Col md={3}> <Col md={3}>
<b>Prevention</b> <p>Prevention</p>
</Col> </Col>
<Col md={2}> <Col md={2}>
<b>Action</b> <p>Action</p>
</Col> </Col>
<Col md={1}> <Col md={1}>
<Tooltip title="Add row"> <Tooltip title="Add row">
@ -1089,35 +1097,35 @@ const DialogFormProyek = ({
<div style={{ marginBottom: 50 }}>{RenderRisk()}</div> <div style={{ marginBottom: 50 }}>{RenderRisk()}</div>
</Col> </Col>
</Row> </Row>
<Row> <Row style={{ marginTop:"20px" }}>
<Col md={3}> <Col md={3}>
<b>Approval</b> <b>Approval</b>
</Col> </Col>
<Col md={9}> <Col md={9}>
<Row> <Row>
<Col md={3}> <Col md={3}>
<b>Title</b> <p>Title</p>
</Col> </Col>
<Col md={3}> <Col md={3}>
<b>Name</b> <p>Name</p>
</Col> </Col>
<Col md={3}> <Col md={3}>
<b>Date</b> <p>Date</p>
</Col> </Col>
<Col md={2}> <Col md={2}>
<b>Action</b> <p>Action</p>
</Col> </Col>
<Tooltip title="Add row"> <Tooltip title="Add row">
<Col md={1}> <Col md={1}>
<Button size="sm" color="primary" onClick={() => addApproval()}> <Button size="sm" color="primary" onClick={() => addApproval()}>
<i className="fa fa-plus"></i> <i className="fa fa-plus"></i>
</Button> </Button>
</Col> </Col>
</Tooltip> </Tooltip>
</Row> </Row>
<div style={{ marginBottom: 50 }}>{RenderApproval()}</div> <div style={{ marginBottom: 50 }}>{RenderApproval()}</div>
</Col> </Col>
</Row> </Row>
</Form> </Form>
</> </>
) )

Write Preview
Loading…
Cancel
Save