Q_D/APP

<script>
import apiAuth from "@/api/auth.js";
import apiStations from "@/api/stations";

export default {
  // 生命周期
  onLaunch: function () {
    console.log("App Launch");

    // 根据 token 获取用户信息
    const authToken = uni.getStorageSync("auth-token");
    if (authToken) {
      apiAuth
        .detail({ authToken })
        .then((res) => {
          this.$store.dispatch("updateAuth", { ...res.data, token: authToken });
        })
        .catch(() => {
          uni.removeStorageSync("auth-token");
        });
    }

    // 获取所有站点
    apiStations
      .get()
      .then((res) => this.$store.dispatch("updateStations", res.data))
      .catch(() => {});
  },
  onShow: function () {
    console.log("App Show");
  },
  onHide: function () {
    console.log("App Hide");
  },
};
</script>

<style lang="scss">
@import "uview-ui/index.scss";
@import "uview-ui/libs/css/flex.scss";

.u-flex-shrink-0 {
  flex-shrink: 0;
}

/* 间距 $spacers 在 uni.scss 中 */
@each $key, $val in $spacers {
  .mt-#{$key},
  .my-#{$key},
  .m-#{$key} {
    margin-top: $val;
  }
  .mb-#{$key},
  .my-#{$key},
  .m-#{$key} {
    margin-bottom: $val;
  }
  .ms-#{$key},
  .mx-#{$key},
  .m-#{$key} {
    margin-left: $val;
  }
  .me-#{$key},
  .mx-#{$key},
  .m-#{$key} {
    margin-right: $val;
  }
  .pt-#{$key},
  .py-#{$key},
  .p-#{$key} {
    padding-top: $val;
  }
  .pb-#{$key},
  .py-#{$key},
  .p-#{$key} {
    padding-bottom: $val;
  }
  .ps-#{$key},
  .px-#{$key},
  .p-#{$key} {
    padding-left: $val;
  }
  .pe-#{$key},
  .px-#{$key},
  .p-#{$key} {
    padding-right: $val;
  }

  .rounded-#{$key} {
    border-radius: $val;
  }
}
:root {
  @each $key, $val in $spacers {
    --space-#{$key}: #{$val};
    --rounded-#{$key}: #{$val};
  }
}

/* 颜色 $colors 在 uni.scss 中 */
@each $key, $val in $colors {
  .text-#{$key} {
    color: $val;
  }
}
:root {
  @each $key, $val in $colors {
    --color-#{$key}: #{$val};
  }
}

/* 每个页面公共css */
page {
  background-color: $u-bg-color; // uview-ui/theme.scss
}

.p-page {
  @extend .p-base;
}

.page-box-x-overflow {
  margin-left: calc(var(--space-base) * -1);
  margin-right: calc(var(--space-base) * -1);
}
.page-box-t-overflow {
  margin-top: calc(var(--space-base) * -1);
}

.page-box {
  @extend .bg-white, .rounded-sm;
}
.page-box + .page-box {
  @extend .mt-base;
}

.relative {
  position: relative;
}
.absolute {
  position: absolute;
}
.overflow-hidden {
  overflow: hidden;
}

.bg-white {
  background-color: #ffffff;
}

.fw-bold {
  font-weight: bold;
}

.text-center {
  text-align: center;
}
.text-end {
  text-align: end;
}

.w-100 {
  width: 100%;
}

.TrainItem {
  .OrderInfo {
    font-size: 14px;
    color: var(--color-info);
  }

  .Time {
    font-size: 18px;
    font-weight: bold;
  }
  .Station {
    font-size: 14px;
    color: var(--color-main);
  }

  .OptionItem {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: var(--space-base);
    padding-bottom: var(--space-base);
    color: var(--color-primary);
  }

  &.lg {
    .Time {
      font-size: 22px;
    }
    .Station {
      font-size: 15px;
    }
  }
}
</style>