临时代码 把 Cascader 搬到外面

dashboard/src/components/template/Wbw/WbwDetailBasic.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import { useIntl } from "react-intl";
-import { Divider, Form, Select, Input } from "antd";
+import { Divider, Form, Select, Input, Cascader } from "antd";
 import { Collapse } from "antd";
 
 import SelectCase from "../../dict/SelectCase";
@@ -17,6 +17,13 @@ export interface IWordBasic {
   factorMeaning?: string;
   parent?: string;
 }
+
+interface CascaderOption {
+  value: string | number;
+  label: string;
+  children?: CascaderOption[];
+}
+
 interface IWidget {
   data: IWbw;
   onChange?: Function;
@@ -40,6 +47,34 @@ const Widget = ({ data, onChange }: IWidget) => {
       }
     }
   };
+
+  const options: CascaderOption[] = [
+    {
+      value: "n",
+      label: intl.formatMessage({ id: "dict.fields.type.n.label" }),
+    },
+    {
+      value: "ti",
+      label: intl.formatMessage({ id: "dict.fields.type.ti.label" }),
+    },
+    {
+      value: "v",
+      label: intl.formatMessage({ id: "dict.fields.type.v.label" }),
+    },
+    {
+      value: "ind",
+      label: intl.formatMessage({ id: "dict.fields.type.ind.label" }),
+    },
+    {
+      value: "un",
+      label: intl.formatMessage({ id: "dict.fields.type.un.label" }),
+    },
+    {
+      value: "adj",
+      label: intl.formatMessage({ id: "dict.fields.type.adj.label" }),
+    },
+  ];
+
   return (
     <>
       <Form
@@ -52,6 +87,8 @@ const Widget = ({ data, onChange }: IWidget) => {
           factors: data.factors?.value,
           factorMeaning: data.factorMeaning?.value,
           parent: data.parent?.value,
+          case: data.case?.value,
+          case1: data.case?.value,
         }}
       >
         <Form.Item
@@ -70,7 +107,6 @@ const Widget = ({ data, onChange }: IWidget) => {
             options={items.map((item) => ({ label: item, value: item }))}
             dropdownRender={(menu) => (
               <>
-                {" "}
                 {menu}
                 <Divider style={{ margin: "8px 0" }}>更多</Divider>
                 <WbwMeaningSelect
@@ -111,6 +147,13 @@ const Widget = ({ data, onChange }: IWidget) => {
           label={intl.formatMessage({ id: "forms.fields.case.label" })}
           tooltip={intl.formatMessage({ id: "forms.fields.case.tooltip" })}
           name="case"
+        >
+          <Cascader options={options} placeholder="Please select case" />
+        </Form.Item>
+        <Form.Item
+          label={intl.formatMessage({ id: "forms.fields.case.label" })}
+          tooltip={intl.formatMessage({ id: "forms.fields.case.tooltip" })}
+          name="case1"
         >
           <SelectCase
             onCaseChange={(value: (string | number)[]) => {