功能展示页添加模板下载demo

long

2021-08-05 3dcc7cfd77cfdf04a7eeb614e81f378bfe428a67

 src/pages/login/index.vue

@@ -18,6 +18,7 @@
          type="text"
          tabindex="1"
          autocomplete="on"
          maxlength="20"
          @keyup.enter.native="handleLogin"
        />
      </el-form-item>
@@ -36,6 +37,7 @@
            name="password"
            tabindex="2"
            autocomplete="on"
            maxlength="20"
            @keyup.native="checkCapslock"
            @blur="capsTooltip = false"
            @keyup.enter.native="handleLogin"
@@ -58,6 +60,7 @@
          name="safecode"
          type="text"
          tabindex="3"
          maxlength="10"
          autocomplete="off"
          @keyup.enter.native="handleLogin"
        />
@@ -94,7 +97,7 @@
    }
    const validatePassword = (rule, value, callback) => {
      if (value.length < 5) {
        callback(new Error('账号不能少于5位'))
        callback(new Error('密码不能少于5位'))
      } else {
        callback()
      }
@@ -114,9 +117,9 @@
        checkedId: ''
      },
      loginRules: {
        username: [{ required: true, trigger: 'change', validator: validateUsername }],
        password: [{ required: true, trigger: 'change', validator: validatePassword }],
        safecode: [{ required: true, trigger: 'change', validator: validateSafecode }]
        username: [{ required: true, trigger: 'blur', validator: validateUsername }],
        password: [{ required: true, trigger: 'blur', validator: validatePassword }],
        safecode: [{ required: true, trigger: 'blur', validator: validateSafecode }]
      },
      passwordType: 'password',
      capsTooltip: false,
@@ -144,8 +147,7 @@
  },
  methods: {
    init() {
      var loginData = localStorage.getItem('loginData')
      console.log(loginData)
      var loginData = localStorage.getItem('loginData_XXXX')
      // 获取保存的账号密码
      if (loginData) this.loginForm = JSON.parse(loginData)

@@ -221,7 +223,7 @@
                name: '潘多拉的臭嘴', // 用户名称
                // arr: ['sys_admin_see'], // 权限列表
                arr: ['sys_admin_see', 'sys_admin_add', 'sys_admin_edit', 'sys_admin_del', 'sys_admin_role_see', 'sys_admin_role_add', 'sys_admin_role_edit', 'sys_admin_role_del', 'corp_user_schedule_see', 'corp_user_schedule_add', 'corp_user_schedule_edit', 'corp_user_schedule_del', 'user_mp_banner_see', 'user_mp_banner_add', 'user_mp_banner_edit', 'user_mp_banner_del', 'shop_see', 'shop_add', 'shop_edit', 'shop_del', 'shop_device', 'corp_user_see', 'corp_user_add', 'corp_user_edit', 'corp_user_del', 'change_assistant_see', 'ser_pro_material_see', 'service_project_see', 'service_project_add', 'service_project_edit', 'service_project_del', 'service_topic_see', 'service_topic_add', 'service_topic_edit', 'service_topic_del', 'service_project_order_see', 'service_project_order_edit', 'goods_type_see', 'goods_type_add', 'goods_type_edit', 'goods_type_del', 'goods_see', 'goods_add', 'goods_edit', 'goods_del', 'goods_inventory', 'goods_order_see', 'goods_order_edit', 'goods_index_banner_see', 'goods_index_banner_add', 'goods_index_banner_edit', 'goods_index_banner_del', 'user_see', 'user_edit', 'user_cash_see', 'user_cash_edit', 'distribute_relate', 'distribute_order', 'document_edit', 'operation_see',
                  'coupon_see', 'coupon_add', 'coupon_edit', 'coupon_del', 'activity_see', 'activity_add', 'activity_edit', 'activity_del'
                  'coupon_see', 'coupon_add', 'coupon_edit', 'coupon_del', 'activity_see', 'activity_add', 'activity_edit', 'activity_del', 'banner_see', 'banner_add', 'banner_edit', 'banner_del', 'sys_text_explain_edit'
                ]
              }
            }
@@ -234,7 +236,7 @@
              username: this.loginForm.username.trim(),
              password: this.loginForm.password.trim()
            })
            localStorage.setItem('loginData', loginData)
            localStorage.setItem('loginData_XXXX', loginData)

            // 保存用户数据
            setUserData(inf)
@@ -284,6 +286,11 @@

/* reset element-ui css */
.login-container {
  // 背景 ↓↓↓↓↓↓↓↓↓↓
  // background: url(../../assets/imgs/loginBg.jpg) no-repeat;
  // background-size: cover;
  // 背景 ↑↑↑↑↑↑↑↑↑↑
  background-color: $bg;
  .el-input {
    display: inline-block;
    height: 47px;
@@ -324,16 +331,23 @@
.login-container {
  min-height: 100%;
  width: 100%;
  background-color: $bg;
  // background-color: $bg;
  overflow: hidden;

  .login-form {
    position: relative;
    width: 520px;
    max-width: 100%;
    padding: 160px 35px 0;
    padding: 35px 35px 0;
    margin: 0 auto;
    margin-top: 160px;
    overflow: hidden;
    // 背景 ↓↓↓↓↓↓↓↓↓↓
    // background-color: $bg;
    // opacity: .96;
    // border-radius: 10px;
    // box-shadow: 0px 20px 60px rgba(0,0,0,0.4), 0px 0px 150px rgba(0,0,0,0.4);
    // 背景 ↑↑↑↑↑↑↑↑↑↑
  }

  .tips {