Change PaymentFailed to Failed and improve order state display

Co-authored-by: hsluoyz <3787410+hsluoyz@users.noreply.github.com>

object/payment.go

@@ -303,7 +303,7 @@ func NotifyPayment(body []byte, owner string, paymentName string, lang string) (
 		order.Message = "Payment successful"
 		order.UpdateTime = util.GetCurrentTime()
 	} else if payment.State == pp.PaymentStateError {
-		order.State = "PaymentFailed"
+		order.State = "Failed"
 		order.Message = payment.Message
 		order.UpdateTime = util.GetCurrentTime()
 	} else if payment.State == pp.PaymentStateCanceled {

web/src/OrderListPage.js

@@ -236,6 +236,13 @@ class OrderListPage extends BaseListPage {
         width: "120px",
         sorter: true,
         ...this.getColumnSearchProps("state"),
+        render: (text, record, index) => {
+          return (
+            <Tooltip title={record.message || ""}>
+              <span>{text}</span>
+            </Tooltip>
+          );
+        },
       },
       {
         title: i18next.t("general:Action"),
@@ -248,7 +255,7 @@ class OrderListPage extends BaseListPage {
           return (
             <div style={{display: "flex", flexWrap: "wrap", gap: "8px"}}>
               <Button onClick={() => this.props.history.push(`/orders/${record.owner}/${record.name}/pay`)}>
-                {record.state === "Created" ? i18next.t("order:Pay") : i18next.t("general:Detail")}
+                {(record.state === "Created" || record.state === "Failed") ? i18next.t("order:Pay") : i18next.t("general:Detail")}
               </Button>
               <Button danger onClick={() => this.cancelOrder(record)} disabled={record.state !== "Created" || !isAdmin}>
                 {i18next.t("general:Cancel")}

web/src/OrderPayPage.js

@@ -272,7 +272,7 @@ class OrderPayPage extends React.Component {
     const updateTimeMap = {
       Paid: i18next.t("order:Payment time"),
       Canceled: i18next.t("order:Cancel time"),
-      PaymentFailed: i18next.t("order:Payment failed time"),
+      Failed: i18next.t("order:Payment failed time"),
       Timeout: i18next.t("order:Timeout time"),
     };
     const updateTimeLabel = updateTimeMap[state] || i18next.t("general:Updated time");