337 lines
13 KiB
Plaintext
337 lines
13 KiB
Plaintext
import { Theme, SpacingSystem, Typography } from "../theme/theme.slint";
|
||
import { Card } from "../components/card.slint";
|
||
import { Switch } from "../components/switch.slint";
|
||
import { Button } from "../components/button.slint";
|
||
import { Select, SelectOption } from "../components/select.slint";
|
||
import { Separator, Orientation } from "../components/separator.slint";
|
||
|
||
export component SettingsPage {
|
||
// App Settings
|
||
in property <bool> auto-start: false;
|
||
in property <bool> silent-start: false;
|
||
in property <bool> clash-core: false;
|
||
|
||
// Clash Settings
|
||
in property <bool> tun-mode: false;
|
||
in property <bool> allow-lan: false;
|
||
in property <bool> ipv6: false;
|
||
in property <bool> unified-delay: false;
|
||
in property <int> log-level-index: 1;
|
||
in property <int> proxy-port: 7890;
|
||
|
||
// Misc
|
||
in property <string> app-dir: "C:/Program Files/Clash";
|
||
in property <string> config-dir: "C:/Users/User/.config/clash";
|
||
in property <string> core-dir: "C:/Program Files/Clash/core";
|
||
in property <string> app-version: "1.0.0";
|
||
|
||
callback toggle-auto-start(bool);
|
||
callback toggle-silent-start(bool);
|
||
callback toggle-clash-core(bool);
|
||
callback toggle-tun-mode(bool);
|
||
callback toggle-allow-lan(bool);
|
||
callback toggle-ipv6(bool);
|
||
callback toggle-unified-delay(bool);
|
||
callback log-level-changed(int);
|
||
callback open-port-settings();
|
||
callback open-tun-config();
|
||
callback open-directory(string);
|
||
|
||
VerticalLayout {
|
||
padding: SpacingSystem.spacing.s4;
|
||
spacing: SpacingSystem.spacing.s4;
|
||
|
||
// Header
|
||
Text {
|
||
text: "Settings";
|
||
color: Theme.colors.foreground;
|
||
font-size: Typography.sizes.xl;
|
||
font-weight: Typography.weights.bold;
|
||
}
|
||
|
||
ScrollView {
|
||
VerticalLayout {
|
||
spacing: SpacingSystem.spacing.s3;
|
||
|
||
// App Settings Section
|
||
Card {
|
||
VerticalLayout {
|
||
spacing: SpacingSystem.spacing.s3;
|
||
|
||
Text {
|
||
text: "App Settings";
|
||
color: Theme.colors.foreground;
|
||
font-size: Typography.sizes.base;
|
||
font-weight: Typography.weights.semibold;
|
||
}
|
||
|
||
SettingRow {
|
||
icon: "🚀";
|
||
label: "Auto Start";
|
||
|
||
Switch {
|
||
checked: root.auto-start;
|
||
toggled(checked) => {
|
||
root.toggle-auto-start(checked);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "🔇";
|
||
label: "Silent Start";
|
||
|
||
Switch {
|
||
checked: root.silent-start;
|
||
toggled(checked) => {
|
||
root.toggle-silent-start(checked);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "⚙";
|
||
label: "Clash Core";
|
||
|
||
Switch {
|
||
checked: root.clash-core;
|
||
toggled(checked) => {
|
||
root.toggle-clash-core(checked);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// Clash Settings Section
|
||
Card {
|
||
VerticalLayout {
|
||
spacing: SpacingSystem.spacing.s3;
|
||
|
||
Text {
|
||
text: "Clash Settings";
|
||
color: Theme.colors.foreground;
|
||
font-size: Typography.sizes.base;
|
||
font-weight: Typography.weights.semibold;
|
||
}
|
||
|
||
SettingRow {
|
||
icon: "🌐";
|
||
label: "TUN Mode";
|
||
|
||
HorizontalLayout {
|
||
spacing: SpacingSystem.spacing.s2;
|
||
|
||
Switch
|
||
checked: root.tun-mode;
|
||
toggled(checked) => {
|
||
root.toggle-tun-mode(checked);
|
||
}
|
||
}
|
||
|
||
Button {
|
||
width: 24px;
|
||
height: 24px;
|
||
text: "⚙";
|
||
variant: "ghost";
|
||
|
||
clicked => {
|
||
root.open-tun-config();
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "📡";
|
||
label: "Allow LAN";
|
||
|
||
Switch {
|
||
checked: root.allow-lan;
|
||
toggled(checked) => {
|
||
root.toggle-allow-lan(checked);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "🌍";
|
||
label: "IPv6";
|
||
|
||
Switch {
|
||
checked: root.ipv6;
|
||
toggled(checked) => {
|
||
root.toggle-ipv6(checked);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "⏱";
|
||
label: "Unified Delay";
|
||
|
||
Switch {
|
||
checked: root.unified-delay;
|
||
toggled(checked) => {
|
||
root.toggle-unified-delay(checked);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "📝";
|
||
label: "Log Level";
|
||
|
||
Select {
|
||
options: [
|
||
{ label: "Debug", valueg" },
|
||
{ label: "Info", value: "info" },
|
||
{ label: "Warn", value: "warn" },
|
||
{ label: "Error", value: "error" },
|
||
];
|
||
selected-index: root.log-level-index;
|
||
|
||
selected(index, value) => {
|
||
root.log-level-changed(index);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "🔌";
|
||
label: "Proxy Port";
|
||
|
||
Button {
|
||
text: root.proxy-port;
|
||
variant: "link";
|
||
|
||
clicked => {
|
||
root.open-port-settings();
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// Miscellaneous Section
|
||
Card {
|
||
VerticalLayout {
|
||
spacing: SpacingSystem.spacing.s3;
|
||
|
||
Text {
|
||
text: "Miscellaneous";
|
||
color: Theme.colors.foreground;
|
||
font-size: Typography.sizes.base;
|
||
font-weight: Typography.weights.semibold;
|
||
}
|
||
|
||
SettingRow {
|
||
icon: "📁";
|
||
l: "App Directory";
|
||
|
||
Button {
|
||
text: "Open";
|
||
variant: "link";
|
||
|
||
clicked => {
|
||
root.open-directory(root.app-dir);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "📁";
|
||
label: "Config Directory";
|
||
|
||
Button {
|
||
text: "Open";
|
||
variant: "link";
|
||
|
||
clicked => {
|
||
root.open-directory(root.config-dir);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "📁";
|
||
label: "Core Directory";
|
||
|
||
Button {
|
||
text: "Open";
|
||
variant: "link";
|
||
|
||
clicked => {
|
||
root.open-directory(root.core-dir);
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator { orientation: Orientation.horizontal; }
|
||
|
||
SettingRow {
|
||
icon: "ℹ";
|
||
label: "App Version";
|
||
|
||
Text {
|
||
text: root.app-version;
|
||
color: Theme.colors.muted-foreground;
|
||
font-size: Typography.sizes.sm;
|
||
vertical-alignment: center;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
component SettingRow {
|
||
in property <string> icon: "";
|
||
in property <string> label: "";
|
||
|
||
height: 40px;
|
||
|
||
HorizontalLayout {
|
||
spacing: SpacingSystem.spacing.s3;
|
||
alignment: space-between;
|
||
|
||
HorizontalLayout {
|
||
spacing: SpacingSystem.spacing.s2;
|
||
|
||
Text {
|
||
text: root.icon;
|
||
font-size: Typography.sizes.base;
|
||
vertical-alignment: center;
|
||
}
|
||
|
||
Text {
|
||
text: root.label;
|
||
color: Theme.colors.foreground;
|
||
font-size: Typography.sizes.sm;
|
||
vertical-alignment: center;
|
||
}
|
||
}
|
||
|
||
@children
|
||
}
|
||
}
|