fix(ranking): 显示旧分数

Author: XYShaoKang

src/background/utils/lbaoAPI.ts

@@ -27,6 +27,7 @@ export const lbaoPredictorApi = (
       ) =>
         users.map((user, i) => ({
           ...user,
+          oldRating: data[i]?.old_rating,
           delta: data[i]?.delta_rating,
           newRating: data[i]?.new_rating,
         }))

src/content/pages/ranking/App.tsx

@@ -33,15 +33,17 @@ const App: FC = () => {
   const showPredictordelta = !!options?.contestRankingPage.ratingPredictor
   const showLanguageIcon = !!options?.contestRankingPage.languageIcon
   const showNewRating = !!options?.contestRankingPage.showNewRating
+  const showOldRating = !!options?.contestRankingPage.showOldRating
 
   return (
     <>
       {(showPredictordelta || showNewRating) && titleRoot && (
         <Portal container={titleRoot}>
           <th>
             <Title
-              showNewRating={showNewRating}
+              showOldRating={showOldRating}
               showPredictordelta={showPredictordelta}
+              showNewRating={showNewRating}
             />
           </th>
         </Portal>
@@ -53,8 +55,9 @@ const App: FC = () => {
               <Item
                 row={i}
                 hasMyRank={hasMyRank}
-                showNewRating={showNewRating}
+                showOldRating={showOldRating}
                 showPredictordelta={showPredictordelta}
+                showNewRating={showNewRating}
               />
             </td>
           </Portal>

src/content/pages/ranking/Item.tsx

@@ -8,8 +8,9 @@ import { ParamType, useGetPredictionQuery } from './rankSlice'
 type ItmeType = {
   row: number
   hasMyRank: boolean
-  showNewRating: boolean
+  showOldRating: boolean
   showPredictordelta: boolean
+  showNewRating: boolean
 }
 
 function getParam(): ParamType {
@@ -54,8 +55,9 @@ function useUrlChange() {
 const Item: FC<ItmeType> = ({
   row,
   hasMyRank,
-  showNewRating,
+  showOldRating,
   showPredictordelta,
+  showNewRating,
 }) => {
   const [param] = useUrlChange()
   const params: ParamType = { ...param }
@@ -71,9 +73,10 @@ const Item: FC<ItmeType> = ({
   }
 
   const predictor: number | undefined = items?.[row]?.delta?.toFixed(1),
-    newRating = items?.[row]?.newRating?.toFixed(1)
+    newRating = items?.[row]?.newRating?.toFixed(1),
+    oldRating = items?.[row]?.oldRating?.toFixed(1)
 
-  if (!predictor || !newRating) {
+  if (predictor === undefined) {
     return <></>
   }
 
@@ -83,6 +86,7 @@ const Item: FC<ItmeType> = ({
         display: flex;
       `}
     >
+      {showOldRating && <div style={{ width: 60 }}>{oldRating}</div>}
       {showPredictordelta && (
         <div
           css={css`

src/content/pages/ranking/Title.tsx

@@ -51,26 +51,46 @@ const Help = () => {
 }
 
 interface TitleProps {
-  showNewRating: boolean
+  showOldRating: boolean
   showPredictordelta: boolean
+  showNewRating: boolean
 }
 
-const Title: FC<TitleProps> = ({ showNewRating, showPredictordelta }) => {
+const Title: FC<TitleProps> = ({
+  showNewRating,
+  showPredictordelta,
+  showOldRating,
+}) => {
   return (
     <>
       <div
         style={{
           display: 'flex',
         }}
       >
+        {showOldRating && (
+          <div style={{ width: 60 }}>
+            旧分数{!showPredictordelta && !showNewRating && <Help />}
+          </div>
+        )}
         {showPredictordelta && (
-          <div style={{ width: 55 }}>
-            <span>预测</span>
-            <Help />
+          <div
+            style={{
+              width: 55,
+              paddingLeft: showNewRating ? 10 : 0,
+            }}
+          >
+            <span>{showNewRating ? 'Δ' : '预测'}</span>
+            {!showNewRating && <Help />}
           </div>
         )}
 
-        {showNewRating && <div>新分数{!showPredictordelta && <Help />}</div>}
+        {showNewRating && (
+          <div>
+            新分数
+            <Help />
+          </div>
+        )}
       </div>
     </>
   )

src/options/options.ts

@@ -21,8 +21,9 @@ export const defaultOptions = {
   },
   contestRankingPage: {
     languageIcon: true,
+    showOldRating: false,
     ratingPredictor: true,
-    showNewRating: false,
+    showNewRating: true,
   },
 }
 
@@ -50,6 +51,7 @@ export const labelMap: { [key: string]: string } = {
   fixBackNav: '修复返回导航',
   disableShortcutkey: '禁用快捷键',
   languageIcon: '语言图标',
-  ratingPredictor: '预测积分',
-  showNewRating: '预测新分数',
+  showOldRating: '显示旧分数',
+  ratingPredictor: '显示积分',
+  showNewRating: '显示新分数',
 }