新增矩形和圆角组件
parent
23300ffea5
commit
3b9d404b46
|
|
@ -103,7 +103,7 @@
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
open_ragion() {
|
open_ragion() {
|
||||||
this.$emit('openRegion', this.propDataId, this.province_id, this.city_id, this.county_id);
|
this.$emit('openRegion', { id: this.propDataId, province_id: this.province_id, city_id: this.city_id, county_id: this.county_id});
|
||||||
},
|
},
|
||||||
data_check(val) {
|
data_check(val) {
|
||||||
const { is_error = '0', error_text = '' } = get_format_checks(this.com_data, val, true, 'number');
|
const { is_error = '0', error_text = '' } = get_format_checks(this.com_data, val, true, 'number');
|
||||||
|
|
|
||||||
|
|
@ -253,13 +253,13 @@ export default {
|
||||||
this.setData({ popup_help_content: val });
|
this.setData({ popup_help_content: val });
|
||||||
this.$refs.popup.open();
|
this.$refs.popup.open();
|
||||||
},
|
},
|
||||||
open_region(id, province_id, city_id, county_id) {
|
open_region(e) {
|
||||||
this.setData({
|
this.setData({
|
||||||
region_picker_show: true,
|
region_picker_show: true,
|
||||||
province_id,
|
province_id: e?.province_id || '',
|
||||||
city_id,
|
city_id: e?.city_id || '',
|
||||||
county_id,
|
county_id: e?.county_id || '',
|
||||||
address_id: id,
|
address_id: e?.id || '',
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
close_event(e) {
|
close_event(e) {
|
||||||
|
|
|
||||||
|
|
@ -87,6 +87,9 @@
|
||||||
<view v-else-if="item.key == 'position'">
|
<view v-else-if="item.key == 'position'">
|
||||||
<component-position :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" @dataChange="data_change"></component-position>
|
<component-position :propValue="item.com_data" :propKey="propKey" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" @dataChange="data_change"></component-position>
|
||||||
</view>
|
</view>
|
||||||
|
<view v-else-if="['rect', 'round'].includes(item.key)" :class="propIsCustom ? 'wh-auto ht-auto' : ''">
|
||||||
|
<component-rect-or-round :propValue="item.com_data" :propKey="propKey"></component-rect-or-round>
|
||||||
|
</view>
|
||||||
<!-- #ifdef H5 || MP-WEIXIN || MP-QQ -->
|
<!-- #ifdef H5 || MP-WEIXIN || MP-QQ -->
|
||||||
<view v-else-if="item.key == 'upload-attachments'">
|
<view v-else-if="item.key == 'upload-attachments'">
|
||||||
<component-upload :propValue="item.com_data" :propType="item.key == 'upload-img' ? 'img' : ( item.key == 'upload-video' ? 'video' : 'file')" :propKey="propKey" :propDataFormId="propDataFormId" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" @dataChange="data_change"></component-upload>
|
<component-upload :propValue="item.com_data" :propType="item.key == 'upload-img' ? 'img' : ( item.key == 'upload-video' ? 'video' : 'file')" :propKey="propKey" :propDataFormId="propDataFormId" :propDataId="item.id" :propMobile="propMobile" :propStyle="propComponentStyle" :propDirection="propDirection" @dataChange="data_change"></component-upload>
|
||||||
|
|
@ -127,6 +130,7 @@ import componentAuxiliaryLine from '@/pages/form-input/components/form-input/aux
|
||||||
import componentRichText from '@/pages/form-input/components/form-input/rich-text.vue';
|
import componentRichText from '@/pages/form-input/components/form-input/rich-text.vue';
|
||||||
import componentUpload from '@/pages/form-input/components/form-input/upload.vue';
|
import componentUpload from '@/pages/form-input/components/form-input/upload.vue';
|
||||||
import componentPosition from '@/pages/form-input/components/form-input/position.vue';
|
import componentPosition from '@/pages/form-input/components/form-input/position.vue';
|
||||||
|
import componentRectOrRound from '@/pages/form-input/components/form-input/rect-or-round.vue';
|
||||||
export default {
|
export default {
|
||||||
name: 'formInput',
|
name: 'formInput',
|
||||||
components: {
|
components: {
|
||||||
|
|
@ -150,7 +154,8 @@ export default {
|
||||||
componentAuxiliaryLine,
|
componentAuxiliaryLine,
|
||||||
componentRichText,
|
componentRichText,
|
||||||
componentUpload,
|
componentUpload,
|
||||||
componentPosition
|
componentPosition,
|
||||||
|
componentRectOrRound
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
propValue: {
|
propValue: {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
<template>
|
||||||
|
<view class="rendering-area wh-auto ht-auto pa-3">
|
||||||
|
<view class="wh-auto ht-auto" :style="border_style"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { isEmpty } from '@/common/js/common/common.js';
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
propValue: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
propKey: {
|
||||||
|
type: [String, Number],
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
border_style: '',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
propKey(val) {
|
||||||
|
// 初始化
|
||||||
|
this.init();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.init();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
isEmpty,
|
||||||
|
// 初始化数据
|
||||||
|
init() {
|
||||||
|
const com_data = this.propValue;
|
||||||
|
this.setData({
|
||||||
|
border_style: `${ com_data.type == 'rect' ? '' : 'border-radius: 50%;'}box-sizing: border-box;border: ${ com_data.border_size }px ${ com_data.border_style } ${ com_data.border_color};`,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.pa-3 {
|
||||||
|
padding: 6rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue