by/SmartParks_visitore
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

页面调整

Browse Source
This commit is contained in:
merak1237
2025-08-26 16:07:25 +08:00
parent f259275adb
commit 0e673b853d
6 changed files with 1278 additions and 1241 deletions
Download Patch File Download Diff File Expand all files Collapse all files

237
pages/sys/login/index.vue
View File

@@ -1,20 +1,19 @@
<template>
<template>
<view class="login-container">
<!-- 顶部渐变背景和标题 -->
<view class="login-header">
<image class="login-bg-img" src="/static/ic_login_topbg.png" mode="widthFix" />
<view class="login-title">登录注册</view>
<view class="login-subtitle">欢迎使用数智南川</view>
</view>
<!-- 表单区域 -->
<view class="login-form">
<view class="input-row">
<image class="iconfont" src="/static/ic_login_phone.png" />
<image class="iconfont" src="/static/aidex/login/ic_login_user.png" />
<input class="login-input" type="text" placeholder="输入账号" v-model="username" />
</view>
<view class="input-row">
<image class="iconfont2" src="/static/ic_login_code.png" />
<input class="login-input" type="text" v-model="password" placeholder="请输入密码" />
<image class="iconfont2" src="/static/aidex/login/ic_login_pwd.png" />
<input class="login-input" type="password" v-model="password" placeholder="请输入密码" />
</view>
<view class="protocol-row">
<label class="custom-checkbox-label">
@@ -31,9 +30,9 @@
<button class="login-btn" @click="submit">登录</button>
</view>
</view>
</template>
</template>
<script>
<script>
// import { globalWs } from '../../../utils/GlobalWebSocket';
// import socketManager from '@/utils/GlobalWebSocket.js'
import base64 from '@/common/base64.js';
@@ -182,171 +181,189 @@
}
}
}
</script>
</script>
<style scoped>
.login-container {
<style scoped>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
body {
background: linear-gradient(135deg, #f0f5ff 0%, #e6f7ff 100%);
min-height: 100vh;
background: #fafbfc;
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 16px;
}
.login-container {
width: 100%;
position: relative;
border-radius: 24px;
overflow: hidden;
box-shadow: 0 20px 40px rgba(46, 108, 246, 0.15);
transition: all 0.3s ease;
}
/* 响应式调整 */
@media (max-width: 600px) {
.login-container {
border-radius: 16px;
max-width: 90%;
}
}
@media (max-width: 400px) {
.login-container {
max-width: 95%;
}
}
.login-header {
width: 100%;
position: relative;
height: 35vh;
min-height: 30vh;
max-height: 35vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 40rpx;
color: white;
padding: 20px;
}
.login-bg-img {
.login-header::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 0;
height: 100%;
background: linear-gradient(135deg, #2e6cf9 0%, #4fc3f7 100%);
z-index: 1;
border-radius: 24px 24px 0 0;
}
.login-title,
.login-subtitle {
.login-title, .login-subtitle {
position: relative;
top: 164rpx;
z-index: 2;
text-align: center;
}
.login-title {
color: #fff;
font-size: 48rpx;
font-weight: bold;
margin-top: 40rpx;
font-size: clamp(28px, 5vw, 36px);
font-weight: 700;
margin-bottom: 8px;
}
.login-subtitle {
color: #fff;
font-size: 24rpx;
margin-top: 10rpx;
font-size: clamp(14px, 3vw, 18px);
font-weight: 400;
opacity: 0.9;
}
.login-form {
width: 80%;
margin-top: 400rpx;
display: flex;
flex-direction: column;
align-items: center;
background: white;
padding: clamp(20px, 5vw, 30px);
border-radius: 0 0 24px 24px;
position: relative;
z-index: 10;
}
.input-row {
width: 100%;
display: flex;
align-items: center;
border-bottom: 1px solid #eee;
margin-bottom: 30rpx;
padding-bottom: 10rpx;
border-bottom: 1px solid #eaeaea;
margin-bottom: clamp(15px, 4vw, 25px);
padding-bottom: 10px;
}
.iconfont {
font-size: 32rpx;
margin-right: 16rpx;
width: 27rpx;
height: 43rpx;
.input-row:focus-within {
border-bottom-color: #2e6cf6;
}
.iconfont2 {
font-size: 32rpx;
margin-right: 16rpx;
width: 31rpx;
height: 35rpx;
.iconfont, .iconfont2 {
width: clamp(20px, 4vw, 24px);
height: clamp(20px, 4vw, 24px);
margin-right: 12px;
flex-shrink: 0;
}
.login-input {
flex: 1;
border: none;
background: transparent;
font-size: 28rpx;
padding: 10rpx 0;
margin-right: 10rpx;
outline: none;
font-size: clamp(14px, 4vw, 16px);
color: #333;
min-width: 0; /* 防止flex项目溢出 */
}
.code-btn {
background: none;
color: #2e6cf6;
border: none;
font-size: 26rpx;
padding: 0 10rpx;
.login-input::placeholder {
color: #aaa;
}
.protocol-row {
width: 100%;
display: flex;
align-items: center;
margin: 20rpx 0 40rpx 0;
font-size: 24rpx;
}
.protocol-checkbox {
margin-right: 8rpx;
}
.protocol-link {
color: #2e6cf6;
margin: 0 4rpx;
}
.login-btn {
width: 100%;
height: 80rpx;
background: linear-gradient(90deg, #2e6cf6 0%, #4fc3f7 100%);
color: #fff;
font-size: 32rpx;
border: none;
border-radius: 40rpx;
margin-top: 268rpx;
margin: clamp(15px, 4vw, 20px) 0 clamp(20px, 5vw, 30px);
font-size: clamp(12px, 3vw, 14px);
color: #666;
flex-wrap: wrap;
}
.custom-checkbox-label {
display: flex;
align-items: center;
margin-right: 8rpx;
margin-right: 6px;
cursor: pointer;
flex-shrink: 0;
}
.custom-checkbox-input {
display: none;
}
.custom-checkbox-span {
width: 28rpx;
height: 28rpx;
border-radius: 50%;
border: 2rpx solid #2e6cf6;
background: #fff;
display: inline-block;
position: relative;
transition: border-color 0.2s;
}
.custom-checkbox-span.checked {
background: #2e6cf6;
border-color: #2e6cf6;
}
.custom-checkbox-span.checked::after {
content: '';
position: absolute;
left: 7rpx;
top: 7rpx;
width: 12rpx;
height: 12rpx;
background: #fff;
border-radius: 50%;
}
.custom-checkbox-img {
width: 28rpx;
height: 28rpx;
margin-right: 8rpx;
width: clamp(18px, 4vw, 20px);
height: clamp(18px, 4vw, 20px);
margin-right: 6px;
cursor: pointer;
flex-shrink: 0;
}
</style>
.protocol-link {
color: #2e6cf6;
margin: 0 2px;
cursor: pointer;
white-space: nowrap;
}
.login-btn {
width: 100%;
height: clamp(45px, 10vw, 50px);
background: linear-gradient(90deg, #2e6cf6 0%, #4fc3f7 100%);
color: white;
border: none;
border-radius: clamp(20px, 8vw, 25px);
font-size: clamp(14px, 4vw, 16px);
font-weight: 600;
cursor: pointer;
transition: all 0.3s;
box-shadow: 0 4px 12px rgba(46, 108, 246, 0.3);
}
.login-btn:hover {
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(46, 108, 246, 0.4);
}
.login-btn:active {
transform: translateY(0);
}
</style>

335
pages/sys/qrpage/qrpage.vue
View File

@@ -13,17 +13,22 @@
<!-- 主内容区 -->
<view class="main-content">
<!-- 状态提示 -->
<view class="status-indicator" :class="qrCodeStatus">
<text class="status-text">{{ getStatusText() }}</text>
</view>
<!-- 二维码容器 -->
<view class="qr-container">
<view class="qr-card">
<view class="qr-wrapper" :class="{ 'fade-out': isClosing, 'fade-in': isGenerating }">
<uv-qrcode ref="qrcode" canvas-id="qrcode" :value="value" size="300rpx"></uv-qrcode>
<!-- 状态提示 -->
<view class="status-indicator" :class="qrCodeStatus">
<text class="status-text">{{ getStatusText() }}</text>
</view>
<view class="qr-wrapper" :class="{ 'fade-out': isClosing, 'fade-in': isGenerating }">
<uv-qrcode ref="qrcode" canvas-id="qrcode" :value="value" size="500rpx"></uv-qrcode>
</view>
<button class="action-btn primary" @click="manualRefresh" :disabled="isLoading">
<i class="fa fa-refresh" :class="{ 'fa-spin': isLoading }"></i>
<text class="btn-text">刷新二维码</text>
</button>
<view class="qr-expiry" v-if="qrCodeStatus === 'active'">
<text>有效时长: {{ formatCountdown(remainingTime) }}</text>
</view>
@@ -58,10 +63,7 @@
<!-- 底部操作区 -->
<view class="bottom-bar">
<button class="action-btn primary" @click="manualRefresh" :disabled="isLoading">
<i class="fa fa-refresh" :class="{ 'fa-spin': isLoading }"></i>
<text class="btn-text">刷新二维码</text>
</button>
<!-- <button class="action-btn secondary" @click="resetConnection" :disabled="isLoading">
<i class="fa fa-sync-alt"></i>
<text class="btn-text">重置连接</text>
@@ -82,10 +84,10 @@
</template>
<script>
import random from '../../../uview-ui/libs/function/random';
import uvQrcode from '@/uni_modules/uv-qrcode/components/uv-qrcode/uv-qrcode.vue';
import random from '../../../uview-ui/libs/function/random';
import uvQrcode from '@/uni_modules/uv-qrcode/components/uv-qrcode/uv-qrcode.vue';
export default {
export default {
components: {
uvQrcode
},
@@ -99,8 +101,8 @@
},
value: '12345', // 二维码内容
qrCodeTimestamp: 0, // 生成时间戳
expiryTime: 300000, // 5分钟有效期(ms)
remainingTime: 300000,
expiryTime: 600000, // 10分钟有效期(ms)
remainingTime: 600000,
countdownInterval: null,
// 状态管理
@@ -113,7 +115,6 @@
clientId: "dab457a1ea14411787c240db05bb0832",
// 弹窗相关
showPopup: false,
popupMessage: '',
@@ -125,9 +126,9 @@
onLoad() {
this.wsListener = (content) => {
let message=JSON.parse(content)
let message = JSON.parse(content)
console.log(message.date)
if(this.qrCodeId==message.date){
if (this.qrCodeId == message.date) {
this.generateQrCode();
}
@@ -253,19 +254,18 @@
this.isLoading = true;
this.qrCodeStatus = 'generating';
this.isGenerating = true;
// 调用接口生成二维码
this.$u.api.getcode(this.info)
.then(res => {
console.log("二维码生成成功", res);
this.qrCodeId=res.msg;
this.qrCodeId = res.msg;
this.value = "http://183.230.235.66:11010/visitore?code=" + res.msg; // 更新二维码内容
this.qrCodeTimestamp = Date.now(); // 记录生成时间
// this.remainingTime = this.expiryTime; // 重置倒计时
this.remainingTime = this.expiryTime; // 重置倒计时
// 更新状态
this.qrCodeStatus = 'active';
// this.startCountdown(); // 启动倒计时
this.startCountdown(); // 启动倒计时
})
.catch(err => {
console.error("二维码生成失败", err);
@@ -281,28 +281,27 @@
/**
* 启动倒计时
*/
// startCountdown() {
// this.clearCountdown(); // 先清除现有定时器
startCountdown() {
this.clearCountdown(); // 先清除现有定时器
this.countdownInterval = setInterval(() => {
this.remainingTime -= 1000;
// this.countdownInterval = setInterval(() => {
// this.remainingTime -= 1000;
// if (this.remainingTime <= 0) {
// this.showPopupMessage('二维码已过期，正在生成新码', 'warning', 'fa-exclamation-triangle');
// this.closeCurrentQrCode();
// }
// }, 1000);
// },
if (this.remainingTime <= 0) {
this.showPopupMessage('二维码已过期，正在生成新码', 'warning', 'fa-exclamation-triangle');
this.closeCurrentQrCode();
}
}, 1000);
},
/**
* 清除倒计时
*/
// clearCountdown() {
// if (this.countdownInterval) {
// clearInterval(this.countdownInterval);
// this.countdownInterval = null;
// }
// },
clearCountdown() {
if (this.countdownInterval) {
clearInterval(this.countdownInterval);
this.countdownInterval = null;
}
},
/**
* 关闭当前二维码并生成新的
@@ -312,7 +311,7 @@
this.qrCodeStatus = 'closing';
this.isClosing = true;
// this.clearCountdown(); // 停止倒计时
this.clearCountdown(); // 停止倒计时
console.log(`关闭二维码: ${this.info.qrCodeId}`);
@@ -423,19 +422,19 @@
return num < 10 ? '0' + num : num;
}
}
};
};
</script>
<style scoped>
.container {
.container {
display: flex;
flex-direction: column;
min-height: 100vh;
background-color: #f0f2f5;
}
}
/* 导航栏样式 */
.navbar {
/* 导航栏样式 */
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
@@ -445,16 +444,16 @@
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
position: relative;
z-index: 10;
}
}
.navbar-title {
.navbar-title {
font-size: 18px;
font-weight: 600;
display: flex;
align-items: center;
}
}
.connection-status {
.connection-status {
padding: 5px 12px;
border-radius: 16px;
font-size: 14px;
@@ -462,27 +461,27 @@
align-items: center;
background-color: rgba(255, 255, 255, 0.15);
transition: all 0.3s ease;
}
}
.connection-status::before {
.connection-status::before {
content: '';
width: 8px;
height: 8px;
border-radius: 50%;
margin-right: 6px;
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2);
}
}
.connection-status.connected::before {
.connection-status.connected::before {
background-color: #10b981;
}
}
.connection-status.disconnected::before {
.connection-status.disconnected::before {
background-color: #ef4444;
animation: pulse 2s infinite;
}
}
@keyframes pulse {
@keyframes pulse {
0% {
opacity: 1;
}
@@ -494,19 +493,19 @@
100% {
opacity: 1;
}
}
}
/* 主内容区样式 */
.main-content {
/* 主内容区样式 */
.main-content {
flex: 1;
padding: 24px;
display: flex;
flex-direction: column;
align-items: center;
}
}
/* 状态指示器 */
.status-indicator {
/* 状态指示器 */
.status-indicator {
padding: 9px 18px;
border-radius: 22px;
margin-bottom: 24px;
@@ -515,50 +514,51 @@
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12);
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s ease;
}
}
.status-indicator::before {
.status-indicator::before {
content: '';
width: 8px;
height: 8px;
border-radius: 50%;
margin-right: 8px;
}
}
.status-indicator.generating {
.status-indicator.generating {
background-color: #2563eb;
}
}
.status-indicator.generating::before {
.status-indicator.generating::before {
background-color: white;
animation: pulse 1.5s infinite;
}
}
.status-indicator.active {
.status-indicator.active {
background-color: #10b981;
}
}
.status-indicator.active::before {
.status-indicator.active::before {
background-color: white;
}
}
.status-indicator.closing {
.status-indicator.closing {
background-color: #f59e0b;
}
}
.status-indicator.closing::before {
.status-indicator.closing::before {
background-color: white;
}
}
/* 二维码容器 */
.qr-container {
/* 二维码容器 */
.qr-container {
margin-bottom: 28px;
width: 100%;
max-width: 360px;
}
max-width: 300px;
}
.qr-card {
.qr-card {
background-color: white;
border-radius: 16px;
padding: 24px;
@@ -566,9 +566,9 @@
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
}
.qr-card::before {
.qr-card::before {
content: '';
position: absolute;
top: 0;
@@ -576,14 +576,14 @@
right: 0;
height: 4px;
background: linear-gradient(90deg, #2563eb, #60a5fa);
}
}
.qr-card:hover {
.qr-card:hover {
box-shadow: 0 10px 30px rgba(37, 99, 235, 0.15);
transform: translateY(-2px);
}
}
.qr-wrapper {
.qr-wrapper {
width: 100%;
aspect-ratio: 1/1;
display: flex;
@@ -594,26 +594,26 @@
background-color: #fafafa;
border-radius: 12px;
margin-bottom: 16px;
}
}
.qr-expiry {
.qr-expiry {
text-align: center;
color: #666;
font-size: 14px;
padding: 8px 0;
border-top: 1px dashed #eee;
}
}
/* 动画效果 */
.fade-in {
/* 动画效果 */
.fade-in {
animation: fadeIn 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
}
.fade-out {
.fade-out {
animation: fadeOut 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
}
@keyframes fadeIn {
@keyframes fadeIn {
from {
opacity: 0;
transform: scale(0.95);
@@ -623,9 +623,9 @@
opacity: 1;
transform: scale(1);
}
}
}
@keyframes fadeOut {
@keyframes fadeOut {
from {
opacity: 1;
transform: scale(1);
@@ -635,74 +635,74 @@
opacity: 0;
transform: scale(0.95);
}
}
}
/* 信息卡片 */
.info-card {
/* 信息卡片 */
.info-card {
width: 100%;
background-color: white;
border-radius: 16px;
box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06);
overflow: hidden;
transition: all 0.3s ease;
}
}
.info-card:hover {
.info-card:hover {
box-shadow: 0 10px 30px rgba(37, 99, 235, 0.1);
}
}
.card-header {
.card-header {
padding: 16px 24px;
border-bottom: 1px solid #f5f5f5;
}
}
.card-title {
.card-title {
font-size: 16px;
font-weight: 600;
color: #1f2329;
}
}
.info-grid {
.info-grid {
padding: 16px 24px;
display: grid;
grid-template-columns: 1fr;
gap: 16px;
}
}
.info-item {
.info-item {
display: flex;
flex-direction: column;
padding: 8px 0;
border-bottom: 1px solid #f5f5f5;
}
}
.info-item:last-child {
.info-item:last-child {
border-bottom: none;
}
}
.info-label {
.info-label {
color: #86909c;
font-size: 13px;
margin-bottom: 4px;
}
}
.info-value {
.info-value {
font-size: 15px;
color: #1f2329;
word-break: break-all;
line-height: 1.4;
}
}
/* 底部操作区 */
.bottom-bar {
/* 底部操作区 */
.bottom-bar {
display: flex;
padding: 16px 24px;
background-color: white;
border-top: 1px solid #f5f5f5;
gap: 16px;
}
}
.action-btn {
.action-btn {
flex: 1;
padding: 14px 0;
border-radius: 10px;
@@ -712,46 +712,47 @@
font-size: 16px;
border: none;
font-weight: 500;
height: 50px;
transition: all 0.2s ease;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}
}
.action-btn.primary {
.action-btn.primary {
background-color: #2563eb;
color: white;
}
}
.action-btn.primary:hover {
.action-btn.primary:hover {
background-color: #1d4ed8;
box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
transform: translateY(-1px);
}
}
.action-btn.primary:active {
.action-btn.primary:active {
transform: translateY(1px);
}
}
.action-btn.secondary {
.action-btn.secondary {
background-color: #f5f7fa;
color: #4e5969;
}
}
.action-btn.secondary:hover {
.action-btn.secondary:hover {
background-color: #e8ebf0;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
transform: translateY(-1px);
}
}
.action-btn.secondary:active {
.action-btn.secondary:active {
transform: translateY(1px);
}
}
.btn-text {
.btn-text {
margin-left: 8px;
}
}
/* 弹窗样式 */
.popup-overlay {
/* 弹窗样式 */
.popup-overlay {
position: fixed;
top: 0;
left: 0;
@@ -763,9 +764,9 @@
align-items: center;
z-index: 9999;
animation: fadeIn 0.3s ease;
}
}
.popup-dialog {
.popup-dialog {
background-color: white;
padding: 28px 24px;
border-radius: 16px;
@@ -776,9 +777,9 @@
align-items: center;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
animation: popupIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
}
@keyframes popupIn {
@keyframes popupIn {
from {
opacity: 0;
transform: scale(0.9);
@@ -788,9 +789,9 @@
opacity: 1;
transform: scale(1);
}
}
}
.popup-icon {
.popup-icon {
width: 48px;
height: 48px;
border-radius: 50%;
@@ -799,37 +800,37 @@
justify-content: center;
margin-bottom: 18px;
font-size: 24px;
}
}
.popup-icon.info {
.popup-icon.info {
background-color: #dbeafe;
color: #2563eb;
}
}
.popup-icon.success {
.popup-icon.success {
background-color: #dcfce7;
color: #10b981;
}
}
.popup-icon.error {
.popup-icon.error {
background-color: #fee2e2;
color: #ef4444;
}
}
.popup-icon.warning {
.popup-icon.warning {
background-color: #fef3c7;
color: #f59e0b;
}
}
.popup-text {
.popup-text {
font-size: 16px;
margin-bottom: 24px;
text-align: center;
color: #1f2329;
line-height: 1.5;
}
}
.popup-btn {
.popup-btn {
background-color: #2563eb;
color: white;
border: none;
@@ -839,14 +840,14 @@
font-weight: 500;
transition: all 0.2s ease;
width: 100%;
}
}
.popup-btn:hover {
.popup-btn:hover {
background-color: #1d4ed8;
}
}
/* 响应式调整 */
@media (min-width: 768px) {
/* 响应式调整 */
@media (min-width: 768px) {
.info-grid {
grid-template-columns: 1fr 1fr;
gap: 20px;
@@ -855,9 +856,9 @@
.qr-container {
max-width: 400px;
}
}
}
@media (max-width: 375px) {
@media (max-width: 375px) {
.navbar {
padding: 14px 18px;
}
@@ -882,5 +883,5 @@
.btn-text {
margin-left: 6px;
}
}
}
</style>

44
pages/sys/user/index.vue
View File

@@ -7,31 +7,31 @@
<u-avatar size="100" src="/static/aidex/images/user01.png"></u-avatar>
</view>
<view class="info" style="display: flex;justify-content: space-between;">
<view>
<view class="username">管理员</view>
<view class="usercode">普通会员</view>
</view>
<!-- <view>-->
<!-- <view class="username">管理员</view>-->
<!-- <view class="usercode">普通会员</view>-->
<!-- </view>-->
<view class="sign-in-images"><image src="/static/aidex/images/sign-in.png"></image></view>
</view>
</view>
<u-row class="userinfo-topbox" gutter="16" justify="center">
<u-col span="4" text-align="center">
<view class="number">9,999<em>元</em></view>
<view>余额</view>
</u-col>
<u-col span="4" text-align="center" @click="navTo('/pages/sys/application/recharge')">
<view><u-icon size="28px" color="#ffffff" name="rmb-circle"></u-icon></view>
<view>充值</view>
</u-col>
<u-col span="4" text-align="center" @click="navTo('/pages/sys/application/balance-details')">
<view>
<view class="iconfont icon-faan" style="font-size: 24px;color:#ffffff;"></view>
<!-- <u-row class="userinfo-topbox" gutter="16" justify="center">-->
<!-- <u-col span="4" text-align="center">-->
<!-- <view class="number">9,999<em>元</em></view>-->
<!-- <view>余额</view>-->
<!-- </u-col>-->
<!-- <u-col span="4" text-align="center" @click="navTo('/pages/sys/application/recharge')">-->
<!-- <view><u-icon size="28px" color="#ffffff" name="rmb-circle"></u-icon></view>-->
<!-- <view>充值</view>-->
<!-- </u-col>-->
<!-- <u-col span="4" text-align="center" @click="navTo('/pages/sys/application/balance-details')">-->
<!-- <view>-->
<!-- <view class="iconfont icon-faan" style="font-size: 24px;color:#ffffff;"></view>-->
<!-- </view>-->
<!-- <view>余额明细</view>-->
<!-- </u-col>-->
<!-- </u-row>-->
</view>
<view>余额明细</view>
</u-col>
</u-row>
</view>
<view class="list">
<!-- <view class="list">
<view>
<u-cell-group class="personal-list">
<u-gap height="20" bg-color="#f5f5f5"></u-gap>
@@ -45,7 +45,7 @@
<u-cell-item icon="setting" :iconStyle="{ color: '#2767dc' }" title="系统设置" @click="navTo('setting')"></u-cell-item>
</u-cell-group>
</view>
</view>
</view> -->
<view class="button-wrapper">
<button class="logout-btn" @click="logout">退出登录</button>
</view>

55
pages/sys/work/work.vue
View File

@@ -2,15 +2,15 @@
<view class="container">
<!-- 筛选及搜索区域 -->
<view class="search-bar">
<input v-model="searchParams.visitorName" class="search-input" placeholder="访客姓名" />
<input v-model="searchParams.visitedPerson" class="search-input" placeholder="被访人" />
<input v-model="searchParams.visitedUnit" class="search-input" placeholder="被访单位" />
<picker mode="selector" :range="statusOptions" @change="onStatusChange">
<input v-model="searchParams.visitorName" class="search-input" placeholder="访客姓名"/>
<input v-model="searchParams.visitedPerson" class="search-input" placeholder="被访人"/>
<input v-model="searchParams.visitedUnit" class="search-input" placeholder="被访单位"/>
<!-- <picker mode="selector" :range="statusOptions" @change="onStatusChange">
<view class="picker-view">
{{ searchParams.bookStatus || '预约状态' }}
</view>
</picker>
<input v-model="searchParams.phoneSuffix" class="search-input" placeholder="手机号后四位" />
</picker> -->
<input v-model="searchParams.phoneSuffix" class="search-input" placeholder="手机号后四位"/>
<button class="search-btn" @click="handleSearch">搜索</button>
<button class="reset-btn" @click="handleReset">重置</button>
</view>
@@ -27,10 +27,10 @@
<view class="table-cell">被访单位</view>
<view class="table-cell">拜访事由</view>
<view class="table-cell">拜访时间</view>
<view class="table-cell">是否预约车位</view>
<view class="table-cell">预约状态</view>
<!-- <view class="table-cell">是否预约车位</view>
<view class="table-cell">预约状态</view> -->
<view class="table-cell">提交时间</view>
<view class="table-cell">操作</view>
<!-- <view class="table-cell">操作</view> -->
</view>
<view v-for="(item, index) in filteredList" :key="index" class="table-row">
<view class="table-cell">{{ index + 1 }}</view>
@@ -42,15 +42,15 @@
<view class="table-cell">{{ item.interviewedUnit || '无' }}</view>
<view class="table-cell">{{ item.visitingReason }}</view>
<view class="table-cell">{{ item.visitingBeginTime }}</view>
<view class="table-cell">{{ item.bookingParkingSpace === 1 ? '是' : '否' }}</view>
<!-- <view class="table-cell">{{ item.bookingParkingSpace === 1 ? '是' : '否' }}</view>
<view class="table-cell" :class="{'status-confirm': item.serveStatus === 1, 'status-wait': item.serveStatus === 0}">
{{ item.serveStatus === 1 ? '已确认' : '待确认' }}
</view>
</view> -->
<view class="table-cell">{{ item.createTime }}</view>
<view class="table-cell operation-cell">
<!-- <view class="table-cell operation-cell">
<button class="operation-btn" @click="handleDetail(item)">详情</button>
<button class="operation-btn" @click="handleAudit(item)">确认</button>
</view>
</view> -->
</view>
</view>
<VisitorDetailModal
@@ -65,6 +65,7 @@
<script>
import VisitorDetailModal from '@/components/VisitorDetailModal.vue';
export default {
components: {
VisitorDetailModal
@@ -92,7 +93,7 @@ export default {
if (this.searchParams.visitedPerson && !item.interviewedPerson.includes(this.searchParams.visitedPerson)) return false;
if (this.searchParams.visitedUnit && !item.interviewedUnit.includes(this.searchParams.visitedUnit)) return false;
if (this.searchParams.bookStatus) {
const statusMap = { '已确认': 1, '待确认': 0 };
const statusMap = {'已确认': 1, '待确认': 0};
return item.serveStatus === statusMap[this.searchParams.bookStatus];
}
if (this.searchParams.phoneSuffix) {
@@ -119,10 +120,10 @@ export default {
this.showDetailModal = false;
},
handleAudit(item) {
console.log("eee",item)
console.log("eee", item)
this.loading = true;
item.serveStatus=1
this.$u.api.spfk(item).then(res=>{
item.serveStatus = 1
this.$u.api.spfk(item).then(res => {
console.log(res)
})
},
@@ -136,7 +137,7 @@ export default {
this.tableData = res.rows;
}).catch(err => {
console.error('获取数据失败：', err);
uni.showToast({ title: '获取数据失败', icon: 'none' });
uni.showToast({title: '获取数据失败', icon: 'none'});
});
},
onStatusChange(e) {
@@ -169,12 +170,14 @@ export default {
.container {
padding: 10px;
}
.search-bar {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 10px;
}
.search-input {
flex: 1;
min-width: 120px;
@@ -182,6 +185,7 @@ export default {
border: 1px solid #ddd;
border-radius: 4px;
}
.picker-view {
padding: 8px;
border: 1px solid #ddd;
@@ -189,34 +193,44 @@ export default {
min-width: 120px;
text-align: center;
}
.search-btn,
.reset-btn {
padding: 8px 15px;
border-radius: 4px;
color: #fff;
height: 40px;
text-align: center;
line-height: 24px;
}
.search-btn {
background-color: #007aff;
border: none;
}
.reset-btn {
background-color: #f0f0f0;
color: #333;
border: none;
}
.table-wrap {
overflow-x: auto;
}
.table-header,
.table-row {
display: flex;
flex-direction: row;
border: 1px solid #eee;
}
.table-header {
background-color: #f8f8f8;
font-weight: bold;
}
.table-cell {
flex: 1;
text-align: center;
@@ -226,22 +240,27 @@ export default {
text-overflow: ellipsis;
white-space: nowrap;
}
.table-cell:last-child {
border-right: none;
}
.operation-cell {
display: flex;
justify-content: space-around;
flex: 2;
}
.operation-btn {
margin: 0 5px;
padding: 5px 10px;
font-size: 12px;
}
.status-confirm {
color: #52c41a;
}
.status-wait {
color: #fa8c16;
}

BIN
static/aidex/login/ic_login_pwd.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
static/aidex/login/ic_login_user.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.8 KiB