这一节来定义另外三种类型的菜单类.首先定义菜单按钮类.文件放于app/view/main/region目录下面,文件名为ButtonMainMenu.js. /** * 显示在顶部的按钮菜单,可以切换至标准菜单,菜单树 */ Ext.define('app.view.main.region.ButtonMainMenu', { extend: 'app.ux.ButtonTransparent', alias: 'widget.buttonmainmenu', viewModel: 'main'…

手把手教你mysql(十)索引 一:索引的引入 索引定义:索引是由数据库表中一列或者多列组合而成,其作用是提高对表中数据的查询速度. 类似于图书的目录,方便快速定位,寻找指定的内容,如一本1000页的书,如果没有目录,你想要知道指定的内容,必须要1页1页翻过去,是不是很浪费时间? 二:索引的优缺点 优点:提高查询数据的速度. 缺点:创建和维护索引的时间增加了. 三: 索引实际应用 T_teacher表中有100000条数据,是我利用Hibernate插的,大家可以自己用jdbc插一下或者用后面的…

网页当中的拖放(drag-drop)是比较有趣的操作,extjs5中很好的封装了拖放的动作,也有各种类来支持,但是要学好“拖放”这个东西真是很难,特别是象我这样英语不好的人,看不太懂官网上的说明,做一个拖放的操作起码得几天的时间. 下面完成拖放删除的功能.即,选中一条记录或多条记录,然后拖动到“删除”按钮上,最后松开鼠标进行记录删除的操作.操作步骤: 1.给Grid增加新的配置,使其记录允许拖动.在Grid.js中的initComponent函数中加入 this.viewConfig = { s…

上一节中设计了一些模块自定义中用到的要素,为了直观起见,这一节先建立一个模块的主界面.看过我 模块管理常规功能自定义系统的设计与实现 博客的人应该会有所了解了.一个模块的主界面是一个Grid,在其上方有个操作按钮的工具条,在左边有导航区域,在右边有一个记录明细的显示区域.下面即是一个例子: 下面我们来搭建这个界面,首先在view中建立目录module,在此目录下建立Module.js,ModuleController.js, moduleModel.js.这三个文件分别为模块的主界面,模块的控制…

下面开始设计和完成一个简单的Form的自定义过程.先准备数据,在ModuleModel.js中的data属性下面,加入自定义Form的参数定义,下面的代码中定义了一个新的属性tf_formSchemes,在这个属性下面可以定义多个formScheme,下面的例子中只加入了一个,在formScheme上,加了二个fieldSet,然后在fieldSet下面定义了若干个字段. // 模块的form方案,可以定义多个方案 tf_formSchemes: [{ tf_schemeOrder: 10, t…

对于有很多字段的模块在一个grid中显示所有的字段,会显得很臃肿,对于不同的用户其侧重的字段类型也不尽相同,因此就有必要为Grid的列表设计多个方案.在这个自定义系统进行设计的时候,我已经将这部分内容设计了进去,在ModuleModel.js中,在data下面有个属性tf_gridSchemes为数组型,你有多少种方案,都定义在这个下面就可以了,然后再创建一个控件可以根据这些定义来进行方案的选择,选择好以后让grid重新配置新的方案即可. 先来看一下新增一个方案的配置信息,在ModuleMode…

经过对自定义模块和Grid的设计和编码,现在已经能对一个有配置信息的模块来生成界面并进行一些简单的CURD操作.由于这是一个全解释性的前台的架构,因此你想到的任何新主意都可以放到所有的模块中. 比如对于“Grid列宽的自动适应”这个功能,我们可以在系统设置项里加入“列宽自适应模式”,下面有三个选项:1.不自动适应:2.首次加载数据时自动适应:3､每次加载数据都自动适应.因为列宽自动适应需要时间,如果字段很多,记录很多会比较慢,因此可以加入这个设置,使用户根据自己的喜好来设置.还可以对每种类型的字…

model和columns生成好了,下面要修改一下Module.js和Grid.js中的代码,使其能够协同工作. /** * 一个模块的主控界面的容器,用来安放各个模块控件以及协调他们之间的关系 */ Ext.define('app.view.module.Module', { extend: 'Ext.panel.Panel', alias: 'widget.modulepanel', requires: ['app.view.module.ModuleController', 'app.vi…

上面设计好了一个模块的主界面,下面通过菜单命令的执行来把这个模块加入到主界面当中.在MainModule.js中有一个函数,生成了当前的菜单数据: // 根据data.systemMenu生成菜单条和菜单按钮下面使用的菜单数据 getMenus : function() { var items = []; var menuData = this.get('systemMenu'); // 取得定义好的菜单数据 Ext.Array.each(menuData, function(group) {…

从这一节开始我们来设计并完成一个自定义模块.我们先来确定一个独立的模块的所能定义的一些模块信息.以下信息只是我自己在开发过程中想到或用到的,希望有新的想法的或者有建议的跟贴回复. 一个独立模块包含以下信息: 1.模块的基本信息 模块ID号:一个数字的ID号,可以根据此ID号的顺序将相同分组的模块放在一块. 模块分组:模块分到哪个组里,比如说业务模块1.业务模块2.系统设置.系统管理等. 模块标识:系统中唯一的模块的标识,一般这个标识等同于数据库中的表名和java中的java Bean的名字.如合…

自定义的Form已经可以运行了,下面改一下配置,把Form里面的FieldSet放在Tab之下.修改一下ModuleModel.js中的data下的tf_FormSchemes下的方案,增加一个属性. 上面设置好了以后,可以看到Form中FieldSet都放置在Tab中了,下面的截图展示了二个Tab的界面. 从理论上说,如果你的Form配置信息设置得合理,可以得到你想要的任何样式的Form.但在实际应用的时候,我们只要完成大部分能自动生成就足够了,真正程序中有超级变态复杂的Form结构,可以自己…

Grid各列已经能够展示出来了.列的类型包括字符型,整型,浮点型,货币型,百分比型,日期型和布尔型,我自定义了各种类型的渲染样式: 1.整型:标题栏居中,数值靠右显示,正数颜色为蓝色,负数颜色为红色,0不显示. 2.浮点型:标题栏居中,数值靠右显示,正数颜色为蓝色,负数颜色为红色,显示二位小数,0不显示. 3.货币型:同浮点型,但是可以选择不同的单位,如元,千元,万元,百万元,亿元.数据有分节显示. 4.百分比型:自定义的一个百分比的显示,有数值和图像来形象的表示百分比. 5.日期型:显示格式为…

这一节加入模块自定义字段,并根据这些字段生成model.然后再定义grid中的分组和列.从这一切开始真正进入到了模块自定义的节奏当中,代码的复杂度和技巧性也大大提高.先从模块字段的自定义开始.先看一下ModuleModel.js中加入的新的定义: /** * 模块的数据模型 */ Ext.define('app.view.module.ModuleModel', { extend: 'Ext.app.ViewModel', alias: 'viewmodel.module', // 在开发过程中…

Extjs Form是一个比较常用的控件,主要用来显示和编辑数据的,今天这篇文章将介绍Extjs Form控件的详细用法,包括创建Form.添加子项.加载和更新数据.验证等. Form和Form Basic Extjs Form和Form Basic是两个东西,Form提供界面的展示,而Form Basic则提供数据的处理.验证等功能.每一个Form Panel在创建的时候,都会绑定一个Form Basic,我们可以通过方法getForm来获取: form.getForm() 在API方面,Fo…

在本节中将要加入各种类型的字段,在加入字段的时候由于可以一行加入多个字段,因此层次结构又多了一层fieldcontainer.form里面的主要层次结构如下: form -- fieldSet -- fieldcontainer -- field. 现在加入fieldcontainer的生成器的文件,在factory中加入文件FieldContainerFactory.js /** * 字段容器factory */ Ext.define('app.view.module.factory.Fiel…

前面几节完成了模块Grid的自定义,模块Form自定义的过程和Grid的过程类似,但是要更复杂一些.先来设计一下要完成的总体目标. 1､可以有多个Form方案,对应于显示.新增.修改.审核.审批等功能: 2､对于上述各种功能可以选择不同的Form方案,比如说修改可以有几个方案,各个操作员可以选择他们感兴趣的Form方案来进行数据的修改. 3､每个Form方案中可以定义若干个字段分组(FieldSet或FieldContainer). 4､每个字段分组中可以放置若干个字段. 5､每个Form方案可…

上节在Grid展示时做了一个金额单位可以手工选择的功能,如果你要加入其他功能,也只要按照这个模式来操作就行了,比如说你想改变金额字段的颜色.小数位数.零值是否显示.货币符号.单位显示在标题栏或者跟在金额后面,凡是你能想到的需要手工设置的东西都可以加进来. 上面讲到的这些设置以后会加到程序里,在下载包里可以看到,就不做讲解了. 这一节来使模块可以具有新增.修改.删除的操作.由于还没有和后台服务相联,因此数据是保存在本地localStorage中的,浏览器关闭这些数据并不会丢失.首先我们让Grid具…

这一节来完成Grid中的金额字段的金额单位的转换.转换旰使用MVVM特性,总体上和控制菜单的几种模式类似.首先在目录app/view/main/menu下建立文件Monetary.js,用于放金额单位的数据和生成菜单的items. /** * 金额单位的管理类 */ Ext.define('app.view.main.menu.Monetary', { statics: { values: null, getAllMonetary: function () { if (!this.values)…

顶部和底部区域已经作好,在顶部区域有一个菜单的按钮,这一节我们设计一个菜单的数据结构,使其可以展示出不同样式的菜单.由于准备搭建的是一个系统模块自定义的系统,因此菜单也是自定义的,在操作员系统登录的时候,和MainModel中的其他数据一样,将会通过ajax加载要显示的菜单数据,然后生成菜单条或者菜单树.在这个例子中,我只做了二层菜单,要做三层以上的只要稍作修改即可. 下面先来看看菜单数据的定义:在MainModel中,在data属性下定义一个systemMenu的数组属性,下面就放了各个菜单项…

Extjs的开发都可以遵循OOP的原则,其对类的封装也很完善了.自定义一个控件最简单的办法就是继承一个已有的控件.根据上一节的需要,我做了一个Button的子类.首先根据目录结构,在app目录下建立一个ux目录,将自定义控件都放在这个目录下.在ux目录下建立一个文件ButtonTransparent.js. /** * 定义了一个背景透明的Button类,继承于Button */ Ext.define('app.ux.ButtonTransparent', { extend: 'Ext.butt…

上一节中用sencha工具自动创建了一个项目,并且可以在浏览器中查看.现在我们来看看js类加载过程.如下图所示: 1､首先:浏览器中输入 localhost:1841 ,调用 index.html; <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>app</title> <!-- The line below must be kept i…

参考:模块 NOTE 1.模块:一个.py文件称为一个模块. 2.代码模块化的意义:a.提升程序的可维护性 b.不用重复造轮子 3.避免模块冲突,解决方法:引入了按目录来组织模块的方法,称为包(Package). eg.abc.py => abc模块,xyz.py => xyz模块 倘若出现冲突 => 选择一个顶层文件夹名称,尽量保证名称唯一: my_company: __init__.py abc.py xyz.py 引入了包以后,只要顶层的包名不与别人冲突,那所有模块都不会与别人冲突…

菜单的样式多了,怎么可以灵活的切换是个问题. 在使用标准菜单的时候,在菜单最前面有二个按钮,可以切换到树状菜单和按钮菜单. 在树状菜单的显示区,可以切换换到标准菜单,以及折叠式菜单. 切换到按钮菜单之后: 切换菜单切换到标准菜单和树状菜单,需要在设置里面进行操作. 下面分别来看看是如何实现的.由于内部处理比较复杂,我就画一张大图了,源代码稍后也会发布在csdn中. 现在看看设置里面改变菜单样式的那个控件的运行图.…

sencha 的例子中,有使用图标字体来美化按钮的例子,这个用起来又方便风格又统一,例如下图: 上面图标字体的使用方法也很简单,只要下载Font Awesome的css和图标文件,放到项目里就可以了.部分图标截图: Font Awesome的网站为:点击打开链接.进入网站后,先下载Font Awesome 3.0,解压缩后,将css和font目录拷贝到war目录下. (Font Awesome最新版本为4.0,网址为:http://fontawesome.io/ ) 文件拷贝进来以后,需要在in…

这一节为主界面加一个顶部区域和底部区域.一个管理系统的界面可以粗分为顶部标题部分.中间数据展示和处理的部分.底部备注和状态部分. 在增加这二个区域之前,我们先在MainModel.js中加入一些数据. Ext.define('app.view.main.MainModel', { extend: 'Ext.app.ViewModel', alias: 'viewmodel.main', data: { name: 'app', // 系统信息 system: { name: '工程项目合同及资金…

下面我们来看一下自动生成的代码中的MVVM架构的关系.Main是一个可视的控件,MainController是这个控件的控制类,MainModel是这个控件的模型类. 在上面的图片中,左边是Main.js中的代码,右边是MainController.js 和 MainModel.js中的代码,可以看到MVVM中的事件绑定和属性值绑定都用到了.上图中红色的部分标注了一个按钮“Button”的handler(即click)事件绑定到MainController.js中的函数“OnClickButto…

Ext JS 5 的主要特性包括: 新的数据绑定方式 新增支持 MVVM 模式,并且依然支持 MVC 模式 对手持设备更友好,针对触屏设备进行优化 新的主题 Crisp / Neptune Touch(针对触屏优化) Routing / URI 抛弃对超旧浏览器的支持,目前支持 IE 8+ / Safari 6+ / Opera 12+ /Firefox / Chrome / Safari iOS 6+ / Chrome Android 4.1+ / IE 10+ Win 8 抛弃旧浏览器带来的…

In Doing We Learning 在操作中学习.如果只是光看教程,没有实际的操作,对编程语言的理解很空泛,所以决定从单片机中学习C语言. #include<reg52.h>                 //包含的头文件. sbit LED = P0^0;                         //这里就是对P0寄存器进行位操作.相当于对P0^0位赋予了一个新的名字,LED.实际上这一块可以包含在头文件中.避免重复操作.sbit ADDR0 = P1^0;sbit ADDR…

前言 下面是这个教程将教你如何在Ext3的文件系统中恢复被rm掉的文件. 删除文件 假设我们有一个文件名叫 'test.txt' $ls -il test.txt 15 -rw-rw-r– 2 root root 20 Apr 17 12:08 test.txt 注意:: "-il" 选项表示显示文件的i-node号(15),如果你不知道Unix/Linux文件系统的"I结点"的话,你有必要先补充一下相关的知识.简单说来,i结点就是操作管理文件的一个标识号. 我们再…

0. 系列文章 1.使用Typescript重构axios(一)--写在最前面 2.使用Typescript重构axios(二)--项目起手,跑通流程 3.使用Typescript重构axios(三)--实现基础功能:处理get请求url参数 4.使用Typescript重构axios(四)--实现基础功能:处理post请求参数 5.使用Typescript重构axios(五)--实现基础功能:处理请求的header 6.使用Typescript重构axios(六)--实现基础功能:获取响应数据…