yangjl/sh-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

登录界面优化

Browse Source
This commit is contained in:
杨家亮
2026-06-18 15:10:50 +08:00
parent d7461853cf
commit 8041f5734b
16 changed files with 1844 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/index/index.vue
+152 -88
View File
@@ -19,95 +19,99 @@
<text>待办</text>
</view>
</view>
<view class="home-hj">
<view class="hj-content">
<view class="hj-row">
<view class="hj-cell">
<text class="hj-label">工厂焊接一次合格率</text>
<text class="hj-value">{{ hjIndexData?.GCFirstPassRate|| '--'}}</text>
<scroll-view class="home-scroll" scroll-y>
<view class="home-hj">
<view class="hj-content">
<view class="hj-row">
<view class="hj-cell">
<text class="hj-label">工厂焊接一次合格率</text>
<text class="hj-value">{{ hjIndexData?.GCFirstPassRate|| '--'}}</text>
</view>
<view class="hj-cell">
<text class="hj-label">现场焊接一次合格率</text>
<text class="hj-value">{{ hjIndexData?.XCFirstPassRate || '--' }}</text>
</view>
</view>
<view class="hj-cell">
<text class="hj-label">现场焊接一次合格率</text>
<text class="hj-value">{{ hjIndexData?.XCFirstPassRate || '--' }}</text>
<view class="hj-row">
<view class="hj-cell">
<text class="hj-label">工厂预制进度</text>
<text class="hj-value hj-sub">{{ hjIndexData?.GCProgress|| '--' }}</text>
</view>
<view class="hj-cell">
<text class="hj-label">现场焊接进度</text>
<text class="hj-value hj-sub">{{ hjIndexData?.XCProgress || '--'}}</text>
</view>
</view>
<view class="hj-row">
<view class="hj-cell">
<text class="hj-label">工厂焊工功效</text>
<text class="hj-value">{{ hjIndexData?.GCWelderEfficacy || '--'}}</text>
</view>
<view class="hj-cell">
<text class="hj-label">现场焊接功效</text>
<text class="hj-value">{{ hjIndexData?.XCWelderEfficacy || '--'}}</text>
</view>
</view>
</view>
<view class="hj-row">
<view class="hj-cell">
<text class="hj-label">工厂预制进度</text>
<text class="hj-value hj-sub">{{ hjIndexData?.GCProgress|| '--' }}</text>
</view>
<view class="hj-cell">
<text class="hj-label">现场焊接进度</text>
<text class="hj-value hj-sub">{{ hjIndexData?.XCProgress || '--'}}</text>
</view>
</view>
<view class="hj-row">
<view class="hj-cell">
<text class="hj-label">工厂焊工功效</text>
<text class="hj-value">{{ hjIndexData?.GCWelderEfficacy || '--'}}</text>
</view>
<view class="hj-cell">
<text class="hj-label">现场焊接功效</text>
<text class="hj-value">{{ hjIndexData?.XCWelderEfficacy || '--'}}</text>
</view>
<view class="hj-footer">
<text class="hj-footer-label">项目管道实时预制率 (包含工厂和现场的预制口)</text>
<text class="hj-footer-value">{{ hjIndexData?.PipePrefabricationRate || '--'}}</text>
</view>
</view>
<view class="hj-footer">
<text class="hj-footer-label">项目管道实时预制率 (包含工厂和现场的预制口)</text>
<text class="hj-footer-value">{{ hjIndexData?.PipePrefabricationRate || '--'}}</text>
</view>
</view>
<!-- 快捷应用 -->
<view class="section-card home-quick">
<view class="section-title">
<view class="title-left">
<text class="title-line"></text>
<text>快捷应用</text>
</view>
<u-icon class="edit-btn" name="edit-pen" :size="32" color="#999" @click="openEditQuick" />
</view>
<view class="section-grid">
<view class="grid-item" v-for="(item, idx) in quickApps" :key="idx" @click="handleSkip(item)">
<view class="icon-box">
<u-icon :name="item.icon" :size="56" :custom-prefix='item.prefix'
:color="pastelColors[idx % 6]" />
<!-- 快捷应用 -->
<view class="section-card home-quick">
<view class="section-title">
<view class="title-left">
<text class="title-line"></text>
<text>快捷应用</text>
</view>
<text class="item-label">{{ item.name }}</text>
<u-icon class="edit-btn" name="edit-pen" :size="32" color="#999" @click="openEditQuick" />
</view>
<view v-if="quickApps.length === 0" class="empty-tip">请选择应用</view>
</view>
</view>
<!-- 业务查询 -->
<view class="section-card home-query" v-if="queryApps && queryApps.length > 0">
<view class="section-title">
<view class="title-left">
<text class="title-line"></text>
<text>业务查询</text>
</view>
</view>
<view class="section-grid">
<view class="grid-item" v-for="(item, idx) in queryApps" :key="idx" @click="handleSkip(item)">
<view class="icon-box">
<u-icon :name="item.icon" :custom-prefix='item.prefix' :size="56"
:color="pastelColors[idx % 6]" />
<view class="section-grid">
<view class="grid-item" v-for="(item, idx) in quickApps" :key="idx" @click="handleSkip(item)">
<view class="icon-box">
<u-icon :name="item.icon" :size="56" :custom-prefix='item.prefix'
:color="pastelColors[idx % 6]" />
</view>
<text class="item-label">{{ item.name }}</text>
</view>
<text class="item-label">{{ item.name }}</text>
<view v-if="quickApps.length === 0" class="empty-tip">请选择应用</view>
</view>
</view>
</view>
<!-- 业务查询 -->
<view class="section-card home-query" v-if="queryApps && queryApps.length > 0">
<view class="section-title">
<view class="title-left">
<text class="title-line"></text>
<text>业务查询</text>
</view>
</view>
<view class="section-grid">
<view class="grid-item" v-for="(item, idx) in queryApps" :key="idx" @click="handleSkip(item)">
<view class="icon-box">
<u-icon :name="item.icon" :custom-prefix='item.prefix' :size="56"
:color="pastelColors[idx % 6]" />
</view>
<text class="item-label">{{ item.name }}</text>
</view>
</view>
</view>
</scroll-view>
<!-- 编辑快捷应用弹窗 -->
<u-popup v-model="showEditQuick" mode="bottom" height="70%">
<u-popup v-model="showEditQuick" mode="bottom" height="75%">
<view class="edit-quick">
<view class="edit-title">
<text>选择快捷应用</text>
</view>
<view class="edit-grid">
<view v-for="(item, idx) in editCache" :key="idx" class="edit-item"
<view class="edit-search">
<u-icon name="search" :size="28" color="#999" />
<input class="edit-search__input" v-model="keyword" placeholder="搜索应用名称" confirm-type="search" />
</view>
<scroll-view class="edit-grid" scroll-y>
<view v-for="(item, idx) in filteredEditCache" :key="idx" class="edit-item"
:class="{ active: item.selected }" @click="toggleSelect(item)">
<view class="icon-box">
<u-icon :name="item.icon" :size="48" :custom-prefix='item.prefix'
@@ -118,7 +122,10 @@
<u-icon name="checkmark" :size="24" color="#fff" />
</view>
</view>
</view>
<view v-if="filteredEditCache.length === 0" class="edit-empty">
<text>没有匹配的应用</text>
</view>
</scroll-view>
<view class="edit-btns">
<u-button size="medium" class="btn-cancel" @click="showEditQuick = false">取消</u-button>
<u-button size="medium" class="btn-confirm" type="primary" @click="handleConfirmEdit">确定</u-button>
@@ -151,8 +158,11 @@
} from 'pinia';
import {
scanToSkipUrl
parseScanResult
} from '@/utils/scanUtils.js'
import {
getUrlParam
} from '@/utils/request.js'
const userStore = useUserStore()
const menuStore = useMenuStore()
@@ -180,14 +190,17 @@
const projectNameKeyword = ref('')
const showProject = ref(false)
const showEditQuick = ref(false)
const keyword = ref('')
const currentProjectName = computed(() => currentProject.value?.ProjectName || '')
const handleSkipByPath = (path)=>{
uni.navigateTo({
url: path
})
}
// 搜索过滤后的编辑列表
const filteredEditCache = computed(() => {
const kw = keyword.value.trim().toLowerCase()
if (!kw) return editCache.value
return editCache.value.filter(item => item.name.toLowerCase().includes(kw))
})
const handleSkip = (item) => {
if (!currentProject.value.ProjectId) {
handleShowProjectSelect()
@@ -197,6 +210,10 @@
})
return
}
if (item.isScan) {
handleMenuScan(item.path)
return
}
uni.navigateTo({
url: item.path
})
@@ -205,6 +222,7 @@
// 打开编辑弹窗
const openEditQuick = () => {
menuStore.openEdit()
keyword.value = ''
showEditQuick.value = true
}
@@ -243,23 +261,69 @@
projectNameKeyword.value = keyword
}
/**
* 菜单扫一扫
*/
const handleMenuScan = (path) => {
wx.scanCode({
scanType: ['datamatrix', 'barCode', 'qrCode', 'wxCode', 'pdf417'],
success(res) {
// 获取路径给的ID
let id = getUrlParam(res.result, 'id')
uni.navigateTo({
url: path + (id ? `?id=${id}` : '')
})
},
fail(err) {
console.log(err)
uni.showToast({
title: '扫码失败，请重试',
icon: 'none'
})
}
})
}
/**
* 扫一扫
*/
const handleScan = () => {
uni.scanCode({
// 调起条码扫描
wx.scanCode({
scanType: ['datamatrix', 'barCode', 'qrCode', 'wxCode', 'pdf417'],
success(res) {
console.log('扫码结果:', res)
const result = res.result || ''
const url = scanToSkipUrl(result)
if (url) {
uni.navigateTo({ url })
} else {
uni.showToast({ title: '无法识别的二维码/条形码', icon: 'none' })
console.log('扫码结果==>', res)
if (res.scanType != 'QR_CODE') {
uni.navigateTo({
url: '/scanpages/hj/materials_detail?id=' + res.result
})
}
if (res.scanType == 'QR_CODE') {
const result = res.result || ''
// 优先按 URL 规则解析（焊接接头等）
const parsed = parseScanResult(result)
if (parsed) {
uni.navigateTo({
url: `${parsed.path}?${parsed.query}`
})
return
}else{
uni.showToast({
title: '无对应业务',
icon: 'none'
})
}
}
},
fail(err) {
console.error('扫码失败:', err)
console.log(err)
uni.showToast({
title: '扫码失败，请重试',
icon: 'none'
})
}
})
}
pages/login/index.vue
+28 -19
View File
@@ -1,26 +1,35 @@
<template>
<view class="wrap login">
<view class="sys-name">
施工管理系统
<!-- 顶部：背景图 -->
<view class="login-header">
<image class="login-header__bg" src="/static/images/bg.jpg" mode="widthFix" />
</view>
<view class="login-form">
<u-form :model="form" ref="uFormRef">
<u-form-item prop="account" >
<template #leftIcon>
<u-icon name="account" size="32" />
</template>
<u-input v-model="loginForm.account" placeholder="请输入账号" /></u-form-item>
<u-form-item prop="password">
<template #leftIcon>
<u-icon name="lock" size="32" />
</template>
<u-input v-model="loginForm.password" type="password" :password-icon="true" placeholder="请输入密码" />
</u-form-item>
<view class="u-margin-top-60">
<u-button type="primary" :loading="loading" @click="fetchLogin">登录</u-button>
</view>
</u-form>
<!-- 登录表单卡片 -->
<view class="login-card">
<view class="login-card__brand">
<image class="login-logo" src="/static/images/logo.png" mode="aspectFit" />
<view class="sys-name">管道安装管理系统</view>
</view>
<view class="login-form">
<u-form :model="form" ref="uFormRef">
<u-form-item prop="account">
<template #leftIcon>
<u-icon name="account" size="32" color="#2979ff" />
</template>
<u-input v-model="loginForm.account" placeholder="请输入账号" />
</u-form-item>
<u-form-item prop="password">
<template #leftIcon>
<u-icon name="lock" size="32" color="#2979ff" />
</template>
<u-input v-model="loginForm.password" type="password" :password-icon="true" placeholder="请输入密码" />
</u-form-item>
<view class="u-margin-top-60">
<u-button type="primary" :loading="loading" @click="fetchLogin">登录</u-button>
</view>
</u-form>
</view>
</view>
</view>
</template>