Skip to content
This repository was archived by the owner on Mar 11, 2025. It is now read-only.

Commit 75f8133

Browse files
author
slamy
committedNov 6, 2022
Fixes to new UI. Added news
1 parent dbc1848 commit 75f8133

File tree

16 files changed

+247
-23
lines changed

16 files changed

+247
-23
lines changed
 

‎news.json

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
[
2+
{
3+
"index": 1,
4+
"title": "Заблокований Discord",
5+
"content": "Наше діскорд комюніті заблокували і не хочуть відновлювати доступ. Рашики-парашики. Ну що ж, зробимо стрічку новин тут. Підключайтеся до телеграму та до офіційного каналу IT Army.",
6+
"icon": "report",
7+
"iconColor": "red",
8+
"date": "06-11-2022"
9+
},
10+
{
11+
"index": 0,
12+
"title": "Оновлення 1.0.11",
13+
"content": "Редизайн проекту. Тепер ще приємніше валити русню.",
14+
"icon": "star",
15+
"iconColor": "yellow",
16+
"date": "06-11-2022"
17+
}
18+
]

‎src/components/main/DDoS.vue

+7-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,9 @@
22
<q-card style="border-radius: 10px" class="q-pa-md bg-primary full-card">
33
<div class="row justify-between">
44
<div v-text="$t('main.ddos.ip.name')" />
5-
<div v-text="'soon' /*$store.state.settings.ip*/" />
5+
<div v-text="$store.state.settings.ip + ' ' + $store.state.settings.countryCode" />
6+
<q-btn icon="cached" size="xs" @click="$store.dispatch('settings/fetchIpAddress')"/>
7+
<!-- <q-btn size="xs" rounded v-text="$store.state.settings.countryCode" href="https://google.com" /> -->
68
</div>
79

810
<div class="q-mt-sm row justify-between items-center">
@@ -88,14 +90,17 @@ export default defineComponent({
8890
get () { return this.$store.getters['ddos/maxWorkers'] },
8991
async set (val: boolean) { await this.$store.dispatch('ddos/updateMaxWorkers', Number(val)) }
9092
}
93+
},
94+
95+
mounted () {
96+
void this.$store.dispatch('settings/fetchIpAddress')
9197
}
9298
})
9399
</script>
94100

95101
<style lang="sass" scoped>
96102
.full-card
97103
font-size: 12px
98-
max-width: 266px
99104
100105
.switch
101106
position: relative

‎src/components/main/News.vue

+77
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
<template>
2+
<q-card style="border-radius: 10px" class="q-pa-md bg-primary full-card">
3+
<div class="text-white text-subtitle1" v-text="$t('main.news.news')" />
4+
<q-spinner v-if="!$store.getters['news/loaded']" />
5+
<q-scroll-area
6+
:thumb-style="thumbStyle"
7+
:bar-style="barStyle"
8+
style="height: 400px"
9+
id="scroll-area-with-virtual-scroll-1"
10+
>
11+
<q-virtual-scroll
12+
scroll-target="#scroll-area-with-virtual-scroll-1 > .scroll"
13+
:items="$store.getters['news/news']"
14+
:virtual-scroll-item-size="32"
15+
separator
16+
>
17+
<template v-slot="{ item, index }">
18+
<q-item :key="index" dense>
19+
<q-item-section>
20+
<q-item-label class="text-white">{{ item.title }}</q-item-label>
21+
<q-item-label caption class="text-grey">{{ item.content }}</q-item-label>
22+
</q-item-section>
23+
24+
<q-item-section side top>
25+
<q-item-label caption class="text-white">{{ item.date }}</q-item-label>
26+
<q-icon :name="item.icon" :color="item.iconColor" />
27+
</q-item-section>
28+
</q-item>
29+
<q-separator></q-separator>
30+
</template>
31+
</q-virtual-scroll>
32+
</q-scroll-area>
33+
</q-card>
34+
</template>
35+
36+
<script lang="ts">
37+
import { defineComponent } from 'vue'
38+
39+
export default defineComponent({
40+
name: 'NewsComponent',
41+
42+
data () {
43+
return {
44+
thumbStyle: {
45+
right: '5px',
46+
borderRadius: '8px',
47+
backgroundColor: '#027be3',
48+
width: '8px',
49+
opacity: 0.75
50+
},
51+
52+
barStyle: {
53+
right: '2px',
54+
borderRadius: '14px',
55+
backgroundColor: '#027be3',
56+
width: '14px',
57+
opacity: 0.2,
58+
marginTop: '-3px',
59+
marginBottom: '-3px',
60+
paddingTop: '3px',
61+
paddingBottom: '3px'
62+
}
63+
}
64+
},
65+
66+
mounted () {
67+
void this.$store.dispatch('news/load')
68+
}
69+
})
70+
</script>
71+
72+
<style lang="sass" scoped>
73+
.full-card
74+
width: 100%
75+
min-width: 180px
76+
font-size: 13px
77+
</style>

