optimize foot copyright snaps

2025-11-04 08:13:43 +08:00 · 2024-07-22 17:54:09 +08:00
parent 1541d74c84
commit 4910be3403
14 changed files with 266 additions and 69 deletions
--- a/web/src/components/FooterBar.vue
+++ b/web/src/components/FooterBar.vue
@@ -1,15 +1,12 @@
 <template>
  <div class="foot-container">
    <div class="footer">
-      <div v-if="license.de_copy" :style="{color:textColor}">{{copyRight}}</div>
-      <div v-else>
-        <span :style="{color:textColor}">{{copyRight}}</span>
-        <div>
-          <a :href="gitURL" target="_blank" :style="{color:textColor}">
-            {{ title }} -
-            {{ version }}
-          </a>
-        </div>
+      <div><span :style="{color:textColor}">{{copyRight}}</span></div>
+      <div v-if="!license.de_copy">
+        <a :href="gitURL" target="_blank" :style="{color:textColor}">
+          {{ title }} -
+          {{ version }}
+        </a>
      </div>
    </div>
  </div>
@@ -35,7 +32,7 @@ const props = defineProps({
 // 获取系统配置
 httpGet("/api/config/get?key=system").then(res => {
  title.value = res.data.title??process.env.VUE_APP_TITLE
-  copyRight.value = res.data.copyright??'极客学长 © 2023 - '+new Date().getFullYear()+' All rights reserved.'
+  copyRight.value = res.data.copyright.length>1?res.data.copyright:'极客学长 © 2023 - '+new Date().getFullYear()+' All rights reserved.'
 }).catch(e => {
  showMessageError("获取系统配置失败：" + e.message)
 })
--- a/web/src/components/ui/BlackInput.vue
+++ b/web/src/components/ui/BlackInput.vue
@@ -1,7 +1,7 @@
 <template>
  <div class="black-input-wrapper">
    <el-input v-model="model" :type="type" :rows="rows"
-              @input="$emit('update:value', $event)"
+              @input="onInput"
              style="--el-input-bg-color:#252020;
            --el-input-border-color:#414141;
            --el-input-focus-border-color:#414141;
@@ -9,45 +9,68 @@
            --el-input-border-radius: 10px;
            --el-border-color-hover:#616161"
              resize="none"
-              :placeholder="placeholder"/>
+              :placeholder="placeholder" :maxlength="maxlength"/>
+    <div class="word-stat" v-if="rows > 1">
+      <span>{{value.length}}</span>/<span>{{maxlength}}</span>
+    </div>
  </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,
-    }
+<script setup>
+
+import {ref} from "vue";
+
+const props = defineProps({
+  value : {
+    type: String,
+    default: '',
  },
-  data() {
-    return {
-      model: this.value
-    }
+  placeholder: {
+    type: String,
+    default: '',
+  },
+  type: {
+    type: String,
+    default: 'input',
+  },
+  rows: {
+    type: Number,
+    default: 5,
+  },
+  maxlength: {
+    type: Number,
+    default: 1024
  }
+});
+const model = ref(props.value)
+const emits = defineEmits(['update:value']);
+const onInput = (value) => {
+  emits('update:value',value)
 }
 </script>

 <style lang="stylus">
 .black-input-wrapper {
+  position relative
+
  .el-textarea__inner {
    padding: 20px;
    font-size: 16px;
  }
+
+  .word-stat {
+    position: absolute;
+    bottom 10px
+    right 10px
+    color rgb(209 203 199)
+    font-family: Neue Montreal, ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+    font-size .875rem
+    line-height 1.25rem
+
+    span {
+      margin 0 1px
+    }
+  }
 }
 </style>
--- a/web/src/views/Suno.vue
+++ b/web/src/views/Suno.vue
@@ -44,9 +44,19 @@
                  </el-icon>
                </template>
              </el-popover>
+              <div class="tag-select">
+                <el-tag
+                  v-for="tag in tags"
+                  :key="tag"
+                  :type="tag === data.tags ? 'success' : ''"
+                  :hit="tag === data.tags"
+                  style="margin-right: 10px"
+                  @click="data.tags = tag"
+                >{{ tag }}</el-tag>
+              </div>
            </div>
            <div class="item">
-              <black-input v-model:value="data.tags" type="textarea" :rows="3" placeholder="请输入音乐风格，多个风格之间用英文逗号隔开..."/>
+              <black-input v-model:value="data.tags" type="textarea" :maxlength="120" :rows="3" placeholder="请输入音乐风格，多个风格之间用英文逗号隔开..."/>
            </div>
          </div>

@@ -64,7 +74,7 @@
              </el-popover>
            </div>
            <div class="item">
-              <black-input v-model:value="data.title" type="textarea" :rows="2" placeholder="请输入歌曲名称..."/>
+              <black-input v-model:value="data.title" type="textarea" :rows="1" placeholder="请输入歌曲名称..."/>
            </div>
          </div>
        </div>
@@ -180,6 +190,7 @@ const models = ref([
  {label: "v3.0", value: "chirp-v3-0"},
  {label: "v3.5", value:"chirp-v3-5"}
 ])
+const tags = ref([])
 const data = ref({
  model: "chirp-v3-0",
  tags: "",
--- a/web/src/views/admin/ApiKey.vue
+++ b/web/src/views/admin/ApiKey.vue
@@ -104,10 +104,10 @@
        <el-form-item label="名称：" prop="name">
          <el-input v-model="item.name" autocomplete="off"/>
        </el-form-item>
-        <el-form-item label="用途：" prop="type">
-          <el-select v-model="item.type" placeholder="请选择用途" @change="changeType">
-            <el-option v-for="item in types" :value="item.value" :label="item.name" :key="item.value">{{
-                item.name
+        <el-form-item label="类型：" prop="type">
+          <el-select v-model="item.type" placeholder="请选择类型">
+            <el-option v-for="item in types" :value="item.value" :label="item.label" :key="item.value">{{
+                item.label
              }}
            </el-option>
          </el-select>
@@ -159,13 +159,17 @@ const rules = reactive({
  type: [{required: true, message: '请选择用途', trigger: 'change',}],
  value: [{required: true, message: '请输入 API KEY 值', trigger: 'change',}]
 })
+
 const loading = ref(true)
 const formRef = ref(null)
 const title = ref("")
 const platforms = ref([])
 const types = ref([
-  {name: "聊天", value: "chat"},
-  {name: "绘画", value: "img"},
+  {label: "对话", value:"chat"},
+  {label: "Midjourney", value:"mj"},
+  {label: "DALL-E", value:"dall"},
+  {label: "Suno文生歌", value:"suno"},
+  {label: "Luma视频", value:"luma"},
 ])


--- a/web/src/views/admin/ChatModel.vue
+++ b/web/src/views/admin/ChatModel.vue
@@ -46,11 +46,6 @@
          </template>
        </el-table-column>

-        <!--        <el-table-column label="创建时间">-->
-        <!--          <template #default="scope">-->
-        <!--            <span>{{ dateFormat(scope.row['created_at']) }}</span>-->
-        <!--          </template>-->
-        <!--        </el-table-column>-->
        <el-table-column prop="key_name" label="绑定API-KEY"/>
        <el-table-column label="操作" width="180">
          <template #default="scope">
@@ -89,7 +84,7 @@
          <el-input v-model="item.value" autocomplete="off"/>
        </el-form-item>

-        <el-form-item label="费率：" prop="weight">
+        <el-form-item label="消耗算力：" prop="weight">
          <template #default>
            <div class="tip-input">
              <el-input-number :min="0" v-model="item.power" autocomplete="off"/>