fix: correct insert column button
This commit is contained in:
parent
0903a24433
commit
de20681bce
73
src/App.tsx
73
src/App.tsx
@ -5,44 +5,49 @@ import TableMethodCodeBlock from './TableMethodCodeBlock';
|
||||
import { TableColumns } from './TableMethodGenerator';
|
||||
|
||||
function App() {
|
||||
let [columns, setColumns] = useState<TableColumns>([
|
||||
{
|
||||
name: "Miestas",
|
||||
field: "City",
|
||||
width: 10,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Atsakingas",
|
||||
field: "Manager",
|
||||
width: 20,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Vardas",
|
||||
field: "Name",
|
||||
width: 18,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Address",
|
||||
field: "Adress",
|
||||
width: 15,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Metai",
|
||||
field: "Year",
|
||||
width: 5,
|
||||
alignment: "right"
|
||||
}
|
||||
])
|
||||
let initialColumns: TableColumns = []
|
||||
|
||||
if (process.env.NODE_ENV === "development") {
|
||||
initialColumns = [
|
||||
{
|
||||
name: "Miestas",
|
||||
field: "City",
|
||||
width: 10,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Atsakingas",
|
||||
field: "Manager",
|
||||
width: 20,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Vardas",
|
||||
field: "Name",
|
||||
width: 18,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Address",
|
||||
field: "Adress",
|
||||
width: 15,
|
||||
alignment: "left"
|
||||
},
|
||||
{
|
||||
name: "Metai",
|
||||
field: "Year",
|
||||
width: 5,
|
||||
alignment: "right"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
let [columns, setColumns] = useState<TableColumns>(initialColumns)
|
||||
|
||||
// let [generatorOptions, setGeneratorOptions] = useState<TableMethodGeneratorOptions>({});
|
||||
|
||||
const onChange = (e: TableColumns) => {
|
||||
columns = e
|
||||
setColumns(e)
|
||||
setColumns([...e])
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -59,10 +59,12 @@ function TableDefinitionForm(props: TableDefinitionProps) {
|
||||
let [columns, setColumns] = useState<TableColumns>(props.value)
|
||||
|
||||
const addRow = () => {
|
||||
columns.push({ name: currentName })
|
||||
setCurrentName("")
|
||||
if (props.onChange !== undefined) {
|
||||
props.onChange(columns)
|
||||
if (currentName.length > 0) {
|
||||
columns.push({ name: currentName })
|
||||
setCurrentName("")
|
||||
if (props.onChange !== undefined) {
|
||||
props.onChange(columns)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -92,7 +94,7 @@ function TableDefinitionForm(props: TableDefinitionProps) {
|
||||
onChange={(e) => setCurrentName(e.target.value)}
|
||||
onKeyPress={(e) => e.key === "Enter" && addRow()}
|
||||
/>
|
||||
<button onClick={onClickCopy}>Insert column</button>
|
||||
<button onClick={addRow}>Insert column</button>
|
||||
<button onClick={onClickCopy}>Copy code 📋!</button>
|
||||
<ol>
|
||||
{columns.map((item, i) =>
|
||||
|
@ -11,12 +11,10 @@ interface Props {
|
||||
}
|
||||
|
||||
function TableMethodCodeBlock(props: Props) {
|
||||
let script = generate(props.columns, props.options)
|
||||
|
||||
return (
|
||||
<div>
|
||||
<SyntaxHighlighter language="csharp" style={vs2015}>
|
||||
{script}
|
||||
{generate(props.columns, props.options)}
|
||||
</SyntaxHighlighter>
|
||||
</div>
|
||||
)
|
||||
|
Loading…
Reference in New Issue
Block a user