mitri4
/
LilSchool
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

LIL-706 Правки Андрея иттерация 3

Browse Source
remotes/origin/editis_13-01-19
gzbender 7 years ago
parent 32d86ebc25
commit c65e1ac69e
9 changed files with 64 additions and 87 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 40
      web/src/components/blocks/BlockContent.vue
  2. 19
      web/src/components/blocks/BlockImage.vue
  3. 17
      web/src/components/blocks/BlockImageText.vue
  4. 17
      web/src/components/blocks/BlockImages.vue
  5. 17
      web/src/components/blocks/BlockText.vue
  6. 19
      web/src/components/blocks/BlockVideo.vue
  7. 3
      web/src/icons/arrow-up.svg
  8. 14
      web/src/sass/_common.sass
  9. 5
      web/src/sass/generated/_sprite-svg.scss

40
web/src/components/blocks/BlockContent.vue
Unescape View File

@ -1,7 +1,29 @@
<template>
<div>
<vue-draggable :list="content" @start="drag=true" @end="drag=false" :options="{ handle: '.sortable__handle' }">
<div v-for="(block, index) in content" :key="block.id ? block.id : block.uuid">
<div v-for="(block, index) in content" :key="block.id ? block.id : block.uuid" class="kit__section kit__section--block">
<div class="kit__section-remove">
<button if="index != 0" type="button" @click="moveUp(index)">
<svg class="icon icon-arrow-up">
<use xlink:href="/static/img/sprite.svg#icon-arrow-up"></use>
</svg>
</button>
<button if="index < (content.length - 1)" type="button" @click="moveDown(index)">
<svg class="icon icon-arrow-down">
<use xlink:href="/static/img/sprite.svg#icon-arrow-down"></use>
</svg>
</button>
<button class="sortable__handle" type="button">
<svg class="icon icon-hamburger">
<use xlink:href="/static/img/sprite.svg#icon-hamburger"></use>
</svg>
</button>
<button type="button" @click="onBlockRemoved(index)">
<svg class="icon icon-delete">
<use xlink:href="/static/img/sprite.svg#icon-delete"></use>
</svg>
</button>
</div>
<block-text v-if="block.type === 'text'"
:index="index"
:title.sync="block.data.title"
@ -55,6 +77,22 @@
name: 'block-content',
props: ['content'],
methods: {
moveUp(blockIndex) {
if(blockIndex <= 0){
return;
}
const block = this.content[blockIndex];
const prevBlock = this.content[blockIndex - 1];
this.content.splice(blockIndex - 1, 2, block, prevBlock);
},
moveDown(blockIndex) {
if(blockIndex >= this.content.length - 1){
return;
}
const block = this.content[blockIndex];
const nextBlock = this.content[blockIndex + 1];
this.content.splice(blockIndex, 2, nextBlock, block);
},
onBlockRemoved(blockIndex) {
const remove = () => {
// Удаляем блок из Vue

19
web/src/components/blocks/BlockImage.vue
Unescape View File

@ -1,17 +1,5 @@
<template>
<div class="kit__section kit__section--block">
<div class="kit__section-remove">
<button class="sortable__handle" type="button">
<svg class="icon icon-hamburger">
<use xlink:href="/static/img/sprite.svg#icon-hamburger"></use>
</svg>
</button>
<button type="button" @click="onRemove">
<svg class="icon icon-delete">
<use xlink:href="/static/img/sprite.svg#icon-delete"></use>
</svg>
</button>
</div>
<div>
<div class="kit__field field">
<div class="field__wrap field__wrap--title">
<input type="text"
@ -44,9 +32,6 @@
onUpdateImageId(newValue) {
this.$emit('update:imageId', newValue);
},
onRemove() {
this.$emit('remove', this.index);
}
},
components: {
'lil-image': LilImage,
@ -56,4 +41,4 @@
<style scoped>
</style>
</style>

17
web/src/components/blocks/BlockImageText.vue
Unescape View File

@ -1,17 +1,5 @@
<template>
<div class="kit__section kit__section--block">
<div class="kit__section-remove">
<button class="sortable__handle" type="button">
<svg class="icon icon-hamburger">
<use xlink:href="/static/img/sprite.svg#icon-hamburger"></use>
</svg>
</button>
<button type="button" @click="onRemove">
<svg class="icon icon-delete">
<use xlink:href="/static/img/sprite.svg#icon-delete"></use>
</svg>
</button>
</div>
<div>
<div class="kit__row">
<lil-image :image-id="imageId" :image-url="imageUrl" v-on:update:imageUrl="onUpdateImageUrl"
v-on:update:imageId="onUpdateImageId" :access-token="accessToken"/>
@ -58,9 +46,6 @@
onUpdateImageId(newValue) {
this.$emit('update:imageId', newValue);
},
onRemove() {
this.$emit('remove', this.index);
}
},
components: {
'lil-image': LilImage,

17
web/src/components/blocks/BlockImages.vue
Unescape View File

@ -1,17 +1,5 @@
<template>
<div class="kit__section kit__section--block">
<div v-if="!readOnly" class="kit__section-remove">
<button class="sortable__handle" type="button">
<svg class="icon icon-hamburger">
<use xlink:href="/static/img/sprite.svg#icon-hamburger"></use>
</svg>
</button>
<button type="button" @click="onRemove">
<svg class="icon icon-delete">
<use xlink:href="/static/img/sprite.svg#icon-delete"></use>
</svg>
</button>
</div>
<div>
<div class="kit__field field">
<div class="field__wrap field__wrap--title">
<input :readonly="readOnly" type="text"
@ -86,9 +74,6 @@
}
});
},
onRemove() {
this.$emit('remove', this.index);
},
onRemoveImage(index) {
let images = this.images;
let id = images[index].image_id;

17
web/src/components/blocks/BlockText.vue
Unescape View File

@ -1,17 +1,5 @@
<template>
<div class="kit__section kit__section--block">
<div class="kit__section-remove">
<button class="sortable__handle" type="button">
<svg class="icon icon-hamburger">
<use xlink:href="/static/img/sprite.svg#icon-hamburger"></use>
</svg>
</button>
<button type="button" @click="onRemove">
<svg class="icon icon-delete">
<use xlink:href="/static/img/sprite.svg#icon-delete"></use>
</svg>
</button>
</div>
<div>
<div class="kit__field field">
<div class="field__wrap field__wrap--title">
<input type="text"
@ -42,9 +30,6 @@
onTextChange(newValue) {
this.$emit('update:text', newValue);
},
onRemove() {
this.$emit('remove', this.index);
}
},
components: {
'vue-redactor': VueRedactor,

19
web/src/components/blocks/BlockVideo.vue
Unescape View File

@ -1,17 +1,5 @@
<template>
<div class="kit__section kit__section--block">
<div class="kit__section-remove">
<button class="sortable__handle" type="button">
<svg class="icon icon-hamburger">
<use xlink:href="/static/img/sprite.svg#icon-hamburger"></use>
</svg>
</button>
<button type="button" @click="onRemove">
<svg class="icon icon-delete">
<use xlink:href="/static/img/sprite.svg#icon-delete"></use>
</svg>
</button>
</div>
<div>
<div class="kit__field field">
<div class="field__wrap field__wrap--title">
<input type="text"
@ -46,13 +34,10 @@
onVideoUrlChange(event) {
this.$emit('update:videoUrl', event.target.value);
},
onRemove() {
this.$emit('remove', this.index);
}
}
}
</script>
<style scoped>
</style>
</style>

