Componente formulario
Creación del componente del formulario de registro del administrador del sistema
This commit is contained in:
parent
fd98551f47
commit
d41d9e8c55
|
@ -28,6 +28,7 @@ import TreeDemo from './components/TreeDemo';
|
|||
import InvalidStateDemo from './components/InvalidStateDemo';
|
||||
import BlocksDemo from './components/BlocksDemo';
|
||||
import IconsDemo from './components/IconsDemo';
|
||||
import FormAdminSistema from './components/FormAdminSistema';
|
||||
|
||||
import Crud from './pages/Crud';
|
||||
import EmptyPage from './pages/EmptyPage';
|
||||
|
@ -159,9 +160,10 @@ const App = () => {
|
|||
const menu = [
|
||||
{
|
||||
label: 'Home',
|
||||
items: [{
|
||||
label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/'
|
||||
}]
|
||||
items: [
|
||||
{label: 'Dashboard', icon: 'pi pi-fw pi-home', to: '/'},
|
||||
{label: 'Registro admin sistema', icon: 'pi pi-fw pi-id-card', to: '/formAdminSistema'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'UI Components', icon: 'pi pi-fw pi-sitemap',
|
||||
|
@ -320,6 +322,7 @@ const App = () => {
|
|||
<Route path="/crud" component={Crud} />
|
||||
<Route path="/empty" component={EmptyPage} />
|
||||
<Route path="/documentation" component={Documentation} />
|
||||
<Route path="/formAdminSistema" component={FormAdminSistema} />
|
||||
</div>
|
||||
|
||||
<AppFooter layoutColorMode={layoutColorMode} />
|
||||
|
|
|
@ -0,0 +1,56 @@
|
|||
import React, { useState } from 'react';
|
||||
import { InputText } from 'primereact/inputtext';
|
||||
import { Button } from 'primereact/button';
|
||||
import { InputTextarea } from 'primereact/inputtextarea';
|
||||
import { Dropdown } from 'primereact/dropdown';
|
||||
|
||||
const FormAdminSistema = () => {
|
||||
const [dropdownItem, setDropdownItem] = useState(null);
|
||||
const dropdownItems = [
|
||||
{ name: 'Option 1', code: 'Option 1' },
|
||||
{ name: 'Option 2', code: 'Option 2' },
|
||||
{ name: 'Option 3', code: 'Option 3' }
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="grid">
|
||||
<div className="col-12">
|
||||
<div className="card">
|
||||
<h5>Advanced</h5>
|
||||
<div className="p-fluid formgrid grid">
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="firstname2">Firstname</label>
|
||||
<InputText id="firstname2" type="text" />
|
||||
</div>
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="lastname2">Lastname</label>
|
||||
<InputText id="lastname2" type="text" />
|
||||
</div>
|
||||
<div className="field col-12">
|
||||
<label htmlFor="address">Address</label>
|
||||
<InputTextarea id="address" rows="4" />
|
||||
</div>
|
||||
<div className="field col-12 md:col-6">
|
||||
<label htmlFor="city">City</label>
|
||||
<InputText id="city" type="text" />
|
||||
</div>
|
||||
<div className="field col-12 md:col-3">
|
||||
<label htmlFor="state">State</label>
|
||||
<Dropdown id="state" value={dropdownItem} onChange={(e) => setDropdownItem(e.value)} options={dropdownItems} optionLabel="name" placeholder="Select One"></Dropdown>
|
||||
</div>
|
||||
<div className="field col-12 md:col-3">
|
||||
<label htmlFor="zip">Zip</label>
|
||||
<InputText id="zip" type="text" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const comparisonFn = function (prevProps, nextProps) {
|
||||
return prevProps.location.pathname === nextProps.location.pathname;
|
||||
};
|
||||
|
||||
export default React.memo(FormAdminSistema, comparisonFn);
|
Loading…
Reference in New Issue