forked from fanruan/fineui
Browse Source
* commit 'e79124989fbe1c6f54efa9476bb97decd7c31244': add 整理 整理 update update函数 add add 加入虚拟dom add add 整理 整理 整理 整理 add demo的valuechooser用到的数据放到config中配置 svg 整理 add 删掉 BICst相关master
guy
8 years ago
516 changed files with 145212 additions and 92389 deletions
@ -0,0 +1,778 @@
|
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-arrangement-block { |
||||
background: #e85050; |
||||
opacity: 0.8; |
||||
filter: alpha(opacity=80); |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-arrangement .arrangement-helper { |
||||
border: 1px solid #d4dadd; |
||||
background: #009de3; |
||||
z-index: 1000000000; |
||||
} |
||||
.bi-arrangement .arrangement-block { |
||||
z-index: 1000000000; |
||||
} |
||||
.bi-arrangement .arrangement-drop-container { |
||||
z-index: 1000000000; |
||||
} |
||||
.bi-arrangement .arrangement-drop-container .arrangement-drop-region { |
||||
overflow: hidden; |
||||
} |
||||
.bi-arrangement .arrangement-drop-container .drop-devider { |
||||
z-index: 1000000001; |
||||
background: #009de3; |
||||
} |
||||
.bi-arrangement .arrangement-drop-container .top-left, |
||||
.bi-arrangement .arrangement-drop-container .top-right, |
||||
.bi-arrangement .arrangement-drop-container .bottom-left, |
||||
.bi-arrangement .arrangement-drop-container .bottom-right, |
||||
.bi-arrangement .arrangement-drop-container .top-left-second, |
||||
.bi-arrangement .arrangement-drop-container .top-right-second, |
||||
.bi-arrangement .arrangement-drop-container .bottom-left-second, |
||||
.bi-arrangement .arrangement-drop-container .bottom-right-second, |
||||
.bi-arrangement .arrangement-drop-container .top-center, |
||||
.bi-arrangement .arrangement-drop-container .bottom-center, |
||||
.bi-arrangement .arrangement-drop-container .left-center, |
||||
.bi-arrangement .arrangement-drop-container .right-center, |
||||
.bi-arrangement .arrangement-drop-container .top-center-second, |
||||
.bi-arrangement .arrangement-drop-container .bottom-center-second, |
||||
.bi-arrangement .arrangement-drop-container .left-center-second, |
||||
.bi-arrangement .arrangement-drop-container .right-center-second { |
||||
z-index: 1000000001; |
||||
background: #009de3; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-arrangement-droppable { |
||||
background: #d8f3fe; |
||||
opacity: 0.8; |
||||
filter: alpha(opacity=80); |
||||
z-index: 100000; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-adapt-editor .adapt-editor-text { |
||||
font-size: 14px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/*************BI.SearchEditor******************/ |
||||
.bi-search-editor { |
||||
border: 1px solid #d4dadd; |
||||
} |
||||
.bi-search-editor .close-font { |
||||
font-size: 20px; |
||||
} |
||||
.bi-search-editor .search-font { |
||||
font-size: 20px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/*************BI.SearchEditor******************/ |
||||
.bi-small-search-editor .bi-editor { |
||||
font-size: 12px; |
||||
} |
||||
.bi-small-search-editor .bi-editor .bi-input { |
||||
font-size: 12px; |
||||
} |
||||
.bi-small-search-editor .bi-editor .bi-label { |
||||
font-size: 12px; |
||||
} |
||||
.bi-small-search-editor .close-font { |
||||
font-size: 18px; |
||||
} |
||||
.bi-small-search-editor .search-font { |
||||
font-size: 18px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-sign-initial-editor .sign-initial-editor-text { |
||||
font-size: 14px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-sign-style-editor .sign-style-editor-text { |
||||
max-width: 100%; |
||||
font-size: 12px; |
||||
} |
||||
.bi-sign-style-editor .sign-style-editor-tip { |
||||
max-width: 100%; |
||||
font-size: 12px; |
||||
color: #808080; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-text-editor { |
||||
border: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/*************BI.SearchEditor******************/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-date-picker { |
||||
background: #f4f4f4; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-date-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-down-list-combo .down-list-group.bi-combo-hover .bi-down-list-group-item, |
||||
.bi-down-list-combo .down-list-group.bi-combo-hover .bi-down-list-group-item .b-font:before { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-down-list-combo .down-list-group.bi-combo-hover .bi-down-list-group-item:disabled, |
||||
.bi-down-list-combo .down-list-group.bi-combo-hover .bi-down-list-group-item.disabled, |
||||
.bi-down-list-combo .down-list-group.bi-combo-hover .bi-down-list-group-item:disabled .b-font:before, |
||||
.bi-down-list-combo .down-list-group.bi-combo-hover .bi-down-list-group-item.disabled .b-font:before { |
||||
background-color: #ffffff; |
||||
} |
||||
.bi-down-list-combo .bi-down-list-spliter { |
||||
border-top: 1px solid #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-down-list-popup .bi-down-list-item:hover, |
||||
.bi-down-list-popup .bi-down-list-item.hover { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-down-list-popup .bi-down-list-item.disabled, |
||||
.bi-down-list-popup .bi-down-list-item.disabled:hover, |
||||
.bi-down-list-popup .bi-down-list-item.disabled:active { |
||||
background-color: #ffffff; |
||||
} |
||||
.bi-down-list-popup .bi-down-list-item:active { |
||||
color: #009de3; |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-down-list-popup .bi-down-list-item .list-item-text { |
||||
max-width: 203px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-excel-table > div.bottom-right > div > div > table { |
||||
border-right: 1px solid #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-excel-table-header-cell { |
||||
font-weight: bold; |
||||
background-color: #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-file-manager-file-item { |
||||
border-bottom: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-file-manager-folder-item { |
||||
border-bottom: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-file-manager-nav-button .file-manager-nav-button-text { |
||||
max-width: 200px; |
||||
background: #ffffff; |
||||
} |
||||
.bi-file-manager-nav-button .file-manager-nav-button-text.active { |
||||
background-color: #f4f4f4; |
||||
color: #808080; |
||||
} |
||||
.bi-file-manager-nav-button .file-manager-nav-button-triangle { |
||||
z-index: 1; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-file-manager-nav { |
||||
border-left: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-fine-tuning-number-editor { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
.bi-fine-tuning-number-editor .top-button { |
||||
border-left: 1px solid #d4dadd; |
||||
border-bottom: 1px solid #d4dadd; |
||||
} |
||||
.bi-fine-tuning-number-editor .bottom-button { |
||||
border-left: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-image-button-href .image-button-href-icon-button { |
||||
z-index: 1; |
||||
font-size: 16px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-image-button-size .image-button-size-button-group { |
||||
font-size: 12px; |
||||
color: #1a1a1a; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-upload-image .upload-image-text-button-label { |
||||
font-size: 14px; |
||||
color: #c4c6c6; |
||||
} |
||||
.bi-upload-image .upload-image-icon-button { |
||||
z-index: 1; |
||||
font-size: 16px; |
||||
background-color: #ffffff; |
||||
} |
||||
.bi-upload-image .upload-image-delete-label { |
||||
font-size: 14px; |
||||
color: #1a1a1a; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-interactive-arrangement .interactive-arrangement-dragtag-line { |
||||
z-index: 1000000000; |
||||
background-color: #f07d0a; |
||||
} |
||||
.bi-interactive-arrangement .interactive-arrangement-dragtag-icon { |
||||
z-index: 1000000000; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-month-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-select-check-pane .multi-select-continue-select { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-multi-select-check-pane .multi-select-check-selected { |
||||
color: #009de3; |
||||
text-decoration: underline; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-display-list { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-display-list .display-list-item { |
||||
color: #808080; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-select-combo .multi-select-trigger-icon-button { |
||||
border-left: 1px solid #d4dadd; |
||||
font-size: 16px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-select-popup-view .multi-select-no-toolbar { |
||||
color: #c4c6c6; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-select-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px 2px 2px 2px; |
||||
-moz-border-radius: 2px 2px 2px 2px; |
||||
border-radius: 2px 2px 2px 2px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-select-search-pane { |
||||
background: #ffffff; |
||||
} |
||||
.bi-multi-select-search-pane .multi-select-toolbar { |
||||
color: #e85050; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-select-check-selected-button { |
||||
border: 1px solid #009de3; |
||||
-webkit-border-radius: 8px 8px 8px 8px; |
||||
-moz-border-radius: 8px 8px 8px 8px; |
||||
border-radius: 8px 8px 8px 8px; |
||||
color: #009de3; |
||||
background-color: #ffffff; |
||||
z-index: 1; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-string-list .popup-multi-string-list { |
||||
border-left: 1px solid #d4dadd; |
||||
border-right: 1px solid #d4dadd; |
||||
border-bottom: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-check-pane { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-multi-tree-check-pane .multi-tree-continue-select { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-multi-tree-check-pane .multi-tree-check-selected { |
||||
color: #009de3; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-display { |
||||
background-color: #f4f4f4; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-combo .multi-select-trigger-icon-button { |
||||
border-left: 1px solid #d4dadd; |
||||
font-size: 16px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px 2px 2px 2px; |
||||
-moz-border-radius: 2px 2px 2px 2px; |
||||
border-radius: 2px 2px 2px 2px; |
||||
} |
||||
.bi-multi-tree-trigger .trigger-check-selected { |
||||
border: 1px solid #009de3; |
||||
-webkit-border-radius: 8px 8px 8px 8px; |
||||
-moz-border-radius: 8px 8px 8px 8px; |
||||
border-radius: 8px 8px 8px 8px; |
||||
color: #009de3; |
||||
background-color: #ffffff; |
||||
z-index: 1; |
||||
} |
||||
.bi-multi-tree-trigger .trigger-icon-button { |
||||
border-left: 1px solid #d4dadd; |
||||
font-size: 16px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-popup .popup-view-tree { |
||||
min-height: 170px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-search-pane { |
||||
background: #ffffff; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px 2px 2px 2px; |
||||
-moz-border-radius: 2px 2px 2px 2px; |
||||
border-radius: 2px 2px 2px 2px; |
||||
} |
||||
.bi-multi-tree-trigger .trigger-check-selected { |
||||
border: 1px solid #009de3; |
||||
-webkit-border-radius: 8px 8px 8px 8px; |
||||
-moz-border-radius: 8px 8px 8px 8px; |
||||
border-radius: 8px 8px 8px 8px; |
||||
color: #009de3; |
||||
background-color: #ffffff; |
||||
z-index: 1; |
||||
} |
||||
.bi-multi-tree-trigger .trigger-icon-button { |
||||
border-left: 1px solid #d4dadd; |
||||
font-size: 16px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-multi-tree-check-selected-button .trigger-check-selected { |
||||
border: 1px solid #009de3; |
||||
-webkit-border-radius: 8px 8px 8px 8px; |
||||
-moz-border-radius: 8px 8px 8px 8px; |
||||
border-radius: 8px 8px 8px 8px; |
||||
color: #009de3; |
||||
background-color: #ffffff; |
||||
z-index: 1; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-tree-list-popup { |
||||
border-left: 1px solid #d4dadd; |
||||
border-right: 1px solid #d4dadd; |
||||
border-bottom: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-numerical-interval .numerical-interval-small-editor { |
||||
border-top: 1px solid #d4dadd; |
||||
border-bottom: 1px solid #d4dadd; |
||||
border-left: 1px solid #d4dadd; |
||||
-moz-border-radius-topleft: 2px; |
||||
-webkit-border-top-left-radius: 2px; |
||||
-moz-border-radius-bottomleft: 2px; |
||||
-webkit-border-bottom-left-radius: 2px; |
||||
border-top-left-radius: 2px; |
||||
border-bottom-left-radius: 2px; |
||||
} |
||||
.bi-numerical-interval .numerical-interval-big-editor { |
||||
border-top: 1px solid #d4dadd; |
||||
border-bottom: 1px solid #d4dadd; |
||||
border-right: 1px solid #d4dadd; |
||||
-moz-border-radius-topright: 2px; |
||||
-webkit-border-top-right-radius: 2px; |
||||
-moz-border-radius-bottomright: 2px; |
||||
-webkit-border-bottom-right-radius: 2px; |
||||
border-top-right-radius: 2px; |
||||
border-bottom-right-radius: 2px; |
||||
} |
||||
.bi-numerical-interval .numerical-interval-big-combo { |
||||
border: 1px solid #d4dadd; |
||||
-moz-border-radius-topleft: 2px; |
||||
-webkit-border-top-left-radius: 2px; |
||||
-moz-border-radius-bottomleft: 2px; |
||||
-webkit-border-bottom-left-radius: 2px; |
||||
border-top-left-radius: 2px; |
||||
border-bottom-left-radius: 2px; |
||||
} |
||||
.bi-numerical-interval .numerical-interval-big-combo .bi-icon-combo-trigger .icon-combo-trigger-icon { |
||||
font-size: 14px; |
||||
} |
||||
.bi-numerical-interval .numerical-interval-small-combo { |
||||
border: 1px solid #d4dadd; |
||||
-moz-border-radius-topright: 2px; |
||||
-webkit-border-top-right-radius: 2px; |
||||
-moz-border-radius-bottomright: 2px; |
||||
-webkit-border-bottom-right-radius: 2px; |
||||
border-top-right-radius: 2px; |
||||
border-bottom-right-radius: 2px; |
||||
} |
||||
.bi-numerical-interval .numerical-interval-small-combo .bi-icon-combo-trigger .icon-combo-trigger-icon { |
||||
font-size: 14px; |
||||
} |
||||
.bi-numerical-interval.number-error .bi-input { |
||||
color: #e85050; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-numerical-interval-popup .numerical-interval-popup-item.hover, |
||||
.bi-numerical-interval-popup .numerical-interval-popup-item:hover { |
||||
background-color: #f4f4f4; |
||||
} |
||||
.bi-numerical-interval-popup .numerical-interval-popup-item.active, |
||||
.bi-numerical-interval-popup .numerical-interval-popup-item:active { |
||||
background-color: #f4f4f4; |
||||
color: #009de3; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-page-table-cell { |
||||
-webkit-user-select: initial; |
||||
-khtml-user-select: initial; |
||||
-moz-user-select: initial; |
||||
-ms-user-select: initial; |
||||
-o-user-select: initial; |
||||
user-select: initial; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-path-chooser .path-chooser-radio { |
||||
z-index: 1; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-path-region { |
||||
background: #eaeaea; |
||||
} |
||||
.bi-path-region .path-region-label { |
||||
z-index: 1; |
||||
background: #ffffff; |
||||
border: 1px solid #ffffff; |
||||
} |
||||
.bi-path-region .path-region-label.active { |
||||
background: #009de3; |
||||
color: #ffffff; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-preview-table-cell { |
||||
min-height: 25px; |
||||
min-width: 80px; |
||||
max-width: 220px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-preview-table > div > table > thead > tr.odd, |
||||
.bi-preview-table > div > div > div > table > thead > tr.odd { |
||||
background-color: #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-preview-table-header-cell { |
||||
font-weight: bold; |
||||
min-height: 25px; |
||||
min-width: 80px; |
||||
max-width: 220px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-quarter-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-relation-view-item.active { |
||||
color: #ffffff; |
||||
background-color: #009de3; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-relation-view-region .relation-view-region-container { |
||||
background: #ffffff; |
||||
border: 1px solid #d4dadd; |
||||
z-index: 1; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
.bi-relation-view-region .relation-view-region-container.other-package { |
||||
border: 1px dashed #d4dadd; |
||||
} |
||||
.bi-relation-view-region .relation-view-region-container .relation-view-region-title { |
||||
border-bottom: 1px solid #d4dadd; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-sequence-table-dynamic-number .sequence-table-title-cell { |
||||
overflow: hidden; |
||||
overflow-x: hidden; |
||||
overflow-y: hidden; |
||||
-webkit-box-sizing: border-box; |
||||
/*Safari3.2+*/ |
||||
-moz-box-sizing: border-box; |
||||
/*Firefox3.5+*/ |
||||
-ms-box-sizing: border-box; |
||||
/*IE8*/ |
||||
box-sizing: border-box; |
||||
/*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/ |
||||
border: 1px solid #eaeaea; |
||||
} |
||||
.bi-sequence-table-dynamic-number .sequence-table-number-cell { |
||||
-webkit-box-sizing: border-box; |
||||
/*Safari3.2+*/ |
||||
-moz-box-sizing: border-box; |
||||
/*Firefox3.5+*/ |
||||
-ms-box-sizing: border-box; |
||||
/*IE8*/ |
||||
box-sizing: border-box; |
||||
/*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/ |
||||
border-left: 1px solid #eaeaea; |
||||
border-right: 1px solid #eaeaea; |
||||
border-bottom: 1px solid #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-sequence-table-list-number .sequence-table-title-cell { |
||||
overflow: hidden; |
||||
overflow-x: hidden; |
||||
overflow-y: hidden; |
||||
-webkit-box-sizing: border-box; |
||||
/*Safari3.2+*/ |
||||
-moz-box-sizing: border-box; |
||||
/*Firefox3.5+*/ |
||||
-ms-box-sizing: border-box; |
||||
/*IE8*/ |
||||
box-sizing: border-box; |
||||
/*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/ |
||||
border: 1px solid #eaeaea; |
||||
} |
||||
.bi-sequence-table-list-number .sequence-table-number-cell { |
||||
-webkit-box-sizing: border-box; |
||||
/*Safari3.2+*/ |
||||
-moz-box-sizing: border-box; |
||||
/*Firefox3.5+*/ |
||||
-ms-box-sizing: border-box; |
||||
/*IE8*/ |
||||
box-sizing: border-box; |
||||
/*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/ |
||||
border-left: 1px solid #eaeaea; |
||||
border-right: 1px solid #eaeaea; |
||||
border-bottom: 1px solid #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-sequence-table-tree-number .sequence-table-title-cell { |
||||
overflow: hidden; |
||||
overflow-x: hidden; |
||||
overflow-y: hidden; |
||||
-webkit-box-sizing: border-box; |
||||
/*Safari3.2+*/ |
||||
-moz-box-sizing: border-box; |
||||
/*Firefox3.5+*/ |
||||
-ms-box-sizing: border-box; |
||||
/*IE8*/ |
||||
box-sizing: border-box; |
||||
/*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/ |
||||
border: 1px solid #eaeaea; |
||||
} |
||||
.bi-sequence-table-tree-number .sequence-table-number-cell { |
||||
-webkit-box-sizing: border-box; |
||||
/*Safari3.2+*/ |
||||
-moz-box-sizing: border-box; |
||||
/*Firefox3.5+*/ |
||||
-ms-box-sizing: border-box; |
||||
/*IE8*/ |
||||
box-sizing: border-box; |
||||
/*W3C标准(IE9+，Safari5.1+,Chrome10.0+,Opera10.6+都符合box-sizing的w3c标准语法)*/ |
||||
border-left: 1px solid #eaeaea; |
||||
border-right: 1px solid #eaeaea; |
||||
border-bottom: 1px solid #eaeaea; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-singletree-combo .singletree-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
.bi-singletree-combo .bi-singletree-popup .singletree-toolbar { |
||||
color: #c4c6c6; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-web-page .web-page-button { |
||||
z-index: 1; |
||||
font-size: 14px; |
||||
background-color: #ffffff; |
||||
} |
||||
.bi-web-page .web-page-text-button-label { |
||||
font-size: 16px; |
||||
color: #c4c6c6; |
||||
} |
||||
.bi-web-page .web-page-delete-label { |
||||
font-size: 14px; |
||||
color: #1a1a1a; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-year-popup .year-popup-navigation { |
||||
border-top: 1px solid #eaeaea; |
||||
line-height: 30px; |
||||
color: #009de3; |
||||
} |
||||
.bi-year-popup .year-popup-navigation > .center-element { |
||||
border-left: 1px solid #eaeaea; |
||||
} |
||||
.bi-year-popup .year-popup-navigation > .first-element { |
||||
border-left: none; |
||||
} |
||||
/****添加计算宽度的--运算符直接需要space****/ |
||||
/****** common color(常用颜色,可用于普遍场景) *****/ |
||||
/**** custom color(自定义颜色,用于特定场景) ****/ |
||||
.bi-year-trigger { |
||||
border: 1px solid #d4dadd; |
||||
-webkit-border-radius: 2px; |
||||
-moz-border-radius: 2px; |
||||
border-radius: 2px; |
||||
} |
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,75 @@
|
||||
Demo.Button = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-button" |
||||
}, |
||||
render: function () { |
||||
var items = [ |
||||
{ |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '一般按钮', |
||||
level: 'common', |
||||
height: 30 |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '表示成功状态按钮', |
||||
level: 'success', |
||||
height: 30 |
||||
} |
||||
}, |
||||
{ |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '表示警告状态的按钮', |
||||
level: 'warning', |
||||
height: 30 |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '表示忽略状态的按钮', |
||||
level: 'ignore', |
||||
height: 30 |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '普通灰化按钮', |
||||
disabled: true, |
||||
level: 'success', |
||||
height: 30 |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '忽略状态灰化按钮', |
||||
disabled: true, |
||||
level: 'ignore', |
||||
height: 30 |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '带图标的按钮', |
||||
//level: 'ignore',
|
||||
iconClass: "rename-font", |
||||
height: 30 |
||||
} |
||||
} |
||||
]; |
||||
BI.each(items, function (i, item) { |
||||
item.el.handler = function () { |
||||
BI.Msg.alert('按钮', this.options.text); |
||||
} |
||||
}); |
||||
return { |
||||
type: "bi.left", |
||||
vgap: 200, |
||||
hgap: 20, |
||||
items: items |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.button", Demo.Button); |
||||
@ -0,0 +1,24 @@
|
||||
Demo.Button = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-button" |
||||
}, |
||||
render: function () { |
||||
var items = [ |
||||
{ |
||||
el: { |
||||
type: 'bi.icon_button', |
||||
cls: "rename-font", |
||||
width: 20, |
||||
height: 20 |
||||
} |
||||
} |
||||
]; |
||||
return { |
||||
type: "bi.left", |
||||
vgap: 200, |
||||
hgap: 20, |
||||
items: items |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.icon_button", Demo.Button); |
||||
@ -0,0 +1,24 @@
|
||||
Demo.Button = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-button" |
||||
}, |
||||
render: function () { |
||||
var items = [ |
||||
{ |
||||
el: { |
||||
type: 'bi.image_button', |
||||
src: "http://www.easyicon.net/api/resizeApi.php?id=1206741&size=128", |
||||
width: 100, |
||||
height: 100 |
||||
} |
||||
} |
||||
]; |
||||
return { |
||||
type: "bi.left", |
||||
vgap: 200, |
||||
hgap: 20, |
||||
items: items |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.image_button", Demo.Button); |
||||
@ -0,0 +1,23 @@
|
||||
Demo.Button = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-button" |
||||
}, |
||||
render: function () { |
||||
var items = [ |
||||
{ |
||||
el: { |
||||
type: 'bi.text_button', |
||||
text: '文字按钮', |
||||
height: 30 |
||||
} |
||||
} |
||||
]; |
||||
return { |
||||
type: "bi.left", |
||||
vgap: 200, |
||||
hgap: 20, |
||||
items: items |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.text_button", Demo.Button); |
||||
@ -1,11 +0,0 @@
|
||||
Demo.Button = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-face" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.vertical", |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.button", Demo.Button); |
||||
@ -0,0 +1,138 @@
|
||||
Demo.Label = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-label" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.vertical", |
||||
items: [{ |
||||
type: "bi.label", |
||||
cls: "layout-bg6", |
||||
text: "这是一个label控件，默认居中", |
||||
textAlign: "center" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg1", |
||||
text: "这是一个label控件, 高度为30，默认居中", |
||||
textAlign: "center", |
||||
height: 30 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg3", |
||||
text: "这是一个label控件，使用水平居左", |
||||
textAlign: "left", |
||||
height: 30 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg2", |
||||
text: "这是一个label控件，whiteSpace是normal，不设置高度，为了演示这个是真的是normal的，我凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数", |
||||
whiteSpace: "normal" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg5", |
||||
text: "这是一个label控件，whiteSpace是默认的nowrap，不设置高度，为了演示这个是真的是nowrap的，我凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg7", |
||||
text: "这是一个label控件，whiteSpace是默认的nowrap，高度为30，为了演示这个是真的是nowrap的，我凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数", |
||||
height: 30 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg3", |
||||
text: "这是一个label控件，whiteSpace设置为normal，高度为60，为了演示这个是真的是normal的，我凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数", |
||||
whiteSpace: "normal", |
||||
height: 60 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg5", |
||||
text: "这是一个label控件，whiteSpace设置为normal，textHeight控制text的lineHeight，这样可以实现换行效果，我凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数", |
||||
whiteSpace: "normal", |
||||
textHeight: 30, |
||||
height: 60 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg1", |
||||
text: "这是一个label控件，whiteSpace设置为nowrap，textWidth控制text的width", |
||||
textWidth: 200, |
||||
height: 60 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg8", |
||||
text: "这是一个label控件，whiteSpace设置为normal，textWidth控制text的width，这样可以实现换行效果，我凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数，凑点字数", |
||||
whiteSpace: "normal", |
||||
textWidth: 200, |
||||
height: 60 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg7", |
||||
text: "whiteSpace为默认的nowrap，高度设置为60，宽度设置为300", |
||||
height: 60, |
||||
width: 300 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg6", |
||||
text: "设置了宽度300，高度60，whiteSpace设置为normal", |
||||
whiteSpace: "normal", |
||||
width: 300, |
||||
height: 60 |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg8", |
||||
text: "textWidth设置为200，textHeight设置为30，width设置300，凑点字数看效果", |
||||
width: 300, |
||||
textWidth: 200, |
||||
textHeight: 30, |
||||
height: 60, |
||||
whiteSpace: "normal" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg1", |
||||
text: "textWidth设置为200，width设置300，看下水平居左的换行效果", |
||||
textAlign: "left", |
||||
width: 300, |
||||
textWidth: 200, |
||||
textHeight: 30, |
||||
height: 60, |
||||
whiteSpace: "normal" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg2", |
||||
text: "使用默认的nowrap，再去设置textHeight，只会有一行的效果", |
||||
textAlign: "left", |
||||
width: 300, |
||||
textWidth: 200, |
||||
textHeight: 30, |
||||
height: 60 |
||||
}, { |
||||
type: "bi.left", |
||||
items: [{ |
||||
type: "bi.label", |
||||
cls: "layout-bg3", |
||||
text: "在float布局中自适应的,不设高度和宽度，文字多长这个就有多长" |
||||
}], |
||||
height: 30 |
||||
}, { |
||||
type: "bi.left", |
||||
items: [{ |
||||
type: "bi.label", |
||||
cls: "layout-bg4", |
||||
text: "在float布局中自适应的，设置了宽度200，后面还有", |
||||
width: 200 |
||||
}], |
||||
height: 30 |
||||
}, { |
||||
type: "bi.left", |
||||
items: [{ |
||||
type: "bi.label", |
||||
text: "在float布局中自适应的，设置了高度，文字多长这个就有多长", |
||||
cls: "layout-bg5", |
||||
height: 30 |
||||
}], |
||||
height: 30 |
||||
}], |
||||
hgap: 300, |
||||
vgap: 20 |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.label", Demo.Label); |
||||
@ -0,0 +1,23 @@
|
||||
Demo.Message = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-bubble" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.center_adapt", |
||||
items : [ |
||||
{ |
||||
el : { |
||||
type : 'bi.button', |
||||
text : '点击我弹出一个消息框', |
||||
height : 30, |
||||
handler : function() { |
||||
BI.Msg.alert('测试消息框', '我是测试消息框的内容'); |
||||
} |
||||
} |
||||
} |
||||
] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.message", Demo.Message); |
||||
@ -0,0 +1,120 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.vertical", |
||||
items: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
text: "默认的分页" |
||||
}, { |
||||
type: "bi.pager", |
||||
height: 50, |
||||
pages: 18, |
||||
groups: 5, |
||||
curr: 6, |
||||
first: "首页", |
||||
last: "尾页" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
text: "显示上一页、下一页、首页、尾页" |
||||
}, { |
||||
type: "bi.pager", |
||||
dynamicShow: false, |
||||
height: 50, |
||||
pages: 18, |
||||
groups: 5, |
||||
curr: 1, |
||||
first: "首页>", |
||||
last: "<尾页" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
text: "显示上一页、下一页" |
||||
}, { |
||||
type: "bi.pager", |
||||
dynamicShow: false, |
||||
dynamicShowFirstLast: true, |
||||
height: 50, |
||||
pages: 18, |
||||
groups: 5, |
||||
curr: 1, |
||||
first: "首页>", |
||||
last: "<尾页" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
text: "自定义上一页、下一页" |
||||
}, { |
||||
type: "bi.pager", |
||||
dynamicShow: false, |
||||
height: 50, |
||||
pages: 18, |
||||
groups: 5, |
||||
curr: 6, |
||||
prev: { |
||||
type: "bi.button", |
||||
cls: "", |
||||
text: "上一页", |
||||
value: "prev", |
||||
once: false, |
||||
height: 30, |
||||
handler: function () { |
||||
|
||||
} |
||||
}, |
||||
next: { |
||||
type: "bi.button", |
||||
cls: "", |
||||
text: "下一页", |
||||
value: "next", |
||||
once: false, |
||||
handler: function () { |
||||
|
||||
} |
||||
} |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
text: "不知道总页数的情况(测试条件 1<=page<=3)" |
||||
}, { |
||||
type: "bi.pager", |
||||
dynamicShow: false, |
||||
height: 50, |
||||
pages: false, |
||||
curr: 1, |
||||
prev: { |
||||
type: "bi.button", |
||||
cls: "", |
||||
text: "上一页", |
||||
value: "prev", |
||||
once: false, |
||||
height: 30, |
||||
handler: function () { |
||||
|
||||
} |
||||
}, |
||||
next: { |
||||
type: "bi.button", |
||||
cls: "", |
||||
text: "下一页", |
||||
value: "next", |
||||
once: false, |
||||
handler: function () { |
||||
|
||||
} |
||||
}, |
||||
hasPrev: function (v) { |
||||
return v > 1; |
||||
}, |
||||
hasNext: function (v) { |
||||
return v < 3; |
||||
} |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.pager", Demo.Func); |
||||
@ -0,0 +1,32 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var svg = BI.createWidget({ |
||||
type: "bi.svg", |
||||
width: 500, |
||||
height: 600 |
||||
}); |
||||
|
||||
var circle = svg.circle(100, 100, 10); |
||||
circle.animate({fill: "#223fa3", stroke: "#000", "stroke-width": 80, "stroke-opacity": 0.5}, 2000); |
||||
|
||||
var el = svg.rect(10, 200, 300, 200); |
||||
el.transform("t100,100r45t-100,0"); |
||||
|
||||
svg.path("M10,10L50,50M50,10L10,50") |
||||
.attr({stroke: "red"}); |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: svg, |
||||
left: 100, |
||||
top: 50 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.svg", Demo.Func); |
||||
@ -0,0 +1,33 @@
|
||||
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-editor" |
||||
}, |
||||
render: function () { |
||||
var editor = BI.createWidget({ |
||||
type: "bi.code_editor", |
||||
cls: "mvc-border", |
||||
width: 600, |
||||
height: 400 |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.vertical", |
||||
element: this, |
||||
hgap: 30, |
||||
vgap: 20, |
||||
items: [editor, { |
||||
type: "bi.button", |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.toast(JSON.stringify(editor.getValue())); |
||||
} |
||||
}, { |
||||
type: "bi.button", |
||||
text: "setValue", |
||||
handler: function () { |
||||
editor.setValue("测试数据"); |
||||
} |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.code_editor", Demo.CodeEditor); |
||||
@ -0,0 +1,96 @@
|
||||
Demo.Editor = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-editor" |
||||
}, |
||||
render: function () { |
||||
var editor1 = BI.createWidget({ |
||||
type: "bi.editor", |
||||
cls: "mvc-border", |
||||
watermark: "alert信息显示在下面", |
||||
errorText: "字段不可重名!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", |
||||
width: 200, |
||||
height: 30 |
||||
}); |
||||
editor1.on(BI.Editor.EVENT_ENTER, function () { |
||||
editor1.blur(); |
||||
}); |
||||
var editor2 = BI.createWidget({ |
||||
type: "bi.editor", |
||||
cls: "mvc-border", |
||||
watermark: "输入'a'会有错误信息", |
||||
disabled: true, |
||||
errorText: "字段不可重名", |
||||
validationChecker: function (v) { |
||||
if (v == "a") { |
||||
return false; |
||||
} |
||||
return true; |
||||
}, |
||||
allowBlank: true, |
||||
width: 200, |
||||
height: 30 |
||||
}); |
||||
var editor3 = BI.createWidget({ |
||||
type: "bi.editor", |
||||
cls: "mvc-border", |
||||
watermark: "输入'a'会有错误信息且回车键不能退出编辑", |
||||
errorText: "字段不可重名", |
||||
validationChecker: function (v) { |
||||
if (v == "a") { |
||||
return false; |
||||
} |
||||
return true; |
||||
}, |
||||
quitChecker: function (v) { |
||||
return false; |
||||
}, |
||||
allowBlank: true, |
||||
width: 300, |
||||
height: 30 |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: editor1, |
||||
left: 0, |
||||
top: 0 |
||||
}, { |
||||
el: editor2, |
||||
left: 250, |
||||
top: 30 |
||||
}, { |
||||
el: editor3, |
||||
left: 500, |
||||
top: 60 |
||||
}, { |
||||
el: { |
||||
type: "bi.button", |
||||
text: "disable", |
||||
handler: function () { |
||||
editor1.setEnable(false); |
||||
editor2.setEnable(false); |
||||
editor3.setEnable(false); |
||||
}, |
||||
height: 30 |
||||
}, |
||||
left: 100, |
||||
bottom: 60 |
||||
}, { |
||||
el: { |
||||
type: "bi.button", |
||||
text: "enable", |
||||
handler: function () { |
||||
editor1.setEnable(true); |
||||
editor2.setEnable(true); |
||||
editor3.setEnable(true); |
||||
}, |
||||
height: 30 |
||||
}, |
||||
left: 200, |
||||
bottom: 60 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.editor", Demo.Editor); |
||||
@ -0,0 +1,21 @@
|
||||
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-editor" |
||||
}, |
||||
render: function () { |
||||
this.formula = BI.createWidget({ |
||||
type : 'bi.formula_editor', |
||||
width : 300, |
||||
height : 200, |
||||
value : 'SUM(C5, 16, 26)' |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.left", |
||||
element: this, |
||||
items: [this.formula], |
||||
hgap: 20, |
||||
vgap: 20 |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.formula_editor", Demo.CodeEditor); |
||||
@ -0,0 +1,26 @@
|
||||
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-editor" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.absolute", |
||||
items: [{ |
||||
el: { |
||||
type: "bi.adaptive", |
||||
cls: "layout-bg1", |
||||
items: [{ |
||||
type: "bi.multifile_editor", |
||||
width: 400, |
||||
height: 300 |
||||
}], |
||||
width: 400, |
||||
height: 300 |
||||
}, |
||||
top: 50, |
||||
left: 50 |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.multifile_editor", Demo.CodeEditor); |
||||
@ -0,0 +1,39 @@
|
||||
Demo.CodeEditor = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-editor" |
||||
}, |
||||
render: function () { |
||||
var editor = BI.createWidget({ |
||||
type: "bi.textarea_editor", |
||||
cls: "mvc-border", |
||||
width: 600, |
||||
height: 400 |
||||
}); |
||||
editor.on(BI.TextAreaEditor.EVENT_FOCUS, function () { |
||||
BI.Msg.toast("Focus"); |
||||
}); |
||||
editor.on(BI.TextAreaEditor.EVENT_BLUR, function () { |
||||
BI.Msg.toast("Blur"); |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.vertical", |
||||
element: this, |
||||
hgap: 30, |
||||
vgap: 20, |
||||
items: [editor, { |
||||
type: "bi.button", |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.toast(JSON.stringify(editor.getValue())); |
||||
} |
||||
}, { |
||||
type: "bi.button", |
||||
text: "setValue", |
||||
handler: function () { |
||||
editor.setValue("测试数据"); |
||||
} |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.textarea_editor", Demo.CodeEditor); |
||||
@ -0,0 +1,62 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var items = [], header = [], columnSize = []; |
||||
|
||||
var rowCount = 100, columnCount = 100; |
||||
for (var i = 0; i < 1; i++) { |
||||
header[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
header[i][j] = { |
||||
type: "bi.label", |
||||
text: "表头" + i + "-" + j |
||||
} |
||||
columnSize[j] = 100; |
||||
} |
||||
} |
||||
for (var i = 0; i < rowCount; i++) { |
||||
items[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
items[i][j] = { |
||||
type: "bi.label", |
||||
text: (i < 3 ? 0 : i) + "-" + j |
||||
} |
||||
} |
||||
} |
||||
|
||||
var table = BI.createWidget({ |
||||
type: "bi.resizable_table", |
||||
el: { |
||||
type: "bi.collection_table" |
||||
}, |
||||
width: 600, |
||||
height: 500, |
||||
isResizeAdapt: true, |
||||
isNeedResize: true, |
||||
isNeedMerge: true, |
||||
mergeCols: [0, 1], |
||||
mergeRule: function (col1, col2) { |
||||
return BI.isEqual(col1, col2); |
||||
}, |
||||
isNeedFreeze: true, |
||||
freezeCols: [0, 1], |
||||
columnSize: columnSize, |
||||
items: items, |
||||
header: header |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: table, |
||||
left: 10, |
||||
right: 10, |
||||
top: 10, |
||||
bottom: 10 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.collection_table", Demo.Func); |
||||
@ -0,0 +1,57 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var items = [], header = [], columnSize = []; |
||||
|
||||
var rowCount = 100, columnCount = 100; |
||||
for (var i = 0; i < 1; i++) { |
||||
header[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
header[i][j] = { |
||||
type: "bi.label", |
||||
text: "表头" + i + "-" + j |
||||
} |
||||
columnSize[j] = 100; |
||||
} |
||||
} |
||||
for (var i = 0; i < rowCount; i++) { |
||||
items[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
items[i][j] = { |
||||
type: "bi.label", |
||||
text: (i < 3 ? 0 : i) + "-" + j |
||||
} |
||||
} |
||||
} |
||||
|
||||
var table = BI.createWidget({ |
||||
type: "bi.resizable_table", |
||||
el: { |
||||
type: "bi.grid_table", |
||||
}, |
||||
width: 600, |
||||
height: 500, |
||||
isResizeAdapt: true, |
||||
isNeedResize: true, |
||||
isNeedFreeze: true, |
||||
freezeCols: [0, 1], |
||||
columnSize: columnSize, |
||||
items: items, |
||||
header: header |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: table, |
||||
left: 10, |
||||
right: 10, |
||||
top: 10, |
||||
bottom: 10 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.grid_table", Demo.Func); |
||||
@ -0,0 +1,57 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var items = [], header = [], columnSize = []; |
||||
|
||||
var rowCount = 100, columnCount = 100; |
||||
for (var i = 0; i < 1; i++) { |
||||
header[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
header[i][j] = { |
||||
type: "bi.label", |
||||
text: "表头" + i + "-" + j |
||||
} |
||||
columnSize[j] = 100; |
||||
} |
||||
} |
||||
for (var i = 0; i < rowCount; i++) { |
||||
items[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
items[i][j] = { |
||||
type: "bi.label", |
||||
text: (i < 3 ? 0 : i) + "-" + j |
||||
} |
||||
} |
||||
} |
||||
|
||||
var table = BI.createWidget({ |
||||
type: "bi.resizable_table", |
||||
el: { |
||||
type: "bi.grid_table", |
||||
}, |
||||
width: 600, |
||||
height: 500, |
||||
isResizeAdapt: true, |
||||
isNeedResize: true, |
||||
isNeedFreeze: true, |
||||
freezeCols: [0, 1], |
||||
columnSize: columnSize, |
||||
items: items, |
||||
header: header |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: table, |
||||
left: 10, |
||||
right: 10, |
||||
top: 10, |
||||
bottom: 10 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.resizable_table", Demo.Func); |
||||
@ -0,0 +1,367 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var items = [[{ |
||||
text: "第一行第一列" |
||||
}, { |
||||
text: "第一行第一列" |
||||
}, { |
||||
text: "第一行第一列" |
||||
}], [{ |
||||
text: "第一行第一列" |
||||
}, { |
||||
text: "第一行第一列" |
||||
}, { |
||||
text: "第一行第一列" |
||||
}], [{ |
||||
text: "第三行第一列" |
||||
}, { |
||||
text: "第三行第二列" |
||||
}, { |
||||
text: "第三行第三列" |
||||
}], [{ |
||||
text: "第四行第一列" |
||||
}, { |
||||
text: "第四行第二列" |
||||
}, { |
||||
text: "第四行第三列" |
||||
}], [{ |
||||
text: "第五行第一列" |
||||
}, { |
||||
text: "第五行第二列" |
||||
}, { |
||||
text: "第五行第三列" |
||||
}], [{ |
||||
text: "第六行第一列" |
||||
}, { |
||||
text: "第六行第二列" |
||||
}, { |
||||
text: "第六行第三列" |
||||
}], [{ |
||||
text: "第七行第一列" |
||||
}, { |
||||
text: "第七行第二列" |
||||
}, { |
||||
text: "第七行第三列" |
||||
}], [{ |
||||
text: "第八行第一列" |
||||
}, { |
||||
text: "第八行第二列" |
||||
}, { |
||||
text: "第八行第三列" |
||||
}], [{ |
||||
text: "第九行第一列" |
||||
}, { |
||||
text: "第九行第二列" |
||||
}, { |
||||
text: "第九行第三列" |
||||
}], [{ |
||||
text: "第十行第一列" |
||||
}, { |
||||
text: "第十行第二列" |
||||
}, { |
||||
text: "第十行第三列" |
||||
}], [{ |
||||
text: "第十一行第一列" |
||||
}, { |
||||
text: "第十一行第二列" |
||||
}, { |
||||
text: "第十一行第三列" |
||||
}], [{ |
||||
text: "第十二行第一列" |
||||
}, { |
||||
text: "第十二行第二列" |
||||
}, { |
||||
text: "第十二行第三列" |
||||
}], [{ |
||||
text: "第十三行第一列" |
||||
}, { |
||||
text: "第十三行第二列" |
||||
}, { |
||||
text: "第十三行第三列" |
||||
}], [{ |
||||
text: "第十四行第一列" |
||||
}, { |
||||
text: "第十四行第二列" |
||||
}, { |
||||
text: "第十四行第三列" |
||||
}], [{ |
||||
text: "第十五行第一列" |
||||
}, { |
||||
text: "第十五行第二列" |
||||
}, { |
||||
text: "第十五行第三列" |
||||
}], [{ |
||||
text: "第十六行第一列" |
||||
}, { |
||||
text: "第十六行第二列" |
||||
}, { |
||||
text: "第十六行第三列" |
||||
}], [{ |
||||
text: "第十七行第一列" |
||||
}, { |
||||
text: "第十七行第二列" |
||||
}, { |
||||
text: "第十七行第三列" |
||||
}], [{ |
||||
text: "第十八行第一列" |
||||
}, { |
||||
text: "第十八行第二列" |
||||
}, { |
||||
text: "第十八行第三列" |
||||
}]]; |
||||
|
||||
|
||||
var items2 = [[{ |
||||
text: "第一行第一列" |
||||
}, { |
||||
text: "第一行第二列" |
||||
}, { |
||||
text: "第一行第三列" |
||||
}, { |
||||
text: "第一行第四列" |
||||
}, { |
||||
text: "第一行第五列" |
||||
}], [{ |
||||
text: "第二行第一列" |
||||
}, { |
||||
text: "第二行第二列" |
||||
}, { |
||||
text: "第二行第三列" |
||||
}, { |
||||
text: "第二行第四列" |
||||
}, { |
||||
text: "第二行第五列" |
||||
}], [{ |
||||
text: "第二行第一列" |
||||
}, { |
||||
text: "第二行第二列" |
||||
}, { |
||||
text: "第三行第三列" |
||||
}, { |
||||
text: "第三行第四列" |
||||
}, { |
||||
text: "第三行第五列" |
||||
}], [{ |
||||
text: "第二行第一列" |
||||
}, { |
||||
text: "第四行第二列" |
||||
}, { |
||||
text: "第四行第三列" |
||||
}, { |
||||
text: "第四行第四列" |
||||
}, { |
||||
text: "第四行第五列" |
||||
}] |
||||
|
||||
|
||||
, [{ |
||||
text: "第五行第一列" |
||||
}, { |
||||
text: "第五行第一列" |
||||
}, { |
||||
text: "第五行第三列" |
||||
}, { |
||||
text: "第五行第四列" |
||||
}, { |
||||
text: "第五行第五列" |
||||
}], [{ |
||||
text: "第六行第一列" |
||||
}, { |
||||
text: "第六行第一列" |
||||
}, { |
||||
text: "第六行第三列" |
||||
}, { |
||||
text: "第六行第四列" |
||||
}, { |
||||
text: "第六行第五列" |
||||
}], [{ |
||||
text: "第七行第一列" |
||||
}, { |
||||
text: "第七行第二列" |
||||
}, { |
||||
text: "第七行第三列" |
||||
}, { |
||||
text: "第七行第四列" |
||||
}, { |
||||
text: "第七行第五列" |
||||
}], [{ |
||||
text: "第八行第一列" |
||||
}, { |
||||
text: "第八行第二列" |
||||
}, { |
||||
text: "第八行第三列" |
||||
}, { |
||||
text: "第八行第四列" |
||||
}, { |
||||
text: "第八行第五列" |
||||
}], [{ |
||||
text: "第九行第一列" |
||||
}, { |
||||
text: "第九行第二列" |
||||
}, { |
||||
text: "第九行第三列" |
||||
}, { |
||||
text: "第九行第四列" |
||||
}, { |
||||
text: "第九行第五列" |
||||
}], [{ |
||||
text: "第十行第一列" |
||||
}, { |
||||
text: "第十行第二列" |
||||
}, { |
||||
text: "第十行第三列" |
||||
}, { |
||||
text: "第十行第四列" |
||||
}, { |
||||
text: "第十行第五列" |
||||
}], [{ |
||||
text: "第十一行第一列" |
||||
}, { |
||||
text: "第十一行第二列" |
||||
}, { |
||||
text: "第十一行第三列" |
||||
}, { |
||||
text: "第十一行第四列" |
||||
}, { |
||||
text: "第十一行第五列" |
||||
}], [{ |
||||
text: "第十二行第一列" |
||||
}, { |
||||
text: "第十二行第二列" |
||||
}, { |
||||
text: "第十二行第三列" |
||||
}, { |
||||
text: "第十二行第四列" |
||||
}, { |
||||
text: "第十二行第五列" |
||||
}], [{ |
||||
text: "第十三行第一列" |
||||
}, { |
||||
text: "第十三行第二列" |
||||
}, { |
||||
text: "第十三行第三列" |
||||
}, { |
||||
text: "第十三行第四列" |
||||
}, { |
||||
text: "第十三行第五列" |
||||
}], [{ |
||||
text: "第十四行第一列" |
||||
}, { |
||||
text: "第十四行第二列" |
||||
}, { |
||||
text: "第十四行第三列" |
||||
}, { |
||||
text: "第十四行第四列" |
||||
}, { |
||||
text: "第十四行第五列" |
||||
}]]; |
||||
|
||||
var header = [[{ |
||||
text: "表头1" |
||||
}, { |
||||
text: "表头2" |
||||
}, { |
||||
text: "表头3" |
||||
}]]; |
||||
|
||||
var header2 = [[{ |
||||
text: "表头1" |
||||
}, { |
||||
text: "表头2" |
||||
}, { |
||||
text: "表头3" |
||||
}, { |
||||
text: "表头4" |
||||
}, { |
||||
text: "表头5" |
||||
}]]; |
||||
|
||||
var table1 = BI.createWidget({ |
||||
type: "bi.table_view", |
||||
isNeedResize: true, |
||||
isNeedMerge: true, |
||||
mergeCols: [0, 1], |
||||
columnSize: [100, 200, 300], |
||||
items: items, |
||||
header: header |
||||
}); |
||||
var table2 = BI.createWidget({ |
||||
type: "bi.table_view", |
||||
isNeedMerge: true, |
||||
isNeedFreeze: true, |
||||
freezeCols: [0, 1], |
||||
mergeCols: [0, 1], |
||||
columnSize: [100, 200, 300, 400, 500], |
||||
items: items2, |
||||
header: header2 |
||||
}); |
||||
var table3 = BI.createWidget({ |
||||
type: "bi.table_view", |
||||
isNeedMerge: true, |
||||
isNeedFreeze: true, |
||||
freezeCols: [4], |
||||
mergeCols: [0, 1], |
||||
columnSize: [100, 200, 300, 400, 100], |
||||
items: items2, |
||||
header: header2 |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: { |
||||
type: "bi.grid", |
||||
columns: 2, |
||||
rows: 2, |
||||
items: [{ |
||||
column: 0, |
||||
row: 0, |
||||
el: table1 |
||||
}, { |
||||
column: 1, |
||||
row: 0, |
||||
el: table2 |
||||
}, { |
||||
column: 0, |
||||
row: 1, |
||||
el: table3 |
||||
}, { |
||||
column: 1, |
||||
row: 1, |
||||
el: { |
||||
type: "bi.vertical", |
||||
items: [{ |
||||
type: "bi.button", |
||||
text: "第一个表setColumnSize([300, 200, 100])", |
||||
handler: function () { |
||||
table1.setColumnSize([300, 200, 100]); |
||||
} |
||||
}, { |
||||
type: "bi.button", |
||||
text: "第二个表setColumnSize([50, 100, 150, 200, 250])", |
||||
handler: function () { |
||||
table2.setColumnSize([50, 100, 150, 200, 250]); |
||||
} |
||||
}, { |
||||
type: "bi.button", |
||||
text: "第三个表setColumnSize([50, 100, 150, 200, 50])", |
||||
handler: function () { |
||||
table3.setColumnSize([50, 100, 150, 200, 50]); |
||||
} |
||||
}], |
||||
vgap: 10 |
||||
} |
||||
}] |
||||
}, |
||||
left: 10, |
||||
right: 10, |
||||
top: 10, |
||||
bottom: 10 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.table_view", Demo.Func); |
||||
@ -0,0 +1,58 @@
|
||||
Demo.Bubble = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-bubble" |
||||
}, |
||||
render: function () { |
||||
var btns = []; |
||||
var items = [ |
||||
{ |
||||
el: { |
||||
ref: function (_ref) { |
||||
btns.push(_ref); |
||||
}, |
||||
type: 'bi.button', |
||||
text: 'bubble测试', |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Bubbles.show("singleBubble1", "bubble测试", this); |
||||
} |
||||
} |
||||
}, { |
||||
el: { |
||||
ref: function (_ref) { |
||||
btns.push(_ref); |
||||
}, |
||||
type: 'bi.button', |
||||
text: 'bubble测试(居中显示)', |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Bubbles.show("singleBubble2", "bubble测试", this, { |
||||
offsetStyle: "center" |
||||
}); |
||||
} |
||||
} |
||||
}, { |
||||
el: { |
||||
ref: function (_ref) { |
||||
btns.push(_ref); |
||||
}, |
||||
type: 'bi.button', |
||||
text: 'bubble测试(右边显示)', |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Bubbles.show("singleBubble3", "bubble测试", this, { |
||||
offsetStyle: "right" |
||||
}); |
||||
} |
||||
} |
||||
} |
||||
]; |
||||
return { |
||||
type: "bi.left", |
||||
vgap: 200, |
||||
hgap: 20, |
||||
items: items |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.bubble", Demo.Bubble); |
||||
@ -0,0 +1,39 @@
|
||||
Demo.Title = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-title" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.vertical", |
||||
items: [{ |
||||
type: "bi.label", |
||||
cls: "layout-bg1", |
||||
height: 50, |
||||
title: "title提示", |
||||
text: "移上去有title提示", |
||||
textAlign: "center" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg6", |
||||
height: 50, |
||||
disabled: true, |
||||
warningTitle: "title错误提示", |
||||
text: "移上去有title错误提示", |
||||
textAlign: "center" |
||||
}, { |
||||
type: "bi.label", |
||||
cls: "layout-bg2", |
||||
height: 50, |
||||
disabled: true, |
||||
tipType: "success", |
||||
title: "自定义title提示效果", |
||||
warningTitle: "自定义title提示效果", |
||||
text: "自定义title提示效果", |
||||
textAlign: "center" |
||||
}], |
||||
hgap: 300, |
||||
vgap: 20 |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.title", Demo.Title); |
||||
@ -0,0 +1,55 @@
|
||||
Demo.Toast = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-toast" |
||||
}, |
||||
render: function () { |
||||
var items = [ |
||||
{ |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '简单Toast测试', |
||||
height : 30, |
||||
handler: function(){ |
||||
BI.Msg.toast("这是一条简单的数据"); |
||||
} |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '很长的Toast测试', |
||||
height : 30, |
||||
handler: function(){ |
||||
BI.Msg.toast("这是一条很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的数据") |
||||
} |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '非常长的Toast测试', |
||||
height : 30, |
||||
handler: function(){ |
||||
BI.Msg.toast("这是一条非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长非常长的数据") |
||||
} |
||||
} |
||||
}, { |
||||
el: { |
||||
type: 'bi.button', |
||||
text: '错误提示Toast测试', |
||||
level: "warning", |
||||
height : 30, |
||||
handler: function(){ |
||||
BI.Msg.toast("错误提示Toast测试", "warning"); |
||||
} |
||||
} |
||||
} |
||||
]; |
||||
BI.createWidget({ |
||||
type: "bi.left", |
||||
element: this, |
||||
vgap : 200, |
||||
hgap : 20, |
||||
items: items |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.toast", Demo.Toast); |
||||
@ -0,0 +1,9 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
} |
||||
}); |
||||
$.shortcut("demo.part_tree", Demo.Func); |
||||
@ -0,0 +1,9 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
} |
||||
}); |
||||
$.shortcut("demo.sync_tree", Demo.Func); |
||||
@ -0,0 +1,52 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
_createDefaultTree: function(){ |
||||
var tree = BI.createWidget({ |
||||
type: "bi.tree_view" |
||||
}); |
||||
tree.initTree([ |
||||
{"id":1, "pId":0, "text":"test1", open:true}, |
||||
{"id":11, "pId":1, "text":"test11"}, |
||||
{"id":12, "pId":1, "text":"test12"}, |
||||
{"id":111, "pId":11, "text":"test111"}, |
||||
{"id":2, "pId":0, "text":"test2", open:true}, |
||||
{"id":21, "pId":2, "text":"test21"}, |
||||
{"id":22, "pId":2, "text":"test22"} |
||||
]) |
||||
return tree; |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this; |
||||
BI.createWidget({ |
||||
type: "bi.grid", |
||||
columns: 1, |
||||
rows: 1, |
||||
element: this, |
||||
items: [{ |
||||
column: 0, |
||||
row: 0, |
||||
el: { |
||||
type: "bi.vtape", |
||||
items: [ |
||||
{ |
||||
el: this._createDefaultTree() |
||||
}, |
||||
{ |
||||
el: { |
||||
type: "bi.label", |
||||
text: 'tree.initTree([{"id":1, "pId":0, "text":"test1", open:true},{"id":11, "pId":1, "text":"test11"},{"id":12, "pId":1, "text":"test12"},{"id":111, "pId":11, "text":"test111"}])', |
||||
whiteSpace: "normal" |
||||
}, |
||||
height: 50 |
||||
} |
||||
] |
||||
} |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.tree_view", Demo.Func); |
||||
@ -0,0 +1,96 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
_createNav: function(v){ |
||||
var m = this.MONTH, y = this.YEAR; |
||||
m += v; |
||||
while(m < 0){ |
||||
y--; |
||||
m += 12; |
||||
} |
||||
while(m > 11){ |
||||
y++; |
||||
m -= 12; |
||||
} |
||||
var calendar = BI.createWidget({ |
||||
type: "bi.calendar", |
||||
logic: { |
||||
dynamic: false |
||||
}, |
||||
year: y, |
||||
month: m, |
||||
day: this.DAY |
||||
}) |
||||
calendar.setValue(this.selectedTime); |
||||
return calendar; |
||||
}, |
||||
|
||||
_stringfyTimeObject: function(timeOb){ |
||||
return timeOb.year + "-" + (timeOb.month + 1) + "-" + timeOb.day; |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this; |
||||
var combo1 = BI.createWidget({ |
||||
type: "bi.bubble_combo", |
||||
el: { |
||||
type: "bi.button", |
||||
text: "测试", |
||||
height: 25 |
||||
}, |
||||
popup: { |
||||
el: { |
||||
type: "bi.button_group", |
||||
items: BI.makeArray(100, { |
||||
type: "bi.text_item", |
||||
height: 25, |
||||
text: "item" |
||||
}), |
||||
layouts: [{ |
||||
type: "bi.vertical" |
||||
}] |
||||
}, |
||||
maxHeight: 200 |
||||
} |
||||
}) |
||||
var combo2 = BI.createWidget({ |
||||
type: "bi.bubble_combo", |
||||
el: { |
||||
type: "bi.button", |
||||
text: "测试", |
||||
height: 25 |
||||
}, |
||||
popup: { |
||||
type: "bi.bubble_bar_popup_view", |
||||
el: { |
||||
type: "bi.button_group", |
||||
items: BI.makeArray(100, { |
||||
type: "bi.text_item", |
||||
height: 25, |
||||
text: "item" |
||||
}), |
||||
layouts: [{ |
||||
type: "bi.vertical" |
||||
}] |
||||
}, |
||||
maxHeight: 200, |
||||
minWidth: 600 |
||||
} |
||||
}) |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: combo1, |
||||
left: 100, |
||||
top: 100 |
||||
}, { |
||||
el: combo2, |
||||
left: 100, |
||||
bottom: 100 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.bubble_combo", Demo.Func); |
||||
@ -0,0 +1,84 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
_createNav: function(v){ |
||||
var m = this.MONTH, y = this.YEAR; |
||||
m += v; |
||||
while(m < 0){ |
||||
y--; |
||||
m += 12; |
||||
} |
||||
while(m > 11){ |
||||
y++; |
||||
m -= 12; |
||||
} |
||||
var calendar = BI.createWidget({ |
||||
type: "bi.calendar", |
||||
logic: { |
||||
dynamic: false |
||||
}, |
||||
year: y, |
||||
month: m, |
||||
day: this.DAY |
||||
}) |
||||
calendar.setValue(this.selectedTime); |
||||
return calendar; |
||||
}, |
||||
|
||||
_stringfyTimeObject: function(timeOb){ |
||||
return timeOb.year + "-" + (timeOb.month + 1) + "-" + timeOb.day; |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this, d = new Date(); |
||||
this.YEAR = d.getFullYear(); |
||||
this.MONTH = d.getMonth(); |
||||
this.DAY = d.getDate(); |
||||
|
||||
this.selectedTime = { |
||||
year: this.YEAR, |
||||
month: this.MONTH, |
||||
day: this.DAY |
||||
}; |
||||
|
||||
var tip = BI.createWidget({ |
||||
type: "bi.label" |
||||
}); |
||||
|
||||
var nav = BI.createWidget({ |
||||
type: "bi.navigation", |
||||
element: this, |
||||
tab: { |
||||
height: 30, |
||||
items: [{ |
||||
once: false, |
||||
text: "后退", |
||||
value: -1, |
||||
cls: "mvc-button layout-bg3" |
||||
},tip, { |
||||
once: false, |
||||
text: "前进", |
||||
value: 1, |
||||
cls: "mvc-button layout-bg4" |
||||
}] |
||||
}, |
||||
cardCreator: BI.bind(this._createNav, this), |
||||
|
||||
afterCardCreated: function(){ |
||||
|
||||
}, |
||||
|
||||
afterCardShow: function(){ |
||||
this.setValue(self.selectedTime); |
||||
} |
||||
}) |
||||
|
||||
nav.on(BI.Navigation.EVENT_CHANGE, function(){ |
||||
self.selectedTime = nav.getValue(); |
||||
tip.setText(self._stringfyTimeObject(self.selectedTime)); |
||||
}); |
||||
tip.setText(this._stringfyTimeObject(this.selectedTime)); |
||||
} |
||||
}); |
||||
$.shortcut("demo.calendar", Demo.Func); |
||||
@ -0,0 +1,21 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
return { |
||||
type: "bi.absolute", |
||||
items: [{ |
||||
el: { |
||||
type: "bi.color_chooser", |
||||
width: 30, |
||||
height: 30 |
||||
}, |
||||
left: 100, |
||||
top: 250 |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.color_chooser", Demo.Func); |
||||
@ -0,0 +1,35 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
var canvas = BI.createWidget({ |
||||
type: "bi.complex_canvas", |
||||
width: 500, |
||||
height: 600 |
||||
}); |
||||
canvas.branch(55, 100, 10, 10, 100, 10, 200, 10, { |
||||
offset: 20, |
||||
strokeStyle: "red", |
||||
lineWidth: 2 |
||||
}); |
||||
|
||||
canvas.branch(220, 155, 120, 110, 150, 200, { |
||||
offset: 40 |
||||
}); |
||||
|
||||
canvas.stroke(); |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: canvas, |
||||
left: 100, |
||||
top: 50 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.complex_canvas", Demo.Func); |
||||
@ -0,0 +1,42 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
var editor = BI.createWidget({ |
||||
type: "bi.text_editor", |
||||
width: 200, |
||||
height: 30, |
||||
value: "这是复制的内容" |
||||
}); |
||||
var zclip = BI.createWidget({ |
||||
type: 'bi.zero_clip', |
||||
width: 100, |
||||
height: 100, |
||||
cls: 'layout-bg1', |
||||
copy: function () { |
||||
return editor.getValue(); |
||||
}, |
||||
|
||||
afterCopy: function () { |
||||
BI.Msg.toast(editor.getValue()); |
||||
} |
||||
}); |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: editor, |
||||
left: 100, |
||||
top: 50, |
||||
}, { |
||||
el: zclip, |
||||
left: 100, |
||||
top: 100 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.zclip", Demo.Func); |
||||
@ -0,0 +1,149 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
var relation = BI.createWidget({ |
||||
type: "bi.branch_relation", |
||||
items: [ |
||||
{ |
||||
id: -1, |
||||
value: "根目录", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 1, |
||||
pId: -1, |
||||
value: "第一级目录1", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 11, |
||||
pId: 1, |
||||
value: "第二级文件1", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 12, |
||||
pId: 1, |
||||
value: "第二级目录1", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 121, |
||||
pId: 12, |
||||
value: "第三级目录1", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 122, |
||||
pId: 12, |
||||
value: "第三级文件1", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 1211, |
||||
pId: 121, |
||||
value: "第四级目录", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 12111, |
||||
pId: 1211, |
||||
value: "第五级文件1", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 2, |
||||
pId: -1, |
||||
value: "第一级目录2", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 21, |
||||
pId: 2, |
||||
value: "第二级目录2", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 22, |
||||
pId: 2, |
||||
value: "第二级文件2", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 211, |
||||
pId: 21, |
||||
value: "第三级目录2", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 212, |
||||
pId: 21, |
||||
value: "第三级文件2", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
}, |
||||
{ |
||||
id: 2111, |
||||
pId: 211, |
||||
value: "第四级文件2", |
||||
type: "bi.text_button", |
||||
cls: "layout-bg2", |
||||
width: 180, |
||||
height: 100 |
||||
} |
||||
], |
||||
|
||||
direction: BI.Direction.Right, |
||||
align: BI.HorizontalAlign.Right, |
||||
|
||||
centerOffset: -50 |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.adaptive", |
||||
element: this, |
||||
items: [relation] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.branch_relation", Demo.Func); |
||||
@ -0,0 +1,233 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
_createBranchTree: function () { |
||||
var tree = BI.createWidget({ |
||||
type: "bi.branch_tree", |
||||
items: [{ |
||||
el: { |
||||
text: "且", |
||||
value: "且1", |
||||
cls: "layout-bg7" |
||||
}, |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1", |
||||
value: "这里是一段文字1" |
||||
}, { |
||||
el: { |
||||
text: "或", |
||||
value: "或2", |
||||
cls: "layout-bg7" |
||||
}, |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1435", |
||||
value: "这里是一段文字1435" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xx", |
||||
value: "这里是一段文字1xx" |
||||
}, { |
||||
el: { |
||||
text: "且", |
||||
value: "且3", |
||||
cls: "layout-bg7" |
||||
}, |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件", |
||||
value: "可以理解为一个条件" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件v", |
||||
value: "可以理解为一个条件v" |
||||
}] |
||||
}] |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xa", |
||||
value: "这里是一段文字1xa" |
||||
}] |
||||
}] |
||||
}); |
||||
return tree; |
||||
}, |
||||
|
||||
_createBranchMapTree: function () { |
||||
var tree = BI.createWidget({ |
||||
type: "bi.branch_tree", |
||||
el: { |
||||
type: "bi.virtual_group" |
||||
}, |
||||
items: [{ |
||||
text: "且", |
||||
value: "且1", |
||||
cls: "layout-bg7", |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1", |
||||
value: "这里是一段文字1" |
||||
}, { |
||||
text: "或", |
||||
value: "或2", |
||||
cls: "layout-bg7", |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1435", |
||||
value: "这里是一段文字1435" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xx", |
||||
value: "这里是一段文字1xx" |
||||
}, { |
||||
text: "且", |
||||
value: "且3", |
||||
cls: "layout-bg7", |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件", |
||||
value: "可以理解为一个条件" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件v", |
||||
value: "可以理解为一个条件v" |
||||
}] |
||||
}] |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xa", |
||||
value: "这里是一段文字1xa" |
||||
}] |
||||
}] |
||||
}); |
||||
return tree; |
||||
}, |
||||
|
||||
render: function () { |
||||
var tree = this._createBranchTree(); |
||||
var mapTree = this._createBranchMapTree(); |
||||
|
||||
function getItems() { |
||||
return [{ |
||||
text: "且", |
||||
value: "且", |
||||
cls: "layout-bg7", |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字", |
||||
value: "这里是一段文字" |
||||
}, { |
||||
text: "或", |
||||
value: "或2", |
||||
cls: "layout-bg7", |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字", |
||||
value: "这里是一段文字" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字" , |
||||
value: "这里是一段文字" |
||||
}, { |
||||
text: "且", |
||||
value: "且3", |
||||
cls: "layout-bg7", |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件", |
||||
value: "可以理解为一个条件" |
||||
}] |
||||
}] |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xa", |
||||
value: "这里是一段文字1xa" |
||||
}] |
||||
}]; |
||||
} |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.center", |
||||
element: this, |
||||
items: [{ |
||||
type: "bi.vtape", |
||||
items: [{ |
||||
el: tree |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.alert("", tree.getValue()); |
||||
} |
||||
} |
||||
}] |
||||
}, { |
||||
type: "bi.vtape", |
||||
items: [{ |
||||
el: mapTree |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "populate", |
||||
handler: function () { |
||||
mapTree.populate(getItems()); |
||||
} |
||||
} |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.alert("", mapTree.getValue()); |
||||
} |
||||
} |
||||
}] |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.branch_tree", Demo.Func); |
||||
@ -0,0 +1,43 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
var tree = BI.createWidget({ |
||||
type: "bi.display_tree", |
||||
element: this |
||||
}); |
||||
|
||||
tree.initTree([{ |
||||
id: 1, |
||||
text: "第一项", |
||||
open: true |
||||
}, { |
||||
id: 2, |
||||
text: "第二项" |
||||
}, { |
||||
id: 11, |
||||
pId: 1, |
||||
text: "子项1(共2个)", |
||||
open: true |
||||
}, { |
||||
id: 111, |
||||
pId: 11, |
||||
text: "子子项1" |
||||
}, { |
||||
id: 112, |
||||
pId: 11, |
||||
text: "子子项2" |
||||
}, { |
||||
id: 12, |
||||
pId: 1, |
||||
text: "子项2" |
||||
}, { |
||||
id: 13, |
||||
pId: 1, |
||||
text: "子项3" |
||||
}]); |
||||
} |
||||
}); |
||||
$.shortcut("demo.display_tree", Demo.Func); |
||||
@ -0,0 +1,103 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
_createHandStandBranchTree: function () { |
||||
var tree = BI.createWidget({ |
||||
type: "bi.handstand_branch_tree", |
||||
expander: {}, |
||||
el: { |
||||
layouts: [{ |
||||
type: "bi.horizontal_adapt", |
||||
verticalAlign: BI.VerticalAlign.Top |
||||
}] |
||||
}, |
||||
items: [{ |
||||
el: { |
||||
text: "且", |
||||
value: "且1", |
||||
cls: "layout-bg7" |
||||
}, |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1", |
||||
value: "这里是一段文字1" |
||||
}, { |
||||
el: { |
||||
text: "或", |
||||
value: "或2", |
||||
cls: "layout-bg7" |
||||
}, |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1435", |
||||
value: "这里是一段文字1435" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xx", |
||||
value: "这里是一段文字1xx" |
||||
}, { |
||||
el: { |
||||
text: "且", |
||||
value: "且3", |
||||
cls: "layout-bg7" |
||||
}, |
||||
children: [{ |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件", |
||||
value: "可以理解为一个条件" |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "可以理解为一个条件v", |
||||
value: "可以理解为一个条件v" |
||||
}] |
||||
}] |
||||
}, { |
||||
type: "bi.label", |
||||
height: 30, |
||||
textAlign: "left", |
||||
text: "这里是一段文字1xa", |
||||
value: "这里是一段文字1xa" |
||||
}] |
||||
}] |
||||
}); |
||||
return tree; |
||||
}, |
||||
|
||||
render: function () { |
||||
var tree = this._createHandStandBranchTree(); |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.center", |
||||
element: this, |
||||
items: [{ |
||||
type: "bi.vtape", |
||||
items: [{ |
||||
el: tree |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.alert("", tree.getValue()); |
||||
} |
||||
} |
||||
}] |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.handstand_branch_tree", Demo.Func); |
||||
@ -0,0 +1,87 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
var tree = BI.createWidget({ |
||||
type: "bi.level_tree", |
||||
chooseType: 0, |
||||
items: [{ |
||||
id: 1, |
||||
text: "第一项", |
||||
value: 1, |
||||
isParent: true |
||||
}, { |
||||
id: 2, |
||||
text: "第二项", |
||||
value: 2, |
||||
isParent: true |
||||
}, { |
||||
id: 3, |
||||
text: "第三项", |
||||
value: 1, |
||||
isParent: true, |
||||
open: true |
||||
}, { |
||||
id: 4, |
||||
text: "第四项", |
||||
value: 1 |
||||
}, { |
||||
id: 11, |
||||
pId: 1, |
||||
text: "子项1", |
||||
value: 11 |
||||
}, { |
||||
id: 12, |
||||
pId: 1, |
||||
text: "子项2", |
||||
value: 12 |
||||
}, { |
||||
id: 13, |
||||
pId: 1, |
||||
text: "子项3", |
||||
value: 13 |
||||
}, { |
||||
id: 21, |
||||
pId: 2, |
||||
text: "子项1", |
||||
value: 21 |
||||
}, { |
||||
id: 31, |
||||
pId: 3, |
||||
text: "子项1", |
||||
value: 31 |
||||
}, { |
||||
id: 32, |
||||
pId: 3, |
||||
text: "子项2", |
||||
value: 32 |
||||
}, { |
||||
id: 33, |
||||
pId: 3, |
||||
text: "子项3", |
||||
value: 33 |
||||
}] |
||||
}) |
||||
|
||||
BI.createWidget({ |
||||
type: "bi.vtape", |
||||
element: this, |
||||
items: [{ |
||||
el: tree |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.alert("", tree.getValue()); |
||||
} |
||||
} |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.level_tree", Demo.Func); |
||||
@ -0,0 +1,86 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
render: function () { |
||||
//value值一定要是字符串
|
||||
var tree = BI.createWidget({ |
||||
type: "bi.simple_tree", |
||||
items: [] |
||||
}); |
||||
|
||||
tree.populate([{ |
||||
id: 1, |
||||
text: "第一项", |
||||
value: "1" |
||||
}, { |
||||
id: 2, |
||||
text: "第二项", |
||||
value: "2" |
||||
}, { |
||||
id: 3, |
||||
text: "第三项", |
||||
value: "3", |
||||
open: true |
||||
}, { |
||||
id: 11, |
||||
pId: 1, |
||||
text: "子项1", |
||||
value: "11" |
||||
}, { |
||||
id: 12, |
||||
pId: 1, |
||||
text: "子项2", |
||||
value: "12" |
||||
}, { |
||||
id: 13, |
||||
pId: 1, |
||||
text: "子项3", |
||||
value: "13" |
||||
}, { |
||||
id: 31, |
||||
pId: 3, |
||||
text: "子项1", |
||||
value: "31" |
||||
}, { |
||||
id: 32, |
||||
pId: 3, |
||||
text: "子项2", |
||||
value: "32" |
||||
}, { |
||||
id: 33, |
||||
pId: 3, |
||||
text: "子项3", |
||||
value: "33" |
||||
}], "z"); |
||||
BI.createWidget({ |
||||
type: "bi.vtape", |
||||
element: this, |
||||
items: [{ |
||||
el: tree |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "setValue(['31', '32', '33'])", |
||||
handler: function () { |
||||
tree.setValue(['31', '32', '33']); |
||||
} |
||||
} |
||||
}, { |
||||
height: 30, |
||||
el: { |
||||
type: "bi.button", |
||||
height: 30, |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.alert("", JSON.stringify(tree.getValue())); |
||||
} |
||||
} |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.simple_tree", Demo.Func); |
||||
File diff suppressed because one or more lines are too long
@ -1,176 +1,117 @@
|
||||
Demo.BASE_CONFIG = [{ |
||||
id: 2, |
||||
text: "基础控件" |
||||
}, { |
||||
pId: 2, |
||||
id: 5, |
||||
text: "组合" |
||||
}, { |
||||
pId: 2, |
||||
id: 8, |
||||
text: "tree" |
||||
}, { |
||||
pId: 2, |
||||
id: 7, |
||||
text: "button" |
||||
}, { |
||||
pId: 2, |
||||
id: 9, |
||||
text: "listitem" |
||||
}, { |
||||
pId: 2, |
||||
id: 10, |
||||
text: "editor" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.canvas", |
||||
value: "demo.canvas" |
||||
text: "基础控件", |
||||
open: true |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.label", |
||||
value: "demo.label" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.collection", |
||||
value: "demo.collection" |
||||
text: "title提示", |
||||
value: "demo.title" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.farbtastic", |
||||
value: "demo.farbtastic" |
||||
text: "气泡提示", |
||||
value: "demo.bubble" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.formulaeditor", |
||||
value: "demo.formulaeditor" |
||||
text: "toast提示", |
||||
value: "demo.toast" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.message", |
||||
text: "message提示", |
||||
value: "demo.message" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.grid_view", |
||||
value: "demo.grid_view" |
||||
}, { |
||||
pId: 2, |
||||
id: 6, |
||||
text: "弹出层" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.pager", |
||||
value: "demo.pager" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.svg", |
||||
value: "demo.svg" |
||||
}, { |
||||
pId: 2, |
||||
text: "bi.table", |
||||
value: "demo.table" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.combo", |
||||
value: "demo.combo" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.expander", |
||||
value: "demo.expander" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.group_button", |
||||
value: "demo.group_button" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.group_combo", |
||||
value: "demo.group_combo" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.loader", |
||||
value: "demo.loader" |
||||
id: 201, |
||||
text: "button" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.navigation", |
||||
value: "demo.navigation" |
||||
pId: 201, |
||||
text: "bi.button", |
||||
value: "demo.button" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.searcher", |
||||
value: "demo.searcher" |
||||
pId: 201, |
||||
text: "bi.text_button", |
||||
value: "demo.text_button" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.switcher", |
||||
value: "demo.switcher" |
||||
pId: 201, |
||||
text: "bi.icon_button", |
||||
value: "demo.icon_button" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.tab", |
||||
value: "demo.tab" |
||||
pId: 201, |
||||
text: "bi.image_button", |
||||
value: "demo.image_button" |
||||
}, { |
||||
pId: 5, |
||||
text: "bi.tree_button", |
||||
value: "demo.tree_button" |
||||
pId: 2, |
||||
id: 202, |
||||
text: "editor" |
||||
}, { |
||||
pId: 6, |
||||
text: "bi.layer_float_box", |
||||
value: "demo.layer_float_box" |
||||
pId: 202, |
||||
text: "bi.editor", |
||||
value: "demo.editor" |
||||
}, { |
||||
pId: 6, |
||||
text: "bi.layer_popup", |
||||
value: "demo.layer_popup" |
||||
pId: 202, |
||||
text: "bi.code_editor", |
||||
value: "demo.code_editor" |
||||
}, { |
||||
pId: 6, |
||||
text: "bi.layer_scroll", |
||||
value: "demo.layer_scroll" |
||||
pId: 202, |
||||
text: "bi.multifile_editor", |
||||
value: "demo.multifile_editor" |
||||
}, { |
||||
pId: 6, |
||||
text: "bi.layer_searcher", |
||||
value: "demo.layer_searcher" |
||||
pId: 202, |
||||
text: "bi.textarea_editor", |
||||
value: "demo.textarea_editor" |
||||
}, { |
||||
pId: 7, |
||||
text: "bi.icon_button", |
||||
value: "demo.icon_button" |
||||
pId: 202, |
||||
text: "bi.formula_editor", |
||||
value: "demo.formula_editor" |
||||
}, { |
||||
pId: 7, |
||||
text: "bi.image_button", |
||||
value: "demo.image_button" |
||||
pId: 2, |
||||
id: 203, |
||||
text: "tree" |
||||
}, { |
||||
pId: 7, |
||||
text: "bi.button", |
||||
value: "demo.button" |
||||
pId: 203, |
||||
text: "bi.tree_view", |
||||
value: "demo.tree_view" |
||||
}, { |
||||
pId: 7, |
||||
text: "bi.text_button", |
||||
value: "demo.text_button" |
||||
pId: 203, |
||||
text: "bi.sync_tree", |
||||
value: "demo.sync_tree" |
||||
}, { |
||||
pId: 8, |
||||
text: "bi.treeview", |
||||
value: "demo.treeview" |
||||
pId: 203, |
||||
text: "bi.part_tree", |
||||
value: "demo.part_tree" |
||||
}, { |
||||
pId: 8, |
||||
text: "bi.synctree", |
||||
value: "demo.synctree" |
||||
pId: 2, |
||||
id: 204, |
||||
text: "table" |
||||
}, { |
||||
pId: 8, |
||||
text: "bi.parttree", |
||||
value: "demo.parttree" |
||||
pId: 204, |
||||
text: "bi.table_view", |
||||
value: "demo.table_view" |
||||
}, { |
||||
pId: 8, |
||||
text: "bi.customtree", |
||||
value: "demo.customtree" |
||||
pId: 204, |
||||
text: "bi.grid_table", |
||||
value: "demo.grid_table" |
||||
}, { |
||||
pId: 9, |
||||
text: "bi.list_items", |
||||
value: "demo.list_items" |
||||
pId: 204, |
||||
text: "bi.collection_table", |
||||
value: "demo.collection_table" |
||||
}, { |
||||
pId: 10, |
||||
text: "bi.code_editor", |
||||
value: "demo.code_editor" |
||||
pId: 204, |
||||
text: "bi.resizable_table", |
||||
value: "demo.resizable_table" |
||||
}, { |
||||
pId: 10, |
||||
text: "bi.editor", |
||||
value: "demo.editor" |
||||
pId: 2, |
||||
text: "bi.canvas", |
||||
value: "demo.canvas" |
||||
}, { |
||||
pId: 10, |
||||
text: "bi.multifile_editor", |
||||
value: "demo.multifile_editor" |
||||
pId: 2, |
||||
text: "bi.pager", |
||||
value: "demo.pager" |
||||
}, { |
||||
pId: 10, |
||||
text: "bi.text_area_editor", |
||||
value: "demo.text_area_editor" |
||||
pId: 2, |
||||
text: "bi.svg", |
||||
value: "demo.svg" |
||||
}]; |
||||
@ -1,116 +1,97 @@
|
||||
Demo.CASE_CONFIG = [{ |
||||
id: 3, |
||||
text: "实例控件" |
||||
text: "实例控件", |
||||
open: true, |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.calendar", |
||||
value: "demo.calendar" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.zclip", |
||||
value: "demo.zclip" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.complex_calendar", |
||||
value: "demo.complex_calendar" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.calendar", |
||||
value: "demo.calendar" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.colorpicker", |
||||
value: "demo.colorpicker" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.bubble_combo", |
||||
value: "demo.bubble_combo" |
||||
}, { |
||||
pId: 3, |
||||
id: 11, |
||||
id: 301, |
||||
text: "editors" |
||||
}, { |
||||
pId: 11, |
||||
pId: 301, |
||||
text: "bi.record_editor", |
||||
value: "demo.record_editor" |
||||
}, { |
||||
pId: 11, |
||||
pId: 301, |
||||
text: "bi.shelter_editor", |
||||
value: "demo.shelter_editor" |
||||
}, { |
||||
pId: 11, |
||||
pId: 301, |
||||
text: "bi.sign_editor", |
||||
value: "demo.sign_editor" |
||||
}, { |
||||
pId: 11, |
||||
pId: 301, |
||||
text: "bi.state_editor", |
||||
value: "demo.state_editor" |
||||
}, { |
||||
pId: 3, |
||||
text: "各种checkbox", |
||||
value: "demo.checkboxes" |
||||
id: 302, |
||||
text: "combo" |
||||
}, { |
||||
pId: 3, |
||||
text: "各种tip", |
||||
value: "demo.tips" |
||||
pId: 302, |
||||
text: "bi.bubble_combo", |
||||
value: "demo.bubble_combo" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.branch_expander", |
||||
value: "demo.branch_expander" |
||||
id: 303, |
||||
text: "tree" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.float_box", |
||||
value: "demo.float_box" |
||||
pId: 303, |
||||
text: "bi.branch_tree", |
||||
value: "demo.branch_tree" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.float_box", |
||||
value: "demo.float_box" |
||||
pId: 303, |
||||
text: "bi.handstand_branch_tree", |
||||
value: "demo.handstand_branch_tree" |
||||
}, { |
||||
pId: 3, |
||||
text: "bi.segment", |
||||
value: "demo.segment" |
||||
pId: 303, |
||||
text: "bi.display_tree", |
||||
value: "demo.display_tree" |
||||
}, { |
||||
pId: 3, |
||||
id: 12, |
||||
text: "各种表格" |
||||
pId: 303, |
||||
text: "bi.simple_tree", |
||||
value: "demo.simple_tree" |
||||
}, { |
||||
pId: 3, |
||||
id: 13, |
||||
text: "各种tree" |
||||
pId: 303, |
||||
text: "bi.level_tree", |
||||
value: "demo.level_tree" |
||||
}, { |
||||
pId: 303, |
||||
text: "bi.branch_relation", |
||||
value: "demo.branch_relation" |
||||
}, { |
||||
pId: 3, |
||||
text: "各种trigger", |
||||
value: "demo.triggers" |
||||
id: 304, |
||||
text: "table" |
||||
}, { |
||||
pId: 12, |
||||
pId: 304, |
||||
text: "bi.adaptive_table", |
||||
value: "demo.adaptive_table" |
||||
}, { |
||||
pId: 12, |
||||
text: "bi.table_tree", |
||||
value: "demo.table_tree" |
||||
pId: 304, |
||||
text: "bi.tree_table", |
||||
value: "demo.tree_table" |
||||
}, { |
||||
pId: 12, |
||||
pId: 304, |
||||
text: "bi.layer_tree_table", |
||||
value: "demo.layer_tree_table" |
||||
}, { |
||||
pId: 13, |
||||
text: "bi.branch_tree", |
||||
value: "demo.branch_tree" |
||||
pId: 3, |
||||
text: "bi.calendar", |
||||
value: "demo.calendar" |
||||
}, { |
||||
pId: 13, |
||||
text: "bi.display_tree", |
||||
value: "demo.display_tree" |
||||
pId: 3, |
||||
text: "bi.zclip", |
||||
value: "demo.zclip" |
||||
}, { |
||||
pId: 13, |
||||
text: "bi.level_tree", |
||||
value: "demo.level_tree" |
||||
pId: 3, |
||||
text: "bi.complex_canvas", |
||||
value: "demo.complex_canvas" |
||||
}, { |
||||
pId: 13, |
||||
text: "bi.simple_tree", |
||||
value: "demo.simple_tree" |
||||
pId: 3, |
||||
text: "bi.color_chooser", |
||||
value: "demo.color_chooser" |
||||
}, { |
||||
pId: 13, |
||||
text: "bi.handstand_branch_tree", |
||||
value: "demo.handstand_branch_tree" |
||||
pId: 3, |
||||
text: "bi.segment", |
||||
value: "demo.segment" |
||||
}]; |
||||
@ -0,0 +1,180 @@
|
||||
Demo.CORE_CONFIG = [{ |
||||
id: 1, |
||||
text: "核心控件", |
||||
}, { |
||||
id: 101, |
||||
pId: 1, |
||||
text: "布局" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.center_adapt", |
||||
value: "demo.center_adapt" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.vertical_adapt", |
||||
value: "demo.vertical_adapt" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.horizontal_adapt", |
||||
value: "demo.horizontal_adapt" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.horizontal_auto", |
||||
value: "demo.horizontal_auto" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.horizontal_float", |
||||
value: "demo.horizontal_float" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.left_right_vertical_adapt", |
||||
value: "demo.left_right_vertical_adapt" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.center", |
||||
value: "demo.center_layout" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.float_center", |
||||
value: "demo.float_center" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.vertical", |
||||
value: "demo.vertical" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.horizontal", |
||||
value: "demo.horizontal" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.border", |
||||
value: "demo.border" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.left, bi.right", |
||||
value: "demo.flow" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.inline", |
||||
value: "demo.inline" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.htape", |
||||
value: "demo.htape" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.vtape", |
||||
value: "demo.vtape" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.grid", |
||||
value: "demo.grid" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.table", |
||||
value: "demo.table_layout" |
||||
}, { |
||||
pId: 101, |
||||
text: "bi.td", |
||||
value: "demo.td" |
||||
}, { |
||||
pId: 1, |
||||
id: 102, |
||||
text: "抽象控件" |
||||
}, { |
||||
pId: 102, |
||||
text: "bi.button_group", |
||||
value: "demo.button_group" |
||||
}, { |
||||
pId: 102, |
||||
text: "bi.button_tree", |
||||
value: "demo.button_tree" |
||||
}, { |
||||
pId: 102, |
||||
text: "bi.virtual_group", |
||||
value: "demo.virtual_group" |
||||
}, { |
||||
pId: 102, |
||||
text: "bi.custom_tree", |
||||
value: "demo.custom_tree" |
||||
}, { |
||||
pId: 102, |
||||
text: "bi.grid_view", |
||||
value: "demo.grid_view" |
||||
}, { |
||||
pId: 102, |
||||
text: "bi.collection_view", |
||||
value: "demo.collection_view" |
||||
}, { |
||||
pId: 102, |
||||
id: 10201, |
||||
text: "组合控件" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.combo", |
||||
value: "demo.combo" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.expander", |
||||
value: "demo.expander" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.group_combo", |
||||
value: "demo.group_combo" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.loader", |
||||
value: "demo.loader" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.navigation", |
||||
value: "demo.navigation" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.searcher", |
||||
value: "demo.searcher" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.switcher", |
||||
value: "demo.switcher" |
||||
}, { |
||||
pId: 10201, |
||||
text: "bi.tab", |
||||
value: "demo.tab" |
||||
}, { |
||||
pId: 102, |
||||
id: 10202, |
||||
text: "弹出层" |
||||
}, { |
||||
pId: 10202, |
||||
text: "bi.layer_float_box", |
||||
value: "demo.layer_float_box" |
||||
}, { |
||||
pId: 10202, |
||||
text: "bi.layer_popup", |
||||
value: "demo.layer_popup" |
||||
}, { |
||||
pId: 10202, |
||||
text: "bi.layer_searcher", |
||||
value: "demo.layer_searcher" |
||||
}, { |
||||
pId: 1, |
||||
text: "widget", |
||||
value: "demo.widget" |
||||
}, { |
||||
pId: 1, |
||||
text: "single", |
||||
value: "demo.single" |
||||
}, { |
||||
pId: 1, |
||||
text: "BasicButton", |
||||
value: "demo.basic_button" |
||||
}, { |
||||
pId: 1, |
||||
text: "NodeButton", |
||||
value: "demo.node_button" |
||||
}, { |
||||
pId: 1, |
||||
text: "pane", |
||||
value: "demo.pane" |
||||
}]; |
||||
@ -1,76 +0,0 @@
|
||||
Demo.LAYOUT_CONFIG = [{ |
||||
id: 1, |
||||
text: "布局" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.center_adapt", |
||||
value: "demo.center_adapt" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.vertical_adapt", |
||||
value: "demo.vertical_adapt" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.horizontal_adapt", |
||||
value: "demo.horizontal_adapt" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.horizontal_auto", |
||||
value: "demo.horizontal_auto" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.horizontal_float", |
||||
value: "demo.horizontal_float" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.left_right_vertical_adapt", |
||||
value: "demo.left_right_vertical_adapt" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.center", |
||||
value: "demo.center_layout" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.float_center", |
||||
value: "demo.float_center" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.vertical", |
||||
value: "demo.vertical" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.horizontal", |
||||
value: "demo.horizontal" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.border", |
||||
value: "demo.border" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.left, bi.right", |
||||
value: "demo.flow" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.inline", |
||||
value: "demo.inline" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.htape", |
||||
value: "demo.htape" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.vtape", |
||||
value: "demo.vtape" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.grid", |
||||
value: "demo.grid" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.table", |
||||
value: "demo.table_layout" |
||||
}, { |
||||
pId: 1, |
||||
text: "bi.td", |
||||
value: "demo.td" |
||||
}]; |
||||
@ -0,0 +1,11 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.layout", |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.combo", Demo.Func); |
||||
@ -0,0 +1,24 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.button_group", |
||||
chooseType: BI.ButtonGroup.CHOOSE_TYPE_NONE, |
||||
layouts: [{ |
||||
type: "bi.vertical" |
||||
}, { |
||||
type: "bi.center_adapt", |
||||
}], |
||||
items: [{ |
||||
type: "bi.label", |
||||
text: "button_group是一类具有相同属性或相似属性的抽象, 本案例实现的是布局的嵌套(vertical布局下内嵌center_adapt布局)" |
||||
}, { |
||||
type: "bi.button", |
||||
text: "1" |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.button_group", Demo.Func); |
||||
@ -0,0 +1,26 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
return { |
||||
type: "bi.button_tree", |
||||
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI, |
||||
layouts: [{ |
||||
type: "bi.vertical" |
||||
}, { |
||||
type: "bi.center_adapt", |
||||
}], |
||||
items: [{ |
||||
type: "bi.label", |
||||
text: "0", |
||||
value: 0 |
||||
}, { |
||||
type: "bi.button", |
||||
text: "1", |
||||
value: 1 |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.button_tree", Demo.Func); |
||||
@ -0,0 +1,39 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var items = []; |
||||
var cellCount = 100; |
||||
for (var i = 0; i < cellCount; i++) { |
||||
items[i] = { |
||||
type: "bi.label", |
||||
text: i |
||||
}; |
||||
} |
||||
var grid = BI.createWidget({ |
||||
type: "bi.collection_view", |
||||
items: items, |
||||
cellSizeAndPositionGetter: function (index) { |
||||
return { |
||||
x: index % 10 * 50, |
||||
y: Math.floor(index / 10) * 50, |
||||
width: 50, |
||||
height: 50 |
||||
} |
||||
} |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: grid, |
||||
left: 10, |
||||
right: 10, |
||||
top: 10, |
||||
bottom: 10 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.collection_view", Demo.Func); |
||||
@ -0,0 +1,50 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
render: function () { |
||||
var items = []; |
||||
var rowCount = 10000, columnCount = 100; |
||||
for (var i = 0; i < rowCount; i++) { |
||||
items[i] = []; |
||||
for (var j = 0; j < columnCount; j++) { |
||||
items[i][j] = { |
||||
type: "bi.label", |
||||
text: i + "-" + j |
||||
} |
||||
} |
||||
} |
||||
var grid = BI.createWidget({ |
||||
type: "bi.grid_view", |
||||
items: items, |
||||
scrollTop: 100, |
||||
rowHeightGetter: function () { |
||||
return 30; |
||||
}, |
||||
columnWidthGetter: function () { |
||||
return 100; |
||||
} |
||||
}); |
||||
BI.createWidget({ |
||||
type: "bi.absolute", |
||||
element: this, |
||||
items: [{ |
||||
el: { |
||||
type: "bi.grid", |
||||
columns: 1, |
||||
rows: 1, |
||||
items: [{ |
||||
column: 0, |
||||
row: 0, |
||||
el: grid |
||||
}] |
||||
}, |
||||
left: 10, |
||||
right: 10, |
||||
top: 10, |
||||
bottom: 10 |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.grid_view", Demo.Func); |
||||
@ -0,0 +1,79 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
_createItems: function () { |
||||
var items = BI.makeArray(100, { |
||||
type: "demo.virtual_group_item" |
||||
}); |
||||
items[0].value = BI.UUID(); |
||||
return items; |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this; |
||||
return { |
||||
type: "bi.vertical", |
||||
vgap: 20, |
||||
items: [{ |
||||
type: "bi.virtual_group", |
||||
width: 500, |
||||
height: 300, |
||||
ref: function () { |
||||
self.buttonMap = this; |
||||
}, |
||||
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI, |
||||
layouts: [{ |
||||
type: "bi.vertical" |
||||
}, { |
||||
type: "bi.center_adapt", |
||||
}], |
||||
items: this._createItems() |
||||
}, { |
||||
type: "bi.button", |
||||
text: "点击刷新", |
||||
handler: function () { |
||||
var items = self._createItems(); |
||||
items.pop(); |
||||
self.buttonMap.populate(items); |
||||
} |
||||
}] |
||||
|
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.virtual_group", Demo.Func); |
||||
|
||||
Demo.Item = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-item", |
||||
height: 30 |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this; |
||||
return { |
||||
type: "bi.label", |
||||
ref: function () { |
||||
self.label = this; |
||||
}, |
||||
height: this.options.height, |
||||
text: "这是一个测试项" + BI.UUID() |
||||
} |
||||
}, |
||||
|
||||
update: function (item) { |
||||
this.label.setText(item.value); |
||||
console.log("更新了一项"); |
||||
}, |
||||
|
||||
created: function () { |
||||
console.log("创建了一项"); |
||||
}, |
||||
|
||||
destroyed: function () { |
||||
console.log("删除了一项"); |
||||
} |
||||
}); |
||||
$.shortcut("demo.virtual_group_item", Demo.Item); |
||||
@ -0,0 +1,245 @@
|
||||
Demo.Func = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-func" |
||||
}, |
||||
|
||||
_createDefaultTree: function () { |
||||
var TREEITEMS = [{id: -1, pId: -2, value: "根目录", open: true, type: "bi.plus_group_node", height: 25}, |
||||
{id: 1, pId: -1, value: "第一级目录1", type: "bi.plus_group_node", height: 25}, |
||||
{id: 11, pId: 1, value: "第二级文件1", type: "bi.single_select_item", height: 25}, |
||||
{id: 12, pId: 1, value: "第二级目录2", type: "bi.plus_group_node", height: 25}, |
||||
{id: 121, pId: 12, value: "第三级目录1", type: "bi.plus_group_node", height: 25}, |
||||
{id: 122, pId: 12, value: "第三级文件1", type: "bi.single_select_item", height: 25}, |
||||
{id: 1211, pId: 121, value: "第四级目录1", type: "bi.plus_group_node", height: 25}, |
||||
{id: 12111, pId: 1211, value: "第五级文件1", type: "bi.single_select_item", height: 25}, |
||||
{id: 2, pId: -1, value: "第一级目录2", type: "bi.plus_group_node", height: 25}, |
||||
{id: 21, pId: 2, value: "第二级目录3", type: "bi.plus_group_node", height: 25}, |
||||
{id: 22, pId: 2, value: "第二级文件2", type: "bi.single_select_item", height: 25}, |
||||
{id: 211, pId: 21, value: "第三级目录2", type: "bi.plus_group_node", height: 25}, |
||||
{id: 212, pId: 21, value: "第三级文件2", type: "bi.single_select_item", height: 25}, |
||||
{id: 2111, pId: 211, value: "第四级文件1", type: "bi.single_select_item", height: 25}]; |
||||
this.tree = BI.createWidget({ |
||||
type: "bi.custom_tree", |
||||
el: { |
||||
type: "bi.button_tree", |
||||
chooseType: 0, |
||||
layouts: [{ |
||||
type: "bi.vertical", |
||||
hgap: 30 |
||||
}] |
||||
}, |
||||
items: BI.deepClone(TREEITEMS) |
||||
}); |
||||
return this.tree; |
||||
}, |
||||
|
||||
_createAsyncTree: function () { |
||||
this.asyncTree = BI.createWidget({ |
||||
type: "bi.custom_tree", |
||||
itemsCreator: function (op, callback) { |
||||
if (!op.node) {//根节点
|
||||
callback([{ |
||||
"id": 1, |
||||
"pId": 0, |
||||
type: "bi.plus_group_node", |
||||
text: "test1", |
||||
value: 1, |
||||
height: 25, |
||||
isParent: true |
||||
}, { |
||||
"id": 2, |
||||
"pId": 0, |
||||
type: "bi.plus_group_node", |
||||
"text": "test2", |
||||
value: 1, |
||||
isParent: true, |
||||
open: true, |
||||
height: 25 |
||||
}]) |
||||
} else { |
||||
if (op.node.id == 1) { |
||||
callback([ |
||||
{ |
||||
"id": 11, |
||||
"pId": 1, |
||||
type: "bi.plus_group_node", |
||||
"text": "test11", |
||||
value: 11, |
||||
height: 25, |
||||
isParent: true |
||||
}, |
||||
{ |
||||
"id": 12, |
||||
"pId": 1, |
||||
type: "bi.single_select_item", |
||||
"text": "test12", |
||||
value: 12, |
||||
height: 35 |
||||
}, |
||||
{ |
||||
"id": 13, |
||||
"pId": 1, |
||||
type: "bi.single_select_item", |
||||
"text": "test13", |
||||
value: 13, |
||||
height: 35 |
||||
}, |
||||
{ |
||||
"id": 14, |
||||
"pId": 1, |
||||
type: "bi.single_select_item", |
||||
"text": "test14", |
||||
value: 14, |
||||
height: 35 |
||||
}, |
||||
{ |
||||
"id": 15, |
||||
"pId": 1, |
||||
type: "bi.single_select_item", |
||||
"text": "test15", |
||||
value: 15, |
||||
height: 35 |
||||
}, |
||||
{ |
||||
"id": 16, |
||||
"pId": 1, |
||||
type: "bi.single_select_item", |
||||
"text": "test16", |
||||
value: 16, |
||||
height: 35 |
||||
}, |
||||
{"id": 17, "pId": 1, type: "bi.single_select_item", "text": "test17", value: 17, height: 35} |
||||
]) |
||||
} else if (op.node.id == 2) { |
||||
callback([{ |
||||
"id": 21, |
||||
"pId": 2, |
||||
type: "bi.single_select_item", |
||||
"text": "test21", |
||||
value: 21, |
||||
height: 35 |
||||
}, |
||||
{ |
||||
"id": 22, |
||||
"pId": 2, |
||||
type: "bi.single_select_item", |
||||
"text": "test22", |
||||
value: 22, |
||||
height: 35 |
||||
}]) |
||||
} else if (op.node.id == 11) { |
||||
callback([{ |
||||
"id": 111, |
||||
"pId": 11, |
||||
type: "bi.single_select_item", |
||||
"text": "test111", |
||||
value: 111, |
||||
height: 35 |
||||
}]) |
||||
} |
||||
} |
||||
}, |
||||
el: { |
||||
type: "bi.loader", |
||||
next: false, |
||||
el: { |
||||
type: "bi.button_tree", |
||||
chooseType: 0, |
||||
layouts: [{ |
||||
type: "bi.vertical", |
||||
hgap: 30, |
||||
vgap: 0 |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
return this.asyncTree; |
||||
}, |
||||
|
||||
render: function () { |
||||
var self = this; |
||||
BI.createWidget({ |
||||
type: "bi.grid", |
||||
columns: 2, |
||||
rows: 1, |
||||
element: this, |
||||
items: [{ |
||||
column: 0, |
||||
row: 0, |
||||
el: { |
||||
type: "bi.vtape", |
||||
items: [ |
||||
{ |
||||
el: this._createDefaultTree() |
||||
}, |
||||
{ |
||||
el: { |
||||
type: "bi.center", |
||||
hgap: 10, |
||||
items: [{ |
||||
type: "bi.text_button", |
||||
cls: "mvc-button layout-bg2", |
||||
text: "getValue", |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Msg.alert("", JSON.stringify(self.tree.getValue())); |
||||
} |
||||
}, { |
||||
type: "bi.text_button", |
||||
cls: "mvc-button layout-bg2", |
||||
text: "getNodeByValue(第一级目录1)", |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Msg.alert("", "节点名称为: " + self.tree.getNodeByValue("第一级目录1").getValue()); |
||||
} |
||||
}] |
||||
}, |
||||
height: 30 |
||||
} |
||||
] |
||||
} |
||||
}, { |
||||
column: 1, |
||||
row: 0, |
||||
el: { |
||||
type: "bi.vtape", |
||||
items: [ |
||||
{ |
||||
type: "bi.label", |
||||
text: "异步加载数据", |
||||
height: 30 |
||||
}, |
||||
{ |
||||
el: this._createAsyncTree() |
||||
}, |
||||
{ |
||||
el: { |
||||
type: "bi.center", |
||||
hgap: 10, |
||||
items: [{ |
||||
type: "bi.text_button", |
||||
cls: "mvc-button layout-bg2", |
||||
text: "getValue", |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Msg.alert("", JSON.stringify(self.asyncTree.getValue())); |
||||
} |
||||
}, { |
||||
type: "bi.text_button", |
||||
cls: "mvc-button layout-bg2", |
||||
text: "getNodeById(11)", |
||||
height: 30, |
||||
handler: function () { |
||||
BI.Msg.alert("", "节点名称为: " + (self.asyncTree.getNodeById(11) && self.asyncTree.getNodeById(11).getText())); |
||||
} |
||||
}] |
||||
}, |
||||
height: 30 |
||||
} |
||||
] |
||||
} |
||||
}] |
||||
}) |
||||
} |
||||
}); |
||||
$.shortcut("demo.custom_tree", Demo.Func); |
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,177 @@
|
||||
/** |
||||
* Created by User on 2017/3/22. |
||||
*/ |
||||
Demo.PathChooser = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-path-chooser" |
||||
}, |
||||
render: function () { |
||||
var pathchooser = BI.createWidget({ |
||||
type: "bi.path_chooser", |
||||
width: 800, |
||||
height: 400, |
||||
items: // [
|
||||
// [{region: "区域X", value: "X1"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域B", value: "B"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域E", value: "E"},
|
||||
// {region: "区域G", value: "G"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域B", value: "B"},
|
||||
// {region: "区域C", value: "C"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域E", value: "E"},
|
||||
// {region: "区域G", value: "G"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// //{region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域C", value: "C"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域E", value: "E"},
|
||||
// {region: "区域G", value: "G"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域B", value: "B"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域E", value: "E1"},
|
||||
// {region: "区域H", value: "H"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域B", value: "B"},
|
||||
// {region: "区域C", value: "C"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域E", value: "E1"},
|
||||
// {region: "区域H", value: "H"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域C", value: "C"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域E", value: "E1"},
|
||||
// {region: "区域H", value: "H"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域B", value: "B"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域F", value: "F"},
|
||||
// {region: "区域H", value: "H"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X"},
|
||||
// {region: "区域Q", value: "Q"},
|
||||
// {region: "区域A", value: "A"},
|
||||
// {region: "区域B", value: "B"},
|
||||
// {region: "区域C", value: "C"},
|
||||
// {region: "区域D", value: "D"},
|
||||
// {region: "区域F", value: "F"},
|
||||
// {region: "区域H", value: "H"},
|
||||
// {region: "区域I", value: "I"},
|
||||
// {region: "区域J", value: "J"}],
|
||||
// [{region: "区域X", value: "X", text: "X"},
|
||||
// {region: "区域Q", value: "Q", text: "Q"},
|
||||
// {region: "区域A", value: "A", text: "A"},
|
||||
// {region: "区域C", value: "C", text: "C"},
|
||||
// {region: "区域D", value: "D", text: "D"},
|
||||
// {region: "区域F", value: "F", text: "F"},
|
||||
// {region: "区域H", value: "H", text: "H"},
|
||||
// {region: "区域I", value: "I", text: "I"},
|
||||
// {region: "区域J", value: "J", text: "J"}]
|
||||
//]
|
||||
[[{ |
||||
"region": "8c4460bc3605685e", |
||||
"regionText": "采购订单XXX", |
||||
"text": "ID", |
||||
"value": "1" |
||||
}, { |
||||
"region": "0fbd0dc648f41e97", |
||||
"regionText": "采购订单", |
||||
"text": "学号", |
||||
"value": "3" |
||||
}, { |
||||
"region": "c6d72d6c7e19a667", |
||||
"regionText": "供应商基本信息", |
||||
"text": "ID", |
||||
"value": "5" |
||||
}], [{ |
||||
"region": "ed013e18cc7c8637", |
||||
"regionText": "采购订单XXX", |
||||
"text": "ID", |
||||
"value": "1" |
||||
}, { |
||||
"region": "153d75878431f8ee", |
||||
"regionText": "A3", |
||||
"text": "学号", |
||||
"value": "2" |
||||
}, { |
||||
"region": "3861fb024c7d7825", |
||||
"regionText": "采购订单", |
||||
"text": "学号", |
||||
"value": "3" |
||||
}, { |
||||
"region": "88e3e5071bd10bc5", |
||||
"regionText": "供应商", |
||||
"text": "ID", |
||||
"value": "4" |
||||
}, { |
||||
"region": "8476c77ab5c147e0", |
||||
"regionText": "供应商基本信息", |
||||
"text": "ID", |
||||
"value": "5" |
||||
}], [{ |
||||
"region": "f00f67fbb9fba6fe", |
||||
"regionText": "采购订单XXX", |
||||
"text": "ID", |
||||
"value": "1" |
||||
}, { |
||||
"region": "1e8badf5d5793408", |
||||
"regionText": "A3", |
||||
"text": "学号", |
||||
"value": "2" |
||||
}, { |
||||
"region": "de1ebd3d0986a294", |
||||
"regionText": "供应商基本信息", |
||||
"text": "ID", |
||||
"value": "5" |
||||
}]] |
||||
}); |
||||
pathchooser.setValue(); |
||||
return { |
||||
type: "bi.absolute", |
||||
items: [{ |
||||
el: pathchooser, |
||||
left: 100, |
||||
top: 100 |
||||
}, { |
||||
el: { |
||||
type: "bi.button", |
||||
text: "getValue", |
||||
handler: function () { |
||||
BI.Msg.toast(JSON.stringify(pathchooser.getValue())); |
||||
} |
||||
}, |
||||
left: 100, |
||||
bottom: 10 |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.path_chooser", Demo.PathChooser); |
||||
@ -0,0 +1,65 @@
|
||||
/** |
||||
* Created by User on 2017/3/22. |
||||
*/ |
||||
Demo.RelationView = BI.inherit(BI.Widget, { |
||||
props: { |
||||
baseCls: "demo-relation-view" |
||||
}, |
||||
render: function () { |
||||
var relationview = BI.createWidget({ |
||||
type: "bi.relation_view", |
||||
items: [ |
||||
{ |
||||
primary: { |
||||
region: "B", regionText: "比", regionTitle: "bbb", regionHandler: function () { |
||||
alert("a") |
||||
}, |
||||
|
||||
|
||||
title: "b2...", |
||||
value: "b2", text: "b2字段", |
||||
handler: function () { |
||||
alert("d") |
||||
} |
||||
}, |
||||
foreign: {region: "C", value: "c1", text: "c1字段"} |
||||
}, |
||||
{ |
||||
primary: {region: "A", value: "a1", text: "a1字段"}, |
||||
foreign: {region: "C", value: "c2", text: "c2字段"} |
||||
}, |
||||
{ |
||||
primary: {region: "C", value: "c3", text: "c3字段"}, |
||||
foreign: {region: "D", value: "d1", text: "d1字段"} |
||||
}, |
||||
{ |
||||
primary: {region: "A", value: "a1", text: "a1字段"}, |
||||
foreign: {region: "B", value: "b1", text: "b1字段"} |
||||
}, |
||||
|
||||
{ |
||||
primary: {region: "X", value: "x1", text: "x1字段"}, |
||||
foreign: {region: "Y", value: "y1", text: "y1字段"} |
||||
}, |
||||
{ |
||||
primary: {region: "X", value: "x2", text: "x2字段"}, |
||||
foreign: {region: "Z", value: "z1", text: "z1字段"} |
||||
}, |
||||
{ |
||||
primary: {region: "X", value: "x2", text: "x2字段"}, |
||||
foreign: {region: "B", value: "b1", text: "b1字段"} |
||||
}, |
||||
{ |
||||
primary: {region: "X33", value: "x233", text: "x233字段"}, |
||||
} |
||||
] |
||||
}); |
||||
return { |
||||
type: "bi.float_center_adapt", |
||||
items: [{ |
||||
el: relationview |
||||
}] |
||||
} |
||||
} |
||||
}); |
||||
$.shortcut("demo.relation_view", Demo.RelationView); |
||||
@ -1,3 +1,7 @@
|
||||
Demo = { |
||||
version: 1.0 |
||||
}; |
||||
|
||||
BI.i18n = { |
||||
"BI-Basic_OK": "确定" |
||||
}; |
||||
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 652 B After Width: | Height: | Size: 652 B |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 45 B After Width: | Height: | Size: 45 B |
|
Before Width: | Height: | Size: 381 B After Width: | Height: | Size: 381 B |
|
Before Width: | Height: | Size: 5.4 KiB After Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue