316 lines
15 KiB
HTML
316 lines
15 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|||
|
|
<title>供应商列表</title>
|
|||
|
|
|
|||
|
|
<link href="static/green/css/base.css" rel="stylesheet">
|
|||
|
|
<link rel="stylesheet" href="../custom/green/uimaker/easyui.css">
|
|||
|
|
<link rel="stylesheet" type="text/css" href="../custom/green/uimaker/icon.css">
|
|||
|
|
<link rel="stylesheet" href="static/green/css/providers1.css">
|
|||
|
|
<style type="text/css">
|
|||
|
|
.messager-body{line-height:50px}.messager-window .messager-icon{margin-left:35px}.messager-window .messager-button{border-top:0;background:#fff}.jq-form{margin:10px;padding:0 9px;background:#f1f1f1;font-size:14px}.jq-form .jq-form-row{padding:0 165px;min-height:45px;line-height:45px}.jq-form .jq-form-row.jq-form-submit{height:80px;line-height:80px}.jq-form .jq-form-row.even{background:#fff}.jq-form .jq-form-row>label{float:left;margin-left:-165px;padding-left:30px;width:135px}.jq-form .jq-form-row .jq-form-control{float:left;width:100%}.jq-form .jq-form-row .jq-form-control .jq-form-input{width:100%;height:31px;padding:0 10px;box-sizing:border-box}.jq-form .jq-form-row .jq-form-control .jq-form-textarea{margin-top:10px;width:100%;height:110px;padding:5px;box-sizing:border-box}.jq-form .jq-form-row .jq-form-tip{float:right;margin-right:-165px;padding-left:20px;width:145px;color:#7f7f7f}.jq-form .jq-form-row .jq-form-tip .important{color:#df0000}.jq-form .jq-form-row.jq-form-time .textbox{width:auto!important;height:30px!important;line-height:30px!important}.jq-form .jq-form-row.jq-form-time .textbox-text{width:314px!important;height:30px!important;line-height:30px!important}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="container">
|
|||
|
|
<table id="dg" style="width:100%;height:529px" title="全体供应商列表" data-options="
|
|||
|
|
rownumbers:true,
|
|||
|
|
singleSelect:false,
|
|||
|
|
autoRowHeight:false,
|
|||
|
|
pagination:true,
|
|||
|
|
fitColumns:true,
|
|||
|
|
striped:true,
|
|||
|
|
checkOnSelect:true,
|
|||
|
|
selectOnCheck:true,
|
|||
|
|
collapsible:true,
|
|||
|
|
toolbar:'#tb',
|
|||
|
|
pageSize:10">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th field="ck" checkbox="true"></th>
|
|||
|
|
<th field="code" width="110">供应商编码</th>
|
|||
|
|
<th field="name" width="226">供应商名称</th>
|
|||
|
|
<th field="level" width="112">等级</th>
|
|||
|
|
<th field="provide" width="170">主供品类</th>
|
|||
|
|
<th field="full" width="130">资料是否完善</th>
|
|||
|
|
<th field="issubmit" width="136">调查表格是否提交</th>
|
|||
|
|
<th field="status" width="120">审核状态</th>
|
|||
|
|
<th field="note" width="105">备注</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
</table>
|
|||
|
|
<div id="tb" style="padding:0 30px;">
|
|||
|
|
<div class="conditions">
|
|||
|
|
<span class="con-span">供应商编码: </span><input class="easyui-textbox" type="text" name="code" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
<span class="con-span">供应商名称: </span><input class="easyui-textbox" type="text" name="name" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
<a href="#" class="easyui-linkbutton" iconCls="icon-search" data-options="selected:true">查询</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton" iconCls="icon-reload">重置</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton more" iconCls="icon-more">更多</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="conditions hide">
|
|||
|
|
<span class="con-span">合同名称: </span><input class="easyui-textbox" type="text" name="code" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
<span class="con-span">合同模板: </span><select class="easyui-combobox" name="language" style="height:35px;width:166px;"><option>合同模板1</option></select>
|
|||
|
|
<span class="con-span">供应商编码: </span><input class="easyui-textbox" type="text" name="code" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
<span class="con-span">供应商: </span><input class="easyui-textbox" type="text" name="code" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
</div>
|
|||
|
|
<div class="conditions hide">
|
|||
|
|
<span class="con-span">公司代码: </span><input class="easyui-textbox" type="text" name="code" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
<span class="con-span">公司名称: </span><select class="easyui-combobox" name="language" style="height:35px;width:166px;"><option>公司名称</option></select>
|
|||
|
|
<span class="con-span">发布时间: </span><input class="easyui-datetimebox" style="width:166px;height:35px;line-height:35px;">
|
|||
|
|
<span class="con-span">合同状态: </span><input class="easyui-textbox" type="text" name="code" style="width:166px;height:35px;line-height:35px;"></input>
|
|||
|
|
</div>
|
|||
|
|
<div class="opt-buttons">
|
|||
|
|
<a href="#" class="easyui-linkbutton add-row" data-options="selected:true">新增</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton delete-row">删除</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton">发布</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton">取消发布</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton">标记为执行完毕</a>
|
|||
|
|
<a href="#" class="easyui-linkbutton">导出</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div id="add" title="新增表单" style="width:718px;display:none;">
|
|||
|
|
<div class="jq-form">
|
|||
|
|
<div class="jq-form-row clearfix">
|
|||
|
|
<label>供应商编码：</label>
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<input class="jq-form-input" type="text" />
|
|||
|
|
</div>
|
|||
|
|
<span class="jq-form-tip">
|
|||
|
|
<span class="important"> * </span>请严格填写
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jq-form-row clearfix even">
|
|||
|
|
<label>供应商名称：</label>
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<input class="jq-form-input" type="text" />
|
|||
|
|
</div>
|
|||
|
|
<span class="jq-form-tip">
|
|||
|
|
<span class="important"> * </span>请严格填写
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jq-form-row clearfix">
|
|||
|
|
<label>合同模板：</label>
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<select class="jq-form-input">
|
|||
|
|
<option value="模板1">模板1</option>
|
|||
|
|
<option value="模板2">模板2</option>
|
|||
|
|
<option value="模板3">模板3</option>
|
|||
|
|
<option value="模板4">模板4</option>
|
|||
|
|
<option value="模板5">模板5</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
<span class="jq-form-tip">
|
|||
|
|
<span class="important"> * </span>请严格填写
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jq-form-row jq-form-time clearfix even">
|
|||
|
|
<label>发布时间：</label>
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<input id="time" class="jq-form-input" type="text" />
|
|||
|
|
</div>
|
|||
|
|
<span class="jq-form-tip">
|
|||
|
|
<span class="important"> * </span>请严格填写
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jq-form-row clearfix">
|
|||
|
|
<label>合同附件：</label>
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<input type="file">
|
|||
|
|
</div>
|
|||
|
|
<span class="jq-form-tip">
|
|||
|
|
<span class="important"> * </span>请严格填写
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jq-form-row clearfix even">
|
|||
|
|
<label>合同描述：</label>
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<textarea class="jq-form-textarea" type="text"></textarea>
|
|||
|
|
</div>
|
|||
|
|
<span class="jq-form-tip">
|
|||
|
|
<span class="important"> * </span>请严格填写
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jq-form-row clearfix jq-form-submit">
|
|||
|
|
<div class="jq-form-control">
|
|||
|
|
<a href="#" onclick="$('#add').dialog('close')" class="easyui-linkbutton" data-options="selected:true">确定</a>
|
|||
|
|
<a href="#" onclick="$('#add').dialog('close')" class="easyui-linkbutton">关闭</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<script type="text/javascript" src="../custom/green/jquery.min.js"></script>
|
|||
|
|
<script type="text/javascript" src="../custom/green/jquery.easyui.min.js"></script>
|
|||
|
|
<script type="text/javascript" src="../custom/green/easyui-lang-zh_CN.js"></script>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
(function($){
|
|||
|
|
function pagerFilter(data){
|
|||
|
|
if ($.isArray(data)){ // is array
|
|||
|
|
data = {
|
|||
|
|
total: data.length,
|
|||
|
|
rows: data
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
var target = this;
|
|||
|
|
var dg = $(target);
|
|||
|
|
var state = dg.data('datagrid');
|
|||
|
|
var opts = dg.datagrid('options');
|
|||
|
|
if (!state.allRows){
|
|||
|
|
state.allRows = (data.rows);
|
|||
|
|
}
|
|||
|
|
if (!opts.remoteSort && opts.sortName){
|
|||
|
|
var names = opts.sortName.split(',');
|
|||
|
|
var orders = opts.sortOrder.split(',');
|
|||
|
|
state.allRows.sort(function(r1,r2){
|
|||
|
|
var r = 0;
|
|||
|
|
for(var i=0; i<names.length; i++){
|
|||
|
|
var sn = names[i];
|
|||
|
|
var so = orders[i];
|
|||
|
|
var col = $(target).datagrid('getColumnOption', sn);
|
|||
|
|
var sortFunc = col.sorter || function(a,b){
|
|||
|
|
return a==b ? 0 : (a>b?1:-1);
|
|||
|
|
};
|
|||
|
|
r = sortFunc(r1[sn], r2[sn]) * (so=='asc'?1:-1);
|
|||
|
|
if (r != 0){
|
|||
|
|
return r;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return r;
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
|
|||
|
|
var end = start + parseInt(opts.pageSize);
|
|||
|
|
data.rows = state.allRows.slice(start, end);
|
|||
|
|
return data;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var loadDataMethod = $.fn.datagrid.methods.loadData;
|
|||
|
|
var deleteRowMethod = $.fn.datagrid.methods.deleteRow;
|
|||
|
|
$.extend($.fn.datagrid.methods, {
|
|||
|
|
clientPaging: function(jq){
|
|||
|
|
return jq.each(function(){
|
|||
|
|
var dg = $(this);
|
|||
|
|
var state = dg.data('datagrid');
|
|||
|
|
var opts = state.options;
|
|||
|
|
opts.loadFilter = pagerFilter;
|
|||
|
|
var onBeforeLoad = opts.onBeforeLoad;
|
|||
|
|
opts.onBeforeLoad = function(param){
|
|||
|
|
state.allRows = null;
|
|||
|
|
return onBeforeLoad.call(this, param);
|
|||
|
|
}
|
|||
|
|
var pager = dg.datagrid('getPager');
|
|||
|
|
pager.pagination({
|
|||
|
|
onSelectPage:function(pageNum, pageSize){
|
|||
|
|
opts.pageNumber = pageNum;
|
|||
|
|
opts.pageSize = pageSize;
|
|||
|
|
pager.pagination('refresh',{
|
|||
|
|
pageNumber:pageNum,
|
|||
|
|
pageSize:pageSize
|
|||
|
|
});
|
|||
|
|
dg.datagrid('loadData',state.allRows);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
$(this).datagrid('loadData', state.data);
|
|||
|
|
if (opts.url){
|
|||
|
|
$(this).datagrid('reload');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
loadData: function(jq, data){
|
|||
|
|
jq.each(function(){
|
|||
|
|
$(this).data('datagrid').allRows = null;
|
|||
|
|
});
|
|||
|
|
return loadDataMethod.call($.fn.datagrid.methods, jq, data);
|
|||
|
|
},
|
|||
|
|
deleteRow: function(jq, index){
|
|||
|
|
return jq.each(function(){
|
|||
|
|
var row = $(this).datagrid('getRows')[index];
|
|||
|
|
deleteRowMethod.call($.fn.datagrid.methods, $(this), index);
|
|||
|
|
var state = $(this).data('datagrid');
|
|||
|
|
if (state.options.loadFilter == pagerFilter){
|
|||
|
|
for(var i=0; i<state.allRows.length; i++){
|
|||
|
|
if (state.allRows[i] == row){
|
|||
|
|
state.allRows.splice(i,1);
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
$(this).datagrid('loadData', state.allRows);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
getAllRows: function(jq){
|
|||
|
|
return jq.data('datagrid').allRows;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})(jQuery);
|
|||
|
|
|
|||
|
|
function getData(){
|
|||
|
|
var rows = [];
|
|||
|
|
for(var i=1; i<=80; i++){
|
|||
|
|
rows.push({
|
|||
|
|
code: '10695',
|
|||
|
|
name: '南京天泽星网股份有限公司',
|
|||
|
|
level: '正式',
|
|||
|
|
provide: '光纤通信设备配件',
|
|||
|
|
full: '√',
|
|||
|
|
issubmit: '√',
|
|||
|
|
status:'已审核',
|
|||
|
|
note: '-'
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
return rows;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
$('.add-row').on('click', function() {
|
|||
|
|
$('#add').dialog({
|
|||
|
|
cache: false,
|
|||
|
|
modal: true
|
|||
|
|
});
|
|||
|
|
$('#time').datetimebox({
|
|||
|
|
value: '3/4/2010 2:3',
|
|||
|
|
required: true,
|
|||
|
|
showSeconds: false
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
$('.delete-row').on('click', function() {
|
|||
|
|
$.messager.confirm({
|
|||
|
|
title: '提示信息',
|
|||
|
|
ok: '确定',
|
|||
|
|
icon: 'error',
|
|||
|
|
cancel: '取消',
|
|||
|
|
msg: '你确定要删除选中记录？',
|
|||
|
|
fn: function(r) {
|
|||
|
|
|
|||
|
|
if(r) {
|
|||
|
|
console.log('YES');
|
|||
|
|
} else {
|
|||
|
|
console.log('NO');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
$('.messager-window').find('.l-btn-small').eq(0).addClass('l-btn-selected');
|
|||
|
|
$('.messager-window').find('.messager-icon').removeClass('messager-question').addClass('messager-error');
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
$(function(){
|
|||
|
|
$('#dg').datagrid({data:getData()}).datagrid('clientPaging');
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
$(".more").click(function(){
|
|||
|
|
$(this).closest(".conditions").siblings().toggleClass("hide");
|
|||
|
|
});
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|