|
|
@ -1,7 +1,7 @@ |
|
|
|
import React, { useEffect } from "react"; |
|
|
|
import React, { useEffect } from "react"; |
|
|
|
import Book from "./components/Book"; |
|
|
|
import Book from "./components/Book"; |
|
|
|
import { connect } from "react-redux"; |
|
|
|
import { connect } from "react-redux"; |
|
|
|
import {publicApi} from '../../redux/actions'; |
|
|
|
import { publicApi } from "../../redux/actions"; |
|
|
|
import b1Image from "./assets/b1.png"; |
|
|
|
import b1Image from "./assets/b1.png"; |
|
|
|
import _ from "lodash"; |
|
|
|
import _ from "lodash"; |
|
|
|
|
|
|
|
|
|
|
@ -13,10 +13,10 @@ const colors = { |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const status = { |
|
|
|
const status = { |
|
|
|
1: "در حال پردازش", |
|
|
|
1: window.t("در حال پردازش"), |
|
|
|
4: "درخواست رد شد", |
|
|
|
4: window.t("درخواست رد شد"), |
|
|
|
3: "تکمیل شد", |
|
|
|
3: window.t("تکمیل شد"), |
|
|
|
2: "ارسال شده", |
|
|
|
2: window.t("ارسال شده"), |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
@ -27,7 +27,7 @@ function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
<div className="px-4 flex flex-col py-5 lg:pt-24 lg:w-3/5 lg:mx-auto"> |
|
|
|
<div className="px-4 flex flex-col py-5 lg:pt-24 lg:w-3/5 lg:mx-auto"> |
|
|
|
<div className="flex flex-row w-full justify-between items-center p-3 bg-blueC0 bg-opacity-10 rounded-t-md dark:bg-blueC0 dark:bg-opacity-10"> |
|
|
|
<div className="flex flex-row w-full justify-between items-center p-3 bg-blueC0 bg-opacity-10 rounded-t-md dark:bg-blueC0 dark:bg-opacity-10"> |
|
|
|
<strong className="font-medium text-sm lg:text-tiny text-blue52 dark:text-white"> |
|
|
|
<strong className="font-medium text-sm lg:text-tiny text-blue52 dark:text-white"> |
|
|
|
{_.join(["شماره سفارش:", order.number], " ")} |
|
|
|
{_.join([window.t("شماره سفارش:"), order.number], " ")} |
|
|
|
</strong> |
|
|
|
</strong> |
|
|
|
<div className="flex flex-row items-center"> |
|
|
|
<div className="flex flex-row items-center"> |
|
|
|
<span className="text-xs lg:text-tiny font-light text-blue52 dark:text-white"> |
|
|
|
<span className="text-xs lg:text-tiny font-light text-blue52 dark:text-white"> |
|
|
@ -40,20 +40,26 @@ function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-row items-center py-4 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="w-full flex flex-row items-center py-4 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">آدرس تحویل:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("آدرس تحویل:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{order.address} |
|
|
|
{order.address} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-row justify-between py-0 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="w-full flex flex-row justify-between py-0 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">مشخصات تحویل گیرنده:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("مشخصات تحویل گیرنده:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{order.name} |
|
|
|
{order.name} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">شماره موبایل:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("شماره موبایل:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{order.cellphone} |
|
|
|
{order.cellphone} |
|
|
|
</span> |
|
|
|
</span> |
|
|
@ -61,10 +67,12 @@ function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full rounded-md flex flex-col p-4 mt-2 bg-blueC0 bg-opacity-10 dark:bg-blueC0 dark:bg-opacity-20 dark:border-blueC0 dark:border dark:border-solid"> |
|
|
|
<div className="w-full rounded-md flex flex-col p-4 mt-2 bg-blueC0 bg-opacity-10 dark:bg-blueC0 dark:bg-opacity-20 dark:border-blueC0 dark:border dark:border-solid"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{_.join(["کد تحویل", order.receiveCode], " ")} |
|
|
|
{_.join([window.t("کد تحویل:"), order.receiveCode], " ")} |
|
|
|
</strong> |
|
|
|
</strong> |
|
|
|
<p className="font-light text-right mt-3 text-xs lg:text-sm text-green4F dark:text-white"> |
|
|
|
<p className="font-light text-right mt-3 text-xs lg:text-sm text-green4F dark:text-white"> |
|
|
|
این کد را پس از دریافت کالا، به مامور ارسال دانوین اعلام فرمایید |
|
|
|
{window.t( |
|
|
|
|
|
|
|
"این کد را پس از دریافت کالا، به مامور ارسال دانوین اعلام فرمایید" |
|
|
|
|
|
|
|
)} |
|
|
|
</p> |
|
|
|
</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-col"> |
|
|
|
<div className="w-full flex flex-col"> |
|
|
@ -74,41 +82,54 @@ function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-row justify-between py-2 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="w-full flex flex-row justify-between py-2 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">مبلغ سبد خرید:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("مبلغ سبد خرید:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{_.join([order.shoppingCardPrice, "تومان"], " ")} |
|
|
|
{_.join([order.shoppingCardPrice, window.t("تومان")], " ")} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">تخفیف:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("تخفیف:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{_.join([order.discountPrice, "تومان"], " ")} |
|
|
|
{_.join([order.discountPrice, window.t("تومان")], " ")} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-row justify-between py-2 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="w-full flex flex-row justify-between py-2 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> هزینه ارسال کالا:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("هزینه ارسال کالا:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{_.join([order.sendPrice, "تومان"], " ")} |
|
|
|
{_.join([order.sendPrice, window.t("تومان")], " ")} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="flex flex-row py-4 border"> |
|
|
|
<div className="flex flex-row py-4 border"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">جمع هزینه پرداختی:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("جمع هزینه پرداختی:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{_.join([order.totalPrice, "تومان"], " ")} |
|
|
|
{_.join([order.totalPrice, window.t("تومان")], " ")} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-row justify-between py-2 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="w-full flex flex-row justify-between py-2 border-b border-solid border-blueFF1 dark:border-gray45"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">نحوه پرداخت:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("نحوه پرداخت:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{order.payMethod} |
|
|
|
{order.payMethod} |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<div className="flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> شماره تراکنش:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{" "} |
|
|
|
|
|
|
|
{window.t("شماره تراکنش:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{order.transactionNumber} |
|
|
|
{order.transactionNumber} |
|
|
|
</span> |
|
|
|
</span> |
|
|
@ -116,7 +137,9 @@ function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="w-full flex flex-row justify-between py-2"> |
|
|
|
<div className="w-full flex flex-row justify-between py-2"> |
|
|
|
<div className="w-full flex flex-row py-4"> |
|
|
|
<div className="w-full flex flex-row py-4"> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white">تاریخ تحویل:</strong> |
|
|
|
<strong className="text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
|
|
|
|
{window.t("تاریخ تحویل:")} |
|
|
|
|
|
|
|
</strong> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
<span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white"> |
|
|
|
{order.date} |
|
|
|
{order.date} |
|
|
|
</span> |
|
|
|
</span> |
|
|
@ -126,13 +149,11 @@ function OrderDetails({ order, setHeaderOptions, headerOptions }) { |
|
|
|
); |
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const mapStateToProps = (state) => ({ |
|
|
|
const mapStateToProps = (state) => ({}); |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const mapDispatchToProps = { |
|
|
|
const mapDispatchToProps = { |
|
|
|
setHeaderOptions: publicApi.setHeaderOptions, |
|
|
|
setHeaderOptions: publicApi.setHeaderOptions, |
|
|
|
} |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(OrderDetails); |
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(OrderDetails); |
|
|
|
|
|
|
|
|
|
|
@ -144,15 +165,16 @@ OrderDetails.defaultProps = { |
|
|
|
items: [b1Image, b1Image], |
|
|
|
items: [b1Image, b1Image], |
|
|
|
date: "1400/1/11", |
|
|
|
date: "1400/1/11", |
|
|
|
cost: "1.240.000", |
|
|
|
cost: "1.240.000", |
|
|
|
address: |
|
|
|
address: window.t( |
|
|
|
"تهران خیابان انقلاب حدفاصل ابوریحان و فلسطین بن بست سروش پلاک 2 واحد 12 شرقی", |
|
|
|
"تهران خیابان انقلاب حدفاصل ابوریحان و فلسطین بن بست سروش پلاک 2 واحد 12 شرقی" |
|
|
|
name: "هومن عابدی", |
|
|
|
), |
|
|
|
|
|
|
|
name: window.t("هومن عابدی"), |
|
|
|
cellphone: "09121234568", |
|
|
|
cellphone: "09121234568", |
|
|
|
shoppingCardPrice: "981.000", |
|
|
|
shoppingCardPrice: "981.000", |
|
|
|
discountPrice: "12.000", |
|
|
|
discountPrice: "12.000", |
|
|
|
sendPrice: "18.000", |
|
|
|
sendPrice: "18.000", |
|
|
|
totalPrice: "18.000", |
|
|
|
totalPrice: "18.000", |
|
|
|
payMethod: "حضوری", |
|
|
|
payMethod: window.t("حضوری"), |
|
|
|
transactionNumber: " BS3194DNB98312", |
|
|
|
transactionNumber: " BS3194DNB98312", |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
}; |
|
|
|