<template>
  <section class="content">
    <!-- 正文信息 -->
    <div class="part-box">
      <h1 class="part-box-title">授权管理</h1>
      <div class="part-box-action">
        <el-form
          class="padding-tb-20 form-tight"
          :model="info"
          label-width="150px"
        >
          <el-form-item label="当前信息">
            <span class="input">{{ info.activation }}</span>
          </el-form-item>
          <el-form-item label="人数限制">
            <span class="input">{{ info.maxCount }}</span>
          </el-form-item>
          <el-form-item label="当前人数">
            <span class="input">{{ info.onlineCount }}</span>
          </el-form-item>
          <el-form-item label="过期时间">
            <span class="input">{{ info.expire }}</span>
          </el-form-item>
          <el-form-item label="授权模式">
            <span class="input">{{ info.type }}</span>
          </el-form-item>
        </el-form>
      </div>
      <el-form
        ref="form"
        class="padding-tb-20 form-tight"
        :rules="rules"
        :model="form"
        label-width="150px"
      >
        <el-form-item label="授权模式">
          <el-select v-model="form.type" class="input">
            <el-option label="在线激活" value="ONLINE"></el-option>
            <el-option label="离线激活" value="OFFLINE"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          v-show="form.type == 'ONLINE'"
          label="密匙"
          class="input"
          maxlength="255"
          prop="accessKey"
        >
          <el-input v-model="form.accessKey" maxlength="255" />
        </el-form-item>
        <el-form-item
          v-show="form.type == 'ONLINE'"
          label="密钥"
          maxlength="255"
          class="input"
          prop="accessSecret"
        >
          <el-input v-model="form.accessSecret" maxlength="255" />
        </el-form-item>
        <el-form-item v-show="form.type == 'OFFLINE'" label="导入授权文件">
          <el-upload
            ref="upload"
            class="form_left"
            accept=".lic"
            :action="uploadAction"
            :headers="uploadHeaders"
            :data="uploadData"
            :on-success="uploadSuccess"
            :on-error="uploadError"
            :file-list="fileList"
            :auto-upload="false"
            :multiple="false"
          >
            <el-button
              slot="trigger"
              size="small"
              type="primary"
              icon="icon icon-search-white"
            >
              选择文件
            </el-button>
          </el-upload>
        </el-form-item>
        <el-form-item label=" ">
          <el-button
            v-show="form.type == 'OFFLINE'"
            type="primary"
            size="small"
            @click="exportFile"
            >导出硬件信息</el-button
          >
          <el-button type="primary" size="small" @click="submitForm"
            >保存</el-button
          >
        </el-form-item>
      </el-form>
    </div>

    <!-- 登录配置 -->
    <div class="part-box">
      <h1 class="part-box-title">登录配置</h1>
      <el-form class="padding-tb-20" label-width="150px">
        <el-form-item label="短信验证">
          <el-radio-group v-model="setForm.properties.LOGIN_CODE_CHECK">
            <el-radio label="true">开启</el-radio>
            <el-radio label="false">关闭</el-radio>
          </el-radio-group>
          <div class="tips-info">*开启后，登录需要输入手机验证码</div>
        </el-form-item>
        <el-form-item label="安全U盾">
          <el-radio-group v-model="setForm.properties.LOGIN_UD_CHECK">
            <el-radio label="true">开启</el-radio>
            <el-radio label="false">关闭</el-radio>
          </el-radio-group>
          <div class="tips-info">*开启后，需要插入安全U盾才能正常登录</div>
        </el-form-item>
        <template v-if="setForm.properties.LOGIN_UD_CHECK == 'true'">
          <el-form-item>
            <el-radio-group v-model="setForm.properties.LOGIN_UD_CHECK_ONECE">
              <el-radio label="rule1"
                >安全策略1
                <span class="tips-info margin-left-10"
                  >使用期间均会检测安全U盾是否正常，如果出现异常，会强制踢出用户进入异常提示页面</span
                ></el-radio
              >

              <div class="margin-top-20"></div>
              <el-radio label="rule2"
                >安全策略2
                <span class="tips-info margin-left-10"
                  >仅对登录阶段进行检测，如果未检测到安全U盾，无法登录</span
                ></el-radio
              >
            </el-radio-group>
          </el-form-item>
        </template>
        <el-form-item label=" ">
          <el-button type="primary" size="small" @click="submitSetForm"
            >保存</el-button
          >
        </el-form-item>
      </el-form>
    </div>
  </section>
</template>
<script>
import { QUESTION_API } from "@/constants/constants";
import { mapState } from "vuex";
export default {
  data() {
    return {
      uploadAction: QUESTION_API + "/system/auth/offline",
      uploadHeaders: {},
      uploadData: {},
      fileList: [],
      info: {
        activation: "",
        expire: "",
        type: "",
        maxCount: "",
        onlineCount: 0,
      },
      form: {
        type: "ONLINE",
        accessKey: "",
        accessSecret: "",
      },
      rules: {
        accessKey: [
          {
            required: true,
            message: "请输入密匙",
            trigger: ["blur", "change"],
          },
        ],
        accessSecret: [
          {
            required: true,
            message: "请输入密钥",
            trigger: ["blur", "change"],
          },
        ],
      },
      setForm: {
        properties: {
          LOGIN_CODE_CHECK: "false",
          LOGIN_UD_CHECK: "false",
          LOGIN_UD_CHECK_ONECE: "",
        },
      },
    };
  },
  computed: {
    ...mapState({ user: (state) => state.user }),
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      this.uploadHeaders = {
        key: this.user.key,
        token: this.user.token,
      };
      this.searchForm();
    },
    searchForm() {
      var url = QUESTION_API + "/system/auth/info";
      this.$httpWithMsg.get(url).then((response) => {
        if (response.data.auth == true) {
          this.info.activation = "已授权";
          if (this.info.activation == "已授权" && !response.data.expireTime) {
            this.info.expire = "不限制";
          } else {
            this.info.expire = response.data.expireTime;
          }
          if (
            this.info.activation == "已授权" &&
            !response.data.maxOnlineUserCount
          ) {
            this.info.maxCount = "不限制";
          } else {
            this.info.maxCount = response.data.maxOnlineUserCount;
          }
          this.info.onlineCount = response.data.onlineUserCount;
          this.info.type =
            response.data.type == "ONLINE" ? "在线激活" : "离线激活";
        } else {
          this.info.activation = "未授权";
        }
      });
      this.initForm();
    },
    initForm() {
      var url = QUESTION_API + "/org/all-sys-properties";
      this.$httpWithMsg.get(url).then((response) => {
        if (response.data) {
          this.setForm.properties = response.data;
        }
      });
    },
    //提交
    submitForm() {
      if (this.form.type == "OFFLINE") {
        this.submitUpload();
      } else {
        var url = QUESTION_API + "/system/auth/online";
        this.$refs.form.validate((valid) => {
          if (valid) {
            this.$httpWithMsg.post(url, this.form).then(() => {
              this.$notify({
                type: "success",
                message: "授权成功",
              });
              this.searchForm();
              this.addingDialog = false;
            });
          } else {
            return false;
          }
        });
      }
    },
    submitSetForm() {
      let url = QUESTION_API + "/org/save-sys-properties";
      this.$httpWithMsg.put(url, this.setForm).then(() => {
        this.$notify({
          type: "success",
          message: "保存成功！",
        });
      });
    },
    exportFile() {
      window.open(
        QUESTION_API +
          "/system/auth/device/info?$key=" +
          this.user.key +
          "&$token=" +
          this.user.token
      );
    },
    submitUpload() {
      var fileList = this.$refs.upload.uploadFiles;
      if (fileList.length == 0) {
        this.$notify({
          message: "请选择授权文件",
          type: "error",
        });
        return false;
      }
      if (fileList.length > 1) {
        this.$notify({
          message: "每次只能上传一个文件",
          type: "error",
        });
        return false;
      }
      this.$refs.upload.submit();
    },
    uploadSuccess(response) {
      if (!response.hasError) {
        this.$notify({
          message: "授权成功",
          type: "success",
        });
        this.searchForm();
      }
    },
    uploadError(response) {
      var json = JSON.parse(response.message);
      if (response.status == 500) {
        this.$notify({
          message: json.desc,
          type: "error",
        });
      }
    },
  },
};
</script>
