diff --git a/.drone.yml b/.drone.yml new file mode 100644 index 0000000..5b73f4d --- /dev/null +++ b/.drone.yml @@ -0,0 +1,57 @@ +kind: pipeline +type: docker +name: deploy-backoffice + +trigger: + branch: + - master + +steps: + - name: deploying-project + image: alpine + environment: + SSH_USERNAME: + from_secret: ssh_username + SSH_HOSTNAME: + from_secret: ssh_hostname + SSH_PRIVATE_KEY: + from_secret: ssh_id_rsa + commands: + - apk add --no-cache rsync openssh + - mkdir -p ~/.ssh + - echo "$SSH_PRIVATE_KEY" > ~/.ssh/id_rsa + - chmod 600 ~/.ssh/id_rsa + - | + rsync -avz --delete \ + -e "ssh -o StrictHostKeyChecking=no -i ~/.ssh/id_rsa" \ + ./ $SSH_USERNAME@$SSH_HOSTNAME:/var/www/${DRONE_REPO_OWNER}/${DRONE_REPO_NAME} \ + --exclude .git \ + --exclude node_modules \ + --exclude .drone.yml + when: + branch: + - master + event: + - push + + - name: restarting-project + image: alpine + environment: + SSH_USERNAME: + from_secret: ssh_username + SSH_HOSTNAME: + from_secret: ssh_hostname + SSH_PRIVATE_KEY: + from_secret: ssh_id_rsa + commands: + - apk add --no-cache openssh + - mkdir -p ~/.ssh + - echo "$SSH_PRIVATE_KEY" > ~/.ssh/id_rsa + - chmod 600 ~/.ssh/id_rsa + - CONTAINER_NAME="${DRONE_REPO_OWNER}_${DRONE_REPO_NAME}" + - ssh -o StrictHostKeyChecking=no -i ~/.ssh/id_rsa $SSH_USERNAME@$SSH_HOSTNAME "docker restart $CONTAINER_NAME" + when: + branch: + - develop + event: + - push diff --git a/.idea/php.xml b/.idea/php.xml index 2b95591..f324872 100644 --- a/.idea/php.xml +++ b/.idea/php.xml @@ -1,5 +1,15 @@ + + + + + + diff --git a/package.json b/package.json index ca814d2..6c1f413 100644 --- a/package.json +++ b/package.json @@ -7,8 +7,8 @@ "@testing-library/jest-dom": "^6.9.1", "@testing-library/react": "^16.3.0", "@testing-library/user-event": "^13.5.0", - "react": "^19.2.0", - "react-dom": "^19.2.0", + "react": "18.2.0", + "react-dom": "18.2.0", "react-scripts": "5.0.1", "web-vitals": "^2.1.4" }, diff --git a/public/favicon.ico b/public/favicon.ico deleted file mode 100644 index a11777c..0000000 Binary files a/public/favicon.ico and /dev/null differ diff --git a/public/index.html b/public/index.html index aa069f2..56605a3 100644 --- a/public/index.html +++ b/public/index.html @@ -1,43 +1,20 @@ - + - + - - - - - React App + + + Request Scheduler - Panel de Control
- - + \ No newline at end of file diff --git a/public/logo192.png b/public/logo192.png deleted file mode 100644 index fc44b0a..0000000 Binary files a/public/logo192.png and /dev/null differ diff --git a/public/logo512.png b/public/logo512.png deleted file mode 100644 index a4e47a6..0000000 Binary files a/public/logo512.png and /dev/null differ diff --git a/public/manifest.json b/public/manifest.json deleted file mode 100644 index 080d6c7..0000000 --- a/public/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/public/robots.txt b/public/robots.txt deleted file mode 100644 index e9e57dc..0000000 --- a/public/robots.txt +++ /dev/null @@ -1,3 +0,0 @@ -# https://www.robotstxt.org/robotstxt.html -User-agent: * -Disallow: diff --git a/src/App.css b/src/App.css deleted file mode 100644 index 74b5e05..0000000 --- a/src/App.css +++ /dev/null @@ -1,38 +0,0 @@ -.App { - text-align: center; -} - -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - -.App-link { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} diff --git a/src/App.js b/src/App.js index 3784575..cba1eaf 100644 --- a/src/App.js +++ b/src/App.js @@ -1,23 +1,31 @@ -import logo from './logo.svg'; -import './App.css'; +import React, { useState } from 'react'; +import './styles/globals.css'; +import { Sidebar, Header } from './components/Layout'; +import { DashboardCards } from './components/Dashboard'; +import RequestTable from './components/Requests/RequestTable'; +import RequestForm from './components/Requests/RequestForm'; function App() { + const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); + + const handleToggleMobileMenu = () => setIsMobileMenuOpen(!isMobileMenuOpen); + return ( -
-
- logo -

- Edit src/App.js and save to reload. -

