<template>
  <!-- 交易类 -->
  <div class="content"
       v-loading="loading"
       element-loading-text="加载中"
       element-loading-spinner="el-icon-loading">
    <div class="header">
      <div>
        <i class="back el-icon-arrow-left"
           @click="Back()"
           style="cursor:pointer">
          <span>Back</span>
        </i>
        <span class="title">判分点设置</span>
      </div>
      <div>
        <el-button v-if="!isView"
                   type="primary"
                   size="mini"
                   @click="submit">保存</el-button>
      </div>
    </div>

    <div>
      <div class="form-con">
        <div class="title">
          <div class="black"></div>
          <div>基本信息</div>
        </div>
        <div class="item">
          <div class="label">判分点</div>
          <el-input v-model.trim="formData.lcJudgmentPoint.name"
                    :readonly="isView"
                    @blur="handleBlur"
                    placeholder="请输入内容"
                    clearable
                    style="width: 400px"></el-input>
        </div>
        <div class="item">
          <div class="label">实验要求</div>
          <quill class="quill"
                 v-model="formData.lcJudgmentPoint.experimentalRequirements"
                 :readonly="isView"
                 :border="true"
                 :minHeight="150"
                 :height="150" />
        </div>
      </div>

      <div class="rule-con">
        <div class="title-con">
          <div class="title">
            <div class="black"></div>
            <div>判分规则</div>
          </div>
        </div>
        <el-dialog :visible.sync="configVisible"
                   width="25%"
                   title="批量新增判分点"
                   center
                   :append-to-body="false">
          <div class="flex-between mgb20">
            <div style="width: 100%;height: 400px;overflow: auto;margin: auto;background: #F5F5F5">
              <el-tree class="add-tree"
                       style="background: #F5F5F5"
                       :data="treeData"
                       @check="currentChecked"
                       header-align="center"
                       show-checkbox
                       ref="tree"
                       node-key="operationIds"
                       :props="defaultProps"
                       v-if="configVisible">
                <span class="custom-tree-node"
                      slot-scope="{ node, data }">
                  <span>{{ node.label }}</span>
                  <em class="exist"
                      v-if="data.exist">（已导入）</em>
                </span>
              </el-tree>
            </div>
          </div>
          <span slot="footer"
                class="dialog-footer">
            <el-button @click="configVisible = false">取 消</el-button>
            <el-button type="primary"
                       @click="handleConfirm">确 定</el-button>
          </span>
        </el-dialog>

        <el-card shadow="hover"
                 style="margin-bottom: 20px">
          <div class="business-wrap">
            <div class="business">
              <div class="label">{{isSt ? '关卡' : '业务'}}</div>
              <el-select v-model="formData.lcJudgmentPoint.business"
                         :placeholder="'请选择' + (isSt ? '关卡' : '业务')">
                <el-option v-for="(item, i) in businessList"
                           :key="i"
                           :label="item.name"
                           :value="item.id"></el-option>
              </el-select>
            </div>
            <div>
              <el-button v-if="!isView"
                         type="primary"
                         size="mini"
                         @click="batchDel">批量删除</el-button>
              <el-button v-if="!isView"
                         type="primary"
                         size="mini"
                         @click="saveAll">一键保存</el-button>
              <el-button v-if="!isView"
                         type="primary"
                         size="mini"
                         @click="addRules">新增</el-button>
            </div>
          </div>
        </el-card>

        <el-card shadow="hover">
          <el-table class="lc-table"
                    :data="tableData"
                    :stripe="true"
                    :key="itemkey"
                    row-key="i"
                    header-align="center"
                    @selection-change="handleSelectionChange">
            <el-table-column type="selection"
                             width="55">
            </el-table-column>
            <el-table-column prop="indexNo"
                             type="index"
                             label="序号"
                             width="80">
              <template slot-scope="scope">
                {{ scope.row.isSubject && scope.row.index + 1 }}
              </template>
            </el-table-column>
            <el-table-column label="流程类考核点">
              <template slot-scope="scope"
                        v-if="scope.row.isSubject">
                <p class="p">操作一致性规则：用户完成的功能操作与下方设置的操作点一致</p>
                <div class="tree-con">
                  <div class="block1"
                       :id="'divTree'+scope.$index">
                    <el-tree :data="scope.row.operationIData"
                             :props="defaultProp"
                             :default-expand-all="true"></el-tree>
                  </div>
                  <div v-show="scope.row.isDisabled"
                       class="mask"></div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label=" "
                             width="150"
                             align="center">
              <template slot-scope="scope">
                <el-button circle
                           type="primary"
                           v-if="scope.row.isSubject"
                           :disabled="isSt || isView || scope.row.isDisabled"
                           @click="changeResult(scope.row)">
                  {{ scope.row.resultOperation === 0 ? "且" : "或" }}
                </el-button>
                <el-button v-else
                           type="primary"
                           circle
                           @click="changeRule(scope.row, scope.$index)">
                  {{ scope.row.ruleOperation === 0 ? "且" : "或" }}
                </el-button>
              </template>
            </el-table-column>
            <el-table-column label="正确答案">
              <template slot-scope="scope"
                        v-if="scope.row.isSubject">
                <p class="p"
                   style="margin-top: 1px">交易结果一致性规则：用户交易结果需要与下面设置的交易结果指标要求一致</p>
                <div class="block">
                  <!-- type: 题目类型(1选择 2判断 3填空 4问答 5指标结果) -->
                  <div v-if="scope.row.operationIds && scope.row.type == null"
                       style="line-height: 65px;text-align: center">需点击</div>
                  <template v-if="scope.row.type == 1">
                    <div class="box">
                      <div class="line">
                        <div>{{ scope.row.name }}</div>
                      </div>
                      <div class="line">
                        <span class="label mini">正确答案</span>
                        <div class="action">
                          <!--multiple:多选-->
                          <el-select v-model="scope.row.value1"
                                     :disabled="isView || scope.row.isDisabled"
                                     size="mini"
                                     :multiple="isSt"
                                     style="width: 100%;overflow: hidden;">
                            <el-option v-for="(item, i) in isSt ? scope.row.stItems : scope.row.lcItems"
                                       :key="i"
                                       :label="item.options"
                                       :value="item.itemId"></el-option>
                          </el-select>
                        </div>
                      </div>
                    </div>
                  </template>

                  <template v-if="scope.row.type == 2">
                    <div class="box">
                      <div class="line">
                        <div>{{ scope.row.name }}</div>
                      </div>
                      <div class="line">
                        <span class="label mini">正确答案</span>
                        <div class="action">
                          <el-select v-model="scope.row.value1"
                                     :disabled="isView || scope.row.isDisabled"
                                     size="mini"
                                     style="width: 100%;">
                            <el-option v-for="(item, i) in scope.row.lcItems"
                                       :key="i"
                                       :label="item.options"
                                       :value="item.subjectId"></el-option>
                          </el-select>
                        </div>
                      </div>
                    </div>
                  </template>

                  <template v-if="scope.row.type == 3">
                    <div class="box">
                      <div class="line"
                           style="min-height: 100%;">
                        <span class="label">
                          <!--<el-checkbox v-model="scope.row.fieldOfReq" :disabled="isView || scope.row.isDisabled">字段要求</el-checkbox>-->
                          字段要求
                        </span>
                        <div class="action">
                          <el-input class="mini-textarea"
                                    type="textarea"
                                    rows="6"
                                    size="mini"
                                    v-model.trim="scope.row.value1"
                                    :disabled="isView || scope.row.isDisabled"
                                    placeholder="字段之间以逗号隔开"></el-input>
                        </div>
                      </div>
                    </div>
                  </template>

                  <template v-if="scope.row.type == 4">
                    <div class="box">
                      <div class="line">
                        <span class="label">
                          <!--<el-checkbox v-model="scope.row.numOfWords" :disabled="isView || scope.row.isDisabled">字数要求</el-checkbox>-->
                          字数要求
                        </span>
                        <div class="action a-line">
                          <el-select v-model="scope.row.value1"
                                     :disabled="isView || scope.row.isDisabled"
                                     size="mini">
                            <el-option label=">"
                                       value=">"></el-option>
                            <el-option label="<"
                                       value="<"></el-option>
                            <el-option label="="
                                       value="="></el-option>
                            <el-option label=">="
                                       value=">="></el-option>
                            <el-option label="<="
                                       value="<="></el-option>
                            <el-option label="无限制"
                                       value="无限制"></el-option>
                          </el-select>
                          <el-input class="number-input"
                                    v-model.trim="scope.row.value2"
                                    :disabled="isView || scope.row.isDisabled"
                                    onkeyup="value=this.value.replace(/\D+/g,'')"
                                    oninput="value=value.replace(/[^0-9.]/g,'')"
                                    type="number"
                                    min="1"
                                    size="mini"
                                    style="margin-left: 5px;"></el-input>
                        </div>
                      </div>
                      <div class="line">
                        <span class="label">
                          <!--<el-checkbox v-model="scope.row.fieldOfReq" :disabled="isView || scope.row.isDisabled">字段要求</el-checkbox>-->
                          字段要求
                        </span>
                        <div class="action">
                          <el-input class="mini-textarea"
                                    type="textarea"
                                    rows="5"
                                    size="mini"
                                    v-model.trim="scope.row.value3"
                                    :disabled="isView || scope.row.isDisabled"
                                    placeholder="字段之间以逗号隔开"></el-input>
                        </div>
                      </div>
                    </div>
                  </template>

                  <template v-if="scope.row.type == 5">
                    <div class="box"
                         style="padding: 0;">
                      <div class="line">
                        <div>{{ scope.row.name }}</div>

                      </div>
                      <div class="line"
                           style="flex-direction: column;">
                        <p class="label">交易指标区间</p>
                        <div class="action">
                          <div class="inputs range">
                            <el-select v-model="scope.row.value2"
                                       :disabled="isView || scope.row.isDisabled"
                                       size="mini"
                                       clearable
                                       placeholder="符号">
                              <el-option v-for="(item, i) in leftSymbols"
                                         :key="i"
                                         :value="item.name"></el-option>
                            </el-select>
                            <el-input class="number-input"
                                      v-model.trim="scope.row.value3"
                                      :disabled="isView || scope.row.isDisabled"
                                      size="mini"
                                      placeholder="数值" />
                            <el-input class="number-input"
                                      v-model.trim="scope.row.value4"
                                      :disabled="isView || scope.row.isDisabled"
                                      size="mini"
                                      placeholder="单位" />
                            <span>~</span>
                            <el-input class="number-input"
                                      v-model.trim="scope.row.value5"
                                      :disabled="isView || scope.row.isDisabled"
                                      size="mini"
                                      placeholder="数值" />
                            <el-input class="number-input"
                                      v-model.trim="scope.row.value6"
                                      :disabled="isView || scope.row.isDisabled"
                                      size="mini"
                                      placeholder="单位" />
                            <el-select :disabled="isView || scope.row.isDisabled"
                                       v-model="scope.row.value7"
                                       size="mini"
                                       clearable
                                       placeholder="符号">
                              <el-option v-for="(item, i) in rightSymbols"
                                         :key="i"
                                         :value="item.name"></el-option>
                            </el-select>
                          </div>
                        </div>
                      </div>
                    </div>
                  </template>

                  <template v-if="scope.row.type == 6">
                    <div class="box money-box">
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check1"
                                     :disabled="isView || scope.row.isDisabled">100元</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val1"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check2"
                                     :disabled="isView || scope.row.isDisabled">50元</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val2"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check3"
                                     :disabled="isView || scope.row.isDisabled">20元</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val3"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check4"
                                     :disabled="isView || scope.row.isDisabled">10元</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val4"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check5"
                                     :disabled="isView || scope.row.isDisabled">5元</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val5"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check6"
                                     :disabled="isView || scope.row.isDisabled">1元</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val6"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check7"
                                     :disabled="isView || scope.row.isDisabled">5角</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val7"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                      <div class="line">
                        <el-checkbox class="money-check"
                                     v-model="scope.row.check8"
                                     :disabled="isView || scope.row.isDisabled">1角</el-checkbox>
                        <el-input class="money"
                                  placeholder="请输入数量"
                                  type="number"
                                  size="mini"
                                  v-model="scope.row.val8"
                                  :disabled="isView || scope.row.isDisabled" />
                      </div>
                    </div>
                  </template>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="操作"
                             width="300"
                             v-if="!isView">
              <template slot-scope="scope"
                        v-if="scope.row.isSubject">
                <el-button v-show="scope.row.isDisabled"
                           size="mini"
                           type="text"
                           @click="handleEdit(scope.row)">编辑
                </el-button>
                <el-button v-show="!scope.row.isDisabled"
                           size="mini"
                           type="text"
                           @click="handleSave(scope.row, scope.$index)">保存
                </el-button>
                <!-- <el-button v-show="!scope.row.isDisabled"
                           size="mini"
                           type="text"
                           @click="handleCancel(scope.row, scope.$index)">取消
                </el-button> -->
                <el-button v-show="scope.row.isDisabled"
                           size="mini"
                           type="text"
                           @click="handleDelete(scope.row, scope.$index)">删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </div>
    </div>
    <el-backtop></el-backtop>
  </div>
