From 5abcde36961125cbf436f91b8c17610a6b5f8308 Mon Sep 17 00:00:00 2001
From: sen <sen@qq.com>
Date: 星期三, 15 四月 2026 12:15:08 +0800
Subject: [PATCH] 修改调度单必填校验
---
ui/car_wx_app/pages/login/index.vue | 308 ++++++++++++++++++++++++++++++++++++++------------
1 files changed, 232 insertions(+), 76 deletions(-)
diff --git a/ui/car_wx_app/pages/login/index.vue b/ui/car_wx_app/pages/login/index.vue
index d834c5f..eb3e368 100644
--- a/ui/car_wx_app/pages/login/index.vue
+++ b/ui/car_wx_app/pages/login/index.vue
@@ -1,51 +1,100 @@
<template>
- <view class="login-box">
- <u-transition :show="true" mode="slide-down">
- <view class="transition text-center">
- <image class="login-logo" mode='aspectFit' src="/static/image/jk.jpeg"></image>
- <view class="login-title">{{title}}</view>
- </view>
- </u-transition>
- <u-transition :show="true" mode="slide-down">
- <view class="box">
- <u--form labelPosition="left" :model="form" :rules="rules" ref="uForm">
- <u-form-item label="璐︽埛" prop="username" borderBottom ref="item1">
- <u--input v-model="form.username" placeholder="璇疯緭鍏ヨ处鎴�" border="none"></u--input>
- </u-form-item>
- <u-form-item label="瀵嗙爜" prop="password" borderBottom ref="item1">
- <u--input
- :type="passwordType"
- v-model="form.password"
- placeholder="璇疯緭鍏ュ瘑鐮�"
- clearable
- :focus="noFocus"
- border="none"
- shape="circle"
- ref="passwordInput"
- ></u--input>
- <u-icon
- slot="right"
- size="30"
- color="#999"
- :name="passwordIcon"
- @click="togglePasswordVisibility"
- style="margin-right: 10px; cursor: pointer;"
- ></u-icon>
- </u-form-item>
-
- </u--form>
+ <view class="login-container">
+ <!-- 鑳屾櫙瑁呴グ -->
+ <view class="bg-decoration">
+ <view class="circle circle-1"></view>
+ <view class="circle circle-2"></view>
+ <view class="circle circle-3"></view>
+ </view>
- <view style="margin-top: 20px;">
- <u-checkbox-group v-model="rememberPassword">
- <u-checkbox label="璁颁綇瀵嗙爜" name="remember"></u-checkbox>
- </u-checkbox-group>
+ <!-- 鐧诲綍鍐呭 -->
+ <view class="login-content">
+ <!-- Logo 鍜屾爣棰� -->
+ <u-transition :show="true" mode="fade-up">
+ <view class="header-section">
+ <image class="login-logo" mode="aspectFit" src="/static/image/jk.jpeg"></image>
+ <view class="login-title">{{ title }}</view>
+ <view class="login-subtitle">娆㈣繋浣跨敤鐗╂祦璋冨害绯荤粺</view>
</view>
-
- <view class="login-btn">
- <u-button shape="circle" @click="loginSubmit" type="primary" text="鐧诲綍"></u-button>
+ </u-transition>
+
+ <!-- 鐧诲綍琛ㄥ崟鍗＄墖 -->
+ <u-transition :show="true" mode="fade-up">
+ <view class="form-card">
+ <u--form labelPosition="left" :model="form" :rules="rules" ref="uForm">
+ <!-- 璐︽埛杈撳叆 -->
+ <u-form-item label=" " labelWidth="0" prop="username" borderBottom>
+ <view class="input-wrapper">
+ <view class="input-icon">
+ <u-icon name="account" size="20" color="#909399"></u-icon>
+ </view>
+ <u--input
+ v-model="form.username"
+ placeholder="璇疯緭鍏ヨ处鎴�"
+ border="none"
+ placeholderStyle="color: #c0c4cc"
+ ></u--input>
+ </view>
+ </u-form-item>
+
+ <!-- 瀵嗙爜杈撳叆 -->
+ <u-form-item label=" " labelWidth="0" prop="password" borderBottom>
+ <view class="input-wrapper">
+ <view class="input-icon">
+ <u-icon name="lock" size="20" color="#909399"></u-icon>
+ </view>
+ <u--input
+ :type="passwordType"
+ v-model="form.password"
+ placeholder="璇疯緭鍏ュ瘑鐮�"
+ border="none"
+ placeholderStyle="color: #c0c4cc"
+ :focus="noFocus"
+ ref="passwordInput"
+ ></u--input>
+ <view class="input-icon-right" @click="togglePasswordVisibility">
+ <u-icon
+ size="20"
+ color="#909399"
+ :name="passwordIcon"
+ ></u-icon>
+ </view>
+ </view>
+ </u-form-item>
+ </u--form>
+
+ <!-- 璁颁綇瀵嗙爜 -->
+ <view class="remember-section">
+ <u-checkbox-group v-model="rememberPassword">
+ <u-checkbox
+ label="璁颁綇瀵嗙爜"
+ name="remember"
+ activeColor="#409eff"
+ size="16"
+ ></u-checkbox>
+ </u-checkbox-group>
+ </view>
+
+ <!-- 鐧诲綍鎸夐挳 -->
+ <view class="login-btn-wrapper">
+ <u-button
+ @click="loginSubmit"
+ type="primary"
+ shape="circle"
+ :customStyle="{
+ background: 'linear-gradient(135deg, #66b1ff 0%, #409eff 100%)',
+ border: 'none',
+ height: '88rpx',
+ fontSize: '32rpx',
+ fontWeight: '500'
+ }"
+ >
+ <text>鐧� 褰�</text>
+ </u-button>
+ </view>
</view>
- </view>
- </u-transition>
+ </u-transition>
+ </view>
</view>
</template>
@@ -121,7 +170,7 @@
this.$refs.uForm.validate().then(res => {
if (res) {
loginPda({ username: this.form.username, password: encryptSm4(this.form.password),openId:_this.car_open_id }).then(response => {
-
+
if (response.code == 200) {
_this.$u.vuex('sso_user_token', 'Bearer ' + response.token);
uni.$u.toast('鐧诲綍鎴愬姛锛�')
@@ -159,38 +208,145 @@
</script>
<style scoped lang="scss">
-.login-box {
- width: 80%;
- margin: 0 auto;
+.login-container {
+ min-height: 100vh;
+ background: linear-gradient(135deg, #66b1ff 0%, #409eff 100%);
+ position: relative;
+ overflow: hidden;
+}
- .login-logo {
- margin-top: 60px;
- height: 150px;
- text-align: center;
+/* 鑳屾櫙瑁呴グ */
+.bg-decoration {
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ left: 0;
+ overflow: hidden;
+ z-index: 0;
+}
+
+.circle {
+ position: absolute;
+ border-radius: 50%;
+ background: rgba(255, 255, 255, 0.1);
+ animation: float 20s infinite ease-in-out;
+}
+
+.circle-1 {
+ width: 300rpx;
+ height: 300rpx;
+ top: -100rpx;
+ right: -50rpx;
+ animation-delay: 0s;
+}
+
+.circle-2 {
+ width: 200rpx;
+ height: 200rpx;
+ bottom: 100rpx;
+ left: -50rpx;
+ animation-delay: 5s;
+}
+
+.circle-3 {
+ width: 150rpx;
+ height: 150rpx;
+ top: 50%;
+ right: 50rpx;
+ animation-delay: 10s;
+}
+
+@keyframes float {
+ 0%, 100% {
+ transform: translateY(0) rotate(0deg);
}
-
- .login-title {
- font-size: 22px;
- color: #000000;
- font-weight: bold;
- text-align: center;
- }
-
- .box {
- padding-top: 20px;
-
- .login-btn {
- margin-top: 50px;
- }
- }
-
- .version {
- position: absolute;
- bottom: 50px;
- left: 50%;
- transform: translateX(-50%);
- color: #999999;
- font-size: 14px;
+ 50% {
+ transform: translateY(-40rpx) rotate(180deg);
}
}
-</style>
\ No newline at end of file
+
+/* 鐧诲綍鍐呭 */
+.login-content {
+ position: relative;
+ z-index: 1;
+ padding: 160rpx 40rpx 40rpx;
+}
+
+/* 澶撮儴鍖哄煙 */
+.header-section {
+ text-align: center;
+ margin-bottom: 60rpx;
+}
+
+.login-logo {
+ width: 160rpx;
+ height: 160rpx;
+ border-radius: 50%;
+ box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.15);
+ background: #fff;
+ padding: 10rpx;
+}
+
+.login-title {
+ margin-top: 30rpx;
+ font-size: 48rpx;
+ color: #ffffff;
+ font-weight: bold;
+ letter-spacing: 2rpx;
+}
+
+.login-subtitle {
+ margin-top: 16rpx;
+ font-size: 26rpx;
+ color: rgba(255, 255, 255, 0.8);
+ letter-spacing: 1rpx;
+}
+
+/* 琛ㄥ崟鍗＄墖 */
+.form-card {
+ background: #ffffff;
+ border-radius: 24rpx;
+ padding: 50rpx 40rpx;
+ box-shadow: 0 20rpx 60rpx rgba(0, 0, 0, 0.2);
+}
+
+/* 杈撳叆妗嗗寘瑁� */
+.input-wrapper {
+ display: flex;
+ align-items: center;
+ padding: 20rpx 0;
+}
+
+.input-icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 60rpx;
+ flex-shrink: 0;
+}
+
+.input-icon-right {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 60rpx;
+ flex-shrink: 0;
+ cursor: pointer;
+}
+
+/* 璁颁綇瀵嗙爜 */
+.remember-section {
+ margin-top: 30rpx;
+ padding-left: 10rpx;
+}
+
+/* 鐧诲綍鎸夐挳 */
+.login-btn-wrapper {
+ margin-top: 50rpx;
+}
+
+.login-btn-wrapper button {
+ box-shadow: 0 8rpx 24rpx rgba(64, 158, 255, 0.4);
+}
+</style>
--
Gitblit v1.8.0