dz-app/components/mx-form-item/mx-form-item.vue

<template>
    <uv-form-item :prop="prop">
        <template v-if="!$slots.default">
            <uv-input :model-value="modelValue" :disabled="disabled" input-align="right" border="bottom"
                      disabled-color="transparent" :color="disabled?'var(--disabled-color)':undefined"
                      :type="type" :placeholder="autoPlaceholder" @input="$emit('update:modelValue', $event)">
                <template #prefix>
                    <slot name="prefix">
                        <view class="text-main font-bold break-keep fx-row gap-3">
                            {{ label }}
                            <uv-icon name="lock" v-if="disabled"/>
                        </view>
                    </slot>
                </template>
                <template v-if="$slots.suffix" #suffix>
                    <slot name="suffix"/>
                </template>
            </uv-input>
        </template>
        <template v-else>
            <view
                class="flex-1 px-[10px] py-[7px] fx-row items-center mx-border-b">
                <view class="text-main font-bold break-keep fx-row gap-3">
                    {{ label }}
                    <uv-icon name="lock" v-if="disabled"/>
                </view>
                <view class="flex-1">
                    <slot/>
                </view>
            </view>
        </template>
    </uv-form-item>
</template>

<script setup>
import {computed} from 'vue'
import {createPropDefine} from "@/utils";

const props = defineProps({
    prop: createPropDefine(''),
    label: createPropDefine(''),
    placeholder: createPropDefine(''),
    modelValue: createPropDefine('', [String, Number]),
    disabled: createPropDefine(false, Boolean),
    type: createPropDefine(undefined)
})
defineEmits(['input', 'update:modelValue'])

const autoPlaceholder = computed(() => props.placeholder || '请输入' + props.label)
</script>

<style scoped lang="scss">
::v-deep .uv-form-item__body__right__message {
    margin-left: 0 !important;
}
</style>