更新

MrShi

2025-03-12 69a1b3bf45738f048361ee4ccb6bdc64fce35720

 pda/pages/index/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,168 @@
<template>

  <view class="main_app">
      <view class="main_header">
         <view class="com">
            <!-- <image src="../../static/back.svg" class="back"></image> -->
         </view>
         <view class="title">调度平台</view>
         <view class="com loginout" @click="loginout">退出登录</view>
      </view>

    <view class="main_content">
       <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>

  </view>

</template>



<script>

export default {

  data() {

    return {

      title: 'Hello'

    }

  },

  onLoad() {

      const token = uni.getStorageSync('token')
      if(!token){
         uni.redirectTo({
            url: '/pages/index/login'
         })
      }

  },

  methods: {
      loginout() {
         uni.showModal({
            title: '提示',
            content: '确认要退出登录吗',
            success: (res) => {
               if (res.confirm) {
                  uni.clearStorageSync({})
                  uni.redirectTo({
                     url: '/pages/index/login'
                  })
               } else if (res.cancel) {
                  console.log('用户点击取消');
               }
            }
         });
			
      },

    jump(path) {

      uni.navigateTo({

        url: path

      })

    },

  }

}

</script>

<style lang="scss">
   .main_header{
      width: 100%;
      height: 176rpx;
      padding: 88rpx 30rpx 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      background-color: $uni-color-primary;
      color: #fff;
      .com{
         width: 200rpx;
         display: flex;
         align-items: center;
      }
      .back{
         width: 42rpx;
         height: 42rpx;
      }
      .title{
         font-weight: 500;
         font-size: 36rpx;
      }
      .loginout{
         justify-content: flex-end;
      }
   }

.main_app {

  min-height: 100vh;

  background: #f7f7f7;
   padding: 0;
   .main_content{
      padding: 30rpx;
   }

  .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>