perf(UI组件模块): 调整Dialog模块由共享模块到UI组件模块

src/app/shared/dialog/README.md → src/app/simple/dialog/README.md

@@ -1,53 +1,51 @@
-# Dialog
-
-## Services
-
-### open 打开方法
-打开一个包含给定组件的模式对话框。
-
-#### Parameters
-componentRef
-
-加载到对话框中的组件的类型，或作为对话框内容实例化的TemplateRef。
-
-config
-
-额外的配置选项。参考Config
-
-#### Returns
-
-DialogRef<T>
-
-引用新打开的对话框。
-
-## Directives
-
-### appDialogHeader
-对话框头部
-Selector：[app-dialog-header],[appDialogHeader]
-
-### appDialogBody
-对话框内容
-Selector：[app-dialog-body],[appDialogBody]
-
-### appDialogFooter
-对话框尾部
-Selector：[app-dialog-footer],[appDialogFooter]
-
-可选配置：
-align 按钮对齐方式（默认左对齐） 
-center 居中对齐
-end 右对齐
-
-### appDialogClose
-关闭对话框
-Selector：[appDialogClose],[app-dialog-close]
-
-## Config
-
-resolve?: {} | null = null; // 给组件传入数据 keys 会注入子组件的inputs里
-zIndex?: number;   // 层级 默认Backdrop 1040 Dialog 1050 Dialog总是比Backdrop多10
-height?: string;   // 高度 默认宽度600px
-width?: string;    // 宽度 auto
-hasBackdrop?: boolean; // 是否有遮罩背景
+# Dialog
+
+## Services
+
+### open 打开方法
+打开一个包含给定组件的模式对话框。
+
+#### Parameters
+componentRef
+
+加载到对话框中的组件的类型，或作为对话框内容实例化的TemplateRef。
+
+config
+
+额外的配置选项。参考Config
+
+#### Returns
+
+DialogRef<T>
+
+引用新打开的对话框。
+
+## Directives
+
+### appDialogHeader
+对话框头部
+Selector：[app-dialog-header],[appDialogHeader]
+
+### appDialogBody
+对话框内容
+Selector：[app-dialog-body],[appDialogBody]
+
+### appDialogFooter
+对话框尾部
+Selector：[app-dialog-footer],[appDialogFooter]
+
+Attributes:
+- [align=center],[align=end] 按钮对齐方式（默认左对齐） center(居中对齐)|end(右对齐)
+
+### appDialogClose
+关闭对话框
+Selector：[appDialogClose],[app-dialog-close]
+
+## Config
+
+resolve?: {} | null = null; // 给组件传入数据 keys 会注入子组件的inputs里
+zIndex?: number;   // 层级 默认Backdrop 1040 Dialog 1050 Dialog总是比Backdrop多10
+height?: string;   // 高度 默认宽度600px
+width?: string;    // 宽度 auto
+hasBackdrop?: boolean; // 是否有遮罩背景
 customClass?: string; // 自定义样式 dialog-backdrop-customClass dialog-customClass

src/app/shared/dialog/dialog.component.scss → src/app/simple/dialog/dialog.component.scss

