<template>
  <div class="p-2" style="margin-left: 20px;margin-top: 20px;">
    <p>请选择预警配置项</p>
    <el-checkbox-group v-model="checkList">
      <el-checkbox v-for="item in configList" :label="item.name" :value="item.id" />
    </el-checkbox-group>

    <el-button style="margin-top: 20px;" type="primary" @click="handleSubmit"
      v-hasPermi="['warn:config:edit']">确定</el-button>
  </div>
</template>

<script setup lang="ts">
import { listConfig, editConfig } from '@/api/archive/warnRecord'
import { onMounted } from 'vue';

const checkList = ref<any[]>([])
const configList = ref<any[]>([])

async function getConfigList() {
  const res = await listConfig()
  configList.value = res.data

  checkList.value = res.data.filter((item: any) => item.status == 1).map((item: any) => item.id)
}

async function handleSubmit() {
  if (checkList) {
    const res = await editConfig(checkList.value)
    if (res.code == 200) {
      ElMessage.success('提交成功')
    } else {
      ElMessage.error('提交失败')
    }
    getConfigList()
  } else {
    ElMessage.error('请选择配置项')
  }
}

onMounted(() => {
  getConfigList()
})

</script>

<style scoped></style>