Add ns page
This commit is contained in:
RemiZOffAlex
90
myapp/ns_page/templates/user/page.html
Normal file
90
myapp/ns_page/templates/user/page.html
Normal file
@@ -0,0 +1,90 @@
|
||||
{% extends "user/skeleton.html" %}
|
||||
{% block content %}
|
||||
{% raw %}
|
||||
|
||||
<h3>
|
||||
<a class="btn btn-outline-secondary" href="/pages"><i class="fa fa-chevron-left"></i></a>
|
||||
{{ page.title }}
|
||||
</h3>
|
||||
|
||||
<tags-component v-bind:tags="page.tags" v-bind:node="page.id" v-bind:url="'Page'"></tags-component>
|
||||
|
||||
<span v-html="page.body"></span>
|
||||
|
||||
<backtotop-component></backtotop-component>
|
||||
|
||||
{% endraw %}
|
||||
{% endblock %}
|
||||
|
||||
{% block breadcrumb %}
|
||||
{% raw %}
|
||||
<ol class="breadcrumb mt-3">
|
||||
<li class="breadcrumb-item"><a href="/"><i class="fa fa-home"></i></a></li>
|
||||
<li class="breadcrumb-item"><a href="/pages">Страницы</a></li>
|
||||
<li class="breadcrumb-item active" v-html="page.title"></li>
|
||||
</ol>
|
||||
{% endraw %}
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
<script type="text/javascript" src="/static/components/backtotop.js"></script>
|
||||
<link rel="stylesheet" href="/static/components/backtotop.css"></link>
|
||||
<script type="text/javascript" src="/static/components/tags.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
page: {{ pagedata['page']|tojson|safe }},
|
||||
},
|
||||
methods: {
|
||||
pageDelete: function() {
|
||||
/* Удалить статью в корзину */
|
||||
let vm = this;
|
||||
axios.post(
|
||||
'/api',
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": 'page.delete',
|
||||
"params": {
|
||||
"id": vm.page.id
|
||||
},
|
||||
"id": 1
|
||||
}
|
||||
).then(
|
||||
function(response) {
|
||||
if ('result' in response.data) {
|
||||
window.location.href = '/pages';
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
showPanel: function(panel) {
|
||||
/* Показать/скрыть панель */
|
||||
panel.visible = !panel.visible;
|
||||
},
|
||||
saveStatus: function() {
|
||||
let vm = this;
|
||||
axios.post(
|
||||
'/api',
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": 'page.status',
|
||||
"params": {
|
||||
"id": vm.page.id,
|
||||
"status": vm.page.status
|
||||
},
|
||||
"id": 1
|
||||
}
|
||||
).then(
|
||||
function(response) {
|
||||
if ('result' in response.data) {
|
||||
vm.page = response.data['result'];
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
{% endblock %}
|
||||
82
myapp/ns_page/templates/user/page_add.html
Normal file
82
myapp/ns_page/templates/user/page_add.html
Normal file
@@ -0,0 +1,82 @@
|
||||
{% extends "user/skeleton.html" %}
|
||||
{% block content %}
|
||||
|
||||
|
||||
<h3>
|
||||
<a class="btn btn-outline-secondary" href="/pages"><i class="fa fa-chevron-left"></i></a>
|
||||
Новая страница
|
||||
</h3>
|
||||
<hr />
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="title">Заголовок</label>
|
||||
<input class="form-control" id="title" name="title" type="text" v-model="page.title">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="body">Текст</label>
|
||||
<textarea class="form-control" cols="40" id="body" name="body" rows="8" v-model="page.body"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="row mt-3">
|
||||
<div class="col">
|
||||
<button type="button" class="btn btn-outline-success pull-right" v-on:click="send"><i class="fa fa-plus"></i> Добавить</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block breadcrumb %}
|
||||
{% raw %}
|
||||
<ol class="breadcrumb mt-3">
|
||||
<li class="breadcrumb-item"><a href="/"><i class="fa fa-home"></i></a></li>
|
||||
<li class="breadcrumb-item"><a href="/pages">Статьи</a></li>
|
||||
<li class="breadcrumb-item active">Новая статья</li>
|
||||
</ol>
|
||||
{% endraw %}
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
{% import 'inc/editor.js' as editor %}
|
||||
{{ editor.plugin('tinymce') }}
|
||||
|
||||
<script type="text/javascript">
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
page: {
|
||||
title: '',
|
||||
body: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
send: function () {
|
||||
/* Сохранить */
|
||||
let vm = this;
|
||||
{{ editor.getValue('body', 'vm.page.body', type='tinymce') }}
|
||||
axios.post(
|
||||
'/api',
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": "page.add",
|
||||
"params": {
|
||||
"title": vm.page.title,
|
||||
"body": vm.page.body
|
||||
},
|
||||
"id": 1
|
||||
}
|
||||
).then(
|
||||
function(response) {
|
||||
if ('result' in response.data) {
|
||||
window.location.href = '/page/' + response.data['result'].id;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
{{ editor.tinymce('body') }}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
{% endblock %}
|
||||
83
myapp/ns_page/templates/user/page_edit.html
Normal file
83
myapp/ns_page/templates/user/page_edit.html
Normal file
@@ -0,0 +1,83 @@
|
||||
{% extends "user/skeleton.html" %}
|
||||
{% block content %}
|
||||
|
||||
<h3>
|
||||
<a class="btn btn-outline-secondary" :href="'/page/' + page.id"><i class="fa fa-chevron-left"></i></a>
|
||||
Редактирование страницы
|
||||
</h3>
|
||||
<hr />
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="title">Заголовок</label>
|
||||
<input class="form-control" id="title" name="title" type="text" v-model="page.title">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="control-label" for="body">Текст</label>
|
||||
<textarea class="form-control" cols="40" id="body" name="body" v-model="page.body" rows="8"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="row mt-3">
|
||||
<div class="col">
|
||||
<button type="button" class="btn btn-outline-success pull-right" v-on:click="send"><i class="fa fa-save-o"></i> Сохранить</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block breadcrumb %}
|
||||
<ol class="breadcrumb mt-3">
|
||||
<li class="breadcrumb-item"><a href="/"><i class="fa fa-home"></i></a></li>
|
||||
<li class="breadcrumb-item"><a href="/pages">Страницы</a></li>
|
||||
<li class="breadcrumb-item"><a href="/page/{{ pagedata['page'].id }}">{{ pagedata['page'].title }}</a></li>
|
||||
<li class="breadcrumb-item active">Редактирование страницы</li>
|
||||
</ol>
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
<script type="text/javascript" src="/static/tinymce/tinymce.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
page: {{ pagedata['page']|tojson|safe }}
|
||||
},
|
||||
methods: {
|
||||
send: function () {
|
||||
/* Сохранить */
|
||||
let vm = this;
|
||||
var value = CKEDITOR.instances["body"].getData();
|
||||
if (value != vm.page.body) {
|
||||
vm.page.body = value;
|
||||
}
|
||||
axios.post(
|
||||
'/api',
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": "page.update",
|
||||
"params": {
|
||||
"id": vm.page.id,
|
||||
"title": vm.page.title,
|
||||
"body": vm.page.body
|
||||
},
|
||||
"id": 1
|
||||
}
|
||||
).then(
|
||||
function(response) {
|
||||
if ('result' in response.data) {
|
||||
window.location.href = '/page/' + response.data['result'].id;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
CKEDITOR.replace( 'body', {
|
||||
customConfig: '/static/js/ckeditor-conf.js'
|
||||
} );
|
||||
}
|
||||
})
|
||||
</script>
|
||||
{% endblock %}
|
||||
141
myapp/ns_page/templates/user/pages.html
Normal file
141
myapp/ns_page/templates/user/pages.html
Normal file
@@ -0,0 +1,141 @@
|
||||
{% extends "user/skeleton.html" %}
|
||||
{% block content %}
|
||||
{% raw %}
|
||||
|
||||
<h3>
|
||||
<div class="float-right">
|
||||
<a class="btn btn-outline-success" href="/page/add"><i class="fa fa-plus"></i></a>
|
||||
</div>
|
||||
|
||||
Статьи
|
||||
</h3>
|
||||
<hr />
|
||||
|
||||
<pagination-component v-bind:pagination="pagination" v-bind:click-handler="getPages"></pagination-component>
|
||||
|
||||
<div class="row" v-if="firstAlpha">
|
||||
<div class="col py-2 text-center">
|
||||
от <span class="text-danger" v-html="firstAlpha"></span> до <span class="text-danger" v-html="lastAlpha"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" v-for="(page, pageIdx) in pages">
|
||||
<div class="col py-2" :class="{'bg-light': pageIdx % 2}">
|
||||
<a :href="'/page/' + page.id">{{ page.title }}</a>
|
||||
|
||||
<div class="row">
|
||||
<div class="col small text-muted">
|
||||
<span v-for="(tag, tagIdx) in page.tags">
|
||||
<i class="fa fa-tag"></i> <a class="text-monospace" :href="'/tag/' + tag.id">{{ tag.name }}</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col small text-muted">
|
||||
<i class="fa fa-user"></i> <a :href="'/user/' + page.user.id">{{ page.user.name }}</a>
|
||||
Создано: {{ page.created }}
|
||||
Обновлено: {{ page.updated }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<pagination-component v-bind:pagination="pagination" v-bind:click-handler="getPages"></pagination-component>
|
||||
|
||||
<backtotop-component></backtotop-component>
|
||||
|
||||
{% endraw %}
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
<script type="text/javascript" src="/static/components/backtotop.js"></script>
|
||||
<link rel="stylesheet" href="/static/components/backtotop.css"></link>
|
||||
<script type="text/javascript" src="/static/components/pagination.js"></script>
|
||||
|
||||
<script>
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
pages: [],
|
||||
pagination: {{ pagedata['pagination']|tojson|safe }},
|
||||
},
|
||||
methods: {
|
||||
getPages: function() {
|
||||
/* Получить список статей */
|
||||
let vm = this;
|
||||
axios.post(
|
||||
'/api',
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": "pages",
|
||||
"params": {
|
||||
"page": vm.pagination.page
|
||||
},
|
||||
"id": 1
|
||||
}
|
||||
).then(
|
||||
function(response) {
|
||||
if ('result' in response.data) {
|
||||
vm.pages = response.data['result'];
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
},
|
||||
created: function() {
|
||||
let vm = this;
|
||||
axios.post(
|
||||
'/api',
|
||||
[
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": "pages",
|
||||
"params": {
|
||||
"page": vm.pagination.page
|
||||
},
|
||||
"id": 1
|
||||
},
|
||||
{
|
||||
"jsonrpc": "2.0",
|
||||
"method": "pages.count",
|
||||
"params": {},
|
||||
"id": 1
|
||||
}
|
||||
]
|
||||
).then(
|
||||
function(response) {
|
||||
if ('result' in response.data[0]) {
|
||||
vm.pages = response.data[0]['result'];
|
||||
}
|
||||
if ('result' in response.data[1]) {
|
||||
vm.pagination.size = response.data[1]['result'];
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
computed: {
|
||||
firstAlpha: function() {
|
||||
/* Получить первый символ */
|
||||
let vm = this;
|
||||
let result = null;
|
||||
if (vm.pages.length>0) {
|
||||
result = vm.pages[0].title.charAt(0);
|
||||
}
|
||||
return result;
|
||||
},
|
||||
lastAlpha: function() {
|
||||
/* Получить последний символ */
|
||||
let vm = this;
|
||||
let result = null;
|
||||
if (vm.pages.length>0) {
|
||||
let title = vm.pages[vm.pages.length-1].title;
|
||||
result = title.charAt(0);
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user