1.2.0

1.2.0

README.md

@@ -3,6 +3,7 @@
 <image src="resources/icon.png" height="64"/>
 
 # dsz-exam-showboard-next
+
 # DSZ考试看板 next（原DSZ考试看板）
 
 ![WelcomePage](/.Screenshots/WelcomePage.jpg)
@@ -18,26 +19,27 @@
 [![Github Last Commit](https://img.shields.io/github/last-commit/MKStoler4096/dsz-exam-showboard-next)](https://github.com/MKStoler4096/dsz-exam-showboard-next/commits/master)
 [![GitHub Language Count](https://img.shields.io/github/languages/count/MKStoler4096/dsz-exam-showboard-next)](https://github.com/MKStoler4096/dsz-exam-showboard-next)
 [![GitHub Top Language](https://img.shields.io/github/languages/top/MKStoler4096/dsz-exam-showboard-next)](https://github.com/MKStoler4096/dsz-exam-showboard-next)
-[![LICENSE](https://img.shields.io/badge/License-GPL--3.0-red.svg "LICENSE")](LICENSE)
+[![LICENSE](https://img.shields.io/badge/License-GPL--3.0-red.svg 'LICENSE')](LICENSE)
 [![QQ群](https://img.shields.io/badge/-QQ%E7%BE%A4%EF%BD%9C901670561-blue?style=flat&logo=TencentQQ&logoColor=white)](https://qm.qq.com/q/zDiEipHsaI)
 
 一款显示当前时间与考试详细信息的看板类软件
 
 | 下载 | [Releases](https://github.com/MKStoler4096/dsz-exam-showboard-next/releases) | [Actions](https://github.com/MKStoler4096/dsz-exam-showboard-next/actions) |
-| - | - | - |
+| ---- | ---------------------------------------------------------------------------- | -------------------------------------------------------------------------- |
 
 </div>
 
-> [!tip]
+> [!tip] > **本软件使用`Vue` + `TypeScript` + `JavaScript`制作，使用`Node.js` + `Electron`完善系统级功能并打包。**
-> **本软件使用`Vue` + `TypeScript` + `JavaScript`制作，使用`Node.js` + `Electron`完善系统级功能并打包。**
 
 ## 功能
+
 - 起始页展示`打开配置`、`直接进入看板`按钮
 - 看板页面
-	- 上方展示`考试标题`、`信息`
+  - 上方展示`考试标题`、`信息`
-	- 左侧展示`当前时间`、`当前科目`、`考试时间`、`考试状态`
+  - 左侧展示`当前时间`、`当前科目`、`考试时间`、`考试状态`
-	- 右侧展示考试科目列表，包括`科目`、`开始`、`结束`、`状态`
+  - 右侧展示考试科目列表，包括`科目`、`开始`、`结束`、`状态`
-	- 考试结束前15分钟黄字提醒
+  - 考试结束前15分钟黄字提醒
+  - 集控功能（早期测试）
 
 ## 开始使用
 
@@ -48,26 +50,31 @@
 - 编写`json`配置文件
 
 新建文件`exam_config.json`，模板如下
+
 ```json
 {
-    "examName": "考试名称",
+  "examName": "考试名称",
-    "message": "信息",
+  "message": "信息",
-    "examInfos": [
+  "examInfos": [
-        {
+    {
-            "name": "科目",
+      "name": "科目",
-            "start": "2024-10-01T07:00:00",
+      "start": "2024-10-01T07:00:00",
-            "end": "2024-10-01T08:00:00"
+      "end": "2024-10-01T08:00:00"
-        },
+    },
-        {
+    {
-            "name": "科目",
+      "name": "科目",
-            "start": "2024-10-01T09:00:00",
+      "start": "2024-10-01T09:00:00",
-            "end": "2024-10-01T10:00:00"
+      "end": "2024-10-01T10:00:00"
-        }
+    }
-    ]
+  ]
 }
 ```
 
--  打开软件，进入起始页面，点击`打开配置`按钮，选择配置文件，下次可点击`直接进入看板`按钮，将继续使用上次加载的配置。 
+- 打开软件，进入起始页面，点击`打开配置`按钮，选择配置文件，下次可点击`直接进入看板`按钮，将继续使用上次加载的配置。
+
+- 集控
+
+仿照 `ClassIsland` 的集控方法，把上面提到的 `exam_config.json` 传上去，获得 `raw` 直链粘贴回文本框并保存即可。
 
 ## 遇到问题
 
@@ -79,27 +86,32 @@
 
 ## 开发
 
-### Recommended IDE Setup
+### 推荐开发环境
 
 - [VSCode](https://code.visualstudio.com/) + [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) + [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar)
-> [!Caution]
+  > [!Caution] > **必须使用Yarn包管理。Node版本要求为20。**
-> **必须使用Yarn包管理。Node版本要求为20。**
 
-### Project Setup
+### 工程构建
 
-#### Install
+#### 配置
 
 ```bash
 $ yarn
 ```
 
-#### Development
+#### 开发
 
 ```bash
 $ yarn dev
+# 如果无法显示，可以尝试使用下面的命令（不支持热重载）：
+$ yarn start
 ```
 
-#### Build
+> [!note]
+>
+> **如果dev模式页面不显示或按钮点击无效等问题，请连续刷新至少3次后再进行操作。build后没有此问题。**
+
+#### 生成
 
 ```bash
 # For windows
@@ -112,7 +124,7 @@ $ yarn build:mac
 $ yarn build:linux
 ```
 
-### Progress
+### 开发进度
 
 - 正在[`master`](https://github.com/MKStoler4096/dsz-exam-showboard-next/commits/master)分支上维护`1.2-Yesod`版本。
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "examshowboard",
-  "version": "1.1.4",
+  "version": "1.2.0",
   "description": "电子考试展示板",
   "main": "./out/main/index.js",
   "author": "Hello8693&MKStoler <hello8693@hello8693.xyz>",

src/renderer/src/pages/mainWindow.vue

@@ -1,28 +1,75 @@
 <template>
   <v-container class="main-container" fill-height>
     <v-row justify="center" align="center">
-      <v-col cols="12" md="4">
+      <v-col cols="12" md="4" class="d-flex flex-column">
         <v-card class="pa-4 fade-in slide-in" outlined>
-          <v-btn block color="deep-purple accent-4" dark @click="openDialog">打开配置</v-btn>
+          <v-text-field v-model="remoteUrl" label="请求地址" clearable></v-text-field>
+          <v-btn block color="deep-purple accent-4" dark @click="saveUrl">保存地址</v-btn>
+          <p class="mt-2 text-center">输入并保存请求地址</p>
+          <v-btn block color="deep-purple accent-4" dark class="mt-2" @click="openDialog"
+            >打开配置</v-btn
+          >
           <p class="mt-2 text-center">打开 JSON 配置文件</p>
         </v-card>
       </v-col>
-      <v-col cols="12" md="4" class="mt-4 mt-md-0">
+      <v-col cols="12" md="4" class="d-flex flex-column">
         <v-card class="pa-4 fade-in slide-in" outlined>
-          <v-btn block color="teal accent-4" dark @click="gotoInfoPage">直接进入看板</v-btn>
+          <v-btn block color="teal accent-4" dark @click="fetchConfig">请求配置</v-btn>
+          <p class="mt-2 text-center">请求并加载配置</p>
+          <v-btn block color="teal accent-4" dark class="mt-2" @click="gotoInfoPage"
+            >直接进入看板</v-btn
+          >
           <p class="mt-2 text-center">直接进入看板，将继续使用上次加载的配置</p>
         </v-card>
       </v-col>
     </v-row>
+    <v-dialog v-model="errorDialog" max-width="500">
+      <v-card>
+        <v-card-title class="headline">错误</v-card-title>
+        <v-card-text>{{ errorMessage }}</v-card-text>
+        <v-card-actions>
+          <v-btn color="red darken-1" text @click="errorDialog = false">关闭</v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
   </v-container>
 </template>
 
 <script setup>
+import { ref, onMounted } from 'vue';
 import { useRouter } from 'vue-router';
 import { useProfileStore } from '@renderer/stores/app';
 
 const globalStore = useProfileStore();
 const router = useRouter();
+const remoteUrl = ref(localStorage.getItem('remoteUrl') || '');
+const errorDialog = ref(false);
+const errorMessage = ref('');
+
+function saveUrl() {
+  localStorage.setItem('remoteUrl', remoteUrl.value);
+  alert('地址已保存');
+}
+
+async function fetchConfig() {
+  if (remoteUrl.value) {
+    try {
+      const configResponse = await fetch(remoteUrl.value);
+      if (!configResponse.ok) {
+        throw new Error('无法获取配置文件');
+      }
+      const config = await configResponse.json();
+      globalStore.$patch(config);
+      router.push('/infoPage');
+    } catch (error) {
+      errorMessage.value = error.message;
+      errorDialog.value = true;
+    }
+  } else {
+    errorMessage.value = '请输入有效的请求地址';
+    errorDialog.value = true;
+  }
+}
 
 function openDialog() {
   window.electron.ipcRenderer.send('prog:loadjson');
@@ -38,6 +85,13 @@ window.electron.ipcRenderer.on('common:openFile', (event, message) => {
   globalStore.$patch(examData);
   router.push('/infoPage');
 });
+
+onMounted(() => {
+  const savedUrl = localStorage.getItem('remoteUrl');
+  if (savedUrl) {
+    remoteUrl.value = savedUrl;
+  }
+});
 </script>
 
 <style scoped>