73 lines
2.1 KiB
Vue
73 lines
2.1 KiB
Vue
<template>
|
|
<view>
|
|
<template v-if="loading && modelValue.length == 0">
|
|
<u-loading-icon text="加载中" textSize="18"></u-loading-icon>
|
|
</template>
|
|
<template v-else-if="!loading && modelValue.length > 0">
|
|
<view class="form">
|
|
<view
|
|
class="px-[32rpx] flex flex-col gap-[24rpx]"
|
|
v-for="(item, index) in modelValue"
|
|
:key="`unique_${index}`"
|
|
>
|
|
<view class="prefix">{{ item.formTitle }}</view>
|
|
<view>
|
|
<u-input
|
|
v-if="item.formType == 1"
|
|
v-model="item.value"
|
|
placeholder="请输入"
|
|
border="surround"
|
|
></u-input>
|
|
<u-textarea
|
|
v-else-if="item.formType == 2"
|
|
v-model="item.value"
|
|
class="c-textarea"
|
|
placeholder="请输入"
|
|
></u-textarea>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<template v-else-if="!loading && modelValue.length == 0">
|
|
<view class="flex flex-col items-center text-gray4">
|
|
<image :src="emptyImg" />
|
|
<text>暂无模板可填写</text>
|
|
</view>
|
|
</template>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { PropType } from 'vue'
|
|
import emptyImg from '@/static/images/error.png'
|
|
|
|
export interface ISummary {
|
|
formTitle: string
|
|
formType: number
|
|
value: string
|
|
}
|
|
defineProps({
|
|
modelValue: {
|
|
type: Array as PropType<ISummary[]>,
|
|
default: () => []
|
|
},
|
|
loading: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
})
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.form {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 32rpx;
|
|
.prefix {
|
|
&::before {
|
|
content: '* ';
|
|
color: #f5222d;
|
|
}
|
|
}
|
|
}
|
|
</style>
|