Merge branch 'develop' into pr/ThatOneCalculator/8764
This commit is contained in:
tamaina
commit
23c0c97e90
135 changed files with 2570 additions and 17275 deletions
17
CHANGELOG.md
17
CHANGELOG.md
|
|
@ -2,6 +2,7 @@
|
|||
## 12.x.x (unreleased)
|
||||
|
||||
### Improvements
|
||||
- Client: Preferences Registry
|
||||
|
||||
### Bugfixes
|
||||
-
|
||||
|
|
@ -11,12 +12,26 @@ You should also include the user name that made the change.
|
|||
|
||||
## 12.x.x (unreleased)
|
||||
|
||||
### Improvements
|
||||
- Client: Add vi-VN language support
|
||||
|
||||
### Bugfixes
|
||||
- Server: リモートユーザーを正しくブロックできるように修正する @xianonn
|
||||
- Client: 一度作ったwebhookの設定画面を開こうとするとページがフリーズする @syuilo
|
||||
- Client: MiAuth認証ページが機能していない @syuilo
|
||||
- Client: 一部のアプリからファイルを投稿フォームへドロップできない場合がある問題を修正 @m-hayabusa
|
||||
|
||||
## 12.117.1 (2022/07/19)
|
||||
|
||||
### Improvements
|
||||
- Client: UIのブラッシュアップ @syuilo
|
||||
|
||||
### Bugfixes
|
||||
- Server: ファイルのアップロードに失敗することがある問題を修正 @acid-chicken
|
||||
- Client: リアクションピッカーがアプリ内ウィンドウの後ろに表示されてしまう問題を修正 @syuilo
|
||||
- Client: ユーザー情報の取得の再試行を修正する @xianonn
|
||||
- Client: ユーザー情報の取得の再試行を修正 @xianonn
|
||||
- Client: MFMチートシートの挙動を修正 @syuilo
|
||||
- Client: 「インスタンスからのお知らせを受け取る」の設定を変更できない問題を修正 @syuilo
|
||||
|
||||
## 12.117.0 (2022/07/18)
|
||||
|
||||
|
|
|
|||
|
|
@ -140,6 +140,34 @@ Misskey uses Vue(v3) as its front-end framework.
|
|||
- **When creating a new component, please use the Composition API (with [setup sugar](https://v3.vuejs.org/api/sfc-script-setup.html) and [ref sugar](https://github.com/vuejs/rfcs/discussions/369)) instead of the Options API.**
|
||||
- Some of the existing components are implemented in the Options API, but it is an old implementation. Refactors that migrate those components to the Composition API are also welcome.
|
||||
|
||||
## nirax
|
||||
niraxは、Misskeyで使用しているオリジナルのフロントエンドルーティングシステムです。
|
||||
**vue-routerから影響を多大に受けているので、まずはvue-routerについて学ぶことをお勧めします。**
|
||||
|
||||
### ルート定義
|
||||
ルート定義は、以下の形式のオブジェクトの配列です。
|
||||
|
||||
``` ts
|
||||
{
|
||||
name?: string;
|
||||
path: string;
|
||||
component: Component;
|
||||
query?: Record<string, string>;
|
||||
loginRequired?: boolean;
|
||||
hash?: string;
|
||||
globalCacheKey?: string;
|
||||
children?: RouteDef[];
|
||||
}
|
||||
```
|
||||
|
||||
> **Warning**
|
||||
> 現状、ルートは定義された順に評価されます。
|
||||
> たとえば、`/foo/:id`ルート定義の次に`/foo/bar`ルート定義がされていた場合、後者がマッチすることはありません。
|
||||
|
||||
### 複数のルーター
|
||||
vue-routerとの最大の違いは、niraxは複数のルーターが存在することを許可している点です。
|
||||
これにより、アプリ内ウィンドウでブラウザとは個別にルーティングすることなどが可能になります。
|
||||
|
||||
## Notes
|
||||
### How to resolve conflictions occurred at yarn.lock?
|
||||
|
||||
|
|
|
|||
|
|
@ -36,6 +36,7 @@ const languages = [
|
|||
'sk-SK',
|
||||
'ug-CN',
|
||||
'uk-UA',
|
||||
'vi-VN',
|
||||
'zh-CN',
|
||||
'zh-TW',
|
||||
];
|
||||
|
|
|
|||
|
|
@ -52,6 +52,7 @@ searchUser: "ユーザーを検索"
|
|||
reply: "返信"
|
||||
loadMore: "もっと見る"
|
||||
showMore: "もっと見る"
|
||||
showLess: "閉じる"
|
||||
youGotNewFollower: "フォローされました"
|
||||
receiveFollowRequest: "フォローリクエストされました"
|
||||
followRequestAccepted: "フォローが承認されました"
|
||||
|
|
@ -561,6 +562,7 @@ author: "作者"
|
|||
leaveConfirm: "未保存の変更があります。破棄しますか？"
|
||||
manage: "管理"
|
||||
plugins: "プラグイン"
|
||||
preferencesBackups: "設定のバックアップ"
|
||||
deck: "デッキ"
|
||||
undeck: "デッキ解除"
|
||||
useBlurEffectForModal: "モーダルにぼかし効果を使用"
|
||||
|
|
@ -952,6 +954,25 @@ _plugin:
|
|||
installWarn: "信頼できないプラグインはインストールしないでください。"
|
||||
manage: "プラグインの管理"
|
||||
|
||||
_preferencesBackups:
|
||||
list: "作成したバックアップ"
|
||||
saveNew: "新規保存"
|
||||
loadFile: "ファイルを読み込み"
|
||||
apply: "このデバイスに適用"
|
||||
save: "上書き保存"
|
||||
inputName: "バックアップ名を入力"
|
||||
cannotSave: "保存できません"
|
||||
nameAlreadyExists: "バックアップ名「{name}」は既に存在します。違う名前を指定してください。"
|
||||
applyConfirm: "バックアップ「{name}」を現在のデバイスに適用しますか？現在のデバイス設定は失われます。"
|
||||
saveConfirm: "{name}に上書き保存しますか？"
|
||||
deleteConfirm: "{name}を削除しますか？"
|
||||
renameConfirm: "「{old}」を「{new}」に変更しますか？"
|
||||
noBackups: "バックアップはありません。「新規保存」で現在のクライアント設定をサーバーに保存できます。"
|
||||
createdAt: "作成日時: {date} {time}"
|
||||
updatedAt: "更新日時: {date} {time}"
|
||||
cannotLoad: "読み込みできません"
|
||||
invalidFile: "ファイル形式が違います。"
|
||||
|
||||
_registry:
|
||||
scope: "スコープ"
|
||||
key: "キー"
|
||||
|
|
@ -1038,6 +1059,8 @@ _mfm:
|
|||
sparkleDescription: "キラキラしたパーティクルのエフェクトを追加します。"
|
||||
rotate: "回転"
|
||||
rotateDescription: "指定した角度で回転させます。"
|
||||
plain: "プレーン"
|
||||
plainDescription: "内側の構文を全て無効にします。"
|
||||
|
||||
_instanceTicker:
|
||||
none: "表示しない"
|
||||
|
|
|
|||
|
|
@ -885,6 +885,7 @@ enableAutoSensitiveDescription: "Ak je zapnuté, príznak NSFW sa na médiách a
|
|||
activeEmailValidationDescription: "Dôkladnejšie overí e-mailovú adresu používateľa tým, že zistí, či ide o vyradenú e-mailovú adresu a či sa s ňou dá skutočne komunikovať. Ak nie je začiarknuté, e-mailová adresa sa kontroluje len ako text."
|
||||
navbar: "Navigačný panel"
|
||||
account: "Účty"
|
||||
move: "Pohyb"
|
||||
_sensitiveMediaDetection:
|
||||
description: "Strojové učenie sa použije na automatickú detekciu citlivých médií na účely ich moderovania. Mierne sa zvýši zaťaženie servera."
|
||||
sensitivity: "Citlivosť detekcie"
|
||||
|
|
@ -1691,6 +1692,7 @@ _deck:
|
|||
alwaysShowMainColumn: "Vždy zobraziť v hlavnom stĺpci"
|
||||
columnAlign: "Zarovnať stĺpce"
|
||||
addColumn: "Pridať stĺpec"
|
||||
configureColumn: "Nastavenie stĺpcov"
|
||||
swapLeft: "Vymeniť vľavo"
|
||||
swapRight: "Vymeniť vpravo"
|
||||
swapUp: "Vymeniť hore"
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "misskey",
|
||||
"version": "12.117.0",
|
||||
"version": "12.118.0-beta.4",
|
||||
"codename": "indigo",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
|
|
@ -52,9 +52,9 @@
|
|||
"@types/gulp": "4.0.9",
|
||||
"@types/gulp-rename": "2.0.1",
|
||||
"@typescript-eslint/eslint-plugin": "latest",
|
||||
"@typescript-eslint/parser": "5.30.6",
|
||||
"@typescript-eslint/parser": "5.31.0",
|
||||
"cross-env": "7.0.3",
|
||||
"cypress": "10.3.0",
|
||||
"cypress": "10.3.1",
|
||||
"eslint-plugin-import": "^2.26.0",
|
||||
"eslint-plugin-vue": "latest",
|
||||
"start-server-and-test": "1.14.0",
|
||||
|
|
|
|||
|
|
@ -14,12 +14,12 @@
|
|||
"test": "yarn mocha"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"@tensorflow/tfjs-node": "3.18.0"
|
||||
"@tensorflow/tfjs-node": "3.19.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@bull-board/api": "4.0.0",
|
||||
"@bull-board/koa": "4.0.0",
|
||||
"@bull-board/ui": "4.0.0",
|
||||
"@bull-board/api": "4.1.1",
|
||||
"@bull-board/koa": "4.1.1",
|
||||
"@bull-board/ui": "4.1.1",
|
||||
"@discordapp/twemoji": "14.0.2",
|
||||
"@elastic/elasticsearch": "7.17.0",
|
||||
"@koa/cors": "3.3.0",
|
||||
|
|
@ -28,15 +28,14 @@
|
|||
"@peertube/http-signature": "1.6.0",
|
||||
"@sinonjs/fake-timers": "9.1.2",
|
||||
"@syuilo/aiscript": "0.11.1",
|
||||
"abort-controller": "3.0.0",
|
||||
"ajv": "8.11.0",
|
||||
"archiver": "5.3.1",
|
||||
"autobind-decorator": "2.4.0",
|
||||
"autwh": "0.1.0",
|
||||
"aws-sdk": "2.1165.0",
|
||||
"aws-sdk": "2.1185.0",
|
||||
"bcryptjs": "2.4.3",
|
||||
"blurhash": "1.1.5",
|
||||
"bull": "4.8.4",
|
||||
"bull": "4.8.5",
|
||||
"cacheable-lookup": "6.0.4",
|
||||
"cbor": "8.1.0",
|
||||
"chalk": "5.0.1",
|
||||
|
|
@ -45,13 +44,13 @@
|
|||
"cli-highlight": "2.1.11",
|
||||
"color-convert": "2.0.1",
|
||||
"content-disposition": "0.5.4",
|
||||
"date-fns": "2.28.0",
|
||||
"date-fns": "2.29.1",
|
||||
"deep-email-validator": "0.1.21",
|
||||
"escape-regexp": "0.0.1",
|
||||
"feed": "4.2.2",
|
||||
"file-type": "17.1.2",
|
||||
"file-type": "17.1.4",
|
||||
"fluent-ffmpeg": "2.1.2",
|
||||
"got": "12.1.0",
|
||||
"got": "12.3.0",
|
||||
"hpagent": "0.1.2",
|
||||
"ioredis": "4.28.5",
|
||||
"ip-cidr": "3.0.10",
|
||||
|
|
@ -61,7 +60,7 @@
|
|||
"json5": "2.2.1",
|
||||
"json5-loader": "4.0.1",
|
||||
"jsonld": "6.0.0",
|
||||
"jsrsasign": "10.5.25",
|
||||
"jsrsasign": "10.5.26",
|
||||
"koa": "2.13.4",
|
||||
"koa-bodyparser": "4.3.0",
|
||||
"koa-favicon": "2.1.0",
|
||||
|
|
@ -71,14 +70,14 @@
|
|||
"koa-send": "5.0.1",
|
||||
"koa-slow": "2.1.0",
|
||||
"koa-views": "7.0.2",
|
||||
"mfm-js": "0.23.0-canary.1",
|
||||
"mfm-js": "0.23.0",
|
||||
"mime-types": "2.1.35",
|
||||
"misskey-js": "0.0.14",
|
||||
"mocha": "10.0.0",
|
||||
"ms": "3.0.0-canary.1",
|
||||
"multer": "1.4.4",
|
||||
"nested-property": "4.0.0",
|
||||
"node-fetch": "3.2.8",
|
||||
"node-fetch": "3.2.10",
|
||||
"nodemailer": "6.7.7",
|
||||
"nsfwjs": "2.4.1",
|
||||
"oauth": "^0.9.15",
|
||||
|
|
@ -91,32 +90,30 @@
|
|||
"pug": "3.0.2",
|
||||
"punycode": "2.1.1",
|
||||
"pureimage": "0.3.14",
|
||||
"qrcode": "1.5.0",
|
||||
"qrcode": "1.5.1",
|
||||
"random-seed": "0.3.0",
|
||||
"ratelimiter": "3.4.1",
|
||||
"re2": "1.17.7",
|
||||
"redis-lock": "0.1.4",
|
||||
"reflect-metadata": "0.1.13",
|
||||
"rename": "1.0.4",
|
||||
"require-all": "3.0.0",
|
||||
"rndstr": "1.0.0",
|
||||
"rss-parser": "3.12.0",
|
||||
"s-age": "1.1.2",
|
||||
"sanitize-html": "2.7.0",
|
||||
"sanitize-html": "2.7.1",
|
||||
"semver": "7.3.7",
|
||||
"sharp": "0.30.6",
|
||||
"speakeasy": "2.0.0",
|
||||
"strict-event-emitter-types": "2.0.0",
|
||||
"stringz": "2.1.0",
|
||||
"style-loader": "3.3.1",
|
||||
"summaly": "2.7.0",
|
||||
"syslog-pro": "1.0.0",
|
||||
"systeminformation": "5.12.0",
|
||||
"systeminformation": "5.12.1",
|
||||
"tinycolor2": "1.4.2",
|
||||
"tmp": "0.2.1",
|
||||
"ts-loader": "9.3.1",
|
||||
"ts-node": "10.8.2",
|
||||
"tsc-alias": "1.6.11",
|
||||
"ts-node": "10.9.1",
|
||||
"tsc-alias": "1.7.0",
|
||||
"tsconfig-paths": "4.0.0",
|
||||
"twemoji-parser": "14.0.0",
|
||||
"typeorm": "0.3.7",
|
||||
|
|
@ -125,21 +122,20 @@
|
|||
"uuid": "8.3.2",
|
||||
"web-push": "3.5.0",
|
||||
"websocket": "1.0.34",
|
||||
"ws": "8.8.0",
|
||||
"ws": "8.8.1",
|
||||
"xev": "3.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@redocly/openapi-core": "1.0.0-beta.100",
|
||||
"@redocly/openapi-core": "1.0.0-beta.105",
|
||||
"@types/bcryptjs": "2.4.2",
|
||||
"@types/bull": "3.15.8",
|
||||
"@types/bull": "3.15.9",
|
||||
"@types/cbor": "6.0.0",
|
||||
"@types/escape-regexp": "0.0.1",
|
||||
"@types/fluent-ffmpeg": "2.1.20",
|
||||
"@types/is-url": "1.2.30",
|
||||
"@types/js-yaml": "4.0.5",
|
||||
"@types/jsdom": "16.2.14",
|
||||
"@types/jsonld": "1.5.6",
|
||||
"@types/jsrsasign": "10.5.1",
|
||||
"@types/jsrsasign": "10.5.2",
|
||||
"@types/koa": "2.13.5",
|
||||
"@types/koa-bodyparser": "4.3.7",
|
||||
"@types/koa-cors": "0.0.2",
|
||||
|
|
@ -152,7 +148,7 @@
|
|||
"@types/koa__multer": "2.0.4",
|
||||
"@types/koa__router": "8.0.11",
|
||||
"@types/mocha": "9.1.1",
|
||||
"@types/node": "18.0.3",
|
||||
"@types/node": "18.6.3",
|
||||
"@types/node-fetch": "3.0.3",
|
||||
"@types/nodemailer": "6.4.4",
|
||||
"@types/oauth": "0.9.1",
|
||||
|
|
@ -174,10 +170,10 @@
|
|||
"@types/web-push": "3.3.2",
|
||||
"@types/websocket": "1.0.5",
|
||||
"@types/ws": "8.5.3",
|
||||
"@typescript-eslint/eslint-plugin": "5.30.6",
|
||||
"@typescript-eslint/parser": "5.30.6",
|
||||
"@typescript-eslint/eslint-plugin": "5.31.0",
|
||||
"@typescript-eslint/parser": "5.31.0",
|
||||
"cross-env": "7.0.3",
|
||||
"eslint": "8.19.0",
|
||||
"eslint": "8.20.0",
|
||||
"eslint-plugin-import": "2.26.0",
|
||||
"execa": "6.1.0",
|
||||
"form-data": "^4.0.0",
|
||||
|
|
|
|||
|
|
@ -101,13 +101,17 @@ export async function getFileInfo(path: string, opts: {
|
|||
let porn = false;
|
||||
|
||||
if (!opts.skipSensitiveDetection) {
|
||||
[sensitive, porn] = await detectSensitivity(
|
||||
await detectSensitivity(
|
||||
path,
|
||||
type.mime,
|
||||
opts.sensitiveThreshold ?? 0.5,
|
||||
opts.sensitiveThresholdForPorn ?? 0.75,
|
||||
opts.enableSensitiveMediaDetectionForVideos ?? false,
|
||||
);
|
||||
).then(value => {
|
||||
[sensitive, porn] = value;
|
||||
}, error => {
|
||||
warnings.push(`detectSensitivity failed: ${error}`);
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { Blocking } from '@/models/entities/blocking.js';
|
|||
* @param block The block to be rendered. The blockee relation must be loaded.
|
||||
*/
|
||||
export function renderBlock(block: Blocking) {
|
||||
if (block.blockee?.url == null) {
|
||||
if (block.blockee?.uri == null) {
|
||||
throw new Error('renderBlock: missing blockee uri');
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ export const meta = {
|
|||
|
||||
limit: {
|
||||
duration: 60000,
|
||||
max: 10,
|
||||
max: 15,
|
||||
},
|
||||
|
||||
kind: 'read:notifications',
|
||||
|
|
|
|||
|
|
@ -138,6 +138,8 @@
|
|||
</button>
|
||||
<p class="dont-worry">Don't worry, it's (probably) not your fault.</p>
|
||||
<p>If the problem persists after refreshing, please contact your instance's administrator.<br>You may also try the following options:</p>
|
||||
<p>Update your os and browser.</p>
|
||||
<p>Disable an adblocker.</p>
|
||||
<a href="/flush">
|
||||
<button class="button-small">
|
||||
<span class="button-label-small">Clear preferences and cache</span>
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ html
|
|||
.then(registrations => {
|
||||
return Promise.all(registrations.map(registration => registration.unregister()));
|
||||
})
|
||||
.catch(e => { throw Error(e) });
|
||||
.catch(e => { throw new Error(e) });
|
||||
}
|
||||
|
||||
message(successText);
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
"noFallthroughCasesInSwitch": true,
|
||||
"declaration": false,
|
||||
"sourceMap": true,
|
||||
"target": "es2017",
|
||||
"target": "es2021",
|
||||
"module": "es2020",
|
||||
"moduleResolution": "node",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
"noFallthroughCasesInSwitch": true,
|
||||
"declaration": false,
|
||||
"sourceMap": false,
|
||||
"target": "es2017",
|
||||
"target": "es2021",
|
||||
"module": "es2020",
|
||||
"moduleResolution": "node",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
|
|
|
|||
|
|
@ -8,103 +8,82 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@discordapp/twemoji": "14.0.2",
|
||||
"@fortawesome/fontawesome-free": "6.1.1",
|
||||
"@fortawesome/fontawesome-free": "6.1.2",
|
||||
"@rollup/plugin-alias": "3.1.9",
|
||||
"@rollup/plugin-json": "4.1.0",
|
||||
"@rollup/pluginutils": "^4.2.1",
|
||||
"@syuilo/aiscript": "0.11.1",
|
||||
"@vitejs/plugin-vue": "3.0.1",
|
||||
"@vue/compiler-sfc": "3.2.37",
|
||||
"abort-controller": "3.0.0",
|
||||
"autobind-decorator": "2.4.0",
|
||||
"autosize": "5.0.1",
|
||||
"autwh": "0.1.0",
|
||||
"blurhash": "1.1.5",
|
||||
"broadcast-channel": "4.13.0",
|
||||
"browser-image-resizer": "misskey-dev/browser-image-resizer#tag=v2.2.1-misskey.2",
|
||||
"chart.js": "3.8.0",
|
||||
"broadcast-channel": "4.14.0",
|
||||
"browser-image-resizer": "git+https://github.com/misskey-dev/browser-image-resizer#v2.2.1-misskey.2",
|
||||
"chart.js": "3.8.2",
|
||||
"chartjs-adapter-date-fns": "2.0.0",
|
||||
"chartjs-plugin-gradient": "0.5.0",
|
||||
"chartjs-plugin-zoom": "1.2.1",
|
||||
"compare-versions": "4.1.3",
|
||||
"content-disposition": "0.5.4",
|
||||
"cropperjs": "2.0.0-beta",
|
||||
"date-fns": "2.28.0",
|
||||
"date-fns": "2.29.1",
|
||||
"escape-regexp": "0.0.1",
|
||||
"eventemitter3": "4.0.7",
|
||||
"feed": "4.2.2",
|
||||
"idb-keyval": "6.2.0",
|
||||
"insert-text-at-cursor": "0.3.0",
|
||||
"json5": "2.2.1",
|
||||
"katex": "0.15.6",
|
||||
"matter-js": "0.18.0",
|
||||
"mfm-js": "0.23.0-canary.1",
|
||||
"mfm-js": "0.23.0",
|
||||
"misskey-js": "0.0.14",
|
||||
"mocha": "10.0.0",
|
||||
"ms": "2.1.3",
|
||||
"nested-property": "4.0.0",
|
||||
"photoswipe": "5.2.8",
|
||||
"photoswipe": "5.3.0",
|
||||
"prismjs": "1.28.0",
|
||||
"private-ip": "2.3.3",
|
||||
"promise-limit": "2.7.0",
|
||||
"pug": "3.0.2",
|
||||
"punycode": "2.1.1",
|
||||
"qrcode": "1.5.0",
|
||||
"querystring": "0.2.1",
|
||||
"random-seed": "0.3.0",
|
||||
"reflect-metadata": "0.1.13",
|
||||
"rndstr": "1.0.0",
|
||||
"s-age": "1.1.2",
|
||||
"sass": "1.53.0",
|
||||
"sass": "1.54.0",
|
||||
"seedrandom": "3.0.5",
|
||||
"strict-event-emitter-types": "2.0.0",
|
||||
"stringz": "2.1.0",
|
||||
"syuilo-password-strength": "0.0.1",
|
||||
"textarea-caret": "3.1.0",
|
||||
"three": "0.142.0",
|
||||
"three": "0.143.0",
|
||||
"throttle-debounce": "5.0.0",
|
||||
"tinycolor2": "1.4.2",
|
||||
"tsc-alias": "1.6.11",
|
||||
"tsc-alias": "1.7.0",
|
||||
"tsconfig-paths": "4.0.0",
|
||||
"twemoji-parser": "14.0.0",
|
||||
"typescript": "4.7.4",
|
||||
"uuid": "8.3.2",
|
||||
"v-debounce": "0.1.2",
|
||||
"vanilla-tilt": "1.7.2",
|
||||
"vite": "3.0.2",
|
||||
"vite": "3.0.4",
|
||||
"vue": "3.2.37",
|
||||
"vue-prism-editor": "2.0.0-alpha.2",
|
||||
"vuedraggable": "4.0.1",
|
||||
"websocket": "1.0.34",
|
||||
"ws": "8.8.0"
|
||||
"vuedraggable": "4.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/escape-regexp": "0.0.1",
|
||||
"@types/glob": "7.2.0",
|
||||
"@types/gulp": "4.0.9",
|
||||
"@types/gulp-rename": "2.0.1",
|
||||
"@types/is-url": "1.2.30",
|
||||
"@types/katex": "0.14.0",
|
||||
"@types/matter-js": "0.17.7",
|
||||
"@types/mocha": "9.1.1",
|
||||
"@types/oauth": "0.9.1",
|
||||
"@types/punycode": "2.1.0",
|
||||
"@types/qrcode": "1.4.2",
|
||||
"@types/random-seed": "0.3.3",
|
||||
"@types/seedrandom": "3.0.2",
|
||||
"@types/throttle-debounce": "5.0.0",
|
||||
"@types/tinycolor2": "1.4.3",
|
||||
"@types/uuid": "8.3.4",
|
||||
"@types/websocket": "1.0.5",
|
||||
"@types/ws": "8.5.3",
|
||||
"@typescript-eslint/eslint-plugin": "5.30.6",
|
||||
"@typescript-eslint/parser": "5.30.6",
|
||||
"@typescript-eslint/eslint-plugin": "5.31.0",
|
||||
"@typescript-eslint/parser": "5.31.0",
|
||||
"cross-env": "7.0.3",
|
||||
"cypress": "10.3.0",
|
||||
"eslint": "8.19.0",
|
||||
"cypress": "10.3.1",
|
||||
"eslint": "8.20.0",
|
||||
"eslint-plugin-import": "2.26.0",
|
||||
"eslint-plugin-vue": "9.2.0",
|
||||
"rollup": "2.76.0",
|
||||
"eslint-plugin-vue": "9.3.0",
|
||||
"rollup": "2.77.2",
|
||||
"start-server-and-test": "1.14.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<XNoteHeader class="header" :note="note" :mini="true"/>
|
||||
<div class="body">
|
||||
<p v-if="note.cw != null" class="cw">
|
||||
<Mfm v-if="note.cw != ''" class="text" :text="note.cw" :author="note.user" :i="$i" :custom-emojis="note.emojis" />
|
||||
<Mfm v-if="note.cw != ''" class="text" :text="note.cw" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
|
||||
<XCwButton v-model="showContent" :note="note"/>
|
||||
</p>
|
||||
<div v-show="note.cw == null || showContent" class="content">
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
<MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :detail="true" :depth="depth + 1"/>
|
||||
</template>
|
||||
<div v-else class="more">
|
||||
<MkA class="text _link" :to="notePage(note)">{{ $ts.continueThread }} <i class="fas fa-angle-double-right"></i></MkA>
|
||||
<MkA class="text _link" :to="notePage(note)">{{ i18n.ts.continueThread }} <i class="fas fa-angle-double-right"></i></MkA>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -27,11 +27,12 @@
|
|||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
import * as misskey from 'misskey-js';
|
||||
import { notePage } from '@/filters/note';
|
||||
import XNoteHeader from './note-header.vue';
|
||||
import MkNoteSubNoteContent from './sub-note-content.vue';
|
||||
import XCwButton from './cw-button.vue';
|
||||
import { notePage } from '@/filters/note';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
note: misskey.entities.Note;
|
||||
|
|
@ -49,7 +50,7 @@ let replies: misskey.entities.Note[] = $ref([]);
|
|||
if (props.detail) {
|
||||
os.api('notes/children', {
|
||||
noteId: props.note.id,
|
||||
limit: 5
|
||||
limit: 5,
|
||||
}).then(res => {
|
||||
replies = res;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
</div>
|
||||
</MkA>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.registeredDate }}</template>
|
||||
<template #key>{{ i18n.ts.registeredDate }}</template>
|
||||
<template #value>{{ new Date(report.targetUser.createdAt).toLocaleString() }} (<MkTime :time="report.targetUser.createdAt"/>)</template>
|
||||
</MkKeyValue>
|
||||
</div>
|
||||
|
|
@ -18,18 +18,18 @@
|
|||
<Mfm :text="report.comment"/>
|
||||
</div>
|
||||
<hr/>
|
||||
<div>{{ $ts.reporter }}: <MkAcct :user="report.reporter"/></div>
|
||||
<div>{{ i18n.ts.reporter }}: <MkAcct :user="report.reporter"/></div>
|
||||
<div v-if="report.assignee">
|
||||
{{ $ts.moderator }}:
|
||||
{{ i18n.ts.moderator }}:
|
||||
<MkAcct :user="report.assignee"/>
|
||||
</div>
|
||||
<div><MkTime :time="report.createdAt"/></div>
|
||||
<div class="action">
|
||||
<MkSwitch v-model="forward" :disabled="report.targetUser.host == null || report.resolved">
|
||||
{{ $ts.forwardReport }}
|
||||
<template #caption>{{ $ts.forwardReportIsAnonymous }}</template>
|
||||
{{ i18n.ts.forwardReport }}
|
||||
<template #caption>{{ i18n.ts.forwardReportIsAnonymous }}</template>
|
||||
</MkSwitch>
|
||||
<MkButton v-if="!report.resolved" primary @click="resolve">{{ $ts.abuseMarkAsResolved }}</MkButton>
|
||||
<MkButton v-if="!report.resolved" primary @click="resolve">{{ i18n.ts.abuseMarkAsResolved }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -41,6 +41,7 @@ import MkSwitch from '@/components/form/switch.vue';
|
|||
import MkKeyValue from '@/components/key-value.vue';
|
||||
import { acct, userPage } from '@/filters/user';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
report: any;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
@ok="ok()"
|
||||
@closed="$emit('closed')"
|
||||
>
|
||||
<template #header>{{ $ts.cropImage }}</template>
|
||||
<template #header>{{ i18n.ts.cropImage }}</template>
|
||||
<template #default="{ width, height }">
|
||||
<div class="mk-cropper-dialog" :style="`--vw: ${width}px; --vh: ${height}px;`">
|
||||
<Transition name="fade">
|
||||
|
|
@ -36,6 +36,7 @@ import { $i } from '@/account';
|
|||
import { defaultStore } from '@/store';
|
||||
import { apiUrl, url } from '@/config';
|
||||
import { query } from '@/scripts/url';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const emit = defineEmits<{
|
||||
(ev: 'ok', cropped: misskey.entities.DriveFile): void;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
:disabled="disabled"
|
||||
@keydown.enter="toggle"
|
||||
>
|
||||
<span ref="button" v-adaptive-border v-tooltip="checked ? $ts.itsOn : $ts.itsOff" class="button" @click.prevent="toggle">
|
||||
<span ref="button" v-adaptive-border v-tooltip="checked ? i18n.ts.itsOn : i18n.ts.itsOff" class="button" @click.prevent="toggle">
|
||||
<i class="check fas fa-check"></i>
|
||||
</span>
|
||||
<span class="label">
|
||||
|
|
@ -24,6 +24,7 @@
|
|||
import { toRefs, Ref } from 'vue';
|
||||
import * as os from '@/os';
|
||||
import Ripple from '@/components/ripple.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: boolean | Ref<boolean>;
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
</div>
|
||||
<div class="caption"><slot name="caption"></slot></div>
|
||||
|
||||
<MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-check"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-check"></i> {{ i18n.ts.save }}</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -38,6 +38,7 @@ import { onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from '
|
|||
import { debounce } from 'throttle-debounce';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import { useInterval } from '@/scripts/use-interval';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: string | number;
|
||||
|
|
|
|||
|
|
@ -19,33 +19,16 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
to: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
active: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
},
|
||||
external: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
},
|
||||
behavior: {
|
||||
type: String,
|
||||
required: false,
|
||||
},
|
||||
inline: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
},
|
||||
},
|
||||
});
|
||||
const props = defineProps<{
|
||||
to: string;
|
||||
active?: boolean;
|
||||
external?: boolean;
|
||||
behavior?: null | 'window' | 'browser' | 'modalWindow';
|
||||
inline?: boolean;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -61,7 +44,7 @@ export default defineComponent({
|
|||
align-items: center;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 12px 14px 12px 14px;
|
||||
padding: 10px 14px;
|
||||
background: var(--buttonBg);
|
||||
border-radius: 6px;
|
||||
font-size: 0.9em;
|
||||
|
|
|
|||
|
|
@ -18,34 +18,25 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
modelValue: {
|
||||
required: false,
|
||||
},
|
||||
value: {
|
||||
required: false,
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
checked(): boolean {
|
||||
return this.modelValue === this.value;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
toggle() {
|
||||
if (this.disabled) return;
|
||||
this.$emit('update:modelValue', this.value);
|
||||
},
|
||||
},
|
||||
});
|
||||
const props = defineProps<{
|
||||
modelValue: any;
|
||||
value: any;
|
||||
disabled: boolean;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(ev: 'update:modelValue', value: any): void;
|
||||
}>();
|
||||
|
||||
let checked = $computed(() => props.modelValue === props.value);
|
||||
|
||||
function toggle(): void {
|
||||
if (props.disabled) return;
|
||||
emit('update:modelValue', props.value);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
@ -54,13 +45,13 @@ export default defineComponent({
|
|||
display: inline-block;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
padding: 9px 12px;
|
||||
padding: 8px 10px;
|
||||
min-width: 60px;
|
||||
background-color: var(--panel);
|
||||
background-clip: padding-box !important;
|
||||
border: solid 1px var(--panel);
|
||||
border-radius: 6px;
|
||||
transition: all 0.3s;
|
||||
transition: all 0.2s;
|
||||
|
||||
> * {
|
||||
user-select: none;
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
<div class="caption"><slot name="caption"></slot></div>
|
||||
|
||||
<MkButton v-if="manualSave && changed" primary @click="updated"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton v-if="manualSave && changed" primary @click="updated"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -31,6 +31,7 @@ import { onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs, VNode,
|
|||
import MkButton from '@/components/ui/button.vue';
|
||||
import * as os from '@/os';
|
||||
import { useInterval } from '@/scripts/use-interval';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: string;
|
||||
|
|
@ -144,6 +145,8 @@ const onClick = (ev: MouseEvent) => {
|
|||
} else if (Array.isArray(vnode.children)) { // 何故かフラグメントになってくることがある
|
||||
const fragment = vnode;
|
||||
scanOptions(fragment.children);
|
||||
} else if (vnode.props == null) { // v-if で条件が false のときにこうなる
|
||||
// nop?
|
||||
} else {
|
||||
const option = vnode;
|
||||
pushOption(option);
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
:disabled="disabled"
|
||||
@keydown.enter="toggle"
|
||||
>
|
||||
<span ref="button" v-tooltip="checked ? $ts.itsOn : $ts.itsOff" class="button" @click.prevent="toggle">
|
||||
<span ref="button" v-tooltip="checked ? i18n.ts.itsOn : i18n.ts.itsOff" class="button" @click.prevent="toggle">
|
||||
<div class="knob"></div>
|
||||
</span>
|
||||
<span class="label">
|
||||
|
|
@ -23,6 +23,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { toRefs, Ref } from 'vue';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: boolean | Ref<boolean>;
|
||||
|
|
|
|||
|
|
@ -2,7 +2,8 @@
|
|||
<div class="adhpbeos">
|
||||
<div class="label" @click="focus"><slot name="label"></slot></div>
|
||||
<div class="input" :class="{ disabled, focused, tall, pre }">
|
||||
<textarea ref="inputEl"
|
||||
<textarea
|
||||
ref="inputEl"
|
||||
v-model="v"
|
||||
v-adaptive-border
|
||||
:class="{ code, _monospace: code }"
|
||||
|
|
@ -21,14 +22,15 @@
|
|||
</div>
|
||||
<div class="caption"><slot name="caption"></slot></div>
|
||||
|
||||
<MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import { debounce } from 'throttle-debounce';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
|
|
@ -37,66 +39,66 @@ export default defineComponent({
|
|||
|
||||
props: {
|
||||
modelValue: {
|
||||
required: true
|
||||
required: true,
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
required: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
pattern: {
|
||||
type: String,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
autofocus: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
autocomplete: {
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
spellcheck: {
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
code: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
required: false,
|
||||
},
|
||||
tall: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
pre: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
debounce: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
manualSave: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
|
||||
|
|
@ -166,6 +168,7 @@ export default defineComponent({
|
|||
onInput,
|
||||
onKeydown,
|
||||
updated,
|
||||
i18n,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,14 +2,15 @@
|
|||
<transition :name="$store.state.animation ? 'zoom' : ''" appear>
|
||||
<div class="mjndxjcg">
|
||||
<img src="https://xn--931a.moe/assets/error.jpg" class="_ghost"/>
|
||||
<p><i class="fas fa-exclamation-triangle"></i> {{ $ts.somethingHappened }}</p>
|
||||
<MkButton class="button" @click="() => $emit('retry')">{{ $ts.retry }}</MkButton>
|
||||
<p><i class="fas fa-exclamation-triangle"></i> {{ i18n.ts.somethingHappened }}</p>
|
||||
<MkButton class="button" @click="() => $emit('retry')">{{ i18n.ts.retry }}</MkButton>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,18 @@
|
|||
<template>
|
||||
<KeepAlive :max="defaultStore.state.numberOfPageCache">
|
||||
<component :is="currentPageComponent" :key="key" v-bind="Object.fromEntries(currentPageProps)"/>
|
||||
<Suspense>
|
||||
<component :is="currentPageComponent" :key="key" v-bind="Object.fromEntries(currentPageProps)"/>
|
||||
|
||||
<template #fallback>
|
||||
Loading...
|
||||
</template>
|
||||
</Suspense>
|
||||
</KeepAlive>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { inject, nextTick, onMounted, onUnmounted, watch } from 'vue';
|
||||
import { Router } from '@/nirax';
|
||||
import { inject, nextTick, onBeforeUnmount, onMounted, onUnmounted, provide, watch } from 'vue';
|
||||
import { Resolved, Router } from '@/nirax';
|
||||
import { defaultStore } from '@/store';
|
||||
|
||||
const props = defineProps<{
|
||||
|
|
@ -19,19 +25,37 @@ if (router == null) {
|
|||
throw new Error('no router provided');
|
||||
}
|
||||
|
||||
let currentPageComponent = $shallowRef(router.getCurrentComponent());
|
||||
let currentPageProps = $ref(router.getCurrentProps());
|
||||
let key = $ref(router.getCurrentKey());
|
||||
const currentDepth = inject('routerCurrentDepth', 0);
|
||||
provide('routerCurrentDepth', currentDepth + 1);
|
||||
|
||||
function onChange({ route, props: newProps, key: newKey }) {
|
||||
currentPageComponent = route.component;
|
||||
currentPageProps = newProps;
|
||||
key = newKey;
|
||||
function resolveNested(current: Resolved, d = 0): Resolved | null {
|
||||
if (d === currentDepth) {
|
||||
return current;
|
||||
} else {
|
||||
if (current.child) {
|
||||
return resolveNested(current.child, d + 1);
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const current = resolveNested(router.current)!;
|
||||
let currentPageComponent = $shallowRef(current.route.component);
|
||||
let currentPageProps = $ref(current.props);
|
||||
let key = $ref(current.route.path + JSON.stringify(Object.fromEntries(current.props)));
|
||||
|
||||
function onChange({ resolved, key: newKey }) {
|
||||
const current = resolveNested(resolved);
|
||||
if (current == null) return;
|
||||
currentPageComponent = current.route.component;
|
||||
currentPageProps = current.props;
|
||||
key = current.route.path + JSON.stringify(Object.fromEntries(current.props));
|
||||
}
|
||||
|
||||
router.addListener('change', onChange);
|
||||
|
||||
onUnmounted(() => {
|
||||
onBeforeUnmount(() => {
|
||||
router.removeListener('change', onChange);
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -4,29 +4,29 @@
|
|||
<div class="body">
|
||||
<div class="selects" style="display: flex;">
|
||||
<MkSelect v-model="chartSrc" style="margin: 0; flex: 1;">
|
||||
<optgroup :label="$ts.federation">
|
||||
<option value="federation">{{ $ts._charts.federation }}</option>
|
||||
<option value="ap-request">{{ $ts._charts.apRequest }}</option>
|
||||
<optgroup :label="i18n.ts.federation">
|
||||
<option value="federation">{{ i18n.ts._charts.federation }}</option>
|
||||
<option value="ap-request">{{ i18n.ts._charts.apRequest }}</option>
|
||||
</optgroup>
|
||||
<optgroup :label="$ts.users">
|
||||
<option value="users">{{ $ts._charts.usersIncDec }}</option>
|
||||
<option value="users-total">{{ $ts._charts.usersTotal }}</option>
|
||||
<option value="active-users">{{ $ts._charts.activeUsers }}</option>
|
||||
<optgroup :label="i18n.ts.users">
|
||||
<option value="users">{{ i18n.ts._charts.usersIncDec }}</option>
|
||||
<option value="users-total">{{ i18n.ts._charts.usersTotal }}</option>
|
||||
<option value="active-users">{{ i18n.ts._charts.activeUsers }}</option>
|
||||
</optgroup>
|
||||
<optgroup :label="$ts.notes">
|
||||
<option value="notes">{{ $ts._charts.notesIncDec }}</option>
|
||||
<option value="local-notes">{{ $ts._charts.localNotesIncDec }}</option>
|
||||
<option value="remote-notes">{{ $ts._charts.remoteNotesIncDec }}</option>
|
||||
<option value="notes-total">{{ $ts._charts.notesTotal }}</option>
|
||||
<optgroup :label="i18n.ts.notes">
|
||||
<option value="notes">{{ i18n.ts._charts.notesIncDec }}</option>
|
||||
<option value="local-notes">{{ i18n.ts._charts.localNotesIncDec }}</option>
|
||||
<option value="remote-notes">{{ i18n.ts._charts.remoteNotesIncDec }}</option>
|
||||
<option value="notes-total">{{ i18n.ts._charts.notesTotal }}</option>
|
||||
</optgroup>
|
||||
<optgroup :label="$ts.drive">
|
||||
<option value="drive-files">{{ $ts._charts.filesIncDec }}</option>
|
||||
<option value="drive">{{ $ts._charts.storageUsageIncDec }}</option>
|
||||
<optgroup :label="i18n.ts.drive">
|
||||
<option value="drive-files">{{ i18n.ts._charts.filesIncDec }}</option>
|
||||
<option value="drive">{{ i18n.ts._charts.storageUsageIncDec }}</option>
|
||||
</optgroup>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="chartSpan" style="margin: 0 0 0 10px;">
|
||||
<option value="hour">{{ $ts.perHour }}</option>
|
||||
<option value="day">{{ $ts.perDay }}</option>
|
||||
<option value="hour">{{ i18n.ts.perHour }}</option>
|
||||
<option value="day">{{ i18n.ts.perDay }}</option>
|
||||
</MkSelect>
|
||||
</div>
|
||||
<div class="chart">
|
||||
|
|
@ -71,6 +71,7 @@ import MkSelect from '@/components/form/select.vue';
|
|||
import MkChart from '@/components/chart.vue';
|
||||
import { useChartTooltip } from '@/scripts/use-chart-tooltip';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
Chart.register(
|
||||
ArcElement,
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
</div>
|
||||
<div class="value">
|
||||
<slot name="value"></slot>
|
||||
<button v-if="copy" v-tooltip="$ts.copy" class="_textButton" style="margin-left: 0.5em;" @click="copy_"><i class="far fa-copy"></i></button>
|
||||
<button v-if="copy" v-tooltip="i18n.ts.copy" class="_textButton" style="margin-left: 0.5em;" @click="copy_"><i class="far fa-copy"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -14,6 +14,7 @@
|
|||
import { } from 'vue';
|
||||
import copyToClipboard from '@/scripts/copy-to-clipboard';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
copy?: string | null;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<div v-if="isRenote" class="renote">
|
||||
<MkAvatar class="avatar" :user="note.user"/>
|
||||
<i class="fas fa-retweet"></i>
|
||||
<I18n :src="$ts.renotedBy" tag="span">
|
||||
<I18n :src="i18n.ts.renotedBy" tag="span">
|
||||
<template #user>
|
||||
<MkA v-user-preview="note.userId" class="name" :to="userPage(note.user)">
|
||||
<MkUserName :user="note.user"/>
|
||||
|
|
@ -54,7 +54,7 @@
|
|||
</p>
|
||||
<div v-show="appearNote.cw == null || showContent" class="content">
|
||||
<div class="text">
|
||||
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ $ts.private }})</span>
|
||||
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
|
||||
<MkA v-if="appearNote.replyId" class="reply" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
|
||||
<a v-if="appearNote.renote != null" class="rp">RN:</a>
|
||||
|
|
@ -103,7 +103,7 @@
|
|||
<MkNoteSub v-for="note in replies" :key="note.id" :note="note" class="reply" :detail="true"/>
|
||||
</div>
|
||||
<div v-else class="_panel muted" @click="muted = false">
|
||||
<I18n :src="$ts.userSaysSomething" tag="small">
|
||||
<I18n :src="i18n.ts.userSaysSomething" tag="small">
|
||||
<template #name>
|
||||
<MkA v-user-preview="appearNote.userId" class="name" :to="userPage(appearNote.user)">
|
||||
<MkUserName :user="appearNote.user"/>
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@
|
|||
<Mfm v-if="appearNote.cw != ''" class="text" :text="appearNote.cw" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
|
||||
<XCwButton v-model="showContent" :note="appearNote"/>
|
||||
</p>
|
||||
<div v-show="appearNote.cw == null || showContent" class="content" :class="{ collapsed }">
|
||||
<div v-show="appearNote.cw == null || showContent" class="content" :class="{ collapsed, isLong }">
|
||||
<div class="text">
|
||||
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
|
||||
<MkA v-if="appearNote.replyId" class="reply" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
|
|
@ -61,9 +61,12 @@
|
|||
<XPoll v-if="appearNote.poll" ref="pollViewer" :note="appearNote" class="poll"/>
|
||||
<MkUrlPreview v-for="url in urls" :key="url" :url="url" :compact="true" :detail="false" class="url-preview"/>
|
||||
<div v-if="appearNote.renote" class="renote"><XNoteSimple :note="appearNote.renote"/></div>
|
||||
<button v-if="collapsed" class="fade _button" @click="collapsed = false">
|
||||
<button v-if="isLong && collapsed" class="fade _button" @click="collapsed = false">
|
||||
<span>{{ i18n.ts.showMore }}</span>
|
||||
</button>
|
||||
<button v-else-if="isLong && !collapsed" class="showLess _button" @click="collapsed = true">
|
||||
<span>{{ i18n.ts.showLess }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><i class="fas fa-satellite-dish"></i> {{ appearNote.channel.name }}</MkA>
|
||||
</div>
|
||||
|
|
@ -162,10 +165,11 @@ const reactButton = ref<HTMLElement>();
|
|||
let appearNote = $computed(() => isRenote ? note.renote as misskey.entities.Note : note);
|
||||
const isMyRenote = $i && ($i.id === note.userId);
|
||||
const showContent = ref(false);
|
||||
const collapsed = ref(appearNote.cw == null && appearNote.text != null && (
|
||||
const isLong = (appearNote.cw == null && appearNote.text != null && (
|
||||
(appearNote.text.split('\n').length > 9) ||
|
||||
(appearNote.text.length > 500)
|
||||
));
|
||||
const collapsed = ref(appearNote.cw == null && isLong);
|
||||
const isDeleted = ref(false);
|
||||
const muted = ref(checkWordMute(appearNote, $i, defaultStore.state.mutedWords));
|
||||
const translation = ref(null);
|
||||
|
|
@ -442,6 +446,24 @@ function readPromo() {
|
|||
}
|
||||
|
||||
> .content {
|
||||
&.isLong {
|
||||
> .showLess {
|
||||
width: 100%;
|
||||
margin-top: 1em;
|
||||
position: sticky;
|
||||
bottom: 1em;
|
||||
|
||||
> span {
|
||||
display: inline-block;
|
||||
background: var(--popup);
|
||||
padding: 6px 10px;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.collapsed {
|
||||
position: relative;
|
||||
max-height: 9em;
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noNotes }}</div>
|
||||
<div>{{ i18n.ts.noNotes }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -21,8 +21,8 @@
|
|||
import { ref } from 'vue';
|
||||
import XNote from '@/components/note.vue';
|
||||
import XList from '@/components/date-separated-list.vue';
|
||||
import MkPagination from '@/components/ui/pagination.vue';
|
||||
import { Paging } from '@/components/ui/pagination.vue';
|
||||
import MkPagination, { Paging } from '@/components/ui/pagination.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
pagination: Paging;
|
||||
|
|
|
|||
|
|
@ -61,10 +61,10 @@
|
|||
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
|
||||
<i class="fas fa-quote-right"></i>
|
||||
</MkA>
|
||||
<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ $ts.youGotNewFollower }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span>
|
||||
<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ $ts.followRequestAccepted }}</span>
|
||||
<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ $ts.receiveFollowRequest }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ $ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ $ts.reject }}</button></div></span>
|
||||
<span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ $ts.groupInvited }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ $ts.accept }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ $ts.reject }}</button></div></span>
|
||||
<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ i18n.ts.youGotNewFollower }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span>
|
||||
<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ i18n.ts.followRequestAccepted }}</span>
|
||||
<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ i18n.ts.receiveFollowRequest }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ i18n.ts.reject }}</button></div></span>
|
||||
<span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ i18n.ts.groupInvited }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ i18n.ts.reject }}</button></div></span>
|
||||
<span v-if="notification.type === 'app'" class="text">
|
||||
<Mfm :text="notification.body" :nowrap="!full"/>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noNotifications }}</div>
|
||||
<div>{{ i18n.ts.noNotifications }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -26,6 +26,7 @@ import XNote from '@/components/note.vue';
|
|||
import * as os from '@/os';
|
||||
import { stream } from '@/stream';
|
||||
import { $i } from '@/account';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
includeTypes?: typeof notificationTypes[number][];
|
||||
|
|
|
|||
|
|
@ -114,7 +114,7 @@ function menu(ev) {
|
|||
|
||||
function back() {
|
||||
history.pop();
|
||||
router.change(history[history.length - 1].path, history[history.length - 1].key);
|
||||
router.replace(history[history.length - 1].path, history[history.length - 1].key);
|
||||
}
|
||||
|
||||
function close() {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="zmdxowus">
|
||||
<p v-if="choices.length < 2" class="caution">
|
||||
<i class="fas fa-exclamation-triangle"></i>{{ $ts._poll.noOnlyOneChoice }}
|
||||
<i class="fas fa-exclamation-triangle"></i>{{ i18n.ts._poll.noOnlyOneChoice }}
|
||||
</p>
|
||||
<ul>
|
||||
<li v-for="(choice, i) in choices" :key="i">
|
||||
|
|
@ -12,34 +12,34 @@
|
|||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<MkButton v-if="choices.length < 10" class="add" @click="add">{{ $ts.add }}</MkButton>
|
||||
<MkButton v-else class="add" disabled>{{ $ts._poll.noMore }}</MkButton>
|
||||
<MkSwitch v-model="multiple">{{ $ts._poll.canMultipleVote }}</MkSwitch>
|
||||
<MkButton v-if="choices.length < 10" class="add" @click="add">{{ i18n.ts.add }}</MkButton>
|
||||
<MkButton v-else class="add" disabled>{{ i18n.ts._poll.noMore }}</MkButton>
|
||||
<MkSwitch v-model="multiple">{{ i18n.ts._poll.canMultipleVote }}</MkSwitch>
|
||||
<section>
|
||||
<div>
|
||||
<MkSelect v-model="expiration" small>
|
||||
<template #label>{{ $ts._poll.expiration }}</template>
|
||||
<option value="infinite">{{ $ts._poll.infinite }}</option>
|
||||
<option value="at">{{ $ts._poll.at }}</option>
|
||||
<option value="after">{{ $ts._poll.after }}</option>
|
||||
<template #label>{{ i18n.ts._poll.expiration }}</template>
|
||||
<option value="infinite">{{ i18n.ts._poll.infinite }}</option>
|
||||
<option value="at">{{ i18n.ts._poll.at }}</option>
|
||||
<option value="after">{{ i18n.ts._poll.after }}</option>
|
||||
</MkSelect>
|
||||
<section v-if="expiration === 'at'">
|
||||
<MkInput v-model="atDate" small type="date" class="input">
|
||||
<template #label>{{ $ts._poll.deadlineDate }}</template>
|
||||
<template #label>{{ i18n.ts._poll.deadlineDate }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="atTime" small type="time" class="input">
|
||||
<template #label>{{ $ts._poll.deadlineTime }}</template>
|
||||
<template #label>{{ i18n.ts._poll.deadlineTime }}</template>
|
||||
</MkInput>
|
||||
</section>
|
||||
<section v-else-if="expiration === 'after'">
|
||||
<MkInput v-model="after" small type="number" class="input">
|
||||
<template #label>{{ $ts._poll.duration }}</template>
|
||||
<template #label>{{ i18n.ts._poll.duration }}</template>
|
||||
</MkInput>
|
||||
<MkSelect v-model="unit" small>
|
||||
<option value="second">{{ $ts._time.second }}</option>
|
||||
<option value="minute">{{ $ts._time.minute }}</option>
|
||||
<option value="hour">{{ $ts._time.hour }}</option>
|
||||
<option value="day">{{ $ts._time.day }}</option>
|
||||
<option value="second">{{ i18n.ts._time.second }}</option>
|
||||
<option value="minute">{{ i18n.ts._time.minute }}</option>
|
||||
<option value="hour">{{ i18n.ts._time.hour }}</option>
|
||||
<option value="day">{{ i18n.ts._time.day }}</option>
|
||||
</MkSelect>
|
||||
</section>
|
||||
</div>
|
||||
|
|
@ -55,6 +55,7 @@ import MkSwitch from './form/switch.vue';
|
|||
import MkButton from './ui/button.vue';
|
||||
import { formatDateTimeString } from '@/scripts/format-time-string';
|
||||
import { addTime } from '@/scripts/time';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue: {
|
||||
|
|
|
|||
|
|
@ -13,97 +13,77 @@
|
|||
<p v-if="!readOnly">
|
||||
<span>{{ $t('_poll.totalVotes', { n: total }) }}</span>
|
||||
<span> · </span>
|
||||
<a v-if="!closed && !isVoted" @click="showResult = !showResult">{{ showResult ? $ts._poll.vote : $ts._poll.showResult }}</a>
|
||||
<span v-if="isVoted">{{ $ts._poll.voted }}</span>
|
||||
<span v-else-if="closed">{{ $ts._poll.closed }}</span>
|
||||
<a v-if="!closed && !isVoted" @click="showResult = !showResult">{{ showResult ? i18n.ts._poll.vote : i18n.ts._poll.showResult }}</a>
|
||||
<span v-if="isVoted">{{ i18n.ts._poll.voted }}</span>
|
||||
<span v-else-if="closed">{{ i18n.ts._poll.closed }}</span>
|
||||
<span v-if="remaining > 0"> · {{ timer }}</span>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, onUnmounted, ref, toRef } from 'vue';
|
||||
<script lang="ts" setup>
|
||||
import { computed, onUnmounted, ref, toRef } from 'vue';
|
||||
import * as misskey from 'misskey-js';
|
||||
import { sum } from '@/scripts/array';
|
||||
import { pleaseLogin } from '@/scripts/please-login';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
import { useInterval } from '@/scripts/use-interval';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
note: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
readOnly: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
const props = defineProps<{
|
||||
note: misskey.entities.Note;
|
||||
readOnly?: boolean;
|
||||
}>();
|
||||
|
||||
setup(props) {
|
||||
const remaining = ref(-1);
|
||||
const remaining = ref(-1);
|
||||
|
||||
const total = computed(() => sum(props.note.poll.choices.map(x => x.votes)));
|
||||
const closed = computed(() => remaining.value === 0);
|
||||
const isVoted = computed(() => !props.note.poll.multiple && props.note.poll.choices.some(c => c.isVoted));
|
||||
const timer = computed(() => i18n.t(
|
||||
remaining.value >= 86400 ? '_poll.remainingDays' :
|
||||
remaining.value >= 3600 ? '_poll.remainingHours' :
|
||||
remaining.value >= 60 ? '_poll.remainingMinutes' : '_poll.remainingSeconds', {
|
||||
s: Math.floor(remaining.value % 60),
|
||||
m: Math.floor(remaining.value / 60) % 60,
|
||||
h: Math.floor(remaining.value / 3600) % 24,
|
||||
d: Math.floor(remaining.value / 86400),
|
||||
}));
|
||||
const total = computed(() => sum(props.note.poll.choices.map(x => x.votes)));
|
||||
const closed = computed(() => remaining.value === 0);
|
||||
const isVoted = computed(() => !props.note.poll.multiple && props.note.poll.choices.some(c => c.isVoted));
|
||||
const timer = computed(() => i18n.t(
|
||||
remaining.value >= 86400 ? '_poll.remainingDays' :
|
||||
remaining.value >= 3600 ? '_poll.remainingHours' :
|
||||
remaining.value >= 60 ? '_poll.remainingMinutes' : '_poll.remainingSeconds', {
|
||||
s: Math.floor(remaining.value % 60),
|
||||
m: Math.floor(remaining.value / 60) % 60,
|
||||
h: Math.floor(remaining.value / 3600) % 24,
|
||||
d: Math.floor(remaining.value / 86400),
|
||||
}));
|
||||
|
||||
const showResult = ref(props.readOnly || isVoted.value);
|
||||
const showResult = ref(props.readOnly || isVoted.value);
|
||||
|
||||
// 期限付きアンケート
|
||||
if (props.note.poll.expiresAt) {
|
||||
const tick = () => {
|
||||
remaining.value = Math.floor(Math.max(new Date(props.note.poll.expiresAt).getTime() - Date.now(), 0) / 1000);
|
||||
if (remaining.value === 0) {
|
||||
showResult.value = true;
|
||||
}
|
||||
};
|
||||
|
||||
useInterval(tick, 3000, {
|
||||
immediate: true,
|
||||
afterMounted: false,
|
||||
});
|
||||
// 期限付きアンケート
|
||||
if (props.note.poll.expiresAt) {
|
||||
const tick = () => {
|
||||
remaining.value = Math.floor(Math.max(new Date(props.note.poll.expiresAt).getTime() - Date.now(), 0) / 1000);
|
||||
if (remaining.value === 0) {
|
||||
showResult.value = true;
|
||||
}
|
||||
};
|
||||
|
||||
const vote = async (id) => {
|
||||
pleaseLogin();
|
||||
useInterval(tick, 3000, {
|
||||
immediate: true,
|
||||
afterMounted: false,
|
||||
});
|
||||
}
|
||||
|
||||
if (props.readOnly || closed.value || isVoted.value) return;
|
||||
const vote = async (id) => {
|
||||
pleaseLogin();
|
||||
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'question',
|
||||
text: i18n.t('voteConfirm', { choice: props.note.poll.choices[id].text }),
|
||||
});
|
||||
if (canceled) return;
|
||||
if (props.readOnly || closed.value || isVoted.value) return;
|
||||
|
||||
await os.api('notes/polls/vote', {
|
||||
noteId: props.note.id,
|
||||
choice: id,
|
||||
});
|
||||
if (!showResult.value) showResult.value = !props.note.poll.multiple;
|
||||
};
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'question',
|
||||
text: i18n.t('voteConfirm', { choice: props.note.poll.choices[id].text }),
|
||||
});
|
||||
if (canceled) return;
|
||||
|
||||
return {
|
||||
remaining,
|
||||
showResult,
|
||||
total,
|
||||
isVoted,
|
||||
closed,
|
||||
timer,
|
||||
vote,
|
||||
};
|
||||
},
|
||||
});
|
||||
await os.api('notes/polls/vote', {
|
||||
noteId: props.note.id,
|
||||
choice: id,
|
||||
});
|
||||
if (!showResult.value) showResult.value = !props.note.poll.multiple;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -479,7 +479,22 @@ function onDragover(ev) {
|
|||
if (isFile || isDriveFile) {
|
||||
ev.preventDefault();
|
||||
draghover = true;
|
||||
ev.dataTransfer.dropEffect = ev.dataTransfer.effectAllowed === 'all' ? 'copy' : 'move';
|
||||
switch (ev.dataTransfer.effectAllowed) {
|
||||
case 'all':
|
||||
case 'uninitialized':
|
||||
case 'copy':
|
||||
case 'copyLink':
|
||||
case 'copyMove':
|
||||
ev.dataTransfer.dropEffect = 'copy';
|
||||
break;
|
||||
case 'linkMove':
|
||||
case 'move':
|
||||
ev.dataTransfer.dropEffect = 'move';
|
||||
break;
|
||||
default:
|
||||
ev.dataTransfer.dropEffect = 'none';
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,10 @@
|
|||
<template>
|
||||
<div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ $ts.remoteUserCaution }}<a class="link" :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
|
||||
<div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ i18n.ts.remoteUserCaution }}<a class="link" :href="href" rel="nofollow noopener" target="_blank">{{ i18n.ts.showOnRemote }}</a></div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
defineProps<{
|
||||
href: string;
|
||||
}>();
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<button v-if="canRenote"
|
||||
<button
|
||||
v-if="canRenote"
|
||||
ref="buttonRef"
|
||||
class="eddddedb _button canRenote"
|
||||
@click="renote()"
|
||||
|
|
@ -12,8 +13,9 @@
|
|||
</button>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, ref } from 'vue';
|
||||
<script lang="ts" setup>
|
||||
import { computed, ref } from 'vue';
|
||||
import * as misskey from 'misskey-js';
|
||||
import XDetails from '@/components/users-tooltip.vue';
|
||||
import { pleaseLogin } from '@/scripts/please-login';
|
||||
import * as os from '@/os';
|
||||
|
|
@ -21,71 +23,55 @@ import { $i } from '@/account';
|
|||
import { useTooltip } from '@/scripts/use-tooltip';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
count: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
note: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
const props = defineProps<{
|
||||
note: misskey.entities.Note;
|
||||
count: number;
|
||||
}>();
|
||||
|
||||
setup(props) {
|
||||
const buttonRef = ref<HTMLElement>();
|
||||
const buttonRef = ref<HTMLElement>();
|
||||
|
||||
const canRenote = computed(() => ['public', 'home'].includes(props.note.visibility) || props.note.userId === $i.id);
|
||||
const canRenote = computed(() => ['public', 'home'].includes(props.note.visibility) || props.note.userId === $i.id);
|
||||
|
||||
useTooltip(buttonRef, async (showing) => {
|
||||
const renotes = await os.api('notes/renotes', {
|
||||
noteId: props.note.id,
|
||||
limit: 11
|
||||
});
|
||||
useTooltip(buttonRef, async (showing) => {
|
||||
const renotes = await os.api('notes/renotes', {
|
||||
noteId: props.note.id,
|
||||
limit: 11,
|
||||
});
|
||||
|
||||
const users = renotes.map(x => x.user);
|
||||
const users = renotes.map(x => x.user);
|
||||
|
||||
if (users.length < 1) return;
|
||||
if (users.length < 1) return;
|
||||
|
||||
os.popup(XDetails, {
|
||||
showing,
|
||||
users,
|
||||
count: props.count,
|
||||
targetElement: buttonRef.value
|
||||
}, {}, 'closed');
|
||||
});
|
||||
|
||||
const renote = (viaKeyboard = false) => {
|
||||
pleaseLogin();
|
||||
os.popupMenu([{
|
||||
text: i18n.ts.renote,
|
||||
icon: 'fas fa-retweet',
|
||||
action: () => {
|
||||
os.api('notes/create', {
|
||||
renoteId: props.note.id
|
||||
});
|
||||
}
|
||||
}, {
|
||||
text: i18n.ts.quote,
|
||||
icon: 'fas fa-quote-right',
|
||||
action: () => {
|
||||
os.post({
|
||||
renote: props.note,
|
||||
});
|
||||
}
|
||||
}], buttonRef.value, {
|
||||
viaKeyboard
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
buttonRef,
|
||||
canRenote,
|
||||
renote,
|
||||
};
|
||||
},
|
||||
os.popup(XDetails, {
|
||||
showing,
|
||||
users,
|
||||
count: props.count,
|
||||
targetElement: buttonRef.value,
|
||||
}, {}, 'closed');
|
||||
});
|
||||
|
||||
const renote = (viaKeyboard = false) => {
|
||||
pleaseLogin();
|
||||
os.popupMenu([{
|
||||
text: i18n.ts.renote,
|
||||
icon: 'fas fa-retweet',
|
||||
action: () => {
|
||||
os.api('notes/create', {
|
||||
renoteId: props.note.id,
|
||||
});
|
||||
},
|
||||
}, {
|
||||
text: i18n.ts.quote,
|
||||
icon: 'fas fa-quote-right',
|
||||
action: () => {
|
||||
os.post({
|
||||
renote: props.note,
|
||||
});
|
||||
},
|
||||
}], buttonRef.value, {
|
||||
viaKeyboard,
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
<template>
|
||||
<XModalWindow ref="dialog"
|
||||
<XModalWindow
|
||||
ref="dialog"
|
||||
:width="370"
|
||||
:height="400"
|
||||
@close="onClose"
|
||||
@closed="emit('closed')"
|
||||
>
|
||||
<template #header>{{ $ts.login }}</template>
|
||||
<template #header>{{ i18n.ts.login }}</template>
|
||||
|
||||
<MkSignin :auto-set="autoSet" :message="message" @login="onLogin"/>
|
||||
</XModalWindow>
|
||||
|
|
@ -13,15 +14,16 @@
|
|||
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
import XModalWindow from '@/components/ui/modal-window.vue';
|
||||
import MkSignin from './signin.vue';
|
||||
import XModalWindow from '@/components/ui/modal-window.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
autoSet?: boolean;
|
||||
message?: string,
|
||||
}>(), {
|
||||
autoSet: false,
|
||||
message: ''
|
||||
message: '',
|
||||
});
|
||||
|
||||
const emit = defineEmits<{
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
<template>
|
||||
<XModalWindow ref="dialog"
|
||||
<XModalWindow
|
||||
ref="dialog"
|
||||
:width="366"
|
||||
:height="500"
|
||||
@close="dialog.close()"
|
||||
@closed="$emit('closed')"
|
||||
>
|
||||
<template #header>{{ $ts.signup }}</template>
|
||||
<template #header>{{ i18n.ts.signup }}</template>
|
||||
|
||||
<div class="_monolithic_">
|
||||
<div class="_section">
|
||||
|
|
@ -17,8 +18,9 @@
|
|||
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
import XModalWindow from '@/components/ui/modal-window.vue';
|
||||
import XSignup from './signup.vue';
|
||||
import XModalWindow from '@/components/ui/modal-window.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
autoSet?: boolean;
|
||||
|
|
|
|||
|
|
@ -1,65 +1,65 @@
|
|||
<template>
|
||||
<form class="qlvuhzng _formRoot" autocomplete="new-password" @submit.prevent="onSubmit">
|
||||
<MkInput v-if="instance.disableRegistration" v-model="invitationCode" class="_formBlock" type="text" :spellcheck="false" required>
|
||||
<template #label>{{ $ts.invitationCode }}</template>
|
||||
<template #label>{{ i18n.ts.invitationCode }}</template>
|
||||
<template #prefix><i class="fas fa-key"></i></template>
|
||||
</MkInput>
|
||||
<MkInput v-model="username" class="_formBlock" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :spellcheck="false" required data-cy-signup-username @update:modelValue="onChangeUsername">
|
||||
<template #label>{{ $ts.username }} <div v-tooltip:dialog="$ts.usernameInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template>
|
||||
<template #label>{{ i18n.ts.username }} <div v-tooltip:dialog="i18n.ts.usernameInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template>
|
||||
<template #prefix>@</template>
|
||||
<template #suffix>@{{ host }}</template>
|
||||
<template #caption>
|
||||
<span v-if="usernameState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ $ts.checking }}</span>
|
||||
<span v-else-if="usernameState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span>
|
||||
<span v-else-if="usernameState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span>
|
||||
<span v-else-if="usernameState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span>
|
||||
<span v-else-if="usernameState === 'invalid-format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.usernameInvalidFormat }}</span>
|
||||
<span v-else-if="usernameState === 'min-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooShort }}</span>
|
||||
<span v-else-if="usernameState === 'max-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooLong }}</span>
|
||||
<span v-if="usernameState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ i18n.ts.checking }}</span>
|
||||
<span v-else-if="usernameState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.available }}</span>
|
||||
<span v-else-if="usernameState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.unavailable }}</span>
|
||||
<span v-else-if="usernameState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.error }}</span>
|
||||
<span v-else-if="usernameState === 'invalid-format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.usernameInvalidFormat }}</span>
|
||||
<span v-else-if="usernameState === 'min-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.tooShort }}</span>
|
||||
<span v-else-if="usernameState === 'max-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.tooLong }}</span>
|
||||
</template>
|
||||
</MkInput>
|
||||
<MkInput v-if="instance.emailRequiredForSignup" v-model="email" class="_formBlock" :debounce="true" type="email" :spellcheck="false" required data-cy-signup-email @update:modelValue="onChangeEmail">
|
||||
<template #label>{{ $ts.emailAddress }} <div v-tooltip:dialog="$ts._signup.emailAddressInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template>
|
||||
<template #label>{{ i18n.ts.emailAddress }} <div v-tooltip:dialog="i18n.ts._signup.emailAddressInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template>
|
||||
<template #prefix><i class="fas fa-envelope"></i></template>
|
||||
<template #caption>
|
||||
<span v-if="emailState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ $ts.checking }}</span>
|
||||
<span v-else-if="emailState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:used'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.used }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.format }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:disposable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.disposable }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:mx'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.mx }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:smtp'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.smtp }}</span>
|
||||
<span v-else-if="emailState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span>
|
||||
<span v-else-if="emailState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span>
|
||||
<span v-if="emailState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ i18n.ts.checking }}</span>
|
||||
<span v-else-if="emailState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.available }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:used'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.used }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.format }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:disposable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.disposable }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:mx'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.mx }}</span>
|
||||
<span v-else-if="emailState === 'unavailable:smtp'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.smtp }}</span>
|
||||
<span v-else-if="emailState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.unavailable }}</span>
|
||||
<span v-else-if="emailState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.error }}</span>
|
||||
</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="password" class="_formBlock" type="password" autocomplete="new-password" required data-cy-signup-password @update:modelValue="onChangePassword">
|
||||
<template #label>{{ $ts.password }}</template>
|
||||
<template #label>{{ i18n.ts.password }}</template>
|
||||
<template #prefix><i class="fas fa-lock"></i></template>
|
||||
<template #caption>
|
||||
<span v-if="passwordStrength == 'low'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.weakPassword }}</span>
|
||||
<span v-if="passwordStrength == 'medium'" style="color: var(--warn)"><i class="fas fa-check fa-fw"></i> {{ $ts.normalPassword }}</span>
|
||||
<span v-if="passwordStrength == 'high'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.strongPassword }}</span>
|
||||
<span v-if="passwordStrength == 'low'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.weakPassword }}</span>
|
||||
<span v-if="passwordStrength == 'medium'" style="color: var(--warn)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.normalPassword }}</span>
|
||||
<span v-if="passwordStrength == 'high'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.strongPassword }}</span>
|
||||
</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="retypedPassword" class="_formBlock" type="password" autocomplete="new-password" required data-cy-signup-password-retype @update:modelValue="onChangePasswordRetype">
|
||||
<template #label>{{ $ts.password }} ({{ $ts.retype }})</template>
|
||||
<template #label>{{ i18n.ts.password }} ({{ i18n.ts.retype }})</template>
|
||||
<template #prefix><i class="fas fa-lock"></i></template>
|
||||
<template #caption>
|
||||
<span v-if="passwordRetypeState == 'match'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.passwordMatched }}</span>
|
||||
<span v-if="passwordRetypeState == 'not-match'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.passwordNotMatched }}</span>
|
||||
<span v-if="passwordRetypeState == 'match'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.passwordMatched }}</span>
|
||||
<span v-if="passwordRetypeState == 'not-match'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.passwordNotMatched }}</span>
|
||||
</template>
|
||||
</MkInput>
|
||||
<MkSwitch v-if="instance.tosUrl" v-model="ToSAgreement" class="_formBlock tou">
|
||||
<I18n :src="$ts.agreeTo">
|
||||
<I18n :src="i18n.ts.agreeTo">
|
||||
<template #0>
|
||||
<a :href="instance.tosUrl" class="_link" target="_blank">{{ $ts.tos }}</a>
|
||||
<a :href="instance.tosUrl" class="_link" target="_blank">{{ i18n.ts.tos }}</a>
|
||||
</template>
|
||||
</I18n>
|
||||
</MkSwitch>
|
||||
<MkCaptcha v-if="instance.enableHcaptcha" ref="hcaptcha" v-model="hCaptchaResponse" class="_formBlock captcha" provider="hcaptcha" :sitekey="instance.hcaptchaSiteKey"/>
|
||||
<MkCaptcha v-if="instance.enableRecaptcha" ref="recaptcha" v-model="reCaptchaResponse" class="_formBlock captcha" provider="recaptcha" :sitekey="instance.recaptchaSiteKey"/>
|
||||
<MkButton class="_formBlock" type="submit" :disabled="shouldDisableSubmitting" gradate data-cy-signup-submit>{{ $ts.start }}</MkButton>
|
||||
<MkButton class="_formBlock" type="submit" :disabled="shouldDisableSubmitting" gradate data-cy-signup-submit>{{ i18n.ts.start }}</MkButton>
|
||||
</form>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -63,63 +63,51 @@
|
|||
</span>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
|
||||
import * as os from '@/os';
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, onUnmounted, ref } from 'vue';
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const particles = ref([]);
|
||||
const el = ref<HTMLElement>();
|
||||
const width = ref(0);
|
||||
const height = ref(0);
|
||||
const colors = ['#FF1493', '#00FFFF', '#FFE202', '#FFE202', '#FFE202'];
|
||||
let stop = false;
|
||||
let ro: ResizeObserver | undefined;
|
||||
const particles = ref([]);
|
||||
const el = ref<HTMLElement>();
|
||||
const width = ref(0);
|
||||
const height = ref(0);
|
||||
const colors = ['#FF1493', '#00FFFF', '#FFE202', '#FFE202', '#FFE202'];
|
||||
let stop = false;
|
||||
let ro: ResizeObserver | undefined;
|
||||
|
||||
onMounted(() => {
|
||||
ro = new ResizeObserver((entries, observer) => {
|
||||
width.value = el.value?.offsetWidth + 64;
|
||||
height.value = el.value?.offsetHeight + 64;
|
||||
});
|
||||
ro.observe(el.value);
|
||||
const add = () => {
|
||||
if (stop) return;
|
||||
const x = (Math.random() * (width.value - 64));
|
||||
const y = (Math.random() * (height.value - 64));
|
||||
const sizeFactor = Math.random();
|
||||
const particle = {
|
||||
id: Math.random().toString(),
|
||||
x,
|
||||
y,
|
||||
size: 0.2 + ((sizeFactor / 10) * 3),
|
||||
dur: 1000 + (sizeFactor * 1000),
|
||||
color: colors[Math.floor(Math.random() * colors.length)],
|
||||
};
|
||||
particles.value.push(particle);
|
||||
window.setTimeout(() => {
|
||||
particles.value = particles.value.filter(x => x.id !== particle.id);
|
||||
}, particle.dur - 100);
|
||||
|
||||
window.setTimeout(() => {
|
||||
add();
|
||||
}, 500 + (Math.random() * 500));
|
||||
};
|
||||
add();
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
if (ro) ro.disconnect();
|
||||
stop = true;
|
||||
});
|
||||
|
||||
return {
|
||||
el,
|
||||
width,
|
||||
height,
|
||||
particles,
|
||||
onMounted(() => {
|
||||
ro = new ResizeObserver((entries, observer) => {
|
||||
width.value = el.value?.offsetWidth + 64;
|
||||
height.value = el.value?.offsetHeight + 64;
|
||||
});
|
||||
ro.observe(el.value);
|
||||
const add = () => {
|
||||
if (stop) return;
|
||||
const x = (Math.random() * (width.value - 64));
|
||||
const y = (Math.random() * (height.value - 64));
|
||||
const sizeFactor = Math.random();
|
||||
const particle = {
|
||||
id: Math.random().toString(),
|
||||
x,
|
||||
y,
|
||||
size: 0.2 + ((sizeFactor / 10) * 3),
|
||||
dur: 1000 + (sizeFactor * 1000),
|
||||
color: colors[Math.floor(Math.random() * colors.length)],
|
||||
};
|
||||
},
|
||||
particles.value.push(particle);
|
||||
window.setTimeout(() => {
|
||||
particles.value = particles.value.filter(x => x.id !== particle.id);
|
||||
}, particle.dur - 100);
|
||||
|
||||
window.setTimeout(() => {
|
||||
add();
|
||||
}, 500 + (Math.random() * 500));
|
||||
};
|
||||
add();
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
if (ro) ro.disconnect();
|
||||
stop = true;
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="wrmlmaau" :class="{ collapsed }">
|
||||
<div class="body">
|
||||
<span v-if="note.isHidden" style="opacity: 0.5">({{ $ts.private }})</span>
|
||||
<span v-if="note.deletedAt" style="opacity: 0.5">({{ $ts.deleted }})</span>
|
||||
<span v-if="note.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
|
||||
<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
|
||||
<MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
|
||||
<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
|
||||
|
|
@ -12,20 +12,21 @@
|
|||
<XMediaList :media-list="note.files"/>
|
||||
</details>
|
||||
<details v-if="note.poll">
|
||||
<summary>{{ $ts.poll }}</summary>
|
||||
<summary>{{ i18n.ts.poll }}</summary>
|
||||
<XPoll :note="note"/>
|
||||
</details>
|
||||
<button v-if="collapsed" class="fade _button" @click="collapsed = false">
|
||||
<span>{{ $ts.showMore }}</span>
|
||||
<span>{{ i18n.ts.showMore }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
import * as misskey from 'misskey-js';
|
||||
import XPoll from './poll.vue';
|
||||
import XMediaList from './media-list.vue';
|
||||
import * as misskey from 'misskey-js';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
note: misskey.entities.Note;
|
||||
|
|
|
|||
|
|
@ -18,13 +18,13 @@ export default defineComponent({
|
|||
disabled: this.modelValue === option.props.value,
|
||||
onClick: () => {
|
||||
this.$emit('update:modelValue', option.props.value);
|
||||
}
|
||||
},
|
||||
}, option.children), [
|
||||
[resolveDirective('click-anime')]
|
||||
[resolveDirective('click-anime')],
|
||||
]))), [
|
||||
[resolveDirective('size'), { max: [500] }]
|
||||
[resolveDirective('size'), { max: [500] }],
|
||||
]);
|
||||
}
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -25,23 +25,25 @@ let tagsEl = $ref<HTMLElement | null>(null);
|
|||
let width = $ref(300);
|
||||
|
||||
watch($$(available), () => {
|
||||
window.TagCanvas.Start(idForCanvas, idForTags, {
|
||||
textColour: '#ffffff',
|
||||
outlineColour: tinycolor(computedStyle.getPropertyValue('--accent')).toHexString(),
|
||||
outlineRadius: 10,
|
||||
initial: [-0.030, -0.010],
|
||||
frontSelect: true,
|
||||
imageRadius: 8,
|
||||
//dragControl: true,
|
||||
dragThreshold: 3,
|
||||
wheelZoom: false,
|
||||
reverse: true,
|
||||
depth: 0.5,
|
||||
maxSpeed: 0.2,
|
||||
minSpeed: 0.003,
|
||||
stretchX: 0.8,
|
||||
stretchY: 0.8,
|
||||
});
|
||||
try {
|
||||
window.TagCanvas.Start(idForCanvas, idForTags, {
|
||||
textColour: '#ffffff',
|
||||
outlineColour: tinycolor(computedStyle.getPropertyValue('--accent')).toHexString(),
|
||||
outlineRadius: 10,
|
||||
initial: [-0.030, -0.010],
|
||||
frontSelect: true,
|
||||
imageRadius: 8,
|
||||
//dragControl: true,
|
||||
dragThreshold: 3,
|
||||
wheelZoom: false,
|
||||
reverse: true,
|
||||
depth: 0.5,
|
||||
maxSpeed: 0.2,
|
||||
minSpeed: 0.003,
|
||||
stretchX: 0.8,
|
||||
stretchY: 0.8,
|
||||
});
|
||||
} catch (err) {}
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
|
|
@ -58,7 +60,7 @@ onMounted(() => {
|
|||
});
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
window.TagCanvas.Delete(idForCanvas);
|
||||
if (window.TagCanvas) window.TagCanvas.Delete(idForCanvas);
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
|
|
|
|||
|
|
@ -141,7 +141,7 @@ export default defineComponent({
|
|||
display: block;
|
||||
min-width: 100px;
|
||||
width: max-content;
|
||||
padding: 8px 14px;
|
||||
padding: 8px 16px;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
font-size: 1em;
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@
|
|||
</button>
|
||||
</template>
|
||||
<span v-if="items2.length === 0" class="none item">
|
||||
<span>{{ $ts.none }}</span>
|
||||
<span>{{ i18n.ts.none }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="childMenu" class="child">
|
||||
|
|
@ -61,6 +61,8 @@ import { focusPrev, focusNext } from '@/scripts/focus';
|
|||
import FormSwitch from '@/components/form/switch.vue';
|
||||
import { MenuItem, InnerMenuItem, MenuPending, MenuAction } from '@/types/menu';
|
||||
import * as os from '@/os';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const XChild = defineAsyncComponent(() => import('./menu.child.vue'));
|
||||
|
||||
const props = defineProps<{
|
||||
|
|
@ -335,6 +337,9 @@ onBeforeUnmount(() => {
|
|||
&.asDrawer {
|
||||
padding: 12px 0 calc(env(safe-area-inset-bottom, 0px) + 12px) 0;
|
||||
width: 100%;
|
||||
border-radius: 24px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
|
||||
> .item {
|
||||
font-size: 1em;
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<slot name="empty">
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.nothing }}</div>
|
||||
<div>{{ i18n.ts.nothing }}</div>
|
||||
</div>
|
||||
</slot>
|
||||
</div>
|
||||
|
|
@ -16,14 +16,14 @@
|
|||
<div v-else ref="rootEl">
|
||||
<div v-show="pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
|
||||
<MkButton v-if="!moreFetching" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMoreAhead">
|
||||
{{ $ts.loadMore }}
|
||||
{{ i18n.ts.loadMore }}
|
||||
</MkButton>
|
||||
<MkLoading v-else class="loading"/>
|
||||
</div>
|
||||
<slot :items="items"></slot>
|
||||
<div v-show="!pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
|
||||
<MkButton v-if="!moreFetching" v-appear="($store.state.enableInfiniteScroll && !disableAutoLoad) ? fetchMore : null" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMore">
|
||||
{{ $ts.loadMore }}
|
||||
{{ i18n.ts.loadMore }}
|
||||
</MkButton>
|
||||
<MkLoading v-else class="loading"/>
|
||||
</div>
|
||||
|
|
@ -37,6 +37,7 @@ import * as misskey from 'misskey-js';
|
|||
import * as os from '@/os';
|
||||
import { onScrollTop, isTopVisible, getScrollPosition, getScrollContainer } from '@/scripts/scroll';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const SECOND_FETCH_LIMIT = 30;
|
||||
|
||||
|
|
@ -196,21 +197,23 @@ const prepend = (item: Item): void => {
|
|||
if (props.pagination.reversed) {
|
||||
if (rootEl.value) {
|
||||
const container = getScrollContainer(rootEl.value);
|
||||
if (container == null) return; // TODO?
|
||||
|
||||
const pos = getScrollPosition(rootEl.value);
|
||||
const viewHeight = container.clientHeight;
|
||||
const height = container.scrollHeight;
|
||||
const isBottom = (pos + viewHeight > height - 32);
|
||||
if (isBottom) {
|
||||
// オーバーフローしたら古いアイテムは捨てる
|
||||
if (items.value.length >= props.displayLimit) {
|
||||
// このやり方だとVue 3.2以降アニメーションが動かなくなる
|
||||
//items.value = items.value.slice(-props.displayLimit);
|
||||
while (items.value.length >= props.displayLimit) {
|
||||
items.value.shift();
|
||||
if (container == null) {
|
||||
// TODO?
|
||||
} else {
|
||||
const pos = getScrollPosition(rootEl.value);
|
||||
const viewHeight = container.clientHeight;
|
||||
const height = container.scrollHeight;
|
||||
const isBottom = (pos + viewHeight > height - 32);
|
||||
if (isBottom) {
|
||||
// オーバーフローしたら古いアイテムは捨てる
|
||||
if (items.value.length >= props.displayLimit) {
|
||||
// このやり方だとVue 3.2以降アニメーションが動かなくなる
|
||||
//items.value = items.value.slice(-props.displayLimit);
|
||||
while (items.value.length >= props.displayLimit) {
|
||||
items.value.shift();
|
||||
}
|
||||
more.value = true;
|
||||
}
|
||||
more.value = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -170,6 +170,7 @@ function onHeaderMousedown(evt: MouseEvent) {
|
|||
beforeClickedAt = Date.now();
|
||||
|
||||
const main = rootEl;
|
||||
if (main == null) return;
|
||||
|
||||
if (!contains(main, document.activeElement)) main.focus();
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<MkModal ref="modal" :z-priority="'middle'" @click="$refs.modal.close()" @closed="$emit('closed')">
|
||||
<div class="ewlycnyt">
|
||||
<div class="title"><MkSparkle>{{ $ts.misskeyUpdated }}</MkSparkle></div>
|
||||
<div class="title"><MkSparkle>{{ i18n.ts.misskeyUpdated }}</MkSparkle></div>
|
||||
<div class="version">✨{{ version }}🚀</div>
|
||||
<MkButton full @click="whatIsNew">{{ $ts.whatIsNew }}</MkButton>
|
||||
<MkButton class="gotIt" primary full @click="$refs.modal.close()">{{ $ts.gotIt }}</MkButton>
|
||||
<MkButton full @click="whatIsNew">{{ i18n.ts.whatIsNew }}</MkButton>
|
||||
<MkButton class="gotIt" primary full @click="$refs.modal.close()">{{ i18n.ts.gotIt }}</MkButton>
|
||||
</div>
|
||||
</MkModal>
|
||||
</template>
|
||||
|
|
@ -15,8 +15,9 @@ import MkModal from '@/components/ui/modal.vue';
|
|||
import MkButton from '@/components/ui/button.vue';
|
||||
import MkSparkle from '@/components/sparkle.vue';
|
||||
import { version } from '@/config';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const modal = ref();
|
||||
const modal = ref<InstanceType<typeof MkModal>>();
|
||||
|
||||
const whatIsNew = () => {
|
||||
modal.value.close();
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div v-if="playerEnabled" class="player" :style="`padding: ${(player.height || 0) / (player.width || 1) * 100}% 0 0`">
|
||||
<button class="disablePlayer" :title="$ts.disablePlayer" @click="playerEnabled = false"><i class="fas fa-times"></i></button>
|
||||
<button class="disablePlayer" :title="i18n.ts.disablePlayer" @click="playerEnabled = false"><i class="fas fa-times"></i></button>
|
||||
<iframe :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" :width="player.width || '100%'" :heigth="player.height || 250" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen/>
|
||||
</div>
|
||||
<div v-else-if="tweetId && tweetExpanded" ref="twitter" class="twitter">
|
||||
|
|
@ -10,7 +10,7 @@
|
|||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||
<component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
|
||||
<div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`">
|
||||
<button v-if="!playerEnabled && player.url" class="_button" :title="$ts.enablePlayer" @click.prevent="playerEnabled = true"><i class="fas fa-play-circle"></i></button>
|
||||
<button v-if="!playerEnabled && player.url" class="_button" :title="i18n.ts.enablePlayer" @click.prevent="playerEnabled = true"><i class="fas fa-play-circle"></i></button>
|
||||
</div>
|
||||
<article>
|
||||
<header>
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
</transition>
|
||||
<div v-if="tweetId" class="expandTweet">
|
||||
<a @click="tweetExpanded = true">
|
||||
<i class="fab fa-twitter"></i> {{ $ts.expandTweet }}
|
||||
<i class="fab fa-twitter"></i> {{ i18n.ts.expandTweet }}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -35,6 +35,7 @@
|
|||
<script lang="ts" setup>
|
||||
import { onMounted, onUnmounted } from 'vue';
|
||||
import { url as local, lang } from '@/config';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
url: string;
|
||||
|
|
|
|||
|
|
@ -10,17 +10,17 @@
|
|||
<div v-if="user.description" class="mfm">
|
||||
<Mfm :text="user.description" :author="user" :i="$i" :custom-emojis="user.emojis"/>
|
||||
</div>
|
||||
<span v-else style="opacity: 0.7;">{{ $ts.noAccountDescription }}</span>
|
||||
<span v-else style="opacity: 0.7;">{{ i18n.ts.noAccountDescription }}</span>
|
||||
</div>
|
||||
<div class="status">
|
||||
<div>
|
||||
<p>{{ $ts.notes }}</p><span>{{ user.notesCount }}</span>
|
||||
<p>{{ i18n.ts.notes }}</p><span>{{ user.notesCount }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<p>{{ $ts.following }}</p><span>{{ user.followingCount }}</span>
|
||||
<p>{{ i18n.ts.following }}</p><span>{{ user.followingCount }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<p>{{ $ts.followers }}</p><span>{{ user.followersCount }}</span>
|
||||
<p>{{ i18n.ts.followers }}</p><span>{{ user.followersCount }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<MkFollowButton v-if="$i && user.id != $i.id" class="koudoku-button" :user="user" mini/>
|
||||
|
|
@ -31,6 +31,7 @@
|
|||
import * as misskey from 'misskey-js';
|
||||
import MkFollowButton from './follow-button.vue';
|
||||
import { userPage } from '@/filters/user';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
defineProps<{
|
||||
user: misskey.entities.UserDetailed;
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noUsers }}</div>
|
||||
<div>{{ i18n.ts.noUsers }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -18,9 +18,9 @@
|
|||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import MkUserInfo from '@/components/user-info.vue';
|
||||
import MkPagination from '@/components/ui/pagination.vue';
|
||||
import { Paging } from '@/components/ui/pagination.vue';
|
||||
import MkPagination, { Paging } from '@/components/ui/pagination.vue';
|
||||
import { userPage } from '@/filters/user';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
pagination: Paging;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<XModalWindow ref="dialogEl"
|
||||
<XModalWindow
|
||||
ref="dialogEl"
|
||||
:with-ok-button="true"
|
||||
:ok-button-disabled="selected == null"
|
||||
@click="cancel()"
|
||||
|
|
@ -7,16 +8,16 @@
|
|||
@ok="ok()"
|
||||
@closed="$emit('closed')"
|
||||
>
|
||||
<template #header>{{ $ts.selectUser }}</template>
|
||||
<template #header>{{ i18n.ts.selectUser }}</template>
|
||||
<div class="tbhwbxda">
|
||||
<div class="form">
|
||||
<FormSplit :min-width="170">
|
||||
<MkInput v-model="username" :autofocus="true" @update:modelValue="search">
|
||||
<template #label>{{ $ts.username }}</template>
|
||||
<template #label>{{ i18n.ts.username }}</template>
|
||||
<template #prefix>@</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="host" @update:modelValue="search">
|
||||
<template #label>{{ $ts.host }}</template>
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
<template #prefix>@</template>
|
||||
</MkInput>
|
||||
</FormSplit>
|
||||
|
|
@ -32,7 +33,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div v-else class="empty">
|
||||
<span>{{ $ts.noUsers }}</span>
|
||||
<span>{{ i18n.ts.noUsers }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="username == '' && host == ''" class="recent">
|
||||
|
|
@ -58,6 +59,7 @@ import FormSplit from '@/components/form/split.vue';
|
|||
import XModalWindow from '@/components/ui/modal-window.vue';
|
||||
import * as os from '@/os';
|
||||
import { defaultStore } from '@/store';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const emit = defineEmits<{
|
||||
(ev: 'ok', selected: misskey.entities.UserDetailed): void;
|
||||
|
|
@ -81,7 +83,7 @@ const search = () => {
|
|||
username: username,
|
||||
host: host,
|
||||
limit: 10,
|
||||
detail: false
|
||||
detail: false,
|
||||
}).then(_users => {
|
||||
users = _users;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -4,37 +4,37 @@
|
|||
<button key="public" class="_button" :class="{ active: v === 'public' }" data-index="1" @click="choose('public')">
|
||||
<div><i class="fas fa-globe"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.public }}</span>
|
||||
<span>{{ $ts._visibility.publicDescription }}</span>
|
||||
<span>{{ i18n.ts._visibility.public }}</span>
|
||||
<span>{{ i18n.ts._visibility.publicDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<button key="home" class="_button" :class="{ active: v === 'home' }" data-index="2" @click="choose('home')">
|
||||
<div><i class="fas fa-home"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.home }}</span>
|
||||
<span>{{ $ts._visibility.homeDescription }}</span>
|
||||
<span>{{ i18n.ts._visibility.home }}</span>
|
||||
<span>{{ i18n.ts._visibility.homeDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<button key="followers" class="_button" :class="{ active: v === 'followers' }" data-index="3" @click="choose('followers')">
|
||||
<div><i class="fas fa-unlock"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.followers }}</span>
|
||||
<span>{{ $ts._visibility.followersDescription }}</span>
|
||||
<span>{{ i18n.ts._visibility.followers }}</span>
|
||||
<span>{{ i18n.ts._visibility.followersDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<button key="specified" :disabled="localOnly" class="_button" :class="{ active: v === 'specified' }" data-index="4" @click="choose('specified')">
|
||||
<div><i class="fas fa-envelope"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.specified }}</span>
|
||||
<span>{{ $ts._visibility.specifiedDescription }}</span>
|
||||
<span>{{ i18n.ts._visibility.specified }}</span>
|
||||
<span>{{ i18n.ts._visibility.specifiedDescription }}</span>
|
||||
</div>
|
||||
</button>
|
||||
<div class="divider"></div>
|
||||
<button key="localOnly" class="_button localOnly" :class="{ active: localOnly }" data-index="5" @click="localOnly = !localOnly">
|
||||
<div><i class="fas fa-biohazard"></i></div>
|
||||
<div>
|
||||
<span>{{ $ts._visibility.localOnly }}</span>
|
||||
<span>{{ $ts._visibility.localOnlyDescription }}</span>
|
||||
<span>{{ i18n.ts._visibility.localOnly }}</span>
|
||||
<span>{{ i18n.ts._visibility.localOnlyDescription }}</span>
|
||||
</div>
|
||||
<div><i :class="localOnly ? 'fas fa-toggle-on' : 'fas fa-toggle-off'"></i></div>
|
||||
</button>
|
||||
|
|
@ -46,6 +46,7 @@
|
|||
import { nextTick, watch } from 'vue';
|
||||
import * as misskey from 'misskey-js';
|
||||
import MkModal from '@/components/ui/modal.vue';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const modal = $ref<InstanceType<typeof MkModal>>();
|
||||
|
||||
|
|
|
|||
|
|
@ -3,11 +3,11 @@
|
|||
<template v-if="edit">
|
||||
<header>
|
||||
<MkSelect v-model="widgetAdderSelected" style="margin-bottom: var(--margin)" class="mk-widget-select">
|
||||
<template #label>{{ $ts.selectWidget }}</template>
|
||||
<template #label>{{ i18n.ts.selectWidget }}</template>
|
||||
<option v-for="widget in widgetDefs" :key="widget" :value="widget">{{ i18n.t(`_widgets.${widget}`) }}</option>
|
||||
</MkSelect>
|
||||
<MkButton inline primary class="mk-widget-add" @click="addWidget"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
|
||||
<MkButton inline @click="$emit('exit')">{{ $ts.close }}</MkButton>
|
||||
<MkButton inline primary class="mk-widget-add" @click="addWidget"><i class="fas fa-plus"></i> {{ i18n.ts.add }}</MkButton>
|
||||
<MkButton inline @click="$emit('exit')">{{ i18n.ts.close }}</MkButton>
|
||||
</header>
|
||||
<XDraggable
|
||||
v-model="widgets_"
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ type RouteDef = {
|
|||
name?: string;
|
||||
hash?: string;
|
||||
globalCacheKey?: string;
|
||||
children?: RouteDef[];
|
||||
};
|
||||
|
||||
type ParsedPath = (string | {
|
||||
|
|
@ -22,6 +23,8 @@ type ParsedPath = (string | {
|
|||
optional?: boolean;
|
||||
})[];
|
||||
|
||||
export type Resolved = { route: RouteDef; props: Map<string, string>; child?: Resolved; };
|
||||
|
||||
function parsePath(path: string): ParsedPath {
|
||||
const res = [] as ParsedPath;
|
||||
|
||||
|
|
@ -51,8 +54,11 @@ export class Router extends EventEmitter<{
|
|||
change: (ctx: {
|
||||
beforePath: string;
|
||||
path: string;
|
||||
route: RouteDef | null;
|
||||
props: Map<string, string> | null;
|
||||
resolved: Resolved;
|
||||
key: string;
|
||||
}) => void;
|
||||
replace: (ctx: {
|
||||
path: string;
|
||||
key: string;
|
||||
}) => void;
|
||||
push: (ctx: {
|
||||
|
|
@ -65,12 +71,12 @@ export class Router extends EventEmitter<{
|
|||
same: () => void;
|
||||
}> {
|
||||
private routes: RouteDef[];
|
||||
public current: Resolved;
|
||||
public currentRef: ShallowRef<Resolved> = shallowRef();
|
||||
public currentRoute: ShallowRef<RouteDef> = shallowRef();
|
||||
private currentPath: string;
|
||||
private currentComponent: Component | null = null;
|
||||
private currentProps: Map<string, string> | null = null;
|
||||
private currentKey = Date.now().toString();
|
||||
|
||||
public currentRoute: ShallowRef<RouteDef | null> = shallowRef(null);
|
||||
public navHook: ((path: string, flag?: any) => boolean) | null = null;
|
||||
|
||||
constructor(routes: Router['routes'], currentPath: Router['currentPath']) {
|
||||
|
|
@ -78,10 +84,10 @@ export class Router extends EventEmitter<{
|
|||
|
||||
this.routes = routes;
|
||||
this.currentPath = currentPath;
|
||||
this.navigate(currentPath, null, true);
|
||||
this.navigate(currentPath, null, false);
|
||||
}
|
||||
|
||||
public resolve(path: string): { route: RouteDef; props: Map<string, string>; } | null {
|
||||
public resolve(path: string): Resolved | null {
|
||||
let queryString: string | null = null;
|
||||
let hash: string | null = null;
|
||||
if (path[0] === '/') path = path.substring(1);
|
||||
|
|
@ -96,77 +102,108 @@ export class Router extends EventEmitter<{
|
|||
|
||||
if (_DEV_) console.log('Routing: ', path, queryString);
|
||||
|
||||
const _parts = path.split('/').filter(part => part.length !== 0);
|
||||
function check(routes: RouteDef[], _parts: string[]): Resolved | null {
|
||||
forEachRouteLoop:
|
||||
for (const route of routes) {
|
||||
let parts = [ ..._parts ];
|
||||
const props = new Map<string, string>();
|
||||
|
||||
forEachRouteLoop:
|
||||
for (const route of this.routes) {
|
||||
let parts = [ ..._parts ];
|
||||
const props = new Map<string, string>();
|
||||
|
||||
pathMatchLoop:
|
||||
for (const p of parsePath(route.path)) {
|
||||
if (typeof p === 'string') {
|
||||
if (p === parts[0]) {
|
||||
parts.shift();
|
||||
} else {
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
} else {
|
||||
if (parts[0] == null && !p.optional) {
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
if (p.wildcard) {
|
||||
if (parts.length !== 0) {
|
||||
props.set(p.name, safeURIDecode(parts.join('/')));
|
||||
parts = [];
|
||||
}
|
||||
break pathMatchLoop;
|
||||
} else {
|
||||
if (p.startsWith) {
|
||||
if (parts[0] == null || !parts[0].startsWith(p.startsWith)) continue forEachRouteLoop;
|
||||
|
||||
props.set(p.name, safeURIDecode(parts[0].substring(p.startsWith.length)));
|
||||
pathMatchLoop:
|
||||
for (const p of parsePath(route.path)) {
|
||||
if (typeof p === 'string') {
|
||||
if (p === parts[0]) {
|
||||
parts.shift();
|
||||
} else {
|
||||
if (parts[0]) {
|
||||
props.set(p.name, safeURIDecode(parts[0]));
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
} else {
|
||||
if (parts[0] == null && !p.optional) {
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
if (p.wildcard) {
|
||||
if (parts.length !== 0) {
|
||||
props.set(p.name, safeURIDecode(parts.join('/')));
|
||||
parts = [];
|
||||
}
|
||||
break pathMatchLoop;
|
||||
} else {
|
||||
if (p.startsWith) {
|
||||
if (parts[0] == null || !parts[0].startsWith(p.startsWith)) continue forEachRouteLoop;
|
||||
|
||||
props.set(p.name, safeURIDecode(parts[0].substring(p.startsWith.length)));
|
||||
parts.shift();
|
||||
} else {
|
||||
if (parts[0]) {
|
||||
props.set(p.name, safeURIDecode(parts[0]));
|
||||
}
|
||||
parts.shift();
|
||||
}
|
||||
parts.shift();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (parts.length !== 0) continue forEachRouteLoop;
|
||||
if (parts.length === 0) {
|
||||
if (route.children) {
|
||||
const child = check(route.children, []);
|
||||
if (child) {
|
||||
return {
|
||||
route,
|
||||
props,
|
||||
child,
|
||||
};
|
||||
} else {
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
}
|
||||
|
||||
if (route.hash != null && hash != null) {
|
||||
props.set(route.hash, safeURIDecode(hash));
|
||||
}
|
||||
if (route.hash != null && hash != null) {
|
||||
props.set(route.hash, safeURIDecode(hash));
|
||||
}
|
||||
|
||||
if (route.query != null && queryString != null) {
|
||||
const queryObject = [...new URLSearchParams(queryString).entries()]
|
||||
.reduce((obj, entry) => ({ ...obj, [entry[0]]: entry[1] }), {});
|
||||
if (route.query != null && queryString != null) {
|
||||
const queryObject = [...new URLSearchParams(queryString).entries()]
|
||||
.reduce((obj, entry) => ({ ...obj, [entry[0]]: entry[1] }), {});
|
||||
|
||||
for (const q in route.query) {
|
||||
const as = route.query[q];
|
||||
if (queryObject[q]) {
|
||||
props.set(as, safeURIDecode(queryObject[q]));
|
||||
for (const q in route.query) {
|
||||
const as = route.query[q];
|
||||
if (queryObject[q]) {
|
||||
props.set(as, safeURIDecode(queryObject[q]));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
route,
|
||||
props,
|
||||
};
|
||||
} else {
|
||||
if (route.children) {
|
||||
const child = check(route.children, parts);
|
||||
if (child) {
|
||||
return {
|
||||
route,
|
||||
props,
|
||||
child,
|
||||
};
|
||||
} else {
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
} else {
|
||||
continue forEachRouteLoop;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
route,
|
||||
props,
|
||||
};
|
||||
return null;
|
||||
}
|
||||
|
||||
return null;
|
||||
const _parts = path.split('/').filter(part => part.length !== 0);
|
||||
|
||||
return check(this.routes, _parts);
|
||||
}
|
||||
|
||||
private navigate(path: string, key: string | null | undefined, initial = false) {
|
||||
private navigate(path: string, key: string | null | undefined, emitChange = true) {
|
||||
const beforePath = this.currentPath;
|
||||
const beforeRoute = this.currentRoute.value;
|
||||
this.currentPath = path;
|
||||
|
||||
const res = this.resolve(this.currentPath);
|
||||
|
|
@ -181,28 +218,21 @@ export class Router extends EventEmitter<{
|
|||
|
||||
const isSamePath = beforePath === path;
|
||||
if (isSamePath && key == null) key = this.currentKey;
|
||||
this.currentComponent = res.route.component;
|
||||
this.currentProps = res.props;
|
||||
this.current = res;
|
||||
this.currentRef.value = res;
|
||||
this.currentRoute.value = res.route;
|
||||
this.currentKey = this.currentRoute.value.globalCacheKey ?? key ?? Date.now().toString();
|
||||
this.currentKey = res.route.globalCacheKey ?? key ?? path;
|
||||
|
||||
if (!initial) {
|
||||
if (emitChange) {
|
||||
this.emit('change', {
|
||||
beforePath,
|
||||
path,
|
||||
route: this.currentRoute.value,
|
||||
props: this.currentProps,
|
||||
resolved: res,
|
||||
key: this.currentKey,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
public getCurrentComponent() {
|
||||
return this.currentComponent;
|
||||
}
|
||||
|
||||
public getCurrentProps() {
|
||||
return this.currentProps;
|
||||
return res;
|
||||
}
|
||||
|
||||
public getCurrentPath() {
|
||||
|
|
@ -223,17 +253,23 @@ export class Router extends EventEmitter<{
|
|||
const cancel = this.navHook(path, flag);
|
||||
if (cancel) return;
|
||||
}
|
||||
this.navigate(path, null);
|
||||
const res = this.navigate(path, null);
|
||||
this.emit('push', {
|
||||
beforePath,
|
||||
path,
|
||||
route: this.currentRoute.value,
|
||||
props: this.currentProps,
|
||||
route: res.route,
|
||||
props: res.props,
|
||||
key: this.currentKey,
|
||||
});
|
||||
}
|
||||
|
||||
public change(path: string, key?: string | null) {
|
||||
public replace(path: string, key?: string | null, emitEvent = true) {
|
||||
this.navigate(path, key);
|
||||
if (emitEvent) {
|
||||
this.emit('replace', {
|
||||
path,
|
||||
key: this.currentKey,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
7
packages/client/src/pages/_empty_.vue
Normal file
7
packages/client/src/pages/_empty_.vue
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
<div></div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
</script>
|
||||
|
|
@ -3,35 +3,35 @@
|
|||
<div class="query">
|
||||
<MkInput v-model="host" :debounce="true" class="">
|
||||
<template #prefix><i class="fas fa-search"></i></template>
|
||||
<template #label>{{ $ts.host }}</template>
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
</MkInput>
|
||||
<FormSplit style="margin-top: var(--margin);">
|
||||
<MkSelect v-model="state">
|
||||
<template #label>{{ $ts.state }}</template>
|
||||
<option value="all">{{ $ts.all }}</option>
|
||||
<option value="federating">{{ $ts.federating }}</option>
|
||||
<option value="subscribing">{{ $ts.subscribing }}</option>
|
||||
<option value="publishing">{{ $ts.publishing }}</option>
|
||||
<option value="suspended">{{ $ts.suspended }}</option>
|
||||
<option value="blocked">{{ $ts.blocked }}</option>
|
||||
<option value="notResponding">{{ $ts.notResponding }}</option>
|
||||
<template #label>{{ i18n.ts.state }}</template>
|
||||
<option value="all">{{ i18n.ts.all }}</option>
|
||||
<option value="federating">{{ i18n.ts.federating }}</option>
|
||||
<option value="subscribing">{{ i18n.ts.subscribing }}</option>
|
||||
<option value="publishing">{{ i18n.ts.publishing }}</option>
|
||||
<option value="suspended">{{ i18n.ts.suspended }}</option>
|
||||
<option value="blocked">{{ i18n.ts.blocked }}</option>
|
||||
<option value="notResponding">{{ i18n.ts.notResponding }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="sort">
|
||||
<template #label>{{ $ts.sort }}</template>
|
||||
<option value="+pubSub">{{ $ts.pubSub }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-pubSub">{{ $ts.pubSub }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+notes">{{ $ts.notes }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-notes">{{ $ts.notes }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+users">{{ $ts.users }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-users">{{ $ts.users }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+following">{{ $ts.following }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-following">{{ $ts.following }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+followers">{{ $ts.followers }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-followers">{{ $ts.followers }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+caughtAt">{{ $ts.registeredAt }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-caughtAt">{{ $ts.registeredAt }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+lastCommunicatedAt">{{ $ts.lastCommunication }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-lastCommunicatedAt">{{ $ts.lastCommunication }} ({{ $ts.ascendingOrder }})</option>
|
||||
<template #label>{{ i18n.ts.sort }}</template>
|
||||
<option value="+pubSub">{{ i18n.ts.pubSub }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-pubSub">{{ i18n.ts.pubSub }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+notes">{{ i18n.ts.notes }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-notes">{{ i18n.ts.notes }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+users">{{ i18n.ts.users }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-users">{{ i18n.ts.users }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+following">{{ i18n.ts.following }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-following">{{ i18n.ts.following }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+followers">{{ i18n.ts.followers }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-followers">{{ i18n.ts.followers }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+caughtAt">{{ i18n.ts.registeredAt }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-caughtAt">{{ i18n.ts.registeredAt }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+lastCommunicatedAt">{{ i18n.ts.lastCommunication }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-lastCommunicatedAt">{{ i18n.ts.lastCommunication }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
</MkSelect>
|
||||
</FormSplit>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
</div>
|
||||
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.description }}</template>
|
||||
<template #key>{{ i18n.ts.description }}</template>
|
||||
<template #value>{{ $instance.description }}</template>
|
||||
</MkKeyValue>
|
||||
|
||||
|
|
@ -22,33 +22,33 @@
|
|||
<template #key>Misskey</template>
|
||||
<template #value>{{ version }}</template>
|
||||
</MkKeyValue>
|
||||
<FormLink to="/about-misskey">{{ $ts.aboutMisskey }}</FormLink>
|
||||
<FormLink to="/about-misskey">{{ i18n.ts.aboutMisskey }}</FormLink>
|
||||
</FormSection>
|
||||
|
||||
<FormSection>
|
||||
<FormSplit>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.administrator }}</template>
|
||||
<template #key>{{ i18n.ts.administrator }}</template>
|
||||
<template #value>{{ $instance.maintainerName }}</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.contact }}</template>
|
||||
<template #key>{{ i18n.ts.contact }}</template>
|
||||
<template #value>{{ $instance.maintainerEmail }}</template>
|
||||
</MkKeyValue>
|
||||
</FormSplit>
|
||||
<FormLink v-if="$instance.tosUrl" :to="$instance.tosUrl" class="_formBlock" external>{{ $ts.tos }}</FormLink>
|
||||
<FormLink v-if="$instance.tosUrl" :to="$instance.tosUrl" class="_formBlock" external>{{ i18n.ts.tos }}</FormLink>
|
||||
</FormSection>
|
||||
|
||||
<FormSuspense :p="initStats">
|
||||
<FormSection>
|
||||
<template #label>{{ $ts.statistics }}</template>
|
||||
<template #label>{{ i18n.ts.statistics }}</template>
|
||||
<FormSplit>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.users }}</template>
|
||||
<template #key>{{ i18n.ts.users }}</template>
|
||||
<template #value>{{ number(stats.originalUsersCount) }}</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.notes }}</template>
|
||||
<template #key>{{ i18n.ts.notes }}</template>
|
||||
<template #value>{{ number(stats.originalNotesCount) }}</template>
|
||||
</MkKeyValue>
|
||||
</FormSplit>
|
||||
|
|
|
|||
|
|
@ -7,31 +7,31 @@
|
|||
<div class="_content">
|
||||
<div class="inputs" style="display: flex;">
|
||||
<MkSelect v-model="state" style="margin: 0; flex: 1;">
|
||||
<template #label>{{ $ts.state }}</template>
|
||||
<option value="all">{{ $ts.all }}</option>
|
||||
<option value="unresolved">{{ $ts.unresolved }}</option>
|
||||
<option value="resolved">{{ $ts.resolved }}</option>
|
||||
<template #label>{{ i18n.ts.state }}</template>
|
||||
<option value="all">{{ i18n.ts.all }}</option>
|
||||
<option value="unresolved">{{ i18n.ts.unresolved }}</option>
|
||||
<option value="resolved">{{ i18n.ts.resolved }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="targetUserOrigin" style="margin: 0; flex: 1;">
|
||||
<template #label>{{ $ts.reporteeOrigin }}</template>
|
||||
<option value="combined">{{ $ts.all }}</option>
|
||||
<option value="local">{{ $ts.local }}</option>
|
||||
<option value="remote">{{ $ts.remote }}</option>
|
||||
<template #label>{{ i18n.ts.reporteeOrigin }}</template>
|
||||
<option value="combined">{{ i18n.ts.all }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option value="remote">{{ i18n.ts.remote }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="reporterOrigin" style="margin: 0; flex: 1;">
|
||||
<template #label>{{ $ts.reporterOrigin }}</template>
|
||||
<option value="combined">{{ $ts.all }}</option>
|
||||
<option value="local">{{ $ts.local }}</option>
|
||||
<option value="remote">{{ $ts.remote }}</option>
|
||||
<template #label>{{ i18n.ts.reporterOrigin }}</template>
|
||||
<option value="combined">{{ i18n.ts.all }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option value="remote">{{ i18n.ts.remote }}</option>
|
||||
</MkSelect>
|
||||
</div>
|
||||
<!-- TODO
|
||||
<div class="inputs" style="display: flex; padding-top: 1.2em;">
|
||||
<MkInput v-model="searchUsername" style="margin: 0; flex: 1;" type="text" :spellcheck="false">
|
||||
<span>{{ $ts.username }}</span>
|
||||
<span>{{ i18n.ts.username }}</span>
|
||||
</MkInput>
|
||||
<MkInput v-model="searchHost" style="margin: 0; flex: 1;" type="text" :spellcheck="false" :disabled="pagination.params().origin === 'local'">
|
||||
<span>{{ $ts.host }}</span>
|
||||
<span>{{ i18n.ts.host }}</span>
|
||||
</MkInput>
|
||||
</div>
|
||||
-->
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<FormSuspense :p="init">
|
||||
<div class="_formRoot">
|
||||
<FormRadios v-model="provider" class="_formBlock">
|
||||
<option :value="null">{{ $ts.none }} ({{ $ts.notRecommended }})</option>
|
||||
<option :value="null">{{ i18n.ts.none }} ({{ i18n.ts.notRecommended }})</option>
|
||||
<option value="hcaptcha">hCaptcha</option>
|
||||
<option value="recaptcha">reCAPTCHA</option>
|
||||
</FormRadios>
|
||||
|
|
@ -11,33 +11,33 @@
|
|||
<template v-if="provider === 'hcaptcha'">
|
||||
<FormInput v-model="hcaptchaSiteKey" class="_formBlock">
|
||||
<template #prefix><i class="fas fa-key"></i></template>
|
||||
<template #label>{{ $ts.hcaptchaSiteKey }}</template>
|
||||
<template #label>{{ i18n.ts.hcaptchaSiteKey }}</template>
|
||||
</FormInput>
|
||||
<FormInput v-model="hcaptchaSecretKey" class="_formBlock">
|
||||
<template #prefix><i class="fas fa-key"></i></template>
|
||||
<template #label>{{ $ts.hcaptchaSecretKey }}</template>
|
||||
<template #label>{{ i18n.ts.hcaptchaSecretKey }}</template>
|
||||
</FormInput>
|
||||
<FormSlot class="_formBlock">
|
||||
<template #label>{{ $ts.preview }}</template>
|
||||
<template #label>{{ i18n.ts.preview }}</template>
|
||||
<MkCaptcha provider="hcaptcha" :sitekey="hcaptchaSiteKey || '10000000-ffff-ffff-ffff-000000000001'"/>
|
||||
</FormSlot>
|
||||
</template>
|
||||
<template v-else-if="provider === 'recaptcha'">
|
||||
<FormInput v-model="recaptchaSiteKey" class="_formBlock">
|
||||
<template #prefix><i class="fas fa-key"></i></template>
|
||||
<template #label>{{ $ts.recaptchaSiteKey }}</template>
|
||||
<template #label>{{ i18n.ts.recaptchaSiteKey }}</template>
|
||||
</FormInput>
|
||||
<FormInput v-model="recaptchaSecretKey" class="_formBlock">
|
||||
<template #prefix><i class="fas fa-key"></i></template>
|
||||
<template #label>{{ $ts.recaptchaSecretKey }}</template>
|
||||
<template #label>{{ i18n.ts.recaptchaSecretKey }}</template>
|
||||
</FormInput>
|
||||
<FormSlot v-if="recaptchaSiteKey" class="_formBlock">
|
||||
<template #label>{{ $ts.preview }}</template>
|
||||
<template #label>{{ i18n.ts.preview }}</template>
|
||||
<MkCaptcha provider="recaptcha" :sitekey="recaptchaSiteKey"/>
|
||||
</FormSlot>
|
||||
</template>
|
||||
|
||||
<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
<FormButton primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
|
||||
</div>
|
||||
</FormSuspense>
|
||||
</div>
|
||||
|
|
@ -52,6 +52,7 @@ import FormSuspense from '@/components/form/suspense.vue';
|
|||
import FormSlot from '@/components/form/slot.vue';
|
||||
import * as os from '@/os';
|
||||
import { fetchInstance } from '@/instance';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const MkCaptcha = defineAsyncComponent(() => import('@/components/captcha.vue'));
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<XModalWindow ref="dialog"
|
||||
<XModalWindow
|
||||
ref="dialog"
|
||||
:width="370"
|
||||
:with-ok-button="true"
|
||||
@close="$refs.dialog.close()"
|
||||
|
|
@ -12,16 +13,16 @@
|
|||
<div class="yigymqpb _section">
|
||||
<img :src="emoji.url" class="img"/>
|
||||
<MkInput v-model="name" class="_formBlock">
|
||||
<template #label>{{ $ts.name }}</template>
|
||||
<template #label>{{ i18n.ts.name }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="category" class="_formBlock" :datalist="categories">
|
||||
<template #label>{{ $ts.category }}</template>
|
||||
<template #label>{{ i18n.ts.category }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="aliases" class="_formBlock">
|
||||
<template #label>{{ $ts.tags }}</template>
|
||||
<template #caption>{{ $ts.setMultipleBySeparatingWithSpace }}</template>
|
||||
<template #label>{{ i18n.ts.tags }}</template>
|
||||
<template #caption>{{ i18n.ts.setMultipleBySeparatingWithSpace }}</template>
|
||||
</MkInput>
|
||||
<MkButton danger @click="del()"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</MkButton>
|
||||
<MkButton danger @click="del()"><i class="fas fa-trash-alt"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</XModalWindow>
|
||||
|
|
@ -70,7 +71,7 @@ async function update() {
|
|||
name,
|
||||
category,
|
||||
aliases: aliases.split(' '),
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
dialog.close();
|
||||
|
|
@ -84,10 +85,10 @@ async function del() {
|
|||
if (canceled) return;
|
||||
|
||||
os.api('admin/emoji/delete', {
|
||||
id: props.emoji.id
|
||||
id: props.emoji.id,
|
||||
}).then(() => {
|
||||
emit('done', {
|
||||
deleted: true
|
||||
deleted: true,
|
||||
});
|
||||
dialog.close();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<div v-if="tab === 'local'" class="local">
|
||||
<MkInput v-model="query" :debounce="true" type="search">
|
||||
<template #prefix><i class="fas fa-search"></i></template>
|
||||
<template #label>{{ $ts.search }}</template>
|
||||
<template #label>{{ i18n.ts.search }}</template>
|
||||
</MkInput>
|
||||
<MkSwitch v-model="selectMode" style="margin: 8px 0;">
|
||||
<template #label>Select mode</template>
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
<MkButton inline danger @click="delBulk">Delete</MkButton>
|
||||
</div>
|
||||
<MkPagination ref="emojisPaginationComponent" :pagination="pagination">
|
||||
<template #empty><span>{{ $ts.noCustomEmojis }}</span></template>
|
||||
<template #empty><span>{{ i18n.ts.noCustomEmojis }}</span></template>
|
||||
<template #default="{items}">
|
||||
<div class="ldhfsamy">
|
||||
<button v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" :class="{ selected: selectedEmojis.includes(emoji.id) }" @click="selectMode ? toggleSelect(emoji) : edit(emoji)">
|
||||
|
|
@ -40,14 +40,14 @@
|
|||
<FormSplit>
|
||||
<MkInput v-model="queryRemote" :debounce="true" type="search">
|
||||
<template #prefix><i class="fas fa-search"></i></template>
|
||||
<template #label>{{ $ts.search }}</template>
|
||||
<template #label>{{ i18n.ts.search }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="host" :debounce="true">
|
||||
<template #label>{{ $ts.host }}</template>
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
</MkInput>
|
||||
</FormSplit>
|
||||
<MkPagination :pagination="remotePagination">
|
||||
<template #empty><span>{{ $ts.noCustomEmojis }}</span></template>
|
||||
<template #empty><span>{{ i18n.ts.noCustomEmojis }}</span></template>
|
||||
<template #default="{items}">
|
||||
<div class="ldhfsamy">
|
||||
<div v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" @click="remoteMenu(emoji, $event)">
|
||||
|
|
|
|||
|
|
@ -7,13 +7,13 @@
|
|||
<div>
|
||||
<div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap;">
|
||||
<MkSelect v-model="origin" style="margin: 0; flex: 1;">
|
||||
<template #label>{{ $ts.instance }}</template>
|
||||
<option value="combined">{{ $ts.all }}</option>
|
||||
<option value="local">{{ $ts.local }}</option>
|
||||
<option value="remote">{{ $ts.remote }}</option>
|
||||
<template #label>{{ i18n.ts.instance }}</template>
|
||||
<option value="combined">{{ i18n.ts.all }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option value="remote">{{ i18n.ts.remote }}</option>
|
||||
</MkSelect>
|
||||
<MkInput v-model="searchHost" :debounce="true" type="search" style="margin: 0; flex: 1;" :disabled="pagination.params.origin === 'local'">
|
||||
<template #label>{{ $ts.host }}</template>
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
</MkInput>
|
||||
</div>
|
||||
<div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap; padding-top: 1.2em;">
|
||||
|
|
|
|||
|
|
@ -1,23 +1,23 @@
|
|||
<template>
|
||||
<div ref="el" class="hiyeyicy" :class="{ wide: !narrow }">
|
||||
<div v-if="!narrow || initialPage == null" class="nav">
|
||||
<div v-if="!narrow || currentPage?.route.name == null" class="nav">
|
||||
<MkSpacer :content-max="700" :margin-min="16">
|
||||
<div class="lxpfedzu">
|
||||
<div class="banner">
|
||||
<img :src="$instance.iconUrl || '/favicon.ico'" alt="" class="icon"/>
|
||||
</div>
|
||||
|
||||
<MkInfo v-if="thereIsUnresolvedAbuseReport" warn class="info">{{ $ts.thereIsUnresolvedAbuseReportWarning }} <MkA to="/admin/abuses" class="_link">{{ $ts.check }}</MkA></MkInfo>
|
||||
<MkInfo v-if="noMaintainerInformation" warn class="info">{{ $ts.noMaintainerInformationWarning }} <MkA to="/admin/settings" class="_link">{{ $ts.configure }}</MkA></MkInfo>
|
||||
<MkInfo v-if="noBotProtection" warn class="info">{{ $ts.noBotProtectionWarning }} <MkA to="/admin/security" class="_link">{{ $ts.configure }}</MkA></MkInfo>
|
||||
<MkInfo v-if="noEmailServer" warn class="info">{{ $ts.noEmailServerWarning }} <MkA to="/admin/email-settings" class="_link">{{ $ts.configure }}</MkA></MkInfo>
|
||||
<MkInfo v-if="thereIsUnresolvedAbuseReport" warn class="info">{{ i18n.ts.thereIsUnresolvedAbuseReportWarning }} <MkA to="/admin/abuses" class="_link">{{ i18n.ts.check }}</MkA></MkInfo>
|
||||
<MkInfo v-if="noMaintainerInformation" warn class="info">{{ i18n.ts.noMaintainerInformationWarning }} <MkA to="/admin/settings" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
|
||||
<MkInfo v-if="noBotProtection" warn class="info">{{ i18n.ts.noBotProtectionWarning }} <MkA to="/admin/security" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
|
||||
<MkInfo v-if="noEmailServer" warn class="info">{{ i18n.ts.noEmailServerWarning }} <MkA to="/admin/email-settings" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
|
||||
|
||||
<MkSuperMenu :def="menuDef" :grid="initialPage == null"></MkSuperMenu>
|
||||
<MkSuperMenu :def="menuDef" :grid="currentPage?.route.name == null"></MkSuperMenu>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</div>
|
||||
<div v-if="!(narrow && initialPage == null)" class="main">
|
||||
<component :is="component" :key="initialPage" v-bind="pageProps"/>
|
||||
<div v-if="!(narrow && currentPage?.route.name == null)" class="main">
|
||||
<RouterView/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -44,15 +44,10 @@ const indexInfo = {
|
|||
hideHeader: true,
|
||||
};
|
||||
|
||||
const props = defineProps<{
|
||||
initialPage?: string,
|
||||
}>();
|
||||
|
||||
provide('shouldOmitHeaderTitle', false);
|
||||
|
||||
let INFO = $ref(indexInfo);
|
||||
let childInfo = $ref(null);
|
||||
let page = $ref(props.initialPage);
|
||||
let narrow = $ref(false);
|
||||
let view = $ref(null);
|
||||
let el = $ref(null);
|
||||
|
|
@ -61,6 +56,7 @@ let noMaintainerInformation = isEmpty(instance.maintainerName) || isEmpty(instan
|
|||
let noBotProtection = !instance.disableRegistration && !instance.enableHcaptcha && !instance.enableRecaptcha;
|
||||
let noEmailServer = !instance.enableEmail;
|
||||
let thereIsUnresolvedAbuseReport = $ref(false);
|
||||
let currentPage = $computed(() => router.currentRef.value.child);
|
||||
|
||||
os.api('admin/abuse-user-reports', {
|
||||
state: 'unresolved',
|
||||
|
|
@ -94,47 +90,47 @@ const menuDef = $computed(() => [{
|
|||
icon: 'fas fa-tachometer-alt',
|
||||
text: i18n.ts.dashboard,
|
||||
to: '/admin/overview',
|
||||
active: props.initialPage === 'overview',
|
||||
active: currentPage?.route.name === 'overview',
|
||||
}, {
|
||||
icon: 'fas fa-users',
|
||||
text: i18n.ts.users,
|
||||
to: '/admin/users',
|
||||
active: props.initialPage === 'users',
|
||||
active: currentPage?.route.name === 'users',
|
||||
}, {
|
||||
icon: 'fas fa-laugh',
|
||||
text: i18n.ts.customEmojis,
|
||||
to: '/admin/emojis',
|
||||
active: props.initialPage === 'emojis',
|
||||
active: currentPage?.route.name === 'emojis',
|
||||
}, {
|
||||
icon: 'fas fa-globe',
|
||||
text: i18n.ts.federation,
|
||||
to: '/about#federation',
|
||||
active: props.initialPage === 'federation',
|
||||
active: currentPage?.route.name === 'federation',
|
||||
}, {
|
||||
icon: 'fas fa-clipboard-list',
|
||||
text: i18n.ts.jobQueue,
|
||||
to: '/admin/queue',
|
||||
active: props.initialPage === 'queue',
|
||||
active: currentPage?.route.name === 'queue',
|
||||
}, {
|
||||
icon: 'fas fa-cloud',
|
||||
text: i18n.ts.files,
|
||||
to: '/admin/files',
|
||||
active: props.initialPage === 'files',
|
||||
active: currentPage?.route.name === 'files',
|
||||
}, {
|
||||
icon: 'fas fa-broadcast-tower',
|
||||
text: i18n.ts.announcements,
|
||||
to: '/admin/announcements',
|
||||
active: props.initialPage === 'announcements',
|
||||
active: currentPage?.route.name === 'announcements',
|
||||
}, {
|
||||
icon: 'fas fa-audio-description',
|
||||
text: i18n.ts.ads,
|
||||
to: '/admin/ads',
|
||||
active: props.initialPage === 'ads',
|
||||
active: currentPage?.route.name === 'ads',
|
||||
}, {
|
||||
icon: 'fas fa-exclamation-circle',
|
||||
text: i18n.ts.abuseReports,
|
||||
to: '/admin/abuses',
|
||||
active: props.initialPage === 'abuses',
|
||||
active: currentPage?.route.name === 'abuses',
|
||||
}],
|
||||
}, {
|
||||
title: i18n.ts.settings,
|
||||
|
|
@ -142,47 +138,47 @@ const menuDef = $computed(() => [{
|
|||
icon: 'fas fa-cog',
|
||||
text: i18n.ts.general,
|
||||
to: '/admin/settings',
|
||||
active: props.initialPage === 'settings',
|
||||
active: currentPage?.route.name === 'settings',
|
||||
}, {
|
||||
icon: 'fas fa-envelope',
|
||||
text: i18n.ts.emailServer,
|
||||
to: '/admin/email-settings',
|
||||
active: props.initialPage === 'email-settings',
|
||||
active: currentPage?.route.name === 'email-settings',
|
||||
}, {
|
||||
icon: 'fas fa-cloud',
|
||||
text: i18n.ts.objectStorage,
|
||||
to: '/admin/object-storage',
|
||||
active: props.initialPage === 'object-storage',
|
||||
active: currentPage?.route.name === 'object-storage',
|
||||
}, {
|
||||
icon: 'fas fa-lock',
|
||||
text: i18n.ts.security,
|
||||
to: '/admin/security',
|
||||
active: props.initialPage === 'security',
|
||||
active: currentPage?.route.name === 'security',
|
||||
}, {
|
||||
icon: 'fas fa-globe',
|
||||
text: i18n.ts.relays,
|
||||
to: '/admin/relays',
|
||||
active: props.initialPage === 'relays',
|
||||
active: currentPage?.route.name === 'relays',
|
||||
}, {
|
||||
icon: 'fas fa-share-alt',
|
||||
text: i18n.ts.integration,
|
||||
to: '/admin/integrations',
|
||||
active: props.initialPage === 'integrations',
|
||||
active: currentPage?.route.name === 'integrations',
|
||||
}, {
|
||||
icon: 'fas fa-ban',
|
||||
text: i18n.ts.instanceBlocking,
|
||||
to: '/admin/instance-block',
|
||||
active: props.initialPage === 'instance-block',
|
||||
active: currentPage?.route.name === 'instance-block',
|
||||
}, {
|
||||
icon: 'fas fa-ghost',
|
||||
text: i18n.ts.proxyAccount,
|
||||
to: '/admin/proxy-account',
|
||||
active: props.initialPage === 'proxy-account',
|
||||
active: currentPage?.route.name === 'proxy-account',
|
||||
}, {
|
||||
icon: 'fas fa-cogs',
|
||||
text: i18n.ts.other,
|
||||
to: '/admin/other-settings',
|
||||
active: props.initialPage === 'other-settings',
|
||||
active: currentPage?.route.name === 'other-settings',
|
||||
}],
|
||||
}, {
|
||||
title: i18n.ts.info,
|
||||
|
|
@ -190,55 +186,12 @@ const menuDef = $computed(() => [{
|
|||
icon: 'fas fa-database',
|
||||
text: i18n.ts.database,
|
||||
to: '/admin/database',
|
||||
active: props.initialPage === 'database',
|
||||
active: currentPage?.route.name === 'database',
|
||||
}],
|
||||
}]);
|
||||
|
||||
const component = $computed(() => {
|
||||
if (props.initialPage == null) return null;
|
||||
switch (props.initialPage) {
|
||||
case 'overview': return defineAsyncComponent(() => import('./overview.vue'));
|
||||
case 'users': return defineAsyncComponent(() => import('./users.vue'));
|
||||
case 'emojis': return defineAsyncComponent(() => import('./emojis.vue'));
|
||||
//case 'federation': return defineAsyncComponent(() => import('../federation.vue'));
|
||||
case 'queue': return defineAsyncComponent(() => import('./queue.vue'));
|
||||
case 'files': return defineAsyncComponent(() => import('./files.vue'));
|
||||
case 'announcements': return defineAsyncComponent(() => import('./announcements.vue'));
|
||||
case 'ads': return defineAsyncComponent(() => import('./ads.vue'));
|
||||
case 'database': return defineAsyncComponent(() => import('./database.vue'));
|
||||
case 'abuses': return defineAsyncComponent(() => import('./abuses.vue'));
|
||||
case 'settings': return defineAsyncComponent(() => import('./settings.vue'));
|
||||
case 'email-settings': return defineAsyncComponent(() => import('./email-settings.vue'));
|
||||
case 'object-storage': return defineAsyncComponent(() => import('./object-storage.vue'));
|
||||
case 'security': return defineAsyncComponent(() => import('./security.vue'));
|
||||
case 'relays': return defineAsyncComponent(() => import('./relays.vue'));
|
||||
case 'integrations': return defineAsyncComponent(() => import('./integrations.vue'));
|
||||
case 'instance-block': return defineAsyncComponent(() => import('./instance-block.vue'));
|
||||
case 'proxy-account': return defineAsyncComponent(() => import('./proxy-account.vue'));
|
||||
case 'other-settings': return defineAsyncComponent(() => import('./other-settings.vue'));
|
||||
}
|
||||
});
|
||||
|
||||
watch(component, () => {
|
||||
pageProps = {};
|
||||
|
||||
nextTick(() => {
|
||||
scroll(el, { top: 0 });
|
||||
});
|
||||
}, { immediate: true });
|
||||
|
||||
watch(() => props.initialPage, () => {
|
||||
if (props.initialPage == null && !narrow) {
|
||||
router.push('/admin/overview');
|
||||
} else {
|
||||
if (props.initialPage == null) {
|
||||
INFO = indexInfo;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
watch(narrow, () => {
|
||||
if (props.initialPage == null && !narrow) {
|
||||
if (currentPage?.route.name == null && !narrow) {
|
||||
router.push('/admin/overview');
|
||||
}
|
||||
});
|
||||
|
|
@ -247,7 +200,7 @@ onMounted(() => {
|
|||
ro.observe(el);
|
||||
|
||||
narrow = el.offsetWidth < NARROW_THRESHOLD;
|
||||
if (props.initialPage == null && !narrow) {
|
||||
if (currentPage?.route.name == null && !narrow) {
|
||||
router.push('/admin/overview');
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<FormSuspense :p="init">
|
||||
<div class="_formRoot">
|
||||
<FormSwitch v-model="enableDiscordIntegration" class="_formBlock">
|
||||
<template #label>{{ $ts.enable }}</template>
|
||||
<template #label>{{ i18n.ts.enable }}</template>
|
||||
</FormSwitch>
|
||||
|
||||
<template v-if="enableDiscordIntegration">
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
</FormInput>
|
||||
</template>
|
||||
|
||||
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
|
||||
</div>
|
||||
</FormSuspense>
|
||||
</template>
|
||||
|
|
@ -33,6 +33,7 @@ import FormInfo from '@/components/ui/info.vue';
|
|||
import FormSuspense from '@/components/form/suspense.vue';
|
||||
import * as os from '@/os';
|
||||
import { fetchInstance } from '@/instance';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
let uri: string = $ref('');
|
||||
let enableDiscordIntegration: boolean = $ref(false);
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<FormSuspense :p="init">
|
||||
<div class="_formRoot">
|
||||
<FormSwitch v-model="enableGithubIntegration" class="_formBlock">
|
||||
<template #label>{{ $ts.enable }}</template>
|
||||
<template #label>{{ i18n.ts.enable }}</template>
|
||||
</FormSwitch>
|
||||
|
||||
<template v-if="enableGithubIntegration">
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
</FormInput>
|
||||
</template>
|
||||
|
||||
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
|
||||
</div>
|
||||
</FormSuspense>
|
||||
</template>
|
||||
|
|
@ -33,6 +33,7 @@ import FormInfo from '@/components/ui/info.vue';
|
|||
import FormSuspense from '@/components/form/suspense.vue';
|
||||
import * as os from '@/os';
|
||||
import { fetchInstance } from '@/instance';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
let uri: string = $ref('');
|
||||
let enableGithubIntegration: boolean = $ref(false);
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<FormSuspense :p="init">
|
||||
<div class="_formRoot">
|
||||
<FormSwitch v-model="enableTwitterIntegration" class="_formBlock">
|
||||
<template #label>{{ $ts.enable }}</template>
|
||||
<template #label>{{ i18n.ts.enable }}</template>
|
||||
</FormSwitch>
|
||||
|
||||
<template v-if="enableTwitterIntegration">
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
</FormInput>
|
||||
</template>
|
||||
|
||||
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
|
||||
</div>
|
||||
</FormSuspense>
|
||||
</template>
|
||||
|
|
@ -33,6 +33,7 @@ import FormInfo from '@/components/ui/info.vue';
|
|||
import FormSuspense from '@/components/form/suspense.vue';
|
||||
import * as os from '@/os';
|
||||
import { fetchInstance } from '@/instance';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
let uri: string = $ref('');
|
||||
let enableTwitterIntegration: boolean = $ref(false);
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
<span style="margin-left: 8px; opacity: 0.7;">({{ number(job[1]) }} jobs)</span>
|
||||
</div>
|
||||
</div>
|
||||
<span v-else style="opacity: 0.5;">{{ $ts.noJobs }}</span>
|
||||
<span v-else style="opacity: 0.5;">{{ i18n.ts.noJobs }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -44,6 +44,7 @@ import XChart from './queue.chart.chart.vue';
|
|||
import number from '@/filters/number';
|
||||
import * as os from '@/os';
|
||||
import { stream } from '@/stream';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const connection = markRaw(stream.useChannel('queueStats'));
|
||||
|
||||
|
|
|
|||
|
|
@ -7,36 +7,36 @@
|
|||
<div class="users">
|
||||
<div class="inputs">
|
||||
<MkSelect v-model="sort" style="flex: 1;">
|
||||
<template #label>{{ $ts.sort }}</template>
|
||||
<option value="-createdAt">{{ $ts.registeredDate }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+createdAt">{{ $ts.registeredDate }} ({{ $ts.descendingOrder }})</option>
|
||||
<option value="-updatedAt">{{ $ts.lastUsed }} ({{ $ts.ascendingOrder }})</option>
|
||||
<option value="+updatedAt">{{ $ts.lastUsed }} ({{ $ts.descendingOrder }})</option>
|
||||
<template #label>{{ i18n.ts.sort }}</template>
|
||||
<option value="-createdAt">{{ i18n.ts.registeredDate }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+createdAt">{{ i18n.ts.registeredDate }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
<option value="-updatedAt">{{ i18n.ts.lastUsed }} ({{ i18n.ts.ascendingOrder }})</option>
|
||||
<option value="+updatedAt">{{ i18n.ts.lastUsed }} ({{ i18n.ts.descendingOrder }})</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="state" style="flex: 1;">
|
||||
<template #label>{{ $ts.state }}</template>
|
||||
<option value="all">{{ $ts.all }}</option>
|
||||
<option value="available">{{ $ts.normal }}</option>
|
||||
<option value="admin">{{ $ts.administrator }}</option>
|
||||
<option value="moderator">{{ $ts.moderator }}</option>
|
||||
<option value="silenced">{{ $ts.silence }}</option>
|
||||
<option value="suspended">{{ $ts.suspend }}</option>
|
||||
<template #label>{{ i18n.ts.state }}</template>
|
||||
<option value="all">{{ i18n.ts.all }}</option>
|
||||
<option value="available">{{ i18n.ts.normal }}</option>
|
||||
<option value="admin">{{ i18n.ts.administrator }}</option>
|
||||
<option value="moderator">{{ i18n.ts.moderator }}</option>
|
||||
<option value="silenced">{{ i18n.ts.silence }}</option>
|
||||
<option value="suspended">{{ i18n.ts.suspend }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="origin" style="flex: 1;">
|
||||
<template #label>{{ $ts.instance }}</template>
|
||||
<option value="combined">{{ $ts.all }}</option>
|
||||
<option value="local">{{ $ts.local }}</option>
|
||||
<option value="remote">{{ $ts.remote }}</option>
|
||||
<template #label>{{ i18n.ts.instance }}</template>
|
||||
<option value="combined">{{ i18n.ts.all }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option value="remote">{{ i18n.ts.remote }}</option>
|
||||
</MkSelect>
|
||||
</div>
|
||||
<div class="inputs">
|
||||
<MkInput v-model="searchUsername" style="flex: 1;" type="text" :spellcheck="false" @update:modelValue="$refs.users.reload()">
|
||||
<template #prefix>@</template>
|
||||
<template #label>{{ $ts.username }}</template>
|
||||
<template #label>{{ i18n.ts.username }}</template>
|
||||
</MkInput>
|
||||
<MkInput v-model="searchHost" style="flex: 1;" type="text" :spellcheck="false" :disabled="pagination.params.origin === 'local'" @update:modelValue="$refs.users.reload()">
|
||||
<template #prefix>@</template>
|
||||
<template #label>{{ $ts.host }}</template>
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
</MkInput>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -4,22 +4,22 @@
|
|||
<MkSpacer :content-max="700">
|
||||
<div class="_formRoot">
|
||||
<MkInput v-model="name" class="_formBlock">
|
||||
<template #label>{{ $ts.name }}</template>
|
||||
<template #label>{{ i18n.ts.name }}</template>
|
||||
</MkInput>
|
||||
|
||||
<MkTextarea v-model="description" class="_formBlock">
|
||||
<template #label>{{ $ts.description }}</template>
|
||||
<template #label>{{ i18n.ts.description }}</template>
|
||||
</MkTextarea>
|
||||
|
||||
<div class="banner">
|
||||
<MkButton v-if="bannerId == null" @click="setBannerImage"><i class="fas fa-plus"></i> {{ $ts._channel.setBanner }}</MkButton>
|
||||
<MkButton v-if="bannerId == null" @click="setBannerImage"><i class="fas fa-plus"></i> {{ i18n.ts._channel.setBanner }}</MkButton>
|
||||
<div v-else-if="bannerUrl">
|
||||
<img :src="bannerUrl" style="width: 100%;"/>
|
||||
<MkButton @click="removeBannerImage()"><i class="fas fa-trash-alt"></i> {{ $ts._channel.removeBanner }}</MkButton>
|
||||
<MkButton @click="removeBannerImage()"><i class="fas fa-trash-alt"></i> {{ i18n.ts._channel.removeBanner }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
<div class="_formBlock">
|
||||
<MkButton primary @click="save()"><i class="fas fa-save"></i> {{ channelId ? $ts.save : $ts.create }}</MkButton>
|
||||
<MkButton primary @click="save()"><i class="fas fa-save"></i> {{ channelId ? i18n.ts.save : i18n.ts.create }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
|
|
|
|||
|
|
@ -13,8 +13,8 @@
|
|||
</div>
|
||||
<div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : null }" class="banner">
|
||||
<div class="status">
|
||||
<div><i class="fas fa-users fa-fw"></i><I18n :src="$ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
|
||||
<div><i class="fas fa-pencil-alt fa-fw"></i><I18n :src="$ts._channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></I18n></div>
|
||||
<div><i class="fas fa-users fa-fw"></i><I18n :src="i18n.ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
|
||||
<div><i class="fas fa-pencil-alt fa-fw"></i><I18n :src="i18n.ts._channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></I18n></div>
|
||||
</div>
|
||||
<div class="fade"></div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,32 +1,32 @@
|
|||
<template>
|
||||
<MkSpacer :content-max="1200">
|
||||
<MkTab v-model="origin" style="margin-bottom: var(--margin);">
|
||||
<option value="local">{{ $ts.local }}</option>
|
||||
<option value="remote">{{ $ts.remote }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option value="remote">{{ i18n.ts.remote }}</option>
|
||||
</MkTab>
|
||||
<div v-if="origin === 'local'">
|
||||
<template v-if="tag == null">
|
||||
<MkFolder class="_gap" persist-key="explore-pinned-users">
|
||||
<template #header><i class="fas fa-bookmark fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.pinnedUsers }}</template>
|
||||
<template #header><i class="fas fa-bookmark fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.pinnedUsers }}</template>
|
||||
<XUserList :pagination="pinnedUsers"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap" persist-key="explore-popular-users">
|
||||
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularUsers }}</template>
|
||||
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
|
||||
<XUserList :pagination="popularUsers"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap" persist-key="explore-recently-updated-users">
|
||||
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyUpdatedUsers }}</template>
|
||||
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
|
||||
<XUserList :pagination="recentlyUpdatedUsers"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap" persist-key="explore-recently-registered-users">
|
||||
<template #header><i class="fas fa-plus fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyRegisteredUsers }}</template>
|
||||
<template #header><i class="fas fa-plus fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyRegisteredUsers }}</template>
|
||||
<XUserList :pagination="recentlyRegisteredUsers"/>
|
||||
</MkFolder>
|
||||
</template>
|
||||
</div>
|
||||
<div v-else>
|
||||
<MkFolder ref="tagsEl" :foldable="true" :expanded="false" class="_gap">
|
||||
<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularTags }}</template>
|
||||
<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularTags }}</template>
|
||||
|
||||
<div class="vxjfqztj">
|
||||
<MkA v-for="tag in tagsLocal" :key="'local:' + tag.tag" :to="`/explore/tags/${tag.tag}`" class="local">{{ tag.tag }}</MkA>
|
||||
|
|
@ -41,15 +41,15 @@
|
|||
|
||||
<template v-if="tag == null">
|
||||
<MkFolder class="_gap">
|
||||
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularUsers }}</template>
|
||||
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
|
||||
<XUserList :pagination="popularUsersF"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap">
|
||||
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyUpdatedUsers }}</template>
|
||||
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
|
||||
<XUserList :pagination="recentlyUpdatedUsersF"/>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap">
|
||||
<template #header><i class="fas fa-rocket fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyDiscoveredUsers }}</template>
|
||||
<template #header><i class="fas fa-rocket fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyDiscoveredUsers }}</template>
|
||||
<XUserList :pagination="recentlyRegisteredUsersF"/>
|
||||
</MkFolder>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -13,12 +13,12 @@
|
|||
<div>
|
||||
<MkInput v-model="searchQuery" :debounce="true" type="search" class="_formBlock">
|
||||
<template #prefix><i class="fas fa-search"></i></template>
|
||||
<template #label>{{ $ts.searchUser }}</template>
|
||||
<template #label>{{ i18n.ts.searchUser }}</template>
|
||||
</MkInput>
|
||||
<MkRadios v-model="searchOrigin" class="_formBlock">
|
||||
<option value="combined">{{ $ts.all }}</option>
|
||||
<option value="local">{{ $ts.local }}</option>
|
||||
<option value="remote">{{ $ts.remote }}</option>
|
||||
<option value="combined">{{ i18n.ts.all }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option value="remote">{{ i18n.ts.remote }}</option>
|
||||
</MkRadios>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noNotes }}</div>
|
||||
<div>{{ i18n.ts.noNotes }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<template #empty>
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/info.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.noFollowRequests }}</div>
|
||||
<div>{{ i18n.ts.noFollowRequests }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #default="{items}">
|
||||
|
|
|
|||
|
|
@ -4,27 +4,27 @@
|
|||
<MkSpacer :content-max="800" :margin-min="16" :margin-max="32">
|
||||
<FormSuspense :p="init">
|
||||
<FormInput v-model="title">
|
||||
<template #label>{{ $ts.title }}</template>
|
||||
<template #label>{{ i18n.ts.title }}</template>
|
||||
</FormInput>
|
||||
|
||||
<FormTextarea v-model="description" :max="500">
|
||||
<template #label>{{ $ts.description }}</template>
|
||||
<template #label>{{ i18n.ts.description }}</template>
|
||||
</FormTextarea>
|
||||
|
||||
<div class="">
|
||||
<div v-for="file in files" :key="file.id" class="wqugxsfx" :style="{ backgroundImage: file ? `url(${ file.thumbnailUrl })` : null }">
|
||||
<div class="name">{{ file.name }}</div>
|
||||
<button v-tooltip="$ts.remove" class="remove _button" @click="remove(file)"><i class="fas fa-times"></i></button>
|
||||
<button v-tooltip="i18n.ts.remove" class="remove _button" @click="remove(file)"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
<FormButton primary @click="selectFile"><i class="fas fa-plus"></i> {{ $ts.attachFile }}</FormButton>
|
||||
<FormButton primary @click="selectFile"><i class="fas fa-plus"></i> {{ i18n.ts.attachFile }}</FormButton>
|
||||
</div>
|
||||
|
||||
<FormSwitch v-model="isSensitive">{{ $ts.markAsSensitive }}</FormSwitch>
|
||||
<FormSwitch v-model="isSensitive">{{ i18n.ts.markAsSensitive }}</FormSwitch>
|
||||
|
||||
<FormButton v-if="postId" primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton>
|
||||
<FormButton v-else primary @click="save"><i class="fas fa-save"></i> {{ $ts.publish }}</FormButton>
|
||||
<FormButton v-if="postId" primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
|
||||
<FormButton v-else primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.publish }}</FormButton>
|
||||
|
||||
<FormButton v-if="postId" danger @click="del"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</FormButton>
|
||||
<FormButton v-if="postId" danger @click="del"><i class="fas fa-trash-alt"></i> {{ i18n.ts.delete }}</FormButton>
|
||||
</FormSuspense>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<div class="_root">
|
||||
<div v-if="tab === 'explore'">
|
||||
<MkFolder class="_gap">
|
||||
<template #header><i class="fas fa-clock"></i>{{ $ts.recentPosts }}</template>
|
||||
<template #header><i class="fas fa-clock"></i>{{ i18n.ts.recentPosts }}</template>
|
||||
<MkPagination v-slot="{items}" :pagination="recentPostsPagination" :disable-auto-load="true">
|
||||
<div class="vfpdbgtk">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
</MkPagination>
|
||||
</MkFolder>
|
||||
<MkFolder class="_gap">
|
||||
<template #header><i class="fas fa-fire-alt"></i>{{ $ts.popularPosts }}</template>
|
||||
<template #header><i class="fas fa-fire-alt"></i>{{ i18n.ts.popularPosts }}</template>
|
||||
<MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true">
|
||||
<div class="vfpdbgtk">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
|
|
@ -29,7 +29,7 @@
|
|||
</MkPagination>
|
||||
</div>
|
||||
<div v-else-if="tab === 'my'">
|
||||
<MkA to="/gallery/new" class="_link" style="margin: 16px;"><i class="fas fa-plus"></i> {{ $ts.postToGallery }}</MkA>
|
||||
<MkA to="/gallery/new" class="_link" style="margin: 16px;"><i class="fas fa-plus"></i> {{ i18n.ts.postToGallery }}</MkA>
|
||||
<MkPagination v-slot="{items}" :pagination="myPostsPagination">
|
||||
<div class="vfpdbgtk">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
|
|
|
|||
|
|
@ -18,13 +18,13 @@
|
|||
</div>
|
||||
<div class="actions">
|
||||
<div class="like">
|
||||
<MkButton v-if="post.isLiked" v-tooltip="$ts._gallery.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
||||
<MkButton v-else v-tooltip="$ts._gallery.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
||||
<MkButton v-if="post.isLiked" v-tooltip="i18n.ts._gallery.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
||||
<MkButton v-else v-tooltip="i18n.ts._gallery.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
|
||||
</div>
|
||||
<div class="other">
|
||||
<button v-if="$i && $i.id === post.user.id" v-tooltip="$ts.edit" v-click-anime class="_button" @click="edit"><i class="fas fa-pencil-alt fa-fw"></i></button>
|
||||
<button v-tooltip="$ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button>
|
||||
<button v-tooltip="$ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button>
|
||||
<button v-if="$i && $i.id === post.user.id" v-tooltip="i18n.ts.edit" v-click-anime class="_button" @click="edit"><i class="fas fa-pencil-alt fa-fw"></i></button>
|
||||
<button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button>
|
||||
<button v-tooltip="i18n.ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user">
|
||||
|
|
@ -38,7 +38,7 @@
|
|||
</div>
|
||||
<MkAd :prefer="['horizontal', 'horizontal-big']"/>
|
||||
<MkContainer :max-height="300" :foldable="true" class="other">
|
||||
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template>
|
||||
<template #header><i class="fas fa-clock"></i> {{ i18n.ts.recentPosts }}</template>
|
||||
<MkPagination v-slot="{items}" :pagination="otherPostsPagination">
|
||||
<div class="sdrarzaf">
|
||||
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
|
||||
|
|
|
|||
|
|
@ -5,51 +5,51 @@
|
|||
<div v-if="tab === 'overview'" class="_formRoot">
|
||||
<div class="fnfelxur">
|
||||
<img :src="instance.iconUrl || instance.faviconUrl" alt="" class="icon"/>
|
||||
<span class="name">{{ instance.name || `(${$ts.unknown})` }}</span>
|
||||
<span class="name">{{ instance.name || `(${i18n.ts.unknown})` }}</span>
|
||||
</div>
|
||||
<MkKeyValue :copy="host" oneline style="margin: 1em 0;">
|
||||
<template #key>Host</template>
|
||||
<template #value><span class="_monospace"><MkLink :url="`https://${host}`">{{ host }}</MkLink></span></template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.software }}</template>
|
||||
<template #value><span class="_monospace">{{ instance.softwareName || `(${$ts.unknown})` }} / {{ instance.softwareVersion || `(${$ts.unknown})` }}</span></template>
|
||||
<template #key>{{ i18n.ts.software }}</template>
|
||||
<template #value><span class="_monospace">{{ instance.softwareName || `(${i18n.ts.unknown})` }} / {{ instance.softwareVersion || `(${i18n.ts.unknown})` }}</span></template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.administrator }}</template>
|
||||
<template #value>{{ instance.maintainerName || `(${$ts.unknown})` }} ({{ instance.maintainerEmail || `(${$ts.unknown})` }})</template>
|
||||
<template #key>{{ i18n.ts.administrator }}</template>
|
||||
<template #value>{{ instance.maintainerName || `(${i18n.ts.unknown})` }} ({{ instance.maintainerEmail || `(${i18n.ts.unknown})` }})</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue>
|
||||
<template #key>{{ $ts.description }}</template>
|
||||
<template #key>{{ i18n.ts.description }}</template>
|
||||
<template #value>{{ instance.description }}</template>
|
||||
</MkKeyValue>
|
||||
|
||||
<FormSection v-if="iAmModerator">
|
||||
<template #label>Moderation</template>
|
||||
<FormSwitch v-model="suspended" class="_formBlock" @update:modelValue="toggleSuspend">{{ $ts.stopActivityDelivery }}</FormSwitch>
|
||||
<FormSwitch v-model="isBlocked" class="_formBlock" @update:modelValue="toggleBlock">{{ $ts.blockThisInstance }}</FormSwitch>
|
||||
<FormSwitch v-model="suspended" class="_formBlock" @update:modelValue="toggleSuspend">{{ i18n.ts.stopActivityDelivery }}</FormSwitch>
|
||||
<FormSwitch v-model="isBlocked" class="_formBlock" @update:modelValue="toggleBlock">{{ i18n.ts.blockThisInstance }}</FormSwitch>
|
||||
<MkButton @click="refreshMetadata"><i class="fas fa-refresh"></i> Refresh metadata</MkButton>
|
||||
</FormSection>
|
||||
|
||||
<FormSection>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.registeredAt }}</template>
|
||||
<template #key>{{ i18n.ts.registeredAt }}</template>
|
||||
<template #value><MkTime mode="detail" :time="instance.caughtAt"/></template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.updatedAt }}</template>
|
||||
<template #key>{{ i18n.ts.updatedAt }}</template>
|
||||
<template #value><MkTime mode="detail" :time="instance.infoUpdatedAt"/></template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.latestRequestSentAt }}</template>
|
||||
<template #key>{{ i18n.ts.latestRequestSentAt }}</template>
|
||||
<template #value><MkTime v-if="instance.latestRequestSentAt" :time="instance.latestRequestSentAt"/><span v-else>N/A</span></template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.latestStatus }}</template>
|
||||
<template #key>{{ i18n.ts.latestStatus }}</template>
|
||||
<template #value>{{ instance.latestStatus ? instance.latestStatus : 'N/A' }}</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue oneline style="margin: 1em 0;">
|
||||
<template #key>{{ $ts.latestRequestReceivedAt }}</template>
|
||||
<template #key>{{ i18n.ts.latestRequestReceivedAt }}</template>
|
||||
<template #value><MkTime v-if="instance.latestRequestReceivedAt" :time="instance.latestRequestReceivedAt"/><span v-else>N/A</span></template>
|
||||
</MkKeyValue>
|
||||
</FormSection>
|
||||
|
|
@ -78,17 +78,17 @@
|
|||
<div class="cmhjzshl">
|
||||
<div class="selects">
|
||||
<MkSelect v-model="chartSrc" style="margin: 0 10px 0 0; flex: 1;">
|
||||
<option value="instance-requests">{{ $ts._instanceCharts.requests }}</option>
|
||||
<option value="instance-users">{{ $ts._instanceCharts.users }}</option>
|
||||
<option value="instance-users-total">{{ $ts._instanceCharts.usersTotal }}</option>
|
||||
<option value="instance-notes">{{ $ts._instanceCharts.notes }}</option>
|
||||
<option value="instance-notes-total">{{ $ts._instanceCharts.notesTotal }}</option>
|
||||
<option value="instance-ff">{{ $ts._instanceCharts.ff }}</option>
|
||||
<option value="instance-ff-total">{{ $ts._instanceCharts.ffTotal }}</option>
|
||||
<option value="instance-drive-usage">{{ $ts._instanceCharts.cacheSize }}</option>
|
||||
<option value="instance-drive-usage-total">{{ $ts._instanceCharts.cacheSizeTotal }}</option>
|
||||
<option value="instance-drive-files">{{ $ts._instanceCharts.files }}</option>
|
||||
<option value="instance-drive-files-total">{{ $ts._instanceCharts.filesTotal }}</option>
|
||||
<option value="instance-requests">{{ i18n.ts._instanceCharts.requests }}</option>
|
||||
<option value="instance-users">{{ i18n.ts._instanceCharts.users }}</option>
|
||||
<option value="instance-users-total">{{ i18n.ts._instanceCharts.usersTotal }}</option>
|
||||
<option value="instance-notes">{{ i18n.ts._instanceCharts.notes }}</option>
|
||||
<option value="instance-notes-total">{{ i18n.ts._instanceCharts.notesTotal }}</option>
|
||||
<option value="instance-ff">{{ i18n.ts._instanceCharts.ff }}</option>
|
||||
<option value="instance-ff-total">{{ i18n.ts._instanceCharts.ffTotal }}</option>
|
||||
<option value="instance-drive-usage">{{ i18n.ts._instanceCharts.cacheSize }}</option>
|
||||
<option value="instance-drive-usage-total">{{ i18n.ts._instanceCharts.cacheSizeTotal }}</option>
|
||||
<option value="instance-drive-files">{{ i18n.ts._instanceCharts.files }}</option>
|
||||
<option value="instance-drive-files-total">{{ i18n.ts._instanceCharts.filesTotal }}</option>
|
||||
</MkSelect>
|
||||
</div>
|
||||
<div class="charts">
|
||||
|
|
|
|||
|
|
@ -292,6 +292,7 @@ definePageMetadata(computed(() => !fetching ? user ? {
|
|||
<style lang="scss" scoped>
|
||||
.mk-messaging-room {
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
|
||||
> .body {
|
||||
.more {
|
||||
|
|
@ -335,10 +336,7 @@ definePageMetadata(computed(() => !fetching ? user ? {
|
|||
z-index: 2;
|
||||
bottom: 0;
|
||||
padding-top: 8px;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
bottom: calc(env(safe-area-inset-bottom, 0px) + 92px);
|
||||
}
|
||||
bottom: calc(env(safe-area-inset-bottom, 0px) + 8px);
|
||||
|
||||
> .new-message {
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -1,301 +1,313 @@
|
|||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader/></template>
|
||||
<div class="mwysmxbg">
|
||||
<div>{{ $ts._mfm.intro }}</div>
|
||||
<MkSpacer :content-max="800">
|
||||
<div class="mwysmxbg">
|
||||
<div>{{ i18n.ts._mfm.intro }}</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.mention }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.mentionDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_mention"/>
|
||||
<MkTextarea v-model="preview_mention"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.hashtag }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.hashtagDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_hashtag"/>
|
||||
<MkTextarea v-model="preview_hashtag"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.url }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.urlDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_url"/>
|
||||
<MkTextarea v-model="preview_url"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.link }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.linkDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_link"/>
|
||||
<MkTextarea v-model="preview_link"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.emoji }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.emojiDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_emoji"/>
|
||||
<MkTextarea v-model="preview_emoji"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.bold }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.boldDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_bold"/>
|
||||
<MkTextarea v-model="preview_bold"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.small }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.smallDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_small"/>
|
||||
<MkTextarea v-model="preview_small"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.quote }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.quoteDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_quote"/>
|
||||
<MkTextarea v-model="preview_quote"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.center }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.centerDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_center"/>
|
||||
<MkTextarea v-model="preview_center"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.inlineCode }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.inlineCodeDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_inlineCode"/>
|
||||
<MkTextarea v-model="preview_inlineCode"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.blockCode }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.blockCodeDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_blockCode"/>
|
||||
<MkTextarea v-model="preview_blockCode"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.inlineMath }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.inlineMathDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_inlineMath"/>
|
||||
<MkTextarea v-model="preview_inlineMath"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- deprecated
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.mention }}</div>
|
||||
<div class="title">{{ i18n.ts._mfm.search }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.mentionDescription }}</p>
|
||||
<p>{{ i18n.ts._mfm.searchDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_mention"/>
|
||||
<MkTextarea v-model="preview_mention"><template #label>MFM</template></MkTextarea>
|
||||
<Mfm :text="preview_search"/>
|
||||
<MkTextarea v-model="preview_search"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.hashtag }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.hashtagDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_hashtag"/>
|
||||
<MkTextarea v-model="preview_hashtag"><template #label>MFM</template></MkTextarea>
|
||||
-->
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.flip }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.flipDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_flip"/>
|
||||
<MkTextarea v-model="preview_flip"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.font }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.fontDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_font"/>
|
||||
<MkTextarea v-model="preview_font"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.x2 }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.x2Description }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_x2"/>
|
||||
<MkTextarea v-model="preview_x2"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.x3 }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.x3Description }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_x3"/>
|
||||
<MkTextarea v-model="preview_x3"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.x4 }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.x4Description }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_x4"/>
|
||||
<MkTextarea v-model="preview_x4"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.blur }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.blurDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_blur"/>
|
||||
<MkTextarea v-model="preview_blur"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.jelly }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.jellyDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_jelly"/>
|
||||
<MkTextarea v-model="preview_jelly"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.tada }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.tadaDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_tada"/>
|
||||
<MkTextarea v-model="preview_tada"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.jump }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.jumpDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_jump"/>
|
||||
<MkTextarea v-model="preview_jump"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.bounce }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.bounceDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_bounce"/>
|
||||
<MkTextarea v-model="preview_bounce"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.spin }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.spinDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_spin"/>
|
||||
<MkTextarea v-model="preview_spin"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.shake }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.shakeDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_shake"/>
|
||||
<MkTextarea v-model="preview_shake"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.twitch }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.twitchDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_twitch"/>
|
||||
<MkTextarea v-model="preview_twitch"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.rainbow }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.rainbowDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_rainbow"/>
|
||||
<MkTextarea v-model="preview_rainbow"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.sparkle }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.sparkleDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_sparkle"/>
|
||||
<MkTextarea v-model="preview_sparkle"><span>MFM</span></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.rotate }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.rotateDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_rotate"/>
|
||||
<MkTextarea v-model="preview_rotate"><span>MFM</span></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ i18n.ts._mfm.plain }}</div>
|
||||
<div class="content">
|
||||
<p>{{ i18n.ts._mfm.plainDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_plain"/>
|
||||
<MkTextarea v-model="preview_plain"><span>MFM</span></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.url }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.urlDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_url"/>
|
||||
<MkTextarea v-model="preview_url"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.link }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.linkDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_link"/>
|
||||
<MkTextarea v-model="preview_link"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.emoji }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.emojiDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_emoji"/>
|
||||
<MkTextarea v-model="preview_emoji"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.bold }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.boldDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_bold"/>
|
||||
<MkTextarea v-model="preview_bold"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.small }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.smallDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_small"/>
|
||||
<MkTextarea v-model="preview_small"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.quote }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.quoteDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_quote"/>
|
||||
<MkTextarea v-model="preview_quote"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.center }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.centerDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_center"/>
|
||||
<MkTextarea v-model="preview_center"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.inlineCode }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.inlineCodeDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_inlineCode"/>
|
||||
<MkTextarea v-model="preview_inlineCode"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.blockCode }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.blockCodeDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_blockCode"/>
|
||||
<MkTextarea v-model="preview_blockCode"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.inlineMath }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.inlineMathDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_inlineMath"/>
|
||||
<MkTextarea v-model="preview_inlineMath"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- deprecated
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.search }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.searchDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_search"/>
|
||||
<MkTextarea v-model="preview_search"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.flip }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.flipDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_flip"/>
|
||||
<MkTextarea v-model="preview_flip"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.font }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.fontDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_font"/>
|
||||
<MkTextarea v-model="preview_font"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.x2 }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.x2Description }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_x2"/>
|
||||
<MkTextarea v-model="preview_x2"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.x3 }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.x3Description }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_x3"/>
|
||||
<MkTextarea v-model="preview_x3"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.x4 }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.x4Description }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_x4"/>
|
||||
<MkTextarea v-model="preview_x4"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.blur }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.blurDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_blur"/>
|
||||
<MkTextarea v-model="preview_blur"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.jelly }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.jellyDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_jelly"/>
|
||||
<MkTextarea v-model="preview_jelly"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.tada }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.tadaDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_tada"/>
|
||||
<MkTextarea v-model="preview_tada"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.jump }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.jumpDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_jump"/>
|
||||
<MkTextarea v-model="preview_jump"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.bounce }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.bounceDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_bounce"/>
|
||||
<MkTextarea v-model="preview_bounce"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.spin }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.spinDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_spin"/>
|
||||
<MkTextarea v-model="preview_spin"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.shake }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.shakeDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_shake"/>
|
||||
<MkTextarea v-model="preview_shake"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.twitch }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.twitchDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_twitch"/>
|
||||
<MkTextarea v-model="preview_twitch"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.rainbow }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.rainbowDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_rainbow"/>
|
||||
<MkTextarea v-model="preview_rainbow"><template #label>MFM</template></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.sparkle }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.sparkleDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_sparkle"/>
|
||||
<MkTextarea v-model="preview_sparkle"><span>MFM</span></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="section _block">
|
||||
<div class="title">{{ $ts._mfm.rotate }}</div>
|
||||
<div class="content">
|
||||
<p>{{ $ts._mfm.rotateDescription }}</p>
|
||||
<div class="preview">
|
||||
<Mfm :text="preview_rotate"/>
|
||||
<MkTextarea v-model="preview_rotate"><span>MFM</span></MkTextarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
|
|
@ -306,35 +318,36 @@ import { definePageMetadata } from '@/scripts/page-metadata';
|
|||
import { i18n } from '@/i18n';
|
||||
import { instance } from '@/instance';
|
||||
|
||||
const preview_mention = '@example';
|
||||
const preview_hashtag = '#test';
|
||||
const preview_url = 'https://example.com';
|
||||
const preview_link = `[${i18n.ts._mfm.dummy}](https://example.com)`;
|
||||
const preview_emoji = instance.emojis.length ? `:${instance.emojis[0].name}:` : ':emojiname:';
|
||||
const preview_bold = `**${i18n.ts._mfm.dummy}**`;
|
||||
const preview_small = `<small>${i18n.ts._mfm.dummy}</small>`;
|
||||
const preview_center = `<center>${i18n.ts._mfm.dummy}</center>`;
|
||||
const preview_inlineCode = '`<: "Hello, world!"`';
|
||||
const preview_blockCode = '```\n~ (#i, 100) {\n\t<: ? ((i % 15) = 0) "FizzBuzz"\n\t\t.? ((i % 3) = 0) "Fizz"\n\t\t.? ((i % 5) = 0) "Buzz"\n\t\t. i\n}\n```';
|
||||
const preview_inlineMath = '\\(x= \\frac{-b\' \\pm \\sqrt{(b\')^2-ac}}{a}\\)';
|
||||
const preview_quote = `> ${i18n.ts._mfm.dummy}`;
|
||||
const preview_search = `${i18n.ts._mfm.dummy} 検索`;
|
||||
const preview_jelly = '$[jelly 🍮] $[jelly.speed=5s 🍮]';
|
||||
const preview_tada = '$[tada 🍮] $[tada.speed=5s 🍮]';
|
||||
const preview_jump = '$[jump 🍮] $[jump.speed=5s 🍮]';
|
||||
const preview_bounce = '$[bounce 🍮] $[bounce.speed=5s 🍮]';
|
||||
const preview_shake = '$[shake 🍮] $[shake.speed=5s 🍮]';
|
||||
const preview_twitch = '$[twitch 🍮] $[twitch.speed=5s 🍮]';
|
||||
const preview_spin = '$[spin 🍮] $[spin.left 🍮] $[spin.alternate 🍮]\n$[spin.x 🍮] $[spin.x,left 🍮] $[spin.x,alternate 🍮]\n$[spin.y 🍮] $[spin.y,left 🍮] $[spin.y,alternate 🍮]\n\n$[spin.speed=5s 🍮]';
|
||||
const preview_flip = `$[flip ${i18n.ts._mfm.dummy}]\n$[flip.v ${i18n.ts._mfm.dummy}]\n$[flip.h,v ${i18n.ts._mfm.dummy}]`;
|
||||
const preview_font = `$[font.serif ${i18n.ts._mfm.dummy}]\n$[font.monospace ${i18n.ts._mfm.dummy}]\n$[font.cursive ${i18n.ts._mfm.dummy}]\n$[font.fantasy ${i18n.ts._mfm.dummy}]`;
|
||||
const preview_x2 = '$[x2 🍮]';
|
||||
const preview_x3 = '$[x3 🍮]';
|
||||
const preview_x4 = '$[x4 🍮]';
|
||||
const preview_blur = `$[blur ${i18n.ts._mfm.dummy}]`;
|
||||
const preview_rainbow = '$[rainbow 🍮] $[rainbow.speed=5s 🍮]';
|
||||
const preview_sparkle = '$[sparkle 🍮]';
|
||||
const preview_rotate = '$[rotate 🍮]';
|
||||
let preview_mention = $ref('@example');
|
||||
let preview_hashtag = $ref('#test');
|
||||
let preview_url = $ref('https://example.com');
|
||||
let preview_link = $ref(`[${i18n.ts._mfm.dummy}](https://example.com)`);
|
||||
let preview_emoji = $ref(instance.emojis.length ? `:${instance.emojis[0].name}:` : ':emojiname:');
|
||||
let preview_bold = $ref(`**${i18n.ts._mfm.dummy}**`);
|
||||
let preview_small = $ref(`<small>${i18n.ts._mfm.dummy}</small>`);
|
||||
let preview_center = $ref(`<center>${i18n.ts._mfm.dummy}</center>`);
|
||||
let preview_inlineCode = $ref('`<: "Hello, world!"`');
|
||||
let preview_blockCode = $ref('```\n~ (#i, 100) {\n\t<: ? ((i % 15) = 0) "FizzBuzz"\n\t\t.? ((i % 3) = 0) "Fizz"\n\t\t.? ((i % 5) = 0) "Buzz"\n\t\t. i\n}\n```');
|
||||
let preview_inlineMath = $ref('\\(x= \\frac{-b\' \\pm \\sqrt{(b\')^2-ac}}{a}\\)');
|
||||
let preview_quote = $ref(`> ${i18n.ts._mfm.dummy}`);
|
||||
let preview_search = $ref(`${i18n.ts._mfm.dummy} 検索`);
|
||||
let preview_jelly = $ref('$[jelly 🍮] $[jelly.speed=5s 🍮]');
|
||||
let preview_tada = $ref('$[tada 🍮] $[tada.speed=5s 🍮]');
|
||||
let preview_jump = $ref('$[jump 🍮] $[jump.speed=5s 🍮]');
|
||||
let preview_bounce = $ref('$[bounce 🍮] $[bounce.speed=5s 🍮]');
|
||||
let preview_shake = $ref('$[shake 🍮] $[shake.speed=5s 🍮]');
|
||||
let preview_twitch = $ref('$[twitch 🍮] $[twitch.speed=5s 🍮]');
|
||||
let preview_spin = $ref('$[spin 🍮] $[spin.left 🍮] $[spin.alternate 🍮]\n$[spin.x 🍮] $[spin.x,left 🍮] $[spin.x,alternate 🍮]\n$[spin.y 🍮] $[spin.y,left 🍮] $[spin.y,alternate 🍮]\n\n$[spin.speed=5s 🍮]');
|
||||
let preview_flip = $ref(`$[flip ${i18n.ts._mfm.dummy}]\n$[flip.v ${i18n.ts._mfm.dummy}]\n$[flip.h,v ${i18n.ts._mfm.dummy}]`);
|
||||
let preview_font = $ref(`$[font.serif ${i18n.ts._mfm.dummy}]\n$[font.monospace ${i18n.ts._mfm.dummy}]\n$[font.cursive ${i18n.ts._mfm.dummy}]\n$[font.fantasy ${i18n.ts._mfm.dummy}]`);
|
||||
let preview_x2 = $ref('$[x2 🍮]');
|
||||
let preview_x3 = $ref('$[x3 🍮]');
|
||||
let preview_x4 = $ref('$[x4 🍮]');
|
||||
let preview_blur = $ref(`$[blur ${i18n.ts._mfm.dummy}]`);
|
||||
let preview_rainbow = $ref('$[rainbow 🍮] $[rainbow.speed=5s 🍮]');
|
||||
let preview_sparkle = $ref('$[sparkle 🍮]');
|
||||
let preview_rotate = $ref('$[rotate 🍮]');
|
||||
let preview_plain = $ref('<plain>**bold** @mention #hashtag `code` $[x2 🍮]</plain>');
|
||||
|
||||
definePageMetadata({
|
||||
title: i18n.ts._mfm.cheatSheet,
|
||||
|
|
|
|||
|
|
@ -1,85 +1,88 @@
|
|||
<template>
|
||||
<div v-if="$i">
|
||||
<div v-if="state == 'waiting'" class="waiting _section">
|
||||
<div class="_content">
|
||||
<MkLoading/>
|
||||
<MkSpacer :content-max="800">
|
||||
<div v-if="$i">
|
||||
<div v-if="state == 'waiting'" class="waiting _section">
|
||||
<div class="_content">
|
||||
<MkLoading/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="state == 'denied'" class="denied _section">
|
||||
<div class="_content">
|
||||
<p>{{ i18n.ts._auth.denied }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="state == 'accepted'" class="accepted _section">
|
||||
<div class="_content">
|
||||
<p v-if="callback">{{ i18n.ts._auth.callback }}<MkEllipsis/></p>
|
||||
<p v-else>{{ i18n.ts._auth.pleaseGoBack }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="_section">
|
||||
<div v-if="name" class="_title">{{ $t('_auth.shareAccess', { name: name }) }}</div>
|
||||
<div v-else class="_title">{{ i18n.ts._auth.shareAccessAsk }}</div>
|
||||
<div class="_content">
|
||||
<p>{{ i18n.ts._auth.permissionAsk }}</p>
|
||||
<ul>
|
||||
<li v-for="p in _permissions" :key="p">{{ $t(`_permissions.${p}`) }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton inline @click="deny">{{ i18n.ts.cancel }}</MkButton>
|
||||
<MkButton inline primary @click="accept">{{ i18n.ts.accept }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="state == 'denied'" class="denied _section">
|
||||
<div class="_content">
|
||||
<p>{{ $ts._auth.denied }}</p>
|
||||
</div>
|
||||
<div v-else class="signin">
|
||||
<MkSignin @login="onLogin"/>
|
||||
</div>
|
||||
<div v-else-if="state == 'accepted'" class="accepted _section">
|
||||
<div class="_content">
|
||||
<p v-if="callback">{{ $ts._auth.callback }}<MkEllipsis/></p>
|
||||
<p v-else>{{ $ts._auth.pleaseGoBack }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="_section">
|
||||
<div v-if="name" class="_title">{{ $t('_auth.shareAccess', { name: name }) }}</div>
|
||||
<div v-else class="_title">{{ $ts._auth.shareAccessAsk }}</div>
|
||||
<div class="_content">
|
||||
<p>{{ $ts._auth.permissionAsk }}</p>
|
||||
<ul>
|
||||
<li v-for="p in permission" :key="p">{{ $t(`_permissions.${p}`) }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="_footer">
|
||||
<MkButton inline @click="deny">{{ $ts.cancel }}</MkButton>
|
||||
<MkButton inline primary @click="accept">{{ $ts.accept }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="signin">
|
||||
<MkSignin @login="onLogin"/>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
<script lang="ts" setup>
|
||||
import { } from 'vue';
|
||||
import MkSignin from '@/components/signin.vue';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import * as os from '@/os';
|
||||
import { login } from '@/account';
|
||||
import { $i, login } from '@/account';
|
||||
import { appendQuery, query } from '@/scripts/url';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
MkSignin,
|
||||
MkButton,
|
||||
},
|
||||
props: ['session', 'callback', 'name', 'icon', 'permission'],
|
||||
data() {
|
||||
return {
|
||||
state: null,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async accept() {
|
||||
this.state = 'waiting';
|
||||
await os.api('miauth/gen-token', {
|
||||
session: this.session,
|
||||
name: this.name,
|
||||
iconUrl: this.icon,
|
||||
permission: this.permission,
|
||||
});
|
||||
const props = defineProps<{
|
||||
session: string;
|
||||
callback?: string;
|
||||
name: string;
|
||||
icon: string;
|
||||
permission: string; // コンマ区切り
|
||||
}>();
|
||||
|
||||
this.state = 'accepted';
|
||||
if (this.callback) {
|
||||
location.href = appendQuery(this.callback, query({
|
||||
session: this.session,
|
||||
}));
|
||||
}
|
||||
},
|
||||
deny() {
|
||||
this.state = 'denied';
|
||||
},
|
||||
onLogin(res) {
|
||||
login(res.i);
|
||||
},
|
||||
},
|
||||
});
|
||||
const _permissions = props.permission.split(',');
|
||||
|
||||
let state = $ref<string | null>(null);
|
||||
|
||||
async function accept(): Promise<void> {
|
||||
state = 'waiting';
|
||||
await os.api('miauth/gen-token', {
|
||||
session: props.session,
|
||||
name: props.name,
|
||||
iconUrl: props.icon,
|
||||
permission: _permissions,
|
||||
});
|
||||
|
||||
state = 'accepted';
|
||||
if (props.callback) {
|
||||
location.href = appendQuery(props.callback, query({
|
||||
session: props.session,
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
||||
function deny(): void {
|
||||
state = 'denied';
|
||||
}
|
||||
|
||||
function onLogin(res): void {
|
||||
login(res.i);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -2,44 +2,44 @@
|
|||
<div class="shaynizk">
|
||||
<div class="form">
|
||||
<MkInput v-model="name" class="_formBlock">
|
||||
<template #label>{{ $ts.name }}</template>
|
||||
<template #label>{{ i18n.ts.name }}</template>
|
||||
</MkInput>
|
||||
<MkSelect v-model="src" class="_formBlock">
|
||||
<template #label>{{ $ts.antennaSource }}</template>
|
||||
<option value="all">{{ $ts._antennaSources.all }}</option>
|
||||
<!--<option value="home">{{ $ts._antennaSources.homeTimeline }}</option>-->
|
||||
<option value="users">{{ $ts._antennaSources.users }}</option>
|
||||
<!--<option value="list">{{ $ts._antennaSources.userList }}</option>-->
|
||||
<!--<option value="group">{{ $ts._antennaSources.userGroup }}</option>-->
|
||||
<template #label>{{ i18n.ts.antennaSource }}</template>
|
||||
<option value="all">{{ i18n.ts._antennaSources.all }}</option>
|
||||
<!--<option value="home">{{ i18n.ts._antennaSources.homeTimeline }}</option>-->
|
||||
<option value="users">{{ i18n.ts._antennaSources.users }}</option>
|
||||
<!--<option value="list">{{ i18n.ts._antennaSources.userList }}</option>-->
|
||||
<!--<option value="group">{{ i18n.ts._antennaSources.userGroup }}</option>-->
|
||||
</MkSelect>
|
||||
<MkSelect v-if="src === 'list'" v-model="userListId" class="_formBlock">
|
||||
<template #label>{{ $ts.userList }}</template>
|
||||
<template #label>{{ i18n.ts.userList }}</template>
|
||||
<option v-for="list in userLists" :key="list.id" :value="list.id">{{ list.name }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-else-if="src === 'group'" v-model="userGroupId" class="_formBlock">
|
||||
<template #label>{{ $ts.userGroup }}</template>
|
||||
<template #label>{{ i18n.ts.userGroup }}</template>
|
||||
<option v-for="group in userGroups" :key="group.id" :value="group.id">{{ group.name }}</option>
|
||||
</MkSelect>
|
||||
<MkTextarea v-else-if="src === 'users'" v-model="users" class="_formBlock">
|
||||
<template #label>{{ $ts.users }}</template>
|
||||
<template #caption>{{ $ts.antennaUsersDescription }} <button class="_textButton" @click="addUser">{{ $ts.addUser }}</button></template>
|
||||
<template #label>{{ i18n.ts.users }}</template>
|
||||
<template #caption>{{ i18n.ts.antennaUsersDescription }} <button class="_textButton" @click="addUser">{{ i18n.ts.addUser }}</button></template>
|
||||
</MkTextarea>
|
||||
<MkSwitch v-model="withReplies" class="_formBlock">{{ $ts.withReplies }}</MkSwitch>
|
||||
<MkSwitch v-model="withReplies" class="_formBlock">{{ i18n.ts.withReplies }}</MkSwitch>
|
||||
<MkTextarea v-model="keywords" class="_formBlock">
|
||||
<template #label>{{ $ts.antennaKeywords }}</template>
|
||||
<template #caption>{{ $ts.antennaKeywordsDescription }}</template>
|
||||
<template #label>{{ i18n.ts.antennaKeywords }}</template>
|
||||
<template #caption>{{ i18n.ts.antennaKeywordsDescription }}</template>
|
||||
</MkTextarea>
|
||||
<MkTextarea v-model="excludeKeywords" class="_formBlock">
|
||||
<template #label>{{ $ts.antennaExcludeKeywords }}</template>
|
||||
<template #caption>{{ $ts.antennaKeywordsDescription }}</template>
|
||||
<template #label>{{ i18n.ts.antennaExcludeKeywords }}</template>
|
||||
<template #caption>{{ i18n.ts.antennaKeywordsDescription }}</template>
|
||||
</MkTextarea>
|
||||
<MkSwitch v-model="caseSensitive" class="_formBlock">{{ $ts.caseSensitive }}</MkSwitch>
|
||||
<MkSwitch v-model="withFile" class="_formBlock">{{ $ts.withFileAntenna }}</MkSwitch>
|
||||
<MkSwitch v-model="notify" class="_formBlock">{{ $ts.notifyAntenna }}</MkSwitch>
|
||||
<MkSwitch v-model="caseSensitive" class="_formBlock">{{ i18n.ts.caseSensitive }}</MkSwitch>
|
||||
<MkSwitch v-model="withFile" class="_formBlock">{{ i18n.ts.withFileAntenna }}</MkSwitch>
|
||||
<MkSwitch v-model="notify" class="_formBlock">{{ i18n.ts.notifyAntenna }}</MkSwitch>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<MkButton inline primary @click="saveAntenna()"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton v-if="antenna.id != null" inline danger @click="deleteAntenna()"><i class="fas fa-trash"></i> {{ $ts.delete }}</MkButton>
|
||||
<MkButton inline primary @click="saveAntenna()"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton v-if="antenna.id != null" inline danger @click="deleteAntenna()"><i class="fas fa-trash"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,17 +1,19 @@
|
|||
<template><MkStickyContainer>
|
||||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="qtcaoidl">
|
||||
<MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="qtcaoidl">
|
||||
<MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ i18n.ts.add }}</MkButton>
|
||||
|
||||
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="list">
|
||||
<MkA v-for="item in items" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap">
|
||||
<b>{{ item.name }}</b>
|
||||
<div v-if="item.description" class="description">{{ item.description }}</div>
|
||||
</MkA>
|
||||
</MkPagination>
|
||||
</div>
|
||||
</MkSpacer></MkStickyContainer>
|
||||
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="list">
|
||||
<MkA v-for="item in items" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap">
|
||||
<b>{{ item.name }}</b>
|
||||
<div v-if="item.description" class="description">{{ item.description }}</div>
|
||||
</MkA>
|
||||
</MkPagination>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
|
|||
|
|
@ -1,17 +1,19 @@
|
|||
<template><MkStickyContainer>
|
||||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="qkcjvfiv">
|
||||
<MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ $ts.createList }}</MkButton>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="qkcjvfiv">
|
||||
<MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ i18n.ts.createList }}</MkButton>
|
||||
|
||||
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="lists _content">
|
||||
<MkA v-for="list in items" :key="list.id" class="list _panel" :to="`/my/lists/${ list.id }`">
|
||||
<div class="name">{{ list.name }}</div>
|
||||
<MkAvatars :user-ids="list.userIds"/>
|
||||
</MkA>
|
||||
</MkPagination>
|
||||
</div>
|
||||
</MkSpacer></MkStickyContainer>
|
||||
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="lists _content">
|
||||
<MkA v-for="list in items" :key="list.id" class="list _panel" :to="`/my/lists/${ list.id }`">
|
||||
<div class="name">{{ list.name }}</div>
|
||||
<MkAvatars :user-ids="list.userIds"/>
|
||||
</MkA>
|
||||
</MkPagination>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
|
|||
|
|
@ -1,42 +1,44 @@
|
|||
<template><MkStickyContainer>
|
||||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="mk-list-page">
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||
<div v-if="list" class="_section">
|
||||
<div class="_content">
|
||||
<MkButton inline @click="addUser()">{{ $ts.addUser }}</MkButton>
|
||||
<MkButton inline @click="renameList()">{{ $ts.rename }}</MkButton>
|
||||
<MkButton inline @click="deleteList()">{{ $ts.delete }}</MkButton>
|
||||
<MkSpacer :content-max="700">
|
||||
<div class="mk-list-page">
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||
<div v-if="list" class="_section">
|
||||
<div class="_content">
|
||||
<MkButton inline @click="addUser()">{{ i18n.ts.addUser }}</MkButton>
|
||||
<MkButton inline @click="renameList()">{{ i18n.ts.rename }}</MkButton>
|
||||
<MkButton inline @click="deleteList()">{{ i18n.ts.delete }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</transition>
|
||||
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||
<div v-if="list" class="_section members _gap">
|
||||
<div class="_title">{{ $ts.members }}</div>
|
||||
<div class="_content">
|
||||
<div class="users">
|
||||
<div v-for="user in users" :key="user.id" class="user _panel">
|
||||
<MkAvatar :user="user" class="avatar" :show-indicator="true"/>
|
||||
<div class="body">
|
||||
<MkUserName :user="user" class="name"/>
|
||||
<MkAcct :user="user" class="acct"/>
|
||||
</div>
|
||||
<div class="action">
|
||||
<button class="_button" @click="removeUser(user)"><i class="fas fa-times"></i></button>
|
||||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||
<div v-if="list" class="_section members _gap">
|
||||
<div class="_title">{{ i18n.ts.members }}</div>
|
||||
<div class="_content">
|
||||
<div class="users">
|
||||
<div v-for="user in users" :key="user.id" class="user _panel">
|
||||
<MkAvatar :user="user" class="avatar" :show-indicator="true"/>
|
||||
<div class="body">
|
||||
<MkUserName :user="user" class="name"/>
|
||||
<MkAcct :user="user" class="acct"/>
|
||||
</div>
|
||||
<div class="action">
|
||||
<button class="_button" @click="removeUser(user)"><i class="fas fa-times"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</MkSpacer></MkStickyContainer>
|
||||
</transition>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, defineComponent, watch } from 'vue';
|
||||
import { computed, watch } from 'vue';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import * as os from '@/os';
|
||||
import { mainRouter } from '@/router';
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="ipledcug">
|
||||
<div class="_fullinfo">
|
||||
<img src="https://xn--931a.moe/assets/not-found.jpg" class="_ghost"/>
|
||||
<div>{{ $ts.notFoundDescription }}</div>
|
||||
<div>{{ i18n.ts.notFoundDescription }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
<XNoteDetailed :key="note.id" v-model:note="note" class="note"/>
|
||||
</div>
|
||||
<div v-if="clips && clips.length > 0" class="_content clips _gap">
|
||||
<div class="title">{{ $ts.clip }}</div>
|
||||
<div class="title">{{ i18n.ts.clip }}</div>
|
||||
<MkA v-for="item in clips" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap">
|
||||
<b>{{ item.name }}</b>
|
||||
<div v-if="item.description" class="description">{{ item.description }}</div>
|
||||
|
|
|
|||
|
|
@ -18,12 +18,12 @@
|
|||
</div>
|
||||
<div class="actions">
|
||||
<div class="like">
|
||||
<MkButton v-if="page.isLiked" v-tooltip="$ts._pages.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
||||
<MkButton v-else v-tooltip="$ts._pages.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
||||
<MkButton v-if="page.isLiked" v-tooltip="i18n.ts._pages.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
||||
<MkButton v-else v-tooltip="i18n.ts._pages.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
|
||||
</div>
|
||||
<div class="other">
|
||||
<button v-tooltip="$ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button>
|
||||
<button v-tooltip="$ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button>
|
||||
<button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button>
|
||||
<button v-tooltip="i18n.ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user">
|
||||
|
|
@ -35,21 +35,21 @@
|
|||
<MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/>
|
||||
</div>
|
||||
<div class="links">
|
||||
<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ $ts._pages.viewSource }}</MkA>
|
||||
<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ i18n.ts._pages.viewSource }}</MkA>
|
||||
<template v-if="$i && $i.id === page.userId">
|
||||
<MkA :to="`/pages/edit/${page.id}`" class="link">{{ $ts._pages.editThisPage }}</MkA>
|
||||
<button v-if="$i.pinnedPageId === page.id" class="link _textButton" @click="pin(false)">{{ $ts.unpin }}</button>
|
||||
<button v-else class="link _textButton" @click="pin(true)">{{ $ts.pin }}</button>
|
||||
<MkA :to="`/pages/edit/${page.id}`" class="link">{{ i18n.ts._pages.editThisPage }}</MkA>
|
||||
<button v-if="$i.pinnedPageId === page.id" class="link _textButton" @click="pin(false)">{{ i18n.ts.unpin }}</button>
|
||||
<button v-else class="link _textButton" @click="pin(true)">{{ i18n.ts.pin }}</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
|
||||
<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
|
||||
<div><i class="far fa-clock"></i> {{ i18n.ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
|
||||
<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ i18n.ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
|
||||
</div>
|
||||
<MkAd :prefer="['horizontal', 'horizontal-big']"/>
|
||||
<MkContainer :max-height="300" :foldable="true" class="other">
|
||||
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template>
|
||||
<template #header><i class="fas fa-clock"></i> {{ i18n.ts.recentPosts }}</template>
|
||||
<MkPagination v-slot="{items}" :pagination="otherPostsPagination">
|
||||
<MkPagePreview v-for="page in items" :key="page.id" :page="page" class="_gap"/>
|
||||
</MkPagination>
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
<MkSpacer :content-max="600" :margin-min="16">
|
||||
<FormSplit>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts._registry.domain }}</template>
|
||||
<template #value>{{ $ts.system }}</template>
|
||||
<template #key>{{ i18n.ts._registry.domain }}</template>
|
||||
<template #value>{{ i18n.ts.system }}</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts._registry.scope }}</template>
|
||||
<template #key>{{ i18n.ts._registry.scope }}</template>
|
||||
<template #value>{{ scope.join('/') }}</template>
|
||||
</MkKeyValue>
|
||||
</FormSplit>
|
||||
|
|
|
|||
|
|
@ -2,36 +2,36 @@
|
|||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="600" :margin-min="16">
|
||||
<FormInfo warn>{{ $ts.editTheseSettingsMayBreakAccount }}</FormInfo>
|
||||
<FormInfo warn>{{ i18n.ts.editTheseSettingsMayBreakAccount }}</FormInfo>
|
||||
|
||||
<template v-if="value">
|
||||
<FormSplit>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts._registry.domain }}</template>
|
||||
<template #value>{{ $ts.system }}</template>
|
||||
<template #key>{{ i18n.ts._registry.domain }}</template>
|
||||
<template #value>{{ i18n.ts.system }}</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts._registry.scope }}</template>
|
||||
<template #key>{{ i18n.ts._registry.scope }}</template>
|
||||
<template #value>{{ scope.join('/') }}</template>
|
||||
</MkKeyValue>
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts._registry.key }}</template>
|
||||
<template #key>{{ i18n.ts._registry.key }}</template>
|
||||
<template #value>{{ key }}</template>
|
||||
</MkKeyValue>
|
||||
</FormSplit>
|
||||
|
||||
<FormTextarea v-model="valueForEditor" tall class="_formBlock _monospace">
|
||||
<template #label>{{ $ts.value }} (JSON)</template>
|
||||
<template #label>{{ i18n.ts.value }} (JSON)</template>
|
||||
</FormTextarea>
|
||||
|
||||
<MkButton class="_formBlock" primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton>
|
||||
<MkButton class="_formBlock" primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
|
||||
|
||||
<MkKeyValue class="_formBlock">
|
||||
<template #key>{{ $ts.updatedAt }}</template>
|
||||
<template #key>{{ i18n.ts.updatedAt }}</template>
|
||||
<template #value><MkTime :time="value.updatedAt" mode="detail"/></template>
|
||||
</MkKeyValue>
|
||||
|
||||
<MkButton danger @click="del"><i class="fas fa-trash"></i> {{ $ts.delete }}</MkButton>
|
||||
<MkButton danger @click="del"><i class="fas fa-trash"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
</template>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
|
|
|
|||
|
|
@ -1,39 +1,39 @@
|
|||
<template>
|
||||
<div class="_formRoot">
|
||||
<FormSection>
|
||||
<template #label>{{ $ts.emailAddress }}</template>
|
||||
<template #label>{{ i18n.ts.emailAddress }}</template>
|
||||
<FormInput v-model="emailAddress" type="email" manual-save>
|
||||
<template #prefix><i class="fas fa-envelope"></i></template>
|
||||
<template v-if="$i.email && !$i.emailVerified" #caption>{{ $ts.verificationEmailSent }}</template>
|
||||
<template v-else-if="emailAddress === $i.email && $i.emailVerified" #caption><i class="fas fa-check" style="color: var(--success);"></i> {{ $ts.emailVerified }}</template>
|
||||
<template v-if="$i.email && !$i.emailVerified" #caption>{{ i18n.ts.verificationEmailSent }}</template>
|
||||
<template v-else-if="emailAddress === $i.email && $i.emailVerified" #caption><i class="fas fa-check" style="color: var(--success);"></i> {{ i18n.ts.emailVerified }}</template>
|
||||
</FormInput>
|
||||
</FormSection>
|
||||
|
||||
<FormSection>
|
||||
<FormSwitch :value="$i.receiveAnnouncementEmail" @update:modelValue="onChangeReceiveAnnouncementEmail">
|
||||
{{ $ts.receiveAnnouncementFromInstance }}
|
||||
<FormSwitch :model-value="$i.receiveAnnouncementEmail" @update:modelValue="onChangeReceiveAnnouncementEmail">
|
||||
{{ i18n.ts.receiveAnnouncementFromInstance }}
|
||||
</FormSwitch>
|
||||
</FormSection>
|
||||
|
||||
<FormSection>
|
||||
<template #label>{{ $ts.emailNotification }}</template>
|
||||
<template #label>{{ i18n.ts.emailNotification }}</template>
|
||||
<FormSwitch v-model="emailNotification_mention" class="_formBlock">
|
||||
{{ $ts._notification._types.mention }}
|
||||
{{ i18n.ts._notification._types.mention }}
|
||||
</FormSwitch>
|
||||
<FormSwitch v-model="emailNotification_reply" class="_formBlock">
|
||||
{{ $ts._notification._types.reply }}
|
||||
{{ i18n.ts._notification._types.reply }}
|
||||
</FormSwitch>
|
||||
<FormSwitch v-model="emailNotification_quote" class="_formBlock">
|
||||
{{ $ts._notification._types.quote }}
|
||||
{{ i18n.ts._notification._types.quote }}
|
||||
</FormSwitch>
|
||||
<FormSwitch v-model="emailNotification_follow" class="_formBlock">
|
||||
{{ $ts._notification._types.follow }}
|
||||
{{ i18n.ts._notification._types.follow }}
|
||||
</FormSwitch>
|
||||
<FormSwitch v-model="emailNotification_receiveFollowRequest" class="_formBlock">
|
||||
{{ $ts._notification._types.receiveFollowRequest }}
|
||||
{{ i18n.ts._notification._types.receiveFollowRequest }}
|
||||
</FormSwitch>
|
||||
<FormSwitch v-model="emailNotification_groupInvited" class="_formBlock">
|
||||
{{ $ts._notification._types.groupInvited }}
|
||||
{{ i18n.ts._notification._types.groupInvited }}
|
||||
</FormSwitch>
|
||||
</FormSection>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,69 +1,69 @@
|
|||
<template>
|
||||
<div class="_formRoot">
|
||||
<FormSection>
|
||||
<template #label>{{ $ts._exportOrImport.allNotes }}</template>
|
||||
<template #label>{{ i18n.ts._exportOrImport.allNotes }}</template>
|
||||
<FormFolder>
|
||||
<template #label>{{ $ts.export }}</template>
|
||||
<template #label>{{ i18n.ts.export }}</template>
|
||||
<template #icon><i class="fas fa-download"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="exportNotes()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="exportNotes()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
|
||||
</FormFolder>
|
||||
</FormSection>
|
||||
<FormSection>
|
||||
<template #label>{{ $ts._exportOrImport.followingList }}</template>
|
||||
<template #label>{{ i18n.ts._exportOrImport.followingList }}</template>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.export }}</template>
|
||||
<template #label>{{ i18n.ts.export }}</template>
|
||||
<template #icon><i class="fas fa-download"></i></template>
|
||||
<FormSwitch v-model="excludeMutingUsers" class="_formBlock">
|
||||
{{ $ts._exportOrImport.excludeMutingUsers }}
|
||||
{{ i18n.ts._exportOrImport.excludeMutingUsers }}
|
||||
</FormSwitch>
|
||||
<FormSwitch v-model="excludeInactiveUsers" class="_formBlock">
|
||||
{{ $ts._exportOrImport.excludeInactiveUsers }}
|
||||
{{ i18n.ts._exportOrImport.excludeInactiveUsers }}
|
||||
</FormSwitch>
|
||||
<MkButton primary :class="$style.button" inline @click="exportFollowing()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="exportFollowing()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
|
||||
</FormFolder>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.import }}</template>
|
||||
<template #label>{{ i18n.ts.import }}</template>
|
||||
<template #icon><i class="fas fa-upload"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="importFollowing($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="importFollowing($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
|
||||
</FormFolder>
|
||||
</FormSection>
|
||||
<FormSection>
|
||||
<template #label>{{ $ts._exportOrImport.userLists }}</template>
|
||||
<template #label>{{ i18n.ts._exportOrImport.userLists }}</template>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.export }}</template>
|
||||
<template #label>{{ i18n.ts.export }}</template>
|
||||
<template #icon><i class="fas fa-download"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="exportUserLists()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="exportUserLists()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
|
||||
</FormFolder>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.import }}</template>
|
||||
<template #label>{{ i18n.ts.import }}</template>
|
||||
<template #icon><i class="fas fa-upload"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="importUserLists($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="importUserLists($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
|
||||
</FormFolder>
|
||||
</FormSection>
|
||||
<FormSection>
|
||||
<template #label>{{ $ts._exportOrImport.muteList }}</template>
|
||||
<template #label>{{ i18n.ts._exportOrImport.muteList }}</template>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.export }}</template>
|
||||
<template #label>{{ i18n.ts.export }}</template>
|
||||
<template #icon><i class="fas fa-download"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="exportMuting()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="exportMuting()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
|
||||
</FormFolder>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.import }}</template>
|
||||
<template #label>{{ i18n.ts.import }}</template>
|
||||
<template #icon><i class="fas fa-upload"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="importMuting($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="importMuting($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
|
||||
</FormFolder>
|
||||
</FormSection>
|
||||
<FormSection>
|
||||
<template #label>{{ $ts._exportOrImport.blockingList }}</template>
|
||||
<template #label>{{ i18n.ts._exportOrImport.blockingList }}</template>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.export }}</template>
|
||||
<template #label>{{ i18n.ts.export }}</template>
|
||||
<template #icon><i class="fas fa-download"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="exportBlocking()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="exportBlocking()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
|
||||
</FormFolder>
|
||||
<FormFolder class="_formBlock">
|
||||
<template #label>{{ $ts.import }}</template>
|
||||
<template #label>{{ i18n.ts.import }}</template>
|
||||
<template #icon><i class="fas fa-upload"></i></template>
|
||||
<MkButton primary :class="$style.button" inline @click="importBlocking($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton>
|
||||
<MkButton primary :class="$style.button" inline @click="importBlocking($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
|
||||
</FormFolder>
|
||||
</FormSection>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,15 +4,15 @@
|
|||
<MkSpacer :content-max="900" :margin-min="20" :margin-max="32">
|
||||
<div ref="el" class="vvcocwet" :class="{ wide: !narrow }">
|
||||
<div class="body">
|
||||
<div v-if="!narrow || initialPage == null" class="nav">
|
||||
<div v-if="!narrow || currentPage?.route.name == null" class="nav">
|
||||
<div class="baaadecd">
|
||||
<MkInfo v-if="emailNotConfigured" warn class="info">{{ $ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ $ts.configure }}</MkA></MkInfo>
|
||||
<MkSuperMenu :def="menuDef" :grid="initialPage == null"></MkSuperMenu>
|
||||
<MkInfo v-if="emailNotConfigured" warn class="info">{{ i18n.ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
|
||||
<MkSuperMenu :def="menuDef" :grid="currentPage?.route.name == null"></MkSuperMenu>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="!(narrow && initialPage == null)" class="main">
|
||||
<div v-if="!(narrow && currentPage?.route.name == null)" class="main">
|
||||
<div class="bkzroven">
|
||||
<component :is="component" :key="initialPage" v-bind="pageProps"/>
|
||||
<RouterView/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, defineAsyncComponent, inject, nextTick, onMounted, onUnmounted, provide, ref, watch } from 'vue';
|
||||
import { computed, defineAsyncComponent, inject, nextTick, onActivated, onMounted, onUnmounted, provide, ref, watch } from 'vue';
|
||||
import { i18n } from '@/i18n';
|
||||
import MkInfo from '@/components/ui/info.vue';
|
||||
import MkSuperMenu from '@/components/ui/super-menu.vue';
|
||||
|
|
@ -34,11 +34,6 @@ import { useRouter } from '@/router';
|
|||
import { definePageMetadata, provideMetadataReceiver, setPageMetadata } from '@/scripts/page-metadata';
|
||||
import * as os from '@/os';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
initialPage?: string;
|
||||
}>(), {
|
||||
});
|
||||
|
||||
const indexInfo = {
|
||||
title: i18n.ts.settings,
|
||||
icon: 'fas fa-cog',
|
||||
|
|
@ -50,12 +45,14 @@ const childInfo = ref(null);
|
|||
|
||||
const router = useRouter();
|
||||
|
||||
const narrow = ref(false);
|
||||
let narrow = $ref(false);
|
||||
const NARROW_THRESHOLD = 600;
|
||||
|
||||
let currentPage = $computed(() => router.currentRef.value.child);
|
||||
|
||||
const ro = new ResizeObserver((entries, observer) => {
|
||||
if (entries.length === 0) return;
|
||||
narrow.value = entries[0].borderBoxSize[0].inlineSize < NARROW_THRESHOLD;
|
||||
narrow = entries[0].borderBoxSize[0].inlineSize < NARROW_THRESHOLD;
|
||||
});
|
||||
|
||||
const menuDef = computed(() => [{
|
||||
|
|
@ -64,42 +61,42 @@ const menuDef = computed(() => [{
|
|||
icon: 'fas fa-user',
|
||||
text: i18n.ts.profile,
|
||||
to: '/settings/profile',
|
||||
active: props.initialPage === 'profile',
|
||||
active: currentPage?.route.name === 'profile',
|
||||
}, {
|
||||
icon: 'fas fa-lock-open',
|
||||
text: i18n.ts.privacy,
|
||||
to: '/settings/privacy',
|
||||
active: props.initialPage === 'privacy',
|
||||
active: currentPage?.route.name === 'privacy',
|
||||
}, {
|
||||
icon: 'fas fa-laugh',
|
||||
text: i18n.ts.reaction,
|
||||
to: '/settings/reaction',
|
||||
active: props.initialPage === 'reaction',
|
||||
active: currentPage?.route.name === 'reaction',
|
||||
}, {
|
||||
icon: 'fas fa-cloud',
|
||||
text: i18n.ts.drive,
|
||||
to: '/settings/drive',
|
||||
active: props.initialPage === 'drive',
|
||||
active: currentPage?.route.name === 'drive',
|
||||
}, {
|
||||
icon: 'fas fa-bell',
|
||||
text: i18n.ts.notifications,
|
||||
to: '/settings/notifications',
|
||||
active: props.initialPage === 'notifications',
|
||||
active: currentPage?.route.name === 'notifications',
|
||||
}, {
|
||||
icon: 'fas fa-envelope',
|
||||
text: i18n.ts.email,
|
||||
to: '/settings/email',
|
||||
active: props.initialPage === 'email',
|
||||
active: currentPage?.route.name === 'email',
|
||||
}, {
|
||||
icon: 'fas fa-share-alt',
|
||||
text: i18n.ts.integration,
|
||||
to: '/settings/integration',
|
||||
active: props.initialPage === 'integration',
|
||||
active: currentPage?.route.name === 'integration',
|
||||
}, {
|
||||
icon: 'fas fa-lock',
|
||||
text: i18n.ts.security,
|
||||
to: '/settings/security',
|
||||
active: props.initialPage === 'security',
|
||||
active: currentPage?.route.name === 'security',
|
||||
}],
|
||||
}, {
|
||||
title: i18n.ts.clientSettings,
|
||||
|
|
@ -107,32 +104,32 @@ const menuDef = computed(() => [{
|
|||
icon: 'fas fa-cogs',
|
||||
text: i18n.ts.general,
|
||||
to: '/settings/general',
|
||||
active: props.initialPage === 'general',
|
||||
active: currentPage?.route.name === 'general',
|
||||
}, {
|
||||
icon: 'fas fa-palette',
|
||||
text: i18n.ts.theme,
|
||||
to: '/settings/theme',
|
||||
active: props.initialPage === 'theme',
|
||||
active: currentPage?.route.name === 'theme',
|
||||
}, {
|
||||
icon: 'fas fa-bars',
|
||||
text: i18n.ts.navbar,
|
||||
to: '/settings/navbar',
|
||||
active: props.initialPage === 'navbar',
|
||||
active: currentPage?.route.name === 'navbar',
|
||||
}, {
|
||||
icon: 'fas fa-bars-progress',
|
||||
text: i18n.ts.statusbar,
|
||||
to: '/settings/statusbars',
|
||||
active: props.initialPage === 'statusbars',
|
||||
to: '/settings/statusbar',
|
||||
active: currentPage?.route.name === 'statusbar',
|
||||
}, {
|
||||
icon: 'fas fa-music',
|
||||
text: i18n.ts.sounds,
|
||||
to: '/settings/sounds',
|
||||
active: props.initialPage === 'sounds',
|
||||
active: currentPage?.route.name === 'sounds',
|
||||
}, {
|
||||
icon: 'fas fa-plug',
|
||||
text: i18n.ts.plugins,
|
||||
to: '/settings/plugin',
|
||||
active: props.initialPage === 'plugin',
|
||||
active: currentPage?.route.name === 'plugin',
|
||||
}],
|
||||
}, {
|
||||
title: i18n.ts.otherSettings,
|
||||
|
|
@ -140,40 +137,45 @@ const menuDef = computed(() => [{
|
|||
icon: 'fas fa-boxes',
|
||||
text: i18n.ts.importAndExport,
|
||||
to: '/settings/import-export',
|
||||
active: props.initialPage === 'import-export',
|
||||
active: currentPage?.route.name === 'import-export',
|
||||
}, {
|
||||
icon: 'fas fa-volume-mute',
|
||||
text: i18n.ts.instanceMute,
|
||||
to: '/settings/instance-mute',
|
||||
active: props.initialPage === 'instance-mute',
|
||||
active: currentPage?.route.name === 'instance-mute',
|
||||
}, {
|
||||
icon: 'fas fa-ban',
|
||||
text: i18n.ts.muteAndBlock,
|
||||
to: '/settings/mute-block',
|
||||
active: props.initialPage === 'mute-block',
|
||||
active: currentPage?.route.name === 'mute-block',
|
||||
}, {
|
||||
icon: 'fas fa-comment-slash',
|
||||
text: i18n.ts.wordMute,
|
||||
to: '/settings/word-mute',
|
||||
active: props.initialPage === 'word-mute',
|
||||
active: currentPage?.route.name === 'word-mute',
|
||||
}, {
|
||||
icon: 'fas fa-key',
|
||||
text: 'API',
|
||||
to: '/settings/api',
|
||||
active: props.initialPage === 'api',
|
||||
active: currentPage?.route.name === 'api',
|
||||
}, {
|
||||
icon: 'fas fa-bolt',
|
||||
text: 'Webhook',
|
||||
to: '/settings/webhook',
|
||||
active: props.initialPage === 'webhook',
|
||||
active: currentPage?.route.name === 'webhook',
|
||||
}, {
|
||||
icon: 'fas fa-ellipsis-h',
|
||||
text: i18n.ts.other,
|
||||
to: '/settings/other',
|
||||
active: props.initialPage === 'other',
|
||||
active: currentPage?.route.name === 'other',
|
||||
}],
|
||||
}, {
|
||||
items: [{
|
||||
icon: 'fas fa-floppy-disk',
|
||||
text: i18n.ts.preferencesBackups,
|
||||
to: '/settings/preferences-backups',
|
||||
active: currentPage?.route.name === 'preferences-backups',
|
||||
}, {
|
||||
type: 'button',
|
||||
icon: 'fas fa-trash',
|
||||
text: i18n.ts.clearCache,
|
||||
|
|
@ -198,77 +200,24 @@ const menuDef = computed(() => [{
|
|||
}],
|
||||
}]);
|
||||
|
||||
const pageProps = ref({});
|
||||
const component = computed(() => {
|
||||
if (props.initialPage == null) return null;
|
||||
switch (props.initialPage) {
|
||||
case 'accounts': return defineAsyncComponent(() => import('./accounts.vue'));
|
||||
case 'profile': return defineAsyncComponent(() => import('./profile.vue'));
|
||||
case 'privacy': return defineAsyncComponent(() => import('./privacy.vue'));
|
||||
case 'reaction': return defineAsyncComponent(() => import('./reaction.vue'));
|
||||
case 'drive': return defineAsyncComponent(() => import('./drive.vue'));
|
||||
case 'notifications': return defineAsyncComponent(() => import('./notifications.vue'));
|
||||
case 'mute-block': return defineAsyncComponent(() => import('./mute-block.vue'));
|
||||
case 'word-mute': return defineAsyncComponent(() => import('./word-mute.vue'));
|
||||
case 'instance-mute': return defineAsyncComponent(() => import('./instance-mute.vue'));
|
||||
case 'integration': return defineAsyncComponent(() => import('./integration.vue'));
|
||||
case 'security': return defineAsyncComponent(() => import('./security.vue'));
|
||||
case '2fa': return defineAsyncComponent(() => import('./2fa.vue'));
|
||||
case 'api': return defineAsyncComponent(() => import('./api.vue'));
|
||||
case 'webhook': return defineAsyncComponent(() => import('./webhook.vue'));
|
||||
case 'webhook/new': return defineAsyncComponent(() => import('./webhook.new.vue'));
|
||||
case 'webhook/edit': return defineAsyncComponent(() => import('./webhook.edit.vue'));
|
||||
case 'apps': return defineAsyncComponent(() => import('./apps.vue'));
|
||||
case 'other': return defineAsyncComponent(() => import('./other.vue'));
|
||||
case 'general': return defineAsyncComponent(() => import('./general.vue'));
|
||||
case 'email': return defineAsyncComponent(() => import('./email.vue'));
|
||||
case 'theme': return defineAsyncComponent(() => import('./theme.vue'));
|
||||
case 'theme/install': return defineAsyncComponent(() => import('./theme.install.vue'));
|
||||
case 'theme/manage': return defineAsyncComponent(() => import('./theme.manage.vue'));
|
||||
case 'navbar': return defineAsyncComponent(() => import('./navbar.vue'));
|
||||
case 'statusbars': return defineAsyncComponent(() => import('./statusbars.vue'));
|
||||
case 'sounds': return defineAsyncComponent(() => import('./sounds.vue'));
|
||||
case 'custom-css': return defineAsyncComponent(() => import('./custom-css.vue'));
|
||||
case 'deck': return defineAsyncComponent(() => import('./deck.vue'));
|
||||
case 'plugin': return defineAsyncComponent(() => import('./plugin.vue'));
|
||||
case 'plugin/install': return defineAsyncComponent(() => import('./plugin.install.vue'));
|
||||
case 'import-export': return defineAsyncComponent(() => import('./import-export.vue'));
|
||||
case 'account-info': return defineAsyncComponent(() => import('./account-info.vue'));
|
||||
case 'delete-account': return defineAsyncComponent(() => import('./delete-account.vue'));
|
||||
}
|
||||
return null;
|
||||
});
|
||||
|
||||
watch(component, () => {
|
||||
pageProps.value = {};
|
||||
|
||||
nextTick(() => {
|
||||
scroll(el.value, { top: 0 });
|
||||
});
|
||||
}, { immediate: true });
|
||||
|
||||
watch(() => props.initialPage, () => {
|
||||
if (props.initialPage == null && !narrow.value) {
|
||||
router.push('/settings/profile');
|
||||
} else {
|
||||
if (props.initialPage == null) {
|
||||
INFO.value = indexInfo;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
watch(narrow, () => {
|
||||
if (props.initialPage == null && !narrow.value) {
|
||||
router.push('/settings/profile');
|
||||
}
|
||||
watch($$(narrow), () => {
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
ro.observe(el.value);
|
||||
|
||||
narrow.value = el.value.offsetWidth < NARROW_THRESHOLD;
|
||||
if (props.initialPage == null && !narrow.value) {
|
||||
router.push('/settings/profile');
|
||||
narrow = el.value.offsetWidth < NARROW_THRESHOLD;
|
||||
|
||||
if (!narrow && currentPage?.route.name == null) {
|
||||
router.replace('/settings/profile');
|
||||
}
|
||||
});
|
||||
|
||||
onActivated(() => {
|
||||
narrow = el.value.offsetWidth < NARROW_THRESHOLD;
|
||||
|
||||
if (!narrow && currentPage?.route.name == null) {
|
||||
router.replace('/settings/profile');
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<div class="_formRoot">
|
||||
<MkTab v-model="tab" style="margin-bottom: var(--margin);">
|
||||
<option value="mute">{{ $ts.mutedUsers }}</option>
|
||||
<option value="block">{{ $ts.blockedUsers }}</option>
|
||||
<option value="mute">{{ i18n.ts.mutedUsers }}</option>
|
||||
<option value="block">{{ i18n.ts.blockedUsers }}</option>
|
||||
</MkTab>
|
||||
<div v-if="tab === 'mute'">
|
||||
<MkPagination :pagination="mutingPagination" class="muting">
|
||||
<template #empty><FormInfo>{{ $ts.noUsers }}</FormInfo></template>
|
||||
<template #empty><FormInfo>{{ i18n.ts.noUsers }}</FormInfo></template>
|
||||
<template #default="{items}">
|
||||
<FormLink v-for="mute in items" :key="mute.id" :to="userPage(mute.mutee)">
|
||||
<MkAcct :user="mute.mutee"/>
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
</div>
|
||||
<div v-if="tab === 'block'">
|
||||
<MkPagination :pagination="blockingPagination" class="blocking">
|
||||
<template #empty><FormInfo>{{ $ts.noUsers }}</FormInfo></template>
|
||||
<template #empty><FormInfo>{{ i18n.ts.noUsers }}</FormInfo></template>
|
||||
<template #default="{items}">
|
||||
<FormLink v-for="block in items" :key="block.id" :to="userPage(block.blockee)">
|
||||
<MkAcct :user="block.blockee"/>
|
||||
|
|
|
|||
444
packages/client/src/pages/settings/preferences-backups.vue
Normal file
444
packages/client/src/pages/settings/preferences-backups.vue
Normal file
|
|
@ -0,0 +1,444 @@
|
|||
<template>
|
||||
<div class="_formRoot">
|
||||
<div :class="$style.buttons">
|
||||
<MkButton inline primary @click="saveNew">{{ ts._preferencesBackups.saveNew }}</MkButton>
|
||||
<MkButton inline @click="loadFile">{{ ts._preferencesBackups.loadFile }}</MkButton>
|
||||
</div>
|
||||
|
||||
<FormSection>
|
||||
<template #label>{{ ts._preferencesBackups.list }}</template>
|
||||
<template v-if="profiles && Object.keys(profiles).length > 0">
|
||||
<div
|
||||
v-for="(profile, id) in profiles"
|
||||
:key="id"
|
||||
class="_formBlock _panel"
|
||||
:class="$style.profile"
|
||||
@click="$event => menu($event, id)"
|
||||
@contextmenu.prevent.stop="$event => menu($event, id)"
|
||||
>
|
||||
<div :class="$style.profileName">{{ profile.name }}</div>
|
||||
<div :class="$style.profileTime">{{ t('_preferencesBackups.createdAt', { date: (new Date(profile.createdAt)).toLocaleDateString(), time: (new Date(profile.createdAt)).toLocaleTimeString() }) }}</div>
|
||||
<div v-if="profile.updatedAt" :class="$style.profileTime">{{ t('_preferencesBackups.updatedAt', { date: (new Date(profile.updatedAt)).toLocaleDateString(), time: (new Date(profile.updatedAt)).toLocaleTimeString() }) }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<div v-else-if="profiles">
|
||||
<MkInfo>{{ ts._preferencesBackups.noBackups }}</MkInfo>
|
||||
</div>
|
||||
<MkLoading v-else/>
|
||||
</FormSection>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, onMounted, onUnmounted, useCssModule } from 'vue';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
import FormSection from '@/components/form/section.vue';
|
||||
import MkButton from '@/components/ui/button.vue';
|
||||
import MkInfo from '@/components/ui/info.vue';
|
||||
import * as os from '@/os';
|
||||
import { ColdDeviceStorage, defaultStore } from '@/store';
|
||||
import { unisonReload } from '@/scripts/unison-reload';
|
||||
import { stream } from '@/stream';
|
||||
import { $i } from '@/account';
|
||||
import { i18n } from '@/i18n';
|
||||
import { version, host } from '@/config';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata';
|
||||
const { t, ts } = i18n;
|
||||
|
||||
useCssModule();
|
||||
|
||||
const defaultStoreSaveKeys: (keyof typeof defaultStore['state'])[] = [
|
||||
'menu',
|
||||
'visibility',
|
||||
'localOnly',
|
||||
'statusbars',
|
||||
'widgets',
|
||||
'tl',
|
||||
'overridedDeviceKind',
|
||||
'serverDisconnectedBehavior',
|
||||
'nsfw',
|
||||
'animation',
|
||||
'animatedMfm',
|
||||
'loadRawImages',
|
||||
'imageNewTab',
|
||||
'disableShowingAnimatedImages',
|
||||
'disablePagesScript',
|
||||
'useOsNativeEmojis',
|
||||
'disableDrawer',
|
||||
'useBlurEffectForModal',
|
||||
'useBlurEffect',
|
||||
'showFixedPostForm',
|
||||
'enableInfiniteScroll',
|
||||
'useReactionPickerForContextMenu',
|
||||
'showGapBetweenNotesInTimeline',
|
||||
'instanceTicker',
|
||||
'reactionPickerSize',
|
||||
'reactionPickerWidth',
|
||||
'reactionPickerHeight',
|
||||
'reactionPickerUseDrawerForMobile',
|
||||
'defaultSideView',
|
||||
'menuDisplay',
|
||||
'reportError',
|
||||
'squareAvatars',
|
||||
'numberOfPageCache',
|
||||
'aiChanMode',
|
||||
];
|
||||
const coldDeviceStorageSaveKeys: (keyof typeof ColdDeviceStorage.default)[] = [
|
||||
'lightTheme',
|
||||
'darkTheme',
|
||||
'syncDeviceDarkMode',
|
||||
'plugins',
|
||||
'mediaVolume',
|
||||
'sound_masterVolume',
|
||||
'sound_note',
|
||||
'sound_noteMy',
|
||||
'sound_notification',
|
||||
'sound_chat',
|
||||
'sound_chatBg',
|
||||
'sound_antenna',
|
||||
'sound_channel',
|
||||
];
|
||||
|
||||
const scope = ['clientPreferencesProfiles'];
|
||||
|
||||
const profileProps = ['name', 'createdAt', 'updatedAt', 'misskeyVersion', 'settings'];
|
||||
|
||||
type Profile = {
|
||||
name: string;
|
||||
createdAt: string;
|
||||
updatedAt: string | null;
|
||||
misskeyVersion: string;
|
||||
host: string;
|
||||
settings: {
|
||||
hot: Record<keyof typeof defaultStoreSaveKeys, unknown>;
|
||||
cold: Record<keyof typeof coldDeviceStorageSaveKeys, unknown>;
|
||||
fontSize: string | null;
|
||||
useSystemFont: 't' | null;
|
||||
wallpaper: string | null;
|
||||
};
|
||||
};
|
||||
|
||||
const connection = $i && stream.useChannel('main');
|
||||
|
||||
let profiles = $ref<Record<string, Profile> | null>(null);
|
||||
|
||||
os.api('i/registry/get-all', { scope })
|
||||
.then(res => {
|
||||
profiles = res || {};
|
||||
});
|
||||
|
||||
function isObject(value: unknown): value is Record<string, unknown> {
|
||||
return value != null && typeof value === 'object' && !Array.isArray(value);
|
||||
}
|
||||
|
||||
function validate(profile: unknown): void {
|
||||
if (!isObject(profile)) throw new Error('not an object');
|
||||
|
||||
// Check if unnecessary properties exist
|
||||
if (Object.keys(profile).some(key => !profileProps.includes(key))) throw new Error('Unnecessary properties exist');
|
||||
|
||||
if (!profile.name) throw new Error('Missing required prop: name');
|
||||
if (!profile.misskeyVersion) throw new Error('Missing required prop: misskeyVersion');
|
||||
|
||||
// Check if createdAt and updatedAt is Date
|
||||
// https://zenn.dev/lollipop_onl/articles/eoz-judge-js-invalid-date
|
||||
if (!profile.createdAt || Number.isNaN(new Date(profile.createdAt).getTime())) throw new Error('createdAt is falsy or not Date');
|
||||
if (profile.updatedAt) {
|
||||
if (Number.isNaN(new Date(profile.updatedAt).getTime())) {
|
||||
throw new Error('updatedAt is not Date');
|
||||
}
|
||||
} else if (profile.updatedAt !== null) {
|
||||
throw new Error('updatedAt is not null');
|
||||
}
|
||||
|
||||
if (!profile.settings) throw new Error('Missing required prop: settings');
|
||||
if (!isObject(profile.settings)) throw new Error('Invalid prop: settings');
|
||||
}
|
||||
|
||||
function getSettings(): Profile['settings'] {
|
||||
const hot = {} as Record<keyof typeof defaultStoreSaveKeys, unknown>;
|
||||
for (const key of defaultStoreSaveKeys) {
|
||||
hot[key] = defaultStore.state[key];
|
||||
}
|
||||
|
||||
const cold = {} as Record<keyof typeof coldDeviceStorageSaveKeys, unknown>;
|
||||
for (const key of coldDeviceStorageSaveKeys) {
|
||||
cold[key] = ColdDeviceStorage.get(key);
|
||||
}
|
||||
|
||||
return {
|
||||
hot,
|
||||
cold,
|
||||
fontSize: localStorage.getItem('fontSize'),
|
||||
useSystemFont: localStorage.getItem('useSystemFont') as 't' | null,
|
||||
wallpaper: localStorage.getItem('wallpaper'),
|
||||
};
|
||||
}
|
||||
|
||||
async function saveNew(): Promise<void> {
|
||||
if (!profiles) return;
|
||||
|
||||
const { canceled, result: name } = await os.inputText({
|
||||
title: ts._preferencesBackups.inputName,
|
||||
});
|
||||
if (canceled) return;
|
||||
|
||||
if (Object.values(profiles).some(x => x.name === name)) {
|
||||
return os.alert({
|
||||
title: ts._preferencesBackups.cannotSave,
|
||||
text: t('_preferencesBackups.nameAlreadyExists', { name }),
|
||||
});
|
||||
}
|
||||
|
||||
const id = uuid();
|
||||
const profile: Profile = {
|
||||
name,
|
||||
createdAt: (new Date()).toISOString(),
|
||||
updatedAt: null,
|
||||
misskeyVersion: version,
|
||||
host,
|
||||
settings: getSettings(),
|
||||
};
|
||||
await os.apiWithDialog('i/registry/set', { scope, key: id, value: profile });
|
||||
}
|
||||
|
||||
function loadFile(): void {
|
||||
const input = document.createElement('input');
|
||||
input.type = 'file';
|
||||
input.multiple = false;
|
||||
input.onchange = async () => {
|
||||
if (!profiles) return;
|
||||
if (!input.files || input.files.length === 0) return;
|
||||
|
||||
const file = input.files[0];
|
||||
|
||||
if (file.type !== 'application/json') {
|
||||
return os.alert({
|
||||
type: 'error',
|
||||
title: ts._preferencesBackups.cannotLoad,
|
||||
text: ts._preferencesBackups.invalidFile,
|
||||
});
|
||||
}
|
||||
|
||||
let profile: Profile;
|
||||
try {
|
||||
profile = JSON.parse(await file.text()) as unknown as Profile;
|
||||
validate(profile);
|
||||
} catch (err) {
|
||||
return os.alert({
|
||||
type: 'error',
|
||||
title: ts._preferencesBackups.cannotLoad,
|
||||
text: err?.message,
|
||||
});
|
||||
}
|
||||
|
||||
const id = uuid();
|
||||
await os.apiWithDialog('i/registry/set', { scope, key: id, value: profile });
|
||||
|
||||
// 一応廃棄
|
||||
(window as any).__misskey_input_ref__ = null;
|
||||
};
|
||||
|
||||
// https://qiita.com/fukasawah/items/b9dc732d95d99551013d
|
||||
// iOS Safari で正常に動かす為のおまじない
|
||||
(window as any).__misskey_input_ref__ = input;
|
||||
|
||||
input.click();
|
||||
}
|
||||
|
||||
async function applyProfile(id: string): Promise<void> {
|
||||
if (!profiles) return;
|
||||
|
||||
const profile = profiles[id];
|
||||
|
||||
const { canceled: cancel1 } = await os.confirm({
|
||||
type: 'warning',
|
||||
title: ts._preferencesBackups.apply,
|
||||
text: t('_preferencesBackups.applyConfirm', { name: profile.name }),
|
||||
});
|
||||
if (cancel1) return;
|
||||
|
||||
// TODO: バージョン or ホストが違ったらさらに警告を表示
|
||||
|
||||
const settings = profile.settings;
|
||||
|
||||
// defaultStore
|
||||
for (const key of defaultStoreSaveKeys) {
|
||||
if (settings.hot[key] !== undefined) {
|
||||
defaultStore.set(key, settings.hot[key]);
|
||||
}
|
||||
}
|
||||
|
||||
// coldDeviceStorage
|
||||
for (const key of coldDeviceStorageSaveKeys) {
|
||||
if (settings.cold[key] !== undefined) {
|
||||
ColdDeviceStorage.set(key, settings.cold[key]);
|
||||
}
|
||||
}
|
||||
|
||||
// fontSize
|
||||
if (settings.fontSize) {
|
||||
localStorage.setItem('fontSize', settings.fontSize);
|
||||
} else {
|
||||
localStorage.removeItem('fontSize');
|
||||
}
|
||||
|
||||
// useSystemFont
|
||||
if (settings.useSystemFont) {
|
||||
localStorage.setItem('useSystemFont', settings.useSystemFont);
|
||||
} else {
|
||||
localStorage.removeItem('useSystemFont');
|
||||
}
|
||||
|
||||
// wallpaper
|
||||
if (settings.wallpaper != null) {
|
||||
localStorage.setItem('wallpaper', settings.wallpaper);
|
||||
} else {
|
||||
localStorage.removeItem('wallpaper');
|
||||
}
|
||||
|
||||
const { canceled: cancel2 } = await os.confirm({
|
||||
type: 'info',
|
||||
text: ts.reloadToApplySetting,
|
||||
});
|
||||
if (cancel2) return;
|
||||
|
||||
unisonReload();
|
||||
}
|
||||
|
||||
async function deleteProfile(id: string): Promise<void> {
|
||||
if (!profiles) return;
|
||||
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'info',
|
||||
title: ts.delete,
|
||||
text: t('deleteAreYouSure', { x: profiles[id].name }),
|
||||
});
|
||||
if (canceled) return;
|
||||
|
||||
await os.apiWithDialog('i/registry/remove', { scope, key: id });
|
||||
delete profiles[id];
|
||||
}
|
||||
|
||||
async function save(id: string): Promise<void> {
|
||||
if (!profiles) return;
|
||||
|
||||
const { name, createdAt } = profiles[id];
|
||||
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'info',
|
||||
title: ts._preferencesBackups.save,
|
||||
text: t('_preferencesBackups.saveConfirm', { name }),
|
||||
});
|
||||
if (canceled) return;
|
||||
|
||||
const profile: Profile = {
|
||||
name,
|
||||
createdAt,
|
||||
updatedAt: (new Date()).toISOString(),
|
||||
misskeyVersion: version,
|
||||
host,
|
||||
settings: getSettings(),
|
||||
};
|
||||
await os.apiWithDialog('i/registry/set', { scope, key: id, value: profile });
|
||||
}
|
||||
|
||||
async function rename(id: string): Promise<void> {
|
||||
if (!profiles) return;
|
||||
|
||||
const { canceled: cancel1, result: name } = await os.inputText({
|
||||
title: ts._preferencesBackups.inputName,
|
||||
});
|
||||
if (cancel1 || profiles[id].name === name) return;
|
||||
|
||||
if (Object.values(profiles).some(x => x.name === name)) {
|
||||
return os.alert({
|
||||
title: ts._preferencesBackups.cannotSave,
|
||||
text: t('_preferencesBackups.nameAlreadyExists', { name }),
|
||||
});
|
||||
}
|
||||
|
||||
const registry = Object.assign({}, { ...profiles[id] });
|
||||
|
||||
const { canceled: cancel2 } = await os.confirm({
|
||||
type: 'info',
|
||||
title: ts._preferencesBackups.rename,
|
||||
text: t('_preferencesBackups.renameConfirm', { old: registry.name, new: name }),
|
||||
});
|
||||
if (cancel2) return;
|
||||
|
||||
registry.name = name;
|
||||
await os.apiWithDialog('i/registry/set', { scope, key: id, value: registry });
|
||||
}
|
||||
|
||||
function menu(ev: MouseEvent, profileId: string) {
|
||||
if (!profiles) return;
|
||||
|
||||
return os.popupMenu([{
|
||||
text: ts._preferencesBackups.apply,
|
||||
icon: 'fas fa-circle-down',
|
||||
action: () => applyProfile(profileId),
|
||||
}, {
|
||||
type: 'a',
|
||||
text: ts.download,
|
||||
icon: 'fas fa-download',
|
||||
href: URL.createObjectURL(new Blob([JSON.stringify(profiles[profileId], null, 2)], { type: 'application/json' })),
|
||||
download: `${profiles[profileId].name}.json`,
|
||||
}, null, {
|
||||
text: ts.rename,
|
||||
icon: 'fas fa-i-cursor',
|
||||
action: () => rename(profileId),
|
||||
}, {
|
||||
text: ts._preferencesBackups.save,
|
||||
icon: 'fas fa-floppy-disk',
|
||||
action: () => save(profileId),
|
||||
}, null, {
|
||||
text: ts._preferencesBackups.delete,
|
||||
icon: 'fas fa-trash-can',
|
||||
action: () => deleteProfile(profileId),
|
||||
danger: true,
|
||||
}], ev.currentTarget ?? ev.target);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
// streamingのuser storage updateイベントを監視して更新
|
||||
connection?.on('registryUpdated', ({ scope: recievedScope, key, value }) => {
|
||||
if (!recievedScope || recievedScope.length !== scope.length || recievedScope[0] !== scope[0]) return;
|
||||
if (!profiles) return;
|
||||
|
||||
profiles[key] = value;
|
||||
});
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
connection?.off('registryUpdated');
|
||||
});
|
||||
|
||||
definePageMetadata(computed(() => ({
|
||||
title: ts.preferencesBackups,
|
||||
icon: 'fas fa-floppy-disk',
|
||||
bg: 'var(--bg)',
|
||||
})));
|
||||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.buttons {
|
||||
display: flex;
|
||||
gap: var(--margin);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.profile {
|
||||
padding: 20px;
|
||||
cursor: pointer;
|
||||
|
||||
&Name {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
&Time {
|
||||
font-size: .85em;
|
||||
opacity: .7;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue