<!-- 工序点弹窗 -->
<template>
  <div>
    <el-dialog append-to-body title="工序点信息" :visible.sync="showProcess" width="1080px" >
      <el-table height="580" ref="processTab" :data="tableProcessPoint" v-loading="tableProcessPointLoading" border highlight-current-row
                  @select-all="handleSelectAllPoint" @select="handleSelectPoint">
        <el-table-column type="selection" width="50" align="center">
          <!--<template slot-scope="prop">-->
            <!--<el-checkbox  v-model="prop.row.isSelection" :true-label="'1'" :false-label="'0'">-->
            <!--</el-checkbox>-->
          <!--</template>-->
        </el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="发送检验计划" align="center" min-width="85">
          <template slot-scope="scope">
            <span v-if="scope.row.send_checkplan === '1'">是</span>
            <span v-else-if="scope.row.send_checkplan === '0'">否</span>
          </template>
        </el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="执行返回" align="center" min-width="60">
          <template slot-scope="scope">
            <span v-if="scope.row.return_result === '1'">是</span>
            <span v-else-if="scope.row.return_result === '0'">否</span>
          </template>
        </el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="必经项" align="center" min-width="55">
          <template slot-scope="scope">
            <span v-if="scope.row.choose === '1'">是</span>
            <span v-else-if="scope.row.choose === '0'">否</span>
          </template>
        </el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="工序点代码"  sortable align="center" prop="process_point_code" min-width="95"></el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="工序点名称" prop="process_point_desc" min-width="100"></el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="工序点类型" sortable align="center" prop="base_name" min-width="110"
                         :filter-method="filterColumn"></el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="工序点顺序号" align="center" prop="process_point_seq" min-width="85" sort-by="process_point_seq" ></el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="标准成本" sortable prop="cost" align="right" min-width="80">
          <template slot-scope="scope"><span>{{scope.row.cost | formatNum}}</span></template>
        </el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="工序名称" align="center" prop="process_desc" min-width="80"></el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="二级工序" align="center" prop="process_desc_c" min-width="80"></el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="备注" prop="memo" min-width="150"></el-table-column>
      </el-table>
      <el-checkbox  v-model="isChoose" :true-label="'1'" :false-label="'0'" @change="isOnlyWay">勾选必经项</el-checkbox>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="doCancel">取消</el-button>
        <el-button type="primary" size="small" @click="doEnsure">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {compareArray} from '@/utils/util.js';
export default {
  // props: ['process', 'codeList'],
  props: ['processCodeC', 'processPointData'],
  data () {
    return {
      filtersColumns: ['base_name'],
      tableProcessPoint: [], // 二级工序点
      tableProcessPointLoading: false,
      selection: [],
      showProcess: false,
      isChoose: '0' // 勾选必经项
    }
  },
  methods: {
    // 查询二级工序点
    doSearchProcessPoint () {
      console.log(this.processCodeC, this.processPointData, 'param');
      let _this = this;
      _this.tableProcessPointLoading = true;
      _this.axios.post('/ComBaseProcessRStationService/doQueryProcessRStationWeb',
        [
          {
            object: {
              processCdoeC: _this.processCodeC.process_code_c,
              processCdoe: _this.processCodeC.process_code
            }
          }
        ]
      ).then(function (response) {
        if (response.data.data) {
          for (let i in response.data.data) {
            response.data.data[i].process_point_seq = parseInt(i) + 1;
          }
          _this.tableProcessPoint = response.data.data;
          // 清空过滤
          _this.$refs.processTab.clearFilter();
          // 设置过滤数据 setFilterDatas(列数组对象, 数据, 需要过滤的字段, 列名转义对象)
          _this.setFilterDatas(_this.$refs.processTab.columns, _this.tableProcessPoint, _this.filtersColumns,
            {
            }
          );
          if (_this.processPointData.length > 0) { // 当该二级工序存在对应工序点时
            let obj = [];
            for (let i in _this.processPointData) {
              for (let j in _this.tableProcessPoint) {
                if (_this.tableProcessPoint[j].process_point_code === _this.processPointData[i].process_point_code) {
                  obj.push(_this.tableProcessPoint[j]);
                  _this.handleSelectPoint(obj);
                }
              }
            }
          }
        }
        _this.tableProcessPointLoading = false;
      }).catch(function (response) {
        _this.tableProcessPointLoading = false;
      })
    },
    // 单选 按勾选的顺序进行排序
    handleSelectPoint (selection) {
      this.tableProcessPointLoading = true;
      let indexs = compareArray(selection, this.tableProcessPoint, 'process_point_code');
      let objTrue = [];
      let objFalse = [];
      for (let i = 0; i < this.tableProcessPoint.length; i++) {
        let flag = false;
        for (let j = 0; j < indexs.length; j++) {
          if (indexs[j] === i) {
            flag = true;
          }
        }
        if (flag) {
          objTrue.push(this.tableProcessPoint[i]);
        } else {
          objFalse.push(this.tableProcessPoint[i]);
        }
      }
      let obj = [...objTrue, ...objFalse];
      for (let i in obj) {
        obj[i].process_point_seq = parseInt(i) + 1;
      }
      this.tableProcessPoint = Object.assign([], obj);
      setTimeout(() => {
        for (let i = 0; i < objTrue.length; i++) {
          this.$refs.processTab.toggleRowSelection(this.tableProcessPoint[i], true);
        }
        this.tableProcessPointLoading = false;
      }, 2);
      this.selection = selection;
    },
    // 多选
    handleSelectAllPoint (selection) {
      this.selection = selection;
    },
    // 勾选必经项
    isOnlyWay () {
      if (this.isChoose === '1') {
        let objTrue = [];
        let objFalse = [];
        for (let i in this.tableProcessPoint) {
          if (this.tableProcessPoint[i].choose === '1') {
            objTrue.push(this.tableProcessPoint[i]);
          } else {
            objFalse.push(this.tableProcessPoint[i]);
          }
        }
        objTrue.sort(sortCode);
        this.tableProcessPoint = [...objTrue, ...objFalse];
        for (let i in this.tableProcessPoint) {
          this.tableProcessPoint[i].process_point_seq = parseInt(i) + 1;
        }
        setTimeout(() => {
          for (let i = 0; i < objTrue.length; i++) {
            this.$refs.processTab.toggleRowSelection(this.tableProcessPoint[i], true);
          }
        }, 2);
      } else {
        this.selection = [];
        this.tableProcessPoint = Object.assign([], this.tableProcessPoint);
      }
    },
    // 取消
    doCancel () {
      this.showProcess = false;
    },
    // 确定
    doEnsure () {
      this.showProcess = false;
      this.$emit('chooseProcessPointSuccess', this.selection);
    }
  },
  watch: {
    processCodeC (value) {
      this.isChoose = '0';
      this.selection = [];
      if (value.process_code_c) {
        this.showProcess = true;
        this.doSearchProcessPoint();
      } else {
        this.tableProcessPoint = [];
      }
    }
  }
}
function sortCode (a, b) {
  if (/^\d/.test(a.process_point_code) ^ / ^\D/.test(b.process_point_code)) return a.process_point_code > b.process_point_code ? 1 : (a.process_point_code === b.process_point_code ? 0 : -1);
  return a.process_point_code > b.process_point_code ? -1 : (a === b ? 0 : 1);
}
</script>
<style scoped></style>
