MrDoc/template/app_doc/manage/manage_image_group.html
2020-12-02 21:25:59 +08:00

128 lines
4.8 KiB
HTML

{% extends 'app_doc/user/user_base.html' %}
{% load static %}
{% load i18n %}
{% block title %}图片分组管理{% endblock %}
{% block content %}
<div class="layui-card">
<div class="layui-card-body">
<div class="layui-row" style="padding-left:15px;">
<span class="layui-breadcrumb" lay-separator=">">
<a href="{% url 'manage_image' %}">图片管理</a>
<a><cite>图片分组管理</cite></a>
</span>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-body">
<div class="layui-row">
<table class="layui-table" lay-skin="" lay-even>
<colgroup>
<col width="200">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>分组名称</th>
<th>图片数量</th>
<th>操作</th>
</tr>
</thead>
<tbody>
{% load project_filter %}
{% for group in groups %}
<tr>
<td>{{ group.group_name }}</td>
<td>{{ group.id | img_group_cnt }}</td>
<td>
<a href="javascript:void(0);" onclick="modifyGroup('{{group.id}}')" class="layui-btn layui-btn-xs layui-btn-normal">
<i class="layui-icon layui-icon-edit"></i>修改
</a>
<a href="javascript:void(0);" onclick="delGroup('{{group.id}}');" class="layui-btn layui-btn-xs layui-btn-warm">
<i class="layui-icon layui-icon-delete"></i>删除
</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% endblock %}
{% block custom_script %}
<script>
layui.use(['table','jquery','form','layer','element'], function() {
let table = layui.table;
let form = layui.form;
let $ = layui.jquery;
let layer = layui.layer;
let element = layui.element;
$.ajaxSetup({
data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
});
delGroup = function(group_id){
layer.open({
type:1,
title:'删除分组',
area:'300px;',
id:'delGroup',//配置ID
content:'<div style="margin-left:10px;">警告:操作将删除此图片分组,分组下所属图片将移动到【未分组】!</div>',
btn:['确定','取消'], //添加按钮
btnAlign:'c', //按钮居中
yes:function (index,layero) {
layer.load(1);
data = {
'types':2,
'group_id':group_id,
}
$.post("{% url 'manage_img_group' %}",data,function(r){
layer.closeAll('loading')
if(r.status){
//删除成功
window.location.reload();
//layer.close(index)
}else{
//删除失败,提示
console.log(r)
layer.msg(r.data)
}
})
},
});
};
modifyGroup = function(group_id){
layer.open({
type:1,
title:'修改分组',
area:'300px;',
id:'modifyGroup',//配置ID
content:'<div style="margin:10px;"><input class="layui-input" placeholder="输入图片分组的新名称" id="new-group-name"></input></div>',
btn:['确定','取消'], //添加按钮
btnAlign:'c', //按钮居中
yes:function (index,layero) {
layer.load(1);
data = {
'types':1,
'group_id':group_id,
'group_name':$("#new-group-name").val()
}
$.post("{% url 'manage_img_group' %}",data,function(r){
layer.closeAll('loading')
if(r.status){
//修改成功
window.location.reload();
//layer.close(index)
}else{
//修改失败,提示
// console.log(r)
layer.msg(r.data)
}
})
},
});
}
});
</script>
{% endblock %}