LIL-706

apps/user/templates/user/edit-gallery.html

@@ -25,6 +25,7 @@
 {% block content %}
 <div class="section section_gray">
   <div class="section__center center center_sm">
+    <div class="title">Редактировать работы</div>
     <div>
       <block-images :images="$root.store._user_gallery_images" :access-token="$root.store.accessToken" no-title="1"/>
     </div>

apps/user/templates/user/profile.html

@@ -67,13 +67,13 @@
   <div class="section__center center">
     <div class="tabs js-tabs">
       <div class="tabs__nav">
-        <button class="tabs__btn js-tabs-btn active">МОИ ПОКУПКИ</button>
+        <button class="tabs__btn js-tabs-btn active" data-anchor="purchases">МОИ ПОКУПКИ</button>
         {% if is_author %}
-        <button class="tabs__btn js-tabs-btn">ОПУБЛИКОВАННЫЕ
+        <button class="tabs__btn js-tabs-btn" data-anchor="courses">ОПУБЛИКОВАННЫЕ
           <span class="mobile-hide">КУРСЫ</span>
         </button>
         {% endif %}
-        <button class="tabs__btn js-tabs-btn">МОИ РАБОТЫ</button>
+        <button class="tabs__btn js-tabs-btn" data-anchor="works">МОИ РАБОТЫ</button>
       </div>
       <div class="tabs__container">
         <div class="tabs__item js-tabs-item" style="display: block;">
@@ -140,11 +140,23 @@
         </div>
         {% endif %}
         <div class="tabs__item js-tabs-item">
-          <a class="btn btn_md btn_stroke" href="{% url 'user-gallery-edit' %}">Редактировать</a>
-          <div>
-            {% include 'content/blocks/gallery.html' with content=user.gallery %}
+          <div class="center center_sm">
+            <div style="text-align: right; margin-bottom: 15px;">
+              <a class="btn btn_md btn_stroke" href="{% url 'user-gallery-edit' %}">Редактировать</a>
+            </div>
+
+            <div class="examples gallery">
+              {% for image in user.gallery.gallery_images.all %}
+                <div class="examples__item">
+                  <a href="{{ image.img.image.url }}">
+                    {% thumbnail image.img.image "165x165" crop="center" as im %}
+                      <img class="examples__pic" src="{{ im.url }}">
+                    {% endthumbnail %}
+                  </a>
+                </div>
+              {% endfor %}
+            </div>
           </div>
-        </div>
       </div>
     </div>
   </div>

apps/user/views.py

@@ -318,4 +318,4 @@ class BonusHistoryView(TemplateView):
 
 @method_decorator(login_required, name='dispatch')
 class UserGalleryEditView(TemplateView):
-    template_name = 'user/edit_gallery.html'
+    template_name = 'user/edit-gallery.html'

project/templates/blocks/lil_store_js.html

@@ -22,6 +22,7 @@
     urls: {
       courses: "{% url 'courses' %}",
       userProfileEdit: "{% url 'user-edit-profile' %}",
+      userProfile: "{% url 'user-profile' %}",
       userBonuses: "{% url 'user-bonuses' %}",
     },
     flags: {

web/src/js/app.js

@@ -21,6 +21,7 @@ import "./modules/mixpanel";
 
 import "../sass/app.sass";
 
+import $ from 'jquery';
 import Vue from 'vue';
 import Vuelidate from 'vuelidate';
 import VueAutosize from '../components/directives/autosize'
@@ -55,7 +56,14 @@ const app = new Vue({
   },
   mounted(){
     if(this.urlIs('userProfileEdit') || this.urlIs('userBonuses')){
-      profileMain(this);
+        profileMain(this);
+    }
+    if(this.urlIs('userProfile')){
+        if(window.location.hash){
+            $(document).ready(() => {
+                $(`[data-anchor=${window.location.hash.slice(1)}]`).click();
+            });
+        }
     }
   },
   methods: {

web/src/js/user-gallery-edit.js

@@ -0,0 +1,14 @@
+import BlockImages from '../components/blocks/BlockImages.vue';
+import $ from 'jquery';
+import {api} from "./modules/api";
+
+window.LIL_STORE.components['block-images'] = BlockImages;
+
+$(document).ready(function () {
+    $('#gallery-save').click(e => {
+        e.preventDefault();
+        api.saveUserGallery(window.LIL_STORE._user_gallery_images).then(response => {
+            window.location.href = '/user/profile/#works';
+        });
+    });
+});