<template>
  <el-dialog
		:visible.sync="isOpenDialog"
		:close-on-click-modal="false"
		:modal-append-to-body='false'
    title="查看预测规则"
		@close="cancelHandle"
		custom-class="rule-dialog"
		center
		width="750px"
		v-dialogDrag>
      <div class="top">
        <span>原指标ID：{{fromEdbInfo.FromEdbCode}}</span>
        <span>原指标名称：{{fromEdbInfo.FromEdbName}}</span>
      </div>
      <el-collapse v-model="activeNames" class="rules-ul">
          <el-collapse-item
            v-for="(item, index) in rulesArr"
            :key="index"
            :name="index"
          >
            <template slot="title">
              <span class="text_oneLine" style="font-size: 16px;">规则{{ index + 1 }}({{predictTypeMap[item.predict_type]}})</span>
            </template>
            <div class="wrap">
              <div class="item">
                <span class="label">预测截止日期</span>
                <span>{{item.endDate}}</span>
              </div>
              <div class="item">
                <span class="label">
                  预测规则
                  <el-tooltip effect="dark" placement="right">
                    <div
                      slot="content"
                      v-html="rulesTip"
                      style="line-height: 20px;max-width:600px"
                    ></div>
                    <i class="el-icon-question" style="color: #666" />
                  </el-tooltip>
                </span>
                <span>{{predictTypeMap[item.predict_type]}}</span>
              </div>
              <div class="item" v-if="![1,9,11,12,14,15].includes(item.predict_type)">
                <span class="label">{{labelMap[item.predict_type]}}</span>
                <span>{{item.fixedValue}}</span>
              </div>

              <!-- 动态环差 -->
              <template v-if="item.predict_type===9">
                <div class="item">
                  <span class="label">环比增加值</span>
                  <ul class="edb-ul">
                    <li v-for="edb in item.edbarr" :key="edb.target">
                      <div>{{edb.tag}}：{{edb.name}}</div>
                      <span style="color: #5882ef;font-size:14px">{{edb.start_date}}至{{edb.end_date}}</span>
                    </li>
                  </ul>
                </div>
                <div class="item">
                  <span class="label">计算公式</span>
                  <span>{{item.fixedValue}}</span>
                </div>
              </template>

              <!-- 季节性 -->
              <template v-else-if=" [15,11].includes(item.predict_type)">
                <div class="item">
                  <span class="label">过去N年</span>
                  <span>{{item.season_years}}</span>
                </div>
                <div class="item" v-if="item.predict_type===11">
                  <span class="label">日历</span>
                  <span>{{item.season_type}}</span>
                </div>
              </template> 

              <!-- 移动平均同比 -->
              <template v-else-if="item.predict_type===12">
                <div class="item">
                  <span class="label">期数</span>
                  <span>{{item.n_value}}</span>
                </div>
                <div class="item">
                  <span class="label">同比年份</span>
                  <span>{{item.average_year}}</span>
                </div>
              </template> 

              <!-- 一元线性拟合 -->
              <template v-else-if="item.predict_type===14">
                <div class="item">
                  <span class="label">自变量</span>
                  <span>{{item.self_target}}</span>
                </div>
                <div class="item">
                  <span class="label">领先天数</span>
                  <span>{{item.fixedValue}}</span>
                </div>
                <div class="item">
                  <span class="label">拟合时间段</span>
                  <span>{{item.fit_date[0]+'至'+item.fit_date[0]}}</span>
                </div>
              </template> 

              <!-- 年度倒退 -->
              <template v-else-if="item.predict_type===16">
                <div class="item">
                  <span class="label">分配方式</span>
                  <span>{{item.distribute_type===1?'均值法':'同比法'}}</span>
                </div>
                <div class="item" v-if="item.distribute_type===2">
                  <span class="label">同比年份</span>
                  <span>{{item.on_year}}</span>
                </div>
              </template> 
            </div>
          </el-collapse-item>
      </el-collapse>
  </el-dialog>  
</template>

