diff --git a/config/config.ts b/config/config.ts
index 36546891..18abf24a 100644
--- a/config/config.ts
+++ b/config/config.ts
@@ -14,7 +14,7 @@ const isProduction = env === 'production';
 const t = Date.now();
 export default defineConfig({
   proxy: {
-    ...proxy()
+    ...proxy('http://192.168.50.2:8088/')
   },
   history: {
     type: 'hash'
diff --git a/src/pages/playground/components/ground-left.tsx b/src/pages/playground/components/ground-left.tsx
index 214981d2..d120d65b 100644
--- a/src/pages/playground/components/ground-left.tsx
+++ b/src/pages/playground/components/ground-left.tsx
@@ -14,7 +14,7 @@ import {
   useState
 } from 'react';
 import { CHAT_API } from '../apis';
-import { Roles } from '../config';
+import { Roles, formatMessageParams } from '../config';
 import { MessageItem } from '../config/types';
 import '../style/ground-left.less';
 import '../style/system-message-wrap.less';
@@ -51,6 +51,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
   const currentMessageRef = useRef<any>(null);
   const paramsRef = useRef<any>(null);
   const messageListLengthCache = useRef<number>(0);
+  const [viewCodeMessage, setViewCodeMessage] = useState<any[]>([]);
 
   const { initialize, updateScrollerPosition } = useOverlayScroller();
   const { initialize: innitializeParams } = useOverlayScroller();
@@ -158,21 +159,27 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
           };
         }
       );