</template>

<script>
import quill from "@/components/quill";
import MyTree from "@/components/myTree/src/tree";
import { deepCopy } from "@/utils/deepCopy";
import { mapState } from 'vuex'
import _ from 'lodash'
export default {
  components: { quill, MyTree },
  data () {
    return {
      systemId: this.$route.query.systemId,
      isSt: this.$route.query.systemId == 19,
      count: 0,
      fromChange: -999,
      fromCountIndex: -999,
      checkChange: [],
      changeArr: [],
      multipleSelection: [],
      lcId: "", // 流程类判分点id
      isAdd: Boolean(this.$route.query.isAdd), // 添加
      isEdit: Boolean(this.$route.query.isEdit), // 编辑
      isView: Boolean(this.$route.query.isView), // 查看
      isNameRepeat: false, // 名称是否重复
      treeData: [], // 树结构数据
      defaultProps: {
        children: "children",
        label: "label"
      }, // 树结构配置项
      defaultProp: {
        children: "children",
        label: "name"
      }, // 树结构配置项
      currentNodeData: {}, // 当前选中的节点
      businessList: [],
      formData: {
        lcJudgmentPoint: {
          business: '',
          name: "",
          experimentalRequirements: "",
          isDel: 0,
          isOpen: 0,
          projectId: "",
          systemId: ""
        },
        lcJudgmentRuleList: []
      }, // 表单参数
      leftSymbols: [
        {
          name: '('
        },
        {
          name: '['
        },
      ],
      rightSymbols: [
        {
          name: ')'
        },
        {
          name: ']'
        },
      ],
      tableData: [], // 规则表格数据
      tableDataCopy: [], // 规则表格数据备份
      isAddRule: false, // 是否禁用新增规则按钮
      itemkey: '',
      judgePoints: false,//判断是否点了编辑
      configVisible: false,
      SelectedObj: [],
      counts: 0,
      loading: true,
      moneys: [100, 50, 20, 10, 5, 1, 0.5, 0.1],
    };
  },
  computed: {
    ...mapState({
      treeDataStore: state => state.treeDataStore
    })
  },
  mounted () {
    const { token, referrer } = this.$route.query
    if (token) {
      localStorage.setItem('token', atob(decodeURI(token)))
      localStorage.setItem('referrer', atob(decodeURI(referrer)))
    }

    if (this.isSt) {
      this.leftSymbols = [
        {
          name: '>='
        },
        {
          name: '<'
        },
        {
          name: '>'
        },
        {
          name: '=='
        },
        {
          name: '<='
        },
      ]
      this.rightSymbols = [
        {
          name: '>='
        },
        {
          name: '<'
        },
        {
          name: '>'
        },
        {
          name: '=='
        },
        {
          name: '<='
        },
      ]
    }
    this.getBusiness()
    this.checkChange.push(false)
    this.getTreeData();
    if (this.$route.query.systemId) {
      this.formData.lcJudgmentPoint.systemId = this.$route.query.systemId;
    }
  },
  methods: {
    getInfoData (lcId) { // 获取判分点详细信息
      this.counts = 0
      this.$get(`${this.api[this.isSt ? 'queryJudgmentPointDetailsSt' : 'queryJudgmentPointDetails']}?lcId=${lcId}`).then(res => {
        if (res.status === 200) {
          let { judgmentPoint, judgmentRuleList } = res;
          this.formData = {
            lcJudgmentPoint: judgmentPoint,
            lcJudgmentRuleList: judgmentRuleList
          };
          this.$set(this.formData.lcJudgmentPoint, 'business', +judgmentRuleList[0].operationIds.split(',')[1]) // 业务id取operationIds的第二个id，第一个是固定的285
          this.anewPosttingData(judgmentRuleList)
          this.tableData.forEach(async (item, index) => {
            item.i = index
            // 勾选树节点
            if (item.operationIds) {
              let list = _.cloneDeep(this.treeData)
              item.operationIData = []
              let result = {}
              let serial = 0
              this.handleRule(item.operationIds.split(','), list, result, serial)
              item.operationIData.push(result.children[0])
            }
          });
          this.setIndex()
          this.$nextTick(() => {
            this.loading = false
          })
        } else {
          this.$message.warning(res.message);
          this.loading = false
        }
      }).catch(err => {
        this.loading = false
      });
    },
    // 获取业务
    getBusiness () {
      if (this.isSt) {
        this.$post(this.api.checkpointList, {
          platformId: 3,
          isEnable: 1
        }).then(({ data }) => {
          data.forEach(e => {
            e.name = e.customsPassName
            e.id = e.checkpointId
          })
          this.businessList = data
        }).catch(res => { })
      } else {
        this.$post(`${this.api.getAllBusiness}?systemId=${this.systemId}`).then(({ stRecords, lcRecords }) => {
          this.businessList = lcRecords
        }).catch(res => { })
      }
      // this.$post(`${this.api[this.isSt ? 'getAllBusinessSt' : 'getAllBusiness']}?systemId=${this.systemId}`).then(({ stRecords, lcRecords }) => {
      //   this.businessList = this.isSt ? stRecords : lcRecords
      // }).catch(res => { })
    },
    handleSelectionChange (val) {
      this.multipleSelection = val
    },
    handleRule (id, list, result, serial) {
      const curId = id[serial]
      const cur = list.find(e => e.id == curId)
      result.children = cur ? [cur] : []
      ++serial
      cur && cur.children && this.handleRule(id, cur.children, result.children[0], serial)
    },
    //计算此节点的距离思路1.计算出当前节点据顶部的高度+当前节点在树的位置的高度-盒子高度的一半
    scrollToDepTree (deptCode) {

    },
    currentChecked (nodeObj, SelectedObj) {
      this.SelectedObj = SelectedObj
    },
    handleConfirm () {
      this.counts = this.counts + 1
      let list = []
      if (this.SelectedObj.checkedNodes.length > 0) {
        for (let i = 0; i < this.SelectedObj.checkedNodes.length; i++) {
          if (this.SelectedObj.checkedNodes[i].children && this.SelectedObj.checkedNodes[i].children.length > 0) {

          } else {
            this.SelectedObj.checkedNodes[i].resultOperation = 0
            if (this.SelectedObj.checkedNodes[i].id) {
              list.push(this.SelectedObj.checkedNodes[i])
            }
          }
        }
      }
      this.anewPosttingDatas(list)
      let i = 0
      this.tableData.forEach(async (item, index) => {
        // 勾选树节点
        if (!item.type) {
          this.getSubjectData(item.subjectId, index);
        }
        if (item.operationIds) {
          let list = _.cloneDeep(this.treeData)
          item.operationIData = []

          let result = {}
          let serial = 0
          this.handleRule(item.operationIds.split(','), list, result, serial)
          result.children && item.operationIData.push(result.children[0])
        }
      });
      this.setIndex()
      this.configVisible = false
    },
    anewPosttingDatas (judgmentRuleList) {
      let length = judgmentRuleList.length;
      let tempArr = [];
      if (this.tableData.length > 0) {
        tempArr.push({ ruleOperation: 0 });
      } else {
        tempArr = []
      }
      judgmentRuleList.forEach((item, index) => {
        let obj = {
          ...item,
          isSubject: true,
          isDisabled: false,  // 已禁用
          isSave: false // 已保存
        };
        obj.operationIds = item.operationIds
        if (item.type == undefined || item.type == '') {
          obj.type = null
          for (let i = 1; i < 9; i++) {
            obj['check' + i] = false
            obj['val' + i] = ''
          }
        } else {
          obj.type = item.type
        }
        //题目类型(1选择 2判断 3填空 4问答 5指标结果)
        if (item.type == 1 || item.type == 2) {
          obj.subjectId = Number(item.emptyOne);
          obj.value1 = +item.emptyTwo;
        } else if (item.type == 3) {
          obj.subjectId = Number(item.emptyOne);
          obj.value1 = item.emptyTwo;
        } else if (item.type == 4) {
          // 需要提目id
          if (item.emptyOne === "无限制") {
            obj.value1 = item.emptyOne;
            obj.value2 = "";
          } else {
            obj.value1 = item.emptyOne.substring(0, item.emptyOne.indexOf(","));
            obj.value2 = item.emptyOne.substring(item.emptyOne.indexOf(",") + 1, item.emptyOne.length);
          }
          obj.value3 = item.emptyTwo;
        } else if (item.type == 5) {
          obj.subjectId = Number(item.emptyOne);
          const temp = item.emptyTwo.split('~')
          if (temp.length) {
            const symbol = temp[0].match(/[<>=]+/g)
            const num = temp[0].match(/[\d\.]+/g)
            const unit = temp[0].match(/[^<>=\d\.]+/g)
            const symbol1 = temp.length > 1 ? temp[1].match(/[<>=]+/g) : ''
            const num1 = temp.length > 1 ? temp[1].match(/[\d\.]+/g) : ''
            const unit1 = temp.length > 1 ? temp[1].match(/[^<>=\d\.]+/g) : ''
            obj.value2 = symbol ? symbol[0] : ''
            obj.value3 = num ? num[0] : ''
            obj.value4 = unit ? unit[0] : ''
            obj.value5 = num1 ? num1[0] : ''
            obj.value6 = unit1 ? unit1[0] : ''
            obj.value7 = symbol1 ? symbol1[0] : ''
          }
        }
        tempArr.push(obj);
        if (length > 1 && index !== (length - 1)) {
          if (item.ruleOperation) {
            tempArr.push({ ruleOperation: item.ruleOperation });
          } else {
            tempArr.push({ ruleOperation: 0 });
          }
        }
      });
      for (var i = 0; i < tempArr.length; i++) {
        this.tableData.push(tempArr[i]);
      }
    },
    // 重新封装数据
    anewPosttingData (judgmentRuleList) {
      let length = judgmentRuleList.length;
      let tempArr = [];
      judgmentRuleList.forEach((item, index) => {
        let obj = {
          ...item,
          isSubject: true,
          isDisabled: true,  // 已禁用
          isSave: true // 已保存
        };
        obj.operationIds = obj.operationIds.split(',').slice(2).join()
        if (item.type == undefined || item.type == '') {
          obj.type = null
        } else {
          obj.type = item.type
        }
        //题目类型(1选择 2判断 3填空 4问答 5指标结果)
        if (item.type == 1 && this.isSt) {
          obj.subjectId = Number(item.emptyOne);
          obj.value1 = item.emptyTwo.split(',').map(e => +e)
        } else if (item.type == 1 || item.type == 2) {
          obj.subjectId = Number(item.emptyOne);
          obj.value1 = +item.emptyTwo;
        } else if (item.type == 3) {
          obj.subjectId = Number(item.emptyOne);
          obj.value1 = item.emptyTwo;
        } else if (item.type == 4) {
          // 需要提目id
          if (item.emptyOne === "无限制") {
            obj.value1 = item.emptyOne;
            obj.value2 = "";
          } else {
            obj.value1 = item.emptyOne.substring(0, item.emptyOne.indexOf(","));
            obj.value2 = item.emptyOne.substring(item.emptyOne.indexOf(",") + 1, item.emptyOne.length);
          }
          obj.value3 = item.emptyTwo;
        } else if (item.type == 5) {
          obj.subjectId = Number(item.emptyOne);
          const temp = item.emptyTwo.split('~')
          if (temp.length) {
            const symbol = temp[0].match(/[<>=]+/g)
            const num = temp[0].match(/[\d\.]+/g)
            const unit = temp[0].match(/[^<>=\d\.]+/g)
            const symbol1 = temp.length > 1 ? temp[1].match(/[<>=]+/g) : ''
            const num1 = temp.length > 1 ? temp[1].match(/[\d\.]+/g) : ''
            const unit1 = temp.length > 1 ? temp[1].match(/[^<>=\d\.]+/g) : ''
            obj.value2 = symbol ? symbol[0] : ''
            obj.value3 = num ? num[0] : ''
            obj.value4 = unit ? unit[0] : ''
            obj.value5 = num1 ? num1[0] : ''
            obj.value6 = unit1 ? unit1[0] : ''
            obj.value7 = symbol1 ? symbol1[0] : ''
          }
        } else if (item.type == 6) {
          obj.subjectId = Number(item.emptyOne);
          const money = item.emptyTwo.split(',') // 金额
          const { moneys } = this
          for (let i = 1; i < 9; i++) {
            obj['check' + i] = false
            obj['val' + i] = ''
          }
          money.map(e => {
            const val = e.split('-')
            const i = moneys.findIndex(n => n == val[0])
            obj['check' + (i + 1)] = true
            obj['val' + (i + 1)] = val[1]
          })
        }
        tempArr.push(obj);
        if (length > 1 && index !== (length - 1)) {
          tempArr.push({ ruleOperation: item.ruleOperation });
        }
        this.tableData = tempArr;
      });
    },
    getSubjectData (subjectId, index) { // 获取题目信息
      if (subjectId) {
        this.$get(`${this.api[this.isSt ? 'getSubjectInfoSt' : 'getSubjectInfo']}?subject_id=${subjectId}`).then(res => {
          if (res.status === 200) {
            let item = {
              ...this.tableData[index],
              ...res.subject,
              lcItems: res.items,
              stItems: res.items,
            };
            this.$set(this.tableData, index, item);
          }
        }).catch(err => {
        });
      }
    },
    handleCheckChange (data, checked, indeterminate, row, index) { // 处理勾选
      if (checked && data.isNode === 1) {
        if (!data.type) {
          this.getSubjectData(data.subjectId, index);
        }
        this.tableData[index].operationIds = data.operationIds; // 操作id串
        if (data.subjectId) { // 是否有题目id
          this.currentNodeData = data;
          this.$refs[`tree-${index}`].setCheckedNodes([data]);
          if (this.counts > 0) {
            this.getSubjectData(data.subjectId, index);
          }
        } else {
          row.type = null;
          this.currentNodeData = {};
          this.$refs[`tree-${index}`].setCheckedNodes([data]);
        }
        let divTree = '#divTree' + index;
        let dom = document.querySelector(divTree)
        let depTree = '#depTree' + index;
        let dom1 = document.querySelector(depTree)
        let nodeHight = 26
        dom.scrollTo(0, 26)
        dom1.style.height = (data.number * nodeHight) + "px"
        let contHeight = (data.number * nodeHight)//总高度,盒子高度的一半
        dom.scrollTo(0, contHeight)
      }
    },
    getTreeData () { // 获取树结构数据
      // if(this.treeDataStore.length) {
      //     const tmp = deepCopy(this.treeDataStore)
      //     this.treeData = this.toTreeId(tmp);
      //     if (this.$route.query.lcId) {
      //       this.lcId = this.$route.query.lcId;
      //       this.getInfoData(this.$route.query.lcId);
      //     }
      //     this.loading = false
      // }else {
      this.$post(`${this.api[this.isSt ? 'getProcessSt' : 'getProcess']}?systemId=${this.systemId}`).then(({ process, status, message }) => {
        if (status == 200) {
          if (process.length) {
            this.$store.commit('setTreeDataStore', { treeDataStore: process })
            this.treeData = this.toTreeId(process);
            this.loading = false
            if (this.$route.query.lcId) {
              this.lcId = this.$route.query.lcId;
              this.getInfoData(this.$route.query.lcId);
            }
          }
        } else {
          this.$message.warning(message);
        }
      }).catch(err => {
        this.loading = false
      });
      // }
    },
    toTreeId (data, parentId) { // id重新串连成（父+子+孙）,已便达到树节点需要的key唯一性,且后面提交数据，需要传这个id串到后台
      const name = this.isSt ? 'recordChildren' : 'children'
      let result = [];
      data.forEach(item => {
        item.label = item.name
        if (item.isNode === 0) {
          item.showCheckbox = false;
        } else {
          item.showCheckbox = true;
        }
        item.operationIds = parentId ? `${parentId},${item.id}` : `${item.id}`
        if (this.isSt && item.recordChildren) item.children = item.recordChildren
        if (item[name] && item[name].length) item[name] = this.toTreeId(item[name], item.operationIds)
        result.push(item);
      });
      return result;
    },
    Back () { // 返回
      this.$router.back();
    },
    handleBlur () { // 新增/编辑判分点名称判重
      if (this.formData.lcJudgmentPoint.name) {
        let params = {
          lcId: this.lcId,
          name: this.formData.lcJudgmentPoint.name,
          systemId: this.systemId
        };
        this.$post(this.api.queryNameIsExist, params).then(res => {
          if (res.status === 200) {
            this.isNameRepeat = false;
          } else {
            this.isNameRepeat = true;
          }
        }).catch(err => { });
      }
    },
    submit () { // 保存判分点
      const point = this.formData.lcJudgmentPoint
      if (!point.name) {
        this.$message.warning(`判分点名称不能为空`);
        return;
      }
      if (this.isNameRepeat) {
        this.$message.warning(`当前判分点名称已存在`);
        return;
      }
      if (!point.business) {
        this.$message.warning(`请选择${this.isSt ? '关卡' : '业务'}`);
        return;
      }
      if (!point.experimentalRequirements) {
        this.$message.warning(`实验要求不能为空`);
        return;
      }
      if (!this.tableData.length) {
        this.$message.warning(`请添加判分规则`);
        return;
      } else {
        const list = this.tableData
        for (let i = 0; i < list.length; i++) {
          if (list[i].isSubject && !list[i].operationIds) {
            this.$message.warning(`第${list[i].index + 1}项请选择操作点`);
            return;
          } else if (list[i].isSubject && !list[i].isSave) {
            this.$message.warning(`第${list[i].index + 1}项，未保存`);
            return;
          }
        }
      }
      let tempArr = [];
      this.tableData.forEach(i => {
        if (i.isSubject) {
          let obj = {
            emptyOne: "",
            emptyTwo: "",
            id: "",
            lcId: i.lcId,
            itemId: '',
            type: i.type ? i.type : "",
            operationIds: `${this.systemId == 11 ? 285 : 1},${point.business},${i.operationIds}`,
            resultOperation: i.resultOperation,
            ruleOperation: i.ruleOperation
          };
          //题目类型(1选择 2判断 3填空 4问答 5指标结果)
          if (i.type == 1 || i.type == 2) {
            obj.emptyOne = i.subjectId ? i.subjectId.toString() : "";
            // obj.itemId = i.value1 ? i.value1.toString() : "";
            obj.emptyTwo = i.value1 ? i.value1.toString() : "";
          } else if (i.type == 3) {
            obj.emptyOne = i.subjectId ? i.subjectId.toString() : "";
            obj.emptyTwo = i.value1;
          } else if (i.type == 4) {
            if (i.value1 === "无限制") {
              obj.emptyOne = i.value1;  // 问答题,传的不是题目id
            } else if (i.value1 && i.value2) {
              obj.emptyOne = `${i.value1},${i.value2}`;  // 问答题,传的不是题目id
            }
            obj.emptyTwo = i.value3;
          } else if (i.type == 5) {
            // obj.emptyOne = i.value1; // 选择指标不传
            obj.emptyOne = i.subjectId ? i.subjectId.toString() : "";
            obj.emptyTwo = `${i.value2 || ''}${i.value3 || ''}${i.value4 || ''}${i.value5 ? '~' + i.value5 : ''}${i.value6 || ''}${i.value7 || ''}`;
          } else if (i.type == 6) {
            const money = []
            const { moneys } = this
            for (let n = 1; n < 9; n++) {
              if (i['check' + n] && i['val' + n]) money.push(moneys[n - 1] + '-' + i['val' + n])
            }
            obj.emptyOne = i.subjectId ? i.subjectId.toString() : "";
            obj.emptyTwo = money.join()
          }
          tempArr.push(obj);
        }
      });
      this.formData.lcJudgmentRuleList = tempArr;
      if (this.isAdd) { // 新增判分点
        this.$post(this.api.addJudgmentPoint, this.formData).then(res => {
          if (res.status === 200) {
            this.$message.success("新增判分点成功");
            this.Back();
          } else {
            this.$message.warning(res.message);
          }
        }).catch(err => { });
      } else if (this.isEdit) { // 编辑判分点
        this.$post(this.api.updateJudgmentPoint, this.formData).then(res => {
          if (res.status === 200) {
            this.$message.success("更新判分点成功");
            this.Back();
          } else {
            this.$message.warning(res.message);
          }
        }).catch(err => { });
      }
    },
    // 新增判分点
    addRules () {
      this.configVisible = TextTrackCue
      const ids = []
      const treeData = this.treeData
      const list = this.tableData
      list.map(e => {
        e.operationIds && ids.push(e.operationIds) // 获取列表中已有的判分id
      })
      // 列表中已有的判分，在新增判分树形里判分名后面加上已导入三个字
      const addSuffix = data => {
        data.map(e => {
          // 判分规则列表上的规则，要加个标识
          e.exist = ids.includes(e.operationIds) || (e.children && e.children.length && e.children.every(n => ids.includes(n.operationIds)))
          // 有子级，则递归
          if (e.children && e.children.length) addSuffix(e.children)
        })
      }
      addSuffix(treeData)
      this.$nextTick(() => {
        this.$refs.tree.setCheckedKeys([])
      })

    },
    addRule () { // 新增规则
      this.changeArr.splice(0, this.changeArr.length)
      this.checkChange.push(false)
      if (!this.isAddRule) {
        this.isAddRule = true;
        if (this.tableData.length > 0) {
          this.tableData.push({
            ruleOperation: 0
          }, {
            indexNo: this.tableData.length + 1,
            isSubject: true,
            isDisabled: false, // 不禁用
            isSave: false, // 未保存
            lcId: this.lcId,
            resultOperation: 0,
            ruleOperation: 0,
            operationIds: "",
            value1: "",
            value2: "",
            value3: "",
            value4: "",
            value5: "",
            value6: "",
            value7: "",
          });
        } else {
          this.tableData.push({
            indexNo: this.tableData.length + 1,
            isSubject: true,
            isDisabled: false, // 不禁用
            isSave: false, // 未保存
            lcId: this.lcId,
            resultOperation: 0,
            ruleOperation: 0,
            operationIds: "",
            value1: "",
            value2: "",
            value3: "",
            value4: "",
            value5: "",
            value6: "",
            value7: "",
          });
        }
      } else {
        this.$message('请保存当前判分规则再新增！');
      }
    },
    changeResult (row) { // （左右）结果运算符(0：且 1：或 默认0)
      row.resultOperation = row.resultOperation === 0 ? 1 : 0;
    },
    changeRule (row, index) { // （上下）规则运算符(0：且 1：或 默认0)
      row.ruleOperation = row.ruleOperation === 0 ? 1 : 0;
      this.tableData[index - 1].ruleOperation = row.ruleOperation;
    },
    // 设置序号
    setIndex () {
      let i = 0
      this.tableData.map(e => {
        if (e.isSubject) e.index = i++
      })
    },
    handleEdit (row) { // 处理编辑规则
      this.judgePoints = true
      // this.tableDataCopy = deepCopy(this.tableData); // 深拷贝
      row.isDisabled = false;
      row.isSave = false;
    },
    handleSave (row, index) { // 处理保存规则
      if (!row.operationIds) {
        this.$message.warning(`请选择操作点`);
        return;
      } else {
        //题目类型(1选择 2判断 3填空 4问答 5指标结果)
        if (row.type == 1 || row.type == 2) {
          if (row.type == 1 && this.isSt) {
            if (!row.value1.length) {
              this.$message.warning(`请选择正确答案`);
              return;
            }
          } else if (!row.value1) {
            this.$message.warning(`请选择正确答案`);
            return;
          }
        } else if (row.type == 3) {
          if (!row.value1) {
            this.$message.warning(`请输入字段要求`);
            return;
          }
        } else if (row.type == 4) {
          if (!row.value1) {
            this.$message.warning(`请选择字数要求`);
            return;
          } else if (row.value1 !== "无限制" && !row.value2) {
            this.$message.warning(`请输入字数要求`);
            return;
          } else if (!row.value3) {
            this.$message.warning(`请输入字段要求`);
            return;
          }
        } else if (row.type == 5) {
          if ((!row.value2 || !row.value5) && !this.isSt) {
            this.$message.warning(`请选择交易指标区间`);
            return;
          } else if ((!row.value3 || !row.value5) && !this.isSt) {
            this.$message.warning(`请输入交易指标区间`);
            return;
          } else if (row.value3 && row.value5 && !isNaN(row.value3) && !isNaN(row.value5) && +row.value3 > +row.value5) {
            this.$message.warning(`第一个指标必须小于第二个指标`);
            return;
          }
        } else if (row.type == 6) {
          for (let i = 1; i < 9; i++) {
            if (row['check' + i] && row['val' + i] === '') {
              this.$message.warning(`请输入数量`)
              return
            }
          }
        }
      }
      row.isSave = true;
      row.isDisabled = true;
      this.isAddRule = false;
    },
    handleCancel (row, index) { // 处理取消编辑规则
      if (this.judgePoints == true) {
        this.judgePoints = false
        this.$set(this.tableData, index, this.tableDataCopy[index]);
        if (!this.tableData[index].operationIds) {
          // this.$refs[`tree-${index}`].setCheckedKeys([]);
        } else {
          // this.$refs[`tree-${index}`].setCheckedKeys([this.tableData[index].operationIds]);
        }
      } else {
        if (index + 1 == this.tableData.length) {
          this.tableData.splice(index - 1, 2)
        } else {
          this.tableData.splice(index, 2);
        }
        this.isAddRule = false;
      }
      this.setIndex()
    },
    handleDelete (row, index) { // 处理删除规则
      this.$confirm("此操作将永久删除该规则, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true
      }).then(() => {
        if (index + 1 == this.tableData.length) {
          this.tableData.splice(index - 1, 2)
        } else {
          this.tableData.splice(index, 2);
        }
        this.itemkey = Math.random()
        this.tableData.forEach(async (item, index) => {
          // 勾选树节点
          if (item.operationIds) {
            this.$nextTick(() => {
              // this.$refs[`tree-${index}`].setCheckedKeys([item.operationIds]);
            });
          }
          // 根据题目id,获取题目信息
          if (item.isSubject && item.type && item.type != 4 && item.emptyOne) {
            await this.getSubjectData(item.emptyOne, index);
          }
        });
        this.isAddRule = false;
      }).catch(() => {
      });
    },
    // 批量删除
    batchDel () {
      if (this.multipleSelection.length) {
        this.$confirm("此操作将永久删除该规则, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
          center: true
        }).then(() => {
          const prop = this.isAdd ? 'index' : 'id'
          const ids = this.multipleSelection.map(e => e[prop])
          const list = this.tableData
          ids.map((e, i) => {
            const index = list.findIndex(j => j[prop] === e)
            if (index !== -1) {
              this.tableData.splice(index === this.tableData.length - 1 ? index - 1 : index, 2)
            }
          })
          this.setIndex()
          this.itemkey = Math.random()
          this.tableData.forEach(async (item, index) => {
            // 根据题目id,获取题目信息
            if (item.isSubject && item.type && item.type != 4 && item.emptyOne) {
              await this.getSubjectData(item.emptyOne, index);
            }
          });
          this.isAddRule = false;
        }).catch(() => { })
      } else {
        this.$message.error('请先选择数据 ！')
      }
    },
    // 一键保存
    saveAll () {
      this.tableData.forEach(e => {
        e.isDisabled = true
        e.isSave = true
      })
    },
    // 表头样式设置
    headClass () {
      return "text-align: center;";
    },
    // 表格样式设置
    rowClass () {
      return "text-align: center;";
    }
  }
};
</script>
<style>
.el-tree-node__content {
  height: 26px !important;
}
</style>
<style lang="scss" scoped>
.business-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.content {
  position: relative;
  top: 10px;
  padding: 0 10px;
  background-color: #ffffff;

  .header {
    border-bottom: 1px dashed #ccc;
    height: 45px;
    line-height: 45px;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    justify-content: space-between;

    .back {
      line-height: 3;
      span {
        font-size: 16px;
        font-weight: 600;
        padding-left: 5px;
      }
    }

    .title {
      font-weight: bold;
      font-size: 14px;
      margin-left: 20px;
    }
  }
  .cell div {
    margin: auto;
    text-align: center;
  }
  .business {
    display: flex;
    align-items: center;
    .label {
      margin-right: 10px;
    }
  }
  // 表单容器
  .form-con {
    padding-bottom: 24px;
    border-bottom: 1px dashed #ccc;

    .title {
      padding: 10px 0;
      border-bottom: 1px dashed #ccc;
      display: flex;

      .black {
        width: 8px;
        height: 18px;
        background-color: #333;
        margin-right: 10px;
      }
    }

    .item {
      display: flex;
      margin-top: 24px;

      .label {
        width: 200px;
        text-align: right;
        padding-right: 20px;
        line-height: 35px;
      }
      .quill {
        width: calc(100% - 240px);
      }
    }
  }

  // 规则容器
  .rule-con {
    padding-bottom: 60px;

    .title-con {
      height: 60px;
      display: flex;
      justify-content: space-between;
      align-items: center;

      .title {
        display: flex;

        .black {
          width: 8px;
          height: 18px;
          background-color: #333;
          margin-right: 10px;
        }
      }
    }
  }
}
/deep/.add-tree {
  .exist {
    font-size: 12px;
    font-style: normal;
    color: #b3b3b3;
  }
}
// 滚动条的宽度
/deep/ ::-webkit-scrollbar {
  width: 6px; // 横向滚动条
  height: 6px; // 纵向滚动条 必写
}

