40 changed files with 15141 additions and 0 deletions
@ -0,0 +1,23 @@ |
|||
.DS_Store |
|||
node_modules |
|||
/dist |
|||
|
|||
|
|||
# local env files |
|||
.env.local |
|||
.env.*.local |
|||
|
|||
# Log files |
|||
npm-debug.log* |
|||
yarn-debug.log* |
|||
yarn-error.log* |
|||
pnpm-debug.log* |
|||
|
|||
# Editor directories and files |
|||
.idea |
|||
.vscode |
|||
*.suo |
|||
*.ntvs* |
|||
*.njsproj |
|||
*.sln |
|||
*.sw? |
|||
@ -0,0 +1,15 @@ |
|||
|
|||
το σενάριο είναι |
|||
|
|||
|
|||
1. git pull |
|||
|
|||
2. γράφεις κώδικα |
|||
|
|||
3. git add |
|||
|
|||
4. git commit -m"pla pla" |
|||
|
|||
5. git push origin |
|||
|
|||
|
|||
@ -0,0 +1,614 @@ |
|||
GNU AFFERO GENERAL PUBLIC LICENSE |
|||
|
|||
Version 3, 19 November 2007 |
|||
|
|||
Copyright (C) 2007 Free Software Foundation, Inc. <http s ://fsf.org/> |
|||
|
|||
Everyone is permitted to copy and distribute verbatim copies of this license |
|||
document, but changing it is not allowed. |
|||
|
|||
Preamble |
|||
|
|||
The GNU Affero General Public License is a free, copyleft license for software |
|||
and other kinds of works, specifically designed to ensure cooperation with |
|||
the community in the case of network server software. |
|||
|
|||
The licenses for most software and other practical works are designed to take |
|||
away your freedom to share and change the works. By contrast, our General |
|||
Public Licenses are intended to guarantee your freedom to share and change |
|||
all versions of a program--to make sure it remains free software for all its |
|||
users. |
|||
|
|||
When we speak of free software, we are referring to freedom, not price. Our |
|||
General Public Licenses are designed to make sure that you have the freedom |
|||
to distribute copies of free software (and charge for them if you wish), that |
|||
you receive source code or can get it if you want it, that you can change |
|||
the software or use pieces of it in new free programs, and that you know you |
|||
can do these things. |
|||
|
|||
Developers that use our General Public Licenses protect your rights with two |
|||
steps: (1) assert copyright on the software, and (2) offer you this License |
|||
which gives you legal permission to copy, distribute and/or modify the software. |
|||
|
|||
A secondary benefit of defending all users' freedom is that improvements made |
|||
in alternate versions of the program, if they receive widespread use, become |
|||
available for other developers to incorporate. Many developers of free software |
|||
are heartened and encouraged by the resulting cooperation. However, in the |
|||
case of software used on network servers, this result may fail to come about. |
|||
The GNU General Public License permits making a modified version and letting |
|||
the public access it on a server without ever releasing its source code to |
|||
the public. |
|||
|
|||
The GNU Affero General Public License is designed specifically to ensure that, |
|||
in such cases, the modified source code becomes available to the community. |
|||
It requires the operator of a network server to provide the source code of |
|||
the modified version running there to the users of that server. Therefore, |
|||
public use of a modified version, on a publicly accessible server, gives the |
|||
public access to the source code of the modified version. |
|||
|
|||
An older license, called the Affero General Public License and published by |
|||
Affero, was designed to accomplish similar goals. This is a different license, |
|||
not a version of the Affero GPL, but Affero has released a new version of |
|||
the Affero GPL which permits relicensing under this license. |
|||
|
|||
The precise terms and conditions for copying, distribution and modification |
|||
follow. |
|||
|
|||
TERMS AND CONDITIONS |
|||
|
|||
0. Definitions. |
|||
|
|||
"This License" refers to version 3 of the GNU Affero General Public License. |
|||
|
|||
"Copyright" also means copyright-like laws that apply to other kinds of works, |
|||
such as semiconductor masks. |
|||
|
|||
"The Program" refers to any copyrightable work licensed under this License. |
|||
Each licensee is addressed as "you". "Licensees" and "recipients" may be individuals |
|||
or organizations. |
|||
|
|||
To "modify" a work means to copy from or adapt all or part of the work in |
|||
a fashion requiring copyright permission, other than the making of an exact |
|||
copy. The resulting work is called a "modified version" of the earlier work |
|||
or a work "based on" the earlier work. |
|||
|
|||
A "covered work" means either the unmodified Program or a work based on the |
|||
Program. |
|||
|
|||
To "propagate" a work means to do anything with it that, without permission, |
|||
would make you directly or secondarily liable for infringement under applicable |
|||
copyright law, except executing it on a computer or modifying a private copy. |
|||
Propagation includes copying, distribution (with or without modification), |
|||
making available to the public, and in some countries other activities as |
|||
well. |
|||
|
|||
To "convey" a work means any kind of propagation that enables other parties |
|||
to make or receive copies. Mere interaction with a user through a computer |
|||
network, with no transfer of a copy, is not conveying. |
|||
|
|||
An interactive user interface displays "Appropriate Legal Notices" to the |
|||
extent that it includes a convenient and prominently visible feature that |
|||
(1) displays an appropriate copyright notice, and (2) tells the user that |
|||
there is no warranty for the work (except to the extent that warranties are |
|||
provided), that licensees may convey the work under this License, and how |
|||
to view a copy of this License. If the interface presents a list of user commands |
|||
or options, such as a menu, a prominent item in the list meets this criterion. |
|||
|
|||
1. Source Code. |
|||
|
|||
The "source code" for a work means the preferred form of the work for making |
|||
modifications to it. "Object code" means any non-source form of a work. |
|||
|
|||
A "Standard Interface" means an interface that either is an official standard |
|||
defined by a recognized standards body, or, in the case of interfaces specified |
|||
for a particular programming language, one that is widely used among developers |
|||
working in that language. |
|||
|
|||
The "System Libraries" of an executable work include anything, other than |
|||
the work as a whole, that (a) is included in the normal form of packaging |
|||
a Major Component, but which is not part of that Major Component, and (b) |
|||
serves only to enable use of the work with that Major Component, or to implement |
|||
a Standard Interface for which an implementation is available to the public |
|||
in source code form. A "Major Component", in this context, means a major essential |
|||
component (kernel, window system, and so on) of the specific operating system |
|||
(if any) on which the executable work runs, or a compiler used to produce |
|||
the work, or an object code interpreter used to run it. |
|||
|
|||
The "Corresponding Source" for a work in object code form means all the source |
|||
code needed to generate, install, and (for an executable work) run the object |
|||
code and to modify the work, including scripts to control those activities. |
|||
However, it does not include the work's System Libraries, or general-purpose |
|||
tools or generally available free programs which are used unmodified in performing |
|||
those activities but which are not part of the work. For example, Corresponding |
|||
Source includes interface definition files associated with source files for |
|||
the work, and the source code for shared libraries and dynamically linked |
|||
subprograms that the work is specifically designed to require, such as by |
|||
intimate data communication or control flow between those |
|||
|
|||
subprograms and other parts of the work. |
|||
|
|||
The Corresponding Source need not include anything that users can regenerate |
|||
automatically from other parts of the Corresponding Source. |
|||
|
|||
The Corresponding Source for a work in source code form is that same work. |
|||
|
|||
2. Basic Permissions. |
|||
|
|||
All rights granted under this License are granted for the term of copyright |
|||
on the Program, and are irrevocable provided the stated conditions are met. |
|||
This License explicitly affirms your unlimited permission to run the unmodified |
|||
Program. The output from running a covered work is covered by this License |
|||
only if the output, given its content, constitutes a covered work. This License |
|||
acknowledges your rights of fair use or other equivalent, as provided by copyright |
|||
law. |
|||
|
|||
You may make, run and propagate covered works that you do not convey, without |
|||
conditions so long as your license otherwise remains in force. You may convey |
|||
covered works to others for the sole purpose of having them make modifications |
|||
exclusively for you, or provide you with facilities for running those works, |
|||
provided that you comply with the terms of this License in conveying all material |
|||
for which you do not control copyright. Those thus making or running the covered |
|||
works for you must do so exclusively on your behalf, under your direction |
|||
and control, on terms that prohibit them from making any copies of your copyrighted |
|||
material outside their relationship with you. |
|||
|
|||
Conveying under any other circumstances is permitted solely under the conditions |
|||
stated below. Sublicensing is not allowed; section 10 makes it unnecessary. |
|||
|
|||
3. Protecting Users' Legal Rights From Anti-Circumvention Law. |
|||
|
|||
No covered work shall be deemed part of an effective technological measure |
|||
under any applicable law fulfilling obligations under article 11 of the WIPO |
|||
copyright treaty adopted on 20 December 1996, or similar laws prohibiting |
|||
or restricting circumvention of such measures. |
|||
|
|||
When you convey a covered work, you waive any legal power to forbid circumvention |
|||
of technological measures to the extent such circumvention is effected by |
|||
exercising rights under this License with respect to the covered work, and |
|||
you disclaim any intention to limit operation or modification of the work |
|||
as a means of enforcing, against the work's users, your or third parties' |
|||
legal rights to forbid circumvention of technological measures. |
|||
|
|||
4. Conveying Verbatim Copies. |
|||
|
|||
You may convey verbatim copies of the Program's source code as you receive |
|||
it, in any medium, provided that you conspicuously and appropriately publish |
|||
on each copy an appropriate copyright notice; keep intact all notices stating |
|||
that this License and any non-permissive terms added in accord with section |
|||
7 apply to the code; keep intact all notices of the absence of any warranty; |
|||
and give all recipients a copy of this License along with the Program. |
|||
|
|||
You may charge any price or no price for each copy that you convey, and you |
|||
may offer support or warranty protection for a fee. |
|||
|
|||
5. Conveying Modified Source Versions. |
|||
|
|||
You may convey a work based on the Program, or the modifications to produce |
|||
it from the Program, in the form of source code under the terms of section |
|||
4, provided that you also meet all of these conditions: |
|||
|
|||
a) The work must carry prominent notices stating that you modified it, and |
|||
giving a relevant date. |
|||
|
|||
b) The work must carry prominent notices stating that it is released under |
|||
this License and any conditions added under section 7. This requirement modifies |
|||
the requirement in section 4 to "keep intact all notices". |
|||
|
|||
c) You must license the entire work, as a whole, under this License to anyone |
|||
who comes into possession of a copy. This License will therefore apply, along |
|||
with any applicable section 7 additional terms, to the whole of the work, |
|||
and all its parts, regardless of how they are packaged. This License gives |
|||
no permission to license the work in any other way, but it does not invalidate |
|||
such permission if you have separately received it. |
|||
|
|||
d) If the work has interactive user interfaces, each must display Appropriate |
|||
Legal Notices; however, if the Program has interactive interfaces that do |
|||
not display Appropriate Legal Notices, your work need not make them do so. |
|||
|
|||
A compilation of a covered work with other separate and independent works, |
|||
which are not by their nature extensions of the covered work, and which are |
|||
not combined with it such as to form a larger program, in or on a volume of |
|||
a storage or distribution medium, is called an "aggregate" if the compilation |
|||
and its resulting copyright are not used to limit the access or legal rights |
|||
of the compilation's users beyond what the individual works permit. Inclusion |
|||
of a covered work in an aggregate does not cause this License to apply to |
|||
the other parts of the aggregate. |
|||
|
|||
6. Conveying Non-Source Forms. |
|||
|
|||
You may convey a covered work in object code form under the terms of sections |
|||
4 and 5, provided that you also convey the machine-readable Corresponding |
|||
Source under the terms of this License, in one of these ways: |
|||
|
|||
a) Convey the object code in, or embodied in, a physical product (including |
|||
a physical distribution medium), accompanied by the Corresponding Source fixed |
|||
on a durable physical medium customarily used for software interchange. |
|||
|
|||
b) Convey the object code in, or embodied in, a physical product (including |
|||
a physical distribution medium), accompanied by a written offer, valid for |
|||
at least three years and valid for as long as you offer spare parts or customer |
|||
support for that product model, to give anyone who possesses the object code |
|||
either (1) a copy of the Corresponding Source for all the software in the |
|||
product that is covered by this License, on a durable physical medium customarily |
|||
used for software interchange, for a price no more than your reasonable cost |
|||
of physically performing this conveying of source, or (2) access to copy the |
|||
Corresponding Source from a network server at no charge. |
|||
|
|||
c) Convey individual copies of the object code with a copy of the written |
|||
offer to provide the Corresponding Source. This alternative is allowed only |
|||
occasionally and noncommercially, and only if you received the object code |
|||
with such an offer, in accord with subsection 6b. |
|||
|
|||
d) Convey the object code by offering access from a designated place (gratis |
|||
or for a charge), and offer equivalent access to the Corresponding Source |
|||
in the same way through the same place at no further charge. You need not |
|||
require recipients to copy the Corresponding Source along with the object |
|||
code. If the place to copy the object code is a network server, the Corresponding |
|||
Source may be on a different server (operated by you or a third party) that |
|||
supports equivalent copying facilities, provided you maintain clear directions |
|||
next to the object code saying where to find the Corresponding Source. Regardless |
|||
of what server hosts the Corresponding Source, you remain obligated to ensure |
|||
that it is available for as long as needed to satisfy these requirements. |
|||
|
|||
e) Convey the object code using peer-to-peer transmission, provided you inform |
|||
other peers where the object code and Corresponding Source of the work are |
|||
being offered to the general public at no charge under subsection 6d. |
|||
|
|||
A separable portion of the object code, whose source code is excluded from |
|||
the Corresponding Source as a System Library, need not be included in conveying |
|||
the object code work. |
|||
|
|||
A "User Product" is either (1) a "consumer product", which means any tangible |
|||
personal property which is normally used for personal, family, or household |
|||
purposes, or (2) anything designed or sold for incorporation into a dwelling. |
|||
In determining whether a product is a consumer product, doubtful cases shall |
|||
be resolved in favor of coverage. For a particular product received by a particular |
|||
user, "normally used" refers to a typical or common use of that class of product, |
|||
regardless of the status of the particular user or of the way in which the |
|||
particular user actually uses, or expects or is expected to use, the product. |
|||
A product is a consumer product regardless of whether the product has substantial |
|||
commercial, industrial or non-consumer uses, unless such uses represent the |
|||
only significant mode of use of the product. |
|||
|
|||
"Installation Information" for a User Product means any methods, procedures, |
|||
authorization keys, or other information required to install and execute modified |
|||
versions of a covered work in that User Product from a modified version of |
|||
its Corresponding Source. The information must suffice to ensure that the |
|||
continued functioning of the modified object code is in no case prevented |
|||
or interfered with solely because modification has been made. |
|||
|
|||
If you convey an object code work under this section in, or with, or specifically |
|||
for use in, a User Product, and the conveying occurs as part of a transaction |
|||
in which the right of possession and use of the User Product is transferred |
|||
to the recipient in perpetuity or for a fixed term (regardless of how the |
|||
transaction is characterized), the Corresponding Source conveyed under this |
|||
section must be accompanied by the Installation Information. But this requirement |
|||
does not apply if neither you nor any third party retains the ability to install |
|||
modified object code on the User Product (for example, the work has been installed |
|||
in ROM). |
|||
|
|||
The requirement to provide Installation Information does not include a requirement |
|||
to continue to provide support service, warranty, or updates for a work that |
|||
has been modified or installed by the recipient, or for the User Product in |
|||
which it has been modified or installed. Access to a network may be denied |
|||
when the modification itself materially and adversely affects the operation |
|||
of the network or violates the rules and protocols for communication across |
|||
the network. |
|||
|
|||
Corresponding Source conveyed, and Installation Information provided, in accord |
|||
with this section must be in a format that is publicly documented (and with |
|||
an implementation available to the public in source code form), and must require |
|||
no special password or key for unpacking, reading or copying. |
|||
|
|||
7. Additional Terms. |
|||
|
|||
"Additional permissions" are terms that supplement the terms of this License |
|||
by making exceptions from one or more of its conditions. Additional permissions |
|||
that are applicable to the entire Program shall be treated as though they |
|||
were included in this License, to the extent that they are valid under applicable |
|||
law. If additional permissions apply only to part of the Program, that part |
|||
may be used separately under those permissions, but the entire Program remains |
|||
governed by this License without regard to the additional permissions. |
|||
|
|||
When you convey a copy of a covered work, you may at your option remove any |
|||
additional permissions from that copy, or from any part of it. (Additional |
|||
permissions may be written to require their own removal in certain cases when |
|||
you modify the work.) You may place additional permissions on material, added |
|||
by you to a covered work, for which you have or can give appropriate copyright |
|||
permission. |
|||
|
|||
Notwithstanding any other provision of this License, for material you add |
|||
to a covered work, you may (if authorized by the copyright holders of that |
|||
material) supplement the terms of this License with terms: |
|||
|
|||
a) Disclaiming warranty or limiting liability differently from the terms of |
|||
sections 15 and 16 of this License; or |
|||
|
|||
b) Requiring preservation of specified reasonable legal notices or author |
|||
attributions in that material or in the Appropriate Legal Notices displayed |
|||
by works containing it; or |
|||
|
|||
c) Prohibiting misrepresentation of the origin of that material, or requiring |
|||
that modified versions of such material be marked in reasonable ways as different |
|||
from the original version; or |
|||
|
|||
d) Limiting the use for publicity purposes of names of licensors or authors |
|||
of the material; or |
|||
|
|||
e) Declining to grant rights under trademark law for use of some trade names, |
|||
trademarks, or service marks; or |
|||
|
|||
f) Requiring indemnification of licensors and authors of that material by |
|||
anyone who conveys the material (or modified versions of it) with contractual |
|||
assumptions of liability to the recipient, for any liability that these contractual |
|||
assumptions directly impose on those licensors and authors. |
|||
|
|||
All other non-permissive additional terms are considered "further restrictions" |
|||
within the meaning of section 10. If the Program as you received it, or any |
|||
part of it, contains a notice stating that it is governed by this License |
|||
along with a term that is a further restriction, you may remove that term. |
|||
If a license document contains a further restriction but permits relicensing |
|||
or conveying under this License, you may add to a covered work material governed |
|||
by the terms of that license document, provided that the further restriction |
|||
does not survive such relicensing or conveying. |
|||
|
|||
If you add terms to a covered work in accord with this section, you must place, |
|||
in the relevant source files, a statement of the additional terms that apply |
|||
to those files, or a notice indicating where to find the applicable terms. |
|||
|
|||
Additional terms, permissive or non-permissive, may be stated in the form |
|||
of a separately written license, or stated as exceptions; the above requirements |
|||
apply either way. |
|||
|
|||
8. Termination. |
|||
|
|||
You may not propagate or modify a covered work except as expressly provided |
|||
under this License. Any attempt otherwise to propagate or modify it is void, |
|||
and will automatically terminate your rights under this License (including |
|||
any patent licenses granted under the third paragraph of section 11). |
|||
|
|||
However, if you cease all violation of this License, then your license from |
|||
a particular copyright holder is reinstated (a) provisionally, unless and |
|||
until the copyright holder explicitly and finally terminates your license, |
|||
and (b) permanently, if the copyright holder fails to notify you of the violation |
|||
by some reasonable means prior to 60 days after the cessation. |
|||
|
|||
Moreover, your license from a particular copyright holder is reinstated permanently |
|||
if the copyright holder notifies you of the violation by some reasonable means, |
|||
this is the first time you have received notice of violation of this License |
|||
(for any work) from that copyright holder, and you cure the violation prior |
|||
to 30 days after your receipt of the notice. |
|||
|
|||
Termination of your rights under this section does not terminate the licenses |
|||
of parties who have received copies or rights from you under this License. |
|||
If your rights have been terminated and not permanently reinstated, you do |
|||
not qualify to receive new licenses for the same material under section 10. |
|||
|
|||
9. Acceptance Not Required for Having Copies. |
|||
|
|||
You are not required to accept this License in order to receive or run a copy |
|||
of the Program. Ancillary propagation of a covered work occurring solely as |
|||
a consequence of using peer-to-peer transmission to receive a copy likewise |
|||
does not require acceptance. However, nothing other than this License grants |
|||
you permission to propagate or modify any covered work. These actions infringe |
|||
copyright if you do not accept this License. Therefore, by modifying or propagating |
|||
a covered work, you indicate your acceptance of this License to do so. |
|||
|
|||
10. Automatic Licensing of Downstream Recipients. |
|||
|
|||
Each time you convey a covered work, the recipient automatically receives |
|||
a license from the original licensors, to run, modify and propagate that work, |
|||
subject to this License. You are not responsible for enforcing compliance |
|||
by third parties with this License. |
|||
|
|||
An "entity transaction" is a transaction transferring control of an organization, |
|||
or substantially all assets of one, or subdividing an organization, or merging |
|||
organizations. If propagation of a covered work results from an entity transaction, |
|||
each party to that transaction who receives a copy of the work also receives |
|||
whatever licenses to the work the party's predecessor in interest had or could |
|||
give under the previous paragraph, plus a right to possession of the Corresponding |
|||
Source of the work from the predecessor in interest, if the predecessor has |
|||
it or can get it with reasonable efforts. |
|||
|
|||
You may not impose any further restrictions on the exercise of the rights |
|||
granted or affirmed under this License. For example, you may not impose a |
|||
license fee, royalty, or other charge for exercise of rights granted under |
|||
this License, and you may not initiate litigation (including a cross-claim |
|||
or counterclaim in a lawsuit) alleging that any patent claim is infringed |
|||
by making, using, selling, offering for sale, or importing the Program or |
|||
any portion of it. |
|||
|
|||
11. Patents. |
|||
|
|||
A "contributor" is a copyright holder who authorizes use under this License |
|||
of the Program or a work on which the Program is based. The work thus licensed |
|||
is called the contributor's "contributor version". |
|||
|
|||
A contributor's "essential patent claims" are all patent claims owned or controlled |
|||
by the contributor, whether already acquired or hereafter acquired, that would |
|||
be infringed by some manner, permitted by this License, of making, using, |
|||
or selling its contributor version, but do not include claims that would be |
|||
infringed only as a consequence of further modification of the contributor |
|||
version. For purposes of this definition, "control" includes the right to |
|||
grant patent sublicenses in a manner consistent with the requirements of this |
|||
License. |
|||
|
|||
Each contributor grants you a non-exclusive, worldwide, royalty-free patent |
|||
license under the contributor's essential patent claims, to make, use, sell, |
|||
offer for sale, import and otherwise run, modify and propagate the contents |
|||
of its contributor version. |
|||
|
|||
In the following three paragraphs, a "patent license" is any express agreement |
|||
or commitment, however denominated, not to enforce a patent (such as an express |
|||
permission to practice a patent or covenant not to s ue for patent infringement). |
|||
To "grant" such a patent license to a party means to make such an agreement |
|||
or commitment not to enforce a patent against the party. |
|||
|
|||
If you convey a covered work, knowingly relying on a patent license, and the |
|||
Corresponding Source of the work is not available for anyone to copy, free |
|||
of charge and under the terms of this License, through a publicly available |
|||
network server or other readily accessible means, then you must either (1) |
|||
cause the Corresponding Source to be so available, or (2) arrange to deprive |
|||
yourself of the benefit of the patent license for this particular work, or |
|||
(3) arrange, in a manner consistent with the requirements of this License, |
|||
to extend the patent |
|||
|
|||
license to downstream recipients. "Knowingly relying" means you have actual |
|||
knowledge that, but for the patent license, your conveying the covered work |
|||
in a country, or your recipient's use of the covered work in a country, would |
|||
infringe one or more identifiable patents in that country that you have reason |
|||
to believe are valid. |
|||
|
|||
If, pursuant to or in connection with a single transaction or arrangement, |
|||
you convey, or propagate by procuring conveyance of, a covered work, and grant |
|||
a patent license to some of the parties receiving the covered work authorizing |
|||
them to use, propagate, modify or convey a specific copy of the covered work, |
|||
then the patent license you grant is automatically extended to all recipients |
|||
of the covered work and works based on it. |
|||
|
|||
A patent license is "discriminatory" if it does not include within the scope |
|||
of its coverage, prohibits the exercise of, or is conditioned on the non-exercise |
|||
of one or more of the rights that are specifically granted under this License. |
|||
You may not convey a covered work if you are a party to an arrangement with |
|||
a third party that is in the business of distributing software, under which |
|||
you make payment to the third party based on the extent of your activity of |
|||
conveying the work, and under which the third party grants, to any of the |
|||
parties who would receive the covered work from you, a discriminatory patent |
|||
license (a) in connection with copies of the covered work conveyed by you |
|||
(or copies made from those copies), or (b) primarily for and in connection |
|||
with specific products or compilations that contain the covered work, unless |
|||
you entered into that arrangement, or that patent license was granted, prior |
|||
to 28 March 2007. |
|||
|
|||
Nothing in this License shall be construed as excluding or limiting any implied |
|||
license or other defenses to infringement that may otherwise be available |
|||
to you under applicable patent law. |
|||
|
|||
12. No Surrender of Others' Freedom. |
|||
|
|||
If conditions are imposed on you (whether by court order, agreement or otherwise) |
|||
that contradict the conditions of this License, they do not excuse you from |
|||
the conditions of this License. If you cannot convey a covered work so as |
|||
to satisfy simultaneously your obligations under this License and any other |
|||
pertinent obligations, then as a consequence you may |
|||
|
|||
not convey it at all. For example, if you agree to terms that obligate you |
|||
to collect a royalty for further conveying from those to whom you convey the |
|||
Program, the only way you could satisfy both those terms and this License |
|||
would be to refrain entirely from conveying the Program. |
|||
|
|||
13. Remote Network Interaction; Use with the GNU General Public License. |
|||
|
|||
Notwithstanding any other provision of this License, if you modify the Program, |
|||
your modified version must prominently offer all users interacting with it |
|||
remotely through a computer network (if your version supports such interaction) |
|||
an opportunity to receive the Corresponding Source of your version by providing |
|||
access to the Corresponding Source from a network server at no charge, through |
|||
some standard or customary means of facilitating copying of software. This |
|||
Corresponding Source shall include the Corresponding Source for any work covered |
|||
by version 3 of the GNU General Public License that is incorporated pursuant |
|||
to the following paragraph. |
|||
|
|||
Notwithstanding any other provision of this License, you have permission to |
|||
link or combine any covered work with a work licensed under version 3 of the |
|||
GNU General Public License into a single combined work, and to convey the |
|||
resulting work. The terms of this License will continue to apply to the part |
|||
which is the covered work, but the work with which it is combined will remain |
|||
governed by version 3 of the GNU General Public License. |
|||
|
|||
14. Revised Versions of this License. |
|||
|
|||
The Free Software Foundation may publish revised and/or new versions of the |
|||
GNU Affero General Public License from time to time. Such new versions will |
|||
be similar in spirit to the present version, but may differ in detail to address |
|||
new problems or concerns. |
|||
|
|||
Each version is given a distinguishing version number. If the Program specifies |
|||
that a certain numbered version of the GNU Affero General Public License "or |
|||
any later version" applies to it, you have the option of following the terms |
|||
and conditions either of that numbered version or of any later version published |
|||
by the Free Software Foundation. If the Program does not specify a version |
|||
number of the GNU Affero General Public License, you may choose any version |
|||
ever published by the Free Software Foundation. |
|||
|
|||
If the Program specifies that a proxy can decide which future versions of |
|||
the GNU Affero General Public License can be used, that proxy's public statement |
|||
of acceptance of a version permanently authorizes you to choose that version |
|||
for the Program. |
|||
|
|||
Later license versions may give you additional or different permissions. However, |
|||
no additional obligations are imposed on any author or copyright holder as |
|||
a result of your choosing to follow a later version. |
|||
|
|||
15. Disclaimer of Warranty. |
|||
|
|||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE |
|||
LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR |
|||
OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER |
|||
EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES |
|||
OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS |
|||
TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE PROGRAM |
|||
PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, REPAIR OR |
|||
CORRECTION. |
|||
|
|||
16. Limitation of Liability. |
|||
|
|||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING WILL |
|||
ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS THE PROGRAM |
|||
AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY GENERAL, SPECIAL, |
|||
INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE USE OR INABILITY TO |
|||
USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF DATA OR DATA BEING RENDERED |
|||
INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD PARTIES OR A FAILURE OF THE |
|||
PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS), EVEN IF SUCH HOLDER OR OTHER |
|||
PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. |
|||
|
|||
17. Interpretation of Sections 15 and 16. |
|||
|
|||
If the disclaimer of warranty and limitation of liability provided above cannot |
|||
be given local legal effect according to their terms, reviewing courts shall |
|||
apply local law that most closely approximates an absolute waiver of all civil |
|||
liability in connection with the Program, unless a warranty or assumption |
|||
of liability accompanies a copy of the Program in return for a fee. END OF |
|||
TERMS AND CONDITIONS |
|||
|
|||
How to Apply These Terms to Your New Programs |
|||
|
|||
If you develop a new program, and you want it to be of the greatest possible |
|||
use to the public, the best way to achieve this is to make it free software |
|||
which everyone can redistribute and change under these terms. |
|||
|
|||
To do so, attach the following notices to the program. It is safest to attach |
|||
them to the start of each source file to most effectively state the exclusion |
|||
of warranty; and each file should have at least the "copyright" line and a |
|||
pointer to where the full notice is found. |
|||
|
|||
<one line to give the program's name and a brief idea of what it does.> |
|||
|
|||
Copyright (C) <year> <name of author> |
|||
|
|||
This program is free software: you can redistribute it and/or modify it under |
|||
the terms of the GNU Affero General Public License as published by the Free |
|||
Software Foundation, either version 3 of the License, or (at your option) |
|||
any later version. |
|||
|
|||
This program is distributed in the hope that it will be useful, but WITHOUT |
|||
ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS |
|||
FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more |
|||
details. |
|||
|
|||
You should have received a copy of the GNU Affero General Public License along |
|||
with this program. If not, see <http s ://www.gnu.org/licenses/>. |
|||
|
|||
Also add information on how to contact you by electronic and paper mail. |
|||
|
|||
If your software can interact with users remotely through a computer network, |
|||
you should also make sure that it provides a way for users to get its source. |
|||
For example, if your program is a web application, its interface could display |
|||
a "Source" link that leads users to an archive of the code. There are many |
|||
ways you could offer source, and different solutions will be better for different |
|||
programs; see section 13 for the specific requirements. |
|||
|
|||
You should also get your employer (if you work as a programmer) or school, |
|||
if any, to sign a "copyright disclaimer" for the program, if necessary. For |
|||
more information on this, and how to apply and follow the GNU AGPL, see <http |
|||
s ://www.gnu.org/licenses/>. |
|||
@ -0,0 +1,24 @@ |
|||
# frontend2 |
|||
|
|||
## Project setup |
|||
``` |
|||
npm install |
|||
``` |
|||
|
|||
### Compiles and hot-reloads for development |
|||
``` |
|||
npm run serve |
|||
``` |
|||
|
|||
### Compiles and minifies for production |
|||
``` |
|||
npm run build |
|||
``` |
|||
|
|||
### Lints and fixes files |
|||
``` |
|||
npm run lint |
|||
``` |
|||
|
|||
### Customize configuration |
|||
See [Configuration Reference](https://cli.vuejs.org/config/). |
|||
@ -0,0 +1,5 @@ |
|||
module.exports = { |
|||
presets: [ |
|||
'@vue/cli-plugin-babel/preset' |
|||
] |
|||
} |
|||
File diff suppressed because it is too large
@ -0,0 +1,59 @@ |
|||
{ |
|||
"name": "frontend2", |
|||
"version": "0.1.0", |
|||
"private": true, |
|||
"scripts": { |
|||
"serve": "vue-cli-service serve", |
|||
"build": "vue-cli-service build", |
|||
"lint": "vue-cli-service lint" |
|||
}, |
|||
"dependencies": { |
|||
"@fortawesome/fontawesome-svg-core": "^1.2.32", |
|||
"@fortawesome/free-brands-svg-icons": "^5.15.1", |
|||
"@fortawesome/free-solid-svg-icons": "^5.15.1", |
|||
"@fortawesome/vue-fontawesome": "^2.0.0", |
|||
"axios": "^0.21.0", |
|||
"bootstrap": "^4.5.3", |
|||
"bootstrap-vue": "^2.18.1", |
|||
"chart.js": "^2.9.4", |
|||
"core-js": "^3.6.5", |
|||
"es6-promise": "^4.2.8", |
|||
"highcharts": "^8.2.2", |
|||
"highcharts-vue": "^1.3.5", |
|||
"socket.io-client": "^2.3.1", |
|||
"vue": "^2.6.12", |
|||
"vue-chartjs": "^3.5.1", |
|||
"vue-router": "^3.4.9", |
|||
"vue-socket.io-extended": "^4.0.5", |
|||
"vuetable-2": "^2.0.0-beta.4", |
|||
"vuex": "^3.5.1", |
|||
"vuex-persistedstate": "^4.0.0-beta.1" |
|||
}, |
|||
"devDependencies": { |
|||
"@vue/cli-plugin-babel": "~4.5.0", |
|||
"@vue/cli-service": "~4.5.0", |
|||
"babel-eslint": "^10.1.0", |
|||
"eslint": "^6.7.2", |
|||
"eslint-plugin-vue": "^6.2.2", |
|||
"vue-template-compiler": "^2.6.11" |
|||
}, |
|||
"eslintConfig": { |
|||
"root": true, |
|||
"env": { |
|||
"node": true |
|||
}, |
|||
"extends": [ |
|||
"plugin:vue/essential", |
|||
"eslint:recommended" |
|||
], |
|||
"parserOptions": { |
|||
"parser": "babel-eslint" |
|||
}, |
|||
"rules": {} |
|||
}, |
|||
"browserslist": [ |
|||
"> 1%", |
|||
"last 2 versions", |
|||
"not dead" |
|||
] |
|||
} |
|||
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,22 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="utf-8" /> |
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
|||
<meta name="viewport" content="width=device-width,initial-scale=1.0" /> |
|||
<link rel="icon" href="<%= BASE_URL %>favicon.ico" /> |
|||
|
|||
<title><%= htmlWebpackPlugin.options.title %></title> |
|||
</head> |
|||
<body> |
|||
<noscript> |
|||
<strong |
|||
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work |
|||
properly without JavaScript enabled. Please enable it to |
|||
continue.</strong |
|||
> |
|||
</noscript> |
|||
<div id="app"></div> |
|||
<!-- built files will be auto injected --> |
|||
</body> |
|||
</html> |
|||
@ -0,0 +1,86 @@ |
|||
<template> |
|||
<div ref="app" id="app" v-bind:class="computedPad"> |
|||
<!-- <NavBar /> --> |
|||
|
|||
<router-view> </router-view> |
|||
<!-- <Footer /> --> |
|||
<!-- <Sidebar /> --> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import store from "@/store/index"; |
|||
|
|||
export default { |
|||
name: "App", |
|||
data: () => { |
|||
return { |
|||
class: "app", |
|||
}; |
|||
}, |
|||
mounted() {}, |
|||
created() { |
|||
window.addEventListener("resize", this.myEventHandler); |
|||
}, |
|||
destroyed() { |
|||
window.removeEventListener("resize", this.myEventHandler); |
|||
}, |
|||
computed: { |
|||
computedPad: function() { |
|||
return this.class; |
|||
}, |
|||
}, |
|||
mounted() { |
|||
console.log("Width on load: " + this.$refs.app.clientWidth); |
|||
var width = this.$refs.app.clientWidth; |
|||
if (width < 850 && this.class !== "appMobile") { |
|||
console.log("Changed class"); |
|||
this.class = "appMobile"; |
|||
} else if (width > 850 && this.class !== "app") { |
|||
this.class = "app"; |
|||
} |
|||
}, |
|||
methods: { |
|||
myEventHandler(e) { |
|||
//console.log(e.currentTarget.innerWidth); |
|||
var width = e.currentTarget.innerWidth; |
|||
if (width < 1000 && this.class !== "appMobile") { |
|||
console.log("Changed class"); |
|||
this.class = "appMobile"; |
|||
} else if (width > 1000 && this.class !== "app") { |
|||
this.class = "app"; |
|||
console.log("Changed class"); |
|||
} |
|||
}, |
|||
handler() { |
|||
var args = arguments; |
|||
for (var arg of args) { |
|||
if (arg instanceof Function) { |
|||
arg(); |
|||
} |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style> |
|||
.app { |
|||
margin-top: 100px; |
|||
padding-bottom: 5rem; |
|||
font-family: Avenir, Helvetica, Arial, sans-serif; |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
text-align: center; |
|||
color: #2c3e50; |
|||
} |
|||
.appMobile { |
|||
margin-top: 100px; |
|||
padding-bottom: 21rem; |
|||
font-family: Avenir, Helvetica, Arial, sans-serif; |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
text-align: center; |
|||
color: #2c3e50; |
|||
} |
|||
</style> |
|||
|
After Width: | Height: | Size: 2.1 MiB |
@ -0,0 +1 @@ |
|||
.index .alert{padding:20px;background-color:#c5aaa8;color:#000;margin-bottom:15px;height:200px;overflow:scroll;text-align:left}.index .row{margin-top:5px;margin-left:5px;margin-right:5px}.index h3{margin:15px 0 0}.index .index{margin-top:5px}.index #tabs{box-shadow:2px 5px 15px 0 rgba(0,0,0,0.287),0 5px 15px 0 rgba(255,255,255,0.541)}.index .tabs{background-image:linear-gradient(to right, rgba(251,251,251,0.9), rgba(96,153,143,0.74))}.highchart .hc{box-shadow:0 4px 8px 0 rgba(0,0,0,0.267),0 6px 20px 0 rgba(0,0,0,0.157)}@keyframes h1anim{0%{background-color:#e9dedeab}50%{background-color:#81807e}100%{background-color:#e9dedeab}}.stats{text-align:center;text-align:-moz-center;text-align:-webkit-center}.stats .row{margin-top:5px;margin-left:5px;margin-right:5px}.stats .overf{background-color:#c5aaa8;height:250px;max-width:800px;resize:both;overflow:auto}.stats .boottable{height:300px;max-width:800px;resize:horizontal;overflow:auto;background-image:linear-gradient(to right, #958d8dbb, #a5a2a2ad, #958d8d5d)}.stats .jumbotron{max-width:1100px}.footer{position:absolute;right:0;bottom:0;left:0;padding:1rem;background-color:#343a40 !important;color:white;text-align:left}.footer #image:hover{transform:scale(1.1);-webkit-transform:scale(1.1)}.footer #image{max-width:220px;border-radius:2rem}.side{text-align:left;margin:15px}.side .accInfo{text-align:left;margin:15px}.side .accSet{text-align:left;margin:15px}.side #title{text-align:center;background-color:#a83c1bce !important;font-size:1.5rem;color:#fff}.side #title2{text-align:center;background-color:#456483ca !important;font-size:1.2rem;color:#fff}.side .table{overflow:auto}.side #spinner{margin-left:15px}.side #email{border-radius:0}.side #pass{border-radius:0}.mynav .dropup,.mynav .dropright,.mynav .dropdown,.mynav .dropleft{position:relative;padding:0px 0px}.mynav .navbar-light .navbar-nav .show>.nav-link{color:#f0f5f5}.mynav .navbar{background-color:rgba(63,60,60,0.205)}.mynav .navbar #nav-collapse{color:azure}.mynav .navbar .navbar-nav{background-color:#3f3c3c}.mynav .navbar .navbar-nav .nav-link{color:#cac9c9}.mynav .navbar .navbar-nav .nav-link a:hover{color:#fff;transform:scale(1.1)}.mynav .navbar .navbar-nav .nav-link:focus{color:azure}.mynav .navbar .navbar-nav .nav-drop .dropdown-menu{padding:10px, 2px;background-color:#b6b6b6}.mynav .navbar .navbar-nav .nav-drop .dropdown-menu a{color:#000;background-color:#b6b6b6}.mynav .navbar .navbar-nav .nav-drop .dropdown-menu a:hover{color:#fff}.mynav .navbar .navbar-nav .nav-drop:focus{color:azure}.mynav .navbar-brand:hover{transform:scale(1.2);-webkit-transform:scale(1.2)}.mynav #image{max-height:60px;border-radius:2rem}.testNav{position:fixed;top:0;right:0;left:0}.testNav ul{list-style-type:none;margin:0;padding:0;overflow:hidden;background-color:#333}.testNav ul li{float:left;display:inline}.testNav ul li a{display:block;color:white;text-align:center;padding:23px 23px;text-decoration:none}.testNav ul li a:hover{background-color:#111}.testNav ul li a.active{background-color:#4caf50;color:white} |
|||
|
After Width: | Height: | Size: 106 KiB |
|
After Width: | Height: | Size: 1.4 MiB |
@ -0,0 +1,43 @@ |
|||
.index { |
|||
.alert { |
|||
padding: 20px; |
|||
background-color: #c5aaa8; /* Red */ |
|||
color: rgb(0, 0, 0); |
|||
margin-bottom: 15px; |
|||
height: 200px; |
|||
overflow: scroll; |
|||
text-align: left; |
|||
} |
|||
.row { |
|||
margin-top: 5px; |
|||
margin-left: 5px; |
|||
margin-right: 5px; |
|||
} |
|||
h3 { |
|||
margin: 15px 0 0; |
|||
} |
|||
.index { |
|||
margin-top: 5px; |
|||
} |
|||
#tabs { |
|||
box-shadow: 2px 5px 15px 0 rgba(0, 0, 0, 0.287), |
|||
0 5px 15px 0 rgba(255, 255, 255, 0.541); |
|||
} |
|||
.tabs { |
|||
background-image: -webkit-linear-gradient( |
|||
to right, |
|||
rgba(251, 251, 251, 0.9), |
|||
rgba(96, 153, 143, 0.74) |
|||
); |
|||
background-image: -moz-linear-gradient( |
|||
to right, |
|||
rgba(251, 251, 251, 0.9), |
|||
rgba(96, 153, 143, 0.74) |
|||
); |
|||
background-image: linear-gradient( |
|||
to right, |
|||
rgba(251, 251, 251, 0.9), |
|||
rgba(96, 153, 143, 0.74) |
|||
); |
|||
} |
|||
} |
|||
@ -0,0 +1,19 @@ |
|||
.footer { |
|||
/* max-height: 400px; */ |
|||
position: absolute; |
|||
right: 0; |
|||
bottom: 0; |
|||
left: 0; |
|||
padding: 1rem; |
|||
background-color: #343a40 !important; |
|||
color: white; |
|||
text-align: left; |
|||
#image:hover { |
|||
transform: scale(1.1); |
|||
-webkit-transform: scale(1.1); |
|||
} |
|||
#image { |
|||
max-width: 220px; |
|||
border-radius: 2rem; |
|||
} |
|||
} |
|||
@ -0,0 +1,17 @@ |
|||
.highchart { |
|||
.hc { |
|||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.267), |
|||
0 6px 20px 0 rgba(0, 0, 0, 0.157); |
|||
} |
|||
@keyframes h1anim { |
|||
0% { |
|||
background-color: #e9dedeab; |
|||
} |
|||
50% { |
|||
background-color: rgb(129, 128, 126); |
|||
} |
|||
100% { |
|||
background-color: #e9dedeab; |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,61 @@ |
|||
.mynav { |
|||
.dropup, |
|||
.dropright, |
|||
.dropdown, |
|||
.dropleft { |
|||
position: relative; |
|||
padding: 0px 0px; |
|||
} |
|||
.navbar-light .navbar-nav .show > .nav-link { |
|||
color: rgb(240, 245, 245); |
|||
} |
|||
.navbar { |
|||
background-color: rgba(63, 60, 60, 0.205); |
|||
// background-color: rgb(63, 60, 60); |
|||
|
|||
#nav-collapse { |
|||
color: azure; |
|||
} |
|||
|
|||
.navbar-nav { |
|||
background-color: rgb(63, 60, 60); |
|||
|
|||
.nav-link { |
|||
color: rgb(202, 201, 201); |
|||
|
|||
a:hover { |
|||
color: rgb(255, 255, 255); |
|||
transform: scale(1.1); |
|||
} |
|||
} |
|||
.nav-link:focus { |
|||
color: azure; |
|||
} |
|||
|
|||
.nav-drop { |
|||
.dropdown-menu { |
|||
padding: 10px, 2px; |
|||
background-color: rgb(182, 182, 182); |
|||
a { |
|||
color: rgb(0, 0, 0); |
|||
background-color: rgb(182, 182, 182); |
|||
} |
|||
a:hover { |
|||
color: rgb(255, 255, 255); |
|||
} |
|||
} |
|||
} |
|||
.nav-drop:focus { |
|||
color: azure; |
|||
} |
|||
} |
|||
} |
|||
.navbar-brand:hover { |
|||
transform: scale(1.2); |
|||
-webkit-transform: scale(1.2); |
|||
} |
|||
#image { |
|||
max-height: 60px; |
|||
border-radius: 2rem; |
|||
} |
|||
} |
|||
@ -0,0 +1,39 @@ |
|||
.side { |
|||
text-align: left; |
|||
margin: 15px; |
|||
.accInfo { |
|||
text-align: left; |
|||
margin: 15px; |
|||
} |
|||
.accSet { |
|||
text-align: left; |
|||
margin: 15px; |
|||
} |
|||
#title { |
|||
text-align: center; |
|||
/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.267), |
|||
0 6px 20px 0 rgba(0, 0, 0, 0.157); */ |
|||
background-color: #a83c1bce !important; |
|||
font-size: 1.5rem; |
|||
color: rgb(255, 255, 255); |
|||
} |
|||
#title2 { |
|||
text-align: center; |
|||
/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.452); */ |
|||
background-color: #456483ca !important; |
|||
font-size: 1.2rem; |
|||
color: rgb(255, 255, 255); |
|||
} |
|||
.table { |
|||
overflow: auto; |
|||
} |
|||
#spinner { |
|||
margin-left: 15px; |
|||
} |
|||
#email { |
|||
border-radius: 0; |
|||
} |
|||
#pass { |
|||
border-radius: 0; |
|||
} |
|||
} |
|||
@ -0,0 +1,32 @@ |
|||
.stats { |
|||
text-align: center; |
|||
text-align: -moz-center; |
|||
text-align: -webkit-center; |
|||
.row { |
|||
margin-top: 5px; |
|||
margin-left: 5px; |
|||
margin-right: 5px; |
|||
} |
|||
.overf { |
|||
background-color: #c5aaa8; |
|||
height: 250px; |
|||
max-width: 800px; |
|||
resize: both; |
|||
overflow: auto; |
|||
} |
|||
.boottable { |
|||
height: 300px; |
|||
max-width: 800px; |
|||
resize: horizontal; |
|||
overflow: auto; |
|||
background-image: linear-gradient( |
|||
to right, |
|||
#958d8dbb, |
|||
#a5a2a2ad, |
|||
#958d8d5d |
|||
); |
|||
} |
|||
.jumbotron { |
|||
max-width: 1100px; |
|||
} |
|||
} |
|||
@ -0,0 +1,31 @@ |
|||
.testNav { |
|||
position: fixed; |
|||
top: 0; |
|||
right: 0; |
|||
left: 0; |
|||
ul { |
|||
list-style-type: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
overflow: hidden; |
|||
background-color: #333; |
|||
li { |
|||
float: left; |
|||
display: inline; |
|||
a { |
|||
display: block; |
|||
color: white; |
|||
text-align: center; |
|||
padding: 23px 23px; |
|||
text-decoration: none; |
|||
} |
|||
a:hover { |
|||
background-color: #111; |
|||
} |
|||
a.active { |
|||
background-color: #4caf50; |
|||
color: white; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,7 @@ |
|||
@import "communication"; |
|||
@import "hightchart"; |
|||
@import "stats"; |
|||
@import "footer"; |
|||
@import "sidebar"; |
|||
@import "navbar"; |
|||
@import "testnav"; |
|||
@ -0,0 +1,88 @@ |
|||
.jumbotron { |
|||
text-align: left; |
|||
margin-bottom: 0px; |
|||
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.267), |
|||
0 6px 20px 0 rgba(0, 0, 0, 0.157); |
|||
} |
|||
html { |
|||
height: 100%; |
|||
box-sizing: border-box; |
|||
} |
|||
*, |
|||
*:before, |
|||
*:after { |
|||
box-sizing: inherit; |
|||
} |
|||
h1 { |
|||
margin-bottom: 0px; |
|||
} |
|||
.fade-enter-active { |
|||
transition: opacity 1s; |
|||
} |
|||
.fade-leave-active { |
|||
transition: opacity 0s; |
|||
} |
|||
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ { |
|||
opacity: 0; |
|||
} |
|||
.bounce-enter-active { |
|||
animation: bounce-in 1.5s; |
|||
} |
|||
.bounce-leave-active { |
|||
animation: bounce-in 0s reverse; |
|||
} |
|||
@keyframes bounce-in { |
|||
0% { |
|||
transform: scale(0.5); |
|||
} |
|||
50% { |
|||
transform: scale(1.3); |
|||
} |
|||
100% { |
|||
transform: scale(1); |
|||
} |
|||
} |
|||
/* The css code for the styling of H1 tags of every component */ |
|||
.display-3 { |
|||
text-align: center; |
|||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.52); |
|||
/* border-radius: 0.5rem; */ |
|||
background-color: #343a40ca !important; |
|||
color: rgb(213, 222, 223); |
|||
font-size: 3rem; |
|||
} |
|||
.lead { |
|||
padding: 1rem; |
|||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.52); |
|||
background-color: #a2b0bed3 !important; |
|||
} |
|||
/* .jumbotron { |
|||
background: rgba(209, 189, 189, 0); |
|||
opacity: 1; |
|||
} */ |
|||
.jumbotron { |
|||
background-image: linear-gradient( |
|||
to bottom, |
|||
rgba(255, 255, 255, 0.1) 0%, |
|||
rgba(255, 255, 255, 0.9) 100% |
|||
), |
|||
url(jumbotron.jpg); |
|||
background-size: cover; |
|||
border-radius: 0; |
|||
} |
|||
|
|||
body { |
|||
position: relative; |
|||
margin: 0; |
|||
/* background-image: url("bg.gif"); */ |
|||
/* background-color: rgb(255, 255, 255); */ |
|||
|
|||
/* background-image: linear-gradient(to right, #958d8dbb, #1b0d0dad, #958d8dbb); */ |
|||
background-image: linear-gradient( |
|||
to right, |
|||
rgba(255, 255, 255, 0.733), |
|||
#1b0d0dad |
|||
); |
|||
min-height: 100%; |
|||
padding-bottom: 10rem; |
|||
} |
|||
@ -0,0 +1,19 @@ |
|||
export default { |
|||
table: { |
|||
tableWrapper: "", |
|||
tableHeaderClass: "mb-0", |
|||
tableBodyClass: "mb-0", |
|||
tableClass: "table table-bordered table-hover", |
|||
loadingClass: "loading", |
|||
ascendingIcon: "fa fa-chevron-up", |
|||
descendingIcon: "fa fa-chevron-down", |
|||
ascendingClass: "sorted-asc", |
|||
descendingClass: "sorted-desc", |
|||
sortableIcon: "fa fa-sort", |
|||
detailRowClass: "vuetable-detail-row", |
|||
handleIcon: "fa fa-bars text-secondary", |
|||
renderIcon(classes, options) { |
|||
return `<i class="${classes.join(" ")}"></span>`; |
|||
}, |
|||
}, |
|||
}; |
|||
@ -0,0 +1,62 @@ |
|||
<template> |
|||
<div ref="home" id="home"> |
|||
<NavBar /> |
|||
<router-view> </router-view> |
|||
<Footer /> |
|||
<Sidebar /> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import NavBar from "./homeComponents/NavBar"; |
|||
import store from "@/store/index"; |
|||
import Footer from "./homeComponents/Footer"; |
|||
import Sidebar from "./homeComponents/Sidebar"; |
|||
import TestNav from "./homeComponents/TestNav"; |
|||
|
|||
export default { |
|||
name: "Home", |
|||
components: { |
|||
NavBar, |
|||
Footer, |
|||
Sidebar, |
|||
TestNav, |
|||
}, |
|||
data: () => { |
|||
return { |
|||
scrolled: true, |
|||
}; |
|||
}, |
|||
mounted() {}, |
|||
created() { |
|||
window.addEventListener("scroll", this.handleScroll); |
|||
}, |
|||
destroyed() { |
|||
window.removeEventListener("scroll", this.handleScroll); |
|||
}, |
|||
computed: {}, |
|||
mounted() {}, |
|||
methods: { |
|||
handleScroll() { |
|||
// console.log("window scroll y: " + window.scrollY); |
|||
if (window.scrollY === 0 && this.scrolled === false) { |
|||
console.log( |
|||
"emitting for nav change top with scrolled: " + this.scrolled |
|||
); |
|||
this.scrolled = true; |
|||
console.log("emitting for nav change"); |
|||
this.$root.$emit("changeNav", true); |
|||
} else if (window.scrollY > 0 && this.scrolled === true) { |
|||
console.log( |
|||
"emitting for nav change bottom with scrolled: " + this.scrolled |
|||
); |
|||
this.scrolled = false; |
|||
console.log("scrolled after change: " + this.scrolled); |
|||
this.$root.$emit("changeNav", false); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style></style> |
|||
@ -0,0 +1,58 @@ |
|||
<template> |
|||
<div class="footer"> |
|||
<footer class="footer"> |
|||
<b-container fluid> |
|||
<b-row> |
|||
<b-col> |
|||
<b-navbar-brand :to="'/home/communication'"> |
|||
<img id="image" src="../../assets/logo.gif" alt="" /> |
|||
</b-navbar-brand> |
|||
</b-col> |
|||
<b-col> |
|||
<h4> |
|||
<b-icon icon="signpost-split" variant="info" /> Upcoming Updates |
|||
</h4> |
|||
<hr class="my-4" /> |
|||
<p> |
|||
Waiting for the link to get the server logs in real time. When i |
|||
will get the link, i will update the functionality of the chart |
|||
and tables. |
|||
</p> |
|||
</b-col> |
|||
<b-col> |
|||
<h4><b-icon icon="server" variant="info" /> Technologies used</h4> |
|||
<hr class="my-4" /> |
|||
<p>Vuejs, Nodejs, Express, Vuex, BootstrapVue, CSS3</p> |
|||
</b-col> |
|||
<b-col> |
|||
<h4><b-icon icon="patch-exclamation" variant="info" /> About</h4> |
|||
<hr class="my-4" /> |
|||
<p> |
|||
This is a project made by Lefteris Evangelinos with the co-op of |
|||
Apostolos Anagnostopolous. |
|||
</p> |
|||
</b-col> |
|||
<b-col> |
|||
<h4><b-icon icon="telephone-forward" variant="info" /> Social</h4> |
|||
<hr class="my-4" /> |
|||
<p>Facebook:</p> |
|||
<p>Instagram:</p> |
|||
<p>Twitter:</p> |
|||
</b-col> |
|||
</b-row> |
|||
</b-container> |
|||
</footer> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
methods: { |
|||
push: () => { |
|||
$router.push("communication"); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
@ -0,0 +1,153 @@ |
|||
<template> |
|||
<div class="mynav"> |
|||
<b-navbar |
|||
v-bind:style="computedStyle" |
|||
toggleable="lg" |
|||
type="dark" |
|||
fixed="top" |
|||
> |
|||
<b-navbar-brand :to="'/home/communication'"> |
|||
<img id="image" src="../../assets/logo.gif" alt="" /> |
|||
</b-navbar-brand> |
|||
|
|||
<b-navbar-toggle target="nav-collapse"> </b-navbar-toggle> |
|||
|
|||
<b-collapse id="nav-collapse" is-nav> |
|||
<b-navbar-nav> |
|||
<b-nav-item |
|||
id="link" |
|||
class="nav-link" |
|||
:key="0" |
|||
:to="'/home/login'" |
|||
v-if="showlogin" |
|||
> |
|||
Login |
|||
</b-nav-item> |
|||
<b-nav-item |
|||
id="link" |
|||
class="nav-link" |
|||
v-for="link in restlinks" |
|||
:key="link.id" |
|||
:to="link.path" |
|||
v-if="showlogout" |
|||
> |
|||
<b-icon :icon="link.icon" variant="info"> </b-icon> |
|||
{{ link.name }} |
|||
</b-nav-item> |
|||
</b-navbar-nav> |
|||
|
|||
<b-navbar-nav class="ml-auto"> |
|||
<b-nav-item-dropdown |
|||
class="nav-drop" |
|||
toggle-class="nav-link-custom" |
|||
id="link" |
|||
v-if="showlogout" |
|||
right |
|||
> |
|||
<template #text> |
|||
<b-icon icon="person-fill" variant="info"> </b-icon> Profile |
|||
</template> |
|||
<b-dropdown-item class="drop" v-b-toggle.account> |
|||
<b-icon icon="gear" variant="info"> </b-icon> |
|||
Settings</b-dropdown-item |
|||
> |
|||
<b-dropdown-item class="drop" id="logout" :key="0" @click="logout"> |
|||
<b-icon icon="power" aria-hidden="true" variant="info"> </b-icon> |
|||
Logout</b-dropdown-item |
|||
> |
|||
</b-nav-item-dropdown> |
|||
</b-navbar-nav> |
|||
</b-collapse> |
|||
</b-navbar> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import store from "@/store/index"; |
|||
|
|||
export default { |
|||
name: "NavBar", |
|||
data: () => { |
|||
return { |
|||
scroll: null, |
|||
showlogin: true, |
|||
showlogout: false, |
|||
// Ola ta links tou nav bar. Ta restLinks emfanizontai me v-for |
|||
restlinks: [ |
|||
{ |
|||
id: 4, |
|||
name: "Communication", |
|||
path: "/home/communication", |
|||
icon: "people-fill", |
|||
}, |
|||
{ |
|||
id: 3, |
|||
name: "Tables", |
|||
path: "/home/stats", |
|||
icon: "table", |
|||
}, |
|||
{ |
|||
id: 5, |
|||
name: "Chart", |
|||
path: "/home/chart", |
|||
icon: "clipboard-data", |
|||
}, |
|||
], |
|||
scrolled: false, |
|||
navstyle: {}, |
|||
}; |
|||
}, |
|||
methods: {}, |
|||
computed: { |
|||
computedScroll: function() { |
|||
return this.scroll; |
|||
}, |
|||
computedStyle: function() { |
|||
return this.navstyle; |
|||
}, |
|||
}, |
|||
mounted() { |
|||
this.$root.$on("changeNav", (val) => { |
|||
console.log("Recieving for nav change: " + val); |
|||
if (val) { |
|||
this.navstyle = { |
|||
"background-color": "rgba(63, 60, 60, 0.2)", |
|||
"-webkit-transition": "background-color 500ms linear", |
|||
"-ms-transition": "background-color 500ms linear", |
|||
transition: "background-color 500ms linear", |
|||
}; |
|||
} else { |
|||
this.navstyle = { |
|||
"background-color": "rgba(63, 60, 60, 1)", |
|||
"-webkit-transition": "background-color 500ms linear", |
|||
"-ms-transition": "background-color 500ms linear", |
|||
transition: "background-color 500ms linear", |
|||
}; |
|||
} |
|||
}); |
|||
//elegxos gia to kata poso o xrhsths einai logged. |
|||
// Analoga me to apotelesma emfanizontai oi katallhles epiloges sto nav-bar |
|||
// H leitourgikothta ginetai me v-if wste na mhn ginontai render apo thn arxh |
|||
var logged = store.getters["usermodule/getLoggedIn"]; |
|||
if (logged) { |
|||
this.showlogin = false; |
|||
this.showlogout = true; |
|||
} else this.showlogin = true; |
|||
this.$root.$on("loggedin", () => { |
|||
this.showlogin = false; |
|||
this.showlogout = true; |
|||
}); |
|||
}, |
|||
methods: { |
|||
//function gia th diadikasia tou logout |
|||
async logout() { |
|||
await store.dispatch("usermodule/prepareLogout").then(() => { |
|||
this.showlogin = true; |
|||
this.showlogout = false; |
|||
this.$router.push("login"); |
|||
}); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
<style></style> |
|||
@ -0,0 +1,190 @@ |
|||
<template> |
|||
<div class="sidebar"> |
|||
<b-sidebar |
|||
id="account" |
|||
bg-variant="light" |
|||
title="Settings" |
|||
text-variant="dark" |
|||
width="450px" |
|||
:backdrop-variant="variant" |
|||
backdrop |
|||
shadow |
|||
right |
|||
lazy |
|||
> |
|||
<div class="side"> |
|||
<p id="title"> |
|||
Account info |
|||
</p> |
|||
<p> |
|||
<div id="title2">Email:</div> |
|||
<b-form-input |
|||
id="email" |
|||
title="E-mail" |
|||
type="email" |
|||
v-model="text" |
|||
:placeholder="text" |
|||
:disabled="email" |
|||
/> |
|||
</p> |
|||
<p> |
|||
<div id="title2">Password:</div> |
|||
<b-form-input |
|||
id="pass" |
|||
title="Password" |
|||
type="text" |
|||
v-model="password" |
|||
:placeholder="text" |
|||
:disabled="pass" |
|||
/> |
|||
</p> |
|||
<hr /> |
|||
<p id="title"> |
|||
Options |
|||
</p> |
|||
<p> |
|||
<b-button variant="info" @click="onEmail">Change Email </b-button> |
|||
</p> |
|||
<p> |
|||
<b-button variant="info" @click="onPass">Change Password </b-button> |
|||
</p> |
|||
<hr /> |
|||
<p id="title"> |
|||
Covid 19 Greece (Playing with AXIOS) |
|||
</p> |
|||
<b-button |
|||
style="margin-bottom: 10px" |
|||
v-show="button" |
|||
variant="danger" |
|||
@click="covidData" |
|||
:disabled="update" |
|||
>Get Data for Covid |
|||
</b-button> |
|||
<b-spinner id="spinner" v-if="spinner" label="Loading..."> </b-spinner> |
|||
<div id="title2">Date</div> |
|||
<b-table |
|||
table-variant="dark" |
|||
hover |
|||
small |
|||
outlined |
|||
bordered |
|||
responsive |
|||
show-empty |
|||
:items="date" |
|||
> |
|||
</b-table> |
|||
<div id="title2"> |
|||
Cases |
|||
</div> |
|||
<b-table |
|||
table-variant="dark" |
|||
hover |
|||
small |
|||
outlined |
|||
bordered |
|||
responsive |
|||
show-empty |
|||
:items="cases" |
|||
> |
|||
</b-table> |
|||
<div id="title2"> |
|||
Deaths |
|||
</div> |
|||
<b-table |
|||
table-variant="dark" |
|||
hover |
|||
small |
|||
outlined |
|||
bordered |
|||
responsive |
|||
show-empty |
|||
:items="deaths" |
|||
></b-table> |
|||
</div> |
|||
</b-sidebar> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import store from "@/store/index"; |
|||
|
|||
export default { |
|||
name: "Sidebar", |
|||
data() { |
|||
return { |
|||
button: true, |
|||
spinner: false, |
|||
update: false, |
|||
show: false, |
|||
email: true, |
|||
pass: true, |
|||
text: "Email@email.com", |
|||
password: "Password", |
|||
variant: "dark", |
|||
data: [], |
|||
cases: [], |
|||
deaths: [], |
|||
date: [], |
|||
}; |
|||
}, |
|||
mounted() { |
|||
this.text = store.getters["usermodule/getEmail"]; |
|||
this.password = store.getters["usermodule/getPassword"]; |
|||
this.$root.$on("showSide", () => { |
|||
this.text = store.getters["usermodule/getEmail"]; |
|||
this.password = store.getters["usermodule/getPassword"]; |
|||
console.log("sidebar: " + this.text + " " + this.password); |
|||
}); |
|||
this.$root.$on("covid", () => { |
|||
var apidata = store.getters["testApi/getData"]; |
|||
this.data = apidata[0]; |
|||
console.log(" Sidebar got: ", this.data); |
|||
|
|||
this.cases.pop(); |
|||
this.cases.push(this.data.cases); |
|||
|
|||
this.deaths.pop(); |
|||
this.deaths.push(this.data.deaths); |
|||
|
|||
this.date.pop(); |
|||
var date2 = new Date(this.data.time).toString(); |
|||
this.date.push({ |
|||
Date: date2, |
|||
}); |
|||
}); |
|||
}, |
|||
methods: { |
|||
onEmail: function() { |
|||
console.log("Hello"); |
|||
if (this.email) this.email = false; |
|||
else { |
|||
this.email = true; |
|||
} |
|||
}, |
|||
async covidData() { |
|||
try { |
|||
this.spinner = true; |
|||
this.button = false; |
|||
await store.dispatch("testApi/callData").then(() => { |
|||
this.$root.$emit("covid"); |
|||
this.update = true; |
|||
this.spinner = false; |
|||
}); |
|||
} catch (error) {} |
|||
}, |
|||
async onPass() { |
|||
try { |
|||
console.log("Hello"); |
|||
if (this.pass) this.pass = false; |
|||
else { |
|||
this.pass = true; |
|||
} |
|||
} catch (error) {} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,18 @@ |
|||
<template> |
|||
<div class="testNav"> |
|||
<ul> |
|||
<li><a href="#home">Home</a></li> |
|||
<li><a href="#news">News</a></li> |
|||
<li><a href="#contact">Contact</a></li> |
|||
<li style="float:right"><a class="active" href="#about">About</a></li> |
|||
</ul> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: "testNav", |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
@ -0,0 +1,224 @@ |
|||
<template> |
|||
<div class="index"> |
|||
<transition name="fade" appear> |
|||
<b-container fluid="md"> |
|||
<b-tabs id="tabs" pills card nav-wrapper-class="tabs"> |
|||
<b-tab title="Socket Communication"> |
|||
<p> |
|||
<b-jumbotron style="text-align: left"> |
|||
<template #header> |
|||
<b-icon icon="people-fill" variant="info"> </b-icon> |
|||
Socket |
|||
</template> |
|||
<template #lead> |
|||
Takes the input, sends it to the server through a socket and |
|||
the server trasmits it back to the client. The client then |
|||
takes the data and prints them to the user. It doesnt provide |
|||
any real-life functionality as a component. It is just for |
|||
testing |
|||
</template> |
|||
<hr class="my-4" /> |
|||
<b-row> <h3>Data:</h3> </b-row> |
|||
<b-row> |
|||
<b-form-input |
|||
:value="socketv" |
|||
v-model="socketv" |
|||
placeholder="Enter data" |
|||
></b-form-input> |
|||
</b-row> |
|||
<b-row> |
|||
<b-button class="mb-2" variant="primary" @click="sendData" |
|||
>Send data through socket |
|||
</b-button> |
|||
</b-row> |
|||
<b-row><h3>Data incoming from sockets:</h3></b-row> |
|||
<div class="alert" v-html="serverdata"></div> |
|||
</b-jumbotron> |
|||
</p> |
|||
</b-tab> |
|||
<b-tab title="Api communication"> |
|||
<b-jumbotron style="text-align: left"> |
|||
<template #header> |
|||
<b-icon icon="people-fill" variant="info"> </b-icon> API |
|||
</template> |
|||
<template #lead> |
|||
Takes the input, sends it to the server by calling a GET method |
|||
and the server sends it back to the client. The client then |
|||
takes the data and prints them to the user. It doesnt provide |
|||
any real-life functionality as a component. It is just for |
|||
testing. |
|||
</template> |
|||
<hr class="my-4" /> |
|||
<b-row> |
|||
<h3>Write some data:</h3> |
|||
</b-row> |
|||
<b-row> |
|||
<b-form-input v-model="input" placeholder="put some data"> |
|||
</b-form-input> |
|||
</b-row> |
|||
|
|||
<b-row> |
|||
<b-button class="mb-2" variant="primary" @click="getData"> |
|||
Send data |
|||
</b-button> |
|||
</b-row> |
|||
<b-row> |
|||
<h3>Textarea with the data that server sent to Vue:</h3> |
|||
</b-row> |
|||
<b-row> |
|||
<b-form-textarea |
|||
id="textarea" |
|||
:value="textarea" |
|||
v-model="textarea" |
|||
placeholder="Results from server" |
|||
rows="3" |
|||
max-rows="6" |
|||
> |
|||
</b-form-textarea> |
|||
</b-row> |
|||
</b-jumbotron> |
|||
</b-tab> |
|||
</b-tabs> |
|||
</b-container> |
|||
</transition> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import axios from "axios"; |
|||
import store from "@/store/index"; |
|||
//import Vue from "vue"; |
|||
//import Vue from "vue"; |
|||
|
|||
export default { |
|||
name: "Communication", |
|||
props: { |
|||
msg: String, |
|||
}, |
|||
data: () => { |
|||
return { |
|||
serverdata: "", |
|||
socketv: "", |
|||
issocket: false, |
|||
info: null, |
|||
input: null, |
|||
textarea: null, |
|||
}; |
|||
}, |
|||
mounted() { |
|||
// var logged = store.getters["usermodule/getLoggedIn"]; |
|||
// console.log(`Helloworld says: ${logged}`); |
|||
this.$socket.client.emit("message", { |
|||
message: "Hi from webclient", |
|||
room: "iot", |
|||
}); |
|||
|
|||
//method that is being called when the page is loaded. It requests the GET /run |
|||
axios |
|||
.get("https://factory.swarmlab.io:3880/test") |
|||
.then((response) => { |
|||
console.log(response); |
|||
this.info = response.data; |
|||
}) |
|||
.catch((err) => { |
|||
console.log(err); |
|||
}); |
|||
|
|||
this.$root.$on("socket_add", (v) => { |
|||
this.socketdata = v; |
|||
//console.log("socket_add emited message: " + JSON.stringify(v)); |
|||
this.$socket.client.emit("broadcast", "Webclient Requested GET /test"); |
|||
}); |
|||
|
|||
// this.$root.on("message", (data) => { |
|||
// console.log(`Server responded: ${data}`); |
|||
// }); |
|||
}, |
|||
beforeDestroy() { |
|||
this.$root.$off("socket_add"); |
|||
}, |
|||
created() { |
|||
this.socketopen(); |
|||
}, |
|||
sockets: { |
|||
connect: function() { |
|||
this.$socket.client.emit("authenticate", "logintoken"); |
|||
|
|||
this.$socket.client.emit("socket_id_get", "socketdatasend"); |
|||
console.log(`Socket connected`); |
|||
this.issocket = "open"; |
|||
}, |
|||
connect_error(error) { |
|||
console.log("socket connect_error " + JSON.stringify(error)); |
|||
this.issocket = "close"; |
|||
}, |
|||
connect_timeout(reason) { |
|||
console.log("socket timeout " + JSON.stringify(reason)); |
|||
this.issocket = "close"; |
|||
}, |
|||
reconnect(attemptNumber) { |
|||
console.log( |
|||
"socket reconnect attemptNumber " + JSON.stringify(attemptNumber) |
|||
); |
|||
}, |
|||
reconnect_attempt(attemptNumber) { |
|||
console.log("socket reconnect_attempt " + JSON.stringify(attemptNumber)); |
|||
}, |
|||
reconnecting(attemptNumber) { |
|||
console.log("socket reconnecting " + JSON.stringify(attemptNumber)); |
|||
}, |
|||
reconnect_error(error) { |
|||
console.log("socket reconnect_error " + JSON.stringify(error)); |
|||
this.issocket = "close"; |
|||
}, |
|||
unauthorized(val) { |
|||
console.log("socket unauthorized " + JSON.stringify(val)); |
|||
this.issocket = "close"; |
|||
}, |
|||
socket_id_emit(val) { |
|||
console.log("socket id from server " + JSON.stringify(val)); |
|||
this.issocket = "open"; |
|||
}, |
|||
async message(val) { |
|||
if (this.serverdata != null) |
|||
this.serverdata = this.serverdata + val + "<br>"; |
|||
console.log(" socket message " + JSON.stringify(val)); |
|||
}, |
|||
}, |
|||
methods: { |
|||
//method that calls the api from the back end and exchange data. The data are printed into the textarea on the front end. |
|||
getData: function() { |
|||
var input = this.input; |
|||
//console.log("get Data function called") |
|||
axios |
|||
.get("https://factory.swarmlab.io:3880/test", { |
|||
params: { |
|||
input: input, |
|||
}, |
|||
}) |
|||
.then((response) => { |
|||
this.textarea = response.data; |
|||
console.log(response); |
|||
}) |
|||
.catch((err) => { |
|||
console.log(err); |
|||
}); |
|||
this.$root.$emit("socket_add", "socket emit"); |
|||
}, |
|||
sendData: function() { |
|||
var input = this.socketv; |
|||
this.$socket.client.emit("broadcast", input); |
|||
// this.serverdata = this.serverdata + this.socketv + "<br>"; |
|||
}, |
|||
async socketopen() { |
|||
this.$socket.client.open(); |
|||
}, |
|||
async socketclose() { |
|||
this.$socket.client.close(); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<!-- Add "scoped" attribute to limit CSS to this component only --> |
|||
<style scoped></style> |
|||
@ -0,0 +1,16 @@ |
|||
import VuetableFieldHandle from "vuetable-2/src/components/VuetableFieldHandle.vue"; |
|||
/*Arxeio pou periexei apla ta tags se kathe collumn tou pinaka poy emfanizei |
|||
ta logs tou server*/ |
|||
export default [ |
|||
{ |
|||
name: "message", |
|||
}, |
|||
{ |
|||
name: "timestamp", |
|||
}, |
|||
"type", |
|||
"process_id", |
|||
{ |
|||
name: "app_name", |
|||
}, |
|||
]; |
|||
@ -0,0 +1,122 @@ |
|||
<template> |
|||
<div class="highchart"> |
|||
<transition name="fade" appear> |
|||
<b-container> |
|||
<div class="jumbotron2"> |
|||
<b-jumbotron> |
|||
<template #header> |
|||
<b-icon icon="clipboard-data" variant="info"> </b-icon> High Chart |
|||
</template> |
|||
<template #lead> |
|||
This chart prints the length of the arrays of logs that i have |
|||
stored in the store of VUEX. Anytime the length changes by the |
|||
buttons on the other section (Stats), the chart gets updated |
|||
instantly. WARNING: Any changes to the length of the arrays are |
|||
reset after a page reload. VUEX-persistedstate works only with |
|||
user login system at the moment. |
|||
</template> |
|||
<hr class="my-4" /> |
|||
<transition name="bounce" appear> |
|||
<highcharts |
|||
class="hc" |
|||
:options="chartOptions" |
|||
:callback="callback" |
|||
ref="chart" |
|||
></highcharts> |
|||
</transition> |
|||
<br /> |
|||
</b-jumbotron> |
|||
</div> |
|||
</b-container> |
|||
</transition> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState, mapGetters, mapActions, dispatch } from "vuex"; |
|||
import store from "@/store/index"; |
|||
import { Chart } from "highcharts-vue"; |
|||
import Highcharts from "highcharts"; |
|||
import exportingInit from "highcharts/modules/exporting"; |
|||
|
|||
exportingInit(Highcharts); |
|||
|
|||
export default { |
|||
name: "HighChart", |
|||
components: { |
|||
highcharts: Chart, |
|||
}, |
|||
data() { |
|||
return { |
|||
chartOptions: { |
|||
title: { |
|||
text: "Length of logs chart", |
|||
}, |
|||
// line: { |
|||
// dataLabels: { |
|||
// enabled: true, |
|||
// }, |
|||
// }, |
|||
chart: { |
|||
type: "column", |
|||
}, |
|||
xAxis: { |
|||
categories: ["JobjLogs", "jobj_console"], |
|||
}, |
|||
yAxis: { |
|||
title: { |
|||
text: "Count", |
|||
}, |
|||
}, |
|||
series: [], |
|||
}, |
|||
}; |
|||
}, |
|||
mounted() { |
|||
/* Event sto opoio enhmerwnetai pws allaksan ta dedomena sto chart kai pws prepei na ta |
|||
epanafortwsei. Ayto pithanon sto mellon tha fugei efoson to chart endexomenws na travaei |
|||
ta dedomena kateutheian apo kapoio API opote den tha mporoume na kseroume pote tha uparxoyn |
|||
perissotera dedomena sto server. Pros to paron mas eksuphretei sto na ananewnetai live to chart |
|||
kathe fora pou prosthetw egw kati stous pinakes sto store. |
|||
*/ |
|||
|
|||
this.$root.$on("on", () => { |
|||
var JobjLogs = store.getters["statsmodule/getCountLogs"]; |
|||
var jobj_console = store.getters["statsmodule/getCountConsole"]; |
|||
this.chartOptions.series = [ |
|||
{ |
|||
name: "swarm-app-Stats", |
|||
data: [JobjLogs, jobj_console], |
|||
}, |
|||
{ |
|||
name: "swarm-app-Stats2", |
|||
data: [JobjLogs, jobj_console], |
|||
}, |
|||
]; |
|||
}); |
|||
}, |
|||
methods: { |
|||
// Function poy trexei me to load tou chart |
|||
// fortwnei ta dedomena apo to store kai ta pernaei sto chart. |
|||
// Sthn poreia ta dedomena auta den tha einai eksarxhs fixed se pinakes sto store |
|||
// alla tha ta travaei apo kapoio Link |
|||
callback(params) { |
|||
//this.console = store.getters["statsmodule/getCountConsole"]; |
|||
var JobjLogs = store.getters["statsmodule/getCountLogs"]; |
|||
var jobj_console = store.getters["statsmodule/getCountConsole"]; |
|||
this.chartOptions.series.push( |
|||
{ |
|||
name: "swarm-app-Stats", |
|||
data: [JobjLogs, jobj_console], |
|||
}, |
|||
{ |
|||
name: "swarm-app-Stats2", |
|||
data: [JobjLogs, jobj_console], |
|||
} |
|||
); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped></style> |
|||
@ -0,0 +1,148 @@ |
|||
<template> |
|||
<div v-if="computedShow" id="login"> |
|||
<b-form id="myform" validated> |
|||
<b-container fluid="md" style="margin-top: 90px; text-align:left"> |
|||
<b-jumbotron |
|||
border-variant="dark" |
|||
lead="This is a sample text for testing." |
|||
> |
|||
<template #header> |
|||
<b-icon icon="person-fill" variant="info"></b-icon> Login |
|||
</template> |
|||
<hr class="my-4" /> |
|||
<b-form-group |
|||
id="input-group-1" |
|||
label="Your Mail:" |
|||
label-for="input-1" |
|||
description="We'll never share your email with anyone else." |
|||
> |
|||
<b-input-group size="lg"> |
|||
<b-input-group-prepend is-text> |
|||
<b-icon icon="envelope"></b-icon> |
|||
</b-input-group-prepend> |
|||
<b-form-input |
|||
id="input-1" |
|||
v-model="email" |
|||
type="email" |
|||
required |
|||
placeholder="Enter email" |
|||
@input="validate" |
|||
v-on:keyup.enter="event" |
|||
> |
|||
</b-form-input> |
|||
</b-input-group> |
|||
</b-form-group> |
|||
<b-form-group |
|||
id="input-group-2" |
|||
label="Your password:" |
|||
label-for="input-2" |
|||
> |
|||
<b-form-input |
|||
id="input-2" |
|||
v-model="password" |
|||
type="password" |
|||
required |
|||
placeholder="Enter password" |
|||
v-on:keyup.enter="event" |
|||
@input="validate" |
|||
> |
|||
</b-form-input> |
|||
</b-form-group> |
|||
<b-button |
|||
type="button" |
|||
@click="onSubmit" |
|||
:disabled="computedDisable" |
|||
variant="primary" |
|||
ref="but" |
|||
> |
|||
Login |
|||
</b-button> |
|||
<b-button type="button" @click="onReset" variant="danger"> |
|||
Reset |
|||
</b-button> |
|||
</b-jumbotron> |
|||
</b-container> |
|||
</b-form> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import store from "@/store/index"; |
|||
|
|||
export default { |
|||
name: "Login", |
|||
data: () => { |
|||
return { |
|||
validPass: false, |
|||
validMail: false, |
|||
disable: true, |
|||
showo: false, |
|||
show: true, |
|||
email: "", |
|||
password: "", |
|||
}; |
|||
}, |
|||
mounted() { |
|||
// elegxei an exei ginei login wste na emfanisei h oxi to login form |
|||
var logged = store.getters["usermodule/getLoggedIn"]; |
|||
if (logged) this.show = false; |
|||
else this.show = true; |
|||
}, |
|||
|
|||
computed: { |
|||
computedDisable: function() { |
|||
return this.disable; |
|||
}, |
|||
computedShow: function() { |
|||
return this.show; |
|||
}, |
|||
}, |
|||
methods: { |
|||
validate() { |
|||
console.log("Validating..."); |
|||
var mailformat = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/; |
|||
if (this.email.match(mailformat) && this.password.length >= 1) { |
|||
this.disable = false; |
|||
} else { |
|||
this.disable = true; |
|||
} |
|||
}, |
|||
event() { |
|||
this.$refs.but.click(); |
|||
}, |
|||
onReset() { |
|||
this.user = [ |
|||
{ |
|||
email: null, |
|||
password: null, |
|||
}, |
|||
]; |
|||
this.disable = true; |
|||
}, |
|||
async onSubmit() { |
|||
// this.$bvModal.hide("modal-multi-1"); |
|||
console.log(this.email + " " + this.password); |
|||
var test = true; |
|||
if (test) { |
|||
var data = { |
|||
email: this.email, |
|||
password: this.password, |
|||
}; |
|||
await store |
|||
.dispatch("usermodule/preparelogin", JSON.parse(JSON.stringify(data))) |
|||
.then(() => { |
|||
var logged = store.getters["usermodule/getLoggedIn"]; |
|||
console.log("On Submit getter: " + logged); |
|||
this.show = false; |
|||
this.$root.$emit("loggedin"); |
|||
this.$root.$emit("showSide"); |
|||
this.$router.push("communication"); |
|||
}); |
|||
//console.log("On submit action:" + log); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style></style> |
|||
@ -0,0 +1,220 @@ |
|||
<template> |
|||
<div class="stats"> |
|||
<transition name="fade" appear> |
|||
<b-container fluid> |
|||
<b-jumbotron style="text-align: left;"> |
|||
<template #header> |
|||
<b-icon icon="table" variant="info"> </b-icon> Stats with tables</template> |
|||
<template #lead> |
|||
There are 2 sections. The first one with the 2 buttons adds more test |
|||
logs into the arrays in the store. This is a case which we see |
|||
that our tables are reactive and immediatly show the added logs. The |
|||
second section are the tables that print the arrays. The tables are |
|||
duplicated. The first two are made with a third party component |
|||
Vuetable-2 and the next two are made with BootstrapVUe. There is no |
|||
need for both ways to exist. I just tried both ways and i am still not |
|||
sure which one to use. |
|||
</template> |
|||
<hr class="my-4" /> |
|||
<b-row> |
|||
<h2> Test logs </h2> </b-row> |
|||
<b-row> |
|||
<b-col style="text-align: left; "> |
|||
<p> |
|||
<h4> Add test log: </h4> |
|||
<b-button variant="success" @click="logs"> |
|||
jobj_console |
|||
</b-button> |
|||
</p> |
|||
</b-col> |
|||
<b-col style="text-align: left;" cols="10" > |
|||
<p> |
|||
<h4> Add test log: </h4> |
|||
<b-button variant="success" @click="logs2"> |
|||
jobj_logs |
|||
</b-button> |
|||
</p> |
|||
</b-col> |
|||
</b-row> |
|||
</b-jumbotron> |
|||
<hr class="my-4" /> |
|||
<br /> |
|||
<b-row> |
|||
<b-col style="margin-bottom: 15px;"> |
|||
<b-jumbotron > |
|||
<template #header> |
|||
Vue-table 2 |
|||
</template> |
|||
<hr class="my-4" /> |
|||
<h3>Vuetable-2 example of jobj_console:</h3> |
|||
<div class="overf"> |
|||
<vuetable |
|||
ref="vuetable" |
|||
:css="css.table" |
|||
:fields="fields" |
|||
:api-mode="false" |
|||
:data-manager="dataManager" |
|||
> |
|||
</vuetable> |
|||
</div> |
|||
<h3>Vuetable-2 example of jobj_log:</h3> |
|||
<div class="overf"> |
|||
<vuetable |
|||
ref="vuetable" |
|||
:css="css.table" |
|||
:fields="fields" |
|||
:api-mode="false" |
|||
:data-manager="dataManager2" |
|||
> |
|||
</vuetable> |
|||
</div> |
|||
<br /> |
|||
</b-jumbotron> |
|||
</b-col> |
|||
<b-col> |
|||
<b-jumbotron header="Boot-Strap Vue"> |
|||
<hr class="my-4" /> |
|||
<b-pagination |
|||
v-model="currentPage" |
|||
:total-rows="rows" |
|||
:per-page="perPage" |
|||
aria-controls="my-table" |
|||
> |
|||
</b-pagination> |
|||
<div class="boottable"> |
|||
<b-table |
|||
id="my-table" |
|||
striped |
|||
hover |
|||
:outlined="true" |
|||
:bordered="true" |
|||
:per-page="perPage" |
|||
:items="data" |
|||
:current-page="currentPage" |
|||
:head-variant="headVariant" |
|||
:table-variant="tableVariant" |
|||
> |
|||
</b-table> |
|||
</div> |
|||
|
|||
<br /> |
|||
<b-pagination |
|||
v-model="currentPage2" |
|||
:total-rows="rows2" |
|||
:per-page="perPage" |
|||
aria-controls="my" |
|||
> |
|||
</b-pagination> |
|||
<div class="boottable"> |
|||
<b-table |
|||
id="my" |
|||
striped |
|||
hover |
|||
:outlined="true" |
|||
:bordered="true" |
|||
:per-page="perPage" |
|||
:items="data2" |
|||
:current-page="currentPage2" |
|||
:head-variant="headVariant" |
|||
:table-variant="tableVariant" |
|||
> |
|||
</b-table> |
|||
</div> |
|||
|
|||
<br /> |
|||
</b-jumbotron> |
|||
</b-col> |
|||
</b-row> |
|||
</b-container> |
|||
</transition> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState, mapGetters, mapActions, dispatch } from "vuex"; |
|||
import store from "@/store/index"; |
|||
import Vuetable from "vuetable-2"; |
|||
import Fields from "./Fields"; |
|||
import CssConfig from "../../assets/tableCSS.js"; |
|||
|
|||
export default { |
|||
name: "ShowStats", |
|||
components: { |
|||
Vuetable, |
|||
}, |
|||
data: () => { |
|||
return { |
|||
css: CssConfig, |
|||
headVariant: "dark", |
|||
tableVariant: "dark", |
|||
currentPage: 1, |
|||
currentPage2: 1, |
|||
perPage: 5, |
|||
fields: Fields, |
|||
data: [], |
|||
data2: [], |
|||
}; |
|||
}, |
|||
computed: { |
|||
rows2() { |
|||
return this.data2.length; |
|||
}, |
|||
rows() { |
|||
return this.data.length; |
|||
}, |
|||
}, |
|||
mounted() { |
|||
// pinakes gia tous pinakes tou bootstrapvue me ta data apo to store |
|||
this.data = store.getters["statsmodule/getJobjConsole"]; |
|||
this.data2 = store.getters["statsmodule/getJobjLogs"]; |
|||
//console.log(this.data); |
|||
}, |
|||
methods: { |
|||
// function gia thn prosthikh enas log se pinaka sto store |
|||
// Egina sta plaisia peiramatismou tou vuex. Den eksuphretei kapoio ousiwdes senario |
|||
async logs() { |
|||
var log = await store.dispatch("statsmodule/prepareCommitConsole", { |
|||
message: "test", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "out", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}); |
|||
// Enhmerwnei ta charts oti prostethike ena log |
|||
this.$root.$emit("on"); |
|||
}, |
|||
// function gia thn prosthikh enas log se pinaka sto store |
|||
// Egina sta plaisia peiramatismou tou vuex. Den eksuphretei kapoio ousiwdes senario |
|||
async logs2() { |
|||
var log = await store.dispatch("statsmodule/prepareCommitLogs", { |
|||
message: "test", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}); |
|||
// Enhmerwnei ta charts oti prostethike ena log |
|||
this.$root.$emit("on"); |
|||
}, |
|||
dataManager() { |
|||
// function gia to gemisma tou vuetable. Sthn ousia apla epistrefei ta katallhla data |
|||
var data = store.getters["statsmodule/getJobjConsole"]; |
|||
console.log(data); |
|||
return { |
|||
data: data, |
|||
}; |
|||
}, |
|||
dataManager2() { |
|||
// function gia to gemisma tou vuetable. Sthn ousia apla epistrefei ta katallhla data |
|||
var data = store.getters["statsmodule/getJobjLogs"]; |
|||
return { |
|||
data: data, |
|||
}; |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
|
|||
</style> |
|||
@ -0,0 +1,45 @@ |
|||
import Vue from "vue"; |
|||
import Vuex from "vuex"; |
|||
import store from "@/store/index"; |
|||
import App from "./App.vue"; |
|||
import { BootstrapVue, IconsPlugin } from "bootstrap-vue"; |
|||
import VueSocketIOExt from "vue-socket.io-extended"; |
|||
import io from "socket.io-client"; |
|||
import Highcharts from "highcharts"; |
|||
import HighchartsVue from "highcharts-vue"; |
|||
import Gantt from "highcharts/modules/gantt"; |
|||
import router from "./router"; |
|||
import { library } from "@fortawesome/fontawesome-svg-core"; |
|||
import { faUserSecret } from "@fortawesome/free-solid-svg-icons"; |
|||
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; |
|||
import { faFontAwesome } from "@fortawesome/free-brands-svg-icons"; |
|||
|
|||
library.add(faFontAwesome, faUserSecret); |
|||
|
|||
Vue.component("font-awesome-icon", FontAwesomeIcon); |
|||
|
|||
//css imports
|
|||
import "bootstrap/dist/css/bootstrap.css"; |
|||
import "bootstrap-vue/dist/bootstrap-vue.css"; |
|||
import "./assets/style.css"; |
|||
import "./assets/css/style.css"; |
|||
|
|||
Gantt(Highcharts); |
|||
Vue.config.productionTip = false; |
|||
|
|||
const socket = io("https://factory.swarmlab.io:3880", { |
|||
autoConnect: false, |
|||
}); |
|||
|
|||
Vue.use(VueSocketIOExt, socket); |
|||
Vue.use(HighchartsVue); |
|||
Vue.use(BootstrapVue); |
|||
// Optionally install the BootstrapVue icon components plugin
|
|||
Vue.use(IconsPlugin); |
|||
Vue.use(Vuex); |
|||
|
|||
new Vue({ |
|||
store, |
|||
router, |
|||
render: (h) => h(App), |
|||
}).$mount("#app"); |
|||
@ -0,0 +1,130 @@ |
|||
import Vue from "vue"; |
|||
import Router from "vue-router"; |
|||
import store from "@/store/index"; |
|||
import HelloWorld from "@/components/pageComponents/Communication"; |
|||
import Stats from "@/components/pageComponents/ShowStats"; |
|||
import Chart from "@/components/pageComponents/HighChart"; |
|||
import Login from "@/components/pageComponents/Login"; |
|||
import App from "@/App"; |
|||
import Home from "@/components/Home"; |
|||
|
|||
Vue.use(Router); |
|||
|
|||
const router = new Router({ |
|||
routes: [ |
|||
{ |
|||
path: "/", |
|||
name: "App", |
|||
component: App, |
|||
redirect: "/home", |
|||
children: [ |
|||
{ |
|||
path: "home", |
|||
name: "Home", |
|||
component: Home, |
|||
redirect: "home/login", |
|||
children: [ |
|||
{ |
|||
path: "communication", |
|||
name: "Communication", |
|||
component: HelloWorld, |
|||
}, |
|||
{ |
|||
path: "login", |
|||
name: "login", |
|||
component: Login, |
|||
}, |
|||
{ |
|||
path: "chart", |
|||
name: "Chart", |
|||
component: Chart, |
|||
}, |
|||
{ |
|||
path: "stats", |
|||
name: "Stats", |
|||
component: Stats, |
|||
}, |
|||
], |
|||
}, |
|||
], |
|||
}, |
|||
// {
|
|||
// path: "/communication",
|
|||
// name: "Communication",
|
|||
// component: HelloWorld,
|
|||
// },
|
|||
// {
|
|||
// path: "/login",
|
|||
// name: "login",
|
|||
// component: Login,
|
|||
// },
|
|||
// {
|
|||
// path: "/chart",
|
|||
// name: "Chart",
|
|||
// component: Chart,
|
|||
// },
|
|||
// {
|
|||
// path: "/stats",
|
|||
// name: "Stats",
|
|||
// component: Stats,
|
|||
// },
|
|||
], |
|||
mode: "history", |
|||
scrollBehavior() { |
|||
return { x: 0, y: 0 }; |
|||
}, |
|||
}); |
|||
|
|||
router.beforeEach((to, from, next) => { |
|||
var loggedin = store.getters["usermodule/getLoggedIn"]; |
|||
console.log("Logged in: " + loggedin); |
|||
console.log("from: " + from.name + " to: " + to.name); |
|||
|
|||
if (from.name === null && to.name === "login" && loggedin === false) { |
|||
// FISIOLOGIKO LOAD APO TO /
|
|||
// an den eisai logged kai erxesai apo null kai pas sto login
|
|||
console.log("FISIOLOGIKO LOAD APO TO /"); |
|||
next(); |
|||
} else if (from.name === null && to.name === "login" && loggedin === true) { |
|||
// REDIRECT OTAN EISAI LOGGED KAI MPAINEIS STO SITE
|
|||
// an eisai logged kai erxesai apo null kai pas sto login
|
|||
console.log("REDIRECT OTAN EISAI LOGGED KAI MPAINEIS STO SITE"); |
|||
next("home/communication"); |
|||
} else if (from.name === null && to.name !== "login" && loggedin === false) { |
|||
// REDIRECT OTAN PAS KARFOTA SE KAPOIO LINK ENW DEN EISAI LOGGED
|
|||
// an den eisai logged kai erxesai apo null kai den pas sto login trava sto home
|
|||
console.log( |
|||
"REDIRECT OTAN PAS KARFOTA SE KAPOIO LINK ENW DEN EISAI LOGGED " |
|||
); |
|||
next("/"); |
|||
} else if (from.name === null && to.name !== "login" && loggedin === true) { |
|||
// OTAN PAS KARFOTA SE KAPOIO LINK ENW EISAI LOGGED
|
|||
// an eisai logged kai erxesai apo null kai pas opoudipote pera tou login phgaine
|
|||
console.log( |
|||
"OTAN PAS KARFOTA SE KAPOIO LINK ENW EISAI LOGGED --- \n" + |
|||
"PROHGOUMENOS EGINE: REDIRECT OTAN EISAI LOGGED KAI MPAINEIS STO SITE" |
|||
); |
|||
next(); |
|||
} else if (from.name !== null && to.name === "login" && loggedin === true) { |
|||
// OTAN PAS STO LOGIN ENW EISAI LOGGED
|
|||
// an eisai logged kai den erxesai apo null alla pas sto login, BLOCK
|
|||
console.log("OTAN PAS STO LOGIN ENW EISAI LOGGED"); |
|||
next(false); |
|||
} else if (from.name !== null && to.name !== "login" && loggedin === true) { |
|||
// KANONIKO NAVIGATION ME TO NAVBAR
|
|||
// an eisai logged kai den erxesai apo null kai den pas sto login, next()
|
|||
console.log("KANONIKO NAVIGATION ME TO NAVBAR ---- LOGIN"); |
|||
next(); |
|||
} else if (from.name !== null && to.name === "login" && loggedin === false) { |
|||
//LOGOUT
|
|||
// an den eisai logged kai den erxesai apo null kai pas sto login, next() (logout)
|
|||
console.log("LOGOUT"); |
|||
next(); |
|||
} else { |
|||
//MOLIS EKANES LOGOUT KAI PAS NA GURISEIS PISW
|
|||
console.log("MOLIS EKANES LOGOUT KAI PAS NA GURISEIS PISW"); |
|||
next(false); |
|||
} |
|||
}); |
|||
|
|||
export default router; |
|||
@ -0,0 +1,34 @@ |
|||
import Vuex from "vuex"; |
|||
import Vue from "vue"; |
|||
import statsmodule from "./modules/statsmodule"; |
|||
import usermodule from "./modules/usermodule"; |
|||
import { BootstrapVue } from "bootstrap-vue"; |
|||
import createPersistedState from "vuex-persistedstate"; |
|||
import testApi from "./modules/testApi"; |
|||
|
|||
Vue.use(Vuex); |
|||
Vue.use(BootstrapVue); |
|||
|
|||
import "bootstrap/dist/css/bootstrap.css"; |
|||
import "bootstrap-vue/dist/bootstrap-vue.css"; |
|||
|
|||
//create store
|
|||
export default new Vuex.Store({ |
|||
modules: { |
|||
statsmodule, |
|||
usermodule, |
|||
testApi, |
|||
}, |
|||
plugins: [ |
|||
createPersistedState({ |
|||
paths: ["usermodule.loggedin", "usermodule.userInfo"], |
|||
}), |
|||
], |
|||
state: { |
|||
// = data
|
|||
}, |
|||
getters: { |
|||
// = computed properties
|
|||
}, |
|||
mutations: {}, |
|||
}); |
|||
@ -0,0 +1,171 @@ |
|||
//import axios from "axios";
|
|||
import { mapState, mapActions, commit } from "vuex"; |
|||
import store from "@/store/index"; |
|||
|
|||
const state = { |
|||
loggedin: false, |
|||
jobj_console: [ |
|||
{ |
|||
message: "broadcast epexe!!!!!!!!!!!!!!!!!!!!\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "out", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "broadcast epexe!!!!!!!!!!!!!!!!!!!!!!\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "out", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "broadcast epexe!!!!!!!!!!!!!!!!!!!!!!!\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "out", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "broadcast epexe!!!!!!!!!!!!!!!!!!!!!!!!\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "out", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "broadcast epexe!!!!!!!!!!!!!!!!!!!!!!!!1\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "out", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
], |
|||
jobj_log: [ |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
{ |
|||
message: "socket GET from client naiiiiiiiiiiiiiiiiiiiiiiiiii\n", |
|||
timestamp: "2020-11-04 22:30 +00:00", |
|||
type: "err", |
|||
process_id: 0, |
|||
app_name: "statsserver", |
|||
}, |
|||
], |
|||
}; |
|||
|
|||
const getters = { |
|||
getJobjConsole: (state) => state.jobj_console, |
|||
getJobjLogs: (state) => { |
|||
return state.jobj_log; |
|||
}, |
|||
getCountConsole: (state) => state.jobj_console.length, |
|||
getCountLogs: (state) => state.jobj_log.length, |
|||
}; |
|||
|
|||
const actions = { |
|||
async prepareCommitConsole({ commit, rootGetters }, value) { |
|||
try { |
|||
//console.log("Store: " + JSON.stringify(value));
|
|||
store.dispatch("statsmodule/addConsoleLog", value); |
|||
//return state.jobj_console;
|
|||
} catch (e) { |
|||
console.log("error: " + e); |
|||
} |
|||
}, |
|||
async prepareCommitLogs({ commit, rootGetters }, value) { |
|||
try { |
|||
//console.log("Store: " + JSON.stringify(value));
|
|||
store.dispatch("statsmodule/addLog", value); |
|||
|
|||
//return state.jobj_console;
|
|||
} catch (e) { |
|||
console.log("error: " + e); |
|||
} |
|||
}, |
|||
addLog({ commit }, value) { |
|||
commit("log", value); |
|||
}, |
|||
addConsoleLog({ commit }, value) { |
|||
//add row to console logs
|
|||
commit("console", value); |
|||
}, |
|||
}; |
|||
|
|||
const mutations = { |
|||
log(state, data) { |
|||
state.jobj_log.push(data); |
|||
}, |
|||
console(state, data) { |
|||
state.jobj_console.push(data); |
|||
}, |
|||
}; |
|||
|
|||
export default { |
|||
namespaced: true, |
|||
state, |
|||
getters, |
|||
actions, |
|||
mutations, |
|||
}; |
|||
@ -0,0 +1,62 @@ |
|||
import axios from "axios"; |
|||
import { mapState, mapActions, commit } from "vuex"; |
|||
import store from "@/store/index"; |
|||
|
|||
const state = { |
|||
data: [], |
|||
}; |
|||
|
|||
const getters = { |
|||
getData: (state) => state.data, |
|||
}; |
|||
|
|||
const actions = { |
|||
async callData({ commit, rootGetters }) { |
|||
try { |
|||
var data; |
|||
console.log("Api method is called."); |
|||
const options = { |
|||
method: "GET", |
|||
url: "https://covid-193.p.rapidapi.com/statistics", |
|||
params: { country: "Greece" }, |
|||
headers: { |
|||
"x-rapidapi-key": |
|||
"8f6134a80bmsh8a19102f19f3351p19a7bejsn2436b2615535", |
|||
"x-rapidapi-host": "covid-193.p.rapidapi.com", |
|||
}, |
|||
}; |
|||
|
|||
await axios |
|||
.request(options) |
|||
.then(function(response) { |
|||
//console.log("Axios: ", response.data.response[0]);
|
|||
data = response.data.response[0]; |
|||
store.dispatch("testApi/storeData", data); |
|||
}) |
|||
.catch(function(error) { |
|||
console.error("Error: " + error); |
|||
}); |
|||
} catch (e) { |
|||
console.log("error: " + e); |
|||
} |
|||
}, |
|||
storeData({ commit }, value) { |
|||
//console.log("before commit: ", value);
|
|||
commit("mutateData", value); |
|||
}, |
|||
}; |
|||
|
|||
const mutations = { |
|||
mutateData(state, value) { |
|||
state.data[0] = value; |
|||
//state.data.push(value);
|
|||
}, |
|||
}; |
|||
|
|||
export default { |
|||
namespaced: true, |
|||
state, |
|||
getters, |
|||
actions, |
|||
mutations, |
|||
}; |
|||
@ -0,0 +1,57 @@ |
|||
//import axios from "axios";
|
|||
import { mapState, mapActions, commit } from "vuex"; |
|||
import store from "@/store/index"; |
|||
|
|||
const state = { |
|||
loggedin: false, |
|||
userInfo: { |
|||
email: "Email@store.com", |
|||
password: "Password_store", |
|||
}, |
|||
}; |
|||
|
|||
const getters = { |
|||
getLoggedIn: (state) => state.loggedin, |
|||
getEmail: (state) => state.userInfo.email, |
|||
getPassword: (state) => state.userInfo.password, |
|||
}; |
|||
|
|||
const actions = { |
|||
async preparelogin({ commit, rootGetters }, value) { |
|||
try { |
|||
// console.log("From store: " + value.email + value.password);
|
|||
//console.log("Store: " + JSON.stringify(value));
|
|||
await store.dispatch("usermodule/login", value); |
|||
// console.log(`Store says: ${state.loggedin}`);
|
|||
// return state.loggedin;
|
|||
} catch (e) { |
|||
console.log("error: " + e); |
|||
} |
|||
}, |
|||
async prepareLogout({ commit, rootGetters }) { |
|||
commit("logout"); |
|||
}, |
|||
async login({ commit }, value) { |
|||
// console.log("before commit: " + value.email + " " + value.password);
|
|||
commit("flogin", value); |
|||
}, |
|||
}; |
|||
|
|||
const mutations = { |
|||
logout(state) { |
|||
state.loggedin = false; |
|||
}, |
|||
flogin(state, value) { |
|||
state.loggedin = true; |
|||
state.userInfo.email = value.email; |
|||
state.userInfo.password = value.password; |
|||
}, |
|||
}; |
|||
|
|||
export default { |
|||
namespaced: true, |
|||
state, |
|||
getters, |
|||
actions, |
|||
mutations, |
|||
}; |
|||
Loading…
Reference in new issue