<template>
      <div style="height: 100%">
        <tabset class="tab1" v-ref:tabs :close="false" :active.sync="active">
          <tab :header="dataname+'查询列表'" :class="showData ? 'top' : 'auto'">
            <component :is="'exploration-select'" v-ref:query :dataname = "dataname" :show-data="showData"></component>
          </tab>
          <tab header='页面1' class="tab3">
            <component :is="'new1-exploration-user'" :xselectdata="selectdata1" :mark="'1'"></component>
          </tab>
          <tab header='页面2'>
            <component :is="'new1-exploration-user'" :xselectdata="selectdata2" :mark="'2'"></component>
          </tab>
          <tab header='页面3'>
            <component :is="'new1-exploration-user'" :xselectdata="selectdata3" :mark="'3'"></component>
          </tab>
        </tabset>
      </div>
</template>

<script>
import Vue from 'vue'
import {HttpResetClass} from 'vue-client'

export default {
  title: '报建流程',
  props: ['dataname'],
  data() {
    return {
      showData: true,     // 控制列表数据
      showtotal: false, // 详情显示
      selectdata: {},
      selectdata1: null,
      show1: false,
      selectdata2: null,
      show2: false,
      selectdata3: null,
      show3: false,
      xmlname: '',        // 配置文件名
      active: 0        // 配置文件名
    }
  },
  ready() {
    console.log('=============用户信息=================')
    console.log(this.$login.f)
    console.log(this.$login.r)
  },
  methods: {
    // 获取页面配置json文件
    async loadName() {
      let http = new HttpResetClass()
      let data = {
        workname: this.selectdata.processname
      }
      let res= await http.load('POST', 'rs/logic/ApplyGetConfigs', {
        data
      }, {resolveMsg: null, rejectMsg: null})
        Vue.prototype.$workflow_vue = res.data
    }
  },
  events: {
    'locationclick'(res) {
      console.log('/*/*/*/*/*/*/*/*/*/*/*/*/*/**/*/*/*/*')
      if (res.pname) {
        this.$refs.service.setLabelValue('定位地址', res.pname + res.cityname + res.adname + res.address + res.name)
      } else {
        this.$refs.service.setLabelValue('定位地址', res.province + res.city + res.address + res.name)
      }
      this.$refs.service.show_data.f_lng = res.location.lng
      this.$refs.service.show_data.f_lat = res.location.lat
      this.active = 0
    },
    'onMessage'(data) {
      console.log('接收消息')
      console.log(data)
      if (data.type === 'apply-task') {
        this.$refs.query.$refs.cp.$refs.cri.search()
      }
    },
    // 刷新控制层
    async 'breakControl'(servicedata) {

      if (servicedata.id) {
        let data = {
          condition: `u.id = ${servicedata.id}`,
          data: {
            userid: this.$login.f.id,
            f_filiale: "榆林."+this.$login.f.orgs
          }
        }
        let res = await this.$resetpost(
          'rs/sql/checkuser',
          {data: data},
          {resolveMsg: null, rejectMsg:null}
        )

        this.selectdata = res.data[0]
      } else {
        this.selectdata = servicedata
      }

      this.showtotal = false
      this.$nextTick(() => {
        this.showtotal = true
      })
      this.active = 0

    },
    // 初始化
    async 'apply'(val) {
      console.log("当前数据", val)
      this.showtotal = false
      if (!this.selectdata1) {
        this.selectdata1 = val
      } else if (!this.selectdata2) {
        this.selectdata2 = val
      } else if (!this.selectdata3) {
        this.selectdata3 = val
      }else {
        this.$showMessage("请关闭之前的页面后，再打开新的页面")
        return
      }
      this.selectdata = val

      // 次方法必须同步执行，否则后续会出问题
      // 获取页面json配置文件
      // await this.loadName()

      // 显示详细
      // this.showtotal = true
      // 关闭列表数据
      // this.showData = false
      // 关闭分页
      // this.$refs.query.$refs.cp.pager = false
    },
    'search'() {
      this.selectdata = {}
      // 关闭详细
      this.showtotal = false
      // 显示列表数据
      this.showData = true
      // 显示分页
      this.$refs.query.$refs.cp.pager = true
      // 调用查询
      this.$refs.query.$refs.cp.$refs.cri.search()
    },
    'loadPage1'(val) {
      if (val === '1'){
        console.log("sssss1")
        this.selectdata1 = null
        // this.show1 = false
        // this.active = 0
      }else if (val === '2'){
        console.log("sssss2")
        this.selectdata2 = null
        // this.show2 = false
        // this.active = 0
      }else if (val === '3'){
        console.log("sssss3")
        this.selectdata3 = null
        // this.show3 = false
        // this.active = 0
      }
      console.log("vass",val)
      // this.selectdata = {}
      // 关闭详细
      // this.showtotal = false
      // 显示列表数据
      this.showData = true
      // 显示分页
      // this.$refs.query.$refs.cp.pager = true
      // 调用查询
      this.$refs.query.$refs.cp.loadPage(this.$refs.query.model.pageIndex)
    }
  },
  watch: {
    "selectdata1" (val) {
      if(val){
        this.show1 = true
        this.active = 1
      }else {
        this.show1 = false
        this.active = 0
      }
    },
    "selectdata2" (val) {
      if(val){
        this.show2 = true
        this.active = 2
      }else {
        this.show2 = false
        this.active = 0
      }
    },
    "selectdata3" (val) {
      if(val){
        this.show3 = true
        this.active = 3
      }else {
        this.show3 = false
        this.active = 0
      }
    }
  }
}
</script>
<style scoped>
.tab1{
  padding: 0.4%;
  background-color: #ffffff;
  border-radius: 14px;
  box-shadow: 0px 1px 10px 0px rgba(2, 56, 104, 0.13);
}
.tab3{
  background-color: #ffffff !important
}
</style>
