feat: add input suffix prefix slot

src/component/input/index.less

@@ -10,17 +10,34 @@
 
 .layui-input {
   height: 38px;
-  line-height: 1.3;
-  line-height: 38px\9;
-  border-width: 1px;
-  border-style: solid;
+  line-height: 38px;
   background-color: #fff;
   color: rgba(0, 0, 0, 0.85);
-  border-radius: @input-border-radius;
-  border-color: @input-border-color;
-  display: block;
-  width: 100%;
   padding-left: 10px;
+  display: inline-block;
+  border: none;
+  width: 100%;
+}
+
+.layui-input-wrapper {
+  width: 100%;
+  border-width: 1px;
+  border-style: solid;
+  display: inline-flex;
+  border-color: @input-border-color;
+  border-radius:  @input-border-radius;
+}
+
+.layui-input-prefix {
+  display: flex;
+  flex: none;
+  align-items: center;
+}
+
+.layui-input-suffix {
+  display: flex;
+  flex: none;
+  align-items: center;
 }
 
 .layui-input:hover {

src/component/input/index.vue

@@ -7,8 +7,10 @@ export default {
 <script setup lang="ts">
 import "./index.less";
 import { useI18n } from "vue-i18n";
+import { useSlots } from "vue-demi";
 
 const { t } = useI18n();
+const slots = useSlots();
 
 export interface LayInputProps {
   name?: string;
@@ -39,16 +41,24 @@ const onBlur = function () {
 </script>
 
 <template>
-  <input
-    :type="type"
-    :name="name"
-    :value="modelValue || value"
-    :disabled="disabled"
-    :placeholder="placeholder"
-    :class="{ 'layui-disabled': disabled }"
-    class="layui-input"
-    @input="onInput"
-    @focus="onFocus"
-    @blur="onBlur"
-  />
+  <div class="layui-input-wrapper">
+    <span class="layui-input-prefix" v-if="slots.prefix">
+      <slot name="prefix"></slot>
+    </span>
+    <input
+      :type="type"
+      :name="name"
+      :value="modelValue || value"
+      :disabled="disabled"
+      :placeholder="placeholder"
+      :class="{ 'layui-disabled': disabled }"
+      class="layui-input"
+      @input="onInput"
+      @focus="onFocus"
+      @blur="onBlur"
+    />
+    <span class="layui-input-suffix" v-if="slots.suffix">
+      <slot name="suffix"></slot>
+    </span>
+  </div>
 </template>