src/components/MyEMS/Equipment/EquipmentTracking.js - Code Metrics - Inspection of "Merge branch 'develop'" - myems/myems-web - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — master ( 95cb66...99bc21 )

by Guangyu

created 2020-11-27 04:10 UTC

src/components/MyEMS/Equipment/EquipmentTracking.js A

↳ Parent: Project

Complexity

Total Complexity	5
Complexity/F	0

Size

Lines of Code	438
Function Count	0

Duplication

Duplicated Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
wmc	5
eloc	378
mnd	5
bc	5
fnc	0
dl	0
loc	438
rs	10
bpm	0
cpm	0
noi	0
c	0
b	0
f	0

import React, { createRef, Fragment, useEffect, useState } from 'react';
import {
  Breadcrumb,
  BreadcrumbItem,
  Button,
  ButtonGroup,
  Card,
  CardBody,
  Col,
  DropdownItem,
  DropdownMenu,
  DropdownToggle,
  Form,
  FormGroup,
  Input,
  Label,
  Media,
  Row,
  UncontrolledDropdown,
} from 'reactstrap';
import uuid from 'uuid/v1';
import Cascader from 'rc-cascader';
import loadable from '@loadable/component';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Link } from 'react-router-dom';
import Flex from '../../common/Flex';
import { getCookieValue, createCookie } from '../../../helpers/utils';
import withRedirect from '../../../hoc/withRedirect';
import { withTranslation } from 'react-i18next';
import { toast } from 'react-toastify';
import { APIBaseURL } from '../../../config';


