[{"__symbolic":"module","version":4,"metadata":{"DateTimeSettingModalComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/font-element-setting-modal","name":"FontElementSettingModal","line":15,"character":51},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"date-time-setting-modal","styles":[".element-setting-base{ .inline-label { margin: 10px 0px 0px 10px; display: inline-block; } .border-group { // border: 1px solid #ddd; padding: 5px; margin-bottom: 0px; } .inline-selector { display: inline-block; margin: 5px 0px; } .inline-variable { display: inline-block; margin: 5px 0px; } .inline-input { display: inline-block; margin: 5px 0px; }     } .date-time-setting-modal { .modal-content { width: 600px; } .cursor-pointer{ cursor: pointer; } .recode-input{ width: calc(100% - 70px); border: 1px solid #d7dbe5;   padding:  5px 10px; } textarea.noResize { resize: none; } } .toggleViewSettingModal { .modal-content { width: 600px; } } .textSettingModal { .modal-content { width: 600px; } } "],"template":"<div bsModal #settingModal=\"bs-modal\" id=\"dateTimeSettingModal\" class=\"modal fade element-setting-base date-time-setting-modal\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"settingModal\" aria-hidden=\"true\" (onHidden)=\"onHidden()\" [config]=\"{backdrop: 'static'}\"> <div class=\"modal-dialog\"> <div class=\"modal-content element-setting-base\"> <div class=\"fe-modal-container\"> <form class=\"configure\" *ngIf=\"active\" #dateTimeSettingForm=\"ngForm\" novalidate (ngSubmit)=\"save()\"> <div class=\"modal-header fe-modal-header\"> <h4 class=\"fe-modal-header-title\"> {{lc(\"DatetimeDisplay\")}} </h4> <div class=\"fe-modal-header-close\" aria-label=\"Close\" (click)=\"close()\">×</div> </div> <div class=\"top-line\"></div> <div class=\"fe-modal-middle design-nav-link\"> <tabset #staticTabs class=\"tab-container tabbable-line\"> <tab heading=\"{{lc('Setting')}}\" customClass=\"m-tabs__item\"> <div class=\"fe-modal-body\"> <div> <div class=\"fe-option-head\"> <label> <input type=\"checkbox\" name=\"showDate\" [(ngModel)]=\"showDate\" /> <span>{{lc(\"DisplayDate\")}}</span> </label> </div> <div class=\"fe-modal-content\" *ngIf=\"showDate\"> <div class=\"fe-transverse-label clearfix\"> <div class=\"fe-half-line float-left\"> <div class=\"fe-transverse-title\">{{lc(\"Formats\")}}</div> <select class=\"fe-transverse-input\" name=\"dateFormat\" [(ngModel)]=\"dateFormat\"> <option *ngFor=\"let dateFormats of dateFormatList\" [ngValue]=\"dateFormats.value\"> {{dateFormats.name}} </option> </select> </div> <div class=\"fe-half-line float-left\"> <div class=\"fe-transverse-title\">{{lc(\"Separators\")}}</div> <select class=\"fe-transverse-input\" name=\"datetimeSeparator\" [(ngModel)]=\"datetimeSeparator\"> <option *ngFor=\"let datetimeSeparators of datetimeSeparatorList\" [ngValue]=\"datetimeSeparators.value\"> {{datetimeSeparators.name}} </option> </select> </div> </div> <div class=\"fe-transverse-label clearfix\"> <div class=\"fe-half-line float-left\"> <label> <input type=\"checkbox\" name=\"showFullYear\" [(ngModel)]=\"showFullYear\" /> <span>{{lc(\"DisplayFullYear\")}}</span> </label> </div> <div class=\"fe-half-line float-left\"> <label> <input type=\"checkbox\" name=\"showMonthDayWithoutZero\" [(ngModel)]=\"showMonthDayWithoutZero\" /> <span>{{lc(\"DisplayMonthDayWithoutZero\")}}</span> </label> </div> </div> </div> </div> <div class=\"fe-option-head\"> <label> <input type=\"checkbox\" name=\"showWeek\" [(ngModel)]=\"showWeek\" /> <span>{{lc(\"DisplayWeek\")}}</span> </label> </div> <div> <div class=\"fe-option-head\"> <label> <input type=\"checkbox\" name=\"showTime\" [(ngModel)]=\"showTime\" /> <span>{{lc(\"DisplayTime\")}}</span> </label> </div> <div class=\"fe-modal-content\" *ngIf=\"showTime\"> <div class=\"fe-transverse-label clearfix\"> <div class=\"fe-half-line float-left\"> <div class=\"fe-transverse-title\">{{lc(\"Formats\")}}</div> <select class=\"fe-transverse-input\" name=\"timeFormat\" [(ngModel)]=\"timeFormat\"> <option *ngFor=\"let timeFormats of timeFormatList\" [ngValue]=\"timeFormats.value\"> {{timeFormats.name}} </option> </select> </div> <div class=\"fe-half-line float-left\"> <label> <input type=\"checkbox\" name=\"isTwelveHourHex\" [(ngModel)]=\"isTwelveHourHex\" /> <span>{{lc(\"TwelveHourSystem\")}}</span> </label> </div> </div> </div> </div> <div class=\"fe-modal-content\"> <font-style [(fontSize)]=\"fontSize\" [(fontColor)]=\"fontColor\" [(textAlign)]=\"textAlign\" [(isUnderline)]=\"isUnderline\" [(fontStyle)]=\"fontStyle\"></font-style> </div> </div> </tab> <tab heading=\"{{lc('Graph')}}\" customClass=\"m-tabs__item\" (selectTab)=\"tabSelected(graphSettingEventName)\"> <graph-setting [configureId]=\"configureId\" [(useGraph)]=\"useGraph\" [graphSetting]=\"graphSetting\"></graph-setting> </tab> <tab heading=\"{{lc('Display')}}\" customClass=\"m-tabs__item\" (selectTab)=\"tabSelected(controlSettingEventName,configureId)\"> <display-setting #displaySettingCmp [isFixedPositionVisible]='true'></display-setting> </tab> </tabset> </div> <div class=\"fe-modal-footer\"> <div class=\"button-group\"> <button type=\"submit\" class=\"fe-btn fe-btn-default fe-btn-save\" [disabled]=\"!dateTimeSettingForm.form.valid\" [buttonBusy]=\"saving\" [busyText]=\"l('SavingWithThreeDot')\"> {{l(\"Save\")}} </button> <button [disabled]=\"saving\" type=\"button\" class=\"fe-btn fe-btn-default fe-btn-cancel-one\" (click)=\"close()\"> {{l(\"Cancel\")}} </button> </div> </div> </form> </div> </div> </div> </div>"}]}],"members":{"displaySettingCmp":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":17,"character":5},"arguments":["displaySettingCmp",{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":36,"character":26},{"__symbolic":"reference","module":"../../diagram/utils/date-time/date-time.service","name":"DateTimeService","line":37,"character":33}]}],"init":[{"__symbolic":"method"}],"loadDateTimeInfo":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"saveDateTimeInfo":[{"__symbolic":"method"}],"loadGraphSetting":[{"__symbolic":"method"}],"saveGraphSetting":[{"__symbolic":"method"}]}}}}]