修改显示逻辑

v1.0.0
于肖磊 2024-09-05 15:00:29 +08:00
parent 3f551363b4
commit a339a694b6
4 changed files with 15 additions and 15 deletions

View File

@ -6,7 +6,7 @@
<el-form-item label="选择风格">
<div class="flex align-c flex-wrap gap-10">
<div v-for="(item, index) in style_list" :key="index" :class="['flex-item', {'flex-item-actived': form.style_actived === index }]" @click="style_click(index)">
<icon :name="item" :color="`${ form.style_actived === index ? '#E1EEF9' : '#EDEDED'}`" size="48"></icon>
<icon :name="item" :color="`${ form.style_actived === index ? '#E1EEF9' : '#EDEDED'}`" size="30"></icon>
</div>
</div>
</el-form-item>
@ -213,8 +213,8 @@ const is_show_title = computed(() => !(form.value.style_actived == 7 && ![0, 1].
}
}
.flex-item {
width: 7.6rem;
height: 7.6rem;
width: 4.7rem;
height: 4.7rem;
background: #F7F7F7;
border-radius: 0.4rem;
border: 1px solid #E4E4E4;

View File

@ -6,7 +6,7 @@
<el-form-item label="选择风格">
<div class="flex align-c flex-wrap gap-10">
<div v-for="(item, index) in style_list" :key="index" :class="['flex-item', {'flex-item-actived': form.style_actived === index }]" @click="style_click(index)">
<icon :name="item" :color="`${ form.style_actived === index ? '#E1EEF9' : '#EDEDED'}`" size="48"></icon>
<icon :name="item" :color="`${ form.style_actived === index ? '#E1EEF9' : '#EDEDED'}`" size="30"></icon>
</div>
</div>
</el-form-item>
@ -136,8 +136,8 @@ const selected_click = (index: number) => {
}
}
.flex-item {
width: 7.6rem;
height: 7.6rem;
width: 4.7rem;
height: 4.7rem;
background: #F7F7F7;
border-radius: 0.4rem;
border: 1px solid #E4E4E4;

View File

@ -18,10 +18,10 @@ const defaultFooterNav = ref<DefaultFooterNav>({
nav_style: '0',
nav_type: '0',
nav_content: [
{ id: '1', name: '首页', img: [{ id: 1, url: new_url + 'home.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/home.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '2', name: '分类', img: [{ id: 1, url: new_url + 'category.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/category.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '3', name: '购物车', img: [{ id: 1, url: new_url + 'cart.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/cart.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '4', name: '我的', img: [{ id: 1, url: new_url + 'user.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/user.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '1', name: '首页', img: [{ id: 1, url: new_url + 'home.png', original: '', title: '', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/home.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '2', name: '分类', img: [{ id: 1, url: new_url + 'category.png', original: '', title: '', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/category.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '3', name: '购物车', img: [{ id: 1, url: new_url + 'cart.png', original: '', title: '', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/cart.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
{ id: '4', name: '我的', img: [{ id: 1, url: new_url + 'user.png', original: '', title: '', ext: '.png', type: 'img' }], img_checked: [{ id: 1, url: new_url + 'active/user.png', original: '头像1', title: '头像1', ext: '.png', type: 'img' }], link: {} },
],
},
style: {

View File

@ -267,12 +267,12 @@ const model_class = computed(() => {
const model_style = computed(() => {
return (item: { id: string; key: string }) => {
// window.innerHeight() - 80() - 844
const height = (window.innerHeight - 924) / 2;
// window.innerHeight() - 60() - 846()
const height = (window.innerHeight - 906) / 2;
let bottom = parseInt(float_bottom[item.id]) + height;
// 60 775-60 = 695
if (parseInt(float_bottom[item.id]) > 695) {
bottom = 695 + height;
// 60 846-60 = 786
if (parseInt(float_bottom[item.id]) > 786) {
bottom = 786 + height;
}
return item.key == 'float-window' ? `bottom: ${((bottom / window.innerHeight) * 100).toFixed(4) + '%'};` : '';
};