101 lines
1.8 KiB
Vue
101 lines
1.8 KiB
Vue
<template>
|
|
<view class="work-container">
|
|
<!-- 轮播图 -->
|
|
<u-swiper
|
|
:list="images"
|
|
indicator
|
|
indicatorMode="line"
|
|
circular
|
|
:height="`${windowWidth / 2.5}px`"
|
|
></u-swiper>
|
|
|
|
<!-- 宫格组件 -->
|
|
<view class="grid-body">
|
|
<u-grid
|
|
:border="false"
|
|
col="3"
|
|
@click="changeGrid"
|
|
>
|
|
<u-grid-item
|
|
v-for="(item, index) in baseList"
|
|
:key="index"
|
|
>
|
|
<view class="grid-item">
|
|
<view :class="'iconfont ' + item.icon + ' grid-icon'"></view>
|
|
<u--text :text="item.title" align="center" lineHeight="32px"></u--text>
|
|
</view>
|
|
</u-grid-item>
|
|
</u-grid>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
windowWidth: uni.getSystemInfoSync().windowWidth,
|
|
images: [
|
|
'https://ktianc.oss-cn-beijing.aliyuncs.com/kinit/system/banner/2022-11-14/1.jpg',
|
|
'/static/images/banner/banner03.jpg',
|
|
'/static/images/banner/banner03.jpg'
|
|
],
|
|
baseList: [
|
|
{
|
|
icon: 'icon-user1',
|
|
title: '用户管理'
|
|
},
|
|
{
|
|
icon: 'icon-users',
|
|
title: '角色管理'
|
|
},
|
|
{
|
|
icon: 'icon-caidan3',
|
|
title: '菜单管理'
|
|
},
|
|
{
|
|
icon: 'icon-shezhitianchong',
|
|
title: '系统配置'
|
|
},
|
|
{
|
|
icon: 'icon-changguizidian',
|
|
title: '字典管理'
|
|
},
|
|
{
|
|
icon: 'icon-rizhi',
|
|
title: '日志管理'
|
|
},
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
changeGrid(e) {
|
|
this.$modal.showToast('模块建设中~')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #fff;
|
|
min-height: 100%;
|
|
height: auto;
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss" scoped>
|
|
.grid-body {
|
|
margin-top: 60rpx;
|
|
|
|
.grid-item {
|
|
margin-bottom: 30rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.grid-icon {
|
|
font-size: 40rpx;
|
|
}
|
|
}
|
|
</style>
|