update 5 files

2 years ago · 35cde1c121
parent 23464e18e2
commit 35cde1c121
5 changed files with 128 additions and 118 deletions
--- a/src/redux/actions/userFactor.js
+++ b/src/redux/actions/userFactor.js
@ -27,6 +27,10 @@ const userFactor = {
    async (dispatch) =>
      await proxy.get("userFactor/fullList", data, { dispatch }),

+  selectOrder:
+    (data = {}) =>
+    (dispatch) =>
+      dispatch({ type: "userFactor/selectOrder", data }),
  //vod
  vodPayment:
    (data1 = {}, data2 = {}) =>
--- a/src/redux/reducers/userFactor.js
+++ b/src/redux/reducers/userFactor.js
@ -8,6 +8,7 @@ const initialState = {
  checkEmpty: false,
  isVerified: null,
  fullList: [],
+  selectedOrder: null,
 };

 export default function userFactor(state = initialState, action) {
@ -32,6 +33,13 @@ export default function userFactor(state = initialState, action) {
        fullList: data,
        error: null,
      };
+    case "userFactor/selectOrder":
+      return {
+        ...state,
+        loading: false,
+        selectedOrder: data,
+        error: null,
+      };
    case "userFactor/info":
      return { ...state, loading: false, info: data, error: null };
    case "userFactor/add":
--- a/src/views/Order/components/Book.js
+++ b/src/views/Order/components/Book.js
@ -1,35 +1,37 @@
 import React from "react";
-import _ from "lodash";
+import { connect } from "react-redux";

-export default function Book({ book }) {
+function Book({ book, grades }) {
  return (
    <div className="w-full flex justify-between py-3 border-b border-solid border-blueFF1 dark:border-gray45">
      <div className="flex items-center flex-1">
        <img
-          src={book}
-          className="rounded-md"
-          style={{ width: 60, height: 90 }}
+          src={`https://dnvn.ir/api/v1/file/${book?.product?.book.fileIds}`}
+          className="rounded-sm lg:w-24 object-cover"
        />
        <div className="flex flex-col mr-2">
          <strong className="text-xs text-blueC0 dark:text-white lg:text-tiny">
-            {window.t("علوم اجتماعی")}
+            {book?.product?.book?.name || " "}
          </strong>
          <span className="mt-4 text-xs lg:text-sm text-gray70 dark:text-greenBA">
-            {window.t("پایه دوم")}
-          </span>
-          <span className="mt-2 text-xs lg:text-sm text-gray70 dark:text-white">
-            {window.t("نسخه دیجیتال")}
+            {"پایه" + " " + grades[book?.product?.book?.gradeId]}
          </span>
        </div>
      </div>
      <div className="flex items-center">
        <span className="py-1 px-2 rounded-sm text-green4F2 text-sm lg:text-base bg-grayF9 dark:bg-gray-500 dark:text-white">
-          1
+          {book?.product?.count}
        </span>
        <div className="mr-3 text-blueC0 text-xs lg:text-base dark:text-white">
-          126.000 {window.t("تومان")}
+          {book?.product?.price + " " + "تومان"}
        </div>
      </div>
    </div>
  );
 }
+
+const mapStateToProps = (state) => ({
+  grades: state.publicApi.grades,
+});
+
+export default connect(mapStateToProps)(Book);
--- a/src/views/Order/index.js
+++ b/src/views/Order/index.js
@ -2,8 +2,10 @@ import React, { useEffect } from "react";
 import Book from "./components/Book";
 import { connect } from "react-redux";
 import { publicApi } from "../../redux/actions";
+import moment from "jalali-moment";
+
+//assets
 import b1Image from "./assets/b1.png";
-import _ from "lodash";

 const colors = {
  1: "#FFF700",
@ -29,49 +31,61 @@ function OrderDetails({ order, setHeaderOptions, headerOptions, isMobile }) {
  return (
    <div className="px-4 flex flex-col py-5 lg:w-4/5 lg:mx-auto">
      <div className="flex 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">
-          {_.join([window.t("شماره سفارش:"), order.number], " ")}
-        </strong>
-        <div className="flex items-center">
-          <span className="text-xs lg:text-tiny font-light text-blue52 dark:text-white">
-            {status[order.status]}
-          </span>
-          <div
-            className="h-4 w-4 rounded-full mr-2"
-            style={{ backgroundColor: colors[order.status] }}
-          ></div>
-        </div>
-      </div>
-      <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">
-          {window.t("آدرس تحویل")}:
-        </strong>
-        <span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white">
-          {order.address}
-        </span>
-      </div>
-      <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">
-          <strong className="text-xs lg:text-tiny text-green4F dark:text-white">
-            {window.t("مشخصات تحویل گیرنده:")}
+        {order?.transactionId ? (
+          <strong className="font-medium text-sm lg:text-tiny text-blue52 dark:text-white">
+            {"شماره سفارش:" + " " + order?.transactionId}
          </strong>
-          <span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white">
-            {order.name}
-          </span>
-        </div>
-        <div className="flex flex-row py-4">
+        ) : null}
+        {order?.condition ? (
+          <div className="flex items-center">
+            <span className="text-xs lg:text-tiny font-light text-blue52 dark:text-white">
+              {status[order?.condition]}
+            </span>
+            <div
+              className="h-4 w-4 rounded-full mr-2"
+              style={{ backgroundColor: colors[order?.condition] }}
+            ></div>
+          </div>
+        ) : null}
+      </div>
+      {order?.recieverAddress ? (
+        <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">
-            {window.t("شماره موبایل:")}
+            {window.t("آدرس تحویل")}:
          </strong>
          <span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white">
-            {order.cellphone}
+            {order?.recieverAddress}
          </span>
        </div>
+      ) : null}
+      <div className="w-full flex flex-row justify-between py-0 border-b border-solid border-blueFF1 dark:border-gray45">
+        {order?.recieverName ? (
+          <div className="flex flex-row py-4">
+            <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">
+              {order.recieverName}
+            </span>
+          </div>
+        ) : null}
+        {order?.recieverPhone ? (
+          <div className="flex flex-row py-4">
+            <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">
+              {order.recieverPhone}
+            </span>
+          </div>
+        ) : null}
      </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">
-        <strong className="text-xs lg:text-tiny text-green4F dark:text-white">
-          {_.join([window.t("کد تحویل:"), order.receiveCode], " ")}
-        </strong>
+        {order?.recieverPostalCode ? (
+          <strong className="text-xs lg:text-tiny text-green4F dark:text-white">
+            {"کد تحویل" + " " + order?.recieverPostalCode}
+          </strong>
+        ) : null}
        <p className="font-light text-right mt-3 text-xs lg:text-sm text-green4F dark:text-white">
          {window.t(
            "این کد را پس از دریافت کالا، به مامور ارسال دانوین اعلام فرمایید"
@ -79,62 +93,52 @@ function OrderDetails({ order, setHeaderOptions, headerOptions, isMobile }) {
        </p>
      </div>
      <div className="w-full flex flex-col">
-        {order.items.map((item, index) => (
-          <Book book={item} key={index} />
+        {order?.userProducts?.map((product, index) => (
+          <Book book={product} key={index} />
        ))}
      </div>
      <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">
-          <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">
-            {_.join([order.shoppingCardPrice, window.t("تومان")], " ")}
-          </span>
-        </div>
-        <div className="flex flex-row py-4">
-          <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">
-            {_.join([order.discountPrice, window.t("تومان")], " ")}
-          </span>
-        </div>
+        {order?.sumPrice ? (
+          <div className="flex flex-row py-4">
+            <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">
+              {order?.sumPrice + " " + "تومان"}
+            </span>
+          </div>
+        ) : null}
      </div>
      <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">
-          <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">
-            {_.join([order.sendPrice, window.t("تومان")], " ")}
-          </span>
-        </div>
-        <div className="flex flex-row py-4 border">
-          <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">
-            {_.join([order.totalPrice, window.t("تومان")], " ")}
-          </span>
-        </div>
+        {order?.transportPrice ? (
+          <div className="flex flex-row py-4">
+            <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">
+              {order?.transportPrice + " " + "تومان"}
+            </span>
+          </div>
+        ) : null}
+        {order?.payPrice ? (
+          <div className="flex flex-row py-4 border">
+            <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">
+              {order?.payPrice + " " + "تومان"}
+            </span>
+          </div>
+        ) : null}
      </div>
      <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">
-          <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">
-            {order.payMethod}
-          </span>
-        </div>
        <div className="flex flex-row py-4">
          <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">
-            {order.transactionNumber}
+            {order?.transactionId}
          </span>
        </div>
      </div>
@ -144,7 +148,7 @@ function OrderDetails({ order, setHeaderOptions, headerOptions, isMobile }) {
            {window.t("تاریخ تحویل:")}
          </strong>
          <span className="flex-1 font-light text-right mr-2 text-xs lg:text-tiny text-green4F dark:text-white">
-            {order.date}
+            {moment(order?.payedAt)?.format("jYYYY/jMM/jDD")}
          </span>
        </div>
      </div>
@ -154,6 +158,7 @@ function OrderDetails({ order, setHeaderOptions, headerOptions, isMobile }) {

 const mapStateToProps = (state) => ({
  isMobile: state.config.device === "mobile",
+  order: state.userFactor.selectedOrder
 });

 const mapDispatchToProps = {
@ -161,25 +166,3 @@ const mapDispatchToProps = {
 };

 export default connect(mapStateToProps, mapDispatchToProps)(OrderDetails);
-
-OrderDetails.defaultProps = {
-  order: {
-    number: "535353523653",
-    receiveCode: "300031",
-    status: 2,
-    items: [b1Image, b1Image],
-    date: "1400/1/11",
-    cost: "1.240.000",
-    address: window.t(
-      "تهران خیابان انقلاب حدفاصل ابوریحان و فلسطین بن بست سروش پلاک 2 واحد 12 شرقی"
-    ),
-    name: window.t("هومن عابدی"),
-    cellphone: "09121234568",
-    shoppingCardPrice: "981.000",
-    discountPrice: "12.000",
-    sendPrice: "18.000",
-    totalPrice: "18.000",
-    payMethod: window.t("حضوری"),
-    transactionNumber: " BS3194DNB98312",
-  },
-};
--- a/src/views/Orders/components/Order.js
+++ b/src/views/Orders/components/Order.js
@ -2,6 +2,7 @@ import React from "react";
 import { connect } from "react-redux";
 import { Link } from "react-router-dom";
 import moment from "jalali-moment";
+import { userFactor } from "../../../redux/actions";

 //assets
 import leftArrowIcon from "../../../assets/icons/dropdown-blue.svg";
@ -20,7 +21,7 @@ const status = {
  2: window.t("ارسال شده"),
 };

-function Order({ order, setDashboardPage, isDashboard }) {
+function Order({ order, setDashboardPage, isDashboard, selectOrder }) {
  return (
    <div className="w-full lg:w-2/3 flex flex-col rounded-md overflow-hidden my-3 border border-solid border-blueC0 border-opacity-50 dark:border-blueC0 dark:border-opacity-10">
      <div className="flex w-full justify-between items-center p-3 bg-blueC0 bg-opacity-10 dark:bg-blueC0 dark:bg-opacity-10">
@ -86,7 +87,15 @@ function Order({ order, setDashboardPage, isDashboard }) {
          <Link
            to={isDashboard ? "#" : "/orders/order"}
            className="rounded-md flex items-center lg:text-sm justify-center px-5 py-2.5 border border-solid border-blueC0 text-green4F bg-blueC0 bg-opacity-10"
-            onClick={() => (isDashboard ? setDashboardPage("order") : {})}
+            onClick={() => {
+              if (isDashboard) {
+                selectOrder(order);
+                setDashboardPage("order");
+              } else {
+                selectOrder(order);
+                return;
+              }
+            }}
          >
            {window.t("جزئیات سفارش")}
            <img
@ -112,4 +121,8 @@ const mapStateToProps = (state) => ({
  isMobile: state.config.device === "mobile",
 });

-export default connect(mapStateToProps)(Order);
+const mapDispatchToProps = {
+  selectOrder: userFactor.selectOrder,
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Order);