modal modified

parent 28d6db83
This diff is collapsed.
......@@ -6,7 +6,7 @@
"@reduxjs/toolkit": "^2.2.1",
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@testing-library/user-event": "^14.5.2",
"axios": "^1.6.7",
"cors": "^2.8.5",
"express": "^4.18.3",
......@@ -50,6 +50,7 @@
]
},
"devDependencies": {
"@babel/preset-env": "^7.24.3",
"tailwindcss": "^3.4.1"
}
}
public/favicon.PNG

1.25 KB | W: | H:

public/favicon.PNG

2.38 KB | W: | H:

public/favicon.PNG
public/favicon.PNG
public/favicon.PNG
public/favicon.PNG
  • 2-up
  • Swipe
  • Onion skin
{
"short_name": "React App",
"name": "Create React App Sample",
"short_name": "Scorecard",
"name": "Nisum ScoreCard",
"icons": [
{
"src": "favicon.ico",
"src": "favicon1.png",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
"type": "image/png"
},
{
"src": "logo192.png",
......
{
"presets": ["@babel/preset-env"]
}
\ No newline at end of file
......@@ -6,6 +6,7 @@ import Viewreportee from './pages/viewReportee';
import './App.css';
import PageNotFound from './pages/pagenotfound/PageNotFound';
import Exporttable from './pages/reportexport'
function App() {
return (
<BrowserRouter>
......
......@@ -3,6 +3,6 @@ import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
// const linkElement = screen.getByText(/learn react/i);
// expect(linkElement).toBeInTheDocument();
});
......@@ -7,16 +7,16 @@ import { v4 as uuidv4 } from 'uuid';
export default function MyModal({ visible, onClose, type, handleAddActivity }) {
const {user} = useSelector((state) => state.userDetails)
const { user } = useSelector((state) => state.userDetails)
const [activitiesList, setActivitiesList] = useState([])
const [enableSubmit, setEnableSubmit] = useState(false)
const [activityData, setActivityData] = useState({ aName: "",ratedBy:"", aId: "", type: type, score: 0, comments: "" })
const [activityData, setActivityData] = useState({ aName: "", ratedBy: "", aId: "", type: type, score: 0, comments: "" })
const [activityType, setActivtyType] = useState("")
const [showCustActivity, setShowActivity] = useState(false);
const [modalLoading, setModalLoading] = useState(true)
const [scoreRender, setScoreRender] = useState([]);
const [showScore, setShowScore] = useState(false)
const [disableAppreciate,setDisableAppreciate]=useState(false)
const [disableAppreciate, setDisableAppreciate] = useState(false)
const getActivitysList = async (type) => {
const activities = await axios.get(`${base_url}/activities`)
......@@ -26,8 +26,15 @@ export default function MyModal({ visible, onClose, type, handleAddActivity }) {
}
const handleActivityName = (e) => {
if (e.target.value === "custom") {
setActivityData({ ...activityData, aName: "", aId: "" })
setShowActivity(true)
}
else {
setShowActivity(false)
setActivityData({ ...activityData, aName: e.target.value, aId: e.target.options[e.target.selectedIndex].id })
}
}
const handleCustumActivity = (e) => {
const randomId = uuidv4();
......@@ -39,9 +46,9 @@ export default function MyModal({ visible, onClose, type, handleAddActivity }) {
setActivityData({ ...activityData, score: Number(value) })
}
const handlePerformance=(value)=> {
const handlePerformance = (value) => {
let appreciateScores = [1, 2, 3, 4, 5]
let depreciateScores = [ -1, -2, -3, -4, -5]
let depreciateScores = [-1, -2, -3, -4, -5]
if (value == 1) {
setActivityData({ ...activityData, score: 0 })
setScoreRender(appreciateScores)
......@@ -55,10 +62,11 @@ export default function MyModal({ visible, onClose, type, handleAddActivity }) {
}
const handleComments = (e) => {
setActivityData({ ...activityData, comments:e.target.value.trim() })
setActivityData({ ...activityData, comments: e.target.value.trim() })
}
const handleSubmit = (e) => {
e.preventDefault()
onClose()
setShowActivity(false)
handleAddActivity(activityData)
......@@ -79,16 +87,16 @@ export default function MyModal({ visible, onClose, type, handleAddActivity }) {
setActivtyType(str.charAt(0).toUpperCase() + str.slice(1).toLowerCase())
}
useEffect(() => {
if(type==="duties"){
if (type === "duties") {
setDisableAppreciate(true);
}else{
} else {
setDisableAppreciate(false);
}
SentenceCase(type)
if (visible === false) {
setActivityData({ aName: "",ratedBy:"", aId: "", type: type, score: 0, comments: "" })
setActivityData({ aName: "", ratedBy: "", aId: "", type: type, score: 0, comments: "" })
} else {
setActivityData({...activityData,ratedBy:user.empName})
setActivityData({ ...activityData, ratedBy: user.empName })
getActivitysList(type);
setModalLoading(true)
}
......@@ -114,25 +122,19 @@ export default function MyModal({ visible, onClose, type, handleAddActivity }) {
<div>
<form className=" p-2 max-w-sm mx-auto text-[12px]" onClick={(e) => e.stopPropagation()}>
<div className="flex items-center my-5">
<label htmlFor="countries">SELECT ACTIVITY<span className="text-[15px]">*</span>: </label>
<select disabled={showCustActivity} className="bg-gray-50 ml-2 w-6/12 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block p-2.5 " onChange={(e) => handleActivityName(e)} value={activityData.aName}>
<select className="bg-gray-50 ml-2 w-6/12 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block p-2.5 " onChange={(e) => handleActivityName(e)} >
<option id="" value="">Select</option>
{
activitiesList && activitiesList.map((activity) => <option className=" w-7/12" key={activity.aId} id={activity.aId} value={activity.aName}>{activity.aName}</option>)
}
<option value="custom" className={`${showCustActivity || type == "duties" && 'hidden'}`}>Add Activity</option>
</select>
<button onClick={(e) => { handleCustBtn(e) }} className={`${showCustActivity && 'hidden'} bg-blue-400 ml-2 w-2/12 text-white py-1 rounded hover:scale-95 transition text-sm`}>Custom</button>
</div>
<div className={`flex items-center ${!showCustActivity && 'hidden'}`}>
<label className={`font-medium mr-2`}>Custom Activity<span className="text-[15px]">*</span>:</label>
<label className={`font-medium mr-2`}>Activity<span className="text-[15px]">*</span>:</label>
<input type="text" value={activityData.aName} placeholder="Enter Activity name" name="performance" className={`border border-gray-300 rounded p-2 `} onChange={(e) => handleCustumActivity(e)} />
<button onClick={(e) => { handleCustBtn(e) }} className={`${!showCustActivity && 'hidden'} bg-blue-400 ml-2 w-2/12 text-white py-1 rounded hover:scale-95 transition text-sm`}>Close</button>
</div>
<div className="flex items-center mb-4 ">
<label htmlFor="appreciate" className="font-medium">APPRECIATION<span className="text-[15px]">*</span>:</label>
<input id="appreciate" disabled={disableAppreciate} type="radio" value="appreciate" name="performance" className="w-4 h-4 m-3 text-blue-600 bg-gray-100 border-gray-300 " onChange={() => handlePerformance(1)} />
......
......@@ -14,7 +14,7 @@ function Sidebar() {
<ul className="space-y-1.5">
<li>
<Link
className={`flex items-center gap-x-3.5 py-2 px-2.5 bg-gray-100 text-sm text-slate-700 rounded-lg hover:bg-gray-100 `}
className={`flex items-center gap-x-3.5 py-2 px-2.5 text-sm text-slate-700 rounded-lg hover:bg-gray-100 `}
to={`/dashboard`}
>
<svg
......
......@@ -4,7 +4,6 @@ import axios from 'axios';
import { base_url } from "../../utils/constants";
import { loginUser } from "../../redux/reducers/userSlice";
import {useDispatch,useSelector} from 'react-redux'
import Loading from '../../components/loading Component/Loading'
function Home() {
const inputRef = useRef(null);
......
This diff is collapsed.
......@@ -3,17 +3,15 @@ import { base_url } from "../../utils/constants";
import axios from "axios";
const initialState = {
totalReporteesData: [],
activitiesData:null,
loading: false,
error: null,
fromDate: null,
toDate: null,
};
export const fetchReportstableData = createAsyncThunk("getreportees", async (data) => {
return await axios.post(`${base_url}/getreportees`, data)
.then((response) => response.data);
export const fetchReportesActivitiesData = createAsyncThunk("getactivities", async (data) => {
return await axios.post(`${base_url}/getActivities`, data)
.then((response) => response.data.activities);
});
const exporttableSlice = createSlice({
......@@ -23,57 +21,26 @@ const exporttableSlice = createSlice({
resetReporteesTableData:() => {
return initialState
},
setPastMonth: (state) => {
const toDate = new Date();
const fromDate = new Date();
fromDate.setMonth(fromDate.getMonth() - 1);
state.fromDate = fromDate;
state.toDate = toDate;
console.log(fromDate,toDate)
},
setPastTwoMonths: (state) => {
const toDate = new Date();
const fromDate = new Date();
fromDate.setMonth(fromDate.getMonth() - 3);
state.fromDate = fromDate;
state.toDate = toDate;
console.log(fromDate,toDate)
},
setPastsixMonths: (state) => {
const toDate = new Date();
const fromDate = new Date();
fromDate.setMonth(fromDate.getMonth() - 6);
state.fromDate = fromDate;
state.toDate = toDate;
console.log(fromDate,toDate)
},
setPasttwelvemonths: (state) => {
const toDate = new Date();
const fromDate = new Date();
fromDate.setMonth(fromDate.getMonth() - 12);
state.fromDate = fromDate;
state.toDate = toDate;
console.log(fromDate,toDate)
},
},
extraReducers: (builder) => {
builder.addCase(fetchReportstableData.pending, (state) => {
builder.addCase(fetchReportesActivitiesData.pending, (state) => {
state.loading = true;
state.error = "pending";
});
builder.addCase(fetchReportstableData.fulfilled, (state, action) => {
builder.addCase(fetchReportesActivitiesData.fulfilled, (state, action) => {
state.loading = false;
state.totalReporteesData = action.payload.data;
state.activitiesData = action.payload;
state.error = "";
});
builder.addCase(fetchReportstableData.rejected, (state, action) => {
builder.addCase(fetchReportesActivitiesData.rejected, (state, action) => {
state.loading = false;
state.totalReporteesData = null;
state.activitiesData = null;
state.error = action.error || "Something went wrong!";
});
},
});
export const {resetReporteesTableData,setPastMonth,setPastTwoMonths,setPastsixMonths,setPasttwelvemonths} = exporttableSlice.actions;
export const {resetReporteesTableData} = exporttableSlice.actions;
export default exporttableSlice.reducer;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment