Skip to content

Commit 64b0ce3

Browse files
authored
Merge pull request #6 from Nimgr/home_3
3rd week homework
2 parents 0022767 + 966e7aa commit 64b0ce3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+19421
-3532
lines changed

.storybook/decorators.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
export const bgGreyDecorator = () => {
2+
return {
3+
data: () => ({
4+
styles: {
5+
padding: "20px",
6+
background: "#ccc"
7+
}
8+
}),
9+
template: `
10+
<div :style="styles"><story/></div>`
11+
}
12+
}

package-lock.json

Lines changed: 15390 additions & 3299 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,16 @@
88
"build": "rm -rf dist && webpack --mode=production --progress",
99
"reg": "node reg-util.js",
1010
"storybook": "start-storybook -p 6006",
11-
"build-storybook": "build-storybook"
11+
"build-storybook": "build-storybook",
12+
"test": "jest"
1213
},
1314
"keywords": [],
1415
"author": "",
1516
"license": "ISC",
1617
"devDependencies": {
1718
"@babel/core": "^7.9.6",
1819
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
20+
"@babel/plugin-transform-runtime": "^7.10.1",
1921
"@babel/preset-env": "^7.3.1",
2022
"@storybook/addon-actions": "^5.3.18",
2123
"@storybook/addon-links": "^5.3.18",
@@ -57,13 +59,21 @@
5759
"last 2 versions"
5860
],
5961
"dependencies": {
62+
"@babel/runtime": "^7.10.2",
63+
"axios": "^0.19.2",
64+
"babel-polyfill": "^6.26.0",
65+
"es6-promise": "^4.2.8",
66+
"jest": "^26.0.1",
67+
"jshint": "^2.11.1",
6068
"normalize.css": "^8.0.1",
6169
"promptly": "^3.0.3",
6270
"pug": "^2.0.3",
6371
"request": "^2.88.0",
6472
"signale": "^1.4.0",
73+
"simple-vue-validator": "^0.16.0",
6574
"vue": "^2.6.7",
6675
"vue-flickity": "^1.2.1",
67-
"vue-router": "^3.0.2"
76+
"vue-router": "^3.2.0",
77+
"vuex": "^3.4.0"
6878
}
6979
}

src/admin/App.vue

Lines changed: 83 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -1,116 +1,93 @@
11
<template lang="pug">
2-
form.form
3-
input(type="text" placeholder="Login" v-model="user.login")
4-
input(type="password" placeholder="password" v-model="user.password")
5-
button(type="submit") LogIn
6-
7-
body
8-
.wrapper
9-
.maincontent
10-
section.about
11-
.container.about__container
12-
header.header
13-
.header__top
14-
.about__user
15-
.user__avatar
16-
img(src=require("images/content/Aigor.jpg")).user__avatar-pic
17-
.user__name Игорь Немгиров
18-
.adm__panel
19-
h2 Панель администрирования
20-
a(href="").quit__btn Выйти
21-
.header__bottom
22-
.header__menu
23-
nav.nav
24-
- var menu = ['Обо мне', 'Работы', 'Отзывы']
25-
ul.nav__list
26-
each item in menu
27-
li.nav__item
28-
a(href="").nav__link #item
29-
30-
.about__block
31-
.head__part
32-
.block__title
33-
h1 Блок "Обо мне"
34-
.add__btn
35-
button.add__btn-group
36-
.button__name Добавить группу
37-
.about__wrapper
38-
.about__groups
39-
ul.groups__list
40-
li.groups__item
41-
tr
42-
tr
43-
tr
44-
tr
45-
tr
46-
li.groups__item
47-
tr
48-
li.groups__item
49-
tr
50-
51-
section.works
52-
container.works__container
53-
.works__block
54-
.head__part
55-
.block__title
56-
h2 Блок "Работы"
57-
.works__wrapper
58-
.works__collection
59-
.edit__work
60-
h3 Редактирование работы
61-
.edit__content
62-
.edit__content-left
63-
.edit__content-right
64-
.works__preview
65-
.works__add
66-
ul.works__list
67-
li.works__item
68-
69-
section.reviews
70-
container.reviews__container
71-
.reviews__block
72-
.head__part
73-
.block__title
74-
h2 Блок "Отзывы"
75-
.reviews__wrapper
76-
.reviews__collection
77-
.reviews__new
78-
h3 Новый отзыв
79-
.reviews__content
80-
.reviews__content-left
81-
.reviews__content-right
82-
.reviews__preview
83-
.reviews__add
84-
ul.reviews__list
85-
li.reviews__item
86-
2+
div.root-wrapper-container
3+
div.root-container
4+
template(v-if="$route.meta.login")
5+
.login
6+
router-view
7+
template(v-else)
8+
.admin
9+
header.header-container
10+
app-header
11+
section.tabs-container
12+
tabs
13+
main.content-container
14+
router-view
15+
8716
</template>
8817

8918
<script>
90-
import SimpleVueValidator from 'simple-vue-validator';
91-
const Validator = SimpleVueValidator.Validator;
19+
import { mapState, mapActions, mapGetters } from "vuex";
20+
// import SimpleVueValidator from 'simple-vue-validator';
21+
// const Validator = SimpleVueValidator.Validator;
9222
export default {
93-
mixins: [SimpleVueValidator.mixin],
94-
validators: {
95-
'user.login': function (value) {
96-
return Validator.custom(function() {
97-
if (value.length < 5) {
98-
return 'Не менее 5 символов'
99-
}
100-
});
101-
},
102-
'user.password': function (value) {
103-
return Validator.custom(function() {
104-
if (value.length < 8) {
105-
return 'Не менее 8 символов'
106-
}
107-
});
108-
},
23+
// mixins: [SimpleVueValidator.mixin],
24+
// validators: {
25+
// 'title': function (value) {
26+
// return Validator.custom(function () {
27+
// if (value.length < 3) {
28+
// return 'Не менее 3 символов'
29+
// }
30+
// });
31+
// }
32+
// },
33+
34+
components: {
35+
appHeader: () => import("./components/header"),
36+
tabs: () => import("./components/tabs")
10937
}
110-
}
38+
};
11139
</script>
11240

113-
<style lang="postcss">
11441

115-
</style>
42+
<style lang="pcss">
43+
@import "normalize.css";
44+
@import "../styles/mixins.pcss";
45+
@import "../styles/layout/base.pcss";
46+
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800");
47+
48+
button {
49+
border-color: rgb(216, 216, 216) rgb(209, 209, 209) rgb(186, 186, 186);
50+
border-style: solid;
51+
border-width: 1px;
52+
background-color: buttonface;
53+
}
54+
.root-wrapper-container {
55+
height: 100%;
56+
}
57+
.header-container {
58+
background: linear-gradient(to right, #3e3e59, #454573);
59+
padding: 15px 0;
60+
/* @include phones {
61+
padding: 20px 0;
62+
} */
63+
}
64+
.root-container {
65+
display: flex;
66+
flex-direction: column;
67+
height: 100%;
68+
}
69+
.admin-wrapper {
70+
display: flex;
71+
}
72+
73+
.maincontent {
74+
width: 100%;
75+
display: flex;
76+
flex-direction: column;
77+
min-height: 100vh;
78+
}
11679
80+
.content-container {
81+
background: url("../images/content/admin.jpg") center center no-repeat / cover;
82+
flex: 1;
83+
padding-top: 60px;
84+
/* @include phones {
85+
padding-top: 30px;
86+
} */
87+
}
88+
.page-title {
89+
margin-bottom: 60px;
90+
font-size: 21px;
91+
font-weight: bold;
92+
}
93+
</style>

src/admin/components/button.vue

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
<template lang="pug">
2+
button(
3+
v-if="elem === 'button'"
4+
v-on="$listeners"
5+
:class="{'disabled' : disabled}"
6+
:disabled="disabled"
7+
).default-btn-container.btn-decorator {{text}}
8+
9+
10+
.btn-file-container(
11+
v-else-if="elem === 'file'"
12+
)
13+
.btn-file-fake.btn-decorator {{text}}
14+
input(
15+
type="file"
16+
v-on="$listeners"
17+
).btn-file-input
18+
</template>
19+
20+
<script>
21+
export default {
22+
props: {
23+
text: {
24+
type: String,
25+
default: "Отправить"
26+
},
27+
disabled: {
28+
type: Boolean,
29+
default: false
30+
},
31+
elem: {
32+
type: String,
33+
default: "button",
34+
validator: value => ["button", "file"].includes(value)
35+
}
36+
}
37+
};
38+
</script>
39+
40+
<style lang="postcss" scoped>
41+
.btn-file-container {
42+
overflow: hidden;
43+
position: relative;
44+
}
45+
.btn-file-input {
46+
position: absolute;
47+
top: 0;
48+
left: -9999px;
49+
}
50+
.btn-decorator {
51+
padding: 19px 40px;
52+
color: #fff;
53+
text-transform: uppercase;
54+
background: linear-gradient(to right, #006aed, #3f35cb) center center;
55+
display: inline-block;
56+
border-radius: 100px;
57+
font-weight: bold;
58+
&.disabled {
59+
opacity: .5;
60+
filter: grayscale(100%);
61+
pointer-events: none;
62+
user-select: none;
63+
}
64+
&.plain {
65+
text-transform: initial;
66+
color: $links-color;
67+
background: transparent;
68+
}
69+
}
70+
</style>

src/admin/components/button/button.scss

Whitespace-only changes.

src/admin/components/button/button.test.js

Whitespace-only changes.

src/admin/components/button/button.vue

Whitespace-only changes.
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default } from "./button.vue";
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<template lang="pug">
2+
.input__error-tooltip-container {{errorText}}
3+
</template>
4+
5+
<script>
6+
export default {
7+
props: {
8+
errorText: {
9+
type: String,
10+
default: "Ошибка"
11+
}
12+
}
13+
};
14+
</script>
15+
16+
17+
<style lang="postcss" scoped>
18+
.input__error-tooltip-container {
19+
z-index: 100;
20+
background: $errors-color;
21+
color: #fff;
22+
padding: 12px 20px;
23+
font-size: 14px;
24+
white-space: nowrap;
25+
&:before {
26+
content: "";
27+
display: block;
28+
width: 0;
29+
height: 0;
30+
border: 10px solid transparent;
31+
border-top: 0;
32+
border-bottom-color: $errors-color;
33+
border-bottom-width: 7px;
34+
position: absolute;
35+
bottom: 100%;
36+
left: 50%;
37+
transform: translateX(-50%);
38+
}
39+
}
40+
</style>

0 commit comments

Comments
 (0)