function MainComponent() { const [selectedDirectory, setSelectedDirectory] = React.useState(''); const [selectedItem, setSelectedItem] = React.useState(null); const [directories, setDirectories] = React.useState({ wallets: [], contacts: [] }); const [showHidden, setShowHidden] = React.useState(false); const [isAdding, setIsAdding] = React.useState(false); const INITIAL_FORM = { id_wallet: undefined, type: "Наличные", name: "", balance: "", description: "", visibility: true, phoneNumber: "", address: "" }; const [form, setForm] = React.useState(INITIAL_FORM); const handleInputChange = (event)=>{ const { name, value, type, checked } = event.target; const finalValue = type === 'checkbox' ? checked : value; setForm((prevState)=>({ ...prevState, [name]: finalValue })); }; const generateID = ()=>'_' + Math.random().toString(36).substr(2, 9); const addItem = ()=>setIsAdding(true); const saveItem = ()=>{ const newDirectories = { ...directories }; if (selectedDirectory === 'wallets' && form.name && !isNaN(form.balance)) { const newWallet = { ...form, id_wallet: generateID() }; newDirectories.wallets.push(newWallet); } if (selectedDirectory === 'contacts' && form.name) { const newContact = { ...form, id_wallet: generateID() }; newDirectories.contacts.push(newContact); } setDirectories(newDirectories); setIsAdding(false); setForm(INITIAL_FORM); }; const cancelItem = ()=>{ setIsAdding(false); setForm(INITIAL_FORM); }; const toggleHidden = ()=>setShowHidden(!showHidden); const filteredDirectories = directories[selectedDirectory]?.filter((item)=>showHidden || item.visibility) || []; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#F7F7F7] min-h-screen p-4 flex", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-1/4 p-2", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { onClick: ()=>setSelectedDirectory('wallets'), className: "cursor-pointer", __source: { fileName: "", lineNumber: 58, columnNumber: 17 }, __self: this }, "Кошельки"), /*#__PURE__*/ React.createElement("div", { onClick: ()=>setSelectedDirectory('contacts'), className: "cursor-pointer", __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this }, "Контрагенты")), /*#__PURE__*/ React.createElement("div", { className: "w-1/2 p-2 flex flex-col", __source: { fileName: "", lineNumber: 61, columnNumber: 13 }, __self: this }, isAdding && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 63, columnNumber: 21 }, __self: this }, selectedDirectory === 'wallets' && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("select", { name: "type", value: form.type, onChange: handleInputChange, __source: { fileName: "", lineNumber: 66, columnNumber: 33 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "Наличные", __source: { fileName: "", lineNumber: 67, columnNumber: 37 }, __self: this }, "Наличные"), /*#__PURE__*/ React.createElement("option", { value: "Дебетовая карта", __source: { fileName: "", lineNumber: 68, columnNumber: 37 }, __self: this }, "Дебетовая карта"), /*#__PURE__*/ React.createElement("option", { value: "Кредитная карта", __source: { fileName: "", lineNumber: 69, columnNumber: 37 }, __self: this }, "Кредитная карта"), /*#__PURE__*/ React.createElement("option", { value: "Накопительный счёт", __source: { fileName: "", lineNumber: 70, columnNumber: 37 }, __self: this }, "Накопительный счёт"), /*#__PURE__*/ React.createElement("option", { value: "Депозит", __source: { fileName: "", lineNumber: 71, columnNumber: 37 }, __self: this }, "Депозит")), /*#__PURE__*/ React.createElement("input", { name: "name", type: "text", maxLength: "200", value: form.name, onChange: handleInputChange, placeholder: "Наименование", __source: { fileName: "", lineNumber: 73, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "balance", type: "number", step: "0.01", value: form.balance, onChange: handleInputChange, placeholder: "Баланс", __source: { fileName: "", lineNumber: 74, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("textarea", { name: "description", maxLength: "1000", value: form.description, onChange: handleInputChange, placeholder: "Описание", __source: { fileName: "", lineNumber: 75, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "visibility", type: "checkbox", checked: form.visibility, onChange: handleInputChange, __source: { fileName: "", lineNumber: 76, columnNumber: 33 }, __self: this })), selectedDirectory === 'contacts' && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("input", { name: "name", type: "text", maxLength: "100", value: form.name, onChange: handleInputChange, placeholder: "Имя", __source: { fileName: "", lineNumber: 81, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "phoneNumber", type: "tel", maxLength: "10", value: form.phoneNumber, onChange: handleInputChange, placeholder: "Телефон", __source: { fileName: "", lineNumber: 82, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "address", type: "text", maxLength: "300", value: form.address, onChange: handleInputChange, placeholder: "Адрес", __source: { fileName: "", lineNumber: 83, columnNumber: 33 }, __self: this }), /*#__PURE__*/ React.createElement("input", { name: "balance", type: "number", step: "0.01", value: form.balance, onChange: handleInputChange, placeholder: "Баланс", __source: { fileName: "", lineNumber: 84, columnNumber: 33 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: saveItem, __source: { fileName: "", lineNumber: 87, columnNumber: 25 }, __self: this }, "Записать"), /*#__PURE__*/ React.createElement("button", { onClick: cancelItem, __source: { fileName: "", lineNumber: 88, columnNumber: 25 }, __self: this }, "Отменить")), !isAdding && selectedDirectory && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 92, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: addItem, __source: { fileName: "", lineNumber: 93, columnNumber: 25 }, __self: this }, "Добавить"), /*#__PURE__*/ React.createElement("button", { onClick: toggleHidden, __source: { fileName: "", lineNumber: 94, columnNumber: 25 }, __self: this }, showHidden ? 'Не показывать скрытые' : 'Показать скрытые'), /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 95, columnNumber: 25 }, __self: this }, filteredDirectories.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, onClick: ()=>setSelectedItem(item), __source: { fileName: "", lineNumber: 97, columnNumber: 33 }, __self: this }, item.name))))), /*#__PURE__*/ React.createElement("div", { className: "w-1/4 p-2", __source: { fileName: "", lineNumber: 105, columnNumber: 13 }, __self: this }, selectedItem && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 107, columnNumber: 21 }, __self: this }, selectedDirectory === 'wallets' && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 110, columnNumber: 33 }, __self: this }, "Тип: ", selectedItem.type), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 111, columnNumber: 33 }, __self: this }, "Наименование: ", selectedItem.name), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 112, columnNumber: 33 }, __self: this }, "Баланс: ", selectedItem.balance), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 113, columnNumber: 33 }, __self: this }, "Описание: ", selectedItem.description), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 114, columnNumber: 33 }, __self: this }, "Видимость: ", selectedItem.visibility ? 'Да' : 'Нет')), selectedDirectory === 'contacts' && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 119, columnNumber: 33 }, __self: this }, "Имя: ", selectedItem.name), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 120, columnNumber: 33 }, __self: this }, "Телефон: ", selectedItem.phoneNumber), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 121, columnNumber: 33 }, __self: this }, "Адрес: ", selectedItem.address), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 122, columnNumber: 33 }, __self: this }, "Баланс: ", selectedItem.balance))))); }