修复日志弹框样式

close #2086

.prettierignore

@@ -6,3 +6,27 @@ package.json
 .umi
 .umi-production
 .umi-test
+.history
+.tmp
+node_modules
+npm-debug.log*
+yarn-error.log
+yarn.lock
+package-lock.json
+static
+data
+DS_Store
+src/.umi
+src/.umi-production
+src/.umi-test
+.env.local
+.env
+history
+version.ts
+config
+log
+db
+manual_log
+scripts
+bak
+.tmp

.umirc.ts

@@ -4,13 +4,16 @@ const CompressionPlugin = require('compression-webpack-plugin');
 const baseUrl = process.env.QlBaseUrl || '/';
 export default defineConfig({
   hash: true,
+  jsMinifier: 'terser',
   antd: {},
+  locale: {
+    antd: true,
+    title: true,
+    baseNavigator: true,
+  },
   outputPath: 'static/dist',
   fastRefresh: true,
   favicons: [`https://qn.whyour.cn/favicon.svg`],
-  mfsu: {
-    strategy: 'eager',
-  },
   publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
   proxy: {
     [`${baseUrl}api/public`]: {

back/api/env.ts

@@ -6,6 +6,7 @@ import { celebrate, Joi } from 'celebrate';
 import multer from 'multer';
 import config from '../config';
 import fs from 'fs';
+import { safeJSONParse } from '../config/util';
 const route = Router();
 
 const storage = multer.diskStorage({
@@ -200,7 +201,7 @@ export default (app: Router) => {
       try {
         const envService = Container.get(EnvService);
         const fileContent = await fs.promises.readFile(req!.file!.path, 'utf8');
-        const parseContent = JSON.parse(fileContent);
+        const parseContent = safeJSONParse(fileContent);
         const data = Array.isArray(parseContent)
           ? parseContent
           : [parseContent];

back/api/log.ts

@@ -53,7 +53,7 @@ export default (app: Router) => {
       body: Joi.object({
         filename: Joi.string().required(),
         path: Joi.string().allow(''),
-        type: Joi.string().optional()
+        type: Joi.string().optional(),
       }),
     }),
     async (req: Request, res: Response, next: NextFunction) => {
@@ -65,7 +65,7 @@ export default (app: Router) => {
         };
         const filePath = join(config.logPath, path, filename);
         if (type === 'directory') {
-          emptyDir(filePath);          
+          emptyDir(filePath);
         } else {
           fs.unlinkSync(filePath);
         }
@@ -75,5 +75,4 @@ export default (app: Router) => {
       }
     },
   );
-
 };

back/api/script.ts

@@ -265,9 +265,11 @@ export default (app: Router) => {
         let { filename, path, pid } = req.body;
         const { name, ext } = parse(filename);
         const filePath = join(config.scriptPath, path, `${name}.swap${ext}`);
+        const logPath = join(config.logPath, path, `${name}.swap`);
 
         const scriptService = Container.get(ScriptService);
         const result = await scriptService.stopScript(filePath, pid);
+        emptyDir(logPath);
         res.send(result);
       } catch (e) {
         return next(e);

back/api/subscription.ts

@@ -210,12 +210,16 @@ export default (app: Router) => {
     '/',
     celebrate({
       body: Joi.array().items(Joi.number().required()),
+      query: Joi.object({
+        force: Joi.boolean().optional(),
+        t: Joi.number()
+      })
     }),
     async (req: Request, res: Response, next: NextFunction) => {
       const logger: Logger = Container.get('logger');
       try {
         const subscriptionService = Container.get(SubscriptionService);
-        const data = await subscriptionService.remove(req.body);
+        const data = await subscriptionService.remove(req.body, req.query);
         return res.send({ code: 200, data });
       } catch (e) {
         return next(e);

back/api/system.ts

@@ -35,9 +35,8 @@ export default (app: Router) => {
     try {
       const userService = Container.get(UserService);
       const authInfo = await userService.getUserInfo();
-      const { version, changeLog, changeLogLink, publishTime } = await parseVersion(
-        config.versionFile,
-      );
+      const { version, changeLog, changeLogLink, publishTime } =
+        await parseVersion(config.versionFile);
 
       let isInitialized = true;
       if (
@@ -175,7 +174,10 @@ export default (app: Router) => {
     async (req: Request, res: Response, next: NextFunction) => {
       try {
         const systemService = Container.get(SystemService);
-        const uniqPath = await getUniqPath(req.body.command);
+        const command = req.body.command
+        const idStr = `cat ${config.crontabFile} | grep -E "${command}" | perl -pe "s|.*ID=(.*) ${command}.*|\\1|" | head -1 | awk -F " " '{print $1}' | xargs echo -n`;
+        let id = await promiseExec(idStr);
+        const uniqPath = await getUniqPath(command, id);
         const logTime = dayjs().format('YYYY-MM-DD-HH-mm-ss-SSS');
         const logPath = `${uniqPath}/${logTime}.log`;
         res.setHeader('Content-type', 'application/octet-stream');
@@ -250,4 +252,17 @@ export default (app: Router) => {
       }
     },
   );
+
+  route.get(
+    '/log',
+    async (req: Request, res: Response, next: NextFunction) => {
+      try {
+        const systemService = Container.get(SystemService);
+        await systemService.getSystemLog(res);
+      } catch (e) {
+        return next(e);
+      }
+    },
+  );
+
 };

back/app.ts

@@ -18,10 +18,12 @@ async function startServer() {
   const server = app
     .listen(config.port, () => {
       Logger.debug(`✌️ 后端服务启动成功！`);
+      console.debug(`✌️ 后端服务启动成功！`);
       process.send?.('ready');
     })
     .on('error', (err) => {
       Logger.error(err);
+      console.error(err);
       process.exit(1);
     });
 

back/config/index.ts

@@ -1,6 +1,6 @@
 import dotenv from 'dotenv';
 import path from 'path';
-import { createRandomString } from './util';
+import { createRandomString } from './share';
 
 process.env.NODE_ENV = process.env.NODE_ENV || 'development';
 
@@ -20,6 +20,7 @@ const rootPath = process.env.QL_DIR as string;
 const envFound = dotenv.config({ path: path.join(rootPath, '.env') });
 
 const dataPath = path.join(rootPath, 'data/');
+const shellPath = path.join(rootPath, 'shell/');
 const tmpPath = path.join(rootPath, '.tmp/');
 const samplePath = path.join(rootPath, 'sample/');
 const configPath = path.join(dataPath, 'config/');
@@ -29,6 +30,7 @@ const logPath = path.join(dataPath, 'log/');
 const dbPath = path.join(dataPath, 'db/');
 const uploadPath = path.join(dataPath, 'upload/');
 const sshdPath = path.join(dataPath, 'ssh.d/');
+const systemLogPath = path.join(dataPath, 'syslog/');
 
 const envFile = path.join(configPath, 'env.sh');
 const confFile = path.join(configPath, 'config.sh');
@@ -44,6 +46,7 @@ const loginFaild = '请先登录!';
 const configString = 'config sample crontab shareCode diy';
 const versionFile = path.join(rootPath, 'version.yaml');
 const dataTgzFile = path.join(tmpPath, 'data.tgz');
+const shareShellFile = path.join(shellPath, 'share.sh');
 
 if (envFound.error) {
   throw new Error("⚠️  Couldn't find .env file  ⚠️");
@@ -64,6 +67,7 @@ export default {
   tmpPath,
   dataPath,
   dataTgzFile,
+  shareShellFile,
   configString,
   loginFaild,
   authError,
@@ -107,4 +111,5 @@ export default {
   lastVersionFile,
   sqliteFile,
   sshdPath,
+  systemLogPath,
 };

back/config/share.ts

@@ -0,0 +1,84 @@
+export function createRandomString(min: number, max: number): string {
+  const num = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
+  const english = [
+    'a',
+    'b',
+    'c',
+    'd',
+    'e',
+    'f',
+    'g',
+    'h',
+    'i',
+    'j',
+    'k',
+    'l',
+    'm',
+    'n',
+    'o',
+    'p',
+    'q',
+    'r',
+    's',
+    't',
+    'u',
+    'v',
+    'w',
+    'x',
+    'y',
+    'z',
+  ];
+  const ENGLISH = [
+    'A',
+    'B',
+    'C',
+    'D',
+    'E',
+    'F',
+    'G',
+    'H',
+    'I',
+    'J',
+    'K',
+    'L',
+    'M',
+    'N',
+    'O',
+    'P',
+    'Q',
+    'R',
+    'S',
+    'T',
+    'U',
+    'V',
+    'W',
+    'X',
+    'Y',
+    'Z',
+  ];
+  const special = ['-', '_'];
+  const config = num.concat(english).concat(ENGLISH).concat(special);
+
+  const arr = [];
+  arr.push(getOne(num));
+  arr.push(getOne(english));
+  arr.push(getOne(ENGLISH));
+  arr.push(getOne(special));
+
+  const len = min + Math.floor(Math.random() * (max - min + 1));
+
+  for (let i = 4; i < len; i++) {
+    arr.push(config[Math.floor(Math.random() * config.length)]);
+  }
+
+  const newArr = [];
+  for (let j = 0; j < len; j++) {
+    newArr.push(arr.splice(Math.random() * arr.length, 1)[0]);
+  }
+
+  function getOne(arr: any[]) {
+    return arr[Math.floor(Math.random() * arr.length)];
+  }
+
+  return newArr.join('');
+}

back/config/subscription.ts

@@ -34,9 +34,11 @@ export function formatCommand(doc: Subscription, url?: string) {
   if (type === 'file') {
     command += `raw "${_url}"`;
   } else {
-    command += `repo "${_url}" "${whitelist || ''}" "${blacklist || ''}" "${dependences || ''
-      }" "${branch || ''}" "${extensions || ''}" "${proxy || ''}" "${isNil(autoAddCron) ? true : Boolean(autoAddCron)
-      }" "${isNil(autoDelCron) ? true : Boolean(autoDelCron)}"`;
+    command += `repo "${_url}" "${whitelist || ''}" "${blacklist || ''}" "${
+      dependences || ''
+    }" "${branch || ''}" "${extensions || ''}" "${proxy || ''}" "${
+      isNil(autoAddCron) ? true : Boolean(autoAddCron)
+    }" "${isNil(autoDelCron) ? true : Boolean(autoDelCron)}"`;
   }
   return command;
 }

back/config/util.ts

@@ -9,6 +9,9 @@ import { promisify } from 'util';
 import { load } from 'js-yaml';
 import config from './index';
 import { TASK_COMMAND } from './const';
+import Logger from '../loaders/logger';
+
+export * from './share';
 
 export function getFileContentByName(fileName: string) {
   if (fs.existsSync(fileName)) {
@@ -36,91 +39,6 @@ export function getLastModifyFilePath(dir: string) {
   return filePath;
 }
 
-export function createRandomString(min: number, max: number): string {
-  const num = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
-  const english = [
-    'a',
-    'b',
-    'c',
-    'd',
-    'e',
-    'f',
-    'g',
-    'h',
-    'i',
-    'j',
-    'k',
-    'l',
-    'm',
-    'n',
-    'o',
-    'p',
-    'q',
-    'r',
-    's',
-    't',
-    'u',
-    'v',
-    'w',
-    'x',
-    'y',
-    'z',
-  ];
-  const ENGLISH = [
-    'A',
-    'B',
-    'C',
-    'D',
-    'E',
-    'F',
-    'G',
-    'H',
-    'I',
-    'J',
-    'K',
-    'L',
-    'M',
-    'N',
-    'O',
-    'P',
-    'Q',
-    'R',
-    'S',
-    'T',
-    'U',
-    'V',
-    'W',
-    'X',
-    'Y',
-    'Z',
-  ];
-  const special = ['-', '_'];
-  const config = num.concat(english).concat(ENGLISH).concat(special);
-
-  const arr = [];
-  arr.push(getOne(num));
-  arr.push(getOne(english));
-  arr.push(getOne(ENGLISH));
-  arr.push(getOne(special));
-
-  const len = min + Math.floor(Math.random() * (max - min + 1));
-
-  for (let i = 4; i < len; i++) {
-    arr.push(config[Math.floor(Math.random() * config.length)]);
-  }
-
-  const newArr = [];
-  for (let j = 0; j < len; j++) {
-    newArr.push(arr.splice(Math.random() * arr.length, 1)[0]);
-  }
-
-  function getOne(arr: any[]) {
-    return arr[Math.floor(Math.random() * arr.length)];
-  }
-
-  return newArr.join('');
-}
-
 export function getToken(req: any) {
   const { authorization = '' } = req.headers;
   if (authorization && authorization.split(' ')[0] === 'Bearer') {
@@ -307,22 +225,28 @@ interface IFile {
   type: 'directory' | 'file';
   parent: string;
   mtime: number;
+  size?: number;
   children?: IFile[];
 }
 
-export function dirSort(a: IFile, b: IFile) {
-  if (a.type !== b.type) return FileType[a.type] < FileType[b.type] ? -1 : 1;
-  else if (a.mtime !== b.mtime) return a.mtime > b.mtime ? -1 : 1;
+export function dirSort(a: IFile, b: IFile): number {
+  if (a.type !== b.type) {
+    return FileType[a.type] < FileType[b.type] ? -1 : 1
+  } else if (a.mtime !== b.mtime) {
+    return a.mtime > b.mtime ? -1 : 1
+  } else {
+    return 0;
+  }
 }
 
 export function readDirs(
   dir: string,
   baseDir: string = '',
   blacklist: string[] = [],
-) {
+): IFile[] {
   const relativePath = path.relative(baseDir, dir);
   const files = fs.readdirSync(dir);
-  const result: any = files
+  const result: IFile[] = files
     .filter((x) => !blacklist.includes(x))
     .map((file: string) => {
       const subPath = path.join(dir, file);
@@ -344,6 +268,7 @@ export function readDirs(
         isLeaf: true,
         key,
         parent: relativePath,
+        size: stats.size,
         mtime: stats.mtime.getTime(),
       };
     });
@@ -387,28 +312,22 @@ export function emptyDir(path: string) {
   fs.rmdirSync(path);
 }
 
-export function promiseExec(command: string): Promise<string> {
-  return new Promise((resolve, reject) => {
-    exec(
-      command,
-      { maxBuffer: 200 * 1024 * 1024, encoding: 'utf8' },
-      (err, stdout, stderr) => {
-        resolve(stdout || stderr || JSON.stringify(err));
-      },
-    );
-  });
+export async function promiseExec(command: string): Promise<string> {
+  try {
+    const { stderr, stdout } = await promisify(exec)(command, { maxBuffer: 200 * 1024 * 1024, encoding: 'utf8' });
+    return stdout || stderr;
+  } catch (error) {
+    return JSON.stringify(error);
+  }
 }
 
-export function promiseExecSuccess(command: string): Promise<string> {
-  return new Promise((resolve) => {
-    exec(
-      command,
-      { maxBuffer: 200 * 1024 * 1024, encoding: 'utf8' },
-      (err, stdout, stderr) => {
-        resolve(stdout || '');
-      },
-    );
-  });
+export async function promiseExecSuccess(command: string): Promise<string> {
+  try {
+    const { stdout } = await promisify(exec)(command, { maxBuffer: 200 * 1024 * 1024, encoding: 'utf8' });
+    return stdout || '';
+  } catch (error) {
+    return '';
+  }
 }
 
 export function parseHeaders(headers: string) {
@@ -501,7 +420,7 @@ export async function killTask(pid: number) {
       [pid, ...pids].forEach((x) => {
         process.kill(x, 2);
       });
-    } catch (error) {}
+    } catch (error) { }
   } else {
     process.kill(pid, 2);
   }
@@ -528,11 +447,8 @@ export async function parseContentVersion(content: string): Promise<IVersion> {
   return load(content) as IVersion;
 }
 
-export async function getUniqPath(command: string): Promise<string> {
-  const idStr = `cat ${config.crontabFile} | grep -E "${command}" | perl -pe "s|.*ID=(.*) ${command}.*|\\1|" | head -1 | awk -F " " '{print $1}' | xargs echo -n`;
-  let id = await promiseExec(idStr);
-
-  if (/^\d\d*\d$/.test(id)) {
+export async function getUniqPath(command: string, id: string): Promise<string> {
+  if (/^\d+$/.test(id)) {
     id = `_${id}`;
   } else {
     id = '';
@@ -564,3 +480,16 @@ export async function getUniqPath(command: string): Promise<string> {
 
   return `${str}${id}`;
 }
+
+export function safeJSONParse(value?: string) {
+  if (!value) {
+    return {};
+  }
+
+  try {
+    return JSON.parse(value);
+  } catch (error) {
+    Logger.error('[JSON.parse失败]', error)
+    return {};
+  }
+}

back/data/auth.ts

@@ -39,12 +39,14 @@ export interface LoginLogInfo {
   address?: string;
   ip?: string;
   platform?: string;
-  status?: LoginStatus,
+  status?: LoginStatus;
 }
 
-export type AuthModelInfo = SystemConfigInfo & Partial<NotificationInfo> & LoginLogInfo;
+export type AuthModelInfo = SystemConfigInfo &
+  Partial<NotificationInfo> &
+  LoginLogInfo;
 
-export interface AuthInstance extends Model<AuthInfo, AuthInfo>, AuthInfo { }
+export interface AuthInstance extends Model<AuthInfo, AuthInfo>, AuthInfo {}
 export const AuthModel = sequelize.define<AuthInstance>('Auth', {
   ip: DataTypes.STRING,
   type: DataTypes.STRING,

back/data/cron.ts

@@ -21,7 +21,7 @@ export class Crontab {
 
   constructor(options: Crontab) {
     this.name = options.name;
-    this.command = options.command;
+    this.command = options.command.trim();
     this.schedule = options.schedule;
     this.saved = options.saved;
     this.id = options.id;

back/data/dependence.ts

@@ -43,13 +43,13 @@ export enum DependenceTypes {
 export enum InstallDependenceCommandTypes {
   'pnpm add -g',
   'pip3 install --disable-pip-version-check --root-user-action=ignore',
-  'apk add',
+  'apk add --no-check-certificate',
 }
 
 export enum GetDependenceCommandTypes {
   'pnpm ls -g ',
-  'pip3 list --disable-pip-version-check',
-  'apk info',
+  'pip3 show --disable-pip-version-check',
+  'apk info -es',
 }
 
 export enum versionDependenceCommandTypes {
@@ -66,7 +66,7 @@ export enum unInstallDependenceCommandTypes {
 
 export interface DependenceInstance
   extends Model<Dependence, Dependence>,
-  Dependence { }
+    Dependence {}
 export const DependenceModel = sequelize.define<DependenceInstance>(
   'Dependence',
   {

back/data/notify.ts

@@ -15,6 +15,7 @@ export enum NotificationMode {
   'iGot' = 'iGot',
   'pushPlus' = 'pushPlus',
   'email' = 'email',
+  'pushMe' = 'pushMe',
   'feishu' = 'feishu',
   'webhook' = 'webhook',
 }
@@ -101,6 +102,10 @@ export class EmailNotification extends NotificationBaseInfo {
   public emailPass: string = '';
 }
 
+export class PushMeNotification extends NotificationBaseInfo {
+  public pushMeKey: string = '';
+}
+
 export class WebhookNotification extends NotificationBaseInfo {
   public webhookHeaders: string = '';
   public webhookBody: string = '';
@@ -131,5 +136,6 @@ export interface NotificationInfo
     IGotNotification,
     PushPlusNotification,
     EmailNotification,
+    PushMeNotification,
     WebhookNotification,
     LarkNotification {}

back/loaders/app.ts

@@ -7,18 +7,28 @@ import linkDeps from './deps';
 import initTask from './initTask';
 
 export default async ({ expressApp }: { expressApp: Application }) => {
-  await depInjectorLoader();
-  Logger.info('✌️ Dependency Injector loaded');
-
-  await expressLoader({ app: expressApp });
-  Logger.info('✌️ Express loaded');
-
-  await initData();
-  Logger.info('✌️ init data loaded');
-
-  await linkDeps();
-  Logger.info('✌️ link deps loaded');
-
-  initTask();
-  Logger.info('✌️ init task loaded');
+  try {
+    depInjectorLoader();
+    Logger.info('✌️ Dependency Injector loaded');
+    console.log('✌️ Dependency Injector loaded');
+  
+    expressLoader({ app: expressApp });
+    Logger.info('✌️ Express loaded');
+    console.log('✌️ Express loaded');
+  
+    await initData();
+    Logger.info('✌️ init data loaded');
+    console.log('✌️ init data loaded');
+  
+    await linkDeps();
+    Logger.info('✌️ link deps loaded');
+    console.log('✌️ link deps loaded');
+  
+    initTask();
+    Logger.info('✌️ init task loaded');
+    console.log('✌️ init task loaded');
+  } catch (error) {
+    Logger.error(`✌️ depInjectorLoader expressLoader initData linkDeps failed, ${error}`);
+    console.error(`✌️ depInjectorLoader expressLoader initData linkDeps failed ${error}`);
+  }
 };

back/loaders/db.ts

@@ -122,9 +122,10 @@ export default async () => {
       });
     }
 
+    console.log('✌️ DB loaded');
     Logger.info('✌️ DB loaded');
   } catch (error) {
-    Logger.info('✌️ DB load failed');
-    Logger.info(error);
+    console.error('✌️ DB load failed');
+    Logger.error(error);
   }
 };

back/loaders/deps.ts

@@ -37,7 +37,7 @@ async function linkCommand() {
     if (fs.existsSync(target)) {
       fs.unlinkSync(target);
     }
-    fs.symlink(source, target, (err) => {});
+    fs.symlink(source, target, (err) => { });
   }
 }
 

back/loaders/express.ts

@@ -5,7 +5,7 @@ import routes from '../api';
 import config from '../config';
 import jwt, { UnauthorizedError } from 'express-jwt';
 import fs from 'fs';
-import { getPlatform, getToken } from '../config/util';
+import { getPlatform, getToken, safeJSONParse } from '../config/util';
 import Container from 'typedi';
 import OpenService from '../services/open';
 import rewrite from 'express-urlrewrite';
@@ -15,6 +15,7 @@ import { EnvModel } from '../data/env';
 import { errors } from 'celebrate';
 import { createProxyMiddleware } from 'http-proxy-middleware';
 import { serveEnv } from '../config/serverEnv';
+import Logger from './logger';
 
 export default ({ app }: { app: Application }) => {
   app.enable('trust proxy');
@@ -25,9 +26,10 @@ export default ({ app }: { app: Application }) => {
   app.use(
     '/api/public',
     createProxyMiddleware({
-      target: `http://localhost:${config.publicPort}/api`,
+      target: `http://0.0.0.0:${config.publicPort}/api`,
       changeOrigin: true,
       pathRewrite: { '/api/public': '' },
+      logProvider: () => Logger
     }),
   );
 
@@ -36,7 +38,7 @@ export default ({ app }: { app: Application }) => {
 
   app.use(
     jwt({
-      secret: config.secret as string,
+      secret: config.secret,
       algorithms: ['HS384'],
     }).unless({
       path: [...config.apiWhiteList, /^\/open\//],
@@ -83,7 +85,7 @@ export default ({ app }: { app: Application }) => {
 
     const data = fs.readFileSync(config.authConfigFile, 'utf8');
     if (data && headerToken) {
-      const { token = '', tokens = {} } = JSON.parse(data);
+      const { token = '', tokens = {} } = safeJSONParse(data);
       if (headerToken === token || tokens[req.platform] === headerToken) {
         return next();
       }

back/loaders/initData.ts

@@ -30,15 +30,15 @@ export default async () => {
   });
 
   // 初始化更新所有任务状态为空闲
-  await CrontabModel.update(
-    { status: CrontabStatus.idle },
-    { where: {} },
-  );
+  await CrontabModel.update({ status: CrontabStatus.idle }, { where: {} });
 
   // 初始化时安装所有处于安装中，安装成功，安装失败的依赖
   DependenceModel.findAll({
     where: {},
-    order: [['type', 'DESC']],
+    order: [
+      ['type', 'DESC'],
+      ['createdAt', 'DESC'],
+    ],
     raw: true,
   }).then(async (docs) => {
     await DependenceModel.update(

back/loaders/initFile.ts

@@ -5,7 +5,7 @@ import dotenv from 'dotenv';
 import Logger from './logger';
 import { fileExist } from '../config/util';
 
-const rootPath = process.env.QL_DIR as string;;
+const rootPath = process.env.QL_DIR as string;
 const dataPath = path.join(rootPath, 'data/');
 const configPath = path.join(dataPath, 'config/');
 const scriptPath = path.join(dataPath, 'scripts/');
@@ -28,6 +28,7 @@ const TaskAfterFile = path.join(configPath, 'task_after.sh');
 const homedir = os.homedir();
 const sshPath = path.resolve(homedir, '.ssh');
 const sshdPath = path.join(dataPath, 'ssh.d');
+const systemLogPath = path.join(dataPath, 'syslog');
 
 export default async () => {
   const authFileExist = await fileExist(authConfigFile);
@@ -39,6 +40,7 @@ export default async () => {
   const sshDirExist = await fileExist(sshPath);
   const bakDirExist = await fileExist(bakPath);
   const sshdDirExist = await fileExist(sshdPath);
+  const systemLogDirExist = await fileExist(systemLogPath);
   const tmpDirExist = await fileExist(tmpPath);
   const scriptNotifyJsFileExist = await fileExist(scriptNotifyJsFile);
   const scriptNotifyPyFileExist = await fileExist(scriptNotifyPyFile);
@@ -77,6 +79,10 @@ export default async () => {
     fs.mkdirSync(sshdPath);
   }
 
+  if (!systemLogDirExist) {
+    fs.mkdirSync(systemLogPath);
+  }
+
   // 初始化文件
   if (!authFileExist) {
     fs.writeFileSync(authConfigFile, fs.readFileSync(sampleAuthFile));
@@ -105,4 +111,5 @@ export default async () => {
   dotenv.config({ path: confFile });
 
   Logger.info('✌️ Init file down');
+  console.log('✌️ Init file down');
 };

back/loaders/logger.ts

@@ -1,32 +1,38 @@
 import winston from 'winston';
+import 'winston-daily-rotate-file';
 import config from '../config';
+import path from 'path';
 
-const transports = [];
-if (process.env.NODE_ENV !== 'development') {
-  transports.push(new winston.transports.Console());
-} else {
-  transports.push(
-    new winston.transports.Console({
-      format: winston.format.combine(
-        winston.format.cli(),
-        winston.format.splat(),
-      ),
-    }),
-  );
+const levelMap: Record<string, string> = {
+  info: '🔵',
+  warn: '🟡',
+  error: '🔴',
+  debug: '🔶'
 }
 
+const customFormat = winston.format.combine(
+  winston.format.splat(),
+  winston.format.timestamp({ format: "YYYY-MM-DD HH:mm:ss" }),
+  winston.format.align(),
+  winston.format.printf((i) => `[${levelMap[i.level]}${i.level}] [${[i.timestamp]}]: ${i.message}`),
+);
+
+const defaultOptions = {
+  format: customFormat,
+  datePattern: "YYYY-MM-DD",
+  maxSize: "20m",
+  maxFiles: "7d",
+};
+
 const LoggerInstance = winston.createLogger({
   level: config.logs.level,
   levels: winston.config.npm.levels,
-  format: winston.format.combine(
-    winston.format.timestamp({
-      format: 'YYYY-MM-DD HH:mm:ss',
-    }),
-    winston.format.errors({ stack: true }),
-    winston.format.splat(),
-    winston.format.json(),
-  ),
-  transports,
+  transports: [
+    new winston.transports.DailyRotateFile({
+      filename: path.join(config.systemLogPath, '%DATE%.log'),
+      ...defaultOptions,
+    })
+  ],
 });
 
 export default LoggerInstance;

back/loaders/sentry.ts

@@ -29,4 +29,5 @@ export default async ({ expressApp }: { expressApp: Application }) => {
   expressApp.use(Sentry.Handlers.tracingHandler());
 
   Logger.info('✌️ Sentry loaded');
+  console.log('✌️ Sentry loaded');
 };

back/loaders/server.ts

@@ -10,9 +10,11 @@ export default async ({ server }: { server: Server }) => {
 
   process.on('SIGINT', (singal) => {
     Logger.warn(`Server need close, singal ${singal}`);
+    console.warn(`Server need close, singal ${singal}`);
     exitTime++;
     if (exitTime >= 3) {
       Logger.warn('Forcing server close');
+      console.warn('Forcing server close');
       clearTimeout(timer);
       process.exit(1);
     }
@@ -28,11 +30,13 @@ export default async ({ server }: { server: Server }) => {
 
   process.on('uncaughtException', (error) => {
     Logger.error('Uncaught exception:', error);
+    console.error('Uncaught exception:', error);
     process.exit(1);
   });
-  
+
   process.on('unhandledRejection', (reason, promise) => {
-    Logger.error('Unhandled rejection:', reason);
+    Logger.error('Unhandled rejection:', reason, promise);
+    console.error('Unhandled rejection:', reason, promise);
     process.exit(1);
   });
 };

back/loaders/sock.ts

@@ -5,7 +5,7 @@ import { Container } from 'typedi';
 import SockService from '../services/sock';
 import config from '../config/index';
 import fs from 'fs';
-import { getPlatform } from '../config/util';
+import { getPlatform, safeJSONParse } from '../config/util';
 
 export default async ({ server }: { server: Server }) => {
   const echo = sockJs.createServer({ prefix: '/api/ws', log: () => {} });
@@ -20,7 +20,7 @@ export default async ({ server }: { server: Server }) => {
     const platform = getPlatform(conn.headers['user-agent'] || '') || 'desktop';
     const headerToken = conn.url.replace(`${conn.pathname}?token=`, '');
     if (data) {
-      const { token = '', tokens = {} } = JSON.parse(data);
+      const { token = '', tokens = {} } = safeJSONParse(data);
       if (headerToken === token || tokens[platform] === headerToken) {
         conn.write(JSON.stringify({ type: 'ping', message: 'hanhh' }));
         sockService.addClient(conn);

back/public.ts

@@ -6,14 +6,14 @@ import { credentials } from '@grpc/grpc-js';
 
 const app = express();
 const client = new HealthClient(
-  `localhost:${config.cronPort}`,
+  `0.0.0.0:${config.cronPort}`,
   credentials.createInsecure(),
 );
 
 app.get('/api/health', (req, res) => {
   client.check({ service: 'cron' }, (err, response) => {
     if (err) {
-      return res.status(500).send({ code: 500, error: err });
+      return res.status(200).send({ code: 500, error: err });
     }
     return res.status(200).send({ code: 200, data: response });
   });
@@ -25,9 +25,11 @@ app
     await require('./loaders/db').default();
 
     Logger.debug(`✌️ 公共服务启动成功！`);
+    console.debug(`✌️ 公共服务启动成功！`);
     process.send?.('ready');
   })
   .on('error', (err) => {
     Logger.error(err);
+    console.error(err);
     process.exit(1);
   });

back/schedule/addCron.ts

@@ -3,6 +3,9 @@ import { AddCronRequest, AddCronResponse } from '../protos/cron';
 import nodeSchedule from 'node-schedule';
 import { scheduleStacks } from './data';
 import { runCron } from '../shared/runCron';
+import { QL_PREFIX, TASK_PREFIX } from '../config/const';
+import Logger from '../loaders/logger';
+import dayjs from 'dayjs';
 
 const addCron = (
   call: ServerUnaryCall<AddCronRequest, AddCronResponse>,
@@ -13,10 +16,26 @@ const addCron = (
     if (scheduleStacks.has(id)) {
       scheduleStacks.get(id)?.cancel();
     }
+
+    let cmdStr = command.trim();
+    if (!cmdStr.startsWith(TASK_PREFIX) && !cmdStr.startsWith(QL_PREFIX)) {
+      cmdStr = `${TASK_PREFIX}${cmdStr}`;
+    }
+
+    Logger.info(
+      '[schedule][创建定时任务], 任务ID: %s, cron: %s, 执行命令: %s',
+      id,
+      schedule,
+      command,
+    );
+
     scheduleStacks.set(
       id,
       nodeSchedule.scheduleJob(id, schedule, async () => {
-        runCron(`ID=${id} ${command}`)
+        Logger.info(
+          `[schedule][准备运行任务] 命令: ${cmdStr}`,
+        );
+        runCron(`ID=${id} ${cmdStr}`);
       }),
     );
   }

back/schedule/client.ts

@@ -10,7 +10,7 @@ import config from '../config';
 
 class Client {
   private client = new CronClient(
-    `localhost:${config.cronPort}`,
+    `0.0.0.0:${config.cronPort}`,
     credentials.createInsecure(),
   );
 

back/schedule/delCron.ts

@@ -1,6 +1,7 @@
 import { ServerUnaryCall, sendUnaryData } from '@grpc/grpc-js';
 import { DeleteCronRequest, DeleteCronResponse } from '../protos/cron';
 import { scheduleStacks } from './data';
+import Logger from '../loaders/logger';
 
 const delCron = (
   call: ServerUnaryCall<DeleteCronRequest, DeleteCronResponse>,
@@ -8,6 +9,10 @@ const delCron = (
 ) => {
   for (const id of call.request.ids) {
     if (scheduleStacks.has(id)) {
+      Logger.info(
+        '[schedule][取消定时任务], 任务ID: %s',
+        id,
+      );
       scheduleStacks.get(id)?.cancel();
       scheduleStacks.delete(id);
     }

back/schedule/health.ts

@@ -10,7 +10,7 @@ const check = async (
   switch (call.request.service) {
     case 'cron':
       const res = await promiseExec(
-        `curl -s http://localhost:${config.port}/api/system`,
+        `curl -s http://0.0.0.0:${config.port}/api/system`,
       );
 
       if (res.includes('200')) {
@@ -24,7 +24,7 @@ const check = async (
         `tail -n 300 ~/.pm2/logs/schedule-error.log`,
       );
       return callback(
-        new Error(`${scheduleErrLog || ''}\n${panelErrLog || ''}\n${res}`),
+        new Error(`${scheduleErrLog || ''}\n${panelErrLog || ''}\n${res}`.trim()),
       );
 
     default:

back/schedule/index.ts

@@ -11,7 +11,7 @@ const server = new Server();
 server.addService(HealthService, { check });
 server.addService(CronService, { addCron, delCron });
 server.bindAsync(
-  `localhost:${config.cronPort}`,
+  `0.0.0.0:${config.cronPort}`,
   ServerCredentials.createInsecure(),
   (err, port) => {
     if (err) {
@@ -19,6 +19,7 @@ server.bindAsync(
     }
     server.start();
     Logger.debug(`✌️ 定时服务启动成功！`);
+    console.debug(`✌️ 定时服务启动成功！`);
     process.send?.('ready');
   },
 );

back/services/cron.ts

@@ -5,11 +5,7 @@ import { Crontab, CrontabModel, CrontabStatus } from '../data/cron';
 import { exec, execSync } from 'child_process';
 import fs from 'fs';
 import cron_parser from 'cron-parser';
-import {
-  getFileContentByName,
-  fileExist,
-  killTask,
-} from '../config/util';
+import { getFileContentByName, fileExist, killTask, getUniqPath, safeJSONParse } from '../config/util';
 import { promises, existsSync } from 'fs';
 import { Op, where, col as colFn, FindOptions, fn } from 'sequelize';
 import path from 'path';
@@ -17,6 +13,7 @@ import { TASK_PREFIX, QL_PREFIX } from '../config/const';
 import cronClient from '../schedule/client';
 import taskLimit from '../shared/pLimit';
 import { spawn } from 'cross-spawn';
+import dayjs from 'dayjs';
 
 @Service()
 export default class CronService {
@@ -24,7 +21,7 @@ export default class CronService {
 
   private isSixCron(cron: Crontab) {
     const { schedule } = cron;
-    if (schedule?.split(/ +/).length === 6) {
+    if (Number(schedule?.split(/ +/).length) > 5) {
       return true;
     }
     return false;
@@ -165,7 +162,7 @@ export default class CronService {
           case 'In':
             q[Op.or] = [
               {
-                [property]: value,
+                [property]: Array.isArray(value) ? value : [value],
               },
               property === 'status' && value.includes(2)
                 ? { isDisabled: 1 }
@@ -176,7 +173,7 @@ export default class CronService {
             q[Op.and] = [
               {
                 [property]: {
-                  [Op.notIn]: value,
+                  [Op.notIn]: Array.isArray(value) ? value : [value],
                 },
               },
               property === 'status' && value.includes(2)
@@ -312,9 +309,9 @@ export default class CronService {
     const searchText = params?.searchValue;
     const page = Number(params?.page || '0');
     const size = Number(params?.size || '0');
-    const viewQuery = JSON.parse(params?.queryString || '{}');
-    const filterQuery = JSON.parse(params?.filters || '{}');
-    const sorterQuery = JSON.parse(params?.sorter || '{}');
+    const viewQuery = safeJSONParse(params?.queryString);
+    const filterQuery = safeJSONParse(params?.filters);
+    const sorterQuery = safeJSONParse(params?.sorter);
 
     let query: any = {};
     let order = [
@@ -374,7 +371,7 @@ export default class CronService {
         try {
           await killTask(doc.pid);
         } catch (error) {
-          this.logger.silly(error);
+          this.logger.error(error);
         }
       }
     }
@@ -395,8 +392,14 @@ export default class CronService {
         }
 
         let { id, command, log_path } = cron;
-        const absolutePath = path.resolve(config.logPath, `${log_path}`);
-        const logFileExist = log_path && (await fileExist(absolutePath));
+        const uniqPath = await getUniqPath(command, `${id}`);
+        const logTime = dayjs().format('YYYY-MM-DD-HH-mm-ss-SSS');
+        const logDirPath = path.resolve(config.logPath, `${uniqPath}`);
+        if (log_path?.split('/')?.every(x => x !== uniqPath)) {
+          fs.mkdirSync(logDirPath, { recursive: true });
+        }
+        const logPath = `${uniqPath}/${logTime}.log`;
+        const absolutePath = path.resolve(config.logPath, `${logPath}`);
 
         this.logger.silly('Running job');
         this.logger.silly('ID: ' + id);
@@ -416,26 +419,22 @@ export default class CronService {
           cmdStr = `${cmdStr} now`;
         }
 
-        const cp = spawn(`ID=${id} ${cmdStr}`, { shell: '/bin/bash' });
+        const cp = spawn(`real_log_path=${logPath} ID=${id} ${cmdStr}`, { shell: '/bin/bash' });
 
         await CrontabModel.update(
-          { status: CrontabStatus.running, pid: cp.pid },
+          { status: CrontabStatus.running, pid: cp.pid, log_path: logPath },
           { where: { id } },
         );
         cp.stderr.on('data', (data) => {
-          if (logFileExist) {
-            fs.appendFileSync(`${absolutePath}`, `${data.toString()}`);
-          }
+          fs.appendFileSync(`${absolutePath}`, `${data.toString()}`);
         });
         cp.on('error', (err) => {
-          if (logFileExist) {
-            fs.appendFileSync(`${absolutePath}`, `${JSON.stringify(err)}`);
-          }
+          fs.appendFileSync(`${absolutePath}`, `${JSON.stringify(err)}`);
         });
 
         cp.on('exit', async (code, signal) => {
           this.logger.info(
-            `任务 ${command} 进程id: ${cp.pid} 退出，退出码 ${code}`,
+            `[panel][任务退出] 任务 ${command} 进程id: ${cp.pid}, 退出码 ${code}`,
           );
         });
         cp.on('close', async (code) => {
@@ -507,13 +506,11 @@ export default class CronService {
   }
 
   private make_command(tab: Crontab) {
-    if (
-      !tab.command.startsWith(TASK_PREFIX) &&
-      !tab.command.startsWith(QL_PREFIX)
-    ) {
-      tab.command = `${TASK_PREFIX}${tab.command}`;
+    let command = tab.command.trim();
+    if (!command.startsWith(TASK_PREFIX) && !command.startsWith(QL_PREFIX)) {
+      command = `${TASK_PREFIX}${tab.command}`;
     }
-    const crontab_job_string = `ID=${tab.id} ${tab.command}`;
+    const crontab_job_string = `ID=${tab.id} ${command}`;
     return crontab_job_string;
   }
 
@@ -536,7 +533,6 @@ export default class CronService {
       }
     });
 
-    this.logger.silly(crontab_string);
     fs.writeFileSync(config.crontabFile, crontab_string);
 
     execSync(`crontab ${config.crontabFile}`);

back/services/cronView.ts

@@ -32,7 +32,7 @@ export default class CronViewService {
   }
 
   public async update(payload: CrontabView): Promise<CrontabView> {
-    const doc = await this.getDb({ id: payload.id })
+    const doc = await this.getDb({ id: payload.id });
     const tab = new CrontabView({ ...doc, ...payload });
     const newDoc = await this.updateDb(tab);
     return newDoc;
@@ -59,7 +59,9 @@ export default class CronViewService {
     }
   }
 
-  public async getDb(query: FindOptions<CrontabView>['where']): Promise<CrontabView> {
+  public async getDb(
+    query: FindOptions<CrontabView>['where'],
+  ): Promise<CrontabView> {
     const doc: any = await CrontabViewModel.findOne({ where: { ...query } });
     return doc && (doc.get({ plain: true }) as CrontabView);
   }

back/services/dependence.ts

@@ -168,7 +168,7 @@ export default class DependenceService {
         const socketMessageType = isInstall
           ? 'installDependence'
           : 'uninstallDependence';
-        const depName = dependency.name.trim();
+        let depName = dependency.name.trim();
         const depRunCommand = (
           isInstall
             ? InstallDependenceCommandTypes
@@ -191,18 +191,41 @@ export default class DependenceService {
         if (isInstall) {
           const getCommandPrefix = GetDependenceCommandTypes[dependency.type];
           const depVersionStr = versionDependenceCommandTypes[dependency.type];
-          const [_depName] = dependency.name.trim().split(depVersionStr);
+          let depVersion = '';
+          if (depName.includes(depVersionStr)) {
+            const symbolRegx = new RegExp(
+              `(.*)${depVersionStr}([0-9\\.\\-\\+a-zA-Z]*)`,
+            );
+            const [, _depName, _depVersion] = depName.match(symbolRegx) || [];
+            if (_depVersion && _depName) {
+              depName = _depName;
+              depVersion = _depVersion;
+            }
+          }
+          const isNodeDependence = dependency.type === DependenceTypes.nodejs;
+          const isLinuxDependence = dependency.type === DependenceTypes.linux;
+          const isPythonDependence =
+            dependency.type === DependenceTypes.python3;
           const depInfo = (
             await promiseExecSuccess(
-              dependency.type === DependenceTypes.linux
-                ? `${getCommandPrefix} ${_depName}`
-                : `${getCommandPrefix} | grep "${_depName}"`,
+              isNodeDependence
+                ? `${getCommandPrefix} | grep "${depName}" | head -1`
+                : `${getCommandPrefix} ${depName}`,
             )
-          ).replace(/\s{2,}/, ' ');
+          )
+            .replace(/\s{2,}/, ' ')
+            .replace(/\s+$/, '');
 
-          if (depInfo) {
+          if (
+            depInfo &&
+            ((isNodeDependence && depInfo.split(' ')?.[0] === depName) ||
+              (isLinuxDependence &&
+                depInfo.toLocaleLowerCase().includes('installed')) ||
+              isPythonDependence) &&
+            (!depVersion || depInfo.includes(depVersion))
+          ) {
             const endTime = dayjs();
-            const _message = `检测到已经安装 ${_depName}\n\n${depInfo}\n跳过安装\n\n依赖${actionText}成功，结束时间 ${endTime.format(
+            const _message = `检测到已经安装 ${depName}\n\n${depInfo}\n\n跳过安装\n\n依赖${actionText}成功，结束时间 ${endTime.format(
               'YYYY-MM-DD HH:mm:ss',
             )}，耗时 ${endTime.diff(startTime, 'second')} 秒`;
             this.sockService.sendMessage({
@@ -219,7 +242,7 @@ export default class DependenceService {
           }
         }
 
-        const cp = spawn(`${depRunCommand} ${depName}`, {
+        const cp = spawn(`${depRunCommand} ${dependency.name.trim()}`, {
           shell: '/bin/bash',
         });
 

back/services/env.ts

@@ -202,11 +202,9 @@ export default class EnvService {
           let value = group
             .map((x) => x.value)
             .join('&')
-            .replace(/(\\)[^n]/g, '\\\\')
-            .replace(/(\\$)/, '\\\\')
-            .replace(/"/g, '\\"')
+            .replace(/'/g, "'\\''")
             .trim();
-          env_string += `export ${key}="${value}"\n`;
+          env_string += `export ${key}='${value}'\n`;
         }
       }
     }

back/services/notify.ts

@@ -28,6 +28,7 @@ export default class NotificationService {
     ['iGot', this.iGot],
     ['pushPlus', this.pushPlus],
     ['email', this.email],
+    ['pushMe', this.pushMe],
     ['webhook', this.webhook],
     ['lark', this.lark],
   ]);
@@ -303,7 +304,8 @@ export default class NotificationService {
   }
 
   private async weWorkBot() {
-    const { weWorkBotKey, weWorkOrigin = 'https://qyapi.weixin.qq.com' } = this.params;
+    const { weWorkBotKey, weWorkOrigin = 'https://qyapi.weixin.qq.com' } =
+      this.params;
     const url = `${weWorkOrigin}/cgi-bin/webhook/send?key=${weWorkBotKey}`;
     try {
       const res: any = await got
@@ -328,7 +330,8 @@ export default class NotificationService {
   }
 
   private async weWorkApp() {
-    const { weWorkAppKey, weWorkOrigin = 'https://qyapi.weixin.qq.com' } = this.params;
+    const { weWorkAppKey, weWorkOrigin = 'https://qyapi.weixin.qq.com' } =
+      this.params;
     const [corpid, corpsecret, touser, agentid, thumb_media_id = '1'] =
       weWorkAppKey.split(',');
     const url = `${weWorkOrigin}/cgi-bin/gettoken`;
@@ -561,6 +564,30 @@ export default class NotificationService {
     }
   }
 
+  private async pushMe() {
+    const { pushMeKey } = this.params;
+    try {
+      const res: any = await got.post(
+        `https://push.i-i.me/?push_key=${pushMeKey}`,
+        {
+          ...this.gotOption,
+          json: {
+            title: this.title,
+            content: this.content,
+          },
+          headers: { 'Content-Type': 'application/json' },
+        },
+      );
+      if (res.body === 'success') {
+        return true;
+      } else {
+        throw new Error(res.body);
+      }
+    } catch (error: any) {
+      throw new Error(error.response ? error.response.body : error);
+    }
+  }
+
   private async webhook() {
     const {
       webhookUrl,

back/services/schedule.ts

@@ -42,7 +42,7 @@ export default class ScheduleService {
 
   private maxBuffer = 200 * 1024 * 1024;
 
-  constructor(@Inject('logger') private logger: winston.Logger) { }
+  constructor(@Inject('logger') private logger: winston.Logger) {}
 
   async runTask(
     command: string,
@@ -66,9 +66,8 @@ export default class ScheduleService {
 
           cp.stderr.on('data', async (data) => {
             this.logger.info(
-              '[执行任务失败] %s，时间：%s, 错误信息：%j',
+              '[panel][执行任务失败] 命令: %s, 错误信息: %j',
               command,
-              new Date().toLocaleString(),
               data.toString(),
             );
             await callbacks.onError?.(data.toString());
@@ -76,9 +75,8 @@ export default class ScheduleService {
 
           cp.on('error', async (err) => {
             this.logger.error(
-              '[创建任务失败] %s，时间：%s, 错误信息：%j',
+              '[panel][创建任务失败] 命令: %s, 错误信息: %j',
               command,
-              new Date().toLocaleString(),
               err,
             );
             await callbacks.onError?.(JSON.stringify(err));
@@ -86,7 +84,7 @@ export default class ScheduleService {
 
           cp.on('exit', async (code, signal) => {
             this.logger.info(
-              `[任务退出] ${command} 进程id: ${cp.pid}，退出码 ${code}`,
+              `[panel][任务退出] ${command} 进程id: ${cp.pid}, 退出码 ${code}`,
             );
           });
 
@@ -100,16 +98,15 @@ export default class ScheduleService {
             resolve(null);
           });
         } catch (error) {
-          await this.logger.error(
-            '执行任务%s失败，时间：%s, 错误信息：%j',
+          this.logger.error(
+            '[panel][执行任务失败] 命令: %s, 错误信息: %j',
             command,
-            new Date().toLocaleString(),
             error,
           );
           await callbacks.onError?.(JSON.stringify(error));
         }
       });
-    })
+    });
   }
 
   async createCronTask(
@@ -119,7 +116,7 @@ export default class ScheduleService {
   ) {
     const _id = this.formatId(id);
     this.logger.info(
-      '[创建cron任务]，任务ID: %s，cron: %s，任务名: %s，执行命令: %s',
+      '[panel][创建cron任务], 任务ID: %s, cron: %s, 任务名: %s, 执行命令: %s',
       _id,
       schedule,
       name,
@@ -140,7 +137,7 @@ export default class ScheduleService {
 
   async cancelCronTask({ id = 0, name }: ScheduleTaskType) {
     const _id = this.formatId(id);
-    this.logger.info('[取消定时任务]，任务名：%s', name);
+    this.logger.info('[panel][取消定时任务], 任务名: %s', name);
     if (this.scheduleStacks.has(_id)) {
       this.scheduleStacks.get(_id)?.cancel();
       this.scheduleStacks.delete(_id);
@@ -155,7 +152,7 @@ export default class ScheduleService {
   ) {
     const _id = this.formatId(id);
     this.logger.info(
-      '[创建interval任务]，任务ID: %s，任务名: %s，执行命令: %s',
+      '[panel][创建interval任务], 任务ID: %s, 任务名: %s, 执行命令: %s',
       _id,
       name,
       command,
@@ -167,9 +164,8 @@ export default class ScheduleService {
       },
       (err) => {
         this.logger.error(
-          '执行任务%s失败，时间：%s, 错误信息：%j',
+          '[执行任务失败] 命令: %s, 错误信息: %j',
           command,
-          new Date().toLocaleString(),
           err,
         );
       },
@@ -190,7 +186,7 @@ export default class ScheduleService {
 
   async cancelIntervalTask({ id = 0, name }: ScheduleTaskType) {
     const _id = this.formatId(id);
-    this.logger.info('[取消interval任务]，任务ID: %s，任务名：%s', _id, name);
+    this.logger.info('[取消interval任务], 任务ID: %s, 任务名: %s', _id, name);
     this.intervalSchedule.removeById(_id);
   }
 

back/services/script.ts

@@ -53,10 +53,9 @@ export default class ScriptService {
   }
 
   public async stopScript(filePath: string, pid: number) {
-    let str = '';
     if (!pid) {
       const relativePath = path.relative(config.scriptPath, filePath);
-      pid = await getPid(`${TASK_COMMAND} -l ${relativePath} now`);
+      pid = await getPid(`${TASK_COMMAND} -l ${relativePath} now`) as number;
     }
     try {
       await killTask(pid);

back/services/sshKey.ts

@@ -58,7 +58,7 @@ export default class SshKeyService {
 
   private generateSingleSshConfig(alias: string, host: string, proxy?: string) {
     if (host === 'github.com') {
-      host = `ssh.github.com\n    Port 443\n    HostkeyAlgorithms +ssh-rsa\n    PubkeyAcceptedAlgorithms +ssh-rsa`;
+      host = `ssh.github.com\n    Port 443\n    HostkeyAlgorithms +ssh-rsa`;
     }
     const proxyStr = proxy
       ? `    ProxyCommand nc -v -x ${proxy} %h %p 2>/dev/null\n`

back/services/subscription.ts

@@ -16,10 +16,11 @@ import {
   killTask,
   handleLogPath,
   promiseExec,
+  emptyDir,
 } from '../config/util';
 import { promises, existsSync } from 'fs';
 import { FindOptions, Op } from 'sequelize';
-import path from 'path';
+import path, { join } from 'path';
 import ScheduleService, { TaskCallbacks } from './schedule';
 import { SimpleIntervalSchedule } from 'toad-scheduler';
 import SockService from './sock';
@@ -27,6 +28,8 @@ import SshKeyService from './sshKey';
 import dayjs from 'dayjs';
 import { LOG_END_SYMBOL } from '../config/const';
 import { formatCommand, formatUrl } from '../config/subscription';
+import { CrontabModel } from '../data/cron';
+import CrontabService from './cron';
 
 @Service()
 export default class SubscriptionService {
@@ -35,7 +38,8 @@ export default class SubscriptionService {
     private scheduleService: ScheduleService,
     private sockService: SockService,
     private sshKeyService: SshKeyService,
-  ) {}
+    private crontabService: CrontabService,
+  ) { }
 
   public async list(searchText?: string): Promise<Subscription[]> {
     let query = {};
@@ -253,13 +257,24 @@ export default class SubscriptionService {
     );
   }
 
-  public async remove(ids: number[]) {
+  public async remove(ids: number[], query: any) {
     const docs = await SubscriptionModel.findAll({ where: { id: ids } });
     for (const doc of docs) {
       await this.handleTask(doc, false);
     }
     await SubscriptionModel.destroy({ where: { id: ids } });
     await this.setSshConfig();
+
+    if (query?.force === true) {
+      const crons = await CrontabModel.findAll({ where: { sub_id: ids } });
+      if (crons?.length) {
+        await this.crontabService.remove(crons.map(x => x.id!))
+      }
+      for (const doc of docs) {
+        const filePath = join(config.scriptPath, doc.alias);
+        emptyDir(filePath);
+      }
+    }
   }
 
   public async getDb(
@@ -286,17 +301,9 @@ export default class SubscriptionService {
         try {
           await killTask(doc.pid);
         } catch (error) {
-          this.logger.silly(error);
+          this.logger.error(error);
         }
       }
-      const absolutePath = await handleLogPath(doc.log_path as string);
-
-      fs.appendFileSync(
-        `${absolutePath}`,
-        `\n## 执行结束...  ${dayjs().format(
-          'YYYY-MM-DD HH:mm:ss',
-        )}${LOG_END_SYMBOL}`,
-      );
     }
 
     await SubscriptionModel.update(

back/services/system.ts

@@ -21,11 +21,14 @@ import {
   parseContentVersion,
   parseVersion,
   promiseExec,
+  readDirs,
 } from '../config/util';
 import { TASK_COMMAND } from '../config/const';
 import taskLimit from '../shared/pLimit';
 import tar from 'tar';
 import path from 'path';
+import fs from 'fs';
+import { sum } from 'lodash';
 
 @Service()
 export default class SystemService {
@@ -36,7 +39,7 @@ export default class SystemService {
     @Inject('logger') private logger: winston.Logger,
     private scheduleService: ScheduleService,
     private sockService: SockService,
-  ) { }
+  ) {}
 
   public async getSystemConfig() {
     const doc = await this.getDb({ type: AuthDataType.systemConfig });
@@ -111,7 +114,7 @@ export default class SystemService {
           },
         );
         lastVersionContent = await parseContentVersion(result.body);
-      } catch (error) { }
+      } catch (error) {}
 
       if (!lastVersionContent) {
         lastVersionContent = currentVersionContent;
@@ -256,7 +259,10 @@ export default class SystemService {
 
   public async exportData(res: Response) {
     try {
-      await tar.create({ gzip: true, file: config.dataTgzFile, cwd: config.rootPath }, ['data'])
+      await tar.create(
+        { gzip: true, file: config.dataTgzFile, cwd: config.rootPath },
+        ['data'],
+      );
       res.download(config.dataTgzFile);
     } catch (error: any) {
       return res.send({ code: 400, message: error.message });
@@ -272,4 +278,29 @@ export default class SystemService {
       return { code: 400, message: error.message };
     }
   }
+
+  public async getSystemLog(res: Response) {
+    const result = readDirs(config.systemLogPath, config.systemLogPath);
+    const logs = result.reverse().filter((x) => x.title.endsWith('.log'));
+    res.set({
+      'Content-Length': sum(logs.map((x) => x.size)),
+    });
+    (function sendFiles(res, fileNames) {
+      if (fileNames.length === 0) {
+        res.end();
+        return;
+      }
+
+      const currentLog = fileNames.shift();
+      if (currentLog) {
+        const currentFileStream = fs.createReadStream(
+          path.join(config.systemLogPath, currentLog.title),
+        );
+        currentFileStream.on('end', () => {
+          sendFiles(res, fileNames);
+        });
+        currentFileStream.pipe(res, { end: false });
+      }
+    })(res, logs);
+  }
 }

back/services/user.ts

@@ -5,12 +5,19 @@ import {
   fileExist,
   getNetIp,
   getPlatform,
+  safeJSONParse,
 } from '../config/util';
 import config from '../config';
 import * as fs from 'fs';
 import jwt from 'jsonwebtoken';
 import { authenticator } from '@otplib/preset-default';
-import { AuthDataType, AuthInfo, AuthModel, AuthModelInfo, LoginStatus } from '../data/auth';
+import {
+  AuthDataType,
+  AuthInfo,
+  AuthModel,
+  AuthModelInfo,
+  LoginStatus,
+} from '../data/auth';
 import { NotificationInfo } from '../data/notify';
 import NotificationService from './notify';
 import { Request } from 'express';
@@ -27,7 +34,7 @@ export default class UserService {
     @Inject('logger') private logger: winston.Logger,
     private scheduleService: ScheduleService,
     private sockService: SockService,
-  ) { }
+  ) {}
 
   public async login(
     payloads: {
@@ -119,7 +126,8 @@ export default class UserService {
         });
         await this.notificationService.notify(
           '登录通知',
-          `你于${dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')}在 ${address} ${req.platform
+          `你于${dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')}在 ${address} ${
+            req.platform
           }端 登录成功，ip地址 ${ip}`,
         );
         await this.getLoginLog();
@@ -147,7 +155,8 @@ export default class UserService {
         });
         await this.notificationService.notify(
           '登录通知',
-          `你于${dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')}在 ${address} ${req.platform
+          `你于${dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss')}在 ${address} ${
+            req.platform
           }端 登录失败，ip地址 ${ip}`,
         );
         await this.getLoginLog();
@@ -190,7 +199,9 @@ export default class UserService {
       where: { type: AuthDataType.loginLog },
     });
     if (docs && docs.length > 0) {
-      const result = docs.sort((a, b) => b.info!.timestamp! - a.info!.timestamp!);
+      const result = docs.sort(
+        (a, b) => b.info!.timestamp! - a.info!.timestamp!,
+      );
       if (result.length > 100) {
         await AuthModel.destroy({
           where: { id: result[result.length - 1].id },
@@ -317,7 +328,7 @@ export default class UserService {
 
   private getAuthInfo() {
     const content = fs.readFileSync(config.authConfigFile, 'utf8');
-    return JSON.parse(content || '{}');
+    return safeJSONParse(content);
   }
 
   private updateAuthInfo(authInfo: any, info: any) {

back/shared/pLimit.ts

@@ -1,12 +1,22 @@
-import pLimit from "p-limit";
+import pLimit from 'p-limit';
 import os from 'os';
-import { AuthDataType, AuthModel } from "../data/auth";
+import { AuthDataType, AuthModel } from '../data/auth';
+import Logger from '../loaders/logger';
+import dayjs from 'dayjs';
 
 class TaskLimit {
   private oneLimit = pLimit(1);
   private updateLogLimit = pLimit(1);
   private cpuLimit = pLimit(Math.max(os.cpus().length, 4));
 
+  get cpuLimitActiveCount() {
+    return this.cpuLimit.activeCount;
+  }
+
+  get cpuLimitPendingCount() {
+    return this.cpuLimit.pendingCount;
+  }
+
   constructor() {
     this.setCustomLimit();
   }
@@ -16,13 +26,19 @@ class TaskLimit {
       this.cpuLimit = pLimit(limit);
       return;
     }
-    const doc = await AuthModel.findOne({ where: { type: AuthDataType.systemConfig } });
+    await AuthModel.sync();
+    const doc = await AuthModel.findOne({
+      where: { type: AuthDataType.systemConfig },
+    });
     if (doc?.info?.cronConcurrency) {
       this.cpuLimit = pLimit(doc?.info?.cronConcurrency);
     }
   }
 
   public runWithCpuLimit<T>(fn: () => Promise<T>): Promise<T> {
+    Logger.info(
+      `[schedule][任务加入队列] 运行中任务数: ${this.cpuLimitActiveCount}, 等待中任务数: ${this.cpuLimitPendingCount}`,
+    );
     return this.cpuLimit(fn);
   }
 

back/shared/runCron.ts

@@ -1,37 +1,33 @@
 import { spawn } from 'cross-spawn';
-import taskLimit from "./pLimit";
+import taskLimit from './pLimit';
 import Logger from '../loaders/logger';
 
 export function runCron(cmd: string): Promise<number> {
   return taskLimit.runWithCpuLimit(() => {
     return new Promise(async (resolve: any) => {
-      Logger.silly('运行命令: ' + cmd);
+      Logger.info(`[schedule][开始执行任务] 运行命令: ${cmd}`);
 
       const cp = spawn(cmd, { shell: '/bin/bash' });
 
       cp.stderr.on('data', (data) => {
         Logger.info(
-          '[执行任务失败] %s，时间：%s, 错误信息：%j',
+          '[schedule][执行任务失败] 命令: %s, 错误信息: %j',
           cmd,
-          new Date().toLocaleString(),
           data.toString(),
         );
       });
       cp.on('error', (err) => {
         Logger.error(
-          '[创建任务失败] %s，时间：%s, 错误信息：%j',
+          '[schedule][创建任务失败] 命令: %s, 错误信息: %j',
           cmd,
-          new Date().toLocaleString(),
           err,
         );
       });
 
       cp.on('close', async (code) => {
-        Logger.info(
-          `[任务退出] ${cmd} 进程id: ${cp.pid} 退出，退出码 ${code}`,
-        );
+        Logger.info(`[schedule][任务退出] ${cmd} 进程id: ${cp.pid} 退出, 退出码 ${code}`);
         resolve();
       });
     });
-  })
-}
+  });
+}

package.json

@@ -96,6 +96,7 @@
     "typedi": "^0.10.0",
     "uuid": "^8.3.2",
     "winston": "^3.6.0",
+    "winston-daily-rotate-file": "^4.7.1",
     "yargs": "^17.3.1"
   },
   "devDependencies": {
@@ -127,13 +128,15 @@
     "@types/sockjs-client": "^1.5.1",
     "@types/tar": "^6.1.5",
     "@types/uuid": "^8.3.4",
+    "@uiw/codemirror-extensions-langs": "^4.21.9",
+    "@uiw/react-codemirror": "^4.21.9",
     "@umijs/max": "^4.0.72",
     "@umijs/ssr-darkreader": "^4.9.45",
+    "ahooks": "^3.7.8",
     "ansi-to-react": "^6.1.6",
     "antd": "^4.24.8",
     "antd-img-crop": "^4.2.3",
     "axios": "^1.4.0",
-    "codemirror": "^5.65.2",
     "compression-webpack-plugin": "9.2.0",
     "concurrently": "^7.0.0",
     "file-saver": "^2.0.5",
@@ -145,13 +148,14 @@
     "qrcode.react": "^1.0.1",
     "query-string": "^7.1.1",
     "rc-tween-one": "^3.0.6",
+    "rc-virtual-list": "3.5.3",
     "react": "18.2.0",
-    "react-codemirror2": "^7.2.1",
     "react-copy-to-clipboard": "^5.1.0",
     "react-diff-viewer": "^3.1.1",
     "react-dnd": "^14.0.2",
     "react-dnd-html5-backend": "^14.0.0",
     "react-dom": "18.2.0",
+    "react-intl-universal": "^2.6.21",
     "react-split-pane": "^0.1.92",
     "sockjs-client": "^1.6.0",
     "ts-node": "^10.6.0",

sample/config.sample.sh

@@ -168,4 +168,9 @@ export SMTP_PASSWORD=""
 ## smtp_name 填写 SMTP 收发件人姓名，可随意填写
 export SMTP_NAME=""
 
+## 15. PushMe
+## 官方说明文档：https://push.i-i.me/
+## PUSHME_KEY (必填)填写PushMe APP上获取的push_key
+export PUSHME_KEY=""
+
 ## 其他需要的变量，脚本中需要的变量使用 export 变量名= 声明即可

sample/notify.js

@@ -141,6 +141,11 @@ let SMTP_EMAIL = '';
 let SMTP_PASSWORD = '';
 let SMTP_NAME = '';
 
+// =======================================PushMe通知设置区域===========================================
+//官方文档：https://push.i-i.me/
+//此处填你的PushMe KEY.
+let PUSHME_KEY = '';
+
 //==========================云端环境变量的判断与接收=========================
 if (process.env.GOTIFY_URL) {
   GOTIFY_URL = process.env.GOTIFY_URL;
@@ -288,6 +293,9 @@ if (process.env.SMTP_PASSWORD) {
 if (process.env.SMTP_NAME) {
   SMTP_NAME = process.env.SMTP_NAME;
 }
+if (process.env.PUSHME_KEY) {
+  PUSHME_KEY = process.env.PUSHME_KEY;
+}
 //==========================云端环境变量的判断与接收=========================
 
 /**
@@ -336,6 +344,7 @@ async function sendNotify(
     aibotkNotify(text, desp), //智能微秘书
     fsBotNotify(text, desp), //飞书机器人
     smtpNotify(text, desp), //SMTP 邮件
+    PushMeNotify(text, desp, params), //PushMe
   ]);
 }
 
@@ -1117,6 +1126,41 @@ function smtpNotify(text, desp) {
   });
 }
 
+function PushMeNotify(text, desp, params = {}) {
+  return new Promise((resolve) => {
+    if (PUSHME_KEY) {
+      const options = {
+        url: `https://push.i-i.me?push_key=${PUSHME_KEY}`,
+        json: { title: text, content: desp, ...params },
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        timeout,
+      };
+      $.post(options, (err, resp, data) => {
+        try {
+          if (err) {
+            console.log('PushMeNotify发送通知调用API失败！！\n');
+            console.log(err);
+          } else {
+            if (data === 'success') {
+              console.log('PushMe发送通知消息成功🎉\n');
+            } else {
+              console.log(`${data}\n`);
+            }
+          }
+        } catch (e) {
+          $.logErr(e, resp);
+        } finally {
+          resolve(data);
+        }
+      });
+    } else {
+      resolve();
+    }
+  });
+}
+
 module.exports = {
   sendNotify,
   BARK_PUSH,

sample/notify.py

@@ -98,6 +98,8 @@ push_config = {
     'SMTP_EMAIL': '',                   # SMTP 收发件邮箱，通知将会由自己发给自己
     'SMTP_PASSWORD': '',                # SMTP 登录密码，也可能为特殊口令，视具体邮件服务商说明而定
     'SMTP_NAME': '',                    # SMTP 收发件人姓名，可随意填写
+
+    'PUSHME_KEY': '',                     # PushMe 酱的 PUSHME_KEY
 }
 notify_function = []
 # fmt: on
@@ -454,7 +456,7 @@ class WeCom:
         return respone["errmsg"]
 
     def send_mpnews(self, title, message, media_id, touser="@all"):
-        send_url = f"https://{self.HOST}/cgi-bin/message/send?access_token={self.get_access_token()}"
+        send_url = f"{self.ORIGIN}/cgi-bin/message/send?access_token={self.get_access_token()}"
         send_values = {
             "touser": touser,
             "msgtype": "mpnews",
@@ -637,6 +639,27 @@ def smtp(title: str, content: str) -> None:
     except Exception as e:
         print(f"SMTP 邮件 推送失败！{e}")
 
+def pushme(title: str, content: str) -> None:
+    """
+    使用 PushMe 推送消息。
+    """
+    if not push_config.get("PUSHME_KEY"):
+        print("PushMe 服务的 PUSHME_KEY 未设置!!\n取消推送")
+        return
+    print("PushMe 服务启动")
+
+    url = f'https://push.i-i.me/?push_key={push_config.get("PUSHME_KEY")}'
+    data = {
+        "title": title,
+        "content": content,
+    }
+    response = requests.post(url, data=data)
+
+    if response.status_code == 200 and response.text == "success":
+        print("PushMe 推送成功！")
+    else:
+        print(f"PushMe 推送失败！{response.status_code} {response.text}")
+
 
 def one() -> str:
     """
@@ -692,6 +715,8 @@ if (
     and push_config.get("SMTP_NAME")
 ):
     notify_function.append(smtp)
+if push_config.get("PUSHME_KEY"):
+    notify_function.append(pushme)
 
 
 def send(title: str, content: str) -> None:

shell/api.sh

@@ -36,7 +36,7 @@ add_cron_api() {
     local sub_id="$4"
   fi
 
-  if [[ ! $sub_id ]];then
+  if [[ ! $sub_id ]]; then
     sub_id="null"
   fi
 

shell/check.sh

@@ -79,8 +79,6 @@ main() {
   npm i -g pnpm@8.3.1
   patch_version
 
-  apk add procps netcat-openbsd
-
   if [[ $PipMirror ]]; then
     pip3 config set global.index-url $PipMirror
   fi

shell/otask.sh

@@ -86,6 +86,11 @@ check_server() {
   fi
 }
 
+env_str_to_array() {
+  local IFS="&"
+  read -ra array <<<"${!env_param}"
+}
+
 ## 正常运行单个脚本，$1：传入参数
 run_normal() {
   local file_param=$1
@@ -113,8 +118,7 @@ run_concurrent() {
     exit 1
   fi
 
-  local envs=$(eval echo "\$${env_param}")
-  local array=($(echo $envs | sed 's/&/ /g'))
+  env_str_to_array
   local tempArr=$(echo $num_param | sed "s/-max/-${#array[@]}/g" | sed "s/max-/${#array[@]}-/g" | perl -pe "s|(\d+)(-\|~\|_)(\d+)|{\1..\3}|g")
   local runArr=($(eval echo $tempArr))
   runArr=($(awk -v RS=' ' '!a[$1]++' <<<${runArr[@]}))
@@ -125,11 +129,13 @@ run_concurrent() {
     let n++
   done
 
-  local cookieStr=$(echo ${array_run[*]} | sed 's/\ /\&/g')
-  [[ ! -z $cookieStr ]] && export ${env_param}=${cookieStr}
+  local cookieStr=$(
+    IFS="&"
+    echo "${array_run[*]}"
+  )
+  [[ ! -z $cookieStr ]] && export "${env_param}=${cookieStr}"
 
-  local envs=$(eval echo "\$${env_param}")
-  local array=($(echo $envs | sed 's/&/ /g'))
+  env_str_to_array
   single_log_time=$(date "+%Y-%m-%d-%H-%M-%S.%3N")
 
   cd $dir_scripts
@@ -139,7 +145,7 @@ run_concurrent() {
     file_param=${file_param/$relative_path\//}
   fi
   for i in "${!array[@]}"; do
-    export ${env_param}=${array[i]}
+    export "${env_param}=${array[i]}"
     single_log_path="$dir_log/$log_dir/${single_log_time}_$((i + 1)).log"
     eval $timeoutCmd $which_program $file_param &>$single_log_path &
   done
@@ -161,8 +167,7 @@ run_designated() {
     exit 1
   fi
 
-  local envs=$(eval echo "\$${env_param}")
-  local array=($(echo $envs | sed 's/&/ /g'))
+  env_str_to_array
   local tempArr=$(echo $num_param | sed "s/-max/-${#array[@]}/g" | sed "s/max-/${#array[@]}-/g" | perl -pe "s|(\d+)(-\|~\|_)(\d+)|{\1..\3}|g")
   local runArr=($(eval echo $tempArr))
   runArr=($(awk -v RS=' ' '!a[$1]++' <<<${runArr[@]}))
@@ -173,8 +178,11 @@ run_designated() {
     let n++
   done
 
-  local cookieStr=$(echo ${array_run[*]} | sed 's/\ /\&/g')
-  [[ ! -z $cookieStr ]] && export ${env_param}=${cookieStr}
+  local cookieStr=$(
+    IFS="&"
+    echo "${array_run[*]}"
+  )
+  [[ ! -z $cookieStr ]] && export "${env_param}=${cookieStr}"
 
   cd $dir_scripts
   local relative_path="${file_param%/*}"

shell/share.sh

@@ -296,7 +296,7 @@ git_clone_scripts() {
 
   set_proxy "$proxy"
 
-  git clone --depth=1 $part_cmd $url $dir
+  git clone --depth=1 $part_cmd $url $dir 2>&1
   exit_status=$?
 
   unset_proxy
@@ -314,7 +314,6 @@ reload_pm2() {
   unset_proxy
   pm2 flush &>/dev/null
   pm2 startOrGracefulReload $file_ecosystem_js --update-env
-  pm2 sendSignal SIGKILL panel &>/dev/null
 }
 
 diff_time() {

shell/task.sh

@@ -14,7 +14,7 @@ single_hanle() {
 ## 选择python3还是node
 define_program() {
   local file_param=$1
-  if [[ $file_param == *.js ]]; then
+  if [[ $file_param == *.js ]] || [[ $file_param == *.mjs ]]; then
     which_program="node"
   elif [[ $file_param == *.py ]] || [[ $file_param == *.pyc ]]; then
     which_program="python3"
@@ -69,7 +69,7 @@ handle_log_path() {
   if [[ $real_log_path ]]; then
     log_path="$real_log_path"
   fi
-  
+
   cmd=">> $dir_log/$log_path 2>&1"
   make_dir "$dir_log/$log_dir"
   if [[ "$show_log" == "true" ]]; then

shell/update.sh

@@ -31,7 +31,7 @@ output_list_add_drop() {
   local list=$1
   local type=$2
   if [[ -s $list ]]; then
-    echo -e "检测到有${type}的定时任务：\n"
+    echo -e "检测到有${type}的定时任务:"
     cat $list
     echo
   fi
@@ -134,10 +134,10 @@ update_repo() {
   git_clone_scripts "${formatUrl}" ${repo_path} "${branch}" "${proxy}"
 
   if [[ $exit_status -eq 0 ]]; then
-    echo -e "\n更新${repo_path}成功...\n"
+    echo -e "\n拉取 ${uniq_path} 成功...\n"
     diff_scripts "$repo_path" "$author" "$path" "$blackword" "$dependence" "$extensions" "$autoAddCron" "$autoDelCron"
   else
-    echo -e "\n更新${repo_path}失败，请检查网络...\n"
+    echo -e "\n拉取 ${uniq_path} 失败，请检查网络...\n"
   fi
 }
 

src/app.ts

@@ -1,4 +1,26 @@
 const baseUrl = window.__ENV__QlBaseUrl || '/';
+import { setLocale } from '@umijs/max';
+import intl from 'react-intl-universal';
+
+export function rootContainer(container: any) {
+  const locales = {
+    'en': require('./locales/en-US.json'),
+    'zh': require('./locales/zh-CN.json'),
+  };
+  let currentLocale = intl.determineLocale({
+    urlLocaleKey: 'lang',
+    cookieLocaleKey: 'lang',
+    localStorageLocaleKey: 'lang',
+  }).slice(0, 2);
+
+  if (!currentLocale || !Object.keys(locales).includes(currentLocale)) {
+    currentLocale = 'zh';
+  }
+
+  intl.init({ currentLocale, locales });
+  setLocale(currentLocale === 'zh' ? 'zh-CN' : 'en-US');
+  return container;
+}
 
 export function modifyClientRenderOpts(memo: any) {
   return {

src/components/copy.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useRef, useState, useEffect } from 'react';
 import { Tooltip, Typography } from 'antd';
 import { CopyOutlined, CheckOutlined } from '@ant-design/icons';
@@ -28,7 +29,10 @@ const Copy = ({ text }: { text: string }) => {
   return (
     <Link onClick={copyText} style={{ marginLeft: 1 }}>
       <CopyToClipboard text={text}>
-        <Tooltip key="copy" title={copied ? '复制成功' : '复制'}>
+        <Tooltip
+          key="copy"
+          title={copied ? intl.get('复制成功') : intl.get('复制')}
+        >
           {copied ? <CheckOutlined /> : <CopyOutlined />}
         </Tooltip>
       </CopyToClipboard>

src/components/name.tsx

@@ -0,0 +1,22 @@
+import { useRequest } from 'ahooks';
+import { Service, Options } from 'ahooks/lib/useRequest/src/types';
+import { Spin, Typography } from 'antd';
+
+export default function Name<
+  TData extends { data?: { name: string } },
+  TParams,
+>({
+  service,
+  options,
+}: {
+  service: Service<TData, [TParams]>;
+  options: Options<TData, [TParams]>;
+}) {
+  const { loading, data } = useRequest(service, options);
+
+  return (
+    <Spin spinning={loading}>
+      <Typography.Text ellipsis={true}>{data?.data?.name}</Typography.Text>
+    </Spin>
+  );
+}

src/components/tag.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import { Tag, Input } from 'antd';
 import { TweenOneGroup } from 'rc-tween-one';
 import { PlusOutlined } from '@ant-design/icons';
@@ -101,7 +102,7 @@ const EditableTagGroup = ({
           onClick={showInput}
           style={{ borderStyle: 'dashed', cursor: 'pointer' }}
         >
-          <PlusOutlined /> 新建
+          <PlusOutlined /> {intl.get('新建')}
         </Tag>
       )}
     </>

src/components/vlist.tsx

@@ -1,404 +0,0 @@
-import React, {
-  useRef,
-  useEffect,
-  useContext,
-  createContext,
-  useReducer,
-  useState,
-  useMemo,
-} from 'react';
-import { throttle, isNumber, debounce } from 'lodash';
-
-const initialState = {
-  // 行高度
-  rowHeight: 0,
-  // 当前的scrollTop
-  curScrollTop: 0,
-  // 总行数
-  totalLen: 0,
-};
-
-function reducer(state, action) {
-  const { curScrollTop, totalLen, ifScrollTopClear, scrollTop } = action;
-
-  let stateScrollTop = state.curScrollTop;
-  switch (action.type) {
-    // 改变trs 即 改变渲染的列表trs
-    case 'changeTrs':
-      return {
-        ...state,
-        curScrollTop,
-      };
-    // 更改totalLen
-    case 'changeTotalLen':
-      if (totalLen === 0) {
-        stateScrollTop = 0;
-      }
-
-      return {
-        ...state,
-        totalLen,
-        curScrollTop: stateScrollTop,
-      };
-
-    case 'reset':
-      return {
-        ...state,
-        curScrollTop: ifScrollTopClear ? 0 : scrollTop ?? state.curScrollTop,
-      };
-    default:
-      throw new Error();
-  }
-}
-
-// ==============全局常量 ================== //
-const DEFAULT_VID = 'vtable';
-const vidMap = new Map();
-let preData = 0;
-
-// ===============context ============== //
-const ScrollContext = createContext({
-  dispatch: undefined,
-  renderLen: 1,
-  start: 0,
-  offsetStart: 0,
-  // =============
-  rowHeight: initialState.rowHeight,
-  totalLen: 0,
-  vid: DEFAULT_VID,
-});
-
-// =============组件 =================== //
-
-function VCell(props: any): JSX.Element {
-  const { children, ...restProps } = props;
-
-  return (
-    <td {...restProps}>
-      <div>{children[1]}</div>
-    </td>
-  );
-}
-
-function VRow(props: any, ref: any): JSX.Element {
-  const { rowHeight } = useContext(ScrollContext);
-
-  const { children, style, ...restProps } = props;
-
-  const trRef = useRef<HTMLTableRowElement>(null);
-
-  return (
-    <tr
-      {...restProps}
-      ref={Object.prototype.hasOwnProperty.call(ref, 'current') ? ref : trRef}
-      style={{
-        ...style,
-        height: rowHeight || 'auto',
-        boxSizing: 'border-box',
-      }}
-    >
-      {children}
-    </tr>
-  );
-}
-
-function VWrapper(props: any): JSX.Element {
-  const { children, ...restProps } = props;
-
-  const { renderLen, start, dispatch, vid, totalLen } =
-    useContext(ScrollContext);
-
-  const contents = useMemo(() => {
-    return children[1];
-  }, [children]);
-
-  const contentsLen = useMemo(() => {
-    return contents?.length ?? 0;
-  }, [contents]);
-
-  useEffect(() => {
-    if (totalLen !== contentsLen) {
-      dispatch({
-        type: 'changeTotalLen',
-        totalLen: contentsLen ?? 0,
-      });
-    }
-  }, [contentsLen, dispatch, vid, totalLen]);
-
-  let tempNode = null;
-  if (Array.isArray(contents) && contents.length) {
-    tempNode = [
-      children[0],
-      contents.slice(start, start + (renderLen ?? 1)).map((item) => {
-        if (Array.isArray(item)) {
-          // 兼容antd v4.3.5 --- rc-table 7.8.1及以下
-          return item[0];
-        }
-        // 处理antd ^v4.4.0  --- rc-table ^7.8.2
-        return item;
-      }),
-    ];
-  } else {
-    tempNode = children;
-  }
-
-  return <tbody {...restProps}>{tempNode}</tbody>;
-}
-
-function VTable(props: any, otherParams): JSX.Element {
-  const { style, children, ...rest } = props;
-  const { width, ...rest_style } = style;
-
-  const { vid, scrollY, resetScrollTopWhenDataChange, rowHeight, scrollTop } =
-    otherParams ?? {};
-
-  const [state, dispatch] = useReducer(reducer, {
-    ...initialState,
-    curScrollTop: scrollTop,
-    rowHeight,
-  });
-
-  const wrap_tableRef = useRef<HTMLDivElement>(null);
-  const tableRef = useRef<HTMLTableElement>(null);
-
-  const ifChangeRef = useRef(false);
-
-  // 数据的总条数
-  const [totalLen, setTotalLen] = useState<number>(
-    children[1]?.props?.data?.length ?? 0,
-  );
-
-  useEffect(() => {
-    setTotalLen(state.totalLen);
-  }, [state.totalLen]);
-
-  // 组件卸载的清除操作
-  useEffect(() => {
-    return () => {
-      vidMap.delete(vid);
-    };
-  }, [vid]);
-
-  // 数据变更
-  useEffect(() => {
-    ifChangeRef.current = true;
-    // console.log('数据变更')
-    if (isNumber(children[1]?.props?.data?.length)) {
-      dispatch({
-        type: 'changeTotalLen',
-        totalLen: children[1]?.props?.data?.length ?? 0,
-      });
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [children[1].props.data]);
-
-  // table总高度
-  const tableHeight = useMemo<string | number>(() => {
-    let temp: string | number = 'auto';
-
-    if (rowHeight && totalLen) {
-      temp = rowHeight * totalLen;
-    }
-    return temp;
-  }, [totalLen]);
-
-  // table的scrollY值
-  const [tableScrollY, setTableScrollY] = useState(0);
-
-  // tableScrollY 随scrollY / tableHeight 进行变更
-  useEffect(() => {
-    let temp = 0;
-
-    if (typeof scrollY === 'string') {
-      temp =
-        (wrap_tableRef.current?.parentNode as HTMLElement)?.offsetHeight ?? 0;
-    } else {
-      temp = scrollY;
-    }
-
-    // if (isNumber(tableHeight) && tableHeight < temp) {
-    //   temp = tableHeight;
-    // }
-
-    // 处理tableScrollY <= 0的情况
-    if (temp <= 0) {
-      temp = 0;
-    }
-
-    setTableScrollY(temp);
-  }, [scrollY, tableHeight]);
-
-  // 渲染的条数
-  const renderLen = useMemo<number>(() => {
-    let temp = 1;
-    if (rowHeight && totalLen && tableScrollY) {
-      if (tableScrollY <= 0) {
-        temp = 0;
-      } else {
-        const tempRenderLen = ((tableScrollY / rowHeight) | 0) + 10;
-        // console.log('tempRenderLen', tempRenderLen)
-        // temp = tempRenderLen > totalLen ? totalLen : tempRenderLen;
-        temp = tempRenderLen;
-      }
-    }
-
-    return temp;
-  }, [totalLen, tableScrollY]);
-
-  // 渲染中的第一条
-  let start = rowHeight ? (state.curScrollTop / rowHeight) | 0 : 0;
-
-  start = start < 5 ? 0 : start - 5 + 1;
-
-  // 偏移量
-  let offsetStart = state.curScrollTop % (rowHeight * 5);
-
-  if (start > 0) {
-    offsetStart = offsetStart % rowHeight;
-  }
-  // console.log(offsetStart)
-  // offsetStart= offsetStart%rowHeight
-  // 用来优化向上滚动出现的空白
-  if (state.curScrollTop && state.curScrollTop >= rowHeight * 5) {
-    // start -= 1
-    // if (offsetStart >= rowHeight) {
-    //   offsetStart +=
-    // } else {
-    offsetStart += rowHeight * 4;
-    // }
-  } else {
-    start = 0;
-  }
-
-  // console.log(state.curScrollTop, start, offsetStart)
-
-  // 数据变更 操作scrollTop
-  useEffect(() => {
-    const scrollNode = wrap_tableRef.current?.parentNode as HTMLElement;
-    if (ifChangeRef?.current) {
-      // console.log(scrollNode)
-      ifChangeRef.current = false;
-
-      if (resetScrollTopWhenDataChange) {
-        // 重置scrollTop
-        if (scrollNode) {
-          scrollNode.scrollTop = 0;
-        }
-
-        dispatch({ type: 'reset', ifScrollTopClear: true });
-      } else {
-        // console.log(preData)
-        // scrollNode.scrollTop = preData+53
-        // 不重置scrollTop 不清空curScrollTop
-        dispatch({ type: 'reset', ifScrollTopClear: false });
-      }
-    }
-
-    if (vidMap.has(vid)) {
-      vidMap.set(vid, {
-        ...vidMap.get(vid),
-        scrollNode,
-      });
-    }
-  }, [totalLen, resetScrollTopWhenDataChange, vid, children]);
-
-  useEffect(() => {
-    const throttleScroll = throttle((e) => {
-      const scrollTop: number = e?.target?.scrollTop ?? 0;
-      // const scrollHeight: number = e?.target?.scrollHeight ?? 0
-      // const clientHeight: number = e?.target?.clientHeight ?? 0
-      if (scrollTop) {
-        preData = scrollTop;
-      }
-      // 到底了 没有滚动条就不会触发reachEnd. 建议设置scrolly高度少点或者数据量多点.
-      // 若renderLen大于totalLen, 置空curScrollTop. => table paddingTop会置空.
-      dispatch({
-        type: 'changeTrs',
-        curScrollTop: renderLen <= totalLen ? scrollTop : 0,
-      });
-    }, 60);
-
-    const ref = wrap_tableRef?.current?.parentNode as HTMLElement;
-
-    if (ref) {
-      ref.addEventListener('scroll', throttleScroll, { passive: true });
-    }
-
-    return () => {
-      ref.removeEventListener('scroll', throttleScroll);
-    };
-  }, [renderLen, totalLen]);
-
-  return (
-    <div
-      className="virtuallist"
-      ref={wrap_tableRef}
-      style={{
-        width: '100%',
-        position: 'relative',
-        height: tableHeight,
-        boxSizing: 'border-box',
-        paddingTop: state.curScrollTop,
-      }}
-    >
-      <ScrollContext.Provider
-        value={{
-          dispatch,
-          start,
-          offsetStart,
-          renderLen,
-          totalLen,
-          vid,
-          rowHeight,
-        }}
-      >
-        <table
-          {...rest}
-          ref={tableRef}
-          style={{
-            ...rest_style,
-            width,
-            position: 'relative',
-            transform: `translateY(-${offsetStart}px)`,
-          }}
-        >
-          {children}
-        </table>
-      </ScrollContext.Provider>
-    </div>
-  );
-}
-
-// ================导出===================
-export function VList(props: {
-  height: number;
-  // 唯一标识
-  vid?: string;
-  rowHeight: number | string;
-  reset?: boolean;
-  scrollTop?: number | string;
-}): any {
-  const { vid = DEFAULT_VID, rowHeight, height, reset, scrollTop } = props;
-
-  const resetScrollTopWhenDataChange = reset ?? true;
-
-  if (!vidMap.has(vid)) {
-    vidMap.set(vid, { _id: vid });
-  }
-
-  return {
-    table: (p) =>
-      VTable(p, {
-        vid,
-        scrollY: height,
-        rowHeight,
-        resetScrollTopWhenDataChange,
-        scrollTop,
-      }),
-    body: {
-      wrapper: VWrapper,
-      row: VRow,
-      cell: VCell,
-    },
-  };
-}

src/hooks/useScrollHeight.ts

@@ -0,0 +1,14 @@
+import { RefObject, useState } from 'react';
+import useResizeObserver from '@react-hook/resize-observer';
+
+export default <T extends HTMLElement>(target: RefObject<T>) => {
+  const [height, setHeight] = useState<number>(0);
+
+  useResizeObserver(target, (entry) => {
+    let _height = entry.target.clientHeight;
+    if (height !== _height) {
+      setHeight(_height);
+    }
+  });
+  return height;
+};

src/hooks/useTableScrollHeight.ts

@@ -1,9 +1,9 @@
-import { MutableRefObject, useLayoutEffect, useState } from 'react';
+import { RefObject, useState } from 'react';
 import useResizeObserver from '@react-hook/resize-observer';
 import { getTableScroll } from '@/utils';
 
 export default <T extends HTMLElement>(
-  target: MutableRefObject<T>,
+  target: RefObject<T>,
   extraHeight?: number,
 ) => {
   const [height, setHeight] = useState<number>(0);

src/layouts/defaultProps.tsx

@@ -1,14 +1,5 @@
-import {
-  FormOutlined,
-  FieldTimeOutlined,
-  DiffOutlined,
-  SettingOutlined,
-  CodeOutlined,
-  FolderOutlined,
-  RadiusSettingOutlined,
-  ControlOutlined,
-  ContainerOutlined,
-} from '@ant-design/icons';
+import intl from 'react-intl-universal';
+import { SettingOutlined } from '@ant-design/icons';
 import IconFont from '@/components/iconfont';
 import { BasicLayoutProps } from '@ant-design/pro-layout';
 
@@ -16,74 +7,74 @@ export default {
   route: {
     routes: [
       {
-        name: '登录',
+        name: intl.get('登录'),
         path: '/login',
         hideInMenu: true,
         component: '@/pages/login/index',
       },
       {
-        name: '初始化',
+        name: intl.get('初始化'),
         path: '/initialization',
         hideInMenu: true,
         component: '@/pages/initialization/index',
       },
       {
-        name: '错误',
+        name: intl.get('错误'),
         path: '/error',
         hideInMenu: true,
         component: '@/pages/error/index',
       },
       {
         path: '/crontab',
-        name: '定时任务',
+        name: intl.get('定时任务'),
         icon: <IconFont type="ql-icon-crontab" />,
         component: '@/pages/crontab/index',
       },
       {
         path: '/subscription',
-        name: '订阅管理',
+        name: intl.get('订阅管理'),
         icon: <IconFont type="ql-icon-subs" />,
         component: '@/pages/subscription/index',
       },
       {
         path: '/env',
-        name: '环境变量',
+        name: intl.get('环境变量'),
         icon: <IconFont type="ql-icon-env" />,
         component: '@/pages/env/index',
       },
       {
         path: '/config',
-        name: '配置文件',
+        name: intl.get('配置文件'),
         icon: <IconFont type="ql-icon-config" />,
         component: '@/pages/config/index',
       },
       {
         path: '/script',
-        name: '脚本管理',
+        name: intl.get('脚本管理'),
         icon: <IconFont type="ql-icon-script" />,
         component: '@/pages/script/index',
       },
       {
         path: '/dependence',
-        name: '依赖管理',
+        name: intl.get('依赖管理'),
         icon: <IconFont type="ql-icon-dependence" />,
         component: '@/pages/dependence/index',
       },
       {
         path: '/log',
-        name: '日志管理',
+        name: intl.get('日志管理'),
         icon: <IconFont type="ql-icon-log" />,
         component: '@/pages/log/index',
       },
       {
         path: '/diff',
-        name: '对比工具',
+        name: intl.get('对比工具'),
         icon: <IconFont type="ql-icon-diff" />,
         component: '@/pages/diff/index',
       },
       {
         path: '/setting',
-        name: '系统设置',
+        name: intl.get('系统设置'),
         icon: <SettingOutlined />,
         component: '@/pages/password/index',
       },

src/layouts/index.less

@@ -1,6 +1,5 @@
 @import '~antd/es/style/themes/default.less';
 @import '~@/styles/variable.less';
-@import '~codemirror/lib/codemirror.css';
 
 @font-face {
   font-family: 'Source Code Pro';
@@ -32,9 +31,24 @@ body {
 }
 
 .log-modal {
-  .ant-modal {
-    padding-bottom: 0 !important;
-    width: 580px !important;
+  &.ant-modal {
+    max-width: 1000px !important;
+    width: 80vw !important;
+  }
+
+  .ant-modal-body {
+    overflow-y: auto;
+    min-height: 300px;
+    max-height: calc(80vh - 110px);
+    max-height: calc(80vh - var(--vh-offset, 110px));
+    padding: 0;
+    display: flex;
+
+    .log-container {
+      width: 100%;
+      padding: 24px;
+      overflow-y: auto;
+    }
   }
 
   pre {
@@ -87,10 +101,12 @@ body {
 }
 
 .ant-tooltip {
-  max-width: 500px !important;
+  max-width: 300px !important;
 
   .ant-tooltip-inner {
     word-break: break-all !important;
+    max-height: 300px !important;
+    overflow-y: auto !important;
   }
 }
 
@@ -182,8 +198,14 @@ body {
     }
   }
 
+  .log-modal {
+    &.ant-modal {
+      width: calc(100vw - 16px) !important;
+    }
+  }
+
   .ant-tooltip {
-    max-width: 250px !important;
+    max-width: 300px !important;
   }
 }
 
@@ -332,6 +354,8 @@ select:-webkit-autofill:focus {
 }
 
 .ant-pro-sider-logo {
+  padding-inline: 5px !important;
+
   .title {
     display: flex;
     height: 32px;
@@ -366,9 +390,9 @@ select:-webkit-autofill:focus {
 }
 
 pre {
-  word-break: break-all !important;
-  white-space: break-spaces !important;
-  padding: 0 !important;
+  word-break: break-all;
+  white-space: break-spaces;
+  padding: 0;
 }
 
 .virtuallist {
@@ -418,3 +442,12 @@ body[data-mode='phone'] header {
   box-shadow: none;
   border-right: 1px solid #eee;
 }
+
+.ant-table.ant-table-middle .ant-table-title,
+.ant-table.ant-table-middle .ant-table-footer,
+.ant-table.ant-table-middle .ant-table-thead > tr > th,
+.ant-table.ant-table-middle .ant-table-tbody > tr > td,
+.ant-table.ant-table-middle tfoot > tr > th,
+.ant-table.ant-table-middle tfoot > tr > td {
+  padding: 12px 16px;
+}

src/layouts/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState, useRef } from 'react';
 import ProLayout, { PageLoading } from '@ant-design/pro-layout';
 import * as DarkReader from '@umijs/ssr-darkreader';
@@ -31,9 +32,6 @@ import {
 import SockJS from 'sockjs-client';
 import * as Sentry from '@sentry/react';
 import { init } from '../utils/init';
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/mode/python/python';
-import 'codemirror/mode/shell/shell';
 
 export interface SharedContext {
   headerStyle: React.CSSProperties;
@@ -264,7 +262,7 @@ export default function () {
   const menu: MenuProps = {
     items: [
       {
-        label: '退出登录',
+        label: intl.get('退出登录'),
         className: 'side-menu-user-drop-menu',
         onClick: logout,
         key: 'logout',
@@ -283,7 +281,7 @@ export default function () {
         <>
           <Image preview={false} src="https://qn.whyour.cn/logo.png" />
           <div className="title">
-            <span className="title">青龙</span>
+            <span className="title">{intl.get('青龙')}</span>
             <a
               href={systemInfo?.changeLogLink}
               target="_blank"
@@ -293,7 +291,11 @@ export default function () {
               }}
             >
               <Tooltip
-                title={systemInfo?.branch === 'develop' ? '开发版' : '正式版'}
+                title={
+                  systemInfo?.branch === 'develop'
+                    ? intl.get('开发版')
+                    : intl.get('正式版')
+                }
               >
                 <Badge size="small" dot={systemInfo?.branch === 'develop'}>
                   <span
@@ -326,8 +328,9 @@ export default function () {
       }}
       pageTitleRender={(props, pageName, info) => {
         const title =
-          (config.documentTitleMap as any)[location.pathname] || '未找到';
-        return `${title} - 青龙`;
+          (config.documentTitleMap as any)[location.pathname] ||
+          intl.get('未找到');
+        return `${title} - ${intl.get('青龙')}`;
       }}
       onCollapse={setCollapsed}
       collapsed={collapsed}

src/locales/en-US.json

@@ -0,0 +1,455 @@
+{
+  "复制成功": "Copy successful",
+  "复制": "Copy",
+  "新建": "New",
+  "登录": "Login",
+  "初始化": "Initialize",
+  "错误": "Error",
+  "定时任务": "Scheduled Tasks",
+  "订阅管理": "Subscription Management",
+  "环境变量": "Environment Variables",
+  "配置文件": "Configuration Files",
+  "脚本管理": "Script Management",
+  "依赖管理": "Dependency Management",
+  "日志管理": "Log Management",
+  "对比工具": "Comparison Tool",
+  "系统设置": "System Settings",
+  "退出登录": "Logout",
+  "青龙": "Qinglong",
+  "返回首页": "Return to Home",
+  "保存": "Save",
+  "日志": "Log",
+  "脚本": "Script",
+  "确认保存文件": "Confirm to Save File",
+  "，保存后不可恢复": ", it can't be recovered after saving.",
+  "确认运行": "Confirm to Run",
+  "确认运行定时任务": "Confirm to Run Scheduled Task",
+  "吗": "?",
+  "确认停止": "Confirm to Stop",
+  "确认停止定时任务": "Confirm to Stop Scheduled Task",
+  "确认": "Confirm",
+  "任务": "Task",
+  "状态": "Status",
+  "空闲中": "Idle",
+  "运行中": "Running",
+  "队列中": "In Queue",
+  "已禁用": "Disabled",
+  "定时": "Schedule",
+  "最后运行时间": "Last Run Time",
+  "最后运行时长": "Last Run Duration",
+  "下次运行时间": "Next Run Time",
+  "名称": "Name",
+  "命令/脚本": "Command/Script",
+  "定时规则": "Schedule Rule",
+  "操作": "Action",
+  "确认删除": "Confirm to Delete",
+  "确认删除定时任务": "Confirm to Delete Scheduled Task",
+  "编辑": "Edit",
+  "删除": "Delete",
+  "确认删除选中的定时任务吗": "Confirm to delete the selected scheduled tasks?",
+  "选中的定时任务吗": "selected scheduled tasks?",
+  "创建视图": "Create View",
+  "视图管理": "View Management",
+  "请输入名称或者关键词": "Please enter a name or keyword",
+  "创建任务": "Create Task",
+  "更多": "More",
+  "批量删除": "Batch Delete",
+  "批量启用": "Batch Enable",
+  "批量禁用": "Batch Disable",
+  "批量运行": "Batch Run",
+  "批量停止": "Batch Stop",
+  "批量置顶": "Batch Top",
+  "批量取消置顶": "Batch Un-top",
+  "批量修改标签": "Batch Modify Tags",
+  "已选择": "Selected",
+  "项": "items",
+  "知道了": "Got it",
+  "请输入任务名称": "Please enter the task name",
+  "支持输入脚本路径/任意系统可执行命令/task 脚本路径": "Supports input of script paths / any system executable commands / task script paths",
+  "秒(可选) 分 时 天 月 周": "Seconds (optional) Minutes Hours Day Month Week",
+  "标签": "Tags",
+  "取消": "Cancel",
+  "添加": "Add",
+  "启用": "Enable",
+  "禁用": "Disable",
+  "运行": "Run",
+  "停止": "Stop",
+  "置顶": "Top",
+  "取消置顶": "Un-top",
+  "命令": "Command",
+  "包含": "Include",
+  "不包含": "Exclude",
+  "属于": "Belong to",
+  "不属于": "Not Belong to",
+  "顺序": "Order",
+  "倒序": "Reverse",
+  "且": "And",
+  "或": "Or",
+  "输入后回车增加自定义选项": "Press Enter to add custom options",
+  "视图名称": "View Name",
+  "请输入视图名称": "Please enter the view name",
+  "请输入内容": "Please enter the content",
+  "新增筛选条件": "Add Filter",
+  "新增排序方式": "Add Sort",
+  "类型": "Type",
+  "显示": "Display",
+  "确认删除视图": "Confirm to delete the view",
+  "安装中": "Installing",
+  "已安装": "Installed",
+  "安装失败": "Installation Failed",
+  "删除中": "Deleting",
+  "已删除": "Deleted",
+  "删除失败": "Deletion Failed",
+  "序号": "Number",
+  "备注": "Remarks",
+  "更新时间": "Update Time",
+  "创建时间": "Creation Time",
+  "确认删除依赖": "Confirm to delete the dependency",
+  "确认重新安装": "Confirm to reinstall",
+  "确认删除选中的依赖吗": "Confirm to delete the selected dependencies?",
+  "确认重新安装选中的依赖吗": "Confirm to reinstall the selected dependencies?",
+  "请输入名称": "Please enter a name",
+  "创建依赖": "Create Dependency",
+  "批量安装": "Batch Install",
+  "批量强制删除": "Batch Force Delete",
+  "日志 -": "Log -",
+  "依赖类型": "Dependency Type",
+  "自动拆分": "Auto Split",
+  "多个依赖是否换行分割": "Whether to separate multiple dependencies with new lines",
+  "是": "Yes",
+  "否": "No",
+  "请输入依赖名称，支持指定版本": "Please enter the dependency name, version specification is supported",
+  "请输入依赖名称": "Please enter the dependency name",
+  "请输入备注": "Please enter remarks",
+  "源文件": "Source File",
+  "当前文件": "Current File",
+  "修改环境变量名称": "Modify Environment Variable Name",
+  "请输入新的环境变量名称": "Please enter the new environment variable name",
+  "已启用": "Enabled",
+  "值": "Value",
+  "确认删除变量": "Confirm to delete the variable",
+  "确认删除选中的变量吗": "Confirm to delete the selected variables?",
+  "选中的变量吗": "selected variables?",
+  "请输入名称/值/备注": "Please enter name/value/remarks",
+  "导入": "Import",
+  "创建变量": "Create Variable",
+  "批量修改变量名称": "Batch Modify Variable Names",
+  "批量导出": "Batch Export",
+  "请输入环境变量名称": "Please enter the environment variable name",
+  "只能输入字母数字下划线，且不能以数字开头": "Only letters, numbers, and underscores are allowed, and cannot start with a number",
+  "请输入环境变量值": "Please enter the environment variable value",
+  "服务启动超时": "Service startup timeout",
+  "请先按如下方式修复：": "Please fix it as follows:",
+  "1. 宿主机执行 docker run --rm -v\n                  /var/run/docker.sock:/var/run/docker.sock\n                  containrrr/watchtower -cR <容器名>": "1. Execute 'docker run --rm -v /var/run/docker.sock:/var/run/docker.sock containrrr/watchtower -cR <container_name>' on the host machine",
+  "2. 容器内执行 ql -l check、ql -l update": "2. Execute 'ql -l check' and 'ql -l update' inside the container",
+  "3. 如果无法解决，容器内执行 pm2 logs，拷贝执行结果": "3. If the problem persists, execute 'pm2 logs' inside the container and copy the results",
+  "提交 issue": "Submit an issue",
+  "启动中，请稍后...": "Starting, please wait...",
+  "欢迎使用": "Welcome to use",
+  "欢迎使用青龙": "Welcome to use Qinglong",
+  "支持python3、javascript、shell、typescript 的定时任务管理面板": "A scheduling task management panel that supports python3, javascript, shell, and typescript",
+  "开始安装": "Start Installation",
+  "账户设置": "Account Settings",
+  "用户名": "Username",
+  "密码": "Password",
+  "密码不能为admin": "The password cannot be 'admin'",
+  "确认密码": "Confirm Password",
+  "您输入的两个密码不匹配！": "The two passwords you entered do not match!",
+  "提交": "Submit",
+  "通知设置": "Notification Settings",
+  "通知方式": "Notification Method",
+  "请选择通知方式": "Please select a notification method",
+  "跳过": "Skip",
+  "完成安装": "Installation Completed",
+  "恭喜安装完成！": "Congratulations, the installation is completed!",
+  "Telegram频道": "Telegram Channel",
+  "去登录": "Go to Login",
+  "初始化配置": "Initialize Configuration",
+  "文件": "File",
+  "，删除后不可恢复": ", it can't be recovered after deletion",
+  "请选择日志": "Please select a log",
+  "请输入日志名": "Please enter the log name",
+  "暂无日志": "No logs available",
+  "登录成功！": "Login successful!",
+  "上次登录时间：": "Last login time: ",
+  "上次登录地点：": "Last login location: ",
+  "上次登录IP：": "Last login IP: ",
+  "上次登录设备：": "Last login device: ",
+  "上次登录状态：": "Last login status: ",
+  "验证码": "Verification Code",
+  "验证码为6位数字": "Verification code is a 6-digit number",
+  "6位数字": "6-digit number",
+  "验证": "Verify",
+  "请": "Please",
+  "秒后重试": "Retry after seconds",
+  "在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。": "Open the two-factor authentication application on your device to view your authentication code and verify your identity.",
+  "请选择脚本文件": "Please select a script file",
+  "清空日志": "Clear Logs",
+  "设置": "Settings",
+  "退出": "Exit",
+  "空文件": "Empty File",
+  "本地文件": "Local File",
+  "文件夹": "Folder",
+  "文件名": "File Name",
+  "请输入文件名": "Please enter the file name",
+  "文件名不能包含斜杠": "File names cannot contain slashes",
+  "文件夹名": "Folder Name",
+  "请输入文件夹名": "Please enter the folder name",
+  "父目录": "Parent Directory",
+  "请选择父目录": "Please select a parent directory",
+  "点击或者拖拽文件到此区域上传": "Click or drag files here to upload",
+  "当前修改未保存，确定离开吗": "The current changes are not saved. Are you sure you want to leave?",
+  "退出编辑": "Exit Editing",
+  "重命名": "Rename",
+  "请选择脚本": "Please select a script",
+  "调试": "Debug",
+  "请输入脚本名": "Please enter the script name",
+  "暂无脚本": "No scripts available",
+  "请输入新名称": "Please enter a new name",
+  "保存文件": "Save File",
+  "保存目录": "Save Directory",
+  "请输入保存目录，默认scripts目录": "Please enter the save directory, default is 'scripts'",
+  "运行设置": "Run Settings",
+  "待开发": "To Be Developed",
+  "开发版": "Developer Edition",
+  "正式版": "Official Edition",
+  "版本": "Version",
+  "更新日志": "Changelog",
+  "查看": "View",
+  "提交BUG": "Submit Bug",
+  "名称不能为保留关键字": "The name cannot be a reserved keyword",
+  "请输入应用名称": "Please enter the application name",
+  "权限": "Permission",
+  "请选择模块权限": "Please select module permissions",
+  "更新": "Update",
+  "已经是最新版了！": "It is already the latest version!",
+  "是目前检测到的最新可用版本了。": "It is the latest available version currently detected.",
+  "重新下载": "Redownload",
+  "更新可用": "Update Available",
+  "新版本": "Create Version",
+  "可用，你使用的版本为": "available, the version you are using is",
+  "下载更新": "Download Update",
+  "以后再说": "Later",
+  "下载更新中...": "Downloading Update...",
+  "确认重启": "Confirm to Restart",
+  "系统安装包下载成功，确认重启": "System installation package downloaded successfully, confirm to restart",
+  "重启": "Restart",
+  "系统将在": "The system will restart in",
+  "秒后自动刷新": "seconds and automatically refresh",
+  "检查更新": "Check for Updates",
+  "确认删除应用": "Confirm to delete the application",
+  "确认重置": "Confirm to reset",
+  "确认重置应用": "Confirm to reset the application",
+  "的Secret吗": "'s Secret?",
+  "重置Secret会让当前应用所有token失效": "Resetting the Secret will invalidate all tokens for the current application",
+  "创建应用": "Create Application",
+  "安全设置": "Security Settings",
+  "应用设置": "Application Settings",
+  "登录日志": "Login Logs",
+  "其他设置": "Other Settings",
+  "关于": "About",
+  "成功": "Success",
+  "失败": "Failure",
+  "登录时间": "Login Time",
+  "登录地址": "Login Address",
+  "登录IP": "Login IP",
+  "登录设备": "Login Device",
+  "登录状态": "Login Status",
+  "亮色": "Light",
+  "暗色": "Dark",
+  "跟随系统": "Follow System",
+  "备份数据上传成功，确认覆盖数据": "Data backup uploaded successfully, confirm data overwrite",
+  "主题设置": "Theme Settings",
+  "日志删除频率": "Log Deletion Frequency",
+  "每x天自动删除x天以前的日志": "Automatically delete logs older than x days every x days",
+  "每": "Every",
+  "天": "day(s)",
+  "定时任务并发数": "Concurrent Scheduled Tasks",
+  "数据备份还原": "Data Backup & Restore",
+  "还原数据": "Restore Data",
+  "第一步": "Step 1",
+  "下载两步验证手机应用，比如 Google Authenticator 、": "Download a two-factor authentication mobile app, like Google Authenticator,",
+  "第二步": "Step 2",
+  "使用手机应用扫描二维码，或者输入秘钥": "Scan the QR code with the mobile app or enter the key",
+  "第三步": "Step 3",
+  "输入手机应用上的6位数字": "Enter the 6-digit code from the mobile app",
+  "完成设置": "Finish Setup",
+  "修改用户名密码": "Change Username and Password",
+  "两步验证": "Two-Factor Authentication",
+  "头像": "Profile Picture",
+  "更换头像": "Change Profile Picture",
+  "时": "hour(s)",
+  "分": "minute(s)",
+  "秒": "second(s)",
+  "私有仓库": "Private Repository",
+  "公开仓库": "Public Repository",
+  "单文件": "Single File",
+  "链接": "Link",
+  "分支": "Branch",
+  "确认删除定时订阅": "Confirm Deletion of Scheduled Subscription",
+  "定时订阅": "Scheduled Subscription",
+  "创建订阅": "Create Subscription",
+  "私钥": "Private Key",
+  "请输入私钥": "Please enter the private key",
+  "请输入认证用户名": "Please enter the authentication username",
+  "Github已不支持密码认证，请使用Token方式": "Github no longer supports password authentication. Please use the Token method.",
+  "密码/Token": "Password/Token",
+  "请输入密码或者Token": "Please enter the password or Token",
+  "支持拷贝 ql repo/raw 命令，粘贴导入": "Supports copying ql repo/raw command for import",
+  "请输入订阅链接": "Please enter the subscription link",
+  "请输入分支": "Please enter the branch",
+  "唯一值": "Unique Value",
+  "唯一值用于日志目录和私钥别名": "Unique value used for log directory and private key alias",
+  "自动生成": "Auto-generated",
+  "拉取方式": "Pull Method",
+  "用户名密码/Token": "Username/Password or Token",
+  "定时类型": "Schedule Type",
+  "白名单": "Whitelist",
+  "多个关键词竖线分割，支持正则表达式": "Multiple keywords separated by vertical lines (|), supports regular expressions",
+  "请输入脚本筛选白名单关键词，多个关键词竖线分割": "Please enter script filtering whitelist keywords, multiple keywords separated by vertical lines (|)",
+  "黑名单": "Blacklist",
+  "请输入脚本筛选黑名单关键词，多个关键词竖线分割": "Please enter script filtering blacklist keywords, multiple keywords separated by vertical lines (|)",
+  "依赖文件": "Dependency Files",
+  "请输入脚本依赖文件关键词，多个关键词竖线分割": "Please enter script dependency file keywords, multiple keywords separated by vertical lines (|)",
+  "文件后缀": "File Extension",
+  "仓库需要拉取的文件后缀，多个后缀空格分隔，默认使用配置文件中的RepoFileExtensions": "Repository requires pulling specific file extensions, multiple extensions separated by spaces, uses RepoFileExtensions from the configuration file by default",
+  "请输入文件后缀": "Please enter the file extension",
+  "执行前": "Before Execution",
+  "运行订阅前执行的命令，比如 cp/mv/python3 xxx.py/node xxx.js": "Run commands before executing the subscription, e.g., cp/mv/python3 xxx.py/node xxx.js",
+  "请输入运行订阅前要执行的命令": "Please enter the command to run before executing the subscription",
+  "执行后": "After Execution",
+  "运行订阅后执行的命令，比如 cp/mv/python3 xxx.py/node xxx.js": "Run commands after executing the subscription, e.g., cp/mv/python3 xxx.py/node xxx.js",
+  "请输入运行订阅后要执行的命令": "Please enter the command to run after executing the subscription",
+  "代理": "Proxy",
+  "公开仓库支持HTTP/SOCK5代理，私有仓库支持SOCK5代理": "Public repositories support HTTP/SOCK5 proxies, private repositories support SOCK5 proxies",
+  "自动添加任务": "Automatically Add Tasks",
+  "自动删除任务": "Automatically Delete Tasks",
+  "中文": "Chinese",
+  "系统信息": "System Information",
+  "Server酱": "ServerChan",
+  "Telegram机器人": "Telegram Bot",
+  "钉钉机器人": "DingTalk Bot",
+  "企业微信机器人": "WeChat Work Bot",
+  "企业微信应用": "WeChat Work App",
+  "智能微秘书": "Smart WeChat Assistant",
+  "群晖chat": "Synology Chat",
+  "邮箱": "Email",
+  "飞书机器人": "Feishu Bot",
+  "自定义通知": "Custom Notification",
+  "已关闭": "Disabled",
+  "gotify的url地址，例如 https://push.example.de:8080": "gotify URL address, e.g., https://push.example.de:8080",
+  "gotify的消息应用token码": "gotify message application token code",
+  "推送消息的优先级": "Priority of Push Messages",
+  "chat的url地址": "Chat URL address",
+  "chat的token码": "Chat token code",
+  "推送到个人QQ: http://127.0.0.1/send_private_msg，群：http://127.0.0.1/send_group_msg": "Push to personal QQ: http://127.0.0.1/send_private_msg, group: http://127.0.0.1/send_group_msg",
+  "访问密钥": "Access Key",
+  "如果GOBOT_URL设置 /send_private_msg 则需要填入 user_id=个人QQ 相反如果是 /send_group_msg 则需要填入 group_id=QQ群": "If GOBOT_URL is set to /send_private_msg, enter user_id=personal QQ; if set to /send_group_msg, enter group_id=QQ group",
+  "Server酱SENDKEY": "ServerChan SENDKEY",
+  "PushDeer的Key，https://github.com/easychen/pushdeer": "PushDeer Key, https://github.com/easychen/pushdeer",
+  "PushDeer的自架API endpoint，默认是 https://api2.pushdeer.com/message/push": "PushDeer's self-hosted API endpoint, default is https://api2.pushdeer.com/message/push",
+  "Bark的信息IP/设备码，例如：https://api.day.app/XXXXXXXX": "Bark information IP/device code, e.g., https://api.day.app/XXXXXXXX",
+  "BARK推送图标，自定义推送图标 (需iOS15或以上才能显示)": "BARK push icon, custom push icon (requires iOS 15 or above to display)",
+  "BARK推送铃声，铃声列表去APP查看复制填写": "BARK push ringtone, check and copy from the APP's ringtone list",
+  "BARK推送消息的分组，默认为qinglong": "BARK push message grouping, default is qinglong",
+  "telegram机器人的token，例如：1077xxx4424:AAFjv0FcqxxxxxxgEMGfi22B4yh15R5uw": "Telegram Bot token, e.g., 1077xxx4424:AAFjv0FcqxxxxxxgEMGfi22B4yh15R5uw",
+  "telegram用户的id，例如：129xxx206": "Telegram user ID, e.g., 129xxx206",
+  "代理IP": "Proxy IP",
+  "代理端口": "Proxy Port",
+  "telegram代理配置认证参数，用户名与密码用英文冒号连接 user:password": "Telegram proxy configuration authentication parameters, connect username and password with a colon, e.g., user:password",
+  "telegram api自建的反向代理地址，默认tg官方api": "Telegram API's self-built reverse proxy address, default is official tg API",
+  "钉钉机器人webhook token，例如：5a544165465465645d0f31dca676e7bd07415asdasd": "DingTalk Bot webhook token, e.g., 5a544165465465645d0f31dca676e7bd07415asdasd",
+  "密钥，机器人安全设置页面，加签一栏下面显示的SEC开头的字符串": "Secret key, shown below the signing section on the robot's security settings page, starts with SEC",
+  "企业微信机器人的webhook(详见文档 https://work.weixin.qq.com/api/doc/90000/90136/91770)，例如：693a91f6-7xxx-4bc4-97a0-0ec2sifa5aaa": "WeChat Work Bot webhook (see documentation at https://work.weixin.qq.com/api/doc/90000/90136/91770), e.g., 693a91f6-7xxx-4bc4-97a0-0ec2sifa5aaa",
+  "企业微信代理地址": "WeChat Work Proxy Address",
+  "corpid、corpsecret、touser(注:多个成员ID使用|隔开)、agentid、消息类型(选填，不填默认文本消息类型) 注意用,号隔开(英文输入法的逗号)，例如：wwcfrs,B-76WERQ,qinglong,1000001,2COat": "corpid, corpsecret, touser (note: separate multiple member IDs with |), agentid, message type (optional, defaults to text message type) – separated by commas (`,`), e.g., wwcfrs, B-76WERQ, qinglong, 1000001, 2COat",
+  "密钥key，智能微秘书个人中心获取apikey，申请地址：https://wechat.aibotk.com/signup?from=ql": "Key, obtain the API key from the Smart WeChat Assistant's personal center, apply at: https://wechat.aibotk.com/signup?from=ql",
+  "发送的目标，群组或者好友": "Recipient, group, or friend",
+  "请输入要发送的目标": "Please enter the recipient's name (group or friend)",
+  "群聊": "Group Chat",
+  "好友": "Friend",
+  "要发送的用户昵称或群名，如果目标是群，需要填群名，如果目标是好友，需要填好友昵称": "Enter the recipient's nickname if it's a friend or the group name if it's a group",
+  "iGot的信息推送key，例如：https://push.hellyw.com/XXXXXXXX": "iGot information push key, e.g., https://push.hellyw.com/XXXXXXXX",
+  "微信扫码登录后一对一推送或一对多推送下面的token(您的Token)，不提供PUSH_PLUS_USER则默认为一对一推送，参考 https://www.pushplus.plus/": "After WeChat scan login, one-to-one or one-to-many push using the provided token (your Token). If PUSH_PLUS_USER is not provided, it defaults to one-to-one push. See reference at https://www.pushplus.plus/",
+  "一对多推送的“群组编码”（一对多推送下面->您的群组(如无则创建)->群组编码，如果您是创建群组人。也需点击“查看二维码”扫描绑定，否则不能接受群组消息推送）": "The 'group code' for one-to-many push (one-to-many push -> your group (if none, create one) -> group code). If you are the creator of the group, you need to click 'View QR code' to scan and bind, otherwise, you won't receive group messages.",
+  "飞书群组机器人：https://www.feishu.cn/hc/zh-CN/articles/360024984973": "Feishu group bot: https://www.feishu.cn/hc/zh-CN/articles/360024984973",
+  "邮箱服务名称，比如126、163、Gmail、QQ等，支持列表https://nodemailer.com/smtp/well-known/": "Email service name, e.g., 126, 163, Gmail, QQ, etc. Supported list: https://nodemailer.com/smtp/well-known/",
+  "邮箱地址": "Email Address",
+  "邮箱SMTP授权码": "Email SMTP Authorization Code",
+  "PushMe的Key，https://push.i-i.me/": "PushMe key, https://push.i-i.me/",
+  "请求方法": "Request Method",
+  "请求头Content-Type": "Request Header Content-Type",
+  "请求链接以http或者https开头。url或者body中必须包含$title，$content可选，对应api内容的位置": "Request URL should start with http or https. URL or body must contain $title, $content is optional and corresponds to the API content position.",
+  "请求头格式Custom-Header1: Header1，多个换行分割": "Request header format: Custom-Header1: Header1 (separate multiple headers with line breaks)",
+  "请求体格式key1: value1，多个换行分割。url或者body中必须包含$title，$content可选，对应api内容的位置": "Request body format: key1: value1 (separate multiple keys with line breaks). URL or body must contain $title, $content is optional and corresponds to the API content position.",
+  "错误日志": "Error Log",
+  "执行结束": "Execution Finished",
+  "备份": "Backup",
+  "生成数据中...": "Generating data...",
+  "请选择日志文件": "Please select a log file",
+  "筛选条件": "Filter Conditions",
+  "系统": "System",
+  "个人": "Personal",
+  "重新安装": "Reinstall",
+  "强制删除": "Force Delete",
+  "全部任务": "All Tasks",
+  "关联订阅": "Associate Subscription",
+  "订阅": "Subscription",
+  "创建": "Create",
+  "同时删除关联任务和脚本": "Delete associated tasks and scripts as well",
+  "未找到": "Not Found",
+  "保存成功": "Saved successfully",
+  "删除成功": "Deleted successfully",
+  "批量删除成功": "Batch deleted successfully",
+  "启动中...": "Starting...",
+  "任务未运行": "Task not running",
+  "更新任务成功": "Task updated successfully",
+  "创建任务成功": "Task created successfully",
+  "编辑任务": "Edit Task",
+  "Cron表达式格式有误": "Incorrect Cron Expression Format",
+  "添加Labels成功": "Labels added successfully",
+  "删除Labels成功": "Labels deleted successfully",
+  "编辑视图": "Edit View",
+  "排序方式": "Sort Order",
+  "开始时间": "Start Time",
+  "安装": "Install",
+  "结束时间": "End Time",
+  "编辑依赖": "Edit Dependency",
+  "更新环境变量名称成功": "Environment Variable Name updated successfully",
+  "更新变量成功": "Variable updated successfully",
+  "创建变量成功": "Variable created successfully",
+  "编辑变量": "Edit Variable",
+  "加载中...": "Loading...",
+  "夹下所以日志": "Folder and All Subfiles",
+  "创建文件夹成功": "Folder created successfully",
+  "创建文件成功": "File created successfully",
+  "夹及其子文件": "Folder and Its Subfiles",
+  "更新名称成功": "Name updated successfully",
+  "保存文件成功": "File saved successfully",
+  "更新应用成功": "Application updated successfully",
+  "创建应用成功": "Application created successfully",
+  "编辑应用": "Edit Application",
+  "检查更新中...": "Checking for updates...",
+  "失败，请检查": "Failed, please check",
+  "更新失败，请检查网络及日志或稍后再试": "Update failed, please check network and logs or try again later",
+  "更新包下载成功": "Update package download successful",
+  "重置secret": "Reset secret",
+  "重置成功": "Reset successful",
+  "通知发送成功": "Notification sent successfully",
+  "通知关闭成功": "Notification closed successfully",
+  "测试中...": "Testing...",
+  "上传": "Upload",
+  "下载": "Download",
+  "更新成功": "Update successful",
+  "激活成功": "Activation successful",
+  "验证失败": "Validation failed",
+  "更新订阅成功": "Subscription updated successfully",
+  "创建订阅成功": "Subscription created successfully",
+  "编辑订阅": "Edit Subscription",
+  "Subscription表达式格式有误": "Incorrect Subscription Expression Format",
+  "一对多推送的“群组编码”（一对多推送下面->您的群组(如无则新建)->群组编码，如果您是创建群组人。也需点击“查看二维码”扫描绑定，否则不能接受群组消息推送）": "The 'Group Code' for One-to-Many Push (Below One-to-Many Push->Your Group (if not, create one)->Group Code, if you are the creator of the group, you also need to click 'View QR Code' to scan and bind, otherwise you cannot receive group messages)",
+  "登录已过期，请重新登录": "Login session has expired, please log in again",
+  "系统日志": "System Logs",
+  "主题": "Theme",
+  "语言": "Language"
+}

src/locales/zh-CN.json

@@ -0,0 +1,455 @@
+{
+  "复制成功": "复制成功",
+  "复制": "复制",
+  "新建": "新建",
+  "登录": "登录",
+  "初始化": "初始化",
+  "错误": "错误",
+  "定时任务": "定时任务",
+  "订阅管理": "订阅管理",
+  "环境变量": "环境变量",
+  "配置文件": "配置文件",
+  "脚本管理": "脚本管理",
+  "依赖管理": "依赖管理",
+  "日志管理": "日志管理",
+  "对比工具": "对比工具",
+  "系统设置": "系统设置",
+  "退出登录": "退出登录",
+  "青龙": "青龙",
+  "返回首页": "返回首页",
+  "保存": "保存",
+  "日志": "日志",
+  "脚本": "脚本",
+  "确认保存文件": "确认保存文件",
+  "，保存后不可恢复": "，保存后不可恢复",
+  "确认运行": "确认运行",
+  "确认运行定时任务": "确认运行定时任务",
+  "吗": "吗",
+  "确认停止": "确认停止",
+  "确认停止定时任务": "确认停止定时任务",
+  "确认": "确认",
+  "任务": "任务",
+  "状态": "状态",
+  "空闲中": "空闲中",
+  "运行中": "运行中",
+  "队列中": "队列中",
+  "已禁用": "已禁用",
+  "定时": "定时",
+  "最后运行时间": "最后运行时间",
+  "最后运行时长": "最后运行时长",
+  "下次运行时间": "下次运行时间",
+  "名称": "名称",
+  "命令/脚本": "命令/脚本",
+  "定时规则": "定时规则",
+  "操作": "操作",
+  "确认删除": "确认删除",
+  "确认删除定时任务": "确认删除定时任务",
+  "编辑": "编辑",
+  "删除": "删除",
+  "确认删除选中的定时任务吗": "确认删除选中的定时任务吗",
+  "选中的定时任务吗": "选中的定时任务吗",
+  "创建视图": "创建视图",
+  "视图管理": "视图管理",
+  "请输入名称或者关键词": "请输入名称或者关键词",
+  "创建任务": "创建任务",
+  "更多": "更多",
+  "批量删除": "批量删除",
+  "批量启用": "批量启用",
+  "批量禁用": "批量禁用",
+  "批量运行": "批量运行",
+  "批量停止": "批量停止",
+  "批量置顶": "批量置顶",
+  "批量取消置顶": "批量取消置顶",
+  "批量修改标签": "批量修改标签",
+  "已选择": "已选择",
+  "项": "项",
+  "知道了": "知道了",
+  "请输入任务名称": "请输入任务名称",
+  "支持输入脚本路径/任意系统可执行命令/task 脚本路径": "支持输入脚本路径/任意系统可执行命令/task 脚本路径",
+  "秒(可选) 分 时 天 月 周": "秒(可选) 分 时 天 月 周",
+  "标签": "标签",
+  "取消": "取消",
+  "添加": "添加",
+  "启用": "启用",
+  "禁用": "禁用",
+  "运行": "运行",
+  "停止": "停止",
+  "置顶": "置顶",
+  "取消置顶": "取消置顶",
+  "命令": "命令",
+  "包含": "包含",
+  "不包含": "不包含",
+  "属于": "属于",
+  "不属于": "不属于",
+  "顺序": "顺序",
+  "倒序": "倒序",
+  "且": "且",
+  "或": "或",
+  "输入后回车增加自定义选项": "输入后回车增加自定义选项",
+  "视图名称": "视图名称",
+  "请输入视图名称": "请输入视图名称",
+  "请输入内容": "请输入内容",
+  "新增筛选条件": "新增筛选条件",
+  "新增排序方式": "新增排序方式",
+  "类型": "类型",
+  "显示": "显示",
+  "确认删除视图": "确认删除视图",
+  "安装中": "安装中",
+  "已安装": "已安装",
+  "安装失败": "安装失败",
+  "删除中": "删除中",
+  "已删除": "已删除",
+  "删除失败": "删除失败",
+  "序号": "序号",
+  "备注": "备注",
+  "更新时间": "更新时间",
+  "创建时间": "创建时间",
+  "确认删除依赖": "确认删除依赖",
+  "确认重新安装": "确认重新安装",
+  "确认删除选中的依赖吗": "确认删除选中的依赖吗",
+  "确认重新安装选中的依赖吗": "确认重新安装选中的依赖吗",
+  "请输入名称": "请输入名称",
+  "创建依赖": "创建依赖",
+  "批量安装": "批量安装",
+  "批量强制删除": "批量强制删除",
+  "日志 -": "日志 -",
+  "依赖类型": "依赖类型",
+  "自动拆分": "自动拆分",
+  "多个依赖是否换行分割": "多个依赖是否换行分割",
+  "是": "是",
+  "否": "否",
+  "请输入依赖名称，支持指定版本": "请输入依赖名称，支持指定版本",
+  "请输入依赖名称": "请输入依赖名称",
+  "请输入备注": "请输入备注",
+  "源文件": "源文件",
+  "当前文件": "当前文件",
+  "修改环境变量名称": "修改环境变量名称",
+  "请输入新的环境变量名称": "请输入新的环境变量名称",
+  "已启用": "已启用",
+  "值": "值",
+  "确认删除变量": "确认删除变量",
+  "确认删除选中的变量吗": "确认删除选中的变量吗",
+  "选中的变量吗": "选中的变量吗",
+  "请输入名称/值/备注": "请输入名称/值/备注",
+  "导入": "导入",
+  "创建变量": "创建变量",
+  "批量修改变量名称": "批量修改变量名称",
+  "批量导出": "批量导出",
+  "请输入环境变量名称": "请输入环境变量名称",
+  "只能输入字母数字下划线，且不能以数字开头": "只能输入字母数字下划线，且不能以数字开头",
+  "请输入环境变量值": "请输入环境变量值",
+  "服务启动超时": "服务启动超时",
+  "请先按如下方式修复：": "请先按如下方式修复：",
+  "1. 宿主机执行 docker run --rm -v\n                  /var/run/docker.sock:/var/run/docker.sock\n                  containrrr/watchtower -cR <容器名>": "1. 宿主机执行 docker run --rm -v\n                  /var/run/docker.sock:/var/run/docker.sock\n                  containrrr/watchtower -cR <容器名>",
+  "2. 容器内执行 ql -l check、ql -l update": "2. 容器内执行 ql -l check、ql -l update",
+  "3. 如果无法解决，容器内执行 pm2 logs，拷贝执行结果": "3. 如果无法解决，容器内执行 pm2 logs，拷贝执行结果",
+  "提交 issue": "提交 issue",
+  "启动中，请稍后...": "启动中，请稍后...",
+  "欢迎使用": "欢迎使用",
+  "欢迎使用青龙": "欢迎使用青龙",
+  "支持python3、javascript、shell、typescript 的定时任务管理面板": "支持python3、javascript、shell、typescript 的定时任务管理面板",
+  "开始安装": "开始安装",
+  "账户设置": "账户设置",
+  "用户名": "用户名",
+  "密码": "密码",
+  "密码不能为admin": "密码不能为admin",
+  "确认密码": "确认密码",
+  "您输入的两个密码不匹配！": "您输入的两个密码不匹配！",
+  "提交": "提交",
+  "通知设置": "通知设置",
+  "通知方式": "通知方式",
+  "请选择通知方式": "请选择通知方式",
+  "跳过": "跳过",
+  "完成安装": "完成安装",
+  "恭喜安装完成！": "恭喜安装完成！",
+  "Telegram频道": "Telegram频道",
+  "去登录": "去登录",
+  "初始化配置": "初始化配置",
+  "文件": "文件",
+  "，删除后不可恢复": "，删除后不可恢复",
+  "请选择日志": "请选择日志",
+  "请输入日志名": "请输入日志名",
+  "暂无日志": "暂无日志",
+  "登录成功！": "登录成功！",
+  "上次登录时间：": "上次登录时间：",
+  "上次登录地点：": "上次登录地点：",
+  "上次登录IP：": "上次登录IP：",
+  "上次登录设备：": "上次登录设备：",
+  "上次登录状态：": "上次登录状态：",
+  "验证码": "验证码",
+  "验证码为6位数字": "验证码为6位数字",
+  "6位数字": "6位数字",
+  "验证": "验证",
+  "请": "请",
+  "秒后重试": "秒后重试",
+  "在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。": "在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。",
+  "请选择脚本文件": "请选择脚本文件",
+  "清空日志": "清空日志",
+  "设置": "设置",
+  "退出": "退出",
+  "空文件": "空文件",
+  "本地文件": "本地文件",
+  "文件夹": "文件夹",
+  "文件名": "文件名",
+  "请输入文件名": "请输入文件名",
+  "文件名不能包含斜杠": "文件名不能包含斜杠",
+  "文件夹名": "文件夹名",
+  "请输入文件夹名": "请输入文件夹名",
+  "父目录": "父目录",
+  "请选择父目录": "请选择父目录",
+  "点击或者拖拽文件到此区域上传": "点击或者拖拽文件到此区域上传",
+  "当前修改未保存，确定离开吗": "当前修改未保存，确定离开吗",
+  "退出编辑": "退出编辑",
+  "重命名": "重命名",
+  "请选择脚本": "请选择脚本",
+  "调试": "调试",
+  "请输入脚本名": "请输入脚本名",
+  "暂无脚本": "暂无脚本",
+  "请输入新名称": "请输入新名称",
+  "保存文件": "保存文件",
+  "保存目录": "保存目录",
+  "请输入保存目录，默认scripts目录": "请输入保存目录，默认scripts目录",
+  "运行设置": "运行设置",
+  "待开发": "待开发",
+  "开发版": "开发版",
+  "正式版": "正式版",
+  "版本": "版本",
+  "更新日志": "更新日志",
+  "查看": "查看",
+  "提交BUG": "提交BUG",
+  "名称不能为保留关键字": "名称不能为保留关键字",
+  "请输入应用名称": "请输入应用名称",
+  "权限": "权限",
+  "请选择模块权限": "请选择模块权限",
+  "更新": "更新",
+  "已经是最新版了！": "已经是最新版了！",
+  "是目前检测到的最新可用版本了。": "是目前检测到的最新可用版本了。",
+  "重新下载": "重新下载",
+  "更新可用": "更新可用",
+  "新版本": "新版本",
+  "可用，你使用的版本为": "可用，你使用的版本为",
+  "下载更新": "下载更新",
+  "以后再说": "以后再说",
+  "下载更新中...": "下载更新中...",
+  "确认重启": "确认重启",
+  "系统安装包下载成功，确认重启": "系统安装包下载成功，确认重启",
+  "重启": "重启",
+  "系统将在": "系统将在",
+  "秒后自动刷新": "秒后自动刷新",
+  "检查更新": "检查更新",
+  "确认删除应用": "确认删除应用",
+  "确认重置": "确认重置",
+  "确认重置应用": "确认重置应用",
+  "的Secret吗": "的Secret吗",
+  "重置Secret会让当前应用所有token失效": "重置Secret会让当前应用所有token失效",
+  "创建应用": "创建应用",
+  "安全设置": "安全设置",
+  "应用设置": "应用设置",
+  "登录日志": "登录日志",
+  "其他设置": "其他设置",
+  "关于": "关于",
+  "成功": "成功",
+  "失败": "失败",
+  "登录时间": "登录时间",
+  "登录地址": "登录地址",
+  "登录IP": "登录IP",
+  "登录设备": "登录设备",
+  "登录状态": "登录状态",
+  "亮色": "亮色",
+  "暗色": "暗色",
+  "跟随系统": "跟随系统",
+  "备份数据上传成功，确认覆盖数据": "备份数据上传成功，确认覆盖数据",
+  "主题设置": "主题设置",
+  "日志删除频率": "日志删除频率",
+  "每x天自动删除x天以前的日志": "每x天自动删除x天以前的日志",
+  "每": "每",
+  "天": "天",
+  "定时任务并发数": "定时任务并发数",
+  "数据备份还原": "数据备份还原",
+  "还原数据": "还原数据",
+  "第一步": "第一步",
+  "下载两步验证手机应用，比如 Google Authenticator 、": "下载两步验证手机应用，比如 Google Authenticator 、",
+  "第二步": "第二步",
+  "使用手机应用扫描二维码，或者输入秘钥": "使用手机应用扫描二维码，或者输入秘钥",
+  "第三步": "第三步",
+  "输入手机应用上的6位数字": "输入手机应用上的6位数字",
+  "完成设置": "完成设置",
+  "修改用户名密码": "修改用户名密码",
+  "两步验证": "两步验证",
+  "头像": "头像",
+  "更换头像": "更换头像",
+  "时": "时",
+  "分": "分",
+  "秒": "秒",
+  "私有仓库": "私有仓库",
+  "公开仓库": "公开仓库",
+  "单文件": "单文件",
+  "链接": "链接",
+  "分支": "分支",
+  "确认删除定时订阅": "确认删除定时订阅",
+  "定时订阅": "定时订阅",
+  "创建订阅": "创建订阅",
+  "私钥": "私钥",
+  "请输入私钥": "请输入私钥",
+  "请输入认证用户名": "请输入认证用户名",
+  "Github已不支持密码认证，请使用Token方式": "Github已不支持密码认证，请使用Token方式",
+  "密码/Token": "密码/Token",
+  "请输入密码或者Token": "请输入密码或者Token",
+  "支持拷贝 ql repo/raw 命令，粘贴导入": "支持拷贝 ql repo/raw 命令，粘贴导入",
+  "请输入订阅链接": "请输入订阅链接",
+  "请输入分支": "请输入分支",
+  "唯一值": "唯一值",
+  "唯一值用于日志目录和私钥别名": "唯一值用于日志目录和私钥别名",
+  "自动生成": "自动生成",
+  "拉取方式": "拉取方式",
+  "用户名密码/Token": "用户名密码/Token",
+  "定时类型": "定时类型",
+  "白名单": "白名单",
+  "多个关键词竖线分割，支持正则表达式": "多个关键词竖线分割，支持正则表达式",
+  "请输入脚本筛选白名单关键词，多个关键词竖线分割": "请输入脚本筛选白名单关键词，多个关键词竖线分割",
+  "黑名单": "黑名单",
+  "请输入脚本筛选黑名单关键词，多个关键词竖线分割": "请输入脚本筛选黑名单关键词，多个关键词竖线分割",
+  "依赖文件": "依赖文件",
+  "请输入脚本依赖文件关键词，多个关键词竖线分割": "请输入脚本依赖文件关键词，多个关键词竖线分割",
+  "文件后缀": "文件后缀",
+  "仓库需要拉取的文件后缀，多个后缀空格分隔，默认使用配置文件中的RepoFileExtensions": "仓库需要拉取的文件后缀，多个后缀空格分隔，默认使用配置文件中的RepoFileExtensions",
+  "请输入文件后缀": "请输入文件后缀",
+  "执行前": "执行前",
+  "运行订阅前执行的命令，比如 cp/mv/python3 xxx.py/node xxx.js": "运行订阅前执行的命令，比如 cp/mv/python3 xxx.py/node xxx.js",
+  "请输入运行订阅前要执行的命令": "请输入运行订阅前要执行的命令",
+  "执行后": "执行后",
+  "运行订阅后执行的命令，比如 cp/mv/python3 xxx.py/node xxx.js": "运行订阅后执行的命令，比如 cp/mv/python3 xxx.py/node xxx.js",
+  "请输入运行订阅后要执行的命令": "请输入运行订阅后要执行的命令",
+  "代理": "代理",
+  "公开仓库支持HTTP/SOCK5代理，私有仓库支持SOCK5代理": "公开仓库支持HTTP/SOCK5代理，私有仓库支持SOCK5代理",
+  "自动添加任务": "自动添加任务",
+  "自动删除任务": "自动删除任务",
+  "中文": "中文",
+  "系统信息": "系统信息",
+  "Server酱": "Server酱",
+  "Telegram机器人": "Telegram机器人",
+  "钉钉机器人": "钉钉机器人",
+  "企业微信机器人": "企业微信机器人",
+  "企业微信应用": "企业微信应用",
+  "智能微秘书": "智能微秘书",
+  "群晖chat": "群晖chat",
+  "邮箱": "邮箱",
+  "飞书机器人": "飞书机器人",
+  "自定义通知": "自定义通知",
+  "已关闭": "已关闭",
+  "gotify的url地址，例如 https://push.example.de:8080": "gotify的url地址，例如 https://push.example.de:8080",
+  "gotify的消息应用token码": "gotify的消息应用token码",
+  "推送消息的优先级": "推送消息的优先级",
+  "chat的url地址": "chat的url地址",
+  "chat的token码": "chat的token码",
+  "推送到个人QQ: http://127.0.0.1/send_private_msg，群：http://127.0.0.1/send_group_msg": "推送到个人QQ: http://127.0.0.1/send_private_msg，群：http://127.0.0.1/send_group_msg",
+  "访问密钥": "访问密钥",
+  "如果GOBOT_URL设置 /send_private_msg 则需要填入 user_id=个人QQ 相反如果是 /send_group_msg 则需要填入 group_id=QQ群": "如果GOBOT_URL设置 /send_private_msg 则需要填入 user_id=个人QQ 相反如果是 /send_group_msg 则需要填入 group_id=QQ群",
+  "Server酱SENDKEY": "Server酱SENDKEY",
+  "PushDeer的Key，https://github.com/easychen/pushdeer": "PushDeer的Key，https://github.com/easychen/pushdeer",
+  "PushDeer的自架API endpoint，默认是 https://api2.pushdeer.com/message/push": "PushDeer的自架API endpoint，默认是 https://api2.pushdeer.com/message/push",
+  "Bark的信息IP/设备码，例如：https://api.day.app/XXXXXXXX": "Bark的信息IP/设备码，例如：https://api.day.app/XXXXXXXX",
+  "BARK推送图标，自定义推送图标 (需iOS15或以上才能显示)": "BARK推送图标，自定义推送图标 (需iOS15或以上才能显示)",
+  "BARK推送铃声，铃声列表去APP查看复制填写": "BARK推送铃声，铃声列表去APP查看复制填写",
+  "BARK推送消息的分组，默认为qinglong": "BARK推送消息的分组，默认为qinglong",
+  "telegram机器人的token，例如：1077xxx4424:AAFjv0FcqxxxxxxgEMGfi22B4yh15R5uw": "telegram机器人的token，例如：1077xxx4424:AAFjv0FcqxxxxxxgEMGfi22B4yh15R5uw",
+  "telegram用户的id，例如：129xxx206": "telegram用户的id，例如：129xxx206",
+  "代理IP": "代理IP",
+  "代理端口": "代理端口",
+  "telegram代理配置认证参数，用户名与密码用英文冒号连接 user:password": "telegram代理配置认证参数, 用户名与密码用英文冒号连接 user:password",
+  "telegram api自建的反向代理地址，默认tg官方api": "telegram api自建的反向代理地址，默认tg官方api",
+  "钉钉机器人webhook token，例如：5a544165465465645d0f31dca676e7bd07415asdasd": "钉钉机器人webhook token，例如：5a544165465465645d0f31dca676e7bd07415asdasd",
+  "密钥，机器人安全设置页面，加签一栏下面显示的SEC开头的字符串": "密钥，机器人安全设置页面，加签一栏下面显示的SEC开头的字符串",
+  "企业微信机器人的webhook(详见文档 https://work.weixin.qq.com/api/doc/90000/90136/91770)，例如：693a91f6-7xxx-4bc4-97a0-0ec2sifa5aaa": "企业微信机器人的 webhook(详见文档 https://work.weixin.qq.com/api/doc/90000/90136/91770)，例如：693a91f6-7xxx-4bc4-97a0-0ec2sifa5aaa",
+  "企业微信代理地址": "企业微信代理地址",
+  "corpid、corpsecret、touser(注:多个成员ID使用|隔开)、agentid、消息类型(选填，不填默认文本消息类型) 注意用,号隔开(英文输入法的逗号)，例如：wwcfrs,B-76WERQ,qinglong,1000001,2COat": "corpid,corpsecret,touser(注:多个成员ID使用|隔开),agentid,消息类型(选填,不填默认文本消息类型) 注意用,号隔开(英文输入法的逗号)，例如：wwcfrs,B-76WERQ,qinglong,1000001,2COat",
+  "密钥key，智能微秘书个人中心获取apikey，申请地址：https://wechat.aibotk.com/signup?from=ql": "密钥key,智能微秘书个人中心获取apikey，申请地址：https://wechat.aibotk.com/signup?from=ql",
+  "发送的目标，群组或者好友": "发送的目标，群组或者好友",
+  "请输入要发送的目标": "请输入要发送的目标",
+  "群聊": "群聊",
+  "好友": "好友",
+  "要发送的用户昵称或群名，如果目标是群，需要填群名，如果目标是好友，需要填好友昵称": "要发送的用户昵称或群名，如果目标是群，需要填群名，如果目标是好友，需要填好友昵称",
+  "iGot的信息推送key，例如：https://push.hellyw.com/XXXXXXXX": "iGot的信息推送key，例如：https://push.hellyw.com/XXXXXXXX",
+  "微信扫码登录后一对一推送或一对多推送下面的token(您的Token)，不提供PUSH_PLUS_USER则默认为一对一推送，参考 https://www.pushplus.plus/": "微信扫码登录后一对一推送或一对多推送下面的token(您的Token)，不提供PUSH_PLUS_USER则默认为一对一推送，参考 https://www.pushplus.plus/",
+  "一对多推送的“群组编码”（一对多推送下面->您的群组(如无则创建)->群组编码，如果您是创建群组人。也需点击“查看二维码”扫描绑定，否则不能接受群组消息推送）": "一对多推送的“群组编码”（一对多推送下面->您的群组(如无则创建)->群组编码，如果您是创建群组人。也需点击“查看二维码”扫描绑定，否则不能接受群组消息推送）",
+  "飞书群组机器人：https://www.feishu.cn/hc/zh-CN/articles/360024984973": "飞书群组机器人：https://www.feishu.cn/hc/zh-CN/articles/360024984973",
+  "邮箱服务名称，比如126、163、Gmail、QQ等，支持列表https://nodemailer.com/smtp/well-known/": "邮箱服务名称，比如126、163、Gmail、QQ等，支持列表https://nodemailer.com/smtp/well-known/",
+  "邮箱地址": "邮箱地址",
+  "邮箱SMTP授权码": "邮箱SMTP授权码",
+  "PushMe的Key，https://push.i-i.me/": "PushMe的Key，https://push.i-i.me/",
+  "请求方法": "请求方法",
+  "请求头Content-Type": "请求头Content-Type",
+  "请求链接以http或者https开头。url或者body中必须包含$title，$content可选，对应api内容的位置": "请求链接以http或者https开头。url或者body中必须包含$title，$content可选，对应api内容的位置",
+  "请求头格式Custom-Header1: Header1，多个换行分割": "请求头格式Custom-Header1: Header1，多个换行分割",
+  "请求体格式key1: value1，多个换行分割。url或者body中必须包含$title，$content可选，对应api内容的位置": "请求体格式key1: value1，多个换行分割。url或者body中必须包含$title，$content可选，对应api内容的位置",
+  "错误日志": "错误日志",
+  "执行结束": "执行结束",
+  "备份": "备份",
+  "生成数据中...": "生成数据中...",
+  "请选择日志文件": "请选择日志文件",
+  "筛选条件": "筛选条件",
+  "系统": "系统",
+  "个人": "个人",
+  "重新安装": "重新安装",
+  "强制删除": "强制删除",
+  "全部任务": "全部任务",
+  "关联订阅": "关联订阅",
+  "订阅": "订阅",
+  "创建": "创建",
+  "同时删除关联任务和脚本": "同时删除关联任务和脚本",
+  "未找到": "未找到",
+  "保存成功": "保存成功",
+  "删除成功": "删除成功",
+  "批量删除成功": "批量删除成功",
+  "启动中...": "启动中...",
+  "任务未运行": "任务未运行",
+  "更新任务成功": "更新任务成功",
+  "创建任务成功": "创建任务成功",
+  "编辑任务": "编辑任务",
+  "Cron表达式格式有误": "Cron表达式格式有误",
+  "添加Labels成功": "添加Labels成功",
+  "删除Labels成功": "删除Labels成功",
+  "编辑视图": "编辑视图",
+  "排序方式": "排序方式",
+  "开始时间": "开始时间",
+  "安装": "安装",
+  "结束时间": "结束时间",
+  "编辑依赖": "编辑依赖",
+  "更新环境变量名称成功": "更新环境变量名称成功",
+  "更新变量成功": "更新变量成功",
+  "创建变量成功": "创建变量成功",
+  "编辑变量": "编辑变量",
+  "加载中...": "加载中...",
+  "夹下所以日志": "夹下所以日志",
+  "创建文件夹成功": "创建文件夹成功",
+  "创建文件成功": "创建文件成功",
+  "夹及其子文件": "夹及其子文件",
+  "更新名称成功": "更新名称成功",
+  "保存文件成功": "保存文件成功",
+  "更新应用成功": "更新应用成功",
+  "创建应用成功": "创建应用成功",
+  "编辑应用": "编辑应用",
+  "检查更新中...": "检查更新中...",
+  "失败，请检查": "失败，请检查",
+  "更新失败，请检查网络及日志或稍后再试": "更新失败，请检查网络及日志或稍后再试",
+  "更新包下载成功": "更新包下载成功",
+  "重置secret": "重置secret",
+  "重置成功": "重置成功",
+  "通知发送成功": "通知发送成功",
+  "通知关闭成功": "通知关闭成功",
+  "测试中...": "测试中...",
+  "上传": "上传",
+  "下载": "下载",
+  "更新成功": "更新成功",
+  "激活成功": "激活成功",
+  "验证失败": "验证失败",
+  "更新订阅成功": "更新订阅成功",
+  "创建订阅成功": "创建订阅成功",
+  "编辑订阅": "编辑订阅",
+  "Subscription表达式格式有误": "Subscription表达式格式有误",
+  "一对多推送的“群组编码”（一对多推送下面->您的群组(如无则新建)->群组编码，如果您是创建群组人。也需点击“查看二维码”扫描绑定，否则不能接受群组消息推送）": "一对多推送的“群组编码”（一对多推送下面->您的群组(如无则新建)->群组编码，如果您是创建群组人。也需点击“查看二维码”扫描绑定，否则不能接受群组消息推送）",
+  "登录已过期，请重新登录": "登录已过期，请重新登录",
+  "系统日志": "系统日志",
+  "主题": "主题",
+  "语言": "语言"
+}

src/pages/404.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React from 'react';
 import { Button, Result, Typography } from 'antd';
 
@@ -9,7 +10,7 @@ const NotFound: React.FC = () => (
     title="404"
     extra={
       <Button type="primary">
-        <Link href="/">返回首页</Link>
+        <Link href="/">{intl.get('返回首页')}</Link>
       </Button>
     }
   />

src/pages/config/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal'
 import React, {
   PureComponent,
   Fragment,
@@ -10,9 +11,10 @@ import config from '@/utils/config';
 import { PageContainer } from '@ant-design/pro-layout';
 import { request } from '@/utils/http';
 import Editor from '@monaco-editor/react';
-import { Controlled as CodeMirror } from 'react-codemirror2';
+import CodeMirror from '@uiw/react-codemirror';
 import { useOutletContext } from '@umijs/max';
 import { SharedContext } from '@/layouts';
+import { langs } from '@uiw/codemirror-extensions-langs';
 
 const Config = () => {
   const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
@@ -54,7 +56,7 @@ const Config = () => {
       .post(`${config.apiPrefix}configs/save`, { content, name: select })
       .then(({ code, data }) => {
         if (code === 200) {
-          message.success('保存成功');
+          message.success(intl.get('保存成功'));
         }
         setConfirmLoading(false);
       });
@@ -93,7 +95,7 @@ const Config = () => {
           type="primary"
           onClick={updateConfig}
         >
-          保存
+          {intl.get('保存')}
         </Button>,
       ]}
       header={{
@@ -103,16 +105,11 @@ const Config = () => {
       {isPhone ? (
         <CodeMirror
           value={value}
-          options={{
-            lineNumbers: true,
-            styleActiveLine: true,
-            matchBrackets: true,
-            mode: 'shell',
-          }}
-          onBeforeChange={(editor, data, value) => {
+          theme={theme.includes('dark') ? 'dark' : 'light'}
+          extensions={[langs.shell()]}
+          onChange={(value) => {
             setValue(value);
           }}
-          onChange={(editor, data, value) => {}}
         />
       ) : (
         <Editor

src/pages/crontab/detail.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useRef, useState } from 'react';
 import {
   Modal,
@@ -29,26 +30,22 @@ import config from '@/utils/config';
 import CronLogModal from './logModal';
 import Editor from '@monaco-editor/react';
 import IconFont from '@/components/iconfont';
-import { getCommandScript } from '@/utils';
+import { getCommandScript, getEditorMode } from '@/utils';
+import VirtualList from 'rc-virtual-list';
+import useScrollHeight from '@/hooks/useScrollHeight';
 
 const { Text } = Typography;
 
 const tabList = [
   {
     key: 'log',
-    tab: '日志',
+    tab: intl.get('日志'),
   },
   {
     key: 'script',
-    tab: '脚本',
+    tab: intl.get('脚本'),
   },
 ];
-const LangMap: any = {
-  '.py': 'python',
-  '.js': 'javascript',
-  '.sh': 'shell',
-  '.ts': 'typescript',
-};
 
 interface LogItem {
   directory: string;
@@ -81,23 +78,32 @@ const CronDetailModal = ({
   const [logUrl, setLogUrl] = useState('');
   const [validTabs, setValidTabs] = useState(tabList);
   const [currentCron, setCurrentCron] = useState<any>({});
+  const listRef = useRef<HTMLDivElement>(null);
+  const tableScrollHeight = useScrollHeight(listRef);
 
   const contentList: any = {
     log: (
-      <List
-        dataSource={logs}
-        loading={loading}
-        renderItem={(item) => (
-          <List.Item className="log-item" onClick={() => onClickItem(item)}>
-            <FileOutlined style={{ marginRight: 10 }} />
-            {item.directory}/{item.filename}
-          </List.Item>
-        )}
-      />
+      <div ref={listRef}>
+        <List>
+          <VirtualList
+            data={logs}
+            height={tableScrollHeight}
+            itemHeight={47}
+            itemKey="filename"
+          >
+            {(item) => (
+              <List.Item className="log-item" onClick={() => onClickItem(item)}>
+                <FileOutlined style={{ marginRight: 10 }} />
+                {item.directory}/{item.filename}
+              </List.Item>
+            )}
+          </VirtualList>
+        </List>
+      </div>
     ),
     script: scriptInfo.filename && (
       <Editor
-        language={LangMap[scriptInfo.filename.slice(-3)] || ''}
+        language={getEditorMode(scriptInfo.filename)}
         theme={theme}
         value={value}
         options={{
@@ -170,11 +176,11 @@ const CronDetailModal = ({
       title: `确认保存`,
       content: (
         <>
-          确认保存文件
+          {intl.get('确认保存文件')}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {scriptInfo.filename}
           </Text>{' '}
-          ，保存后不可恢复
+          {intl.get('，保存后不可恢复')}
         </>
       ),
       onOk() {
@@ -206,14 +212,14 @@ const CronDetailModal = ({
 
   const runCron = () => {
     Modal.confirm({
-      title: '确认运行',
+      title: intl.get('确认运行'),
       content: (
         <>
-          确认运行定时任务{' '}
+          {intl.get('确认运行定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {currentCron.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -236,19 +242,19 @@ const CronDetailModal = ({
 
   const stopCron = () => {
     Modal.confirm({
-      title: '确认停止',
+      title: intl.get('确认停止'),
       content: (
         <>
-          确认停止定时任务{' '}
+          {intl.get('确认停止定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {currentCron.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
         request
-          .put(`${config.apiPrefix}crons/stop`, [currentCron.id] )
+          .put(`${config.apiPrefix}crons/stop`, [currentCron.id])
           .then(({ code, data }) => {
             if (code === 200) {
               setCurrentCron({ ...currentCron, status: CrontabStatus.idle });
@@ -263,15 +269,18 @@ const CronDetailModal = ({
 
   const enabledOrDisabledCron = () => {
     Modal.confirm({
-      title: `确认${currentCron.isDisabled === 1 ? '启用' : '禁用'}`,
+      title: `确认${
+        currentCron.isDisabled === 1 ? intl.get('启用') : intl.get('禁用')
+      }`,
       content: (
         <>
-          确认{currentCron.isDisabled === 1 ? '启用' : '禁用'}
-          定时任务{' '}
+          {intl.get('确认')}
+          {currentCron.isDisabled === 1 ? intl.get('启用') : intl.get('禁用')}
+          {intl.get('定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {currentCron.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -280,7 +289,7 @@ const CronDetailModal = ({
             `${config.apiPrefix}crons/${
               currentCron.isDisabled === 1 ? 'enable' : 'disable'
             }`,
-           [currentCron.id],
+            [currentCron.id],
           )
           .then(({ code, data }) => {
             if (code === 200) {
@@ -299,15 +308,18 @@ const CronDetailModal = ({
 
   const pinOrUnPinCron = () => {
     Modal.confirm({
-      title: `确认${currentCron.isPinned === 1 ? '取消置顶' : '置顶'}`,
+      title: `确认${
+        currentCron.isPinned === 1 ? intl.get('取消置顶') : intl.get('置顶')
+      }`,
       content: (
         <>
-          确认{currentCron.isPinned === 1 ? '取消置顶' : '置顶'}
-          定时任务{' '}
+          {intl.get('确认')}
+          {currentCron.isPinned === 1 ? intl.get('取消置顶') : intl.get('置顶')}
+          {intl.get('定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {currentCron.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -367,7 +379,9 @@ const CronDetailModal = ({
           <div className="operations">
             <Tooltip
               title={
-                currentCron.status === CrontabStatus.idle ? '运行' : '停止'
+                currentCron.status === CrontabStatus.idle
+                  ? intl.get('运行')
+                  : intl.get('停止')
               }
             >
               <Button
@@ -385,7 +399,13 @@ const CronDetailModal = ({
                 }
               />
             </Tooltip>
-            <Tooltip title={currentCron.isDisabled === 1 ? '启用' : '禁用'}>
+            <Tooltip
+              title={
+                currentCron.isDisabled === 1
+                  ? intl.get('启用')
+                  : intl.get('禁用')
+              }
+            >
               <Button
                 type="link"
                 icon={
@@ -401,7 +421,13 @@ const CronDetailModal = ({
                 onClick={enabledOrDisabledCron}
               />
             </Tooltip>
-            <Tooltip title={currentCron.isPinned === 1 ? '取消置顶' : '置顶'}>
+            <Tooltip
+              title={
+                currentCron.isPinned === 1
+                  ? intl.get('取消置顶')
+                  : intl.get('置顶')
+              }
+            >
               <Button
                 type="link"
                 icon={
@@ -431,20 +457,20 @@ const CronDetailModal = ({
       <div className="card-wrapper">
         <Card>
           <div className="cron-detail-info-item">
-            <div className="cron-detail-info-title">任务</div>
+            <div className="cron-detail-info-title">{intl.get('任务')}</div>
             <div className="cron-detail-info-value">{currentCron.command}</div>
           </div>
         </Card>
         <Card style={{ marginTop: 10 }}>
           <div className="cron-detail-info-item">
-            <div className="cron-detail-info-title">状态</div>
+            <div className="cron-detail-info-title">{intl.get('状态')}</div>
             <div className="cron-detail-info-value">
               {(!currentCron.isDisabled ||
                 currentCron.status !== CrontabStatus.idle) && (
                 <>
                   {currentCron.status === CrontabStatus.idle && (
                     <Tag icon={<ClockCircleOutlined />} color="default">
-                      空闲中
+                      {intl.get('空闲中')}
                     </Tag>
                   )}
                   {currentCron.status === CrontabStatus.running && (
@@ -452,12 +478,12 @@ const CronDetailModal = ({
                       icon={<Loading3QuartersOutlined spin />}
                       color="processing"
                     >
-                      运行中
+                      {intl.get('运行中')}
                     </Tag>
                   )}
                   {currentCron.status === CrontabStatus.queued && (
                     <Tag icon={<FieldTimeOutlined />} color="default">
-                      队列中
+                      {intl.get('队列中')}
                     </Tag>
                   )}
                 </>
@@ -465,17 +491,19 @@ const CronDetailModal = ({
               {currentCron.isDisabled === 1 &&
                 currentCron.status === CrontabStatus.idle && (
                   <Tag icon={<CloseCircleOutlined />} color="error">
-                    已禁用
+                    {intl.get('已禁用')}
                   </Tag>
                 )}
             </div>
           </div>
           <div className="cron-detail-info-item">
-            <div className="cron-detail-info-title">定时</div>
+            <div className="cron-detail-info-title">{intl.get('定时')}</div>
             <div className="cron-detail-info-value">{currentCron.schedule}</div>
           </div>
           <div className="cron-detail-info-item">
-            <div className="cron-detail-info-title">最后运行时间</div>
+            <div className="cron-detail-info-title">
+              {intl.get('最后运行时间')}
+            </div>
             <div className="cron-detail-info-value">
               {currentCron.last_execution_time
                 ? new Date(currentCron.last_execution_time * 1000)
@@ -487,7 +515,9 @@ const CronDetailModal = ({
             </div>
           </div>
           <div className="cron-detail-info-item">
-            <div className="cron-detail-info-title">最后运行时长</div>
+            <div className="cron-detail-info-title">
+              {intl.get('最后运行时长')}
+            </div>
             <div className="cron-detail-info-value">
               {currentCron.last_running_time
                 ? diffTime(currentCron.last_running_time)
@@ -495,7 +525,9 @@ const CronDetailModal = ({
             </div>
           </div>
           <div className="cron-detail-info-item">
-            <div className="cron-detail-info-title">下次运行时间</div>
+            <div className="cron-detail-info-title">
+              {intl.get('下次运行时间')}
+            </div>
             <div className="cron-detail-info-value">
               {currentCron.nextRunTime &&
                 currentCron.nextRunTime
@@ -521,7 +553,7 @@ const CronDetailModal = ({
                   style={{ marginRight: 8 }}
                   onClick={saveFile}
                 >
-                  保存
+                  {intl.get('保存')}
                 </Button>
                 <Button
                   type="primary"

src/pages/crontab/index.less

@@ -10,6 +10,10 @@
         height: calc(90vh - 367px);
         height: calc(90vh - var(--vh-offset, 0px) - 367px);
         overflow-y: auto;
+
+        > div {
+          height: 100%;
+        }
       }
     }
   }
@@ -182,18 +186,6 @@ tr.drop-over-upward td {
   }
 }
 
-.log-modal {
-  .log-container {
-    overflow-y: auto;
-    min-height: 300px;
-    max-height: calc(80vh - 110px);
-    max-height: calc(80vh - var(--vh-offset, 110px));
-
-    padding: 24px;
-    margin: -24px;
-  }
-}
-
 body[data-mode='desktop'] {
   .crontab-wrapper {
     tbody .ant-table-cell {
@@ -201,3 +193,7 @@ body[data-mode='desktop'] {
     }
   }
 }
+
+.cron.pinned-cron > td {
+  background: #fafafa;
+}

src/pages/crontab/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useState, useEffect, useRef, useMemo } from 'react';
 import {
   Button,
@@ -55,6 +56,7 @@ import { getCommandScript, parseCrontab } from '@/utils';
 import { ColumnProps } from 'antd/lib/table';
 import { useVT } from 'virtualizedtableforantd4';
 import { ICrontab, OperationName, OperationPath, CrontabStatus } from './type';
+import Name from '@/components/name';
 
 const { Text, Paragraph } = Typography;
 const { Search } = Input;
@@ -63,65 +65,38 @@ const Crontab = () => {
   const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
   const columns: ColumnProps<ICrontab>[] = [
     {
-      title: '名称',
+      title: intl.get('名称'),
       dataIndex: 'name',
       key: 'name',
-      width: 150,
+      fixed: 'left',
+      width: 120,
       render: (text: string, record: any) => (
-        <>
+        <Paragraph
+          style={{
+            wordBreak: 'break-all',
+            marginBottom: 0,
+          }}
+          ellipsis={{ tooltip: text, rows: 2 }}
+        >
           <a
             onClick={() => {
               setDetailCron(record);
               setIsDetailModalVisible(true);
             }}
           >
-            {record.labels?.length > 0 && record.labels[0] !== '' && false ? (
-              <Popover
-                placement="right"
-                trigger={isPhone ? 'click' : 'hover'}
-                content={
-                  <div>
-                    {record.labels?.map((label: string) => (
-                      <Tag
-                        color="blue"
-                        key={label}
-                        style={{ cursor: 'point' }}
-                        onClick={(e) => {
-                          e.stopPropagation();
-                          setSearchValue(`label:${label}`);
-                          setSearchText(`label:${label}`);
-                        }}
-                      >
-                        <a>{label}</a>
-                      </Tag>
-                    ))}
-                  </div>
-                }
-              >
-                {record.name || '-'}
-              </Popover>
-            ) : (
-              record.name || '-'
-            )}
-            {record.isPinned ? (
-              <span>
-                <PushpinOutlined />
-              </span>
-            ) : (
-              ''
-            )}
+            {record.name || '-'}
           </a>
-        </>
+        </Paragraph>
       ),
       sorter: {
         compare: (a, b) => a?.name?.localeCompare(b?.name),
       },
     },
     {
-      title: '命令/脚本',
+      title: intl.get('命令/脚本'),
       dataIndex: 'command',
       key: 'command',
-      width: 300,
+      width: 240,
       render: (text, record) => {
         return (
           <Paragraph
@@ -146,19 +121,90 @@ const Crontab = () => {
       },
     },
     {
-      title: '定时规则',
+      title: intl.get('状态'),
+      key: 'status',
+      dataIndex: 'status',
+      width: 100,
+      filters: [
+        {
+          text: intl.get('运行中'),
+          value: CrontabStatus.running,
+        },
+        {
+          text: intl.get('空闲中'),
+          value: CrontabStatus.idle,
+        },
+        {
+          text: intl.get('已禁用'),
+          value: CrontabStatus.disabled,
+        },
+        {
+          text: intl.get('队列中'),
+          value: CrontabStatus.queued,
+        },
+      ],
+      render: (text, record) => (
+        <>
+          {(!record.isDisabled || record.status !== CrontabStatus.idle) && (
+            <>
+              {record.status === CrontabStatus.idle && (
+                <Tag icon={<ClockCircleOutlined />} color="default">
+                  {intl.get('空闲中')}
+                </Tag>
+              )}
+              {record.status === CrontabStatus.running && (
+                <Tag
+                  icon={<Loading3QuartersOutlined spin />}
+                  color="processing"
+                >
+                  {intl.get('运行中')}
+                </Tag>
+              )}
+              {record.status === CrontabStatus.queued && (
+                <Tag icon={<FieldTimeOutlined />} color="default">
+                  {intl.get('队列中')}
+                </Tag>
+              )}
+            </>
+          )}
+          {record.isDisabled === 1 && record.status === CrontabStatus.idle && (
+            <Tag icon={<CloseCircleOutlined />} color="error">
+              {intl.get('已禁用')}
+            </Tag>
+          )}
+        </>
+      ),
+    },
+    {
+      title: intl.get('定时规则'),
       dataIndex: 'schedule',
       key: 'schedule',
-      width: 110,
+      width: 150,
       sorter: {
         compare: (a, b) => a.schedule.localeCompare(b.schedule),
       },
     },
     {
-      title: '最后运行时间',
+      title: intl.get('最后运行时长'),
+      width: 167,
+      dataIndex: 'last_running_time',
+      key: 'last_running_time',
+      sorter: {
+        compare: (a: any, b: any) => {
+          return a.last_running_time - b.last_running_time;
+        },
+      },
+      render: (text, record) => {
+        return record.last_running_time
+          ? diffTime(record.last_running_time)
+          : '-';
+      },
+    },
+    {
+      title: intl.get('最后运行时间'),
       dataIndex: 'last_execution_time',
       key: 'last_execution_time',
-      width: 150,
+      width: 141,
       sorter: {
         compare: (a, b) => {
           return (a.last_execution_time || 0) - (b.last_execution_time || 0);
@@ -184,24 +230,8 @@ const Crontab = () => {
       },
     },
     {
-      title: '最后运行时长',
-      width: 120,
-      dataIndex: 'last_running_time',
-      key: 'last_running_time',
-      sorter: {
-        compare: (a: any, b: any) => {
-          return a.last_running_time - b.last_running_time;
-        },
-      },
-      render: (text, record) => {
-        return record.last_running_time
-          ? diffTime(record.last_running_time)
-          : '-';
-      },
-    },
-    {
-      title: '下次运行时间',
-      width: 150,
+      title: intl.get('下次运行时间'),
+      width: 144,
       sorter: {
         compare: (a: any, b: any) => {
           return a.nextRunTime - b.nextRunTime;
@@ -217,102 +247,57 @@ const Crontab = () => {
       },
     },
     {
-      title: '状态',
-      key: 'status',
-      dataIndex: 'status',
-      width: 88,
-      filters: [
-        {
-          text: '运行中',
-          value: CrontabStatus.running,
-        },
-        {
-          text: '空闲中',
-          value: CrontabStatus.idle,
-        },
-        {
-          text: '已禁用',
-          value: CrontabStatus.disabled,
-        },
-        {
-          text: '队列中',
-          value: CrontabStatus.queued,
-        },
-      ],
-      render: (text, record) => (
-        <>
-          {(!record.isDisabled || record.status !== CrontabStatus.idle) && (
-            <>
-              {record.status === CrontabStatus.idle && (
-                <Tag icon={<ClockCircleOutlined />} color="default">
-                  空闲中
-                </Tag>
-              )}
-              {record.status === CrontabStatus.running && (
-                <Tag
-                  icon={<Loading3QuartersOutlined spin />}
-                  color="processing"
-                >
-                  运行中
-                </Tag>
-              )}
-              {record.status === CrontabStatus.queued && (
-                <Tag icon={<FieldTimeOutlined />} color="default">
-                  队列中
-                </Tag>
-              )}
-            </>
-          )}
-          {record.isDisabled === 1 && record.status === CrontabStatus.idle && (
-            <Tag icon={<CloseCircleOutlined />} color="error">
-              已禁用
-            </Tag>
-          )}
-        </>
-      ),
+      title: intl.get('关联订阅'),
+      width: 185,
+      render: (text, record: any) =>
+        record.sub_id ? (
+          <Name
+            service={() =>
+              request.get(`${config.apiPrefix}subscriptions/${record.sub_id}`)
+            }
+            options={{ ready: record?.sub_id, cacheKey: record.sub_id }}
+          />
+        ) : (
+          '-'
+        ),
     },
     {
-      title: '操作',
+      title: intl.get('操作'),
       key: 'action',
-      width: 130,
+      width: 140,
+      fixed: isPhone ? undefined : 'right',
       render: (text, record, index) => {
         const isPc = !isPhone;
         return (
           <Space size="middle">
             {record.status === CrontabStatus.idle && (
-              <Tooltip title={isPc ? '运行' : ''}>
-                <a
-                  onClick={(e) => {
-                    e.stopPropagation();
-                    runCron(record, index);
-                  }}
-                >
-                  <PlayCircleOutlined />
-                </a>
-              </Tooltip>
-            )}
-            {record.status !== CrontabStatus.idle && (
-              <Tooltip title={isPc ? '停止' : ''}>
-                <a
-                  onClick={(e) => {
-                    e.stopPropagation();
-                    stopCron(record, index);
-                  }}
-                >
-                  <PauseCircleOutlined />
-                </a>
-              </Tooltip>
-            )}
-            <Tooltip title={isPc ? '日志' : ''}>
               <a
                 onClick={(e) => {
                   e.stopPropagation();
-                  setLogCron({ ...record, timestamp: Date.now() });
+                  runCron(record, index);
                 }}
               >
-                <FileTextOutlined />
+                {intl.get('运行')}
               </a>
-            </Tooltip>
+            )}
+            {record.status !== CrontabStatus.idle && (
+              <a
+                onClick={(e) => {
+                  e.stopPropagation();
+                  stopCron(record, index);
+                }}
+              >
+                {intl.get('停止')}
+              </a>
+            )}
+            <a
+              onClick={(e) => {
+                e.stopPropagation();
+                setLogCron({ ...record, timestamp: Date.now() });
+              }}
+            >
+              {intl.get('日志')}
+            </a>
             <MoreBtn key="more" record={record} index={index} />
           </Space>
         );
@@ -347,8 +332,9 @@ const Crontab = () => {
   const [cronViews, setCronViews] = useState<any[]>([]);
   const [enabledCronViews, setEnabledCronViews] = useState<any[]>([]);
   const [moreMenuActive, setMoreMenuActive] = useState(false);
-  const tableRef = useRef<any>();
+  const tableRef = useRef<HTMLDivElement>(null);
   const tableScrollHeight = useTableScrollHeight(tableRef);
+  const [activeKey, setActiveKey] = useState('');
 
   const goToScriptManager = (record: any) => {
     const result = getCommandScript(record.command);
@@ -412,14 +398,14 @@ const Crontab = () => {
 
   const delCron = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认删除',
+      title: intl.get('确认删除'),
       content: (
         <>
-          确认删除定时任务{' '}
+          {intl.get('确认删除定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -427,7 +413,7 @@ const Crontab = () => {
           .delete(`${config.apiPrefix}crons`, { data: [record.id] })
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('删除成功');
+              message.success(intl.get('删除成功'));
               const result = [...value];
               const i = result.findIndex((x) => x.id === record.id);
               if (i !== -1) {
@@ -445,14 +431,14 @@ const Crontab = () => {
 
   const runCron = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认运行',
+      title: intl.get('确认运行'),
       content: (
         <>
-          确认运行定时任务{' '}
+          {intl.get('确认运行定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -480,14 +466,14 @@ const Crontab = () => {
 
   const stopCron = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认停止',
+      title: intl.get('确认停止'),
       content: (
         <>
-          确认停止定时任务{' '}
+          {intl.get('确认停止定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -516,15 +502,18 @@ const Crontab = () => {
 
   const enabledOrDisabledCron = (record: any, index: number) => {
     Modal.confirm({
-      title: `确认${record.isDisabled === 1 ? '启用' : '禁用'}`,
+      title: `确认${
+        record.isDisabled === 1 ? intl.get('启用') : intl.get('禁用')
+      }`,
       content: (
         <>
-          确认{record.isDisabled === 1 ? '启用' : '禁用'}
-          定时任务{' '}
+          {intl.get('确认')}
+          {record.isDisabled === 1 ? intl.get('启用') : intl.get('禁用')}
+          {intl.get('定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -558,15 +547,18 @@ const Crontab = () => {
 
   const pinOrUnPinCron = (record: any, index: number) => {
     Modal.confirm({
-      title: `确认${record.isPinned === 1 ? '取消置顶' : '置顶'}`,
+      title: `确认${
+        record.isPinned === 1 ? intl.get('取消置顶') : intl.get('置顶')
+      }`,
       content: (
         <>
-          确认{record.isPinned === 1 ? '取消置顶' : '置顶'}
-          定时任务{' '}
+          {intl.get('确认')}
+          {record.isPinned === 1 ? intl.get('取消置顶') : intl.get('置顶')}
+          {intl.get('定时任务')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -600,16 +592,16 @@ const Crontab = () => {
 
   const getMenuItems = (record: any) => {
     return [
-      { label: '编辑', key: 'edit', icon: <EditOutlined /> },
+      { label: intl.get('编辑'), key: 'edit', icon: <EditOutlined /> },
       {
-        label: record.isDisabled === 1 ? '启用' : '禁用',
+        label: record.isDisabled === 1 ? intl.get('启用') : intl.get('禁用'),
         key: 'enableOrDisable',
         icon:
           record.isDisabled === 1 ? <CheckCircleOutlined /> : <StopOutlined />,
       },
-      { label: '删除', key: 'delete', icon: <DeleteOutlined /> },
+      { label: intl.get('删除'), key: 'delete', icon: <DeleteOutlined /> },
       {
-        label: record.isPinned === 1 ? '取消置顶' : '置顶',
+        label: record.isPinned === 1 ? intl.get('取消置顶') : intl.get('置顶'),
         key: 'pinOrUnPin',
         icon: record.isPinned === 1 ? <StopOutlined /> : <PushpinOutlined />,
       },
@@ -696,14 +688,14 @@ const Crontab = () => {
 
   const delCrons = () => {
     Modal.confirm({
-      title: '确认删除',
-      content: <>确认删除选中的定时任务吗</>,
+      title: intl.get('确认删除'),
+      content: <>{intl.get('确认删除选中的定时任务吗')}</>,
       onOk() {
         request
           .delete(`${config.apiPrefix}crons`, { data: selectedRowIds })
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('批量删除成功');
+              message.success(intl.get('批量删除成功'));
               setSelectedRowIds([]);
               getCrons();
             }
@@ -718,7 +710,13 @@ const Crontab = () => {
   const operateCrons = (operationStatus: number) => {
     Modal.confirm({
       title: `确认${OperationName[operationStatus]}`,
-      content: <>确认{OperationName[operationStatus]}选中的定时任务吗</>,
+      content: (
+        <>
+          {intl.get('确认')}
+          {OperationName[operationStatus]}
+          {intl.get('选中的定时任务吗')}
+        </>
+      ),
       onOk() {
         request
           .put(
@@ -771,6 +769,9 @@ const Crontab = () => {
     if (pageConf.page && pageConf.size) {
       getCrons();
     }
+    if (viewConf && viewConf.id) {
+      setActiveKey(viewConf.id);
+    }
   }, [pageConf, viewConf]);
 
   useEffect(() => {
@@ -821,12 +822,12 @@ const Crontab = () => {
         type: 'divider' as 'group',
       },
       {
-        label: '新建视图',
+        label: intl.get('创建视图'),
         key: 'new',
         icon: <PlusOutlined />,
       },
       {
-        label: '视图管理',
+        label: intl.get('视图管理'),
         key: 'manage',
         icon: <SettingOutlined />,
       },
@@ -840,7 +841,12 @@ const Crontab = () => {
       .then(({ code, data }) => {
         if (code === 200) {
           setCronViews(data);
-          const firstEnableView = data.filter((x) => !x.isDisabled);
+          const firstEnableView = data
+            .filter((x) => !x.isDisabled)
+            .map((x) => ({
+              ...x,
+              name: x.name === '全部任务' ? intl.get('全部任务') : x.name,
+            }));
           setEnabledCronViews(firstEnableView);
           setPageConf({
             page: 1,
@@ -873,10 +879,10 @@ const Crontab = () => {
   return (
     <PageContainer
       className="ql-container-wrapper crontab-wrapper ql-container-wrapper-has-tab"
-      title="定时任务"
+      title={intl.get('定时任务')}
       extra={[
         <Search
-          placeholder="请输入名称或者关键词"
+          placeholder={intl.get('请输入名称或者关键词')}
           style={{ width: 'auto' }}
           enterButton
           allowClear
@@ -886,7 +892,7 @@ const Crontab = () => {
           onSearch={onSearch}
         />,
         <Button key="2" type="primary" onClick={() => addCron()}>
-          新建任务
+          {intl.get('创建任务')}
         </Button>,
       ]}
       header={{
@@ -896,6 +902,7 @@ const Crontab = () => {
       <Tabs
         defaultActiveKey="all"
         size="small"
+        activeKey={activeKey}
         tabPosition="top"
         className={`crontab-view ${moreMenuActive ? 'more-active' : ''}`}
         tabBarExtraContent={
@@ -906,7 +913,7 @@ const Crontab = () => {
           >
             <div className={`view-more ${moreMenuActive ? 'active' : ''}`}>
               <Space>
-                更多
+                {intl.get('更多')}
                 <DownOutlined />
               </Space>
               <div className="ant-tabs-ink-bar ant-tabs-ink-bar-animated"></div>
@@ -929,56 +936,57 @@ const Crontab = () => {
               style={{ marginBottom: 5 }}
               onClick={delCrons}
             >
-              批量删除
+              {intl.get('批量删除')}
             </Button>
             <Button
               type="primary"
               onClick={() => operateCrons(0)}
               style={{ marginLeft: 8, marginBottom: 5 }}
             >
-              批量启用
+              {intl.get('批量启用')}
             </Button>
             <Button
               type="primary"
               onClick={() => operateCrons(1)}
               style={{ marginLeft: 8, marginRight: 8 }}
             >
-              批量禁用
+              {intl.get('批量禁用')}
             </Button>
             <Button
               type="primary"
               style={{ marginRight: 8 }}
               onClick={() => operateCrons(2)}
             >
-              批量运行
+              {intl.get('批量运行')}
             </Button>
             <Button type="primary" onClick={() => operateCrons(3)}>
-              批量停止
+              {intl.get('批量停止')}
             </Button>
             <Button
               type="primary"
               onClick={() => operateCrons(4)}
               style={{ marginLeft: 8, marginRight: 8 }}
             >
-              批量置顶
+              {intl.get('批量置顶')}
             </Button>
             <Button
               type="primary"
               onClick={() => operateCrons(5)}
               style={{ marginLeft: 8, marginRight: 8 }}
             >
-              批量取消置顶
+              {intl.get('批量取消置顶')}
             </Button>
             <Button
               type="primary"
               onClick={() => setIsLabelModalVisible(true)}
               style={{ marginLeft: 8, marginRight: 8 }}
             >
-              批量修改标签
+              {intl.get('批量修改标签')}
             </Button>
             <span style={{ marginLeft: 8 }}>
-              已选择
-              <a>{selectedRowIds?.length}</a>项
+              {intl.get('已选择')}
+              <a>{selectedRowIds?.length}</a>
+              {intl.get('项')}
             </span>
           </div>
         )}
@@ -999,12 +1007,12 @@ const Crontab = () => {
           dataSource={value}
           rowKey="id"
           size="middle"
-          scroll={{ x: 1000, y: tableScrollHeight }}
+          scroll={{ x: 1200, y: tableScrollHeight }}
           loading={loading}
           rowSelection={rowSelection}
           rowClassName={getRowClassName}
           onChange={onPageChange}
-          // components={isPhone ? undefined : vt}
+          components={isPhone || pageConf.size < 50 ? undefined : vt}
         />
       </div>
       <CronLogModal
@@ -1044,9 +1052,6 @@ const Crontab = () => {
         handleCancel={(data) => {
           setIsCreateViewModalVisible(false);
           getCronViews();
-          if (data && data.id === viewConf.id) {
-            setViewConf({ ...viewConf, ...data });
-          }
         }}
       />
       <ViewManageModal
@@ -1057,9 +1062,6 @@ const Crontab = () => {
         }}
         cronViewChange={(data) => {
           getCronViews();
-          if (data && data.id === viewConf.id) {
-            setViewConf({ ...viewConf, ...data });
-          }
         }}
       />
     </PageContainer>

src/pages/crontab/logModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useRef, useState } from 'react';
 import { Modal, message, Input, Form, Statistic, Button } from 'antd';
 import { request } from '@/utils/http';
@@ -25,7 +26,7 @@ const CronLogModal = ({
   data?: string;
   logUrl?: string;
 }) => {
-  const [value, setValue] = useState<string>('启动中...');
+  const [value, setValue] = useState<string>(intl.get('启动中...'));
   const [loading, setLoading] = useState<any>(true);
   const [executing, setExecuting] = useState<any>(true);
   const [isPhone, setIsPhone] = useState(false);
@@ -44,13 +45,13 @@ const CronLogModal = ({
           data !== value
         ) {
           const log = data as string;
-          setValue(log || '暂无日志');
+          setValue(log || intl.get('暂无日志'));
           const hasNext = Boolean(
             log && !logEnded(log) && !log.includes('任务未运行'),
           );
           setExecuting(hasNext);
-          autoScroll();
           if (hasNext) {
+            autoScroll();
             setTimeout(() => {
               getCronLog();
             }, 2000);
@@ -73,7 +74,7 @@ const CronLogModal = ({
       document
         .querySelector('#log-flag')!
         .scrollIntoView({ behavior: 'smooth' });
-    }, 1000);
+    }, 600);
   };
 
   const cancel = () => {
@@ -123,15 +124,12 @@ const CronLogModal = ({
       open={visible}
       centered
       className="log-modal"
-      bodyStyle={{
-        minHeight: '300px',
-      }}
       forceRender
       onOk={() => cancel()}
       onCancel={() => cancel()}
       footer={[
         <Button type="primary" onClick={() => cancel()}>
-          知道了
+          {intl.get('知道了')}
         </Button>,
       ]}
     >
@@ -144,7 +142,6 @@ const CronLogModal = ({
               isPhone
                 ? {
                     fontFamily: 'Source Code Pro',
-                    width: 375,
                     zoom: 0.83,
                   }
                 : {}

src/pages/crontab/modal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form, Button } from 'antd';
 import { request } from '@/utils/http';
@@ -31,7 +32,9 @@ const CronModal = ({
       );
 
       if (code === 200) {
-        message.success(cron ? '更新Cron成功' : '新建Cron成功');
+        message.success(
+          cron ? intl.get('更新任务成功') : intl.get('创建任务成功'),
+        );
         handleCancel(data);
       }
       setLoading(false);
@@ -46,7 +49,7 @@ const CronModal = ({
 
   return (
     <Modal
-      title={cron ? '编辑任务' : '新建任务'}
+      title={cron ? intl.get('编辑任务') : intl.get('创建任务')}
       open={visible}
       forceRender
       centered
@@ -70,23 +73,25 @@ const CronModal = ({
         name="form_in_modal"
         initialValues={cron}
       >
-        <Form.Item name="name" label="名称">
-          <Input placeholder="请输入任务名称" />
+        <Form.Item name="name" label={intl.get('名称')}>
+          <Input placeholder={intl.get('请输入任务名称')} />
         </Form.Item>
         <Form.Item
           name="command"
-          label="命令/脚本"
+          label={intl.get('命令/脚本')}
           rules={[{ required: true, whitespace: true }]}
         >
           <Input.TextArea
             rows={4}
-            autoSize={true}
-            placeholder="支持输入脚本路径/任意系统可执行命令/task 脚本路径"
+            autoSize={{ minRows: 1, maxRows: 5 }}
+            placeholder={intl.get(
+              '支持输入脚本路径/任意系统可执行命令/task 脚本路径',
+            )}
           />
         </Form.Item>
         <Form.Item
           name="schedule"
-          label="定时规则"
+          label={intl.get('定时规则')}
           rules={[
             { required: true },
             {
@@ -94,15 +99,15 @@ const CronModal = ({
                 if (!value || cronParse.parseExpression(value).hasNext()) {
                   return Promise.resolve();
                 } else {
-                  return Promise.reject('Cron表达式格式有误');
+                  return Promise.reject(intl.get('Cron表达式格式有误'));
                 }
               },
             },
           ]}
         >
-          <Input placeholder="秒(可选) 分 时 天 月 周" />
+          <Input placeholder={intl.get('秒(可选) 分 时 天 月 周')} />
         </Form.Item>
-        <Form.Item name="labels" label="标签">
+        <Form.Item name="labels" label={intl.get('标签')}>
           <EditableTagGroup />
         </Form.Item>
       </Form>
@@ -136,7 +141,9 @@ const CronLabelModal = ({
 
           if (code === 200) {
             message.success(
-              action === 'post' ? '添加Labels成功' : '删除Labels成功',
+              action === 'post'
+                ? intl.get('添加Labels成功')
+                : intl.get('删除Labels成功'),
             );
             handleCancel(true);
           }
@@ -155,18 +162,18 @@ const CronLabelModal = ({
   }, [ids, visible]);
 
   const buttons = [
-    <Button onClick={() => handleCancel(false)}>取消</Button>,
+    <Button onClick={() => handleCancel(false)}>{intl.get('取消')}</Button>,
     <Button type="primary" danger onClick={() => update('delete')}>
-      删除
+      {intl.get('删除')}
     </Button>,
     <Button type="primary" onClick={() => update('post')}>
-      添加
+      {intl.get('添加')}
     </Button>,
   ];
 
   return (
     <Modal
-      title="批量修改标签"
+      title={intl.get('批量修改标签')}
       open={visible}
       footer={buttons}
       centered
@@ -176,7 +183,7 @@ const CronLabelModal = ({
       confirmLoading={loading}
     >
       <Form form={form} layout="vertical" name="form_in_label_modal">
-        <Form.Item name="labels" label="标签">
+        <Form.Item name="labels" label={intl.get('标签')}>
           <EditableTagGroup />
         </Form.Item>
       </Form>

src/pages/crontab/viewCreateModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import {
   Modal,
@@ -13,15 +14,16 @@ import { request } from '@/utils/http';
 import config from '@/utils/config';
 import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
 import IconFont from '@/components/iconfont';
-import get from 'lodash/get';
 import { CrontabStatus } from './type';
+import { useRequest } from 'ahooks';
 
 const PROPERTIES = [
-  { name: '命令', value: 'command' },
-  { name: '名称', value: 'name' },
-  { name: '定时规则', value: 'schedule' },
-  { name: '状态', value: 'status' },
-  { name: '标签', value: 'labels' },
+  { name: intl.get('命令'), value: 'command' },
+  { name: intl.get('名称'), value: 'name' },
+  { name: intl.get('定时规则'), value: 'schedule' },
+  { name: intl.get('状态'), value: 'status', onlySelect: true },
+  { name: intl.get('标签'), value: 'labels' },
+  { name: intl.get('订阅'), value: 'sub_id', onlySelect: true },
 ];
 
 const EOperation: any = {
@@ -31,10 +33,10 @@ const EOperation: any = {
   Nin: 'select',
 };
 const OPERATIONS = [
-  { name: '包含', value: 'Reg' },
-  { name: '不包含', value: 'NotReg' },
-  { name: '属于', value: 'In', type: 'select' },
-  { name: '不属于', value: 'Nin', type: 'select' },
+  { name: intl.get('包含'), value: 'Reg' },
+  { name: intl.get('不包含'), value: 'NotReg' },
+  { name: intl.get('属于'), value: 'In', type: 'select' },
+  { name: intl.get('不属于'), value: 'Nin', type: 'select' },
   // { name: '等于', value: 'Eq' },
   // { name: '不等于', value: 'Ne' },
   // { name: '为空', value: 'IsNull' },
@@ -42,18 +44,10 @@ const OPERATIONS = [
 ];
 
 const SORTTYPES = [
-  { name: '顺序', value: 'ASC' },
-  { name: '倒序', value: 'DESC' },
+  { name: intl.get('顺序'), value: 'ASC' },
+  { name: intl.get('倒序'), value: 'DESC' },
 ];
 
-const STATUS_MAP = {
-  status: [
-    { name: '运行中', value: CrontabStatus.running },
-    { name: '空闲中', value: CrontabStatus.idle },
-    { name: '已禁用', value: CrontabStatus.disabled },
-  ],
-};
-
 enum ViewFilterRelation {
   'and' = '且',
   'or' = '或',
@@ -72,6 +66,21 @@ const ViewCreateModal = ({
   const [loading, setLoading] = useState(false);
   const [filterRelation, setFilterRelation] = useState<'and' | 'or'>('and');
   const filtersValue = Form.useWatch('filters', form);
+  const { data } = useRequest(
+    () => request.get(`${config.apiPrefix}subscriptions`),
+    {
+      cacheKey: 'subscriptions',
+    },
+  );
+
+  const STATUS_MAP = {
+    status: [
+      { name: intl.get('运行中'), value: CrontabStatus.running },
+      { name: intl.get('空闲中'), value: CrontabStatus.idle },
+      { name: intl.get('已禁用'), value: CrontabStatus.disabled },
+    ],
+    sub_id: data?.data.map((x) => ({ name: x.name, value: x.id })),
+  };
 
   const handleOk = async (values: any) => {
     setLoading(true);
@@ -104,7 +113,7 @@ const ViewCreateModal = ({
   }, [view, visible]);
 
   const operationElement = (
-    <Select style={{ width: 80 }}>
+    <Select style={{ width: 120 }}>
       {OPERATIONS.map((x) => (
         <Select.Option key={x.name} value={x.value}>
           {x.name}
@@ -137,7 +146,11 @@ const ViewCreateModal = ({
 
   const statusElement = (property: keyof typeof STATUS_MAP) => {
     return (
-      <Select mode="tags" allowClear placeholder="输入后回车增加自定义选项">
+      <Select
+        mode="tags"
+        allowClear
+        placeholder={intl.get('输入后回车增加自定义选项')}
+      >
         {STATUS_MAP[property]?.map((x) => (
           <Select.Option key={x.name} value={x.value}>
             {x.name}
@@ -149,7 +162,7 @@ const ViewCreateModal = ({
 
   return (
     <Modal
-      title={view ? '编辑视图' : '新建视图'}
+      title={view ? intl.get('编辑视图') : intl.get('创建视图')}
       open={visible}
       forceRender
       width={580}
@@ -171,10 +184,10 @@ const ViewCreateModal = ({
       <Form form={form} layout="vertical" name="env_modal">
         <Form.Item
           name="name"
-          label="视图名称"
-          rules={[{ required: true, message: '请输入视图名称' }]}
+          label={intl.get('视图名称')}
+          rules={[{ required: true, message: intl.get('请输入视图名称') }]}
         >
-          <Input placeholder="请输入视图名称" />
+          <Input placeholder={intl.get('请输入视图名称')} />
         </Form.Item>
         <Form.List name="filters">
           {(fields, { add, remove }) => (
@@ -223,7 +236,7 @@ const ViewCreateModal = ({
               <div>
                 {fields.map(({ key, name, ...restField }) => (
                   <Form.Item
-                    label={name === 0 ? '筛选条件' : ''}
+                    label={name === 0 ? intl.get('筛选条件') : ''}
                     key={key}
                     style={{ marginBottom: 0 }}
                     required
@@ -238,7 +251,7 @@ const ViewCreateModal = ({
                         name={[name, 'property']}
                         rules={[{ required: true }]}
                       >
-                        {propertyElement(PROPERTIES, { width: 90 })}
+                        {propertyElement(PROPERTIES, { width: 120 })}
                       </Form.Item>
                       <Form.Item
                         {...restField}
@@ -250,13 +263,15 @@ const ViewCreateModal = ({
                       <Form.Item
                         {...restField}
                         name={[name, 'value']}
-                        rules={[{ required: true, message: '请输入内容' }]}
+                        rules={[
+                          { required: true, message: intl.get('请输入内容') },
+                        ]}
                       >
                         {EOperation[filtersValue?.[name]['operation']] ===
                         'select' ? (
                           statusElement(filtersValue?.[name]['property'])
                         ) : (
-                          <Input placeholder="请输入内容" />
+                          <Input placeholder={intl.get('请输入内容')} />
                         )}
                       </Form.Item>
                       {name !== 0 && (
@@ -272,7 +287,7 @@ const ViewCreateModal = ({
                     }
                   >
                     <PlusOutlined />
-                    新增筛选条件
+                    {intl.get('新增筛选条件')}
                   </a>
                 </Form.Item>
               </div>
@@ -320,7 +335,7 @@ const ViewCreateModal = ({
               <div>
                 {fields.map(({ key, name, ...restField }) => (
                   <Form.Item
-                    label={name === 0 ? '排序方式' : ''}
+                    label={name === 0 ? intl.get('排序方式') : ''}
                     key={key}
                     style={{ marginBottom: 0 }}
                     className="filter-item"
@@ -347,7 +362,7 @@ const ViewCreateModal = ({
                 <Form.Item>
                   <a onClick={() => add({ property: 'command', type: 'ASC' })}>
                     <PlusOutlined />
-                    新增排序方式
+                    {intl.get('新增排序方式')}
                   </a>
                 </Form.Item>
               </div>

src/pages/crontab/viewManageModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import {
   Modal,
@@ -81,18 +82,19 @@ const ViewManageModal = ({
 
   const columns: any = [
     {
-      title: '名称',
+      title: intl.get('名称'),
       dataIndex: 'name',
       key: 'name',
+      render: (v) => (v === '全部任务' ? intl.get('全部任务') : v)
     },
     {
-      title: '类型',
+      title: intl.get('类型'),
       dataIndex: 'type',
       key: 'type',
-      render: (v) => (v === 1 ? '系统' : '个人'),
+      render: (v) => (v === 1 ? intl.get('系统') : intl.get('个人')),
     },
     {
-      title: '显示',
+      title: intl.get('显示'),
       key: 'isDisabled',
       dataIndex: 'isDisabled',
       width: 100,
@@ -107,7 +109,7 @@ const ViewManageModal = ({
       },
     },
     {
-      title: '操作',
+      title: intl.get('操作'),
       key: 'action',
       width: 100,
       render: (text: string, record: any, index: number) => {
@@ -140,14 +142,14 @@ const ViewManageModal = ({
 
   const deleteView = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认删除',
+      title: intl.get('确认删除'),
       content: (
         <>
-          确认删除视图{' '}
+          {intl.get('确认删除视图')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -155,7 +157,7 @@ const ViewManageModal = ({
           .delete(`${config.apiPrefix}crons/views`, { data: [record.id] })
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('删除成功');
+              message.success(intl.get('删除成功'));
               cronViewChange();
             }
           });
@@ -218,7 +220,7 @@ const ViewManageModal = ({
 
   return (
     <Modal
-      title="视图管理"
+      title={intl.get('视图管理')}
       open={visible}
       centered
       width={620}
@@ -243,7 +245,7 @@ const ViewManageModal = ({
             setIsCreateViewModalVisible(true);
           }}
         >
-          新建视图
+          {intl.get('创建视图')}
         </Button>
       </Space>
       <DndProvider backend={HTML5Backend}>

src/pages/dependence/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useCallback, useRef, useState, useEffect } from 'react';
 import {
   Button,
@@ -90,20 +91,22 @@ const Dependence = () => {
     useOutletContext<SharedContext>();
   const columns: any = [
     {
-      title: '序号',
-      width: 50,
+      title: intl.get('序号'),
+      width: 80,
       render: (text: string, record: any, index: number) => {
         return <span style={{ cursor: 'text' }}>{index + 1} </span>;
       },
     },
     {
-      title: '名称',
+      title: intl.get('名称'),
       dataIndex: 'name',
+      width: 120,
       key: 'name',
     },
     {
-      title: '状态',
+      title: intl.get('状态'),
       key: 'status',
+      width: 120,
       dataIndex: 'status',
       render: (text: string, record: any, index: number) => {
         return (
@@ -113,41 +116,45 @@ const Dependence = () => {
               icon={StatusMap[record.status].icon}
               style={{ marginRight: 0 }}
             >
-              {Status[record.status]}
+              {intl.get(Status[record.status])}
             </Tag>
           </Space>
         );
       },
     },
     {
-      title: '备注',
+      title: intl.get('备注'),
       dataIndex: 'remark',
+      width: 120,
       key: 'remark',
     },
     {
-      title: '更新时间',
+      title: intl.get('更新时间'),
       key: 'updatedAt',
       dataIndex: 'updatedAt',
+      width: 150,
       render: (text: string) => {
         return <span>{dayjs(text).format('YYYY-MM-DD HH:mm:ss')}</span>;
       },
     },
     {
-      title: '创建时间',
+      title: intl.get('创建时间'),
       key: 'createdAt',
       dataIndex: 'createdAt',
+      width: 150,
       render: (text: string) => {
         return <span>{dayjs(text).format('YYYY-MM-DD HH:mm:ss')}</span>;
       },
     },
     {
-      title: '操作',
+      title: intl.get('操作'),
       key: 'action',
+      width: 150,
       render: (text: string, record: any, index: number) => {
         const isPc = !isPhone;
         return (
           <Space size="middle">
-            <Tooltip title={isPc ? '日志' : ''}>
+            <Tooltip title={isPc ? intl.get('日志') : ''}>
               <a
                 onClick={() => {
                   setLogDependence({ ...record, timestamp: Date.now() });
@@ -159,17 +166,17 @@ const Dependence = () => {
             {record.status !== Status.安装中 &&
               record.status !== Status.删除中 && (
                 <>
-                  <Tooltip title={isPc ? '重新安装' : ''}>
+                  <Tooltip title={isPc ? intl.get('重新安装') : ''}>
                     <a onClick={() => reInstallDependence(record, index)}>
                       <BugOutlined />
                     </a>
                   </Tooltip>
-                  <Tooltip title={isPc ? '删除' : ''}>
+                  <Tooltip title={isPc ? intl.get('删除') : ''}>
                     <a onClick={() => deleteDependence(record, index)}>
                       <DeleteOutlined />
                     </a>
                   </Tooltip>
-                  <Tooltip title={isPc ? '强制删除' : ''}>
+                  <Tooltip title={isPc ? intl.get('强制删除') : ''}>
                     <a onClick={() => deleteDependence(record, index, true)}>
                       <DeleteFilled />
                     </a>
@@ -190,7 +197,7 @@ const Dependence = () => {
   const [logDependence, setLogDependence] = useState<any>();
   const [isLogModalVisible, setIsLogModalVisible] = useState(false);
   const [type, setType] = useState('nodejs');
-  const tableRef = useRef<any>();
+  const tableRef = useRef<HTMLDivElement>(null);
   const tableScrollHeight = useTableScrollHeight(tableRef, 59);
 
   const getDependencies = () => {
@@ -223,14 +230,14 @@ const Dependence = () => {
     force: boolean = false,
   ) => {
     Modal.confirm({
-      title: '确认删除',
+      title: intl.get('确认删除'),
       content: (
         <>
-          确认删除依赖{' '}
+          {intl.get('确认删除依赖')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -257,14 +264,14 @@ const Dependence = () => {
 
   const reInstallDependence = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认重新安装',
+      title: intl.get('确认重新安装'),
       content: (
         <>
-          确认重新安装{' '}
+          {intl.get('确认重新安装')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -290,7 +297,7 @@ const Dependence = () => {
   const handleDependence = (dependence: any) => {
     const result = [...value];
     if (Array.isArray(dependence)) {
-      result.push(...dependence);
+      result.unshift(...dependence);
     } else {
       const index = value.findIndex((x) => x.id === dependence.id);
       if (index !== -1) {
@@ -314,8 +321,8 @@ const Dependence = () => {
   const delDependencies = (force: boolean) => {
     const forceUrl = force ? '/force' : '';
     Modal.confirm({
-      title: '确认删除',
-      content: <>确认删除选中的依赖吗</>,
+      title: intl.get('确认删除'),
+      content: <>{intl.get('确认删除选中的依赖吗')}</>,
       onOk() {
         request
           .delete(`${config.apiPrefix}dependencies${forceUrl}`, {
@@ -336,8 +343,8 @@ const Dependence = () => {
 
   const handlereInstallDependencies = () => {
     Modal.confirm({
-      title: '确认重新安装',
-      content: <>确认重新安装选中的依赖吗</>,
+      title: intl.get('确认重新安装'),
+      content: <>{intl.get('确认重新安装选中的依赖吗')}</>,
       onOk() {
         request
           .put(`${config.apiPrefix}dependencies/reinstall`, selectedRowIds)
@@ -454,17 +461,17 @@ const Dependence = () => {
   return (
     <PageContainer
       className="ql-container-wrapper dependence-wrapper ql-container-wrapper-has-tab"
-      title="依赖管理"
+      title={intl.get('依赖管理')}
       extra={[
         <Search
-          placeholder="请输入名称"
+          placeholder={intl.get('请输入名称')}
           style={{ width: 'auto' }}
           enterButton
           loading={loading}
           onSearch={onSearch}
         />,
         <Button key="2" type="primary" onClick={() => addDependence()}>
-          新建依赖
+          {intl.get('创建依赖')}
         </Button>,
       ]}
       header={{
@@ -499,25 +506,26 @@ const Dependence = () => {
               style={{ marginBottom: 5, marginLeft: 8 }}
               onClick={() => handlereInstallDependencies()}
             >
-              批量安装
+              {intl.get('批量安装')}
             </Button>
             <Button
               type="primary"
               style={{ marginBottom: 5, marginLeft: 8 }}
               onClick={() => delDependencies(false)}
             >
-              批量删除
+              {intl.get('批量删除')}
             </Button>
             <Button
               type="primary"
               style={{ marginBottom: 5, marginLeft: 8 }}
               onClick={() => delDependencies(true)}
             >
-              批量强制删除
+              {intl.get('批量强制删除')}
             </Button>
             <span style={{ marginLeft: 8 }}>
-              已选择
-              <a>{selectedRowIds?.length}</a>项
+              {intl.get('已选择')}
+              <a>{selectedRowIds?.length}</a>
+              {intl.get('项')}
             </span>
           </div>
         )}

src/pages/dependence/logModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form, Statistic, Button } from 'antd';
 import { request } from '@/utils/http';
@@ -38,7 +39,7 @@ const DependenceLogModal = ({
         {executing && <Loading3QuartersOutlined spin />}
         {!executing && <CheckCircleOutlined />}
         <span style={{ marginLeft: 5 }}>
-          日志 - {dependence && dependence.name}
+          {intl.get('日志 -')} {dependence && dependence.name}
         </span>{' '}
       </>
     );
@@ -120,37 +121,33 @@ const DependenceLogModal = ({
       open={visible}
       centered
       className="log-modal"
-      bodyStyle={{
-        overflowY: 'auto',
-        maxHeight: 'calc(70vh - var(--vh-offset, 0px))',
-        minHeight: '300px',
-      }}
       forceRender
       onOk={() => cancel()}
       onCancel={() => cancel()}
       footer={[
         <Button type="primary" onClick={footerClick} loading={removeLoading}>
-          {isRemoveFailed ? '强制删除' : '知道了'}
+          {isRemoveFailed ? intl.get('强制删除') : intl.get('知道了')}
         </Button>,
       ]}
     >
-      {loading ? (
-        <PageLoading />
-      ) : (
-        <pre
-          style={
-            isPhone
-              ? {
-                  fontFamily: 'Source Code Pro',
-                  width: 375,
-                  zoom: 0.83,
-                }
-              : {}
-          }
-        >
-          <Ansi>{value}</Ansi>
-        </pre>
-      )}
+      <div className="log-container">
+        {loading ? (
+          <PageLoading />
+        ) : (
+          <pre
+            style={
+              isPhone
+                ? {
+                    fontFamily: 'Source Code Pro',
+                    zoom: 0.83,
+                  }
+                : {}
+            }
+          >
+            <Ansi>{value}</Ansi>
+          </pre>
+        )}
+      </div>
     </Modal>
   );
 };

src/pages/dependence/modal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form, Radio, Select } from 'antd';
 import { request } from '@/utils/http';
@@ -66,7 +67,7 @@ const DependenceModal = ({
 
   return (
     <Modal
-      title={dependence ? '编辑依赖' : '新建依赖'}
+      title={dependence ? intl.get('编辑依赖') : intl.get('创建依赖')}
       open={visible}
       forceRender
       centered
@@ -92,7 +93,7 @@ const DependenceModal = ({
       >
         <Form.Item
           name="type"
-          label="依赖类型"
+          label={intl.get('依赖类型')}
           initialValue={DependenceTypes[defaultType as any]}
         >
           <Select>
@@ -106,35 +107,35 @@ const DependenceModal = ({
         {!dependence && (
           <Form.Item
             name="split"
-            label="自动拆分"
+            label={intl.get('自动拆分')}
             initialValue="0"
-            tooltip="多个依赖是否换行分割"
+            tooltip={intl.get('多个依赖是否换行分割')}
           >
             <Radio.Group>
-              <Radio value="1">是</Radio>
-              <Radio value="0">否</Radio>
+              <Radio value="1">{intl.get('是')}</Radio>
+              <Radio value="0">{intl.get('否')}</Radio>
             </Radio.Group>
           </Form.Item>
         )}
         <Form.Item
           name="name"
-          label="名称"
+          label={intl.get('名称')}
           rules={[
             {
               required: true,
-              message: '请输入依赖名称，支持指定版本',
+              message: intl.get('请输入依赖名称，支持指定版本'),
               whitespace: true,
             },
           ]}
         >
           <Input.TextArea
             rows={4}
-            autoSize={true}
-            placeholder="请输入依赖名称"
+            autoSize={{ minRows: 1, maxRows: 5 }}
+            placeholder={intl.get('请输入依赖名称')}
           />
         </Form.Item>
-        <Form.Item name="remark" label="备注">
-          <Input placeholder="请输入备注" />
+        <Form.Item name="remark" label={intl.get('备注')}>
+          <Input placeholder={intl.get('请输入备注')} />
         </Form.Item>
       </Form>
     </Modal>

src/pages/diff/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { PureComponent, useRef, useState, useEffect } from 'react';
 import { Button, message, Select, Form, Row, Col } from 'antd';
 import config from '@/utils/config';
@@ -53,7 +54,7 @@ const Diff = () => {
       })
       .then(({ code, data }) => {
         if (code === 200) {
-          message.success('保存成功');
+          message.success(intl.get('保存成功'));
         }
       });
   };
@@ -93,7 +94,7 @@ const Diff = () => {
   return (
     <PageContainer
       className="ql-container-wrapper"
-      title="对比工具"
+      title={intl.get('对比工具')}
       loading={loading}
       header={{
         style: headerStyle,
@@ -101,14 +102,14 @@ const Diff = () => {
       extra={
         !isPhone && [
           <Button key="1" type="primary" onClick={updateConfig}>
-            保存
+            {intl.get('保存')}
           </Button>,
         ]
       }
     >
       <Row gutter={24} className="diff-switch-file">
         <Col span={12}>
-          <Form.Item label="源文件">
+          <Form.Item label={intl.get('源文件')}>
             <Select value={origin} onChange={originFileChange}>
               {files.map((x) => (
                 <Option key={x.value} value={x.value}>
@@ -119,7 +120,7 @@ const Diff = () => {
           </Form.Item>
         </Col>
         <Col span={12}>
-          <Form.Item label="当前文件">
+          <Form.Item label={intl.get('当前文件')}>
             <Select value={current} onChange={currentFileChange}>
               {files.map((x) => (
                 <Option key={x.value} value={x.value}>

src/pages/env/editNameModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal'
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form } from 'antd';
 import { request } from '@/utils/http';
@@ -24,7 +25,7 @@ const EditNameModal = ({
       });
 
       if (code === 200) {
-        message.success('更新环境变量名称成功');
+        message.success(intl.get('更新环境变量名称成功'));
         handleCancel();
       }
       setLoading(false);
@@ -39,7 +40,7 @@ const EditNameModal = ({
 
   return (
     <Modal
-      title="修改环境变量名称"
+      title={intl.get('修改环境变量名称')}
       open={visible}
       forceRender
       centered
@@ -60,9 +61,9 @@ const EditNameModal = ({
       <Form form={form} layout="vertical" name="edit_name_modal">
         <Form.Item
           name="name"
-          rules={[{ required: true, message: '请输入新的环境变量名称' }]}
+          rules={[{ required: true, message: intl.get('请输入新的环境变量名称') }]}
         >
-          <Input placeholder="请输入新的环境变量名称" />
+          <Input placeholder={intl.get('请输入新的环境变量名称')} />
         </Form.Item>
       </Form>
     </Modal>

src/pages/env/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, {
   useCallback,
   useRef,
@@ -41,7 +42,7 @@ import useTableScrollHeight from '@/hooks/useTableScrollHeight';
 import Copy from '../../components/copy';
 import { useVT } from 'virtualizedtableforantd4';
 
-const { Text } = Typography;
+const { Paragraph } = Typography;
 const { Search } = Input;
 
 enum Status {
@@ -70,20 +71,20 @@ const Env = () => {
   const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
   const columns: any = [
     {
-      title: '序号',
-      width: 60,
+      title: intl.get('序号'),
+      width: 80,
       render: (text: string, record: any, index: number) => {
         return <span style={{ cursor: 'text' }}>{index + 1} </span>;
       },
     },
     {
-      title: '名称',
+      title: intl.get('名称'),
       dataIndex: 'name',
       key: 'name',
       sorter: (a: any, b: any) => a.name.localeCompare(b.name),
     },
     {
-      title: '值',
+      title: intl.get('值'),
       dataIndex: 'value',
       key: 'value',
       width: '35%',
@@ -99,7 +100,7 @@ const Env = () => {
       },
     },
     {
-      title: '备注',
+      title: intl.get('备注'),
       dataIndex: 'remarks',
       key: 'remarks',
       render: (text: string, record: any) => {
@@ -111,7 +112,7 @@ const Env = () => {
       },
     },
     {
-      title: '更新时间',
+      title: intl.get('更新时间'),
       dataIndex: 'timestamp',
       key: 'timestamp',
       width: 165,
@@ -145,17 +146,17 @@ const Env = () => {
       },
     },
     {
-      title: '状态',
+      title: intl.get('状态'),
       key: 'status',
       dataIndex: 'status',
-      width: 70,
+      width: 100,
       filters: [
         {
-          text: '已启用',
+          text: intl.get('已启用'),
           value: 0,
         },
         {
-          text: '已禁用',
+          text: intl.get('已禁用'),
           value: 1,
         },
       ],
@@ -164,28 +165,32 @@ const Env = () => {
         return (
           <Space size="middle" style={{ cursor: 'text' }}>
             <Tag color={StatusColor[record.status]} style={{ marginRight: 0 }}>
-              {Status[record.status]}
+              {intl.get(Status[record.status])}
             </Tag>
           </Space>
         );
       },
     },
     {
-      title: '操作',
+      title: intl.get('操作'),
       key: 'action',
       width: 120,
       render: (text: string, record: any, index: number) => {
         const isPc = !isPhone;
         return (
           <Space size="middle">
-            <Tooltip title={isPc ? '编辑' : ''}>
+            <Tooltip title={isPc ? intl.get('编辑') : ''}>
               <a onClick={() => editEnv(record, index)}>
                 <EditOutlined />
               </a>
             </Tooltip>
             <Tooltip
               title={
-                isPc ? (record.status === Status.已禁用 ? '启用' : '禁用') : ''
+                isPc
+                  ? record.status === Status.已禁用
+                    ? intl.get('启用')
+                    : intl.get('禁用')
+                  : ''
               }
             >
               <a onClick={() => enabledOrDisabledEnv(record, index)}>
@@ -196,7 +201,7 @@ const Env = () => {
                 )}
               </a>
             </Tooltip>
-            <Tooltip title={isPc ? '删除' : ''}>
+            <Tooltip title={isPc ? intl.get('删除') : ''}>
               <a onClick={() => deleteEnv(record, index)}>
                 <DeleteOutlined />
               </a>
@@ -214,7 +219,7 @@ const Env = () => {
   const [selectedRowIds, setSelectedRowIds] = useState<string[]>([]);
   const [searchText, setSearchText] = useState('');
   const [importLoading, setImportLoading] = useState(false);
-  const tableRef = useRef<any>();
+  const tableRef = useRef<HTMLDivElement>(null);
   const tableScrollHeight = useTableScrollHeight(tableRef, 59);
 
   const getEnvs = () => {
@@ -231,15 +236,25 @@ const Env = () => {
 
   const enabledOrDisabledEnv = (record: any, index: number) => {
     Modal.confirm({
-      title: `确认${record.status === Status.已禁用 ? '启用' : '禁用'}`,
+      title: `确认${
+        record.status === Status.已禁用 ? intl.get('启用') : intl.get('禁用')
+      }`,
       content: (
         <>
-          确认{record.status === Status.已禁用 ? '启用' : '禁用'}
+          {intl.get('确认')}
+          {record.status === Status.已禁用
+            ? intl.get('启用')
+            : intl.get('禁用')}
           Env{' '}
-          <Text style={{ wordBreak: 'break-all' }} type="warning">
+          <Paragraph
+            style={{ wordBreak: 'break-all', display: 'inline' }}
+            ellipsis={{ rows: 6, expandable: true }}
+            type="warning"
+            copyable
+          >
             {record.value}
-          </Text>{' '}
-          吗
+          </Paragraph>{' '}
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -253,7 +268,11 @@ const Env = () => {
           .then(({ code, data }) => {
             if (code === 200) {
               message.success(
-                `${record.status === Status.已禁用 ? '启用' : '禁用'}成功`,
+                `${
+                  record.status === Status.已禁用
+                    ? intl.get('启用')
+                    : intl.get('禁用')
+                }${intl.get('成功')}`,
               );
               const newStatus =
                 record.status === Status.已禁用 ? Status.已启用 : Status.已禁用;
@@ -284,14 +303,19 @@ const Env = () => {
 
   const deleteEnv = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认删除',
+      title: intl.get('确认删除'),
       content: (
         <>
-          确认删除变量{' '}
-          <Text style={{ wordBreak: 'break-all' }} type="warning">
+          {intl.get('确认删除变量')}{' '}
+          <Paragraph
+            style={{ wordBreak: 'break-all', display: 'inline' }}
+            ellipsis={{ rows: 6, expandable: true }}
+            type="warning"
+            copyable
+          >
             {record.name}: {record.value}
-          </Text>{' '}
-          吗
+          </Paragraph>{' '}
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -299,7 +323,7 @@ const Env = () => {
           .delete(`${config.apiPrefix}envs`, { data: [record.id] })
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('删除成功');
+              message.success(intl.get('删除成功'));
               const result = [...value];
               result.splice(index, 1);
               setValue(result);
@@ -412,14 +436,14 @@ const Env = () => {
 
   const delEnvs = () => {
     Modal.confirm({
-      title: '确认删除',
-      content: <>确认删除选中的变量吗</>,
+      title: intl.get('确认删除'),
+      content: <>{intl.get('确认删除选中的变量吗')}</>,
       onOk() {
         request
           .delete(`${config.apiPrefix}envs`, { data: selectedRowIds })
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('批量删除成功');
+              message.success(intl.get('批量删除成功'));
               setSelectedRowIds([]);
               getEnvs();
             }
@@ -434,7 +458,13 @@ const Env = () => {
   const operateEnvs = (operationStatus: number) => {
     Modal.confirm({
       title: `确认${OperationName[operationStatus]}`,
-      content: <>确认{OperationName[operationStatus]}选中的变量吗</>,
+      content: (
+        <>
+          {intl.get('确认')}
+          {OperationName[operationStatus]}
+          {intl.get('选中的变量吗')}
+        </>
+      ),
       onOk() {
         request
           .put(
@@ -500,10 +530,10 @@ const Env = () => {
   return (
     <PageContainer
       className="ql-container-wrapper env-wrapper"
-      title="环境变量"
+      title={intl.get('环境变量')}
       extra={[
         <Search
-          placeholder="请输入名称/值/备注"
+          placeholder={intl.get('请输入名称/值/备注')}
           style={{ width: 'auto' }}
           enterButton
           loading={loading}
@@ -515,11 +545,11 @@ const Env = () => {
             icon={<UploadOutlined />}
             loading={importLoading}
           >
-            导入
+            {intl.get('导入')}
           </Button>
         </Upload>,
         <Button key="2" type="primary" onClick={() => addEnv()}>
-          新建变量
+          {intl.get('创建变量')}
         </Button>,
       ]}
       header={{
@@ -534,39 +564,40 @@ const Env = () => {
               style={{ marginBottom: 5 }}
               onClick={modifyName}
             >
-              批量修改变量名称
+              {intl.get('批量修改变量名称')}
             </Button>
             <Button
               type="primary"
               style={{ marginBottom: 5, marginLeft: 8 }}
               onClick={delEnvs}
             >
-              批量删除
+              {intl.get('批量删除')}
             </Button>
             <Button
               type="primary"
               onClick={() => exportEnvs()}
               style={{ marginLeft: 8, marginRight: 8 }}
             >
-              批量导出
+              {intl.get('批量导出')}
             </Button>
             <Button
               type="primary"
               onClick={() => operateEnvs(0)}
               style={{ marginLeft: 8, marginBottom: 5 }}
             >
-              批量启用
+              {intl.get('批量启用')}
             </Button>
             <Button
               type="primary"
               onClick={() => operateEnvs(1)}
               style={{ marginLeft: 8, marginRight: 8 }}
             >
-              批量禁用
+              {intl.get('批量禁用')}
             </Button>
             <span style={{ marginLeft: 8 }}>
-              已选择
-              <a>{selectedRowIds?.length}</a>项
+              {intl.get('已选择')}
+              <a>{selectedRowIds?.length}</a>
+              {intl.get('项')}
             </span>
           </div>
         )}
@@ -578,7 +609,7 @@ const Env = () => {
             dataSource={value}
             rowKey="id"
             size="middle"
-            scroll={{ x: 1000, y: tableScrollHeight }}
+            scroll={{ x: 1200, y: tableScrollHeight }}
             components={vt}
             loading={loading}
             onRow={(record: any, index: number | undefined) => {

src/pages/env/modal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form, Radio } from 'antd';
 import { request } from '@/utils/http';
@@ -43,7 +44,9 @@ const EnvModal = ({
       );
 
       if (code === 200) {
-        message.success(env ? '更新变量成功' : '新建变量成功');
+        message.success(
+          env ? intl.get('更新变量成功') : intl.get('创建变量成功'),
+        );
         handleCancel(data);
       }
       setLoading(false);
@@ -58,7 +61,7 @@ const EnvModal = ({
 
   return (
     <Modal
-      title={env ? '编辑变量' : '新建变量'}
+      title={env ? intl.get('编辑变量') : intl.get('创建变量')}
       open={visible}
       forceRender
       centered
@@ -79,45 +82,52 @@ const EnvModal = ({
       <Form form={form} layout="vertical" name="env_modal" initialValues={env}>
         <Form.Item
           name="name"
-          label="名称"
+          label={intl.get('名称')}
           rules={[
-            { required: true, message: '请输入环境变量名称', whitespace: true },
+            {
+              required: true,
+              message: intl.get('请输入环境变量名称'),
+              whitespace: true,
+            },
             {
               pattern: /^[a-zA-Z_][0-9a-zA-Z_]*$/,
-              message: '只能输入字母数字下划线，且不能以数字开头',
+              message: intl.get('只能输入字母数字下划线，且不能以数字开头'),
             },
           ]}
         >
-          <Input placeholder="请输入环境变量名称" />
+          <Input placeholder={intl.get('请输入环境变量名称')} />
         </Form.Item>
         {!env && (
           <Form.Item
             name="split"
-            label="自动拆分"
+            label={intl.get('自动拆分')}
             initialValue="0"
-            tooltip="多个依赖是否换行分割"
+            tooltip={intl.get('多个依赖是否换行分割')}
           >
             <Radio.Group>
-              <Radio value="1">是</Radio>
-              <Radio value="0">否</Radio>
+              <Radio value="1">{intl.get('是')}</Radio>
+              <Radio value="0">{intl.get('否')}</Radio>
             </Radio.Group>
           </Form.Item>
         )}
         <Form.Item
           name="value"
-          label="值"
+          label={intl.get('值')}
           rules={[
-            { required: true, message: '请输入环境变量值', whitespace: true },
+            {
+              required: true,
+              message: intl.get('请输入环境变量值'),
+              whitespace: true,
+            },
           ]}
         >
           <Input.TextArea
-            rows={4}
-            autoSize={true}
-            placeholder="请输入环境变量值"
+            autoSize={{ minRows: 1, maxRows: 8 }}
+            placeholder={intl.get('请输入环境变量值')}
           />
         </Form.Item>
-        <Form.Item name="remarks" label="备注">
-          <Input placeholder="请输入备注" />
+        <Form.Item name="remarks" label={intl.get('备注')}>
+          <Input placeholder={intl.get('请输入备注')} />
         </Form.Item>
       </Form>
     </Modal>

src/pages/error/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useState, useEffect, useRef } from 'react';
 import config from '@/utils/config';
 import { request } from '@/utils/http';
@@ -8,17 +9,22 @@ import { SharedContext } from '@/layouts';
 import { Alert, Typography } from 'antd';
 
 const Error = () => {
-  const { user, theme, reloadUser } = useOutletContext<SharedContext>();
+  const { user } = useOutletContext<SharedContext>();
   const [loading, setLoading] = useState(false);
-  const [data, setData] = useState('暂无日志');
+  const [data, setData] = useState(intl.get('暂无日志'));
   const retryTimes = useRef(1);
 
-  const getLog = (needLoading: boolean = true) => {
+  const getHealthStatus = (needLoading: boolean = true) => {
     needLoading && setLoading(true);
     request
       .get(`${config.apiPrefix}public/health`)
       .then(({ error, data }) => {
         if (data?.status === 1) {
+          if (retryTimes.current > 1) {
+            setTimeout(() => {
+              window.location.reload();
+            });
+          }
           return;
         }
         if (retryTimes.current > 3) {
@@ -27,7 +33,7 @@ const Error = () => {
         }
         retryTimes.current += 1;
         setTimeout(() => {
-          getLog(false);
+          getHealthStatus(false);
         }, 3000);
       })
       .finally(() => needLoading && setLoading(false));
@@ -40,7 +46,7 @@ const Error = () => {
   }, [user]);
 
   useEffect(() => {
-    getLog();
+    getHealthStatus();
   }, []);
 
   return (
@@ -54,22 +60,24 @@ const Error = () => {
             type="error"
             message={
               <Typography.Title level={5} type="danger">
-                服务启动超时
+                {intl.get('服务启动超时')}
               </Typography.Title>
             }
             description={
               <Typography.Text type="danger">
-                <div>请先按如下方式修复：</div>
+                <div>{intl.get('请先按如下方式修复：')}</div>
                 <div>
                   1. 宿主机执行 docker run --rm -v
                   /var/run/docker.sock:/var/run/docker.sock
                   containrrr/watchtower -cR &lt;容器名&gt;
                 </div>
-                <div>2. 容器内执行 ql -l check、ql -l update</div>
+                <div>{intl.get('2. 容器内执行 ql -l check、ql -l update')}</div>
                 <div>
-                  3. 如果无法解决，容器内执行 pm2 logs，拷贝执行结果
+                  {intl.get(
+                    '3. 如果无法解决，容器内执行 pm2 logs，拷贝执行结果'
+                  )}
                   <Typography.Link href="https://github.com/whyour/qinglong/issues/new?assignees=&labels=&template=bug_report.yml">
-                    提交 issue
+                    {intl.get('提交 issue')}
                   </Typography.Link>
                 </div>
               </Typography.Text>
@@ -81,7 +89,7 @@ const Error = () => {
           </Typography.Paragraph>
         </div>
       ) : (
-        <PageLoading tip="启动中，请稍后..." />
+        <PageLoading tip={intl.get('启动中，请稍后...')} />
       )}
     </div>
   );

src/pages/initialization/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { Fragment, useEffect, useState } from 'react';
 import {
   Button,
@@ -50,9 +51,7 @@ const Initialization = () => {
   const submitNotification = (values: any) => {
     setLoading(true);
     request
-      .put(`${config.apiPrefix}user/notification/init`, {
-        values,
-      })
+      .put(`${config.apiPrefix}user/notification/init`, values)
       .then(({ code, data }) => {
         if (code === 200) {
           next();
@@ -72,15 +71,15 @@ const Initialization = () => {
 
   const steps = [
     {
-      title: '欢迎使用',
+      title: intl.get('欢迎使用'),
       content: (
         <div className={styles.top} style={{ marginTop: 30 }}>
           <div className={styles.header}>
-            <span className={styles.title}>欢迎使用青龙</span>
+            <span className={styles.title}>{intl.get('欢迎使用青龙')}</span>
             <span className={styles.desc}>
-              支持python3、javaScript、shell、typescript 的定时任务管理面板（A
-              timed task management panel that supports typescript, javaScript,
-              python3, and shell.）
+              {intl.get(
+                '支持python3、javascript、shell、typescript 的定时任务管理面板',
+              )}
             </span>
           </div>
           <div className={styles.action}>
@@ -90,42 +89,42 @@ const Initialization = () => {
                 next();
               }}
             >
-              开始安装
+              {intl.get('开始安装')}
             </Button>
           </div>
         </div>
       ),
     },
     {
-      title: '账户设置',
+      title: intl.get('账户设置'),
       content: (
         <Form onFinish={submitAccountSetting} layout="vertical">
           <Form.Item
-            label="用户名"
+            label={intl.get('用户名')}
             name="username"
             rules={[{ required: true }]}
             style={{ maxWidth: 350 }}
           >
-            <Input placeholder="用户名" />
+            <Input placeholder={intl.get('用户名')} />
           </Form.Item>
           <Form.Item
-            label="密码"
+            label={intl.get('密码')}
             name="password"
             rules={[
               { required: true },
               {
                 pattern: /^(?!admin$).*$/,
-                message: '密码不能为admin',
+                message: intl.get('密码不能为admin'),
               },
             ]}
             hasFeedback
             style={{ maxWidth: 350 }}
           >
-            <Input type="password" placeholder="密码" />
+            <Input type="password" placeholder={intl.get('密码')} />
           </Form.Item>
           <Form.Item
             name="confirm"
-            label="确认密码"
+            label={intl.get('确认密码')}
             dependencies={['password']}
             hasFeedback
             style={{ maxWidth: 350 }}
@@ -138,32 +137,34 @@ const Initialization = () => {
                   if (!value || getFieldValue('password') === value) {
                     return Promise.resolve();
                   }
-                  return Promise.reject(new Error('您输入的两个密码不匹配！'));
+                  return Promise.reject(
+                    new Error(intl.get('您输入的两个密码不匹配！')),
+                  );
                 },
               }),
             ]}
           >
-            <Input.Password placeholder="确认密码" />
+            <Input.Password placeholder={intl.get('确认密码')} />
           </Form.Item>
           <Button type="primary" htmlType="submit" loading={loading}>
-            提交
+            {intl.get('提交')}
           </Button>
         </Form>
       ),
     },
     {
-      title: '通知设置',
+      title: intl.get('通知设置'),
       content: (
         <Form onFinish={submitNotification} layout="vertical">
           <Form.Item
-            label="通知方式"
+            label={intl.get('通知方式')}
             name="type"
-            rules={[{ required: true, message: '请选择通知方式' }]}
+            rules={[{ required: true, message: intl.get('请选择通知方式') }]}
             style={{ maxWidth: 350 }}
           >
             <Select
               onChange={notificationModeChange}
-              placeholder="请选择通知方式"
+              placeholder={intl.get('请选择通知方式')}
             >
               {config.notificationModes
                 .filter((x) => x.value !== 'closed')
@@ -184,31 +185,31 @@ const Initialization = () => {
               style={{ maxWidth: 400 }}
             >
               <Input.TextArea
-                autoSize={true}
+                autoSize={{ minRows: 1, maxRows: 5 }}
                 placeholder={`请输入${x.label}`}
               />
             </Form.Item>
           ))}
           <Button type="primary" htmlType="submit" loading={loading}>
-            保存
+            {intl.get('保存')}
           </Button>
           <Button type="link" htmlType="button" onClick={() => next()}>
-            跳过
+            {intl.get('跳过')}
           </Button>
         </Form>
       ),
     },
     {
-      title: '完成安装',
+      title: intl.get('完成安装'),
       content: (
         <div className={styles.top} style={{ marginTop: 80 }}>
           <div className={styles.header}>
-            <span className={styles.title}>恭喜安装完成！</span>
+            <span className={styles.title}>{intl.get('恭喜安装完成！')}</span>
             <Link href="https://github.com/whyour/qinglong" target="_blank">
               Github
             </Link>
             <Link href="https://t.me/jiao_long" target="_blank">
-              Telegram频道
+              {intl.get('Telegram频道')}
             </Link>
           </div>
           <div style={{ marginTop: 16 }}>
@@ -218,7 +219,7 @@ const Initialization = () => {
                 window.location.reload();
               }}
             >
-              去登录
+              {intl.get('去登录')}
             </Button>
           </div>
         </div>
@@ -235,7 +236,7 @@ const Initialization = () => {
             className={styles.logo}
             src="https://qn.whyour.cn/logo.png"
           />
-          <span className={styles.title}>初始化配置</span>
+          <span className={styles.title}>{intl.get('初始化配置')}</span>
         </div>
       </div>
       <div className={styles.main}>

src/pages/log/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal'
 import { useState, useEffect, useCallback, Key, useRef } from 'react';
 import {
   TreeSelect,
@@ -15,7 +16,7 @@ import { PageContainer } from '@ant-design/pro-layout';
 import Editor from '@monaco-editor/react';
 import { request } from '@/utils/http';
 import styles from './index.module.less';
-import { Controlled as CodeMirror } from 'react-codemirror2';
+import CodeMirror from '@uiw/react-codemirror';
 import SplitPane from 'react-split-pane';
 import { useOutletContext } from '@umijs/max';
 import { SharedContext } from '@/layouts';
@@ -29,7 +30,7 @@ const { Text } = Typography;
 
 const Log = () => {
   const { headerStyle, isPhone, theme } = useOutletContext<SharedContext>();
-  const [value, setValue] = useState('请选择日志文件');
+  const [value, setValue] = useState(intl.get('请选择日志文件'));
   const [select, setSelect] = useState<string>('');
   const [data, setData] = useState<any[]>([]);
   const [loading, setLoading] = useState(false);
@@ -70,11 +71,11 @@ const Log = () => {
     }
 
     if (node.type === 'directory') {
-      setValue('请选择日志文件');
+      setValue(intl.get('请选择日志文件'));
       return;
     }
 
-    setValue('加载中...');
+    setValue(intl.get('加载中...'));
     getLog(node);
   };
 
@@ -112,12 +113,12 @@ const Log = () => {
       title: `确认删除`,
       content: (
         <>
-          确认删除
+          {intl.get('确认删除')}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {select}
           </Text>
-          文件{currentNode.type === 'directory' ? '夹下所以日志' : ''}
-          ，删除后不可恢复
+          {intl.get('文件')}{currentNode.type === 'directory' ? intl.get('夹下所以日志') : ''}
+          {intl.get('，删除后不可恢复')}
         </>
       ),
       onOk() {
@@ -160,7 +161,7 @@ const Log = () => {
   const initState = () => {
     setSelect('');
     setCurrentNode(null);
-    setValue('请选择脚本文件');
+    setValue(intl.get('请选择脚本文件'));
   };
 
   const onExpand = (expKeys: any) => {
@@ -191,7 +192,7 @@ const Log = () => {
                 value={select}
                 dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
                 treeData={data}
-                placeholder="请选择日志"
+                placeholder={intl.get('请选择日志')}
                 fieldNames={{ value: 'key' }}
                 treeNodeFilterProp="title"
                 showSearch
@@ -200,7 +201,7 @@ const Log = () => {
               />,
             ]
           : [
-              <Tooltip title="删除">
+              <Tooltip title={intl.get('删除')}>
                 <Button
                   type="primary"
                   disabled={!select}
@@ -224,7 +225,7 @@ const Log = () => {
                   <Input.Search
                     className={styles['left-tree-search']}
                     onChange={onSearch}
-                    placeholder="请输入日志名"
+                    placeholder={intl.get('请输入日志名')}
                     allowClear
                   ></Input.Search>
                   <div className={styles['left-tree-scroller']} ref={treeDom}>
@@ -252,7 +253,7 @@ const Log = () => {
                   }}
                 >
                   <Empty
-                    description="暂无日志"
+                    description={intl.get('暂无日志')}
                     image={Empty.PRESENTED_IMAGE_SIMPLE}
                   />
                 </div>
@@ -277,17 +278,11 @@ const Log = () => {
         {isPhone && (
           <CodeMirror
             value={value}
-            options={{
-              lineNumbers: true,
-              lineWrapping: true,
-              styleActiveLine: true,
-              matchBrackets: true,
-              readOnly: true,
-            }}
-            onBeforeChange={(editor, data, value) => {
+            readOnly={true}
+            theme={theme.includes('dark') ? 'dark' : 'light'}
+            onChange={(value, viewUpdate) => {
               setValue(value);
             }}
-            onChange={(editor, data, value) => {}}
           />
         )}
       </div>

src/pages/login/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { Fragment, useEffect, useState } from 'react';
 import {
   Button,
@@ -80,17 +81,29 @@ const Login = () => {
       } = data;
       localStorage.setItem(config.authKey, token);
       notification.success({
-        message: '登录成功！',
+        message: intl.get('登录成功！'),
         description: (
           <>
             <div>
-              上次登录时间：
+              {intl.get('上次登录时间：')}
               {lastlogon ? new Date(lastlogon).toLocaleString() : '-'}
             </div>
-            <div>上次登录地点：{lastaddr || '-'}</div>
-            <div>上次登录IP：{lastip || '-'}</div>
-            <div>上次登录设备：{platform || '-'}</div>
-            <div>上次登录状态：{retries > 0 ? `失败${retries}次` : '成功'}</div>
+            <div>
+              {intl.get('上次登录地点：')}
+              {lastaddr || '-'}
+            </div>
+            <div>
+              {intl.get('上次登录IP：')}
+              {lastip || '-'}
+            </div>
+            <div>
+              {intl.get('上次登录设备：')}
+              {platform || '-'}
+            </div>
+            <div>
+              {intl.get('上次登录状态：')}
+              {retries > 0 ? `失败${retries}次` : intl.get('成功')}
+            </div>
           </>
         ),
       });
@@ -136,7 +149,7 @@ const Login = () => {
             src="https://qn.whyour.cn/logo.png"
           />
           <span className={styles.title}>
-            {twoFactor ? '两步验证' : config.siteName}
+            {twoFactor ? intl.get('两步验证') : config.siteName}
           </span>
         </div>
       </div>
@@ -145,17 +158,17 @@ const Login = () => {
           <Form layout="vertical" onFinish={completeTowFactor}>
             <FormItem
               name="code"
-              label="验证码"
+              label={intl.get('验证码')}
               rules={[
                 {
                   pattern: /^[0-9]{6}$/,
-                  message: '验证码为6位数字',
+                  message: intl.get('验证码为6位数字'),
                 },
               ]}
               validateTrigger="onBlur"
             >
               <Input
-                placeholder="6位数字"
+                placeholder={intl.get('6位数字')}
                 onChange={codeInputChange}
                 autoFocus
                 autoComplete="off"
@@ -167,27 +180,29 @@ const Login = () => {
               style={{ width: '100%' }}
               loading={verifying}
             >
-              验证
+              {intl.get('验证')}
             </Button>
           </Form>
         ) : (
           <Form layout="vertical" onFinish={handleOk}>
-            <FormItem name="username" label="用户名" hasFeedback>
+            <FormItem name="username" label={intl.get('用户名')} hasFeedback>
               <Input
-                placeholder={`用户名${isDemoEnv ? ': admin' : ''}`}
+                placeholder={`${intl.get('用户名')}${
+                  isDemoEnv ? ': admin' : ''
+                }`}
                 autoFocus
               />
             </FormItem>
-            <FormItem name="password" label="密码" hasFeedback>
+            <FormItem name="password" label={intl.get('密码')} hasFeedback>
               <Input
                 type="password"
-                placeholder={`密码${isDemoEnv ? ': 123' : ''}`}
+                placeholder={`${intl.get('密码')}${isDemoEnv ? ': 123' : ''}`}
               />
             </FormItem>
             <Row>
               {waitTime ? (
                 <Button type="primary" style={{ width: '100%' }} disabled>
-                  请
+                  {intl.get('请')}
                   <Countdown
                     valueStyle={{
                       color:
@@ -200,7 +215,7 @@ const Login = () => {
                     format="ss"
                     value={Date.now() + 1000 * waitTime}
                   />
-                  秒后重试
+                  {intl.get('秒后重试')}
                 </Button>
               ) : (
                 <Button
@@ -209,7 +224,7 @@ const Login = () => {
                   style={{ width: '100%' }}
                   loading={loading}
                 >
-                  登录
+                  {intl.get('登录')}
                 </Button>
               )}
             </Row>
@@ -220,7 +235,9 @@ const Login = () => {
         {twoFactor ? (
           <div style={{ paddingLeft: 20, position: 'relative' }}>
             <MobileOutlined style={{ position: 'absolute', left: 0, top: 4 }} />
-            在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。
+            {intl.get(
+              '在您的设备上打开两步验证应用程序以查看您的身份验证代码并验证您的身份。',
+            )}
           </div>
         ) : (
           ''

src/pages/script/editModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState, useRef } from 'react';
 import { Drawer, Button, Tabs, Badge, Select, TreeSelect } from 'antd';
 import { request } from '@/utils/http';
@@ -7,21 +8,9 @@ import Editor from '@monaco-editor/react';
 import SaveModal from './saveModal';
 import SettingModal from './setting';
 import { useTheme } from '@/utils/hooks';
-import { logEnded } from '@/utils';
+import { getEditorMode, logEnded } from '@/utils';
 
 const { Option } = Select;
-const LangMap: any = {
-  '.py': 'python',
-  '.js': 'javascript',
-  '.sh': 'shell',
-  '.ts': 'typescript',
-};
-const prefixMap: any = {
-  python: '.py',
-  javascript: '.js',
-  shell: '.sh',
-  typescript: '.ts',
-};
 
 const EditModal = ({
   treeData,
@@ -64,7 +53,7 @@ const EditModal = ({
       return;
     }
 
-    const newMode = LangMap[value.slice(-3)] || '';
+    const newMode = getEditorMode(value);
     setCNode(node);
     setLanguage(newMode);
     getDetail(node);
@@ -144,7 +133,7 @@ const EditModal = ({
       setCNode(currentNode);
       setValue(content as string);
       setSelectedKey(currentNode.key);
-      const newMode = LangMap[currentNode.title.slice(-3)] || '';
+      const newMode = getEditorMode(currentNode.title);
       setLanguage(newMode);
     }
   }, [content, currentNode]);
@@ -161,7 +150,7 @@ const EditModal = ({
             value={selectedKey}
             dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
             treeData={treeData}
-            placeholder="请选择脚本文件"
+            placeholder={intl.get('请选择脚本文件')}
             fieldNames={{ value: 'key', label: 'title' }}
             showSearch
             onSelect={onSelect}
@@ -183,7 +172,7 @@ const EditModal = ({
             style={{ marginRight: 8 }}
             onClick={isRunning ? stop : run}
           >
-            {isRunning ? '停止' : '运行'}
+            {isRunning ? intl.get('停止') : intl.get('运行')}
           </Button>
           <Button
             type="primary"
@@ -192,17 +181,17 @@ const EditModal = ({
               setLog('');
             }}
           >
-            清空日志
+            {intl.get('清空日志')}
           </Button>
-          <Button
+          {/* <Button
             type="primary"
             style={{ marginRight: 8 }}
             onClick={() => {
               setSettingModalVisible(true);
             }}
           >
-            设置
-          </Button>
+            {intl.get('设置')}
+          </Button> */}
           <Button
             type="primary"
             style={{ marginRight: 8 }}
@@ -210,7 +199,7 @@ const EditModal = ({
               setSaveModalVisible(true);
             }}
           >
-            保存
+            {intl.get('保存')}
           </Button>
           <Button
             type="primary"
@@ -220,7 +209,7 @@ const EditModal = ({
               handleCancel();
             }}
           >
-            退出
+            {intl.get('退出')}
           </Button>
         </>
       }
@@ -235,6 +224,7 @@ const EditModal = ({
         minSize={200}
         defaultSize="50%"
         style={{ height: 'calc(100vh - 55px)' }}
+        pane2Style={{ overflowY: 'auto' }}
       >
         <Editor
           language={language}
@@ -252,7 +242,6 @@ const EditModal = ({
         />
         <pre
           style={{
-            height: '100%',
             padding: '0 15px',
           }}
         >

src/pages/script/editNameModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import {
   Modal,
@@ -47,7 +48,9 @@ const EditScriptNameModal = ({
       .post(`${config.apiPrefix}scripts`, formData)
       .then(({ code, data }) => {
         if (code === 200) {
-          message.success(directory ? '新建文件夹成功' : '新建文件成功');
+          message.success(
+            directory ? intl.get('创建文件夹成功') : intl.get('创建文件成功'),
+          );
           const key = path ? `${path}/` : '';
           const filename = file ? file.name : inputFilename;
           handleCancel({
@@ -96,7 +99,7 @@ const EditScriptNameModal = ({
 
   return (
     <Modal
-      title="新建"
+      title={intl.get('创建')}
       open={visible}
       forceRender
       centered
@@ -117,58 +120,60 @@ const EditScriptNameModal = ({
       <Form form={form} layout="vertical" name="edit_name_modal">
         <Form.Item
           name="type"
-          label="类型"
+          label={intl.get('类型')}
           rules={[{ required: true }]}
           initialValue={'blank'}
         >
           <Radio.Group onChange={typeChange}>
-            <Radio value="blank">空文件</Radio>
-            <Radio value="upload">本地文件</Radio>
-            <Radio value="directory">文件夹</Radio>
+            <Radio value="blank">{intl.get('空文件')}</Radio>
+            <Radio value="upload">{intl.get('本地文件')}</Radio>
+            <Radio value="directory">{intl.get('文件夹')}</Radio>
           </Radio.Group>
         </Form.Item>
         {type === 'blank' && (
           <Form.Item
             name="filename"
-            label="文件名"
+            label={intl.get('文件名')}
             rules={[
-              { required: true, message: '请输入文件名' },
+              { required: true, message: intl.get('请输入文件名') },
               {
                 validator: (_, value) =>
                   value.includes('/')
-                    ? Promise.reject(new Error('文件名不能包含斜杠'))
+                    ? Promise.reject(new Error(intl.get('文件名不能包含斜杠')))
                     : Promise.resolve(),
               },
             ]}
           >
-            <Input placeholder="请输入文件名" />
+            <Input placeholder={intl.get('请输入文件名')} />
           </Form.Item>
         )}
         {type === 'directory' && (
           <Form.Item
             name="directory"
-            label="文件夹名"
-            rules={[{ required: true, message: '请输入文件夹名' }]}
+            label={intl.get('文件夹名')}
+            rules={[{ required: true, message: intl.get('请输入文件夹名') }]}
           >
-            <Input placeholder="请输入文件夹名" />
+            <Input placeholder={intl.get('请输入文件夹名')} />
           </Form.Item>
         )}
-        <Form.Item label="父目录" name="path">
+        <Form.Item label={intl.get('父目录')} name="path">
           <TreeSelect
             allowClear
             treeData={dirs}
             fieldNames={{ value: 'key', label: 'title' }}
-            placeholder="请选择父目录"
+            placeholder={intl.get('请选择父目录')}
             treeDefaultExpandAll
           />
         </Form.Item>
         {type === 'upload' && (
-          <Form.Item label="文件" name="file">
+          <Form.Item label={intl.get('文件')} name="file">
             <Upload.Dragger beforeUpload={beforeUpload} maxCount={1}>
               <p className="ant-upload-drag-icon">
                 <UploadOutlined />
               </p>
-              <p className="ant-upload-text">点击或者拖拽文件到此区域上传</p>
+              <p className="ant-upload-text">
+                {intl.get('点击或者拖拽文件到此区域上传')}
+              </p>
             </Upload.Dragger>
           </Form.Item>
         )}

src/pages/script/index.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import { useState, useEffect, useCallback, Key, useRef } from 'react';
 import {
   TreeSelect,
@@ -19,7 +20,7 @@ import Editor from '@monaco-editor/react';
 import { request } from '@/utils/http';
 import styles from './index.module.less';
 import EditModal from './editModal';
-import { Controlled as CodeMirror } from 'react-codemirror2';
+import CodeMirror from '@uiw/react-codemirror';
 import SplitPane from 'react-split-pane';
 import {
   DeleteOutlined,
@@ -36,26 +37,20 @@ import EditScriptNameModal from './editNameModal';
 import debounce from 'lodash/debounce';
 import { history, useOutletContext, useLocation } from '@umijs/max';
 import { parse } from 'query-string';
-import { depthFirstSearch, findNode } from '@/utils';
+import { depthFirstSearch, findNode, getEditorMode } from '@/utils';
 import { SharedContext } from '@/layouts';
 import useFilterTreeData from '@/hooks/useFilterTreeData';
 import uniq from 'lodash/uniq';
 import IconFont from '@/components/iconfont';
 import RenameModal from './renameModal';
+import { langs } from '@uiw/codemirror-extensions-langs';
 
 const { Text } = Typography;
 
-const LangMap: any = {
-  '.py': 'python',
-  '.js': 'javascript',
-  '.sh': 'shell',
-  '.ts': 'typescript',
-};
-
 const Script = () => {
   const { headerStyle, isPhone, theme, socketMessage } =
     useOutletContext<SharedContext>();
-  const [value, setValue] = useState('请选择脚本文件');
+  const [value, setValue] = useState(intl.get('请选择脚本文件'));
   const [select, setSelect] = useState<string>('');
   const [data, setData] = useState<any[]>([]);
   const [loading, setLoading] = useState(false);
@@ -128,13 +123,13 @@ const Script = () => {
     }
 
     if (node.type === 'directory') {
-      setValue('请选择脚本文件');
+      setValue(intl.get('请选择脚本文件'));
       return;
     }
 
-    const newMode = value ? LangMap[value.slice(-3)] : '';
+    const newMode = getEditorMode(value);
     setMode(isPhone && newMode === 'typescript' ? 'javascript' : newMode);
-    setValue('加载中...');
+    setValue(intl.get('加载中...'));
     getDetail(node);
   };
 
@@ -146,7 +141,7 @@ const Script = () => {
       if (content !== value) {
         Modal.confirm({
           title: `确认离开`,
-          content: <>当前修改未保存，确定离开吗</>,
+          content: <>{intl.get('当前修改未保存，确定离开吗')}</>,
           onOk() {
             onSelect(keys[0], e.node);
             setIsEditing(false);
@@ -200,7 +195,7 @@ const Script = () => {
 
   const cancelEdit = () => {
     setIsEditing(false);
-    setValue('加载中...');
+    setValue(intl.get('加载中...'));
     getDetail(currentNode);
   };
 
@@ -209,11 +204,11 @@ const Script = () => {
       title: `确认保存`,
       content: (
         <>
-          确认保存文件
+          {intl.get('确认保存文件')}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {currentNode.title}
           </Text>{' '}
-          ，保存后不可恢复
+          {intl.get('，保存后不可恢复')}
         </>
       ),
       onOk() {
@@ -249,12 +244,13 @@ const Script = () => {
       title: `确认删除`,
       content: (
         <>
-          确认删除
+          {intl.get('确认删除')}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {select}
           </Text>
-          文件{currentNode.type === 'directory' ? '夹及其子文件' : ''}
-          ，删除后不可恢复
+          {intl.get('文件')}
+          {currentNode.type === 'directory' ? intl.get('夹及其子文件') : ''}
+          {intl.get('，删除后不可恢复')}
         </>
       ),
       onOk() {
@@ -358,7 +354,7 @@ const Script = () => {
   const initState = () => {
     setSelect('');
     setCurrentNode(null);
-    setValue('请选择脚本文件');
+    setValue(intl.get('请选择脚本文件'));
   };
 
   useEffect(() => {
@@ -406,8 +402,8 @@ const Script = () => {
   const menu: MenuProps = isEditing
     ? {
         items: [
-          { label: '保存', key: 'save', icon: <PlusOutlined /> },
-          { label: '退出编辑', key: 'exit', icon: <EditOutlined /> },
+          { label: intl.get('保存'), key: 'save', icon: <PlusOutlined /> },
+          { label: intl.get('退出编辑'), key: 'exit', icon: <EditOutlined /> },
         ],
         onClick: ({ key, domEvent }) => {
           domEvent.stopPropagation();
@@ -416,21 +412,21 @@ const Script = () => {
       }
     : {
         items: [
-          { label: '新建', key: 'add', icon: <PlusOutlined /> },
+          { label: intl.get('创建'), key: 'add', icon: <PlusOutlined /> },
           {
-            label: '编辑',
+            label: intl.get('编辑'),
             key: 'edit',
             icon: <EditOutlined />,
             disabled: !select,
           },
           {
-            label: '重命名',
+            label: intl.get('重命名'),
             key: 'rename',
             icon: <IconFont type="ql-icon-rename" />,
             disabled: !select,
           },
           {
-            label: '删除',
+            label: intl.get('删除'),
             key: 'delete',
             icon: <DeleteOutlined />,
             disabled: !select,
@@ -456,7 +452,7 @@ const Script = () => {
                 value={select}
                 dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
                 treeData={data}
-                placeholder="请选择脚本"
+                placeholder={intl.get('请选择脚本')}
                 fieldNames={{ value: 'key' }}
                 treeNodeFilterProp="title"
                 showSearch
@@ -470,21 +466,21 @@ const Script = () => {
           : isEditing
           ? [
               <Button type="primary" onClick={saveFile}>
-                保存
+                {intl.get('保存')}
               </Button>,
               <Button type="primary" onClick={cancelEdit}>
-                退出编辑
+                {intl.get('退出编辑')}
               </Button>,
             ]
           : [
-              <Tooltip title="新建">
+              <Tooltip title={intl.get('创建')}>
                 <Button
                   type="primary"
                   onClick={addFile}
                   icon={<PlusOutlined />}
                 />
               </Tooltip>,
-              <Tooltip title="编辑">
+              <Tooltip title={intl.get('编辑')}>
                 <Button
                   disabled={!select}
                   type="primary"
@@ -492,7 +488,7 @@ const Script = () => {
                   icon={<EditOutlined />}
                 />
               </Tooltip>,
-              <Tooltip title="重命名">
+              <Tooltip title={intl.get('重命名')}>
                 <Button
                   disabled={!select}
                   type="primary"
@@ -500,7 +496,7 @@ const Script = () => {
                   icon={<IconFont type="ql-icon-rename" />}
                 />
               </Tooltip>,
-              <Tooltip title="删除">
+              <Tooltip title={intl.get('删除')}>
                 <Button
                   type="primary"
                   disabled={!select}
@@ -514,7 +510,7 @@ const Script = () => {
                   setIsLogModalVisible(true);
                 }}
               >
-                调试
+                {intl.get('调试')}
               </Button>,
             ]
       }
@@ -532,7 +528,7 @@ const Script = () => {
                   <Input.Search
                     className={styles['left-tree-search']}
                     onChange={onSearch}
-                    placeholder="请输入脚本名"
+                    placeholder={intl.get('请输入脚本名')}
                     allowClear
                   ></Input.Search>
                   <div className={styles['left-tree-scroller']} ref={treeDom}>
@@ -560,7 +556,7 @@ const Script = () => {
                   }}
                 >
                   <Empty
-                    description="暂无脚本"
+                    description={intl.get('暂无脚本')}
                     image={Empty.PRESENTED_IMAGE_SIMPLE}
                   />
                 </div>
@@ -585,18 +581,14 @@ const Script = () => {
         {isPhone && (
           <CodeMirror
             value={value}
-            options={{
-              lineNumbers: true,
-              lineWrapping: true,
-              styleActiveLine: true,
-              matchBrackets: true,
-              mode,
-              readOnly: !isEditing,
-            }}
-            onBeforeChange={(editor, data, value) => {
+            extensions={
+              mode ? [langs[mode as keyof typeof langs]()] : undefined
+            }
+            theme={theme.includes('dark') ? 'dark' : 'light'}
+            readOnly={!isEditing}
+            onChange={(value) => {
               setValue(value);
             }}
-            onChange={(editor, data, value) => {}}
           />
         )}
         <EditModal

src/pages/script/renameModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form } from 'antd';
 import { request } from '@/utils/http';
@@ -28,7 +29,7 @@ const RenameModal = ({
       );
 
       if (code === 200) {
-        message.success('更新名称成功');
+        message.success(intl.get('更新名称成功'));
         handleCancel();
       }
       setLoading(false);
@@ -43,7 +44,7 @@ const RenameModal = ({
 
   return (
     <Modal
-      title="重命名"
+      title={intl.get('重命名')}
       open={visible}
       forceRender
       centered
@@ -64,9 +65,9 @@ const RenameModal = ({
       <Form form={form} layout="vertical" name="edit_name_modal">
         <Form.Item
           name="name"
-          rules={[{ required: true, message: '请输入新名称' }]}
+          rules={[{ required: true, message: intl.get('请输入新名称') }]}
         >
-          <Input placeholder="请输入新名称" />
+          <Input placeholder={intl.get('请输入新名称')} />
         </Form.Item>
       </Form>
     </Modal>

src/pages/script/saveModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form } from 'antd';
 import { request } from '@/utils/http';
@@ -22,7 +23,7 @@ const SaveModal = ({
       .post(`${config.apiPrefix}scripts`, payload)
       .then(({ code, data }) => {
         if (code === 200) {
-          message.success('保存文件成功');
+          message.success(intl.get('保存文件成功'));
           handleCancel(data);
         }
         setLoading(false);
@@ -36,7 +37,7 @@ const SaveModal = ({
 
   return (
     <Modal
-      title="保存文件"
+      title={intl.get('保存文件')}
       open={visible}
       forceRender
       centered
@@ -62,13 +63,13 @@ const SaveModal = ({
       >
         <Form.Item
           name="filename"
-          label="文件名"
-          rules={[{ required: true, message: '请输入文件名' }]}
+          label={intl.get('文件名')}
+          rules={[{ required: true, message: intl.get('请输入文件名') }]}
         >
-          <Input placeholder="请输入文件名" />
+          <Input placeholder={intl.get('请输入文件名')} />
         </Form.Item>
-        <Form.Item name="path" label="保存目录">
-          <Input placeholder="请输入保存目录，默认scripts目录" />
+        <Form.Item name="path" label={intl.get('保存目录')}>
+          <Input placeholder={intl.get('请输入保存目录，默认scripts目录')} />
         </Form.Item>
       </Form>
     </Modal>

src/pages/script/setting.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form } from 'antd';
 import { request } from '@/utils/http';
@@ -22,7 +23,7 @@ const SettingModal = ({
       .post(`${config.apiPrefix}scripts`, payload)
       .then(({ code, data }) => {
         if (code === 200) {
-          message.success('保存文件成功');
+          message.success(intl.get('保存文件成功'));
           handleCancel(data);
         }
         setLoading(false);
@@ -36,7 +37,7 @@ const SettingModal = ({
 
   return (
     <Modal
-      title="运行设置"
+      title={intl.get('运行设置')}
       open={visible}
       forceRender
       centered
@@ -50,10 +51,10 @@ const SettingModal = ({
       >
         <Form.Item
           name="filename"
-          label="待开发"
-          rules={[{ required: true, message: '待开发' }]}
+          label={intl.get('待开发')}
+          rules={[{ required: true, message: intl.get('待开发') }]}
         >
-          <Input placeholder="待开发" />
+          <Input placeholder={intl.get('待开发')} />
         </Form.Item>
       </Form>
     </Modal>

src/pages/setting/about.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Typography, Input, Form, Button, message, Descriptions } from 'antd';
 import styles from './index.less';
@@ -9,6 +10,7 @@ const { Link } = Typography;
 enum TVersion {
   'develop' = '开发版',
   'master' = '正式版',
+  'debian' = '正式版'
 }
 
 const About = ({ systemInfo }: { systemInfo: SharedContext['systemInfo'] }) => {
@@ -20,27 +22,25 @@ const About = ({ systemInfo }: { systemInfo: SharedContext['systemInfo'] }) => {
         src="https://qn.whyour.cn/logo.png"
       />
       <div className={styles.right}>
-        <span className={styles.title}>青龙</span>
+        <span className={styles.title}>{intl.get('青龙')}</span>
         <span className={styles.desc}>
-          支持python3、javaScript、shell、typescript 的定时任务管理面板（A timed
-          task management panel that supports typescript, javaScript, python3,
-          and shell.）
+          {intl.get(
+            '支持python3、javascript、shell、typescript 的定时任务管理面板',
+          )}
         </span>
         <Descriptions>
-          <Descriptions.Item label="版本" span={3}>
-            {TVersion[systemInfo.branch]} v{systemInfo.version}
+          <Descriptions.Item label={intl.get('版本')} span={3}>
+            {intl.get(TVersion[systemInfo.branch])} v{systemInfo.version}
           </Descriptions.Item>
-          <Descriptions.Item label="更新时间" span={3}>
-            {dayjs(systemInfo.publishTime * 1000).format(
-              'YYYY-MM-DD HH:mm',
-            )}
+          <Descriptions.Item label={intl.get('更新时间')} span={3}>
+            {dayjs(systemInfo.publishTime * 1000).format('YYYY-MM-DD HH:mm')}
           </Descriptions.Item>
-          <Descriptions.Item label="更新日志" span={3}>
+          <Descriptions.Item label={intl.get('更新日志')} span={3}>
             <Link
               href={`https://qn.whyour.cn/version.yaml?t=${Date.now()}`}
               target="_blank"
             >
-              查看
+              {intl.get('查看')}
             </Link>
           </Descriptions.Item>
         </Descriptions>
@@ -57,13 +57,13 @@ const About = ({ systemInfo }: { systemInfo: SharedContext['systemInfo'] }) => {
             target="_blank"
             style={{ marginRight: 15 }}
           >
-            Telegram频道
+            {intl.get('Telegram频道')}
           </Link>
           <Link
             href="https://github.com/whyour/qinglong/issues"
             target="_blank"
           >
-            提交BUG
+            {intl.get('提交BUG')}
           </Link>
         </div>
       </div>

src/pages/setting/appModal.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Modal, message, Input, Form, Select } from 'antd';
 import { request } from '@/utils/http';
@@ -29,7 +30,9 @@ const AppModal = ({
       );
 
       if (code === 200) {
-        message.success(app ? '更新应用成功' : '新建应用成功');
+        message.success(
+          app ? intl.get('更新应用成功') : intl.get('创建应用成功'),
+        );
         handleCancel(data);
       }
       setLoading(false);
@@ -44,7 +47,7 @@ const AppModal = ({
 
   return (
     <Modal
-      title={app ? '编辑应用' : '新建应用'}
+      title={app ? intl.get('编辑应用') : intl.get('创建应用')}
       open={visible}
       forceRender
       centered
@@ -70,22 +73,26 @@ const AppModal = ({
       >
         <Form.Item
           name="name"
-          label="名称"
+          label={intl.get('名称')}
           rules={[
             {
               validator: (_, value) =>
                 ['system'].includes(value)
-                  ? Promise.reject(new Error('名称不能为保留关键字'))
+                  ? Promise.reject(new Error(intl.get('名称不能为保留关键字')))
                   : Promise.resolve(),
             },
           ]}
         >
-          <Input placeholder="请输入应用名称" />
+          <Input placeholder={intl.get('请输入应用名称')} />
         </Form.Item>
-        <Form.Item name="scopes" label="权限" rules={[{ required: true }]}>
+        <Form.Item
+          name="scopes"
+          label={intl.get('权限')}
+          rules={[{ required: true }]}
+        >
           <Select
             mode="multiple"
-            placeholder="请选择模块权限"
+            placeholder={intl.get('请选择模块权限')}
             allowClear
             style={{ width: '100%' }}
           >

src/pages/setting/checkUpdate.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState, useRef } from 'react';
 import { Statistic, Modal, Tag, Button, Spin, message } from 'antd';
 import { request } from '@/utils/http';
@@ -13,7 +14,7 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
   const checkUpgrade = () => {
     if (updateLoading) return;
     setUpdateLoading(true);
-    message.loading('检查更新中...', 0);
+    message.loading(intl.get('检查更新中...'), 0);
     request
       .put(`${config.apiPrefix}system/update-check`)
       .then(({ code, data }) => {
@@ -38,16 +39,17 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
   const showForceUpdateModal = (data: any) => {
     Modal.confirm({
       width: 500,
-      title: '更新',
+      title: intl.get('更新'),
       content: (
         <>
-          <div>已经是最新版了！</div>
+          <div>{intl.get('已经是最新版了！')}</div>
           <div style={{ fontSize: 12, fontWeight: 400, marginTop: 5 }}>
-            青龙 {data.lastVersion} 是目前检测到的最新可用版本了。
+            {intl.get('青龙')} {data.lastVersion}{' '}
+            {intl.get('是目前检测到的最新可用版本了。')}
           </div>
         </>
       ),
-      okText: '重新下载',
+      okText: intl.get('重新下载'),
       onOk() {
         showUpdatingModal();
         request
@@ -66,24 +68,16 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
       width: 500,
       title: (
         <>
-          <div>更新可用</div>
+          <div>{intl.get('更新可用')}</div>
           <div style={{ fontSize: 12, fontWeight: 400, marginTop: 5 }}>
-            新版本 {lastVersion} 可用，你使用的版本为 {systemInfo.version}。
+            {intl.get('新版本')} {lastVersion}{' '}
+            {intl.get('可用，你使用的版本为')} {systemInfo.version}。
           </div>
         </>
       ),
-      content: (
-        <pre
-          style={{
-            fontSize: 12,
-            fontWeight: 400,
-          }}
-        >
-          {lastLog}
-        </pre>
-      ),
-      okText: '下载更新',
-      cancelText: '以后再说',
+      content: <pre>{lastLog}</pre>,
+      okText: intl.get('下载更新'),
+      cancelText: intl.get('以后再说'),
       onOk() {
         showUpdatingModal();
         request
@@ -104,18 +98,9 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
       closable: false,
       keyboard: false,
       okButtonProps: { disabled: true },
-      title: '下载更新中...',
+      title: intl.get('下载更新中...'),
       centered: true,
-      content: (
-        <pre
-          style={{
-            fontSize: 12,
-            fontWeight: 400,
-          }}
-        >
-          {value}
-        </pre>
-      ),
+      content: <pre>{value}</pre>,
     });
   };
 
@@ -123,10 +108,10 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
     Modal.confirm({
       width: 600,
       maskClosable: false,
-      title: '确认重启',
+      title: intl.get('确认重启'),
       centered: true,
-      content: '系统安装包下载成功，确认重启',
-      okText: '重启',
+      content: intl.get('系统安装包下载成功，确认重启'),
+      okText: intl.get('重启'),
       onOk() {
         request
           .put(`${config.apiPrefix}system/reload`, { type: 'system' })
@@ -134,13 +119,13 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
             message.success({
               content: (
                 <span>
-                  系统将在
+                  {intl.get('系统将在')}
                   <Countdown
                     className="inline-countdown"
                     format="ss"
                     value={Date.now() + 1000 * 30}
                   />
-                  秒后自动刷新
+                  {intl.get('秒后自动刷新')}
                 </span>
               ),
               duration: 30,
@@ -182,21 +167,14 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
       okButtonProps: { disabled: !updateFailed },
       content: (
         <>
-          <pre
-            style={{
-              fontSize: 12,
-              fontWeight: 400,
-            }}
-          >
-            {newMessage}
-          </pre>
+          <pre>{newMessage}</pre>
           <div id="log-identifier" style={{ paddingBottom: 5 }}></div>
         </>
       ),
     });
 
     if (updateFailed && !value.includes('失败，请检查')) {
-      message.error('更新失败，请检查网络及日志或稍后再试');
+      message.error(intl.get('更新失败，请检查网络及日志或稍后再试'));
     }
 
     setValue(newMessage);
@@ -216,7 +194,7 @@ const CheckUpdate = ({ socketMessage, systemInfo }: any) => {
   return (
     <>
       <Button type="primary" onClick={checkUpgrade}>
-        检查更新
+        {intl.get('检查更新')}
       </Button>
     </>
   );

src/pages/setting/index.tsx

@@ -1,4 +1,5 @@
-import React, { useState, useEffect } from 'react';
+import intl from 'react-intl-universal';
+import React, { useState, useEffect, useRef } from 'react';
 import {
   Button,
   InputNumber,
@@ -31,6 +32,8 @@ import About from './about';
 import { useOutletContext } from '@umijs/max';
 import { SharedContext } from '@/layouts';
 import './index.less';
+import CodeMirror from '@uiw/react-codemirror';
+import useResizeObserver from '@react-hook/resize-observer';
 
 const { Text } = Typography;
 const isDemoEnv = window.__ENV__DeployEnv === 'demo';
@@ -40,6 +43,7 @@ const Setting = () => {
     headerStyle,
     isPhone,
     user,
+    theme,
     reloadUser,
     reloadTheme,
     socketMessage,
@@ -47,7 +51,7 @@ const Setting = () => {
   } = useOutletContext<SharedContext>();
   const columns = [
     {
-      title: '名称',
+      title: intl.get('名称'),
       dataIndex: 'name',
       key: 'name',
     },
@@ -68,7 +72,7 @@ const Setting = () => {
       },
     },
     {
-      title: '权限',
+      title: intl.get('权限'),
       dataIndex: 'scopes',
       key: 'scopes',
       width: '40%',
@@ -79,23 +83,23 @@ const Setting = () => {
       },
     },
     {
-      title: '操作',
+      title: intl.get('操作'),
       key: 'action',
       render: (text: string, record: any, index: number) => {
         const isPc = !isPhone;
         return (
           <Space size="middle" style={{ paddingLeft: 8 }}>
-            <Tooltip title={isPc ? '编辑' : ''}>
+            <Tooltip title={isPc ? intl.get('编辑') : ''}>
               <a onClick={() => editApp(record, index)}>
                 <EditOutlined />
               </a>
             </Tooltip>
-            <Tooltip title={isPc ? '重置secret' : ''}>
+            <Tooltip title={isPc ? intl.get('重置secret') : ''}>
               <a onClick={() => resetSecret(record, index)}>
                 <ReloadOutlined />
               </a>
             </Tooltip>
-            <Tooltip title={isPc ? '删除' : ''}>
+            <Tooltip title={isPc ? intl.get('删除') : ''}>
               <a onClick={() => deleteApp(record, index)}>
                 <DeleteOutlined />
               </a>
@@ -112,7 +116,17 @@ const Setting = () => {
   const [editedApp, setEditedApp] = useState<any>();
   const [tabActiveKey, setTabActiveKey] = useState('security');
   const [loginLogData, setLoginLogData] = useState<any[]>([]);
+  const [systemLogData, setSystemLogData] = useState<string>('');
   const [notificationInfo, setNotificationInfo] = useState<any>();
+  const containergRef = useRef<HTMLDivElement>(null);
+  const [height, setHeight] = useState<number>(0);
+
+  useResizeObserver(containergRef, (entry) => {
+    const _height = entry.target.parentElement?.parentElement?.offsetHeight;
+    if (_height && height !== _height - 66) {
+      setHeight(_height - 66);
+    }
+  });
 
   const getApps = () => {
     setLoading(true);
@@ -138,14 +152,14 @@ const Setting = () => {
 
   const deleteApp = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认删除',
+      title: intl.get('确认删除'),
       content: (
         <>
-          确认删除应用{' '}
+          {intl.get('确认删除应用')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          吗
+          {intl.get('吗')}
         </>
       ),
       onOk() {
@@ -153,7 +167,7 @@ const Setting = () => {
           .delete(`${config.apiPrefix}apps`, { data: [record.id] })
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('删除成功');
+              message.success(intl.get('删除成功'));
               const result = [...dataSource];
               result.splice(index, 1);
               setDataSource(result);
@@ -168,16 +182,18 @@ const Setting = () => {
 
   const resetSecret = (record: any, index: number) => {
     Modal.confirm({
-      title: '确认重置',
+      title: intl.get('确认重置'),
       content: (
         <>
-          确认重置应用{' '}
+          {intl.get('确认重置应用')}{' '}
           <Text style={{ wordBreak: 'break-all' }} type="warning">
             {record.name}
           </Text>{' '}
-          的Secret吗
+          {intl.get('的Secret吗')}
           <br />
-          <Text type="secondary">重置Secret会让当前应用所有token失效</Text>
+          <Text type="secondary">
+            {intl.get('重置Secret会让当前应用所有token失效')}
+          </Text>
         </>
       ),
       onOk() {
@@ -185,7 +201,7 @@ const Setting = () => {
           .put(`${config.apiPrefix}apps/${record.id}/reset-secret`)
           .then(({ code, data }) => {
             if (code === 200) {
-              message.success('重置成功');
+              message.success(intl.get('重置成功'));
               handleApp(data);
             }
           });
@@ -229,6 +245,19 @@ const Setting = () => {
       });
   };
 
+  const getSystemLog = () => {
+    request
+      .get<Blob>(`${config.apiPrefix}system/log`, {
+        responseType: 'blob',
+      })
+      .then(async (res) => {
+        setSystemLogData(await res.text());
+      })
+      .catch((error: any) => {
+        console.log(error);
+      });
+  };
+
   const tabChange = (activeKey: string) => {
     setTabActiveKey(activeKey);
     if (activeKey === 'app') {
@@ -237,6 +266,8 @@ const Setting = () => {
       getLoginLog();
     } else if (activeKey === 'notification') {
       getNotification();
+    } else if (activeKey === 'syslog') {
+      getSystemLog();
     }
   };
 
@@ -262,7 +293,7 @@ const Setting = () => {
   return (
     <PageContainer
       className="ql-container-wrapper ql-container-wrapper-has-tab ql-setting-container"
-      title="系统设置"
+      title={intl.get('系统设置')}
       header={{
         style: headerStyle,
       }}
@@ -270,72 +301,94 @@ const Setting = () => {
         tabActiveKey === 'app'
           ? [
               <Button key="2" type="primary" onClick={() => addApp()}>
-                新建应用
+                {intl.get('创建应用')}
               </Button>,
             ]
           : []
       }
     >
-      <Tabs
-        defaultActiveKey="security"
-        size="small"
-        tabPosition="top"
-        onChange={tabChange}
-        items={[
-          ...(!isDemoEnv
-            ? [
-                {
-                  key: 'security',
-                  label: '安全设置',
-                  children: (
-                    <SecuritySettings user={user} userChange={reloadUser} />
-                  ),
-                },
-              ]
-            : []),
-          {
-            key: 'app',
-            label: '应用设置',
-            children: (
-              <Table
-                columns={columns}
-                pagination={false}
-                dataSource={dataSource}
-                rowKey="id"
-                size="middle"
-                scroll={{ x: 768 }}
-                loading={loading}
-              />
-            ),
-          },
-          {
-            key: 'notification',
-            label: '通知设置',
-            children: <NotificationSetting data={notificationInfo} />,
-          },
-          {
-            key: 'login',
-            label: '登录日志',
-            children: <LoginLog data={loginLogData} />,
-          },
-          {
-            key: 'other',
-            label: '其他设置',
-            children: (
-              <Other
-                reloadTheme={reloadTheme}
-                socketMessage={socketMessage}
-                systemInfo={systemInfo}
-              />
-            ),
-          },
-          {
-            key: 'about',
-            label: '关于',
-            children: <About systemInfo={systemInfo} />,
-          },
-        ]}
-      ></Tabs>
+      <div ref={containergRef}>
+        <Tabs
+          defaultActiveKey="security"
+          size="small"
+          tabPosition="top"
+          onChange={tabChange}
+          items={[
+            ...(!isDemoEnv
+              ? [
+                  {
+                    key: 'security',
+                    label: intl.get('安全设置'),
+                    children: (
+                      <SecuritySettings user={user} userChange={reloadUser} />
+                    ),
+                  },
+                ]
+              : []),
+            {
+              key: 'app',
+              label: intl.get('应用设置'),
+              children: (
+                <Table
+                  columns={columns}
+                  pagination={false}
+                  dataSource={dataSource}
+                  rowKey="id"
+                  size="middle"
+                  scroll={{ x: 768 }}
+                  loading={loading}
+                />
+              ),
+            },
+            {
+              key: 'notification',
+              label: intl.get('通知设置'),
+              children: <NotificationSetting data={notificationInfo} />,
+            },
+            {
+              key: 'syslog',
+              label: intl.get('系统日志'),
+              children: (
+                <CodeMirror
+                  maxHeight={`${height}px`}
+                  value={systemLogData}
+                  onCreateEditor={(view) => {
+                    setTimeout(() => {
+                      view.scrollDOM.scrollTo({
+                        top: view.scrollDOM.scrollHeight,
+                        behavior: 'smooth',
+                      });
+                    }, 300);
+                  }}
+                  readOnly={true}
+                  theme={theme.includes('dark') ? 'dark' : 'light'}
+                />
+              ),
+            },
+            {
+              key: 'login',
+              label: intl.get('登录日志'),
+              children: <LoginLog data={loginLogData} />,
+            },
+            {
+              key: 'other',
+              label: intl.get('其他设置'),
+              children: (
+                <Other
+                  reloadTheme={reloadTheme}
+                  socketMessage={socketMessage}
+                  systemInfo={systemInfo}
+                />
+              ),
+            },
+            {
+              key: 'about',
+              label: intl.get('关于'),
+              children: <About systemInfo={systemInfo} />,
+            },
+          ]}
+        ></Tabs>
+      </div>
       <AppModal
         visible={isModalVisible}
         handleCancel={handleCancel}

src/pages/setting/loginLog.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Typography, Table, Tag, Button, Spin, message } from 'antd';
 import { request } from '@/utils/http';
@@ -17,45 +18,48 @@ enum LoginStatusColor {
 
 const columns = [
   {
-    title: '序号',
+    title: intl.get('序号'),
     width: 50,
     render: (text: string, record: any, index: number) => {
       return index + 1;
     },
   },
   {
-    title: '登录时间',
+    title: intl.get('登录时间'),
     dataIndex: 'timestamp',
     key: 'timestamp',
+    width: 120,
     render: (text: string, record: any) => {
       return new Date(record.timestamp).toLocaleString();
     },
   },
   {
-    title: '登录地址',
+    title: intl.get('登录地址'),
     dataIndex: 'address',
+    width: 120,
     key: 'address',
   },
   {
-    title: '登录IP',
+    title: intl.get('登录IP'),
     dataIndex: 'ip',
+    width: 100,
     key: 'ip',
   },
   {
-    title: '登录设备',
+    title: intl.get('登录设备'),
     dataIndex: 'platform',
     key: 'platform',
     width: 80,
   },
   {
-    title: '登录状态',
+    title: intl.get('登录状态'),
     dataIndex: 'status',
     key: 'status',
     width: 80,
     render: (text: string, record: any) => {
       return (
         <Tag color={LoginStatusColor[record.status]} style={{ marginRight: 0 }}>
-          {LoginStatus[record.status]}
+          {intl.get(LoginStatus[record.status])}
         </Tag>
       );
     },
@@ -71,7 +75,7 @@ const LoginLog = ({ data }: any) => {
         dataSource={data}
         rowKey="id"
         size="middle"
-        scroll={{ x: 768 }}
+        scroll={{ x: 1000 }}
         sticky
       />
     </>

src/pages/setting/notification.tsx

@@ -1,3 +1,4 @@
+import intl from 'react-intl-universal';
 import React, { useEffect, useState } from 'react';
 import { Typography, Input, Form, Button, Select, message } from 'antd';
 import { request } from '@/utils/http';
@@ -19,12 +20,12 @@ const NotificationSetting = ({ data }: any) => {
     }
 
     request
-      .put(`${config.apiPrefix}user/notification`, {
-        values,
-      })
+      .put(`${config.apiPrefix}user/notification`, values)
       .then(({ code, data }) => {
         if (code === 200) {
-          message.success(values.type ? '通知发送成功' : '通知关闭成功');
+          message.success(
+            values.type ? intl.get('通知发送成功') : intl.get('通知关闭成功'),
+          );
         }
       })
       .catch((error: any) => {
@@ -50,7 +51,7 @@ const NotificationSetting = ({ data }: any) => {
     <div>
       <Form onFinish={handleOk} form={form} layout="vertical">
         <Form.Item
-          label="通知方式"
+          label={intl.get('通知方式')}
           name="type"
           rules={[{ required: true }]}
           style={{ maxWidth: 400 }}
@@ -87,14 +88,14 @@ const NotificationSetting = ({ data }: any) => {
             ) : (
               <Input.TextArea
                 disabled={loading}
-                autoSize={true}
+                autoSize={{ minRows: 1, maxRows: 5 }}
                 placeholder={x.placeholder || `请输入${x.label}`}
               />
             )}
           </Form.Item>
         ))}
         <Button type="primary" htmlType="submit" disabled={loading}>
-          {loading ? '测试中...' : '保存'}
+          {loading ? intl.get('测试中...') : intl.get('保存')}
         </Button>
       </Form>
     </div>