<template>
  <el-form
    ref="authorizeFormRef"
    :model="authorizeFormData"
    :rules="authorizeRules"
    label-width="110px"
    class="authorizeForm">
    <el-form-item label="当前版本号" prop="system_version">
      <el-input disabled v-model="authorizeFormData.system_version" />
    </el-form-item>
    <el-form-item label="User" prop="system_user">
      <el-input placeholder="统一管理用户认证平台" v-model="authorizeFormData.system_user" maxlength="30" />
    </el-form-item>
    <el-form-item label="Key" prop="license">
      <el-input
        placeholder="请输入"
        rows="5"
        v-model="authorizeFormData.license"
        type="textarea"
        @blur="getLicenseInfo" />
    </el-form-item>
    <el-form-item label="有效期至" prop="license_dead_date">
      <el-input disabled v-model="authorizeFormData.license_dead_date" />
    </el-form-item>
    <el-form-item label="剩余有效期提醒" prop="license_inform_day">
      <el-input placeholder="请输入" v-model.trim.number="authorizeFormData.license_inform_day">
        <template #append>天</template>
      </el-input>
      <el-tooltip placement="top-start" effect="light">
        <template #content>
          范围（0~90），单位：天， 当剩余有效期在配置区间内时，系统会在用户登录系统时发出提醒，0表示不提醒
        </template>
        <div class="tip-image"></div>
      </el-tooltip>
    </el-form-item>
  </el-form>
</template>

<script setup>
import { reactive, toRefs, ref } from "vue";
import { ElMessage } from "element-plus";
import axios from "@/request/http.js";

const state = reactive({
  authorizeFormData: {
    id: "",
    system_version: "",
    system_user: "",
    license: "",
    license_dead_date: "",
    license_inform_day: "",
  },
  authorizeRules: {
    license_inform_day: [{ type: "number", min: 0, max: 90, message: "请输入0~90的整数", trigger: "blur" }],
  },
});
const authorizeFormRef = ref(null);
//根据license获取授权信息
const getLicenseInfo = () => {
  if (!state.authorizeFormData.license) return;
  axios
    .post("/v1/api/sysOptions/getLicenseInfo", {
      license: state.authorizeFormData.license,
    })
    .then((res) => {
      if (res.data.code == 200) {
        const data = res.data.data || {};
        state.authorizeFormData.system_version = data.version;
        state.authorizeFormData.license_dead_date = data.deadDate;
      } else {
        ElMessage.error(res.data.data);
      }
    });
};
//设置表单数据
const setFormData = (data) => {
  Object.keys(state.authorizeFormData).forEach((item) => {
    state.authorizeFormData[item] = data[item];
  });
};
//保存
const save = () => {
  authorizeFormRef.value.validate((valid) => {
    if (valid) {
      let params = {
        ...state.authorizeFormData,
      };
      axios.post("/v1/api/sysOptions/licenseOpts", params).then((res) => {
        if (res.data.code == 200) {
          ElMessage.success(res.data.msg);
        } else {
          ElMessage.error(res.data.data);
        }
      });
    }
  });
};
const { authorizeFormData, authorizeRules } = toRefs(state);
defineExpose({
  setFormData,
  save,
});
</script>
