<template>
  <div class="flex-row">
    <div class="basic-main">
      <div :class="showData ? 'top' : 'auto'">
        <supervisory-list v-ref:query :show-data="showData" :row="row"></supervisory-list>
      </div>
      <div v-if="showtotal" style="height: 89%">
        <div class="col-sm-2" style="margin-top: 20px">
          <supervisory-chart :selectdata="selectdata"></supervisory-chart>
        </div>
        <div class="col-sm-10" style="margin-top: 20px">
          <tabset v-ref:tabs :close="false">
            <tab :header='selectdata.defname'>
              <supervisory-service-control :selectdata="selectdata" :node-snapshot="true"></supervisory-service-control>
            </tab>
          </tabset>
        </div>
      </div>
    </div>
  </div>

</template>
<script>
  import Vue from 'vue'
  import SupervisoryList from './SupervisoryList'
  import SupervisoryChart from './SupervisoryhCart'
  import SupervisoryServiceControl from './Service/SupervisoryServiceControl'
  export default {
    title: '流程监控',
    props: ['row'],
    components: {
      SupervisoryList,
      SupervisoryChart,
      SupervisoryServiceControl
    },
    data () {
      return {
        showtotal: false, // 控制详细信息显示
        showData: true,
        selectdata: {},
        xmlname: '' // 配置文件名称
      }
    },
    created () {
    },
    methods: {
      // 获取页面配置json文件
      async loadName () {
        let data = {
          workname: this.selectdata.processname
        }
        let res = await this.$resetpost(
          'rs/logic/ApplyGetConfigs',
          {data: data},
          {resolveMsg: null, rejectMsg: '配置数据获取失败！！！'}
        )
        Vue.prototype.$workflow_vue = res.data
      }
    },
    events: {
      // 刷新控制层
      async 'breakControl' (servicedata) {
        if (servicedata.id) {
          let data = {
            condition: `u.id = ${servicedata.id}`,
            data: {
              orgid: this.$login.f.orgid
            }
          }
          let res = await this.$resetpost(
            'rs/sql/supervisory',
            {data: data},
            {resolveMsg: null, rejectMsg: '数据更新失败，请手查询更新！！！'}
          )
          this.selectdata = Object.assign({}, this.selectdata, res.data[0])
        } else {
          this.selectdata = servicedata
        }
        this.showtotal = false
        this.$nextTick(() => {
          this.showtotal = true
        })
      },
      'onMessage' (data) {
        console.log('接收消息')
        console.log(data)
        if (data.type === 'apply-task') {
          this.$refs.queryuser.$refs.cp.$refs.cri.search()
        }
      },
      async 'apply' (val) {
        debugger
        this.selectdata = null
        this.selectdata = val
        this.showtotal = false

        // 获取配置文件
        await this.loadName()

        this.$refs.query.$refs.cp.pager = false
        this.showData = false

        this.showtotal = true
      },
      'search' () {
        // 关闭详细
        this.showtotal = false
        // 显示列表数据
        this.showData = true
        // 显示分页
        this.$refs.query.$refs.cp.pager = true
        // 调用查询
        this.$refs.query.$refs.cp.$refs.cri.search()
      },
      'loadPage' () {
        // 关闭详细
        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: {
    }
  }
</script>
