Merge branch 'dev-sws' into dev-yxl

v1.0.0
于肖磊 2024-10-10 11:20:40 +08:00
commit 3b9f3aa4aa
7 changed files with 34 additions and 13 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.0 KiB

After

Width:  |  Height:  |  Size: 9.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

View File

@ -11,14 +11,20 @@
<div class="flex-row jc-sb align-c">
<div class="size-12">背景图</div>
<el-radio-group v-model="form.background_img_style" is-button @change="background_img_style_change">
<el-tooltip content="单张" placement="top" effect="light">
<el-radio-button :value="0"><icon name="single-sheet"></icon></el-radio-button>
<el-tooltip content="居上" placement="top" effect="light">
<el-radio-button value="0"><icon name="spread-over"></icon></el-radio-button>
</el-tooltip>
<el-tooltip content="居下" placement="top" effect="light">
<el-radio-button value="1"><icon name="spread-over"></icon></el-radio-button>
</el-tooltip>
<el-tooltip content="居中" placement="top" effect="light">
<el-radio-button value="2"><icon name="single-sheet"></icon></el-radio-button>
</el-tooltip>
<el-tooltip content="平铺" placement="top" effect="light">
<el-radio-button :value="1"><icon name="tile"></icon></el-radio-button>
<el-radio-button value="3"><icon name="tile"></icon></el-radio-button>
</el-tooltip>
<el-tooltip content="铺满" placement="top" effect="light">
<el-radio-button :value="2"><icon name="spread-over"></icon></el-radio-button>
<el-radio-button value="4"><icon name="spread-over"></icon></el-radio-button>
</el-tooltip>
</el-radio-group>
</div>
@ -72,7 +78,7 @@ const props = defineProps({
direction: '180deg',
background_img: [] as uploadList[],
color_list: [{ color: '', color_percentage: undefined }] as color_list[],
background_img_style: 2,
background_img_style: '0',
floating_up: 0,
padding: 0,
padding_top: 0,
@ -115,7 +121,7 @@ const props = defineProps({
isFloatingUp: {
type: Boolean,
default: true,
}
},
});
// value
let form = ref(props.value);

View File

@ -1,7 +1,7 @@
const defaultCommon: componentsCommonCommonStyle = {
direction: '90deg',
color_list: [{ color: '', color_percentage: undefined }],
background_img_style: 2,
background_img_style: '0',
floating_up: 0,
padding: 0,
padding_top: 0,

View File

@ -77,7 +77,7 @@ declare global {
*/
type backgroundImgUrlStyle = {
background_img: uploadList[];
background_img_style: number;
background_img_style: string;
};
/**
@ -86,7 +86,7 @@ declare global {
type componentsCommonCommonStyle = {
color_list: color_list[];
direction: string;
background_img_style: number;
background_img_style: string;
floating_up: number;
padding: number;
padding_top: number;

View File

@ -1,7 +1,6 @@
import { createApp } from 'vue';
import { createPinia } from 'pinia';
import { commonStore } from '@/store';
import CommonAPI from '@/api/common';
import App from '@/App.vue';
const app = createApp(App);
const pinia = createPinia();
@ -196,13 +195,29 @@ export function box_shadow_computer(new_style: boxShadowStyle) {
export function background_computer(new_style: backgroundImgUrlStyle) {
if (new_style.background_img.length > 0) {
let url_styke = '';
if (new_style.background_img_style == 1) {
if (new_style.background_img_style == '1') {
url_styke = 'background-repeat: repeat;';
} else if (new_style.background_img_style == 2) {
url_styke = 'background-size: cover;background-position: center;';
} else if (new_style.background_img_style == '2') {
} else {
url_styke = `background-repeat: no-repeat;background-position: center;`;
}
switch (new_style.background_img_style) {
case '1':
url_styke = `background-repeat: no-repeat;background-position: bottom;background-size: 100% auto;`;
break;
case '2':
url_styke = `background-repeat: no-repeat;background-position: center;background-size: 100% auto;`;
break;
case '3':
url_styke = 'background-repeat: repeat;';
break;
case '4':
url_styke = 'background-size: cover;background-position: center;';
break;
default:
url_styke = `background-repeat: no-repeat;background-position: top;background-size: 100% auto;`;
break;
}
return `background-image:url(${new_style.background_img[0].url});${url_styke}`;
} else {
return '';