FAQs
This commit is contained in:
pawan-dot
parent
d180f3601c
commit
b8f51b41bd
@ -6,6 +6,7 @@ import {
|
|||||||
cilChartPie,
|
cilChartPie,
|
||||||
cilCursor,
|
cilCursor,
|
||||||
cilDrop,
|
cilDrop,
|
||||||
|
cilFace,
|
||||||
cilFilterSquare,
|
cilFilterSquare,
|
||||||
cilMoney,
|
cilMoney,
|
||||||
cilNewspaper,
|
cilNewspaper,
|
||||||
@ -84,6 +85,12 @@ const _nav = [
|
|||||||
icon: <CIcon icon={cilFilterSquare} customClassName="nav-icon" />,
|
icon: <CIcon icon={cilFilterSquare} customClassName="nav-icon" />,
|
||||||
to: '/requirement',
|
to: '/requirement',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
component: CNavItem,
|
||||||
|
name: 'FAQs',
|
||||||
|
icon: <CIcon icon={cilFace} customClassName="nav-icon" />,
|
||||||
|
to: '/FAQs',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
component: CNavItem,
|
component: CNavItem,
|
||||||
name: 'Users',
|
name: 'Users',
|
||||||
|
|||||||
@ -24,7 +24,7 @@ import {
|
|||||||
import CIcon from '@coreui/icons-react'
|
import CIcon from '@coreui/icons-react'
|
||||||
import swal from 'sweetalert';
|
import swal from 'sweetalert';
|
||||||
|
|
||||||
import avatar8 from './../../assets/images/avatars/8.jpg'
|
import avatar8 from './../../assets/images/avatars/1.jpg'
|
||||||
import { Link } from 'react-router-dom'
|
import { Link } from 'react-router-dom'
|
||||||
// import { signout } from 'src/auth'
|
// import { signout } from 'src/auth'
|
||||||
import { useHistory } from "react-router-dom";
|
import { useHistory } from "react-router-dom";
|
||||||
|
|||||||
@ -44,6 +44,11 @@ import ViewRequirement from './views/Requirement/ViewRequirement'
|
|||||||
import Requirement from './views/Requirement/Requirement'
|
import Requirement from './views/Requirement/Requirement'
|
||||||
import AddRequirement from './views/Requirement/AddRequirement'
|
import AddRequirement from './views/Requirement/AddRequirement'
|
||||||
import EditRequirement from './views/Requirement/EditRequirement'
|
import EditRequirement from './views/Requirement/EditRequirement'
|
||||||
|
//FAQs
|
||||||
|
import ViewFaqs from "./views/FAQs/ViewFaqs"
|
||||||
|
import Faqs from './views/FAQs/Faqs'
|
||||||
|
import AddFaqs from './views/FAQs/AddFaqs'
|
||||||
|
import EditFaqs from './views/FAQs/EditFaqs'
|
||||||
|
|
||||||
// DashBoard
|
// DashBoard
|
||||||
const Change_Password = React.lazy(() => import('./views/pages/register/Change_password'))
|
const Change_Password = React.lazy(() => import('./views/pages/register/Change_password'))
|
||||||
@ -104,6 +109,11 @@ const routes = [
|
|||||||
{ path: '/requirement/edit/:id', name: 'EditRequirement', component: EditRequirement },
|
{ path: '/requirement/edit/:id', name: 'EditRequirement', component: EditRequirement },
|
||||||
{ path: '/requirement/add/', name: 'AddRequirement', component: AddRequirement },
|
{ path: '/requirement/add/', name: 'AddRequirement', component: AddRequirement },
|
||||||
{ path: '/requirement', name: 'Requirement', component: Requirement },
|
{ path: '/requirement', name: 'Requirement', component: Requirement },
|
||||||
|
//FAQs
|
||||||
|
{ path: '/FAQs/view/:id', name: 'ViewFaqs', component: ViewFaqs },
|
||||||
|
{ path: '/FAQs/edit/:id', name: 'EditFaqs', component: EditFaqs },
|
||||||
|
{ path: '/FAQs/add/', name: 'AddFaqs', component: AddFaqs },
|
||||||
|
{ path: '/FAQs', name: 'Faqs', component: Faqs },
|
||||||
|
|
||||||
//Users
|
//Users
|
||||||
{ path: '/users/view/:id', name: 'ViewUsers', component: ViewUsers },
|
{ path: '/users/view/:id', name: 'ViewUsers', component: ViewUsers },
|
||||||
|
|||||||
163
src/views/FAQs/AddFaqs.js
Normal file
163
src/views/FAQs/AddFaqs.js
Normal file
@ -0,0 +1,163 @@
|
|||||||
|
import axios from "axios";
|
||||||
|
import React, { useCallback, useEffect, useState } from "react";
|
||||||
|
import { API } from "../../data";
|
||||||
|
import { isAutheticated } from "../../auth";
|
||||||
|
import ClipLoader from "react-spinners/ClipLoader";
|
||||||
|
import { useHistory } from "react-router-dom";
|
||||||
|
import swal from 'sweetalert';
|
||||||
|
|
||||||
|
import {
|
||||||
|
CButton,
|
||||||
|
CCard,
|
||||||
|
CCardBody,
|
||||||
|
CCol,
|
||||||
|
CContainer,
|
||||||
|
CForm,
|
||||||
|
CFormInput,
|
||||||
|
CInputGroup,
|
||||||
|
CInputGroupText,
|
||||||
|
CRow,
|
||||||
|
} from '@coreui/react'
|
||||||
|
import CIcon from '@coreui/icons-react'
|
||||||
|
import { cilPencil, cilSettings, cilLockLocked, cilUser, cilNoteAdd } from '@coreui/icons'
|
||||||
|
const AddFaqs = () => {
|
||||||
|
const token = isAutheticated();
|
||||||
|
let history = useHistory();
|
||||||
|
// const [image, setImage] = useState("");
|
||||||
|
const [topic, setTopic] = useState("");
|
||||||
|
const [description, setDescription] = useState("");
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
|
||||||
|
const handleSubmit = async () => {
|
||||||
|
if (!(topic && description)) {
|
||||||
|
alert("Please fill All required field ");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const myForm = new FormData();
|
||||||
|
|
||||||
|
myForm.set("topic", topic);
|
||||||
|
myForm.set("description", description);
|
||||||
|
// myForm.set("image", image);
|
||||||
|
setLoading({ loading: true });
|
||||||
|
// console.log(image)
|
||||||
|
try {
|
||||||
|
let res = await axios.post(
|
||||||
|
`/api/faqs/create/`, myForm,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
"Content-Type": 'multipart/form-data',
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
console.log(res.data)
|
||||||
|
if (res.data) {
|
||||||
|
swal("success!", "FAQs Added Successfully!", "success");
|
||||||
|
setLoading(false);
|
||||||
|
history.goBack();
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
alert(error)
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
};
|
||||||
|
// const handleImage = (e) => {
|
||||||
|
// const files = e.target.files[0];
|
||||||
|
// // console.log(files)
|
||||||
|
// setImage(files);
|
||||||
|
|
||||||
|
// };
|
||||||
|
//
|
||||||
|
const onCancel = () => {
|
||||||
|
// window.location = "/comproducts";
|
||||||
|
history.goBack()
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="bg-light min-vh-70 d-flex flex-row ">
|
||||||
|
<CContainer>
|
||||||
|
<CRow className="align-left w-140">
|
||||||
|
<CCol md={19} lg={27} xl={16}>
|
||||||
|
<CCard className="mx-4">
|
||||||
|
<CCardBody className="p-4">
|
||||||
|
<CForm>
|
||||||
|
<h3 className="mb-4 justify-content-center">Add FAQs</h3>
|
||||||
|
<div>
|
||||||
|
<div>
|
||||||
|
<CInputGroup className="mb-3">
|
||||||
|
<CInputGroupText>
|
||||||
|
<CIcon icon={cilPencil} />
|
||||||
|
</CInputGroupText>
|
||||||
|
<CFormInput type="text"
|
||||||
|
maxlength='50'
|
||||||
|
required
|
||||||
|
onChange={(e) => setTopic(e.target.value)}
|
||||||
|
value={topic}
|
||||||
|
placeholder="Topic ( maximum 50 character )" />
|
||||||
|
</CInputGroup>
|
||||||
|
<CInputGroup className="mb-3">
|
||||||
|
|
||||||
|
<label htmlFor="exampleFormControlTextarea1" className="form-label">Description*</label>
|
||||||
|
<textarea
|
||||||
|
className="h-50 w-100"
|
||||||
|
maxlength='500'
|
||||||
|
required
|
||||||
|
onChange={(e) => setDescription(e.target.value)}
|
||||||
|
value={description}
|
||||||
|
rows="5"
|
||||||
|
placeholder="Description ( maximum 500 character )">ewf3g</textarea>
|
||||||
|
</CInputGroup>
|
||||||
|
|
||||||
|
{/* <CInputGroup className="mb-3">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<CFormInput
|
||||||
|
type="file"
|
||||||
|
placeholder="image"
|
||||||
|
accept="image/*"
|
||||||
|
required
|
||||||
|
onChange={handleImage}
|
||||||
|
|
||||||
|
|
||||||
|
/>
|
||||||
|
</CInputGroup> */}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className=" d-flex">
|
||||||
|
<button
|
||||||
|
onClick={handleSubmit}
|
||||||
|
type="button"
|
||||||
|
className="btn btn-success btn-login waves-effect waves-light"
|
||||||
|
>
|
||||||
|
<ClipLoader loading={loading} size={18} />
|
||||||
|
{!loading && "Save"}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={onCancel}
|
||||||
|
type="button"
|
||||||
|
className=" ml-2 btn btn-warning btn-cancel waves-effect waves-light"
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CForm>
|
||||||
|
</CCardBody>
|
||||||
|
</CCard>
|
||||||
|
</CCol>
|
||||||
|
</CRow>
|
||||||
|
</CContainer>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AddFaqs
|
||||||
175
src/views/FAQs/EditFaqs.js
Normal file
175
src/views/FAQs/EditFaqs.js
Normal file
@ -0,0 +1,175 @@
|
|||||||
|
import axios from "axios";
|
||||||
|
import React, { useCallback, useEffect, useState } from "react";
|
||||||
|
import { API } from "../../data";
|
||||||
|
import { isAutheticated } from "../../auth";
|
||||||
|
import ClipLoader from "react-spinners/ClipLoader";
|
||||||
|
import { useHistory, useParams } from "react-router-dom";
|
||||||
|
import swal from 'sweetalert';
|
||||||
|
|
||||||
|
import {
|
||||||
|
CButton,
|
||||||
|
CCard,
|
||||||
|
CCardBody,
|
||||||
|
CCol,
|
||||||
|
CContainer,
|
||||||
|
CForm,
|
||||||
|
CFormInput,
|
||||||
|
CInputGroup,
|
||||||
|
CInputGroupText,
|
||||||
|
CRow,
|
||||||
|
} from '@coreui/react'
|
||||||
|
import CIcon from '@coreui/icons-react'
|
||||||
|
import { cilPencil, cilSettings, cilLockLocked, cilUser, cilNoteAdd } from '@coreui/icons'
|
||||||
|
const EditFaqs = () => {
|
||||||
|
const { id } = useParams()
|
||||||
|
const token = isAutheticated();
|
||||||
|
let history = useHistory();
|
||||||
|
// const [image, setImage] = useState("");
|
||||||
|
const [topic, setTopic] = useState("");
|
||||||
|
const [description, setDescription] = useState("");
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
//fetch one image
|
||||||
|
useEffect(async () => {
|
||||||
|
const res = await axios.get(`/api/faqs/getOne/${id}`, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
setTopic(res.data.Faqs.topic)
|
||||||
|
setDescription(res.data.Faqs.description)
|
||||||
|
|
||||||
|
}, [id]);
|
||||||
|
const handleSubmit = async () => {
|
||||||
|
if (!(topic && description)) {
|
||||||
|
alert("Please fill All required field ");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const myForm = new FormData();
|
||||||
|
|
||||||
|
myForm.set("topic", topic);
|
||||||
|
myForm.set("description", description);
|
||||||
|
// myForm.set("image", image);
|
||||||
|
setLoading({ loading: true });
|
||||||
|
// console.log(image)
|
||||||
|
try {
|
||||||
|
let res = await axios.put(
|
||||||
|
`/api/faqs/update/${id}`, myForm,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
"Content-Type": 'multipart/form-data',
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
console.log(res.data)
|
||||||
|
if (res.data) {
|
||||||
|
swal("success!", "FAQs Edit Successfully!", "success");
|
||||||
|
setLoading(false);
|
||||||
|
history.goBack();
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
alert(error)
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
};
|
||||||
|
// const handleImage = (e) => {
|
||||||
|
// const files = e.target.files[0];
|
||||||
|
// // console.log(files)
|
||||||
|
// setImage(files);
|
||||||
|
|
||||||
|
// };
|
||||||
|
//
|
||||||
|
const onCancel = () => {
|
||||||
|
// window.location = "/comproducts";
|
||||||
|
|
||||||
|
history.goBack()
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="bg-light min-vh-70 d-flex flex-row ">
|
||||||
|
<CContainer>
|
||||||
|
<CRow className="align-left w-140">
|
||||||
|
<CCol md={19} lg={27} xl={16}>
|
||||||
|
<CCard className="mx-4">
|
||||||
|
<CCardBody className="p-4">
|
||||||
|
<CForm>
|
||||||
|
<h3 className="mb-4 justify-content-center">Edit FAQs</h3>
|
||||||
|
<div>
|
||||||
|
<div>
|
||||||
|
<CInputGroup className="mb-3">
|
||||||
|
<CInputGroupText>
|
||||||
|
<CIcon icon={cilPencil} />
|
||||||
|
</CInputGroupText>
|
||||||
|
<CFormInput type="text"
|
||||||
|
maxlength='50'
|
||||||
|
required
|
||||||
|
onChange={(e) => setTopic(e.target.value)}
|
||||||
|
value={topic}
|
||||||
|
placeholder="Topic ( maximum 50 character )" />
|
||||||
|
</CInputGroup>
|
||||||
|
<CInputGroup className="mb-3 d-flex">
|
||||||
|
|
||||||
|
<label htmlFor="exampleFormControlTextarea1" className="form-label">Description*</label>
|
||||||
|
<textarea
|
||||||
|
className="h-50 w-100"
|
||||||
|
maxlength='500'
|
||||||
|
required
|
||||||
|
onChange={(e) => setDescription(e.target.value)}
|
||||||
|
value={description}
|
||||||
|
rows="5"
|
||||||
|
placeholder="Description ( maximum 500 character )">ewf3g</textarea>
|
||||||
|
</CInputGroup>
|
||||||
|
|
||||||
|
{/* <CInputGroup className="mb-3">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<CFormInput
|
||||||
|
type="file"
|
||||||
|
placeholder="image"
|
||||||
|
accept="image/*"
|
||||||
|
required
|
||||||
|
onChange={handleImage}
|
||||||
|
|
||||||
|
|
||||||
|
/>
|
||||||
|
</CInputGroup> */}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className=" d-flex">
|
||||||
|
<button
|
||||||
|
onClick={handleSubmit}
|
||||||
|
type="button"
|
||||||
|
className="btn btn-success btn-login waves-effect waves-light"
|
||||||
|
>
|
||||||
|
<ClipLoader loading={loading} size={18} />
|
||||||
|
{!loading && "Save"}
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={onCancel}
|
||||||
|
type="button"
|
||||||
|
className=" ml-2 btn btn-warning btn-cancel waves-effect waves-light"
|
||||||
|
>
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CForm>
|
||||||
|
</CCardBody>
|
||||||
|
</CCard>
|
||||||
|
</CCol>
|
||||||
|
</CRow>
|
||||||
|
</CContainer>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default EditFaqs
|
||||||
164
src/views/FAQs/Faqs.js
Normal file
164
src/views/FAQs/Faqs.js
Normal file
@ -0,0 +1,164 @@
|
|||||||
|
|
||||||
|
import axios from "axios";
|
||||||
|
import React, { useEffect, useState, useCallback, useMemo } from "react";
|
||||||
|
import { Link } from "react-router-dom";
|
||||||
|
import swal from 'sweetalert';
|
||||||
|
// import { API } from "../../data";
|
||||||
|
import { isAutheticated } from "../../auth";
|
||||||
|
|
||||||
|
function Faqs() {
|
||||||
|
const [faqs, setFeqs] = useState([])
|
||||||
|
|
||||||
|
const token = isAutheticated();
|
||||||
|
|
||||||
|
const getfaqs = useCallback(async () => {
|
||||||
|
let res = await axios.get(
|
||||||
|
`/api/faqs/getAll`,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
// console.log(res.data)
|
||||||
|
setFeqs(res.data.Faqs)
|
||||||
|
|
||||||
|
|
||||||
|
}, [token]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
getfaqs();
|
||||||
|
}, [getfaqs]);
|
||||||
|
|
||||||
|
|
||||||
|
const handleDelete = async (id) => {
|
||||||
|
let status = window.confirm("Do you want to delete");
|
||||||
|
if (!status) return;
|
||||||
|
|
||||||
|
let res = await axios.delete(`/api/faqs/delete/${id}`, {
|
||||||
|
headers: {
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
// console.log(res)
|
||||||
|
if (res.data.success == true) {
|
||||||
|
swal("success!", "FAQs Deleted Successfully!", "success");
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
//change time formate
|
||||||
|
function formatAMPM(date) {
|
||||||
|
var hours = new Date(date).getHours();
|
||||||
|
var minutes = new Date(date).getMinutes();
|
||||||
|
var ampm = hours >= 12 ? 'PM' : 'AM';
|
||||||
|
hours = hours % 12;
|
||||||
|
hours = hours ? hours : 12; // the hour '0' should be '12'
|
||||||
|
minutes = minutes < 10 ? '0' + minutes : minutes;
|
||||||
|
var strTime = hours + ':' + minutes + ' ' + ampm;
|
||||||
|
return strTime;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className=" main-content">
|
||||||
|
<div className=" my-3 page-content">
|
||||||
|
<div className="container-fluid">
|
||||||
|
{/* <!-- start page title --> */}
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-12">
|
||||||
|
<div className="page-title-box d-flex align-items-center justify-content-between">
|
||||||
|
<h4 className="mb-3">CMP-FAQs</h4>
|
||||||
|
<Link to="/FAQs/add/"><button type="button" className="btn btn-info float-end mb-3 ml-4"> + Add New FAQ</button></Link>
|
||||||
|
{/* <div className="page-title-right">
|
||||||
|
<ol className="breadcrumb m-0">
|
||||||
|
<li className="breadcrumb-item">
|
||||||
|
<Link to="/dashboard">CMD-App</Link>
|
||||||
|
</li>
|
||||||
|
<li className="breadcrumb-item">CMD-Category</li>
|
||||||
|
</ol>
|
||||||
|
</div> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* <!-- end page title --> */}
|
||||||
|
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-12">
|
||||||
|
<div className="card">
|
||||||
|
<div className="card-body">
|
||||||
|
<div className="row ml-0 mr-0 mb-10">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div className="table-responsive table-shoot">
|
||||||
|
<table className="table table-centered table-nowrap mb-0">
|
||||||
|
<thead className="thead-light">
|
||||||
|
<tr>
|
||||||
|
<th>Topic</th>
|
||||||
|
{/* <th>Image</th> */}
|
||||||
|
<th>Added On</th>
|
||||||
|
<th>Action</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{faqs && faqs.map((item, index) =>
|
||||||
|
<tr>
|
||||||
|
<td>{item?.topic}</td>
|
||||||
|
{/* <td>
|
||||||
|
<img src={`${item?.image.url}`} width="50" alt="" /></td> */}
|
||||||
|
<td>
|
||||||
|
{/* {item?.addedOn} */}
|
||||||
|
{new Date(`${item?.createdAt}`).toDateString()}<span> , {`${formatAMPM(item?.createdAt)}`}</span>
|
||||||
|
|
||||||
|
</td>
|
||||||
|
|
||||||
|
|
||||||
|
<td>
|
||||||
|
<Link to={`/FAQs/view/${item._id}`}>
|
||||||
|
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className=" mx-1 mt-1 btn btn-info btn-sm waves-effect waves-light btn-table ml-2"
|
||||||
|
>
|
||||||
|
View
|
||||||
|
</button>
|
||||||
|
</Link>
|
||||||
|
<Link to={`/FAQs/edit/${item._id}`}>
|
||||||
|
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className=" mx-1 mt-1 btn btn-primary btn-sm waves-effect waves-light btn-table ml-2"
|
||||||
|
>
|
||||||
|
Edit
|
||||||
|
</button>
|
||||||
|
</Link>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={() => handleDelete(`${item._id}`)}
|
||||||
|
className="mx-1 mt-1 btn btn-danger btn-sm waves-effect waves-light btn-table ml-2"
|
||||||
|
id="sa-params"
|
||||||
|
>
|
||||||
|
Delete
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
)}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{/* <!-- end table-responsive --> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* <!-- container-fluid --> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Faqs;
|
||||||
132
src/views/FAQs/ViewFaqs.js
Normal file
132
src/views/FAQs/ViewFaqs.js
Normal file
@ -0,0 +1,132 @@
|
|||||||
|
|
||||||
|
import axios from "axios";
|
||||||
|
import React, { useEffect, useState, useCallback, useMemo } from "react";
|
||||||
|
import swal from 'sweetalert';
|
||||||
|
// import { API } from "../../data";
|
||||||
|
import { Link, useParams } from "react-router-dom";
|
||||||
|
import { isAutheticated } from "../../auth";
|
||||||
|
|
||||||
|
function ViewFaqs() {
|
||||||
|
const [faqs, setFaqs] = useState([])
|
||||||
|
const { id } = useParams();
|
||||||
|
// console.log(id)
|
||||||
|
const token = isAutheticated();
|
||||||
|
|
||||||
|
const getFaqs = useCallback(async () => {
|
||||||
|
let res = await axios.get(
|
||||||
|
`/api/faqs/getOne/${id}`,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
Authorization: `Bearer ${token}`,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
// console.log(res.data.news)
|
||||||
|
setFaqs(res.data.Faqs)
|
||||||
|
|
||||||
|
|
||||||
|
}, [token]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
getFaqs();
|
||||||
|
}, [getFaqs]);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//change time formate
|
||||||
|
function formatAMPM(date) {
|
||||||
|
var hours = new Date(date).getHours();
|
||||||
|
var minutes = new Date(date).getMinutes();
|
||||||
|
var ampm = hours >= 12 ? 'PM' : 'AM';
|
||||||
|
hours = hours % 12;
|
||||||
|
hours = hours ? hours : 12; // the hour '0' should be '12'
|
||||||
|
minutes = minutes < 10 ? '0' + minutes : minutes;
|
||||||
|
var strTime = hours + ':' + minutes + ' ' + ampm;
|
||||||
|
return strTime;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className=" main-content">
|
||||||
|
<div className=" my-3 page-content">
|
||||||
|
<div className="container-fluid">
|
||||||
|
{/* <!-- start page title --> */}
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-12">
|
||||||
|
<div className="page-title-box d-flex align-items-center justify-content-between">
|
||||||
|
<h4 className="mb-3">CMP-FAQs</h4>
|
||||||
|
<Link to="/FAQs/add/"><button type="button" className="btn btn-info float-end mb-3 ml-4"> + Add FAQs</button></Link>
|
||||||
|
{/* <div className="page-title-right">
|
||||||
|
<ol className="breadcrumb m-0">
|
||||||
|
<li className="breadcrumb-item">
|
||||||
|
<Link to="/dashboard">CMD-App</Link>
|
||||||
|
</li>
|
||||||
|
<li className="breadcrumb-item">CMD-Category</li>
|
||||||
|
</ol>
|
||||||
|
</div> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* <!-- end page title --> */}
|
||||||
|
|
||||||
|
<div className="row">
|
||||||
|
<div className="col-lg-12">
|
||||||
|
<div className="card">
|
||||||
|
<div className="card-body">
|
||||||
|
<div className="row ml-0 mr-0 mb-10">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div className="table-responsive table-shoot">
|
||||||
|
<table className="table table-centered table-nowrap mb-0">
|
||||||
|
<thead className="thead-light">
|
||||||
|
<tr>
|
||||||
|
<th>Id</th>
|
||||||
|
<td>{faqs?._id}</td>
|
||||||
|
</tr>
|
||||||
|
<tr><th>TOPIC</th>
|
||||||
|
<td>{faqs?.topic}</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
{/* <tr> <th>Image</th>
|
||||||
|
<td>
|
||||||
|
<img src={`${faqs.image?.url}`} width="50" alt="" />
|
||||||
|
</td>
|
||||||
|
</tr> */}
|
||||||
|
|
||||||
|
<tr> <th>Description</th>
|
||||||
|
<td>{faqs?.description}</td>
|
||||||
|
</tr>
|
||||||
|
<tr><th>Added On</th>
|
||||||
|
<td>
|
||||||
|
{new Date(`${faqs?.createdAt}`).toDateString()}<span> , {`${formatAMPM(faqs?.createdAt)}`}</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr> <th>Updated At</th>
|
||||||
|
<td>
|
||||||
|
{new Date(`${faqs?.updatedAt}`).toDateString()}<span> , {`${formatAMPM(faqs?.updatedAt)}`}</span>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{/* <!-- end table-responsive --> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* <!-- container-fluid --> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ViewFaqs;
|
||||||
Loading…
Reference in New Issue
Block a user