Call Back Finished

main
Pedram Keshavarzi 3 years ago
parent 7dd731b34d
commit 6e81fdc016
  1. 3
      src/App.js
  2. 74
      src/components/CallBackForm/index.js
  3. 61
      src/utils/filter.js
  4. 13
      src/view/CallBack/index.js
  5. 3
      tailwind.config.js

@ -27,6 +27,7 @@ import store from './redux/store';
import ContactUs from './view/contact';
import ENTER_EXAM from './view/Exam/EnterExam/index'
import EXAM from './view/Exam'
import CallBack from './view/CallBack';
let data = [
@ -689,6 +690,8 @@ function App() {
showUserFullInfo={showUserFullInfo}
hideUserFullInfo={hideUserFullInfo}
/>} /> */}
<Route path='/callBack' element={<CallBack />} />
<Route path='/contacts' element={<ContactUs />} />
<Route exact path="/azmoon_list/enter_exam/:id" element={<ENTER_EXAM />}/>
<Route exact path="/dashboard/azmoon_list/exam/:id" element={<EXAM />} />

@ -0,0 +1,74 @@
import React from "react";
import { Link } from "react-router-dom";
const CallBackForm = ({
status,
price,
trackingCode
}) => {
return (
<div className="w-1/5 flex flex-col items-center rounded-lg border border-gray-200">
{
status ?
<div className="flex flex-col items-center py-4 border-b border-gray-200 w-full">
<div className="w-40 h-40 rounded-full flex items-center justify-center bg-greenE9 my-4">
<svg width="250" height="250" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7.75 12L10.58 14.83L16.25 9.17004" stroke="#039b2b" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
</svg>
</div>
<h1 className="text-lg text-red26 font-black">پرداخت شما با موفقیت انجام شد</h1>
</div> :
<div className="flex flex-col items-center py-4 border-b border-gray-200 w-full">
<div className="w-40 h-40 rounded-full flex items-center justify-center bg-pinkD6 my-4">
<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 15.044 15.044">
<g id="vuesax_linear_card-remove" data-name="vuesax/linear/card-remove" transform="translate(-252.46 -511.461)">
<g id="card-remove" transform="translate(253.309 512.31)">
<path id="Vector" d="M0,13.347,13.347,0" fill="none" stroke="#f51616" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.7" />
<path id="Vector-2" data-name="Vector" d="M13.347,13.347,0,0" fill="none" stroke="#f51616" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.7" />
</g>
</g>
</svg>
</div>
<h1 className="text-lg text-red26 font-black">متاسفانه پرداخت شما انجام نشد</h1>
</div>
}
<div className="w-full py-3 border-b border-gray-200 text-red26 font-bold">
مبلغ : {price} تومان
</div>
<div className="w-full py-3 border-b border-gray-200 text-red26 font-bold">
کد پیگیری : {trackingCode}
</div>
{
status ?
<div className="py-8">
<Link to={'/myServices'}
className="py-3 px-6 border rounded-md bg-red82OP border-red52 font-bold text-red52 text-sm hover:text-white hover:bg-red52 hover:shadow-md"
>
لیست خدمات من
</Link>
</div>
:
<div className="py-6 flex w-full justify-center">
<Link to={'/services'}
className="w-2/5 py-3 border rounded mr-2 bg-red82OP border-red52 font-bold text-red52 text-sm hover:text-white hover:bg-red52 hover:shadow-md"
>
بازگست به سبد خرید
</Link>
<Link to={'/services'}
className="w-2/5 py-3 border ml-2 rounded bg-green13 border-green13 font-bold text-white text-sm hover:shadow-md"
>
پرداخت مجدد
</Link>
</div>
}
</div>
)
}
export default CallBackForm;

@ -0,0 +1,61 @@
const grades = [
"پیش دبستان",
"اول",
"دوم",
"سوم",
"چهارم",
"پنجم",
"ششم",
"هفتم",
"هشتم",
"نهم",
"دهم",
"یازدهم",
"دوازدهم",
];
class filter {
productsPage = (products, options) => {
const { grade, subject, sort } = options;
if (grade.length > 0 || subject.length > 0 || sort) {
localStorage.setItem("filter", "ON");
}
let finalSort;
let byGradeFilter = [];
if (grade.length > 0) {
grade.map((item1) => {
for (let i = 0; i < products.length; i++) {
if (grades[products[i].gradeId] === item1) {
byGradeFilter.push(products[i]);
}
}
});
} else {
byGradeFilter = products;
}
let bySubjectFilter = [];
if (subject.length > 0) {
subject.map((item1) => {
for (let i = 0; i < byGradeFilter.length; i++) {
if (byGradeFilter[i].name === item1) {
bySubjectFilter.push(byGradeFilter[i]);
}
}
});
} else {
bySubjectFilter = byGradeFilter;
}
if (sort === "گران ترین") {
finalSort = bySubjectFilter.sort((item1, item2) => {
return item1.product[0].price - item2.product[0].price;
});
} else {
finalSort = bySubjectFilter;
}
};
}
const _filter = new filter();
export default _filter;

@ -0,0 +1,13 @@
import React from 'react';
import CallBackForm from '../../components/CallBackForm';
const CallBack = () => {
return(
<div className='flex items-center justify-center h-screen ' style={{width: '93.5%', marginTop: '8.5%;'}}>
<CallBackForm status={true} price={144000} trackingCode={133522485656326295}/>
</div>
);
};
export default CallBack;

@ -30,8 +30,11 @@ module.exports = {
grayEC: '#ececec',
red82OP: 'rgba(223, 20, 82, 0.08)',
pinkF5: '#fff1f5',
pinkD6 : '#ffd6d6',
black40: '#404040',
green17 : '#8daf17',
greenE9 : '#dcffe9',
green13: '#00ba13',
blue5F : '#05335f',
blue7E : '#15517e',
blueFF : '#f2f9ff',

Loading…
Cancel
Save