work on caller history part of widget and making fake data and work on that
This commit is contained in:
@@ -3,7 +3,6 @@ import {Avatar, Box, ListItem, ListItemAvatar, ListItemText, Typography} from "@
|
||||
import HeadsetMicIcon from '@mui/icons-material/HeadsetMic';
|
||||
|
||||
const PreviusOperatorData = ({historyItem}) => {
|
||||
console.log(historyItem)
|
||||
const t = useTranslations();
|
||||
return (
|
||||
<ListItem>
|
||||
|
||||
@@ -4,7 +4,7 @@ import {Box, List, ListItem, Typography} from "@mui/material";
|
||||
const Topics = ({historyItem}) => {
|
||||
const t = useTranslations();
|
||||
return (
|
||||
<Box timeout="auto" unmountOnExit>
|
||||
<Box timeout="auto" unmountonexit="true">
|
||||
<List component="div" disablePadding>
|
||||
<ListItem sx={{px: 4}}>
|
||||
<Box sx={{width: "100%", display: "flex", justifyContent: "space-between"}}>
|
||||
|
||||
@@ -1,19 +1,17 @@
|
||||
import {useTranslations} from "next-intl";
|
||||
import {Divider, List} from "@mui/material";
|
||||
import {Grow, List} from "@mui/material";
|
||||
import PreviusOperatorData from "./PreviusOperatorData";
|
||||
import Topics from "./Topics";
|
||||
|
||||
const ListItemOfCalls = ({lastItem, historyItem}) => {
|
||||
const ListItemOfCalls = ({historyItem}) => {
|
||||
const t = useTranslations();
|
||||
console.log("historyItem", historyItem)
|
||||
return (
|
||||
<>
|
||||
<Grow in={true}>
|
||||
<List sx={{width: '100%', bgcolor: 'rgba(222,234,215,0.11)'}}>
|
||||
<PreviusOperatorData historyItem={historyItem}/>
|
||||
<Topics historyItem={historyItem}/>
|
||||
</List>
|
||||
{!lastItem && <Divider/>}
|
||||
</>
|
||||
</Grow>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@@ -10,11 +10,15 @@ import {useState} from "react";
|
||||
|
||||
const CallHistory = ({tab}) => {
|
||||
const t = useTranslations();
|
||||
const {historyList, isLoadingHistoryList, errorHistoryList} = useCallerHistory(tab.id);
|
||||
const max_size = 10;
|
||||
const {
|
||||
firstItemOfHistory,
|
||||
historyList,
|
||||
isLoadingHistoryList,
|
||||
errorHistoryList
|
||||
} = useCallerHistory(tab.phone_number, max_size);
|
||||
const [showRestOfHistory, setShowRestOfHistory] = useState(false);
|
||||
const handleClick = () => {
|
||||
console.info('You clicked the Chip.');
|
||||
};
|
||||
|
||||
return (
|
||||
<Stack sx={{
|
||||
height: "100%",
|
||||
@@ -30,7 +34,7 @@ const CallHistory = ({tab}) => {
|
||||
<ErrorOrEmpty isErrorOrEmpty="empty"/>
|
||||
) : (
|
||||
<Box>
|
||||
<ListItemOfCalls key={historyList[1].id} lastItem={true} historyItem={historyList[1]}/>
|
||||
<ListItemOfCalls historyItem={firstItemOfHistory}/>
|
||||
<Divider>
|
||||
<Chip
|
||||
icon={<HeadphonesIcon/>}
|
||||
@@ -41,10 +45,9 @@ const CallHistory = ({tab}) => {
|
||||
</Divider>
|
||||
{showRestOfHistory && (
|
||||
<>
|
||||
{historyList.slice(2).map((historyItem, index) => (
|
||||
{historyList.map((historyItem, index) => (
|
||||
<>
|
||||
<ListItemOfCalls key={historyItem.id} lastItem={true}
|
||||
historyItem={historyItem}/>
|
||||
<ListItemOfCalls key={historyItem.id} historyItem={historyItem}/>
|
||||
<Divider/>
|
||||
</>
|
||||
))}
|
||||
|
||||
@@ -17,7 +17,7 @@ export const GET_PROVINCE_LIST = BASE_URL + "/api/provinces";
|
||||
// province list
|
||||
|
||||
// province list
|
||||
export const GET_CALLER_HISTORY = BASE_URL + "...";
|
||||
export const GET_CALLER_HISTORY = BASE_URL + "/api/calls/list";
|
||||
// province list
|
||||
|
||||
//change password
|
||||
|
||||
@@ -17,11 +17,7 @@ export const AnswersContext = createContext()
|
||||
export const AnswersProvider = ({children}) => {
|
||||
const [openCallDialog, setOpenCallDialog] = useState(false)
|
||||
const [activeTab, setActiveTab] = useState(0)
|
||||
const [state, dispatch] = useReducer(reducer, [{
|
||||
id: 2,
|
||||
phone_number: "09036949387",
|
||||
active: true
|
||||
}]);
|
||||
const [state, dispatch] = useReducer(reducer, []);
|
||||
|
||||
return <AnswersContext.Provider
|
||||
value={{
|
||||
|
||||
@@ -2,18 +2,18 @@ import {GET_CALLER_HISTORY} from "@/core/data/apiRoutes";
|
||||
import useRequest from "@/lib/app/hooks/useRequest";
|
||||
import useSWR from "swr";
|
||||
|
||||
const useCallerHistory = (id) => {
|
||||
const useCallerHistory = (phone_number, max_size) => {
|
||||
const requestServer = useRequest({auth: true, notification: false})
|
||||
|
||||
//swr config
|
||||
const fetcher = (...args) => {
|
||||
return requestServer(args, 'get').then(({data}) => {
|
||||
return data.data;
|
||||
return data.data.slice(2);
|
||||
}).catch(() => {
|
||||
})
|
||||
};
|
||||
|
||||
const {data, isLoading} = useSWR(`${GET_CALLER_HISTORY}/${id}`, fetcher, {
|
||||
const {data, isLoading} = useSWR(`${GET_CALLER_HISTORY}?phone_number=${phone_number}&size=${max_size}`, fetcher, {
|
||||
revalidateIfStale: false,
|
||||
revalidateOnFocus: false,
|
||||
revalidateOnReconnect: false,
|
||||
@@ -21,38 +21,16 @@ const useCallerHistory = (id) => {
|
||||
});
|
||||
|
||||
return {
|
||||
historyList: [
|
||||
{
|
||||
firstItemOfHistory: {
|
||||
id: 1,
|
||||
operator_name: "اشکان خطیبی",
|
||||
answer_date: "1379/02/03 13:50",
|
||||
topic: "موضوع تست",
|
||||
sub_topic: "زیر موضوع تست با متن طولانی تر از موضوع"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
operator_name: "مصیب خطیبی",
|
||||
answer_date: "1385/01/23 23:10",
|
||||
topic: "موضوع تست2",
|
||||
sub_topic: "زیر موضوع تست با متن طولانی تر از موضوع2"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
operator_name: "علی جلالی",
|
||||
answer_date: "1385/01/01 12:12",
|
||||
topic: "موضوع تست23",
|
||||
sub_topic: "زیر 22موضوع تست با متن طولانی تر از موضوع32"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
operator_name: "حسن محمودی",
|
||||
answer_date: "1385/01/01 11:22",
|
||||
topic: "موضوع اول",
|
||||
sub_topic: "زیر دوم تست با متن طولانی تر از موضوع32"
|
||||
}
|
||||
],
|
||||
isLoadingHistoryList: false,
|
||||
errorHistoryList: false
|
||||
historyList: data,
|
||||
isLoadingHistoryList: isLoading,
|
||||
errorHistoryList: !data
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user