<template>
  <el-button type="primary" plain @click="handleAddClass">导入对象类型</el-button>
  <el-table :data="bmConfigData" border style="width: 100%">
    <el-table-column label="对像类型" width="120">
      <template #default="scope">
        <dict-tag :options="biz_type" :value="scope.row.objType"/>
      </template>
    </el-table-column>
    <el-table-column label="业务对象" >
      <template #default="scope">
        <el-button type="primary" link @click="selectObj(scope.row)">
          <span v-for="(item,index) in scope.row.hlObjList" :key="`${scope.$index}_${item.hlObjId}`">
            {{item.objName}}<span v-if="index != scope.row.hlObjList.length-1">,</span>
          </span>
        </el-button>
      </template>
    </el-table-column>
    <el-table-column label="分值" width="120" align="center">
      <template #default="scope">
        <el-input v-model="scope.row.hlScore" @blur="changeHlRow(scope.row)"/>
      </template>
    </el-table-column>
    <el-table-column label="指标细项" width="155" align="center">
      <template #default="scope">
        <el-select v-model="scope.row.scoreType" placeholder="请选择细项分" clearable @change="changeHlRow(scope.row)">
          <el-option
              v-for="dict in metrics_small_type"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
          />
        </el-select>
      </template>
    </el-table-column>
    <el-table-column label="操作" width="210">
      <template #default="scope">
        <el-button type="primary" link icon="Position" @click="hcClassManage(scope.row)">健康指标管理</el-button>
        <el-button type="primary" link icon="delete" @click="delBc(scope.row)">删除</el-button>
      </template>
    </el-table-column>
  </el-table>

  <el-dialog title="健康指标管理" v-model="visibleHcMange" width="800">
    <hm-list :hmRow="hmRow" v-if="visibleHcMange"/>
  </el-dialog>

  <el-dialog title="选择对象" v-model="visible" >
    <el-button type="primary" plain @click="handleAddHl">选择对象</el-button>
    <el-table :data="hlData" border style="width: 100%;margin-top:10px;">
      <el-table-column label="对象名称" prop="objName"/>
      <el-table-column label="操作" width="120" align="center">
        <template #default="scope">
          <el-button type="primary" link icon="delete"  @click="handleHlDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>

  <el-dialog title="添加对象" v-model="visibleHl">
    <el-table :data="selectHlData" border style="width: 100%;margin-top:10px;" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="对象名称">
        <template #default="scope">
          {{scope.row.bizObj.objName}}
        </template>
      </el-table-column>
    </el-table>
    <div class="btn-row">
      <el-button type="primary" @click="handleHlAdd">添加</el-button>
      <el-button @click="visibleHl=false">取消</el-button>
    </div>
  </el-dialog>
</template>
<script setup lang="ts">
import {getBmConfig,impClass} from "@/api/hl/bm"
import {hlClassList,deleteHlClass,selectHlList,addHoList} from "@/api/hl/ho"
import {updateHc,delHc} from "@/api/hl/hc"
import {onMounted} from "vue";
import hmList from "./widget/hmList.vue"
const {proxy} = getCurrentInstance()
const props = defineProps(['modelId'])
const {biz_type,metrics_small_type} = proxy.useDict('biz_type','metrics_small_type');
const bmConfigData = ref([])
const hlData = ref([])
const selectHlData = ref([])
const visible = ref(false)
const hlId = ref(null)
const hlIds = ref([])
const visibleHl = ref(false)
const visibleHcMange = ref(false)
const hmRow = ref({})

onMounted(()=>{
  bmConfigList(props.modelId)
})

async function delBc(row){
  await delHc(row.hlClassId)
  await bmConfigList(props.modelId)
}

function hcClassManage(row){
  visibleHcMange.value = true
  hmRow.value=row;
}

function changeHlRow(row){
  let count = 0
  bmConfigData.value.forEach(p=>{
    count += Number(p.hlScore)
  })
  if(count>100){
    return proxy.$message.error("健康分值不能超过100")
  }
  updateHc(row)
}

function handleSelectionChange(selection){
  hlIds.value = selection.map(item => item.objId);
}

async function bmConfigList(modelId){
  const res = await getBmConfig(modelId)
  bmConfigData.value = res.data
}

async function selectObj({hlClassId}){
  const res = await hlClassList(hlClassId)
  hlId.value = hlClassId
  hlData.value = res.data
  visible.value = true
}

async function handleAddHl(){
  const res = await selectHlList(hlId.value)
  visibleHl.value = true
  selectHlData.value = res.data
}

async function handleAddClass(){
  const res = await impClass(props.modelId)
  await bmConfigList(props.modelId)
}

async function handleHlDelete({hlObjId,hlClassId}){
  await deleteHlClass(hlObjId)
  await selectObj({hlClassId})
  await bmConfigList(props.modelId)
}

async function handleHlAdd(){
  if(!hlIds.value.length) return proxy.$modal.msgError("请选择对象")
  await addHoList(hlId.value,{objIds:[...hlIds.value].join(",")})
  await handleAddHl()
  await selectObj({hlClassId:hlId.value})
  await bmConfigList(props.modelId)
  visibleHl.value = false
  hlIds.value = []
}

</script>
<style scoped lang="scss">
.btn-row{
  margin-top: 20px;
  display: flex;
  justify-content: center;
}
</style>
