本系列文章目录:
1、业务系统设计之一:系统菜单设计
2、业务系统设计之二:系统主控设计(上)
系统主控简单的理解就是一个系统的操作控制或者也可以叫住系统操作平台。一个良好的系统主控可以让系统更加灵活操作、应用。至于技术上的实现我们可以有很多中选择,所以这里不谈论什么技术好等话题。本文将接着上一篇《业务系统设计之一:系统菜单设计 》介绍业务系统里的主控设计方法,以及怎么将系统的各部分(系统菜单、系统主控、业务操作等等)衔接在一起。 或许我这样说还所以很多朋友不能理解什么是系统主控,那好就请你仔细看看下图:
上图是我在126邮箱中的截图,它的这种主控方式我个人感觉就是很爽的一种方式。收件箱、百宝箱、写信等操作都以一个新的操作界面打开,然后将其挂在主控的菜单工具拦上,多任务之间可以相互切换操作,实现了多任务可以并行处理,每项功能操作都有自己的状态(比如写信提交了不会影响其他的界面),至于其他好处吧我这里就不多废话。
通过上面的分析与了解,下面我们就来看看像这样的系统主控是怎么实现的。以上一篇文章《业务系统设计之系统菜单设计》为基础,通过点击菜单项目则打开菜单项对应的页面,菜单运行效果如下: 系统主控的开发其实和其他功能一样简单,只要弄清楚了功能需求就OK。
功能需求大致如下:
1、系统入口点(这肯定就是系统菜单--下拉菜单、树型菜单等)
2、全局显示容器(既显示内嵌页面的容器)
3、点击菜单项可以在容器上创建页签选项,如果当前菜单项所对应的页面已经打开则选中该项。
4、在容器中选择页签项,被选择项突出显示。
5、每一个页签下对应一个页面,可相互独立操作互不影响其他页签项。
5、每一个页签带有关闭功能,点击指定关闭区域或图标既可实现关闭当前页签。
6、双击可实现关闭页签。
7、其他界面效果控制等。
本文中的数据库结构借鉴于市场上主流ERP系统的菜单表结构,程序运行效果同上图一样,对菜单表有不清楚的朋友可留言提问,这里我不做详细解释。SQL代码如下: SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
IF NOT EXISTS (SELECT * FROM sys.objects WHERE object_id = OBJECT_ID(N'[dbo].[Menu]') AND type in (N'U'))
BEGIN
CREATE TABLE [dbo].[Menu](
[AutoID] [uniqueidentifier] ROWGUIDCOL NOT NULL CONSTRAINT [DF_Menu_AutoID] DEFAULT (newid()),
[Code] [varchar](50) NULL,
[Name] [varchar](50) NULL,
[Grade] [int] NULL,
[HasSub] [bit] NULL,
[SupMenuCode] [varchar](50) NULL,
[EndGrade] [bit] NULL,
[Order] [int] NULL,
[ReqeustUrl] [varchar](100) NULL,
[IsItemGroup] [bit] NULL,
[IsControl] [bit] NULL,
CONSTRAINT [PK_Menu] PRIMARY KEY CLUSTERED
(
[AutoID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
END
建立好ASP.NET WEB应用程序,并将相关的资源(本文里的资源包括图片、样式、第三方控件等)整理好。数据操作使用Linq To Sql完成,整理好的解决方案如下图示:
本文中系统主控的核心在于RadContrls控件RadMenu和RadTabstrip的组合,导航由RedMenu完成,主控端主要由RadTabstrip完成。要实现一个完美的系统主控,页面的控制和布局都很重要,这里我采用母版页技术将公共的部分放在母版页,通过该母版页建立的内容页来作为系统的主控页面。母版页完整html编码
系统主控母版
a,body,div,input,li,p,span,td { font-size:12px;}
#headDIV {height:60px;width:100%;text-align:center;}
#contentCenter {width:100%;height:400px;}
#stateDIV {width:100%;height:20px;background-image:url('Images/stateBg.gif');bottom:0px;}
/*
* 应用程序加载时根据用户浏览器初始化窗体大小
*/
window.onload = function()
{
if (window.screen)
{
var aw = screen.width;
var ah = screen.height;
window.moveTo(0, 0);
window.resizeTo(aw, ah);
}
}
当前操作员:admin
1、业务系统设计之一:系统菜单设计
2、业务系统设计之二:系统主控设计(上)
系统主控简单的理解就是一个系统的操作控制或者也可以叫住系统操作平台。一个良好的系统主控可以让系统更加灵活操作、应用。至于技术上的实现我们可以有很多中选择,所以这里不谈论什么技术好等话题。本文将接着上一篇《业务系统设计之一:系统菜单设计 》介绍业务系统里的主控设计方法,以及怎么将系统的各部分(系统菜单、系统主控、业务操作等等)衔接在一起。 或许我这样说还所以很多朋友不能理解什么是系统主控,那好就请你仔细看看下图:
上图是我在126邮箱中的截图,它的这种主控方式我个人感觉就是很爽的一种方式。收件箱、百宝箱、写信等操作都以一个新的操作界面打开,然后将其挂在主控的菜单工具拦上,多任务之间可以相互切换操作,实现了多任务可以并行处理,每项功能操作都有自己的状态(比如写信提交了不会影响其他的界面),至于其他好处吧我这里就不多废话。
通过上面的分析与了解,下面我们就来看看像这样的系统主控是怎么实现的。以上一篇文章《业务系统设计之系统菜单设计》为基础,通过点击菜单项目则打开菜单项对应的页面,菜单运行效果如下: 系统主控的开发其实和其他功能一样简单,只要弄清楚了功能需求就OK。
功能需求大致如下:
1、系统入口点(这肯定就是系统菜单--下拉菜单、树型菜单等)
2、全局显示容器(既显示内嵌页面的容器)
3、点击菜单项可以在容器上创建页签选项,如果当前菜单项所对应的页面已经打开则选中该项。
4、在容器中选择页签项,被选择项突出显示。
5、每一个页签下对应一个页面,可相互独立操作互不影响其他页签项。
5、每一个页签带有关闭功能,点击指定关闭区域或图标既可实现关闭当前页签。
6、双击可实现关闭页签。
7、其他界面效果控制等。
本文中的数据库结构借鉴于市场上主流ERP系统的菜单表结构,程序运行效果同上图一样,对菜单表有不清楚的朋友可留言提问,这里我不做详细解释。SQL代码如下: SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
IF NOT EXISTS (SELECT * FROM sys.objects WHERE object_id = OBJECT_ID(N'[dbo].[Menu]') AND type in (N'U'))
BEGIN
CREATE TABLE [dbo].[Menu](
[AutoID] [uniqueidentifier] ROWGUIDCOL NOT NULL CONSTRAINT [DF_Menu_AutoID] DEFAULT (newid()),
[Code] [varchar](50) NULL,
[Name] [varchar](50) NULL,
[Grade] [int] NULL,
[HasSub] [bit] NULL,
[SupMenuCode] [varchar](50) NULL,
[EndGrade] [bit] NULL,
[Order] [int] NULL,
[ReqeustUrl] [varchar](100) NULL,
[IsItemGroup] [bit] NULL,
[IsControl] [bit] NULL,
CONSTRAINT [PK_Menu] PRIMARY KEY CLUSTERED
(
[AutoID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
END
建立好ASP.NET WEB应用程序,并将相关的资源(本文里的资源包括图片、样式、第三方控件等)整理好。数据操作使用Linq To Sql完成,整理好的解决方案如下图示:
本文中系统主控的核心在于RadContrls控件RadMenu和RadTabstrip的组合,导航由RedMenu完成,主控端主要由RadTabstrip完成。要实现一个完美的系统主控,页面的控制和布局都很重要,这里我采用母版页技术将公共的部分放在母版页,通过该母版页建立的内容页来作为系统的主控页面。母版页完整html编码
系统主控母版
a,body,div,input,li,p,span,td { font-size:12px;}
#headDIV {height:60px;width:100%;text-align:center;}
#contentCenter {width:100%;height:400px;}
#stateDIV {width:100%;height:20px;background-image:url('Images/stateBg.gif');bottom:0px;}
/*
* 应用程序加载时根据用户浏览器初始化窗体大小
*/
window.onload = function()
{
if (window.screen)
{
var aw = screen.width;
var ah = screen.height;
window.moveTo(0, 0);
window.resizeTo(aw, ah);
}
}
当前操作员:admin