xzzn/emsapp
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

工作栏

Browse Source
This commit is contained in:
白菜
2025-07-29 23:05:58 +08:00
parent 2b4022d1d0
commit ce9b4a4ca4
13 changed files with 2173 additions and 634 deletions
Download Patch File Download Diff File Expand all files Collapse all files

307
pages/work/index.vue
View File

@ -1,173 +1,134 @@
<template>
<view class="work-container">
<!-- 宫格组件 -->
<uni-section title="系统管理" type="line"></uni-section>
<view class="grid-body">
<uni-grid :column="4" :showBorder="false" @change="changeGrid">
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="person-filled" size="30"></uni-icons>
<text class="text">用户管理</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="staff-filled" size="30"></uni-icons>
<text class="text">角色管理</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="color" size="30"></uni-icons>
<text class="text">菜单管理</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="settings-filled" size="30"></uni-icons>
<text class="text">部门管理</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="heart-filled" size="30"></uni-icons>
<text class="text">岗位管理</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="bars" size="30"></uni-icons>
<text class="text">字典管理</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="gear-filled" size="30"></uni-icons>
<text class="text">参数设置</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="chat-filled" size="30"></uni-icons>
<text class="text">通知公告</text>
</view>
</uni-grid-item>
<uni-grid-item>
<view class="grid-item-box">
<uni-icons type="wallet-filled" size="30"></uni-icons>
<text class="text">日志管理</text>
</view>
</uni-grid-item>
</uni-grid>
</view>
</view>
</template>
<script>
export default {
data() {
return {
current: 0,
swiperDotIndex: 0,
data: [{
image: '/static/images/banner/banner01.jpg'
},
{
image: '/static/images/banner/banner02.jpg'
},
{
image: '/static/images/banner/banner03.jpg'
}
]
}
},
methods: {
clickBannerItem(item) {
console.info(item)
},
changeSwiper(e) {
this.current = e.detail.current
},
changeGrid(e) {
this.$modal.showToast('模块建设中~')
}
}
}
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #fff;
min-height: 100%;
height: auto;
}
view {
font-size: 14px;
line-height: inherit;
}
/* #endif */
.text {
text-align: center;
font-size: 26rpx;
margin-top: 10rpx;
}
.grid-item-box {
flex: 1;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
align-items: center;
justify-content: center;
padding: 15px 0;
}
.uni-margin-wrap {
width: 690rpx;
width: 100%;
;
}
.swiper {
height: 300rpx;
}
.swiper-box {
height: 150px;
}
.swiper-item {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
align-items: center;
color: #fff;
height: 300rpx;
line-height: 300rpx;
}
@media screen and (min-width: 500px) {
.uni-swiper-dot-box {
width: 400px;
/* #ifndef APP-NVUE */
margin: 0 auto;
/* #endif */
margin-top: 8px;
}
.image {
width: 100%;
}
}
</style>
<template>
<view class="work-container">
<!-- 站点选择列表 -->
<uni-section title="站点选择" type="line" titleFontSize='16px' class="uni-pa-5">
<uni-data-select :clear="false" v-model="siteId" :localdata="siteList"
@change="selectedSite"></uni-data-select>
</uni-section>
<!-- 菜单 -->
<!-- <uni-section title="工作台" type="line" titleFontSize='16px'></uni-section> -->
<view class="grid-body">
<uni-grid :column="4" :showBorder="false" @change="toDetail">
<uni-grid-item v-for="(item,index) in gridList" :index="index" :key="index+'work'">
<view class="grid-item-box">
<uni-icons :type="item.icon" size="30"></uni-icons>
<text class="text">{{item.text}}</text>
</view>
</uni-grid-item>
</uni-grid>
</view>
</view>
</template>
<script>
import {
getAllSites
} from '@/api/ems/site.js'
export default {
data() {
return {
siteList: [],
siteId: '', //选择的站点ID
gridList: [{
page: 'bmszl',
icon: 'map-filled',
text: 'BMS总览',
},
{
page: 'bmsdcc',
icon: 'map',
text: 'BMS电池簇',
},
{
page: 'pcs',
icon: 'flag-filled',
text: 'PCS',
},
{
page: 'db',
icon: 'smallcircle',
text: '电表',
},
{
page: 'dtdc',
icon: 'smallcircle-filled',
text: '单体电池',
}
]
}
},
methods: {
toDetail(e) {
const {
index
} = e.detail
this.$tab.navigateTo(`/pages/work/${this.gridList[index].page}/index?siteId=${this.siteId}`)
},
selectedSite(id) {
this.siteId = id
}
},
// 页面切换不会重新调用，如果希望每次切换页面都重新调接口，使用onShow
mounted() {
getAllSites().then(response => {
console.log('返回数据', response)
const data = response?.data || []
this.siteList = data.map(item => {
return {
text: item.siteName,
value: item.siteId,
id: item.id
}
})
// 设置默认展示的站点
data.length > 0 && (this.siteId = data[0].siteId)
})
}
}
</script>
<style lang="scss" scoped>
/* #ifndef APP-NVUE */
page {
display: flex;
flex-direction: column;
box-sizing: border-box;
background-color: #fff;
min-height: 100%;
height: auto;
}
view {
font-size: 14px;
line-height: inherit;
}
/* #endif */
.text {
text-align: center;
font-size: 26rpx;
margin-top: 10rpx;
}
.grid-item-box {
flex: 1;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
align-items: center;
justify-content: center;
padding: 15px 0;
}
.uni-margin-wrap {
width: 690rpx;
width: 100%;
;
}
@media screen and (min-width: 500px) {}
</style>