<template>
	<view :style="{height:'100vh',overflow:'auto'}">
		<u-navbar :title="skInfo.resName" :autoBack="true" :titleStyle="{
				fontSize:'18px'
			}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
		</u-navbar>
		<u-tabs :list="list1" @click="click" :current="tabs" style="background-color: #fff;margin-top: 60px;"></u-tabs>
        <Jcxx v-if="tabs == 0"></Jcxx>
        <BasicInfo v-if="tabs == 1" :skInfo="skInfo"></BasicInfo>
        <Tzcs v-if="tabs == 2" :skInfo="skInfo"></Tzcs>
		<Krqx v-if="tabs == 3"></Krqx> 
        <Zrtx v-if="tabs == 4"></Zrtx>
	
	</view>
</template>

<script>
	import moment from 'moment'
	import Jcxx from "./jcxx.vue"
	import Zrtx from "../../skDetail/zrtx/zrtx.vue"
	import Krqx from "./krqx/index.vue"
	import BasicInfo from "./basicInfo.vue"
	import Tzcs from "./tzcs.vue"
	export default {

		data() {
			return {
				tabs:0,
				model: {
					stm: '',
					etm: ''
				},
			
				list1: [{
					name: '监测信息',
				}, {
					name: '基础信息',
				}, {
					name: '特征参数'
				}, {
					name: '库容曲线'
				}, {
					name: '责任人'
				}],
				skInfo:{},
			};
		},
		components:{
			Jcxx,
			Zrtx,
			Krqx,
			BasicInfo,
			Tzcs
		},
		onLoad() {
			this.getList();
		},
		methods: {
			click(item) {
				this.tabs = item.index;
			},
			getList(){
				uni.$http.post('/gunshiApp/xyt/attResBase/list',this.model).then(res=>{
					console.log(res,'res');
					this.skInfo = res.data.data[0];
				})
			},
			toDetail() {
				uni.navigateTo({
					url: '/pages/wtcl/detail/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.swiper-content{
		position: relative;
		.num{
			    position: absolute;
			    top: 4px;
			    left: 4px;
			    z-index: 1;
			    background-color: #000;
			    color: #fff;
			    padding: 0 4px;
			    border-radius: 6px;
			    opacity: .4;
			    font-size: 12px;
		}
		.time{
			position: absolute;
			background-color: #000;
			opacity: .4;
			color: #fff;
			bottom: 0;
			width:100%;
			padding: 4px;
		}
	}
</style>