339 lines
13 KiB
Plaintext
339 lines
13 KiB
Plaintext
|
<%= stylesheet_link_tag "member_select" %>
|
||
|
<%= stylesheet_link_tag "lib/checkbox-card" %>
|
||
|
<div class="mini-layout-body span10">
|
||
|
<div class="tab-content">
|
||
|
<div class="tab-pane fade in active" id="subscribers_block">
|
||
|
<div class="tab-pane-head">
|
||
|
<h4><%= t('e_paper.batch_delete_subscribers') %></h4>
|
||
|
</div>
|
||
|
<ul id="card-list-members" class="checkbox-card clearfix">
|
||
|
<fieldset style="background-color: white;border: 0.125em solid #666;font-family: cursive,serif;">
|
||
|
<%= form_tag admin_e_paper_subscribers_delete_subscribers_path , :id=>'members_form' do %>
|
||
|
<div id="members_field" style="display: none;margin-left: 1.5em;margin-left: 1.5em;"></div>
|
||
|
<p id="edit_member_hint" aligin="center" style="font-size: 1.5em;padding: 2em;text-align: center;"><%= t("e_paper.delete_subscribers_hint") %></p>
|
||
|
<input id="submit-type" name="type" type="hidden" value="">
|
||
|
<% end %>
|
||
|
</fieldset>
|
||
|
</ul>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<!-- footer -->
|
||
|
<div class="bottomnav clearfix">
|
||
|
<div class="action pull-right">
|
||
|
<div class="btn-group dropup">
|
||
|
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
|
||
|
<%= t("select") %>
|
||
|
<span class="caret"></span>
|
||
|
</a>
|
||
|
<ul class="dropdown-menu">
|
||
|
<li><a href="#" id="select_all"><i class="icon-ok"></i> <%= t("select_all") %></a></li>
|
||
|
<li><a href="#" id="deselect_all"><i class="icon-remove"></i> <%= t("de_select_all") %></a></li>
|
||
|
</ul>
|
||
|
</div>
|
||
|
<button class="btn btn-primary select_member_modal" href="#" type="button">
|
||
|
<i class="icons-plus"></i>
|
||
|
<%=t(:add)%>
|
||
|
</button>
|
||
|
<button class="btn" id="remove_subscribers" style="display: none;"><i class="icon-trash"></i> <%=t('site.edit_members.delete_from_choice') %></button>
|
||
|
<button class="btn btn-danger" id="remove_subscribers_forever" style="display: none;"><i class="icon-trash"></i> <%=t('e_paper.delete_subscribers') %></button>
|
||
|
<!-- <button class="btn" id="edit_members" style="display: none;"><i class="icon-trash"></i> <%=t('site.edit_members.edit_members') %></button> -->
|
||
|
</div>
|
||
|
</div>
|
||
|
<% if @thread %>
|
||
|
<div id="threadModal" class="modal hide fade in" tabindex="-1" role="dialog" aria-labelledby="threadModal" aria-hidden="false">
|
||
|
<div class="modal-dialog" role="document">
|
||
|
<div class="modal-content">
|
||
|
<div class="modal-header">
|
||
|
<h3 id="threadModal"><%=t("site.edit_members.#{@thread.key}")%></h3>
|
||
|
</div>
|
||
|
<div class="modal-body">
|
||
|
<%= @thread.status[:finish_percent] %> % finished
|
||
|
</div>
|
||
|
<div class="modal-footer">
|
||
|
<button class="btn" id="modal-close-btn" style="width: 4em;" data-dismiss="modal" aria-hidden="true"><%=t('close')%></button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<% end %>
|
||
|
<div id='select_member_modal'></div>
|
||
|
<script src="/assets/lib/jquery-ui-1.12.1/jquery-ui.min.js"></script>
|
||
|
<script type="text/javascript">
|
||
|
/* 修正bootstap.js和jquery-ui.js間的衝突,使tab按鈕能正常運作 */
|
||
|
var Button = function (element, options) {
|
||
|
this.$element = $(element)
|
||
|
this.options = $.extend({}, $.fn.button.defaults, options)
|
||
|
}
|
||
|
|
||
|
Button.prototype.setState = function (state) {
|
||
|
var d = 'disabled'
|
||
|
, $el = this.$element
|
||
|
, data = $el.data()
|
||
|
, val = $el.is('input') ? 'val' : 'html'
|
||
|
|
||
|
state = state + 'Text'
|
||
|
data.resetText || $el.data('resetText', $el[val]())
|
||
|
|
||
|
$el[val](data[state] || this.options[state])
|
||
|
|
||
|
// push to event loop to allow forms to submit
|
||
|
setTimeout(function () {
|
||
|
state == 'loadingText' ?
|
||
|
$el.addClass(d).attr(d, d) :
|
||
|
$el.removeClass(d).removeAttr(d)
|
||
|
}, 0)
|
||
|
}
|
||
|
|
||
|
Button.prototype.toggle = function () {
|
||
|
var $parent = this.$element.closest('[data-toggle="buttons-radio"]')
|
||
|
|
||
|
$parent && $parent
|
||
|
.find('.active')
|
||
|
.removeClass('active')
|
||
|
|
||
|
this.$element.toggleClass('active')
|
||
|
}
|
||
|
|
||
|
/* BUTTON PLUGIN DEFINITION
|
||
|
* ======================== */
|
||
|
|
||
|
var old = $.fn.button
|
||
|
|
||
|
$.fn.button = function (option) {
|
||
|
return this.each(function () {
|
||
|
var $this = $(this)
|
||
|
, data = $this.data('button')
|
||
|
, options = typeof option == 'object' && option
|
||
|
if (!data) $this.data('button', (data = new Button(this, options)))
|
||
|
if (option == 'toggle') data.toggle()
|
||
|
else if (option) data.setState(option)
|
||
|
})
|
||
|
}
|
||
|
/* 修正bootstap.js和jquery-ui.js間的衝突,使tab按鈕能正常運作 */
|
||
|
</script>
|
||
|
<link rel="stylesheet" href="/assets/lib/jquery-ui-1.12.1/jquery-ui.min.css">
|
||
|
<script type="text/javascript">
|
||
|
if( Array.prototype.delete == undefined ){
|
||
|
Array.prototype.delete = function(v){
|
||
|
var idx = this.indexOf(v);
|
||
|
if(idx != -1){
|
||
|
return this.splice(idx, 1)[0];
|
||
|
}else{
|
||
|
return null;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
function double_confirm_message(message){
|
||
|
if(window.confirm(message)){
|
||
|
if(window.confirm(message)){
|
||
|
return true;
|
||
|
}else{
|
||
|
return false;
|
||
|
};
|
||
|
}else{
|
||
|
return false;
|
||
|
};
|
||
|
};
|
||
|
$(document).ready(function(){
|
||
|
$(document).on('click','.modal-body .tab-content .check-item',function(){
|
||
|
if($(this).hasClass("active"))
|
||
|
$(this).removeClass("active");
|
||
|
else
|
||
|
$(this).addClass("active");
|
||
|
});
|
||
|
$(document).on('click',"#select_all",function(){
|
||
|
$('#members_field').find(".check-item").addClass("active");
|
||
|
$('#members_field').find(".check-item input[type=checkbox]").prop("checked","checked");
|
||
|
$(".bottomnav .dropup").removeClass("open");
|
||
|
if($('#members_field .filter-item').length != 0)
|
||
|
$('#remove_subscribers').css('display','inline-block');
|
||
|
return false;
|
||
|
});
|
||
|
$(document).on('click',"#deselect_all",function(){
|
||
|
$('#members_field').find(".check-item").removeClass("active");
|
||
|
$('#members_field').find(".check-item input[type=checkbox]").removeAttr("checked");
|
||
|
$(".bottomnav .dropup").removeClass("open");
|
||
|
$('#remove_subscribers').css('display','none');
|
||
|
return false;
|
||
|
});
|
||
|
$(document).on('click',".select_all_modal",function(){
|
||
|
$('#select_member_modal .tab-pane.active').find('.check-item:not(.hide)').addClass("active");
|
||
|
$('#select_member_modal .tab-pane.active').find('.check-item:not(.hide) input[type=checkbox]').prop("checked","checked");
|
||
|
$(".modal-body .dropup").removeClass("open");
|
||
|
return false;
|
||
|
});
|
||
|
$(document).on('click',".deselect_all_modal",function(){
|
||
|
$('#select_member_modal .tab-pane.active').find('.check-item:not(.hide)').removeClass("active");
|
||
|
$('#select_member_modal .tab-pane.active').find('.check-item:not(.hide) input[type=checkbox]').prop("checked","");
|
||
|
$(".modal-body .dropup").removeClass("open");
|
||
|
return false;
|
||
|
});
|
||
|
$(document).on('click',".select_member_modal",function () {
|
||
|
$.get("<%= admin_e_paper_subscribers_get_subscribers_modal_path %>").done(function(data){
|
||
|
$("#select_member_modal").html(data);
|
||
|
$("#member-filter").modal('show');
|
||
|
});
|
||
|
return false;
|
||
|
});
|
||
|
$('#remove_subscribers').click(function(){
|
||
|
var $delete_items = $('#members_field .check-item.active');
|
||
|
var delete_count = $delete_items.length;
|
||
|
for(var i = 0;i < delete_count;i++){
|
||
|
window.selected_subscriber_ids.delete($delete_items.eq(i).find('input').val());
|
||
|
$delete_items.eq(i).remove();
|
||
|
};
|
||
|
if($('#members_field .check-item').length == 0)
|
||
|
$('#edit_member_hint').css('display','block');
|
||
|
$(this).css('display','none');
|
||
|
if($('#members_field .check-item').length != 0){
|
||
|
$('#remove_subscribers_forever').css('display','inline-block');
|
||
|
$('#edit_members').css('display','inline-block');
|
||
|
}else{
|
||
|
$('#remove_subscribers_forever').css('display','none');
|
||
|
$('#edit_members').css('display','none');
|
||
|
};
|
||
|
});
|
||
|
$('#members_field').change(function(){
|
||
|
if($('#members_field .check-item').length != 0){
|
||
|
$('#remove_subscribers_forever').css('display','inline-block');
|
||
|
$('#edit_members').css('display','inline-block');
|
||
|
}else{
|
||
|
$('#remove_subscribers_forever').css('display','none');
|
||
|
$('#edit_members').css('display','none');
|
||
|
};
|
||
|
$('#members_field .check-item').off('click').on('click',function(){
|
||
|
$el = $(this).parent().parent();
|
||
|
if($el.hasClass("active")){
|
||
|
$el.removeClass('active');
|
||
|
if($('#members_field .check-item.active').length != 0)
|
||
|
$('#remove_subscribers').css('display','inline-block');
|
||
|
else
|
||
|
$('#remove_subscribers').css('display','none');
|
||
|
}else{
|
||
|
$el.addClass('active');
|
||
|
$('#remove_subscribers').css('display','inline-block');
|
||
|
}
|
||
|
return false;
|
||
|
});
|
||
|
$('#members_field .check-item').off('click').on('click',function(){
|
||
|
if($(this).hasClass("active"))
|
||
|
$(this).removeClass("active");
|
||
|
else
|
||
|
$(this).addClass("active");
|
||
|
if($('#members_field .check-item.active').length != 0)
|
||
|
$('#remove_subscribers').css('display','inline-block');
|
||
|
else
|
||
|
$('#remove_subscribers').css('display','none');
|
||
|
return false;
|
||
|
});
|
||
|
$('.fa-caret-down').off('click').on('click',function(){
|
||
|
if($(this).parent().hasClass('open'))
|
||
|
$(this).parent().removeClass("open");
|
||
|
else
|
||
|
$(this).parent().addClass("open");
|
||
|
})
|
||
|
$('#remove_subscribers_forever').off('click').on('click',function(){
|
||
|
var member_cards = '<ul id="card-list-managers" class="checkbox-card clearfix" style="clear: left;">'+$.map($('#members_field .check-item'),function(member_card,i){
|
||
|
return member_card.outerHTML;
|
||
|
}).join('')+'</ul>';
|
||
|
if(double_confirm_message('<%= t('e_paper.delete_subscribers_hint') %>')){
|
||
|
$("#members_form").before("<div id='dialog-confirm' title='"+"<%= t('site.edit_members.delete_hint1') %>'>"+
|
||
|
"<div style='clear:both;'></div><div><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 20px 0;'></span>"+
|
||
|
"<%= t('e_paper.delete_subscribers_hint2') %>"+member_cards+"</div>"+
|
||
|
"</div>");
|
||
|
$( "#dialog-confirm" ).dialog({
|
||
|
resizable: true,
|
||
|
minHeight: 100,
|
||
|
maxHeight: 400,
|
||
|
modal: true,
|
||
|
buttons: {
|
||
|
"<%= t('site.edit_members.confirm') %>": function(){$('#submit-type').val('remove_subscribers_forever');$('#members_form').submit();$( this ).dialog( "close" );},
|
||
|
"<%= t('site.edit_members.cancel') %>": function() {
|
||
|
$( this ).dialog( "close" );
|
||
|
$( this ).remove();
|
||
|
}
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
$('#edit_members').off('click').on('click',function(){
|
||
|
$('#submit-type').val('select_edit_members');
|
||
|
$('#members_form').submit();
|
||
|
});
|
||
|
})
|
||
|
function update_thread(){
|
||
|
$.post("<%=admin_threads_get_status_path%>",{"id": "<%=params[:thread_id]%>"}).done(function(data){
|
||
|
var finish_percent = data["finish_percent"];
|
||
|
var is_finish = (data["status"] == "finish" || data["status"] == "error");
|
||
|
if(finish_percent){
|
||
|
$("#threadModal .modal-body").text(finish_percent + " % finished")
|
||
|
}
|
||
|
if(!is_finish){
|
||
|
window.time_out_id = window.setTimeout(update_thread, 1000);
|
||
|
}else{
|
||
|
if(window.time_out_id)
|
||
|
window.clearTimeout(window.time_out_id);
|
||
|
window.setTimeout(function(){
|
||
|
$("#threadModal").modal("hide");
|
||
|
alert(data["status"]);
|
||
|
}, 3000);
|
||
|
return;
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
if($("#threadModal").length != 0){
|
||
|
$("#threadModal").modal("show");
|
||
|
window.time_out_id = window.setTimeout(update_thread, 1000);
|
||
|
}
|
||
|
$(document).on('click','.modal-backdrop',function(){
|
||
|
$('.modal').modal('hide');
|
||
|
})
|
||
|
})
|
||
|
</script>
|
||
|
<style type="text/css">
|
||
|
.checkbox-card li:focus-within span{
|
||
|
color: white;
|
||
|
}
|
||
|
.fa-caret-down:before {
|
||
|
content: "\f078";
|
||
|
}
|
||
|
.sub-items{
|
||
|
display: none;
|
||
|
}
|
||
|
.open .sub-items{
|
||
|
display: block;
|
||
|
margin: 0 0.5em;
|
||
|
}
|
||
|
.selected_role .selected_member:hover{
|
||
|
background-color: #cccccc;
|
||
|
}
|
||
|
.selected_role .selected_member{
|
||
|
width: 100%;
|
||
|
}
|
||
|
li.selected_role:hover{
|
||
|
background-color: #696969;
|
||
|
}
|
||
|
.selected:hover{
|
||
|
background-color: #0088cc;
|
||
|
}
|
||
|
.selected{
|
||
|
height: 40px;
|
||
|
}
|
||
|
#remove_subscribers{
|
||
|
background: black;
|
||
|
color: white;
|
||
|
}
|
||
|
#edit_members{
|
||
|
background: green;
|
||
|
color: white;
|
||
|
}
|
||
|
#members_field .checkbox-card li:hover label span.user-name {
|
||
|
color: black;
|
||
|
}
|
||
|
#members_field .checkbox-card li:hover > label > span.user-name {
|
||
|
color: white;
|
||
|
}
|
||
|
</style>
|