<template>
|
<div class="desktop">
|
<d-frame
|
v-for="item in this.$store.state.desktop.frames"
|
:data="item"
|
:key="item.id"
|
></d-frame>
|
<safari
|
:data="$store.state.desktop.safari"
|
v-if="$store.state.desktop.safari.active"
|
></safari>
|
|
<div class="warn-tag" v-if="showFreeVersion">
|
<span class="text"
|
>试用版尚未激活，仅支持部分功能使用，如需使用全部功能，请尽快激活系统。</span
|
>
|
<span class="go-to" @click="gotoActive">前往激活</span>
|
<span class="icon iconfont" @click="showFreeVersion = false"
|
></span
|
>
|
</div>
|
|
<el-dialog
|
title="激活SmartAI"
|
:visible.sync="dialogVisible"
|
width="750px"
|
:show-close="false"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
>
|
<div class="ver"><span class="ver-text">版本：</span>{{ version }}</div>
|
<div class="ver">
|
<span class="ver-text">状态：</span>{{ versionState }}
|
</div>
|
<el-divider></el-divider>
|
<div class="info">
|
如果还没有产品密钥，你可以使用手机扫码或前往此链接
|
<a href="http://os.smartai.com:7004" target="_blank"
|
>http://os.smartai.com:7004</a
|
>
|
购买。
|
</div>
|
<img class="qr-code-img" src="/version/offline/qrcode" />
|
<el-divider></el-divider>
|
|
<div class="ask">
|
如果你具有SmartAI提供的产品密钥，请在此处输入激活SmartAI。
|
</div>
|
<div class="validate">
|
<form id="myForm">
|
<el-input
|
type="textarea"
|
autosize
|
style="width: 480px"
|
placeholder="将产品密钥粘贴在此处"
|
v-model="secrectKey"
|
>
|
</el-input>
|
</form>
|
|
<el-upload
|
class="upload-demo"
|
action
|
:http-request="uploadKey"
|
:limit="1"
|
:show-file-list="false"
|
>
|
<el-button size="small" type="primary">导入产品密钥文件</el-button>
|
</el-upload>
|
</div>
|
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">继续试用</el-button>
|
<el-button type="primary" @click="activateVersion">激活</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import DFrame from "./DFrame";
|
import Safari from "./Safari";
|
import {
|
getActiveQrCode,
|
getSN,
|
activateVersion,
|
uploadKey,
|
} from "@/api/system";
|
export default {
|
name: "Desktop",
|
components: {
|
DFrame,
|
Safari,
|
},
|
data() {
|
return {
|
showFreeVersion: false,
|
dialogVisible: false,
|
version: "SmartAI试用版",
|
versionState: "尚未激活",
|
secrectKey: "",
|
};
|
},
|
mounted() {
|
this.validateSn();
|
},
|
methods: {
|
validateSn() {
|
getSN().then((res) => {
|
this.showFreeVersion = res.data.sn == "";
|
});
|
},
|
activateVersion() {
|
if (this.secrectKey.trim() == "") {
|
this.$message.warning("请先填写产品密钥");
|
return;
|
}
|
activateVersion({ code: this.secrectKey.trim() })
|
.then((res) => {
|
if (res.code == 200) {
|
this.$notify.success("激活成功");
|
this.validateSn();
|
this.goToSysInfo();
|
this.dialogVisible = false;
|
} else {
|
this.$notify.error(res.msg);
|
}
|
})
|
.catch((err) => {
|
this.$notify.error(err.msg);
|
});
|
},
|
goToSysInfo() {
|
window.parent.postMessage({ msg: `toVindicate?menu=系统信息` }, "*");
|
},
|
gotoActive() {
|
this.dialogVisible = true;
|
},
|
uploadKey(params) {
|
debugger
|
let param = new FormData();
|
param.append("code", params.file);
|
uploadKey(param).then(
|
(res) => {
|
if (res.code == 200) {
|
this.$message.success("导入成功");
|
this.secrectKey = res.data;
|
} else {
|
this.$message.error(res.msg);
|
}
|
},
|
(err) => {
|
this.$message.error(err.msg);
|
}
|
);
|
},
|
onInput(val) {
|
if (this[`input${val}`].length == 4 && val < 5) {
|
this.$refs[`input${val + 1}`].focus();
|
}
|
if (this[`input${val}`].length == 0 && val > 0) {
|
this.$refs[`input${val - 1}`].focus();
|
}
|
},
|
},
|
};
|
</script>
|
|
<style lang="scss" >
|
.desktop {
|
width: 100%;
|
height: 100%;
|
.el-dialog__header {
|
padding: 15px 20px 10px;
|
text-align: left;
|
font-weight: 600;
|
}
|
.el-dialog__body {
|
text-align: left;
|
padding: 30px 50px;
|
padding-top: 20px;
|
}
|
.el-divider--horizontal {
|
margin: 20px 0;
|
}
|
.validate {
|
display: flex;
|
align-items: baseline;
|
margin-top: 15px;
|
}
|
#myForm {
|
display: flex;
|
align-items: center;
|
margin-right: 10px;
|
.single-input {
|
margin: 0 8px;
|
width: 60px;
|
}
|
}
|
.ver {
|
margin-bottom: 10px;
|
font-size: 16px;
|
.ver-text {
|
font-weight: 600;
|
}
|
}
|
.info {
|
font-size: 15px;
|
margin-bottom: 10px;
|
}
|
.qr-code-img {
|
// width: 120px;
|
// height: 120px;
|
}
|
.ask {
|
margin-top: 20px;
|
font-size: 15px;
|
}
|
}
|
.warn-tag {
|
width: 640px;
|
text-align: left;
|
box-sizing: border-box;
|
padding: 0 25px;
|
height: 45px;
|
background-color: rgba(255, 238, 230, 1);
|
z-index: 99999;
|
position: absolute;
|
display: flex;
|
justify-content: space-between;
|
top: 55px;
|
left: calc(50% - 320px);
|
line-height: 45px;
|
border-radius: 5px;
|
.go-to {
|
color: rgba(71, 153, 247, 1);
|
cursor: pointer;
|
text-decoration: underline;
|
font-weight: 600;
|
font-size: 13px;
|
}
|
.text {
|
font-size: 13px;
|
}
|
.icon {
|
font-size: 14px;
|
cursor: pointer;
|
}
|
}
|
</style>
|
