oceanhelm 0.0.5 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/oceanhelm.es.js +518 -482
- package/dist/oceanhelm.es.js.map +1 -1
- package/dist/oceanhelm.umd.js +1 -1
- package/dist/oceanhelm.umd.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/components/CrewManagement.vue +2 -2
- package/src/components/OceanHelmMaintenance.vue +5 -4
- package/src/components/VesselList.vue +85 -38
- package/src/utils/sidebarConfig.js +6 -0
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.v-left{margin-left:20px}.vessel-card{background:white;border-radius:10px;box-shadow:0 8px 16px #0069c026;transition:all .3s ease;margin-bottom:20px;overflow:hidden;border-left:4px solid var(--accent-color)}.vessel-card:hover{transform:translateY(-5px);box-shadow:0 12px 20px #0069c033}.vessel-icon{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;background-color:#e3f2fd;border-radius:10px;color:var(--accent-color);font-size:24px;margin-right:15px}.black{color:#000!important}.action-icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:20px;color:var(--accent-color);font-size:16px;margin-right:15px;margin-top:20px;margin-bottom:10px}.delete{background-color:var(--danger)}.edit{background-color:var(--success)}.vessel-status{display:inline-block;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:600}.status-active{background-color:#e8f5e9;color:#2e7d32}.status-maintenance{background-color:#fff8e1;color:#f57f17}.status-inactive{background-color:#f5f5f5;color:#757575}.page-header{margin-bottom:30px;border-bottom:1px solid #e0e0e0;padding-bottom:15px}.progress-container{margin-bottom:20px}.progress-bar{background-color:#e9ecef;border-radius:4px;height:10px;margin-top:8px}.progress-fill{background-color:#00a8e8;height:100%;border-radius:4px;transition:width .3s ease}.checklist{list-style-type:none;padding:0}.checklist-item{display:flex;align-items:center;padding:10px 0;border-bottom:1px solid #eee;cursor:pointer}.checkbox{margin-right:15px;width:20px;height:20px;border:2px solid #00a8e8;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.checkbox.checked{background-color:#00a8e8;color:#fff}.task-text{flex-grow:1}.task-text.completed{text-decoration:line-through;color:#6c757d}.status{margin-top:20px;font-weight:700;text-align:center}.reset-button{background-color:#005792;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;margin-top:20px;font-weight:700}.btn-outline-custom{color:#005792;border:2px solid #005792;background-color:transparent;padding:8px 16px;border-radius:4px;font-weight:500;cursor:pointer;transition:background-color .3s,color .3s}.btn-outline-custom:hover{background-color:#005792;color:#fff}.reset-button:hover{background-color:#003d5b}header{background-color:var(--maitprimary);color:#fff;padding:1rem;text-align:center;border-radius:5px 5px 0 0}.content{background-color:#fff;padding:20px;border-radius:0 0 5px 5px;box-shadow:0 2px 10px #0000001a}.form-section{display:none;animation:fadeIn .5s}.form-section.active{display:block}.form-row{margin-bottom:15px}.form-group{margin-bottom:20px}label{display:block;margin-bottom:5px;font-weight:700;color:var(--dark)}input,select,textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px}.input-group{display:flex;gap:10px}.input-group>div{flex:1}textarea{height:120px;resize:vertical}.btn-primary{background-color:var(--maitprimary);color:#fff}.btn-primary:hover{background-color:var(--dark)}.btn-success{background-color:var(--success);color:#fff}.btn-success:hover{background-color:#219653}.action-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.status-badge{display:inline-block;padding:5px 10px;border-radius:15px;font-size:14px;font-weight:700;color:#fff}.status-pending{background-color:var(--warning)}.status-progress{background-color:var(--accent)}.status-completed{background-color:var(--success)}.attachment-area{border:2px dashed #ddd;padding:20px;text-align:center;border-radius:5px;margin-bottom:20px}.file-input{display:none}.file-label{display:inline-block;padding:10px 20px;background-color:var(--accent);color:#fff;border-radius:4px;cursor:pointer;transition:background-color .3s}.file-label:hover{background-color:var(--maitsecondary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.form-section h3{margin-top:30px;margin-bottom:15px;color:var(--maitsecondary)}.checkbox-group{display:flex;flex-wrap:wrap;gap:15px;margin-top:10px}.checkbox-item{display:flex;align-items:center;gap:5px}.checkbox-item input{width:auto}.status-badge{padding:.3em .6em;border-radius:4px;color:#fff;font-weight:700;font-size:.85rem}.status-action{padding:.3em .6em;border-radius:4px;color:#fff;font-weight:700;font-size:.85rem;background-color:var(--maitprimary)}.status-badge.overdue{background-color:red}.task-table-wrapper{font-family:Inter,sans-serif;padding:1rem}.table-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.filters{display:flex;gap:.5rem;flex-wrap:wrap}.filters button,.filters input{padding:.5rem 1rem;border-radius:6px;border:1px solid #ccc;background-color:#f5f5f5;font-weight:500;cursor:pointer}.filters button.active{background-color:#002f6c;color:#fff}.filters input{border:1px solid #bbb}.filter-badge{background-color:#eee;color:#333}.table-controls>div:last-child button{padding:.5rem 1rem;border:1px solid var(--maitprimary);border-radius:6px;background-color:#fff;color:var(--maitprimary);font-weight:600;cursor:pointer;transition:background .2s}.table-controls>div:last-child button:last-child{background-color:var(--maitprimary);color:#fff}.task-table{width:100%;border-collapse:collapse;box-shadow:0 0 0 1px #ccc}.task-table thead{background-color:var(--maitprimary);color:#fff}.task-table th,.task-table td{padding:.75rem;text-align:left;border-bottom:1px solid #eee;white-space:pre-line}.task-table tbody tr:hover{background-color:#f9f9f9}.status-badge{padding:.3em .6em;border-radius:6px;font-weight:700;font-size:.85rem;color:#fff;display:inline-block;text-align:center;min-width:90px}.status-badge.complete{background-color:#4dffd0}.status-badge.soon{background-color:orange}.status-badge.completed{background-color:#4caf50}.delete-btn{background:none;border:none;color:#dc3545;cursor:pointer;padding:6px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;opacity:1;margin-left:8px;flex-shrink:0;transform:scale(1.1)}.checklist-item:hover .delete-btn{opacity:1}.delete-btn:hover{background-color:#dc3545;color:#fff;transform:scale(1.1)}.delete-btn:active{transform:scale(.95)}.print-only-container{text-align:center}.initial-print-btn{background:linear-gradient(135deg,#0066cc,#004499);color:#fff;border:none;padding:20px 40px;font-size:1.3em;border-radius:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 6px 20px #0066cc4d;display:flex;align-items:center;gap:15px;margin:0 auto}.initial-print-btn:hover{background:linear-gradient(135deg,#004499,#003366);transform:translateY(-3px);box-shadow:0 8px 25px #06c6}.initial-print-btn:active{transform:translateY(0)}.company-branding{margin-bottom:30px}.company-logo{font-size:3em;font-weight:700;color:#06c;margin-bottom:10px}.company-tagline{font-size:1.1em;color:#666}.report-container{display:none;max-width:900px;margin:0 auto;background:white;padding:30px;border-radius:10px;box-shadow:0 4px 15px #0000001a}.header{text-align:center;border-bottom:3px solid #0066cc;padding-bottom:20px;margin-bottom:30px}.report-logo{font-size:2.5em;font-weight:700;color:#06c;margin-bottom:10px}.report-title{font-size:1.8em;color:#333;margin:10px 0}.report-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.info-box{background:#f8f9fa;padding:15px;border-radius:8px;border-left:4px solid #0066cc}.info-box ul li{margin-left:15px}.info-label{font-weight:700;color:#06c;margin-bottom:5px}.section{margin-bottom:30px}.section-title{font-size:1.3em;font-weight:700;color:#06c;border-bottom:2px solid #e9ecef;padding-bottom:10px;margin-bottom:15px}.task-item{background:#f8f9fa;margin:15px 0;padding:20px;border-radius:8px;border-left:4px solid #28a745;box-shadow:0 2px 5px #0000001a}.task-item.pending{border-left-color:#ffc107}.task-item.overdue{border-left-color:#dc3545}.task-item.in-progress{border-left-color:#17a2b8}.task-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px;flex-wrap:wrap;gap:10px}.task-title{font-size:1.2em;font-weight:700;color:#333}.task-component{font-size:.9em;color:#666;margin-top:5px}.status-badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:.8em;font-weight:700;text-transform:uppercase}.status-completed{background:#d4edda;color:#155724}.status-pending{background:#fff3cd;color:#856404}.status-overdue{background:#f8d7da;color:#721c24}.status-in-progress{background:#d1ecf1;color:#0c5460}.task-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin:15px 0}.detail-label{font-weight:700;font-size:.85em;color:#06c;margin-bottom:3px}.detail-value{font-size:.95em;color:#333}.checklist-progress{margin-top:15px}.progress-bar{width:100%;height:20px;background:#e9ecef;border-radius:10px;overflow:hidden;margin:10px 0}.progress-fill{height:100%;background:linear-gradient(90deg,#28a745,#20c997);transition:width .3s ease}.checklist-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:10px}.checklist-item{display:flex;align-items:center;padding:8px;background:white;border-radius:5px;font-size:.9em}.checklist-icon{margin-right:8px;font-size:1.1em}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px;margin:20px 0}.summary-card{background:white;padding:20px;border-radius:8px;text-align:center;border:2px solid #e9ecef}.summary-number{font-size:2em;font-weight:700;color:#06c}.summary-label{font-size:.9em;color:#666;margin-top:5px}.signature-section{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:40px}.signature-box{padding-top:10px;text-align:center}.maintenance-type{display:inline-block;padding:4px 8px;border-radius:12px;font-size:.75em;font-weight:700;text-transform:uppercase;margin-left:10px}.type-corrective{background:#fff3cd;color:#856404}.type-preventive{background:#d4edda;color:#155724}.type-predictive{background:#d1ecf1;color:#0c5460}@media print{body{background:white;padding:0;display:block}.print-only-container{display:none!important}.report-container{display:block!important;box-shadow:none;padding:0;margin:0;max-width:none}}nav button{background-color:var(--maitsecondary);color:#fff;border:none;padding:10px 20px;margin:5px;cursor:pointer;font-weight:700;border-radius:3px;transition:background-color .3s}nav button:hover,nav button.active{background-color:var(--maitprimary)}.a-header{background:linear-gradient(135deg,var(--dashprimary-color),var(--dashsecondary-color));color:#fff;padding:2rem 0;margin-bottom:2rem;border-radius:12px;box-shadow:0 10px 30px #3499404d}.a-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;text-align:center}.a-header p{text-align:center;opacity:.9;font-size:1.1rem}.a-controls{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap;align-items:center}.a-search-box{flex:1;min-width:250px;position:relative}.a-search-box input{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:all .3s ease}.a-search-box input:focus{outline:none;border-color:var(--dashsecondary-color);box-shadow:0 0 0 3px #3499401a}.filter-select{padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;background:white;cursor:pointer;transition:all .3s ease}.filter-select:focus{outline:none;border-color:var(--dashsecondary-color);box-shadow:0 0 0 3px #3499401a}.btn{padding:12px 24px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 4px 12px #3499404d}.btn-secondary{background:var(--secondary);color:var(--dark)}.btn-secondary:hover{background:#e6a200;transform:translateY(-1px);box-shadow:0 4px 12px #f4b4004d}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:white;padding:1.5rem;border-radius:12px;box-shadow:0 4px 20px #0000000d;transition:transform .3s ease}.stat-card:hover{transform:translateY(-2px)}.stat-card h3{color:var(--gray);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem}.stat-card .value{font-size:2rem;font-weight:700;color:var(--dashsecondary-color)}.logs-container{background:white;border-radius:12px;box-shadow:0 4px 20px #0000000d;overflow:hidden}.logs-header{background:var(--light);padding:1.5rem;border-bottom:1px solid #e0e0e0}.logs-header h2{color:var(--dark);font-size:1.3rem;font-weight:600}.logs-table{width:100%;border-collapse:collapse}.logs-table th,.logs-table td{padding:1rem;text-align:left;border-bottom:1px solid #f0f0f0}.logs-table th{background:var(--light);font-weight:600;color:var(--dark);font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.logs-table tr:hover{background:#f8f9fa}.activity-badge{padding:4px 12px;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.badge-login{background:var(--success);color:#fff}.badge-logout{background:var(--gray);color:#fff}.badge-create{background:var(--dashprimary-color);color:#fff}.badge-update{background:var(--warning);color:#fff}.badge-delete{background:var(--danger);color:#fff}.badge-danger{color:var(--danger)}.badge-view{background:var(--maitsecondary);color:#fff}.pagination{display:flex;justify-content:center;align-items:center;gap:.5rem;padding:1.5rem;background:var(--light)}.pagination button{padding:8px 12px;border:1px solid #e0e0e0;background:white;border-radius:6px;cursor:pointer;transition:all .3s ease}.pagination button:hover,.pagination button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.pagination button:disabled{opacity:.5;cursor:not-allowed}.no-logs{text-align:center;padding:3rem;color:var(--gray)}.no-logs h3{font-size:1.5rem;margin-bottom:1rem}.loading{text-align:center;padding:3rem;color:var(--gray)}.spinner{border:3px solid #f3f3f3;border-top:3px solid var(--primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.a-controls{flex-direction:column;align-items:stretch}.a-search-box{min-width:100%}.stats-grid{grid-template-columns:1fr}.logs-table{font-size:.9rem}.logs-table th,.logs-table td{padding:.5rem}}.add-crew-form h2{color:#005792}.crew-section{margin-bottom:30px}.crew-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;margin-bottom:30px}.crew-card{background-color:#f8f9fa;border-radius:6px;padding:15px;box-shadow:0 1px 5px #00000014;border-left:4px solid #00a8e8;position:relative}.crew-card.unavailable{border-left-color:#dc3545;opacity:.8}.crew-name{font-weight:700;font-size:1.1em;margin-bottom:5px;color:#005792}.crew-role{color:#6c757d;font-size:.9em;margin-bottom:10px}.crew-certifications,.crew-availability{font-size:.85em;margin:5px 0}.certification-tag{display:inline-block;background-color:#e6f7ff;color:#005792;border-radius:4px;padding:2px 8px;margin-right:5px;margin-bottom:5px;font-size:.85em}.status-badge{position:absolute;top:15px;right:15px;font-size:.75em;padding:3px 8px;border-radius:12px;font-weight:700}.status-available{background-color:#d4edda;color:#155724}.status-unavailable{background-color:#f8d7da;color:#721c24}.status-onduty{background-color:#cce5ff;color:#004085}.action-buttons{display:flex;justify-content:space-between;margin-top:15px}.btn{padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s}.btn-primary{background-color:#005792;color:#fff}.btn-primary:hover{background-color:#004675}.btn-secondary{background-color:#e9ecef;color:#495057}.btn-secondary:hover{background-color:#dde2e6}.search-filter{display:flex;margin-bottom:20px;gap:10px}.search-filter input,.search-filter select{padding:8px 12px;border:1px solid #ced4da;border-radius:4px}.search-filter input{flex-grow:1}.search-filter select{width:30%}.add-crew-form{background-color:#f8f9fa;padding:20px;border-radius:6px;margin-top:30px}.form-row{display:flex;flex-wrap:wrap;gap:15px;margin-bottom:15px}.form-group{flex:1;min-width:200px}.form-group label{display:block;margin-bottom:5px;font-weight:700;color:#495057}.text-danger{color:red;font-weight:bolder}.text-warning{color:orange;font-weight:bolder}.text-success{color:green;font-weight:bolder}.icon{font-size:20px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:8px;border:1px solid #ced4da;border-radius:4px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.no-results{text-align:center;padding:20px;color:#6c757d}.crew-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.vcard{border-radius:6px;padding:5px}.s-container{max-width:1200px;margin:0 auto;background:rgba(255,255,255,.95);border-radius:20px;box-shadow:0 25px 50px #00000040;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:20px}.header h1{font-size:2.5rem;margin-bottom:10px;position:relative;z-index:1}.header p{font-size:1.1rem;opacity:.9;position:relative;z-index:1}.nav-tabs{display:flex;background:#f8fafc;border-bottom:2px solid #e2e8f0;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.nav-tabs::-webkit-scrollbar{height:6px}.nav-tabs::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.nav-tabs::-webkit-scrollbar-track{background:transparent}.nav-tab{flex:1;padding:15px 20px;background:none;border:none;cursor:pointer;font-size:1rem;font-weight:600;color:#64748b;transition:all .3s ease;position:relative}.nav-tab:hover{background:#e2e8f0;color:#1e40af}.nav-tab.active{color:#1e40af;background:white}.nav-tab.active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#1e40af}.tab-content{display:none;padding:30px;animation:fadeIn .5s ease-in}.tab-content.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px;margin-bottom:30px}.form-group{display:flex;flex-direction:column}.form-group label{font-weight:600;margin-bottom:8px;color:#374151;font-size:.95rem}.form-group input,.form-group select,.form-group textarea{padding:12px 15px;border:2px solid #e5e7eb;border-radius:10px;font-size:1rem;transition:all .3s ease;background:white}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-group textarea{min-height:100px;resize:vertical}.items-section{background:#f8fafc;border-radius:15px;padding:25px;margin:25px 0;border:2px solid #e2e8f0}.items-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.items-header h3{color:#1e40af;font-size:1.3rem}.add-item-btn{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s ease;box-shadow:0 4px 15px #10b9814d}.add-item-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #10b98166}.item-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:15px;align-items:end;margin-bottom:15px;padding:15px;background:white;border-radius:10px;border:1px solid #e5e7eb;transition:all .3s ease}.item-row:hover{box-shadow:0 4px 15px #0000001a}.marginbox{margin:10px}.item-list{list-style:none;padding:0;margin:.5rem 0}.item-list li{background:#f1f5f9;margin-bottom:.5rem;padding:.5rem .75rem;border-radius:.375rem;font-size:.95rem;color:#1e293b;display:flex;justify-content:space-between;align-items:center;content:"•";color:#3b82f6}.remove-item-btn{background:#ef4444;color:#fff;border:none;padding:8px 12px;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .3s ease}.remove-item-btn:hover{background:#dc2626;transform:scale(1.05)}.approval-actions{display:flex;gap:10px;margin-top:15px}.btn-approve{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-approve:hover{transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.btn-reject{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-reject:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ef44444d}.btn-request{background:linear-gradient(135deg,#ef9a44 0%,#fa920a 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-request:hover{transform:translateY(-1px);box-shadow:0 4px 12px #f0a2344d}.btn-create-po{background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-create-po:hover{transform:translateY(-1px);box-shadow:0 4px 12px #8b5cf64d}.btn-mark-delivered{background:linear-gradient(135deg,#06b6d4 0%,#0891b2 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-mark-delivered:hover{transform:translateY(-1px);box-shadow:0 4px 12px #06b6d44d}.po-info{background:#f8fafc;padding:15px;border-radius:8px;margin:10px 0;border:1px solid #e2e8f0}.po-info h4{color:#1e40af;margin-bottom:10px;font-size:1rem}.po-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;font-size:.9rem}.items-list{background:#f8fafc;padding:15px;border-radius:8px;margin:15px 0;border:1px solid #e2e8f0}.items-list h4{color:#374151;margin-bottom:10px;font-size:1rem}.item-detail{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e5e7eb}.item-detail:last-child{border-bottom:none}.comments-section{margin-top:15px}.comments-section textarea{width:100%;min-height:80px;padding:10px;border:1px solid #d1d5db;border-radius:6px;font-size:.9rem;resize:vertical}.role-badge{display:inline-block;padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-left:10px}.role-supervisor{background:#fef3c7;color:#92400e}.role-purchasing{background:#dbeafe;color:#1e40af}.role-receiving{background:#dcfce7;color:#166534}.status-badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-draft{background:#fef3c7;color:#92400e}.status-under-review{background:#dbeafe;color:#1e40af}.status-approved{background:#dcfce7;color:#166534}.status-declined{background:#fee2e2;color:#dc2626}.status-info-requested{background:#e8cf12;color:#da7212}.status-po-created{background:#e0e7ff;color:#4bca38}.status-pending-supply{background:#113fd8;color:#4bca38}.status-delivered{background:#f3e8ff;color:#7c3aed}.status-received{background:#ecfdf5;color:#065f46}.action-buttons{display:flex;gap:15px;justify-content:flex-end;margin-top:30px;padding-top:25px;border-top:2px solid #e5e7eb}.btn-primary-req{background:linear-gradient(135deg,#1e40af 0%,#3b82f6 100%);color:#fff;box-shadow:0 4px 15px #1e40af4d}.btn-primary-req:hover{transform:translateY(-2px);box-shadow:0 6px 20px #1e40af66}.btn-secondary{background:#6b7280;color:#fff}.btn-secondary:hover{background:#4b5563;transform:translateY(-2px)}.requisition-list{display:grid;gap:20px}.requisition-card{background:white;border-radius:15px;padding:25px;box-shadow:0 4px 15px #0000001a;border:1px solid #e5e7eb;transition:all .3s ease}.requisition-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #00000026}.requisition-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.requisition-id{font-size:1.2rem;font-weight:700;color:#1e40af}.requisition-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-top:15px}.detail-item{display:flex;flex-direction:column}.detail-label{font-size:.85rem;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.detail-value{font-size:1rem;color:#374151;font-weight:500}.workflow-steps{display:flex;justify-content:space-between;align-items:center;margin:30px 0;padding:20px;background:#f8fafc;border-radius:15px;border:2px solid #e2e8f0}.workflow-step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative}.workflow-step:not(:last-child):after{content:"";position:absolute;top:20px;right:-50%;width:100%;height:2px;background:#e5e7eb;z-index:1}.step-icon{width:40px;height:40px;border-radius:50%;background:#e5e7eb;display:flex;align-items:center;justify-content:center;font-weight:700;color:#6b7280;margin-bottom:10px;position:relative;z-index:2}.step-icon.active{background:#3b82f6;color:#fff}.step-icon.completed{background:#10b981;color:#fff}.step-title{font-size:.9rem;font-weight:600;color:#374151;text-align:center}@media (max-width: 768px){.form-grid{grid-template-columns:1fr}.item-row{grid-template-columns:1fr;gap:10px}.action-buttons{flex-direction:column}.workflow-steps{flex-direction:column;gap:20px}.workflow-step:after{display:none}}#content{width:100%;min-height:100vh;transition:all .3s;position:absolute;padding:20px 20px 20px 40px}#content.active{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}.po-content{padding:40px}.po-header{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:40px}.company-info,.po-details{background:#f8f9fa;padding:25px;border-radius:15px;border-left:5px solid #3498db}.company-info h3,.po-details h3{color:#2c3e50;margin-bottom:15px;font-size:1.3rem}.info-row{margin-bottom:8px;display:flex;justify-content:space-between}.info-label{font-weight:600;color:#555}.info-value{color:#2c3e50}.items-section{margin-top:30px}.section-title{color:#2c3e50;font-size:1.5rem;margin-bottom:20px;border-bottom:2px solid #3498db;padding-bottom:10px}.items-table{width:100%;border-collapse:collapse;margin-bottom:30px;background:white;border-radius:10px;overflow:hidden;box-shadow:0 5px 15px #0000001a}.items-table th{background:linear-gradient(135deg,#34495e 0%,#2c3e50 100%);color:#fff;padding:15px;text-align:left;font-weight:600}.items-table td{padding:15px;border-bottom:1px solid #eee;vertical-align:middle}.items-table tr:hover{background:#f8f9fa;transform:translateY(-1px);transition:all .3s ease}.price-input{padding:8px 12px;border:2px solid #ddd;border-radius:8px;font-size:14px;width:100px;transition:all .3s ease}.price-input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.price-changed{background:#fff3cd;border-color:#ffc107}.edit-btn{background:#3498db;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px;transition:all .3s ease}.edit-btn:hover{background:#2980b9;transform:translateY(-2px)}.save-btn{background:#27ae60;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px;margin-right:5px}.cancel-btn{background:#e74c3c;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px}.justification-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:white;padding:30px;border-radius:15px;max-width:500px;width:90%;box-shadow:0 20px 40px #0000004d}.modal-content h3{color:#2c3e50;margin-bottom:20px;font-size:1.3rem}.justification-textarea{width:100%;padding:15px;border:2px solid #ddd;border-radius:8px;font-family:inherit;font-size:14px;resize:vertical;min-height:100px}.justification-textarea:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.modal-buttons{margin-top:20px;display:flex;gap:10px;justify-content:flex-end}.totals{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);padding:25px;border-radius:15px;margin-top:20px}.total-row{display:flex;justify-content:space-between;margin-bottom:10px;font-size:1.1rem}.total-row.grand-total{border-top:2px solid #3498db;padding-top:15px;margin-top:15px;font-weight:700;font-size:1.3rem;color:#2c3e50}.justification-note{background:#fff3cd;border:1px solid #ffc107;border-radius:8px;padding:10px;margin-top:10px;font-size:12px;color:#856404}.price-change-indicator{background:#dc3545;color:#fff;border-radius:50%;width:20px;height:20px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;margin-left:5px}@media (max-width: 768px){.po-header{grid-template-columns:1fr;gap:20px}.items-table{font-size:14px}.items-table th,.items-table td{padding:10px 8px}.price-input{width:80px}}
|
|
1
|
+
.v-left{margin-left:20px}.vessel-card{background:white;border-radius:10px;box-shadow:0 8px 16px #0069c026;transition:all .3s ease;margin-bottom:20px;overflow:hidden;border-left:4px solid var(--accent-color)}.vessel-card:hover{transform:translateY(-5px);box-shadow:0 12px 20px #0069c033}.vessel-icon{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;background-color:#e3f2fd;border-radius:10px;color:var(--accent-color);font-size:24px;margin-right:15px}.black{color:#000!important}.action-icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:20px;color:var(--accent-color);font-size:16px;margin-right:15px;margin-top:20px;margin-bottom:10px}.delete{background-color:var(--danger)}.edit{background-color:var(--success)}.vessel-status{display:inline-block;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:600}.status-active{background-color:#e8f5e9;color:#2e7d32}.status-maintenance{background-color:#fff8e1;color:#f57f17}.status-inactive{background-color:#f5f5f5;color:#757575}.page-header{margin-bottom:30px;border-bottom:1px solid #e0e0e0;padding-bottom:15px}.a-header{background:linear-gradient(135deg,var(--dashprimary-color),var(--dashsecondary-color));color:#fff;padding:2rem 0;margin-bottom:2rem;border-radius:12px;box-shadow:0 10px 30px #3499404d}.a-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;text-align:center}.a-header p{text-align:center;opacity:.9;font-size:1.1rem}.a-controls{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap;align-items:center}.a-search-box{flex:1;min-width:250px;position:relative}.a-search-box input{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:all .3s ease}.a-search-box input:focus{outline:none;border-color:var(--dashsecondary-color);box-shadow:0 0 0 3px #3499401a}.filter-select{padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;background:white;cursor:pointer;transition:all .3s ease}.filter-select:focus{outline:none;border-color:var(--dashsecondary-color);box-shadow:0 0 0 3px #3499401a}.btn{padding:12px 24px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:0 4px 12px #3499404d}.btn-secondary{background:var(--secondary);color:var(--dark)}.btn-secondary:hover{background:#e6a200;transform:translateY(-1px);box-shadow:0 4px 12px #f4b4004d}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:white;padding:1.5rem;border-radius:12px;box-shadow:0 4px 20px #0000000d;transition:transform .3s ease}.stat-card:hover{transform:translateY(-2px)}.stat-card h3{color:var(--gray);font-size:.9rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem}.stat-card .value{font-size:2rem;font-weight:700;color:var(--dashsecondary-color)}.logs-container{background:white;border-radius:12px;box-shadow:0 4px 20px #0000000d;overflow:hidden}.logs-header{background:var(--light);padding:1.5rem;border-bottom:1px solid #e0e0e0}.logs-header h2{color:var(--dark);font-size:1.3rem;font-weight:600}.logs-table{width:100%;border-collapse:collapse}.logs-table th,.logs-table td{padding:1rem;text-align:left;border-bottom:1px solid #f0f0f0}.logs-table th{background:var(--light);font-weight:600;color:var(--dark);font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.logs-table tr:hover{background:#f8f9fa}.activity-badge{padding:4px 12px;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.badge-login{background:var(--success);color:#fff}.badge-logout{background:var(--gray);color:#fff}.badge-create{background:var(--dashprimary-color);color:#fff}.badge-update{background:var(--warning);color:#fff}.badge-delete{background:var(--danger);color:#fff}.badge-danger{color:var(--danger)}.badge-view{background:var(--maitsecondary);color:#fff}.pagination{display:flex;justify-content:center;align-items:center;gap:.5rem;padding:1.5rem;background:var(--light)}.pagination button{padding:8px 12px;border:1px solid #e0e0e0;background:white;border-radius:6px;cursor:pointer;transition:all .3s ease}.pagination button:hover,.pagination button.active{background:var(--primary);color:#fff;border-color:var(--primary)}.pagination button:disabled{opacity:.5;cursor:not-allowed}.no-logs{text-align:center;padding:3rem;color:var(--gray)}.no-logs h3{font-size:1.5rem;margin-bottom:1rem}.loading{text-align:center;padding:3rem;color:var(--gray)}.spinner{border:3px solid #f3f3f3;border-top:3px solid var(--primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.a-controls{flex-direction:column;align-items:stretch}.a-search-box{min-width:100%}.stats-grid{grid-template-columns:1fr}.logs-table{font-size:.9rem}.logs-table th,.logs-table td{padding:.5rem}}.add-crew-form h2{color:#005792}.crew-section{margin-bottom:30px}.crew-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;margin-bottom:30px}.crew-card{background-color:#f8f9fa;border-radius:6px;padding:15px;box-shadow:0 1px 5px #00000014;border-left:4px solid #00a8e8;position:relative}.crew-card.unavailable{border-left-color:#dc3545;opacity:.8}.crew-name{font-weight:700;font-size:1.1em;margin-bottom:5px;color:#005792}.crew-role{color:#6c757d;font-size:.9em;margin-bottom:10px}.crew-certifications,.crew-availability{font-size:.85em;margin:5px 0}.certification-tag{display:inline-block;background-color:#e6f7ff;color:#005792;border-radius:4px;padding:2px 8px;margin-right:5px;margin-bottom:5px;font-size:.85em}.crew-status-badge{position:absolute;top:15px;right:15px;font-size:.75em;padding:3px 8px;border-radius:12px;font-weight:700}.status-available{background-color:#d4edda;color:#155724}.status-unavailable{background-color:#f8d7da;color:#721c24}.status-onduty{background-color:#cce5ff;color:#004085}.action-buttons{display:flex;justify-content:space-between;margin-top:15px}.btn{padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .2s}.btn-primary{background-color:#005792;color:#fff}.btn-primary:hover{background-color:#004675}.btn-secondary{background-color:#e9ecef;color:#495057}.btn-secondary:hover{background-color:#dde2e6}.search-filter{display:flex;margin-bottom:20px;gap:10px}.search-filter input,.search-filter select{padding:8px 12px;border:1px solid #ced4da;border-radius:4px}.search-filter input{flex-grow:1}.search-filter select{width:30%}.add-crew-form{background-color:#f8f9fa;padding:20px;border-radius:6px;margin-top:30px}.form-row{display:flex;flex-wrap:wrap;gap:15px;margin-bottom:15px}.form-group{flex:1;min-width:200px}.form-group label{display:block;margin-bottom:5px;font-weight:700;color:#495057}.text-danger{color:red;font-weight:bolder}.text-warning{color:orange;font-weight:bolder}.text-success{color:green;font-weight:bolder}.icon{font-size:20px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:8px;border:1px solid #ced4da;border-radius:4px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.no-results{text-align:center;padding:20px;color:#6c757d}.crew-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.vcard{border-radius:6px;padding:5px}.s-container{max-width:1200px;margin:0 auto;background:rgba(255,255,255,.95);border-radius:20px;box-shadow:0 25px 50px #00000040;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:20px}.header h1{font-size:2.5rem;margin-bottom:10px;position:relative;z-index:1}.header p{font-size:1.1rem;opacity:.9;position:relative;z-index:1}.nav-tabs{display:flex;background:#f8fafc;border-bottom:2px solid #e2e8f0;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.nav-tabs::-webkit-scrollbar{height:6px}.nav-tabs::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.nav-tabs::-webkit-scrollbar-track{background:transparent}.nav-tab{flex:1;padding:15px 20px;background:none;border:none;cursor:pointer;font-size:1rem;font-weight:600;color:#64748b;transition:all .3s ease;position:relative}.nav-tab:hover{background:#e2e8f0;color:#1e40af}.nav-tab.active{color:#1e40af;background:white}.nav-tab.active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#1e40af}.tab-content{display:none;padding:30px;animation:fadeIn .5s ease-in}.tab-content.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px;margin-bottom:30px}.form-group{display:flex;flex-direction:column}.form-group label{font-weight:600;margin-bottom:8px;color:#374151;font-size:.95rem}.form-group input,.form-group select,.form-group textarea{padding:12px 15px;border:2px solid #e5e7eb;border-radius:10px;font-size:1rem;transition:all .3s ease;background:white}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-group textarea{min-height:100px;resize:vertical}.items-section{background:#f8fafc;border-radius:15px;padding:25px;margin:25px 0;border:2px solid #e2e8f0}.items-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.items-header h3{color:#1e40af;font-size:1.3rem}.add-item-btn{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;border:none;padding:10px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s ease;box-shadow:0 4px 15px #10b9814d}.add-item-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #10b98166}.item-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:15px;align-items:end;margin-bottom:15px;padding:15px;background:white;border-radius:10px;border:1px solid #e5e7eb;transition:all .3s ease}.item-row:hover{box-shadow:0 4px 15px #0000001a}.marginbox{margin:10px}.item-list{list-style:none;padding:0;margin:.5rem 0}.item-list li{background:#f1f5f9;margin-bottom:.5rem;padding:.5rem .75rem;border-radius:.375rem;font-size:.95rem;color:#1e293b;display:flex;justify-content:space-between;align-items:center;content:"•";color:#3b82f6}.remove-item-btn{background:#ef4444;color:#fff;border:none;padding:8px 12px;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .3s ease}.remove-item-btn:hover{background:#dc2626;transform:scale(1.05)}.approval-actions{display:flex;gap:10px;margin-top:15px}.btn-approve{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-approve:hover{transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.btn-reject{background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-reject:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ef44444d}.btn-request{background:linear-gradient(135deg,#ef9a44 0%,#fa920a 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-request:hover{transform:translateY(-1px);box-shadow:0 4px 12px #f0a2344d}.btn-create-po{background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-create-po:hover{transform:translateY(-1px);box-shadow:0 4px 12px #8b5cf64d}.btn-mark-delivered{background:linear-gradient(135deg,#06b6d4 0%,#0891b2 100%);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .3s ease}.btn-mark-delivered:hover{transform:translateY(-1px);box-shadow:0 4px 12px #06b6d44d}.po-info{background:#f8fafc;padding:15px;border-radius:8px;margin:10px 0;border:1px solid #e2e8f0}.po-info h4{color:#1e40af;margin-bottom:10px;font-size:1rem}.po-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;font-size:.9rem}.items-list{background:#f8fafc;padding:15px;border-radius:8px;margin:15px 0;border:1px solid #e2e8f0}.items-list h4{color:#374151;margin-bottom:10px;font-size:1rem}.item-detail{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e5e7eb}.item-detail:last-child{border-bottom:none}.comments-section{margin-top:15px}.comments-section textarea{width:100%;min-height:80px;padding:10px;border:1px solid #d1d5db;border-radius:6px;font-size:.9rem;resize:vertical}.role-badge{display:inline-block;padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-left:10px}.role-supervisor{background:#fef3c7;color:#92400e}.role-purchasing{background:#dbeafe;color:#1e40af}.role-receiving{background:#dcfce7;color:#166534}.status-badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-draft{background:#fef3c7;color:#92400e}.status-under-review{background:#dbeafe;color:#1e40af}.status-approved{background:#dcfce7;color:#166534}.status-declined{background:#fee2e2;color:#dc2626}.status-info-requested{background:#e8cf12;color:#da7212}.status-po-created{background:#e0e7ff;color:#4bca38}.status-pending-supply{background:#113fd8;color:#4bca38}.status-delivered{background:#f3e8ff;color:#7c3aed}.status-received{background:#ecfdf5;color:#065f46}.action-buttons{display:flex;gap:15px;justify-content:flex-end;margin-top:30px;padding-top:25px;border-top:2px solid #e5e7eb}.btn-primary-req{background:linear-gradient(135deg,#1e40af 0%,#3b82f6 100%);color:#fff;box-shadow:0 4px 15px #1e40af4d}.btn-primary-req:hover{transform:translateY(-2px);box-shadow:0 6px 20px #1e40af66}.btn-secondary{background:#6b7280;color:#fff}.btn-secondary:hover{background:#4b5563;transform:translateY(-2px)}.requisition-list{display:grid;gap:20px}.requisition-card{background:white;border-radius:15px;padding:25px;box-shadow:0 4px 15px #0000001a;border:1px solid #e5e7eb;transition:all .3s ease}.requisition-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #00000026}.requisition-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.requisition-id{font-size:1.2rem;font-weight:700;color:#1e40af}.requisition-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-top:15px}.detail-item{display:flex;flex-direction:column}.detail-label{font-size:.85rem;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.detail-value{font-size:1rem;color:#374151;font-weight:500}.workflow-steps{display:flex;justify-content:space-between;align-items:center;margin:30px 0;padding:20px;background:#f8fafc;border-radius:15px;border:2px solid #e2e8f0}.workflow-step{display:flex;flex-direction:column;align-items:center;flex:1;position:relative}.workflow-step:not(:last-child):after{content:"";position:absolute;top:20px;right:-50%;width:100%;height:2px;background:#e5e7eb;z-index:1}.step-icon{width:40px;height:40px;border-radius:50%;background:#e5e7eb;display:flex;align-items:center;justify-content:center;font-weight:700;color:#6b7280;margin-bottom:10px;position:relative;z-index:2}.step-icon.active{background:#3b82f6;color:#fff}.step-icon.completed{background:#10b981;color:#fff}.step-title{font-size:.9rem;font-weight:600;color:#374151;text-align:center}@media (max-width: 768px){.form-grid{grid-template-columns:1fr}.item-row{grid-template-columns:1fr;gap:10px}.action-buttons{flex-direction:column}.workflow-steps{flex-direction:column;gap:20px}.workflow-step:after{display:none}}#content{width:100%;min-height:100vh;transition:all .3s;position:absolute;padding:20px 20px 20px 40px}#content.active{margin-left:var(--sidebar-width);width:calc(100% - var(--sidebar-width))}.po-content{padding:40px}.po-header{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:40px}.company-info,.po-details{background:#f8f9fa;padding:25px;border-radius:15px;border-left:5px solid #3498db}.company-info h3,.po-details h3{color:#2c3e50;margin-bottom:15px;font-size:1.3rem}.info-row{margin-bottom:8px;display:flex;justify-content:space-between}.info-label{font-weight:600;color:#555}.info-value{color:#2c3e50}.items-section{margin-top:30px}.section-title{color:#2c3e50;font-size:1.5rem;margin-bottom:20px;border-bottom:2px solid #3498db;padding-bottom:10px}.items-table{width:100%;border-collapse:collapse;margin-bottom:30px;background:white;border-radius:10px;overflow:hidden;box-shadow:0 5px 15px #0000001a}.items-table th{background:linear-gradient(135deg,#34495e 0%,#2c3e50 100%);color:#fff;padding:15px;text-align:left;font-weight:600}.items-table td{padding:15px;border-bottom:1px solid #eee;vertical-align:middle}.items-table tr:hover{background:#f8f9fa;transform:translateY(-1px);transition:all .3s ease}.price-input{padding:8px 12px;border:2px solid #ddd;border-radius:8px;font-size:14px;width:100px;transition:all .3s ease}.price-input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.price-changed{background:#fff3cd;border-color:#ffc107}.edit-btn{background:#3498db;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px;transition:all .3s ease}.edit-btn:hover{background:#2980b9;transform:translateY(-2px)}.save-btn{background:#27ae60;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px;margin-right:5px}.cancel-btn{background:#e74c3c;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:12px}.justification-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:white;padding:30px;border-radius:15px;max-width:500px;width:90%;box-shadow:0 20px 40px #0000004d}.modal-content h3{color:#2c3e50;margin-bottom:20px;font-size:1.3rem}.justification-textarea{width:100%;padding:15px;border:2px solid #ddd;border-radius:8px;font-family:inherit;font-size:14px;resize:vertical;min-height:100px}.justification-textarea:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.modal-buttons{margin-top:20px;display:flex;gap:10px;justify-content:flex-end}.totals{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);padding:25px;border-radius:15px;margin-top:20px}.total-row{display:flex;justify-content:space-between;margin-bottom:10px;font-size:1.1rem}.total-row.grand-total{border-top:2px solid #3498db;padding-top:15px;margin-top:15px;font-weight:700;font-size:1.3rem;color:#2c3e50}.justification-note{background:#fff3cd;border:1px solid #ffc107;border-radius:8px;padding:10px;margin-top:10px;font-size:12px;color:#856404}.price-change-indicator{background:#dc3545;color:#fff;border-radius:50%;width:20px;height:20px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;margin-left:5px}@media (max-width: 768px){.po-header{grid-template-columns:1fr;gap:20px}.items-table{font-size:14px}.items-table th,.items-table td{padding:10px 8px}.price-input{width:80px}}
|
package/package.json
CHANGED
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
class="crew-card"
|
|
48
48
|
:class="{ 'unavailable': member.status === 'unavailable' }"
|
|
49
49
|
>
|
|
50
|
-
<div :class="['status-badge', getStatusClass(member.status)]">
|
|
50
|
+
<div :class="['crew-status-badge', getStatusClass(member.status)]">
|
|
51
51
|
{{ formatStatus(member.status) }}
|
|
52
52
|
</div>
|
|
53
53
|
|
|
@@ -580,7 +580,7 @@ export default {
|
|
|
580
580
|
font-size: 0.85em;
|
|
581
581
|
}
|
|
582
582
|
|
|
583
|
-
.status-badge {
|
|
583
|
+
.crew-status-badge {
|
|
584
584
|
position: absolute;
|
|
585
585
|
top: 15px;
|
|
586
586
|
right: 15px;
|
|
@@ -883,8 +883,7 @@ export default {
|
|
|
883
883
|
},
|
|
884
884
|
async resetTasks() {
|
|
885
885
|
const allCompleted = this.checklists.every(item => item.completed);
|
|
886
|
-
const status = allCompleted ? 'Completed' : '
|
|
887
|
-
|
|
886
|
+
const status = allCompleted ? 'Completed' : 'Soon';
|
|
888
887
|
const updateData = {
|
|
889
888
|
checklistProgress: [...this.checklists],
|
|
890
889
|
status,
|
|
@@ -895,6 +894,7 @@ export default {
|
|
|
895
894
|
this.$emit('update-task', {
|
|
896
895
|
updateData,
|
|
897
896
|
file: this.fileattachments.file,
|
|
897
|
+
tasks: this.tasks,
|
|
898
898
|
callback: (success, updatedAfter) => {
|
|
899
899
|
if (success) {
|
|
900
900
|
if (updatedAfter) {
|
|
@@ -962,7 +962,7 @@ export default {
|
|
|
962
962
|
}
|
|
963
963
|
};
|
|
964
964
|
</script>
|
|
965
|
-
|
|
965
|
+
<!--
|
|
966
966
|
<style>
|
|
967
967
|
.progress-container {
|
|
968
968
|
margin-bottom: 20px;
|
|
@@ -1764,4 +1764,5 @@ nav button:hover,
|
|
|
1764
1764
|
nav button.active {
|
|
1765
1765
|
background-color: var(--maitprimary);
|
|
1766
1766
|
}
|
|
1767
|
-
</style>
|
|
1767
|
+
</style>
|
|
1768
|
+
-->
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
</div>
|
|
44
44
|
|
|
45
45
|
<h4 class="mb-4"><i class="bi bi-ship me-2"></i>Registered Vessels</h4>
|
|
46
|
-
|
|
46
|
+
|
|
47
47
|
<!-- Loading State -->
|
|
48
48
|
<div v-if="loading" class="text-center py-4">
|
|
49
49
|
<div class="spinner-border text-primary" role="status">
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
</div>
|
|
52
52
|
<p class="mt-2">Loading vessels...</p>
|
|
53
53
|
</div>
|
|
54
|
-
|
|
54
|
+
|
|
55
55
|
<!-- Empty State -->
|
|
56
56
|
<div v-else-if="!vessels.length" class="alert alert-primary" role="alert">
|
|
57
57
|
<h4 class="alert-heading">Empty Fleet!</h4>
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
<hr>
|
|
60
60
|
<p class="mb-0">Click on the add vessel button above, to start adding vessels to your fleet</p>
|
|
61
61
|
</div>
|
|
62
|
-
|
|
62
|
+
|
|
63
63
|
<!-- Vessel Cards -->
|
|
64
64
|
<div v-else class="row">
|
|
65
65
|
<div class="col-lg-6" v-for="vessel in vessels" :key="vessel.registrationNumber || vessel.id">
|
|
@@ -78,9 +78,24 @@
|
|
|
78
78
|
<small class="text-muted">Registration #:</small>
|
|
79
79
|
<p class="mb-0">{{ vessel.registrationNumber }}</p>
|
|
80
80
|
</div>
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
<
|
|
81
|
+
|
|
82
|
+
<div class="col-6" v-if="vessel.date">
|
|
83
|
+
<template v-if="vessel.status === 'Active'">
|
|
84
|
+
<small class="text-muted">Active Duration:</small>
|
|
85
|
+
<p class="mb-0">{{ getDuration(vessel.date, vessel.registrationNumber) }}</p>
|
|
86
|
+
</template>
|
|
87
|
+
<template v-else>
|
|
88
|
+
<small class="text-muted">Inactive Duration:</small>
|
|
89
|
+
<p class="mb-0">{{ getDuration(vessel.date, vessel.registrationNumber) }}</p>
|
|
90
|
+
</template>
|
|
91
|
+
</div>
|
|
92
|
+
|
|
93
|
+
<div class="col-6" v-else>
|
|
94
|
+
<small class="text-muted">{{ vessel.status}} Duration:</small>
|
|
95
|
+
<button type="button" class="btn btn-outline-primary btn-sm mt-1"
|
|
96
|
+
@click.stop="setVesselDate(vessel.registrationNumber)">
|
|
97
|
+
Set Date
|
|
98
|
+
</button>
|
|
84
99
|
</div>
|
|
85
100
|
</div>
|
|
86
101
|
</div>
|
|
@@ -99,7 +114,7 @@
|
|
|
99
114
|
<script>
|
|
100
115
|
export default {
|
|
101
116
|
name: 'VesselList',
|
|
102
|
-
|
|
117
|
+
|
|
103
118
|
props: {
|
|
104
119
|
// Required props
|
|
105
120
|
vessels: {
|
|
@@ -112,7 +127,7 @@ export default {
|
|
|
112
127
|
required: true,
|
|
113
128
|
default: () => ({ role: 'viewer', vessel: null })
|
|
114
129
|
},
|
|
115
|
-
|
|
130
|
+
|
|
116
131
|
// Optional props
|
|
117
132
|
loading: {
|
|
118
133
|
type: Boolean,
|
|
@@ -122,7 +137,7 @@ export default {
|
|
|
122
137
|
type: String,
|
|
123
138
|
default: 'dashboard' // 'dashboard', 'maintenanceroute', 'crewroute'
|
|
124
139
|
},
|
|
125
|
-
|
|
140
|
+
|
|
126
141
|
// Configuration props
|
|
127
142
|
config: {
|
|
128
143
|
type: Object,
|
|
@@ -135,32 +150,33 @@ export default {
|
|
|
135
150
|
})
|
|
136
151
|
}
|
|
137
152
|
},
|
|
138
|
-
|
|
153
|
+
|
|
139
154
|
emits: [
|
|
140
155
|
'vessel-add',
|
|
141
|
-
'vessel-click',
|
|
156
|
+
'vessel-click',
|
|
142
157
|
'vessel-edit',
|
|
143
158
|
'vessel-delete',
|
|
144
159
|
'vessel-toggle-status',
|
|
145
160
|
'vessel-navigate',
|
|
146
|
-
'access-denied'
|
|
161
|
+
'access-denied',
|
|
162
|
+
'date-change'
|
|
147
163
|
],
|
|
148
|
-
|
|
164
|
+
|
|
149
165
|
computed: {
|
|
150
166
|
activeVesselsCount() {
|
|
151
167
|
return this.vessels.filter(vessel => vessel.status === "Active").length;
|
|
152
168
|
},
|
|
153
|
-
|
|
169
|
+
|
|
154
170
|
inactiveVesselsCount() {
|
|
155
171
|
return this.vessels.filter(vessel => vessel.status === "Inactive").length;
|
|
156
172
|
},
|
|
157
|
-
|
|
173
|
+
|
|
158
174
|
canAddVessel() {
|
|
159
|
-
return this.config.enableAdd &&
|
|
160
|
-
|
|
175
|
+
return this.config.enableAdd &&
|
|
176
|
+
(this.userProfile.role === 'owner' || this.userProfile.role === 'staff');
|
|
161
177
|
}
|
|
162
178
|
},
|
|
163
|
-
|
|
179
|
+
|
|
164
180
|
methods: {
|
|
165
181
|
// Event handlers that emit to parent
|
|
166
182
|
handleAddVessel() {
|
|
@@ -170,7 +186,7 @@ export default {
|
|
|
170
186
|
}
|
|
171
187
|
this.$emit('vessel-add');
|
|
172
188
|
},
|
|
173
|
-
|
|
189
|
+
|
|
174
190
|
handleVesselClick(vessel) {
|
|
175
191
|
const navigationData = {
|
|
176
192
|
vessel,
|
|
@@ -178,74 +194,105 @@ export default {
|
|
|
178
194
|
id: vessel.registrationNumber,
|
|
179
195
|
name: vessel.name
|
|
180
196
|
};
|
|
181
|
-
|
|
197
|
+
|
|
182
198
|
if (this.currentRoute === 'dashboard') {
|
|
183
199
|
this.$emit('vessel-click', vessel);
|
|
184
200
|
} else {
|
|
185
201
|
this.$emit('vessel-navigate', navigationData);
|
|
186
202
|
}
|
|
187
203
|
},
|
|
188
|
-
|
|
204
|
+
|
|
189
205
|
handleDeleteVessel(vessel) {
|
|
190
206
|
if (!this.grantAccess(vessel)) {
|
|
191
207
|
this.handleAccessDenied('delete vessel');
|
|
192
208
|
return;
|
|
193
209
|
}
|
|
194
|
-
|
|
210
|
+
|
|
195
211
|
if (!this.config.enableDelete) {
|
|
196
212
|
return;
|
|
197
213
|
}
|
|
198
|
-
|
|
214
|
+
|
|
199
215
|
this.$emit('vessel-delete', vessel);
|
|
200
216
|
},
|
|
201
|
-
|
|
217
|
+
|
|
202
218
|
handleToggleStatus(vessel) {
|
|
203
219
|
if (!this.grantAccess(vessel)) {
|
|
204
220
|
this.handleAccessDenied('change vessel status');
|
|
205
221
|
return;
|
|
206
222
|
}
|
|
207
|
-
|
|
223
|
+
|
|
208
224
|
if (!this.config.enableStatusToggle) {
|
|
209
225
|
return;
|
|
210
226
|
}
|
|
211
|
-
|
|
227
|
+
|
|
212
228
|
this.$emit('vessel-toggle-status', vessel);
|
|
213
229
|
},
|
|
214
|
-
|
|
230
|
+
|
|
215
231
|
handleEditVessel(vessel) {
|
|
216
232
|
if (!this.grantAccess(vessel)) {
|
|
217
233
|
this.handleAccessDenied('edit vessel');
|
|
218
234
|
return;
|
|
219
235
|
}
|
|
220
|
-
|
|
236
|
+
|
|
221
237
|
if (!this.config.enableEdit) {
|
|
222
238
|
return;
|
|
223
239
|
}
|
|
224
|
-
|
|
240
|
+
|
|
225
241
|
this.$emit('vessel-edit', vessel);
|
|
226
242
|
},
|
|
227
|
-
|
|
243
|
+
|
|
228
244
|
handleAccessDenied(action) {
|
|
229
245
|
this.$emit('access-denied', { action, userProfile: this.userProfile });
|
|
230
246
|
},
|
|
231
|
-
|
|
247
|
+
|
|
232
248
|
// Utility methods (keep these in component as they're UI-related)
|
|
233
249
|
statusClass(status) {
|
|
234
250
|
const normalized = status?.toLowerCase() || '';
|
|
235
251
|
return `status-${normalized}`;
|
|
236
252
|
},
|
|
237
|
-
|
|
253
|
+
|
|
254
|
+
getDuration(date, registrationNumber) {
|
|
255
|
+
const now = new Date();
|
|
256
|
+
const inputDate = new Date(date);
|
|
257
|
+
|
|
258
|
+
// difference in milliseconds
|
|
259
|
+
const diffMs = now - inputDate;
|
|
260
|
+
|
|
261
|
+
if (diffMs < 0) return "Invalid (future date)";
|
|
262
|
+
|
|
263
|
+
// convert to hours
|
|
264
|
+
const diffHours = Math.floor(diffMs / (1000 * 60 * 60));
|
|
265
|
+
|
|
266
|
+
const days = Math.floor(diffHours / 24);
|
|
267
|
+
const hours = diffHours % 24;
|
|
268
|
+
|
|
269
|
+
let result = "";
|
|
270
|
+
|
|
271
|
+
if (days > 0) {
|
|
272
|
+
result += `${days} day${days > 1 ? "s" : ""}`;
|
|
273
|
+
}
|
|
274
|
+
if (hours > 0) {
|
|
275
|
+
result += (result ? " " : "") + `${hours} hr${hours > 1 ? "s" : ""}`;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
return result || '0 hr'
|
|
279
|
+
},
|
|
280
|
+
|
|
281
|
+
setVesselDate(registrationNumber) {
|
|
282
|
+
this.$emit('date-change', registrationNumber);
|
|
283
|
+
},
|
|
284
|
+
|
|
238
285
|
grantAccess(vessel) {
|
|
239
286
|
const { role, vessel: userVessel } = this.userProfile;
|
|
240
|
-
|
|
241
|
-
return role === 'owner' ||
|
|
242
|
-
|
|
243
|
-
|
|
287
|
+
|
|
288
|
+
return role === 'owner' ||
|
|
289
|
+
role === 'staff' ||
|
|
290
|
+
(role === 'captain' && userVessel === vessel.name);
|
|
244
291
|
},
|
|
245
|
-
|
|
292
|
+
|
|
246
293
|
getDaysToExpiry(expiry_date) {
|
|
247
294
|
if (!expiry_date) return null;
|
|
248
|
-
|
|
295
|
+
|
|
249
296
|
const today = new Date();
|
|
250
297
|
const expiry = new Date(expiry_date);
|
|
251
298
|
const diffTime = expiry - today;
|