update 5 files

master
Your Name 2 years ago
parent f946f473cc
commit 73e1f0321a
  1. 7
      src/App.js
  2. 53
      src/components/DateRangePicker/index.js
  3. 9
      src/components/LeafletMap/index.js
  4. 4
      src/index.css

@ -86,6 +86,7 @@ import LeafletMap from "./components/LeafletMap";
import CssCountdown from "./components/CssCountdown";
import TestComponentNew from "./components/TestComponentNew";
import DateRangePicker from "./components/DateRangePicker";
function App() {
return (
@ -131,14 +132,14 @@ function App() {
{/* <SidebarDesign2 className="w-1/5" /> */}
{/* <FileManager /> */}
{/* <GridListTable /> */}
{/* <PopupCard /> */}
<PopupCard />
{/* <TimeLine /> */}
{/* <CardTrelloDesign /> */}
{/* <ReligiousTimes /> */}
{/* <DistributedData /> */}
{/* <CardDesign1 /> */}
{/* <CardDesign2 /> */}
<LeafletMap />
{/* <LeafletMap /> */}
{/* *************************************************** mini components *************************************************** */}
{/* <Button /> */}
{/* <ButtonDesign /> */}
@ -170,7 +171,7 @@ function App() {
{/* <IconText /> */}
{/* <CustomToast /> */}
{/* <CssCountdown /> */}
<DateRangePicker />
{/* <div className="flex">
<SidebarDesign2 className="w-1/5" />
<span className="w-4/5 ">

@ -0,0 +1,53 @@
import React from "react";
import DatePicker from "react-multi-date-picker";
import { Calendar } from "react-multi-date-picker";
import persian from "react-date-object/calendars/persian";
import persian_fa from "react-date-object/locales/persian_fa";
import DatePanel from "react-multi-date-picker/plugins/date_panel";
const weekDays = [
"شنبه",
"یکشنبه",
"دوشنبه",
"سشنبه",
"چهارشنبه",
"پنجشنبه",
"جمعه",
];
function CustomButton({ direction, handleClick, disabled }) {
return (
<i
onClick={handleClick}
style={{
padding: "0 10px",
fontWeight: "bold",
color: disabled ? "gray" : "blue",
}}
className={disabled ? "cursor-default" : "cursor-pointer"}
>
{direction === "right" ? ">" : "<"}
</i>
);
}
const DateRangePicker = () => {
return (
<>
<Calendar
range
calendar={persian}
locale={persian_fa}
weekDays={weekDays}
minDate={new Date()}
renderButton={<CustomButton />}
calendarPosition="bottom-right"
plugins={[<DatePanel position="bottom" />]}
/>
</>
);
};
export default DateRangePicker;

@ -15,7 +15,6 @@ import { EditControl } from "react-leaflet-draw";
import "leaflet-draw";
import "./index.scss";
import grid from "../../assets/images/grid.png";
// import Grid from "./Grid";
const outerBounds = [
[50.505, -29.09],
[52.505, 29.09],
@ -26,14 +25,6 @@ const LeafletMap = () => {
const onCreated = (e) => {
const drawnItems = leafEl.current._layers;
console.log({ drawnItems });
// if (Object.keys(drawnItems).length > 1) {
// Object.keys(drawnItems).forEach((layerid, index) => {
// if (index > 0) return;
// const layer = drawnItems[layerid];
// leafEl.current.removeLayer(layer);
// });
// console.log(drawnItems);
// }
};
return (

@ -20,7 +20,3 @@ body {
padding-right: 4px;
border-radius: 50%;
}
/*# sourceMappingURL=index.css.map */
.leaflet-control-scale-line:not(:first-child) {
display: none !important;
}

Loading…
Cancel
Save