init

frontend/src/views/activate/index.vue

@@ -0,0 +1,205 @@
+<template>
+  <div class="activation-page">
+    <a-card title="RSA密钥配置" style="margin-bottom: 20px;">
+      <a-row :gutter="16">
+        <a-col :span="24">
+          <a-alert
+            message="注意：请妥善保管私钥，不要泄露给他人"
+            type="warning"
+            show-icon
+            style="margin-bottom: 16px;"
+          />
+        </a-col>
+
+        <a-col :span="12">
+          <a-form-item label="RSA公钥">
+            <a-textarea
+              v-model:value="rsaKeys.publicKey"
+              :rows="5"
+              readonly
+              placeholder="RSA公钥内容"
+            />
+            <a-button
+              type="primary"
+              ghost
+              size="small"
+              @click="copyToClipboard(rsaKeys.publicKey)"
+              :disabled="!rsaKeys.publicKey"
+              style="margin-top: 8px;"
+            >
+              复制公钥
+            </a-button>
+          </a-form-item>
+        </a-col>
+
+        <a-col :span="12">
+          <a-form-item label="RSA私钥">
+            <a-textarea
+              v-model:value="rsaKeys.privateKey"
+              :rows="5"
+              readonly
+              placeholder="RSA私钥内容"
+            />
+            <a-button
+              type="primary"
+              ghost
+              size="small"
+              @click="copyToClipboard(rsaKeys.privateKey)"
+              :disabled="!rsaKeys.privateKey"
+              style="margin-top: 8px;"
+            >
+              复制私钥
+            </a-button>
+          </a-form-item>
+        </a-col>
+      </a-row>
+    </a-card>
+
+    <a-card title="设备激活">
+      <a-row :gutter="16">
+        <a-col :span="24">
+          <a-divider orientation="left" orientation-margin="0px">设备申请码</a-divider>
+          <a-form-item>
+            <a-textarea
+              v-model:value="activationForm.requestCode"
+              :rows="3"
+              placeholder="请输入设备申请码"
+            />
+          </a-form-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-divider orientation="left" orientation-margin="0px">设备申请码</a-divider>
+          <a-form-item>
+            <a-textarea
+              v-model:value="activationForm.activationCode"
+              :rows="3"
+              placeholder="生成的激活码将显示在这里"
+              readonly
+            />
+          </a-form-item>
+        </a-col>
+
+        <a-col :span="24">
+          <a-space>
+            <a-button
+              type="primary"
+              @click="generateActivationCode"
+              :loading="generating"
+              :disabled="!activationForm.requestCode.trim()"
+            >
+              生成激活码
+            </a-button>
+
+            <a-button
+              @click="copyToClipboard(activationForm.activationCode)"
+              :disabled="!activationForm.activationCode"
+            >
+              复制激活码
+            </a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+    </a-card>
+  </div>
+</template>
+<script setup lang="ts">
+import {ref} from 'vue'
+import {message} from 'ant-design-vue'
+import rsa from '@/utils/rsa'
+import {Activate} from "@/views/activate/index";
+
+const rsaKeys = ref({
+  publicKey: rsa.publicKey,
+  privateKey: rsa.privateKey
+})
+
+const activationForm = ref({
+  requestCode: '',
+  activationCode: ''
+})
+
+const generating = ref(false)
+
+
+// 生成激活码
+const generateActivationCode = () => {
+  if (!activationForm.value.requestCode.trim()) {
+    message.error('请输入设备申请码')
+    return
+  }
+  generating.value = true
+  let activationCodePlaintext
+  try {
+    const plaintext = rsa.decrypt(activationForm.value.requestCode)
+    activationCodePlaintext = JSON.parse(plaintext) as Activate.ActivationCodePlaintext
+  } catch (e) {
+    console.error(e)
+  }
+  if (!activationCodePlaintext) {
+    generating.value = false
+    message.error('无效的设备申请码')
+    return
+  }
+  const contrast = activationCodePlaintext.contrast
+  const digital = activationCodePlaintext.digital
+  const simulate = activationCodePlaintext.simulate
+  if (!contrast && !digital && !simulate) {
+    generating.value = false
+    message.error('无效的设备申请码')
+    return
+  }
+  if (contrast.apply === 1) {
+    activationCodePlaintext.contrast.permanently = 1
+  }
+  if (digital.apply === 1) {
+    activationCodePlaintext.digital.permanently = 1
+  }
+  if (simulate.apply === 1) {
+    activationCodePlaintext.simulate.permanently = 1
+  }
+  const data = JSON.stringify(activationCodePlaintext)
+  try {
+    setTimeout(() => {
+      activationForm.value.activationCode = rsa.encrypt(data)
+      generating.value = false
+    }, 1000)
+
+  } catch (e) {
+    console.error(e)
+    generating.value = false
+    message.error('生成激活码失败')
+  }
+
+}
+
+// 复制到剪贴板
+const copyToClipboard = (text: string) => {
+  if (!text) {
+    message.warning('没有内容可复制')
+    return
+  }
+
+  navigator.clipboard.writeText(text).then(() => {
+    message.success('复制成功')
+  }).catch(() => {
+    message.error('复制失败')
+  })
+}
+</script>
+<style scoped lang="less">
+.activation-page {
+  :deep(textarea) {
+    font-family: consolas, monospace;
+    resize: none;
+  }
+  :deep(.ant-form-item-label) {
+    font-weight: bold;
+  }
+
+  :deep(.ant-card) {
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  }
+}
+</style>