Skip to content

Commit

Permalink
basics completed- experimental
Browse files Browse the repository at this point in the history
  • Loading branch information
@ctrlx-altf4
ctrlx-altf4 committed Jul 7, 2021
1 parent 061d8b7 commit 60bf5e9
Show file tree
Hide file tree
Showing 61 changed files with 11,758 additions and 8,184 deletions.
7,730 changes: 2,533 additions & 5,197 deletions package-lock.json
View file

Large diffs are not rendered by default.

23 changes: 14 additions & 9 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,28 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"@types/react": "^16.9.46",
"@popperjs/core": "^2.9.2",
"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"@types/jest": "^26.0.15",
"@types/node": "^16.0.0",
"@types/react": "^17.0.2",
"@types/react-dom": "^17.0.0",
"antd": "^4.5.3",
"date-fns": "^2.22.1",
"moment": "^2.27.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1",
"typescript": "^3.9.7"
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "^3.4.1",
"typescript": "^4.1.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"deploy":"react-scripts build && firebase deploy"
"deploy": "react-scripts build && firebase deploy"
},
"eslintConfig": {
"extends": "react-app"
Expand Down
208 changes: 102 additions & 106 deletions src/App.js
View file
Original file line number Diff line number Diff line change
@@ -1,114 +1,110 @@
import React from 'react';
import logo from './logo.svg';
import './App.css';
import { NepaliDatePicker } from './nepali_date_picker/index.js'
import moment from 'moment';
import NepaliCalendarRange from './nepali_date_picker/calendar_range';
import { getCalendarType, get_ad_bs_listener, AD_BS_RENDERER } from './nepali_date_picker/ad_bs_date_render';
import { Switch, Space } from 'antd';
// import 'antd/dist/antd.css';
import NepaliRangeInputPicker from './nepali_date_picker/range_input_picker';
import CustomDateRangeToggler from './nepali_date_picker/custom_daterange_toggler';
import NepaliCalendar from './nepali_date_picker/calendar';
import React, { useState } from "react";
import { NepaliDatePicker } from "./nepali_date_picker/index.js";
import NepaliCalendarRange from "./nepali_date_picker/calendar_range";
import {
getCalendarType,
get_ad_bs_listener,
} from "./nepali_date_picker/ad_bs_date_render";
import { Switch, Space } from "antd";
import NepaliRangeInputPicker from "./nepali_date_picker/range_input_picker";
import CustomDateRangeToggler from "./nepali_date_picker/custom_daterange_toggler";

class App extends React.Component {
constructor(props) {
super(props)
import AdBsDateRenderer from "./lib/NepaliDatePicker/AdBsDateRenderer";
import NepaliCalendar from "./lib/NepaliDatePicker/Calendar";
import DatePicker from "./lib/NepaliDatePicker/DatePicker";

this.state = {
date: '',
checked: getCalendarType() == "BS"
}
}
render() {
import "./App.css";

return (
<Space direction='vertical' size={40} style={{
width: '100%',
padding: 80,
backgroundColor:'tomato'
}}>
<Switch checked={this.state.checked}
unCheckedChildren="AD"
checkedChildren="BS"
onChange={(checked) => {
if (checked) {
// to bs
let ad_bs_listener = get_ad_bs_listener();
ad_bs_listener.ad_bs.publish("BS")
} else {
// to ad
let ad_bs_listener = get_ad_bs_listener();
ad_bs_listener.ad_bs.publish("AD")
};
this.setState({
checked: checked
})
}}></Switch>

<NepaliCalendar
initialDate={this.state.selected_date}
showExtra={true}
disableDate={this.props.disableDate}
shouldPressOK={true}
initialDateType="BS"
calendarType={"AD"}
dateFormat="DD-MM-YYYY"
withReference={true}
zeroDayName="Receipt Date"
reference_date={"24-08-2020"}
rangeReference={[0,5,15,20,30,40,50,60,70,80,90]}
onSelect={(ad_date, bs_date) => {
console.log("Ad date", ad_date)
let _ad = moment().date(ad_date.day).month(ad_date.month - 1).year(ad_date.year);
this.setState({
selected_date: _ad.format("DD-MM-YYYY"),
calendarVisible: false
})
// typeof this.props.onChange === 'function' && this.props.onChange(_ad.format("DD-MM-YYYY"))
// this.setState({
// selected_date:`${date.day}-${date.month}-${date.year}`
// })
// console.log("date is",date)
}} />
const App = ({ disableDate }) => {
const [date, setDate] = useState("");
const [checked, setChecked] = useState(getCalendarType() === "BS");
const [selectedDate, setSelectedDate] = useState();

<div>For input, type DATE{"<space>"}Month{"<space>"}Year and press ENTER or TAB to select date. NOTE: DATE,MONTH,YEAR field can be neglected</div>
<NepaliDatePicker
value={this.state.date}
onChange={(val) => {
this.setState({
date: val
})
return (
<Space
direction="vertical"
size={40}
style={{
width: "100%",
padding: 80,
backgroundColor: "tomato",
}}
>
<Switch
checked={checked}
unCheckedChildren="AD"
checkedChildren="BS"
onChange={(checked) => {
if (checked) {
// to bs
let ad_bs_listener = get_ad_bs_listener();
ad_bs_listener.ad_bs.publish("BS");
} else {
// to ad
let ad_bs_listener = get_ad_bs_listener();
ad_bs_listener.ad_bs.publish("AD");
}
setChecked(checked);
}}
></Switch>
This is neapli calendar
<NepaliCalendar
initialDate={selectedDate}
showExtra={true}
disableDate={disableDate}
shouldPressOK={true}
initialDateType="BS"
calendarType={"BS"}
dateFormat="yyyy-dd-mm"
showMonthDropdown={true}
showYearDropdown={true}
// withReference={true}
// zeroDayName="Receipt Date"
// reference_date={"24-08-2020"}
// rangeReference={[0, 5, 15, 20, 30, 40, 50, 60, 70, 80, 90]}
onSelect={(formatttedDate, bs_date, date, formattedDate) => {
setSelectedDate(formattedDate);
}}
/>
<div>
For input, type DATE{"<space>"}Month{"<space>"}Year and press ENTER or
TAB to select date. NOTE: DATE,MONTH,YEAR field can be neglected
</div>
<NepaliDatePicker
value={date}
onChange={(val) => {
setDate(val);
}}
/>
new Date Picker
<DatePicker
value={date}
onChange={(val) => {
setDate(val);
}}
/>
<CustomDateRangeToggler />
<NepaliRangeInputPicker />
<NepaliCalendarRange />
<div>RENDERED DATE IN AD/BS</div>
<div>
<Space
size={40}
style={{
display: "flex",
flexDirection: "row",
flexWrap: "wrap",
}}
// disableDate={(d) => {
// if (d <= moment()) {
// return true
// }
// }}
/>
<CustomDateRangeToggler />

<NepaliRangeInputPicker />

<NepaliCalendarRange />
<div>RENDERED DATE IN AD/BS</div>
<div >
<Space size={40} style={{
display: 'flex',
flexDirection: 'row',
flexWrap: 'wrap'
}}>
{Array(20).fill("").map((it, ind) => {
return <AD_BS_RENDERER adDate={moment().add('day', ind).format("DD-MM-YYYY")} />
>
{Array(20)
.fill("")
.map((it, ind) => {
return <AdBsDateRenderer adDate={"02-04-2021"} />; //TODO
})}
</Space>
</div>
{/* <NepaliDatePicker /> */}


</Space>
);
}
}
</Space>
</div>
</Space>
);
};

export default App;
Loading

0 comments on commit 60bf5e9

Please sign in to comment.