eam
/
eam-pda
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

首页登录

master
zhang_li 7 months ago
parent
fc1cc4abf2
commit
5fcfd0f8da
4 changed files with 536 additions and 17 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 15
      api/index.js
  2. 16
      api/login.js
  3. 307
      pages/index.vue
  4. 215
      pages/login.vue

15
api/index.js
View File

@ -0,0 +1,15 @@
import request from '@/utils/request'
// 获取首页数量信息
export function getCounts() {
return request({
url: '/eam/device-accounts/getCounts',
'method': 'GET'
})
}
// 获取首页代办信息
export function getToDoCountsByUser() {
return request({
url: '/eam/device-accounts/getToDoCountsByUser',
'method': 'GET'
})
}

16
api/login.js
View File

@ -1,11 +1,15 @@
import request from '@/utils/request'
// 登录方法
export function login(username, password, captchaVerification) {
export function login(username, password, captchaVerification,tenantName,rememberMe,code,uuid) {
const data = {
username,
password,
captchaVerification
captchaVerification,
tenantName,
rememberMe,
code,
uuid,
}
return request({
url: '/system/auth/login',
@ -19,12 +23,18 @@ export function login(username, password, captchaVerification) {
// 获取用户详细信息
export function getInfo() {
return request({
url: '/system/user/profile/get',
'method': 'GET'
})
}
// 获取权限
export function getPermissionInfo() {
return request({
url: '/system/auth/get-permission-info',
'method': 'GET'
})
}
// 退出方法
export function logout() {
return request({

307
pages/index.vue
View File

@ -1,24 +1,309 @@
<template>
<view class="index-content">
1
<u-navbar back-icon-color='#fff' back-icon-name=''
:background="{ background: 'rgba(64, 158,255,'+bgOpacity+')'}" back-text="" title-color='#fff'
:immersive='true' :border-bottom='false' title="首页">
<!-- <template v-slot:right>
<u-icon name="bell" color="#fff" size="36" style="padding-right: 30rpx;"
@click="open('/pages/notaic/index')"></u-icon>
</template> -->
</u-navbar>
<view class="top">
<image src="../static/images/mobile_bg.png" class="bg" mode=""></image>
<view class="top-box">
<view class="number">
<view class="number-item">
<view>{{counts.allCount || 0}}</view>
<view>设备总数</view>
</view>
<view class="number-item">
<view>{{counts.breakDownCount || 0}}</view>
<view>故障中设备</view>
</view>
<view class="number-item">
<view>{{counts.repairCount || 0}}</view>
<view>已报修设备</view>
</view>
</view>
<view class="status">
<view class="status-item">
<view>{{counts1.gongdan || 0}}</view>
<view>待接单</view>
</view>
<view class="status-item">
<view>{{counts1.yanzheng || 0}}</view>
<view>待验证</view>
</view>
<view class="status-item">
<view>{{counts1.shenpi || 0}}</view>
<view>待审核</view>
</view>
</view>
</view>
</view>
<view class="box">
<view class="" v-if=" $store.state.user.classType == 'DEVICE' || $store.state.user.classType == 'TECH' || !$store.state.user.classType">
<view class="title">设备维护</view>
<u-row gutter="16" style="padding:0px 20rpx ;">
<u-col span="3">
<view class="icon-item" @click="open('/pages/deviceReport/index?type=DEVICE')">
<image src="../static/images/icon4.svg" mode=""></image>
<view>设备报修</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/repairOrder/index?type=DEVICE')">
<image src="../static/images/icon5.svg" mode=""></image>
<view>维修工单</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/overhaulOrder/index?type=DEVICE')">
<image src="../static/images/icon3.svg" mode=""></image>
<view>检修工单</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/spotCheckOrder/addForm?type=DEVICE')">
<image src="../static/images/icon2.svg" mode=""></image>
<view>点检工单</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/upkeepOrder/index?type=DEVICE')">
<image src="../static/images/icon1.svg" mode=""></image>
<view>保养工单</view>
</view>
</u-col>
</u-row>
</view>
<view class="" v-if="$store.state.user.classType == 'MOLD' ">
<view class="title">模具维护</view>
<u-row gutter="16">
<u-col span="3">
<view class="icon-item" @click="open('/pages/deviceReport/index?type=MOLD')">
<image src="../static/images/icon4.svg" mode=""></image>
<view>设备报修</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/repairOrder/index?type=MOLD')">
<image src="../static/images/icon5.svg" mode=""></image>
<view>维修工单</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/overhaulOrder/index?type=MOLD')">
<image src="../static/images/icon2.svg" mode=""></image>
<view>检修工单</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/maintenWorkOrderList/index')">
<image src="../static/images/icon1.svg" mode=""></image>
<view>保养工单</view>
</view>
</u-col>
</u-row>
</view>
<view class="title">备件管理</view>
<u-row gutter="16">
<u-col span="3" v-if=" $store.state.user.role == 'all_approve' || $store.state.user.role == 'normal_approve'">
<view class="icon-item" @click="open('/pages/sparePartsApplicationApprove/index')">
<image src="../static/images/icon6.png" mode=""></image>
<view>领用申请审批</view>
</view>
</u-col>
<u-col span="3" v-else>
<view class="icon-item" @click="open('/pages/sparePartsApplication/index')">
<image src="../static/images/icon6.png" mode=""></image>
<view>领用申请</view>
</view>
</u-col>
<u-col span="3">
<view class="icon-item" @click="open('/pages/sparePartsServiceWorkOrderList/addForm?type=DEVICE')">
<image src="../static/images/icon5.svg" mode=""></image>
<view>维修工单</view>
</view>
</u-col>
</u-row>
</view>
</view>
</template>
<script>
export default { data() {
return {
}
},
import {
getInfo
} from '@/api/login'
import {
getCounts,
getToDoCountsByUser
} from '@/api/index'
import {
getAccessToken
} from '@/utils/auth'
export default {
data() {
return {
bgOpacity: 0,
counts: '',
counts1: '',
}
},
methods: {
open(url) {
this.$tab.navigateTo(url)
},
getCounts() {
getCounts().then(res => {
this.counts = res.data
})
},
getToDoCountsByUser() {
getToDoCountsByUser().then(res => {
this.counts1 = res.data
})
},
},
onLoad: async function() {
if (getAccessToken()) {
this.getCounts()
this.getToDoCountsByUser()
}
console.log( this.$store.state)
},
onPageScroll(e) {
if (e.scrollTop > 0) {
this.bgOpacity = e.scrollTop / 200;
} else {
this.bgOpacity = 0
}
},
onLoad: function() {},
}
</script>
<style scoped lang="scss">
.index-content {
background-color: white;
min-height: 100vh;
}
.bg {
width: 100%;
}
.top {
position: relative;
image {
height: calc(var(--status-bar-height) + 410rpx);
}
}
.top-box {
position: absolute;
width: 100%;
bottom: 0px;
.number {
padding: 30rpx 80rpx 50rpx;
display: flex;
align-items: center;
justify-content: space-between;
.number-item {
text-align: center;
view {
&:nth-child(1) {
color: white;
font-size: 40rpx;
font-weight: bold;
}
&:nth-child(2) {
color: rgba(255, 255, 255, 0.7);
font-size: 28rpx;
margin-top: 10rpx;
}
}
}
}
.status {
margin: 0px 40rpx;
padding: 40rpx 0rpx;
background: white;
border-radius: 20rpx 20rpx 0px 0px;
display: flex;
align-items: center;
justify-content: space-between;
.status-item {
text-align: center;
position: relative;
flex: 1;
view {
&:nth-child(1) {
color: black;
font-size: 40rpx;
font-weight: bold;
}
&:nth-child(2) {
color: rgba(0, 0, 0, 0.5);
font-size: 28rpx;
margin-top: 10rpx;
}
}
&::after {
content: "";
border-right: 1px solid #dedede;
position: absolute;
height: 60rpx;
right: 0px;
top: 50%;
margin-top: -30rpx;
}
&:nth-last-child(1)::after {
border: none;
}
}
}
}
.box {
.title {
font-size: 32rpx;
font-weight: bold;
padding: 50rpx 50rpx 30rpx;
}
.icon-item {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
margin: 20rpx 0px;
image {
width: 80rpx;
height: 80rpx;
}
view {
margin-top: 20rpx;
color: #999999;
}
}
}
</style>

215
pages/login.vue
View File

@ -1,23 +1,232 @@
<template>
<view class="normal-login-container">
<view class="logo-img">
<u-icon name="close" size="40" class="icon" @click="$tab.reLaunch('/pages/index')"></u-icon>
<view class="logo-title">
<view>智慧设备管理综合系统</view>
<view>让设备管理更智能、更高效</view>
</view>
<image src="../static/images/banner/logo-banner.png" mode="widthFix"></image>
</view>
<view class="box">
<view class="box-shadow">
</view>
<view class="logo-content">
<text class="title">您好，欢迎登录</text>
</view>
<view class="login-form-content">
<view class="input-item-label">登录账号</view>
<view class="input-item flex align-center">
<input v-model="loginForm.username" class="input" type="text" placeholder="请输入账号" maxlength="30" />
</view>
<view class="input-item-label">登录密码</view>
<view class="input-item flex align-center">
<input v-model="loginForm.password" type="password" class="input" placeholder="请输入密码" maxlength="20" />
</view>
<view class="action-btn">
<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg ">登录</button>
</view>
</view>
<view class="xieyi text-center">
<text class="text-grey1">登录即代表同意</text>
<text @click="handleUserAgrement" class="text-blue">《用户协议》</text>
<text @click="handlePrivacy" class="text-blue">《隐私协议》</text>
</view>
</view>
</view>
</template>
<script>
import * as loginApi from "@/api/login"
export default {
name: 'Login',
data() {
return {
captchaEnabled: true, // 验证码开关 TODO 芋艿：需要抽到配置里
globalConfig: getApp().globalData.config,
loginForm: {
tenantName:"闻荫源码",
username: "admin",
password: "123456",
captchaVerification: "",
rememberMe:false,
code:'1',
uuid:"APP"
}
}
},
methods: {
// 隐私协议
handlePrivacy() {
let site = this.globalConfig.appInfo.agreements[0]
this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
},
// 用户协议
handleUserAgrement() {
let site = this.globalConfig.appInfo.agreements[1]
this.$tab.navigateTo(`/pages/common/webview/index?title=${site.title}&url=${site.url}`)
},
// 登录方法
async handleLogin(params) {
if (this.loginForm.username === "") {
this.$modal.msgError("请输入您的账号")
} else if (this.loginForm.password === "") {
this.$modal.msgError("请输入您的密码")
} else {
await this.pwdLogin({})
// 显示验证码
// if (this.captchaEnabled) {
// this.$refs.verify.show()
// } else { // 直接登录
// await this.pwdLogin({})
// }
}
},
// 密码登录
async pwdLogin(captchaParams) {
this.$modal.loading("登录中，请耐心等待...")
// 执行登录
this.$store.dispatch('Login', this.loginForm).then(async () => {
this.$modal.closeLoading()
await this.loginSuccess()
// this.$tab.reLaunch('/pages/index')
})
},
// 登录成功后，处理函数
async loginSuccess(result) {
// 设置用户信息
await this.$store.dispatch('GetPermissionInfo').then(res => {
// this.$tab.reLaunch('/pages/index')
})
await this.$store.dispatch('GetInfo').then(res => {
this.$tab.reLaunch('/pages/index')
})
}
}
}
</script>
<style lang="scss" scoped>
page {
background-color: #ffffff;
}
.normal-login-container {
width: 100%;
.logo-content {
width: 100%;
font-size: 40rpx;
padding: 50rpx 80rpx 0rpx;
.title {
font-weight: bold;
color: #000000;
}
}
.box{
position: relative;
}
.box-shadow{
box-shadow: 0px -10rpx 16rpx rgba(64, 158, 254, 0.5);
width: 100%;
position: absolute;
height: 30rpx;
border-radius: 30rpx 30rpx 0px 0px ;
}
.logo-img {
background-color: #fafcff;
height: calc(var(--status-bar-height) + 400rpx);
position: relative;
.icon{
position: absolute;
top: calc(var(--status-bar-height) + 20rpx);
left: 40rpx;
}
.logo-title{
position: absolute;
left: 50rpx;
top: calc(var(--status-bar-height) + 80rpx);
z-index: 11;
view{
&:nth-child(1){
color: #409eff;
font-weight: bold;
font-size: 36rpx;
}
&:nth-child(2){
color: #999999;
font-size: 24rpx;
}
}
}
image {
width: 75%;
display: block;
position: absolute;
bottom: 0px;
right: 0px;
}
}
.login-form-content {
margin: 40rpx auto;
width: 80%;
.input-item-label {
font-size: 30rpx;
// font-weight: bold;
color: #888888;
}
.input-item {
margin: 20rpx auto 40rpx;
border: 1px solid #E4E4E4;
padding: 0px 20rpx;
height: 90rpx;
.icon {
font-size: 38rpx;
margin-left: 20rpx;
color: #999;
}
.input {
width: 100%;
font-size: 28rpx;
line-height: 40rpx;
text-align: left;
}
}
.login-btn {
margin-top: 80rpx;
height: 80rpx;
background: #409eff;
color: white;
}
}
.xieyi {
color: #333;
margin-top: 40rpx;
font-size: 24rpx;
}
.easyinput {
width: 100%;
}
}
.login-code-img {
height: 90rpx;
}
</style>
Write Preview
Loading…
Cancel
Save