<template>
  <!-- 企业 -->
  <el-table class="c-table"
            :data="form"
            :max-height="height"
            border>
    <el-table-column prop="name"
                     label="指标"
                     min-width="180"
                     align="center">
    </el-table-column>
    <el-table-column label="规则"
                     min-width="250">
      <template #default="{ row,$index }">
        <div class="flex items-center">
          <template v-if="!$index">
            <span class="whitespace-nowrap">跨行业经营，行业门类数</span>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.symbol">
                <el-option v-for="item in symbols"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] ">
              <el-select v-model="row.num">
                <el-option v-for="item in nums"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">。</span>
          </template>
          <template v-else-if="$index === 1">
            <span class="whitespace-nowrap">名下企业</span>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.had">
                <el-option v-for="item in have"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">房产查封。</span>
          </template>
          <template v-else-if="$index === 2">
            <span class="whitespace-nowrap">名下企业</span>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.had">
                <el-option v-for="item in have"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">股权冻结。</span>
          </template>
          <template v-else-if="$index === 3">
            <span class="whitespace-nowrap">行内企业</span>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.had">
                <el-option v-for="item in have"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">不良贷款客户。</span>
          </template>
          <template v-else-if="$index === 4">
            <el-checkbox-group v-model="row.check">
              <el-checkbox v-for="item in row?.subject?.itemList"
                           :key="item"
                           :label="item.options" />
            </el-checkbox-group>
          </template>
          <template v-else-if="$index === 5">
            <div class="w-[90px]">
              <el-select v-model="row.had"
                         clearable>
                <el-option value="不是" />
                <el-option value="是" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">被列为非正常户或注销户。</span>
          </template>
          <template v-else-if="$index === 6">
            <div class="w-[90px]">
              <el-select v-model="row.had"
                         clearable>
                <el-option value="不是" />
                <el-option value="是" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">非正常户或注销户。</span>
          </template>
          <template v-else-if="$index === 7">
            <span class="whitespace-nowrap">经营年限</span>
            <div class="w-[90px] ml-2">
              <el-select v-model="row.symbol">
                <el-option v-for="item in symbols"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.num">
                <el-option v-for="item in nums"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] ">
              <el-select v-model="row.unit">
                <el-option v-for="item in units"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">。</span>
          </template>
          <template v-else-if="$index === 8">
            <span class="whitespace-nowrap mr-2">企业性质涉及</span>
            <el-checkbox-group v-model="row.check">
              <el-checkbox v-for="item in row?.subject?.itemList"
                           :key="item"
                           :label="item.options" />
            </el-checkbox-group>
          </template>
          <template v-else-if="$index === 9">
            <div class="w-[90px]">
              <el-select v-model="row.symbol">
                <el-option v-for="item in symbols"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.num">
                <el-option v-for="item in nums"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px]">
              <el-select v-model="row.unit">
                <el-option v-for="item in units"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">注册资本减少。</span>
          </template>
          <template v-else-if="$index === 10">
            <div class="w-[90px]">
              <el-select v-model="row.symbol">
                <el-option v-for="item in symbols"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.num">
                <el-option v-for="item in nums"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px]">
              <el-select v-model="row.unit">
                <el-option v-for="item in units"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">内法定代表人变更。</span>
          </template>
          <template v-else-if="$index === 11">
            <div class="w-[90px]">
              <el-select v-model="row.symbol">
                <el-option v-for="item in symbols"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.num">
                <el-option v-for="item in nums"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px]">
              <el-select v-model="row.unit">
                <el-option v-for="item in units"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">内大股东（股权占比>=50%）变更。</span>
          </template>
          <template v-else-if="$index === 12">
            命中禁入行业名单中企业拒绝规则
          </template>
          <template v-else-if="$index === 13">
            <span class="whitespace-nowrap">申请人在该企业的股权占比</span>
            <div class="w-[90px] mx-2">
              <el-select v-model="row.symbol">
                <el-option v-for="item in symbols"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <div class="w-[90px] ">
              <el-select v-model="row.num">
                <el-option v-for="item in nums"
                           :key="item"
                           :label="item"
                           :value="item" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">%。</span>
          </template>
          <template v-else-if="$index === 14">
            <div class="w-[90px] mx-2">
              <el-select v-model="row.had"
                         clearable>
                <el-option value="不在" />
                <el-option value="在" />
              </el-select>
            </div>
            <span class="whitespace-nowrap ml-2">工商局或农专经营异常目录。</span>
          </template>
        </div>
      </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, watch } from 'vue';
