ecp-ui-lib
Version:
136 lines • 12.2 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, EventEmitter, Input, Output } from '@angular/core';
export class ToolBarComponent {
constructor() {
this.customStyle = {};
this.selectId = new EventEmitter();
this.menuJSON = [{
'name': '添加元素',
'url': 'http://www.google.com',
'chird': [
{
'name': '坐标',
'url': 'add_point'
},
{
'name': '传感器',
'url': 'add_sensor'
},
{
'name': '管道',
'url': 'add_pipe'
},
{
'name': '节点',
'url': 'add_node'
},
{
'name': '堵头封板',
'url': 'add_plug'
},
{
'name': '闸阀',
'url': 'add_valve'
},
{
'name': '消防栓',
'url': 'add_hydrant'
}
]
}, {
'name': '筛查',
'url': 'screening',
'chird': null
}, {
'name': '预警',
'url': 'http://www.google.com',
'chird': [
{
'name': '实时流量显示',
'url': 'http://www.google.com',
'isSwitch': true
},
{
'name': '分区用水量分析',
'url': 'http://www.baidu.com'
}
]
}, {
'name': '爆管分析',
'url': 'analysis_pipe',
'chird': null
}, {
'name': '阀门分析',
'url': 'analysis_valve',
'chird': null
}];
this.hoverId = 0; // 当前已选中
// 当前已选中
this.thisMenuId = 0; // 当前选中子菜单
}
// 当前选中子菜单
/**
* @param {?} url
* @return {?}
*/
click(url) {
this.selectId.emit(url);
}
/**
* @param {?} i
* @return {?}
*/
menuSel(i) {
this.hoverId = i;
this.thisMenuId = i;
}
/**
* @param {?} i
* @return {?}
*/
showSubMenu(i) {
this.hoverId = i;
this.thisMenuId = i;
}
/**
* @return {?}
*/
ngOnInit() {
this.menuJSON.reverse();
}
}
ToolBarComponent.decorators = [
{ type: Component, args: [{
selector: 'ecp-tool-bar',
template: "<div class=\"map-top-toolbar\" [ngStyle]=\"customStyle\" >\r\n <span *ngFor=\"let item of menuJSON;let i = index;\">\r\n <a (click)=\"menuSel(i);click(item.url)\" (mouseover)=\"menuSel(i)\"\r\n [ngClass]=\"{'hover':hoverId==i}\">{{item.name}} <i class=\"icon dongxiniotwater general_unfold\" *ngIf=\"item.chird!=null\"></i></a>\r\n <ul class=\"sub-menu\" [ngClass]=\"{'show':thisMenuId==i}\" (mouseleave)=\"showSubMenu(50)\">\r\n <ng-container *ngFor=\"let childmenu of item.chird;let childId = index; \">\r\n <li [ngClass]=\"{'switch':childmenu.isSwitch==true}\" (click)=\"click(childmenu.url)\">{{childmenu.name}} <span *ngIf=\"childmenu.isSwitch==true\"><!--<nz-switch nzSize=\"small\"></nz-switch>--></span></li>\r\n </ng-container>\r\n </ul>\r\n </span>\r\n</div>\r\n",
styles: [".map-top-toolbar{position:absolute;font-weight:400;color:rgba(25,25,25,1);font-size:16px;height:36px;line-height:36px;text-align:center;background:rgba(255,255,255,1);border-radius:4px;box-shadow:0 0 4px rgba(0,0,0,.3)}.map-top-toolbar span{position:relative;width:100px;height:auto;float:right;text-align:center;cursor:pointer;font-size:14px;color:rgba(255,255,255,1)}.map-top-toolbar span a{height:36px;display:block;color:#191919;border-right:1px solid #dadada}.map-top-toolbar span a.hover,.map-top-toolbar span a:hover{background:#1e5bd6;color:#fff}.map-top-toolbar span:first-child a{border-radius:0 4px 4px 0;border-right:0 solid #dadada!important}.map-top-toolbar span:last-child a{border-radius:4px 0 0 4px}.map-top-toolbar span a i{vertical-align:middle;font-size:6px;margin-left:2px;color:#999}.map-top-toolbar .sub-menu{position:absolute;right:0;top:-10000px;min-width:100px;color:#000;padding:0;background:rgba(255,255,255,1);box-shadow:0 3px 8px 0 rgba(0,0,0,.3);height:auto;margin:0}.map-top-toolbar .show{top:37px}.map-top-toolbar .sub-menu li{box-sizing:border-box;width:100%;text-align:left;height:42px;line-height:42px;padding:0 0 0 16px;color:rgba(25,25,25,1);list-style:none}.map-top-toolbar .sub-menu li.switch{width:170px}.map-top-toolbar .sub-menu li.switch>span{display:inline-block;width:40px;float:right;margin-right:7px}.map-top-toolbar .sub-menu li:hover{background:#d2ddf2;color:#191919}"]
}] }
];
/** @nocollapse */
ToolBarComponent.ctorParameters = () => [];
ToolBarComponent.propDecorators = {
customX: [{ type: Input }],
customY: [{ type: Input }],
customStyle: [{ type: Input }],
selectId: [{ type: Output }]
};
if (false) {
/** @type {?} */
ToolBarComponent.prototype.customX;
/** @type {?} */
ToolBarComponent.prototype.customY;
/** @type {?} */
ToolBarComponent.prototype.customStyle;
/** @type {?} */
ToolBarComponent.prototype.selectId;
/** @type {?} */
ToolBarComponent.prototype.menuJSON;
/** @type {?} */
ToolBarComponent.prototype.hoverId;
/** @type {?} */
ToolBarComponent.prototype.thisMenuId;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9vbC1iYXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vZWNwLXVpLWxpYi8iLCJzb3VyY2VzIjpbImxpYi90b29sLWJhci90b29sLWJhci5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFPN0UsTUFBTSxPQUFPLGdCQUFnQjtJQUV6QjtRQUtTLGdCQUFXLEdBQVcsRUFBRSxDQUFDO1FBRXhCLGFBQVEsR0FBeUIsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUU5RCxhQUFRLEdBQUcsQ0FBQztnQkFDUixNQUFNLEVBQUUsTUFBTTtnQkFDZCxLQUFLLEVBQUUsdUJBQXVCO2dCQUM5QixPQUFPLEVBQUU7b0JBQ0w7d0JBQ0ksTUFBTSxFQUFFLElBQUk7d0JBQ1osS0FBSyxFQUFFLFdBQVc7cUJBQ3JCO29CQUNEO3dCQUNJLE1BQU0sRUFBRSxLQUFLO3dCQUNiLEtBQUssRUFBRSxZQUFZO3FCQUN0QjtvQkFDRDt3QkFDSSxNQUFNLEVBQUUsSUFBSTt3QkFDWixLQUFLLEVBQUUsVUFBVTtxQkFDcEI7b0JBQ0Q7d0JBQ0ksTUFBTSxFQUFFLElBQUk7d0JBQ1osS0FBSyxFQUFFLFVBQVU7cUJBQ3BCO29CQUNEO3dCQUNJLE1BQU0sRUFBRSxNQUFNO3dCQUNkLEtBQUssRUFBRSxVQUFVO3FCQUNwQjtvQkFDRDt3QkFDSSxNQUFNLEVBQUUsSUFBSTt3QkFDWixLQUFLLEVBQUUsV0FBVztxQkFDckI7b0JBQ0Q7d0JBQ0ksTUFBTSxFQUFFLEtBQUs7d0JBQ2IsS0FBSyxFQUFFLGFBQWE7cUJBQ3ZCO2lCQUNKO2FBQ0osRUFBRTtnQkFDQyxNQUFNLEVBQUUsSUFBSTtnQkFDWixLQUFLLEVBQUUsV0FBVztnQkFDbEIsT0FBTyxFQUFFLElBQUk7YUFDaEIsRUFBRTtnQkFDQyxNQUFNLEVBQUUsSUFBSTtnQkFDWixLQUFLLEVBQUUsdUJBQXVCO2dCQUM5QixPQUFPLEVBQUU7b0JBQ0w7d0JBQ0ksTUFBTSxFQUFFLFFBQVE7d0JBQ2hCLEtBQUssRUFBRSx1QkFBdUI7d0JBQzlCLFVBQVUsRUFBRSxJQUFJO3FCQUNuQjtvQkFDRDt3QkFDSSxNQUFNLEVBQUUsU0FBUzt3QkFDakIsS0FBSyxFQUFFLHNCQUFzQjtxQkFDaEM7aUJBQ0o7YUFDSixFQUFFO2dCQUNDLE1BQU0sRUFBRSxNQUFNO2dCQUNkLEtBQUssRUFBRSxlQUFlO2dCQUN0QixPQUFPLEVBQUUsSUFBSTthQUNoQixFQUFFO2dCQUNDLE1BQU0sRUFBRSxNQUFNO2dCQUNkLEtBQUssRUFBRSxnQkFBZ0I7Z0JBQ3ZCLE9BQU8sRUFBRSxJQUFJO2FBQ2hCLENBQUMsQ0FBQztRQUVILFlBQU8sR0FBRyxDQUFDLENBQUMsQ0FBQyxRQUFROztRQUNyQixlQUFVLEdBQUcsQ0FBQyxDQUFDLENBQUMsVUFBVTtJQXRFMUIsQ0FBQzs7Ozs7O0lBd0VELEtBQUssQ0FBQyxHQUFHO1FBQ0wsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7SUFDNUIsQ0FBQzs7Ozs7SUFDRCxPQUFPLENBQUMsQ0FBQztRQUNMLElBQUksQ0FBQyxPQUFPLEdBQUcsQ0FBQyxDQUFDO1FBQ2pCLElBQUksQ0FBQyxVQUFVLEdBQUcsQ0FBQyxDQUFDO0lBQ3hCLENBQUM7Ozs7O0lBRUQsV0FBVyxDQUFDLENBQUM7UUFDVCxJQUFJLENBQUMsT0FBTyxHQUFHLENBQUMsQ0FBQztRQUNqQixJQUFJLENBQUMsVUFBVSxHQUFHLENBQUMsQ0FBQztJQUN4QixDQUFDOzs7O0lBRUQsUUFBUTtRQUVKLElBQUksQ0FBQyxRQUFRLENBQUMsT0FBTyxFQUFFLENBQUM7SUFDNUIsQ0FBQzs7O1lBaEdKLFNBQVMsU0FBQztnQkFDUCxRQUFRLEVBQUUsY0FBYztnQkFDeEIsNHlCQUF3Qzs7YUFFM0M7Ozs7O3NCQU1JLEtBQUs7c0JBQ0wsS0FBSzswQkFDTCxLQUFLO3VCQUVMLE1BQU07Ozs7SUFKUCxtQ0FBaUI7O0lBQ2pCLG1DQUFpQjs7SUFDakIsdUNBQWtDOztJQUVsQyxvQ0FBOEQ7O0lBRTlELG9DQTJERzs7SUFFSCxtQ0FBWTs7SUFDWixzQ0FBZSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnZWNwLXRvb2wtYmFyJyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi90b29sLWJhci5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi90b29sLWJhci5jb21wb25lbnQuY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFRvb2xCYXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKCkge1xyXG4gICAgfVxyXG5cclxuICAgIEBJbnB1dCgpIGN1c3RvbVg7XHJcbiAgICBASW5wdXQoKSBjdXN0b21ZO1xyXG4gICAgQElucHV0KCkgY3VzdG9tU3R5bGU6IG9iamVjdCA9IHt9O1xyXG5cclxuICAgIEBPdXRwdXQoKSBzZWxlY3RJZDogRXZlbnRFbWl0dGVyPHN0cmluZz4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XHJcblxyXG4gICAgbWVudUpTT04gPSBbe1xyXG4gICAgICAgICduYW1lJzogJ+a3u+WKoOWFg+e0oCcsXHJcbiAgICAgICAgJ3VybCc6ICdodHRwOi8vd3d3Lmdvb2dsZS5jb20nLFxyXG4gICAgICAgICdjaGlyZCc6IFtcclxuICAgICAgICAgICAge1xyXG4gICAgICAgICAgICAgICAgJ25hbWUnOiAn5Z2Q5qCHJyxcclxuICAgICAgICAgICAgICAgICd1cmwnOiAnYWRkX3BvaW50J1xyXG4gICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICB7XHJcbiAgICAgICAgICAgICAgICAnbmFtZSc6ICfkvKDmhJ/lmagnLFxyXG4gICAgICAgICAgICAgICAgJ3VybCc6ICdhZGRfc2Vuc29yJ1xyXG4gICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICB7XHJcbiAgICAgICAgICAgICAgICAnbmFtZSc6ICfnrqHpgZMnLFxyXG4gICAgICAgICAgICAgICAgJ3VybCc6ICdhZGRfcGlwZSdcclxuICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAge1xyXG4gICAgICAgICAgICAgICAgJ25hbWUnOiAn6IqC54K5JyxcclxuICAgICAgICAgICAgICAgICd1cmwnOiAnYWRkX25vZGUnXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIHtcclxuICAgICAgICAgICAgICAgICduYW1lJzogJ+WgteWktOWwgeadvycsXHJcbiAgICAgICAgICAgICAgICAndXJsJzogJ2FkZF9wbHVnJ1xyXG4gICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICB7XHJcbiAgICAgICAgICAgICAgICAnbmFtZSc6ICfpl7jpmIAnLFxyXG4gICAgICAgICAgICAgICAgJ3VybCc6ICdhZGRfdmFsdmUnXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIHtcclxuICAgICAgICAgICAgICAgICduYW1lJzogJ+a2iOmYsuagkycsXHJcbiAgICAgICAgICAgICAgICAndXJsJzogJ2FkZF9oeWRyYW50J1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgXVxyXG4gICAgfSwge1xyXG4gICAgICAgICduYW1lJzogJ+etm+afpScsXHJcbiAgICAgICAgJ3VybCc6ICdzY3JlZW5pbmcnLFxyXG4gICAgICAgICdjaGlyZCc6IG51bGxcclxuICAgIH0sIHtcclxuICAgICAgICAnbmFtZSc6ICfpooToraYnLFxyXG4gICAgICAgICd1cmwnOiAnaHR0cDovL3d3dy5nb29nbGUuY29tJyxcclxuICAgICAgICAnY2hpcmQnOiBbXHJcbiAgICAgICAgICAgIHtcclxuICAgICAgICAgICAgICAgICduYW1lJzogJ+WunuaXtua1gemHj+aYvuekuicsXHJcbiAgICAgICAgICAgICAgICAndXJsJzogJ2h0dHA6Ly93d3cuZ29vZ2xlLmNvbScsXHJcbiAgICAgICAgICAgICAgICAnaXNTd2l0Y2gnOiB0cnVlXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIHtcclxuICAgICAgICAgICAgICAgICduYW1lJzogJ+WIhuWMuueUqOawtOmHj+WIhuaekCcsXHJcbiAgICAgICAgICAgICAgICAndXJsJzogJ2h0dHA6Ly93d3cuYmFpZHUuY29tJ1xyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgXVxyXG4gICAgfSwge1xyXG4gICAgICAgICduYW1lJzogJ+eIhueuoeWIhuaekCcsXHJcbiAgICAgICAgJ3VybCc6ICdhbmFseXNpc19waXBlJyxcclxuICAgICAgICAnY2hpcmQnOiBudWxsXHJcbiAgICB9LCB7XHJcbiAgICAgICAgJ25hbWUnOiAn6ZiA6Zeo5YiG5p6QJyxcclxuICAgICAgICAndXJsJzogJ2FuYWx5c2lzX3ZhbHZlJyxcclxuICAgICAgICAnY2hpcmQnOiBudWxsXHJcbiAgICB9XTtcclxuXHJcbiAgICBob3ZlcklkID0gMDsgLy8g5b2T5YmN5bey6YCJ5LitXHJcbiAgICB0aGlzTWVudUlkID0gMDsgLy8g5b2T5YmN6YCJ5Lit5a2Q6I+c5Y2VXHJcblxyXG4gICAgY2xpY2sodXJsKSB7XHJcbiAgICAgICAgdGhpcy5zZWxlY3RJZC5lbWl0KHVybCk7XHJcbiAgICB9XHJcbiAgICBtZW51U2VsKGkpIHtcclxuICAgICAgICB0aGlzLmhvdmVySWQgPSBpO1xyXG4gICAgICAgIHRoaXMudGhpc01lbnVJZCA9IGk7XHJcbiAgICB9XHJcblxyXG4gICAgc2hvd1N1Yk1lbnUoaSkge1xyXG4gICAgICAgIHRoaXMuaG92ZXJJZCA9IGk7XHJcbiAgICAgICAgdGhpcy50aGlzTWVudUlkID0gaTtcclxuICAgIH1cclxuXHJcbiAgICBuZ09uSW5pdCgpIHtcclxuXHJcbiAgICAgICAgdGhpcy5tZW51SlNPTi5yZXZlcnNlKCk7XHJcbiAgICB9XHJcblxyXG59XHJcbiJdfQ==