jy2024-ui/src/views/hl/bm/component/healthSetting.vue

<template>
  <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" size="small"  />
      </template>
    </el-table-column>
    <el-table-column label="指标细项" width="120" align="center">
      <template #default="scope">
      </template>
    </el-table-column>
    <el-table-column label="操作" width="220">
      <template #default="scope">
        <el-button type="primary" link icon="Position">健康指标管理</el-button>
        <el-button type="primary" link icon="delete">删除</el-button>
      </template>
    </el-table-column>
  </el-table>

  <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} from "@/api/hl/bm"
import {hlClassList,deleteHlClass,selectHlList,addHoList} from "@/api/hl/ho"
import {onMounted} from "vue";
const {proxy} = getCurrentInstance()
const props = defineProps(['modelId'])
const {biz_type} = proxy.useDict('biz_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)

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

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 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>