aluminium-trading-uniapp-240925/pages/index/clearanceService.vue

<template>
  <view class="page">
    <view class="frame">
      <!--顶部导航栏-->
      <topbar showRight="0"></topbar>

      <!--内容区域-->
      <view class="content">

        <view class="bigImg">
          <!--换成后端后删除对应的图片-->
          <img src="../../static/image/clearanceService.png" alt="" style="width: 100%;height: 100%;">
        </view>
        <view class="smallImg">
          <!--换成后端后删除对应的图片-->
          <img src="../../static/image/1.png" alt="" style="width: 100%;height: 100%;">
        </view>
        <view class="ljsq">
          <span @click="applyClearanceService" class="text">
            {{ $t('components.applyNow') }}&nbsp;&nbsp;>>
          </span>
        </view>
      </view>
    </view>

    <!--底部导航栏-->
    <tabber select="2"/>
  </view>
</template>
<script>
import topbar from "@/components/base/topbar.vue";
import tabber from "@/components/base/tabbar.vue";

export default {
  name: "clearanceService",
  components: {tabber, topbar},
  data() {
    return {}
  },
  methods: {
    applyClearanceService(){
      uni.navigateTo({
        url: `/pages_order/auth/customsClearApply`
      })
    },
  },
}
</script>


<style scoped lang="scss">
.page {
  .frame {
    .content {
      height: calc(100vh - 120rpx - 120rpx);
      background-color: #2d384c;
      width: 100vw;

      .bigImg {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 90%;
        padding: 20rpx;
      }

      .smallImg {
        position: absolute;
        left: calc(50% - 80rpx);
        bottom: 350rpx;
        width: 160rpx;
        height: 160rpx;


      }

      .ljsq{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 300rpx;
        height: 70rpx;
        border-radius: 40rpx;
        color: #FFF;
        font-size: 28rpx;
        margin: 20rpx 10rpx 0 0;
        background: #FFF;
        border-radius: 40rpx;
        position: absolute;
        left: calc(50% - 150rpx);
        bottom: 550rpx;
        .text{
          color: #000;
          font-size: 38rpx;

        }
      }
    }
  }
}
</style>