feat(render): field type and length on table header mouse hover

antares-sql · Oct 17, 2020 · 04804b0 · 04804b0
1 parent 053418e
commit 04804b0
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 6 deletions.
diff --git a/src/main/libs/clients/MySQLClient.js b/src/main/libs/clients/MySQLClient.js
@@ -171,16 +171,23 @@ export class MySQLClient extends AntaresCore {
          .run();
 
       return rows.map(field => {
+         let numLength = field.COLUMN_TYPE.match(/int\(([^)]+)\)/);
+         numLength = numLength ? +numLength.pop() : null;
+
          return {
             name: field.COLUMN_NAME,
             key: field.COLUMN_KEY.toLowerCase(),
             type: field.DATA_TYPE,
             schema: field.TABLE_SCHEMA,
             table: field.TABLE_NAME,
             numPrecision: field.NUMERIC_PRECISION,
+            numLength,
             datePrecision: field.DATETIME_PRECISION,
             charLength: field.CHARACTER_MAXIMUM_LENGTH,
-            isNullable: field.IS_NULLABLE,
+            nullable: field.IS_NULLABLE.includes('YES'),
+            unsigned: field.COLUMN_TYPE.includes('unsigned'),
+            zerofill: field.COLUMN_TYPE.includes('zerofill'),
+            order: field.ORDINAL_POSITION,
             default: field.COLUMN_DEFAULT,
             charset: field.CHARACTER_SET_NAME,
             collation: field.COLLATION_NAME,

diff --git a/src/renderer/components/ModalNewTableRow.vue b/src/renderer/components/ModalNewTableRow.vue
@@ -248,7 +248,7 @@ export default {
       },
       fieldLength (field) {
          if ([...BLOB, ...LONG_TEXT].includes(field.type)) return null;
-         return field.numPrecision || field.datePrecision || field.charLength || 0;
+         return field.numLength || field.datePrecision || field.charLength || 0;
       },
       inputProps (field) {
          if ([...TEXT, ...LONG_TEXT].includes(field.type))

diff --git a/src/renderer/components/Workspace.vue b/src/renderer/components/Workspace.vue
@@ -33,7 +33,8 @@
                @click="selectTab({uid: workspace.uid, tab: tab.uid})"
                @mousedown.middle="closeTab(tab.uid)"
             >
-               <a>
+               <a class="tab-link">
+                  <i class="mdi mdi-18px mdi-code-tags mr-1" />
                   <span>
                      Query #{{ tab.index }}
                      <span

diff --git a/src/renderer/components/WorkspaceQueryTab.vue b/src/renderer/components/WorkspaceQueryTab.vue
@@ -22,8 +22,12 @@
                <div v-if="affectedCount !== false">
                   {{ $t('message.affectedRows') }}: <b>{{ affectedCount }}</b>
                </div>
-               <div v-if="workspace.breadcrumbs.schema">
-                  {{ $t('word.schema') }}: <b>{{ workspace.breadcrumbs.schema }}</b>
+               <div
+                  v-if="workspace.breadcrumbs.schema"
+                  class="d-flex"
+                  :title="$t('word.schema')"
+               >
+                  <i class="mdi mdi-18px mdi-database mr-1" /><b>{{ workspace.breadcrumbs.schema }}</b>
                </div>
             </div>
          </div>

diff --git a/src/renderer/components/WorkspaceQueryTable.vue b/src/renderer/components/WorkspaceQueryTable.vue
@@ -39,7 +39,7 @@
                            :class="`key-${field.key}`"
                            :title="keyName(field.key)"
                         />
-                        <span>{{ field.alias || field.name }}</span>
+                        <span :title="`${field.type} ${fieldLength(field) ? `(${fieldLength(field)})` : ''}`">{{ field.alias || field.name }}</span>
                         <i
                            v-if="currentSort === field.name || currentSort === `${field.table}.${field.name}`"
                            class="mdi sort-icon"
@@ -80,6 +80,7 @@
 
 <script>
 import { uidGen } from 'common/libs/uidGen';
+import { LONG_TEXT, BLOB } from 'common/fieldTypes';
 import BaseVirtualScroll from '@/components/BaseVirtualScroll';
 import WorkspaceQueryTableRow from '@/components/WorkspaceQueryTableRow';
 import TableContext from '@/components/WorkspaceQueryTableContext';
@@ -92,6 +93,12 @@ export default {
       WorkspaceQueryTableRow,
       TableContext
    },
+   filters: {
+      wrapNumber (num) {
+         if (!num) return '';
+         return `(${num})`;
+      }
+   },
    props: {
       results: Array,
       tabUid: [String, Number],
@@ -193,6 +200,10 @@ export default {
 
          return length;
       },
+      fieldLength (field) {
+         if ([...BLOB, ...LONG_TEXT].includes(field.type)) return null;
+         return field.numLength || field.datePrecision || field.charLength || 0;
+      },
       keyName (key) {
          switch (key) {
             case 'pri':