[fix](ui): fix data preview error

ui/src/api/api.ts

@@ -101,7 +101,7 @@ export function getDatabaseList<T>(data?: any): Promise<Result<T>> {
 }
 
 export function doQuery<T>(data: any): Promise<Result<T>> {
-    return request(`/api/query/default_cluster/${data.db_name}`, {
+    return request(`/api/query/internal/${data.db_name}`, {
         method: 'POST', ...data,
     });
 }

ui/src/components/codemirror-with-fullscreen/codemirror-with-fullscreen.tsx

@@ -54,7 +54,7 @@ export function CodeMirrorWithFullscreen(props: any) {
                 value={props.value}
                 onBeforeChange={props.onBeforeChange}
                 className={styles['codemirror']}
-                options={{...options,theme:'neo'}}
+                options={{...options,theme:'default'}}
             />
         </div>
     );

ui/src/components/codemirror-with-fullscreen/doris.css

@@ -26,59 +26,68 @@
     color: #2e383c;
     line-height: 1.4375;
     font-family: apercu-mono-regular, Menlo, Monaco, Consolas, "Courier New", monospace !important;
-  }
-.cm-s-neo .cm-comment { 
+}
+
+.cm-s-neo .cm-comment {
     color: #75787b;
 }
-.cm-s-neo .cm-keyword, 
-.cm-s-neo .cm-property { 
-    color: #02a0f9; 
+
+.cm-s-neo .cm-keyword,
+.cm-s-neo .cm-property {
+    color: #02a0f9;
 }
+
 .cm-s-neo .cm-atom,
-.cm-s-neo .cm-number { 
-    color: #35ae91; 
+.cm-s-neo .cm-number {
+    color: #35ae91;
 }
+
 .cm-s-neo .cm-node,
-.cm-s-neo .cm-tag { 
-    color: #9c3328; 
+.cm-s-neo .cm-tag {
+    color: #9c3328;
 }
-.cm-s-neo .cm-string { 
-    color: #b35e14; 
+
+.cm-s-neo .cm-string {
+    color: #b35e14;
 }
+
 .cm-s-neo .cm-variable,
-.cm-s-neo .cm-qualifier { 
-    color: #75438a; 
+.cm-s-neo .cm-qualifier {
+    color: #75438a;
 }
-  
-  
-  /* Editor styling */
-  
+
+
+/* Editor styling */
+
 .cm-s-neo pre {
     padding: 0;
 }
 
-.cm-s-neo .CodeMirror-gutters {
+.cm-s-neo .CodeMirror-gutters,
+.CodeMirror-gutters {
     border: none;
     border-right: 10px solid transparent;
     background-color: transparent;
 }
 
-.cm-s-neo .CodeMirror-linenumber {
+.cm-s-neo .CodeMirror-linenumber,
+.CodeMirror-gutters {
     padding: 0;
     color: #e0e2e5;
 }
 
-.cm-s-neo .CodeMirror-guttermarker { 
-    color: #1d75b3; 
+.cm-s-neo .CodeMirror-guttermarker,
+.CodeMirror-guttermarker {
+    color: #1d75b3;
 }
-.cm-s-neo .CodeMirror-guttermarker-subtle { 
-    color: #e0e2e5; 
+
+.cm-s-neo .CodeMirror-guttermarker-subtle {
+    color: #e0e2e5;
 }
 
 .cm-s-neo .CodeMirror-cursor {
     width: auto;
     border: 0;
     background: rgba(155, 157, 162, 0.37);
     z-index: 1;
-}
-
+}

ui/src/pages/playground/content/components/data-prev.tsx

@@ -27,6 +27,7 @@ import {useTranslation} from 'react-i18next';
 export function DataPrev(props: any) {
     let {t} = useTranslation();
     const {db_name, tbl_name} = getDbName();
+    const dbName = db_name.replace(/default_cluster:/, '')
     const [tableData, setTableData] = useState<any[]>([]);
     const [columns, setColumns] = useState<any[]>([]);
 
@@ -37,7 +38,7 @@ export function DataPrev(props: any) {
         }
         AdHocAPI.doQuery({
             db_name,
-            body: {stmt: `SELECT * FROM ${db_name}.${tbl_name} LIMIT 10`},
+            body: {stmt: `SELECT * FROM ${dbName}.${tbl_name} LIMIT 10`},
         }).then((res: any) => {
             if (res && res.msg === 'success') {
                 console.log(getColumns(res.data?.meta), 2222)
@@ -99,7 +100,7 @@ export function DataPrev(props: any) {
             <Row justify="space-between" style={{marginBottom: 10}}>
                 <span style={{paddingBottom: '15px'}}>{t('dataPreview') + "(" + t('display10') + ")"}</span>
                 <span>
-                    {db_name}.{tbl_name}
+                    {dbName}.{tbl_name}
                 </span>
                 <FlatBtn
                     onClick={() =>

ui/src/pages/playground/content/content-result.tsx

@@ -151,15 +151,15 @@ export function AdhocContentResult(props) {
                             ...getELe(resStatus)
                         }
                         {/* <Row>
-                            <Col span={2}>结果表:</Col>
+                            <Col span={2}>结果表：</Col>
                             <FlatBtn onClick={() => queryResultTable()}>
                                 临时表
                             </FlatBtn>
                         </Row> */}
                     </Card>
                     <div
                         className="ant-table ant-table-small ant-table-bordered"
-                        style={{marginTop: 10}}
+                        style={{marginTop: 10, width: '100%', overflowX: 'scroll'}}
                     >
                         <div className="ant-table-container">
                             <div className='ant-table-content'>

ui/src/pages/playground/index.less

@@ -21,6 +21,8 @@ under the License. */
     padding: 3*@spacer;
     background-color: #fff;
     // max-width: 1200px;
+    overflow: scroll;
+    height: 100vh;
 }
 .adhoc {
     display: flex;
@@ -65,4 +67,4 @@ under the License. */
             cursor: col-resize!important;
         }
     }
-}
+}