添加弹窗内列表组件

examples/containers/NormalDialog.vue

@@ -20,7 +20,20 @@
         <img src="@/assets/images/dialog/add_icon.png">
         新增
       </template>
-      sadasd
+      <form-area title="基本信息">
+        <form-line>
+          <form-item
+            label="姓名"
+            size="big"
+          >
+            <el-input></el-input>
+          </form-item>
+          <form-item label="性别">
+            <el-input></el-input>
+          </form-item>
+
+        </form-line>
+      </form-area>
       <div slot="footer">
         <el-button type="primary">确定</el-button>
         <el-button>取消</el-button>
@@ -31,9 +44,10 @@
 
 <script>
 import Vue from "vue";
-import { Button } from "element-ui";
+import { Button, Input } from "element-ui";
 
 Vue.component(Button.name, Button);
+Vue.component(Input.name, Input);
 
 export default {
   name: "DialogPage",

package.json

 {
   "name": "rym-element-ui",
-  "version": "0.1.15",
+  "version": "0.1.16",
   "description": "任意门组件库",
   "main": "lib/rymUi.common.js",
   "scripts": {

src/components/Dialog/NormalDialog.vue

@@ -68,6 +68,7 @@ export default {
 
 .el-dialog__wrapper {
   .el-dialog__header {
+    box-sizing: border-box;
     position: relative;
     height: 38px;
     background-color: #4e82fb;
@@ -78,7 +79,7 @@ export default {
       justify-content: center;
       align-items: center;
       color: #fff;
-      line-height: 28px;
+      line-height: 18px;
       vertical-align: top;
       font-size: 14px;
       img {

src/components/FormArea/index.js

+import FormArea from './FormArea.vue';
+
+FormArea.install = Vue => {
+  Vue.component(FormArea.name, FormArea);
+};
+
+export default FormArea;

src/components/FormItem/index.js

+import FormLine from '../FormArea/FormLine.vue';
+
+FormLine.install = Vue => {
+  Vue.component(FormLine.name, FormLine);
+};
+
+export default FormLine;

src/components/FormLine/index.js

+import FormItem from '../FormArea/FormItem.vue';
+
+FormItem.install = Vue => {
+  Vue.component(FormItem.name, FormItem);
+};
+
+export default FormItem;

src/index.js

@@ -11,6 +11,9 @@ import TableColumn from './components/TableColumn/index';
 import MessageBox from './components/MessageBox/index';
 import Dialog from './components/Dialog/index';
 import { Option } from 'element-ui';
+import FormArea from './components/FormArea/index';
+import FormLine from './components/FormLine/index';
+import FormItem from './components/FormItem/index';
 
 const install = Vue => {
   // Layout
@@ -25,6 +28,9 @@ const install = Vue => {
   Vue.component(TableColumn.name, TableColumn);
   Vue.prototype.$mdAlert = MessageBox;
   Vue.component(Dialog.name, Dialog);
+  Vue.component(FormArea.name, FormArea);
+  Vue.component(FormLine.name, FormLine);
+  Vue.component(FormItem.name, FormItem);
   // Element-ui
   Vue.component(Option.name, Option);
   // input