‎src/components/main/Settings.vue

-1
Original file line numberDiff line numberDiff line change
@@ -96,5 +96,4 @@ export default defineComponent({
9696
<style lang="sass" scoped>
9797
.full-card
9898
font-size: 13px
99-
max-width: 266px
10099
</style>

‎src/i18n/en-US/index.ts

+3
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,9 @@ export default {
122122
}
123123
},
124124
currentThreads: 'Current threads'
125+
},
126+
news: {
127+
news: "News"
125128
}
126129
},
127130
dashboard: {

‎src/layouts/MainLayout.vue

+7-6
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,20 @@
22
<template>
33
<q-layout view="hHh lpR fFf" background="dark">
44

5+
<!--
56
<q-header reveal elevated class="bg-grey-10 text-white">
67
<q-toolbar>
78
<q-btn dense flat round icon="menu" @click="toggleLeftDrawer" />
89
910
<q-toolbar-title>
10-
<!-- <q-avatar>
11-
<img src="USC512.png">
12-
</q-avatar> -->
11+
1312
{{ header }}
1413
</q-toolbar-title>
1514
</q-toolbar>
1615
</q-header>
16+
-->
1717

18+
<!--
1819
<q-drawer v-model="leftDrawerOpen" side="left" class="bg-grey-10 text-white" overlay elevated>
1920
<q-list bordered separator class="q-mt-sm">
2021
<MenuLink
@@ -27,8 +28,8 @@
2728
:icon="link.icon"
2829
/>
2930
</q-list>
30-
<!-- drawer content -->
3131
</q-drawer>
32+
-->
3233

3334
<q-page-container>
3435
<router-view />
@@ -40,7 +41,7 @@
4041
<script lang="ts">
4142
import { defineComponent, ref } from 'vue'
4243
43-
import MenuLink from 'components/layout/MenuLink.vue'
44+
// import MenuLink from 'components/layout/MenuLink.vue'
4445
4546
const menuList = [
4647
{
@@ -73,7 +74,7 @@ export default defineComponent({
7374
name: 'MainLayout',
7475
7576
components: {
76-
MenuLink
77+
// MenuLink
7778
},
7879
7980
computed: {

‎src/pages/Main.vue

+14-12
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
<template>
22
<q-page class="main-page q-pa-sm bg-grey-10">
3-
<div class="row q-gutter-sm">
4-
<div>
5-
<DDoS />
3+
<div class="row">
4+
<div class="q-pa-sm col-xs-12 col-sm-3 col-md-2">
5+
<DDoS class="q-mt-sm"/>
66
<Settings class="q-mt-sm" />
77
</div>
8-
<div class="col" style="min-width: 600px">
9-
<Session class="col" />
8+
<div class="q-pa-sm col-xs-12 col-sm-9 col-md-6">
9+
<Session class="q-mt-sm"/>
1010
</div>
11-
<div>
12-
<Statistics />
11+
<div class="q-pa-sm col-xs-12 col-sm-12 col-md-4">
12+
<Statistics class="q-mt-sm"/>
13+
<News class="q-mt-sm" />
1314
</div>
1415
</div>
1516

16-
<q-icon class="fixed-bottom-right q-mr-sm q-mb-sm" name="discord" size="40px">
17-
<q-menu class="discord-menu">
18-
{{ getLocalExternalIP }}
19-
<div>https://discord.gg/7BfJ9JKQ98</div>
17+
<q-icon class="fixed-bottom-right q-mr-sm q-mb-sm" name="telegram" size="40px">
18+
<q-menu class="telegram-menu">
19+
<div>https://t.me/uashield</div>
2020
</q-menu>
2121
</q-icon>
2222
<UpdateModal />
@@ -30,6 +30,7 @@ import DDoS from 'src/components/main/DDoS.vue'
3030
import Settings from 'src/components/main/Settings.vue'
3131
import Session from 'src/components/main/Session.vue'
3232
import Statistics from 'src/components/main/Statistics.vue'
33+
import News from 'src/components/main/News.vue'
3334
import UpdateModal from 'components/modals/UpdateModal.vue'
3435
3536
export default defineComponent({
@@ -40,6 +41,7 @@ export default defineComponent({
4041
Settings,
4142
Session,
4243
Statistics,
44+
News,
4345
UpdateModal
4446
}
4547
})
@@ -63,7 +65,7 @@ export default defineComponent({
6365
background: $light
6466
border: 1px solid $lighter
6567
66-
.discord-menu
68+
.telegram-menu
6769
padding: 3px 6px
6870
overflow: hidden
6971
background: $light

‎src/store/index.ts

+9-2
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,10 @@ import ddos from './ddos'
1010
import { DDoSState } from './ddos/state'
1111
import { DDoSGetters } from './ddos/getters'
1212

13+
import news from './news'
14+
import { NewsState } from './news/state'
15+
import { NewsGetters } from './news/getters'
16+
1317
import statistics from './statistics'
1418
import { StatisticsState } from './statistics/state'
1519
import { StatisticsGetters } from './statistics/getters'
@@ -22,6 +26,7 @@ export interface StateInterface {
2226
ddos: DDoSState
2327
statistics: StatisticsState
2428
settings: SettingsState
29+
news: NewsState
2530
}
2631

2732
type Store = Omit<
@@ -31,7 +36,8 @@ type Store = Omit<
3136
getters:
3237
DDoSGetters &
3338
StatisticsGetters &
34-
SettingsGetters
39+
SettingsGetters &
40+
NewsGetters
3541
}
3642

3743
// provide typings for `this.$store`
@@ -49,7 +55,8 @@ export default store(function (/* { ssrContext } */) {
4955
modules: {
5056
ddos,
5157
statistics,
52-
settings
58+
settings,
59+
news
5360
},
5461

5562
// enable strict mode (adds overhead!)

‎src/store/news/actions.ts

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
2+
import axios from 'axios'
3+
import { ActionTree } from 'vuex'
4+
import { StateInterface } from '../index'
5+
import { NewsState, NewsEntry } from './state'
6+
7+
const NEWS_LINK = 'https://raw.githubusercontent.com/opengs/uashield/master/news.json'
8+
9+
const actions: ActionTree<NewsState, StateInterface> = {
10+
async load ({ commit }) {
11+
const response = await axios.get<Array<NewsEntry>>(NEWS_LINK)
12+
commit('SET_NEWS', response.data)
13+
}
14+
}
15+
16+
export default actions

‎src/store/news/getters.ts

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { GetterTree } from 'vuex'
2+
import { StateInterface } from '../index'
3+
import { NewsState, NewsEntry } from './state'
4+
5+
export interface NewsGetters {
6+
'news/news': Array<NewsEntry>
7+
'news/loaded': boolean
8+
}
9+
10+
const getters: GetterTree<NewsState, StateInterface> = {
11+
news ({ news }) {
12+
return news
13+
},
14+
loaded ({ loaded }) {
15+
return loaded
16+
}
17+
}
18+
19+
export default getters

‎src/store/news/index.ts

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { Module } from 'vuex'
2+
import { StateInterface } from '../index'
3+
import state, { NewsState } from './state'
4+
import actions from './actions'
5+
import getters from './getters'
6+
import mutations from './mutations'
7+
8+
const newsModule: Module<NewsState, StateInterface> = {
9+
namespaced: true,
10+
actions,
11+
getters,
12+
mutations,
13+
state
14+
}
15+
16+
export default newsModule

‎src/store/news/mutations.ts

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { MutationTree } from 'vuex'
2+
import { NewsState, NewsEntry } from './state'
3+
4+
const mutation: MutationTree<NewsState> = {
5+
SET_NEWS (storage, news: Array<NewsEntry>) {
6+
storage.loaded = true
7+
storage.news = news
8+
}
9+
}
10+
11+
export default mutation

‎src/store/news/state.ts

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
export interface NewsEntry {
2+
index: number
3+
title: string
4+
content: string
5+
icon: string
6+
iconColor: string
7+
date: string
8+
}
9+
10+
export interface NewsState {
11+
loaded: boolean
12+
news: Array<NewsEntry>
13+
}
14+
15+
function state (): NewsState {
16+
return {
17+
loaded: false,
18+
news: []
19+
}
20+
}
21+
22+
export default state

‎src/store/settings/actions.ts

+17
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { StateInterface } from '../index'
44
import { SettingsState } from './state'
55

66
import { UserData } from '../../../src-lib/storage'
7+
import axios from 'axios'
78

89
const actions: ActionTree<SettingsState, StateInterface> = {
910
loadFromUserData ({ commit }, data: UserData) {
@@ -16,6 +17,22 @@ const actions: ActionTree<SettingsState, StateInterface> = {
1617
commit('SET_LOG_REQUESTS', data.settings.log.requests)
1718
},
1819

20+
async fetchIpAddress ({ commit }) {
21+
interface IpFetchResponse {
22+
query: string
23+
countryCode: string
24+
}
25+
try {
26+
const dataResponse = await axios.get<IpFetchResponse>('http://ip-api.com/json')
27+
commit('SET_IP', dataResponse.data.query)
28+
commit('SET_COUNTRYCODE', dataResponse.data.countryCode)
29+
} catch (e) {
30+
console.log('Failed to load IP information. ' + String(e))
31+
commit('SET_IP', 'undefined')
32+
commit('SET_COUNTRYCODE', '')
33+
}
34+
},
35+
1936
setLanguage ({ commit }, value: string) {
2037
window.require('electron').ipcRenderer.send('settingsSetLanguage', value)
2138
commit('SET_LANGUAGE', value)

‎src/store/settings/mutations.ts

+3
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@ const mutation: MutationTree<SettingsState> = {
77
SET_IP (storage, ip: string) {
88
storage.ip = ip
99
},
10+
SET_COUNTRYCODE (storage, countryCode: string) {
11+
storage.countryCode = countryCode
12+
},
1013
SET_LANGUAGE (storage, language: string) {
1114
i18n.global.locale = language
1215
storage.language = language

‎src/store/settings/state.ts

+8
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
export interface SettingsState {
22
ip: string
3+
countryCode: string
4+
lat: number
5+
lon: number
6+
37
language: string
48
autoLaunch: boolean
59
autoUpdate: boolean
@@ -11,6 +15,10 @@ export interface SettingsState {
1115
function state (): SettingsState {
1216
return {
1317
ip: '',
18+
countryCode: '',
19+
lat: 0,
20+
lon: 0,
21+
1422
language: 'en-US',
1523
autoLaunch: true,
1624
autoUpdate: true,

0 commit comments

Comments
 (0)
This repository has been archived.