<script>
export default {
  props: {
    isOpenDialog: {
      type: Boolean
    },
    rules: {
      type: Array
    },
    fromEdbInfo: {
      type: Object
    }
  },

  watch: {
    isOpenDialog(val) {
      if(val) {
        this.activeNames = [0];
        this.rulesArr = this.rules.map(_ => ({
          endDate: this.$moment(_.EndDate).format('YYYY-MM-DD'),
          predict_type: _.RuleType,
          fixedValue: _.RuleType === 14 
            ? JSON.parse(_.Value).MoveDay
            : _.RuleType === 16
            ? JSON.parse(_.Value).Value
            : _.Value,
          edbarr: _.RuleType === 9 
            ? _.CalculateList.map(item => ({ target:item.FromEdbInfoId,tag:item.FromTag,name:item.FromEdbName,start_date: item.StartDate,end_date:item.EndDate })) 
            : [],
          season_type: _.RuleType===11 ? JSON.parse(_.Value).Calendar : '',
          season_years: [11,15].includes(_.RuleType) 
            ? (
                JSON.parse(_.Value).YearList.length
                ? JSON.parse(_.Value).YearList.join(',')
                : this.filterYear(JSON.parse(_.Value).NValue)
              )
            : '',
          n_value: [11,12,15].includes(_.RuleType) ? JSON.parse(_.Value).NValue : '',
          average_year: _.RuleType===12 ? JSON.parse(_.Value).Year : '' ,
          self_target: _.RuleType === 14 ? _.CalculateList[0].FromEdbName : '',
          fit_date: _.RuleType === 14 ? [JSON.parse(_.Value).StartDate,JSON.parse(_.Value).EndDate] : [],
          distribute_type: _.RuleType === 16?JSON.parse(_.Value).Type:1,
          on_year: _.RuleType === 16?JSON.parse(_.Value).Year:'',
        }))
      }
    }
  },

  data() {
    return {
      activeNames:[0],
      rulesArr: [],
      predictTypeMap: {
        1: "最新" ,
        2: "固定值" ,
        3: "同比" ,
        4: "同差" ,
        5: "环比" ,
        6: "环差" ,
        7: "N期移动均值" ,
        8: "N期段线性外推值" ,
        9: '动态环差' ,
        10: "给定终值后插值" ,
        11: '季节性',
        12: '移动平均同比',
        13: "同比增速差值" ,
        14: "一元线性拟合" ,
        15: 'N年均值',
        16: '年度倒退值'
      }, //预测规则
      rulesTip: `预测规则说明：<br>
				1、最新：预测值全部等于最新值；<br>
				2、固定值：预测值默认全部等于常数值；<br>
				3、同比：去年同期值乘同比增速得到预测值；<br>
				4、同差：去年同期值加同比增加得到预测值；<br>
				5、环比：上期值乘环比增速得到预测值；<br>
				6、环差：上期值加同比增加得到预测值；<br>
				7、N期移动均值：过去N期值的平均值；<br>
				8、N期段线性外推值：过去N期值生成线性回归方程：Y=aX＋b，将未来的期数代入得到预测值；<br>
        9、动态环差：选择几个指标进行指标计算得到结果值作为动态环差值，预测值=上期值＋动态环差值；<br>
        10、给定终值后插值：计算最新数据和预测终值的期数差T和数据差S，环差值=S/T，预测数值=前一期数值＋环差值(本期-上期)；<br>
        11、季节性：计算过去N年同期的环差（本期-上期）均值，预测值=上期值＋环差均值；<br>
        12、移动平均同比：计算过去N期平均值的同比值（本期/上期），选择同比年份，预测值=同比年份同期值*同比值；<br>
        13、同比增速插值：计算最新数据的同比增速：（本期数值-去年同期数值）/去年同期数值*100%，输入同比增速终值，通过期数差值，计算每一期同比增速，预测值=去年同期值*（1＋该期同比增速）。<br>
        14、一元线性拟合：由指标A（自变量）和指标B（基础指标）在拟合时间段生成线性回归方程：Y=aX＋b，将指标A代入该方程得到拟合指标B'，拼接指标B的实际值和B'的预测值，生成预测指标；,<br>
        15、N年均值：过去N年同期均值。过去N年可以连续或者不连续，指标数据均用线性插值补全为日度数据后计算；<br>
        16、年度值倒推：设定年度值，余额=年度值-年初至今累计值（算法参考累计值），进行余额分配，均值法分配时保证每期数值相等（日度/周度：剩余期数=剩余自然日历天数/今年指标最新日期自然日历天数*今年至今指标数据期数；旬度/月度/季度/半年度：剩余期数=全年期数(36/12/4/2)-今年至今自然日历期数），同比法保证每期同比相等（同比增速=余额/同比年份相应日期的余额，预测值等于同比年份同期值*同比增速）`,
        
      labelMap: {
        2: '固定值',
        3: '同比增速',
        4: '同比增加值',
        5: '环比增速',
        6: '环比增加值',
        7: '期数',
        8: '期数',
        10: '预测终值',
        13: '同比增速终值',
        16: '年度值'
      },
    }
  },

  methods: {
    cancelHandle() {
      this.$emit('update:isOpenDialog',false)
    },

    /* 过去N年的日期数组 */
    filterYear(n) {
      let current_year = new Date().getFullYear();
      let year_arr=[]
      console.log(n,current_year)
      console.log(typeof(n),typeof(current_year))
      for(let i = current_year-n;i<current_year;i++) {
        year_arr.push(i)
      }
      return year_arr.join(',')
    }
  }
}
</script>

<style lang="scss" scoped>
.rule-dialog {
  .top {
    display: flex;
    color: #333;
    font-size: 16px;
    span {width: 50%;}
  }
  .rules-ul {
      border: 1px solid #dcdfe6;
      margin: 10px 0 30px;
      .del-icon {
        position: absolute;
        right: 10px;
        font-size: 16px;
        color: #f00;
        cursor: pointer;
      }
      .wrap {
        padding: 20px 30px 10px;
        font-size: 16px;
        .item {
          color: #666;
          display: flex;
          .label {
            width: 120px;
            text-align: right;
            color: #333;
            margin-right: 24px;
            margin-bottom: 10px;
            flex-shrink: 0;
          }
          .edb-ul {
            li { margin-bottom: 10px; }
          }
        }
      }
  }
}
</style>
<style lang="scss">
.rule-dialog {
  .el-collapse-item__header {
    background-color: #F0F2F5;
    margin-bottom: 0;
    border-bottom: 1px solid #dcdfe6;
    padding: 0 30px;
    .el-collapse-item__arrow {
      position: absolute;
      left: 8px;
    }
  }
  .el-collapse-item__content {
    padding-bottom: 10px;
  }
  .el-collapse-item.is-disabled .el-collapse-item__header {
    color: #333;
  }
  .el-dialog__body {
    padding: 20px 30px 20px !important;
  }
}
</style>