chore: add no available models notes

src/pages/playground/components/empty-models.tsx

@@ -0,0 +1,42 @@
+import { useIntl, useNavigate } from '@umijs/max';
+import { Button, Empty, Typography } from 'antd';
+import React from 'react';
+
+const EmptyModels: React.FC<{
+  style?: React.CSSProperties;
+}> = ({ style }) => {
+  const intl = useIntl();
+  const navigate = useNavigate();
+
+  const handleDeployModel = () => {
+    navigate('/models');
+  };
+  return (
+    <div
+      className="flex-center justify-center"
+      style={{
+        ...style
+      }}
+    >
+      <Empty
+        image={Empty.PRESENTED_IMAGE_SIMPLE}
+        description={
+          <div className="flex-column">
+            <Typography.Text type="secondary">
+              {intl.formatMessage({ id: 'playground.model.noavailable' })}
+            </Typography.Text>
+            <Typography.Text type="secondary">
+              {intl.formatMessage({ id: 'playground.model.noavailable.tips' })}
+            </Typography.Text>
+          </div>
+        }
+      >
+        <Button type="primary" onClick={handleDeployModel}>
+          {intl.formatMessage({ id: 'models.button.deploy' })}
+        </Button>
+      </Empty>
+    </div>
+  );
+};
+
+export default EmptyModels;

src/pages/playground/components/multiple-chat/model-item.tsx

@@ -1,3 +1,4 @@
+import AutoTooltip from '@/components/auto-tooltip';
 import IconFont from '@/components/icon-font';
 import useOverlayScroller from '@/hooks/use-overlay-scroller';
 import { fetchChunkedData, readStreamData } from '@/utils/fetch-chunk-data';
@@ -369,6 +370,19 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef(
               options={modelFullList}
               onChange={handleModelChange}
               value={params.model}
+              optionRender={(data) => {
+                return (
+                  <AutoTooltip
+                    title={data.label}
+                    ghost
+                    tooltipProps={{
+                      placement: 'right'
+                    }}
+                  >
+                    {data.label}
+                  </AutoTooltip>
+                );
+              }}
             ></Select>
           </span>
           <ReferenceParams usage={tokenResult}></ReferenceParams>