<template>
  <div>
    <a-drawer
        :title="$t('functional-analysis.top-modal.grading')"
        width="40%"
        placement="right"
        :visible="drawerVisible"
        @close="close">
      <a-card
          :tabList="tabList"
          size="small"
          :activeTabKey="key"
          @tabChange="key => onTabChange(key, 'key')">
        <div class="hotTable">
          <!-- 严重度 -->
          <hot-table
              ref="textHot_s"
              :settings="hotSettings_s"
              v-if="key === 'severity'"/>
          <!-- 严重度 end -->
          <!-- 发生度 -->
          <hot-table
              ref="textHot_h"
              :settings="hotSettings_h"
              v-if="key === 'happen'"/>
          <!-- 发生度 end -->
          <!-- 探测度 -->
          <hot-table
              ref="textHot_p"
              :settings="hotSettings_p"
              v-show="key === 'probe'"/>
          <!-- 探测度 end -->
        </div>
      </a-card>
    </a-drawer>
  </div>
</template>
<script>
import {HotTable} from '@handsontable/vue';

export default {
  name: "ScoreStandardModal",
  components: {
    HotTable,
  },
  props: {
    showScoringCriteriaDrawer: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      /** Drawer 是否可见 */
      drawerVisible: false,
      /** tab默认选中 */
      key: 'severity',
      /** tab数组 */
      tabList: [
        {
          key: 'severity',
          tab: this.$t('functional-analysis.top-modal.severity')
        },
        {
          key: 'happen',
          tab: this.$t('functional-analysis.top-modal.occurrence')
        },
        {
          key: 'probe',
          tab: this.$t('functional-analysis.top-modal.detection')
        }
      ],
      commSetting: {
        width: '100%',
        height: 'calc(100vh - 190px)', // 高
        rowHeights: '45px',
        rowHeaders: false, //行表头
        autoWrapRow: true, //自动换行
        manualColumnResize: true, //手工更改列距
        manualRowResize: true, //手动更改行距
        customBorders: [], //添加边框
        stretchH: 'all', //根据宽度横向扩展，last:只扩展最后一列，none：默认不扩展
      },
      /** 严重度配置 */
      hotSettings_s: {
        data: [],
        colWidths: [50, 80, 150, 150, 150, 150],
        hiddenColumns: {},
        licenseKey: '07275-1c8f0-f7d08-9865d-f4eaa',
        colHeaders: [
          this.$t('functional-analysis.top-modal.level'),
          this.$t('functional-analysis.top-modal.consequence'),
          this.$t('functional-analysis.top-modal.rating-criteria-current-factory'),
          this.$t('functional-analysis.top-modal.scoring-standard-transfer-factory'),
          this.$t('functional-analysis.top-modal.rating-criteria-customers'),
          this.$t('functional-analysis.top-modal.example-business-product-line')
        ], //自定义列表头or 布尔值
        columns: [
          {
            data: 'standardLevel',
            readOnly: true
          },
          {
            data: 'attr1',
            type: 'text'
          },
          {
            data: 'attr2',
            type: 'text'
          },
          {
            data: 'attr3',
            type: 'text'
          },
          {
            data: 'attr4',
            type: 'text'
          },
          {
            data: 'attr5',
            type: 'text'
          }
        ]
      },
      /** 发生度配置 */
      hotSettings_h: {
        data: [],
        colWidths: [50, 80, 150, 150, 150, 150],
        hiddenColumns: {},
        licenseKey: '07275-1c8f0-f7d08-9865d-f4eaa',
        colHeaders: [
          this.$t('functional-analysis.top-modal.level'),
          this.$t('functional-analysis.top-modal.consequence'),
          this.$t('functional-analysis.top-modal.occurrence-of-scoring-criteria'),
          this.$t('functional-analysis.top-modal.grading-criteria-process-experience'),
          this.$t('functional-analysis.top-modal.grading-standard-precautions'),
          this.$t('functional-analysis.top-modal.example-business-product-line')
        ], //自定义列表头or 布尔值
        columns: [
          {
            data: 'standardLevel',
            readOnly: true
          },
          {
            data: 'attr1',
            type: 'text'
          },
          {
            data: 'attr2',
            type: 'text'
          },
          {
            data: 'attr3',
            type: 'text'
          },
          {
            data: 'attr4',
            type: 'text'
          },
          {
            data: 'attr5',
            type: 'text'
          }
        ]
      },
      /** 探测度配置 */
      hotSettings_p: {
        data: [],
        colWidths: [50, 80, 150, 150, 150],
        hiddenColumns: {},
        licenseKey: '07275-1c8f0-f7d08-9865d-f4eaa',
        colHeaders: [
          this.$t('functional-analysis.top-modal.level'),
          this.$t('functional-analysis.top-modal.detection-capability'),
          this.$t('functional-analysis.top-modal.grading'),
          this.$t('functional-analysis.top-modal.detect-opportunities'),
          this.$t('functional-analysis.top-modal.example-business-product-line')
        ],
        columns: [
          {
            data: 'standardLevel',
            readOnly: true
          },
          {
            data: 'attr1',
            type: 'text'
          },
          {
            data: 'attr2',
            type: 'text'
          },
          {
            data: 'attr3',
            type: 'text'
          },
          {
            data: 'attr5',
            type: 'text'
          }
        ]
      },
      /** hotTable 数据 */
      formData: {
        standardInfo: {
          name: '',
          ownerId: 0,
          departmentId: ''
        },
        name: '',
        dDfeault: false,
        pDfeault: false,
        fss: {},
        fso: {},
        fsd: {},
        fss3: true,
        fss4: true,
        fss5: true,
        fso3: true,
        fso4: true,
        fso5: true,
        fsd3: true,
        fsd5: true
      },
    };
  },
  watch: {
    showScoringCriteriaDrawer(val) {
      this.drawerVisible = val;
    },
  },
  methods: {
    /**
     * 关闭模态框
     */
    close() {
      this.$emit("closeDrawer");
    },
    /**
     * 页签切换的回调
     * @param key
     * @param type
     */
    onTabChange(key, type) {
      this[type] = key;
    },
    /**
     * 初始化评分标准
     */
    initScoringCriteria() {
      let _that = this;
      // 获取当前FMEA正在使用的评分标准
      _that.$api.getScoringCriteria({
        fmeaId: _that.$store.getters.rfmeaId
      }).then(res => {
        if (res.flag) {
          let defaultStandardId = res.data.defaultStandardId;
          if (!defaultStandardId) return;
          _that.$api.getScoringCriteriaDetail({
            standardId: defaultStandardId,
          }).then(res => {
            if (res.flag) {
              let sHideColumns = [];
              let hHideColumns = [];
              let pHideColumns = [];
              this.formData.dDfeault = res.data.defaultDflag === '1';
              this.formData.pDfeault = res.data.defaultPflag === '1';
              this.formData.name = res.data.name;
              this.formData.fss3 = res.data.fssControl3 === '1';
              this.formData.fss4 = res.data.fssControl4 === '1';
              this.formData.fss5 = res.data.fssControl5 === '1';
              this.formData.fso3 = res.data.fsoControl3 === '1';
              this.formData.fso4 = res.data.fsoControl4 === '1';
              this.formData.fso5 = res.data.fsoControl5 === '1';
              this.formData.fsd3 = res.data.fsdControl3 === '1';
              this.formData.fsd5 = res.data.fsdControl5 === '1';

              if (!this.formData.fss3) {
                sHideColumns.push(3);
              }
              if (!this.formData.fss4) {
                sHideColumns.push(4);
              }
              if (!this.formData.fss5) {
                sHideColumns.push(5);
              }
              if (!this.formData.fso3) {
                hHideColumns.push(3);
              }
              if (!this.formData.fso4) {
                hHideColumns.push(4);
              }
              if (!this.formData.fso5) {
                hHideColumns.push(5);
              }
              if (!this.formData.fsd3) {
                pHideColumns.push(3);
              }
              if (!this.formData.fsd5) {
                pHideColumns.push(4);
              }

              Object.assign(this.hotSettings_s, this.commSetting, {
                hiddenColumns: {columns: sHideColumns},
                data: JSON.parse(JSON.stringify(res.data.fss))
              });
              Object.assign(this.hotSettings_h, this.commSetting, {
                hiddenColumns: {columns: hHideColumns},
                data: JSON.parse(JSON.stringify(res.data.fso))
              });
              Object.assign(this.hotSettings_p, this.commSetting, {
                hiddenColumns: {columns: pHideColumns},
                data: JSON.parse(JSON.stringify(res.data.fsd))
              });
            } else {
              _that.$message.error(res.message, 1);
            }
          });
        } else {
          _that.$message.error(res.message, 1);
        }
      });
    },
  },
  destroyed() {
    this.$emit("closeDrawer");
  }
};
</script>
<style lang="less" scoped>

</style>

