mirrors/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2025-04-25 17:26:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

feat(ui): added c-select in the ui lib (#550)

Browse source 
* feat(ui): added c-select in the ui lib

* refactor(ui): switched n-select to c-select
This commit is contained in:
Corentin THOMASSET 2023-08-07 17:30:00 +02:00 • committed by GitHub
parent 6498c9b0fa
commit dfa1ba8554
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
29 changed files with 666 additions and 199 deletions
Download patch file Download diff file Expand all files Collapse all files

80
src/tools/sql-prettify/sql-prettify.vue
View file

@ -19,47 +19,45 @@ const prettySQL = computed(() => formatSQL(rawSQL.value, config));
<template>
<div style="flex: 0 0 100%">
<div mx-auto style="max-width: 600px" flex gap-2 :class="{ 'flex-col': styleStore.isSmallScreen }">
<n-form-item label="Dialect" label-width="500" flex-1>
<n-select
v-model:value="config.language"
:options="[
{ label: 'GCP BigQuery', value: 'bigquery' },
{ label: 'IBM DB2', value: 'db2' },
{ label: 'Apache Hive', value: 'hive' },
{ label: 'MariaDB', value: 'mariadb' },
{ label: 'MySQL', value: 'mysql' },
{ label: 'Couchbase N1QL', value: 'n1ql' },
{ label: 'Oracle PL/SQL', value: 'plsql' },
{ label: 'PostgreSQL', value: 'postgresql' },
{ label: 'Amazon Redshift', value: 'redshift' },
{ label: 'Spark', value: 'spark' },
{ label: 'Standard SQL', value: 'sql' },
{ label: 'sqlite', value: 'sqlite' },
{ label: 'SQL Server Transact-SQL', value: 'tsql' },
]"
/>
</n-form-item>
<n-form-item label="Keyword case" flex-1>
<n-select
v-model:value="config.keywordCase"
:options="[
{ label: 'UPPERCASE', value: 'upper' },
{ label: 'lowercase', value: 'lower' },
{ label: 'Preserve', value: 'preserve' },
]"
/>
</n-form-item>
<n-form-item label="Indent style" flex-1>
<n-select
v-model:value="config.indentStyle"
:options="[
{ label: 'Standard', value: 'standard' },
{ label: 'Tabular left', value: 'tabularLeft' },
{ label: 'Tabular right', value: 'tabularRight' },
]"
/>
</n-form-item>
<div style="max-width: 600px" :class="{ 'flex-col': styleStore.isSmallScreen }" mx-auto mb-5 flex gap-2>
<c-select
v-model:value="config.language"
flex-1
label="Dialect"
:options="[
{ label: 'GCP BigQuery', value: 'bigquery' },
{ label: 'IBM DB2', value: 'db2' },
{ label: 'Apache Hive', value: 'hive' },
{ label: 'MariaDB', value: 'mariadb' },
{ label: 'MySQL', value: 'mysql' },
{ label: 'Couchbase N1QL', value: 'n1ql' },
{ label: 'Oracle PL/SQL', value: 'plsql' },
{ label: 'PostgreSQL', value: 'postgresql' },
{ label: 'Amazon Redshift', value: 'redshift' },
{ label: 'Spark', value: 'spark' },
{ label: 'Standard SQL', value: 'sql' },
{ label: 'sqlite', value: 'sqlite' },
{ label: 'SQL Server Transact-SQL', value: 'tsql' },
]"
/>
<c-select
v-model:value="config.keywordCase" label="Keyword case"
flex-1
:options="[
{ label: 'UPPERCASE', value: 'upper' },
{ label: 'lowercase', value: 'lower' },
{ label: 'Preserve', value: 'preserve' },
]"
/>
<c-select
v-model:value="config.indentStyle" label="Indent style"
flex-1
:options="[
{ label: 'Standard', value: 'standard' },
{ label: 'Tabular left', value: 'tabularLeft' },
{ label: 'Tabular right', value: 'tabularRight' },
]"
/>
</div>
</div>