Browse Source

✨ feat: 自动去除首尾空格

Pchen0 1 month ago
parent
commit
fd3e1e189c

+ 9 - 1
src/main.js

@@ -16,6 +16,14 @@ import App from './App.vue'
 import { router } from './router/'
 import { createPinia } from 'pinia'
 import globalComponents from '@/components'
+import trimInput from '@/plugins/trimInput'
 
 const app = createApp(App)
-app.use(ArcoVue).use(ArcoVueIcon).use(router).use(createPinia()).use(globalComponents).mount('#app')
+app
+  .use(ArcoVue)
+  .use(trimInput)
+  .use(ArcoVueIcon)
+  .use(router)
+  .use(createPinia())
+  .use(globalComponents)
+  .mount('#app')

+ 1 - 1
src/pages/admin/lepaoAccount/accountList.vue

@@ -236,7 +236,7 @@
                 <a-select v-model="form.auto_time" placeholder="请选择每天自动乐跑的时段" :options="auto_time" />
             </a-form-item>
             <a-form-item field="notes" label="备注">
-                <a-textarea v-model="form.notes" placeholder="添加对账号的备注(非必填)" :max-length="{ length: 50 }" allow-clear
+                <a-textarea v-model="form.notes" no-trim placeholder="添加对账号的备注(非必填)" :max-length="{ length: 50 }" allow-clear
                     show-word-limit />
             </a-form-item>
         </a-form>

+ 1 - 1
src/pages/admin/user/userList.vue

@@ -135,7 +135,7 @@
                 <a-input-number v-model="change_lepao_count.lepao_count" :step="1" />
             </a-form-item>
             <a-form-item field="remark" label="备注">
-                <a-textarea v-model="change_lepao_count.remark" placeholder="可选,不填默认系统调整次数" :max-length="{ length: 255 }"
+                <a-textarea v-model="change_lepao_count.remark" no-trim placeholder="可选,不填默认系统调整次数" :max-length="{ length: 255 }"
                     show-word-limit allow-clear />
             </a-form-item>
         </a-form>

+ 2 - 1
src/pages/lepao/accountList/index.vue

@@ -288,6 +288,7 @@
       <a-form-item label="自动识别" v-if="!form.id">
         <a-textarea
           v-model="autoFillText"
+          no-trim
           placeholder="粘贴包含学号、邮箱、跑区等信息的文本,点击“识别并填入”自动填写"
           :auto-size="{ minRows: 2, maxRows: 4 }"
           allow-clear
@@ -340,7 +341,7 @@
         <a-select v-model="form.auto_time" placeholder="请选择每天自动乐跑的时段" :options="auto_time" />
       </a-form-item>
       <a-form-item field="notes" label="备注">
-        <a-textarea v-model="form.notes" placeholder="添加对账号的备注(非必填)" :max-length="{ length: 50 }" allow-clear
+        <a-textarea v-model="form.notes" no-trim placeholder="添加对账号的备注(非必填)" :max-length="{ length: 50 }" allow-clear
           show-word-limit />
       </a-form-item>
     </a-form>

+ 1 - 1
src/pages/lepao/countLedger/index.vue

@@ -19,7 +19,7 @@
               </a-col>
               <a-col :span="12">
                 <a-form-item field="remark" label="备注搜索">
-                  <a-input v-model="queryData.remark" allow-clear placeholder="请输入备注关键词" style="width: 100%" />
+                  <a-input v-model="queryData.remark" no-trim allow-clear placeholder="请输入备注关键词" style="width: 100%" />
                 </a-form-item>
               </a-col>
               <a-col :span="12">

+ 1 - 1
src/pages/power/accountList.vue

@@ -76,7 +76,7 @@
           allow-clear />
       </a-form-item>
       <a-form-item field="notes" label="备注">
-        <a-textarea v-model="form.notes" placeholder="添加对账号的备注(非必填)" :max-length="{ length: 50 }" allow-clear
+        <a-textarea v-model="form.notes" no-trim placeholder="添加对账号的备注(非必填)" :max-length="{ length: 50 }" allow-clear
           show-word-limit />
       </a-form-item>
     </a-form>

+ 79 - 0
src/plugins/trimInput.js

@@ -0,0 +1,79 @@
+import { defineComponent, h, mergeProps } from 'vue'
+import { Input, Textarea, AutoComplete } from '@arco-design/web-vue'
+
+function shouldTrim(props, noTrim) {
+  if (noTrim) return false
+  if (props.type === 'password') return false
+  return true
+}
+
+export function withInputTrim(Original) {
+  const originalEmits =
+    typeof Original.emits === 'object' && Original.emits !== null
+      ? Object.keys(Original.emits)
+      : ['update:modelValue', 'input', 'change', 'pressEnter', 'clear', 'focus', 'blur']
+
+  return defineComponent({
+    name: `Trim${Original.name || 'Input'}`,
+    inheritAttrs: false,
+    props: {
+      ...(Original.props || {}),
+      noTrim: {
+        type: Boolean,
+        default: false,
+      },
+    },
+    emits: [...new Set([...originalEmits, 'update:modelValue'])],
+    setup(props, { attrs, slots, emit }) {
+      return () => {
+        const { noTrim, modelValue, ...rest } = props
+
+        const onUpdateModelValue = (value) => {
+          emit('update:modelValue', value)
+        }
+
+        const onBlur = (ev) => {
+          if (shouldTrim(props, noTrim) && typeof modelValue === 'string') {
+            const trimmed = modelValue.trim()
+            if (trimmed !== modelValue) {
+              emit('update:modelValue', trimmed)
+            }
+          }
+          emit('blur', ev)
+          const attrBlur = attrs.onBlur
+          if (attrBlur) {
+            const handlers = Array.isArray(attrBlur) ? attrBlur : [attrBlur]
+            handlers.forEach((fn) => typeof fn === 'function' && fn(ev))
+          }
+        }
+
+        return h(
+          Original,
+          mergeProps(attrs, rest, {
+            modelValue,
+            'onUpdate:modelValue': onUpdateModelValue,
+            onBlur,
+          }),
+          slots
+        )
+      }
+    },
+  })
+}
+
+const TRIM_COMPONENTS = [
+  ['AInput', Input],
+  ['AInputSearch', Input.Search],
+  ['ATextarea', Textarea],
+  ['AAutoComplete', AutoComplete],
+]
+
+export default {
+  install(app) {
+    TRIM_COMPONENTS.forEach(([name, component]) => {
+      if (component) {
+        app.component(name, withInputTrim(component))
+      }
+    })
+  },
+}