Merge pull request #1547 from visuddhinanda/agile

术语第一个和后面的显示不同

dashboard/src/components/template/Term.tsx

@@ -12,9 +12,25 @@ import { changedTerm, refresh } from "../../reducers/term-change";
 import { useAppSelector } from "../../hooks";
 import { get } from "../../request";
 import { fullUrl } from "../../utils";
+import lodash from "lodash";
+import { order, push } from "../../reducers/term-order";
 
 const { Text, Title } = Typography;
 
+interface ITermExtra {
+  pali?: string;
+  meaning2?: string[];
+}
+const TermExtra = ({ pali, meaning2 }: ITermExtra) => (
+  <>
+    {" "}
+    {"("}
+    <Text italic>{pali}</Text>
+    {meaning2 ? <Text>{`,${meaning2}`}</Text> : undefined}
+    {")"}
+  </>
+);
+
 interface ITermSummary {
   ok: boolean;
   message: string;
@@ -55,6 +71,38 @@ const TermCtl = ({
   const [content, setContent] = useState<string>();
   const [community, setCommunity] = useState(isCommunity);
   const newTerm: ITermDataResponse | undefined = useAppSelector(changedTerm);
+  const [isFirst, setIsFirst] = useState(true);
+  const [uid, setUid] = useState<string>(
+    lodash.times(20, () => lodash.random(35).toString(36)).join("")
+  );
+
+  const termOrder = useAppSelector(order);
+
+  useEffect(() => {
+    if (word && parentChannelId) {
+      const currTerm = {
+        word: word,
+        channelId: parentChannelId,
+        first: uid,
+      };
+      store.dispatch(push(currTerm));
+    }
+  }, []);
+
+  useEffect(() => {
+    const index = termOrder?.findIndex(
+      (value) =>
+        value.word === word &&
+        value.channelId === parentChannelId &&
+        value.first === uid
+    );
+
+    if (index === -1) {
+      setIsFirst(false);
+    } else {
+      setIsFirst(true);
+    }
+  }, [parentChannelId, termOrder, uid, word]);
 
   useEffect(() => {
     if (newTerm?.word === word && parentStudioId === newTerm?.studio.id) {
@@ -92,6 +140,7 @@ const TermCtl = ({
   if (typeof termData?.id === "string") {
     return (
       <>
+        <span className="term"></span>
         <Popover
           title={
             <Space style={{ justifyContent: "space-between", width: "100%" }}>
@@ -188,12 +237,9 @@ const TermCtl = ({
               : "unknown"}
           </Typography.Link>
         </Popover>
-        {"("}
-        <Text italic>{word}</Text>
-        {termData?.meaning2 ? (
-          <Text>{`,${termData?.meaning2}`}</Text>
+        {isFirst ? (
+          <TermExtra pali={word} meaning2={termData?.meaning2} />
         ) : undefined}
-        {")"}
       </>
     );
   } else {

dashboard/src/reducers/term-order.ts

@@ -0,0 +1,41 @@
+/**
+ * 查字典，添加术语命令
+ */
+import { createSlice, PayloadAction } from "@reduxjs/toolkit";
+
+import type { RootState } from "../store";
+
+export interface ITermItem {
+  word: string;
+  channelId: string;
+  first: string;
+}
+interface IState {
+  order: ITermItem[];
+}
+
+const initialState: IState = { order: [] };
+
+export const slice = createSlice({
+  name: "term-order",
+  initialState,
+  reducers: {
+    push: (state, action: PayloadAction<ITermItem>) => {
+      const index = state.order.findIndex(
+        (value) =>
+          value.word === action.payload.word &&
+          value.channelId === action.payload.channelId
+      );
+      if (index === -1) {
+        state.order.push(action.payload);
+      }
+    },
+  },
+});
+
+export const { push } = slice.actions;
+
+export const order = (state: RootState): ITermItem[] | undefined =>
+  state.termOrder.order;
+
+export default slice.reducer;

dashboard/src/store.ts

@@ -24,6 +24,7 @@ import sentWordsReducer from "./reducers/sent-word";
 import netStatusReducer from "./reducers/net-status";
 import discussionReducer from "./reducers/discussion";
 import wbwReducer from "./reducers/wbw";
+import termOrderReducer from "./reducers/term-order";
 
 const store = configureStore({
   reducer: {
@@ -51,6 +52,7 @@ const store = configureStore({
     netStatus: netStatusReducer,
     discussion: discussionReducer,
     wbw: wbwReducer,
+    termOrder: termOrderReducer,
   },
 });