zhang_li
9 months ago
4 changed files with 536 additions and 17 deletions
@ -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' |
|||
}) |
|||
} |
@ -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> |
@ -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> |
Loading…
Reference in new issue