+      const messageParams = systemMessage
+        ? [
+            {
+              role: Roles.System,
+              content: [
+                {
+                  type: 'text',
+                  text: systemMessage
+                }
+              ]
+            },
+            ...formatMessages
+          ]
+        : [...formatMessages];
+
+      const finalMessageParams = formatMessageParams(messageParams);
+
+      setViewCodeMessage(finalMessageParams);
+
       const chatParams = {
-        messages: systemMessage
-          ? [
-              {
-                role: Roles.System,
-                content: [
-                  {
-                    type: 'text',
-                    text: systemMessage
-                  }
-                ]
-              },
-              ...formatMessages
-            ]
-          : [...formatMessages],
+        messages: finalMessageParams,
         ...parameters,
         stream: true,
         stream_options: {
@@ -196,6 +203,13 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
       setMessageId();
       const { reader, decoder } = result;
       await readStreamData(reader, decoder, (chunk: any) => {
+        if (chunk?.error) {
+          setTokenResult({
+            error: true,
+            errorMessage: chunk?.error?.message || chunk?.message || ''
+          });
+          return;
+        }
         joinMessage(chunk);
       });
     } catch (error) {
@@ -344,8 +358,7 @@ const GroundLeft: React.FC<MessageProps> = forwardRef((props, ref) => {
 
       <ViewCodeModal
         open={show}
-        systemMessage={systemMessage}
-        messageList={messageList}
+        messageList={viewCodeMessage}
         parameters={parameters}
         onCancel={handleCloseViewCode}
         title={intl.formatMessage({ id: 'playground.viewcode' })}
diff --git a/src/pages/playground/components/multiple-chat/content-item.tsx b/src/pages/playground/components/multiple-chat/content-item.tsx
index 6ed0c8b1..9330b3fe 100644
--- a/src/pages/playground/components/multiple-chat/content-item.tsx
+++ b/src/pages/playground/components/multiple-chat/content-item.tsx
@@ -183,7 +183,7 @@ const ContentItem: React.FC<MessageItemProps> = ({
           {data.title ?? intl.formatMessage({ id: `playground.${data.role}` })}
         </div>
         <div className="actions">
-          {actions.includes('upload') && (
+          {actions.includes('upload') && data.role === Roles.User && (
             <UploadImg handleUpdateImgList={handleUpdateImgList}></UploadImg>
           )}
           {data.content && actions.includes('copy') && (
diff --git a/src/pages/playground/components/multiple-chat/model-item.tsx b/src/pages/playground/components/multiple-chat/model-item.tsx
index fa20d97d..6c6707ed 100644
--- a/src/pages/playground/components/multiple-chat/model-item.tsx
+++ b/src/pages/playground/components/multiple-chat/model-item.tsx
@@ -24,7 +24,7 @@ import React, {
 } from 'react';
 import 'simplebar-react/dist/simplebar.min.css';
 import { CHAT_API } from '../../apis';
-import { Roles } from '../../config';
+import { Roles, formatMessageParams } from '../../config';
 import CompareContext from '../../config/compare-context';
 import { MessageItem, ModelSelectionItem } from '../../config/types';
 import '../../style/model-item.less';
@@ -67,6 +67,7 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef(
     const currentMessageRef = useRef<MessageItem[]>([]);
     const modelScrollRef = useRef<any>(null);
     const messageListLengthCache = useRef<number>(0);
+    const [viewCodeMessage, setViewCodeMessage] = useState<any[]>([]);
 
     const { initialize, updateScrollerPosition } = useOverlayScroller();
 
@@ -157,21 +158,28 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef(
             ]
           };
         });
+
+        const messageParams = systemMessage
+          ? [
+              {
+                role: Roles.System,
+                content: [
+                  {
+                    type: 'text',
+                    text: systemMessage
+                  }
+                ]
+              },
+              ...formatMessages
+            ]
+          : [...formatMessages];
+
+        const finalMessageParams = formatMessageParams(messageParams);
+
+        setViewCodeMessage(finalMessageParams);
+
         const chatParams = {
-          messages: systemMessage
-            ? [
-                {
-                  role: Roles.System,
-                  content: [
-                    {
-                      type: 'text',
-                      text: systemMessage
-                    }
-                  ]
-                },
-                ...formatMessages
-              ]
-            : [...formatMessages],
+          messages: finalMessageParams,
           ...params,
           stream: true,
           stream_options: {
@@ -196,6 +204,13 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef(
         setMessageId();
         const { reader, decoder } = result;
         await readStreamData(reader, decoder, (chunk: any) => {
+          if (chunk?.error) {
+            setTokenResult({
+              error: true,
+              errorMessage: chunk?.error?.message || chunk?.message || ''
+            });
+            return;
+          }
           joinMessage(chunk);
         });
       } catch (error) {
@@ -473,8 +488,7 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef(
         </div>
         <ViewCodeModal
           open={show}
-          systemMessage={systemMessage}
-          messageList={messageList}
+          messageList={viewCodeMessage}
           parameters={params}
           onCancel={handleCloseViewCode}
           title={intl.formatMessage({ id: 'playground.viewcode' })}
diff --git a/src/pages/playground/components/reference-params.tsx b/src/pages/playground/components/reference-params.tsx
index 0555d7be..c0054bd4 100644
--- a/src/pages/playground/components/reference-params.tsx
+++ b/src/pages/playground/components/reference-params.tsx
@@ -1,6 +1,6 @@
 import { WarningOutlined } from '@ant-design/icons';
 import { useIntl } from '@umijs/max';
-import { Alert, Space, Tooltip } from 'antd';
+import { Space, Tooltip, Typography } from 'antd';
 import classNames from 'classnames';
 import _ from 'lodash';
 import '../style/reference-params.less';
@@ -28,18 +28,22 @@ const ReferenceParams = (props: ReferenceParamsProps) => {
   }
   if (usage.error) {
     return (
-      <Alert
-        type="error"
-        style={{ textAlign: 'center', paddingBlock: 0 }}
-        message={
-          <span style={{ color: 'var(--ant-color-error)' }}>
-            <WarningOutlined className="m-r-8" />
-            {usage?.errorMessage}
-          </span>
-        }
-        banner
-        showIcon={false}
-      />
+      <Typography.Paragraph
+        type="danger"
+        ellipsis={{
+          rows: 2,
+          tooltip: usage?.errorMessage
+        }}
+        style={{
+          textAlign: 'center',
+          paddingBlock: 0,
+          margin: 0,
+          backgroundColor: 'var(--ant-color-error-bg)'
+        }}
+      >
+        <WarningOutlined className="m-r-8" />
+        {usage?.errorMessage}
+      </Typography.Paragraph>
     );
   }
   return (
diff --git a/src/pages/playground/components/view-code-modal.tsx b/src/pages/playground/components/view-code-modal.tsx
index 5427afc4..b909b653 100644
--- a/src/pages/playground/components/view-code-modal.tsx
+++ b/src/pages/playground/components/view-code-modal.tsx
@@ -50,41 +50,41 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
     apiType === 'chat' ? 'choices[0].message.content' : 'data[0].embedding';
 
   const generateCode = () => {
-    const systemList = systemMessage
-      ? [
-          {
-            role: 'system',
-            content: [
-              {
-                type: 'text',
-                text: systemMessage
-              }
-            ]
-          }
-        ]
-      : [];
+    // const systemList = systemMessage
+    //   ? [
+    //       {
+    //         role: 'system',
+    //         content: [
+    //           {
+    //             type: 'text',
+    //             text: systemMessage
+    //           }
+    //         ]
+    //       }
+    //     ]
+    //   : [];
 
-    const formatMessageList = _.map(messageList, (item: any) => {
-      return {
-        role: item.role,
-        content: [
-          {
-            type: 'text',
-            text: item.content
-          },
-          ..._.map(item.imgs, (img: any) => {
-            return {
-              type: 'image_url',
-              image_url: {
-                url: img.dataUrl
-              }
-            };
-          })
-        ]
-      };
-    });
+    // const formatMessageList = _.map(messageList, (item: any) => {
+    //   return {
+    //     role: item.role,
+    //     content: [
+    //       {
+    //         type: 'text',
+    //         text: item.content
+    //       },
+    //       ..._.map(item.imgs, (img: any) => {
+    //         return {
+    //           type: 'image_url',
+    //           image_url: {
+    //             url: img.dataUrl
+    //           }
+    //         };
+    //       })
+    //     ]
+    //   };
+    // });
     if (lang === langMap.shell) {
-      const messages = [...systemList, ...formatMessageList];
+      const messages = messageList;
       const code = `curl ${window.location.origin}/v1-openai/${api} \\\n-H "Content-Type: application/json" \\\n-H "Authorization: Bearer $\{YOUR_GPUSTACK_API_KEY}" \\\n-d '${JSON.stringify(
         {
           ...parameters,
@@ -95,7 +95,7 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
       )}'`;
       setCodeValue(code);
     } else if (lang === langMap.javascript) {
-      const messages = [...systemList, ...formatMessageList];
+      const messages = messageList;
       const code = `const OpenAI = require("openai");\n\nconst openai = new OpenAI({\n  "apiKey": "YOUR_GPUSTACK_API_KEY",\n  "baseURL": "${BaseURL}"\n});\n\nasync function main(){\n  const params = ${JSON.stringify(
         {
           ...parameters,
@@ -121,11 +121,7 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
       );
       const messages =
         apiType === 'chat'
-          ? `messages=${JSON.stringify(
-              [...systemList, ...formatMessageList],
-              null,
-              2
-            )}`
+          ? `messages=${JSON.stringify(messageList, null, 2)}`
           : '';
       const code = `from openai import OpenAI\n\nclient = OpenAI(\n  base_url="${BaseURL}", \n  api_key="YOUR_GPUSTACK_API_KEY"\n)\n\nresponse = client.${ClientType}.create(\n${formattedParams}  ${messages})\nprint(response.${logcommand})`;
       setCodeValue(code);
@@ -158,7 +154,7 @@ const ViewCodeModal: React.FC<ViewModalProps> = (props) => {
 
   useEffect(() => {
     generateCode();
-  }, [lang, systemMessage, messageList, parameters]);
+  }, [lang, messageList, parameters]);
 
   return (
     <>
diff --git a/src/pages/playground/config/index.ts b/src/pages/playground/config/index.ts
index 8e403b82..13ea54e2 100644
--- a/src/pages/playground/config/index.ts
+++ b/src/pages/playground/config/index.ts
@@ -13,3 +13,30 @@ export const playGroundRoles = [
     label: 'playground.assitant'
   }
 ];
+
+export const formatMessageParams = (messageList: any[]) => {
+  const result: any[] = [];
+
+  messageList.forEach((item) => {
+    const { role, content, title, imgs, uid } = item;
+    content?.forEach((contentItem: any) => {
+      if (contentItem.type === 'text') {
+        result.push({
+          role,
+          content: contentItem.text
+        });
+      }
+      if (contentItem.type === 'image_url') {
+        result.push({
+          role,
+          content: [
+            {
+              ...contentItem
+            }
+          ]
+        });
+      }
+    });
+  });
+  return result;
+};