<template>
|
<div class="params-container">
|
<el-steps :active="active" finish-status="success" simple>
|
<el-step title="机器码"></el-step>
|
<el-step title="注册码"></el-step>
|
<el-step title="结束"></el-step>
|
</el-steps>
|
<el-form
|
size="mini"
|
label-position="top"
|
class="params-dialog"
|
v-show="active == 1"
|
>
|
<el-form-item
|
label="机器码(请复制机器码，发送到后台，获取注册码。)"
|
prop="license"
|
>
|
<label slot="label"
|
>机器码
|
<span class="font-error"
|
>(请复制机器码，发送到后台，获取注册码。)</span
|
></label
|
>
|
<el-input
|
ref="machineCode"
|
type="textarea"
|
:autosize="{ minRows: 10, maxRows: 10 }"
|
placeholder="请获取机器码"
|
resize="none"
|
readonly="readonly"
|
v-model="machineCode"
|
></el-input>
|
</el-form-item>
|
<div class="form-footer">
|
<three-btn @click="getMacLicense">刷新机器码</three-btn>
|
<three-btn @click="copyCode">复制</three-btn>
|
<three-btn @click="active++">下一步</three-btn>
|
</div>
|
</el-form>
|
<el-form
|
ref="ruleForm"
|
size="mini"
|
label-position="top"
|
:model="params"
|
:rules="rules"
|
class="params-dialog"
|
v-show="active == 2"
|
>
|
<el-form-item label="激活码" prop="license">
|
<el-input
|
type="textarea"
|
:autosize="{ minRows: 10, maxRows: 10 }"
|
placeholder="请输入内容"
|
resize="none"
|
v-model="params.license"
|
></el-input>
|
</el-form-item>
|
<div class="form-footer">
|
<three-btn @click="active--">上一步</three-btn>
|
<three-btn @click="checkLicense">确定</three-btn>
|
</div>
|
</el-form>
|
<div class="success-register-wrapper params-dialog" v-show="active == 3">
|
<div class="success-register">注册成功</div>
|
<div class="form-footer">
|
<three-btn @click="close">关闭</three-btn>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "AddLicense",
|
props: {
|
visible: {
|
type: Boolean,
|
default: false,
|
},
|
},
|
data() {
|
return {
|
active: 1,
|
machineCode: "",
|
params: {
|
license: "",
|
},
|
rules: {},
|
};
|
},
|
methods: {
|
getMacLicense() {
|
// 开启加载等待框
|
let loading = this.$layer.loading();
|
// 请求后台
|
this.$apis.license
|
.getMacLicense()
|
.then((res) => {
|
// 关闭等待
|
this.$layer.close(loading);
|
|
let rs = JSON.parse(res.data.result);
|
this.machineCode = rs.data;
|
})
|
.catch((error) => {
|
console.log(error);
|
// 关闭等待
|
this.$layer.close(loading);
|
});
|
},
|
copyCode() {
|
let machineCode = this.$refs.machineCode;
|
machineCode.select(); // 选择对象
|
document.execCommand("Copy"); // 执行浏览器复制命令
|
this.$layer.msg("复制成功");
|
},
|
checkLicense() {
|
let license = this.params.license;
|
if (!license.trim()) {
|
this.$layer.msg("license不能为空");
|
return;
|
}
|
// 开启加载等待框
|
let loading = this.$layer.loading();
|
// 请求后台
|
this.$apis.license
|
.checkLicense(license)
|
.then((res) => {
|
// 关闭等待
|
this.$layer.close(loading);
|
console.log(res);
|
let rs = JSON.parse(res.data.result);
|
if (rs.code == 1) {
|
this.active++;
|
this.$emit("success");
|
} else {
|
this.$layer.msg(rs.msg);
|
}
|
})
|
.catch((error) => {
|
console.log(error);
|
// 关闭等待
|
this.$layer.close(loading);
|
});
|
},
|
close() {
|
this.$emit("update:visible", false);
|
},
|
},
|
mounted() {
|
//this.machineCode = "66666666";
|
this.getMacLicense();
|
},
|
};
|
</script>
|
|
<style scoped>
|
.params-container {
|
background-color: #ececec;
|
}
|
|
.form-footer {
|
margin-top: 16px;
|
text-align: right;
|
}
|
|
.form-footer .three-btn {
|
margin-left: 12px;
|
}
|
|
.success-register {
|
line-height: 200px;
|
text-align: center;
|
font-size: 20px;
|
font-weight: bold;
|
}
|
</style>
|
