<template>
  <!-- 征信 -->
  <el-table class="c-table"
            :data="form"
            :cell-style="{background:'#fff'}"
            :max-height="height"
            border>
    <el-table-column prop="name"
                     label="进入黑名单指标"
                     min-width="150"
                     align="center">
    </el-table-column>
    <el-table-column label="本人进黑名单规则"
                     min-width="250"
                     align="center">
      <template #default="{ row }">
        <!-- 贷记卡账户状态 -->
        <div v-if="row.stRecordId == 204"
             class="flex items-center">
          <span class="whitespace-nowrap">{{ row?.recordChildren[0]?.name }}</span>
          <el-input class="w-[80px] mx-2"
                    v-model="row.ruleOne"></el-input>
          <span class="whitespace-nowrap">的信用卡</span>
        </div>
        <!-- 贷记卡审批通过率 -->
        <div v-else-if="isRule(row.stRecordId)"
             class="flex items-center">
          <span class="whitespace-nowrap">{{ row?.recordChildren[0]?.name }}</span>
          <div class="w-[90px] ">
            <el-select class="mx-2"
                       v-model="row.symbol">
              <el-option v-for="item in symbols"
                         :key="item"
                         :label="item.name"
                         :value="item.name" />
            </el-select>
          </div>
          <el-input class="w-[80px]"
                    v-model="row.num"></el-input>
          <span class="ml-2 whitespace-nowrap">，{{ row?.recordChildren[1]?.name }}</span>
          <div class="w-[90px] ">
            <el-select class="mx-2"
                       v-model="row.symbol1">
              <el-option v-for="item in symbols"
                         :key="item"
                         :label="item.name"
                         :value="item.name" />
            </el-select>
          </div>
          <el-input class="w-[80px]"
                    v-model="row.num1"></el-input>
          <span class="ml-2 whitespace-nowrap">。</span>
        </div>
        <div v-else-if="row.stRecordId == 230 || row.stRecordId == 231"
             class="flex">
          <el-select class="w-[80px] ml-2"
                     v-model="row.ruleOne">
            <el-option value="有" />
            <el-option value="无" />
          </el-select>
        </div>
        <div v-else
             class="flex items-center">
          <span class="whitespace-nowrap">{{ row?.recordChildren[0]?.name }}</span>
          <div class="w-[90px] ">
            <el-select class="mx-2"
                       v-model="row.symbol">
              <el-option v-for="item in symbols"
                         :key="item"
                         :label="item.name"
                         :value="item.name" />
            </el-select>
          </div>
          <el-input class="w-[80px]"
                    v-model="row.num"></el-input>
          <span class="ml-2 whitespace-nowrap">{{ row.stRecordId === 203 || row.stRecordId === 205 ? '元' : row.stRecordId === 207 || row.stRecordId === 229 ? '万元' : ' ' }}。</span>
        </div>
      </template>
    </el-table-column>
    <el-table-column label="配偶拒入标准同本人"
                     width="160"
                     align="center">
      <template #default="{ row }">
        <el-checkbox v-model="row.mateRejectedStandardIdentity"></el-checkbox>
      </template>
    </el-table-column>
  </el-table>

  <div class="flex justify-end">
    <div class="submit"
         @click="submit">确认完成配置</div>
  </div>
</template>

<script setup lang="ts">
import { ref, computed, watch, onMounted } from 'vue';
import { ElMessage } from 'element-plus';
import { accessStrategyCreditBlacklistFind, accessStrategyCreditBlacklistSave } from '@/api/model';
import { getProcessInformationBasedOnRoles, addOperation } from '@/api/judgment';
import type { TableColumnCtx } from 'element-plus';
import { useRouter, useRoute } from 'vue-router';
import { handleId } from '@/utils/common';
import Cookies from 'js-cookie';

