新增矩形和圆角组件

master
于肖磊 2025-07-04 18:16:34 +08:00
parent 23300ffea5
commit 3b9d404b46
4 changed files with 64 additions and 7 deletions

View File

@ -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');

View File

@ -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) {

View File

@ -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: {

View File

@ -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>