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

Merge remote-tracking branch 'origin/dev-yxl' into dev-sws

v1.0.0
sws 2024-08-29 15:30:56 +08:00
parent 2e5c4cdfa1 6c6395fdac
commit 4b7d4a95fc
15 changed files with 124 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -78,14 +78,10 @@ const props = defineProps({
}, },
}); });
// 初始化表单数据 // 初始化表单数据
interface color_form {
color: string;
color_percentage: number | undefined;
}
const init_form = reactive({ const init_form = reactive({
direction: '180deg', direction: '180deg',
background_img_url: [] as uploadList[], background_img_url: [] as uploadList[],
color_list: [{ color: '', color_percentage: undefined }] as color_form[], color_list: [{ color: '', color_percentage: undefined }] as color_list[],
background_img_style: 2, background_img_style: 2,
padding: 0, padding: 0,
padding_top: 0, padding_top: 0,
@ -112,7 +108,7 @@ const init_form = reactive({
let form = reactive(Object.assign({}, init_form, props.value)); let form = reactive(Object.assign({}, init_form, props.value));
const emit = defineEmits(['update:value']); const emit = defineEmits(['update:value']);
const mult_color_picker_event = (arry: color_form[], type: number) => { const mult_color_picker_event = (arry: color_list[], type: number) => {
form.color_list = arry; form.color_list = arry;
form.direction = type.toString(); form.direction = type.toString();
emit('update:value', form); emit('update:value', form);

6
src/components/common/product-show-config/index.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<card-container class="card-container-br"> <card-container>
<div class="mb-12">显示内容</div> <div class="mb-12">显示内容</div>
<el-form-item label="是否显示"> <el-form-item label="是否显示">
<el-checkbox-group v-model="form.is_show"> <el-checkbox-group v-model="form.is_show">
@ -10,6 +10,7 @@
<el-switch v-model="form.is_price_solo"></el-switch> <el-switch v-model="form.is_price_solo"></el-switch>
</el-form-item> </el-form-item>
</card-container> </card-container>
<div class="bg-f5 divider-line" />
<card-container> <card-container>
<div class="mb-12">购物车设置</div> <div class="mb-12">购物车设置</div>
<el-form-item label="是否显示"> <el-form-item label="是否显示">
@ -81,9 +82,6 @@ const change_shop_type = () => {
margin-bottom: 0; margin-bottom: 0;
} }
} }
.card-container-br {
border-bottom: 0.8rem solid #f0f2f5;
}
.shopping_button { .shopping_button {
height: 2.7rem; height: 2.7rem;
line-height: 2.7rem; line-height: 2.7rem;

8
src/components/model-data-magic/model-data-magic-content.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="auxiliary-line common-content-height"> <div class="w h">
<el-form :model="form" label-width="80"> <el-form :model="form" label-width="80">
<card-container class="mb-8"> <card-container>
<div class="mb-12">展示风格</div> <div class="mb-12">展示风格</div>
<el-form-item label="选择风格"> <el-form-item label="选择风格">
<div class="flex align-c flex-wrap gap-10"> <div class="flex align-c flex-wrap gap-10">
@ -11,7 +11,8 @@
</div> </div>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">展示设置</div> <div class="mb-12">展示设置</div>
<el-form-item label-width="0" class="show-config"> <el-form-item label-width="0" class="show-config">
<!-- 风格9 --> <!-- 风格9 -->
@ -31,6 +32,7 @@
</template> </template>
</el-form-item> </el-form-item>
</card-container> </card-container>
<div class="bg-f5 divider-line" />
<el-tabs v-model="tabs_name" class="content-tabs"> <el-tabs v-model="tabs_name" class="content-tabs">
<el-tab-pane label="内容设置" name="content"> <el-tab-pane label="内容设置" name="content">
<tabs-content :value="form.data_magic_list[selected_active].data_content" :is-show-title="is_show_title"></tabs-content> <tabs-content :value="form.data_magic_list[selected_active].data_content" :is-show-title="is_show_title"></tabs-content>

3
src/components/model-data-magic/model-data-magic-styles.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="w"> <div class="w">
<el-form :model="form" label-width="70"> <el-form :model="form" label-width="70">
<card-container class="mb-8"> <card-container>
<div class="mb-12">数据魔方</div> <div class="mb-12">数据魔方</div>
<el-form-item label="数据间距"> <el-form-item label="数据间距">
<slider v-model="form.image_spacing" :max="100"></slider> <slider v-model="form.image_spacing" :max="100"></slider>
@ -14,6 +14,7 @@
</el-form-item> </el-form-item>
</card-container> </card-container>
</el-form> </el-form>
<div class="bg-f5 divider-line" />
<common-styles :value="form.common_style" @update:value="common_style_update" /> <common-styles :value="form.common_style" @update:value="common_style_update" />
</div> </div>
</template> </template>

10
src/components/model-img-magic/model-img-magic-content.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="auxiliary-line common-content-height"> <div class="w h">
<el-form :model="form" label-width="60"> <el-form :model="form" label-width="60">
<card-container class="mb-8"> <card-container>
<div class="mb-12">展示风格</div> <div class="mb-12">展示风格</div>
<el-form-item label="选择风格"> <el-form-item label="选择风格">
<div class="flex align-c flex-wrap gap-10"> <div class="flex align-c flex-wrap gap-10">
@ -11,7 +11,8 @@
</div> </div>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">展示设置</div> <div class="mb-12">展示设置</div>
<el-form-item label-width="0" class="show-config"> <el-form-item label-width="0" class="show-config">
<!-- 风格3 --> <!-- 风格3 -->
@ -48,7 +49,8 @@
</template> </template>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">内容设置</div> <div class="mb-12">内容设置</div>
<template v-if="!isEmpty(form.img_magic_list[selected_active])"> <template v-if="!isEmpty(form.img_magic_list[selected_active])">
<el-form-item label="上传图片"> <el-form-item label="上传图片">

3
src/components/model-img-magic/model-img-magic-styles.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="w"> <div class="w">
<el-form :model="form" label-width="70"> <el-form :model="form" label-width="70">
<card-container class="mb-8"> <card-container>
<div class="mb-12">图片魔方</div> <div class="mb-12">图片魔方</div>
<el-form-item label="图片间距"> <el-form-item label="图片间距">
<slider v-model="form.image_spacing" :max="100"></slider> <slider v-model="form.image_spacing" :max="100"></slider>
@ -11,6 +11,7 @@
</el-form-item> </el-form-item>
</card-container> </card-container>
</el-form> </el-form>
<div class="bg-f5 divider-line" />
<common-styles :value="form.common_style" @update:value="common_style_update" /> <common-styles :value="form.common_style" @update:value="common_style_update" />
</div> </div>
</template> </template>

24
src/components/model-notice/index.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div :style="style_container"> <div :style="style_container">
<template v-if="form.notice_style == 'inherit'"> <template v-if="form.notice_style == 'inherit'">
<div class="flex-row align-c news-box gap-y-8"> <div class="flex-row align-c news-box gap-y-8" :style="container_background_style">
<template v-if="form.title_type == 'img-icon'"> <template v-if="form.title_type == 'img-icon'">
<div v-if="!isEmpty(form.img_src)"> <div v-if="!isEmpty(form.img_src)">
<image-empty v-model="form.img_src[0]" :style="img_style"></image-empty> <image-empty v-model="form.img_src[0]" :style="img_style"></image-empty>
@ -20,7 +20,7 @@
</div> </div>
</template> </template>
<template v-else> <template v-else>
<div class="news-card flex-col gap-10"> <div class="news-card flex-col gap-10" :style="container_background_style">
<div class="flex-row w jc-sb"> <div class="flex-row w jc-sb">
<template v-if="form.title_type == 'img-icon'"> <template v-if="form.title_type == 'img-icon'">
<template v-if="!isEmpty(form.icon_class)"> <template v-if="!isEmpty(form.icon_class)">
@ -41,7 +41,7 @@
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { common_styles_computer, get_math, gradient_handle } from '@/utils'; import { background_computer, common_styles_computer, get_math, gradient_computer, gradient_handle, radius_computer } from '@/utils';
import { isEmpty, cloneDeep } from 'lodash'; import { isEmpty, cloneDeep } from 'lodash';
const props = defineProps({ const props = defineProps({
@ -62,6 +62,19 @@ const { form, new_style } = toRefs(state);
// 用于样式显示 // 用于样式显示
const style_container = computed(() => common_styles_computer(new_style.value.common_style)); const style_container = computed(() => common_styles_computer(new_style.value.common_style));
// 容器高度
const container_height = computed(() => new_style.value.container_height + 'px');
// 容器背景
const container_background_style = computed(() => {
const { container_color_list, container_direction, container_background_img_style, container_background_img_url } = new_style.value;
const styles = {
color_list: container_color_list,
direction: container_direction,
background_img_url: container_background_img_url,
background_img_style: container_background_img_style,
};
return gradient_computer(styles) + radius_computer(new_style.value.container_radius) + background_computer(styles) + `overflow:hidden;`;
});
// 图片设置 // 图片设置
const img_style = ref(''); const img_style = ref('');
// 标题的设置 // 标题的设置
@ -128,7 +141,8 @@ watchEffect(() => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.news-box { .news-box {
height: 4.4rem; min-height: 4.4rem;
overflow: hidden;
padding: 0 1rem; padding: 0 1rem;
background: #fff; background: #fff;
} }
@ -160,7 +174,7 @@ watchEffect(() => {
} }
:deep(.el-carousel) { :deep(.el-carousel) {
.el-carousel__container { .el-carousel__container {
height: 4.4rem; height: v-bind(container_height);
.el-carousel__item { .el-carousel__item {
line-height: 4.4rem; line-height: 4.4rem;
overflow: hidden; overflow: hidden;

13
src/components/model-notice/model-notice-content.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="auxiliary-line common-content-height"> <div class="w h">
<el-form :model="form" label-width="70"> <el-form :model="form" label-width="70">
<card-container class="mb-8"> <card-container>
<div class="mb-12">展示设置</div> <div class="mb-12">展示设置</div>
<el-form-item label="选择风格"> <el-form-item label="选择风格">
<el-radio-group v-model="form.notice_style" class="ml-4"> <el-radio-group v-model="form.notice_style" class="ml-4">
@ -10,7 +10,8 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">公告风格</div> <div class="mb-12">公告风格</div>
<el-form-item label="标题类型"> <el-form-item label="标题类型">
<el-radio-group v-model="form.title_type" class="ml-4"> <el-radio-group v-model="form.title_type" class="ml-4">
@ -36,7 +37,8 @@
</el-form-item> </el-form-item>
</template> </template>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">按钮设置</div> <div class="mb-12">按钮设置</div>
<el-form-item label="右侧按钮"> <el-form-item label="右侧按钮">
<el-radio-group v-model="form.is_right_button" class="ml-4"> <el-radio-group v-model="form.is_right_button" class="ml-4">
@ -48,7 +50,8 @@
<url-value v-model="form.more_link"></url-value> <url-value v-model="form.more_link"></url-value>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">内容设置</div> <div class="mb-12">内容设置</div>
<drag :data="form.notice_list" type="card" :space-col="25" @remove="remove" @on-sort="on_sort"> <drag :data="form.notice_list" type="card" :space-col="25" @remove="remove" @on-sort="on_sort">
<template #default="scoped"> <template #default="scoped">

39
src/components/model-notice/model-notice-styles.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="common-style-height"> <div class="w h">
<el-form :model="form" label-width="80"> <el-form :model="form" label-width="80">
<card-container class="mb-8"> <card-container>
<div class="mb-12">标题样式</div> <div class="mb-12">标题样式</div>
<template v-if="!is_img"> <template v-if="!is_img">
<el-form-item label="标题文字"> <el-form-item label="标题文字">
@ -29,6 +29,35 @@
</el-form-item> </el-form-item>
</template> </template>
</template> </template>
<template v-if="substance.notice_style === 'inherit'">
<el-form-item label="容器高度">
<slider v-model="form.container_height" :max="1000"></slider>
</el-form-item>
</template>
<el-form-item label="容器背景">
<div class="flex-col gap-10 w">
<div class="size-12">背景色</div>
<mult-color-picker :value="form.container_color_list" :type="form.container_direction" @update:value="mult_color_picker_event"></mult-color-picker>
<div class="flex-row jc-sb align-c">
<div class="size-12">背景图</div>
<el-radio-group v-model="form.container_background_img_style" is-button>
<el-tooltip content="单张" placement="top" effect="light">
<el-radio-button value="0"><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-tooltip>
<el-tooltip content="铺满" placement="top" effect="light">
<el-radio-button value="2"><icon name="spread-over"></icon></el-radio-button>
</el-tooltip>
</el-radio-group>
</div>
<upload v-model="form.container_background_img_url" :limit="1"></upload>
</div>
</el-form-item>
<el-form-item label="容器圆角">
<radius :value="form.container_radius"></radius>
</el-form-item>
<el-form-item label="按钮颜色"> <el-form-item label="按钮颜色">
<color-picker v-model="form.button_color" default-color="#999"></color-picker> <color-picker v-model="form.button_color" default-color="#999"></color-picker>
</el-form-item> </el-form-item>
@ -37,6 +66,7 @@
</el-form-item> </el-form-item>
</card-container> </card-container>
</el-form> </el-form>
<div class="bg-f5 divider-line" />
<common-styles :value="form.common_style" @update:value="common_styles_update" /> <common-styles :value="form.common_style" @update:value="common_styles_update" />
</div> </div>
</template> </template>
@ -65,6 +95,11 @@ const is_img = computed(() => substance.value.title_type == 'img-icon');
const common_styles_update = (val: Object) => { const common_styles_update = (val: Object) => {
form.value.common_style = val; form.value.common_style = val;
}; };
const mult_color_picker_event = (arry: color_list[], type: number) => {
form.value.container_color_list = arry;
form.value.container_direction = type.toString();
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.card.mb-8 { .card.mb-8 {

2
src/components/model-search/model-search-content.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="auxiliary-line common-content-height bg-f"> <div class="w h">
<el-form :model="form" label-width="70"> <el-form :model="form" label-width="70">
<card-container> <card-container>
<div class="mb-12">展示设置</div> <div class="mb-12">展示设置</div>

11
src/components/model-search/model-search-styles.vue
View File

@ -1,13 +1,14 @@
<template> <template>
<div class="common-style-height"> <div class="w h">
<el-form :model="form" label-width="70"> <el-form :model="form" label-width="70">
<card-container class="mb-8"> <card-container>
<div class="mb-12">左侧图标</div> <div class="mb-12">左侧图标</div>
<el-form-item label="图标"> <el-form-item label="图标">
<color-picker v-model="form.icon_color" default-color="#CCCCCC"></color-picker> <color-picker v-model="form.icon_color" default-color="#CCCCCC"></color-picker>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">搜索按钮</div> <div class="mb-12">搜索按钮</div>
<el-form-item label="搜索按钮"> <el-form-item label="搜索按钮">
<color-picker v-model="form.button_inner_color" default-color="#fff"></color-picker> <color-picker v-model="form.button_inner_color" default-color="#fff"></color-picker>
@ -37,7 +38,8 @@
<radius :value="form.search_button_radius" @update:value="button_radius_change"></radius> <radius :value="form.search_button_radius" @update:value="button_radius_change"></radius>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">框体样式</div> <div class="mb-12">框体样式</div>
<el-form-item label="提示文字"> <el-form-item label="提示文字">
<color-picker v-model="form.tips_color" default-color="#CCCCCC"></color-picker> <color-picker v-model="form.tips_color" default-color="#CCCCCC"></color-picker>
@ -53,6 +55,7 @@
</el-form-item> </el-form-item>
</card-container> </card-container>
</el-form> </el-form>
<div class="bg-f5 divider-line" />
<common-styles :value="form.common_style" @update:value="common_styles_update" /> <common-styles :value="form.common_style" @update:value="common_styles_update" />
</div> </div>
</template> </template>

10
src/components/model-text-title/model-text-title-content.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="auxiliary-line common-content-height"> <div class="w h">
<el-form :model="form" label-width="70"> <el-form :model="form" label-width="70">
<card-container class="mb-8"> <card-container>
<div class="mb-12">标题设置</div> <div class="mb-12">标题设置</div>
<el-form-item label="标题名字"> <el-form-item label="标题名字">
<el-input v-model="form.title" placeholder="请输入标题"></el-input> <el-input v-model="form.title" placeholder="请输入标题"></el-input>
@ -10,7 +10,8 @@
<url-value v-model="form.title_link"></url-value> <url-value v-model="form.title_link"></url-value>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">关键字设置</div> <div class="mb-12">关键字设置</div>
<el-form-item label="关键字"> <el-form-item label="关键字">
<el-radio-group v-model="form.keyword_show" class="ml-4"> <el-radio-group v-model="form.keyword_show" class="ml-4">
@ -37,7 +38,8 @@
<el-button class="mt-20 mb-20 w" @click="add">+添加</el-button> <el-button class="mt-20 mb-20 w" @click="add">+添加</el-button>
</template> </template>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">更多设置</div> <div class="mb-12">更多设置</div>
<el-form-item label="右侧按钮"> <el-form-item label="右侧按钮">
<el-radio-group v-model="form.right_show" class="ml-4"> <el-radio-group v-model="form.right_show" class="ml-4">

11
src/components/model-text-title/model-text-title-styles.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="common-style-height"> <div class="w h">
<el-form :model="form" label-width="80"> <el-form :model="form" label-width="80">
<card-container class="mb-8"> <card-container>
<div class="mb-12">标题设置</div> <div class="mb-12">标题设置</div>
<el-form-item label="标题颜色"> <el-form-item label="标题颜色">
<color-picker v-model="form.title_color" default-color="#000000"></color-picker> <color-picker v-model="form.title_color" default-color="#000000"></color-picker>
@ -17,7 +17,8 @@
</el-form-item> </el-form-item>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">关键字设置</div> <div class="mb-12">关键字设置</div>
<el-form-item label="文字颜色"> <el-form-item label="文字颜色">
<color-picker v-model="form.keyword_color" default-color="#000000"></color-picker> <color-picker v-model="form.keyword_color" default-color="#000000"></color-picker>
@ -26,7 +27,8 @@
<slider v-model="form.keyword_size" :max="100"></slider> <slider v-model="form.keyword_size" :max="100"></slider>
</el-form-item> </el-form-item>
</card-container> </card-container>
<card-container class="mb-8"> <div class="bg-f5 divider-line" />
<card-container>
<div class="mb-12">更多设置</div> <div class="mb-12">更多设置</div>
<el-form-item label="按钮颜色"> <el-form-item label="按钮颜色">
<color-picker v-model="form.right_color" default-color="#999"></color-picker> <color-picker v-model="form.right_color" default-color="#999"></color-picker>
@ -36,6 +38,7 @@
</el-form-item> </el-form-item>
</card-container> </card-container>
</el-form> </el-form>
<div class="bg-f5 divider-line" />
<common-styles :value="form.common_style" @update:value="common_styles_update" /> <common-styles :value="form.common_style" @update:value="common_styles_update" />
</div> </div>
</template> </template>

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

@ -1,7 +1,7 @@
<template> <template>
<div class="styles"> <div class="w h">
<el-form :model="form" label-width="70" class="m-h"> <el-form :model="form" label-width="70" class="m-h">
<card-container class="mb-8"> <card-container>
<div class="mb-12">头部样式</div> <div class="mb-12">头部样式</div>
<el-form-item label="顶部背景"> <el-form-item label="顶部背景">
<div class="flex-col gap-10"> <div class="flex-col gap-10">
@ -52,6 +52,7 @@
</el-form-item> </el-form-item>
</card-container> </card-container>
</el-form> </el-form>
<div class="bg-f5 divider-line" />
<common-styles :value="form.common_style" :is-margin="false" :is-shadow="false" :is-radius="false" @update:value="common_styles_update" /> <common-styles :value="form.common_style" :is-margin="false" :is-shadow="false" :is-radius="false" @update:value="common_styles_update" />
</div> </div>
</template> </template>
@ -71,7 +72,7 @@ let form = reactive(props.value);
const common_styles_update = (val: Object) => { const common_styles_update = (val: Object) => {
form.common_style = val; form.common_style = val;
}; };
const mult_color_picker_event = (arry: string[], type: number) => { const mult_color_picker_event = (arry: color_list[], type: number) => {
form.background_color_list = arry; form.background_color_list = arry;
form.background_direction = type.toString(); form.background_direction = type.toString();
}; };

16
src/layout/components/main/default/notice.ts
View File

@ -33,6 +33,11 @@ interface defaultSearch {
topic_height: number; topic_height: number;
icon_size: number; icon_size: number;
icon_color: string; icon_color: string;
container_color_list: color_list[],
container_direction: string,
container_background_img_style: string,
container_background_img_url: uploadList[],
container_radius: radiusStyle,
common_style: object; common_style: object;
}; };
} }
@ -78,6 +83,17 @@ const defaultSearch: defaultSearch = {
icon_size: 12, icon_size: 12,
icon_color: '#999', icon_color: '#999',
button_color: '#999', button_color: '#999',
container_color_list: [{ color: '#fff', color_percentage: undefined }],
container_direction: '180deg',
container_background_img_style: '2',
container_background_img_url: [],
container_radius: {
radius: 0,
radius_top_left: 0,
radius_top_right: 0,
radius_bottom_left: 0,
radius_bottom_right: 0,
},
common_style: defaultCommon, common_style: defaultCommon,
}, },
}; };