const router = useRouter();
const route = useRoute();
const projectId = +Cookies.get('sand-projectId');
const levelId = +Cookies.get('sand-level');
const form = ref<Record<string, any>[]>([]);
const info = ref<Record<string, any>[]>([]);
const height = window.innerHeight - 270;
const symbols: Array<Record<string, any>> = [
  {
    name: '>=',
  },
  {
    name: '<',
  },
  {
    name: '>',
  },
  {
    name: '==',
  },
  {
    name: '<=',
  },
];
// 配置项
const getConfig = async () => {
  const { process } = await getProcessInformationBasedOnRoles(151);
  const result = [];
  process.map((e) => {
    const cur = info.value.find((n) => n.stRecordId === e.id);
    let num = cur?.ruleOne?.match(/\d+/g);
    let num1 = cur?.ruleTwo?.match(/\d+/g);
    let symbol = cur?.ruleOne?.match(/[<>=]+/g);
    let symbol1 = cur?.ruleTwo?.match(/[<>=]+/g);
    let temp = {
      checkpointId: levelId,
      projectId,
      name: e.name,
      recordChildren: e.recordChildren,
      mateRejectedStandardIdentity: !!cur?.mateRejectedStandardIdentity,
      symbol: symbol?.length ? symbol[0] : '>=',
      symbol1: symbol1?.length ? symbol1[0] : '>=',
      num: num?.length ? num[0] : '',
      num1: num1?.length ? num1[0] : '',
      ruleOne: e.id === 204 || e.id === 230 || e.id === 231 ? cur?.ruleOne : '',
      ruleTwo: '',
      subjectId: e.subjectId,
      stRecordId: e.id,
    };
    result.push(temp);
  });
  form.value = result;
};
// 详情
const getDetail = async () => {
  try {
    const { data } = await accessStrategyCreditBlacklistFind(levelId, projectId);
    info.value = data;
    getConfig();
  } finally {
  }
};

watch(
  () => route.query,
  () => {
    getDetail();
  },
  {
    immediate: true,
  },
);

const isRule = (rule: number): boolean => {
  return rule === 208 || (rule > 215 && rule < 222) || rule === 226;
};
// 提交
const submit = async () => {
  let param = JSON.parse(JSON.stringify(form.value));
  param.map((e, i) => {
    if (info.value.length) e.id = info.value.find((n) => n.stRecordId === e.stRecordId)?.id;
    e.mateRejectedStandardIdentity = +e.mateRejectedStandardIdentity;
    if (e.stRecordId != 204 && e.stRecordId != 230 && e.stRecordId != 231) {
      e.ruleOne = e.symbol + e.num;
      if (isRule(e.stRecordId)) {
        e.ruleTwo = e.symbol1 + e.num1;
      }
    }
  });
  const recordParam = JSON.parse(JSON.stringify(param));
  param.map((e) => {
    delete e.recordChildren;
  });
  await accessStrategyCreditBlacklistSave({ creditBlacklistList: param });
  addRecord(recordParam);
  getDetail();
  ElMessage.success('提交成功！');
};
// 新增判分记录
const addRecord = async (data: Record<string, any>) => {
  const preIds = `1,${Cookies.get('sand-level')},42,67,147,151`; // 1，关卡id，角色（这个页面是风控经理策略）
  const rule = [];

  data[1].ruleOne && rule.push(handleId(234, 81, data[1].ruleOne, preIds + ',204,234', 3));
  data[27].ruleOne && rule.push(handleId(267, 114, data[27].ruleOne === '有' ? 306 : 305, preIds + ',230,267', 1));
  data[28].ruleOne && rule.push(handleId(268, 115, data[28].ruleOne === '有' ? 308 : 307, preIds + ',231,267', 1));
  data.map((e, i) => {
    if (e.stRecordId != 204 && e.stRecordId != 230 && e.stRecordId != 231) {
      const len = e?.recordChildren?.length - 1;
      e?.recordChildren.map((n, j) => {
        j !== len && rule.push(handleId(n.id, e.subjectId, j ? e.ruleTwo : e.ruleOne, preIds + ',' + e.stRecordId + ',' + n.id, 5));
      });
    }
    // 多选框
    e.mateRejectedStandardIdentity && rule.push(handleId(274, e.subjectId, 309, preIds + ',' + e.stRecordId + ',274', 1));
  });

  await addOperation({
    checkpointId: levelId,
    parentId: preIds,
    lcJudgmentRuleReq: rule,
    projectId,
  });
};
</script>

<style lang="scss" scoped>
@import url(../../../styles/form.scss);
.c-table {
  :deep(.el-input__inner) {
    @apply px-2;
  }
}
</style>