<template>
  <view class="bigBox">
    <view class="topBar" :style="{'padding-top':systemBarHeight.statusBarHeight+'px','height':systemBarHeight.navigationBarHeight+'px'}">
			<u-icon @click="Utils.goBack()"  name="arrow-left" color="#000000" size="20"></u-icon>
			<view class="tabTitle" :style="{'line-height':systemBarHeight.navigationBarHeight+'px'}">实景演示</view>
		</view>
    <view :style="{'padding-top':(systemBarHeight.statusBarHeight+systemBarHeight.navigationBarHeight)+'px'}">
      <Tabs :list='list1' @changeTab="changeTab" :newIndex="current" />
    </view>
    <view>
      <swiper :current="current" class="swiper" @change="swiperChange">
        <swiper-item>
          <view class="list">
            图片演示
          </view>
        </swiper-item>
        <swiper-item>
          <view class="list">
            视频演示
          </view>
        </swiper-item>
      </swiper>
    </view>
  </view>
</template>

<script>
import Ticket from '@/components/Ticket/index.vue'
import Utils from '@/utils/utils'
import Tabs from '@/components/Tabs/index.vue'
export default {
  components: {Ticket,Tabs},
  data() {
    return {
      list1: [
        {
          name: "图片演示",
        },
        {
          name: "视频演示",
        },
      ],
      nouserList:[],
      current: 0,
      actionIndx:0,
      Utils
    };
  },
  mounted(){
  },
  computed:{
    systemBarHeight(){
      return  this.$store.state.user.systemBarHeight
    },
  },
  methods: {
    changeTab(current) {
      this.current = current;
    },
    swiperChange(val){
      this.current = val.detail.current;
    }
  },
};
</script>

<style lang="scss" scoped>
.bigBox {
  .topBar{
		position: fixed;
		width: 100%;
		background: white;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		z-index: 9999;
		padding-left: 34rpx;
		// .arrow-left {
		// 	margin-left: 20rpx;
		// }
		.tabTitle{
			font-size: 32rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 600;
			text-align: center;
			width: 79%;
			color: #333333
		}
	}

  .swiper {
    background: #F8F8F8;
    height: calc(100vh - 64rpx);
    .list{
      height: 100%;
      padding: 0rpx 32rpx;
      overflow-y: scroll;
    }
  }
}
</style>
