optimize foot copyright snaps

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)
 })

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>