forked from BLC/AyposWeb
changed ip for testing
This commit is contained in:
@@ -60,7 +60,7 @@ npm run preview
|
|||||||
|
|
||||||
## API Configuration
|
## API Configuration
|
||||||
|
|
||||||
The application connects to an API server at `http://141.196.83.136:8003`. Make sure this endpoint is accessible from your network.
|
The application connects to an API server at `http://10.150.1.167:8003`. Make sure this endpoint is accessible from your network.
|
||||||
|
|
||||||
## Environment Variables
|
## Environment Variables
|
||||||
|
|
||||||
|
|||||||
@@ -53,12 +53,15 @@ const StyledListItemButton = styled(ListItemButton)(({ theme }) => ({
|
|||||||
fontSize: '0.9rem',
|
fontSize: '0.9rem',
|
||||||
color: theme.palette.text.secondary,
|
color: theme.palette.text.secondary,
|
||||||
transition: 'all 0.2s ease',
|
transition: 'all 0.2s ease',
|
||||||
|
|
||||||
'&.Mui-selected': {
|
'&.Mui-selected': {
|
||||||
background: '#028a4a',
|
background: '#028a4a',
|
||||||
color: '#ffffff',
|
color: '#ffffff',
|
||||||
|
'& .MuiListItemIcon-root': {
|
||||||
|
color: '#ffffff',
|
||||||
|
},
|
||||||
'& .MuiListItemIcon-root svg': {
|
'& .MuiListItemIcon-root svg': {
|
||||||
stroke: '#ffffff',
|
stroke: '#ffffff',
|
||||||
|
color: '#ffffff',
|
||||||
},
|
},
|
||||||
'& .MuiListItemText-primary': {
|
'& .MuiListItemText-primary': {
|
||||||
color: '#ffffff',
|
color: '#ffffff',
|
||||||
@@ -67,8 +70,12 @@ const StyledListItemButton = styled(ListItemButton)(({ theme }) => ({
|
|||||||
'&:hover': {
|
'&:hover': {
|
||||||
backgroundColor: '#f8f8f8',
|
backgroundColor: '#f8f8f8',
|
||||||
color: '#028a4a',
|
color: '#028a4a',
|
||||||
|
'& .MuiListItemIcon-root': {
|
||||||
|
color: '#028a4a',
|
||||||
|
},
|
||||||
'& .MuiListItemIcon-root svg': {
|
'& .MuiListItemIcon-root svg': {
|
||||||
stroke: '#028a4a',
|
stroke: '#028a4a',
|
||||||
|
color: '#028a4a',
|
||||||
},
|
},
|
||||||
'& .MuiListItemText-primary': {
|
'& .MuiListItemText-primary': {
|
||||||
color: '#028a4a',
|
color: '#028a4a',
|
||||||
|
|||||||
@@ -21,7 +21,7 @@ interface VMPlacementData {
|
|||||||
}>;
|
}>;
|
||||||
}
|
}
|
||||||
|
|
||||||
const ENDPOINT = 'http://141.196.83.136:8003/prom/get_chart_data/vm_placement';
|
const ENDPOINT = 'http://10.150.1.167:8003/prom/get_chart_data/vm_placement';
|
||||||
const REFRESH_INTERVAL = 30000; // 30 seconds
|
const REFRESH_INTERVAL = 30000; // 30 seconds
|
||||||
|
|
||||||
const SummaryStats: React.FC = () => {
|
const SummaryStats: React.FC = () => {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect } from 'react';
|
||||||
import { VMDetails, GainBeforeData, MigrationAdviceData } from './types';
|
import { VMDetails, GainBeforeData, MigrationAdviceData } from './types';
|
||||||
|
|
||||||
const API_BASE_URL = 'http://141.196.83.136:8003';
|
const API_BASE_URL = 'http://10.150.1.167:8003';
|
||||||
const REFRESH_INTERVAL = 30000; // 30 seconds
|
const REFRESH_INTERVAL = 30000; // 30 seconds
|
||||||
|
|
||||||
interface GainAfterData {
|
interface GainAfterData {
|
||||||
|
|||||||
@@ -46,19 +46,16 @@ import { monitoringService, MonitoringStatus } from '../services/monitoringServi
|
|||||||
import DebugConsole from '../components/DebugConsole';
|
import DebugConsole from '../components/DebugConsole';
|
||||||
import MonitoringSystem from './MonitoringSystem';
|
import MonitoringSystem from './MonitoringSystem';
|
||||||
|
|
||||||
|
// Professional, consistent card style (no animation)
|
||||||
const StyledCard = styled(Paper)(({ theme }) => ({
|
const StyledCard = styled(Paper)(({ theme }) => ({
|
||||||
borderRadius: '0.357rem',
|
borderRadius: '0.6rem',
|
||||||
padding: theme.spacing(3),
|
padding: theme.spacing(3),
|
||||||
height: '100%',
|
minHeight: 260,
|
||||||
|
backgroundColor: theme.palette.background.paper,
|
||||||
|
boxShadow: theme.shadows[2],
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
backgroundColor: theme.palette.background.paper,
|
justifyContent: 'flex-start',
|
||||||
transition: 'transform 0.2s, box-shadow 0.2s',
|
|
||||||
boxShadow: theme.shadows[3],
|
|
||||||
'&:hover': {
|
|
||||||
transform: 'translateY(-4px)',
|
|
||||||
boxShadow: theme.shadows[8],
|
|
||||||
},
|
|
||||||
}));
|
}));
|
||||||
|
|
||||||
const StyledSelect = styled(Select)(({ theme }) => ({
|
const StyledSelect = styled(Select)(({ theme }) => ({
|
||||||
@@ -71,14 +68,16 @@ const StyledSelect = styled(Select)(({ theme }) => ({
|
|||||||
},
|
},
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
// Professional header style
|
||||||
const SectionTitle = styled(Typography)(({ theme }) => ({
|
const SectionTitle = styled(Typography)(({ theme }) => ({
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
gap: theme.spacing(1),
|
gap: theme.spacing(1),
|
||||||
marginBottom: theme.spacing(3),
|
marginBottom: theme.spacing(3),
|
||||||
color: theme.palette.text.secondary,
|
color: theme.palette.text.primary,
|
||||||
fontWeight: 700,
|
fontWeight: 700,
|
||||||
fontFamily: theme.typography.fontFamily,
|
fontFamily: 'Montserrat, Helvetica, Arial, serif',
|
||||||
|
fontSize: theme.typography.h6.fontSize, // Use theme's h6 size (usually 1.125rem)
|
||||||
}));
|
}));
|
||||||
|
|
||||||
const IconWrapper = styled(Box)(({ theme }) => ({
|
const IconWrapper = styled(Box)(({ theme }) => ({
|
||||||
@@ -503,12 +502,12 @@ const Home = () => {
|
|||||||
View Optimization Selection
|
View Optimization Selection
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
<Grid container spacing={3}>
|
<Grid container spacing={3} alignItems="stretch">
|
||||||
{/* Environmental Temperature Section */}
|
{/* Environmental Temperature Section */}
|
||||||
<Grid item xs={12} md={2.7}>
|
<Grid item xs={12} md={3}>
|
||||||
<StyledCard elevation={3}>
|
<StyledCard elevation={2}>
|
||||||
<SectionTitle variant="h6">
|
<SectionTitle>
|
||||||
<ThermostatIcon color="primary" fontSize="large" />
|
<ThermostatIcon color="primary" fontSize="medium" />
|
||||||
Environmental Temperature
|
Environmental Temperature
|
||||||
</SectionTitle>
|
</SectionTitle>
|
||||||
|
|
||||||
@@ -569,9 +568,9 @@ const Home = () => {
|
|||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
{/* Preventive Maintenance Section */}
|
{/* Preventive Maintenance Section */}
|
||||||
<Grid item xs={12} md={2.7}>
|
<Grid item xs={12} md={3}>
|
||||||
<StyledCard elevation={3}>
|
<StyledCard elevation={2}>
|
||||||
<SectionTitle variant="h6">
|
<SectionTitle>
|
||||||
<BuildIcon color="primary" fontSize="large" />
|
<BuildIcon color="primary" fontSize="large" />
|
||||||
Preventive Maintenance
|
Preventive Maintenance
|
||||||
</SectionTitle>
|
</SectionTitle>
|
||||||
@@ -633,9 +632,9 @@ const Home = () => {
|
|||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
{/* Migration Advice Section */}
|
{/* Migration Advice Section */}
|
||||||
<Grid item xs={12} md={2.7}>
|
<Grid item xs={12} md={3}>
|
||||||
<StyledCard elevation={3}>
|
<StyledCard elevation={2}>
|
||||||
<SectionTitle variant="h6">
|
<SectionTitle>
|
||||||
<SwapHorizIcon color="primary" fontSize="large" />
|
<SwapHorizIcon color="primary" fontSize="large" />
|
||||||
Migration Advice
|
Migration Advice
|
||||||
</SectionTitle>
|
</SectionTitle>
|
||||||
@@ -746,10 +745,10 @@ const Home = () => {
|
|||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
{/* Weight Configuration Section */}
|
{/* Weight Configuration Section */}
|
||||||
<Grid item xs={12} md={3.9}>
|
<Grid item xs={12} md={3}>
|
||||||
<StyledCard elevation={3}>
|
<StyledCard elevation={2}>
|
||||||
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 2 }}>
|
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 2 }}>
|
||||||
<SectionTitle variant="h6" sx={{ mb: 0 }}>
|
<SectionTitle sx={{ mb: 0 }}>
|
||||||
<BalanceIcon color="primary" fontSize="large" />
|
<BalanceIcon color="primary" fontSize="large" />
|
||||||
Weight Of Sustainability Criteria
|
Weight Of Sustainability Criteria
|
||||||
</SectionTitle>
|
</SectionTitle>
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ const Maintenance = () => {
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const fetchData = async () => {
|
const fetchData = async () => {
|
||||||
try {
|
try {
|
||||||
const response = await fetch('http://141.196.83.136:8003/prom/get_chart_data/maintenance/20');
|
const response = await fetch('http://10.150.1.167:8003/prom/get_chart_data/maintenance/20');
|
||||||
const result = await response.json();
|
const result = await response.json();
|
||||||
|
|
||||||
if (result.data && result.data.length > 0) {
|
if (result.data && result.data.length > 0) {
|
||||||
|
|||||||
@@ -31,7 +31,7 @@ import VerifiedMigration from '../components/Migration/VerifiedMigration';
|
|||||||
import { useMigrationData, useGainAfterData } from '../components/Migration/hooks';
|
import { useMigrationData, useGainAfterData } from '../components/Migration/hooks';
|
||||||
|
|
||||||
// Constants
|
// Constants
|
||||||
const API_BASE_URL = 'http://141.196.83.136:8003';
|
const API_BASE_URL = 'http://10.150.1.167:8003';
|
||||||
const REFRESH_INTERVAL = 30000; // 30 seconds
|
const REFRESH_INTERVAL = 30000; // 30 seconds
|
||||||
|
|
||||||
interface VMPlacementData {
|
interface VMPlacementData {
|
||||||
@@ -413,7 +413,7 @@ const Migration = () => {
|
|||||||
setHasProgress(true);
|
setHasProgress(true);
|
||||||
|
|
||||||
// First, send the POST request for migration approval
|
// First, send the POST request for migration approval
|
||||||
const approvalResponse = await fetch('http://141.196.83.136:8003/prom/migration/decisions4?run_migration=true', {
|
const approvalResponse = await fetch('http://10.150.1.167:8003/prom/migration/decisions4?run_migration=true', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'accept': 'application/json'
|
'accept': 'application/json'
|
||||||
@@ -455,7 +455,7 @@ const Migration = () => {
|
|||||||
try {
|
try {
|
||||||
setIsProcessing(true);
|
setIsProcessing(true);
|
||||||
|
|
||||||
const response = await fetch('http://141.196.83.136:8003/prom/migration/decisions4?run_migration=false', {
|
const response = await fetch('http://10.150.1.167:8003/prom/migration/decisions4?run_migration=false', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'accept': 'application/json'
|
'accept': 'application/json'
|
||||||
|
|||||||
@@ -144,7 +144,7 @@ const MonitoringSystem: React.FC<MonitoringSystemProps> = ({
|
|||||||
const fetchData = async () => {
|
const fetchData = async () => {
|
||||||
setLoading(true);
|
setLoading(true);
|
||||||
try {
|
try {
|
||||||
const response = await fetch('http://141.196.83.136:8003/prom/monitoring');
|
const response = await fetch('http://10.150.1.167:8003/prom/monitoring');
|
||||||
const result: ApiResponse = await response.json();
|
const result: ApiResponse = await response.json();
|
||||||
|
|
||||||
// Create hierarchical structure
|
// Create hierarchical structure
|
||||||
|
|||||||
@@ -52,7 +52,7 @@ const Temperature = () => {
|
|||||||
setRefreshing(true);
|
setRefreshing(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
const response = await fetch('http://141.196.83.136:8003/prom/get_chart_data/temperature/20');
|
const response = await fetch('http://10.150.1.167:8003/prom/get_chart_data/temperature/20');
|
||||||
const result = await response.json();
|
const result = await response.json();
|
||||||
|
|
||||||
if (result.data && result.data.length > 0) {
|
if (result.data && result.data.length > 0) {
|
||||||
@@ -337,7 +337,7 @@ const Temperature = () => {
|
|||||||
const handleTemperatureDecision = async (approval: boolean) => {
|
const handleTemperatureDecision = async (approval: boolean) => {
|
||||||
try {
|
try {
|
||||||
setDecisionLoading(true);
|
setDecisionLoading(true);
|
||||||
const response = await fetch('http://141.196.83.136:8003/prom/temperature/decisions?approval=' + approval, {
|
const response = await fetch('http://10.150.1.167:8003/prom/temperature/decisions?approval=' + approval, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'accept': 'application/json',
|
'accept': 'application/json',
|
||||||
|
|||||||
@@ -112,7 +112,7 @@ const Test = () => {
|
|||||||
const fetchVMs = async () => {
|
const fetchVMs = async () => {
|
||||||
setIsLoadingVMs(true);
|
setIsLoadingVMs(true);
|
||||||
try {
|
try {
|
||||||
const response = await fetch('http://141.196.83.136:8003/prom/monitoring');
|
const response = await fetch('http://10.150.1.167:8003/prom/monitoring');
|
||||||
const data: MonitoringResponse = await response.json();
|
const data: MonitoringResponse = await response.json();
|
||||||
|
|
||||||
// Extract VMs from the optimization space
|
// Extract VMs from the optimization space
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
const BASE_URL = 'http://141.196.83.136:8003';
|
const BASE_URL = 'http://10.150.1.167:8003';
|
||||||
|
|
||||||
export interface MonitoringConfig {
|
export interface MonitoringConfig {
|
||||||
migration: {
|
migration: {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
const BASE_URL = 'http://141.196.83.136:8003';
|
const BASE_URL = 'http://10.150.1.167:8003';
|
||||||
|
|
||||||
export interface StressConfig {
|
export interface StressConfig {
|
||||||
vms: string[];
|
vms: string[];
|
||||||
|
|||||||
Reference in New Issue
Block a user