add suno page

web/src/components/admin/AdminSidebar.vue

@@ -58,8 +58,8 @@ import {httpGet} from "@/utils/http";
 import {ElMessage} from "element-plus";
 import {useRoute} from "vue-router";
 
-const title = ref('Chat-Plus-Admin')
-const logo = ref('/images/logo.png')
+const title = ref('')
+const logo = ref('')
 
 // 加载系统配置
 httpGet('/api/admin/config/get?key=system').then(res => {

web/src/components/ui/BlackInput.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="black-input-wrapper">
+    <el-input v-model="model" :type="type" :rows="rows"
+              @input="$emit('update:value', $event)"
+              style="--el-input-bg-color:#252020;
+            --el-input-border-color:#414141;
+            --el-input-focus-border-color:#414141;
+            --el-text-color-regular: #f1f1f1;
+            --el-input-border-radius: 10px;
+            --el-border-color-hover:#616161"
+              resize="none"
+              :placeholder="placeholder"/>
+  </div>
+
+</template>
+
+<script>
+export default {
+  name: 'BlackInput',
+  props: {
+    value : {
+      type: String,
+      default: '',
+    },
+    placeholder: {
+      type: String,
+      default: '',
+    },
+    type: {
+      type: String,
+      default: 'input',
+    },
+    rows: {
+      type: Number,
+      default: 5,
+    }
+  },
+  data() {
+    return {
+      model: this.value
+    }
+  }
+}
+</script>
+
+<style lang="stylus">
+.black-input-wrapper {
+  .el-textarea__inner {
+    padding: 20px;
+    font-size: 16px;
+  }
+}
+</style>

web/src/components/ui/BlackSelect.vue

@@ -0,0 +1,43 @@
+<template>
+
+  <el-select v-model="model" :placeholder="placeholder"
+             :value="value" @change="$emit('update:value', $event)"
+             style="--el-fill-color-blank:#252020;
+                   --el-text-color-regular: #a1a1a1;
+                   --el-select-disabled-color:#0E0808;
+                   --el-color-primary-light-9:#0E0808;
+                   --el-border-radius-base:20px;
+                   --el-border-color:#0E0808;">
+    <el-option v-for="item in options"
+               :key="item.value"
+               :label="item.label"
+               :value="item.value">
+    </el-option>
+  </el-select>
+
+</template>
+
+<script>
+export default {
+  name: 'BlackSelect',
+  props: {
+    value : {
+      type: String,
+      default: '',
+    },
+    placeholder: {
+      type: String,
+      default: '请选择',
+    },
+    options: {
+      type: Array,
+      default: []
+    }
+  },
+  data() {
+    return {
+      model: this.value
+    }
+  }
+}
+</script>

web/src/components/ui/BlackSwitch.vue

@@ -0,0 +1,25 @@
+<template>
+
+  <el-switch v-model="model" :size="size"
+             @change="$emit('update:value', $event)"
+             style="--el-switch-on-color:#555555;--el-color-white:#0E0808"/>
+
+</template>
+
+<script>
+export default {
+  name: 'BlackSwitch',
+  props: {
+    value : Boolean,
+    size: {
+      type: String,
+      default: 'default',
+    }
+  },
+  data() {
+    return {
+      model: this.value
+    }
+  }
+}
+</script>