fix: remove expired status from profile filter, show order code
- Drop the now-unused "expired" filter option/status (the API never returns expired services anymore). - Show the order code next to each service in the config card and in the service details modal. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KMLvfLviDB12t4U9UijE4k
This commit is contained in:
@@ -1,7 +1,6 @@
|
|||||||
import {
|
import {
|
||||||
IoAppsOutline,
|
IoAppsOutline,
|
||||||
IoCheckmarkCircle,
|
IoCheckmarkCircle,
|
||||||
IoCloseCircle,
|
|
||||||
IoTimeOutline,
|
IoTimeOutline,
|
||||||
} from "react-icons/io5";
|
} from "react-icons/io5";
|
||||||
import { Config } from "../../../../types/props";
|
import { Config } from "../../../../types/props";
|
||||||
@@ -20,11 +19,6 @@ const STATUS_META: Record<
|
|||||||
icon: <IoCheckmarkCircle />,
|
icon: <IoCheckmarkCircle />,
|
||||||
activeClass: "!bg-green-600 !text-white",
|
activeClass: "!bg-green-600 !text-white",
|
||||||
},
|
},
|
||||||
expired: {
|
|
||||||
label: "منقضی شده",
|
|
||||||
icon: <IoCloseCircle />,
|
|
||||||
activeClass: "!bg-rose-600 !text-white",
|
|
||||||
},
|
|
||||||
pending: {
|
pending: {
|
||||||
label: "در انتظار ثبت",
|
label: "در انتظار ثبت",
|
||||||
icon: <IoTimeOutline />,
|
icon: <IoTimeOutline />,
|
||||||
|
|||||||
@@ -114,6 +114,7 @@ const ConfigItem = ({
|
|||||||
isOpen={isOpen}
|
isOpen={isOpen}
|
||||||
setIsOpen={setIsOpen}
|
setIsOpen={setIsOpen}
|
||||||
dateBuy={dateBuy}
|
dateBuy={dateBuy}
|
||||||
|
orderId={orderId}
|
||||||
isDisabled={isDisabled}
|
isDisabled={isDisabled}
|
||||||
nameConfig={configName}
|
nameConfig={configName}
|
||||||
isShowTraffic={isShowTraffic}
|
isShowTraffic={isShowTraffic}
|
||||||
@@ -166,9 +167,19 @@ const ConfigItem = ({
|
|||||||
className={`w-full h-full p-3 rounded-md text-xs md:text-base gap-2 flex justify-between items-center flex-wrap text-secondTheme bg-gray-900 shadow-md shadow-gray-900 ${isDisabled ? "filter blur-sm" : ""
|
className={`w-full h-full p-3 rounded-md text-xs md:text-base gap-2 flex justify-between items-center flex-wrap text-secondTheme bg-gray-900 shadow-md shadow-gray-900 ${isDisabled ? "filter blur-sm" : ""
|
||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
<p className="max-md:hidden">تاریخ خرید : {dateBuy}</p>
|
<div className="max-md:hidden flex flex-col gap-0.5">
|
||||||
|
<p>تاریخ خرید : {dateBuy}</p>
|
||||||
|
{orderId && (
|
||||||
|
<p className="opacity-70 text-[11px]">کد سفارش : #{orderId}</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
<li className="px-2 py-1 max-[400px]:w-full max-[400px]:text-center bg-secondTheme shadow-md rounded-md w-auto h-auto text-gray-900 font-bold list-none">
|
<li className="px-2 py-1 max-[400px]:w-full max-[400px]:text-center bg-secondTheme shadow-md rounded-md w-auto h-auto text-gray-900 font-bold list-none">
|
||||||
{configName}
|
{configName}
|
||||||
|
{orderId && (
|
||||||
|
<span className="md:hidden block text-[10px] font-normal opacity-70 mt-0.5">
|
||||||
|
کد سفارش: #{orderId}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
</li>
|
</li>
|
||||||
<div className="max-md:hidden flex flex-row-reverse gap-2 justify-end items-center">
|
<div className="max-md:hidden flex flex-row-reverse gap-2 justify-end items-center">
|
||||||
{isDns ? (
|
{isDns ? (
|
||||||
|
|||||||
@@ -18,6 +18,7 @@ const ModalConfigDetails = ({
|
|||||||
setIsOpen,
|
setIsOpen,
|
||||||
isDisabled,
|
isDisabled,
|
||||||
dateBuy,
|
dateBuy,
|
||||||
|
orderId,
|
||||||
nameConfig,
|
nameConfig,
|
||||||
isShowTraffic,
|
isShowTraffic,
|
||||||
textCopy,
|
textCopy,
|
||||||
@@ -36,6 +37,7 @@ const ModalConfigDetails = ({
|
|||||||
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
||||||
isDisabled: boolean;
|
isDisabled: boolean;
|
||||||
dateBuy: string;
|
dateBuy: string;
|
||||||
|
orderId?: number;
|
||||||
nameConfig: string;
|
nameConfig: string;
|
||||||
isShowTraffic: boolean;
|
isShowTraffic: boolean;
|
||||||
textCopy: string;
|
textCopy: string;
|
||||||
@@ -86,6 +88,11 @@ const ModalConfigDetails = ({
|
|||||||
<div className="w-full h-full flex flex-col p-3 gap-4 border-2 border-gray-800 rounded-md max-sm:text-xs max-md:text-sm text-base">
|
<div className="w-full h-full flex flex-col p-3 gap-4 border-2 border-gray-800 rounded-md max-sm:text-xs max-md:text-sm text-base">
|
||||||
<h1 className="w-full h-full text-center rounded-md p-1 md:p-2 bg-gray-800">
|
<h1 className="w-full h-full text-center rounded-md p-1 md:p-2 bg-gray-800">
|
||||||
تاریخ خرید : {dateBuy}
|
تاریخ خرید : {dateBuy}
|
||||||
|
{orderId && (
|
||||||
|
<span className="block text-xs opacity-70 mt-1">
|
||||||
|
کد سفارش : #{orderId}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
</h1>
|
</h1>
|
||||||
<div className="w-full h-full flex flex-row-reverse gap-2 flex-wrap justify-center items-center">
|
<div className="w-full h-full flex flex-row-reverse gap-2 flex-wrap justify-center items-center">
|
||||||
{isDisabled || useMaxTraffic ? (
|
{isDisabled || useMaxTraffic ? (
|
||||||
|
|||||||
2
src/types/props.d.ts
vendored
2
src/types/props.d.ts
vendored
@@ -233,7 +233,7 @@ type Config = {
|
|||||||
username?: string | null;
|
username?: string | null;
|
||||||
category_id: number;
|
category_id: number;
|
||||||
is_expired: boolean;
|
is_expired: boolean;
|
||||||
status?: "active" | "expired" | "pending";
|
status?: "active" | "pending";
|
||||||
use_max_traffic: boolean;
|
use_max_traffic: boolean;
|
||||||
primary_ipv4?: string | null;
|
primary_ipv4?: string | null;
|
||||||
secondary_ipv4?: string | null;
|
secondary_ipv4?: string | null;
|
||||||
|
|||||||
Reference in New Issue
Block a user