<?php
$title='站内通知';
include __DIR__ . '/head.php';
?>
<div class="p-4 md:p-6">
<?php if($_GET['my']=='add'){?>
    <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
        <div class="p-4 md:p-6 border-b border-gray-200">
            <h2 class="text-base md:text-lg font-semibold text-gray-800">添加通知消息</h2>
        </div>
        <div class="p-4 md:p-6">
            <form onsubmit="saveSetting(this,'add_message');return false;" class="space-y-6">
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 items-center">
                    <label class="text-xs md:text-sm font-medium text-gray-700">通知标题</label>
                    <div class="md:col-span-3">
                        <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm" name="title">
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 items-start">
                    <label class="text-xs md:text-sm font-medium text-gray-700">接收用户类别</label>
                    <div class="md:col-span-3">
                        <select class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm" name="type">
                            <option value="0">全部用户</option>
                            <option value="1">直属用户</option>
                        </select>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 items-start">
                    <label class="text-xs md:text-sm font-medium text-gray-700">通知内容</label>
                    <div class="md:col-span-3">
                        <textarea class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm" name="content" id="editor_msg" rows="5"></textarea>
                    </div>
                </div>
                <div class="pt-4 border-t border-gray-200">
                    <button type="submit" class="w-full md:w-auto px-6 py-2 bg-blue-600 hover:bg-blue-700 text-white font-medium rounded-lg transition text-sm">
                        添加
                    </button>
                </div>
            </form>
        </div>
    </div>
<?php }else if($_GET['my']=='edit'){
	$id=$_GET['id'];
	$row=$DB->getRow("select * from pre_message where id='$id' limit 1");
?>
    <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
        <div class="p-4 md:p-6 border-b border-gray-200">
            <h2 class="text-base md:text-lg font-semibold text-gray-800">修改通知消息</h2>
        </div>
        <div class="p-4 md:p-6">
            <form onsubmit="saveSetting(this,'edit_message');return false;" class="space-y-6">
                <input type="hidden" name="ids" value="<?php echo $id?>">
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 items-center">
                    <label class="text-xs md:text-sm font-medium text-gray-700">通知标题</label>
                    <div class="md:col-span-3">
                        <input type="text" class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm" name="title" value="<?php echo $row['title']?>">
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 items-start">
                    <label class="text-xs md:text-sm font-medium text-gray-700">接收用户类别</label>
                    <div class="md:col-span-3">
                        <select class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm" name="type" default="<?php echo $row['type']?>">
                            <option value="0">全部用户</option>
                            <option value="1">直属用户</option>
                        </select>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-4 gap-4 items-start">
                    <label class="text-xs md:text-sm font-medium text-gray-700">通知内容</label>
                    <div class="md:col-span-3">
                        <textarea class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm" name="content" id="editor_msg" rows="5"><?php echo $row['content']?></textarea>
                    </div>
                </div>
                <div class="pt-4 border-t border-gray-200">
                    <button type="submit" class="w-full md:w-auto px-6 py-2 bg-blue-600 hover:bg-blue-700 text-white font-medium rounded-lg transition text-sm">
                        修改
                    </button>
                </div>
            </form>
        </div>
    </div>
<?php }else{?>
    <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
        <div class="p-4 md:p-6 border-b border-gray-200">
            <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-3">
                <h2 class="text-base md:text-lg font-semibold text-gray-800">通知列表</h2>
                <a href="?my=add" class="w-full md:w-auto px-4 py-2 bg-green-600 hover:bg-green-700 text-white font-medium rounded-lg transition text-sm">
                    <i class="fas fa-plus mr-2"></i>添加
                </a>
            </div>
        </div>
        <div class="p-3 md:p-6">
            <div class="overflow-x-auto">
                <table class="w-full min-w-[600px]">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-3 py-2 text-left text-xs font-semibold text-gray-700 whitespace-nowrap">ID</th>
                            <th class="px-3 py-2 text-left text-xs font-semibold text-gray-700 whitespace-nowrap">通知类型</th>
                            <th class="px-3 py-2 text-left text-xs font-semibold text-gray-700 whitespace-nowrap">通知标题</th>
                            <th class="px-3 py-2 text-left text-xs font-semibold text-gray-700 whitespace-nowrap">发布时间</th>
                            <th class="px-3 py-2 text-left text-xs font-semibold text-gray-700 whitespace-nowrap">状态</th>
                            <th class="px-3 py-2 text-left text-xs font-semibold text-gray-700 whitespace-nowrap">操作</th>
                        </tr>
                    </thead>
                    <tbody id="list" class="divide-y divide-gray-200">
                    </tbody>
                </table>
            </div>
            <div class="mt-4 flex items-center justify-between">
                <div class="text-sm text-gray-600">
                    共有 <span id="total" class="font-semibold text-gray-800">0</span> 条
                </div>
                <div class="flex items-center gap-2">
                    <span class="text-sm text-gray-600">现第</span>
                    <select class="px-3 py-2 border border-gray-300 rounded-lg text-sm" id="page">
                        <option value="1">1</option>
                    </select>
                    <span class="text-sm text-gray-600">页</span>
                </div>
            </div>
        </div>
    </div>
<?php }?>
</div>

<?php include 'foot.php'; ?>
<script src="../assets/kindeditor/kindeditor-all-min.js"></script>
<script src="../assets/kindeditor/zh-CN.js"></script>