const EquipmentTracking = ({ setRedirect, setRedirectUrl, t }) => {
  useEffect(() => {
    let is_logged_in = getCookieValue('is_logged_in');
    let user_name = getCookieValue('user_name');
    let user_display_name = getCookieValue('user_display_name');
    let user_uuid = getCookieValue('user_uuid');
    let token = getCookieValue('token');
    if (is_logged_in === null || !is_logged_in) {
      setRedirectUrl(`/authentication/basic/login`);
      setRedirect(true);
    } else {
      //update expires time of cookies
      createCookie('is_logged_in', true, 1000 * 60 * 60 * 8);
      createCookie('user_name', user_name, 1000 * 60 * 60 * 8);
      createCookie('user_display_name', user_display_name, 1000 * 60 * 60 * 8);
      createCookie('user_uuid', user_uuid, 1000 * 60 * 60 * 8);
      createCookie('token', token, 1000 * 60 * 60 * 8);
    }
  });
  let table = createRef();
  const DetailedDataTable = loadable(() => import('../common/DetailedDataTable'));
  // State
  // Query Parameters
  const [selectedSpaceName, setSelectedSpaceName] = useState(undefined);
  const [selectedSpaceID, setSelectedSpaceID] = useState(undefined);
  const [cascaderOptions, setCascaderOptions] = useState(undefined);
  //Results
  const [detailedDataTableData, setDetailedDataTableData] = useState([]);
  const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{
    dataField: 'name',
    headerClasses: 'border-0',
    text: t('Name'),
    classes: 'border-0 py-2 align-middle',
    formatter: nameFormatter,
    sort: true
  }]);


  useEffect(() => {
    let isResponseOK = false;
    fetch(APIBaseURL + '/spaces/tree', {
      method: 'GET',
      headers: {
        "Content-type": "application/json",
        "User-UUID": getCookieValue('user_uuid'),
        "Token": getCookieValue('token')
      },
      body: null,

    }).then(response => {
      console.log(response);
      if (response.ok) {
        isResponseOK = true;
      }
      return response.json();
    }).then(json => {
      console.log(json)
      if (isResponseOK) {
        // rename keys 
        json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
        setCascaderOptions(json);
        setSelectedSpaceName([json[0]].map(o => o.label));
        setSelectedSpaceID([json[0]].map(o => o.value));
      } else {
        toast.error(json.description);
      }
    }).catch(err => {
      console.log(err);
    });

  }, []);
  const nameFormatter = (dataField, { name }) => (
    <Link to="#">
      <Media tag={Flex} align="center">
        <Media body className="ml-2">
          <h5 className="mb-0 fs--1">{name}</h5>
        </Media>
      </Media>
    </Link>
  );

  const actionFormatter = (dataField, { id }) => (
    // Control your row with this id
    <UncontrolledDropdown>
      <DropdownToggle color="link" size="sm" className="text-600 btn-reveal mr-3">
        <FontAwesomeIcon icon="ellipsis-h" className="fs--1" />
      </DropdownToggle>
      <DropdownMenu right className="border py-2">
        <DropdownItem onClick={() => console.log('Edit: ', id)}>Edit</DropdownItem>
        <DropdownItem onClick={() => console.log('Delete: ', id)} className="text-danger">Delete</DropdownItem>
      </DropdownMenu>
    </UncontrolledDropdown>
  );

  

  const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';

  let onSpaceCascaderChange = (value, selectedOptions) => {
    console.log(value, selectedOptions);
    setSelectedSpaceName(selectedOptions.map(o => o.label).join('/'));
    setSelectedSpaceID(value[value.length - 1]);
  }

  // Handler
  const handleSubmit = e => {
    e.preventDefault();
    console.log('handleSubmit');
    console.log(selectedSpaceID);

    // Reinitialize tables
    setDetailedDataTableData([]);
    
    let isResponseOK = false;
    fetch(APIBaseURL + '/reports/equipmenttracking?' +
      'spaceid=' + selectedSpaceID, {
      method: 'GET',
      headers: {
        "Content-type": "application/json",
        "User-UUID": getCookieValue('user_uuid'),
        "Token": getCookieValue('token')
      },
      body: null,

    }).then(response => {
      if (response.ok) {
        isResponseOK = true;
      }
      return response.json();
    }).then(json => {
      if (isResponseOK) {
        console.log(json)

        setDetailedDataTableColumns([
          {
            dataField: 'name',
            headerClasses: 'border-0',
            text: t('Name'),
            classes: 'border-0 py-2 align-middle',
            formatter: nameFormatter,
            sort: true
          },
          {
            dataField: 'costcenter',
            headerClasses: 'border-0',
            text: t('Cost Center'),
            classes: 'border-0 py-2 align-middle',
            sort: true
          },
          {
            dataField: 'space',
            headerClasses: 'border-0',
            text: t('Space'),
            classes: 'border-0 py-2 align-middle',
            sort: true
          },
          {
            dataField: 'description',
            headerClasses: 'border-0',
            text: t('Description'),
            classes: 'border-0 py-2 align-middle',
            sort: true
          },
          {
            dataField: '',
            headerClasses: 'border-0',
            text: '',
            classes: 'border-0 py-2 align-middle',
            formatter: actionFormatter,
            align: 'right'
          }
        ]);
      
        setDetailedDataTableData([
          {
            id: uuid(),
            name: '锅炉#1',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/锅炉房',
            description: '2392 Main Avenue',
          },
          {
            id: uuid(),
            name: '锅炉#2',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/锅炉房',
            description: '2289 5th Avenue',
          },
          {
            id: uuid(),
            name: '锅炉#3',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/锅炉房',
            description: '112 Bostwick Avenue',
          },
          {
            id: uuid(),
            name: '锅炉#4',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/锅炉房',
            description: '3448 Ile De France St #242',
          },
          {
            id: uuid(),
            name: '锅炉#5',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/锅炉房',
            description: '659 Hannah Street',
          },
          {
            id: uuid(),
            name: '高压制冷机CH-ZL-01',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/空调水',
            description: '2298 Locust Court',
          },
          {
            id: uuid(),
            name: '高压制冷机CH-ZL-02',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/空调水',
            description: '4678 Maud Street',
          },
          {
            id: uuid(),
            name: '高压制冷机CH-ZL-03',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/空调水',
            description: '3412 Crestview Manor',
          },
          {
            id: uuid(),
            name: '高压制冷机CH-ZL-04',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/空调水',
            description: '4895 Farnum Road',
          },
          {
            id: uuid(),
            name: '高压制冷机CH-ZL-05',
            costcenter: '成本中心1',
            space: '成都项目/公区商场/空调水',
            description: '3291 Hillside Street',
          },
          {
            id: uuid(),
            name: '空压机#1',
            costcenter: '成本中心1',
            space: '成都项目/动力中心/空压站',
            description: '162 Hillhaven Drive',
          },
          {
            id: uuid(),
            name: '空压机#2',
            costcenter: '成本中心1',
            space: '成都项目/动力中心/空压站',
            description: '2551 Ocala Street',
          },
          {
            id: uuid(),
            name: '空压机#3',
            costcenter: '成本中心1',
            space: '成都项目/动力中心/空压站',
            description: '13572 Kurt Mews South Merritt'
          },
          {
            id: uuid(),
            name: '空压机#4',
            costcenter: '成本中心1',
            space: '成都项目/动力中心/空压站',
            description: '91979 Kohler Place Waelchiborough'
          },
          {
            id: uuid(),
            name: '空压机#5',
            costcenter: '成本中心1',
            space: '成都项目/动力中心/空压站',
            description: '6757 Giuseppe Meadows Geraldinemouth'
          },
          {
            id: uuid(),
            name: '注塑机#1',
            costcenter: '成本中心1',
            space: '成都项目/二期厂/空压站',
            description: '2327 Kaylee Mill East Citlalli'
          },
          {
            id: uuid(),
            name: '注塑机#2',
            costcenter: '成本中心1',
            space: '成都项目/二期厂/空压站',
            description: '25156 Isaac Crossing Apt.'
          },
          {
            id: uuid(),
            name: '注塑机#3',
            costcenter: '成本中心1',
            space: '成都项目/二期厂/空压站',
            description: '71603 Wolff Plains Apt'
          },
          {
            id: uuid(),
            name: '注塑机#4',
            costcenter: '成本中心1',
            space: '成都项目/二期厂/空压站',
            description: '431 Steuber Mews'
          },
          {
            id: uuid(),
            name: '注塑机#5',
            costcenter: '成本中心1',
            space: '成都项目/二期厂/空压站',
            description: '4167 Laverna Manor Marysemouth'
          },
          {
            id: uuid(),
            name: '清洗机#1',
            costcenter: '成本中心1',
            space: '成都项目/发动机厂',
            description: '829 Lavonne Valley'
          },
          {
            id: uuid(),
            name: '清洗机#2',
            costcenter: '成本中心1',
            space: '成都项目/发动机厂',
            description: '53150 Thad Squares'
          },
          {
            id: uuid(),
            name: '清洗机#3',
            costcenter: '成本中心1',
            space: '成都项目/发动机厂',
            description: "9198 O'Kon Harbors"
          },
          {
            id: uuid(),
            name: "清洗机#4",
            costcenter: '成本中心1',
            space: '成都项目/发动机厂',
            description: '1478 Kaitlin Haven'
          },
          {
            id: uuid(),
            name: '清洗机#5',
            costcenter: '成本中心1',
            space: '成都项目/发动机厂',
            description: 'Garry Brainstrow'
          }
        ]);
      } else {
        toast.error(json.description)
      }
    }).catch(err => {
      console.log(err);
    });
  };

  return (
    <Fragment>
      <div>
        <Breadcrumb>
          <BreadcrumbItem>{t('Equipment Data')}</BreadcrumbItem><BreadcrumbItem active>{t('Equipment Tracking')}</BreadcrumbItem>
        </Breadcrumb>
      </div>
      <Card className="bg-light mb-3">
        <CardBody className="p-3">
          <Form onSubmit={handleSubmit}>
            <Row form>
              <Col xs="auto">
                <FormGroup className="form-group">
                  <Label className={labelClasses} for="space">
                    {t('Space')}
                  </Label>
                  <br />
                  <Cascader options={cascaderOptions}
                    onChange={onSpaceCascaderChange}
                    changeOnSelect
                    expandTrigger="hover">
                    <Input value={selectedSpaceName || ''} readOnly />
                  </Cascader>
                </FormGroup>
              </Col>

              <Col xs="auto">
                <FormGroup>
                  <br></br>
                  <ButtonGroup id="submit">
                    <Button color="success" >{t('Submit')}</Button>
                  </ButtonGroup>
                </FormGroup>
              </Col>
            </Row>
          </Form>
        </CardBody>
      </Card>
      <DetailedDataTable data={detailedDataTableData} title={t('Equipment List')} columns={detailedDataTableColumns} pagesize={10} >
      </DetailedDataTable>

    </Fragment>
  );
};

