// ** React Imports
import { useState, ChangeEvent, MouseEvent, forwardRef, ForwardedRef } from "react";

// ** Next Imports
import Link from "next/link";
import { GetStaticProps, InferGetStaticPropsType } from "next/types";

// ** MUI Imports
import Box from "@mui/material/Box";
import Card from "@mui/material/Card";
import Menu from "@mui/material/Menu";
import Grid from "@mui/material/Grid";
import { styled } from "@mui/material/styles";
import MenuItem from "@mui/material/MenuItem";
import IconButton from "@mui/material/IconButton";
import Typography from "@mui/material/Typography";
import { DataGrid, GridColDef } from "@mui/x-data-grid";

// ** Icon Imports
import Icon from "src/@core/components/icon";

// ** Store Imports
import { useDispatch } from "react-redux";


// ** Types Imports
import { AppDispatch } from "src/store";
import { ThemeColor } from "src/@core/layouts/types";
import { ScheduleType } from "src/types/apps/scheduleTypes";
import RadioGroup from "@mui/material/RadioGroup";
import Radio from "@mui/material/Radio";
import FormControlLabel from "@mui/material/FormControlLabel";
import Button from "@mui/material/Button";
import TextField from "@mui/material/TextField";
import DatePicker from 'react-datepicker'
import DatePickerWrapper from 'src/@core/styles/libs/react-datepicker'
import InputAdornment from '@mui/material/InputAdornment'
import { DateType } from 'src/types/forms/reactDatepickerTypes'
interface CellType {
  row: ScheduleType;
}

const LinkStyled = styled(Link)(({ theme }) => ({
  fontWeight: 600,
  fontSize: "1rem",
  cursor: "pointer",
  textDecoration: "none",
  color: theme.palette.text.secondary,
  "&:hover": {
    color: theme.palette.primary.main,
  },
}));

const CustomInputStart = forwardRef(({ ...props }, ref: ForwardedRef<HTMLElement>) => {
	return <TextField inputRef={ref} 
  label="始期"    
  InputProps={{
  startAdornment: (
    <InputAdornment position='start'>
      <Icon icon='ri-calendar-line' />
    </InputAdornment>
  )
}} {...props} />
})
CustomInputStart.displayName = 'CustomInputStart'

const CustomInputEnd = forwardRef(({ ...props }, ref: ForwardedRef<HTMLElement>) => {
	return <TextField inputRef={ref} 
  label="終期"    
  InputProps={{
  startAdornment: (
    <InputAdornment position='start'>
      <Icon icon='ri-calendar-line' />
    </InputAdornment>
  )
}} {...props} />
})
CustomInputEnd.displayName = 'CustomInputEnd'

const SelectCompany = () => {
  return (
    <Grid container spacing={6}>
      <Grid item xs={12}>
        <Card>
          <Box
            sx={{
              p: 5,
              pb: 3,
              display: "flex",
              flexWrap: "wrap",
              alignItems: "center",
              justifyContent: "space-between",
              fontSize : '24px',
            }}
          >
            <span className="mr-4 mb-2">会社選択</span>
          </Box>
          <Box
            sx={{
              p: 5,
              pb: 3,
              display: "flex",
              flexWrap: "wrap",
              alignItems: "center",
              justifyContent: "space-between",
            }}
          >
            <span>左上のプルダウンから操作する会社を選択して下さい</span>
          </Box>
        </Card>
      </Grid>
    </Grid>
  );
};

SelectCompany.acl = {
  action: "manage",
  subject: "group_admin",
};

export default SelectCompany;