mirror of
https://gitee.com/dotnetchina/OpenAuth.Net.git
synced 2025-05-11 16:18:03 +08:00
1657 lines
74 KiB
JavaScript
1657 lines
74 KiB
JavaScript
var app = angular.module('webAppDesign', [])
|
||
.run(['$rootScope', '$lrfnRequest', '$lrmDesigner', function ($rootScope, $lrfnRequest, $lrmDesigner) {
|
||
$rootScope.windowWidth = $lrfnRequest("windowWidth");
|
||
|
||
$rootScope.windowHeight = $lrfnRequest("windowHeight") - 41;
|
||
var _projectId = $lrfnRequest("projectId");
|
||
$rootScope.designer = $lrmDesigner.init(_projectId);
|
||
}])
|
||
.controller('lrAppCtrl', ['$rootScope', '$scope', '$lrGetIframe', function ($rootScope, $scope, $lrGetIframe) {
|
||
$scope.pageTemplates = $rootScope.designer.templates.getPageTemps();
|
||
$scope.addPage = $rootScope.designer.addPage;
|
||
$scope.btnSaveProject = $rootScope.designer.saveProject;
|
||
//$scope.isTabsAdded = true;
|
||
|
||
|
||
//加载完成开始初始化
|
||
$rootScope.$on('iframeLoaded', function (event) {
|
||
$rootScope.designer.vm.isBeginView = true;
|
||
$lrGetIframe('phoneDIndex').doBroadcast('init', $rootScope.designer.currentPage);
|
||
$scope.$apply();
|
||
});
|
||
}])
|
||
//用来设置窗口大小
|
||
.controller('lrAppMidbarCtrl', ['$scope', '$rootScope', function ($scope, $rootScope) {
|
||
var phoneHeight = 765.284, phoneWidth = 387.578;
|
||
var iframeH = 568, iframeW = 320, iframeMT = 84.9764;
|
||
|
||
$scope.phoneScale = '1';
|
||
$scope.phoneHeight = phoneHeight + 'px';
|
||
$scope.phoneWidth = +phoneWidth + 'px';
|
||
|
||
$scope.phoneIframeH = iframeH + 'px';
|
||
$scope.phoneIframeW = iframeW + 'px';
|
||
$scope.phoneIframeMT = iframeMT + 'px';
|
||
|
||
$scope.marginTop = (($rootScope.windowHeight - phoneHeight - 82) / 2 > 0 ? ($rootScope.windowHeight - phoneHeight - 82) / 2 : 0) + "px";
|
||
$scope.changePhoneScale = function () {
|
||
var _height = parseFloat($scope.phoneScale) * phoneHeight;
|
||
$scope.phoneHeight = _height + 'px';
|
||
$scope.phoneWidth = parseFloat($scope.phoneScale) * phoneWidth + 'px';
|
||
$scope.marginTop = (($rootScope.windowHeight - _height - 82) / 2 > 0 ? ($rootScope.windowHeight - _height - 82) / 2 : 0) + "px";
|
||
|
||
$scope.phoneIframeH = parseFloat($scope.phoneScale) * iframeH + 'px';
|
||
$scope.phoneIframeW = parseFloat($scope.phoneScale) * iframeW + 'px';
|
||
$scope.phoneIframeMT = parseFloat($scope.phoneScale) * iframeMT + 'px';
|
||
};
|
||
}])
|
||
/*扩展标签属性*/
|
||
.directive("lrappComponents", ["$rootScope", "$lrmComponents", function ($rootScope, $lrmComponents) {
|
||
return {
|
||
restrict: "E",
|
||
replace: true,
|
||
template: '<div ng-repeat="component in $root.componentGroups" class="lr-item-row lr-component" data-value="{{component.id}}"><i class="fa {{component.icon}}"></i>{{component.text}}</div>',
|
||
link: function (scope, element, attr) {
|
||
$rootScope.componentGroups = $lrmComponents.all();
|
||
}
|
||
}
|
||
}])
|
||
.directive("lrappPagetree", ["$rootScope", function ($rootScope) {
|
||
return {
|
||
restrict: "E",
|
||
require: '?ngModel',
|
||
replace: true,
|
||
template: '<div></div>',
|
||
link: function (scope, element, attr, ngModel) {
|
||
if (!ngModel)
|
||
{
|
||
return;
|
||
}
|
||
ngModel.$render = function () {
|
||
ngModel.$viewValue(element);
|
||
}
|
||
}
|
||
}
|
||
}])
|
||
.directive('lrappBox', function () {
|
||
return {
|
||
restrict: 'E',
|
||
replace: true,
|
||
transclude: true,
|
||
template:
|
||
'<div class="lr-box expanded">' +
|
||
'<h4 class="lr-box-toggle"></h4>' +
|
||
'<div class="lr-box-content" ng-transclude></div>' +
|
||
'</div>',
|
||
link: function (scope, element, attr) {
|
||
var toggle = element.find('.lr-box-toggle');
|
||
element.find('h4').html('<span class="caret"></span>' + attr.name);
|
||
toggle.on('click', function () {
|
||
if (element.is('.expanded')) {
|
||
element.removeClass('expanded');
|
||
}
|
||
else {
|
||
element.addClass('expanded');
|
||
}
|
||
});
|
||
}
|
||
};
|
||
})
|
||
.directive("lrappToggleb", ["$rootScope", function (e) {
|
||
return {
|
||
restrict: "E",
|
||
require: '?ngModel',
|
||
template: '<span class="left-text"></span><div class="track"><div class="handle"></div></div><span class="right-text" ></span>',
|
||
link: function (scope, element, attr, ngModel) {
|
||
ngModel.$render = function () {
|
||
if (ngModel.$viewValue) {
|
||
element.addClass("active");
|
||
}
|
||
};
|
||
element.on("click", function () {
|
||
scope.$apply(cgValue);
|
||
});
|
||
|
||
function cgValue() {
|
||
element.addClass("animate");
|
||
var flag = element.is(".active");
|
||
if (flag) {
|
||
element.removeClass("active");
|
||
}
|
||
else {
|
||
element.addClass("active");
|
||
}
|
||
ngModel.$setViewValue(!flag);
|
||
}
|
||
}
|
||
}
|
||
}])
|
||
.directive('lrappColorPicker', function () {
|
||
return {
|
||
restrict: "E",
|
||
replace: true,
|
||
template: '<div class="input-append color" data-form="colorpicker" data-color="#ffffff" data-color-format="hex">' +
|
||
'<span class="add-on"><i style="background-color: #ffffff"></i></span>' +
|
||
'<input type="text" value="#ffffff" />' +
|
||
'</div>',
|
||
link: function (scope, element, attr) {
|
||
|
||
if (attr.value) {
|
||
attr.color = attr.value;
|
||
element.find('i').css('background-color', attr.value);
|
||
element.find('input').val(attr.value);
|
||
}
|
||
element.colorpicker();
|
||
|
||
}
|
||
}
|
||
})
|
||
/*数据模型*/
|
||
.factory('$lrmComponents', ['$rootScope', function ($rootScope) {//组件类型
|
||
var _doRemove = function (data) {
|
||
var components = $rootScope.designer.currentPage.ChildNodes;
|
||
|
||
components.splice(components.indexOf(data), 1);
|
||
$rootScope.designer.templates.fnPageTree.refresh();
|
||
$rootScope.designer.currentPage = $rootScope.designer.templates.getHasTemps()[0];
|
||
$rootScope.designer.currentFocus = $rootScope.designer.templates.getHasTemps()[0];
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgSelectTemplatePage, { "cmd": "removeComponent", object: $rootScope.designer.templates.getHasTemps()[0] });
|
||
$.webappDesigner.attributes($rootScope.designer);
|
||
}
|
||
|
||
var components = [
|
||
{
|
||
id: "lrHeader",
|
||
text: "标题",
|
||
icon: "fa-header",
|
||
setValue: function (name, value, data) {
|
||
switch (name) {
|
||
case "text":
|
||
if (data.text != value) {
|
||
data.text = value;
|
||
data.attr.text = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'text', "object": data });
|
||
$rootScope.designer.templates.fnPageTree.refreshNode(data.id, data.text);
|
||
}
|
||
break;
|
||
case "size":
|
||
if (data.attr.size != value) {
|
||
data.attr.size = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'size', "object": data });
|
||
}
|
||
break;
|
||
case "weightSize":
|
||
if (data.attr.weight.size != value) {
|
||
data.attr.weight.size = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'weightSize', "object": data });
|
||
}
|
||
case "italic":
|
||
if (data.attr.weight.isItalic != value) {
|
||
data.attr.weight.isItalic = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'isItalic', "object": data });
|
||
}
|
||
break;
|
||
case "color":
|
||
if (data.attr.color != value) {
|
||
data.attr.color = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'color', "object": data });
|
||
}
|
||
break;
|
||
case "align":
|
||
if (data.attr.align != value) {
|
||
data.attr.align = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'align', "object": data });
|
||
}
|
||
break;
|
||
}
|
||
},
|
||
},
|
||
{
|
||
id: "lrParagraph",
|
||
text: "段落",
|
||
icon: "fa fa-align-left",
|
||
setValue: function (name, value, data) {
|
||
if (data.attr[name] != value) {
|
||
data.attr[name] = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": name, "object": data });
|
||
}
|
||
}
|
||
},
|
||
//{ id: "lrBtnBar", text: "按钮组", icon: "fa fa-th-large" },
|
||
{
|
||
id: "lrBtn",
|
||
text: "按钮",
|
||
icon: "fa fa-square",
|
||
setValue: function (name, value, data) {
|
||
switch (name) {
|
||
case "link":
|
||
if (data.attr.link != value)
|
||
{
|
||
data.attr.link = value;
|
||
}
|
||
break;
|
||
case "text":
|
||
if (data.attr.text != value) {
|
||
data.attr.text = value;
|
||
data.text = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": 'text', "object": data });
|
||
$rootScope.designer.templates.fnPageTree.refreshNode(data.id, data.text);
|
||
}
|
||
break;
|
||
case "weightSize":
|
||
case "italic":
|
||
if (data.attr.weight[name] != value) {
|
||
data.attr.weight[name] = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": name, "object": data });
|
||
}
|
||
break;
|
||
case "size":
|
||
case "color":
|
||
case "align":
|
||
case "btnType":
|
||
case "btnTheme":
|
||
case "btnSize":
|
||
if (data.attr[name] != value) {
|
||
data.attr[name] = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": name, "object": data });
|
||
}
|
||
break;
|
||
}
|
||
},
|
||
},
|
||
{
|
||
id: "lrInput",
|
||
text: "文本框",
|
||
icon: "fa fa-italic",
|
||
setValue: function (name, value, data) {
|
||
if (data.attr[name] != value) {
|
||
data.attr[name] = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": name, "object": data });
|
||
}
|
||
}
|
||
},
|
||
{
|
||
id: "lrList3",
|
||
text: "列表类型一",
|
||
icon: "fa fa-th-list",
|
||
setValue: function (name, value, data) {
|
||
if (data.attr[name] != value) {
|
||
data.attr[name] = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": name, "object": data });
|
||
}
|
||
}
|
||
},
|
||
{
|
||
id: "lrList4",
|
||
text: "列表类型二",
|
||
icon: "fa fa-list-ul",
|
||
setValue: function (name, value, data) {
|
||
if (data.attr[name] != value) {
|
||
data.attr[name] = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "componentAttr", "attrName": name, "object": data });
|
||
}
|
||
}
|
||
}
|
||
//{ id: "lrTextarea", text: "文本区", icon: "fa fa-align-justify" }
|
||
];
|
||
return {
|
||
all: function () {
|
||
return components;
|
||
},
|
||
getOne:function(id){
|
||
for(var i in components)
|
||
{
|
||
if (components[i].id == id)
|
||
{
|
||
return components[i];
|
||
}
|
||
}
|
||
},
|
||
doRemove: _doRemove
|
||
};
|
||
}])
|
||
.factory('$lrmTemplates', ['$rootScope', '$lrfnGuid', '$lrdialogTop', function ($rootScope, $lrfnGuid, $lrdialogTop) {//模板类型(树形菜单)
|
||
/*设置空白页的属性的方法*/
|
||
var setBlankPageValue = function (name, value, data) {
|
||
switch (name) {
|
||
case "text":
|
||
if (data.text != value) {
|
||
data.text = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "pageText", "value": value });
|
||
refreshTreeNode(data.id, data.text);
|
||
}
|
||
break;
|
||
case "routing":
|
||
if (data.attr.routing != value)
|
||
{
|
||
data.attr.routing = value;
|
||
}
|
||
break;
|
||
case "bgColor":
|
||
if (data.attr.bgColor != value)
|
||
{
|
||
data.attr.bgColor = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "pageBgColor", "value": value });
|
||
}
|
||
break;
|
||
case "isTabed":
|
||
if (data.attr.isTabed != value) {
|
||
data.attr.isTabed = value;
|
||
}
|
||
break;
|
||
case "isPadding":
|
||
if (data.attr.isPadding != value) {
|
||
data.attr.isPadding = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "pageIsPadding", "value": value });
|
||
}
|
||
break;
|
||
case "isHeadHide":
|
||
if (data.attr.isHeadHide != value) {
|
||
data.attr.isHeadHide = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "pageIsHeadHide", "value": value });
|
||
}
|
||
break;
|
||
}
|
||
};
|
||
|
||
var pageTemplates = [{//页面模板
|
||
value: "lrPageBlank",
|
||
text: "页面",
|
||
png: "../../Content/webApp/img/template-blank.png",
|
||
img: "fa fa-file-o",
|
||
hasChildren: false,
|
||
isexpand: false,
|
||
parentnodes: "0",
|
||
attr: {
|
||
value: 'lrPageBlank',
|
||
type: 'page',
|
||
routing: '/',
|
||
bgColor: '#ffffff',
|
||
isTabed: 'true',
|
||
isPadding: 'true',
|
||
isHeadHide: 'false',
|
||
isFirst:false
|
||
},
|
||
setValue: setBlankPageValue,
|
||
doButton: function (data) {
|
||
if (hasTemplates.length > 1) {
|
||
hasTemplates.splice(hasTemplates.indexOf(data), 1);
|
||
refreshTree();
|
||
$rootScope.designer.currentPage = hasTemplates[0];
|
||
$rootScope.designer.currentFocus = hasTemplates[0];
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgSelectTemplatePage, { "cmd": "removePage", object: hasTemplates[0] });
|
||
$.webappDesigner.attributes($rootScope.designer);
|
||
}
|
||
else {
|
||
$lrdialogTop('必须保留一个页面', 'error');
|
||
}
|
||
},
|
||
type:"page"
|
||
}];
|
||
var hasTemplates = [];
|
||
|
||
/*刷新模板树*/
|
||
function refreshTree(id) {
|
||
var _id = "";
|
||
if ($rootScope.pageTree != undefined) {
|
||
$rootScope.pageTree.treeview({
|
||
data: hasTemplates,
|
||
isTool: true,
|
||
nodeTools: [{ text: '删除', img: 'fa fa-trash-o' },
|
||
{ text: '复制', img: 'fa fa-clone' },
|
||
{
|
||
text: '标记默认页',
|
||
img: 'fa fa-thumb-tack',
|
||
node:"page",
|
||
callback: function (id) {
|
||
for (var i in hasTemplates)
|
||
{
|
||
hasTemplates[i].attr.isFirst = false;
|
||
if (hasTemplates[i].id == id)
|
||
{
|
||
hasTemplates[i].attr.isFirst = true;
|
||
$rootScope.pageTree.refreshNodeIcon(id, "fa fa-yahoo", ".fa-yahoo");
|
||
}
|
||
}
|
||
}
|
||
}],
|
||
onnodeclick: function (item) {
|
||
treeNotChecked();
|
||
var _currentPage = $rootScope.designer.currentPage;
|
||
var _currentFocus = $rootScope.designer.currentFocus;
|
||
if (_currentFocus.id != item.id) {
|
||
$rootScope.designer.currentFocus = item;
|
||
if (item.parentnodes == "0")//说明是页面
|
||
{
|
||
$rootScope.designer.currentPage = item;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgSelectTemplatePage, { "cmd": "selectPage", "object": item });
|
||
}
|
||
else {
|
||
if (item.parentnodes != _currentPage.id) {
|
||
for (var i in hasTemplates) {
|
||
var _page = hasTemplates[i];
|
||
if (_page.id == item.parentnodes) {
|
||
$rootScope.designer.currentPage = _page;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgSelectTemplatePage, { "cmd": "selectComponent", "object": item, "currentPage": $rootScope.designer.currentPage });
|
||
}
|
||
$.webappDesigner.attributes($rootScope.designer);
|
||
}
|
||
}
|
||
});
|
||
if (id == undefined) {
|
||
_id = hasTemplates[0].id
|
||
}
|
||
else {
|
||
_id = id;
|
||
}
|
||
$rootScope.pageTree.setNodeChecked(_id);
|
||
treeNotChecked();
|
||
|
||
for (var i in hasTemplates) {
|
||
if (hasTemplates[i].attr.isFirst == true) {
|
||
$rootScope.pageTree.refreshNodeIcon(hasTemplates[i].id, "fa fa-yahoo", ".fa-yahoo");
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
function refreshTreeNode(nodeId,text)
|
||
{
|
||
$rootScope.pageTree.refreshNode(nodeId, text);
|
||
}
|
||
|
||
|
||
/*设置tabs的属性的方法*/
|
||
var setTabsValue = function (name, value, data) {
|
||
switch (name) {
|
||
case "bgColor":
|
||
if (data.attr.bgColor != value) {
|
||
data.attr.bgColor = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "tabsBgColor", "value": value });
|
||
}
|
||
break;
|
||
case "iconColor":
|
||
if (data.attr.iconColor != value) {
|
||
data.attr.iconColor = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "tabsIconColor", "value": value });
|
||
}
|
||
case "iconType":
|
||
if (data.attr.iconType != value) {
|
||
data.attr.iconType = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "tabsIconType", "value": value });
|
||
}
|
||
break;
|
||
}
|
||
};
|
||
/*设置tab属性*/
|
||
var setTabValue = function (name, value, data) {
|
||
switch (name)
|
||
{
|
||
case "text":
|
||
if (data.attr.text != value)
|
||
{
|
||
data.attr.text = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "tabText", "value": value });
|
||
$rootScope.tabsTree.refreshNode(data.id, value);
|
||
}
|
||
break;
|
||
case "iconOn":
|
||
if (data.attr.iconOn != value) {
|
||
data.attr.iconOn = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "tabIconOn", "value": value });
|
||
}
|
||
break;
|
||
case "iconOff":
|
||
if (data.attr.iconOff != value) {
|
||
data.attr.iconOff = value;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgAttr, { "cmd": "tabIconOff", "value": value });
|
||
}
|
||
break;
|
||
case "innerTabPage":
|
||
if (data.attr.lrInnerTabPage != value) {
|
||
data.attr.lrInnerTabPage = value;
|
||
}
|
||
break;
|
||
|
||
}
|
||
}
|
||
/*删除tab*/
|
||
var removeTab = function (data)
|
||
{
|
||
if (hasTabsTemplates[0].ChildNodes.length > 1) {
|
||
hasTabsTemplates[0].ChildNodes.splice(hasTabsTemplates[0].ChildNodes.indexOf(data), 1);
|
||
refreshTabsTree();
|
||
focusTabsNode(hasTabsTemplates[0].ChildNodes[0].id);
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.doTabTemplate, { "cmd": "removeTab", id: hasTabsTemplates[0].ChildNodes[0].id });
|
||
}
|
||
else {
|
||
$lrdialogTop('Tab不能全部删除', 'error');
|
||
}
|
||
}
|
||
/*tabs树*/
|
||
var tabTemplate = {
|
||
text: "Tab页",
|
||
img: "fa fa-cube",
|
||
hasChildren: false,
|
||
isexpand: false,
|
||
parentnodes: "lrTabs",
|
||
attr: {
|
||
value: "lrTab",
|
||
iconOn: "ion-ios-home",
|
||
iconOff: "ion-ios-home-outline",
|
||
innerTabPage: "DefaultPage",
|
||
},
|
||
setValue: setTabValue,
|
||
doButton: removeTab
|
||
};
|
||
|
||
var hasTabsTemplates = [
|
||
{
|
||
id:"lrTabs",//页面模板
|
||
value: "lrTabs",
|
||
text: "Tabs控制器",
|
||
img: "fa fa-sitemap",
|
||
hasChildren: true,
|
||
isexpand: true,
|
||
parentnodes: "0",
|
||
attr: {
|
||
type: 'tabs',
|
||
value: 'lrTabs',
|
||
bgColor: 'stable',
|
||
iconColor: "dark",
|
||
iconType:"top"
|
||
},
|
||
setValue: setTabsValue,
|
||
doButton: function () {
|
||
var _dst = angular.copy(tabTemplate);
|
||
_dst.id = $lrfnGuid();
|
||
hasTabsTemplates[0].ChildNodes.push(_dst);
|
||
refreshTabsTree();
|
||
focusTabsNode(_dst.id);
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.doTabTemplate, { "cmd": "addTab", id: _dst.id });
|
||
}
|
||
}];
|
||
function refreshTabsTree()
|
||
{
|
||
if ($rootScope.tabsTree != undefined) {
|
||
$rootScope.tabsTree.treeview({
|
||
data: hasTabsTemplates,
|
||
onnodeclick: function (item) {
|
||
pTreeNotChecked();
|
||
var _currentPage = $rootScope.designer.currentPage;
|
||
var _currentFocus = $rootScope.designer.currentFocus;
|
||
if (_currentFocus.id != item.id)
|
||
{
|
||
if (_currentPage.id != "lrTabs") {
|
||
$rootScope.designer.currentPage = hasTabsTemplates[0];
|
||
}
|
||
|
||
$rootScope.designer.currentFocus = item;
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.cgSelectTemplatePage, { "cmd": "lrTabs", "data": hasTabsTemplates[0].ChildNodes, "focus": item });
|
||
$.webappDesigner.attributes($rootScope.designer);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
}
|
||
function focusTabsNode(id)
|
||
{
|
||
for (var i in hasTabsTemplates[0].ChildNodes) {
|
||
var item = hasTabsTemplates[0].ChildNodes[i];
|
||
if (item.id == id) {
|
||
$rootScope.designer.currentFocus = item;
|
||
$.webappDesigner.attributes($rootScope.designer);
|
||
break;
|
||
}
|
||
}
|
||
pTreeNotChecked();
|
||
$rootScope.tabsTree.setNodeChecked(id);
|
||
}
|
||
|
||
/*取消选中*/
|
||
function pTreeNotChecked() {
|
||
if ($rootScope.pageTree != undefined) {
|
||
$rootScope.pageTree.setNodeChecked("");
|
||
}
|
||
}
|
||
function treeNotChecked()
|
||
{
|
||
if ($rootScope.tabsTree != undefined)
|
||
{
|
||
$rootScope.tabsTree.setNodeChecked("");
|
||
}
|
||
}
|
||
|
||
return {
|
||
init: function (data) {
|
||
hasTemplates = data;
|
||
},
|
||
getPageTemps: function () {
|
||
return pageTemplates;
|
||
},
|
||
getHasTemps: function () {
|
||
return hasTemplates;
|
||
},
|
||
getHasTabsTemps: function () {
|
||
return hasTabsTemplates;
|
||
},
|
||
getComponent: function (id, pageId) {
|
||
for (var i in hasTemplates) {
|
||
var item = hasTemplates[i];
|
||
if (item.hasChildren && pageId == item.id) {
|
||
for (var j in item.ChildNodes) {
|
||
var _childone = item.ChildNodes[j];
|
||
if (_childone.id == id) {
|
||
return _childone;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
return null;
|
||
},
|
||
addPage: function (data) {
|
||
var _id = ""; var _dst = {};
|
||
if (data == undefined) {
|
||
_dst = angular.copy(pageTemplates[0]);
|
||
_dst.id = $lrfnGuid();
|
||
_id = _dst.id;
|
||
hasTemplates.push(_dst);
|
||
}
|
||
else {
|
||
_dst = data;
|
||
_id = data.id;
|
||
hasTemplates.push(data);
|
||
}
|
||
refreshTree(_id);
|
||
return _dst;
|
||
},
|
||
addComponent: function (obj) {
|
||
for (var i in hasTemplates) {
|
||
var item = hasTemplates[i];
|
||
if (item.id == obj.parentnodes) {
|
||
hasTemplates[i].hasChildren = true;
|
||
hasTemplates[i].isexpand = true;
|
||
if (hasTemplates[i].ChildNodes == undefined) {
|
||
hasTemplates[i].ChildNodes = [];
|
||
}
|
||
hasTemplates[i].ChildNodes.push(obj);
|
||
}
|
||
}
|
||
},
|
||
initTabs: function (data) {
|
||
var _data = [
|
||
{
|
||
id: "lrtab0001",
|
||
text: "首页",
|
||
img: "fa fa-cube",
|
||
hasChildren: false,
|
||
isexpand: false,
|
||
parentnodes: "lrTabs",
|
||
attr: {
|
||
value: "lrTab",
|
||
iconOn: "ion-ios-home",
|
||
iconOff: "ion-ios-home-outline",
|
||
innerTabPage: "DefaultPage",
|
||
},
|
||
setValue: setTabValue,
|
||
doButton: removeTab
|
||
},
|
||
{
|
||
id: "lrtab0002",
|
||
text: "实例",
|
||
img: "fa fa-cube",
|
||
hasChildren: false,
|
||
isexpand: false,
|
||
parentnodes: "lrTabs",
|
||
attr: {
|
||
value: "lrTab",
|
||
iconOn: "ion-ios-book",
|
||
iconOff: "ion-ios-book-outline",
|
||
innerTabPage: "DefaultPage",
|
||
},
|
||
setValue: setTabValue,
|
||
doButton: removeTab
|
||
},
|
||
{
|
||
id: "lrtab0003",
|
||
text: "通知",
|
||
img: "fa fa-cube",
|
||
hasChildren: false,
|
||
isexpand: false,
|
||
parentnodes: "lrTabs",
|
||
attr: {
|
||
value: "lrTab",
|
||
iconOn: "ion-ios-bell",
|
||
iconOff: "ion-ios-bell-outline",
|
||
innerTabPage: "DefaultPage",
|
||
},
|
||
setValue: setTabValue,
|
||
doButton: removeTab
|
||
},
|
||
{
|
||
id: "lrtab0004",
|
||
text: "我的",
|
||
img: "fa fa-cube",
|
||
hasChildren: false,
|
||
isexpand: false,
|
||
parentnodes: "lrTabs",
|
||
attr: {
|
||
value: "lrTab",
|
||
iconOn: "ion-ios-person",
|
||
iconOff: "ion-ios-person-outline",
|
||
innerTabPage: "DefaultPage",
|
||
},
|
||
setValue: setTabValue,
|
||
doButton: removeTab
|
||
}
|
||
];
|
||
if (data == undefined)
|
||
{
|
||
data = _data;
|
||
}
|
||
hasTabsTemplates[0].ChildNodes = data;
|
||
},
|
||
fnPageTree: {
|
||
init: function (obj) {
|
||
$rootScope.pageTree = obj;
|
||
refreshTree();
|
||
},
|
||
refresh: refreshTree,
|
||
focusNode: function (id) {
|
||
treeNotChecked();
|
||
$rootScope.pageTree.setNodeChecked(id);
|
||
},
|
||
refreshNode: refreshTreeNode
|
||
},
|
||
fnTabsTree: {
|
||
init: function (obj) {
|
||
$rootScope.tabsTree = obj;
|
||
refreshTabsTree();
|
||
},
|
||
refresh: refreshTabsTree,
|
||
focusNode: focusTabsNode
|
||
}
|
||
};
|
||
}])
|
||
.factory('$lrmDesigner', ['$rootScope', '$lrmComponents', '$lrmTemplates', '$http', '$lrdialogTop', '$lrGetIframe', '$lrfnGuid', function ($rootScope, $lrmComponents, $lrmTemplates, $http, $lrdialogTop, $lrGetIframe, $lrfnGuid) {
|
||
var designer = {
|
||
projectId: "",
|
||
projectName: "",
|
||
projectIcon: "icon-webApp.png",
|
||
currentPage: {},
|
||
currentFocus: {},
|
||
isTabsAdded:false,
|
||
templates: $lrmTemplates,
|
||
components:$lrmComponents,
|
||
api: {
|
||
saveProjectUrl: "../../AppManage/AppProjects/SaveForm",
|
||
getProjectUrl: "../../AppManage/AppProjects/GetFormJson"
|
||
},
|
||
doPhoneBroadcast: function (cmd, data) {
|
||
$lrGetIframe('phoneDIndex').doBroadcast(cmd, data);
|
||
},
|
||
vm: {
|
||
isBeginView: false
|
||
},
|
||
addPage: function (pageTemplate) {
|
||
var _dst = angular.copy(pageTemplate);
|
||
_dst.id = $lrfnGuid();
|
||
designer.currentPage = _dst;
|
||
designer.currentFocus = _dst;
|
||
designer.templates.addPage(_dst);
|
||
designer.doPhoneBroadcast(appBroadcastCode.cgSelectTemplatePage, { "cmd": "addPage", "object": _dst });
|
||
$.webappDesigner.attributes(designer);
|
||
},
|
||
saveProject: function () {
|
||
var _projectEntity = {
|
||
"F_Name": designer.projectName,
|
||
"F_Icon": designer.projectIcon,
|
||
};
|
||
if (_projectEntity.F_Name == "") {
|
||
$lrdialogTop('请输入项目名称', 'error');
|
||
return false;
|
||
}
|
||
|
||
$http.post(designer.api.saveProjectUrl + "?keyValue=" + designer.projectId, _projectEntity)
|
||
.success(function (data) {
|
||
$lrdialogTop('保存成功', 'success');
|
||
})
|
||
.error(function () {
|
||
$lrdialogTop('保存失败', 'error');
|
||
});
|
||
}
|
||
};
|
||
|
||
|
||
function onBroadcast() {
|
||
$rootScope.$on(appBroadcastCode.addComponent, function (event, data) {//添加组件
|
||
try {
|
||
var treeOne = {
|
||
text: data.text,
|
||
img: data.img,
|
||
parentnodes: designer.currentPage.id,
|
||
id: data.id,
|
||
attr: data,
|
||
setValue: designer.components.getOne(data.value).setValue,
|
||
doButton: designer.components.doRemove
|
||
};
|
||
designer.templates.addComponent(treeOne);
|
||
designer.templates.fnPageTree.refresh(treeOne.id);
|
||
designer.currentFocus = treeOne;
|
||
$.webappDesigner.attributes(designer);
|
||
}
|
||
catch (e)
|
||
{
|
||
console.log(e.message);
|
||
}
|
||
});
|
||
|
||
$rootScope.$on(appBroadcastCode.doTabTemplatePhone, function (event, data) {//对tab的操作
|
||
|
||
switch (data.cmd)
|
||
{
|
||
case "selectTab":
|
||
designer.templates.fnTabsTree.focusNode(data.id);
|
||
break;
|
||
case "duplicate":
|
||
var _dst = angular.copy(data.object);
|
||
_dst.id = $lrfnGuid();
|
||
designer.templates.getHasTabsTemps()[0].ChildNodes.push(_dst);
|
||
designer.templates.fnTabsTree.refresh();
|
||
designer.templates.fnTabsTree.focusNode(_dst.id);
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.doTabTemplate, { "cmd": "addTab", id: _dst.id });
|
||
break;
|
||
case "remove":
|
||
var _lists = designer.templates.getHasTabsTemps()[0].ChildNodes;
|
||
|
||
if (_lists.length > 1) {
|
||
_lists.splice(_lists.indexOf(data.object), 1);
|
||
designer.templates.fnTabsTree.refresh();
|
||
designer.templates.fnTabsTree.focusNode(_lists[0].id);
|
||
$rootScope.designer.doPhoneBroadcast(appBroadcastCode.doTabTemplate, { "cmd": "removeTab", id: _lists[0].id });
|
||
}
|
||
else {
|
||
$lrdialogTop('Tab不能全部删除', 'error');
|
||
}
|
||
break;
|
||
}
|
||
});
|
||
|
||
$rootScope.$on(appBroadcastCode.doComponentPhone, function (event, data) {//对tab的操作
|
||
designer.templates.fnPageTree.focusNode(data.id);
|
||
designer.currentFocus = designer.templates.getComponent(data.id, designer.currentPage.id);
|
||
$.webappDesigner.attributes(designer);
|
||
});
|
||
}
|
||
|
||
return {
|
||
init: function (projectId) {
|
||
designer.projectId = projectId;
|
||
if (designer.projectId == "") {
|
||
var tempData = designer.templates.addPage();
|
||
designer.templates.initTabs();
|
||
designer.currentPage = tempData;
|
||
designer.currentFocus = tempData;
|
||
$.webappDesigner.attributes(designer);
|
||
}
|
||
else {
|
||
$http.get(designer.api.getProjectUrl + "?keyValue=" + designer.projectId)
|
||
.success(function (data) {
|
||
designer.projectName = data.F_Name;
|
||
designer.projectIcon = data.F_Icon;
|
||
})
|
||
.error(function () {
|
||
designer.projectId = "";
|
||
$lrdialogTop('获取数据失败', 'error');
|
||
});
|
||
}
|
||
onBroadcast();
|
||
return designer;
|
||
}
|
||
};
|
||
}])
|
||
/*方法*/
|
||
.factory('$lrfnRequest', function () {//获取传递参数
|
||
return function (keyValue) {
|
||
var search = location.search.slice(1);
|
||
var arr = search.split("&");
|
||
for (var i = 0; i < arr.length; i++) {
|
||
var ar = arr[i].split("=");
|
||
if (ar[0] == keyValue) {
|
||
if (unescape(ar[1]) == 'undefined') {
|
||
return "";
|
||
} else {
|
||
return unescape(ar[1]);
|
||
}
|
||
}
|
||
}
|
||
return "";
|
||
}
|
||
})
|
||
.factory('$lrfnGuid', function () {
|
||
return function () {
|
||
var guid = "";
|
||
for (var i = 1; i <= 32; i++) {
|
||
var n = Math.floor(Math.random() * 16.0).toString(16);
|
||
guid += n;
|
||
if ((i == 8) || (i == 12) || (i == 16) || (i == 20)) guid += "-";
|
||
}
|
||
return guid;
|
||
};
|
||
})
|
||
.factory('$lrdialogTop', function () {
|
||
return function (content, type) {
|
||
$(".tip_container").remove();
|
||
var bid = parseInt(Math.random() * 100000);
|
||
$("body").prepend('<div id="tip_container' + bid + '" class="container tip_container"><div id="tip' + bid + '" class="mtip"><i class="micon"></i><span id="tsc' + bid + '"></span><i id="mclose' + bid + '" class="mclose"></i></div></div>');
|
||
var $this = $(this);
|
||
var $tip_container = $("#tip_container" + bid);
|
||
var $tip = $("#tip" + bid);
|
||
var $tipSpan = $("#tsc" + bid);
|
||
//先清楚定时器
|
||
clearTimeout(window.timer);
|
||
//主体元素绑定事件
|
||
$tip.attr("class", type).addClass("mtip");
|
||
$tipSpan.html(content);
|
||
$tip_container.slideDown(300);
|
||
//提示层隐藏定时器
|
||
window.timer = setTimeout(function () {
|
||
$tip_container.slideUp(300);
|
||
$(".tip_container").remove();
|
||
}, 4000);
|
||
$("#tip_container" + bid).css("left", ($(window).width() - $("#tip_container" + bid).width()) / 2);
|
||
}
|
||
})
|
||
.factory('$lrGetIframe', function () {
|
||
function isbrowsername() {
|
||
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
|
||
var isOpera = userAgent.indexOf("Opera") > -1;
|
||
if (isOpera) {
|
||
return "Opera"
|
||
}; //判断是否Opera浏览器
|
||
if (userAgent.indexOf("Firefox") > -1) {
|
||
return "FF";
|
||
} //判断是否Firefox浏览器
|
||
if (userAgent.indexOf("Chrome") > -1) {
|
||
if (window.navigator.webkitPersistentStorage.toString().indexOf('DeprecatedStorageQuota') > -1) {
|
||
return "Chrome";
|
||
} else {
|
||
return "360";
|
||
}
|
||
}//判断是否Chrome浏览器//360浏览器
|
||
if (userAgent.indexOf("Safari") > -1) {
|
||
return "Safari";
|
||
} //判断是否Safari浏览器
|
||
if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
|
||
return "IE";
|
||
}; //判断是否IE浏览器
|
||
}
|
||
return function (id) {
|
||
if (isbrowsername() == "Chrome" || isbrowsername() == "FF") {
|
||
return frames[id].contentWindow;
|
||
}
|
||
else {
|
||
return frames[id];
|
||
}
|
||
}
|
||
});
|
||
|
||
|
||
|
||
/*Dom操作和给外部调用的方法*/
|
||
(function ($) {
|
||
function lrAppBox(name, strhtml) {
|
||
var html = '<div class="lr-box expanded">';
|
||
html += '<h4 class="lr-box-toggle" onClick="lrappbox(this)"><span class="caret"></span>' + name + '</h4>';
|
||
html += '<div class="lr-box-content">' + strhtml + '</div>';
|
||
html += '</div>';
|
||
return html;
|
||
}
|
||
function lrAppColorPicker(color, width, name) {
|
||
var html = '<div class="input-append color" data-form="colorpicker" data-color="' + color + '" style="width:' + width + 'px;" data-color-format="hex">' +
|
||
'<span class="add-on"><i style="background-color: ' + color + '"></i></span>' +
|
||
'<input type="text" data-name="'+name+'" value="' + color + '" />' +
|
||
'</div>';
|
||
return html;
|
||
}
|
||
function buttonGroup(name,data,value, style) {
|
||
var html = '<div class="btn-group" style="' + style + '">';
|
||
|
||
for (var i in data) {
|
||
var _item = data[i];
|
||
var _icon = _item.icon == undefined ? '<span style="font-size:18px; line-height: 19px;">' + _item.text + '</span>' : '<span class="' + _item.icon + '"></span>';
|
||
var _actived = "";
|
||
if (_item.value == value)
|
||
{
|
||
_actived = "actived";
|
||
}
|
||
html += '<a type="button" class="btn btn-default ' + _actived + ' b' + data.length + ' " onClick="lrappBtnGroup(this)"><input type="text" data-name="' + name + '" style="display:none;" value="' + _item.value + '" >' + _icon + '</a>';
|
||
}
|
||
html += '</div>';
|
||
|
||
return html;
|
||
}
|
||
function lrAppToggle(name,value) {
|
||
var _active = '';
|
||
if (value == 'true' )
|
||
{
|
||
_active = 'active';
|
||
}
|
||
var _html = '<lrapp-toggle class="' + _active + '" onClick="lrappToggle(this)"><input type="text" data-name="' + name + '" style="display:none;" value="' + value + '" > <span class="left-text " ></span><div class="track"><div class="handle"></div></div><span class="right-text" ></span></lrapp-toggle>';
|
||
return _html;
|
||
}
|
||
function lrCombox(name, value, data, width) {
|
||
var _option = '';
|
||
for (var i in data)
|
||
{
|
||
var item = data[i];
|
||
_option += '<li data-value="' + item.value + '" data-icon = "' + item.icon + '" >' + item.text + '</li>';
|
||
}
|
||
var _html = '<div id="' + name + '" type="select" class="ui-select" data-name="' + name + '" data-value="' + value + '" style="width:' + width + 'px;display: inline-block;" >' + _option + '</div>';
|
||
return _html;
|
||
};
|
||
|
||
var _tempsAttr = {//模板属性设置
|
||
lrTabs: function (data) {
|
||
var _html = "";
|
||
var _boxHtml = "";
|
||
var _color = [
|
||
{ text: "Light", value: "light", icon: "<span class='color-square light-bg light-border space-right'></span>" },
|
||
{ text: "Stable", value: "stable", icon: "<span class='color-square stable-bg stable-border space-right'></span>" },
|
||
{ text: "Dark", value: "dark", icon: "<span class='color-square dark-bg dark-border space-right'></span>" },
|
||
{ text: "Positive", value: "positive", icon: "<span class='color-square positive-bg positive-border space-right'></span>" },
|
||
{ text: "Balanced", value: "balanced", icon: "<span class='color-square balanced-bg balanced-border space-right'></span>" },
|
||
{ text: "Assertive", value: "assertive", icon: "<span class='color-square assertive-bg assertive-border space-right'></span>" },
|
||
{ text: "Calm", value: "calm", icon: "<span class='color-square calm-bg calm-border space-right'></span>" },
|
||
{ text: "Energized", value: "energized", icon: "<span class='color-square energized-bg energized-border space-right'></span>" },
|
||
{ text: "Royal", value: "royal", icon: "<span class='color-square royal-bg royal-border space-right'></span>" }
|
||
];
|
||
var _types = [
|
||
{ text: "顶部图标", value: "top", icon: "" },
|
||
{ text: "只有图标", value: "only", icon: "" },
|
||
{ text: "左侧图标", value: "left", icon: "" },
|
||
];
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-title">' + data.text + '</span></div>';
|
||
|
||
_boxHtml += '<div class="form-group"><label class="control-label">背景色</label>' + lrCombox("bgColor", data.attr.bgColor, _color, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">图标色</label>' + lrCombox("iconColor", data.attr.iconColor, _color, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">类型</label>' + lrCombox("iconType", data.attr.iconType, _types, 205) + '</div>';
|
||
|
||
_html += lrAppBox('样式', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">增加新的Tab</button></div>';
|
||
return _html;
|
||
},
|
||
lrTab: function (data,designer) {
|
||
var _html = "";
|
||
var _boxHtml = "";
|
||
|
||
var _pages = designer.templates.getHasTemps();
|
||
var _innerPages = [];
|
||
for (var i in _pages)
|
||
{
|
||
var _item = _pages[i];
|
||
var _point = { text: _item.text, value: _item.id, icon: "" };
|
||
_innerPages.push(_point);
|
||
}
|
||
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>Tabs控制器</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">标题</label><input type="text" class="form-control" data-name="text" value="' + data.text + '" ></div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">未选中图标</label>' + lrCombox("iconOff", data.attr.iconOff, webAppData.iconList, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">选中图标</label>' + lrCombox("iconOn", data.attr.iconOn, webAppData.iconList, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">内嵌页面</label>' + lrCombox("innerTabPage", data.attr.innerTabPage, _innerPages, 205) + '</div>';
|
||
|
||
|
||
_html += lrAppBox('设置', _boxHtml);
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
return _html;
|
||
},
|
||
lrPageBlank: function (data) {
|
||
|
||
var _html = "";
|
||
var _boxHtml = "";
|
||
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-title">' + data.text + '</span></div>';
|
||
|
||
_html += '<div class="lr-box" style="padding-top:10px;">';
|
||
_html += '<div class="form-group"><label class="control-label">标题</label><input type="text" class="form-control W" data-name="text" value="' + data.text + '" ></div>';
|
||
_html += '<div class="form-group"><label class="control-label">路由</label><input type="text" class="form-control W" data-name="routing" value="' + data.attr.routing + '"></div></div>';
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">Color</label>' + lrAppColorPicker(data.attr.bgColor, 205, "bgColor") + '</div>';
|
||
_html += lrAppBox('背景', _boxHtml);
|
||
|
||
_boxHtml = '<div class="form-group form-toggle "><label class="control-label">显示tabs</label>' + lrAppToggle('isTabed', data.attr.isTabed) + '</div>';
|
||
_boxHtml += '<div class="form-group form-toggle "><label class="control-label">内边距</label>' + lrAppToggle('isPadding',data.attr.isPadding) + '</div>';
|
||
_boxHtml += '<div class="form-group form-toggle "><label class="control-label">隐藏头部</label>' + lrAppToggle('isHeadHide', data.attr.isHeadHide) + '</div>';
|
||
|
||
_html += lrAppBox('混合属性', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
|
||
return _html;
|
||
},
|
||
lrHeader: function (data, designer) {
|
||
|
||
var _html = '';
|
||
var _boxHtml = '';
|
||
var _size = [{ text: "H1", value: "H1", icon: "" },
|
||
{ text: "H2", value: "H2", icon: "" },
|
||
{ text: "H3", value: "H3", icon: "" },
|
||
{ text: "H4", value: "H4", icon: "" },
|
||
{ text: "H5", value: "H5", icon: "" }
|
||
];
|
||
var _weightSize = [{ text: "200", value: "200", icon: "" },
|
||
{ text: "300", value: "300", icon: "" },
|
||
{ text: "400", value: "400", icon: "" },
|
||
{ text: "500", value: "500", icon: "" },
|
||
{ text: "600", value: "600", icon: "" }
|
||
];
|
||
|
||
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>' + designer.currentPage.text + '</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
|
||
_boxHtml = '<div class="form-group"><input type="text" class="form-control W " data-name="text" value="' + data.text + '" ></div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Size</label>' + lrCombox("size", data.attr.size, _size, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Weight</label>' + lrCombox("weightSize", data.attr.weight.size, _weightSize, 100);
|
||
_boxHtml += buttonGroup("italic", [{ 'text': 'I', 'value': 'false' }, { 'icon': 'fa fa-italic', 'value': 'true' }], data.attr.weight.isItalic, "margin-left:5px;");
|
||
_boxHtml += '</div>';
|
||
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Color</label>' + lrAppColorPicker(data.attr.color, 205, "color") + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Align</label>';
|
||
_boxHtml += buttonGroup("align", [{ 'icon': 'fa fa-align-left', "value": "left" }, { 'icon': 'fa fa-align-center', "value": "center" }, { 'icon': 'fa fa-align-right', "value": "right" }, { 'icon': 'fa fa-align-justify', "value": "justify" }], data.attr.align);
|
||
_boxHtml += '</div>';
|
||
|
||
_html += lrAppBox('Text', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
|
||
return _html;
|
||
},
|
||
lrParagraph: function (data, designer) {
|
||
var _html = '';
|
||
var _boxHtml = '';
|
||
var _size = [
|
||
{ text: "12px", value: "12px", icon: "" },
|
||
{ text: "13px", value: "13px", icon: "" },
|
||
{ text: "14px", value: "14px", icon: "" },
|
||
{ text: "15px", value: "15px", icon: "" },
|
||
{ text: "16px", value: "16px", icon: "" },
|
||
{ text: "17px", value: "17px", icon: "" },
|
||
{ text: "18px", value: "18px", icon: "" },
|
||
{ text: "19px", value: "19px", icon: "" },
|
||
{ text: "20px", value: "20px", icon: "" },
|
||
{ text: "21px", value: "21px", icon: "" },
|
||
{ text: "22px", value: "22px", icon: "" },
|
||
{ text: "23px", value: "23px", icon: "" },
|
||
{ text: "24px", value: "24px", icon: "" },
|
||
{ text: "25px", value: "25px", icon: "" }
|
||
];
|
||
|
||
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>' + designer.currentPage.text + '</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Size</label>' + lrCombox("size", data.attr.size, _size, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Color</label>' + lrAppColorPicker(data.attr.color, 205, "color") + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Align</label>';
|
||
_boxHtml += buttonGroup("align", [{ 'icon': 'fa fa-align-left', "value": "left" }, { 'icon': 'fa fa-align-center', "value": "center" }, { 'icon': 'fa fa-align-right', "value": "right" }, { 'icon': 'fa fa-align-justify', "value": "justify" }], data.attr.align);
|
||
_boxHtml += '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">内容</label><textarea class="form-control W" data-name="content" style="resize: none;height:100px;">' + data.attr.content + '</textarea></div>';
|
||
|
||
|
||
|
||
_html += lrAppBox('Text', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
|
||
return _html;
|
||
},
|
||
lrBtn: function (data, designer) {
|
||
var _html = '';
|
||
var _boxHtml = '';
|
||
|
||
var _pages = designer.templates.getHasTemps();
|
||
var _innerPages = [];
|
||
for (var i in _pages) {
|
||
var _item = _pages[i];
|
||
var _point = { text: _item.text, value: _item.id, icon: "" };
|
||
_innerPages.push(_point);
|
||
}
|
||
var _size = [
|
||
{ text: "12px", value: "12px" },
|
||
{ text: "13px", value: "13px" },
|
||
{ text: "14px", value: "14px" },
|
||
{ text: "15px", value: "15px" },
|
||
{ text: "16px", value: "16px" },
|
||
{ text: "17px", value: "17px" },
|
||
{ text: "18px", value: "18px" },
|
||
{ text: "19px", value: "19px" },
|
||
{ text: "20px", value: "20px" },
|
||
{ text: "21px", value: "21px" },
|
||
{ text: "22px", value: "22px" },
|
||
{ text: "23px", value: "23px" },
|
||
{ text: "24px", value: "24px" },
|
||
{ text: "25px", value: "25px" }
|
||
];
|
||
var _weightSize = [{ text: "200", value: "200" },
|
||
{ text: "300", value: "300" },
|
||
{ text: "400", value: "400" },
|
||
{ text: "500", value: "500" },
|
||
{ text: "600", value: "600" }
|
||
];
|
||
var _color = [
|
||
{ text: "Light", value: "light", icon: "<span class='color-square light-bg light-border space-right'></span>" },
|
||
{ text: "Stable", value: "stable", icon: "<span class='color-square stable-bg stable-border space-right'></span>" },
|
||
{ text: "Dark", value: "dark", icon: "<span class='color-square dark-bg dark-border space-right'></span>" },
|
||
{ text: "Positive", value: "positive", icon: "<span class='color-square positive-bg positive-border space-right'></span>" },
|
||
{ text: "Balanced", value: "balanced", icon: "<span class='color-square balanced-bg balanced-border space-right'></span>" },
|
||
{ text: "Assertive", value: "assertive", icon: "<span class='color-square assertive-bg assertive-border space-right'></span>" },
|
||
{ text: "Calm", value: "calm", icon: "<span class='color-square calm-bg calm-border space-right'></span>" },
|
||
{ text: "Energized", value: "energized", icon: "<span class='color-square energized-bg energized-border space-right'></span>" },
|
||
{ text: "Royal", value: "royal", icon: "<span class='color-square royal-bg royal-border space-right'></span>" }
|
||
];
|
||
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>' + designer.currentPage.text + '</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">连接</label>' + lrCombox("link", data.attr.link, _innerPages, 205) + '</div>';
|
||
_html += lrAppBox('连接', _boxHtml);
|
||
|
||
_boxHtml = '<div class="form-group"><input type="text" class="form-control W " data-name="text" value="' + data.text + '" ></div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Size</label>' + lrCombox("size", data.attr.size, _size, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Weight</label>' + lrCombox("weightSize", data.attr.weight.size, _weightSize, 100);
|
||
_boxHtml += buttonGroup("italic", [{ 'text': 'I', 'value': 'false' }, { 'icon': 'fa fa-italic', 'value': 'true' }], data.attr.weight.isItalic, "margin-left:5px;");
|
||
_boxHtml += '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Color</label>' + lrAppColorPicker(data.attr.color, 205, "color") + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Align</label>';
|
||
_boxHtml += buttonGroup("align", [{ 'icon': 'fa fa-align-left', "value": "left" }, { 'icon': 'fa fa-align-center', "value": "center" }, { 'icon': 'fa fa-align-right', "value": "right" }, { 'icon': 'fa fa-align-justify', "value": "justify" }], data.attr.align);
|
||
_boxHtml += '</div>';
|
||
_html += lrAppBox('文本', _boxHtml);
|
||
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">类型</label>' + lrCombox("btnType", data.attr.btnType, [{ text: "Default", value: "default" }, { text: "Clear", value: "clear" }, { text: "Outline", value: "outline" }], 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">主题</label>' + lrCombox("btnTheme", data.attr.btnTheme, _color, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">尺寸</label>' + lrCombox("btnSize", data.attr.btnSize, [{ text: "Standard", value: "standard" }, { text: "Large", value: "large" }, { text: "Small", value: "small" }], 205) + '</div>';
|
||
|
||
_html += lrAppBox('样式', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
return _html;
|
||
},
|
||
lrInput: function (data, designer) {
|
||
var _html = '';
|
||
var _boxHtml = '';
|
||
|
||
var _type = [{ text: "Text", value: "text" },
|
||
{ text: "Password", value: "password" }
|
||
];
|
||
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>' + designer.currentPage.text + '</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">Placeholder</label><input type="text" class="form-control" data-name="placeholder" value="' + data.attr.placeholder + '" ></div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Type</label>' + lrCombox("inputType", data.attr.inputType, _type, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">Name</label><input type="text" class="form-control" data-name="name" value="' + data.attr.name + '" ></div>';
|
||
_html += lrAppBox('输入框设置', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
return _html;
|
||
},
|
||
lrList3: function (data, designer) {
|
||
var _html = '';
|
||
var _boxHtml = '';
|
||
|
||
var _pages = designer.templates.getHasTemps();
|
||
var _innerPages = [];
|
||
for (var i in _pages) {
|
||
var _item = _pages[i];
|
||
var _point = { text: _item.text, value: _item.id, icon: "" };
|
||
_innerPages.push(_point);
|
||
}
|
||
var _color = [
|
||
{ text: "Light", value: "light", icon: "<span class='color-square light-bg light-border space-right'></span>" },
|
||
{ text: "Stable", value: "stable", icon: "<span class='color-square stable-bg stable-border space-right'></span>" },
|
||
{ text: "Dark", value: "dark", icon: "<span class='color-square dark-bg dark-border space-right'></span>" },
|
||
{ text: "Positive", value: "positive", icon: "<span class='color-square positive-bg positive-border space-right'></span>" },
|
||
{ text: "Balanced", value: "balanced", icon: "<span class='color-square balanced-bg balanced-border space-right'></span>" },
|
||
{ text: "Assertive", value: "assertive", icon: "<span class='color-square assertive-bg assertive-border space-right'></span>" },
|
||
{ text: "Calm", value: "calm", icon: "<span class='color-square calm-bg calm-border space-right'></span>" },
|
||
{ text: "Energized", value: "energized", icon: "<span class='color-square energized-bg energized-border space-right'></span>" },
|
||
{ text: "Royal", value: "royal", icon: "<span class='color-square royal-bg royal-border space-right'></span>" }
|
||
];
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>' + designer.currentPage.text + '</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">连接</label>' + lrCombox("link", data.attr.link, _innerPages, 205) + '</div>';
|
||
_html += lrAppBox('连接', _boxHtml);
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">显示文本</label><input type="text" class="form-control" data-name="name" value="' + data.attr.name + '" ></div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">主题</label>' + lrCombox("color", data.attr.color, _color, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">图标</label>' + lrCombox("icon", data.attr.icon, webAppData.iconList, 205) + '</div>';
|
||
_html += lrAppBox('列表设置', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
return _html;
|
||
},
|
||
lrList4: function (data, designer) {
|
||
var _html = '';
|
||
var _boxHtml = '';
|
||
|
||
var _pages = designer.templates.getHasTemps();
|
||
var _innerPages = [];
|
||
for (var i in _pages) {
|
||
var _item = _pages[i];
|
||
var _point = { text: _item.text, value: _item.id, icon: "" };
|
||
_innerPages.push(_point);
|
||
}
|
||
var _color = [
|
||
{ text: "a", value: "a", icon: "<span class='color-square bgcolor_a light-border space-right'></span>" },
|
||
{ text: "b", value: "b", icon: "<span class='color-square bgcolor_b light-border space-right'></span>" },
|
||
{ text: "c", value: "c", icon: "<span class='color-square bgcolor_c light-border space-right'></span>" },
|
||
{ text: "d", value: "d", icon: "<span class='color-square bgcolor_d light-border space-right'></span>" },
|
||
{ text: "e", value: "e", icon: "<span class='color-square bgcolor_e light-border space-right'></span>" },
|
||
{ text: "f", value: "f", icon: "<span class='color-square bgcolor_f light-border space-right'></span>" },
|
||
{ text: "g", value: "g", icon: "<span class='color-square bgcolor_g light-border space-right'></span>" },
|
||
{ text: "h", value: "h", icon: "<span class='color-square bgcolor_h light-border space-right'></span>" }
|
||
];
|
||
_html += '<div class="lr-app-right-header"><span class="lr-app-typePage"><a>' + designer.currentPage.text + '</a><span class="lr-app-slash">/</span></span>' + data.text + '</div>';
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">连接</label>' + lrCombox("link", data.attr.link, _innerPages, 205) + '</div>';
|
||
_html += lrAppBox('连接', _boxHtml);
|
||
|
||
_boxHtml = '<div class="form-group"><label class="control-label">显示文本</label><input type="text" class="form-control" data-name="name" value="' + data.attr.name + '" ></div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">主题</label>' + lrCombox("color", data.attr.color, _color, 205) + '</div>';
|
||
_boxHtml += '<div class="form-group"><label class="control-label">图标</label>' + lrCombox("icon", data.attr.icon, webAppData.iconList, 205) + '</div>';
|
||
_html += lrAppBox('列表设置', _boxHtml);
|
||
|
||
_html += '<div style="margin:10px;"><button type="button" class="btn btn-danger btn-block">删除</button></div>';
|
||
return _html;
|
||
},
|
||
}
|
||
|
||
$.webappDesigner = {
|
||
attributes: function (data) {
|
||
//console.log(data.currentFocus);
|
||
//var $webAppDesign = angular.element('#webAppDesign');
|
||
//var $rootScope = $webAppDesign.scope().$root;
|
||
var _currentFocus = data.currentFocus;
|
||
var _attr = _currentFocus.attr;
|
||
var _currentPage = data.currentPage;
|
||
var strhtml = '';
|
||
var strBoxHtml = '';
|
||
|
||
strhtml = _tempsAttr[_attr.value](_currentFocus, data);
|
||
|
||
$('.lr-app-right-bar').html(strhtml).ready(function () {
|
||
$('.color').colorpicker();
|
||
$('.ui-select').each(function (r) {
|
||
$(this).ComboBox({
|
||
height: "400px",
|
||
}).bind('change', function () {
|
||
var $obj = $(this);
|
||
var _value = $obj.attr('data-value');
|
||
var _name = $obj.attr("data-name");
|
||
data.currentFocus.setValue(_name, _value, data.currentFocus);
|
||
});
|
||
});
|
||
$('.lr-app-right-bar input').unbind();
|
||
$('.lr-app-right-bar input').bind('input propertychange', function () {
|
||
var $obj = $(this);
|
||
var _value = $obj.val();
|
||
var _name = $obj.attr("data-name");
|
||
if (_name == "routing")
|
||
{
|
||
if (_value.indexOf("/") < 0)
|
||
{
|
||
_value = "/" + _value;
|
||
$obj.val(_value);
|
||
}
|
||
}
|
||
data.currentFocus.setValue(_name, _value, data.currentFocus);
|
||
});
|
||
$('.lr-app-right-bar textarea').unbind();
|
||
$('.lr-app-right-bar textarea').bind('valuechange', function () {
|
||
var $obj = $(this);
|
||
var _value = $obj.val();
|
||
var _name = $obj.attr("data-name");
|
||
data.currentFocus.setValue(_name, _value, data.currentFocus);
|
||
});
|
||
|
||
$('button').on('click', function () {
|
||
data.currentFocus.doButton(data.currentFocus);
|
||
});
|
||
});
|
||
},
|
||
doBroadcast: function (name, data) {//发送广播
|
||
var $webAppDesign = angular.element('#webAppDesign');
|
||
var $rootScope = $webAppDesign.scope().$root;
|
||
$rootScope.$broadcast(name, data);//iframeLoaded
|
||
}
|
||
};
|
||
|
||
$.event.special.valuechange = {
|
||
teardown: function (namespaces) {
|
||
$(this).unbind('.valuechange');
|
||
},
|
||
handler: function (e) {
|
||
$.event.special.valuechange.triggerChanged($(this));
|
||
},
|
||
add: function (obj) {
|
||
$(this)
|
||
.on(
|
||
'keyup.valuechange cut.valuechange paste.valuechange input.valuechange',
|
||
obj.selector, $.event.special.valuechange.handler)
|
||
},
|
||
triggerChanged: function (element) {
|
||
var current = element[0].contentEditable === 'true' ? element
|
||
.html() : element.val(), previous = typeof element
|
||
.data('previous') === 'undefined' ? element[0].defaultValue
|
||
: element.data('previous')
|
||
if (current !== previous) {
|
||
element.trigger('valuechange', [element.data('previous')])
|
||
element.data('previous', current)
|
||
}
|
||
}
|
||
}
|
||
$.fn.ComboBox = function (options) {
|
||
//options参数：description,height,width,allowSearch,url,param,data
|
||
options.id = "key";
|
||
options.text = "text";
|
||
var $select = $(this);
|
||
var json = options.data = [];
|
||
var _description = $select.attr("data-value");
|
||
$select.find('li').each(function (r) {
|
||
var $obj = $(this);
|
||
var _text = $obj.html();
|
||
var _value = $obj.attr('data-value');
|
||
var _icon = $obj.attr('data-icon');
|
||
var _a = {};
|
||
|
||
_a[options.id] = _value;
|
||
_a[options.text] = _text;
|
||
_a["icon"] = (_icon == "undefined" ? "" : _icon);
|
||
if (_description == _value)
|
||
{
|
||
_description = _a["icon"] + _text;
|
||
}
|
||
json.push(_a);
|
||
});
|
||
|
||
var _name = $select.attr("data-name");
|
||
|
||
if (options) {
|
||
if ($select.find('.ui-select-text').length == 0) {
|
||
var $select_html = "";
|
||
$select_html += "<div class=\"ui-select-text\" style='color:#999;'>" + _description + "</div>";
|
||
$select_html += "<div class=\"ui-select-option\">";
|
||
$select_html += "<div class=\"ui-select-option-content\" style=\"max-height: " + options.height + "\">" + $select.html() + "</div>";
|
||
if (options.allowSearch) {
|
||
$select_html += "<div class=\"ui-select-option-search\"><input type=\"text\" class=\"form-control\" placeholder=\"搜索关键字\" /><span class=\"input-query\" title=\"Search\"><i class=\"fa fa-search\"></i></span></div>";
|
||
}
|
||
$select_html += "</div>";
|
||
$select.html('');
|
||
$select.append($select_html);
|
||
}
|
||
}
|
||
var $option_html = $($("<p>").append($select.find('.ui-select-option').clone()).html());
|
||
$option_html.attr('id', $select.attr('id') + '-option');
|
||
$select.find('.ui-select-option').remove();
|
||
if ($option_html.length > 0) {
|
||
$('body').find('#' + $select.attr('id') + '-option').remove();
|
||
}
|
||
$('body').prepend($option_html);
|
||
var $option = $("#" + $select.attr('id') + "-option");
|
||
//var json = options.data;
|
||
|
||
loadComboBoxView(json);
|
||
function loadComboBoxView(json, searchValue, m) {
|
||
if (json.length > 0) {
|
||
var $_html = $('<ul></ul>');
|
||
if (options.description) {
|
||
$_html.append('<li data-value="">' + options.description + '</li>');
|
||
}
|
||
$.each(json, function (i) {
|
||
var row = json[i];
|
||
var title = row[options.title];
|
||
if (title == undefined) {
|
||
title = "";
|
||
}
|
||
if (searchValue != undefined) {
|
||
if (row[m.text].indexOf(searchValue) != -1) {
|
||
$_html.append('<li data-value="' + row[options.id] + '" title="' + title + '">' + row.icon + row[options.text] + '</li>');
|
||
}
|
||
}
|
||
else {
|
||
$_html.append('<li data-value="' + row[options.id] + '" title="' + title + '">' + row.icon + row[options.text] + '</li>');
|
||
}
|
||
});
|
||
$option.find('.ui-select-option-content').html($_html);
|
||
$option.find('li').css('padding', "0 5px");
|
||
$option.find('li').click(function (e) {
|
||
var data_text = $(this).html();
|
||
var data_value = $(this).attr('data-value');
|
||
$select.attr("data-value", data_value).attr("data-text", data_text);
|
||
$select.find('.ui-select-text').html(data_text).css('color', '#000');
|
||
$option.slideUp(150);
|
||
$select.trigger("change");
|
||
e.stopPropagation();
|
||
}).hover(function (e) {
|
||
if (!$(this).hasClass('liactive')) {
|
||
$(this).toggleClass('on');
|
||
}
|
||
e.stopPropagation();
|
||
});
|
||
}
|
||
}
|
||
//操作搜索事件
|
||
if (options.allowSearch) {
|
||
$option.find('.ui-select-option-search').find('input').bind("keypress", function (e) {
|
||
if (event.keyCode == "13") {
|
||
var value = $(this).val();
|
||
loadComboBoxView($(this)[0].options.data, value, $(this)[0].options);
|
||
}
|
||
}).focus(function () {
|
||
$(this).select();
|
||
})[0]["options"] = options;
|
||
}
|
||
|
||
$select.unbind('click');
|
||
$select.bind("click", function (e) {
|
||
if ($select.attr('readonly') == 'readonly' || $select.attr('disabled') == 'disabled') {
|
||
return false;
|
||
}
|
||
$(this).addClass('ui-select-focus');
|
||
if ($option.is(":hidden")) {
|
||
$select.find('.ui-select-option').hide();
|
||
$('.ui-select-option').hide();
|
||
var left = $select.offset().left;
|
||
var top = $select.offset().top + 35;
|
||
var width = $select.width();
|
||
if (options.width) {
|
||
width = options.width;
|
||
}
|
||
if (($option.height() + top) < $(window).height()) {
|
||
$option.slideDown(150).css({ top: top, left: left, width: width });
|
||
} else {
|
||
var _top = (top - $option.height() - 32)
|
||
$option.show().css({ top: _top, left: left, width: width });
|
||
$option.attr('data-show', true);
|
||
}
|
||
$option.css('border-top', '1px solid #ccc');
|
||
$option.find('li').removeClass('liactive');
|
||
$option.find('[data-value=' + $select.attr('data-value') + ']').addClass('liactive');
|
||
$option.find('.ui-select-option-search').find('input').select();
|
||
} else {
|
||
if ($option.attr('data-show')) {
|
||
$option.hide();
|
||
} else {
|
||
$option.slideUp(150);
|
||
}
|
||
}
|
||
e.stopPropagation();
|
||
});
|
||
$(document).click(function (e) {
|
||
var e = e ? e : window.event;
|
||
var tar = e.srcElement || e.target;
|
||
if (!$(tar).hasClass('form-control')) {
|
||
if ($option.attr('data-show')) {
|
||
$option.hide();
|
||
} else {
|
||
$option.slideUp(150);
|
||
}
|
||
$select.removeClass('ui-select-focus');
|
||
e.stopPropagation();
|
||
}
|
||
});
|
||
return $select;
|
||
}
|
||
$.fn.ComboBoxSetValue = function (value) {
|
||
if ($.isNullOrEmpty(value)) {
|
||
return;
|
||
}
|
||
var $select = $(this);
|
||
var $option = $("#" + $select.attr('id') + "-option");
|
||
$select.attr('data-value', value);
|
||
var data_text = $option.find('ul').find('[data-value=' + value + ']').html();
|
||
if (data_text) {
|
||
$select.attr('data-text', data_text);
|
||
$select.find('.ui-select-text').html(data_text).css('color', '#000');
|
||
$option.find('ul').find('[data-value=' + value + ']').addClass('liactive')
|
||
}
|
||
return $select;
|
||
}
|
||
|
||
})(window.jQuery);
|
||
|
||
function lrappbox(a) {
|
||
var $obj = $(a).parent();
|
||
if ($obj.is('.expanded')) {
|
||
$obj.removeClass('expanded');
|
||
}
|
||
else {
|
||
$obj.addClass('expanded');
|
||
}
|
||
}
|
||
function lrappBtnGroup(a) {
|
||
var $obj = $(a).parent();
|
||
$input = $(a).find('input');
|
||
$obj.find('.actived').removeClass('actived');
|
||
$(a).addClass('actived');
|
||
$input.trigger('propertychange');
|
||
}
|
||
function lrappToggle(a) {
|
||
var $obj = $(a);
|
||
$input = $obj.find('input');
|
||
$obj.addClass("animate");
|
||
var flag = $obj.is(".active");
|
||
if (flag) {
|
||
$input.val(false);
|
||
$obj.removeClass("active");
|
||
}
|
||
else {
|
||
$input.val(true);
|
||
$obj.addClass("active");
|
||
}
|
||
$input.trigger('propertychange');
|
||
}
|