Merge pull request #66 from Arondight/dev

.github/workflows/resources_update.yml

@@ -25,7 +25,7 @@ jobs:
           if [[ -n $(git status --porcelain) ]]
           then
             git add .
-            git commit -m 'update resources'
+            git commit -m 'Update resources'
             git push
           else
             echo "Nothing to commit."

.github/workflows/vue_update.yml

@@ -0,0 +1,32 @@
+name: Update Vue.js in dev branch
+
+on:
+  workflow_dispatch:
+  schedule:
+    # UTC
+    - cron: "0 21 * * *"
+
+jobs:
+  vue_update:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          ref: dev
+      - name: Update Vue.js
+        run: ./data/js/update.sh
+      - name: Config git
+        run: |
+          git config user.name 'github-actions'
+          git config user.email '[email protected]'
+      - name: Commit and push
+        run: |
+          if [[ -n $(git status --porcelain) ]]
+          then
+            git add .
+            git commit -m 'Update Vue.js'
+            git push
+          else
+            echo "Nothing to commit."
+          fi

README.md

@@ -19,7 +19,11 @@
 1. 代码提交前运行 `npm run code-check` 进行检查确保无报错，并运行 `npm run code-format` 进行格式化。
 2. 代码自测完毕后发起 [Pull request](https://github.com/Arondight/Adachi-BOT/pulls) 合入 `dev` 分支。
 3. 新功能添加或者功能修改请先发起 [Issue](https://github.com/Arondight/Adachi-BOT/issues) 询问我的意愿，根据沟通结果选择合入本项目或者提交到你账户下的一个 Fork 。漏洞修复无需事先沟通，直接发起 [Pull request](https://github.com/Arondight/Adachi-BOT/pulls) 并描述清楚问题即可。
-4. 请不要在你的 Fork 中开启 `Update resources in dev branch` 这个 workflow ！它对你没有任何帮助。
+
+> 请不要在你的 Fork 中开启下面的 workflow ！它们对你没有任何帮助。
+>
+> 1. `Update resources in dev branch`
+> 2. `Update Vue.js in dev branch`
 
 ## 使用
 

config_defaults/names.yml

@@ -52,7 +52,7 @@ character:
   七七: [ 77, 僵尸 ]
   甘雨: [ 椰羊, 王小美 ]
   优菈: [ 尤拉 ]
-  申鹤: [ ]
+  申鹤: [ 小姨 ]
   埃洛伊: [ ]
   迪奥娜: [ 猫, dio ]
   罗莎莉亚: [ 修女 ]

data/js/update.sh

@@ -0,0 +1,33 @@
+#!/usr/bin/env bash
+
+RDIR=$(dirname $(readlink -f "$0"))
+CURL=('curl' '-sL')
+
+typeset -A LOCPATH=(
+  ['https://cn.vuejs.org/js/vue.js']="${RDIR}/vue2.js"
+  ['https://cn.vuejs.org/js/vue.min.js']="${RDIR}/vue2.min.js"
+  ['https://unpkg.com/vue@next/dist/vue.global.js']="${RDIR}/vue3.global.js"
+  ['https://unpkg.com/vue@next/dist/vue.global.prod.js']="${RDIR}/vue3.global.prod.js"
+)
+
+function check()
+{
+  if ! (type 'curl' >/dev/null 2>&1)
+  then
+    echo 'No curl command found.' >&2
+    return 1
+  fi
+
+  return 0
+}
+
+# MAIN
+{
+  check || exit 1
+
+  for url in "${!LOCPATH[@]}"
+  do
+    echo -e "Fetch\t${url}"
+    command "${CURL[@]}" "$url" -o "${LOCPATH[${url}]}"
+  done
+}

docs/开发指引.md

@@ -10,11 +10,11 @@
 Adachi-BOT
 ├── app.js                      # 主程序
 ├── config
-│   ├── command.yml             # 用户插件配置
-│   ├── command_master.yml      # 管理员插件配置
-│   └── setting.yml             # 基础配置
+│   ├── command.yml             # 用户插件配置
+│   ├── command_master.yml      # 管理员插件配置
+│   └── setting.yml             # 基础配置
 ├── data
-│   └── db                      # 数据库文件
+│   └── db                      # 数据库文件
 ├── resources
 ├── resources_custom
 └── src
@@ -108,7 +108,7 @@ index 8cd0307..46c4400 100644
        break;
      case hasEntrance(msg.text, "master", "reply_auth"):
        setReplyAuth(msg);
--- 
+---
 2.34.1
 
 ```
@@ -178,30 +178,49 @@ index 8cd0307..46c4400 100644
 | `global.bots` | 所有可用的 `msg.bot` |
 | `global.bots.logger` | `global.bots[0].logger` |
 
-### 前端部分
+### 网页部分
+
+#### 介绍
+
+本项目使用 [Vue.js](https://github.com/vuejs/vue.git) 和 [Puppeteer](https://github.com/puppeteer/puppeteer.git) 协作完成网页的工作。如果插件需要根据数据动态生成图片，则需要使用 `../data/js/` 中恰当版本的 Vue.js 在 `../src/views/` 中编写网页，并在插件中使用 `../src/utils/render.js` 中的 `render` 方法对该网页进行截图。
+
+| Vue.js | 来源 |
+| --- | --- |
+| `../data/js/vue2.js` | `https://cn.vuejs.org/js/vue.js` |
+| `../data/js/vue2.min.js` | `https://cn.vuejs.org/js/vue.min.js` |
+| `../data/js/vue3.global.js` | `https://unpkg.com/vue@next/dist/vue.global.js` |
+| `../data/js/vue3.global.prod.js` | `https://unpkg.com/vue@next/dist/vue.global.prod.js` |
 
-本项目使用 [Vue.js](https://github.com/vuejs/vue.git) 和 [Puppeteer](https://github.com/puppeteer/puppeteer.git) 协作完成前端部分的工作。如果你的插件需要绘图，那么请在 `../src/views/` 下编写前端部分，并在插件中使用 `../src/utils/render.js` 中的 `render` 方法完成绘图并发送给用户。
+> 我们的 CI 会保证 Vue.js 版本总是为最新。
 
-插件通过 URL 传递数据给前端部分，详情请见 `render` 方法的定义。如果你要在前端中使用这些数据，需要自行解析 URL ，下面是目前我们用来解析 URL 中的数据的代码。
+插件通过 URL 参数传递数据给网页，详情请见 `render` 方法的定义。你需要在网页中从 URL 参数中获取数据。
 
 ```js
-mounted() {
-  const params = JSON.parse(
-    decodeURIComponent(escape(window.atob(new URL(window.location.href).searchParams.get("data")) || "{}"))
-  );
+import { getParams } from "../common/param.js";
 
-  // this.prop = params.prop;
-},
+setup() {
+    const params = getParams(window.location.href);
+    //const prop1 = params.prop1;
+}
 ```
 
-> 1. 使用选项 `viewDebug: 1` 来进行实时前端调试。
-> 2. 在机器人运行时使用命令 `npm run tool-view -- -h` 来查看如何调试 `../data/record/last_params/` 下的前端数据文件。
+#### 调试
+
+项目中提供了一些手段帮助你进行调试。
+
+1. 可以在 `config.yml` 当中指定选项 `viewDebug: 1` 来进行实时调试。
+2. 在机器人运行时，可以使用命令 `npm run tool-view -- -h` 来查看如何调试 `../data/record/last_params/` 下的数据。
+
+调试时建议使用 [Vue.js devtools](https://v3.cn.vuejs.org/guide/installation.html#vue-devtools) ，它同样提供以下浏览器的插件。
+
+1. [Chrome](https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg)
+2. [Firefox](https://addons.mozilla.org/en-US/firefox/addon/vue-js-devtools/)
 
 ### 开发步骤
 
 1. 在 `../config_defaults/command.yml` 中添加入口。
 2. 在 `../src/plugins/` 目录下实现插件。
-3. 如有需要，在 `../src/views/` 下实现前端部分。
+3. 如有需要，在 `../src/views/` 下实现网页。
 
 ## 数据库
 

resources/update.sh

@@ -13,7 +13,7 @@ API='https://adachi-bot.oss-cn-beijing.aliyuncs.com'
 # {
 CUSTOM_RES=$(readlink -f "${RDIR}/../resources_custom/")
 # }
-CURL=('curl' '-s')
+CURL=('curl' '-sL')
 
 # ==============================================================================
 # 所有的游戏资源

src/utils/load.js

@@ -202,7 +202,7 @@ function processedOnline(bot) {
 
 function processed(msg, plugins, type, bot) {
   if (undefined !== msg.raw_message && Array.isArray(msg.message)) {
-    msg.raw_message = toCqcode(msg.message);
+    msg.raw_message = toCqcode(msg);
   }
 
   // 如果好友增加了，尝试向新朋友问好

src/utils/oicq.js

@@ -3,12 +3,11 @@
  * https://github.com/takayama-lily/oicq
  * ==========================================================================
  * 因为 oicq 维护的这几个 API 有兼容性问题，所以在此重新实现。
- * 在 oicq 修复后，因为切换官方 API 会涉及到特殊节点代码升级后不正常的问题，
- * 所以尽量不切换到官方 API 。
  * ========================================================================== */
 
 import lodash from "lodash";
 import querystring from "querystring";
+import { genDmMessageId } from "oicq/lib/message/message.js";
 
 const CQ = {
   "[": "[",
@@ -50,10 +49,20 @@ function qs(text, sep = ",", equal = "=") {
   return ret;
 }
 
-function toCqcode(message = []) {
+// BREAKING 参数已改变
+function toCqcode(msg = {}) {
+  const isQuote = lodash.hasIn(msg, ["source", "message"]);
   let cqcode = "";
+  let firstAtParsed = false;
 
-  (Array.isArray(message) ? message : [message]).forEach((c) => {
+  if (true === isQuote) {
+    const quote = { ...msg.source, flag: 1 };
+    const mid = genDmMessageId(quote.user_id, quote.seq, quote.rand, quote.time, quote.flag);
+
+    cqcode += `[CQ:reply,id=${mid}]`;
+  }
+
+  (msg.message || []).forEach((c) => {
     if ("text" === c.type) {
       cqcode += c.text;
       return;
@@ -62,7 +71,14 @@ function toCqcode(message = []) {
     const s = querystring.stringify(c, ",", "=", {
       encodeURIComponent: (s) => s.replace(new RegExp(Object.keys(CQInside).join("|"), "g"), (s) => CQInside[s] || ""),
     });
-    cqcode += `[CQ:${c.type}${s ? "," : ""}${s}]`;
+    const cq = `[CQ:${c.type}${s ? "," : ""}${s}]`;
+
+    cqcode += cq;
+
+    if ("at" === c.type && false === firstAtParsed && true === isQuote) {
+      cqcode += cq;
+      firstAtParsed = true;
+    }
   });
 
   return cqcode;

src/views/component/README.txt

@@ -0,0 +1,26 @@
+./aby/
+  genshin-aby.html
+
+./artifact/
+  genshin-artifact.html
+
+./card/
+  genshin-card.html
+
+./card-8/
+  genshin-card-8.html
+
+./common/
+  公共库
+
+./character/
+  genshin-character.html
+
+./gacha/
+  genshin-gacha.html
+
+./overview/
+  genshin-overview.html
+
+./package/
+  genshin-package.html

src/views/component/card-8/app.js

@@ -83,7 +83,7 @@ import HomeBox from "./home-box.js";
 
 // eslint-disable-next-line no-undef
 const { defineComponent, computed } = Vue;
-import { decodeUriData } from "../common/utils.js";
+import { getParams } from "../common/param.js";
 
 export default defineComponent({
   name: "Card8Box",
@@ -95,9 +95,7 @@ export default defineComponent({
     HomeBox,
   },
   setup() {
-    const params = JSON.parse(decodeUriData(new URL(window.location.href).searchParams.get("data")) || "{}");
-
-    // params.avatars = params.avatars.slice(0, 8);
+    const params = getParams(window.location.href);
 
     function findArea(id) {
       return params.explorations.find((el) => el.id === id);

src/views/component/common/README.txt

@@ -0,0 +1,2 @@
+./param.js
+  getParams               从 window.location.href 中获取参数

src/views/component/common/param.js

@@ -0,0 +1,15 @@
+function decodeURIComponentHelper(encoded) {
+  return decodeURIComponent(
+    window
+      .atob(encoded)
+      .split("")
+      .map((c) => "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2))
+      .join("")
+  );
+}
+
+function getParams(href) {
+  return JSON.parse(decodeURIComponentHelper(new URL(href).searchParams.get("data")) || "{}");
+}
+
+export { getParams };

src/views/component/material/app.js

@@ -17,7 +17,7 @@ import MaterialColumn from "./column.js";
 
 // eslint-disable-next-line no-undef
 const { defineComponent } = Vue;
-import { decodeUriData } from "../common/utils.js";
+import { getParams } from "../common/param.js";
 
 export default defineComponent({
   name: "MaterialApp",
@@ -28,7 +28,7 @@ export default defineComponent({
   setup() {
     const starBASE64 =
       "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTI4LjU2OCAxNC42MjNjLTkuNzQxLS41NjQtMTIuNjQ0LTMuODg0LTEzLjczNC0xMy43MzQtLjUxNCA5LjkxNy0zLjQxIDEzLjA5Mi0xMy43MzMgMTMuNzM0IDkuOTYzLjM4MyAxMy4wNzkgMy43ODcgMTMuNzMzIDEzLjczNCAxLjE2My05LjUxMSA0LjEyNi0xMi42NDkgMTMuNzM0LTEzLjczNHoiIGZpbGw9IiMyRTNENTQiIHN0cm9rZT0iIzJFM0Q1NCIvPjwvc3ZnPg==";
-    const params = JSON.parse(decodeUriData(new URL(window.location.href).searchParams.get("data")) || "{}");
+    const params = getParams(window.location.href);
     const day = params.day;
     const character = params.character.data;
     const weapon = params.weapon.data;

src/views/genshin-aby.html

@@ -207,7 +207,8 @@
     </div>
   </body>
   <script type="module">
-    import { decodeUriData } from "./component/common/utils.js";
+    import { getParams } from "./component/common/param.js";
+
     new Vue({
       el: "#app",
       data: {
@@ -254,7 +255,7 @@
         },
       },
       mounted() {
-        const params = JSON.parse(decodeUriData(new URL(window.location.href).searchParams.get("data")) || "{}");
+        const params = getParams(window.location.href);
 
         this.uid = params.uid;
         this.start_time = this.formatDate(new Date(params.data.start_time * 1000), "yyyy/MM/dd");

src/views/genshin-artifact.html

@@ -30,7 +30,7 @@
     </div>
 
     <script type="module">
-      import { decodeUriData } from "./component/common/utils.js";
+      import { getParams } from "./component/common/param.js";
       new Vue({
         el: "#app",
         data: {
@@ -98,7 +98,7 @@
           },
         },
         mounted() {
-          const params = JSON.parse(decodeUriData(new URL(window.location.href).searchParams.get("data")) || "{}");
+          const params = getParams(window.location.href);
 
           this.base = params.base;
           this.data = params.data;

src/views/genshin-card-8.html

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8" />
     <title>card-8</title>
-    <script src="../../data/js/vue3.global.min.js"></script>
+    <script src="../../data/js/vue3.global.prod.js"></script>
     <link rel="stylesheet" href="./component/card-8/card-8.css" />
   </head>
   <body>