<!--
 * @Author: zwq
 * @Date: 2021-11-18 14:16:25
 * @LastEditors: zwq
 * @LastEditTime: 2023-06-27 09:50:10
 * @Description:
-->
<template>
  <el-dialog :visible.sync="hisVisible" append-to-body class="baseDialog">
    <template #title>
      <slot name="title">
        <div class="titleStyle">{{ $t('module.basicData.history') }}</div>
      </slot>
    </template>
    <el-table
      :data="dataList"
      :header-cell-style="{
        background: '#F2F4F9',
        color: '#606266',
      }"
      style="width: 100%;"
    >
      <el-table-column type="index" header-align="center" align="center" :label='$t("index")' width="50">
      </el-table-column>
      <el-table-column prop="code" align="center" :label='$t("params.paramCode")'> </el-table-column>
      <el-table-column prop="name" align="center" :label="$t('module.basicData.name')"></el-table-column>
      <el-table-column prop="type" align="center" :label="$t('module.basicData.featuresType')">
        <template slot-scope="scope">
          <span>{{ scope.row.type === 2 ? "计数" : "计量" }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="defectLevel" align="center" :label="$t('module.basicData.defectLevel')">
        <template slot-scope="scope">
          <span>{{
            scope.row.defectLevel === 1
              ? "致命缺陷"
              : scope.row.defectLevel === 2
              ? "严重缺陷"
              : "轻微缺陷"
          }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="measureToolName" align="center" :label="$t('module.basicData.measureTool')"></el-table-column>
      <el-table-column prop="isSpc" align="center" label="SPC">
        <template slot-scope="scope">
          <span>{{ scope.row.isSpc === 1 ? "是" : "否" }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="controlGraphName" align="center" :label="$t('module.basicData.analyzeGraphics')"></el-table-column>
      <el-table-column prop="sampleSize" align="center" :label="$t('module.basicData.sampleSize')"></el-table-column>
      <el-table-column prop="samplingFrequency" align="center" :label="$t('module.basicData.sampleRate')"></el-table-column>
      <el-table-column prop="unitName" align="center" :label="$t('module.basicData.unit')"></el-table-column>
      <el-table-column prop="decimalPlaces" align="center" :label="$t('module.basicData.decimalPlaces')"></el-table-column>
      <el-table-column prop="specifications" align="center" :label="$t('module.basicData.specs')"></el-table-column>
      <el-table-column prop="lsl" align="center" label="LSL"></el-table-column>
      <el-table-column prop="sl" align="center" label="SL"></el-table-column>
      <el-table-column prop="usl" align="center" label="USL"></el-table-column>
      <el-table-column prop="targetCpk" align="center" label="CPK"></el-table-column>
      <el-table-column prop="targetPpk" align="center" label="PPK"></el-table-column>
      <el-table-column prop="remark" align="center" :label="$t('params.remark')"></el-table-column>
    </el-table>
    <span slot="footer" class="dialog-footer">
      <el-button @click="hisVisible = false">{{ $t('close') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      hisVisible: false,
      dataList: [],
    };
  },
  created() {},
  methods: {
    init(id) {
      this.hisVisible = true;
      this.$nextTick(() => {
        this.$http
          .get("/basic/productFeaturesHis/page", {
            params: {
              id: id,
              page: 1,
              limit: 100,
            },
          })
          .then(({ data: res }) => {
            if (res.code !== 0) {
              this.dataList = [];
              return this.$message.error(res.msg);
            }
            this.dataList = res.data.list;
          })
          .catch(() => {});
      });
    },
  },
};
</script>

<style>
.baseDialog .el-dialog__header {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.85);
  font-weight: 500;
  padding: 13px 24px;
  border-bottom: 1px solid #e9e9e9;
}
.baseDialog .el-dialog__header .titleStyle::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 16px;
  background-color: #0b58ff;
  border-radius: 1px;
  margin-right: 8px;
  position: relative;
  top: 2px;
}
.baseDialog .el-dialog__body {
  padding-left: 24px;
  padding-right: 24px;
}
.baseDialog .el-table .el-table__cell {
  padding: 0;
  height: 35px;
}
</style>
