el-form-item 间距 行高

src/assets/scss/global.scss

@@ -101,11 +101,15 @@
 
 
 /* el-form-item 间距 start*/
-.el-form-item__content {
-  line-height: 40px;
-  position: relative;
-  font-size: 14px;
-  margin-top: -20px;
+.el-form--label-top .el-form-item__label {
+  float: none;
+  display: inline-block;
+  text-align: left;
+  padding: 0px 0 0px;
+  line-height: 28px;
+}
+.el-form-item--medium .el-form-item__content, .el-form-item--medium .el-form-item__label {
+  line-height: 30px;
 }
 /* el-form-item 间距 end*/
 

src/views/common/login.vue

@@ -95,7 +95,7 @@
       top: 0;
       left: 0;
       z-index: -1;
-      width: 65%;
+      width: 80%;
       height: 100%;
       content: "";
       background-image: url(~@/assets/img/login_bg.jpg);
@@ -138,7 +138,7 @@
       top: 0;
       right: 0;
       padding: 15% 60px 180px;
-      width: 470px;
+      width: 350px;
       min-height: 100%;
       background-color: #fff;
     }
@@ -165,8 +165,9 @@
       height: 45px;
     }
     .el-button--medium {
+      margin-top: 18px;
       padding: 5px 11px;
-      font-size: 30px;
+      font-size: 25px;
       border-radius: 4px;
     }
   }

src/views/modules/sys/user-add-or-update.vue

@@ -1,12 +1,14 @@
 <template>
+  <div    class="user-add-or-update">
     <el-dialog
+
       width="25%"
-    v-drag
       :title="!dataForm.id ? '新增' : '修改'"
       :close-on-click-modal="false"
       :visible.sync="visible">
       <!-- 取消    :rules="dataRule"-->
-    <el-form :model="dataForm" label-position="top"  ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
+      <el-form  :model="dataForm" label-position="top" ref="dataForm" @keyup.enter.native="dataFormSubmit()"
+                label-width="80px">
         <el-form-item label="用户名" prop="userName">
           <el-input v-model="dataForm.userName" placeholder="登录帐号"></el-input>
         </el-form-item>
@@ -29,7 +31,10 @@
         </el-form-item>
         <el-form-item label="角色" size="mini" prop="roleIdList">
           <el-checkbox-group v-model="dataForm.roleIdList">
-          <el-checkbox v-for="role in roleList" :key="role.roleId" :label="role.roleId">{{ role.roleName }}</el-checkbox>
+            <el-checkbox v-for="role in roleList" :key="role.roleId" :label="role.roleId">{{
+                role.roleName
+              }}
+            </el-checkbox>
           </el-checkbox-group>
         </el-form-item>
         <el-form-item label="状态" size="mini" prop="status">
@@ -44,13 +49,16 @@
       <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
     </span>
     </el-dialog>
+  </div>
+
 </template>
 
 <script>
-  import { isEmail, isMobile } from '@/utils/validate'
-  import {getFactory} from "@/api/factory";
-  export default {
-    data () {
+import {isEmail, isMobile} from '@/utils/validate'
+import {getFactory} from "@/api/factory";
+
+export default {
+  data() {
     var validatePassword = (rule, value, callback) => {
       if (!this.dataForm.id && !/\S/.test(value)) {
         callback(new Error('密码不能为空'))
@@ -99,33 +107,33 @@
       },
       dataRule: {
         userName: [
-            { required: true, message: '用户名不能为空', trigger: 'blur' }
+          {required: true, message: '用户名不能为空', trigger: 'blur'}
         ],
         password: [
-            { validator: validatePassword, trigger: 'blur' }
+          {validator: validatePassword, trigger: 'blur'}
         ],
         comfirmPassword: [
-            { validator: validateComfirmPassword, trigger: 'blur' }
+          {validator: validateComfirmPassword, trigger: 'blur'}
         ],
         email: [
-            { required: true, message: '邮箱不能为空', trigger: 'blur' },
-            { validator: validateEmail, trigger: 'blur' }
+          {required: true, message: '邮箱不能为空', trigger: 'blur'},
+          {validator: validateEmail, trigger: 'blur'}
         ],
         mobile: [
-            { required: true, message: '手机号不能为空', trigger: 'blur' },
-            { validator: validateMobile, trigger: 'blur' }
+          {required: true, message: '手机号不能为空', trigger: 'blur'},
+          {validator: validateMobile, trigger: 'blur'}
         ]
       }
     }
   },
   methods: {
     // 获取工厂信息
-      factoryList(){
-        getFactory().then((data) =>{
+    factoryList() {
+      getFactory().then((data) => {
         this.factorys = data.list
       })
     },
-      init (id) {
+    init(id) {
       this.dataForm.id = id || 0
       this.factoryList()
       this.$http({
@@ -159,7 +167,7 @@
       })
     },
     // 表单提交
-      dataFormSubmit () {
+    dataFormSubmit() {
       this.$refs['dataForm'].validate((valid) => {
         if (valid) {
           this.$http({
@@ -194,5 +202,8 @@
       })
     }
   }
-  }
+}
 </script>
+<style lang="scss" scoped>
+
+</style>