sileya-ai
/
vr-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改头部定位边框显示

v1.1.0^2
于肖磊 2024-12-24 09:50:46 +08:00
parent 7a958b8899
commit 0ddb4150b9
4 changed files with 22 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/page-settings/index.vue
View File

@ -182,19 +182,14 @@ const style_location_container = computed(() => {
});
// 背景图片
const style_location_img_container = computed(() => {
const { location_background_img, location_background_img_style, location_padding, location_border_direction, location_border_size, location_border_color, location_margin } = new_style.value;
const { location_background_img, location_background_img_style, location_padding, location_border_size, location_border_color, location_margin, location_border_style = 'solid' } = new_style.value;
const style = {
background_img: location_background_img,
background_img_style: location_background_img_style,
}
let border = ``;
if (new_style.value.location_border_show == '1') {
// 边框
if (location_border_direction == 'all') {
border += `border: ${location_border_size}px solid ${location_border_color};`;
} else {
border += `border-${location_border_direction}: ${location_border_size}px solid ${location_border_color};`;
}
border += `border-width: ${location_border_size.padding_top}px ${location_border_size.padding_right}px ${location_border_size.padding_bottom}px ${location_border_size.padding_left}px;border-style: ${ location_border_style };border-color: ${location_border_color};`
}
const height = 32 - location_margin.margin_top - location_margin.margin_bottom;
return background_computer(style) + padding_computer(location_padding) + radius_computer(new_style.value.location_radius) + border + `height: ${height}px;line-height: ${height}px;`;

10
src/components/page-settings/page-setting.vue
View File

@ -82,8 +82,14 @@ const default_data = {
location_right_icon_size: 12,
location_border_show: '0',
location_border_color: '#FF3F3F',
location_border_direction: 'all',
location_border_size: 1,
location_border_style: 'solid',
location_border_size: {
padding: 0,
padding_top: 0,
padding_right: 0,
padding_bottom: 0,
padding_left: 0,
},
location_radius: {
radius: 0,
radius_top_left: 0,

26
src/components/page-settings/page-styles.vue
View File

@ -102,26 +102,8 @@
<el-form-item label="外边距">
<margin :value="form.location_margin"></margin>
</el-form-item>
<el-form-item label="边框">
<el-switch v-model="form.location_border_show" active-value="1" inactive-value="0" />
</el-form-item>
<template v-if="form.location_border_show == '1'">
<el-form-item label="边框颜色">
<color-picker v-model="form.location_border_color" default-color="#FF3F3F"></color-picker>
</el-form-item>
<el-form-item label="边框位置">
<el-radio-group v-model="form.location_border_direction">
<el-radio value="all">全部</el-radio>
<el-radio value="left">左侧</el-radio>
<el-radio value="right">右侧</el-radio>
<el-radio value="top">上边框</el-radio>
<el-radio value="bottom">下边框</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="边框粗细">
<slider v-model="form.location_border_size" :max="100"></slider>
</el-form-item>
</template>
<!-- 边框处理 -->
<border-config v-model:show="form.location_border_show" v-model:color="form.location_border_color" v-model:style="form.location_border_style" v-model:size="form.location_border_size" :type-list="['color', 'style', 'size']" default-color="#FF3F3F"></border-config>
</card-container>
</template>
<div class="bg-f5 divider-line" />
@ -214,10 +196,6 @@ const location_mult_color_picker_event = (arry: color_list[], type: number) => {
form.value.location_color_list = arry;
form.value.location_direction = type.toString();
};
// 定位背景图片处理
const location_background_img_change = (val: uploadList[]) => {
form.value.location_background_img = val;
};
const change_immersive_style = (val: string | number | boolean) => {
if (val === '0') {

14
src/config/const/header-nav.ts
View File

@ -82,8 +82,8 @@ interface DefaultFooterNav {
location_right_icon_size: number;
location_border_show: string;
location_border_color: string;
location_border_direction: string;
location_border_size: number;
location_border_style: string;
location_border_size: paddingStyle;
location_radius: radiusStyle;
location_padding: paddingStyle;
location_margin: marginStyle;
@ -184,8 +184,14 @@ const defaultFooterNav: DefaultFooterNav = {
location_right_icon_size: 12,
location_border_show: '0',
location_border_color: '#FF3F3F',
location_border_direction: 'all',
location_border_size: 1,
location_border_style: 'solid',
location_border_size: {
padding: 0,
padding_top: 0,
padding_right: 0,
padding_bottom: 0,
padding_left: 0,
},
location_radius: {
radius: 0,
radius_top_left: 0,