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

修改搜索和公告的显示

v1.0.0
于肖磊 2024-08-27 15:24:59 +08:00
parent ec94a4a0dc
commit ee3a7ff12e
10 changed files with 51 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/base/icon/index.vue
View File

@ -1,5 +1,5 @@
<template>
<i class="iconfont" :class="className" :style="'font-size:' + size + 'px;' + (props.color.indexOf('#') !== -1 ? 'color:' + props.color : '') + styles" @click="onClick">
<i class="iconfont" :class="className" :style="'font-size:' + size + 'px;' + (props.color.indexOf('#') !== -1 || props.color.indexOf('rgba') !== -1 ? 'color:' + props.color : '') + styles" @click="onClick">
<slot></slot>
</i>
</template>

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

@ -36,12 +36,12 @@
</div>
</div>
</el-form-item>
<el-form-item label="是否显示" label-width="140">
<el-form-item label="按钮大小" label-width="140">
<el-radio-group v-model="form.shop_button_size">
<el-radio v-for="item in base_list.shopping_button_size" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否显示">
<el-form-item label="按钮效果">
<el-radio-group v-model="form.shop_button_effect">
<el-radio v-for="item in base_list.shopping_cart_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>

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

@ -2,10 +2,13 @@
<div :style="style_container">
<template v-if="form.notice_style == 'inherit'">
<div class="flex-row align-c news-box gap-y-8">
<template v-if="form.title_type == 'img'">
<template v-if="form.title_type == 'img-icon'">
<div v-if="!isEmpty(form.img_src)">
<image-empty v-model="form.img_src[0]" :style="img_style"></image-empty>
</div>
<div v-else>
<icon :name="form.icon_class" :size="new_style.icon_size + ''" :color="new_style.icon_color"></icon>
</div>
</template>
<template v-else>
<div :style="topic_style" class="pl-6 pr-6 radius-sm">{{ form.title || '公告' }}</div>
@ -19,8 +22,13 @@
<template v-else>
<div class="news-card flex-col gap-10">
<div class="flex-row w jc-sb">
<template v-if="form.title_type == 'img'">
<image-empty v-model="form.img_src[0]" :style="img_style" error-img-style="width:1.6rem;height:1.6rem;"></image-empty>
<template v-if="form.title_type == 'img-icon'">
<template v-if="!isEmpty(form.icon_class)">
<icon :name="form.icon_class" :size="new_style.icon_size + ''" :color="new_style.icon_color"></icon>
</template>
<template v-else>
<image-empty v-model="form.img_src[0]" :style="img_style" error-img-style="width:1.6rem;height:1.6rem;"></image-empty>
</template>
</template>
<template v-else>
<div :style="topic_style" class="pl-6 pr-6 radius-sm">{{ form.title || '公告' }}</div>

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

@ -14,12 +14,12 @@
<div class="mb-12">公告风格</div>
<el-form-item label="标题类型">
<el-radio-group v-model="form.title_type" class="ml-4">
<el-radio value="img">图片</el-radio>
<el-radio value="img-icon">图片/图标</el-radio>
<el-radio value="text">文字</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item v-if="!is_text" label="上传图片">
<upload v-model="form.img_src" :limit="1" size="50"></upload>
<upload v-model="form.img_src" v-model:icon-value="form.icon_class" is-icon :limit="1" size="50"></upload>
</el-form-item>
<el-form-item v-if="is_text" label="标题文字">
<el-input v-model="form.title" placeholder="请输入标题" maxlength="4" show-word-limit></el-input>

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

