From d612cb44b33a686d02defa8308f3b1ff45c67281 Mon Sep 17 00:00:00 2001
From: whycq <10027870+whycq@user.noreply.gitee.com>
Date: 星期五, 10 二月 2023 10:36:56 +0800
Subject: [PATCH] #
---
pages/login/login.vue | 96 ++++++++++++++++++++++++++++++++++++------------
1 files changed, 72 insertions(+), 24 deletions(-)
diff --git a/pages/login/login.vue b/pages/login/login.vue
index a31a2b0..ea7e997 100644
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -1,35 +1,50 @@
<template>
+ <!-- 璁剧疆 -->
<label class="settings">
<uni-icons type="gear" size="30" color="#707070" @click="settings"></uni-icons>
</label>
+ <!-- logo -->
<view class="head">
<view class="logo">
<image src="../../static/img/logo.png" mode="aspectFit"></image>
</view>
</view>
<view class="content">
+ <!-- 璐﹀彿 -->
<view class="box shadow-warp">
- <view></view>
- <view>
+ <view class="box-icon">
+ <uni-icons type="person" size="20" color="#707070"></uni-icons>
+ </view>
+ <view class="box-text">璐﹀彿:</view>
+ <view class="box-input">
<input type="text">
</view>
-
+ <view class="box-show"></view>
</view>
+ <!-- 瀵嗙爜 -->
<view class="box shadow-warp">
- <view></view>
- <view>
+ <view class="box-icon">
+ <uni-icons type="locked" size="20" color="#707070"></uni-icons>
+ </view>
+ <view class="box-text">瀵嗙爜:</view>
+ <view class="box-input">
<input type="text">
</view>
-
+ <view class="box-show">
+ <uni-icons type="eye-filled" size="20" color="#707070"></uni-icons>
+ </view>
</view>
+ <!-- 璁颁綇瀵嗙爜 -->
<view class="check">
- <view>
- <text>璁颁綇瀵嗙爜</text>
+ <view class="check-left">
+ <view>璁颁綇瀵嗙爜</view>
</view>
-
- <view></view>
+ <view class="check-right">
+ <switch checked color="#FFCC33" style="zoom:.5"/>
+ </view>
</view>
</view>
+ <!-- 鐧诲綍鎸夐挳 -->
<view class="submit">
<view class="" style="width: 400rpx;">
<button type="primary" size="default">鐧诲綍</button>
@@ -37,14 +52,12 @@
</view>
- <!-- 寮圭獥鍖哄煙 -->
-
+ <!-- 璁剧疆寮圭獥鍖哄煙 -->
<view>
<uni-popup ref="inputDialog" type="dialog">
<view class="popup">
- <view class="title title-font">
- 閰嶇疆
- </view>
+ <!-- 鏍囬 -->
+ <view class="title title-font">閰嶇疆</view>
<view class="input">
<view class="input-left">ip:</view>
<view class="input-right"><input type="text"></view>
@@ -83,6 +96,7 @@
}
},
onLoad() {
+ // 鎵嬫満绔増鏈彿
// #ifdef APP-PLUS
var that = this
plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) {
@@ -91,12 +105,15 @@
// #endif
},
methods: {
+ // 璁剧疆绐楀彛寮�鍚寜閽�
settings() {
this.$refs.inputDialog.open()
},
+ // 璁剧疆绐楀彛纭淇敼鎸夐挳
dialogInputConfirm() {
this.$refs.inputDialog.close()
},
+ // 璁剧疆绐楀彛鍏抽棴鎸夐挳
close() {
this.$refs.inputDialog.close()
}
@@ -111,6 +128,7 @@
letter-spacing: 3px;
font-weight: 500;
}
+ // 璁剧疆鍖哄煙
.settings {
width: 100rpx;
height: 100rpx;
@@ -121,7 +139,7 @@
right: 0;
top: 70rpx;
}
-
+ // 璁剧疆鍖哄煙 - 鎵嬫満
<!-- #ifdef APP-PLUS -->
.settings {
width: 100rpx;
@@ -148,31 +166,61 @@
}
}
}
-
+ // 杈撳叆妗嗗尯鍩�
.content {
- min-height: 240rpx;
+ min-height: 250rpx;
width: 100%;
// background-color: bisque;
display: grid;
grid-template-columns: 1fr;
justify-items: center;
+ align-items: flex-start;
+ // 杈撳叆澶у尯
.box {
- width: 70%;
+ width: 80%;
height: 80rpx;
background-color: #FFFFFF;
- padding: 1upx 30upx;
- display: flex;
+ display: grid;
+ grid-template-columns: 1fr 1fr 5fr 1fr;
align-items: center;
- justify-content: space-between;
+ font-size: 12px;
+ // 鍥炬爣
+ &-icon {
+ display: grid;
+ justify-items: center;
+ }
+ // 杈撳叆妗�
+ &-input {
+ background-color: aquamarine;
+ }
+ // 闅愯棌鏄剧ず瀵嗙爜
+ &-show {
+ display: grid;
+ justify-items: center;
+ }
}
+ // 璁颁綇瀵嗙爜
.check {
- width: 78%;
+ width: 80%;
+ // background-color: blueviolet;
display: grid;
grid-template-columns: 1fr 1fr;
+ align-items: center;
text-align: left;
+ &-left {
+ display: grid;
+ align-items: center;
+ font-size: 12px;
+ text-indent: 10rpx;
+ }
+ &-right {
+ display: grid;
+ align-items: center;
+ justify-items: flex-end;
+ }
}
}
-
+ // 鐧诲綍鎸夐挳
.submit {
position: fixed;
width: 100%;
--
Gitblit v1.9.1