<template>
   <div class="page_targetStandard">
      <div class="targetStandardTitle">
           <i class="iconfont icon-zuojiantou jiantou" @click="toClick"></i>
           <span class="titleName" @click="show = true">{{ type }}<van-icon name="arrow-down" class="arrow" /></span>
      </div>
      <div>
        <div v-if="type == '患者指标达标统计详情'">
         <van-tabs sticky>
           <van-tab title="未达标患者">
              <target-no-standard></target-no-standard>
           </van-tab>
           <van-tab title="达标患者">
              <target-standard></target-standard>
            </van-tab>
          </van-tabs>
        </div>
         <div v-if="type=='血压达标统计详情'">
           <van-tabs sticky>
            <van-tab title="未达标患者">
                <blood-no-standard></blood-no-standard>
            </van-tab>
            <van-tab title="达标患者">
                <blood-standard></blood-standard>
            </van-tab>
           </van-tabs>
         </div>
        </div>
       <div>
            <van-popup v-model="show" position="bottom" :style="{ height: '40%' }">
                <van-picker
                    show-toolbar
                    :columns="columns"
                    @confirm="onConfirm"
                    @cancel="show = false"
                />
            </van-popup>
        </div>
  </div>
</template>

<script>
import targetNoStandard from './components/targetNoStandard'
import targetStandard from './components/targetStandard'
import bloodNoStandard from './components/bloodNoStandard'
import bloodStandard from './components/bloodStandard'
export default {
  components: {
    targetNoStandard,
    targetStandard,
    bloodNoStandard,
    bloodStandard
  },
  data () {
    return {
      show: false,
      columns: ['患者指标达标统计详情', '血压达标统计详情'],
      type: '患者指标达标统计详情',
      tabName: ''
    }
  },
  methods: {
    toClick () {
      // this.$router.push('/bus/quality?tabName=' + this.tabName)
      this.$router.go(-1)
    },
    onConfirm (value) {
      this.type = value
      this.show = false
    }
  },
  created () {
    var isRouter = this.$route.query.isRouter
    if (isRouter == 1) {
      this.type = '患者指标达标统计详情'
    }
    if (isRouter == 2) {
      this.type = '血压达标统计详情'
    }
    this.tabName = this.$route.query.tabName
    var test = localStorage.getItem('test', this.active)

  }
}
</script>

<style lang="scss" scoped>
.page_targetStandard {
  height: 100%;
  overflow: hidden;
  overflow-y: auto;
  .targetStandardTitle {
    background: #fff;
    padding: 0 1.125rem;
    height: 3.125rem;
    display: flex;
    align-items: center;
  }
  .jiantou {
    font-size: 1.5rem;
    font-weight: 600;
    margin-right: 3.5rem;
  }
  .titleName {
    font-size: 1.125rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    .arrow {
      margin-left: 0.375rem;
    }
  }
  .van-cell {
    font-size: 1rem;
  }
}
</style>
