template-parking-h5/src/pages/parkingFee/parkingFeePayment.vue

<template>
  <scroll-view :class="['box', theme]">
    <div>
      <img
        :src="require('./static/images/no-car.png')" />
      <div class="carno">{{carno | formatCarno}}</div>
      <div class="msg">{{msg}}</div>
      <div class="searchPrice" @click="search">重新查询</div>
    </div>
  </scroll-view>
</template>

<script>
import parkingFeePaymentJs from './mixins/parkingFeePayment'
import baseMixins from './mixins/base'
export default {
  mixins:[baseMixins, parkingFeePaymentJs]
}
</script>

<style lang="less" scoped>

.box {
  text-align: center;
  background-color: #F4F7FF;
  opacity: 1;

  img {
    width: 80%;
    // height: 200px;
    margin-top: 200px;
  }

  div {
    margin-top: 20px;
  }

  .carno {
    font-size: 46px;
    font-weight: 500;
    color: #333333;
    line-height: 65px;
  }

  .msg {
    font-size: 36px;
    font-weight: 400;
    color: #919BAA;
    line-height: 36px;
  }

  .searchPrice {
    color: #fff !important;
    margin: 0 auto;
    margin-top: 40px;
    height: 90px;
    width: 80%;
    line-height: 90px;
    // border-radius: 80px;
    // font-size: 17px;
    // background-image: linear-gradient(to right, #7e4fa1, #433c7f);

    background-color: var(--k-color-primary);
    border-radius: 45px;
    font-size: 34px;
    font-weight: 400;
  }

  // .blueSearchPrice {
  // 	.colorSearchPrice('blue');
  // }

  // .greenSearchPrice {
  // 	.colorSearchPrice('green');
  // }

  // .colorSearchPrice(@value) {
  // 	@color: 'color-@{value}';
  // 	background-image: none;
  // 	background-color: @@color;
  // }
}
</style>