Сделан дизайн и компонеты Не реализовано сохранение/отображени данных пользователяremotes/origin/PR-15
parent
384d0f36bc
commit
6937616692
17 changed files with 1799 additions and 41 deletions
|
After Width: | Height: | Size: 47 KiB |
@ -0,0 +1,7 @@ |
||||
#!/usr/bin/env bash |
||||
echo "run browserify" |
||||
cd .. |
||||
source ~/venv/proekton/bin/activate |
||||
#browserify ./js/src/init.js -o ./js/build/init.js -t babelify |
||||
browserify ./js/src/init_user_profile.js -o ./js/build/init_user_profile.js -t babelify |
||||
#watchify ./js/src/init.js -t babelify -o ./js/build/init.js |
||||
@ -1,5 +0,0 @@ |
||||
#!/usr/bin/env bash |
||||
echo "run watchify" |
||||
cd .. |
||||
source ~/venv/proekton/bin/activate |
||||
watchify ./js/src/init.js -t babelify -o ./js/build/init.js |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,66 @@ |
||||
import SelectedContainer from './SelectedContainer'; |
||||
import NoTreeSelect from './NoTreeSelect'; |
||||
import TreeSelect from './TreeSelect'; |
||||
|
||||
$(function () { |
||||
function createFilterSpecs(url) { |
||||
// SPECIALIZATIONS FILTER
|
||||
let sb_main = new TreeSelect($('#select-box-1'), {url, hasEditableContainer: true}); |
||||
sb_main.setHeader("Специализации"); |
||||
let select_container = new SelectedContainer($('#selected-spec'), {obj: sb_main}); |
||||
sb_main.connectSelectedContainer(select_container); |
||||
let sb_1 = new TreeSelect($('#select-box-2'), {obj: sb_main}); |
||||
let sb_2 = new TreeSelect($('#select-box-3'), {obj: sb_main}); |
||||
let sb_3 = new TreeSelect($('#select-box-4'), {obj: sb_main}); |
||||
let sb_4 = new TreeSelect($('#select-box-5'), {obj: sb_main}); |
||||
|
||||
sb_main.setNearbySelectBox(sb_1); |
||||
sb_1.setNearbySelectBox(sb_2, sb_main); |
||||
sb_2.setNearbySelectBox(sb_3, sb_1); |
||||
sb_3.setNearbySelectBox(sb_4, sb_2); |
||||
sb_4.setNearbySelectBox("", sb_3); |
||||
|
||||
} |
||||
|
||||
function createFilterBuildingClass(url) { |
||||
// BUILDING-CLASSIFICATION FILTER
|
||||
let sb_build_main = new TreeSelect($('#sb-building-classification'), {url, visible:true}); |
||||
sb_build_main.setHeader("Классификация здания"); |
||||
|
||||
let sb_build_1 = new TreeSelect($('#sb-building-sub-classification'), {obj: sb_build_main}); |
||||
|
||||
let select_build_container = new SelectedContainer($('#selected-building-classification'), {obj: sb_build_main}); |
||||
sb_build_main.connectSelectedContainer(select_build_container); |
||||
|
||||
sb_build_main.setNearbySelectBox(sb_build_1); |
||||
sb_build_1.setNearbySelectBox("", sb_build_main); |
||||
} |
||||
|
||||
function createFilterConstructionType(url) { |
||||
let sb_constr_main = new NoTreeSelect($('#sb-construction-type'), {url, visible:true}); |
||||
sb_constr_main.setHeader("Вид строительства"); |
||||
let select_constr_type = new SelectedContainer($('#selected-construction-type'), {obj:sb_constr_main, noTree: true}); |
||||
sb_constr_main.connectSelectedContainer(select_constr_type); |
||||
} |
||||
|
||||
function createFilerLocations(url) { |
||||
let sb_loc_main = new TreeSelect($('#sb-location-1'), {url, visible:true}); |
||||
sb_loc_main.setHeader("Местоположение"); |
||||
let select_loc = new SelectedContainer($('#selected-location'), {obj: sb_loc_main, onlyOne: true}); |
||||
sb_loc_main.connectSelectedContainer(select_loc); |
||||
let sb_loc_1 = new TreeSelect($('#sb-location-2'), {obj: sb_loc_main}); |
||||
let sb_loc_2 = new TreeSelect($('#sb-location-3'), {obj: sb_loc_main}); |
||||
|
||||
sb_loc_main.setNearbySelectBox(sb_loc_1); |
||||
sb_loc_1.setNearbySelectBox(sb_loc_2, sb_loc_main); |
||||
sb_loc_2.setNearbySelectBox("", sb_loc_1); |
||||
|
||||
} |
||||
|
||||
createFilterSpecs('/api/specializations_flat'); |
||||
createFilterBuildingClass('/api/building_classifications'); |
||||
createFilterConstructionType('/api/construction_type'); |
||||
createFilerLocations('/api/locations_flat'); |
||||
|
||||
|
||||
}); |
||||
@ -0,0 +1,41 @@ |
||||
.rad { |
||||
cursor: pointer; |
||||
user-select: none; |
||||
-webkit-user-select: none; |
||||
-webkit-touch-callout: none; |
||||
} |
||||
|
||||
.rad > input { /* HIDE ORG RADIO & CHECKBOX */ |
||||
visibility: hidden; |
||||
position: absolute; |
||||
} |
||||
|
||||
/* RADIO & CHECKBOX STYLES */ |
||||
.rad > i { /* DEFAULT <i> STYLE */ |
||||
display: inline-block; |
||||
vertical-align: middle; |
||||
width: 24px; |
||||
height: 24px; |
||||
border-radius: 50%; |
||||
transition: 0.2s; |
||||
box-shadow: inset 0 0 0 16px #fff; |
||||
border: 1px solid #cccccc; |
||||
background: #cccccc; |
||||
margin-right: 5px; |
||||
} |
||||
|
||||
/* CHECKBOX OVERWRITE STYLES */ |
||||
.rad:hover > i { /* HOVER <i> STYLE */ |
||||
box-shadow: inset 0 0 0 3px #fff; |
||||
background: #cccccc; |
||||
} |
||||
|
||||
.rad > input:checked + i { /* (RADIO CHECKED) <i> STYLE */ |
||||
box-shadow: inset 0 0 0 3px #fff; |
||||
background: #cccccc; |
||||
} |
||||
|
||||
label.rad { |
||||
font-style: italic; |
||||
color: #606060; |
||||
} |
||||
@ -0,0 +1,96 @@ |
||||
.mainContent { |
||||
padding: 43px 25px 40px 25px; |
||||
} |
||||
|
||||
.simple-input { |
||||
height: 51px; |
||||
width: 100%; |
||||
border: 1px solid #cccccc; |
||||
outline: none; |
||||
padding: 5px 40px 5px 20px; |
||||
background-color: white; |
||||
margin-bottom: -1px; |
||||
} |
||||
|
||||
.toggle .btn { |
||||
padding: 14px 20px; |
||||
border-radius: 40px; |
||||
} |
||||
|
||||
.bottom-line { |
||||
padding-bottom: 10px; |
||||
border-bottom: 1px solid #cccccc; |
||||
} |
||||
|
||||
.top-line { |
||||
/*padding-bottom: 10px;*/ |
||||
border-top: 1px solid #cccccc; |
||||
} |
||||
|
||||
/* СУПЕР-костыльная кнопка. Не прикасаться!*/ |
||||
.upload-new { |
||||
width: 75%; |
||||
height: 30px; |
||||
overflow: hidden; |
||||
cursor: pointer; |
||||
/*float: left;*/ |
||||
/*margin: 0 0 10px 0;*/ |
||||
border-radius: 40px; |
||||
border: 1px solid #FF0029; |
||||
} |
||||
|
||||
.upload-new:hover { |
||||
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); |
||||
-webkit-transform: scale(1.04); |
||||
-moz-transform: scale(1.04); |
||||
transform: scale(1.04); |
||||
} |
||||
|
||||
.upload-new { |
||||
transition: all 0.3s; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.upload-new input { |
||||
display: block !important; |
||||
width: 100% !important; |
||||
height: 30px !important; |
||||
opacity: 0 !important; |
||||
cursor: pointer; |
||||
} |
||||
|
||||
.upload-new p { |
||||
line-height: 30px; |
||||
text-transform: uppercase; |
||||
margin: -30px 0 0 0; |
||||
/*padding: 0 5px 0 5px;*/ |
||||
font-size: 12px; |
||||
text-align: center; |
||||
font-family: Arial-MT-Regular; |
||||
} |
||||
|
||||
/** Конец супер-костыля**/ |
||||
|
||||
.row-eq-height { |
||||
display: -webkit-box; |
||||
display: -webkit-flex; |
||||
display: -ms-flexbox; |
||||
display: flex; |
||||
} |
||||
|
||||
.info { |
||||
background-color: #F2F2F2; |
||||
padding: 60px 40px; |
||||
margin-top: 20px; |
||||
} |
||||
|
||||
.btn-simple { |
||||
border-radius: 40px; |
||||
padding: 10px 15px; |
||||
border: 1px solid #FF0029; |
||||
color: black; |
||||
} |
||||
|
||||
.no-margin .selected-element { |
||||
margin: 0; |
||||
} |
||||
@ -0,0 +1,267 @@ |
||||
{% extends 'partials/base.html' %} |
||||
{% load staticfiles %} |
||||
{% block head_css %} |
||||
<link rel='stylesheet' href='{% static "lib/proekton-components/css/fonts.css" %}'> |
||||
<link rel='stylesheet' href='{% static "lib/proekton-components/css/selected-container.css" %}'> |
||||
<link rel='stylesheet' href='{% static "lib/proekton-components/css/editable-container.css" %}'> |
||||
<link rel='stylesheet' href='{% static "lib/proekton-components/css/select-box.css" %}'> |
||||
<link rel='stylesheet' href='{% static "css/project_filter.css" %}'>{# other #} |
||||
<link rel='stylesheet' href='{% static "css/font-awesome.min.css" %}'> |
||||
<link rel='stylesheet' href='{% static "css/user_profile_edit.css" %}'> |
||||
<link rel='stylesheet' href='{% static "css/custom-checkboxes.css" %}'> |
||||
{% endblock %} |
||||
{% load thumbnail %} |
||||
{% load thumbnail %} |
||||
|
||||
{% block content %} |
||||
{% include 'partials/header.html' %} |
||||
{# <form method="POST" enctype="multipart/form-data" novalidate>#} |
||||
{# {% csrf_token %}#} |
||||
{##} |
||||
{# {% if request.user.is_customer %}#} |
||||
{# <input type="hidden" name="next"#} |
||||
{# value="{% url 'users:customer-profile-open-projects' pk=pk %}">#} |
||||
{# {% elif request.user.is_contractor %}#} |
||||
{# <input type="hidden" name="next" value="{% url 'users:contractor-profile' pk=pk %}">#} |
||||
{# {% endif %}#} |
||||
|
||||
<div class="container mainScore"> |
||||
<div class="row mainContent"> |
||||
<div class="col-lg-12"> |
||||
<div class="row row-eq-height"> |
||||
<div class="col-lg-3"> |
||||
<div class="avatar" style="float: none"> |
||||
<div class="avatarInset -position-relative-parent"> |
||||
<a href="#" onclick="return false" class="btn close -live-image-delete" |
||||
style="display: none">×</a> |
||||
{# {% thumbnail request.user.avatar "235x224" crop="center" as avatar %}#} |
||||
{# {% if request.user.avatar %}#} |
||||
{# <img src="{{ avatar.url }}" alt="profile-image" class="-avatar-image">#} |
||||
{# {% else %}#} |
||||
<img src="{% static 'img/avatar_default.png' %}" alt="profile-image" |
||||
class="-avatar-image"> |
||||
{# {% endif %}#} |
||||
{# {% endthumbnail %}#} |
||||
</div> |
||||
</div> <!-- avatar --> |
||||
<div style="margin-top: 15px"> |
||||
<div class="upload-new"> |
||||
<input type="file" name="image" class="-live-image-upload"> |
||||
|
||||
<p>Загрузить фотографию</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-9"> |
||||
<div class="row"> |
||||
<div class="col-lg-12"> |
||||
<div class="bottom-line"> |
||||
<span class="header"> |
||||
Параметры заполнения прифиля влияют на фильтр поиска специалистов, ранжирования в списке |
||||
<i class="fa fa-question-circle-o" aria-hidden="true" title=""></i> |
||||
</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
<div class="col-lg-12" style="padding-bottom: 10px"> |
||||
<span class="header"> |
||||
Личная информация <i class="fa fa-question-circle-o" aria-hidden="true" |
||||
title=""></i> |
||||
</span> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="row"> |
||||
<div class="col-lg-4"> |
||||
<input name="first_name" class="simple-input" placeholder="Фамилия"> |
||||
</div> |
||||
<div class="col-lg-4"> |
||||
<input name="last_name" class="simple-input" placeholder="Имя"> |
||||
</div> |
||||
<div class="col-lg-4"> |
||||
<input name="patronym" class="simple-input" placeholder="Отчество"> |
||||
</div> |
||||
<div class="col-lg-4"> |
||||
<div class="vertical-child" id="sb-location-1"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-4"> |
||||
<div class="vertical-child" id="sb-location-2"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-4"> |
||||
<div class="vertical-child" id="sb-location-3"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-4"> |
||||
<div class="selected-container vertical-child no-margin" id="selected-location"> |
||||
<div class="header"> </div> |
||||
<input type="hidden" name="location" |
||||
value="{{ location }}"> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> <!-- top --> |
||||
|
||||
<div class="row"> |
||||
<div class="col-lg-12"> |
||||
<div class="row"> |
||||
<div class="col-lg-offset-3 col-lg-9"> |
||||
<div class="top-line"> |
||||
<span class="header"> |
||||
Мой опыт работы в проектировании / дизайне / сопровождении проектной документации |
||||
<i class="fa fa-question-circle-o" aria-hidden="true" title=""></i> |
||||
</span> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
<div class="col-lg-12"> |
||||
<div class="" id="select-box-1"> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
<div class="col-lg-3"> |
||||
<div class="vertical-child" id="select-box-2"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="vertical-child" id="select-box-3"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="vertical-child" id="select-box-4"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="vertical-child" id="select-box-5"> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
<div class="col-lg-12"> |
||||
<div class="selected-container horizontal" id="selected-spec"> |
||||
<input type="hidden" name="specialization" |
||||
value="{{ specialization }}"> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
<div class="col-lg-3"> |
||||
<div class="vertical-child" id="sb-building-classification"> |
||||
</div> |
||||
<div class="vertical-child" id="sb-building-sub-classification"> |
||||
</div> |
||||
<div class="selected-container" id="selected-building-classification"> |
||||
<input type="hidden" name="building_classification" |
||||
value="{{ building_classification }}"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="vertical-child" id="sb-construction-type"> |
||||
</div> |
||||
<div class="selected-container" id="selected-construction-type"> |
||||
<input type="hidden" name="construction_type" |
||||
value="{{ construction_type }}"> |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="select-box-header vertical-child"> |
||||
<span style="width: 180px" class="header">Требуется допуск (СРО)</span> |
||||
<i class="fa fa-question-circle-o" aria-hidden="true" |
||||
title="bla-bla-bla..."></i> |
||||
</div> |
||||
|
||||
<div class="custom-check"> |
||||
<div class="checked"></div> |
||||
<div style="display: none" class="not-checked"></div> |
||||
<input name="cro" type="checkbox" hidden {% if cro %} checked{% endif %}> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> <!-- center --> |
||||
<div class="row"> |
||||
<div class="col-lg-12"> |
||||
<div class="row"> |
||||
<div class="col-lg-12"> |
||||
<div class="top-line" style="padding-top: 15px"> |
||||
<div class="btn-group toggle" role="group" aria-label="..."> |
||||
<a href="{% url 'users:user-profile-edit' pk=pk %}" role="button" |
||||
class="btn btn-default">Общая информация</a> |
||||
<a href="{% url 'users:user-financial-info-edit' pk=pk %}" |
||||
class="btn btn-default" role="button">Финансовая информация</a> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="row info"> |
||||
<div class="col-lg-3"> |
||||
<div class="header"> Дата рождения</div> |
||||
<div class="birth_edit_dat"> |
||||
{{ form.date_of_birth }} |
||||
</div> |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="header">Пол</div> |
||||
<div class="checkbox"> |
||||
<label class="rad"> |
||||
|
||||
<input type="radio" name="gender" value="male" id="male"> |
||||
<i></i>Мужской |
||||
</label> |
||||
<label class="rad"> |
||||
|
||||
<input type="radio" name="gender" value="female" id="female"> |
||||
<i></i>Женский |
||||
</label> |
||||
</div> |
||||
|
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="header">Статус</div> |
||||
{{ form.contractor_status }} |
||||
</div> |
||||
<div class="col-lg-3"> |
||||
<div class="header">Skype</div> |
||||
<input name="skype" class="simple-input" placeholder="skype id"> |
||||
</div> |
||||
<div class="clearfix visible-lg"></div> |
||||
<div class="col-lg-3 vertical-child"> |
||||
<div class="header">Сайт</div> |
||||
<input name="site" class="simple-input" placeholder="example.com"> |
||||
</div> |
||||
<div class="col-lg-3 vertical-child"> |
||||
<div class="header">Телефон</div> |
||||
<input name="phone-1" class="simple-input" placeholder="+7 909 999 00 00"> |
||||
</div> |
||||
<div class="col-lg-3 vertical-child"> |
||||
<div class="header">Второй телефон</div> |
||||
<input name="phone-2" class="simple-input" placeholder="+7 909 999 00 00"> |
||||
</div> |
||||
<div class="col-lg-3 vertical-child" style="text-align: center"> |
||||
<div class="header"> </div> |
||||
<a href="#" class="btn btn-simple">СОХРАНИТЬ</a> |
||||
</div> |
||||
|
||||
</div> |
||||
|
||||
</div> |
||||
</div> <!-- bottom --> |
||||
</div> |
||||
</div> |
||||
<div class="row"> |
||||
{% include 'partials/footer.html' %} |
||||
</div> |
||||
|
||||
</div> |
||||
|
||||
{% endblock %} |
||||
{% block js_block %} |
||||
{{ block.super }} |
||||
<script src='{% static "lib/proekton-components/js/build/init_user_profile.js" %}'></script> |
||||
<script src='{% static "projects-filter.js" %}'></script> |
||||
{% endblock %} |
||||
Loading…
Reference in new issue