171 lines
3.6 KiB
Vue
171 lines
3.6 KiB
Vue
<template>
|
|
<view class="container">
|
|
<image src="/static/banner.jpg" mode="widthFix" style="width:100%"></image>
|
|
<uni-section :title="welTitle" type="circle" titleFontSize="15px" titleColor="#0000CD"
|
|
@click="goUserInfo">
|
|
<template v-slot:right>
|
|
<span style="color:gray">{{currentDate}}</span>
|
|
</template>
|
|
</uni-section>
|
|
<uni-section title="功能入口" type="line">
|
|
<uni-grid :column="4" :show-border="false" :square="false">
|
|
<uni-grid-item v-for="(item ,index) in moduleList" :index="index" :key="index">
|
|
<view class="grid-item-box" @click="pageEnter(item)">
|
|
<image class="image" :src="item.url" mode="aspectFill" />
|
|
<text class="text">{{item.text}}</text>
|
|
<view v-if="item.badge" class="grid-dot">
|
|
<uni-badge :text="item.badge" :type="item.type" />
|
|
</view>
|
|
</view>
|
|
</uni-grid-item>
|
|
</uni-grid>
|
|
</uni-section>
|
|
<view style="height: 12rpx;"></view>
|
|
<uni-row :gutter="12">
|
|
<uni-col :span="12">
|
|
<navigator class="middleNavigator" url="../wf/index?category=duty">
|
|
<span>待办</span>
|
|
<span class="numSpan">3</span>
|
|
</navigator>
|
|
</uni-col>
|
|
<uni-col :span="12">
|
|
<navigator class="middleNavigator" url="../wf/index?category=owner">
|
|
<span>我的</span>
|
|
<span class="numSpan">3</span>
|
|
</navigator>
|
|
</uni-col>
|
|
</uni-row>
|
|
<view style="height: 12rpx;"></view>
|
|
<uni-section title="列表信息" type="line">
|
|
<uni-list>
|
|
<uni-list-item v-for="(item ,index) in moduleList" :index="index" :key="index" :title="item.text">
|
|
|
|
</uni-list-item>
|
|
</uni-list>
|
|
</uni-section>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import tool from "../../utils/tools.js";
|
|
export default {
|
|
data() {
|
|
return {
|
|
welTitle: "",
|
|
currentDate: tool.getTodayDate(),
|
|
moduleList: [{
|
|
navigate:'/pages/ofm/booking',
|
|
url: '/static/yuding.png',
|
|
text: '预定会议室',
|
|
type: "primary",
|
|
},
|
|
{
|
|
navigate:'/pages/ofm/bookingRecord',
|
|
url: '/static/meetingRecord.png',
|
|
text: '历史预定',
|
|
type: "success"
|
|
},
|
|
{
|
|
navigate:'/pages/ofm/mroom',
|
|
url: '/static/huiyishi.png',
|
|
text: '会议室列表',
|
|
type: "warning"
|
|
},
|
|
{
|
|
url: '/static/renyuan.png',
|
|
text: '人员列表',
|
|
type: "error"
|
|
}
|
|
]
|
|
}
|
|
},
|
|
mounted() {
|
|
this.initWelTitle();
|
|
|
|
},
|
|
onShow() {
|
|
// #ifdef MP-WEIXIN
|
|
uni.hideHomeButton()
|
|
// #endif
|
|
},
|
|
methods: {
|
|
initWelTitle() {
|
|
let userInfo = uni.getStorageSync("userInfo")
|
|
let name = userInfo.name;
|
|
this.welTitle = `欢迎您, ${name}!`
|
|
},
|
|
goUserInfo() {
|
|
uni.navigateTo({
|
|
url: "/pages/system/userInfo"
|
|
})
|
|
},
|
|
pageEnter(item){
|
|
uni.navigateTo({
|
|
url:item.navigate
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss">
|
|
.image {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
padding: 10rpx;
|
|
border-radius: 30rpx;
|
|
background-color: #2979ff;
|
|
}
|
|
|
|
.text {
|
|
font-size: 14px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.grid-item-box {
|
|
flex: 1;
|
|
/* #ifndef APP-NVUE */
|
|
display: flex;
|
|
/* #endif */
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 15px 0;
|
|
}
|
|
|
|
.grid-dot {
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 15px;
|
|
}
|
|
.middleNavigator{
|
|
padding: 28rpx;
|
|
background-color: white;
|
|
display: flex;
|
|
justify-content : space-between;
|
|
}
|
|
.numSpan{
|
|
color: #2979ff;
|
|
font-size: 36rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.swiper {
|
|
height: 420px;
|
|
}
|
|
|
|
/* #ifdef H5 */
|
|
@media screen and (min-width: 768px) and (max-width: 1425px) {
|
|
.swiper {
|
|
height: 630px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1425px) {
|
|
.swiper {
|
|
height: 830px;
|
|
}
|
|
}
|
|
|
|
/* #endif */
|
|
</style>
|