fix: awel template css error (#2220)

Co-authored-by: wb-lh513319 <wb-lh513319@alibaba-inc.com>

web/components/flow/canvas-modal/flow-template-modal.tsx

@@ -35,20 +35,24 @@ export const FlowTemplateModal: React.FC<Props> = ({ isFlowTemplateModalOpen, se
       title: t('Template_Name'),
       dataIndex: 'name',
       key: 'name',
+      width: '30%',
     },
     {
       title: t('Template_Label'),
       dataIndex: 'label',
       key: 'label',
+      width: '30%',
     },
     {
       title: t('Template_Description'),
       dataIndex: 'description',
       key: 'description',
+      width: '30%',
     },
     {
       title: t('Template_Action'),
       key: 'action',
+      width: '10%',
       render: (_, record) => (
         <Space size='middle'>
           <Button
@@ -75,14 +79,19 @@ export const FlowTemplateModal: React.FC<Props> = ({ isFlowTemplateModalOpen, se
   return (
     <>
       <Modal
-        className='w-[700px]'
+        className='w-[900px]'
         title={t('Import_From_Template')}
         open={isFlowTemplateModalOpen}
         onCancel={() => setIsFlowTemplateModalOpen(false)}
         cancelButtonProps={{ className: 'hidden' }}
         okButtonProps={{ className: 'hidden' }}
       >
-        <Table className='w-full' dataSource={dataSource} columns={columns} />;
+        <Table
+          className='w-full'
+          // scroll={{ x: 'max-content' }}
+          dataSource={dataSource}
+          columns={columns}
+        />
       </Modal>
     </>
   );

web/pages/construct/database.tsx

@@ -1,13 +1,13 @@
-import { apiInterceptors, getDbList, getDbSupportType, postDbDelete } from '@/client/api';
+import { apiInterceptors, getDbList, getDbSupportType, postDbDelete, postDbRefresh } from '@/client/api';
 import GPTCard from '@/components/common/gpt-card';
 import MuiLoading from '@/components/common/loading';
 import FormDialog from '@/components/database/form-dialog';
 import ConstructLayout from '@/new-components/layout/Construct';
 import { DBOption, DBType, DbListResponse, DbSupportTypeResponse } from '@/types/db';
 import { dbMapper } from '@/utils';
-import { DeleteFilled, EditFilled, PlusOutlined } from '@ant-design/icons';
+import { DeleteFilled, EditFilled, PlusOutlined, RedoOutlined } from '@ant-design/icons';
 import { useAsyncEffect } from 'ahooks';
-import { Badge, Button, Card, Drawer, Empty, Modal, message } from 'antd';
+import { Badge, Button, Card, Drawer, Empty, Modal, Spin, message } from 'antd';
 import { useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -36,6 +36,7 @@ function Database() {
     name?: string;
     type?: DBType;
   }>({ open: false });
+  const [refreshLoading, setRefreshLoading] = useState(false);
 
   const getDbSupportList = async () => {
     const [, data] = await apiInterceptors(getDbSupportType());
@@ -123,6 +124,13 @@ function Database() {
     });
   };
 
+  const onRefresh = async (item: DBItem) => {
+    setRefreshLoading(true);
+    const [, res] = await apiInterceptors(postDbRefresh({ db_name: item.db_name, db_type: item.db_type }));
+    if (res) message.success(t('refreshSuccess'));
+    setRefreshLoading(false);
+  };
+
   // TODO: unused function call
   // const handleChat = async (item: IChatDbSchema) => {
   //   const [, data] = await apiInterceptors(
@@ -265,7 +273,7 @@ function Database() {
           open={draw.open}
         >
           {draw.type && dbListByType[draw.type] && dbListByType[draw.type].length ? (
-            <>
+            <Spin spinning={refreshLoading}>
               <Button
                 type='primary'
                 className='mb-4 flex items-center'
@@ -282,6 +290,13 @@ function Database() {
                   title={item.db_name}
                   extra={
                     <>
+                      <RedoOutlined
+                        className='mr-2'
+                        style={{ color: 'gray' }}
+                        onClick={() => {
+                          onRefresh(item);
+                        }}
+                      />
                       <EditFilled
                         className='mr-2'
                         style={{ color: '#1b7eff' }}
@@ -311,7 +326,7 @@ function Database() {
                   <p>remark: {item.comment}</p>
                 </Card>
               ))}
-            </>
+            </Spin>
           ) : (
             <Empty image={Empty.PRESENTED_IMAGE_DEFAULT}>
               <Button