feat(project type): add form multi location

src/views/SimproV2/ProjectType/DialogForm.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react'
 import {
   Modal, ModalHeader, ModalBody, ModalFooter,
-  Button, Form, FormGroup, Label, Input, Col, Row
+  Button, Form, FormGroup, Label, Input, Col, Row, CustomInput
 } from 'reactstrap';
 import { Select } from 'antd';
 import moment from 'moment';
@@ -16,9 +16,12 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
   const [description, setDescription] = useState('')
   const [unitPrice, setUnitPrice] = useState()
   const [selectedCompany, setSelectedCompany] = useState(null)
+  const [isMultiLocation, setIsMultiLocation] = useState(false);
   const { t } = useTranslation();
 
-
+  const handleIsMultiLocationChange = () => {
+    setIsMultiLocation(!isMultiLocation);
+  };
 
   useEffect(() => {
     if (typeDialog === "Edit") {
@@ -28,46 +31,51 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
       setUom(dataEdit.uom)
       setProjectType(dataEdit.name)
       setSelectedCompany(dataEdit.company_id)
+      setIsMultiLocation(dataEdit.is_multiLocation)
     } else {
-      setId(0)
+      handleClear()
     }
   }, [dataEdit, openDialog])
 
   const handleSave = () => {
     let data = '';
+    if (role_name === 'Super Admin') {
+      company_id = selectedCompany
+    }
     if (typeDialog === "Save") {
-      if (role_name === 'Super Admin') {
-        company_id = selectedCompany
-      }
       data = {
         name: projectType,
         description,
-        company_id: company_id
+        company_id: parseInt(company_id),
+        is_multiLocation: isMultiLocation
       }
 
       closeDialog('save', data);
     } else {
-      if (role_name === 'Super Admin') {
-        company_id = selectedCompany
-      }
       data = {
         id,
         name: projectType,
         description,
-        company_id: company_id
+        company_id: parseInt(company_id),
+        is_multiLocation: isMultiLocation
       }
       closeDialog('edit', data);
     }
+    handleClear();
+  }
+
+  const handleClear = () => {
     setId(0)
+    setProjectType('')
     setDescription('')
     setSelectedCompany(null)
+    setIsMultiLocation(false)
+
   }
 
   const handleCancel = () => {
-    closeDialog('cancel', 'none')
+    closeDialog('cancel', 'none');
-    setId(0)
+    handleClear();
-    setDescription('')
-    setSelectedCompany(null)
   }
 
   const onChangeCompany = (val) => {
@@ -91,33 +99,43 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
             </FormGroup>
           </Col>
         </Row>
-        {role_name === 'Super Admin' &&
+        <Row>
-          <Row>
+          <Col md={6}>
-            <Col md={6}>
+            <FormGroup>
-              <FormGroup>
+              <Label className="capitalize">Is Multi Location</Label>
-                <Label className="capitalize">
+              <div>
-                  {t('company')}<span style={{ color: "red" }}>*</span>
+                <CustomInput type="switch" id="isMultiLocationSwitch" name="isMultiLocationSwitch" checked={isMultiLocation} onChange={handleIsMultiLocationChange} />
-                </Label>
+              </div>
-                <Select
+            </FormGroup>
-                  showSearch
+          </Col>
-                  filterOption={(inputValue, option) =>
+          {
-                    option.children.toLowerCase().includes(inputValue.toLowerCase())
+            role_name === 'Super Admin' && (
-                  }
+                <Col md={6}>
-                  value={selectedCompany}
+                  <FormGroup>
-                  defaultValue={selectedCompany}
+                    <Label className="capitalize">
-                  onChange={onChangeCompany}
+                      {t('company')}<span style={{ color: "red" }}>*</span>
-                  style={{ width: "100%" }}
+                    </Label>
-                >
+                    <Select
-                  {listCompany.map((res) => (
+                      showSearch
-                    <Option key={res.id} value={res.id}>
+                      filterOption={(inputValue, option) =>
-                      {res.company_name}
+                        option.children.toLowerCase().includes(inputValue.toLowerCase())
-                    </Option>
+                      }
-                  ))}
+                      value={selectedCompany}
-                </Select>
+                      defaultValue={selectedCompany}
-              </FormGroup>
+                      onChange={onChangeCompany}
-            </Col>
+                      style={{ width: "100%" }}
-          </Row>
+                    >
-        }
+                      {listCompany.map((res) => (
+                        <Option key={res.id} value={res.id}>
+                          {res.company_name}
+                        </Option>
+                      ))}
+                    </Select>
+                  </FormGroup>
+                </Col>
+              )
+            }
+        </Row>
       </Form>
     )
   }