部分页面搭建配置等

shuishen

2021-07-29 af2cf237c9506f0cb9db8185c96e546bb9a73b63

 pages/dispatch/dispatch.vue

@@ -1,11 +1,85 @@
<template>
   <div>
      456
   </div>
   <view class="container">
      <view class="service-box">
         <u-grid :col="4" :border="false">
            <u-grid-item bg-color="transparent" v-for="(item, index) in serviceButton" :key="index" @click="goBusinessPage(item.url,index)">
               <view class="service-item">
                  <image :src="item.img" mode="widthFix" class="img"></image>
                  <view class="name">{{ item.name }}</view>
               </view>
            </u-grid-item>
         </u-grid>
      </view>
   </view>
</template>

<script>
   import {
      fakeServiceButton
   } from "@/api/mock/dispatch.js";
	
   export default {
      data() {
         return {
            dataList:[],
            serviceButton: []
         };
      },
      onLoad() {
			
      },
      onReachBottom() {
			
      },
      mounted() {
      },
      methods: {
         onLoad() {
            // 加载服务按钮数据
            fakeServiceButton().then(data => {
               this.serviceButton = data;
            });
         },
         //页面跳转
         goBusinessPage(url,index){
            uni.navigateTo({
               url:url
            })
         },	
      }
   };
</script>

<style>

<style lang="scss">
   .container {
      background-color: #f7f7f7;
      min-height: 100vh;
      overflow: hidden;
   }
   .service-box {
      background: #ffffff;
      border-radius: 20px 20px 20px 20px;
      margin: 30rpx 20rpx 0;
      padding: 0rpx 20rpx;

      .service-item {
         display: flex;
         flex-direction: column;
         justify-content: space-between;
         align-items: center;
         width: 100%;
         height: 120rpx;
         font-size: 26rpx;
         font-family: PingFang SC;
         font-weight: 500;
         color: #585b61;

         .img {
            width: 70rpx;
            height: auto;
         }
      }
   }
</style>