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

1.代码优化

v1.0.0
sws 2024-10-10 11:17:33 +08:00
parent 973506d2b9
commit 72a2bc368e
7 changed files with 34 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/components/page-settings/theme-4.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.0 KiB

After

Width:  |  Height:  |  Size: 9.2 KiB

BIN
src/assets/images/components/page-settings/theme-5.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB

BIN
src/assets/movie.mp4
View File

Binary file not shown.

18
src/components/common/common-styles/index.vue
View File

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

2
src/config/const/index.ts
View File

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

4
src/types/global.d.ts vendored
View File

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

23
src/utils/index.ts
View File

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