3
web/src/icons/arrow-up.svg
Unescape View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="13" height="7" viewBox="0 0 13 7">
<image id="Слой_1" data-name="Слой 1" width="13" height="7" xlink:href="data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAHBAMAAAAhXtopAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAHlBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC3KG9qAAAACXRSTlMAIJ8w789AEGBkqKgYAAAAAWJLR0QAiAUdSAAAAAlwSFlzAAALsAAAC7ABGjgQcgAAADVJREFUCNdjYGBgVGQAA5MpBiCK2VXUGUSnhLOHJDAwcEwqYCiawcCQqQAU00xg4ADJcTAAAKgDBme4bf0WAAAAAElFTkSuQmCC"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 594 B

14
web/src/sass/_common.sass
Unescape View File

@ -3628,19 +3628,23 @@ a.grey-link
&__section
margin-bottom: 60px
&--block
box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.06)
border-radius: 10px
/* box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.06) */
/* border-radius: 10px */
padding: 15px
position: relative
&-remove
position: absolute
right: 15px
top: 20px
.icon-delete
button:not(:last-child)
margin-right: 10px
.icon-delete, .icon-arrow-up, .icon-arrow-down
width: 1.3em
height: 1.3em
transition: fill 0.3s ease
&:hover
.icon-arrow-up, .icon-arrow-down
fill: #C8C8C8
.icon-delete:hover, .icon-arrow-up:hover, .icon-arrow-down:hover
fill: #000
&__nav
display: flex
@ -3733,6 +3737,8 @@ a.grey-link
text-align: center
&__submit
width: 220px
&__field .field__wrap--title
margin-right: 125px;
.editor
position: relative

5
web/src/sass/generated/_sprite-svg.scss
Unescape View File

@ -8,6 +8,11 @@
height: 1em;
fill: #333;
}
.icon-arrow-up {
width: 1.71em;
height: 1em;
fill: #333;
}
.icon-arrow-left {
width: 1.33em;
height: 1em;

Write Preview
Loading…
Cancel
Save