fix: 工作台页面,整体ui功能优化。

This commit is contained in:
tianyongbao
2025-11-14 02:13:02 +08:00
parent f4b0366a39
commit 459ab82cf2
62 changed files with 8331 additions and 3968 deletions

View File

@@ -1,17 +1,45 @@
<template>
<view class="pwd-retrieve-container">
<uni-forms ref="form" :value="user" labelWidth="80px">
<uni-forms-item name="oldPassword" label="旧密码">
<uni-easyinput type="password" v-model="user.oldPassword" placeholder="请输入旧密码" />
</uni-forms-item>
<uni-forms-item name="newPassword" label="新密码">
<uni-easyinput type="password" v-model="user.newPassword" placeholder="请输入新密码" />
</uni-forms-item>
<uni-forms-item name="confirmPassword" label="确认密码">
<uni-easyinput type="password" v-model="user.confirmPassword" placeholder="请确认密码" />
</uni-forms-item>
<button type="primary" @click="submit">提交</button>
</uni-forms>
<view class="pwd-container">
<view class="form-card">
<uni-forms ref="form" :value="user" labelWidth="80px">
<uni-forms-item name="oldPassword" label="旧密码">
<uni-easyinput type="password" v-model="user.oldPassword" placeholder="请输入旧密码" />
</uni-forms-item>
<uni-forms-item name="newPassword" label="新密码">
<uni-easyinput type="password" v-model="user.newPassword" placeholder="请输入新密码" />
</uni-forms-item>
<uni-forms-item name="confirmPassword" label="确认密码">
<uni-easyinput type="password" v-model="user.confirmPassword" placeholder="请确认新密码" />
</uni-forms-item>
</uni-forms>
</view>
<view class="tips-card">
<view class="tips-header">
<uni-icons type="info" size="18" color="#667eea"></uni-icons>
<text class="tips-title">密码要求</text>
</view>
<view class="tips-list">
<view class="tip-item">
<text class="tip-dot"></text>
<text class="tip-text">密码长度为 6-20 个字符</text>
</view>
<view class="tip-item">
<text class="tip-dot"></text>
<text class="tip-text">建议使用字母数字和符号组合</text>
</view>
<view class="tip-item">
<text class="tip-dot"></text>
<text class="tip-text">不要使用容易被猜到的密码</text>
</view>
</view>
</view>
<view class="submit-section">
<button class="submit-btn" @click="submit">
<text class="btn-text">修改密码</text>
</button>
</view>
</view>
</template>
@@ -79,13 +107,99 @@
}
</script>
<style lang="scss">
page {
background-color: #ffffff;
}
<style lang="scss" scoped>
page {
background-color: #f5f7fa;
}
.pwd-retrieve-container {
padding-top: 36rpx;
padding: 15px;
.pwd-container {
padding: 32rpx;
}
.form-card {
background: linear-gradient(135deg, #ffffff 0%, #f8f9fb 100%);
border-radius: 24rpx;
padding: 32rpx 24rpx;
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
margin-bottom: 24rpx;
}
.tips-card {
background: linear-gradient(135deg, rgba(102, 126, 234, 0.08) 0%, rgba(118, 75, 162, 0.08) 100%);
border-radius: 24rpx;
padding: 24rpx;
margin-bottom: 32rpx;
border: 2rpx solid rgba(102, 126, 234, 0.2);
}
.tips-header {
display: flex;
align-items: center;
margin-bottom: 16rpx;
.tips-title {
color: #667eea;
font-size: 28rpx;
font-weight: 600;
margin-left: 8rpx;
}
}
.tips-list {
.tip-item {
display: flex;
align-items: flex-start;
margin-bottom: 8rpx;
&:last-child {
margin-bottom: 0;
}
.tip-dot {
color: #667eea;
font-size: 28rpx;
margin-right: 8rpx;
line-height: 40rpx;
}
.tip-text {
flex: 1;
color: #606266;
font-size: 24rpx;
line-height: 40rpx;
}
}
}
.submit-section {
padding: 0 8rpx;
}
.submit-btn {
width: 100%;
height: 88rpx;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 44rpx;
border: none;
box-shadow: 0 8rpx 24rpx rgba(102, 126, 234, 0.4);
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
&::after {
border: none;
}
&:active {
transform: scale(0.98);
box-shadow: 0 4rpx 16rpx rgba(102, 126, 234, 0.3);
}
.btn-text {
color: #ffffff;
font-size: 32rpx;
font-weight: 600;
}
}
</style>