MTLargeScreen/src/components/record/restaurant/index copy.vue

<template>
    <van-row class="recordList">
      <van-row class="titleWrap">
        <span class="line"></span>
        <span class="title">餐饮管理</span>
      </van-row>
      <van-row class="type">
        <van-col span="11" class="bgc5">
          <van-row class="textTop">{{data.nowIncome || 0}}</van-row>
          <van-row class="textBottom">今日营业额(元)</van-row>
        </van-col>
        <van-col span="11" class="bgc6" offset="2">
          <van-row class="textTop">{{data.consumerNowNumber || 0}}</van-row>
          <van-row class="textBottom">今日销售人/次(份)</van-row>
        </van-col>
      </van-row>
      <van-row class="dishes">
        <van-col span="5" class="bgc7 left">
          <van-row class="text">最受欢迎菜品</van-row>
        </van-col>
        <van-col span="19" class="dishesList right" >
          <van-row class="one">
              <van-col span="4" class="img" >
                    <el-image
                    :src="img1"
                    ></el-image>
              </van-col>
              <!-- <van-col span="20" class="name" >{{data.countTheTopThree.length>0 ? 1 : "1111"}}<span class="color1 num">{{list[0].num}}份</span></van-col> -->
          </van-row>
           <van-row class="two">
              <van-col span="4" class="img" >
                    <el-image
                    :src="img2"
                    ></el-image>
              </van-col>
              <van-col span="20" class="name" >{{list[1].name}}<span class="color2 num">{{list[1].num}}份</span></van-col>
          </van-row>
           <van-row class="three">
              <van-col span="4" class="img" >
                    <el-image
                    :src="img3"
                    ></el-image>
              </van-col>
              <van-col span="20" class="name" >{{list[2].name}}<span class="color3 num">{{list[2].num}}份</span></van-col>
          </van-row>
        </van-col>
      </van-row>
      
    </van-row>
</template>
<script>
import { getWeekDate } from "@/assets/js/dataFormate.js";
import Cookies from "js-cookie";
export default {
  data() {
    return {
        img1:require('@/assets/image/组41@3x.png'),
        img2:require('@/assets/image/组41拷贝@3x.png'),
        img3:require('@/assets/image/组41拷贝2@3x.png'),
        list:[
          {name:"清炒时蔬",num:412},
          {name:"柠檬鸭",num:315},
          {name:"番茄炒蛋",num:267},
        ],
        num:[38155,15642],
        data:[]//真实数据
    };
  },
  created(){
    this.init()
    // if(getWeekDate() == "周一" || getWeekDate() == "周日"){
    //   this.list = [
    //     {name:"未营业",num:0},
    //     {name:"未营业",num:0},
    //     {name:"未营业",num:0},
    //   ]
    //   this.tapNo = true
    // }
    // if(getWeekDate() == "周六" || getWeekDate() == "周日"){
    //   this.num = [0,0]
    // }
  },
  mounted() {},
  methods: {
    init(){
      axios({
        method: 'get',
        url: 'https://smartpark.caih.com/zhcy/api/thirdparty/v1/open/getCanYinData',
        timeout: 100000,
      }).then(res =>{
        this.data = res.data.data
          console.log(res.data.data)
      }).catch(err =>{
      })
      // axios.post(`https://smartpark.caih.com/ykt/api/thirdparty/v1/open/getCanYinData`, 
      //   {
      //     "nonce": Cookies.get("nonce58"),
      //     "timestamp": Cookies.get("timestamp58"),
      //     "query": {
      //       "userNumber":Cookies.get("userId58"),
      //     }
      //   },
      //   {headers: {
      //       "XYTACCESSTOKEN":Cookies.get("token58")
      //     }
      //   }).then(res => {
      //       if(res?.data?.data?.content){
      //         this.adminList1 = res.data.data.content.slice(0,5)
      //         this.loading1 = false
      //       }else{
      //         this.loading1 = false
      //       }
      //     }).catch(err =>{
      //       Toast(err.response.data.message)
      //   })

    }



  },
};
</script>

<style lang="scss" scoped>
.dishes{
    font-size: 14px;
    margin-top:15px;
    .left{
        height:100px;
        border-radius: 6px;
        color:#fff;
        .text{
            width:50%;
            text-align: center;
            letter-spacing: 2px;
            display: block;
            line-height: 25px;
            margin: 0 auto; /*水平居中*/
            position: relative;
            top: 50%; /*偏移*/
            margin-top: -40px;
        }
    }
    .right{
        height:100px;
        border:1px solid #F0F0F0;
        .van-row{
            margin: -6px 0 15px 15px;
            .img{
                width:18px;
                vertical-align: middle;
            }
            .name{
                color:#000;
                margin-left:15px;
                margin-top:-2px;
                .num{
                    margin-left:15px;
                }
            }
        }
        .van-row:nth-child(1){
            margin-top:10px;
        }
    }
}
</style>