├── .angular-cli.json ├── .editorconfig ├── .gitattributes ├── .gitignore ├── .npmignore ├── CHANGELOG-zh_CN.md ├── CHANGELOG.md ├── LICENSE ├── README-zh_CN.md ├── README.md ├── favicon.ico ├── freeng.ts ├── gulpfile.js ├── package.json ├── src ├── app │ ├── app-routing.module.ts │ ├── app.component.css │ ├── app.component.scss │ ├── app.component.ts │ ├── app.module.ts │ ├── component │ │ ├── accordion │ │ │ ├── accordion.component.css │ │ │ ├── accordion.component.scss │ │ │ └── accordion.component.ts │ │ ├── back-top │ │ │ └── back-top.component.ts │ │ ├── badge │ │ │ ├── badge.component.css │ │ │ ├── badge.component.scss │ │ │ └── badge.component.ts │ │ ├── breadcrumb │ │ │ ├── breadcrumb.component.css │ │ │ ├── breadcrumb.component.scss │ │ │ └── breadcrumb.component.ts │ │ ├── button │ │ │ └── button.directive.ts │ │ ├── calendar │ │ │ ├── calendar.component.css │ │ │ ├── calendar.component.scss │ │ │ └── calendar.component.ts │ │ ├── card │ │ │ ├── card.component.css │ │ │ ├── card.component.scss │ │ │ └── card.component.ts │ │ ├── cascader │ │ │ ├── cascader.component.css │ │ │ ├── cascader.component.scss │ │ │ └── cascader.component.ts │ │ ├── chart │ │ │ ├── chart.component.css │ │ │ ├── chart.component.scss │ │ │ └── chart.component.ts │ │ ├── checkbox │ │ │ ├── checkbox.component.css │ │ │ ├── checkbox.component.scss │ │ │ └── checkbox.component.ts │ │ ├── chip │ │ │ ├── chip.component.css │ │ │ ├── chip.component.scss │ │ │ └── chip.component.ts │ │ ├── code │ │ │ ├── code.component.css │ │ │ ├── code.component.scss │ │ │ └── code.component.ts │ │ ├── colorpicker │ │ │ ├── color.ts │ │ │ ├── colorpicker.component.css │ │ │ ├── colorpicker.component.scss │ │ │ └── colorpicker.component.ts │ │ ├── column │ │ │ ├── column.component.css │ │ │ ├── column.component.scss │ │ │ └── column.component.ts │ │ ├── common │ │ │ ├── common.css │ │ │ ├── common.scss │ │ │ ├── dom.ts │ │ │ ├── rect.ts │ │ │ ├── scroll.ts │ │ │ ├── share.ts │ │ │ └── util.ts │ │ ├── contextmenu │ │ │ ├── contextmenu.component.css │ │ │ ├── contextmenu.component.scss │ │ │ └── contextmenu.component.ts │ │ ├── cropper │ │ │ ├── cropper.component.css │ │ │ ├── cropper.component.scss │ │ │ └── cropper.component.ts │ │ ├── datatable │ │ │ ├── datatable.component.css │ │ │ ├── datatable.component.scss │ │ │ └── datatable.component.ts │ │ ├── draggable │ │ │ ├── draggable.component.css │ │ │ ├── draggable.component.scss │ │ │ └── draggable.component.ts │ │ ├── dropdown │ │ │ ├── dropdown.component.css │ │ │ ├── dropdown.component.scss │ │ │ └── dropdown.component.ts │ │ ├── echart │ │ │ ├── echart.component.css │ │ │ ├── echart.component.scss │ │ │ └── echart.component.ts │ │ ├── editor │ │ │ ├── editor.component.css │ │ │ ├── editor.component.scss │ │ │ └── editor.component.ts │ │ ├── flow │ │ │ ├── flow.component.css │ │ │ ├── flow.component.scss │ │ │ └── flow.component.ts │ │ ├── freeng.module.ts │ │ ├── fullpage │ │ │ ├── fullpage.component.css │ │ │ ├── fullpage.component.scss │ │ │ └── fullpage.component.ts │ │ ├── grid │ │ │ └── grid.directive.ts │ │ ├── hamburge │ │ │ ├── hamburge.component.css │ │ │ ├── hamburge.component.scss │ │ │ └── hamburge.component.ts │ │ ├── icon │ │ │ ├── icon.component.css │ │ │ ├── icon.component.scss │ │ │ └── icon.component.ts │ │ ├── image │ │ │ ├── image.component.css │ │ │ ├── image.component.scss │ │ │ └── image.component.ts │ │ ├── inputtext │ │ │ ├── inputtext.component.css │ │ │ ├── inputtext.component.scss │ │ │ └── inputtext.component.ts │ │ ├── knob │ │ │ ├── knob.component.css │ │ │ ├── knob.component.scss │ │ │ └── knob.component.ts │ │ ├── list │ │ │ ├── list.component.css │ │ │ ├── list.component.scss │ │ │ └── list.component.ts │ │ ├── loading │ │ │ ├── loading.component.css │ │ │ ├── loading.component.scss │ │ │ └── loading.component.ts │ │ ├── mask │ │ │ ├── mask.component.css │ │ │ ├── mask.component.scss │ │ │ └── mask.component.ts │ │ ├── media │ │ │ ├── media.component.css │ │ │ ├── media.component.scss │ │ │ └── media.component.ts │ │ ├── modal │ │ │ ├── modal.component.css │ │ │ ├── modal.component.scss │ │ │ └── modal.component.ts │ │ ├── notification │ │ │ ├── notification.component.css │ │ │ ├── notification.component.scss │ │ │ └── notification.component.ts │ │ ├── pagination │ │ │ ├── pagination.component.css │ │ │ ├── pagination.component.scss │ │ │ └── pagination.component.ts │ │ ├── panel │ │ │ ├── panel.component.css │ │ │ ├── panel.component.scss │ │ │ └── panel.component.ts │ │ ├── particle │ │ │ ├── partical.ts │ │ │ └── particle.directive.ts │ │ ├── pipes │ │ │ ├── array │ │ │ │ ├── gt.ts │ │ │ │ ├── gte.ts │ │ │ │ ├── index.ts │ │ │ │ ├── lt.ts │ │ │ │ └── lte.ts │ │ │ ├── date │ │ │ │ ├── date-add.ts │ │ │ │ ├── date-duration.ts │ │ │ │ ├── date-format.ts │ │ │ │ ├── date-local.ts │ │ │ │ ├── date-locale.ts │ │ │ │ ├── date-subtract.ts │ │ │ │ ├── date-unix.ts │ │ │ │ ├── date-utc.ts │ │ │ │ └── index.ts │ │ │ ├── helpers │ │ │ │ └── createRound.ts │ │ │ ├── index.ts │ │ │ ├── math │ │ │ │ ├── index.ts │ │ │ │ ├── max.ts │ │ │ │ ├── min.ts │ │ │ │ ├── pow.ts │ │ │ │ ├── sqrt.ts │ │ │ │ └── sum.ts │ │ │ ├── number │ │ │ │ ├── ceil.ts │ │ │ │ ├── floor.ts │ │ │ │ ├── index.ts │ │ │ │ └── round.ts │ │ │ └── string │ │ │ │ ├── index.ts │ │ │ │ └── repeat.ts │ │ ├── popover │ │ │ ├── popover.component.css │ │ │ ├── popover.component.scss │ │ │ └── popover.component.ts │ │ ├── progress │ │ │ ├── progress.component.css │ │ │ ├── progress.component.scss │ │ │ └── progress.component.ts │ │ ├── radio │ │ │ ├── radio.component.css │ │ │ ├── radio.component.scss │ │ │ └── radio.component.ts │ │ ├── range │ │ │ ├── range.component.css │ │ │ ├── range.component.scss │ │ │ └── range.component.ts │ │ ├── rating │ │ │ ├── rating.component.css │ │ │ ├── rating.component.scss │ │ │ └── rating.component.ts │ │ ├── ribbon │ │ │ ├── ribbon.component.css │ │ │ ├── ribbon.component.scss │ │ │ └── ribbon.component.ts │ │ ├── ripple │ │ │ └── ripple.directive.ts │ │ ├── scroll │ │ │ └── scroll.component.ts │ │ ├── select │ │ │ ├── select.component.css │ │ │ ├── select.component.scss │ │ │ └── select.component.ts │ │ ├── share-button │ │ │ ├── share-button.component.css │ │ │ ├── share-button.component.scss │ │ │ ├── share-button.component.ts │ │ │ ├── share-button.provider.ts │ │ │ └── share-links.ts │ │ ├── shrink │ │ │ ├── shrink.component.css │ │ │ ├── shrink.component.scss │ │ │ └── shrink.component.ts │ │ ├── sidenav │ │ │ ├── sidenav.component.css │ │ │ ├── sidenav.component.scss │ │ │ └── sidenav.component.ts │ │ ├── slides │ │ │ ├── slides.component.css │ │ │ ├── slides.component.scss │ │ │ └── slides.component.ts │ │ ├── spinner │ │ │ ├── spinner.component.css │ │ │ ├── spinner.component.scss │ │ │ └── spinner.component.ts │ │ ├── steps │ │ │ ├── steps.component.css │ │ │ ├── steps.component.scss │ │ │ └── steps.component.ts │ │ ├── switch │ │ │ ├── switch.component.css │ │ │ ├── switch.component.scss │ │ │ └── switch.component.ts │ │ ├── tab │ │ │ ├── tab.component.css │ │ │ ├── tab.component.scss │ │ │ └── tab.component.ts │ │ ├── table │ │ │ ├── table.component.css │ │ │ ├── table.component.scss │ │ │ └── table.component.ts │ │ ├── timeline │ │ │ ├── timeline.component.css │ │ │ ├── timeline.component.scss │ │ │ └── timeline.component.ts │ │ ├── toast │ │ │ ├── toast.component.css │ │ │ ├── toast.component.scss │ │ │ └── toast.component.ts │ │ ├── tooltip │ │ │ └── tooltip.directive.ts │ │ ├── tour │ │ │ ├── tour.component.css │ │ │ ├── tour.component.scss │ │ │ └── tour.component.ts │ │ ├── tree │ │ │ ├── tree.component.css │ │ │ ├── tree.component.scss │ │ │ └── tree.component.ts │ │ ├── tsconfig.json │ │ ├── upload │ │ │ ├── upload.component.css │ │ │ ├── upload.component.scss │ │ │ └── upload.component.ts │ │ └── validation │ │ │ ├── cn │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ ├── custom-form-validator.module.ts │ │ │ ├── date │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ ├── email │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ ├── number │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ ├── phone │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ ├── range │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ ├── url │ │ │ ├── directive.ts │ │ │ ├── index.ts │ │ │ └── validator.ts │ │ │ └── util │ │ │ └── api.ts │ └── democase │ │ ├── common │ │ ├── animations.ts │ │ ├── config.ts │ │ └── language.ts │ │ ├── index │ │ ├── index-routing.module.ts │ │ ├── index.component.css │ │ ├── index.component.html │ │ ├── index.component.scss │ │ ├── index.component.ts │ │ └── index.module.ts │ │ ├── login │ │ ├── login-routing.module.ts │ │ ├── login.component.css │ │ ├── login.component.html │ │ ├── login.component.scss │ │ ├── login.component.ts │ │ └── login.module.ts │ │ ├── main-accordion │ │ ├── main-accordion-routing.module.ts │ │ ├── main-accordion.component.css │ │ ├── main-accordion.component.html │ │ ├── main-accordion.component.scss │ │ ├── main-accordion.component.ts │ │ └── main-accordion.module.ts │ │ ├── main-badge │ │ ├── main-badge-routing.module.ts │ │ ├── main-badge.component.css │ │ ├── main-badge.component.html │ │ ├── main-badge.component.scss │ │ ├── main-badge.component.ts │ │ └── main-badge.module.ts │ │ ├── main-breadcrumb │ │ ├── main-breadcrumb-routing.module.ts │ │ ├── main-breadcrumb.component.css │ │ ├── main-breadcrumb.component.html │ │ ├── main-breadcrumb.component.scss │ │ ├── main-breadcrumb.component.ts │ │ └── main-breadcrumb.module.ts │ │ ├── main-buttons │ │ ├── main-buttons-routing.module.ts │ │ ├── main-buttons.component.css │ │ ├── main-buttons.component.html │ │ ├── main-buttons.component.scss │ │ ├── main-buttons.component.ts │ │ └── main-buttons.module.ts │ │ ├── main-calendar │ │ ├── main-calendar-routing.module.ts │ │ ├── main-calendar.component.css │ │ ├── main-calendar.component.html │ │ ├── main-calendar.component.scss │ │ ├── main-calendar.component.ts │ │ └── main-calendar.module.ts │ │ ├── main-card │ │ ├── main-card-routing.module.ts │ │ ├── main-card.component.css │ │ ├── main-card.component.html │ │ ├── main-card.component.scss │ │ ├── main-card.component.ts │ │ └── main-card.module.ts │ │ ├── main-cascader │ │ ├── cascader.service.ts │ │ ├── main-cascader-routing.module.ts │ │ ├── main-cascader.component.css │ │ ├── main-cascader.component.html │ │ ├── main-cascader.component.scss │ │ ├── main-cascader.component.ts │ │ └── main-cascader.module.ts │ │ ├── main-changelog │ │ ├── main-changelog-routing.module.ts │ │ ├── main-changelog.component.css │ │ ├── main-changelog.component.html │ │ ├── main-changelog.component.scss │ │ ├── main-changelog.component.ts │ │ └── main-changelog.module.ts │ │ ├── main-chart │ │ ├── main-chart-routing.module.ts │ │ ├── main-chart.component.css │ │ ├── main-chart.component.html │ │ ├── main-chart.component.scss │ │ ├── main-chart.component.ts │ │ └── main-chart.module.ts │ │ ├── main-checkbox │ │ ├── main-checkbox-routing.module.ts │ │ ├── main-checkbox.component.css │ │ ├── main-checkbox.component.html │ │ ├── main-checkbox.component.scss │ │ ├── main-checkbox.component.ts │ │ └── main-checkbox.module.ts │ │ ├── main-chip │ │ ├── main-chip-routing.module.ts │ │ ├── main-chip.component.css │ │ ├── main-chip.component.html │ │ ├── main-chip.component.scss │ │ ├── main-chip.component.ts │ │ └── main-chip.module.ts │ │ ├── main-colorpicker │ │ ├── main-colorpicker-routing.module.ts │ │ ├── main-colorpicker.component.css │ │ ├── main-colorpicker.component.html │ │ ├── main-colorpicker.component.scss │ │ ├── main-colorpicker.component.ts │ │ └── main-colorpicker.module.ts │ │ ├── main-column │ │ ├── main-column-routing.module.ts │ │ ├── main-column.component.css │ │ ├── main-column.component.html │ │ ├── main-column.component.scss │ │ ├── main-column.component.ts │ │ └── main-column.module.ts │ │ ├── main-contextmenu │ │ ├── main-contextmenu-routing.module.ts │ │ ├── main-contextmenu.component.css │ │ ├── main-contextmenu.component.html │ │ ├── main-contextmenu.component.scss │ │ ├── main-contextmenu.component.ts │ │ └── main-contextmenu.module.ts │ │ ├── main-cropper │ │ ├── main-cropper-routing.module.ts │ │ ├── main-cropper.component.css │ │ ├── main-cropper.component.html │ │ ├── main-cropper.component.scss │ │ ├── main-cropper.component.ts │ │ └── main-cropper.module.ts │ │ ├── main-datatable │ │ ├── main-datatable-routing.module.ts │ │ ├── main-datatable.component.css │ │ ├── main-datatable.component.html │ │ ├── main-datatable.component.scss │ │ ├── main-datatable.component.ts │ │ └── main-datatable.module.ts │ │ ├── main-draggable │ │ ├── main-draggable-routing.module.ts │ │ ├── main-draggable.component.css │ │ ├── main-draggable.component.html │ │ ├── main-draggable.component.scss │ │ ├── main-draggable.component.ts │ │ └── main-draggable.module.ts │ │ ├── main-dropdown │ │ ├── main-dropdown-routing.module.ts │ │ ├── main-dropdown.component.css │ │ ├── main-dropdown.component.html │ │ ├── main-dropdown.component.scss │ │ ├── main-dropdown.component.ts │ │ └── main-dropdown.module.ts │ │ ├── main-echarts │ │ ├── main-echarts-routing.module.ts │ │ ├── main-echarts.component.css │ │ ├── main-echarts.component.html │ │ ├── main-echarts.component.scss │ │ ├── main-echarts.component.ts │ │ └── main-echarts.module.ts │ │ ├── main-editor │ │ ├── main-editor-routing.module.ts │ │ ├── main-editor.component.css │ │ ├── main-editor.component.html │ │ ├── main-editor.component.scss │ │ ├── main-editor.component.ts │ │ └── main-editor.module.ts │ │ ├── main-error │ │ ├── main-error-routing.module.ts │ │ ├── main-error.component.css │ │ ├── main-error.component.html │ │ ├── main-error.component.scss │ │ ├── main-error.component.ts │ │ └── main-error.module.ts │ │ ├── main-flow │ │ ├── main-flow-routing.module.ts │ │ ├── main-flow.component.css │ │ ├── main-flow.component.html │ │ ├── main-flow.component.scss │ │ ├── main-flow.component.ts │ │ └── main-flow.module.ts │ │ ├── main-form │ │ ├── main-form-routing.module.ts │ │ ├── main-form.component.css │ │ ├── main-form.component.html │ │ ├── main-form.component.scss │ │ ├── main-form.component.ts │ │ └── main-form.module.ts │ │ ├── main-fullpage │ │ ├── main-fullpage-routing.module.ts │ │ ├── main-fullpage.component.css │ │ ├── main-fullpage.component.html │ │ ├── main-fullpage.component.scss │ │ ├── main-fullpage.component.ts │ │ ├── main-fullpage.module.ts │ │ ├── review-fullpage-routing.ts │ │ ├── review-fullpage.component.ts │ │ └── review-fullpage.module.ts │ │ ├── main-grid │ │ ├── main-grid-routing.module.ts │ │ ├── main-grid.component.css │ │ ├── main-grid.component.html │ │ ├── main-grid.component.scss │ │ ├── main-grid.component.ts │ │ └── main-grid.module.ts │ │ ├── main-icon │ │ ├── main-icon-routing.module.ts │ │ ├── main-icon.component.css │ │ ├── main-icon.component.html │ │ ├── main-icon.component.scss │ │ ├── main-icon.component.ts │ │ └── main-icon.module.ts │ │ ├── main-image │ │ ├── main-image-routing.module.ts │ │ ├── main-image.component.css │ │ ├── main-image.component.html │ │ ├── main-image.component.scss │ │ ├── main-image.component.ts │ │ └── main-image.module.ts │ │ ├── main-knob │ │ ├── main-knob-routing.module.ts │ │ ├── main-knob.component.css │ │ ├── main-knob.component.html │ │ ├── main-knob.component.scss │ │ ├── main-knob.component.ts │ │ └── main-knob.module.ts │ │ ├── main-list │ │ ├── main-list-routing.module.ts │ │ ├── main-list.component.css │ │ ├── main-list.component.html │ │ ├── main-list.component.scss │ │ ├── main-list.component.ts │ │ └── main-list.module.ts │ │ ├── main-loading │ │ ├── main-loading-routing.module.ts │ │ ├── main-loading.component.css │ │ ├── main-loading.component.html │ │ ├── main-loading.component.scss │ │ ├── main-loading.component.ts │ │ └── main-loading.module.ts │ │ ├── main-media │ │ ├── main-media-routing.module.ts │ │ ├── main-media.component.css │ │ ├── main-media.component.html │ │ ├── main-media.component.scss │ │ ├── main-media.component.ts │ │ └── main-media.module.ts │ │ ├── main-modal │ │ ├── main-modal-routing.module.ts │ │ ├── main-modal.component.css │ │ ├── main-modal.component.html │ │ ├── main-modal.component.scss │ │ ├── main-modal.component.ts │ │ └── main-modal.module.ts │ │ ├── main-notification │ │ ├── main-notification-routing.module.ts │ │ ├── main-notification.component.css │ │ ├── main-notification.component.html │ │ ├── main-notification.component.scss │ │ ├── main-notification.component.ts │ │ └── main-notification.module.ts │ │ ├── main-pagination │ │ ├── main-pagination-routing.module.ts │ │ ├── main-pagination.component.css │ │ ├── main-pagination.component.html │ │ ├── main-pagination.component.scss │ │ ├── main-pagination.component.ts │ │ └── main-pagination.module.ts │ │ ├── main-panel │ │ ├── main-panel-routing.module.ts │ │ ├── main-panel.component.css │ │ ├── main-panel.component.html │ │ ├── main-panel.component.scss │ │ ├── main-panel.component.ts │ │ └── main-panel.module.ts │ │ ├── main-popover │ │ ├── main-popover-routing.module.ts │ │ ├── main-popover.component.css │ │ ├── main-popover.component.html │ │ ├── main-popover.component.scss │ │ ├── main-popover.component.ts │ │ └── main-popover.module.ts │ │ ├── main-progress │ │ ├── main-progress-routing.module.ts │ │ ├── main-progress.component.css │ │ ├── main-progress.component.html │ │ ├── main-progress.component.scss │ │ ├── main-progress.component.ts │ │ └── main-progress.module.ts │ │ ├── main-radio │ │ ├── main-radio-routing.module.ts │ │ ├── main-radio.component.css │ │ ├── main-radio.component.html │ │ ├── main-radio.component.scss │ │ ├── main-radio.component.ts │ │ └── main-radio.module.ts │ │ ├── main-range │ │ ├── main-range-routing.module.ts │ │ ├── main-range.component.css │ │ ├── main-range.component.html │ │ ├── main-range.component.scss │ │ ├── main-range.component.ts │ │ └── main-range.module.ts │ │ ├── main-rating │ │ ├── main-rating-routing.module.ts │ │ ├── main-rating.component.css │ │ ├── main-rating.component.html │ │ ├── main-rating.component.scss │ │ ├── main-rating.component.ts │ │ └── main-rating.module.ts │ │ ├── main-ripple │ │ ├── main-ripple-routing.module.ts │ │ ├── main-ripple.component.css │ │ ├── main-ripple.component.html │ │ ├── main-ripple.component.scss │ │ ├── main-ripple.component.ts │ │ └── main-ripple.module.ts │ │ ├── main-scroll │ │ ├── main-scroll-routing.module.ts │ │ ├── main-scroll.component.css │ │ ├── main-scroll.component.html │ │ ├── main-scroll.component.scss │ │ ├── main-scroll.component.ts │ │ └── main-scroll.module.ts │ │ ├── main-select │ │ ├── main-select-routing.module.ts │ │ ├── main-select.component.css │ │ ├── main-select.component.html │ │ ├── main-select.component.scss │ │ ├── main-select.component.ts │ │ └── main-select.module.ts │ │ ├── main-shadow │ │ ├── main-shadow-routing.module.ts │ │ ├── main-shadow.component.css │ │ ├── main-shadow.component.html │ │ ├── main-shadow.component.scss │ │ ├── main-shadow.component.ts │ │ └── main-shadow.module.ts │ │ ├── main-share-button │ │ ├── main-share-button-routing.module.ts │ │ ├── main-share-button.component.css │ │ ├── main-share-button.component.html │ │ ├── main-share-button.component.scss │ │ ├── main-share-button.component.ts │ │ └── main-share-button.module.ts │ │ ├── main-shrink │ │ ├── main-shrink-routing.module.ts │ │ ├── main-shrink.component.css │ │ ├── main-shrink.component.html │ │ ├── main-shrink.component.scss │ │ ├── main-shrink.component.ts │ │ └── main-shrink.module.ts │ │ ├── main-sidenav │ │ ├── main-sidenav-routing.module.ts │ │ ├── main-sidenav.component.css │ │ ├── main-sidenav.component.html │ │ ├── main-sidenav.component.scss │ │ ├── main-sidenav.component.ts │ │ └── main-sidenav.module.ts │ │ ├── main-slide │ │ ├── main-slide-routing.module.ts │ │ ├── main-slide.component.css │ │ ├── main-slide.component.html │ │ ├── main-slide.component.scss │ │ ├── main-slide.component.ts │ │ └── main-slide.module.ts │ │ ├── main-spinner │ │ ├── main-spinner-routing.module.ts │ │ ├── main-spinner.component.css │ │ ├── main-spinner.component.html │ │ ├── main-spinner.component.scss │ │ ├── main-spinner.component.ts │ │ └── main-spinner.module.ts │ │ ├── main-start │ │ ├── main-start-routing.module.ts │ │ ├── main-start.component.css │ │ ├── main-start.component.html │ │ ├── main-start.component.scss │ │ ├── main-start.component.ts │ │ └── main-start.module.ts │ │ ├── main-steps │ │ ├── main-steps-routing.module.ts │ │ ├── main-steps.component.css │ │ ├── main-steps.component.html │ │ ├── main-steps.component.scss │ │ ├── main-steps.component.ts │ │ └── main-steps.module.ts │ │ ├── main-switch │ │ ├── main-switch-routing.module.ts │ │ ├── main-switch.component.css │ │ ├── main-switch.component.html │ │ ├── main-switch.component.scss │ │ ├── main-switch.component.ts │ │ └── main-switch.module.ts │ │ ├── main-tab │ │ ├── main-tab-routing.module.ts │ │ ├── main-tab.component.css │ │ ├── main-tab.component.html │ │ ├── main-tab.component.scss │ │ ├── main-tab.component.ts │ │ └── main-tab.module.ts │ │ ├── main-table │ │ ├── main-table-routing.module.ts │ │ ├── main-table.component.css │ │ ├── main-table.component.html │ │ ├── main-table.component.scss │ │ ├── main-table.component.ts │ │ └── main-table.module.ts │ │ ├── main-timeline │ │ ├── main-timeline-routing.module.ts │ │ ├── main-timeline.component.css │ │ ├── main-timeline.component.html │ │ ├── main-timeline.component.scss │ │ ├── main-timeline.component.ts │ │ └── main-timeline.module.ts │ │ ├── main-toast │ │ ├── main-toast-routing.module.ts │ │ ├── main-toast.component.css │ │ ├── main-toast.component.html │ │ ├── main-toast.component.scss │ │ ├── main-toast.component.ts │ │ └── main-toast.module.ts │ │ ├── main-tooltip │ │ ├── main-tooltip-routing.module.ts │ │ ├── main-tooltip.component.css │ │ ├── main-tooltip.component.html │ │ ├── main-tooltip.component.scss │ │ ├── main-tooltip.component.ts │ │ └── main-tooltip.module.ts │ │ ├── main-tour │ │ ├── main-tour-routing.module.ts │ │ ├── main-tour.component.css │ │ ├── main-tour.component.html │ │ ├── main-tour.component.scss │ │ ├── main-tour.component.ts │ │ └── main-tour.module.ts │ │ ├── main-tree │ │ ├── main-tree-routing.module.ts │ │ ├── main-tree.component.css │ │ ├── main-tree.component.html │ │ ├── main-tree.component.scss │ │ ├── main-tree.component.ts │ │ ├── main-tree.module.ts │ │ └── main-tree.service.ts │ │ ├── main-typography │ │ ├── main-typography-routing.module.ts │ │ ├── main-typography.component.css │ │ ├── main-typography.component.html │ │ ├── main-typography.component.scss │ │ ├── main-typography.component.ts │ │ └── main-typography.module.ts │ │ ├── main-upload │ │ ├── main-upload-routing.module.ts │ │ ├── main-upload.component.css │ │ ├── main-upload.component.html │ │ ├── main-upload.component.scss │ │ ├── main-upload.component.ts │ │ └── main-upload.module.ts │ │ ├── main-validation │ │ ├── main-validation-routing.module.ts │ │ ├── main-validation.component.css │ │ ├── main-validation.component.html │ │ ├── main-validation.component.scss │ │ ├── main-validation.component.ts │ │ └── main-validation.module.ts │ │ └── main │ │ ├── main-routing.module.ts │ │ ├── main.component.css │ │ ├── main.component.html │ │ ├── main.component.scss │ │ ├── main.component.ts │ │ └── main.module.ts ├── assets │ ├── .gitkeep │ ├── css │ │ ├── freeng.css │ │ ├── freeng.scss │ │ ├── reset.css │ │ ├── reset.scss │ │ ├── symbol.css │ │ └── symbol.scss │ ├── di.ico │ ├── i18n │ │ ├── en.json │ │ └── zh-CN.json │ ├── images │ │ ├── angular.svg │ │ ├── arrow.png │ │ ├── browser │ │ │ ├── chrome-logo.png │ │ │ ├── firefox-logo.png │ │ │ ├── internet-logo.png │ │ │ ├── opera-logo.png │ │ │ └── safari-logo.png │ │ ├── di.ico │ │ ├── emotion │ │ │ ├── 1f600.svg │ │ │ ├── 1f601.svg │ │ │ ├── 1f602.svg │ │ │ ├── 1f603.svg │ │ │ ├── 1f604.svg │ │ │ ├── 1f605.svg │ │ │ ├── 1f606.svg │ │ │ ├── 1f607.svg │ │ │ ├── 1f608.svg │ │ │ ├── 1f609.svg │ │ │ ├── 1f60a.svg │ │ │ ├── 1f60b.svg │ │ │ ├── 1f60c.svg │ │ │ ├── 1f60d.svg │ │ │ ├── 1f60e.svg │ │ │ ├── 1f60f.svg │ │ │ ├── 1f610.svg │ │ │ ├── 1f611.svg │ │ │ ├── 1f612.svg │ │ │ ├── 1f613.svg │ │ │ ├── 1f614.svg │ │ │ ├── 1f615.svg │ │ │ ├── 1f616.svg │ │ │ ├── 1f617.svg │ │ │ ├── 1f618.svg │ │ │ ├── 1f619.svg │ │ │ ├── 1f61a.svg │ │ │ ├── 1f61b.svg │ │ │ ├── 1f61c.svg │ │ │ ├── 1f61d.svg │ │ │ ├── 1f61e.svg │ │ │ ├── 1f61f.svg │ │ │ ├── 1f620.svg │ │ │ ├── 1f621.svg │ │ │ ├── 1f622.svg │ │ │ ├── 1f623.svg │ │ │ ├── 1f624.svg │ │ │ ├── 1f625.svg │ │ │ ├── 1f626.svg │ │ │ ├── 1f627.svg │ │ │ ├── 1f628.svg │ │ │ ├── 1f629.svg │ │ │ ├── 1f62a.svg │ │ │ ├── 1f62b.svg │ │ │ ├── 1f62c.svg │ │ │ ├── 1f62d.svg │ │ │ ├── 1f62e.svg │ │ │ ├── 1f62f.svg │ │ │ ├── 1f630.svg │ │ │ ├── 1f631.svg │ │ │ ├── 1f632.svg │ │ │ ├── 1f633.svg │ │ │ ├── 1f634.svg │ │ │ ├── 1f635.svg │ │ │ ├── 1f636.svg │ │ │ └── 1f637.svg │ │ ├── f1.jpg │ │ ├── f2.jpg │ │ ├── f3.jpg │ │ ├── f4.jpg │ │ ├── fontawesome.png │ │ ├── landscape1.jpg │ │ ├── landscape10.jpg │ │ ├── landscape11.jpg │ │ ├── landscape16.jpg │ │ ├── landscape17.jpg │ │ ├── landscape18.jpg │ │ ├── landscape2.jpg │ │ ├── landscape3.jpg │ │ ├── landscape7.jpg │ │ ├── landscape8.jpg │ │ ├── menu-bg.png │ │ ├── picture.jpg │ │ ├── t_me.png │ │ └── user.jpg │ ├── json │ │ ├── city.json │ │ ├── files.json │ │ └── lazyFiles.json │ ├── media │ │ └── alert.mp3 │ ├── sass │ │ ├── mixin.scss │ │ └── variables.scss │ └── themes │ │ ├── blue.css │ │ ├── blue.scss │ │ ├── brown.css │ │ ├── brown.scss │ │ ├── cyan.css │ │ ├── cyan.scss │ │ ├── dark.css │ │ ├── dark.scss │ │ ├── deepblue.css │ │ ├── deepblue.scss │ │ ├── green.css │ │ ├── green.scss │ │ ├── lightblue.css │ │ ├── lightblue.scss │ │ ├── orange.css │ │ ├── orange.scss │ │ ├── pink.css │ │ ├── pink.scss │ │ ├── purple.css │ │ ├── purple.scss │ │ ├── red.css │ │ ├── red.scss │ │ ├── reset.css │ │ ├── reset.scss │ │ ├── teal.css │ │ ├── teal.scss │ │ ├── yellow.css │ │ └── yellow.scss ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── favicon.ico ├── index.html ├── main.ts ├── polyfills.ts ├── styles.css ├── tsconfig.app.json ├── typings.d.ts └── vendor.ts ├── tsconfig-aot.json ├── tsconfig-es2015.json ├── tsconfig.json └── tslint.json /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.js linguist-language=javascript 2 | *.css linguist-language=javascript -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | /component 8 | /resources 9 | /aot 10 | 11 | # dependencies 12 | /node_modules 13 | 14 | # IDEs and editors 15 | /.idea 16 | .project 17 | .classpath 18 | .c9/ 19 | *.launch 20 | .settings/ 21 | *.sublime-workspace 22 | 23 | # IDE - VSCode 24 | .vscode/* 25 | !.vscode/settings.json 26 | !.vscode/tasks.json 27 | !.vscode/launch.json 28 | !.vscode/extensions.json 29 | 30 | # misc 31 | /.sass-cache 32 | src/**/*.js 33 | /connect.lock 34 | /coverage 35 | /libpeerconnection.log 36 | npm-debug.log 37 | testem.log 38 | /typings 39 | 40 | #map 41 | *.js.map 42 | *.css.map 43 | 44 | # e2e 45 | /e2e/*.js 46 | /e2e/*.map 47 | 48 | #release 49 | build.sh 50 | 51 | # System Files 52 | .DS_Store 53 | Thumbs.db 54 | 55 | # package 56 | package-lock.json 57 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | # compiled output 2 | /dist 3 | /tmp 4 | /out-tsc 5 | /aot 6 | 7 | # source 8 | src 9 | 10 | # test 11 | e2e 12 | karma.conf.js 13 | protractor.conf.js 14 | 15 | # dependencies 16 | node_modules 17 | 18 | # IDEs and editors 19 | /.idea 20 | .project 21 | .classpath 22 | .c9/ 23 | *.launch 24 | .settings/ 25 | *.sublime-workspace 26 | .editor-config 27 | 28 | # IDE - VSCode 29 | .vscode/* 30 | !.vscode/settings.json 31 | !.vscode/tasks.json 32 | !.vscode/launch.json 33 | !.vscode/extensions.json 34 | 35 | # misc 36 | /.sass-cache 37 | /connect.lock 38 | /coverage 39 | /libpeerconnection.log 40 | npm-debug.log 41 | testem.log 42 | /typings 43 | .gitignore 44 | 45 | # config 46 | .angular-cli.json 47 | tsconfig.json 48 | tsconfig-es2015.json 49 | tsconfig-aot.json 50 | tslint.json 51 | gulpfile.js 52 | .github 53 | 54 | # release 55 | build.sh 56 | 57 | # System Files 58 | .DS_Store 59 | Thumbs.db 60 | 61 | # package 62 | package-lock.json 63 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/favicon.ico -------------------------------------------------------------------------------- /freeng.ts: -------------------------------------------------------------------------------- 1 | export * from './component/freeng.module'; 2 | -------------------------------------------------------------------------------- /src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {RouterModule, Routes} from '@angular/router'; 3 | const routes: Routes = [ 4 | {path: 'login', loadChildren: './democase/login/login.module#LoginModule'}, 5 | {path: 'main', loadChildren: './democase/index/index.module#IndexModule'}, 6 | {path: 'error', loadChildren: './democase/main-error/main-error.module#MainErrorModule'}, 7 | { 8 | path: 'review-fullpage', 9 | loadChildren: './democase/main-fullpage/review-fullpage.module#ReviewFullpageModule' 10 | }, 11 | {path: '', redirectTo: '/main/introduction', pathMatch: 'full'}, 12 | {path: '**', redirectTo: '/error'} 13 | ]; 14 | 15 | @NgModule({ 16 | imports: [RouterModule.forRoot(routes)], 17 | exports: [RouterModule] 18 | }) 19 | export class AppRoutingModule { 20 | } 21 | -------------------------------------------------------------------------------- /src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import {Component} from '@angular/core'; 2 | import {TranslateService} from '@ngx-translate/core'; 3 | 4 | @Component({ 5 | selector: 'free-root', 6 | template: ` 7 |
8 | 9 |
10 | `, 11 | styleUrls: ['./app.component.css'] 12 | }) 13 | export class AppComponent { 14 | public mini: boolean; 15 | constructor(translate: TranslateService) { 16 | translate.setDefaultLang('en'); 17 | translate.use('en'); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/component/chart/chart.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=chart.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/component/chart/chart.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/component/chart/chart.component.scss -------------------------------------------------------------------------------- /src/app/component/code/code.component.scss: -------------------------------------------------------------------------------- 1 | free-code { 2 | flex: 1 0 auto; 3 | width: 100%; 4 | } 5 | 6 | .free-code-clone { 7 | position: absolute; 8 | right: 1rem; 9 | top: .2rem; 10 | opacity: 0; 11 | z-index: 100; 12 | border: none; 13 | padding: 0 .25rem; 14 | border-radius: 3px; 15 | transition: opacity .3s; 16 | } 17 | .free-code { 18 | position: relative; 19 | code { 20 | max-height: 22.5rem; 21 | overflow-y: auto; 22 | } 23 | 24 | &:hover .free-code-clone { 25 | opacity: .7; 26 | &:hover { 27 | opacity: 1; 28 | } 29 | } 30 | 31 | &[lang]:after { 32 | position: absolute; 33 | top: .25rem; 34 | right: .5rem; 35 | color: rgba(255, 255, 255, .5); 36 | opacity: .7; 37 | font-size: .65rem; 38 | } 39 | 40 | &[lang="html"]:after { 41 | content: "HTML"; 42 | } 43 | 44 | &[lang="Javascript"]:after { 45 | content: "Javascript"; 46 | } 47 | 48 | &[lang="CSS"]:after { 49 | content: "CSS"; 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /src/app/component/column/column.component.css: -------------------------------------------------------------------------------- 1 | free-column { 2 | width: 100%; } 3 | 4 | .free-column { 5 | -moz-column-gap: 1em; 6 | -webkit-column-gap: 1em; 7 | column-gap: 1em; } 8 | 9 | /*# sourceMappingURL=column.component.css.map */ 10 | -------------------------------------------------------------------------------- /src/app/component/column/column.component.scss: -------------------------------------------------------------------------------- 1 | free-column { 2 | width: 100%; 3 | } 4 | 5 | .free-column { 6 | -moz-column-gap: 1em; 7 | -webkit-column-gap: 1em; 8 | column-gap: 1em; 9 | } 10 | -------------------------------------------------------------------------------- /src/app/component/draggable/draggable.component.css: -------------------------------------------------------------------------------- 1 | .free-draggable-target { 2 | position: fixed; 3 | z-index: 1000; 4 | opacity: .8; 5 | background: #fff; 6 | border: 1px dashed #d9d9d9; } 7 | .free-draggable-target .free-draggable-item { 8 | cursor: crosshair !important; } 9 | 10 | .free-draggable-active { 11 | border: 1px dashed #1e87f0 !important; } 12 | 13 | .free-draggable-item { 14 | cursor: crosshair; } 15 | 16 | /*# sourceMappingURL=draggable.component.css.map */ 17 | -------------------------------------------------------------------------------- /src/app/component/draggable/draggable.component.scss: -------------------------------------------------------------------------------- 1 | .free-draggable-target { 2 | position: fixed; 3 | z-index: 1000; 4 | opacity: .8; 5 | background: #fff; 6 | border: 1px dashed #d9d9d9; 7 | 8 | .free-draggable-item { 9 | cursor: crosshair !important; 10 | } 11 | } 12 | .free-draggable-active { 13 | border: 1px dashed #1e87f0 !important; 14 | } 15 | 16 | .free-draggable-item { 17 | cursor: crosshair; 18 | } 19 | -------------------------------------------------------------------------------- /src/app/component/echart/echart.component.css: -------------------------------------------------------------------------------- 1 | free-echart { 2 | display: block; } 3 | free-echart .free-echart { 4 | position: relative; } 5 | free-echart .free-echart-inner { 6 | position: absolute; 7 | top: 0; 8 | bottom: 0; 9 | left: 0; 10 | right: 0; } 11 | free-echart.free-echart-inline { 12 | display: inline-block; } 13 | 14 | /*# sourceMappingURL=echart.component.css.map */ 15 | -------------------------------------------------------------------------------- /src/app/component/echart/echart.component.scss: -------------------------------------------------------------------------------- 1 | free-echart { 2 | display: block; 3 | 4 | .free-echart { 5 | position: relative; 6 | } 7 | 8 | .free-echart-inner { 9 | position: absolute; 10 | top: 0; 11 | bottom: 0; 12 | left: 0; 13 | right: 0; 14 | } 15 | 16 | &.free-echart-inline { 17 | display: inline-block; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/component/flow/flow.component.css: -------------------------------------------------------------------------------- 1 | .free-flow-wrapper { 2 | width: 100%; 3 | height: 100%; 4 | overflow: hidden; 5 | overflow-y: auto; } 6 | .free-flow-wrapper .free-flow-loading { 7 | width: 100%; 8 | display: flex; 9 | justify-content: center; 10 | align-items: center; } 11 | .free-flow-wrapper .free-flow-loading > span { 12 | color: #999; 13 | font-size: 14px; } 14 | .free-flow-wrapper .free-flow-loading .free-loading { 15 | transform: scale(0.7); } 16 | 17 | /*# sourceMappingURL=flow.component.css.map */ 18 | -------------------------------------------------------------------------------- /src/app/component/flow/flow.component.scss: -------------------------------------------------------------------------------- 1 | .free-flow-wrapper { 2 | width: 100%; 3 | height: 100%; 4 | overflow: hidden; 5 | overflow-y: auto; 6 | 7 | .free-flow-loading { 8 | width: 100%; 9 | display: flex; 10 | justify-content: center; 11 | align-items: center; 12 | 13 | & > span { 14 | color: #999; 15 | font-size: 14px; 16 | } 17 | 18 | .free-loading { 19 | transform: scale(.7); 20 | } 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/app/component/icon/icon.component.css: -------------------------------------------------------------------------------- 1 | .free-icon.free-icon-2x { 2 | font-size: 1.2rem; } 3 | .free-icon.free-icon-3x { 4 | font-size: 1.8rem; } 5 | .free-icon.free-icon-4x { 6 | font-size: 2.4rem; } 7 | 8 | /*# sourceMappingURL=icon.component.css.map */ 9 | -------------------------------------------------------------------------------- /src/app/component/icon/icon.component.scss: -------------------------------------------------------------------------------- 1 | .free-icon { 2 | &.free-icon-2x { 3 | font-size: 1.2rem; 4 | } 5 | 6 | &.free-icon-3x { 7 | font-size: 1.8rem; 8 | } 9 | 10 | &.free-icon-4x { 11 | font-size: 2.4rem; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/app/component/image/image.component.css: -------------------------------------------------------------------------------- 1 | .free-image-group { 2 | display: flex; 3 | flex-wrap: wrap; } 4 | .free-image-group free-image { 5 | width: 24.99999%; 6 | padding: .2rem .2rem 0 0; } 7 | .free-image-group:after { 8 | content: ""; 9 | clear: both; 10 | display: inline-block; } 11 | 12 | .free-image img { 13 | display: block; 14 | width: 100%; 15 | line-height: 0; } 16 | 17 | /*# sourceMappingURL=image.component.css.map */ 18 | -------------------------------------------------------------------------------- /src/app/component/image/image.component.scss: -------------------------------------------------------------------------------- 1 | .free-image-group { 2 | display: flex; 3 | flex-wrap: wrap; 4 | 5 | free-image { 6 | width: 24.99999%; 7 | padding: .2rem .2rem 0 0; 8 | } 9 | 10 | &:after { 11 | content: ""; 12 | clear: both; 13 | display: inline-block; 14 | } 15 | } 16 | 17 | .free-image img { 18 | display: block; 19 | width: 100%; 20 | line-height: 0; 21 | } 22 | -------------------------------------------------------------------------------- /src/app/component/knob/knob.component.css: -------------------------------------------------------------------------------- 1 | .free-knob { 2 | position: relative; 3 | display: inline-block; } 4 | .free-knob > div.free-knob-inner { 5 | position: absolute; 6 | top: 50%; 7 | left: 50%; 8 | transform: translate(-50%, -50%); } 9 | 10 | /*# sourceMappingURL=knob.component.css.map */ 11 | -------------------------------------------------------------------------------- /src/app/component/knob/knob.component.scss: -------------------------------------------------------------------------------- 1 | .free-knob { 2 | position: relative; 3 | display: inline-block; 4 | 5 | & > div.free-knob-inner { 6 | position: absolute; 7 | top: 50%; 8 | left: 50%; 9 | transform: translate(-50%, -50%); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/mask/mask.component.css: -------------------------------------------------------------------------------- 1 | .free-mask { 2 | position: absolute; 3 | top: 0; 4 | right: 0; 5 | bottom: 0; 6 | left: 0; 7 | display: flex; 8 | align-items: center; 9 | justify-content: center; 10 | z-index: 9999; 11 | background: rgba(0, 0, 0, 0.7); } 12 | .free-mask .free-loading span { 13 | background: #fff !important; } 14 | 15 | /*# sourceMappingURL=mask.component.css.map */ 16 | -------------------------------------------------------------------------------- /src/app/component/mask/mask.component.scss: -------------------------------------------------------------------------------- 1 | .free-mask { 2 | position: absolute; 3 | top: 0; 4 | right: 0; 5 | bottom: 0; 6 | left: 0; 7 | display: flex; 8 | align-items: center; 9 | justify-content: center; 10 | z-index: 9999; 11 | background: rgba(0, 0, 0, .7); 12 | 13 | .free-loading span { 14 | background: #fff !important; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/app/component/particle/partical.ts: -------------------------------------------------------------------------------- 1 | export class Particle { 2 | x: number; 3 | y: number; 4 | r: number; 5 | vx: number; 6 | vy: number; 7 | color: string; 8 | constructor(...args) { 9 | [this.x, this.y, this.r, this.vx, this.vy, this.color] = args; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/array/gt.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'gt' 5 | }) 6 | 7 | export class GtPipe implements PipeTransform { 8 | transform(value: any, other: number): any { 9 | const comArr = []; 10 | if (Array.isArray(value)) { 11 | for (const v of value) { 12 | if (this.compare(v, other)) { 13 | comArr.push(v); 14 | } 15 | } 16 | return comArr; 17 | } 18 | return value; 19 | } 20 | 21 | compare(a, b) { 22 | if (!(typeof a === 'string' && typeof b === 'string')) { 23 | a = +a; 24 | b = +b; 25 | } 26 | return a > b; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/component/pipes/array/gte.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'gte' 5 | }) 6 | 7 | export class GtePipe implements PipeTransform { 8 | transform(value: any, other: number): any { 9 | const comArr = []; 10 | if (Array.isArray(value)) { 11 | for (const v of value) { 12 | if (this.compare(v, other)) { 13 | comArr.push(v); 14 | } 15 | } 16 | return comArr; 17 | } 18 | return value; 19 | } 20 | 21 | compare(a, b) { 22 | if (!(typeof a === 'string' && typeof b === 'string')) { 23 | a = +a; 24 | b = +b; 25 | } 26 | return a >= b; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/component/pipes/array/index.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {GtPipe} from './gt'; 3 | import {GtePipe} from './gte'; 4 | import {LtPipe} from './lt'; 5 | import {LtePipe} from './lte'; 6 | 7 | export {GtPipe} from './gt'; 8 | export {GtePipe} from './gte'; 9 | export {LtPipe} from './lt'; 10 | export {LtePipe} from './lte'; 11 | 12 | const ARRAY_PIPE = [ 13 | GtPipe, GtePipe, LtPipe, LtePipe 14 | ]; 15 | @NgModule({ 16 | declarations: ARRAY_PIPE, 17 | exports: ARRAY_PIPE 18 | }) 19 | export class ArrayPipeModule {} 20 | -------------------------------------------------------------------------------- /src/app/component/pipes/array/lt.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'lt' 5 | }) 6 | 7 | export class LtPipe implements PipeTransform { 8 | transform(value: any, other: number): any { 9 | const comArr = []; 10 | if (Array.isArray(value)) { 11 | for (const v of value) { 12 | if (this.compare(v, other)) { 13 | comArr.push(v); 14 | } 15 | } 16 | return comArr; 17 | } 18 | return value; 19 | } 20 | 21 | compare(a, b) { 22 | if (!(typeof a === 'string' && typeof b === 'string')) { 23 | a = +a; 24 | b = +b; 25 | } 26 | return a < b; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/component/pipes/array/lte.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'lte' 5 | }) 6 | 7 | export class LtePipe implements PipeTransform { 8 | transform(value: any, other: number): any { 9 | const comArr = []; 10 | if (Array.isArray(value)) { 11 | for (const v of value) { 12 | if (this.compare(v, other)) { 13 | comArr.push(v); 14 | } 15 | } 16 | return comArr; 17 | } 18 | return value; 19 | } 20 | 21 | compare(a, b) { 22 | if (!(typeof a === 'string' && typeof b === 'string')) { 23 | a = +a; 24 | b = +b; 25 | } 26 | return a <= b; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-add.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateAdd' 6 | }) 7 | 8 | export class DateAddPipe implements PipeTransform { 9 | transform(value: any, amount: any, unit?: any): any { 10 | if (typeof amount === 'undefined' || (typeof amount === 'number' && typeof unit === 'undefined')) { 11 | return value; 12 | } 13 | return moment(value).add(amount, unit); 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-duration.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateDuration' 6 | }) 7 | 8 | export class DateDurationPipe implements PipeTransform { 9 | transform(value: any, ...args: any[]): any { 10 | return moment.duration(value, args[0]).humanize(); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-format.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateFormat' 6 | }) 7 | 8 | export class DateFormatPipe implements PipeTransform { 9 | transform(value: any, ...args: any[]): any { 10 | if (!value) { 11 | return ''; 12 | } 13 | return moment().format(args[0]); 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-local.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateLocal' 6 | }) 7 | 8 | export class DateLocalPipe implements PipeTransform { 9 | transform(value: any): any { 10 | return moment(value).local(); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-locale.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateLocale' 6 | }) 7 | 8 | export class DateLocalePipe implements PipeTransform { 9 | transform(value: string, locale: string): any { 10 | return moment(value).locale(locale); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-subtract.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateSubstract' 6 | }) 7 | 8 | export class DateSubstractPipe implements PipeTransform { 9 | transform(value: any, amount: any, unit: any): any { 10 | if (typeof amount === 'undefined' || (typeof amount === 'number' && typeof unit === 'undefined')) { 11 | return value; 12 | } 13 | return moment(value).subtract(amount, unit); 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-unix.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateUnix' 6 | }) 7 | 8 | export class DateUnixPipe implements PipeTransform { 9 | transform(value: any): any { 10 | if (typeof value === 'string') { 11 | value = +value; 12 | } 13 | return moment.unix(value); 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/app/component/pipes/date/date-utc.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import * as moment from 'moment'; 3 | 4 | @Pipe({ 5 | name: 'dateUtc' 6 | }) 7 | 8 | export class DateUtcPipe implements PipeTransform { 9 | transform(value: any): any { 10 | return moment(value).utc(); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/app/component/pipes/helpers/createRound.ts: -------------------------------------------------------------------------------- 1 | export function createRound(methodName) { 2 | const func = Math[methodName]; 3 | return (number, precision) => { 4 | precision = precision == null ? 0 : Math.min(precision, 292); 5 | if (precision) { 6 | let pair = `${number}e`.split('e'); 7 | const value = func(`${pair[0]}e${+pair[1] + precision}`); 8 | 9 | pair = `${value}e`.split('e'); 10 | return +`${pair[0]}e${+pair[1] - precision}`; 11 | } 12 | return func(number); 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /src/app/component/pipes/index.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {MathPipesModule} from './math/index'; 3 | import {StringPipeModule} from './string/index'; 4 | import {ArrayPipeModule} from './array/index'; 5 | import {NumberPipeModule} from './number/index'; 6 | import {DatePipeModule} from './date/index'; 7 | 8 | export * from './math/index'; 9 | export * from './array/index'; 10 | export * from './number/index'; 11 | export * from './string/index'; 12 | export * from './date/index'; 13 | 14 | @NgModule({ 15 | exports: [ 16 | MathPipesModule, 17 | StringPipeModule, 18 | ArrayPipeModule, 19 | NumberPipeModule, 20 | DatePipeModule 21 | ] 22 | }) 23 | export class PipesModule {} 24 | -------------------------------------------------------------------------------- /src/app/component/pipes/math/index.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {MinPipe} from './min'; 3 | import {MaxPipe} from './max'; 4 | import {SumPipe} from './sum'; 5 | import {SqrtPipe} from './sqrt'; 6 | import {PowerPipe} from './pow'; 7 | 8 | export {MaxPipe} from './max'; 9 | export {MinPipe} from './min'; 10 | export {SumPipe} from './sum'; 11 | export {SqrtPipe} from './sqrt'; 12 | export {PowerPipe} from './pow'; 13 | 14 | const MATH_PIPES = [ 15 | MaxPipe, MinPipe, SumPipe, SqrtPipe, PowerPipe 16 | ]; 17 | 18 | @NgModule({ 19 | declarations: MATH_PIPES, 20 | exports: MATH_PIPES 21 | }) 22 | export class MathPipesModule {} 23 | -------------------------------------------------------------------------------- /src/app/component/pipes/math/max.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'max' 5 | }) 6 | 7 | export class MaxPipe implements PipeTransform { 8 | transform(value: any): any { 9 | return Array.isArray(value) ? Math.max(...value) : value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/math/min.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'min' 5 | }) 6 | 7 | export class MinPipe implements PipeTransform { 8 | transform(value: any): any { 9 | return Array.isArray(value) ? Math.min(...value) : value; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/math/pow.ts: -------------------------------------------------------------------------------- 1 | import {PipeTransform, Pipe} from '@angular/core'; 2 | 3 | @Pipe({name: 'pow'}) 4 | export class PowerPipe implements PipeTransform { 5 | 6 | transform(num: any, power: number = 2): number { 7 | return !isNaN(num) 8 | ? num ** power 9 | : num ; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/math/sqrt.ts: -------------------------------------------------------------------------------- 1 | import {PipeTransform, Pipe} from '@angular/core'; 2 | 3 | @Pipe({name: 'sqrt'}) 4 | export class SqrtPipe implements PipeTransform { 5 | 6 | transform(num: any): number { 7 | return !isNaN(num) 8 | ? Math.sqrt(num) 9 | : num; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/math/sum.ts: -------------------------------------------------------------------------------- 1 | import {PipeTransform, Pipe} from '@angular/core'; 2 | 3 | @Pipe({name: 'sum'}) 4 | export class SumPipe implements PipeTransform { 5 | 6 | transform(arr: any): number|number[] { 7 | return Array.isArray(arr) 8 | ? arr.reduce((sum, curr) => sum + curr, 0) 9 | : arr; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/number/ceil.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import {createRound} from '../helpers/createRound'; 3 | 4 | @Pipe({ 5 | name: 'ceil' 6 | }) 7 | 8 | export class CeilPipe implements PipeTransform { 9 | transform(number: any, precision?: any): any { 10 | const round = createRound('ceil'); 11 | return round(number, precision); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/app/component/pipes/number/floor.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import {createRound} from '../helpers/createRound'; 3 | 4 | @Pipe({ 5 | name: 'floor' 6 | }) 7 | 8 | export class FloorPipe implements PipeTransform { 9 | transform(number: any, precision?: any): any { 10 | const round = createRound('floor'); 11 | return round(number, precision); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/app/component/pipes/number/index.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CeilPipe} from './ceil'; 3 | import {FloorPipe} from './floor'; 4 | import {RoundPipe} from './round'; 5 | 6 | export {CeilPipe} from './ceil'; 7 | export {FloorPipe} from './floor'; 8 | export {RoundPipe} from './round'; 9 | 10 | const NUMBER_PIPE = [ 11 | CeilPipe, FloorPipe, RoundPipe 12 | ]; 13 | @NgModule({ 14 | declarations: NUMBER_PIPE, 15 | exports: NUMBER_PIPE 16 | }) 17 | export class NumberPipeModule {} 18 | -------------------------------------------------------------------------------- /src/app/component/pipes/number/round.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | import {createRound} from '../helpers/createRound'; 3 | 4 | @Pipe({ 5 | name: 'round' 6 | }) 7 | 8 | export class RoundPipe implements PipeTransform { 9 | transform(number: any, precision?: any): any { 10 | const round = createRound('round'); 11 | return round(number, precision); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/app/component/pipes/string/index.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {RepeatPipe} from './repeat'; 3 | 4 | const STRING_PIPE = [ 5 | RepeatPipe 6 | ]; 7 | @NgModule({ 8 | declarations: STRING_PIPE, 9 | exports: STRING_PIPE 10 | }) 11 | export class StringPipeModule {} 12 | -------------------------------------------------------------------------------- /src/app/component/pipes/string/repeat.ts: -------------------------------------------------------------------------------- 1 | import {Pipe, PipeTransform} from '@angular/core'; 2 | 3 | @Pipe({ 4 | name: 'repeat' 5 | }) 6 | 7 | export class RepeatPipe implements PipeTransform { 8 | transform(value: string, n: number): any { 9 | let result = ''; 10 | if (!value || n < 1 || n > Number.MAX_SAFE_INTEGER) { 11 | return result; 12 | } 13 | do { 14 | if (n % 2) { 15 | result += value; 16 | } 17 | n = Math.floor(n / 2); 18 | if (n) { 19 | value += value; 20 | } 21 | } while (n); 22 | 23 | return result; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/app/component/rating/rating.component.scss: -------------------------------------------------------------------------------- 1 | @import "../../../assets/sass/variables"; 2 | 3 | .free-rating { 4 | display: flex; 5 | align-items: center; 6 | 7 | .free-rating-item { 8 | position: relative; 9 | cursor: pointer; 10 | line-height: 0; 11 | 12 | div { 13 | display: inline-block; 14 | font-size: 1rem; 15 | padding: 0 .2rem; 16 | } 17 | 18 | .free-rating-half { 19 | position: absolute; 20 | top: 0; 21 | left: 0; 22 | width: 50%; 23 | z-index: 10; 24 | opacity: 0; 25 | overflow: hidden; 26 | padding-right: 0; 27 | } 28 | } 29 | 30 | &.free-rating-readonly { 31 | .free-rating-item { 32 | cursor: not-allowed; 33 | } 34 | } 35 | 36 | @each $theme, $color in $theme { 37 | &.free-#{$theme} { 38 | color: $color; 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /src/app/component/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "module": "es2015", 5 | "sourceMap": false, 6 | "moduleResolution": "node", 7 | "emitDecoratorMetadata": true, 8 | "experimentalDecorators": true, 9 | "declaration": true, 10 | "outDir": "../component", 11 | "lib": ["es2015", "dom"] 12 | }, 13 | "angularCompilerOptions": { 14 | "skipTemplateCodegen": true 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/app/component/validation/cn/directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, forwardRef} from '@angular/core'; 2 | import {NG_VALIDATORS, Validator, AbstractControl} from '@angular/forms'; 3 | import {cn} from './validator'; 4 | 5 | const CN_VALIDATOR: any = { 6 | provide: NG_VALIDATORS, 7 | useExisting: forwardRef(() => CnValidator), 8 | multi: true 9 | }; 10 | @Directive({ 11 | selector: '[cn][formControlName],[cn][formControl],[cn][ngModel]', 12 | providers: [CN_VALIDATOR] 13 | }) 14 | export class CnValidator implements Validator { 15 | validate(control: AbstractControl): { [key: string]: any } { 16 | return cn(control); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/app/component/validation/cn/index.ts: -------------------------------------------------------------------------------- 1 | export * from './validator'; 2 | export * from './directive'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/cn/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, ValidatorFn, Validators} from '@angular/forms'; 2 | import {isValueExited} from '../util/api'; 3 | export const cn: ValidatorFn = (control: AbstractControl): {[key: string]: boolean} => { 4 | if (isValueExited(Validators.required(control))) { 5 | return null; 6 | } 7 | const reg = /^[\u4e00-\u9fa5]+$/; 8 | return reg.test(control.value) ? null : {cn: true}; 9 | } 10 | -------------------------------------------------------------------------------- /src/app/component/validation/custom-form-validator.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {email, EmailValidator} from './email'; 3 | import {date, DateValidator} from './date'; 4 | import {url, UrlValidator} from './url'; 5 | import {cn, CnValidator} from './cn'; 6 | import {range, RangeValidator} from './range'; 7 | import {number, NumberValidator} from './number'; 8 | import {phone, PhoneValidator} from './phone'; 9 | 10 | export const CustomFormValidator: any = { 11 | date, 12 | email, 13 | url, 14 | cn, 15 | range, 16 | number, 17 | phone 18 | }; 19 | 20 | const CUSTOM_FORM_DIRECTIVES = [ 21 | EmailValidator, 22 | DateValidator, 23 | UrlValidator, 24 | CnValidator, 25 | RangeValidator, 26 | NumberValidator, 27 | PhoneValidator 28 | ]; 29 | 30 | @NgModule({ 31 | exports: [CUSTOM_FORM_DIRECTIVES], 32 | declarations: [CUSTOM_FORM_DIRECTIVES] 33 | }) 34 | export class CustomFormModule { 35 | } 36 | -------------------------------------------------------------------------------- /src/app/component/validation/date/directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, forwardRef} from '@angular/core'; 2 | import {NG_VALIDATORS, Validator, AbstractControl} from '@angular/forms'; 3 | import {date} from './validator'; 4 | 5 | const DATE_VALIDATOR: any = { 6 | provide: NG_VALIDATORS, 7 | useExisting: forwardRef(() => DateValidator), 8 | multi: true 9 | }; 10 | 11 | @Directive({ 12 | selector: '[date][formControlName],[date][formControl],[date][ngModel]', 13 | providers: [DATE_VALIDATOR] 14 | }) 15 | export class DateValidator implements Validator { 16 | validate(control: AbstractControl): { [key: string]: any } { 17 | return date(control); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/component/validation/date/index.ts: -------------------------------------------------------------------------------- 1 | export * from './validator'; 2 | export * from './directive'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/date/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, ValidatorFn, Validators} from '@angular/forms'; 2 | import {isDate, isValueExited} from '../util/api'; 3 | export const date: ValidatorFn = (control: AbstractControl): {[key: string]: boolean} => { 4 | if (isValueExited(Validators.required(control))) { 5 | return null; 6 | } 7 | const value: string = control.value; 8 | return isDate(value) ? null : {date: true}; 9 | } 10 | -------------------------------------------------------------------------------- /src/app/component/validation/email/directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, forwardRef} from '@angular/core'; 2 | import {email} from './validator'; 3 | import {NG_VALIDATORS, Validator, AbstractControl} from '@angular/forms'; 4 | 5 | const EMAIL_VALIDATOR: any = { 6 | provide: NG_VALIDATORS, 7 | useExisting: forwardRef(() => EmailValidator), 8 | multi: true 9 | }; 10 | @Directive({ 11 | selector: '[email][formControlName],[email][formControl],[email][ngModel]', 12 | providers: [EMAIL_VALIDATOR] 13 | }) 14 | export class EmailValidator implements Validator { 15 | validate(control: AbstractControl): { [key: string]: any } { 16 | return email(control); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/app/component/validation/email/index.ts: -------------------------------------------------------------------------------- 1 | export * from './validator'; 2 | export * from './directive'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/email/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, ValidatorFn, Validators} from '@angular/forms'; 2 | import {isEmail, isValueExited} from '../util/api'; 3 | export const email: ValidatorFn = (control: AbstractControl): {[key: string]: boolean} => { 4 | if (isValueExited(Validators.required(control))) { 5 | return null; 6 | } 7 | return isEmail(control.value) ? null : {email: true}; 8 | } 9 | -------------------------------------------------------------------------------- /src/app/component/validation/number/directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, forwardRef} from '@angular/core'; 2 | import {NG_VALIDATORS, Validator, AbstractControl} from '@angular/forms'; 3 | import {number} from './validator'; 4 | 5 | const NUMBER_VALIDATOR: any = { 6 | provide: NG_VALIDATORS, 7 | useExisting: forwardRef(() => NumberValidator), 8 | multi: true 9 | }; 10 | @Directive({ 11 | selector: '[number][formControlName],[number][formControl],[number][ngModel]', 12 | providers: [NUMBER_VALIDATOR] 13 | }) 14 | export class NumberValidator implements Validator { 15 | validate(control: AbstractControl): { [key: string]: any } { 16 | return number(control); 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/app/component/validation/number/index.ts: -------------------------------------------------------------------------------- 1 | export * from './validator'; 2 | export * from './directive'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/number/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, ValidatorFn, Validators} from '@angular/forms'; 2 | import {isValueExited} from '../util/api'; 3 | export const number: ValidatorFn = (control: AbstractControl): {[key: string]: boolean} => { 4 | if (isValueExited(Validators.required(control))) { 5 | return null; 6 | } 7 | const reg = /^\d+$/; 8 | return reg.test(control.value) ? null : {number: true}; 9 | } 10 | -------------------------------------------------------------------------------- /src/app/component/validation/phone/index.ts: -------------------------------------------------------------------------------- 1 | export * from './validator'; 2 | export * from './directive'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/phone/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, Validators, ValidatorFn} from '@angular/forms'; 2 | import {isValidNumber} from 'libphonenumber-js'; 3 | import {isValueExited} from '../util/api'; 4 | 5 | export const phone = (country: any): ValidatorFn => { 6 | return (control: AbstractControl): { [key: string]: boolean } => { 7 | if (isValueExited(Validators.required(control))) { 8 | return null; 9 | } 10 | return isValidNumber(control.value, country) ? null : {phone: true}; 11 | }; 12 | } 13 | -------------------------------------------------------------------------------- /src/app/component/validation/range/index.ts: -------------------------------------------------------------------------------- 1 | export * from './validator'; 2 | export * from './directive'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/range/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, ValidatorFn, Validators} from '@angular/forms'; 2 | import {isValueExited} from '../util/api'; 3 | 4 | export function range(range: Array): ValidatorFn { 5 | return (control: AbstractControl): {[key: string]: any} => { 6 | if (!isValueExited(range) || isValueExited(Validators.required(control))) { 7 | return null; 8 | } 9 | const v: number = +control.value; 10 | return v >= range[0] && v <= range[1] ? null : {actualValue: v, requiredValue: range, range: true}; 11 | }; 12 | }; 13 | -------------------------------------------------------------------------------- /src/app/component/validation/url/directive.ts: -------------------------------------------------------------------------------- 1 | import {Directive, forwardRef} from '@angular/core'; 2 | import {AbstractControl, NG_VALIDATORS, Validator} from '@angular/forms'; 3 | import {url} from './validator'; 4 | const URL_VALIDATOR: any = { 5 | provide: NG_VALIDATORS, 6 | useExisting: forwardRef(() => UrlValidator), 7 | multi: true 8 | }; 9 | @Directive({ 10 | selector: '[url][formControlName],[url][formControl],[url][ngModel]', 11 | providers: [URL_VALIDATOR] 12 | }) 13 | export class UrlValidator implements Validator{ 14 | validate(control: AbstractControl): { [key: string]: any } { 15 | return url(control); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/app/component/validation/url/index.ts: -------------------------------------------------------------------------------- 1 | export * from './directive'; 2 | export * from './validator'; 3 | -------------------------------------------------------------------------------- /src/app/component/validation/url/validator.ts: -------------------------------------------------------------------------------- 1 | import {AbstractControl, ValidatorFn, Validators} from '@angular/forms'; 2 | import {isValueExited} from '../util/api'; 3 | export const url: ValidatorFn = (control: AbstractControl): {[key: string]: boolean} => { 4 | if (isValueExited(Validators.required(control))) { 5 | return null; 6 | } 7 | const reg = /(^#)|(^http(s*):\/\/[^\s]+\.[^\s]+)/; 8 | return reg.test(control.value) ? null : {url: true}; 9 | } 10 | -------------------------------------------------------------------------------- /src/app/component/validation/util/api.ts: -------------------------------------------------------------------------------- 1 | export function isValueExited(obj: any): boolean { 2 | return obj !== undefined && obj !== null; 3 | } 4 | 5 | export function isDate(obj: any): boolean { 6 | return !/Invalid|NaN/.test(new Date(obj).toString()); 7 | } 8 | 9 | export function isEmail(obj: any): boolean { 10 | const regexp = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 11 | return regexp.test(obj); 12 | } 13 | 14 | export function isNumeric(obj: any): boolean { 15 | const numeric = /^[-+]?[0-9]+$/; 16 | return numeric.test(obj); 17 | } 18 | -------------------------------------------------------------------------------- /src/app/democase/common/animations.ts: -------------------------------------------------------------------------------- 1 | import { trigger, style, state, animate, transition } from '@angular/animations'; 2 | 3 | export const fadeInUp = trigger('fadeInUpState', [ 4 | state('in', style({opacity: 1, transform: 'translate3d(0, 0, 0)'})), 5 | transition('void => *', [ 6 | style({ 7 | opacity: 0, 8 | transform: 'translate3d(0, 100%, 0)' 9 | }), animate('.4s cubic-bezier(.25,.8,.25,1)') 10 | ]) 11 | ]) 12 | 13 | export const fadeIn = trigger('fadeInState', [ 14 | state('in', style({opacity: 1})), 15 | transition('void => *', [ 16 | style({opacity: 0}), 17 | animate('.3s cubic-bezier(.35,0,.25,1)') 18 | ]) 19 | ]) 20 | -------------------------------------------------------------------------------- /src/app/democase/common/config.ts: -------------------------------------------------------------------------------- 1 | 2 | export const config = { 3 | version: '0.6.0', 4 | theme: [ 5 | { name: 'primary', color: '#1976d2'}, 6 | { name: 'info', color: '#1ccacc'}, 7 | {name: 'success', color: '#1aae88'}, 8 | { name: 'warning', color: '#fbb23e'}, 9 | { name: 'danger', color: '#e33244'} 10 | ], 11 | color: [ 12 | { name: 'green', color: '#46be8a'}, 13 | { name: 'deepblue', color: '#115d8e'}, 14 | { name: 'blue', color: '#1976d2'}, 15 | { name: 'lightblue', color: '#169e9f'}, 16 | { name: 'yellow', color: '#fa9e0c' }, 17 | { name: 'red', color: '#f96868'}, 18 | { name: 'purple', color: '#6633B9'}, 19 | { name: 'orange', color: '#f2a654'}, 20 | { name: 'brown', color: '#8d6658'}, 21 | { name: 'cyan', color: '#57c7d4'}, 22 | { name: 'pink', color: '#f96197'}, 23 | { name: 'teal', color: '#3aa99e'}, 24 | { name: 'dark', color: '#393D49'} 25 | ] 26 | }; 27 | -------------------------------------------------------------------------------- /src/app/democase/login/login-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {LoginComponent} from './login.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: LoginComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class LoginRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/login/login.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {FormsModule, ReactiveFormsModule} from '@angular/forms'; 4 | import { ButtonModule } from '../../component/button/button.directive'; 5 | import {ParticleModule} from '../../component/particle/particle.directive'; 6 | import {LoginComponent} from './login.component'; 7 | import {LoginRoutingModule} from './login-routing.module'; 8 | import {LanguageModule} from '../common/language'; 9 | 10 | @NgModule({ 11 | imports: [ 12 | CommonModule, 13 | FormsModule, 14 | ReactiveFormsModule, 15 | LoginRoutingModule, 16 | ButtonModule, 17 | ParticleModule, 18 | LanguageModule 19 | ], 20 | declarations: [ 21 | LoginComponent 22 | ] 23 | }) 24 | export class LoginModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-accordion/main-accordion-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {MainAccordionComponent} from './main-accordion.component'; 3 | import {RouterModule} from '@angular/router'; 4 | import {NgModule} from '@angular/core'; 5 | 6 | @NgModule({ 7 | imports: [ 8 | RouterModule.forChild([ 9 | {path: '', component: MainAccordionComponent} 10 | ]) 11 | ], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainAccordionRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-accordion/main-accordion.component.css: -------------------------------------------------------------------------------- 1 | :host ::ng-deep .main-container .accordion-content { 2 | border-top: none; } 3 | 4 | ::ng-deep .blueHeader .accordion-toggle { 5 | background: #1976d2; 6 | color: #fff; } 7 | ::ng-deep .blueHeader .accordion-toggle:hover { 8 | color: #fff; } 9 | ::ng-deep .blueHeader .accordion-item-expand.accordion-toggle { 10 | color: #fff !important; } 11 | 12 | /*# sourceMappingURL=main-accordion.component.css.map */ 13 | -------------------------------------------------------------------------------- /src/app/democase/main-accordion/main-accordion.component.scss: -------------------------------------------------------------------------------- 1 | 2 | :host ::ng-deep .main-container .accordion-content { 3 | border-top: none; 4 | } 5 | 6 | 7 | ::ng-deep .blueHeader { 8 | .accordion-toggle { 9 | background: #1976d2; 10 | color: #fff; 11 | 12 | &:hover { 13 | color: #fff; 14 | } 15 | } 16 | .accordion-item-expand.accordion-toggle { 17 | color: #fff !important; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/democase/main-accordion/main-accordion.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-accordion', 6 | templateUrl: './main-accordion.component.html', 7 | styleUrls: ['./main-accordion.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainAccordionComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Accordion' 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-badge/main-badge-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainBadgeComponent} from './main-badge.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainBadgeComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainBadgeRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-badge/main-badge.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-badge.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-badge/main-badge.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-badge/main-badge.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-badge/main-badge.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-badge', 6 | templateUrl: './main-badge.component.html', 7 | styleUrls: ['./main-badge.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainBadgeComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Badge'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-breadcrumb/main-breadcrumb-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainBreadcrumbComponent} from './main-breadcrumb.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainBreadcrumbComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainBreadcrumbRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-breadcrumb/main-breadcrumb.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-breadcrumb.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-breadcrumb/main-breadcrumb.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-breadcrumb/main-breadcrumb.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-breadcrumb/main-breadcrumb.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-breadcrumb', 6 | templateUrl: './main-breadcrumb.component.html', 7 | styleUrls: ['./main-breadcrumb.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainBreadcrumbComponent implements OnInit { 11 | 12 | menus: any; 13 | @HostBinding('@fadeInUpState') fadeInUpState; 14 | @HostBinding('style.display') display = 'block'; 15 | pageTitle = 'Components-Breadcrumb'; 16 | constructor() { } 17 | 18 | ngOnInit() { 19 | this.menus = [ 20 | {'name': 'Homepage', icon: 'home'}, 21 | {'name': 'item 1'}, 22 | {'name': 'item 2'} 23 | ]; 24 | } 25 | 26 | } 27 | 28 | -------------------------------------------------------------------------------- /src/app/democase/main-buttons/main-buttons-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | 5 | import {RouterModule} from '@angular/router'; 6 | import {MainButtonsComponent} from './main-buttons.component'; 7 | import {NgModule} from '@angular/core'; 8 | @NgModule({ 9 | imports: [ 10 | RouterModule.forChild([ 11 | {path: '', component: MainButtonsComponent} 12 | ]) 13 | ], 14 | exports: [RouterModule] 15 | }) 16 | 17 | export class MainButtonsRoutingModule {} 18 | -------------------------------------------------------------------------------- /src/app/democase/main-buttons/main-buttons.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .btn-group { 2 | margin-top: 10px; } 3 | :host /deep/ .btn { 4 | margin: 0 5px 10px 0; } 5 | :host /deep/ .btn-group .btn { 6 | margin: 0; } 7 | 8 | /*# sourceMappingURL=main-buttons.component.css.map */ 9 | -------------------------------------------------------------------------------- /src/app/democase/main-buttons/main-buttons.component.scss: -------------------------------------------------------------------------------- 1 | 2 | :host /deep/ { 3 | .btn-group{ 4 | margin-top:10px; 5 | } 6 | 7 | .btn { 8 | margin: 0 5px 10px 0; 9 | } 10 | 11 | .btn-group .btn { 12 | margin: 0; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /src/app/democase/main-buttons/main-buttons.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-buttons', 6 | templateUrl: './main-buttons.component.html', 7 | styleUrls: ['./main-buttons.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainButtonsComponent implements OnInit { 11 | 12 | msg = []; 13 | num = 0; 14 | @HostBinding('@fadeInUpState') fadeInUpState; 15 | @HostBinding('style.display') display = 'block'; 16 | pageTitle = 'Directives-Button'; 17 | constructor() { 18 | } 19 | 20 | ngOnInit() { 21 | } 22 | 23 | onClick() { 24 | this.msg.push('描述提示框' + (++this.num)); 25 | } 26 | 27 | } 28 | 29 | -------------------------------------------------------------------------------- /src/app/democase/main-calendar/main-calendar-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainCalendarComponent} from './main-calendar.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainCalendarComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainCalendarRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-calendar/main-calendar.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-calendar.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-calendar/main-calendar.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-calendar/main-calendar.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-calendar/main-calendar.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-calendar', 6 | templateUrl: './main-calendar.component.html', 7 | styleUrls: ['./main-calendar.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainCalendarComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | 15 | birthday: string; 16 | minDate: string; 17 | defaultDate: string; 18 | maxDate: string; 19 | pageTitle = 'Components-Calendar'; 20 | constructor() { 21 | this.birthday = '2016-5-31'; 22 | this.defaultDate = '2015/10/11'; 23 | } 24 | 25 | ngOnInit() { 26 | } 27 | 28 | } 29 | 30 | -------------------------------------------------------------------------------- /src/app/democase/main-card/main-card-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainCardComponent} from './main-card.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainCardComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainCardRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-card/main-card.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .free-card { 2 | margin-bottom: 20px; } 3 | :host /deep/ .free-card .free-card-content { 4 | padding: 10px; } 5 | 6 | /*# sourceMappingURL=main-card.component.css.map */ 7 | -------------------------------------------------------------------------------- /src/app/democase/main-card/main-card.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .free-card { 3 | margin-bottom: 20px; 4 | } 5 | 6 | .free-card .free-card-content { 7 | padding: 10px; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/app/democase/main-card/main-card.component.ts: -------------------------------------------------------------------------------- 1 | 2 | import {Component, OnInit, HostBinding} from '@angular/core'; 3 | import { fadeInUp } from '../common/animations'; 4 | 5 | @Component({ 6 | selector: 'free-main-card', 7 | templateUrl: './main-card.component.html', 8 | styleUrls: ['./main-card.component.css'], 9 | animations: [fadeInUp] 10 | }) 11 | export class MainCardComponent implements OnInit { 12 | 13 | @HostBinding('@fadeInUpState') fadeInUpState; 14 | @HostBinding('style.display') display = 'block'; 15 | pageTitle = 'Components-Card'; 16 | constructor() { } 17 | 18 | ngOnInit() { 19 | } 20 | 21 | } 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-cascader/cascader.service.ts: -------------------------------------------------------------------------------- 1 | import {Injectable} from '@angular/core'; 2 | import {Http} from '@angular/http'; 3 | import 'rxjs/add/operator/toPromise'; 4 | 5 | @Injectable() 6 | export class CascaderService { 7 | constructor(public http: Http) {} 8 | 9 | getCity() { 10 | const url = 'assets/json/city.json'; 11 | return this.http.get(url) 12 | .toPromise() 13 | .then(res => res.json()) 14 | .catch(this.handleError); 15 | } 16 | 17 | public handleError(error: any) { 18 | console.error('An error occurred', error); 19 | return Promise.reject(error.message || error); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/app/democase/main-cascader/main-cascader-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {MainCascaderComponent} from './main-cascader.component'; 3 | import {NgModule} from '@angular/core'; 4 | @NgModule({ 5 | imports: [ 6 | RouterModule.forChild([{ 7 | path: '', component: MainCascaderComponent 8 | }]) 9 | ], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainCascaderRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-cascader/main-cascader.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-cascader.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-cascader/main-cascader.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-cascader/main-cascader.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-changelog/main-changelog-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainChangelogComponent} from './main-changelog.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainChangelogComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainChangelogRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-changelog/main-changelog.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .free-timeline-item { 2 | color: rgba(0, 0, 0, 0.65); } 3 | :host /deep/ h4, 4 | :host /deep/ .free-table-head-text { 5 | color: #333; } 6 | :host /deep/ h5 { 7 | color: #333; } 8 | :host /deep/ h5.subtitle { 9 | margin: 15px 0; } 10 | :host /deep/ .title-label { 11 | margin: 0 1px; 12 | background: #f7f7f7; 13 | padding: .2rem .4rem; 14 | border-radius: 3px; 15 | font-size: .65rem; 16 | color: rgba(0, 0, 0, 0.65); 17 | border: 1px solid #eee; } 18 | :host /deep/ ul li ul { 19 | margin-left: 1rem; } 20 | 21 | /*# sourceMappingURL=main-changelog.component.css.map */ 22 | -------------------------------------------------------------------------------- /src/app/democase/main-changelog/main-changelog.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .free-timeline-item { 3 | color: rgba(0,0,0,.65); 4 | } 5 | 6 | h4, 7 | .free-table-head-text { 8 | color: #333; 9 | } 10 | 11 | h5 { 12 | color: #333; 13 | 14 | &.subtitle { 15 | margin: 15px 0; 16 | } 17 | } 18 | 19 | .title-label { 20 | margin: 0 1px; 21 | background: #f7f7f7; 22 | padding: .2rem .4rem; 23 | border-radius: 3px; 24 | font-size: .65rem; 25 | color: rgba(0,0,0,.65); 26 | border: 1px solid #eee; 27 | } 28 | 29 | ul li { 30 | ul { 31 | margin-left: 1rem; 32 | } 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /src/app/democase/main-changelog/main-changelog.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-changelog', 6 | templateUrl: './main-changelog.component.html', 7 | styleUrls: ['./main-changelog.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainChangelogComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Changelog'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | } 20 | 21 | -------------------------------------------------------------------------------- /src/app/democase/main-changelog/main-changelog.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {PanelModule} from '../../component/panel/panel.component'; 4 | import {GridModule} from '../../component/grid/grid.directive'; 5 | import {TableModule} from '../../component/table/table.component'; 6 | import {MainChangelogRoutingModule} from './main-changelog-routing.module'; 7 | import {MainChangelogComponent} from './main-changelog.component'; 8 | import {TimelineModule} from '../../component/timeline/timeline.component'; 9 | import {LanguageModule} from '../common/language'; 10 | 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | MainChangelogRoutingModule, 15 | PanelModule, 16 | GridModule, 17 | TableModule, 18 | TimelineModule, 19 | LanguageModule 20 | ], 21 | declarations: [MainChangelogComponent] 22 | }) 23 | 24 | export class MainChangelogModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-chart/main-chart-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {MainChartComponent} from './main-chart.component'; 3 | import {NgModule} from '@angular/core'; 4 | @NgModule({ 5 | imports: [ 6 | RouterModule.forChild([ 7 | {path: '', component: MainChartComponent} 8 | ]) 9 | ] 10 | }) 11 | export class MainChartRoutingModule {} 12 | -------------------------------------------------------------------------------- /src/app/democase/main-chart/main-chart.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-chart { 2 | width: 100%; } 3 | 4 | /*# sourceMappingURL=main-chart.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-chart/main-chart.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-chart { 3 | width: 100%; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-chart/main-chart.module.ts: -------------------------------------------------------------------------------- 1 | import {CommonModule} from '@angular/common'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainChartComponent} from './main-chart.component'; 4 | import {MainChartRoutingModule} from './main-chart-routing.module'; 5 | import {GridModule} from '../../component/grid/grid.directive'; 6 | import {TableModule} from '../../component/table/table.component'; 7 | import {CodeModule} from '../../component/code/code.component'; 8 | import {TabGroupModule} from '../../component/tab/tab.component'; 9 | import {ChartModule} from '../../component/chart/chart.component'; 10 | import {LanguageModule} from '../common/language'; 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | TabGroupModule, 15 | CodeModule, 16 | TableModule, 17 | GridModule, 18 | ChartModule, 19 | MainChartRoutingModule, 20 | LanguageModule 21 | ], 22 | declarations: [MainChartComponent] 23 | }) 24 | export class MainChartModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-checkbox/main-checkbox-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainCheckboxComponent} from './main-checkbox.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainCheckboxComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainCheckboxRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-checkbox/main-checkbox.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .free-tab { 2 | flex-wrap: wrap; } 3 | :host /deep/ free-checkbox { 4 | display: flex; 5 | margin: 0 .5rem .5rem 0; } 6 | 7 | /*# sourceMappingURL=main-checkbox.component.css.map */ 8 | -------------------------------------------------------------------------------- /src/app/democase/main-checkbox/main-checkbox.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .free-tab { 3 | flex-wrap: wrap; 4 | } 5 | free-checkbox { 6 | display: flex; 7 | margin: 0 .5rem .5rem 0; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/app/democase/main-checkbox/main-checkbox.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | import { config } from '../common/config'; 4 | 5 | @Component({ 6 | selector: 'free-main-checkbox', 7 | templateUrl: './main-checkbox.component.html', 8 | styleUrls: ['./main-checkbox.component.css'], 9 | animations: [fadeInUp] 10 | }) 11 | export class MainCheckboxComponent implements OnInit { 12 | 13 | @HostBinding('@fadeInUpState') fadeInUpState; 14 | @HostBinding('style.display') display = 'block'; 15 | theme = []; 16 | pageTitle = 'Components-Checkbox'; 17 | selectedCity: any[]; 18 | checked: any; 19 | binaryChecked: boolean; 20 | constructor() { 21 | this.selectedCity = ['guangdong']; 22 | this.binaryChecked = false; 23 | this.checked = ['Item1']; 24 | } 25 | 26 | ngOnInit() { 27 | this.theme = config.theme; 28 | } 29 | } 30 | 31 | -------------------------------------------------------------------------------- /src/app/democase/main-chip/main-chip-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainChipComponent} from './main-chip.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainChipComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainChipRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-chip/main-chip.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-chip.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-chip/main-chip.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-chip/main-chip.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-chip/main-chip.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {TableModule} from '../../component/table/table.component'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {ChipModule} from '../../component/chip/chip.component'; 7 | import {GridModule} from '../../component/grid/grid.directive'; 8 | import {MainChipRoutingModule} from './main-chip-routing.module'; 9 | import {MainChipComponent} from './main-chip.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | MainChipRoutingModule, 16 | TabGroupModule, 17 | CodeModule, 18 | TableModule, 19 | ChipModule, 20 | GridModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainChipComponent] 24 | }) 25 | 26 | export class MainChipModule {} 27 | -------------------------------------------------------------------------------- /src/app/democase/main-colorpicker/main-colorpicker-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {RouterModule} from '@angular/router'; 3 | import {MainColorpickerComponent} from './main-colorpicker.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainColorpickerComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | export class MainColorpickerRoutingModule {} 12 | -------------------------------------------------------------------------------- /src/app/democase/main-colorpicker/main-colorpicker.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-colorpicker.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-colorpicker/main-colorpicker.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-colorpicker/main-colorpicker.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-colorpicker/main-colorpicker.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-colorpicker', 6 | templateUrl: './main-colorpicker.component.html', 7 | styleUrls: ['./main-colorpicker.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainColorpickerComponent implements OnInit { 11 | @HostBinding('@fadeInUpState') fadeInUpState; 12 | @HostBinding('style.display') display = 'block'; 13 | 14 | color: string; 15 | defaultColor: string; 16 | pageTitle = 'Components-Colorpicker'; 17 | constructor() { 18 | this.color = 'rgb(110, 11, 248)'; 19 | } 20 | 21 | ngOnInit() { 22 | } 23 | 24 | onColorSelect(event: any) { 25 | console.log(event); 26 | } 27 | 28 | } 29 | -------------------------------------------------------------------------------- /src/app/democase/main-column/main-column-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {RouterModule} from '@angular/router'; 3 | import {MainColumnComponent} from './main-column.component'; 4 | @NgModule({ 5 | imports: [RouterModule.forChild([ 6 | {path: '', component: MainColumnComponent} 7 | ])], 8 | exports: [RouterModule] 9 | }) 10 | export class MainColumnRoutingModule {} 11 | -------------------------------------------------------------------------------- /src/app/democase/main-column/main-column.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-column.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-column/main-column.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-column/main-column.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-column/main-column.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit, HostBinding } from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-column', 6 | templateUrl: './main-column.component.html', 7 | styleUrls: ['./main-column.component.scss'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainColumnComponent implements OnInit { 11 | @HostBinding('@fadeInUpState') fadeInUpState; 12 | @HostBinding('style.display') display = 'block'; 13 | pageTitle = 'UI Element-Column'; 14 | constructor() { } 15 | 16 | ngOnInit() { 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /src/app/democase/main-contextmenu/main-contextmenu-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainContextmenuComponent} from './main-contextmenu.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainContextmenuComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainContextRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-contextmenu/main-contextmenu.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-contextmenu.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-contextmenu/main-contextmenu.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-contextmenu/main-contextmenu.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-cropper/main-cropper-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainCropperComponent} from './main-cropper.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainCropperComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainCropperRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-cropper/main-cropper.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-cropper.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-cropper/main-cropper.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-cropper/main-cropper.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-cropper/main-cropper.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-cropper', 6 | templateUrl: './main-cropper.component.html', 7 | styleUrls: ['./main-cropper.component.scss'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainCropperComponent implements OnInit { 11 | @HostBinding('@fadeInUpState') fadeInUpState; 12 | @HostBinding('style.display') display = 'block'; 13 | cropImage: string; 14 | constructor() { 15 | } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | onCrop(event: any) { 21 | this.cropImage = event.canvasData; 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/app/democase/main-datatable/main-datatable-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {MainDatatableComponent} from './main-datatable.component'; 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | @NgModule({ 5 | imports: [ 6 | RouterModule.forChild([ 7 | {path: '', component: MainDatatableComponent} 8 | ]) 9 | ], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainDatatableRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-datatable/main-datatable.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-datatable { 2 | width: 100%; } 3 | 4 | /*# sourceMappingURL=main-datatable.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-datatable/main-datatable.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-datatable { 3 | width: 100%; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-draggable/main-draggable-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {RouterModule} from '@angular/router'; 3 | import {MainDraggableComponent} from './main-draggable.component'; 4 | @NgModule({ 5 | imports: [RouterModule.forChild([ 6 | {path: '', component: MainDraggableComponent} 7 | ])], 8 | exports: [RouterModule] 9 | }) 10 | export class MainDraggableRoutingModule {} 11 | -------------------------------------------------------------------------------- /src/app/democase/main-draggable/main-draggable.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .draggable-test-item { 2 | padding: 10px; 3 | border-bottom: 1px solid #d9d9d9; } 4 | :host /deep/ .draggable-test-item:last-child { 5 | border: none; } 6 | :host /deep/ .drop-box, 7 | :host /deep/ free-draggable { 8 | width: 50%; 9 | min-height: 15rem; 10 | padding: .5rem; 11 | border: 1px solid #d9d9d9; } 12 | :host /deep/ .drop-box .free-draggable-item, 13 | :host /deep/ free-draggable .free-draggable-item { 14 | border: 1px solid #d9d9d9; 15 | margin-bottom: .5rem; } 16 | :host /deep/ .drop-box { 17 | border-left: none; } 18 | :host /deep/ .drop-box .free-list-item { 19 | border: 1px solid #d9d9d9; 20 | margin-bottom: .5rem; } 21 | 22 | /*# sourceMappingURL=main-draggable.component.css.map */ 23 | -------------------------------------------------------------------------------- /src/app/democase/main-draggable/main-draggable.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .draggable-test-item { 3 | padding: 10px; 4 | border-bottom: 1px solid #d9d9d9; 5 | 6 | &:last-child { 7 | border: none; 8 | } 9 | } 10 | 11 | .drop-box, 12 | free-draggable { 13 | width: 50%; 14 | min-height: 15rem; 15 | padding: .5rem; 16 | border: 1px solid #d9d9d9; 17 | .free-draggable-item { 18 | border: 1px solid #d9d9d9; 19 | margin-bottom: .5rem; 20 | } 21 | } 22 | 23 | .drop-box { 24 | border-left: none; 25 | .free-list-item { 26 | border: 1px solid #d9d9d9; 27 | margin-bottom: .5rem; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/app/democase/main-dropdown/main-dropdown-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainDropdownComponent} from './main-dropdown.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainDropdownComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainDropdownRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-dropdown/main-dropdown.component.css: -------------------------------------------------------------------------------- 1 | free-dropdown { 2 | float: left; 3 | margin: 10px; } 4 | 5 | .main-dropdown-box { 6 | height: 15rem; } 7 | 8 | /*# sourceMappingURL=main-dropdown.component.css.map */ 9 | -------------------------------------------------------------------------------- /src/app/democase/main-dropdown/main-dropdown.component.scss: -------------------------------------------------------------------------------- 1 | free-dropdown { 2 | float: left; 3 | margin: 10px; 4 | } 5 | 6 | 7 | .main-dropdown-box { 8 | height: 15rem; 9 | } 10 | -------------------------------------------------------------------------------- /src/app/democase/main-echarts/main-echarts-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainEchartsComponent} from './main-echarts.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainEchartsComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainEchartsRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-echarts/main-echarts.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-echarts.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-echarts/main-echarts.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-echarts/main-echarts.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-echarts/main-echarts.module.ts: -------------------------------------------------------------------------------- 1 | import {CommonModule} from '@angular/common'; 2 | import {NgModule} from '@angular/core'; 3 | import {GridModule} from '../../component/grid/grid.directive'; 4 | import {TableModule} from '../../component/table/table.component'; 5 | import {CodeModule} from '../../component/code/code.component'; 6 | import {TabGroupModule} from '../../component/tab/tab.component'; 7 | import {LanguageModule} from '../common/language'; 8 | import {MainEchartsRoutingModule} from './main-echarts-routing.module'; 9 | import {MainEchartsComponent} from './main-echarts.component'; 10 | import {EchartModule} from '../../component/echart/echart.component'; 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | TabGroupModule, 15 | CodeModule, 16 | TableModule, 17 | GridModule, 18 | EchartModule, 19 | MainEchartsRoutingModule, 20 | LanguageModule 21 | ], 22 | declarations: [MainEchartsComponent] 23 | }) 24 | export class MainEchartsModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-editor/main-editor-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import {RouterModule} from '@angular/router'; 3 | import {MainEditorComponent} from './main-editor.component'; 4 | 5 | @NgModule({ 6 | imports: [ 7 | RouterModule.forChild([ 8 | {path: '', component: MainEditorComponent} 9 | ]) 10 | ], 11 | exports: [RouterModule] 12 | }) 13 | export class MainEditorRoutingModule { } 14 | -------------------------------------------------------------------------------- /src/app/democase/main-editor/main-editor.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-editor.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-editor/main-editor.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-editor/main-editor.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-error/main-error-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainErrorComponent} from './main-error.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainErrorComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainErrorRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-error/main-error.component.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

404

4 |

{{'DEMO.ERROR.WORD' | translate}}

5 | 11 |
12 |
13 | -------------------------------------------------------------------------------- /src/app/democase/main-error/main-error.component.ts: -------------------------------------------------------------------------------- 1 | import {Location} from '@angular/common'; 2 | import {Component, OnInit} from '@angular/core'; 3 | 4 | @Component({ 5 | selector: 'free-main-error', 6 | templateUrl: './main-error.component.html', 7 | styleUrls: ['./main-error.component.css'] 8 | }) 9 | export class MainErrorComponent implements OnInit { 10 | pageTitle = '404 Page'; 11 | constructor(public location: Location) { } 12 | 13 | ngOnInit() { 14 | } 15 | 16 | goToBack() { 17 | this.location.back(); 18 | } 19 | 20 | } 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-error/main-error.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {GridModule} from '../../component/grid/grid.directive'; 4 | import {IconModule} from '../../component/icon/icon.component'; 5 | import {MainErrorRoutingModule} from './main-error-routing.module'; 6 | import {MainErrorComponent} from './main-error.component'; 7 | import {LanguageModule} from '../common/language'; 8 | 9 | @NgModule({ 10 | imports: [ 11 | CommonModule, 12 | MainErrorRoutingModule, 13 | GridModule, 14 | IconModule, 15 | LanguageModule 16 | ], 17 | declarations: [MainErrorComponent] 18 | }) 19 | 20 | export class MainErrorModule {} 21 | -------------------------------------------------------------------------------- /src/app/democase/main-flow/main-flow-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import {RouterModule} from '@angular/router'; 3 | import {MainFlowComponent} from './main-flow.component'; 4 | 5 | @NgModule({ 6 | imports: [ 7 | RouterModule.forChild([ 8 | {path: '', component: MainFlowComponent} 9 | ]) 10 | ], 11 | exports: [RouterModule] 12 | }) 13 | export class MainFlowRoutingModule { } 14 | -------------------------------------------------------------------------------- /src/app/democase/main-flow/main-flow.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-flow .flow-item { 2 | display: inline-block; 3 | margin: 0 5px; 4 | font-size: 14px; 5 | width: 47%; 6 | margin-bottom: 10px; 7 | min-height: 100px; 8 | line-height: 100px; 9 | text-align: center; 10 | background-color: #eee; } 11 | :host /deep/ free-flow .flow-item img { 12 | display: block; 13 | width: 100%; 14 | height: 120px; } 15 | 16 | /*# sourceMappingURL=main-flow.component.css.map */ 17 | -------------------------------------------------------------------------------- /src/app/democase/main-flow/main-flow.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-flow .flow-item { 3 | display: inline-block; 4 | margin: 0 5px; 5 | font-size: 14px; 6 | width: 47%; 7 | margin-bottom: 10px; 8 | min-height: 100px; 9 | line-height: 100px; 10 | text-align: center; 11 | background-color: #eee; 12 | 13 | img { 14 | display: block; 15 | width: 100%; 16 | height: 120px; 17 | } 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/app/democase/main-flow/main-flow.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {GridModule} from '../../component/grid/grid.directive'; 4 | import {TableModule} from '../../component/table/table.component'; 5 | import {CodeModule} from '../../component/code/code.component'; 6 | import {TabGroupModule} from '../../component/tab/tab.component'; 7 | import {MainFlowRoutingModule} from './main-flow-routing.module'; 8 | import {MainFlowComponent} from './main-flow.component'; 9 | import {FlowModule} from '../../component/flow/flow.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | TabGroupModule, 16 | CodeModule, 17 | TableModule, 18 | GridModule, 19 | FlowModule, 20 | MainFlowRoutingModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainFlowComponent] 24 | }) 25 | export class MainFlowModule {} 26 | -------------------------------------------------------------------------------- /src/app/democase/main-form/main-form-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {MainFormComponent} from './main-form.component'; 4 | import {NgModule} from '@angular/core'; 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainFormComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainFormRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-form/main-form.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .input-pattern p { 2 | width: 100%; } 3 | :host /deep/ .input-pattern p free-inputtext { 4 | width: 40%; 5 | display: block; } 6 | 7 | /*# sourceMappingURL=main-form.component.css.map */ 8 | -------------------------------------------------------------------------------- /src/app/democase/main-form/main-form.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .input-pattern p { 3 | width: 100%; 4 | 5 | free-inputtext { 6 | width: 40%; 7 | display: block; 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/app/democase/main-form/main-form.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-form', 6 | templateUrl: './main-form.component.html', 7 | styleUrls: ['./main-form.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainFormComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | value: string; 15 | pageTitle = 'Components-Inputtext'; 16 | constructor() { } 17 | 18 | ngOnInit() { 19 | } 20 | 21 | } 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-fullpage/main-fullpage-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainFullpageComponent} from './main-fullpage.component'; 4 | @NgModule({ 5 | imports: [RouterModule.forChild([ 6 | {path: '', component: MainFullpageComponent} 7 | ])], 8 | exports: [RouterModule] 9 | }) 10 | 11 | export class MainFullpageRoutingModule {} 12 | -------------------------------------------------------------------------------- /src/app/democase/main-fullpage/main-fullpage.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .fullpage, 2 | :host /deep/ .fullpage img { 3 | display: block; 4 | width: 100%; 5 | height: 100%; } 6 | 7 | /*# sourceMappingURL=main-fullpage.component.css.map */ 8 | -------------------------------------------------------------------------------- /src/app/democase/main-fullpage/main-fullpage.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .fullpage, 3 | .fullpage img{ 4 | display: block; 5 | width: 100%; 6 | height: 100%; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/app/democase/main-fullpage/main-fullpage.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'free-main-fullpage', 5 | templateUrl: './main-fullpage.component.html', 6 | styleUrls: ['./main-fullpage.component.css'] 7 | }) 8 | export class MainFullpageComponent implements OnInit { 9 | pageTitle = 'Components-Fullpage'; 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/democase/main-fullpage/review-fullpage-routing.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {ReviewFullpageComponent} from './review-fullpage.component'; 4 | @NgModule({ 5 | imports: [RouterModule.forChild([ 6 | {path: '', component: ReviewFullpageComponent} 7 | ])], 8 | exports: [RouterModule] 9 | }) 10 | 11 | export class ReviewFullpageRoutingModule {} 12 | -------------------------------------------------------------------------------- /src/app/democase/main-fullpage/review-fullpage.module.ts: -------------------------------------------------------------------------------- 1 | import {CommonModule} from '@angular/common'; 2 | import {NgModule} from '@angular/core'; 3 | import {ReviewFullpageRoutingModule} from './review-fullpage-routing'; 4 | import {ReviewFullpageComponent} from './review-fullpage.component'; 5 | import {FullpageModule} from '../../component/fullpage/fullpage.component'; 6 | 7 | @NgModule({ 8 | imports: [ 9 | CommonModule, 10 | FullpageModule, 11 | ReviewFullpageRoutingModule 12 | ], 13 | declarations: [ReviewFullpageComponent] 14 | }) 15 | 16 | export class ReviewFullpageModule {} 17 | -------------------------------------------------------------------------------- /src/app/democase/main-grid/main-grid-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainGridComponent} from './main-grid.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainGridComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainGridRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-grid/main-grid.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ table { 2 | line-height: 1rem; } 3 | 4 | /*# sourceMappingURL=main-grid.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-grid/main-grid.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | table { 3 | line-height: 1rem; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-grid/main-grid.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-grid', 6 | templateUrl: './main-grid.component.html', 7 | styleUrls: ['./main-grid.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainGridComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') state; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'UI Element-Grid'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-grid/main-grid.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {GridModule} from '../../component/grid/grid.directive'; 4 | import {TableModule} from '../../component/table/table.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {CodeModule} from '../../component/code/code.component'; 7 | import {MainGridRoutingModule} from './main-grid-routing.module'; 8 | import {MainGridComponent} from './main-grid.component'; 9 | import {LanguageModule} from '../common/language'; 10 | 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | MainGridRoutingModule, 15 | GridModule, 16 | TableModule, 17 | TabGroupModule, 18 | CodeModule, 19 | LanguageModule 20 | ], 21 | declarations: [MainGridComponent] 22 | }) 23 | 24 | export class MainGridModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-icon/main-icon-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainIconComponent} from './main-icon.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainIconComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainIconRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-icon/main-icon.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-icon { 2 | display: inline-flex; 3 | align-items: center; 4 | justify-content: center; 5 | border-radius: 50%; 6 | margin: 0 .5rem .5rem 0; } 7 | 8 | /*# sourceMappingURL=main-icon.component.css.map */ 9 | -------------------------------------------------------------------------------- /src/app/democase/main-icon/main-icon.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | 3 | free-icon { 4 | display: inline-flex; 5 | align-items: center; 6 | justify-content: center; 7 | border-radius: 50%; 8 | margin: 0 .5rem .5rem 0; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/app/democase/main-icon/main-icon.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-icon', 6 | templateUrl: './main-icon.component.html', 7 | styleUrls: ['./main-icon.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainIconComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Icon'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-icon/main-icon.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {TableModule} from '../../component/table/table.component'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {IconModule} from '../../component/icon/icon.component'; 7 | import {GridModule} from '../../component/grid/grid.directive'; 8 | import {MainIconRoutingModule} from './main-icon-routing.module'; 9 | import {MainIconComponent} from './main-icon.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | MainIconRoutingModule, 16 | TabGroupModule, 17 | CodeModule, 18 | TableModule, 19 | IconModule, 20 | GridModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainIconComponent] 24 | }) 25 | 26 | export class MainIconModule {} 27 | -------------------------------------------------------------------------------- /src/app/democase/main-image/main-image-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainImageComponent} from './main-image.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainImageComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainImageRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-image/main-image.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ img { 2 | width: 5rem; 3 | height: 5rem; 4 | margin: 0 .5rem .5rem 0; } 5 | :host /deep/ img.img-ellipse { 6 | width: 8rem; } 7 | 8 | /*# sourceMappingURL=main-image.component.css.map */ 9 | -------------------------------------------------------------------------------- /src/app/democase/main-image/main-image.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | img { 3 | width: 5rem; 4 | height: 5rem; 5 | margin: 0 .5rem .5rem 0; 6 | } 7 | img.img-ellipse { 8 | width: 8rem; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /src/app/democase/main-image/main-image.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-image', 6 | templateUrl: './main-image.component.html', 7 | styleUrls: ['./main-image.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainImageComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Image'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-image/main-image.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {TableModule} from '../../component/table/table.component'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {GridModule} from '../../component/grid/grid.directive'; 7 | import {MainImageRoutingModule} from './main-image-routing.module'; 8 | import {MainImageComponent} from './main-image.component'; 9 | import {LanguageModule} from '../common/language'; 10 | 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | MainImageRoutingModule, 15 | TabGroupModule, 16 | CodeModule, 17 | TableModule, 18 | GridModule, 19 | LanguageModule 20 | ], 21 | declarations: [MainImageComponent] 22 | }) 23 | 24 | export class MainImageModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-knob/main-knob-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainKnobComponent} from './main-knob.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainKnobComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainKnobRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-knob/main-knob.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-knob.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-knob/main-knob.component.scss: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /src/app/democase/main-knob/main-knob.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-knob', 6 | templateUrl: './main-knob.component.html', 7 | styleUrls: ['./main-knob.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainKnobComponent implements OnInit { 11 | @HostBinding('@fadeInUpState') fadeInUpState; 12 | @HostBinding('style.display') display = 'block'; 13 | percent: number; 14 | pageTitle = 'Components-Knob'; 15 | constructor() { 16 | this.percent = 80; 17 | } 18 | 19 | ngOnInit() { 20 | } 21 | 22 | } 23 | 24 | -------------------------------------------------------------------------------- /src/app/democase/main-list/main-list-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainListComponent} from './main-list.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainListComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainListRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-list/main-list.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .free-box { 2 | flex: 1 0 auto; 3 | margin-bottom: .75rem; 4 | border-radius: 2px; 5 | box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12); } 6 | 7 | /*# sourceMappingURL=main-list.component.css.map */ 8 | -------------------------------------------------------------------------------- /src/app/democase/main-list/main-list.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .free-box { 3 | flex: 1 0 auto; 4 | margin-bottom: .75rem; 5 | border-radius: 2px; 6 | box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 2px 2px rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12); 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/app/democase/main-list/main-list.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-list', 6 | templateUrl: './main-list.component.html', 7 | styleUrls: ['./main-list.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainListComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | 15 | pageTitle = 'Components-List'; 16 | constructor() { 17 | } 18 | 19 | ngOnInit() { 20 | } 21 | 22 | } 23 | 24 | 25 | -------------------------------------------------------------------------------- /src/app/democase/main-loading/main-loading-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainLoadingComponent} from './main-loading.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainLoadingComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainLoadingRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-loading/main-loading.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-loading.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-loading/main-loading.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-loading/main-loading.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-loading/main-loading.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-loading', 6 | templateUrl: './main-loading.component.html', 7 | styleUrls: ['./main-loading.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainLoadingComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Loading'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-media/main-media-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainMediaComponent} from './main-media.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainMediaComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | 13 | export class MainMediaRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-media/main-media.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-media { 2 | margin: 20px 20px 0 0; } 3 | 4 | /*# sourceMappingURL=main-media.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-media/main-media.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-media { 3 | margin: 20px 20px 0 0; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-modal/main-modal-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainModalComponent} from './main-modal.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainModalComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainModalRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-modal/main-modal.component.css: -------------------------------------------------------------------------------- 1 | .modal-btn button { 2 | margin-bottom: 10px; } 3 | 4 | /*# sourceMappingURL=main-modal.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-modal/main-modal.component.scss: -------------------------------------------------------------------------------- 1 | 2 | .modal-btn button { 3 | margin-bottom: 10px; 4 | } 5 | -------------------------------------------------------------------------------- /src/app/democase/main-modal/main-modal.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-modal', 6 | templateUrl: './main-modal.component.html', 7 | styleUrls: ['./main-modal.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainModalComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Modal'; 15 | visible: boolean; 16 | blueVisible: boolean; 17 | confirmVisible: boolean; 18 | alertVisible: boolean; 19 | delayLoading: boolean; 20 | 21 | promptVisible: boolean; 22 | Loading: boolean; 23 | constructor() { } 24 | 25 | ngOnInit() { 26 | } 27 | 28 | open() { 29 | this.visible = !this.visible; 30 | } 31 | 32 | onChange(event) { 33 | console.log(event); 34 | } 35 | } 36 | 37 | 38 | -------------------------------------------------------------------------------- /src/app/democase/main-notification/main-notification-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainNotificationComponent} from './main-notification.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainNotificationComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainNotificationRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-notification/main-notification.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-notification.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-notification/main-notification.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-notification/main-notification.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-pagination/main-pagination-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainPaginationComponent} from './main-pagination.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainPaginationComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainPaginationRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-pagination/main-pagination.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-pagination.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-pagination/main-pagination.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-pagination/main-pagination.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-pagination/main-pagination.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-pagination', 6 | templateUrl: './main-pagination.component.html', 7 | styleUrls: ['./main-pagination.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainPaginationComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Pagination'; 15 | activeIndex1: number; 16 | activeIndex2: number; 17 | constructor() { 18 | this.activeIndex1 = 1; 19 | this.activeIndex2 = 1; 20 | } 21 | 22 | ngOnInit() { 23 | } 24 | onChange1(event: object) { 25 | this.activeIndex1 = event['activeIndex']; 26 | } 27 | onChange2(event: object) { 28 | this.activeIndex2 = event['activeIndex']; 29 | } 30 | 31 | } 32 | 33 | -------------------------------------------------------------------------------- /src/app/democase/main-panel/main-panel-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainPanelComponent} from './main-panel.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainPanelComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainPanelRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-panel/main-panel.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-tab free-panel { 2 | margin-bottom: 10px; } 3 | 4 | /*# sourceMappingURL=main-panel.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-panel/main-panel.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-tab { 3 | free-panel { 4 | margin-bottom: 10px; 5 | } 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /src/app/democase/main-panel/main-panel.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-panel', 6 | templateUrl: './main-panel.component.html', 7 | styleUrls: ['./main-panel.component.scss'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainPanelComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | -------------------------------------------------------------------------------- /src/app/democase/main-panel/main-panel.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {GridModule} from '../../component/grid/grid.directive'; 4 | import {TableModule} from '../../component/table/table.component'; 5 | import {CodeModule} from '../../component/code/code.component'; 6 | import {TabGroupModule} from '../../component/tab/tab.component'; 7 | import {MainPanelComponent} from './main-panel.component'; 8 | import {MainPanelRoutingModule} from './main-panel-routing.module'; 9 | import {PanelModule} from '../../component/panel/panel.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | TabGroupModule, 16 | CodeModule, 17 | TableModule, 18 | GridModule, 19 | PanelModule, 20 | MainPanelRoutingModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainPanelComponent] 24 | }) 25 | 26 | export class MainPanelModule {} 27 | -------------------------------------------------------------------------------- /src/app/democase/main-popover/main-popover-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainPopoverComponent} from './main-popover.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainPopoverComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainPopoverRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-popover/main-popover.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-popover.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-popover/main-popover.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-popover/main-popover.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-popover/main-popover.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-popover', 6 | templateUrl: './main-popover.component.html', 7 | styleUrls: ['./main-popover.component.scss'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainPopoverComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | -------------------------------------------------------------------------------- /src/app/democase/main-progress/main-progress-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainProgressComponent} from './main-progress.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainProgressComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainProgressRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-progress/main-progress.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-progress { 2 | margin-top: 15px; } 3 | 4 | /*# sourceMappingURL=main-progress.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-progress/main-progress.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-progress { 3 | margin-top: 15px; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-progress/main-progress.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-progress', 6 | templateUrl: './main-progress.component.html', 7 | styleUrls: ['./main-progress.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainProgressComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Progress'; 15 | percent: number; 16 | 17 | constructor() { 18 | this.percent = 20; 19 | } 20 | 21 | ngOnInit() { 22 | } 23 | 24 | onClick() { 25 | const interval = setInterval(() => { 26 | this.percent = this.percent + Math.floor(Math.random() * 20) + 1; 27 | if (this.percent >= 100) { 28 | this.percent = 100; 29 | clearInterval(interval); 30 | } 31 | }, 2000); 32 | } 33 | } 34 | 35 | -------------------------------------------------------------------------------- /src/app/democase/main-radio/main-radio-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainRadioComponent} from './main-radio.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainRadioComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainRadioRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-radio/main-radio.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-radio { 2 | margin: 0 .5rem .5rem 0; } 3 | 4 | /*# sourceMappingURL=main-radio.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-radio/main-radio.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-radio { 3 | margin: 0 .5rem .5rem 0; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-radio/main-radio.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding, OnDestroy} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-radio', 6 | templateUrl: './main-radio.component.html', 7 | styleUrls: ['./main-radio.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainRadioComponent implements OnInit, OnDestroy { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Radio'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | ngOnDestroy() { 21 | } 22 | 23 | } 24 | -------------------------------------------------------------------------------- /src/app/democase/main-radio/main-radio.module.ts: -------------------------------------------------------------------------------- 1 | import {CommonModule} from '@angular/common'; 2 | import {NgModule} from '@angular/core'; 3 | import {TableModule} from '../../component/table/table.component'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {RadioModule} from '../../component/radio/radio.component'; 7 | import {GridModule} from '../../component/grid/grid.directive'; 8 | import {MainRadioRoutingModule} from './main-radio-routing.module'; 9 | import {MainRadioComponent} from './main-radio.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | MainRadioRoutingModule, 16 | TabGroupModule, 17 | CodeModule, 18 | TableModule, 19 | RadioModule, 20 | GridModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainRadioComponent] 24 | }) 25 | 26 | export class MainRadioModule {} 27 | -------------------------------------------------------------------------------- /src/app/democase/main-range/main-range-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainRangeComponent} from './main-range.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainRangeComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainRangeRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-range/main-range.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .range-slider { 2 | margin: 10px 20px; } 3 | :host /deep/ .free-tab.active { 4 | padding-top: 2rem !important; } 5 | :host /deep/ free-range { 6 | display: inline-flex; 7 | margin: 40px 10px 10px 10px; } 8 | 9 | /*# sourceMappingURL=main-knob.component.cssmap */ 10 | -------------------------------------------------------------------------------- /src/app/democase/main-range/main-range.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .range-slider { 3 | margin: 10px 20px; 4 | } 5 | 6 | .free-tab.active { 7 | padding-top: 2rem !important; 8 | } 9 | 10 | free-range { 11 | display: inline-flex; 12 | margin: 40px 10px 10px 10px; 13 | } 14 | } 15 | 16 | -------------------------------------------------------------------------------- /src/app/democase/main-range/main-range.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-range', 6 | templateUrl: './main-range.component.html', 7 | styleUrls: ['./main-range.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainRangeComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Range'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-range/main-range.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {TableModule} from '../../component/table/table.component'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {RangeModule} from '../../component/range/range.component'; 7 | import {GridModule} from '../../component/grid/grid.directive'; 8 | import {MainRangeRoutingModule} from './main-range-routing.module'; 9 | import {MainRangeComponent} from './main-range.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | MainRangeRoutingModule, 16 | TabGroupModule, 17 | CodeModule, 18 | TableModule, 19 | RangeModule, 20 | GridModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainRangeComponent] 24 | }) 25 | 26 | export class MainRangeModule {} 27 | -------------------------------------------------------------------------------- /src/app/democase/main-rating/main-rating-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainRatingComponent} from './main-rating.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainRatingComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainRatingRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-rating/main-rating.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-rating.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-rating/main-rating.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-rating/main-rating.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-rating/main-rating.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-rating', 6 | templateUrl: './main-rating.component.html', 7 | styleUrls: ['./main-rating.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainRatingComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Rating'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | ratingChange(value: number) { 21 | alert(value); 22 | } 23 | } 24 | 25 | -------------------------------------------------------------------------------- /src/app/democase/main-ripple/main-ripple-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {RouterModule} from '@angular/router'; 3 | import {MainRippleComponent} from './main-ripple.component'; 4 | @NgModule({ 5 | imports: [ 6 | RouterModule.forChild([ 7 | {path: '', component: MainRippleComponent} 8 | ]) 9 | ], 10 | exports: [RouterModule] 11 | }) 12 | export class MainRippleRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-ripple/main-ripple.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .ripple-image { 2 | margin-right: 1rem; } 3 | :host /deep/ .ripple-image img { 4 | display: block; } 5 | 6 | /*# sourceMappingURL=main-ripple.component.css.map */ 7 | -------------------------------------------------------------------------------- /src/app/democase/main-ripple/main-ripple.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .ripple-image { 3 | margin-right: 1rem; 4 | 5 | img { 6 | display: block; 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/app/democase/main-ripple/main-ripple.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-ripple', 6 | templateUrl: './main-ripple.component.html', 7 | styleUrls: ['./main-ripple.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainRippleComponent implements OnInit { 11 | @HostBinding('@fadeInUpState') fadeInUpState; 12 | @HostBinding('style.display') display = 'block'; 13 | pageTitle = 'UI Element-Ripple'; 14 | constructor() { } 15 | 16 | ngOnInit() { 17 | } 18 | 19 | } 20 | -------------------------------------------------------------------------------- /src/app/democase/main-ripple/main-ripple.module.ts: -------------------------------------------------------------------------------- 1 | import {CommonModule} from '@angular/common'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainRippleRoutingModule} from './main-ripple-routing.module'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TabGroupModule} from '../../component/tab/tab.component'; 6 | import {GridModule} from '../../component/grid/grid.directive'; 7 | import {MainRippleComponent} from './main-ripple.component'; 8 | import {RippleModule} from '../../component/ripple/ripple.directive'; 9 | import {LanguageModule} from '../common/language'; 10 | 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | MainRippleRoutingModule, 15 | TabGroupModule, 16 | CodeModule, 17 | GridModule, 18 | RippleModule, 19 | LanguageModule 20 | ], 21 | declarations: [MainRippleComponent] 22 | }) 23 | export class MainRippleModule {} 24 | -------------------------------------------------------------------------------- /src/app/democase/main-scroll/main-scroll-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainScrollComponent} from './main-scroll.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainScrollComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainScrollRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-scroll/main-scroll.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-scroll { 2 | display: block; 3 | border: 1px solid #d9d9d9; 4 | padding: 10px; } 5 | :host /deep/ .free-scroll-inner { 6 | padding: 10px; } 7 | :host /deep/ .custom-scroll-thumb { 8 | background: #d0b9a0 !important; 9 | box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); } 10 | :host /deep/ .custom-scroll-track { 11 | width: 2px !important; 12 | left: 50% !important; 13 | transform: translate(-50%, 0); } 14 | 15 | /*# sourceMappingURL=main-scroll.component.css.map */ 16 | -------------------------------------------------------------------------------- /src/app/democase/main-scroll/main-scroll.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-scroll { 3 | display: block; 4 | border: 1px solid #d9d9d9; 5 | padding: 10px; 6 | } 7 | 8 | .free-scroll-inner { 9 | padding: 10px; 10 | } 11 | 12 | .custom-scroll-thumb { 13 | background: #d0b9a0 !important; 14 | box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); 15 | } 16 | 17 | .custom-scroll-track { 18 | width: 2px !important; 19 | left: 50% !important; 20 | transform: translate(-50%, 0); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/app/democase/main-scroll/main-scroll.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-scroll', 6 | templateUrl: './main-scroll.component.html', 7 | styleUrls: ['./main-scroll.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainScrollComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Scroll'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-select/main-select-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainSelectComponent} from './main-select.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainSelectComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainSelectRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-select/main-select.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-select.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-select/main-select.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-select/main-select.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-shadow/main-shadow-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainShadowComponent} from './main-shadow.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainShadowComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainShadowRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-shadow/main-shadow.component.css: -------------------------------------------------------------------------------- 1 | .box-shadow { 2 | width: 100px; 3 | height: 100px; 4 | margin: 24px 12px 12px 24px; 5 | display: -ms-inline-flexbox; 6 | display: inline-flex; 7 | -ms-flex-pack: center; 8 | justify-content: center; 9 | -ms-flex-align: center; 10 | align-items: center; 11 | border: 1px solid #eee; } 12 | 13 | /*# sourceMappingURL=main-shadow.component.css.map */ 14 | -------------------------------------------------------------------------------- /src/app/democase/main-shadow/main-shadow.component.scss: -------------------------------------------------------------------------------- 1 | 2 | .box-shadow { 3 | width: 100px; 4 | height: 100px; 5 | margin: 24px 12px 12px 24px; 6 | display: -ms-inline-flexbox; 7 | display: inline-flex; 8 | -ms-flex-pack: center; 9 | justify-content: center; 10 | -ms-flex-align: center; 11 | align-items: center; 12 | border: 1px solid #eee; 13 | } 14 | -------------------------------------------------------------------------------- /src/app/democase/main-shadow/main-shadow.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-shadow', 6 | templateUrl: './main-shadow.component.html', 7 | styleUrls: ['./main-shadow.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainShadowComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'UI Element-Shadow'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/app/democase/main-shadow/main-shadow.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {GridModule} from '../../component/grid/grid.directive'; 4 | import {MainShadowRoutingModule} from './main-shadow-routing.module'; 5 | import {MainShadowComponent} from './main-shadow.component'; 6 | import {TableModule} from '../../component/table/table.component'; 7 | import {CodeModule} from '../../component/code/code.component'; 8 | import {TabGroupModule} from '../../component/tab/tab.component'; 9 | import {LanguageModule} from '../common/language'; 10 | 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | MainShadowRoutingModule, 15 | TabGroupModule, 16 | CodeModule, 17 | TableModule, 18 | GridModule, 19 | LanguageModule 20 | ], 21 | declarations: [MainShadowComponent] 22 | }) 23 | 24 | export class MainShadowModule {} 25 | -------------------------------------------------------------------------------- /src/app/democase/main-share-button/main-share-button-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainShareButtonComponent} from './main-share-button.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainShareButtonComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainShareButtonRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-share-button/main-share-button.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-share-button.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-share-button/main-share-button.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-share-button/main-share-button.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-share-button/main-share-button.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-share-button', 6 | templateUrl: './main-share-button.component.html', 7 | styleUrls: ['./main-share-button.component.scss'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainShareButtonComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | 15 | shareData: any; 16 | constructor() { 17 | this.shareData = { 18 | title: 'FreeNG: UI Components for Angular4', 19 | description: 'FreeNG - 一键分享到微博，QQ空间，腾讯微博，人人，豆瓣，facebook，twitter，google，linkedIn', 20 | image: 'http://oumfrpm5j.bkt.clouddn.com/freeng_logo.png' 21 | } 22 | } 23 | 24 | ngOnInit() { 25 | } 26 | 27 | } 28 | -------------------------------------------------------------------------------- /src/app/democase/main-shrink/main-shrink-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainShrinkComponent} from './main-shrink.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainShrinkComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainShrinkRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-shrink/main-shrink.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .rb { 2 | position: absolute; 3 | right: 10px; 4 | bottom: 10px; } 5 | :host /deep/ .tr { 6 | position: absolute; 7 | right: 10px; 8 | top: 10px; } 9 | :host /deep/ .lb { 10 | position: absolute; 11 | left: 10px; 12 | bottom: 10px; } 13 | :host /deep/ .ctr { 14 | position: absolute; 15 | left: 230px; 16 | top: 180px; } 17 | :host /deep/ .clb { 18 | position: absolute; 19 | left: 230px; 20 | top: 85px; } 21 | :host /deep/ .crb { 22 | position: absolute; 23 | left: 330px; 24 | top: 130px; } 25 | :host /deep/ .clt { 26 | position: absolute; 27 | left: 140px; 28 | top: 130px; } 29 | 30 | /*# sourceMappingURL=main-shrink.component.css.map */ 31 | -------------------------------------------------------------------------------- /src/app/democase/main-shrink/main-shrink.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .rb { 3 | position: absolute; 4 | right: 10px; 5 | bottom: 10px; 6 | } 7 | 8 | .tr { 9 | position: absolute; 10 | right: 10px; 11 | top: 10px; 12 | } 13 | 14 | .lb { 15 | position: absolute; 16 | left: 10px; 17 | bottom: 10px; 18 | } 19 | 20 | .ctr { 21 | position: absolute; 22 | left: 230px; 23 | top: 180px; 24 | } 25 | 26 | .clb { 27 | position: absolute; 28 | left: 230px; 29 | top: 85px; 30 | } 31 | 32 | .crb { 33 | position: absolute; 34 | left: 330px; 35 | top: 130px; 36 | } 37 | 38 | .clt { 39 | position: absolute; 40 | left: 140px; 41 | top: 130px; 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /src/app/democase/main-shrink/main-shrink.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-shrink', 6 | templateUrl: './main-shrink.component.html', 7 | styleUrls: ['./main-shrink.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainShrinkComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Shrink'; 15 | menus: any; 16 | constructor() { 17 | this.menus = [ 18 | { 'icon': 'weibo'}, 19 | { 'icon': 'weixin'}, 20 | { 'icon': 'qq'}, 21 | { 'icon': 'renren'} 22 | ]; 23 | } 24 | 25 | ngOnInit() { 26 | } 27 | 28 | } 29 | 30 | -------------------------------------------------------------------------------- /src/app/democase/main-sidenav/main-sidenav-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {NgModule} from '@angular/core'; 3 | import {RouterModule} from '@angular/router'; 4 | import {MainSidenavComponent} from './main-sidenav.component'; 5 | @NgModule({ 6 | imports: [ 7 | RouterModule.forChild([ 8 | {path: '', component: MainSidenavComponent} 9 | ]) 10 | ], 11 | exports: [RouterModule] 12 | }) 13 | export class MainSidenavRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-sidenav/main-sidenav.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .simulation-browser { 2 | width: 100%; 3 | height: 400px; 4 | overflow: hidden; 5 | position: relative; 6 | background: #eee; 7 | margin: 10px; 8 | border: 1px solid #d9d9d9; 9 | transform: translate(0, 0); } 10 | :host /deep/ .free-four .simulation-browser { 11 | width: 45%; } 12 | 13 | /*# sourceMappingURL=main-sidenav.component.css.map */ 14 | -------------------------------------------------------------------------------- /src/app/democase/main-sidenav/main-sidenav.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .simulation-browser { 3 | width: 100%; 4 | height: 400px; 5 | overflow: hidden; 6 | position: relative; 7 | background: #eee; 8 | margin: 10px; 9 | border: 1px solid #d9d9d9; 10 | transform: translate(0, 0); 11 | } 12 | 13 | .free-four .simulation-browser { 14 | width: 45%; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/app/democase/main-sidenav/main-sidenav.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-sidenav', 6 | templateUrl: './main-sidenav.component.html', 7 | styleUrls: ['./main-sidenav.component.scss'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainSidenavComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | leftSidenav: boolean; 15 | rightSidenav: boolean; 16 | topSidenav: boolean; 17 | bottomSidenav: boolean; 18 | contentVisible: boolean; 19 | contentRightVisible: boolean; 20 | contentTopVisible: boolean; 21 | contentBottomVisible: boolean; 22 | overlay: boolean; 23 | constructor() { } 24 | 25 | ngOnInit() { 26 | } 27 | 28 | } 29 | -------------------------------------------------------------------------------- /src/app/democase/main-slide/main-slide-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainSlideComponent} from './main-slide.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainSlideComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainSlideRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-slide/main-slide.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-slide.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-slide/main-slide.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | 3 | } 4 | -------------------------------------------------------------------------------- /src/app/democase/main-slide/main-slide.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-slide', 6 | templateUrl: './main-slide.component.html', 7 | styleUrls: ['./main-slide.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainSlideComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Slide'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-slide/main-slide.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {TabGroupModule} from '../../component/tab/tab.component'; 4 | import {CodeModule} from '../../component/code/code.component'; 5 | import {TableModule} from '../../component/table/table.component'; 6 | import {SlideModule} from '../../component/slides/slides.component'; 7 | import {GridModule} from '../../component/grid/grid.directive'; 8 | import {MainSlideRoutingModule} from './main-slide-routing.module'; 9 | import {MainSlideComponent} from './main-slide.component'; 10 | import {LanguageModule} from '../common/language'; 11 | 12 | @NgModule({ 13 | imports: [ 14 | CommonModule, 15 | MainSlideRoutingModule, 16 | TabGroupModule, 17 | CodeModule, 18 | TableModule, 19 | SlideModule, 20 | GridModule, 21 | LanguageModule 22 | ], 23 | declarations: [MainSlideComponent] 24 | }) 25 | 26 | export class MainSlideModule {} 27 | -------------------------------------------------------------------------------- /src/app/democase/main-spinner/main-spinner-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainSpinnerComponent} from './main-spinner.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainSpinnerComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainSpinnerRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-spinner/main-spinner.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-spinner.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-spinner/main-spinner.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-spinner/main-spinner.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-spinner/main-spinner.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-spinner', 6 | templateUrl: './main-spinner.component.html', 7 | styleUrls: ['./main-spinner.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainSpinnerComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Spinner'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-start/main-start-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainStartComponent} from './main-start.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainStartComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainStartRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-start/main-start.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-start.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-start/main-start.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-start/main-start.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-start/main-start.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {PanelModule} from '../../component/panel/panel.component'; 4 | import {GridModule} from '../../component/grid/grid.directive'; 5 | import {CodeModule} from '../../component/code/code.component'; 6 | import {TreeModule} from '../../component/tree/tree.component'; 7 | import {MainStartRoutingModule} from './main-start-routing.module'; 8 | import {MainStartComponent} from './main-start.component'; 9 | import {LanguageModule} from '../common/language'; 10 | 11 | @NgModule({ 12 | imports: [ 13 | CommonModule, 14 | MainStartRoutingModule, 15 | PanelModule, 16 | GridModule, 17 | CodeModule, 18 | TreeModule, 19 | LanguageModule 20 | ], 21 | declarations: [MainStartComponent] 22 | }) 23 | 24 | export class MainStartModule { 25 | } 26 | -------------------------------------------------------------------------------- /src/app/democase/main-steps/main-steps-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainStepsComponent} from './main-steps.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainStepsComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainStepsRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-steps/main-steps.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-steps.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-steps/main-steps.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-steps/main-steps.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-switch/main-switch-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainSwitchComponent} from './main-switch.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainSwitchComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainSwitchRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-switch/main-switch.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-switch.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-switch/main-switch.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-switch/main-switch.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-switch/main-switch.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-switch', 6 | templateUrl: './main-switch.component.html', 7 | styleUrls: ['./main-switch.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainSwitchComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | checked: boolean; 15 | pageTitle = 'Components-Switch'; 16 | constructor() { } 17 | 18 | ngOnInit() { 19 | } 20 | 21 | onChange(event: any) { 22 | alert('是否选中：' + event.checked); 23 | } 24 | 25 | } 26 | 27 | -------------------------------------------------------------------------------- /src/app/democase/main-tab/main-tab-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {MainTabComponent} from './main-tab.component'; 6 | import {NgModule} from '@angular/core'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainTabComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainTabRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-tab/main-tab.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-tab.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-tab/main-tab.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-tab/main-tab.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-tab/main-tab.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {CodeModule} from '../../component/code/code.component'; 4 | import {TabGroupModule} from '../../component/tab/tab.component'; 5 | import {TableModule} from '../../component/table/table.component'; 6 | import {GridModule} from '../../component/grid/grid.directive'; 7 | import {MainTabRoutingModule} from './main-tab-routing.module'; 8 | import {MainTabComponent} from './main-tab.component'; 9 | import {LanguageModule} from '../common/language'; 10 | @NgModule({ 11 | imports: [ 12 | CommonModule, 13 | MainTabRoutingModule, 14 | TabGroupModule, 15 | CodeModule, 16 | TableModule, 17 | GridModule, 18 | LanguageModule 19 | ], 20 | declarations: [MainTabComponent] 21 | }) 22 | 23 | export class MainTabModule {} 24 | -------------------------------------------------------------------------------- /src/app/democase/main-table/main-table-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainTableComponent} from './main-table.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainTableComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainTableRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-table/main-table.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ free-table { 2 | flex: 1 0 auto; } 3 | 4 | /*# sourceMappingURL=main-table.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-table/main-table.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | free-table { 3 | flex: 1 0 auto; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /src/app/democase/main-table/main-table.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-table', 6 | templateUrl: './main-table.component.html', 7 | styleUrls: ['./main-table.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainTableComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | cells: any[] = []; 15 | pageTitle = 'Components-Table'; 16 | constructor() { 17 | } 18 | 19 | ngOnInit() { 20 | this.cells = [ 21 | { 22 | 'pro': 'theme', 23 | 'intro': '设置Table主题' 24 | }, 25 | { 26 | 'pro': 'theme', 27 | 'intro': '设置Table主题' 28 | }, 29 | { 30 | 'pro': 'theme', 31 | 'intro': '设置Table主题' 32 | } 33 | ]; 34 | } 35 | 36 | } 37 | 38 | 39 | -------------------------------------------------------------------------------- /src/app/democase/main-timeline/main-timeline-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {MainTimelineComponent} from './main-timeline.component'; 3 | import {NgModule} from '@angular/core'; 4 | @NgModule({ 5 | imports: [ 6 | RouterModule.forChild([ 7 | {path: '', component: MainTimelineComponent} 8 | ]) 9 | ], 10 | exports: [RouterModule] 11 | }) 12 | export class MainTimelineRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-timeline/main-timeline.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ .timeline-header { 2 | width: 30px; 3 | vertical-align: middle; 4 | border-radius: 50%; } 5 | 6 | /*# sourceMappingURL=main-timeline.component.css.map */ 7 | -------------------------------------------------------------------------------- /src/app/democase/main-timeline/main-timeline.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | .timeline-header { 3 | width: 30px; 4 | vertical-align: middle; 5 | border-radius: 50%; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /src/app/democase/main-toast/main-toast-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainToastComponent} from './main-toast.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainToastComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainToastRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-toast/main-toast.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-toast.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-toast/main-toast.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-toast/main-toast.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-tooltip/main-tooltip-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainTooltipComponent} from './main-tooltip.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainTooltipComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainTooltipRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-tooltip/main-tooltip.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-tooltip.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-tooltip/main-tooltip.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-tooltip/main-tooltip.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-tooltip/main-tooltip.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-tooltip', 6 | templateUrl: './main-tooltip.component.html', 7 | styleUrls: ['./main-tooltip.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainTooltipComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Directives-Tooltip'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | } 20 | 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-tour/main-tour-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainTourComponent} from './main-tour.component'; 4 | 5 | @NgModule({ 6 | imports: [RouterModule.forChild([ 7 | {path: '', component: MainTourComponent} 8 | ])], 9 | exports: [RouterModule] 10 | }) 11 | 12 | export class MainTourRoutingModule {} 13 | -------------------------------------------------------------------------------- /src/app/democase/main-tour/main-tour.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-tour.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-tour/main-tour.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-tour/main-tour.component.scss -------------------------------------------------------------------------------- /src/app/democase/main-tour/main-tour.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'free-main-tour', 5 | templateUrl: './main-tour.component.html', 6 | styleUrls: ['./main-tour.component.scss'] 7 | }) 8 | export class MainTourComponent implements OnInit { 9 | tourVisible: boolean; 10 | tourData: any; 11 | constructor() { 12 | } 13 | 14 | ngOnInit() { 15 | this.tourData = [ 16 | { 17 | label: 'This is a first step!' 18 | }, 19 | { 20 | label: 'This is a first step!' 21 | }, 22 | { 23 | label: 'This is a first step!' 24 | }, 25 | { 26 | label: 'This is a first step!' 27 | } 28 | ]; 29 | } 30 | 31 | } 32 | -------------------------------------------------------------------------------- /src/app/democase/main-tree/main-tree-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainTreeComponent} from './main-tree.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainTreeComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | export class MainTreeRoutingModule {} 14 | -------------------------------------------------------------------------------- /src/app/democase/main-tree/main-tree.component.css: -------------------------------------------------------------------------------- 1 | :host ::ng-deep .tree-template button { 2 | margin-bottom: 10px; } 3 | 4 | /*# sourceMappingURL=main-tree.component.css.map */ 5 | -------------------------------------------------------------------------------- /src/app/democase/main-tree/main-tree.component.scss: -------------------------------------------------------------------------------- 1 | :host ::ng-deep { 2 | .tree-template { 3 | button { 4 | margin-bottom: 10px; 5 | } 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /src/app/democase/main-tree/main-tree.service.ts: -------------------------------------------------------------------------------- 1 | import {Injectable} from '@angular/core'; 2 | import {HttpClient} from '@angular/common/http'; 3 | 4 | @Injectable() 5 | export class MainTreeService { 6 | constructor(private http: HttpClient) { 7 | } 8 | 9 | getFiles() { 10 | return this.http.get('assets/json/files.json'); 11 | } 12 | 13 | getLazyFiles() { 14 | return this.http.get('assets/json/lazyFiles.json'); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/app/democase/main-typography/main-typography-routing.module.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by ux168 on 17-7-1. 3 | */ 4 | import {RouterModule} from '@angular/router'; 5 | import {NgModule} from '@angular/core'; 6 | import {MainTypographyComponent} from './main-typography.component'; 7 | 8 | @NgModule({ 9 | imports: [RouterModule.forChild([ 10 | {path: '', component: MainTypographyComponent} 11 | ])], 12 | exports: [RouterModule] 13 | }) 14 | 15 | export class MainTypographyRoutingModule {} 16 | -------------------------------------------------------------------------------- /src/app/democase/main-typography/main-typography.component.css: -------------------------------------------------------------------------------- 1 | :host /deep/ h1, :host /deep/ h2, :host /deep/ h3, :host /deep/ h4, :host /deep/ h5, :host /deep/ h6, :host /deep/ p { 2 | width: 100%; 3 | flex: 1 0 auto; } 4 | :host /deep/ .blockquote-box { 5 | flex: 1 0 auto; } 6 | :host /deep/ .blockquote-box blockquote { 7 | margin-top: 10px; } 8 | 9 | /*# sourceMappingURL=main-typography.component.css.map */ 10 | -------------------------------------------------------------------------------- /src/app/democase/main-typography/main-typography.component.scss: -------------------------------------------------------------------------------- 1 | :host /deep/ { 2 | h1,h2,h3,h4,h5,h6,p { 3 | width: 100%; 4 | flex: 1 0 auto; 5 | } 6 | 7 | .blockquote-box { 8 | flex: 1 0 auto; 9 | 10 | blockquote { 11 | margin-top: 10px; 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /src/app/democase/main-typography/main-typography.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-typography', 6 | templateUrl: './main-typography.component.html', 7 | styleUrls: ['./main-typography.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainTypographyComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'UI Element-Typography'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-typography/main-typography.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {CodeModule} from '../../component/code/code.component'; 4 | import {TabGroupModule} from '../../component/tab/tab.component'; 5 | import {GridModule} from '../../component/grid/grid.directive'; 6 | import {MainTypographyRoutingModule} from './main-typography-routing.module'; 7 | import {MainTypographyComponent} from './main-typography.component'; 8 | import {LanguageModule} from '../common/language'; 9 | 10 | @NgModule({ 11 | imports: [ 12 | CommonModule, 13 | MainTypographyRoutingModule, 14 | TabGroupModule, 15 | CodeModule, 16 | GridModule, 17 | LanguageModule 18 | ], 19 | declarations: [MainTypographyComponent] 20 | }) 21 | 22 | export class MainTypographyModule {} 23 | -------------------------------------------------------------------------------- /src/app/democase/main-upload/main-upload-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainUploadComponent} from './main-upload.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainUploadComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | 14 | export class MainUploadRoutingModule {} 15 | -------------------------------------------------------------------------------- /src/app/democase/main-upload/main-upload.component.css: -------------------------------------------------------------------------------- 1 | .upload-custom-btn { 2 | width: 200px; 3 | height: 80px; 4 | display: inline-flex; 5 | align-items: center; 6 | justify-content: center; 7 | font-size: 30px; 8 | font-weight: normal; 9 | border: 1px solid #d9d9d9; 10 | background: #eee; } 11 | .upload-custom-btn i { 12 | opacity: .6; } 13 | 14 | /*# sourceMappingURL=main-upload.component.css.map */ 15 | -------------------------------------------------------------------------------- /src/app/democase/main-upload/main-upload.component.scss: -------------------------------------------------------------------------------- 1 | .upload-custom-btn { 2 | width: 200px; 3 | height: 80px; 4 | display: inline-flex; 5 | align-items: center; 6 | justify-content: center; 7 | font-size: 30px; 8 | font-weight: normal; 9 | border: 1px solid #d9d9d9; 10 | background: #eee; 11 | 12 | i { 13 | opacity: .6; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /src/app/democase/main-upload/main-upload.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, HostBinding, OnInit} from '@angular/core'; 2 | import {fadeInUp} from '../common/animations'; 3 | 4 | @Component({ 5 | selector: 'free-main-upload', 6 | templateUrl: './main-upload.component.html', 7 | styleUrls: ['./main-upload.component.css'], 8 | animations: [fadeInUp] 9 | }) 10 | export class MainUploadComponent implements OnInit { 11 | 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | pageTitle = 'Components-Upload'; 15 | constructor() { } 16 | 17 | ngOnInit() { 18 | } 19 | 20 | } 21 | 22 | -------------------------------------------------------------------------------- /src/app/democase/main-validation/main-validation-routing.module.ts: -------------------------------------------------------------------------------- 1 | 2 | import {RouterModule} from '@angular/router'; 3 | import {NgModule} from '@angular/core'; 4 | import {MainValidationComponent} from './main-validation.component'; 5 | 6 | @NgModule({ 7 | imports: [RouterModule.forChild([ 8 | {path: '', component: MainValidationComponent} 9 | ])], 10 | exports: [RouterModule] 11 | }) 12 | 13 | 14 | export class MainValidationRoutingModule {} 15 | -------------------------------------------------------------------------------- /src/app/democase/main-validation/main-validation.component.css: -------------------------------------------------------------------------------- 1 | 2 | 3 | /*# sourceMappingURL=main-validation.component.css.map */ 4 | -------------------------------------------------------------------------------- /src/app/democase/main-validation/main-validation.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/app/democase/main-validation/main-validation.component.scss -------------------------------------------------------------------------------- /src/app/democase/main/main-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {RouterModule} from '@angular/router'; 2 | import {NgModule} from '@angular/core'; 3 | import {MainComponent} from './main.component'; 4 | 5 | @NgModule({ 6 | imports: [ 7 | RouterModule.forChild([ 8 | { path: '', component: MainComponent } 9 | ]) 10 | ], 11 | exports: [RouterModule] 12 | }) 13 | 14 | export class MainRoutingModule { 15 | } 16 | -------------------------------------------------------------------------------- /src/app/democase/main/main.component.css: -------------------------------------------------------------------------------- 1 | .main-container free-accordion-group { 2 | margin-bottom: .75rem; } 3 | 4 | .main-container free-panel, 5 | .main-container free-tab-group { 6 | margin-bottom: .75rem; } 7 | 8 | .donate { 9 | display: flex; } 10 | .donate div { 11 | width: 50%; } 12 | .donate div img { 13 | width: 97%; 14 | margin-right: 3%; } 15 | 16 | :host /deep/ ul li ul { 17 | margin-left: 1rem; } 18 | :host /deep/ .main-point { 19 | padding: 0 10px 0 30px; } 20 | :host /deep/ .main-container .accordion-content .accordion-inner { 21 | padding: .5rem !important; } 22 | :host /deep/ .free-panel-header { 23 | font-weight: bold; } 24 | 25 | /*# sourceMappingURL=main.component.css.map */ 26 | -------------------------------------------------------------------------------- /src/app/democase/main/main.component.scss: -------------------------------------------------------------------------------- 1 | @import '../../../assets/sass/mixin'; 2 | .main-container free-accordion-group{ 3 | margin-bottom: .75rem; 4 | } 5 | 6 | .main-container free-panel, 7 | .main-container free-tab-group { 8 | margin-bottom: .75rem; 9 | } 10 | 11 | .donate { 12 | display: flex; 13 | 14 | div { 15 | width: 50%; 16 | img { 17 | width: 97%; 18 | margin-right: 3%; 19 | } 20 | } 21 | } 22 | 23 | :host /deep/ { 24 | ul li ul { 25 | margin-left: 1rem; 26 | } 27 | 28 | .main-point { 29 | padding: 0 10px 0 30px; 30 | } 31 | 32 | .main-container .accordion-content .accordion-inner { 33 | padding: .5rem !important; 34 | } 35 | 36 | .free-panel-header { 37 | font-weight: bold; 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/app/democase/main/main.component.ts: -------------------------------------------------------------------------------- 1 | import {Component, OnInit, HostBinding} from '@angular/core'; 2 | import { fadeInUp } from '../common/animations'; 3 | import {config} from '../common/config'; 4 | 5 | @Component({ 6 | selector: 'free-main', 7 | templateUrl: './main.component.html', 8 | styleUrls: ['./main.component.css'], 9 | animations: [fadeInUp] 10 | }) 11 | export class MainComponent { 12 | @HostBinding('@fadeInUpState') fadeInUpState; 13 | @HostBinding('style.display') display = 'block'; 14 | version: string; 15 | pageTitle = 'HomePage'; 16 | constructor() { 17 | this.version = config.version; 18 | } 19 | } 20 | 21 | -------------------------------------------------------------------------------- /src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/.gitkeep -------------------------------------------------------------------------------- /src/assets/di.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/di.ico -------------------------------------------------------------------------------- /src/assets/images/angular.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 10 | 11 | 12 | 13 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /src/assets/images/arrow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/arrow.png -------------------------------------------------------------------------------- /src/assets/images/browser/chrome-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/browser/chrome-logo.png -------------------------------------------------------------------------------- /src/assets/images/browser/firefox-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/browser/firefox-logo.png -------------------------------------------------------------------------------- /src/assets/images/browser/internet-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/browser/internet-logo.png -------------------------------------------------------------------------------- /src/assets/images/browser/opera-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/browser/opera-logo.png -------------------------------------------------------------------------------- /src/assets/images/browser/safari-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/browser/safari-logo.png -------------------------------------------------------------------------------- /src/assets/images/di.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/di.ico -------------------------------------------------------------------------------- /src/assets/images/emotion/1f601.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f603.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f604.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f605.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f609.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f60a.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f610.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f613.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f614.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f61b.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f61c.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f626.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f627.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f628.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f62e.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f62f.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f630.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f632.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f633.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f635.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/emotion/1f636.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/images/f1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/f1.jpg -------------------------------------------------------------------------------- /src/assets/images/f2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/f2.jpg -------------------------------------------------------------------------------- /src/assets/images/f3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/f3.jpg -------------------------------------------------------------------------------- /src/assets/images/f4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/f4.jpg -------------------------------------------------------------------------------- /src/assets/images/fontawesome.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/fontawesome.png -------------------------------------------------------------------------------- /src/assets/images/landscape1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape1.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape10.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape11.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape16.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape16.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape17.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape17.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape18.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape18.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape2.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape3.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape7.jpg -------------------------------------------------------------------------------- /src/assets/images/landscape8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/landscape8.jpg -------------------------------------------------------------------------------- /src/assets/images/menu-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/menu-bg.png -------------------------------------------------------------------------------- /src/assets/images/picture.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/picture.jpg -------------------------------------------------------------------------------- /src/assets/images/t_me.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/t_me.png -------------------------------------------------------------------------------- /src/assets/images/user.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/images/user.jpg -------------------------------------------------------------------------------- /src/assets/media/alert.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/assets/media/alert.mp3 -------------------------------------------------------------------------------- /src/assets/sass/variables.scss: -------------------------------------------------------------------------------- 1 | $theme-blue: #3949ab; 2 | $theme-green: #138265; 3 | $theme-default: #222222; 4 | $default: #115d8e; 5 | $defaultFontColor: #115d8e; 6 | 7 | $leftMenuWidth: 12.5rem; 8 | $leftMenuWidthOfMini: 2.5rem; 9 | $topMenuHeight: 3rem; 10 | 11 | $theme: ( 12 | primary: #177bbb, 13 | info: #1ccacc, 14 | success: #1aae88, 15 | warning: #fbb23e, 16 | danger: #e33244); 17 | 18 | $color: ( 19 | green: #46be8a, 20 | deepblue: #115d8e, 21 | blue: #1976d2, 22 | lightblue: #169e9f, 23 | yellow: #fa9e0c, 24 | red: #f96868, 25 | purple: #6633B9, 26 | orange: #f2a654, 27 | brown: #8d6658, 28 | cyan: #57c7d4, 29 | pink: #f96197, 30 | teal: #3aa99e, 31 | dark: #393D49); 32 | -------------------------------------------------------------------------------- /src/assets/themes/blue.scss: -------------------------------------------------------------------------------- 1 | $color: #1976d2; 2 | 3 | @import 'reset'; 4 | -------------------------------------------------------------------------------- /src/assets/themes/brown.scss: -------------------------------------------------------------------------------- 1 | $color: #8d6658; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/cyan.scss: -------------------------------------------------------------------------------- 1 | $color: #57c7d4; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/dark.scss: -------------------------------------------------------------------------------- 1 | $color: #393D49; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/deepblue.scss: -------------------------------------------------------------------------------- 1 | $color: #115d8e; 2 | 3 | @import 'reset'; 4 | -------------------------------------------------------------------------------- /src/assets/themes/green.scss: -------------------------------------------------------------------------------- 1 | $color: #46be8a; 2 | 3 | @import 'reset'; 4 | -------------------------------------------------------------------------------- /src/assets/themes/lightblue.scss: -------------------------------------------------------------------------------- 1 | $color: #169e9f; 2 | 3 | @import 'reset'; 4 | -------------------------------------------------------------------------------- /src/assets/themes/orange.scss: -------------------------------------------------------------------------------- 1 | $color: #f2a654; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/pink.scss: -------------------------------------------------------------------------------- 1 | $color: #f96197; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/purple.scss: -------------------------------------------------------------------------------- 1 | $color: #6633B9; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/red.scss: -------------------------------------------------------------------------------- 1 | $color: #f96868; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/teal.scss: -------------------------------------------------------------------------------- 1 | $color: #3aa99e; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/assets/themes/yellow.scss: -------------------------------------------------------------------------------- 1 | $color: #f2a654; 2 | 3 | @import "reset"; 4 | -------------------------------------------------------------------------------- /src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | 2 | export const environment = { 3 | production: false 4 | }; 5 | -------------------------------------------------------------------------------- /src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronPans/freeng/c62dc640afbda14e37313ae6a2ecdb04e3f92e08/src/favicon.ico -------------------------------------------------------------------------------- /src/main.ts: -------------------------------------------------------------------------------- 1 | 2 | import { enableProdMode } from '@angular/core'; 3 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 4 | 5 | import { AppModule } from './app/app.module'; 6 | import { environment } from './environments/environment'; 7 | 8 | if (environment.production) { 9 | enableProdMode(); 10 | } 11 | 12 | platformBrowserDynamic().bootstrapModule(AppModule); 13 | -------------------------------------------------------------------------------- /src/styles.css: -------------------------------------------------------------------------------- 1 | @import "./assets/css/reset.css"; 2 | @import "~font-awesome/css/font-awesome.min.css"; 3 | @import "~highlight.js/styles/monokai-sublime.css"; 4 | @import './assets/css/freeng.css'; 5 | @import './assets/css/symbol.css'; 6 | -------------------------------------------------------------------------------- /src/tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/app", 5 | "module": "es2015", 6 | "baseUrl": "", 7 | "types": [] 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/typings.d.ts: -------------------------------------------------------------------------------- 1 | declare var module: NodeModule; 2 | interface NodeModule { 3 | id: string; 4 | } 5 | -------------------------------------------------------------------------------- /src/vendor.ts: -------------------------------------------------------------------------------- 1 | // Angular 2 | import '@angular/platform-browser'; 3 | import '@angular/platform-browser-dynamic'; 4 | import '@angular/core'; 5 | import '@angular/common'; 6 | import '@angular/http'; 7 | import '@angular/router'; 8 | import '@angular/forms'; 9 | import '@angular/animations'; 10 | 11 | // RxJS 12 | import 'rxjs'; 13 | -------------------------------------------------------------------------------- /tsconfig-aot.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "outDir": "./component", 4 | "target": "es5", 5 | "module": "es2015", 6 | "baseUrl": "src", 7 | "moduleResolution": "node", 8 | "sourceMap": true, 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "removeComments": false, 12 | "noImplicitAny": false, 13 | "suppressImplicitAnyIndexErrors": true, 14 | "lib": ["dom","es6"] 15 | }, 16 | "include": [ 17 | "src/app/component/**/*" 18 | ], 19 | "angularCompilerOptions": { 20 | "genDir": "aot", 21 | "skipMetadataEmit" : false 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /tsconfig-es2015.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "outDir": "./component", 5 | "baseUrl": "src", 6 | "rootDir": "src/app/component", 7 | "sourceMap": true, 8 | "declaration": true, 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "target": "es5", 13 | "typeRoots": [ 14 | "node_modules/@types" 15 | ], 16 | "lib": [ 17 | "es2016", 18 | "dom" 19 | ] 20 | }, 21 | "include": [ 22 | "src/app/component/**/*" 23 | ] 24 | } 25 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "outDir": "./dist/", 5 | "baseUrl": "src", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "moduleResolution": "node", 9 | "emitDecoratorMetadata": true, 10 | "experimentalDecorators": true, 11 | "target": "es5", 12 | "typeRoots": [ 13 | "node_modules/@types" 14 | ], 15 | "lib": [ 16 | "es2016", 17 | "dom" 18 | ] 19 | } 20 | } 21 | --------------------------------------------------------------------------------