<script type="text/javascript">
	var pagesize = 30;
	var page = 1;
	$(document).ready(function() {
		get_list(page,pagesize);
		$('#page').change(function(){
			page = $('#page').val();
			get_list(page,pagesize);
		});
	});
	function get_list(page,pagesize){
	var kw = $('input[name="kw"]').val();
	showLoading();
	$.ajax({
			type : 'POST',
			data : {pagesize:pagesize,page:page,kw:kw},
			url : 'ajax.php?act=get_message',
			dataType : 'json',
			success : function(data) {
				hideLoading();
				adddata(data.data);
				$('#total').html(data.total);
				if(data.end >= 1){
					$('#page').html('');
					var end = data.end;
					var page = data.page;
					var start=page-10>1?page-10:1;
					var end=page+10<end?page+10:end;
					for(var i = start; i <= page; i++){
					    $('#page').append('<option value="'+ i +'">' + i + '</option>');
					}
					for(var i = page+1; i <= end; i++){
					    $('#page').append('<option value="'+ i +'">' + i + '</option>');
					}
					$('#page').val(page);
				}
			},
			error:function(data){
				hideLoading();
				showToast('服务器错误', 'error');
				return false;
			}
		});
	}
	function adddata(data){
		$("#list").empty();
		$.each(data, function(i,v){
			var tmp = '<tr class="hover:bg-gray-50">\
		            <td class="px-3 py-2 text-sm text-gray-500 whitespace-nowrap">'+v.id+'</td>\
		            <td class="px-3 py-2 text-sm whitespace-nowrap">'+_type(v.type)+'</td>\
		            <td class="px-3 py-2 text-sm font-medium text-gray-800 whitespace-nowrap">'+v.title+'</td>\
		            <td class="px-3 py-2 text-sm text-gray-600 whitespace-nowrap">'+v.addtime+'</td>\
		            <td class="px-3 py-2 whitespace-nowrap">'+_active(v.active,v.id)+'</td>\
		            <td class="px-3 py-2 whitespace-nowrap">\
		                <div class="flex items-center gap-2">\
		                <a class="px-3 py-1 text-xs bg-gray-700 hover:bg-gray-800 text-white rounded transition" href="?my=edit&id='+v.id+'">编辑</a>\
		                <span class="px-3 py-1 bg-red-600 hover:bg-red-700 text-white text-xs rounded transition cursor-pointer" onclick="del('+v.id+')">删除</span>\
		                </div>\
		            </td>\
		        </tr>';
		    $("#list").append(tmp);
		});
	}
	function _active(type,id){
		if(type == 1){
			return '<span class="px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800 cursor-pointer hover:bg-green-200 transition" onclick="__active(0,'+id+')">显示中</span>';
		}else{
			return '<span class="px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800 cursor-pointer hover:bg-red-200 transition" onclick="__active(1,'+id+')">已隐藏</span>';
		}
	}
	function __active(zt,id){
		showLoading();
		$.ajax({
			type : 'POST',
			url : 'ajax.php?act=active_message',
			data : {zt:zt,id:id},
			dataType : 'json',
			success : function(data) {
				hideLoading();
				showToast(data.msg, 'success');
				get_list(page,pagesize);
			},
			error:function(data){
				hideLoading();
				showToast('服务器错误', 'error');
				return false;
			}
		});
	}
	function _type(type){
		if(type == 1){
			return '<span class="text-red-600 font-medium">直属用户</span>';
		}else{
			return '全部用户';
		}
	}
	function del(id){
		showLoading();
		$.ajax({
			type : 'POST',
			url : 'ajax.php?act=del_message',
			data : {id:id},
			dataType : 'json',
			success : function(data) {
				hideLoading();
				showToast(data.msg, 'success');
				get_list(page,pagesize);
			},
			error:function(data){
				hideLoading();
				showToast('服务器错误', 'error');
				return false;
			}
		});
	}
	function saveSetting(obj,type){
		if (window.editor && typeof window.editor.sync === 'function') {
			window.editor.sync(obj);
		}
		showLoading();
		$.ajax({
			type : 'POST',
			url : 'ajax.php?act='+type,
			data : $(obj).serialize(),
			dataType : 'json',
			success : function(data) {
				hideLoading();
				showToast(data.msg, data.code == 1 ? 'success' : 'error');
				if(data.code == 1) {
					setTimeout(function() {
						window.location.href = 'message.php';
					}, 1000);
				}
			},
			error:function(data){
				hideLoading();
				showToast('服务器错误', 'error');
				return false;
			}
		});
	}
	var items = $("select[default]");
	for (i = 0; i < items.length; i++) {
		$(items[i]).val($(items[i]).attr("default")||0);
	}
	function isMobileEditor() {
		return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || (window.innerWidth > 0 && window.innerWidth < 768);
	}
	if (!isMobileEditor()) {
		KindEditor.ready(function(K) {
			window.editor = K.create('#editor_msg', {
				resizeType : 1,
				allowUpload : false,
				allowPreviewEmoticons : false,
				uploadJson : './ajax.php?act=article_upload',
				items : [
					'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
					'removeformat','formatblock','hr', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
					'insertunorderedlist', '|', 'image', 'link','unlink', 'code', '|','fullscreen','source','preview']
			});
		});
	} else {
		window.editor = null;
	}
</script>
