<!-- 
 * @Description: 推送配置
 * @Author: 王文沛 
 * @Date: 2023-12-15 15:44:05
!-->
<template>
  <div class="card content-main">
    <el-form
      ref="ruleFormRef"
      style="max-width: 600px"
      :model="ruleForm"
      :rules="rules"
      label-width="auto"
      class="demo-ruleForm"
      :size="formSize"
      status-icon
    >
      <s-form-item label="推送设置：" prop="pushState">
        <s-radio-group v-model="ruleForm.pushState" :options="pushOptions" />
      </s-form-item>

      <div class="ruleTitle">推送规则</div>
      <div class="ruleContent">
        <span>当日预警每达到</span>
        <el-input-number v-model="ruleForm.daySum" class="mx-4" :min="1" controls-position="right" @change="handleChange" />
        <span>条时进行推送</span>
        <div class="tips">当日预警数据每达到设置的条数后，会进行消息推送。</div>
      </div>
      <el-form-item>
        <el-button type="primary" @click="submitForm(ruleFormRef)"> 保 存 </el-button>
        <!-- <el-button @click="resetForm(ruleFormRef)">取消</el-button> -->
      </el-form-item>
    </el-form>
  </div>
</template>
    
  <script setup lang="tsx" name="sysconfigPush">
import { reactive, ref,onMounted } from 'vue'
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import { ElMessage, ElMessageBox } from 'element-plus'
import { abilityApi, getPushInfo,userManageClassManageApi, monitorLIVEApi,SysOrg } from "@/api";
interface RuleForm {

  pushState: string | boolean,
  daySum: number
}

const formSize = ref<ComponentSize>('default')
const ruleFormRef = ref<FormInstance>()
const ruleForm = reactive<RuleForm>({
  pushState: false,
  daySum: 1
})
const pushOptions = [{
    label: '开启',
     value: true,
},{
    label: '关闭',
     value: false,
}]

const rules = reactive<FormRules<RuleForm>>({

  pushState: [
    {
      required: true,
      message: '请选择推送设置',
      trigger: 'change',
    },
  ],
})
const handleChange = (value: number) => {
  console.log(value)
}
function isPositiveInteger(value:any) {
    return /^[1-9]\d*$/.test(value);
}
onMounted(() => {
  getPushData()
});
async function getPushData() {
  let {data} = await abilityApi.getPushInfo({})
  ruleForm.daySum = data.daySum;
  ruleForm.pushState = data.pushState;
  console.log(data);
}
const submitForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
        if(!isPositiveInteger(ruleForm.daySum)) {
            
            ElMessage({
                message: '推送规则条数必须是大于零的整数',
                type: 'warning',
            })
            return
        }

        abilityApi.pushConfig(ruleForm).then(() => {
          ElMessage({
            message: '操作成功',
            type: 'success',
          })
    
        });
        
      console.log('submit!')
    } else {
      console.log('error submit!', fields)
    }
  })
}

const resetForm = (formEl: FormInstance | undefined) => {
  if (!formEl) return
  formEl.resetFields()
}
</script>
    
  <style lang="scss" scoped>
.content-main {
  height: 100%;
  .ruleTitle {
    margin: 30px 0 20px;
    font-size: 14px;
    font-weight: 600;
  }
  .ruleContent {
    margin: 20px 0;
    font-size: 14px;
    color: #666666;
    .tips {
      margin-top: 10px;
      font-size: 14px;
      color: red;
    }
  }
}
</style>
    
  