mirror of
https://github.com/rubickCenter/rubick
synced 2025-06-28 16:42:47 +08:00
🔨 设置页适配暗黑
This commit is contained in:
parent
edbc4d0749
commit
794235c72d
@ -222,13 +222,19 @@ const deletePlugin = async (plugin) => {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less">
|
<style lang="less" scoped>
|
||||||
.installed {
|
.installed {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background: var(--color-body-bg);
|
background: var(--color-body-bg);
|
||||||
height: calc(~'100vh - 46px');
|
height: calc(~'100vh - 46px');
|
||||||
|
:deep(.ant-result-title) {
|
||||||
|
color: var(--color-text-primary);
|
||||||
|
}
|
||||||
|
:deep(.ant-result-subtitle) {
|
||||||
|
color: var(--color-text-desc);
|
||||||
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@ -298,7 +304,7 @@ const deletePlugin = async (plugin) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.ant-tabs {
|
.ant-tabs {
|
||||||
.ant-tabs-bar {
|
:deep(.ant-tabs-bar) {
|
||||||
color: var(--color-text-content);
|
color: var(--color-text-content);
|
||||||
border-bottom: 1px solid var(--color-border-light);
|
border-bottom: 1px solid var(--color-border-light);
|
||||||
}
|
}
|
||||||
|
@ -36,19 +36,19 @@
|
|||||||
</a-form>
|
</a-form>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, toRaw } from "vue";
|
import { ref, toRaw } from 'vue';
|
||||||
import { message } from "ant-design-vue";
|
import { message } from 'ant-design-vue';
|
||||||
|
|
||||||
let _rev: any;
|
let _rev: any;
|
||||||
|
|
||||||
let defaultConfig = {
|
let defaultConfig = {
|
||||||
register: "https://registry.npm.taobao.org",
|
register: 'https://registry.npm.taobao.org',
|
||||||
database: "https://gitcode.net/rubickcenter/rubick-database/-/raw/master",
|
database: 'https://gitcode.net/rubickcenter/rubick-database/-/raw/master',
|
||||||
access_token: ""
|
access_token: '',
|
||||||
};
|
};
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const dbdata = window.rubick.db.get("rubick-localhost-config");
|
const dbdata = window.rubick.db.get('rubick-localhost-config');
|
||||||
defaultConfig = dbdata.data;
|
defaultConfig = dbdata.data;
|
||||||
_rev = dbdata._rev;
|
_rev = dbdata._rev;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
@ -58,26 +58,26 @@ try {
|
|||||||
const formState = ref(JSON.parse(JSON.stringify(defaultConfig)));
|
const formState = ref(JSON.parse(JSON.stringify(defaultConfig)));
|
||||||
|
|
||||||
const rules = {
|
const rules = {
|
||||||
register: [{ required: true, trigger: "change" }],
|
register: [{ required: true, trigger: 'change' }],
|
||||||
database: [{ required: true, trigger: "change" }]
|
database: [{ required: true, trigger: 'change' }],
|
||||||
};
|
};
|
||||||
const layout = {
|
const layout = {
|
||||||
labelCol: { span: 6 },
|
labelCol: { span: 6 },
|
||||||
wrapperCol: { span: 18 }
|
wrapperCol: { span: 18 },
|
||||||
};
|
};
|
||||||
|
|
||||||
const resetForm = () => {
|
const resetForm = () => {
|
||||||
formState.value = {
|
formState.value = {
|
||||||
register: "https://registry.npm.taobao.org",
|
register: 'https://registry.npm.taobao.org',
|
||||||
database: "https://gitcode.net/rubickcenter/rubick-database/-/raw/master",
|
database: 'https://gitcode.net/rubickcenter/rubick-database/-/raw/master',
|
||||||
access_token: ""
|
access_token: '',
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
const submit = () => {
|
const submit = () => {
|
||||||
const changeData: any = {
|
const changeData: any = {
|
||||||
_id: "rubick-localhost-config",
|
_id: 'rubick-localhost-config',
|
||||||
data: toRaw(formState.value)
|
data: toRaw(formState.value),
|
||||||
};
|
};
|
||||||
|
|
||||||
if (_rev) {
|
if (_rev) {
|
||||||
@ -85,13 +85,17 @@ const submit = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
window.rubick.db.put(changeData);
|
window.rubick.db.put(changeData);
|
||||||
message.success("设置成功!重启插件市场后生效!");
|
message.success('设置成功!重启插件市场后生效!');
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
:deep(label) {
|
.ant-form {
|
||||||
|
:deep(.ant-form-item) {
|
||||||
|
label {
|
||||||
color: var(--color-text-content);
|
color: var(--color-text-content);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
:deep(.ant-input) {
|
:deep(.ant-input) {
|
||||||
background: var(--color-input-hover);
|
background: var(--color-input-hover);
|
||||||
|
@ -1,14 +1,27 @@
|
|||||||
<template>
|
<template>
|
||||||
请选择需要添加到超级面板中的常用插件
|
<p>请选择需要添加到超级面板中的常用插件</p>
|
||||||
<div class="super-list-item panel-item">
|
<div class="super-list-item panel-item">
|
||||||
<a-list :grid="{ gutter: 16, column: 2 }" :data-source="localPlugins.filter(item => !!item)">
|
<a-list
|
||||||
|
:grid="{ gutter: 16, column: 2 }"
|
||||||
|
:data-source="localPlugins.filter((item) => !!item)"
|
||||||
|
>
|
||||||
<template #renderItem="{ item }">
|
<template #renderItem="{ item }">
|
||||||
<a-list-item v-if="item">
|
<a-list-item v-if="item">
|
||||||
<template #actions>
|
<template #actions>
|
||||||
<a-button v-if="!hasAdded(item)" @click="addPluginToSuperPanel(item)" style="color: #7ec699" type="text">
|
<a-button
|
||||||
|
v-if="!hasAdded(item)"
|
||||||
|
@click="addPluginToSuperPanel(item)"
|
||||||
|
style="color: #7ec699"
|
||||||
|
type="text"
|
||||||
|
>
|
||||||
添加
|
添加
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button v-else @click="removePluginToSuperPanel(item)" style="color: #ff4ea4;" type="text">
|
<a-button
|
||||||
|
v-else
|
||||||
|
@click="removePluginToSuperPanel(item)"
|
||||||
|
style="color: #ff4ea4"
|
||||||
|
type="text"
|
||||||
|
>
|
||||||
移除
|
移除
|
||||||
</a-button>
|
</a-button>
|
||||||
</template>
|
</template>
|
||||||
@ -20,7 +33,7 @@
|
|||||||
<span class="ellipse">{{ item.pluginName }}</span>
|
<span class="ellipse">{{ item.pluginName }}</span>
|
||||||
</template>
|
</template>
|
||||||
<template #avatar>
|
<template #avatar>
|
||||||
<a-avatar :src="item.logo"/>
|
<a-avatar :src="item.logo" />
|
||||||
</template>
|
</template>
|
||||||
</a-list-item-meta>
|
</a-list-item-meta>
|
||||||
</a-list-item>
|
</a-list-item>
|
||||||
@ -29,13 +42,15 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import {useStore} from "vuex";
|
import { useStore } from 'vuex';
|
||||||
import {computed, ref, toRaw} from "vue";
|
import { computed, ref, toRaw } from 'vue';
|
||||||
|
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
const localPlugins = computed(() =>
|
const localPlugins = computed(() =>
|
||||||
store.state.localPlugins.filter(
|
store.state.localPlugins.filter(
|
||||||
plugin => plugin.name !== "rubick-system-feature" && plugin.name !== "rubick-system-super-panel"
|
(plugin) =>
|
||||||
|
plugin.name !== 'rubick-system-feature' &&
|
||||||
|
plugin.name !== 'rubick-system-super-panel'
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|
||||||
@ -51,10 +66,12 @@ const hasAdded = (plugin) => {
|
|||||||
return added;
|
return added;
|
||||||
};
|
};
|
||||||
|
|
||||||
const superPanelPlugins = ref(window.rubick.db.get("super-panel-db") || {
|
const superPanelPlugins = ref(
|
||||||
|
window.rubick.db.get('super-panel-db') || {
|
||||||
data: [],
|
data: [],
|
||||||
_id: "super-panel-db",
|
_id: 'super-panel-db',
|
||||||
});
|
}
|
||||||
|
);
|
||||||
|
|
||||||
const addPluginToSuperPanel = (plugin) => {
|
const addPluginToSuperPanel = (plugin) => {
|
||||||
superPanelPlugins.value.data.push(toRaw(plugin));
|
superPanelPlugins.value.data.push(toRaw(plugin));
|
||||||
@ -62,13 +79,18 @@ const addPluginToSuperPanel = (plugin) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const removePluginToSuperPanel = (plugin) => {
|
const removePluginToSuperPanel = (plugin) => {
|
||||||
superPanelPlugins.value.data = toRaw(superPanelPlugins.value).data.filter((item) => {
|
superPanelPlugins.value.data = toRaw(superPanelPlugins.value).data.filter(
|
||||||
|
(item) => {
|
||||||
return item.name !== plugin.name;
|
return item.name !== plugin.name;
|
||||||
});
|
}
|
||||||
|
);
|
||||||
window.rubick.db.put(toRaw(superPanelPlugins.value));
|
window.rubick.db.put(toRaw(superPanelPlugins.value));
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="less">
|
<style lang="less" scoped>
|
||||||
|
p {
|
||||||
|
color: var(--color-text-primary);
|
||||||
|
}
|
||||||
.super-list-item.panel-item {
|
.super-list-item.panel-item {
|
||||||
&:after {
|
&:after {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "rubick",
|
"name": "rubick",
|
||||||
"version": "2.2.0",
|
"version": "2.2.1",
|
||||||
"author": "muwoo <2424880409@qq.com>",
|
"author": "muwoo <2424880409@qq.com>",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user