- - Learn React - -
+
+ +
+
+
+ +
+ + +
+
+
); } diff --git a/src/App.test.js b/src/App.test.js deleted file mode 100644 index 1f03afe..0000000 --- a/src/App.test.js +++ /dev/null @@ -1,8 +0,0 @@ -import { render, screen } from '@testing-library/react'; -import App from './App'; - -test('renders learn react link', () => { - render(); - const linkElement = screen.getByText(/learn react/i); - expect(linkElement).toBeInTheDocument(); -}); diff --git a/src/components/Dashboard/DashboardCards.js b/src/components/Dashboard/DashboardCards.js new file mode 100644 index 0000000..1c7adc7 --- /dev/null +++ b/src/components/Dashboard/DashboardCards.js @@ -0,0 +1,58 @@ +import React from 'react'; +import StatsCard from './StatsCard'; +import '../../styles/components.css'; + +const DashboardCards = () => { + const statsData = [ + { + type: 'primary', + value: '42', + title: 'Solicitudes Programadas', + trend: '12% desde la semana pasada', + trendDirection: 'up', + icon: 'fas fa-clock' + }, + { + type: 'warning', + value: '28', + title: 'Solicitudes Pendientes', + trend: '5% desde ayer', + trendDirection: 'down', + icon: 'fas fa-hourglass-half' + }, + { + type: 'success', + value: '156', + title: 'Solicitudes Ejecutadas', + trend: '8% desde ayer', + trendDirection: 'up', + icon: 'fas fa-check-circle' + }, + { + type: 'danger', + value: '12', + title: 'Solicitudes Fallidas', + trend: '3% desde ayer', + trendDirection: 'down', + icon: 'fas fa-exclamation-circle' + } + ]; + + return ( +
+ {statsData.map((stat, index) => ( + + ))} +
+ ); +}; + +export default DashboardCards; \ No newline at end of file diff --git a/src/components/Dashboard/StatsCard.js b/src/components/Dashboard/StatsCard.js new file mode 100644 index 0000000..754ff92 --- /dev/null +++ b/src/components/Dashboard/StatsCard.js @@ -0,0 +1,23 @@ +import React from 'react'; +import '../../styles/components.css'; + +const StatsCard = ({ type, value, title, trend, trendDirection, icon }) => { + return ( +
+
+
+
{value}
+
{title}
+
+ {trend} +
+
+
+ +
+
+
+ ); +}; + +export default StatsCard; \ No newline at end of file diff --git a/src/components/Dashboard/index.js b/src/components/Dashboard/index.js new file mode 100644 index 0000000..af9a7b6 --- /dev/null +++ b/src/components/Dashboard/index.js @@ -0,0 +1,2 @@ +export { default as DashboardCards } from './DashboardCards'; +export { default as StatsCard } from './StatsCard'; \ No newline at end of file diff --git a/src/components/Layout/Header.js b/src/components/Layout/Header.js new file mode 100644 index 0000000..e976bbe --- /dev/null +++ b/src/components/Layout/Header.js @@ -0,0 +1,24 @@ +import React from 'react'; +import '../../styles/components.css'; + +const Header = () => { + return ( +
+
+ + Dashboard +
+
+
+ + +
+ +
+
+ ); +}; + +export default Header; \ No newline at end of file diff --git a/src/components/Layout/Sidebar.js b/src/components/Layout/Sidebar.js new file mode 100644 index 0000000..d9f46c7 --- /dev/null +++ b/src/components/Layout/Sidebar.js @@ -0,0 +1,69 @@ +import React from 'react'; +import '../../styles/components.css'; + +const Sidebar = ({ isMobileMenuOpen, onToggleMobileMenu }) => { + const navItems = [ + { icon: 'fas fa-tachometer-alt', label: 'Dashboard', active: true, badge: null }, + { icon: 'fas fa-list', label: 'Solicitudes Programadas', active: false, badge: '12' }, + { icon: 'fas fa-plus-circle', label: 'Crear Solicitud', active: false, badge: null }, + { icon: 'fas fa-history', label: 'Historial', active: false, badge: null }, + { icon: 'fas fa-cog', label: 'Configuración', active: false, badge: null }, + { icon: 'fas fa-question-circle', label: 'Ayuda', active: false, badge: null } + ]; + + return ( + <> + + + + + ); +}; + +export default Sidebar; \ No newline at end of file diff --git a/src/components/Layout/index.js b/src/components/Layout/index.js new file mode 100644 index 0000000..6f49f69 --- /dev/null +++ b/src/components/Layout/index.js @@ -0,0 +1,2 @@ +export { default as Sidebar } from './Sidebar'; +export { default as Header } from './Header'; \ No newline at end of file diff --git a/src/components/Requests/RequestForm.js b/src/components/Requests/RequestForm.js new file mode 100644 index 0000000..136e1b2 --- /dev/null +++ b/src/components/Requests/RequestForm.js @@ -0,0 +1,127 @@ +import React, { useState } from 'react'; +import '../../styles/components.css'; + +const RequestForm = () => { + const [formData, setFormData] = useState({ + url: '', + method: 'POST', + headers: '', + body: '', + executeDate: '', + executeTime: '' + }); + + const handleChange = (e) => { + const { name, value } = e.target; + setFormData((prev) => ({ ...prev, [name]: value })); + }; + + const handleSubmit = (e) => { + e.preventDefault(); + + // Aquí podrías enviar los datos al backend + // console.log('Form data', formData); + + // Mostrar notificación de éxito + const notification = document.createElement('div'); + notification.textContent = 'Solicitud guardada correctamente'; + notification.style.cssText = ` + position: fixed; + top: 20px; + right: 20px; + background: var(--success); + color: white; + padding: 12px 16px; + border-radius: 8px; + box-shadow: var(--shadow); + z-index: 2000; + `; + document.body.appendChild(notification); + setTimeout(() => notification.remove(), 2500); + }; + + return ( +
+
+

Nueva Solicitud

+
+
+
+ + +
+ +
+
+ + +
+
+ + +
+
+ + +
+
+ +
+ +