@@ -1,96 +1,96 @@
-.dialog {
-    position: fixed;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1050;
-    display: block;
-    overflow: hidden;
-    -webkit-overflow-scrolling: touch;
-    outline: 0;
-    &-backdrop {
-        position: fixed;
-        pointer-events: auto;
-        z-index: 1000;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        -webkit-tap-highlight-color: transparent;
-        transition: opacity .4s cubic-bezier(.25, .8, .25, 1);
-        background: rgba(0, 0, 0, .6);
-        &-hidden {
-            display: none;
-        }
-    }
-    &-container {
-        position: relative;
-        top: 40%;
-        width: 600px;
-        margin: 0 auto;
-        .zoom-leave,
-        .zoom-enter {
-            animation-duration: .3s;
-            transform: none;
-            opacity: 0
-        }
-    }
-    &-content {
-        position: relative;
-        background-color: #fff;
-        -webkit-background-clip: padding-box;
-        background-clip: padding-box;
-        border: 1px solid #999;
-        border: 1px solid rgba(0, 0, 0, .2);
-        border-radius: 6px;
-        outline: 0;
-        -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
-        box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
-        background-color: white;
-    }
-    &-header {
-        padding: 15px;
-        border-bottom: 1px solid #e5e5e5;
-    }
-    &-title {
-        margin: 0;
-        line-height: 1.42857143;
-        font-size: 18px;
-    }
-    &-close {
-        cursor: pointer;
-        float: right;
-        font-size: 21px;
-        font-weight: 700;
-        line-height: 1;
-        color: #000;
-        text-shadow: 0 1px 0 #fff;
-        opacity: .2;
-        border: none;
-        background: none;
-        &:hover {
-            opacity: .5;
-        }
-    }
-    &-body {
-        position: relative;
-        padding: 15px;
-    }
-    &-footer {
-        font-size: 0;
-        padding: 15px;
-        text-align: right;
-        border-top: 1px solid #e5e5e5;
-        .u-btn+.u-btn {
-            margin-bottom: 0;
-            margin-left: 10px;
-        }
-        &[align=end] {
-            text-align: right;
-        }
-        &[align=center] {
-            text-align: center;
-        }
-    }
+.dialog {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1050;
+    display: block;
+    overflow: hidden;
+    -webkit-overflow-scrolling: touch;
+    outline: 0;
+    &-backdrop {
+        position: fixed;
+        pointer-events: auto;
+        z-index: 1000;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        -webkit-tap-highlight-color: transparent;
+        transition: opacity .4s cubic-bezier(.25, .8, .25, 1);
+        background: rgba(0, 0, 0, .6);
+        &-hidden {
+            display: none;
+        }
+    }
+    &-container {
+        position: relative;
+        top: 40%;
+        width: 600px;
+        margin: 0 auto;
+        .zoom-leave,
+        .zoom-enter {
+            animation-duration: .3s;
+            transform: none;
+            opacity: 0
+        }
+    }
+    &-content {
+        position: relative;
+        background-color: #fff;
+        -webkit-background-clip: padding-box;
+        background-clip: padding-box;
+        border: 1px solid #999;
+        border: 1px solid rgba(0, 0, 0, .2);
+        border-radius: 6px;
+        outline: 0;
+        -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
+        box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
+        background-color: white;
+    }
+    &-header {
+        padding: 15px;
+        border-bottom: 1px solid #e5e5e5;
+    }
+    &-title {
+        margin: 0;
+        line-height: 1.42857143;
+        font-size: 18px;
+    }
+    &-close {
+        cursor: pointer;
+        float: right;
+        font-size: 21px;
+        font-weight: 700;
+        line-height: 1;
+        color: #000;
+        text-shadow: 0 1px 0 #fff;
+        opacity: .2;
+        border: none;
+        background: none;
+        &:hover {
+            opacity: .5;
+        }
+    }
+    &-body {
+        position: relative;
+        padding: 15px;
+    }
+    &-footer {
+        font-size: 0;
+        padding: 15px;
+        text-align: right;
+        border-top: 1px solid #e5e5e5;
+        .u-btn+.u-btn {
+            margin-bottom: 0;
+            margin-left: 10px;
+        }
+        &[align=end] {
+            text-align: right;
+        }
+        &[align=center] {
+            text-align: center;
+        }
+    }
 }

src/app/shared/dialog/index.ts → src/app/simple/dialog/index.ts

@@ -1,4 +1,4 @@
-export * from './dialog.module';
-export * from './dialog.service';
-export * from './dialog-subject.service';
-export * from './dialog-config.service';
+export * from './dialog.module';
+export * from './dialog.service';
+export * from './dialog-subject.service';
+export * from './dialog-config.service';