jiangping
2024-06-28 43942a545271345ce26e40d82bb97138c5ea7611
pda/pages/index/index.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,108 @@
<template>
  <view class="main_app">
    <view class="banner">
      <image src="@/static/banner_diaodu@2x.png" mode=""></image>
    </view>
    <view class="module">
      <view class="item" @click="jump('/pages/index/center')">
        <image src="@/static/ic_yuetaidiaodu@2x.png" mode=""></image>
        <view class="text">月台调度中心</view>
      </view>
      <view class="item" @click="jump('/pages/index/queueup')">
        <image src="@/static/ic_cheliangpaidui@2x.png" mode=""></image>
        <view class="text">车队排队情况</view>
      </view>
      <view class="item" @click="jump('/pages/index/control')">
        <image src="@/static/ic_qiyong@2x.png" mode=""></image>
        <view class="text">月台启用停用</view>
      </view>
      <view class="item" @click="jump('/pages/index/set')">
        <image src="@/static/ic_peizhiyuetai@2x.png" mode=""></image>
        <view class="text">配置显示月台</view>
      </view>
    </view>
    <!-- footer -->
    <view class="main_footer">
      <image src="@/static/logo@2x.png" mode=""></image>
      <text>安徽安泰物流有限责任公司版权所有</text>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      title: 'Hello'
    }
  },
  onLoad() {
  },
  methods: {
    jump(path) {
      uni.navigateTo({
        url: path
      })
    },
  }
}
</script>
<style lang="scss">
.main_app {
  padding: 30rpx;
  min-height: 100vh;
  background: #f7f7f7;
  .banner {
    width: 100%;
    height: 270rpx;
    border-radius: 24rpx;
    margin-bottom: 40rpx;
    image {
      width: 100%;
      height: 100%;
    }
  }
  .module {
    display: flex;
    flex-wrap: wrap;
    .item {
      width: 336rpx;
      height: 290rpx;
      background: #ffffff;
      border-radius: 24rpx;
      margin-bottom: 20rpx;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      image {
        width: 112rpx;
        height: 112rpx;
        margin-bottom: 28rpx;
      }
      .text {
        font-weight: 500;
        font-size: 36rpx;
        color: #222222;
      }
      &:nth-of-type(2n) {
        margin-left: 18rpx;
      }
    }
  }
  .main_footer {
    width: 100%;
    position: fixed;
    bottom: 84rpx;
    display: flex;
    justify-content: center;
    font-size: 24rpx;
    color: #666666;
    image {
      width: 40rpx;
      height: 40rpx;
    }
  }
}
</style>