Merge pull request #1538 from visuddhinanda/agile

添加字典详情气泡

.vscode/launch.json

@@ -0,0 +1,15 @@
+{
+  // 使用 IntelliSense 了解相关属性。
+  // 悬停以查看现有属性的描述。
+  // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Launch Chrome against localhost",
+      "url": "http://127.0.0.1:3000/my",
+      "webRoot": "${workspaceFolder}"
+    }
+  ]
+}

dashboard/src/components/dict/WordCardByDict.tsx

@@ -1,13 +1,15 @@
-import { Card } from "antd";
+import { Button, Card, Popover, Space } from "antd";
 import { Typography } from "antd";
-import MdView from "../template/MdView";
+import { InfoCircleOutlined } from "@ant-design/icons";
 
-import GrammarPop from "./GrammarPop";
+import Marked from "../general/Marked";
+import MdView from "../template/MdView";
 
-const { Title, Text } = Typography;
+const { Title } = Typography;
 
 export interface IWordByDict {
   dictname: string;
+  description?: string;
   word: string;
   note: string;
   anchor: string;
@@ -18,9 +20,20 @@ interface IWidgetWordCardByDict {
 const WordCardByDictWidget = (prop: IWidgetWordCardByDict) => {
   return (
     <Card>
-      <Title level={5} id={prop.data.anchor}>
-        {prop.data.dictname}
-      </Title>
+      <Space>
+        <Title level={5} id={prop.data.anchor}>
+          {prop.data.dictname}
+        </Title>
+        {prop.data.description ? (
+          <Popover
+            overlayStyle={{ maxWidth: 600 }}
+            content={<Marked text={prop.data.description} />}
+            placement="bottom"
+          >
+            <Button type="link" icon={<InfoCircleOutlined />} />
+          </Popover>
+        ) : undefined}
+      </Space>
       <div>
         <MdView html={prop.data.note} />
       </div>