<template>
<div>



  <el-dialog :title="'查看度量'" :close-on-click-modal="false" :visible.sync="visible">

    <el-form  :model="goal_info" label-width="100px"  v-loading="measDataListLoading"  style="word-break: break-word">
      <el-form-item label="度量名称 :" prop="name">
        <!--                  <el-input v-model="goal_info.config.name"></el-input>-->
        <span>{{ goal_info.name  }}</span>
      </el-form-item>
      <el-form-item label="度量描述 :">
        <span>{{ goal_info.description }}</span>
        <!--                  <el-input v-model="goal_info.config.description"></el-input>-->
      </el-form-item>
      <el-form-item label="数据源 :">
        <span>{{ goal_info.dataSources }}</span>
        <!--                  <el-input v-model="goal_info.equipment.name"></el-input>-->
      </el-form-item>
      <!--                <el-form-item label="查询条件 :">-->
      <!--                  <span>{{goal_info.config.where}}</span>-->
      <!--&lt;!&ndash;                  <el-input v-model="goal_info.config.where"></el-input>&ndash;&gt;-->
      <!--                </el-form-item>-->
      <el-form-item label="分区信息 :">
        <span>{{goal_info.partition}}</span>
        <!--                                  <el-input v-model="goal_info.config.num" >{{goal_info.config.num + goal_info.config.timetype}}</el-input>-->
        <!--                                  <el-input v-model="goal_info.config.timezone"></el-input>-->
      </el-form-item>
      <el-form-item label="度量规则 :">
        <!--                  <el-input-number v-model="datacForm.num" controls-position="right" :min="0"></el-input-number>-->
<!--        <div style="height: 100px;overflow: auto">-->
          <template v-for="rule in  goal_info.Cloum">
            <li>{{ rule.name }} : {{ rule.infos }}</li>
          </template>

<!--          &lt;!&ndash;    <template v-for="rule in  timezones" >&ndash;&gt;-->
<!--          &lt;!&ndash;      <li>{{rule.label}} : {{rule.value}}</li>&ndash;&gt;-->
<!--          &lt;!&ndash;    </template>&ndash;&gt;-->
<!--        </div>-->
      </el-form-item>
    </el-form>


    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="visible=false">确定</el-button>
    </span>
  </el-dialog>

</div>
</template>

<script>
export default {
  name: 'measureUserWatch',
  data () {
    return {
      goal_info: {},
      visible: false,
      measDataListLoading: false
    }
  },
  methods: {
    init (info) {
      this.visible = true
      this.measDataListLoading = false
      // console.info(info)
      this.getMeasureListById(info.measureID)
    },
    getMeasureListById (id) {
      this.measDataListLoading = true
      this.classificationtag = null
      this.$http({
        url: this.$http.adornUrl('/v1/measures/') + id,
        methods: 'get'
      }).then((data) => {
        if (data && data.status === 200) {
          var info = data.data
          this.goal_info.name = info.name
          this.goal_info.description = info.description
          var dataScore = info['data.sources'][0].connector.config
          this.goal_info.dataSources = dataScore.database + '  : ' + dataScore['table.name']
          this.goal_info.partition = info['data.sources'][0].connector['data.unit']
          this.goal_info.Cloum = info['rule.description'].details
        }
        // console.log(this.goal_info)
        this.measDataListLoading = false
      })
    }
  }
}
</script>

<style scoped>

</style>
