<!--
 * @Author: Liugh
 * @Date: 2021-05-26 15:09:38
 * @LastEditTime: 2021-05-27 17:28:32
 * @LastEditors: Do not edit
 * @FilePath: \auth-web\src\pages\log-manage\err-auth-earlywarning-manage\detail.vue
 * @Description: 鉴权预警方案详情
-->
<template>
  <main class="auth-earlywarning-plan-detail">
    <el-form v-if="detailInfo.id" ref="ruleForm" :model="detailInfo" label-width="140px" label-suffix="：">
      <el-row>
        <el-col :span="item.span" v-for="(item, index) in earlyWarningPlanTableInfo" :key="index">
          <el-form-item :label="item.label">
            <template v-if="item.code">
              <div class="u-detail__text" v-translate="{ code: item.code }">
                {{ detailInfo[item.value] }}
              </div>
            </template>
            <template v-else-if="item.enum">
              <div class="u-detail__text" v-translate="{ enum: item.enum }">
                {{ detailInfo[item.value] }}
              </div>
            </template>
            <template v-else-if="item.value == 'ruleContent'">
              <template v-if="detailInfo.type == 'YHYCIPJQYJ'">
                <div class="u-detail__text">用户使用非常用的IP进行鉴权。</div>
              </template>
              <template v-else>
                <div class="u-detail__text" v-for="(item, index) in detailInfo[item.value]" :key="index">
                  用户在{{ item.time[0] }} - {{ item.time[1] }} 进行鉴权
                </div>
              </template>
            </template>
            <template v-else-if="item.isTime">
              <div class="u-detail__text">
                {{ detailInfo[item.value] | dateFormatter('YYYY-MM-DD HH:mm:ss') }}
              </div>
            </template>
            <template v-else>
              <div class="u-detail__text">
                {{ detailInfo[item.value] }}
              </div>
            </template>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="dg-layer-demo" v-footer>
      <dg-button @click="handleClose">关闭</dg-button>
    </div>
  </main>
</template>

<script>
import { earlyWarningPlanTableInfo } from '../DataConfig';
import { warningProgrammeInfo } from '@/api/log-manage';
export default {
  name: 'auth-earlywarning-plan-detail', // 组件名称
  props: {
    // 接收父组件的数据
    info: Object
  },
  data() {
    // 组件内部参数
    return {
      earlyWarningPlanTableInfo,
      detailInfo: {}
    };
  },
  components: {}, // 注册局部组件
  computed: {},
  methods: {
    handleClose() {
      this.$emit('close');
    },
    countTime(val) {
      return val >= 10 ? val + ':00' : '0' + val + ':00';
    },
    getDetail() {
      return new Promise((resolve) => {
        warningProgrammeInfo(this.info.id).then((res) => {
          if (res.type !== 'YHYCIPJQYJ') {
            res.ruleContent = res.ruleContent ? JSON.parse(res.ruleContent) || [] : [];
            res.ruleContent.forEach((item) => {
              item.time = [this.countTime(item.start), this.countTime(item.end)];
              delete item.start;
              delete item.end;
            });
          }
          this.detailInfo = res;
          resolve(res);
        });
      });
    }
  }, // 内部方法
  async created() {
    await this.getDetail();
  }
};
</script>
<style lang="scss" scoped></style>
