xicon/xtr-improved-frontend
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[TASK] #3 Change overflowing spinner - [FIX] Reload - set active bug

Browse Source
This commit is contained in:
XiCoN-Luan- 2019-12-08 21:19:41 +01:00
parent ca991a705b
commit ab8daba952
5 changed files with 29 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dist/main.js vendored
View File

File diff suppressed because one or more lines are too long

8
package-lock.json generated
View File

@ -7491,10 +7491,10 @@
"vue-style-loader": "^4.1.0"
}
},
"vue-loading-button": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/vue-loading-button/-/vue-loading-button-0.2.0.tgz",
"integrity": "sha512-HjlNzS2deIaXGr7cZU/J/SiaZfA6OvJC+vzujTohUCs0cF+6G9p4SfTquT4watDFl5m3yO4OBEaxhE99JQLBNA=="
"vue-spinners-css": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/vue-spinners-css/-/vue-spinners-css-1.1.3.tgz",
"integrity": "sha512-EbWBH2tPj+YjJOYcZ8gyFCYFK0QCxECCH5xFUeOXKxvN4tVgP6Axk5A60ld+GUBcg+YuBn/EYSG/jifEWpzi9Q=="
},
"vue-style-loader": {
"version": "4.1.2",

4
package.json
View File

@ -22,9 +22,9 @@
"vue-style-loader": "^4.1.2",
"vue-template-compiler": "^2.5.17",
"axios": "^0.19.0",
"vue-loading-button": "^0.2.0",
"webpack": "^4.41.2",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.9.0"
"webpack-dev-server": "^3.9.0",
"vue-spinners-css": "^1.1.3"
}
}

30
src/StatusBox.vue
View File

@ -11,14 +11,11 @@
</select>
<input v-model="target" placeholder="Enter Ip or Domain">
<VueLoadingButton
:id="'vueOwnButtonStyle'"
aria-label="Post message"
class="button"
@click.native="handleClick"
:loading="isLoading"
:styled="false"
>⛟</VueLoadingButton> <br>
<button v-on:click="handleClick()">
⛟
</button>
<RingLoader :size="10" :loading="isLoading" color="black"></RingLoader>
<br>
<span class="small">{{infoString}}</span>
<div>
@ -55,11 +52,11 @@
import axios from 'axios';
import XtrServer from './ModelObjects/XtrServer.js';
import XtrData from './ModelObjects/XtrData.js';
import VueLoadingButton from 'vue-loading-button';
import { RingLoader } from 'vue-spinners-css';
export default {
components: {
VueLoadingButton
RingLoader
},
props: {
serverlist: Array,
@ -350,16 +347,5 @@ export default {
50% { transform: rotate(30deg); }
75% { transform: rotate(0deg); }
100% { transform: rotate(-30deg); }
}
button#vueOwnButtonStyle {
font-family: inherit;
font-size: 0.9rem;
line-height: 1.15;
margin: 0;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
}
}
</style>

24
src/StatusBoxContainer.vue
View File

@ -148,12 +148,15 @@ export default {
});
},
setActive: function setActive(tableId) {
var settedClasses = document.getElementById("tableId_"+tableId).className;
if (settedClasses == 'table table-striped') {
document.getElementById("tableId_"+tableId).className = 'table table-striped active';
} else {
document.getElementById("tableId_"+tableId).className = 'table table-striped';
}
this.$nextTick(() => {
var settedClasses = document.getElementById("tableId_"+tableId).className;
if (settedClasses == 'table table-striped') {
document.getElementById("tableId_"+tableId).className = 'table table-striped active';
} else {
document.getElementById("tableId_"+tableId).className = 'table table-striped';
}
});
},
setActiveFromSession: function setActiveFromSession(tableIds) {
tableIds.forEach(tableId => {
@ -220,19 +223,16 @@ export default {
padding: 5px;
}
.info
{
.info {
display: block; position: absolute; right: 10px; top: 10px;
}
.info:hover .info_box
{
.info:hover .info_box {
visibility: visible;
z-index: 4;
}
.info .info_box
{
.info .info_box {
display: block;
position: absolute;
right: 0px;