export default withTranslation()(withRedirect(EquipmentTracking));


1			import React, { createRef, Fragment, useEffect, useState } from 'react';
2			import {
3			Breadcrumb,
4			BreadcrumbItem,
5			Button,
6			ButtonGroup,
7			Card,
8			CardBody,
9			Col,
10			DropdownItem,
11			DropdownMenu,
12			DropdownToggle,
13			Form,
14			FormGroup,
15			Input,
16			Label,
17			Media,
18			Row,
19			UncontrolledDropdown,
20			} from 'reactstrap';
21			import uuid from 'uuid/v1';
22			import Cascader from 'rc-cascader';
23			import loadable from '@loadable/component';
24			import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
25			import { Link } from 'react-router-dom';
26			import Flex from '../../common/Flex';
27			import { getCookieValue, createCookie } from '../../../helpers/utils';
28			import withRedirect from '../../../hoc/withRedirect';
29			import { withTranslation } from 'react-i18next';
30			import { toast } from 'react-toastify';
31			import { APIBaseURL } from '../../../config';
32
33
34			const EquipmentTracking = ({ setRedirect, setRedirectUrl, t }) => {
35			useEffect(() => {
36			let is_logged_in = getCookieValue('is_logged_in');
37			let user_name = getCookieValue('user_name');
38			let user_display_name = getCookieValue('user_display_name');
39			let user_uuid = getCookieValue('user_uuid');
40			let token = getCookieValue('token');
41			if (is_logged_in === null \|\| !is_logged_in) {
42			setRedirectUrl(`/authentication/basic/login`);
43			setRedirect(true);
44			} else {
45			//update expires time of cookies
46			createCookie('is_logged_in', true, 1000 * 60 * 60 * 8);
47			createCookie('user_name', user_name, 1000 * 60 * 60 * 8);
48			createCookie('user_display_name', user_display_name, 1000 * 60 * 60 * 8);
49			createCookie('user_uuid', user_uuid, 1000 * 60 * 60 * 8);
50			createCookie('token', token, 1000 * 60 * 60 * 8);
51			}
52			});
53			let table = createRef();
54			const DetailedDataTable = loadable(() => import('../common/DetailedDataTable'));
55			// State
56			// Query Parameters
57			const [selectedSpaceName, setSelectedSpaceName] = useState(undefined);
58			const [selectedSpaceID, setSelectedSpaceID] = useState(undefined);
59			const [cascaderOptions, setCascaderOptions] = useState(undefined);
60			//Results
61			const [detailedDataTableData, setDetailedDataTableData] = useState([]);
62			const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{
63			dataField: 'name',
64			headerClasses: 'border-0',
65			text: t('Name'),
66			classes: 'border-0 py-2 align-middle',
67			formatter: nameFormatter,
68			sort: true
69			}]);
70
71
72			useEffect(() => {
73			let isResponseOK = false;
74			fetch(APIBaseURL + '/spaces/tree', {
75			method: 'GET',
76			headers: {
77			"Content-type": "application/json",
78			"User-UUID": getCookieValue('user_uuid'),
79			"Token": getCookieValue('token')
80			},
81			body: null,
82
83			}).then(response => {
84			console.log(response);
85			if (response.ok) {
86			isResponseOK = true;
87			}
88			return response.json();
89			}).then(json => {
90			console.log(json)
91			if (isResponseOK) {
92			// rename keys
93			json = JSON.parse(JSON.stringify([json]).split('"id":').join('"value":').split('"name":').join('"label":'));
94			setCascaderOptions(json);
95			setSelectedSpaceName([json[0]].map(o => o.label));
96			setSelectedSpaceID([json[0]].map(o => o.value));
97			} else {
98			toast.error(json.description);
99			}
100			}).catch(err => {
101			console.log(err);
102			});
103
104			}, []);
105			const nameFormatter = (dataField, { name }) => (
106			<Link to="#">
107			<Media tag={Flex} align="center">
108			<Media body className="ml-2">
109			<h5 className="mb-0 fs--1">{name}</h5>
110			</Media>
111			</Media>
112			</Link>
113			);
114
115			const actionFormatter = (dataField, { id }) => (
116			// Control your row with this id
117			<UncontrolledDropdown>
118			<DropdownToggle color="link" size="sm" className="text-600 btn-reveal mr-3">
119			<FontAwesomeIcon icon="ellipsis-h" className="fs--1" />
120			</DropdownToggle>
121			<DropdownMenu right className="border py-2">
122			<DropdownItem onClick={() => console.log('Edit: ', id)}>Edit</DropdownItem>
123			<DropdownItem onClick={() => console.log('Delete: ', id)} className="text-danger">Delete</DropdownItem>
124			</DropdownMenu>
125			</UncontrolledDropdown>
126			);
127
128
129
130			const labelClasses = 'ls text-uppercase text-600 font-weight-semi-bold mb-0';
131
132			let onSpaceCascaderChange = (value, selectedOptions) => {
133			console.log(value, selectedOptions);
134			setSelectedSpaceName(selectedOptions.map(o => o.label).join('/'));
135			setSelectedSpaceID(value[value.length - 1]);
136			}
137
138			// Handler
139			const handleSubmit = e => {
140			e.preventDefault();
141			console.log('handleSubmit');
142			console.log(selectedSpaceID);
143
144			// Reinitialize tables
145			setDetailedDataTableData([]);
146
147			let isResponseOK = false;
148			fetch(APIBaseURL + '/reports/equipmenttracking?' +
149			'spaceid=' + selectedSpaceID, {
150			method: 'GET',
151			headers: {
152			"Content-type": "application/json",
153			"User-UUID": getCookieValue('user_uuid'),
154			"Token": getCookieValue('token')
155			},
156			body: null,
157
158			}).then(response => {
159			if (response.ok) {
160			isResponseOK = true;
161			}
162			return response.json();
163			}).then(json => {
164			if (isResponseOK) {
165			console.log(json)
166
167			setDetailedDataTableColumns([
168			{
169			dataField: 'name',
170			headerClasses: 'border-0',
171			text: t('Name'),
172			classes: 'border-0 py-2 align-middle',
173			formatter: nameFormatter,
174			sort: true
175			},
176			{
177			dataField: 'costcenter',
178			headerClasses: 'border-0',
179			text: t('Cost Center'),
180			classes: 'border-0 py-2 align-middle',
181			sort: true
182			},
183			{
184			dataField: 'space',
185			headerClasses: 'border-0',
186			text: t('Space'),
187			classes: 'border-0 py-2 align-middle',
188			sort: true
189			},
190			{
191			dataField: 'description',
192			headerClasses: 'border-0',
193			text: t('Description'),
194			classes: 'border-0 py-2 align-middle',
195			sort: true
196			},
197			{
198			dataField: '',
199			headerClasses: 'border-0',
200			text: '',
201			classes: 'border-0 py-2 align-middle',
202			formatter: actionFormatter,
203			align: 'right'
204			}
205			]);
206
207			setDetailedDataTableData([
208			{
209			id: uuid(),
210			name: '锅炉#1',
211			costcenter: '成本中心1',
212			space: '成都项目/公区商场/锅炉房',
213			description: '2392 Main Avenue',
214			},
215			{
216			id: uuid(),
217			name: '锅炉#2',
218			costcenter: '成本中心1',
219			space: '成都项目/公区商场/锅炉房',
220			description: '2289 5th Avenue',
221			},
222			{
223			id: uuid(),
224			name: '锅炉#3',
225			costcenter: '成本中心1',
226			space: '成都项目/公区商场/锅炉房',
227			description: '112 Bostwick Avenue',
228			},
229			{
230			id: uuid(),
231			name: '锅炉#4',
232			costcenter: '成本中心1',
233			space: '成都项目/公区商场/锅炉房',
234			description: '3448 Ile De France St #242',
235			},
236			{
237			id: uuid(),
238			name: '锅炉#5',
239			costcenter: '成本中心1',
240			space: '成都项目/公区商场/锅炉房',
241			description: '659 Hannah Street',
242			},
243			{
244			id: uuid(),
245			name: '高压制冷机CH-ZL-01',
246			costcenter: '成本中心1',
247			space: '成都项目/公区商场/空调水',
248			description: '2298 Locust Court',
249			},
250			{
251			id: uuid(),
252			name: '高压制冷机CH-ZL-02',
253			costcenter: '成本中心1',
254			space: '成都项目/公区商场/空调水',
255			description: '4678 Maud Street',
256			},
257			{
258			id: uuid(),
259			name: '高压制冷机CH-ZL-03',
260			costcenter: '成本中心1',
261			space: '成都项目/公区商场/空调水',
262			description: '3412 Crestview Manor',
263			},
264			{
265			id: uuid(),
266			name: '高压制冷机CH-ZL-04',
267			costcenter: '成本中心1',
268			space: '成都项目/公区商场/空调水',
269			description: '4895 Farnum Road',
270			},
271			{
272			id: uuid(),
273			name: '高压制冷机CH-ZL-05',
274			costcenter: '成本中心1',
275			space: '成都项目/公区商场/空调水',
276			description: '3291 Hillside Street',
277			},
278			{
279			id: uuid(),
280			name: '空压机#1',
281			costcenter: '成本中心1',
282			space: '成都项目/动力中心/空压站',
283			description: '162 Hillhaven Drive',
284			},
285			{
286			id: uuid(),
287			name: '空压机#2',
288			costcenter: '成本中心1',
289			space: '成都项目/动力中心/空压站',
290			description: '2551 Ocala Street',
291			},
292			{
293			id: uuid(),
294			name: '空压机#3',
295			costcenter: '成本中心1',
296			space: '成都项目/动力中心/空压站',
297			description: '13572 Kurt Mews South Merritt'
298			},
299			{
300			id: uuid(),
301			name: '空压机#4',
302			costcenter: '成本中心1',
303			space: '成都项目/动力中心/空压站',
304			description: '91979 Kohler Place Waelchiborough'
305			},
306			{
307			id: uuid(),
308			name: '空压机#5',
309			costcenter: '成本中心1',
310			space: '成都项目/动力中心/空压站',
311			description: '6757 Giuseppe Meadows Geraldinemouth'
312			},
313			{
314			id: uuid(),
315			name: '注塑机#1',
316			costcenter: '成本中心1',
317			space: '成都项目/二期厂/空压站',
318			description: '2327 Kaylee Mill East Citlalli'
319			},
320			{
321			id: uuid(),
322			name: '注塑机#2',
323			costcenter: '成本中心1',
324			space: '成都项目/二期厂/空压站',
325			description: '25156 Isaac Crossing Apt.'
326			},
327			{
328			id: uuid(),
329			name: '注塑机#3',
330			costcenter: '成本中心1',
331			space: '成都项目/二期厂/空压站',
332			description: '71603 Wolff Plains Apt'
333			},
334			{
335			id: uuid(),
336			name: '注塑机#4',
337			costcenter: '成本中心1',
338			space: '成都项目/二期厂/空压站',
339			description: '431 Steuber Mews'
340			},
341			{
342			id: uuid(),
343			name: '注塑机#5',
344			costcenter: '成本中心1',
345			space: '成都项目/二期厂/空压站',
346			description: '4167 Laverna Manor Marysemouth'
347			},
348			{
349			id: uuid(),
350			name: '清洗机#1',
351			costcenter: '成本中心1',
352			space: '成都项目/发动机厂',
353			description: '829 Lavonne Valley'
354			},
355			{
356			id: uuid(),
357			name: '清洗机#2',
358			costcenter: '成本中心1',
359			space: '成都项目/发动机厂',
360			description: '53150 Thad Squares'
361			},
362			{
363			id: uuid(),
364			name: '清洗机#3',
365			costcenter: '成本中心1',
366			space: '成都项目/发动机厂',
367			description: "9198 O'Kon Harbors"
368			},
369			{
370			id: uuid(),
371			name: "清洗机#4",
372			costcenter: '成本中心1',
373			space: '成都项目/发动机厂',
374			description: '1478 Kaitlin Haven'
375			},
376			{
377			id: uuid(),
378			name: '清洗机#5',
379			costcenter: '成本中心1',
380			space: '成都项目/发动机厂',
381			description: 'Garry Brainstrow'
382			}
383			]);
384			} else {
385			toast.error(json.description)
386			}
387			}).catch(err => {
388			console.log(err);
389			});
390			};
391
392			return (
393			<Fragment>
394			<div>
395			<Breadcrumb>
396			<BreadcrumbItem>{t('Equipment Data')}</BreadcrumbItem><BreadcrumbItem active>{t('Equipment Tracking')}</BreadcrumbItem>
397			</Breadcrumb>
398			</div>
399			<Card className="bg-light mb-3">
400			<CardBody className="p-3">
401			<Form onSubmit={handleSubmit}>
402			<Row form>
403			<Col xs="auto">
404			<FormGroup className="form-group">
405			<Label className={labelClasses} for="space">
406			{t('Space')}
407			</Label>
408			<br />
409			<Cascader options={cascaderOptions}
410			onChange={onSpaceCascaderChange}
411			changeOnSelect
412			expandTrigger="hover">
413			<Input value={selectedSpaceName \|\| ''} readOnly />
414			</Cascader>
415			</FormGroup>
416			</Col>
417
418			<Col xs="auto">
419			<FormGroup>
420			<br></br>
421			<ButtonGroup id="submit">
422			<Button color="success" >{t('Submit')}</Button>
423			</ButtonGroup>
424			</FormGroup>
425			</Col>
426			</Row>
427			</Form>
428			</CardBody>
429			</Card>
430			<DetailedDataTable data={detailedDataTableData} title={t('Equipment List')} columns={detailedDataTableColumns} pagesize={10} >
431			</DetailedDataTable>
432
433			</Fragment>
434			);
435			};
436
437			export default withTranslation()(withRedirect(EquipmentTracking));
438

myems / myems-web

Push — master ( 95cb66...99bc21 )

src/components/MyEMS/Equipment/EquipmentTracking.js A

Complexity

Size

Duplication

Importance

Duplication Side-by-Side

Filter issues like