update code

src/app/apis/Functions/dropdown.js

@@ -54,3 +54,13 @@ export const dropdownMerchant = async (body) =>
     GetData(url.dropdownMerchant, body)
         .then((res) => res)
         .catch((err) => null)
+
+export const dropdownProduct = async (body) =>
+    GetData(url.dropdownProduct, body)
+        .then((res) => res)
+        .catch((err) => null)
+
+export const dropdownProcutByType = async (id) =>
+    GetData(`${url.dropdownProcutByType}/${id}`, {})
+        .then((res) => res)
+        .catch((err) => null)

src/app/apis/url.js

@@ -100,4 +100,5 @@ export default {
     dropdownProduct: `${root}/dropdown/productList`,
     dropdownStore: `${root}/dropdown/listStore`,
     dropdownMerchant: `${root}/dropdown/listmerchant`,
+    dropdownProcutByType: `${root}/dropdown/productListByType`,
 }

src/app/components/dialog/CreateField.jsx

-import React, { useState, useEffect,use } from "react";
+import React, { useState, useEffect, use } from 'react'
 import {
     Button,
     FormControl,
@@ -7,75 +7,63 @@ import {
     Select,
     TextField,
     Typography,
-    DialogActions,Dialog,DialogContent,DialogContentText,DialogTitle,IconButton,Icon,Tooltip
+    DialogActions,
+    Dialog,
+    DialogContent,
+    DialogContentText,
+    DialogTitle,
+    IconButton,
+    Icon,
+    Tooltip,
 } from '@material-ui/core'
- import { toast } from 'react-toastify'
- import { useTranslation } from 'react-i18next'
- import { hideLoading, showLoading } from 'app/redux/actions/loadingAction'
- import { connect } from 'react-redux'
-
- function FormDialog(props) {
+import { toast } from 'react-toastify'
+import { useTranslation } from 'react-i18next'
+import { hideLoading, showLoading } from 'app/redux/actions/loadingAction'
+import { connect } from 'react-redux'
 
+function FormDialog(props) {
     const { t } = useTranslation()
 
+    const { open, handleClose, data, onAgree } = props
 
-    const {open,handleClose,data,onAgree}=props
-     
-
-
-    const [amount,setamount]=useState()
-    
-
-  
-
-    
+    const [name, setName] = useState()
 
     return (
-        
-            
         <Dialog
             open={open}
             onClose={handleClose}
-               
             aria-labelledby="form-dialog-title"
         >
-                <DialogTitle id="form-dialog-title">Cập nhật CTV</DialogTitle>
+            <DialogTitle id="form-dialog-title">Thêm trụ xăng</DialogTitle>
             <DialogContent>
                 <TextField
-                      style={{marginBttom:20,minWidth:400}}
+                    style={{ marginBttom: 20, minWidth: 400 }}
                     variant="outlined"
                     autoFocus
                     margin="dense"
-                        label="Lời nhuận chia sẻ %"
+                    label="Tên trụ *"
                     fullWidth
-                        value={amount || ''}
-                        onChange={(event)=>setamount(event.target.value)}
+                    value={name || ''}
+                    onChange={(event) => setName(event.target.value)}
                 />
+                
             </DialogContent>
             <DialogActions>
-                    <Button
-                         
-                        color="secondary"
-                        onClick={handleClose}
-                    >
+                <Button color="secondary" onClick={handleClose}>
                     Thoát
                 </Button>
-                    <Button onClick={onAgree} color="primary">
+                <Button onClick={()=>{
+                    onAgree(name)
+                    setName('')
+                
+                }} color="primary">
                     Đồng ý
                 </Button>
             </DialogActions>
-           
-                 
         </Dialog>
-        
     )
 }
 
- 
-
-
-
-
 const mapStateToProps = (state) => {
     return {}
 }

src/app/components/dialog/CreateFountain.jsx

+import React, { useState, useEffect } from 'react'
+import {
+    Button,
+    FormControl,
+    Grid,
+    InputLabel,
+    Select,
+    TextField,
+    Typography,
+    Radio,
+    FormControlLabel,
+    DialogActions,
+    Dialog,
+    DialogContent,
+    DialogContentText,
+    DialogTitle,
+    IconButton,
+    Icon,
+    Tooltip,
+    RadioGroup,
+    MenuItem,
+} from '@material-ui/core'
+import { toast } from 'react-toastify'
+import { useTranslation } from 'react-i18next'
+import { KeyboardDatePicker } from '@material-ui/pickers'
+import {
+    convertDate,
+    toPriceVndInput,
+    convertViToEn,
+} from 'app/config/Function'
+import {
+    TextValidator,
+    ValidatorForm,
+    SelectValidator,
+} from 'react-material-ui-form-validator'
+import {dropdownProductType,dropdownProcutByType}  from 'app/apis/Functions/dropdown'
+
+export default function FormDialog({ onCreate }) {
+    const [open, setOpen] = React.useState(false)
+    const { t } = useTranslation()
+    const [state, setState] = useState({})
+    const [listType, setListType] = useState([])
+    const [listProduct, setListProduct] = useState([])
+    const [product,setProduct]=useState()
+    const [type, setType] = useState()
+
+
+    useEffect(()=>{
+        setProduct()
+
+        if(type){
+            getDropdownProduct(type)
+        }
+        
+
+    },[type])
+
+    useEffect(() => {
+        
+        getData()
+    }, [])
+    const getData = async () => {
+        const res = await dropdownProductType({})
+        if (res.data.code == 200 && res.data.data) {
+            const newList = res.data.data.map((e) => {
+                return {  ...e,name: e.type_name, value: e.id}
+            })
+            setListType(newList)
+        } 
+        else {
+            toast.error('Lấy giữ liệu thất bại !', {
+                theme: 'colored',
+            })
+        }
+    }
+    const getDropdownProduct= async (type) => {
+        const res = await dropdownProcutByType(type)
+        if (res.data.code == 200 && res.data.data) {
+            const newList = res.data.data.map((e) => {
+                return {  ...e,name: e.product_name, value: e.id}
+            })
+            setListProduct(newList)
+        } 
+        else {
+            toast.error('Lấy giữ liệu thất bại !', {
+                theme: 'colored',
+            })
+        }
+    }
+
+
+
+    function handleClickOpen() {
+        setOpen(true)
+    }
+
+    function handleClose() {
+        setOpen(false)
+    }
+
+    const handleSubmit = async (value) => {
+        console.log('state', state)
+
+
+        onCreate({...state,type})
+    }
+
+    const handleChange = (event) => {
+        event.persist()
+        setState({
+            ...state,
+            [event.target.name]: event.target.value,
+        })
+    }
+
+    const { product_id, name, code } = state
+
+    return (
+        <>
+            <Tooltip title="Chuyển tiền đáo hạn">
+                <IconButton onClick={handleClickOpen}>
+                    <Icon style={{ color: '#4caf50' }}>add_circle</Icon>
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                open={open}
+                onClose={handleClose}
+                aria-labelledby="form-dialog-title"
+            >
+                
+                    <DialogTitle id="form-dialog-title">
+                        Thêm vòi xăng
+                    </DialogTitle>
+
+                    <DialogContent>
+                        <Grid container spacing={2}>
+                            <Grid item lg={12} md={12} sm={12} xs={12}>
+                                <TextValidator
+                                    className="mb-4 w-full"
+                                    label="Tên vòi xăng *"
+                                    onChange={handleChange}
+                                    variant="outlined"
+                                    type="text"
+                                    name="name"
+                                    value={name || ''}
+                                    validators={['required']}
+                                    errorMessages={[
+                                        'Không được để trống trường này',
+                                    ]}
+                                />
+                            </Grid>
+                            <Grid item lg={12} md={12} sm={12} xs={12}>
+                                <TextValidator
+                                    className="mb-4 w-full"
+                                    label="Mã vòi xăng *"
+                                    onChange={handleChange}
+                                    variant="outlined"
+                                    type="text"
+                                    name="code"
+                                    value={code || ''}
+                                    validators={['required']}
+                                    errorMessages={[
+                                        'Không được để trống trường này',
+                                    ]}
+                                />
+                            </Grid>
+
+                            <Grid item lg={12} md={12} sm={12} xs={12}>
+                                <SelectValidator
+                                    variant={'outlined'}
+                                    label={'Loại nguyên liệu *'}
+                                    className="mb-4 w-full"
+                                    value={type || ''}
+                                    displayEmpty
+                                    name="merchan_id"
+                                    onChange={(event) => {
+                                        setType(event.target.value)
+                                    }}
+                                    validators={['required']}
+                                    errorMessages={[
+                                        'Không được để trống trường này',
+                                    ]}
+                                >
+                                    {listType.map((e) => (
+                                        <MenuItem value={e.id}>
+                                            {e.name}
+                                        </MenuItem>
+                                    ))}
+                                </SelectValidator>
+                            </Grid>
+
+                            <Grid item lg={12} md={12} sm={12} xs={12}>
+                                <SelectValidator
+                                    variant={'outlined'}
+                                    label={'Loại xăng *'}
+                                    className="mb-4 w-full"
+                                    value={product_id || ''}
+                                    displayEmpty
+                                    name="product_id"
+                                    onChange={handleChange}
+                                    validators={['required']}
+                                    errorMessages={[
+                                        'Không được để trống trường này',
+                                    ]}
+                                >
+                                    {listProduct.map((e) => (
+                                        <MenuItem value={e.id}>
+                                            {e.name}
+                                        </MenuItem>
+                                    ))}
+                                </SelectValidator>
+                            </Grid>
+                        </Grid>
+                    </DialogContent>
+                    <DialogActions>
+                        <Button color="secondary" onClick={handleClose}>
+                            Thoát
+                        </Button>
+                        <Button onClick={handleSubmit} color="primary">
+                            Đồng ý
+                        </Button>
+                    </DialogActions>
+               
+            </Dialog>
+        </>
+    )
+}