From 02a19df35f6dc62be389106e5a06827abe99bf06 Mon Sep 17 00:00:00 2001
From: Sigo <sigo2017web@163.com>
Date: Wed, 22 Jun 2022 10:05:28 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=87=AA=E5=AE=9A=E4=B9=89el?=
 =?UTF-8?q?ement=E9=87=91=E9=A2=9D=E8=BE=93=E5=85=A5=E6=A1=86=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AmountInput/index.vue          | 106 ++++++++++++++++++
 .../自定义金额输入框组件            |   0
 2 files changed, 106 insertions(+)
 create mode 100644 src/components/AmountInput/index.vue
 create mode 100644 src/components/AmountInput/自定义金额输入框组件

diff --git a/src/components/AmountInput/index.vue b/src/components/AmountInput/index.vue
new file mode 100644
index 0000000..7767cb2
--- /dev/null
+++ b/src/components/AmountInput/index.vue
@@ -0,0 +1,106 @@
+<!-- 金额输入框 -->
+<template>
+  <el-input v-model.trim="form.moneyShow" :placeholder="placeholder" @blur="handleBlur" @focus="handleFocus" @input="handleInput" @paste.native.capture.prevent="handlePaste">
+    <i slot="prefix" class="el-input__icon el-icon-coin"></i>
+  </el-input>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      form: {
+        moneyShow: null,
+        money: null,
+      },
+    }
+  },
+  props: {
+    placeholder: String,
+    name: String,
+  },
+  methods: {
+    // 失去焦点
+    handleBlur() {
+      let form = Object.assign({}, this.form)
+      form.moneyShow = this.$thousands(this.form.money)
+      this.form = Object.assign({}, form)
+    },
+    // 获取焦点
+    handleFocus() {
+      let form = Object.assign({}, this.form)
+      form.moneyShow = form.money
+      this.form = Object.assign({}, form)
+    },
+    // 输入时
+    handleInput(value) {
+      let amount
+      // 最后一个字符
+      let last = value.charAt(value.length - 1)
+      // 去掉最后一个字符的后的
+      let cutLast = value.substring(0, value.length - 1)
+      let form = Object.assign({}, this.form)
+      let num = /^[0-9]*$/
+      if (last) {
+        if (num.test(last) || last == '.') {
+          if (last == '.') {
+            if (cutLast.includes('.')) {
+              amount = value.substring(0, value.length - 1)
+            } else {
+              amount = value
+            }
+          } else {
+            amount = value
+          }
+        } else {
+          amount = value.substring(0, value.length - 1)
+        }
+      }
+      form.moneyShow = amount
+      form.money = amount
+      this.form = Object.assign({}, form)
+      this.$emit('amount', this.name, amount)
+    },
+    // 粘贴时
+    handlePaste(res) {
+      let amount
+      let num = /^[0-9]*$/
+      let clip = res.clipboardData.getData('Text')
+      let form = Object.assign({}, this.form)
+      if (num.test(clip)) {
+        amount = form.money + clip
+      } else if (clip.includes('.')) {
+        if (clip.split('.').length > 2) {
+          amount = form.money
+        } else {
+          if (clip.split('.').length > 0) {
+            if (num.test(clip.split('.')[0]) && num.test(clip.split('.')[1])) {
+              if (form.money.includes('.')) {
+                amount = form.money
+              } else {
+                amount = form.money + clip
+              }
+            } else {
+              amount = form.money
+            }
+          } else {
+            amount = form.money
+          }
+        }
+      } else {
+        amount = form.money
+      }
+      form.moneyShow = amount
+      form.money = amount
+      this.form = Object.assign({}, form)
+      this.$emit('amount', this.name, amount)
+    },
+    // 重置
+    reset() {
+      this.form = Object.assign({}, {})
+    },
+  },
+}
+</script>
+
+<style></style>
diff --git a/src/components/AmountInput/自定义金额输入框组件 b/src/components/AmountInput/自定义金额输入框组件
new file mode 100644
index 0000000..e69de29