@ -12,12 +12,22 @@
</el-form-item>
</template>
<template v-else>
<el-form-item label="图片宽度">
<slider v-model="form.topic_width" :max="1000"></slider>
</el-form-item>
<el-form-item label="图片高度">
<slider v-model="form.topic_height" :max="1000"></slider>
</el-form-item>
<template v-if="!isEmpty(substance.icon_class)">
<el-form-item label="图标大小">
<slider v-model="form.icon_size" :max="100"></slider>
</el-form-item>
<el-form-item label="图标颜色">
<color-picker v-model="form.icon_color" default-color="#999"></color-picker>
</el-form-item>
</template>
<template v-else>
<el-form-item label="图片宽度">
<slider v-model="form.topic_width" :max="1000"></slider>
</el-form-item>
<el-form-item label="图片高度">
<slider v-model="form.topic_height" :max="1000"></slider>
</el-form-item>
</template>
</template>
<el-form-item label="按钮颜色">
<color-picker v-model="form.button_color" default-color="#999"></color-picker>
@ -31,6 +41,7 @@
</div>
</template>
<script setup lang="ts">
import { isEmpty } from "lodash";
const props = defineProps({
value: {
type: Object,
@ -49,7 +60,7 @@ const state = reactive({
// 如果需要解构，确保使用toRefs
const { form, substance } = toRefs(state);
const is_img = computed(() => substance.value.title_type == 'img');
const is_img = computed(() => substance.value.title_type == 'img-icon');
// 通用样式处理
const common_styles_update = (val: Object) => {
form.value.common_style = val;

1
src/components/model-search/index.ts
View File

@ -6,7 +6,6 @@ interface hot_word_list {
interface search_content {
is_center: boolean;
is_icon_show: boolean;
icon_type: string;
icon_src: string;
icon_img_src: uploadList[];
icon_class: string;

12
src/components/model-search/index.vue
View File

@ -4,14 +4,14 @@
<div class="search w re">
<div class="box h oh flex align-c gap-10" :style="box_style">
<template v-if="form.is_icon_show">
<template v-if="form.icon_type == 'icon'">
<el-icon :class="`iconfont ${ !isEmpty(form.icon_class) ? 'icon-' + form.icon_class : 'search' } size-14`" :style="`color:${new_style.icon_color};`" />
</template>
<template v-else>
<template v-if="form.icon_img_src.length > 0">
<div class="img-box">
<image-empty v-model="form.icon_img_src[0]" class="img" error-img-style="width: 4rem;height: 2.5rem;" />
</div>
</template>
<template v-else>
<el-icon :class="`iconfont ${ !isEmpty(form.icon_class) ? 'icon-' + form.icon_class : 'icon-search' } size-14`" :style="`color:${new_style.icon_color};`" />
</template>
</template>
<span v-if="form.is_tips_show" class="size-14" :style="`color: ${ new_style.tips_color }`">{{ form.tips }}</span>
</div>
@ -19,10 +19,10 @@
<template v-if="form.search_type === 'text'">
<div class="pl-16 pr-16 ptb-3 size-12">{{ form.search_tips }}</div>
</template>
<template v-if="form.search_type === 'img'">
<template v-else-if="form.search_botton_src.length > 0">
<image-empty v-model="form.search_botton_src[0]" class="img" :style="search_button_radius" error-img-style="width: 4rem;height: 2.8rem;" />
</template>
<template v-if="form.search_type === 'icon'">
<template v-else>
<div class="pl-16 pr-16 ptb-3 size-12">
<el-icon :class="`iconfont ${ 'icon-' + form.search_botton_icon } size-14`" />
</div>

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

@ -10,16 +10,7 @@
<div class="flex-col w h gap-10">
<el-switch v-model="form.is_icon_show"/>
<template v-if="form.is_icon_show">
<el-radio-group v-model="form.icon_type" class="ml-4">
<el-radio value="img">图片</el-radio>
<el-radio value="icon">图标</el-radio>
</el-radio-group>
<template v-if="form.icon_type === 'img'">
<upload v-model="form.icon_img_src" :limit="1" size="50"></upload>
</template>
<template v-else>
<upload-icon v-model:icon_class="form.icon_class" :size="50"></upload-icon>
</template>
<upload v-model="form.icon_img_src" v-model:icon-value="form.icon_class" is-icon :limit="1" size="50"></upload>
</template>
</div>
</el-form-item>
@ -34,15 +25,11 @@
<el-switch v-model="form.is_search_show"/>
<template v-if="form.is_search_show">
<el-radio-group v-model="form.search_type" class="ml-4">
<el-radio value="img">图片</el-radio>
<el-radio value="icon">图标</el-radio>
<el-radio value="img-icon">图片/图标</el-radio>
<el-radio value="text">文字</el-radio>
</el-radio-group>
<template v-if="form.search_type === 'img'">
<upload v-model="form.search_botton_src" :limit="1" size="50"></upload>
</template>
<template v-else-if="form.search_type === 'icon'">
<upload-icon v-model:icon_class="form.search_botton_icon" :size="50"></upload-icon>
<template v-if="form.search_type === 'img-icon'">
<upload v-model="form.search_botton_src" v-model:icon-value="form.search_botton_icon" is-icon :limit="1" size="50"></upload>
</template>
<template v-else>
<el-input v-model="form.search_tips" placeholder="请输入文字内容"></el-input>
@ -74,7 +61,6 @@ const props = withDefaults(defineProps<Props>(), {
value: () => ({
is_center: false,
is_icon_show: true,
icon_type: 'icon',
icon_src: '',
icon_img_src: [],
icon_class: '',

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

@ -14,6 +14,7 @@ interface defaultSearch {
title: string;
direction: string;
img_src: uploadList[];
icon_class: string;
more_link: object;
interval_time: number;
is_right_button: string;
@ -30,6 +31,8 @@ interface defaultSearch {
topic_size: number;
topic_width: number;
topic_height: number;
icon_size: number;
icon_color: string;
common_style: object;
};
}
@ -37,9 +40,10 @@ const defaultSearch: defaultSearch = {
content: {
notice_style: 'inherit',
direction: 'vertical',
title_type: 'img',
title_type: 'img-icon',
title: '测试标题',
img_src: [],
icon_class: '',
is_right_button: 'show',
interval_time: 2,
more_link: {},
@ -71,6 +75,8 @@ const defaultSearch: defaultSearch = {
topic_size: 14,
topic_width: 24,
topic_height: 24,
icon_size: 12,
icon_color: '#999',
button_color: '#999',
common_style: defaultCommon,
},

2
src/layout/components/main/default/search.ts
View File

@ -9,7 +9,6 @@ interface defaultSearch {
content: {
is_center: boolean;
is_icon_show: boolean;
icon_type: string;
icon_src: string;
icon_img_src: uploadList[];
icon_class: string;
@ -41,7 +40,6 @@ const defaultSearch: defaultSearch = {
content: {
is_center: false,
is_icon_show: true,
icon_type: 'icon',
icon_src: '',
icon_img_src: [],
icon_class: '',