import { ElMessage } from 'element-plus';
import { accessStrategyEnterpriseBlacklistFind, accessStrategyEnterpriseBlacklistSave } from '@/api/model';
import { getProcessInformationBasedOnRoles, addOperation } from '@/api/judgment';
import type { TableColumnCtx } from 'element-plus';
import { useRouter, useRoute } from 'vue-router';
import { handleId, getNum, getSymbol, getChinese } 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<string> = ['>=', '<', '>', '==', '<='];
const nums: Array<number> = [1, 3, 5, 6, 16, 33, 40];
const units: Array<string> = ['年', '月', '天'];
const have: Array<string> = ['无', '有'];
// 配置项
const getConfig = async () => {
  const { process } = await getProcessInformationBasedOnRoles(154);
  const result = [];
  process.map((e, i) => {
    const cur = info.value.find((n) => n.stRecordId === e.id);
    let num = getNum(cur?.rule);
    let symbol = getSymbol(cur?.rule);
    let had = getChinese(cur?.rule);
    let temp = {
      name: e.name,
      subject: e.subject,
      stRecordId: e.id,
      symbol: symbol || '>=',
      unit: had || '年',
      num: num || 1,
      had: (((i > 0 && i < 4) || i === 5 || i === 6 || i === 14) && cur?.rule) || '',
      check: (i === 4 || i === 8) && cur ? cur?.rule.split(',') : [],
    };

    result.push(temp);
  });
  form.value = result;
};
// 详情
const getDetail = async () => {
  try {
    const { data } = await accessStrategyEnterpriseBlacklistFind(levelId, projectId);
    info.value = data;
    getConfig();
  } finally {
  }
};

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

// 提交
const submit = async () => {
  let param = [];
  form.value.map((e, i) => {
    const temp = {
      id: info.value.find((n) => n.stRecordId === e.stRecordId)?.id ?? '',
      stRecordId: e.stRecordId,
      checkpointId: levelId,
      projectId,
    };
    let rule;
    if (!i || i === 13) {
      rule = e.symbol + e.num;
    } else if ((i > 0 && i < 4) || i === 5 || i === 6 || i === 14) {
      rule = e.had;
    } else if (i === 4 || i === 8) {
      rule = e.check.join();
    } else if (i === 7 || i === 9 || i === 10 || i === 11) {
      rule = e.symbol + e.num + e.unit;
    }
    temp.rule = rule;
    param.push(temp);
  });
  await accessStrategyEnterpriseBlacklistSave({ enterpriseBlacklistList: param });
  // addRecord(param);
  getDetail();
  ElMessage.success('提交成功！');
};
// 新增判分记录
const addRecord = async (data: Record<string, any>) => {
  const preIds = `1,${Cookies.get('sand-level')},42,67,147,154`; // 1，关卡id，角色（这个页面是风控经理策略）
  const rule = <Record<string, any>[]>[
    handleId(324, 150, data[0].ruleOne, preIds + ',318,324', 5),
    handleId(325, 151, data[0].ruleTwo, preIds + ',318,325', 5),
    handleId(326, 152, data[0].ruleThree, preIds + ',318,326', 5),
    handleId(327, 153, data[0].ruleFour, preIds + ',318,327', 5),

    handleId(353, 154, data[1].ruleOne, preIds + ',320,353', 5),
  ];
  form.value[14].had && rule.push(handleId(354, 155, form.value[14].had === '有商品房' ? 353 : 354, preIds + ',320,354', 1));
  rule.push(
    handleId(355, 156, form.value[15].num + form.value[15].symbol, preIds + ',320,355', 5),
    handleId(356, 157, form.value[15].symbol1 + form.value[15].num1, preIds + ',320,356', 5),
  );
  form.value[15].had && rule.push(handleId(357, 155, form.value[15].had === '有商品房' ? 353 : 354, preIds + ',320,357', 1));
  data[2].ruleOne && rule.push(handleId(342, 158, data[2].ruleOne === '拒绝' ? 355 : 356, preIds + ',322,342', 1));
  rule.push(
    handleId(344, 159, data[2].ruleTwo, preIds + ',322,344', 5),
    handleId(345, 160, data[2].ruleThree, preIds + ',322,345', 5),
    handleId(346, 161, data[2].ruleFour, preIds + ',322,346', 5),
    handleId(347, 162, data[2].ruleFive, preIds + ',322,347', 5),
    handleId(348, 163, data[2].ruleSix, preIds + ',322,348', 5),
    handleId(349, 164, data[2].ruleSeven, preIds + ',322,349', 5),
    handleId(350, 165, data[2].ruleEight, preIds + ',322,350', 5),
    handleId(351, 166, data[2].ruleNine, preIds + ',322,351', 5),
  );

  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>
