storevisit-ui-mobile/src/views/home/hintTabPage.vue

<template>
  <div class="hintTabPage">
    <div class="itemTab">
      <div class="itemTitle">拜访(实时)</div>
      <van-row>
        <van-col span="6">
          <span class="label">可控店：</span>
        </van-col>
        <van-col span="12">
          <span class="label">本月拜访率：</span>
          <span>90%</span>
        </van-col>
        <van-col span="6" style="color: red">
          <span class="label">未拜访：</span>
          <span>2家</span>
        </van-col>
      </van-row>
      <van-row>
        <van-col span="6">
          <span class="label">金牌店：</span>
        </van-col>
        <van-col span="12">
          <span class="label">本月拜访率：</span>
          <span>90%</span>
        </van-col>
        <van-col span="6" style="color: red">
          <span class="label">未拜访：</span>
          <span>2家</span>
        </van-col>
      </van-row>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {};
  },
};
</script>
<style lang="scss" scoped>
.hintTabPage {
  padding: 10px;
  .itemTab {
    background: #fff;
    padding: 10px;
    margin-bottom: 10px;
    .itemTitle {
      color: #1e5398;
      font-weight: 500;
      font-size: 16px;
      padding: 10px 0;
    }
    .van-row {
      font-size: 14px;
      color: #666;
      padding: 5px 0;
    }
  }
}
</style>