// 滚动条的滑块
/deep/ ::-webkit-scrollbar-thumb {
  background-color: #9278ff;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 5px #dddddd;
}

/deep/ ::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  -webkit-box-shadow: inset 0 0 5px #dddddd;
  border-radius: 0;
  background: #dddddd;
}

.tree-con {
  height: 230px;
  position: relative;

  .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    cursor: not-allowed;
    z-index: 100;
  }
}
/deep/.lc-table {
  .el-table__body {
    tr:nth-child(even) .el-checkbox {
      display: none;
    }
  }
}
@mixin block {
  padding: 10px;
  border: 1px solid #e4e7ed;
  border-radius: 4px;
}
.block1 {
  @include block;
  height: 230px;
  background-color: #fff;
  overflow: auto;
}
.block {
  @include block;
  min-height: 220px;
  background-color: #fff;
  overflow: auto;

  .box {
    padding: 0 24px;
  }

  .line {
    display: flex;
    align-items: center;
    margin: 12px 0;

    .label {
      //width: 100px;
      margin-right: 10px;
      text-align: right;
      font-size: 12px;

      &.mini {
        width: auto;
      }
    }
    .action {
      flex: 1;
      text-align: left;

      /deep/ .el-input {
        width: 100%;
      }

      &.steps {
        @include block;
        display: inline-flex;
        flex-direction: column;
        height: 150px;
        font-size: 12px;
        overflow: auto;

        .radio-wrap {
          display: flex;
          flex-direction: column;

          .child {
            display: flex;
            flex-direction: column;
            margin-left: 15px;
          }

          /deep/ .el-radio {
            margin: 3px 0;
          }
        }
      }

      .inputs {
        display: flex;
        align-items: center;

        /deep/ .el-input {
          width: 100px;
          margin: 0 5px;

          &:first-child {
            margin-left: 0;
          }
        }
        &.range {
          /deep/ .el-input {
            width: 80px;
          }
        }
      }

      &.a-line {
        display: inline-flex;
      }

      .mini-textarea,
      /deep/ .mini-textarea .el-textarea__inner {
        width: 100%;
      }

      .number-input {
        /deep/ .el-input__inner {
          padding-right: 0;
        }
      }
    }
  }
}
.money-box {
  .line {
    margin: 12px 0 !important;
  }
  /deep/.money-check {
    width: 80px;
    text-align: left;
  }
}
/deep/.el-dialog__wrapper {
  :hover {
    cursor: pointer;
  }
}
</style>
