github/vesta
1
0
Fork 0
mirror of https://github.com/serghey-rodin/vesta.git synced 2025-07-05 20:41:51 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixed Packages, Firewall and Server tabs.

Browse source
This commit is contained in:
Alexander 2021-10-28 22:36:05 +03:00
parent b7cf917141
commit 7540c9881d
27 changed files with 151 additions and 79 deletions
Download patch file Download diff file Expand all files Collapse all files

13
web/js/react/src/ControlPanelService/Firewalls.js
View file

@ -17,16 +17,17 @@ export const getBanList = () => {
return axios.get(BASE_URL + banListUri);
}
export const bulkAction = (action, firewalls) => {
export const bulkAction = (action, ips, banIps) => {
const formData = new FormData();
formData.append("action", action);
formData.append("token", getAuthToken());
firewalls.forEach(firewall => {
formData.append("rule[]", firewall);
ips.forEach(ip => {
const banIp = banIps.find(banIp => banIp.NAME === ip);
formData.append("ipchain[]", `${ip}:${banIp['CHAIN']}`);
});
return axios.post(BASE_URL + '/api/v1/bulk/firewall/', formData);
return axios.post(BASE_URL + '/api/v1/bulk/firewall/banlist/', formData);
};
export const handleAction = uri => {
@ -54,11 +55,13 @@ export const getBanIps = data => {
export const addBanIp = (data) => {
let formDataObject = new FormData();
formDataObject.append('token', getAuthToken());
for (let key in data) {
formDataObject.append(key, data[key]);
}
return axios.get(BASE_URL + addBanIpsUri, {
return axios.post(BASE_URL + addBanIpsUri, formDataObject, {
params: {
token: getAuthToken()
}

4
web/js/react/src/ControlPanelService/Updates.js
View file

@ -1,8 +1,8 @@
import axios from "axios";
import { getAuthToken } from "src/utils/token";
const deleteAutoUpdateUri = '/delete/cron/autoupdate/';
const addAutoUpdateUri = '/add/cron/autoupdate/';
const deleteAutoUpdateUri = '/api/v1/delete/cron/autoupdate/';
const addAutoUpdateUri = '/api/v1/add/cron/autoupdate/';
const webApiUri = '/api/v1/list/updates/index.php';
const BASE_URL = window.location.origin;

2
web/js/react/src/components/ControlPanel/AddItemLayout/AddItemLayout.scss
View file

@ -207,7 +207,7 @@ $errorColor: #BE5ABF;
label.label-wrapper {
display: flex;
align-items: flex-end;
width: fit-content;
width: max-content;
span {
font-weight: normal;

2
web/js/react/src/components/Firewall/Add/AddFirewall.scss
View file

@ -1,6 +1,6 @@
.content .edit-template.add-firewall {
.toolbar .search-toolbar-name {
width: fit-content;
width: max-content;
}
label.label-wrapper[for=ip] span {

9
web/js/react/src/components/Firewall/Add/Banlist/index.jsx
View file

@ -43,15 +43,18 @@ const AddBanIP = () => {
}
if (Object.keys(newUser).length !== 0 && newUser.constructor === Object) {
setState({ ...state, loading: true });
addBanIp(newUser)
.then(result => {
if (result.status === 200) {
const { error_msg, ok_msg } = result.data;
if (error_msg) {
setState({ ...state, errorMessage: error_msg, okMessage: '' });
setState({ ...state, errorMessage: error_msg, okMessage: '', loading: false });
} else if (ok_msg) {
setState({ ...state, errorMessage: '', okMessage: ok_msg });
setState({ ...state, errorMessage: '', okMessage: ok_msg, loading: false });
} else {
setState({ ...state, loading: false });
}
}
})
@ -81,6 +84,8 @@ const AddBanIP = () => {
<AddItemLayout>
{state.loading ? <Spinner /> :
<form onSubmit={event => submitFormHandler(event)} id="add-user">
<input type="hidden" name="ok" value="add" />
<div class="form-group">
<label htmlFor="chain">{i18n.Banlist}</label>
<select class="form-control" id="chain" name="v_chain">

7
web/js/react/src/components/Firewall/Ban/index.jsx
View file

@ -6,14 +6,13 @@ import { useSelector } from 'react-redux';
const Ban = ({ data, ...props }) => {
const { i18n } = useSelector(state => state.session);
const token = localStorage.getItem("token");
const checkItem = () => {
props.checkItem(data.NAME);
}
const handleDelete = () => {
props.handleModal(data.delete_conf, `/api/v1/delete/firewall/banlist/?ip=${data.NAME}&chain=${data.CHAIN}`);
props.handleModal(data.delete_confirmation, `/api/v1/delete/firewall/banlist/?ip=${data.NAME}&chain=${data.CHAIN}`);
}
return (
@ -32,10 +31,10 @@ const Ban = ({ data, ...props }) => {
<div></div>
</Container>
<Container className="c-2 w-30">
<div>{data.CHAIN}</div>
<div><b>{data.CHAIN}</b></div>
</Container>
<Container className="c-2 w-30">
<div>{data.NAME}</div>
<div><b>{data.NAME}</b></div>
</Container>
</div>
</Container>

39
web/js/react/src/components/Firewall/Edit/EditFirewall.jsx
View file

@ -13,8 +13,6 @@ import QS from 'qs';
import './EditFirewall.scss';
import { Helmet } from 'react-helmet';
import { checkAuthHandler } from 'src/actions/Session/sessionActions';
import { refreshCounters } from 'src/actions/MenuCounters/menuCounterActions';
import HtmlParser from 'react-html-parser';
const EditFirewall = props => {
@ -37,22 +35,26 @@ const EditFirewall = props => {
dispatch(removeFocusedElement());
if (rule) {
setState({ ...state, loading: true });
getFirewallInfo(rule)
.then(response => {
setState({
...state,
data: response.data,
errorMessage: response.data['error_msg'],
okMessage: response.data['ok_msg'],
loading: false
});
})
.catch(err => console.error(err));
fetchData(rule);
}
}, []);
const fetchData = rule => {
setState({ ...state, loading: true });
getFirewallInfo(rule)
.then(response => {
setState({
...state,
data: response.data,
errorMessage: response.data['error_msg'],
okMessage: response.data['ok_msg'],
loading: false
});
})
.catch(err => console.error(err));
}
const submitFormHandler = event => {
event.preventDefault();
let updatedDomain = {};
@ -64,7 +66,7 @@ const EditFirewall = props => {
if (Object.keys(updatedDomain).length !== 0 && updatedDomain.constructor === Object) {
setState({ ...state, loading: true });
updateFirewall(updatedDomain, state.data.domain)
updateFirewall(updatedDomain, state.data.rule)
.then(result => {
if (result.status === 200) {
const { error_msg: errorMessage, ok_msg: okMessage } = result.data;
@ -72,12 +74,11 @@ const EditFirewall = props => {
if (errorMessage) {
setState({ ...state, errorMessage, okMessage, loading: false });
} else {
dispatch(refreshCounters()).then(() => {
setState({ ...state, okMessage, errorMessage: '', loading: false });
});
setState({ ...state, okMessage, errorMessage: '', loading: false });
}
}
})
.then(() => fetchData(state.data.rule))
.catch(err => console.error(err));
}
}

7
web/js/react/src/components/Firewall/Firewall.jsx
View file

@ -7,19 +7,18 @@ import './Firewall.scss';
import { useSelector } from 'react-redux';
const Firewall = ({ data, ...props }) => {
const token = localStorage.getItem("token");
const { i18n } = useSelector(state => state.session);
const toggleFav = (starred) => {
if (starred) {
props.toggleFav(props.data.NAME, 'add');
props.toggleFav(data.NAME, 'add');
} else {
props.toggleFav(props.data.NAME, 'delete');
props.toggleFav(data.NAME, 'delete');
}
}
const checkItem = () => {
props.checkItem(props.data.NAME);
props.checkItem(data.NAME);
}
const handleSuspend = () => {

2
web/js/react/src/components/Log/Log.scss
View file

@ -1,6 +1,6 @@
.logs-list {
.toolbar {
padding: 6px 12.5%;
padding: 6px 13%;
}
.statistic-item {

2
web/js/react/src/components/MailAccount/Add/AddMailAccount.scss
View file

@ -1,6 +1,6 @@
.content .edit-template.add-mail-account {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
form {

2
web/js/react/src/components/MainNav/Toolbar/Toolbar.scss
View file

@ -21,7 +21,7 @@ $textColor: #555;
left: 0;
width: 100%;
z-index: 1;
padding: 3px 10% 1px;
padding: 3px 13% 1px;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;

2
web/js/react/src/components/Package/Add/AddPackage.scss
View file

@ -3,7 +3,7 @@
label.label-wrapper {
display: flex;
align-items: flex-end;
width: fit-content;
width: max-content;
span {
font-weight: normal;

2
web/js/react/src/components/Server/Edit/Bind9/Bind9.scss
View file

@ -1,7 +1,7 @@
.content .edit-template.edit-bind9 {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
}

2
web/js/react/src/components/Server/Edit/Dovecot/Dovecot.scss
View file

@ -1,7 +1,7 @@
.content .edit-template.edit-bind9 {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
}

2
web/js/react/src/components/Server/Edit/EditServer.scss
View file

@ -121,7 +121,7 @@ $textColor: #555;
padding: 7px 15px;
text-transform: capitalize;
text-decoration: none;
width: fit-content;
width: max-content;
margin-right: 10px;
&:hover {

4
web/js/react/src/components/Server/Edit/Httpd/EditHttpd.scss
View file

@ -4,7 +4,7 @@ $secondaryLight: #f8b014;
.content .edit-template.edit-httpd {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
a {
color: $secondary;
@ -17,7 +17,7 @@ $secondaryLight: #f8b014;
}
.link {
width: fit-content;
width: max-content;
margin-left: 15px;
a {

2
web/js/react/src/components/Server/Edit/Mysql/Mysql.scss
View file

@ -1,7 +1,7 @@
.content .edit-template.edit-mysql {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
}

4
web/js/react/src/components/Server/Edit/Nginx/EditServerNginx.scss
View file

@ -3,11 +3,11 @@ $secondaryLight: #f8b014;
.content .edit-template.edit-nginx {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
.link {
width: fit-content;
width: max-content;
margin-left: 15px;
a {

4
web/js/react/src/components/Server/Edit/PHP/EditPhp.scss
View file

@ -5,13 +5,13 @@ $textColor: #555;
.content .edit-template.edit-php {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
color: $textColor;
}
.search-toolbar-name,
.link {
width: fit-content;
width: max-content;
a {
text-decoration: none;

2
web/js/react/src/components/Server/Edit/Postgresql/Postgresql.scss
View file

@ -1,7 +1,7 @@
.content .edit-template.edit-pgsql {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
}

2
web/js/react/src/components/Server/Edit/Service/Service.scss
View file

@ -1,7 +1,7 @@
.content .edit-template.edit-service {
.toolbar {
.search-toolbar-name {
width: fit-content;
width: max-content;
}
}

2
web/js/react/src/components/WebDomain/Edit/SslSupport/SslSupport.scss
View file

@ -19,7 +19,7 @@ $textColor: #555;
}
&:nth-child(2) {
width: fit-content;
width: max-content;
}
}
}

24
web/js/react/src/containers/Firewalls/Banlist/index.jsx
View file

@ -233,11 +233,11 @@ const BanLists = props => {
const { selection } = state;
if (selection.length && action) {
bulkAction(action, selection)
bulkAction(action, selection, state.banIps)
.then(result => {
if (result.status === 200) {
toggleAll(false);
fetchData().then(() => refreshMenuCounters());
fetchData();
}
})
.catch(err => console.error(err));
@ -261,15 +261,11 @@ const BanLists = props => {
setLoading(false);
return displayModal(res.data.error, '');
}
fetchData().then(() => refreshMenuCounters())
fetchData();
})
.catch(err => { setLoading(false); console.error(err); });
}
const refreshMenuCounters = () => {
dispatch(refreshCounters()).then(() => setLoading(false));
}
const modalCancelHandler = () => {
setModal({ ...modal, visible: !modal.visible, text: '', actionUrl: '' });
}
@ -289,18 +285,18 @@ const BanLists = props => {
</div>
</div>
</Toolbar>
<div className="banlist-wrapper">
{loading
? <Spinner />
: (<>
{loading
? <Spinner />
: (<>
<div className="banlist-wrapper">
{banIps()}
<div className="buttons-wrapper">
<div className="total">{state.totalAmount}</div>
<button type="button" className="back" onClick={() => history.push('/list/firewall/')}>{i18n.Back}</button>
</div>
</>)
}
</div>
</div>
</>)
}
<Modal
onSave={modalConfirmHandler}
onCancel={modalCancelHandler}

11
web/js/react/src/containers/Firewalls/Banlist/styles.scss
View file

@ -1,10 +1,21 @@
.banlist-wrapper {
display: flex;
flex-direction: column;
> div {
margin-right: 15px;
}
.list-item {
.l-col {
div.star {
.checkbox + div {
display: none;
}
}
}
}
.buttons-wrapper {
width: 100%;
display: flex;

2
web/js/react/src/containers/RRDs/RRDs.scss
View file

@ -18,7 +18,7 @@ div.content {
color: $textColor;
.toolbar {
padding: 6px 12.5%;
padding: 6px 13%;
}
.rrd-item {

2
web/js/react/src/containers/Statistics/Statistics.scss
View file

@ -2,7 +2,7 @@
color: #686868;
.toolbar {
padding: 6px 12.5%;
padding: 6px 13%;
}
.l-col {

74
web/js/react/src/containers/Updates/Updates.jsx
View file

@ -5,6 +5,7 @@ import { bulkAction, getUpdatesList, enableAutoUpdate, disableAutoUpdate } from
import * as MainNavigation from '../../actions/MainNavigation/mainNavigationActions';
import SearchInput from '../../components/MainNav/Toolbar/SearchInput/SearchInput';
import LeftButton from '../../components/MainNav/Toolbar/LeftButton/LeftButton';
import Modal from 'src/components/ControlPanel/Modal/Modal';
import Checkbox from '../../components/MainNav/Toolbar/Checkbox/Checkbox';
import Select from '../../components/MainNav/Toolbar/Select/Select';
import Toolbar from '../../components/MainNav/Toolbar/Toolbar';
@ -27,6 +28,11 @@ const Updates = props => {
loading: false,
toggledAll: false
});
const [modal, setModal] = useState({
text: '',
visible: false,
actionUrl: ''
});
useEffect(() => {
dispatch(addActiveElement('/list/updates/'));
@ -126,7 +132,7 @@ const Updates = props => {
...state,
selection: [],
updates: reformatData(result.data.data),
autoUpdate: result.data.totalAmount,
autoUpdate: result.data.autoUpdate,
loading: false
});
})
@ -202,10 +208,16 @@ const Updates = props => {
if (selection.length && action !== 'apply to selected') {
bulkAction(action, selection)
.then(result => {
if (result.status === 200) {
.then(res => {
toggleAll(false);
if (res.status === 200) {
if (res.data.error) {
setState({ ...state, loading: false });
return displayModal(res.data.error, '');
}
displayModal(res.data.message, '');
fetchData();
toggleAll(false);
}
})
.catch(err => console.error(err));
@ -215,15 +227,56 @@ const Updates = props => {
const handleAutoUpdate = () => {
if (state.autoUpdate === 'Enabled') {
disableAutoUpdate()
.then(() => fetchData())
.catch(err => console.error(err));
.then(res => {
if (res.data.error) {
setState({ ...state, loading: false });
return displayModal(res.data.error, '');
}
displayModal(res.data.message, '');
fetchData();
})
.catch(err => {
setState({ ...state, loading: false });
console.error(err);
});
} else {
enableAutoUpdate()
.then(() => fetchData())
.catch(err => console.error(err));
.then(res => {
if (res.data.error) {
setState({ ...state, loading: false });
return displayModal(res.data.error, '');
}
displayModal(res.data.message, '');
fetchData();
})
.catch(err => {
setState({ ...state, loading: false });
console.error(err);
});
}
}
const displayModal = (text, url) => {
setState({ ...state, loading: true });
setModal({
...modal,
visible: true,
text: text,
actionUrl: url
});
}
const modalCancelHandler = () => {
setModal({
...modal,
visible: false,
text: '',
actionUrl: ''
});
}
const printAutoUpdateButtonName = () => {
if (state.autoUpdate === 'Enabled') {
return i18n['disable autoupdate'];
@ -249,6 +302,11 @@ const Updates = props => {
</div>
</Toolbar>
{state.loading ? <Spinner /> : updates()}
<Modal
onSave={modalCancelHandler}
onCancel={modalCancelHandler}
show={modal.visible}
text={modal.text} />
</div>
);
}