亮点:
- 出入口公司适用,内容是英文的,当然可以改成中文。
- 原创虚拟数码技术来控制页面的按钮功能。简单易用。可以应用其他领域。
- 全MySql PDO运作。
- 分页及前端可采用最新EasyUI。
- 本页任何资料快速查询,不作连接远程服务器。
- 适用萍果系统(Mac)和Windows 7/8。
适用者须懂得基本开发Php+Mysql+EasyUI步骤。网上参考资料多,不在本文内。(如有难疑,可向笔者沟通)
首页面
除了取消以外,按其他任何一个按钮都出现popup,用户必须输入其姓名及密码才可以使用该功能。
页面上有4个功能:新增(1),编辑(2),删除(4),保存(8)。例如使用者A可以使用新增和
保存而没有删除和编辑,他的使用权数是1+8=9;使用者B可以使用新增,编辑,删除和保存,他的
使用权数是1+2+4+8=15。可见储存逻辑简明维护容易。结果资料库(t_db.member.sql)显示如下:
当然可以用后台角色等来处理,但那有这样清晰简单,适用于简单页面功能分配。测试可输usera 或userb的密码。
按所需功能纽再输入用户姓名及密码(usera, 123)
以下是按下了“新增“功能纽,输入了正确用户姓名及密码后出现新增一行,就可以填写产品资料。填好后按保存纽便完成。 Usera功能使用权含新增和保存(1+8)!如果没有该功能权是不能启动的。
快速搜索:任何文字资料都可以查询。
有关上术运作功能,请参考http://jeasyui.com/。
测试和使用环境:
OS X Yosemite, mamp pro
Win7/8 xampp 1.8.2, phpmyadmin 4.05
解压后把该目录 (nproducts)放到htdocs内或其他相对应目录里,安装资料库后就可在浏览器运行。注意使用这两系统的启动URL不同。( http://localhost/nproducts/ 和 http://localhost:8888/nproducts/ ), 看你的系统设置而已。
每测试一个用户后,必须清除浏览记录及刷新该网页才进行。如果安装了迅雷的系统,要注意迅雷自动为你的浏览器添加了代码,而不能正常运作。用QQ, EE 或搜狗浏览器比较安全。
以下是主要代码:
Index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="keywords" content="jquery,ui,easy,easyui,web">
<meta name="description" content="easyui help you build your web page easily!">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
<title>出入口公司产品浏览和查询</title>
<link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="themes/icon.css">
<link rel="stylesheet" type="text/css" href="demo.css">
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.easyui.min.js"></script>
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.edatagrid.js"></script>
<script type="text/javascript" src="permits_in_array.js"></script>
</head>
<body>
<table id="dg" title="出入口公司产品" style="width:1060px;height:425px; font-size:16px"
toolbar="#toolbar" pagination="true" idField="id"
rownumbers="true" fitColumns="true" singleSelect="true">
<thead>
<tr>
<th field="id" width:120px hidden="yes">
<span style="font-weight: 400">ID</th>
<th field="category" width:120px editor="text" align="center">
<span style="font-weight: 400">Category</th>
<th field="picture" width:120px hidden="yes">
<th field="product_code" width:120px editor="{type:‘validatebox‘,options:{required:true}}" align="center">
<span style="font-weight: 400">Product <br /> Code</span></th>
<th field="product_name" width:95px editor="text">
<span style="font-weight: 400">Product Name</span></th>
<th field="material" width:65px editor="text">
<span style="font-weight: 400">Material</span></th>
<th field="product_size" width:60px editor="text">
<span style="font-weight: 400">Product Size</span></th>
<th field="moq" width:150px align="center" editor="numberbox">
<span style="font-weight: 400">MOQ (pcs)</span></th>
<th field="product_price" width:70px align="center" editor="{type:‘numberbox‘,options:{precision:2}}">
<span style="font-weight: 400">Price (RMB)</span></th>
<th field="fob" width:60px align="center" editor="{type:‘numberbox‘,options:{precision:2}}">
<span style="font-weight: 400">FOB (USD)</span></th>
<th field="certification" width:70px editor="text">
<span style="font-weight: 400">Certification</span></th>
<th field="logo_price" width:95px align="right" editor="{type:‘numberbox‘,options:{precision:2}}">
<span style="font-weight: 400">Logo<br />Price</span></th>
<th field="delivery_time" width:70px align="center" editor="numberbox">
<span style="font-weight: 400">Delivery <br />
Time</span></th>
<th field="setup_fee" width:70px align="right" editor="{type:‘numberbox‘,options:{precision:2}}">
<span style="font-weight: 400">Set-Up <br />
Charge</span></th>
<th field="sample_price" width:80px align="right" editor="{type:‘numberbox‘,options:{precision:2}}">
<span style="font-weight: 400">Sample <br />Fee</span></th>
<th field="sample_time" width:80px align="center" editor="numberbox">
<span style="font-weight: 400">Sample <br />Time</span></th>
<th field="shipping_fee" width:70px align="center" editor="{type:‘numberbox‘,options:{precision:2}}">
<span style="font-weight: 400">Shipping <br />Fee</span></th>
<th field="export_document" width:120px hidden="yes">
<th field="qty_ctn" width:70px align="center" editor="text">
<span style="font-weight: 400">QTY/CTN</span></th>
<th field="ctn_size" width:70px align="center" editor="text">
<span style="font-weight: 400">CTN Size</span></th>
<th field="gw" width:50px editor="numberbox">
<span style="font-weight: 400">GW</span></th>
<th field="nw" width:50px editor="numberbox">
<span style="font-weight: 400">NW</span></th>
<th field="package" width:150px editor="text">
<span style="font-weight: 400">Package</span></th>
<th field="description" fixed:true width:75px editor="text">
<span style="font-weight: 400">Product Description</span></th>
<th field="qverall_bulk" width:50px align="center" editor="numberbox">
<span style="font-weight: 400">Overall Bulk<br />CBM</span></th>
<th field="ton" width:120px hidden="yes">
<th field="manufacturer" width:100px editor="text">
<span style="font-weight: 400">Manufacturer</span></th>
<th field="remark" width:170px editor="text">
<span style="font-weight: 400">Remark</span></th>
<th field="sales" width:75px align="center" editor="text">
<span style="font-weight: 400">Sales</span></th>
<th field="time" width:65px align="center">
<span style="font-weight: 400">Date</span></th>
</tr>
</thead>
</table>
<div id="toolbar">
<div>
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="passWord(add_function)">新增</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="passWord(edit_function)">编辑</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="passWord(destroy_function)">删除</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="passWord(save_function)">保存</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-undo" plain="true" onclick="javascript:$(‘#dg‘).edatagrid(‘cancelRow‘)">取消</a>
</div>
<div id=‘tb‘ style=‘padding:5px 8px;‘>
本页快速搜索: <INPUT id=‘ss‘ class=‘easyui-searchbox‘ searcher="doSearch" style=‘width:250px‘
data-options="prompt:‘请输入查询内容.‘" />
<a href="#" class="easyui-linkbutton" plain="true" onClick="reset()">重置</a>
</div>
</div>
<div id="dlg" class="easyui-dialog" style="width:400px;height:200px;padding:10px 20px"
closed="true" buttons="#dlg-buttons">
<div class="ftitle">用户登录资料</div>
<form id="fm" method="post" novalidate>
<table width="309" border="0" align="center" cellpadding="2" cellspacing="5">
<div class="fitem">
<label>用户姓名:</label>
<input name="username" class="easyui-validatebox" required>
</div>
<div class="fitem">
<label>密 码:</label>
<input type="password" name="password" class="easyui-validatebox" required>
</div>
</table>
</form>
</div>
<div id="dlg-buttons">
<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="login()">登入</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$(‘#dlg‘).dialog(‘close‘)">取消</a>
</div>
<script type="text/javascript">
var add_function = 1;
var edit_function = 2;
var destroy_function = 4;
var save_function = 8;
var url;
var log_in = 0;
var permit = 0;
var request = 0;
function passWord(f){
request = f;
if(log_in){
if (permits_in_array(f, permit))
{ sim_digital(f);
}else {
$.messager.show({
title: ‘使用权错误‘,
msg: "该功能你没有使用权!"
});
}
}else{
$(‘#dlg‘).dialog(‘open‘).dialog(‘setTitle‘,‘功能使用权!‘);
$(‘#fm‘).form(‘clear‘);
url = ‘login.php‘;
}
}
function login(){
$(‘#fm‘).form(‘submit‘,{
url: url,
onSubmit: function(){
return $(this).form(‘validate‘);
},
success: function(result){
var result = eval(‘(‘+result+‘)‘);
if (result.success){
$(‘#dlg‘).dialog(‘close‘); // close the dialog
log_in = result.login;
permit=result.msg;
if (permits_in_array(request, Number(result.msg))) {
sim_digital(request);
}else{
$.messager.show({
title: ‘登录错误‘,
msg: "密码错误或没有该使用权!"
});
}
} else {
$.messager.show({
title: ‘登录错误‘,
msg: "密码错误或没有该使用权"
});
}
}
})
}
function sim_digital(f) {
switch(f) {
case add_function: $(‘#dg‘).edatagrid(‘addRow‘);
break;
case edit_function: $.messager.show({
title: ‘编辑资料‘,
msg: ‘滑鼠选该行及按一下进行编辑所需资料。‘
});
break;
case destroy_function: $(‘#dg‘).edatagrid(‘destroyRow‘);
break;
case save_function: $(‘#dg‘).edatagrid(‘saveRow‘);
break;
}
}
function reset(){
$(‘#dg‘).datagrid(‘reload‘);
$(‘#ss‘).searchbox(‘reset‘);
}
function doSearch(q){
var rows = [];
var data = $(‘#dg‘).datagrid(‘getRows‘);
$.map(data, function(row){
for(var p in row){
var v = row[p];
var regExp = new RegExp(q, ‘i‘); // i - makes the search case-insensitive.
if(regExp.test(String(v))) {
rows.push(row);
break;
}
}
});
$(‘#dg‘).datagrid(‘loadData‘, rows);
}
$(function(){
$(‘#dg‘).edatagrid({
url: ‘get_products.php‘,
saveUrl: ‘save_products.php‘,
updateUrl: ‘update_products.php‘,
destroyUrl: ‘destroy_products.php‘
});
});
</script>
<style type="text/css">
#fm{
margin:0;
padding:10px 30px;
}
.ftitle{
font-size:14px;
font-weight:bold;
color:#666;
padding:5px 0;
margin-bottom:10px;
border-bottom:1px solid #ccc;
}
.fitem{
margin-bottom:5px;
}
.fitem label{
display:inline-block;
width:80px;
}
</style>
</body>
</html>
Login.php
<?php
//插入连接数据库的相关信息
$dsn = "mysql:host=localhost;dbname=t_db";
try {
$db = new PDO($dsn, ‘root‘, ‘‘);
$db->exec("SET CHARACTER SET utf8");
//Array to store validation errors
$user_username = ($_POST[‘username‘]);
$user_password = ($_POST[‘password‘]);
//判断用户是否已经设置cookie,如果未设置$_COOKIE[‘user_id‘]时,执行以下代码
if(!isset($_COOKIE[‘mem_id‘])){
if(!empty($user_username)&&!empty($user_password)){
//MySql中的SHA()函数用于对字符串进行单向加密
//$query = "SELECT mem_id, username FROM member WHERE username = ‘$user_username‘ AND "."password = SHA(‘$user_password‘)";
//用用户名和密码进行查询
//若查到的记录正好为一条,则设置COOKIE,同时进行页面重定向
$sql="SELECT * FROM member WHERE username=‘".$user_username."‘";
$rs=$db->prepare($sql);
$rs->execute();
$result = $rs->fetch(PDO::FETCH_OBJ);
$dbPwd=$result->password;
$dbUsername=$result->username;
$dbMem_id=$result->mem_id;
$db_permit=$result->permit;
if($result){
if($rs->rowcount() > 0) {
if (password_verification($user_password,$dbPwd) & $user_username == $dbUsername)
{
setcookie(‘mem_id‘,$dbMem_id);
setcookie(‘username‘,$dbUsername);
echo json_encode(array(‘success‘=>true, ‘msg‘=>$db_permit, ‘login‘=>1));
exit();
}else{//若查到的记录不对,则设置错误信息
//Login failed
$errmsg_arr[] = ‘user name and password not found‘;
$errflag = true;
if($errflag) {
//$_SESSION[‘ERRMSG_ARR‘] = $errmsg_arr;
//session_write_close();
echo json_encode(array(‘msg‘=>‘Incorrect user name or password!‘));
exit();
}
}
}
}
}
// }else{//如果用户已经登录,则直接跳转到已经登录页面
//$home_url = ‘index.php‘;
//header(‘Location: ‘.$home_url);
//}
}
$db = null; // Disconnect
}
catch(PDOException $e) {
echo $e->getMessage();
}
function password_verification($a, $b){
if ($a==$b){
return true;}else{
return false;}
}
?>
Permit_in_Array.js
function in_array(needle, haystack){
if(typeof needle==‘string‘ || typeof needle ==‘number‘) {
for(var i in haystack) {
if(haystack[i]==needle) {
return true;
}
}
}
return false;
}
$assign1 = 1;
$assign2 = 2;
$assign3 = new Array(1, 2);
$assign4 = 4;
$assign5 = new Array(1, 4);
$assign6 = new Array(2, 4);
$assign7 = new Array(1, 2, 4);
$assign8 = 8;
$assign9 = new Array(1, 8);
$assign10 = new Array(2, 8);
$assign11 = new Array(1, 2, 8);
$assign12 = new Array(4, 8);
$assign13 = new Array(1, 4, 8);
$assign14 = new Array(2, 4, 8);
$assign15 = new Array(1, 2, 4, 8);
//request represents push functions as 1, 2, 4, 8; assign_array as the user has the assigned value for control of the push functions. Let say assigned value is 3, it means the user is able to click on function1 and function2; 5=>1 and 4;
function permits_in_array(request, assign_array){
switch(assign_array) {
case 1: assign=$assign1;
break;
case 2: assign=$assign2;
break;
case 3: assign=$assign3;
break;
case 4: assign=$assign4;
break;
case 5: assign=$assign5;
break;
case 6: assign=$assign6;
break;
case 7: assign=$assign7;
break;
case 8: assign=$assign8;
break;
case 9: assign=$assign9;
break;
case 10: assign=$assign10;
break;
case 11: assign=$assign11;
break;
case 12: assign=$assign12;
break;
case 13: assign=$assign13;
break;
case 14: assign=$assign14;
break;
case 15: assign=$assign15;
break;
default: break;
}
if (request == assign_array) {
switch(request) {
case 1: return(1);
break;
case 2: return(1);
break;
case 4: return(1);
break;
case 8: return(1);
break;
default: break;
}
}else{
// if (in_array(request, assign)) {
switch(request) {
case 1: if (in_array(request, assign)) return(1);
break;
case 2: if (in_array(request, assign)) return(1);
break;
case 4: if (in_array(request, assign)) return(1);
break;
case 8: if (in_array(request, assign)) return(1);
break;
default: $.messager.show({
title: ‘Permission Error‘,
msg: "You are not permitted to activate this function!"
});
}
/* }
else $.messager.show({
title: ‘Permission Error‘,
msg: "You are not permitted to activate this function!"
});*/
};
}
Get_products.php
<?php
$page = isset($_POST[‘page‘]) ? intval($_POST[‘page‘]) : 1;
$rows = isset($_POST[‘rows‘]) ? intval($_POST[‘rows‘]) : 10;
$category = isset($_POST[‘category‘]) ? mysql_real_escape_string($_POST[‘category‘]) : ‘‘;
$product_code = isset($_POST[‘product_code‘]) ? mysql_real_escape_string($_POST[‘product_code‘]) : ‘‘;
$product_name = isset($_POST[‘product_name‘]) ? mysql_real_escape_string($_POST[‘product_name‘]) : ‘‘;
$offset = ($page-1)*$rows;
$results = array();
$crud = array();
$dsn = "mysql:host=localhost;dbname=t_db";
try {
$db = new PDO($dsn, ‘root‘, ‘root‘);
$db->exec("SET CHARACTER SET utf8");
//$rs = $db->prepare("SELECT COUNT(*) FROM clients");
$where = "category like ‘$category%‘ and product_code like ‘$product_code%‘ and product_name like ‘$product_name%‘";
$rs = $db->prepare("SELECT COUNT(*) FROM products where " . $where);
$rs->execute();
$row = $rs->fetch();
$results["total"] = $row[0];
//$rs = $db->prepare("SELECT * from clients limit $offset,$rows");
$rs = $db->prepare("select * from products where " . $where . " limit $offset,$rows");
$rs->execute();
$rows=$rs->fetchAll(PDO::FETCH_ASSOC);
foreach($rows as $row){
array_push($crud, $row);
}
$results["rows"]=$crud;
echo json_encode($results);
$db = null; // Disconnect
}
catch(PDOException $e) {
echo $e->getMessage();
}
?>
文件名:nproducts.zip,文件大小:420.598K下载
- /
- /nproducts
- /nproducts/auth.php
- /nproducts/demo.css
- /nproducts/destroy_products.php
- /nproducts/get_products.php
- /nproducts/index.php
- /nproducts/jquery.easyui.min.js
- /nproducts/jquery.edatagrid.js
- /nproducts/jquery.min.js
- /nproducts/license.tx
- /nproducts
其他代码大同小异,不再贴上。请参考下载。
http://files.cnblogs.com/files/sam8881-Blogs/cproducts.zip
原创,如有转载,请注明出处!