You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
67 lines
1.7 KiB
67 lines
1.7 KiB
9 months ago
|
<template>
|
||
|
|
<u-form :model="formValue" ref="dataForm" :errorType="['toast']"
|
||
|
|
:label-position="formConf.labelPosition==='top'?'top':'left'"
|
||
|
|
:label-width="formConf.labelWidth<=120 ? 120*1.5:formConf.labelWidth*1.5"
|
||
|
|
:label-align="formConf.labelPosition==='right'?'right':'left'" :class='formConf.className'>
|
||
|
|
<template v-for="(item, index) in formConf.fields">
|
||
|
|
<Item :key="item.__config__.renderKey" :item="item" :formConf="formConf" @blur="onBlur"
|
||
|
|
:class="item.__config__.className" :formValue="formValue" @click="onButtonClick"
|
||
|
|
:ref="item.__vModel__?item.__vModel__: undefined" @toDetail="toDetail" @clickIcon='clickIcon' />
|
||
|
|
</template>
|
||
|
|
<u-modal v-model="show" :content="content" width='70%' border-radius="16" :content-style="contentStyle"
|
||
|
|
:titleStyle="titleStyle" :confirm-style="confirmStyle" :title="title">
|
||
|
|
</u-modal>
|
||
|
|
</u-form>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import Item from './Item'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
Item
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
formConf: {
|
||
|
|
type: Object,
|
||
|
|
required: true
|
||
|
|
},
|
||
|
|
formValue: {
|
||
|
|
type: Object,
|
||
|
|
},
|
||
|
|
loading: {
|
||
|
|
type: Boolean,
|
||
|
|
default: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
show: false,
|
||
|
|
content: '',
|
||
|
|
contentStyle: {
|
||
|
|
fontSize: '28rpx',
|
||
|
|
padding: '20rpx',
|
||
|
|
lineHeight: '44rpx',
|
||
|
|
textAlign: 'left'
|
||
|
|
},
|
||
|
|
titleStyle: {
|
||
|
|
padding: '20rpx'
|
||
|
|
},
|
||
|
|
confirmStyle: {
|
||
|
|
height: '80rpx',
|
||
|
|
lineHeight: '80rpx',
|
||
|
|
},
|
||
|
|
title: '提示',
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
clickIcon(e) {
|
||
|
|
if (!e.__config__.tipLabel && !e.tipLabel) return
|
||
|
|
this.content = e.tipLabel || e.__config__.tipLabel
|
||
|
|
this.title = e.__config__.label
|
||
|
|
this.show = true
|
||
|
|
},
|
||
|
|
toDetail(item) {
|
||
|
|
this.$emit('toDetail', item)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|