Fix:menu url style (#344)

* fix: thumbnail image in kanban card (#338)

* fix: thumbnail image in kanban card

* Update attachment.ts

* Update Kanban.Card.Designer.tsx

Co-authored-by: chenos <chenlinxh@gmail.com>

* fix: fix menu link url bug

Co-authored-by: chenos <chenlinxh@gmail.com>

packages/core/client/src/schema-component/antd/menu/Menu.Designer.tsx

@@ -223,35 +223,43 @@ export const MenuDesigner = () => {
       });
     });
   };
+  const schema = {
+    type: 'object',
+    title: t('Edit menu item'),
+    properties: {
+      title: {
+        title: t('Menu item title'),
+        required: true,
+        'x-decorator': 'FormItem',
+        'x-component': 'Input',
+        'x-component-props': {},
+      },
+      icon: {
+        title: t('Menu item icon'),
+        'x-component': 'IconPicker',
+        'x-decorator': 'FormItem',
+      },
+    },
+  };
+  const initialValues = {
+    title: field.title,
+    icon: field.componentProps.icon,
+  };
+  if (fieldSchema['x-component'] === 'Menu.URL') {
+    schema.properties['href'] = {
+      title: t('Link'),
+      'x-component': 'Input',
+      'x-decorator': 'FormItem',
+    };
+    initialValues['href'] = field.componentProps.href;
+  }
   return (
     <GeneralSchemaDesigner>
       <SchemaSettings.ModalItem
         title={t('Edit')}
-        schema={
+        schema={schema as ISchema}
-          {
+        initialValues={initialValues}
-            type: 'object',
+        onSubmit={({ title, icon, href }) => {
-            title: t('Edit menu item'),
-            properties: {
-              title: {
-                title: t('Menu item title'),
-                required: true,
-                'x-decorator': 'FormItem',
-                'x-component': 'Input',
-                'x-component-props': {},
-              },
-              icon: {
-                title: t('Menu item icon'),
-                'x-component': 'IconPicker',
-                'x-decorator': 'FormItem',
-              },
-            },
-          } as ISchema
-        }
-        initialValues={{
-          title: field.title,
-          icon: field.componentProps.icon,
-        }}
-        onSubmit={({ title, icon }) => {
           const schema = {
             ['x-uid']: fieldSchema['x-uid'],
           };
@@ -262,9 +270,11 @@ export const MenuDesigner = () => {
             refresh();
           }
           field.componentProps.icon = icon;
-          schema['x-component-props'] = { icon };
+          field.componentProps.href = href;
+          schema['x-component-props'] = { icon, href };
           fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {};
           fieldSchema['x-component-props']['icon'] = icon;
+          fieldSchema['x-component-props']['href'] = href;
           dn.emit('patch', {
             schema,
           });

packages/core/client/src/schema-component/antd/menu/Menu.tsx

@@ -5,7 +5,7 @@ import {
   Schema,
   SchemaExpressionScopeContext,
   useField,
-  useFieldSchema
+  useFieldSchema,
 } from '@formily/react';
 import { Menu as AntdMenu } from 'antd';
 import React, { createContext, useContext, useEffect, useState } from 'react';
@@ -386,7 +386,17 @@ Menu.URL = observer((props) => {
     >
       <SortableItem className={designerCss}>
         <Icon type={icon} />
-        {field.title}
+        <span
+          className={css`
+            overflow: hidden;
+            text-overflow: ellipsis;
+            display: inline-block;
+            width: 100%;
+            vertical-align: middle;
+          `}
+        >
+          {field.title}
+        </span>
         <Designer />
       </SortableItem>
     </AntdMenu.Item>