improved websites list
This commit is contained in:
usmannasir
parent
45f959d2ec
commit
8786478d1e
|
|
@ -2367,16 +2367,34 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
$scope.web = {};
|
||||
$scope.WebSitesList = [];
|
||||
$scope.loading = true; // Add loading state
|
||||
$scope.expandedSites = {}; // Track which sites are expanded
|
||||
|
||||
$scope.currentPage = 1;
|
||||
$scope.recordsToShow = 10;
|
||||
|
||||
$scope.expandedSites = {};
|
||||
// Function to toggle site expansion
|
||||
$scope.toggleSite = function(site) {
|
||||
$scope.expandedSites[site.domain] = !$scope.expandedSites[site.domain];
|
||||
if (!$scope.expandedSites[site.domain]) {
|
||||
$scope.expandedSites[site.domain] = true;
|
||||
site.loading = true;
|
||||
// You can add any data fetching logic here if needed
|
||||
setTimeout(function() {
|
||||
site.loading = false;
|
||||
$scope.$apply();
|
||||
}, 500);
|
||||
} else {
|
||||
$scope.expandedSites[site.domain] = false;
|
||||
}
|
||||
};
|
||||
$scope.isExpanded = function(domain) {
|
||||
return !!$scope.expandedSites[domain];
|
||||
|
||||
// Function to check if site is expanded
|
||||
$scope.isExpanded = function(siteId) {
|
||||
return $scope.expandedSites[siteId];
|
||||
};
|
||||
|
||||
// Function to check if site data is loaded
|
||||
$scope.isDataLoaded = function(site) {
|
||||
return site.version !== undefined;
|
||||
};
|
||||
|
||||
// Initial fetch of websites
|
||||
|
|
@ -2400,11 +2418,6 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
$scope.WebSitesList = JSON.parse(response.data.data);
|
||||
$scope.pagination = response.data.pagination;
|
||||
$("#listFail").hide();
|
||||
// Expand the first website by default
|
||||
if ($scope.WebSitesList.length > 0) {
|
||||
$scope.expandedSites = {};
|
||||
$scope.expandedSites[$scope.WebSitesList[0].domain] = true;
|
||||
}
|
||||
} else {
|
||||
$("#listFail").fadeIn();
|
||||
$scope.errorMessage = response.data.error_message;
|
||||
|
|
@ -2519,6 +2532,12 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
window.location.href = '/websites/WPHome?ID=' + wpId;
|
||||
};
|
||||
|
||||
$scope.deleteWPSite = function(wp) {
|
||||
if (confirm('Are you sure you want to delete this WordPress site? This action cannot be undone.')) {
|
||||
window.location.href = '/websites/ListWPSites?DeleteID=' + wp.id;
|
||||
}
|
||||
};
|
||||
|
||||
$scope.getFullUrl = function(url) {
|
||||
console.log('getFullUrl called with:', url);
|
||||
if (!url) {
|
||||
|
|
@ -5519,16 +5538,34 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
$scope.web = {};
|
||||
$scope.WebSitesList = [];
|
||||
$scope.loading = true; // Add loading state
|
||||
$scope.expandedSites = {}; // Track which sites are expanded
|
||||
|
||||
$scope.currentPage = 1;
|
||||
$scope.recordsToShow = 10;
|
||||
|
||||
$scope.expandedSites = {};
|
||||
// Function to toggle site expansion
|
||||
$scope.toggleSite = function(site) {
|
||||
$scope.expandedSites[site.domain] = !$scope.expandedSites[site.domain];
|
||||
if (!$scope.expandedSites[site.domain]) {
|
||||
$scope.expandedSites[site.domain] = true;
|
||||
site.loading = true;
|
||||
// You can add any data fetching logic here if needed
|
||||
setTimeout(function() {
|
||||
site.loading = false;
|
||||
$scope.$apply();
|
||||
}, 500);
|
||||
} else {
|
||||
$scope.expandedSites[site.domain] = false;
|
||||
}
|
||||
};
|
||||
$scope.isExpanded = function(domain) {
|
||||
return !!$scope.expandedSites[domain];
|
||||
|
||||
// Function to check if site is expanded
|
||||
$scope.isExpanded = function(siteId) {
|
||||
return $scope.expandedSites[siteId];
|
||||
};
|
||||
|
||||
// Function to check if site data is loaded
|
||||
$scope.isDataLoaded = function(site) {
|
||||
return site.version !== undefined;
|
||||
};
|
||||
|
||||
// Initial fetch of websites
|
||||
|
|
@ -5552,11 +5589,6 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
$scope.WebSitesList = JSON.parse(response.data.data);
|
||||
$scope.pagination = response.data.pagination;
|
||||
$("#listFail").hide();
|
||||
// Expand the first website by default
|
||||
if ($scope.WebSitesList.length > 0) {
|
||||
$scope.expandedSites = {};
|
||||
$scope.expandedSites[$scope.WebSitesList[0].domain] = true;
|
||||
}
|
||||
} else {
|
||||
$("#listFail").fadeIn();
|
||||
$scope.errorMessage = response.data.error_message;
|
||||
|
|
@ -5668,7 +5700,13 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
};
|
||||
|
||||
$scope.manageWP = function(wpId) {
|
||||
window.location.href = '/websites/listWPsites?wpID=' + wpId;
|
||||
window.location.href = '/websites/WPHome?ID=' + wpId;
|
||||
};
|
||||
|
||||
$scope.deleteWPSite = function(wp) {
|
||||
if (confirm('Are you sure you want to delete this WordPress site? This action cannot be undone.')) {
|
||||
window.location.href = '/websites/ListWPSites?DeleteID=' + wp.id;
|
||||
}
|
||||
};
|
||||
|
||||
$scope.getFullUrl = function(url) {
|
||||
|
|
@ -9018,16 +9056,34 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
$scope.web = {};
|
||||
$scope.WebSitesList = [];
|
||||
$scope.loading = true; // Add loading state
|
||||
$scope.expandedSites = {}; // Track which sites are expanded
|
||||
|
||||
$scope.currentPage = 1;
|
||||
$scope.recordsToShow = 10;
|
||||
|
||||
$scope.expandedSites = {};
|
||||
// Function to toggle site expansion
|
||||
$scope.toggleSite = function(site) {
|
||||
$scope.expandedSites[site.domain] = !$scope.expandedSites[site.domain];
|
||||
if (!$scope.expandedSites[site.domain]) {
|
||||
$scope.expandedSites[site.domain] = true;
|
||||
site.loading = true;
|
||||
// You can add any data fetching logic here if needed
|
||||
setTimeout(function() {
|
||||
site.loading = false;
|
||||
$scope.$apply();
|
||||
}, 500);
|
||||
} else {
|
||||
$scope.expandedSites[site.domain] = false;
|
||||
}
|
||||
};
|
||||
$scope.isExpanded = function(domain) {
|
||||
return !!$scope.expandedSites[domain];
|
||||
|
||||
// Function to check if site is expanded
|
||||
$scope.isExpanded = function(siteId) {
|
||||
return $scope.expandedSites[siteId];
|
||||
};
|
||||
|
||||
// Function to check if site data is loaded
|
||||
$scope.isDataLoaded = function(site) {
|
||||
return site.version !== undefined;
|
||||
};
|
||||
|
||||
// Initial fetch of websites
|
||||
|
|
@ -9051,11 +9107,6 @@ app.controller('listWebsites', function ($scope, $http, $window) {
|
|||
$scope.WebSitesList = JSON.parse(response.data.data);
|
||||
$scope.pagination = response.data.pagination;
|
||||
$("#listFail").hide();
|
||||
// Expand the first website by default
|
||||
if ($scope.WebSitesList.length > 0) {
|
||||
$scope.expandedSites = {};
|
||||
$scope.expandedSites[$scope.WebSitesList[0].domain] = true;
|
||||
}
|
||||
} else {
|
||||
$("#listFail").fadeIn();
|
||||
$scope.errorMessage = response.data.error_message;
|
||||
|
|
|
|||
|
|
@ -81,178 +81,235 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-repeat="web in WebSitesList track by $index" class="wp-site-item">
|
||||
<div class="row wp-site-header" ng-click="toggleSite(web)" style="cursor:pointer;align-items:center;">
|
||||
<div class="col-sm-1">
|
||||
<img ng-src="https://api.microlink.io/?url={$ web.domain $}&screenshot=true&meta=false&embed=screenshot.url"
|
||||
onerror="this.onerror=null; this.src='/static/images/icons/default-site.png';"
|
||||
class="img-responsive" style="max-width: 60px; min-height:40px; background:#f5f5f5;">
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<h4 style="margin:0;display:inline-block;">
|
||||
<i class="fas" ng-class="{'fa-chevron-down': isExpanded(web.domain), 'fa-chevron-right': !isExpanded(web.domain)}" style="margin-right:10px;"></i>
|
||||
{$ web.domain $}
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-sm-2 text-right">
|
||||
<a href="/websites/{$ web.domain $}" target="_self" title="Manage Website" class="btn btn-primary btn-sm">
|
||||
<i class="fa fa-external-link"></i> {% trans "Manage" %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wp-site-content" ng-if="isExpanded(web.domain)">
|
||||
<div class="row">
|
||||
<div class="col-md-3 content-box-header">
|
||||
<i class="p fa fa-sticky-note btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="State"> </i>
|
||||
<span ng-bind="web.state" style="text-transform: none"></span>
|
||||
</div>
|
||||
<div class="col-md-3 content-box-header">
|
||||
<i class="p fa fa-map-marker btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="IP Address"> </i>
|
||||
<span ng-bind="web.ipAddress"></span>
|
||||
</div>
|
||||
<div class="col-md-3 content-box-header">
|
||||
<i class="p fa fa-lock btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="SSL"> </i>
|
||||
<span><a ng-click="issueSSL(web.domain)" href="" style="text-transform: none">{% trans "Issue SSL" %}</a></span>
|
||||
</div>
|
||||
<div class="col-md-3 content-box-header">
|
||||
<span ng-bind="web.phpVersion"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-3 content-box-header">
|
||||
<i class="fa-solid fa-hard-drive btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="Disk Usage"> </i>
|
||||
<span ng-bind="web.diskUsed" style="text-transform: none"></span>
|
||||
</div>
|
||||
<div class="col-md-3 content-box-header">
|
||||
<i class="fa-solid fa-cubes btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="Packages"> </i>
|
||||
<span ng-bind="web.package" style="text-transform: none"></span>
|
||||
</div>
|
||||
<div class="col-md-3 content-box-header">
|
||||
<i class="fa-solid fa-user btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="Owner"> </i>
|
||||
<span ng-bind="web.admin" style="text-transform: none"></span>
|
||||
</div>
|
||||
<div class="col-md-3 content-box-header">
|
||||
<a href="javascript:void(0);" ng-click="$event.stopPropagation(); showWPSites(web.domain)" class="wp-sites-link">
|
||||
<i class="fa-brands fa-wordpress btn-icon text-muted" data-toggle="tooltip" data-placement="right" title="Show WordPress Sites"></i>
|
||||
<span ng-if="!web.loadingWPSites" class="wp-sites-count">
|
||||
{$ (web.wp_sites && web.wp_sites.length) || 0 $} WordPress Sites
|
||||
</span>
|
||||
<span ng-if="web.loadingWPSites" class="loading-indicator">
|
||||
Loading <i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- WordPress Sites Section -->
|
||||
<div class="col-md-12" ng-if="web.showWPSites && web.wp_sites && web.wp_sites.length > 0" style="padding: 15px 30px;">
|
||||
<div ng-repeat="wp in web.wp_sites" class="wp-site-item">
|
||||
<!-- Websites List with New Collapsed Design -->
|
||||
<div ng-repeat="web in WebSitesList track by $index" class="website-item">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<!-- Website Header (Always Visible) -->
|
||||
<div class="website-header">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="wp-site-header">
|
||||
<div class="row">
|
||||
<div class="col-sm-8">
|
||||
<h4>
|
||||
<i class="fa-brands fa-wordpress" style="color: #00749C; margin-right: 8px;"></i>
|
||||
{$ wp.title $}
|
||||
<span ng-if="wp.loading || wp.loadingPlugins || wp.loadingTheme" class="loading-indicator">
|
||||
<i class="fa fa-spinner fa-spin" style="color: #00749C; font-size: 14px;"></i>
|
||||
</span>
|
||||
</h4>
|
||||
<div class="col-sm-8">
|
||||
<h4>
|
||||
<i class="fas"
|
||||
ng-class="{'fa-chevron-down': isExpanded(web.domain), 'fa-chevron-right': !isExpanded(web.domain)}"
|
||||
ng-click="toggleSite(web)"
|
||||
style="cursor: pointer; margin-right: 10px; color: #666;"></i>
|
||||
<a href="http://{$ web.domain $}" target="_blank" title="Visit Site" style="text-decoration: none; color: #414C59;">
|
||||
{$ web.domain $}
|
||||
</a>
|
||||
<span ng-if="web.loading" class="loading-indicator">
|
||||
<i class="fa fa-spinner fa-spin" style="color: #00749C; font-size: 14px;"></i>
|
||||
</span>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-sm-4 text-right">
|
||||
<a href="/websites/{$ web.domain $}" target="_self" title="Manage Website" class="btn btn-primary btn-sm">
|
||||
<i class="fa fa-external-link"></i> {% trans "Manage" %}
|
||||
</a>
|
||||
<a target="_self" href="/filemanager/{$ web.domain $}" title="Open File Manager" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="fa fa-folder"></i> {% trans "File Manager" %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Website Content (Expandable) -->
|
||||
<div class="website-content" ng-if="isExpanded(web.domain)">
|
||||
<div class="row">
|
||||
<!-- Website Screenshot -->
|
||||
<div class="col-sm-3">
|
||||
<img ng-src="https://api.microlink.io/?url=https://{$ web.domain $}&screenshot=true&meta=false&embed=screenshot.url"
|
||||
alt="{$ web.domain $}"
|
||||
class="img-responsive website-screenshot"
|
||||
style="max-width: 100%; margin-bottom: 10px; min-height: 150px; background: #f5f5f5; border-radius: 6px;"
|
||||
onerror="this.onerror=null; this.src='{% static 'baseTemplate/assets/image-resources/webPanel.png' %}';">
|
||||
<div class="text-center website-action-buttons">
|
||||
<a href="http://{$ web.domain $}" target="_blank" class="btn btn-outline-secondary btn-sm">
|
||||
<i class="fa fa-external-link"></i> Visit Site
|
||||
</a>
|
||||
<a ng-click="issueSSL(web.domain)" href="javascript:void(0);" class="btn btn-outline-primary btn-sm">
|
||||
<i class="fa fa-lock"></i> {% trans "Issue SSL" %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Website Details -->
|
||||
<div class="col-sm-9">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label><i class="fa fa-sticky-note" style="margin-right: 5px;"></i>State</label>
|
||||
<span>{$ web.state $}</span>
|
||||
</div>
|
||||
<div class="col-sm-4 text-right">
|
||||
<button class="btn btn-outline-primary btn-sm wp-action-btn" ng-click="manageWP(wp.id)">
|
||||
<i class="fa-solid fa-cog"></i> Manage
|
||||
</button>
|
||||
<button class="btn btn-outline-danger btn-sm wp-action-btn" ng-click="deleteWPSite(wp)">
|
||||
<i class="fa-solid fa-trash"></i> Delete
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label><i class="fa fa-map-marker" style="margin-right: 5px;"></i>IP Address</label>
|
||||
<span>{$ web.ipAddress $}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label><i class="fa fa-code" style="margin-right: 5px;"></i>PHP Version</label>
|
||||
<span>{$ web.phpVersion $}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label><i class="fa fa-hard-drive" style="margin-right: 5px;"></i>Disk Usage</label>
|
||||
<span>{$ web.diskUsed $}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wp-site-content">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<img ng-src="{$ wp.screenshot $}"
|
||||
alt="{$ wp.title $}"
|
||||
class="img-responsive"
|
||||
style="max-width: 100%; margin-bottom: 10px; min-height: 150px; background: #f5f5f5;"
|
||||
onerror="this.onerror=null; this.src='https://s.wordpress.org/style/images/about/WordPress-logotype-standard.png';">
|
||||
<div class="text-center wp-action-buttons">
|
||||
<a href="javascript:void(0);" ng-click="visitSite(wp)" class="btn btn-outline-secondary btn-sm wp-action-btn">
|
||||
<i class="fa-solid fa-external-link"></i> Visit Site
|
||||
</a>
|
||||
<a href="{% url 'AutoLogin' %}?id={$ wp.id $}" target="_blank" class="btn btn-outline-primary btn-sm wp-action-btn">
|
||||
<i class="fa-brands fa-wordpress"></i> WP Login
|
||||
</a>
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label><i class="fa fa-cubes" style="margin-right: 5px;"></i>Package</label>
|
||||
<span>{$ web.package $}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label><i class="fa fa-user" style="margin-right: 5px;"></i>Owner</label>
|
||||
<span>{$ web.admin $}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="info-box">
|
||||
<label><i class="fa-brands fa-wordpress" style="margin-right: 5px;"></i>WordPress Sites</label>
|
||||
<div style="display: flex; align-items: center; gap: 10px;">
|
||||
<span>{$ (web.wp_sites && web.wp_sites.length) || 0 $} sites</span>
|
||||
<button ng-click="showWPSites(web.domain)" class="btn btn-outline-info btn-xs">
|
||||
<span ng-if="!web.loadingWPSites">
|
||||
<i class="fa" ng-class="{'fa-eye': !web.showWPSites, 'fa-eye-slash': web.showWPSites}"></i>
|
||||
{$ web.showWPSites ? 'Hide' : 'Show' $}
|
||||
</span>
|
||||
<span ng-if="web.loadingWPSites">
|
||||
Loading <i class="fa fa-spinner fa-spin"></i>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>WordPress</label>
|
||||
<span>{$ wp.version || 'Loading...' $}</span>
|
||||
<i ng-if="wp.loading" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- WordPress Sites Section -->
|
||||
<div ng-if="web.showWPSites && web.wp_sites && web.wp_sites.length > 0" style="margin-top: 20px;">
|
||||
<h5 style="margin-bottom: 15px; color: #00749C;">
|
||||
<i class="fa-brands fa-wordpress"></i> WordPress Sites ({$ web.wp_sites.length $})
|
||||
</h5>
|
||||
<div ng-repeat="wp in web.wp_sites" class="wp-site-item">
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="wp-site-header">
|
||||
<div class="row">
|
||||
<div class="col-sm-8">
|
||||
<h4>
|
||||
<i class="fa-brands fa-wordpress" style="color: #00749C; margin-right: 8px;"></i>
|
||||
{$ wp.title $}
|
||||
<span ng-if="wp.loading || wp.loadingPlugins || wp.loadingTheme" class="loading-indicator">
|
||||
<i class="fa fa-spinner fa-spin" style="color: #00749C; font-size: 14px;"></i>
|
||||
</span>
|
||||
</h4>
|
||||
</div>
|
||||
<div class="col-sm-4 text-right">
|
||||
<button class="btn btn-outline-primary btn-sm wp-action-btn" ng-click="manageWP(wp.id)">
|
||||
<i class="fa-solid fa-cog"></i> Manage
|
||||
</button>
|
||||
<button class="btn btn-outline-danger btn-sm wp-action-btn" ng-click="deleteWPSite(wp)">
|
||||
<i class="fa-solid fa-trash"></i> Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>PHP Version</label>
|
||||
<span>{$ wp.phpVersion || 'Loading...' $}</span>
|
||||
<i ng-if="wp.loading" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>Theme</label>
|
||||
<span>{$ wp.theme || 'Loading...' $}</span>
|
||||
<i ng-if="wp.loadingTheme" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>Plugins</label>
|
||||
<span>{$ wp.activePlugins || '0' $} active</span>
|
||||
<i ng-if="wp.loadingPlugins" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-3">
|
||||
<div class="col-sm-6">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-click="updateSetting(wp, 'search-indexing')"
|
||||
ng-checked="wp.searchIndex == 1">
|
||||
Search engine indexing
|
||||
</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-click="updateSetting(wp, 'debugging')"
|
||||
ng-checked="wp.debugging == 1">
|
||||
Debugging
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-model="wp.passwordProtection"
|
||||
ng-init="wp.passwordProtection = wp.passwordProtection || false"
|
||||
ng-change="togglePasswordProtection(wp)">
|
||||
Password protection
|
||||
</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-click="updateSetting(wp, 'maintenance-mode')"
|
||||
ng-checked="wp.maintenanceMode == 1">
|
||||
Maintenance mode
|
||||
</label>
|
||||
<div class="wp-site-content">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<img ng-src="{$ wp.screenshot $}"
|
||||
alt="{$ wp.title $}"
|
||||
class="img-responsive"
|
||||
style="max-width: 100%; margin-bottom: 10px; min-height: 150px; background: #f5f5f5;"
|
||||
onerror="this.onerror=null; this.src='https://s.wordpress.org/style/images/about/WordPress-logotype-standard.png';">
|
||||
<div class="text-center wp-action-buttons">
|
||||
<a href="javascript:void(0);" ng-click="visitSite(wp)" class="btn btn-outline-secondary btn-sm wp-action-btn">
|
||||
<i class="fa-solid fa-external-link"></i> Visit Site
|
||||
</a>
|
||||
<a href="{% url 'AutoLogin' %}?id={$ wp.id $}" target="_blank" class="btn btn-outline-primary btn-sm wp-action-btn">
|
||||
<i class="fa-brands fa-wordpress"></i> WP Login
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>WordPress</label>
|
||||
<span>{$ wp.version || 'Loading...' $}</span>
|
||||
<i ng-if="wp.loading" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>PHP Version</label>
|
||||
<span>{$ wp.phpVersion || 'Loading...' $}</span>
|
||||
<i ng-if="wp.loading" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>Theme</label>
|
||||
<span>{$ wp.theme || 'Loading...' $}</span>
|
||||
<i ng-if="wp.loadingTheme" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-3">
|
||||
<div class="info-box">
|
||||
<label>Plugins</label>
|
||||
<span>{$ wp.activePlugins || '0' $} active</span>
|
||||
<i ng-if="wp.loadingPlugins" class="fa fa-spinner fa-spin" style="margin-left: 5px; font-size: 12px;"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-3">
|
||||
<div class="col-sm-6">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-click="updateSetting(wp, 'search-indexing')"
|
||||
ng-checked="wp.searchIndex == 1">
|
||||
Search engine indexing
|
||||
</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-click="updateSetting(wp, 'debugging')"
|
||||
ng-checked="wp.debugging == 1">
|
||||
Debugging
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-model="wp.passwordProtection"
|
||||
ng-init="wp.passwordProtection = wp.passwordProtection || false"
|
||||
ng-change="togglePasswordProtection(wp)">
|
||||
Password protection
|
||||
</label>
|
||||
</div>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<input type="checkbox"
|
||||
ng-click="updateSetting(wp, 'maintenance-mode')"
|
||||
ng-checked="wp.maintenanceMode == 1">
|
||||
Maintenance mode
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -263,11 +320,15 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="listFail" class="alert alert-danger">
|
||||
<p>{% trans "Cannot list websites. Error message:" %} {$ errorMessage $}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Error Display -->
|
||||
<div id="listFail" class="alert alert-danger" style="display: none;">
|
||||
<p>{% trans "Cannot list websites. Error message:" %} {$ errorMessage $}</p>
|
||||
</div>
|
||||
|
||||
<!-- Pagination -->
|
||||
<div style="margin-top: 2%" class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="row">
|
||||
|
|
@ -281,61 +342,111 @@
|
|||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- end row -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Enhanced Styles -->
|
||||
<style>
|
||||
.wp-site-item {
|
||||
border: 1px solid #e0e0e0;
|
||||
/* Website Item Styles */
|
||||
.website-item {
|
||||
border: 1px solid #ddd;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 8px;
|
||||
background: white;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
|
||||
}
|
||||
.wp-site-header {
|
||||
|
||||
.website-header {
|
||||
padding: 15px 20px;
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
border-bottom: 1px solid #ddd;
|
||||
background: #f8f9fa;
|
||||
border-radius: 8px 8px 0 0;
|
||||
cursor:pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
.wp-site-header h4 {
|
||||
|
||||
.website-header h4 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
line-height: 34px;
|
||||
color: #2c3338;
|
||||
font-weight: 500;
|
||||
}
|
||||
.wp-site-content {
|
||||
|
||||
.website-content {
|
||||
padding: 20px;
|
||||
background: #fff;
|
||||
border-radius: 0 0 8px 8px;
|
||||
}
|
||||
|
||||
.website-screenshot {
|
||||
border: 1px solid #e0e0e0;
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.website-action-buttons {
|
||||
margin-top: 15px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Info Box Styles */
|
||||
.info-box {
|
||||
margin-bottom: 15px;
|
||||
background: #f8f9fa;
|
||||
padding: 10px;
|
||||
padding: 12px;
|
||||
border-radius: 6px;
|
||||
border-left: 3px solid #007cba;
|
||||
}
|
||||
|
||||
.info-box label {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #646970;
|
||||
margin-bottom: 5px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 6px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.info-box span {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #2c3338;
|
||||
}
|
||||
.checkbox {
|
||||
margin-bottom: 10px;
|
||||
|
||||
/* WordPress Site Styles */
|
||||
.wp-site-item {
|
||||
border: 1px solid #e0e0e0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 6px;
|
||||
background: white;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
|
||||
}
|
||||
.mt-3 {
|
||||
margin-top: 1rem;
|
||||
|
||||
.wp-site-header {
|
||||
padding: 12px 15px;
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
background: #f8f9fa;
|
||||
border-radius: 6px 6px 0 0;
|
||||
}
|
||||
|
||||
.wp-site-header h4 {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
line-height: 28px;
|
||||
color: #2c3338;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.wp-site-content {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
/* Button Styles */
|
||||
.wp-action-btn {
|
||||
margin: 0 4px;
|
||||
padding: 6px 12px;
|
||||
|
|
@ -350,64 +461,36 @@
|
|||
vertical-align: middle;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.wp-action-btn i {
|
||||
margin-right: 6px;
|
||||
font-size: 14px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.wp-action-buttons {
|
||||
margin-top: 12px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.wp-action-buttons .wp-action-btn {
|
||||
min-width: 110px;
|
||||
flex: 0 1 auto;
|
||||
}
|
||||
.btn-outline-primary {
|
||||
color: #0073aa;
|
||||
border-color: #0073aa;
|
||||
|
||||
/* Checkbox Styles */
|
||||
.checkbox {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.btn-outline-primary:hover {
|
||||
background-color: #0073aa;
|
||||
color: white;
|
||||
}
|
||||
.btn-outline-secondary {
|
||||
color: #50575e;
|
||||
border-color: #50575e;
|
||||
}
|
||||
.btn-outline-secondary:hover {
|
||||
background-color: #50575e;
|
||||
color: white;
|
||||
}
|
||||
.btn-outline-danger {
|
||||
color: #dc3545;
|
||||
border-color: #dc3545;
|
||||
}
|
||||
.btn-outline-danger:hover {
|
||||
background-color: #dc3545;
|
||||
color: white;
|
||||
}
|
||||
.wp-sites-link {
|
||||
cursor: pointer;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.wp-sites-link:hover {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.wp-sites-link i.btn-icon {
|
||||
margin-right: 4px;
|
||||
}
|
||||
.wp-sites-count {
|
||||
text-transform: none;
|
||||
|
||||
.mt-3 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
/* Loading Indicator */
|
||||
.loading-indicator {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
|
@ -416,10 +499,68 @@
|
|||
font-size: 14px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.loading-indicator i {
|
||||
font-size: 14px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
/* Button Color Overrides */
|
||||
.btn-outline-primary {
|
||||
color: #0073aa;
|
||||
border-color: #0073aa;
|
||||
}
|
||||
|
||||
.btn-outline-primary:hover {
|
||||
background-color: #0073aa;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-outline-secondary {
|
||||
color: #50575e;
|
||||
border-color: #50575e;
|
||||
}
|
||||
|
||||
.btn-outline-secondary:hover {
|
||||
background-color: #50575e;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-outline-danger {
|
||||
color: #dc3545;
|
||||
border-color: #dc3545;
|
||||
}
|
||||
|
||||
.btn-outline-danger:hover {
|
||||
background-color: #dc3545;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-outline-info {
|
||||
color: #17a2b8;
|
||||
border-color: #17a2b8;
|
||||
}
|
||||
|
||||
.btn-outline-info:hover {
|
||||
background-color: #17a2b8;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Responsive adjustments */
|
||||
@media (max-width: 768px) {
|
||||
.website-header .col-sm-4 {
|
||||
text-align: left !important;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.website-action-buttons {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
{% endblock %}
|
||||
|
|
|
|||
Loading…
Reference in New Issue