<%@ page language="java" pageEncoding="UTF-8"%>
<head>
<title>衡量指标回顾条形图</title>
<link rel="stylesheet" type="text/css" href="../js/extjs/resources/css/ext-all.css"/>
<script type="text/javascript" src="../js/extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../js/extjs/ext-all.js"></script>
<script type="text/javascript" src="../js/extjs/src/locale/ext-lang-zh_CN.js"></script>
</head>
<style>
.spanScore {display:block;text-align:center;}
.x-grid3-row td, .x-grid3-summary-row td{
padding-right: 0px;
padding-left: 0px;
padding-top: 0px;
padding-bottom: 0px;
}
.x-grid3-row {
border-right-width: 0px;
border-left-width: 0px;
border-top-width: 0px;
border-bottom-width: 0px;
}
.rowspan-grid .x-grid3-body .x-grid3-row {
border:none;
cursor:default;
width:100%;
}
.rowspan-grid .x-grid3-header .x-grid3-cell{
border-left: 2px solid #fff;
}
.rowspan-grid .x-grid3-body .x-grid3-row{
overflow: hidden;
border-right: 1px solid #ccc;
}
.rowspan-grid .x-grid3-body .x-grid3-cell {
border: 1px solid #ccc;
border-top:none;
border-right:none;
}
.rowspan-grid .x-grid3-body .x-grid3-cell-first {
border-left: 1px solid #fff;
}
.rowspan-grid .x-grid3-body .rowspan-unborder {
border-bottoRowspanView.js
.rowspan-grid .x-grid3-body .rowspan {
border-bottom: 1px solid #ccc;
}
</style>
<script type="text/javascript">
Ext.onReady(function(){
Ext.QuickTips.init();
var cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
{
header:"维度",
dataIndex:'wd'
},
{
header:'战略主题',
dataIndex:'topic'
},{
header:"战略目标",
dataIndex:'target'
},
{
header:'衡量指标',
dataIndex:'measure'
},
{
header:'行动方案',
dataIndex:'plan'
}
]);
//数据源定义
var store = new Ext.data.Store({
proxy : new Ext.data.HttpProxy({url : 'date.jsp'}),//查看地址,获取JSON地址信息
reader : new Ext.data.JsonReader({
totalProperty : 'totalProperty',//总页数
root : 'root'//数据
},[{name:'wd'},{name:'topic'},{name:'target'},{name:'measure'},{name:'plan'}]
)
});
/*
**合并单元格的函数,合并表格内所有连续的具有相同值的单元格。调用方法示例:
**store.on("load",function(){gridSpan(grid,"row","[FbillNumber],[FbillDate],[FAudit],[FAuditDate],[FSure],[FSureDate]","FbillNumber");});
**参数:grid-需要合并的表格,rowOrCol-合并行还是列,cols-需要合并的列(行合并的时候有效),sepCols以哪个列为分割(即此字段不合并的2行,其他字段也不许合并),默认为空
*/
function gridSpan(grid, rowOrCol, cols, sepCol){
var array1 = new Array();
var arraySep = new Array();
var count1 = 0;
var count2 = 0;
var index1 = 0;
var index2 = 0;
var aRow = undefined;
var preValue = undefined;
var firstSameCell = 0;
var allRecs = grid.getStore().getRange();
if(rowOrCol == "row"){
count1 = grid.getColumnModel().getColumnCount();
count2 = grid.getStore().getCount();
} else {
count1 = grid.getStore().getCount();
count2 = grid.getColumnModel().getColumnCount();
}
for(i = 0; i < count1; i++){
if(rowOrCol == "row"){
var curColName = grid.getColumnModel().getDataIndex(i);
var curCol = "[" + curColName + "]";
if(cols.indexOf(curCol) < 0)
continue;
}
preValue = undefined;
firstSameCell = 0;
array1[i] = new Array();
for(j = 0; j < count2; j++){
if(rowOrCol == "row"){
index1 = j;
index2 = i;
} else {
index1 = i;
index2 = j;
}
var colName = grid.getColumnModel().getDataIndex(index2);
if(sepCol && colName == sepCol)
arraySep[index1] = allRecs[index1].get(sepCol);
var seqOldValue = seqCurValue = "1";
if(sepCol && index1 > 0){
seqOldValue = arraySep[index1 - 1];
seqCurValue = arraySep[index1];
}
if(allRecs[index1].get(colName) == preValue && (colName == sepCol || seqOldValue == seqCurValue)){
// alert(colName + "======" + seqOldValue + "======" + seqCurValue);
allRecs[index1].set(colName, "");
array1[i].push(j);
if(j == count2 - 1){
var index = firstSameCell + Math.round((j + 1 - firstSameCell) / 2 - 1);
if(rowOrCol == "row"){
allRecs[index].set(colName, preValue);
} else {
allRecs[index1].set(grid.getColumnModel().getColumnId(index), preValue);
}
}
} else {
if(j != 0){
var index = firstSameCell + Math.round((j + 1 - firstSameCell) / 2 - 1);
if(rowOrCol == "row"){
allRecs[index].set(colName, preValue);
} else {
allRecs[index1].set(grid.getColumnModel().getColumnId(index), preValue);
}
}
firstSameCell = j;
preValue = allRecs[index1].get(colName);
allRecs[index1].set(colName, "");
if(j == count2 - 1){
allRecs[index1].set(colName, preValue);
}
}
}
}
grid.getStore().commitChanges();
//添加所有分隔线
var rCount = grid.getStore().getCount();
for(i = 0; i < rCount; i ++){
for(j = 0; j < grid.getColumnModel().getColumnCount(); j ++){
aRow = grid.getView().getCell(i,j);
if(i == 0){
aRow.style.borderTop = "none";
aRow.style.borderLeft = "1px solid #ccc";
}else if(i == rCount - 1){
aRow.style.borderTop = "1px solid #ccc";
aRow.style.borderLeft = "1px solid #ccc";
aRow.style.borderBottom = "1px solid #ccc";
}else{
aRow.style.borderTop = "1px solid #ccc";
aRow.style.borderLeft = "1px solid #ccc";
}
if(j == grid.getColumnModel().getColumnCount()-1)
aRow.style.borderRight = "1px solid #ccc";
if(i == rCount-1)
aRow.style.borderBottom = "1px solid #ccc";
}
}
//去除合并的单元格的分隔线
for(i = 0; i < array1.length; i++){
if(!Ext.isEmpty(array1[i])){
for(j = 0; j < array1[i].length; j++){
if(rowOrCol == "row"){
aRow = grid.getView().getCell(array1[i][j],i);
aRow.style.borderTop = "none";
} else {
aRow = grid.getView().getCell(i, array1[i][j]);
aRow.style.borderLeft = "none";
}
}
}
}
}
store.load();
var grid = new Ext.grid.GridPanel({
cm : cm,
store :store,
autoExpandColumn:'pipeInfoName',
border:false,
//stripeRows : true,//斑马线效果
loadMask:true,
height:450,
viewConfig: {forceFit:true},
enableColumnHide : false,
enableColumnMove : false,
enableColumnResize : false
});
store.on("load",function(){gridSpan(grid,"row","[wd],[topic],[target],[measure],[plan]");});
var view = new Ext.Viewport({
id:'view',
layout:'fit',
items:grid
});
});
</script>
{"root":[{"topic":"T1 增长战略","plan":" ","measure":"F1.1 实收金额(K)","target":"F1 实现有效益发展","wd":"财务维度"},{"topic"
:"T1 增长战略","plan":"K1 推进收益管理","measure":"F1.2 利润总额(K)","target":"F1 实现有效益发展","wd":"财务维度"},{"topic":"T1
增长战略","plan":" ","measure":"F2.1 创利额","target":"F2 持续提高单店营业额与利润","wd":"财务维度"},{"topic":"T1 增长战略","plan"
:"K2 减亏计划","measure":"F2.2 减亏额(K)","target":"F2 持续提高单店营业额与利润","wd":"财务维度"},{"topic":"T2 生产力战略","plan"
:" ","measure":"F3.1 存货周转天数","target":"F3 提高资源利用率","wd":"财务维度"},{"topic":"T2 生产力战略","plan":" ","measure"
:"F3.2 单位人工成本创利额(K)","target":"F3 提高资源利用率","wd":"财务维度"},{"topic":"T2 生产力战略","plan":" ","measure":"F4
.1 费用率","target":"F4 合理控制成本费用","wd":"财务维度"},{"topic":"T2 生产力战略","plan":" ","measure":"F4.2 创利率(K)","target"
:"F4 合理控制成本费用","wd":"财务维度"},{"topic":"T3 顾客和供应商","plan":"K3 实施顾客满意度提升计划","measure":"C1.1 顾客满意度(K)","target"
:"C1 成为目标顾客购物首选","wd":"客户维度"},{"topic":"T3 顾客和供应商","plan":"K4 实施供应商满意度提升计划","measure":" ","target":"C2
成为供应商良好的合作伙伴","wd":"客户维度"},{"topic":"T4 商品战略","plan":" ","measure":"P1.1 生鲜熟盘后毛利额(K)","target":"P1
提升品类管理能力","wd":"内部流程维度"},{"topic":"T4 商品战略","plan":" ","measure":"P1.2 自有品牌与专属商品毛利额(K)","target":"P1
提升品类管理能力","wd":"内部流程维度"},{"topic":"T4 商品战略","plan":" ","measure":"P1.3 产地直采毛利额(K)","target":"P1 提升品
类管理能力","wd":"内部流程维度"},{"topic":"T4 商品战略","plan":"K5 推进超市品种结构梳理,保证基础陈列效果(K)","measure":" ","target":"P1
提升品类管理能力","wd":"内部流程维度"},{"topic":"T4 商品战略","plan":"K6 夯实商品质量管理基础","measure":"P2.1 重大质量事故次数","target"
:"P2 提升商品质量","wd":"内部流程维度"},{"topic":"T4 商品战略","plan":" ","measure":"P2.2 门店超市商品质量审核得分(K)","target":"P2
提升商品质量","wd":"内部流程维度"},{"topic":"T5 营销战略","plan":" ","measure":"P3.1 (日均)促销收益","target":"P3 提升营销有效性"
,"wd":"内部流程维度"},{"topic":"T6 服务战略","plan":"K7 口碑服务提升计划","measure":" ","target":"P4 打造口碑服务","wd":"内部流
程维度"},{"topic":"T6 服务战略","plan":" ","measure":"P5.1 神秘顾客检查得分(K)","target":"P5 打造亲切服务","wd":"内部流程维度"}
,{"topic":"T6 服务战略","plan":" ","measure":"P6.1 便捷服务指标考核达标率","target":"P6 打造便捷服务","wd":"内部流程维度"},{"topic"
:"T6 服务战略","plan":" ","measure":"P7.1 季度检查专项服务得分","target":"P7 打造专业服务","wd":"内部流程维度"},{"topic":"T7 环
境战略","plan":" ","measure":"P8.1 商场季度检查环境卫生、VI标识和消防安全得分","target":"P8 提供整洁明亮、安全舒适的购物环境","wd":"内部流程维度"
},{"topic":" ","plan":" ","measure":"P9.1 商品损耗率","target":"P9 加强安全管理","wd":"内部流程维度"},{"topic":" ","plan"
:" ","measure":"P9.2 重大事故(纠纷)发生次数","target":"P9 加强安全管理","wd":"内部流程维度"},{"topic":"T8 有竞争力的员工队伍","plan"
:"K8 实施敬业度提升计划","measure":"L1.1 员工敬业度(K)","target":"L1 激发员工源动力","wd":"学习与成长维度"},{"topic":"T8 有竞争力的员工
队伍","plan":"K9 宣导和践行企业文化","measure":" ","target":"L1 激发员工源动力","wd":"学习与成长维度"},{"topic":"T8 有竞争力的员工队伍"
,"plan":" ","measure":"L2.1 管理干部本土化比例","target":"L2 加快员工本土化建设","wd":"学习与成长维度"},{"topic":"T9 高效的信息系统"
,"plan":"K10 提升R3系统应用能力","measure":" ","target":"L3 有效应用R3系统","wd":"学习与成长维度"},{"topic":"T10 卓越的组织能力"
,"plan":"K11 落实人效项目提升方案","measure":" ","target":"L4 提高运营效率","wd":"学习与成长维度"}]}