Merge branch 'master' of ssh://dev.zhiheiot.com:29418/mob-components

‘chensiAb’

2025-03-25 3b03f87a02458f719e2eb4bf112a13441b427d14

 forms/input/CInput.vue

@@ -1,22 +1,37 @@
/**
 * CInput
 * CInput - 表单项，文本输入框
 * 用于在表单中收集用户的文本输入
 * 支持多种输入类型，可以设置占位提示文本，并且支持显示单位标识
 * @author Tevin
 */

<template>
    <AtInput
        :name="itemRes.name"
        :title="itemRes.label"
        :type="type"
        :placeholder="placeholder"
        :required="itemRes.required"
        :error="itemRes.error"
        :value="itemRes.formData[itemRes.name]"
        :onChange="evt=>itemRes.onChange(evt)"
    <view
        class="c-input"
        :class="[unit?'c-input-unit':'', readOnly?'read-only':'']"
    >
        <slot />
    </AtInput>
</template><script>
        <AtInput
            :name="itemRes.name"
            :title="itemRes.label"
            :type="type"
            :placeholder="placeholder"
            :required="itemRes.required"
            :error="itemRes.error"
            :cursorSpacing="0"
            :cursor="-1"
            :value="value"
            :onChange="evt => handleChange(evt)"
        >
            <slot v-if="!unit" />
            <text
                class="c-input-unit-text"
                v-if="unit"
            >{{unit}}</text>
        </AtInput>
    </view>
</template>

<script>
import { AtInput } from 'taro-ui-vue';
import './cInput.scss';

@@ -26,9 +41,36 @@
        AtInput,
    },
    props: {
        type: String,
        placeholder: String,
        // 表单数据资源（表单组件内部机制专用）
        itemRes: Object,
        // 输入框类型，text、number、password、phone、idcard、digit
        type: String,
        // 占位提示
        placeholder: String,
        // 输入框单位
        unit: String,
        // 只读模式
        readOnly: {
            type: Boolean,
            default: false,
        },
    },
    computed: {
        value() {
            return ((this.itemRes.formData[this.itemRes.name] || '') + '').replace(
                /[\n\r]/g,
                '',
            );
        },
    },
    methods: {
        handleChange(evt) {
            // 去除首尾空格，小程序中还可以粘贴换行符进来
            const changeValue = ((evt || '') + '')
                .replace(/^\s+|\s+$/g, '')
                .replace(/[\n\r\t]/g, '');
            this.itemRes.onChange(changeValue);
        },
    },
    mounted() {},
};