<template>
  <view class="sampleTable">
    <uni-nav-bar
      :fixed="true"
      background-color="rgba(214, 240, 255, 0.0)"
      status-bar
      rightWidth="300"
    >
      <block slot="left">
        <view class="" @click="back">
          <text class="iconfont icon-fanhui"></text
        ></view>
      </block>
    </uni-nav-bar>

    <view class="main">
      <!-- 占位---不可删除 -->
      <view class="seize-seat"> </view>

      <view class="container box-shaow-box">
        <view v-if="isJF" class="image-item top-image">
          <image
            src="@/static/img/add-img/jf_table.png"
            mode="widthFix"
          ></image>
        </view>

        <view v-else class="image-item top-image">
          <image
            src="@/static/img/add-img/jd_table.png"
            mode="widthFix"
          ></image>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      isJF: false,
    };
  },
  onNavigationBarButtonTap(val) {
    uni.navigateBack();
  },
  onLoad(options) {
    this.isJF = options.isJF == 1;
  },
  methods: {
    checkImage(val) {
      let res = "";
      res = `/static/img/report-table/report${val + 1}.png`;
      return res;
    },
    back() {
      uni.navigateBack();
    },
  },
};
</script>

<style lang="less" scoped>
.sampleTable {
  width: 100%;
  height: 100%;
  background-image: linear-gradient(
    90deg,
    #e9f7fe 0%,
    #dceffe 40%,
    #d5ebfd 66%,
    #c9e8fe 100%
  );
  .main {
    margin-top: -44px;
    width: 100%;

    background-size: 100% 40rpx;
    background-repeat: no-repeat;

    .container {
      margin: 0 auto;
      width: 730rpx;
      height: calc(100vh - 44px - var(--status-bar-height) - 20px);
      padding: 23.53rpx 17.65rpx;
      padding-bottom: 0;
      // width: 341.18rpx;
      
      overflow: auto;
      display: flex;
      flex-wrap: wrap;
      justify-sampletable: space-between;

      .image-item {
        text-align: center;
        width: 60%;
        height: 100%;
        background-color: #ffffff;
        border-radius: 4px;
		    margin: 0 auto;
      }

      .top-image {
        height: 288.24rpx;
      }

      image {
        width: 100%;
		box-shadow: 0px 0px 9.41rpx 0px rgba(84, 116, 232, 0.2);
        // object-fit: contain;
      }
    }
  }

  .seize-seat {
    height: 50px;
    width: 100%;
    background-image: linear-gradient(
      90deg,
      #e9f7fe 0%,
      #dceffe 40%,
      #d5ebfd 66%,
      #c9e8fe 100%
    );
  }
  // 导航栏样式
  .uni-nav-bar-text {
    height: 36px;
    width: 36px;
    background: #ffffff;
    border: 0.4px solid rgba(224, 224, 224, 1);
    border-radius: 18px;
    border-radius: 50%;
    color: #333;
    text-align: center;
    .iconfont {
      font-size: 20px;
      line-height: 36px;
    }
  }
}
</style>
