1.底部导航新增恢复默认
parent
979392d5ab
commit
8256a1c22c
|
|
@ -19,7 +19,10 @@
|
|||
</card-container>
|
||||
<div class="divider-line"></div>
|
||||
<card-container>
|
||||
<div class="mb-12">导航内容</div>
|
||||
<div class="mb-12 flex-row gap-10 jc-sb">
|
||||
<div>导航内容</div>
|
||||
<div class="cr-primary c-pointer" @click="reset_event">恢复默认</div>
|
||||
</div>
|
||||
<div class="size-12 cr-c mb-20">图片建议宽高80*80;鼠标拖拽左侧圆点可调整导航顺序</div>
|
||||
<div class="nav-list">
|
||||
<drag :data="form.nav_content" type="card" :space-col="20" @remove="nav_content_remove" @on-sort="on_sort">
|
||||
|
|
@ -51,7 +54,9 @@
|
|||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { cloneDeep } from 'lodash';
|
||||
import { get_math } from '@/utils';
|
||||
import defaultFooterNav from '@/config/const/footer-nav';
|
||||
const props = defineProps({
|
||||
value: {
|
||||
type: Object,
|
||||
|
|
@ -89,6 +94,16 @@ const add = () => {
|
|||
});
|
||||
emit('update:value', form.value);
|
||||
};
|
||||
interface DefaultFooterNav {
|
||||
content: {
|
||||
nav_content: any; // 根据实际类型替换 any
|
||||
};
|
||||
}
|
||||
const reset_event = () => {
|
||||
const clone_data = cloneDeep(defaultFooterNav.value);
|
||||
form.value.nav_content = clone_data.content.nav_content;
|
||||
emit('update:value', form.value);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
|
|
|
|||
|
|
@ -1,28 +1,28 @@
|
|||
import defaultHeaderNav from './default/header-nav';
|
||||
import defaultFooterNav from './default/footer-nav';
|
||||
import defaultVideo from './default/video';
|
||||
import defaultUserInfo from './default/user-info';
|
||||
import defaultRowLine from './default/row-line';
|
||||
import defaultSearch from './default/search';
|
||||
import defaultNavGroup from './default/nav-group';
|
||||
import defaultAuxiliaryBlank from './default/auxiliary-blank';
|
||||
import defaultRichText from './default/rich-text';
|
||||
import defaultArticleList from './default/article-list';
|
||||
import defaultArticleTabs from './default/article-tabs';
|
||||
import defaultCarousel from './default/carousel';
|
||||
import defaultNotice from './default/notice';
|
||||
import defaultTitle from './default/title';
|
||||
import defaultFloatWindow from './default/float-window';
|
||||
import defaultTabs from './default/tabs';
|
||||
import defaultGoodsList from './default/goods-list';
|
||||
import defaultGoodsTabs from './default/goods-tabs';
|
||||
import defaultImgMagic from './default/img-magic';
|
||||
import defaultHotZone from './default/hot-zone';
|
||||
import defaultCustom from './default/custom';
|
||||
import defaultDataMagic from './default/data-magic';
|
||||
import defaultCoupon from './default/coupon';
|
||||
import defaultSeckill from './default/seckill';
|
||||
import defaultTabsCarousel from './default/tabs-carousel';
|
||||
import defaultHeaderNav from '@/config/const/header-nav';
|
||||
import defaultFooterNav from '@/config/const/footer-nav';
|
||||
import defaultVideo from '@/config/const/video';
|
||||
import defaultUserInfo from '@/config/const/user-info';
|
||||
import defaultRowLine from '@/config/const/row-line';
|
||||
import defaultSearch from '@/config/const/search';
|
||||
import defaultNavGroup from '@/config/const/nav-group';
|
||||
import defaultAuxiliaryBlank from '@/config/const/auxiliary-blank';
|
||||
import defaultRichText from '@/config/const/rich-text';
|
||||
import defaultArticleList from '@/config/const/article-list';
|
||||
import defaultArticleTabs from '@/config/const/article-tabs';
|
||||
import defaultCarousel from '@/config/const/carousel';
|
||||
import defaultNotice from '@/config/const/notice';
|
||||
import defaultTitle from '@/config/const/title';
|
||||
import defaultFloatWindow from '@/config/const/float-window';
|
||||
import defaultTabs from '@/config/const/tabs';
|
||||
import defaultGoodsList from '@/config/const/goods-list';
|
||||
import defaultGoodsTabs from '@/config/const/goods-tabs';
|
||||
import defaultImgMagic from '@/config/const/img-magic';
|
||||
import defaultHotZone from '@/config/const/hot-zone';
|
||||
import defaultCustom from '@/config/const/custom';
|
||||
import defaultDataMagic from '@/config/const/data-magic';
|
||||
import defaultCoupon from '@/config/const/coupon';
|
||||
import defaultSeckill from '@/config/const/seckill';
|
||||
import defaultTabsCarousel from '@/config/const/tabs-carousel';
|
||||
|
||||
// 系统设置
|
||||
interface DefaultSettings {
|
||||
|
|
|
|||
|
|
@ -1,70 +0,0 @@
|
|||
import defaultCommon from './index';
|
||||
import { online_url } from '@/utils';
|
||||
const new_url = await online_url('/static/app/tabbar/').then((res) => res);
|
||||
interface DefaultFooterNav {
|
||||
content: {
|
||||
nav_style: string;
|
||||
nav_type: string;
|
||||
nav_content: { id: string; name: string; img: uploadList[]; img_checked: uploadList[]; link: object }[];
|
||||
};
|
||||
style: {
|
||||
text_color_checked: string;
|
||||
default_text_color: string;
|
||||
common_style: object;
|
||||
};
|
||||
}
|
||||
const defaultFooterNav = ref<DefaultFooterNav>({
|
||||
content: {
|
||||
nav_style: '0',
|
||||
nav_type: '0',
|
||||
nav_content: [
|
||||
{
|
||||
id: '1',
|
||||
name: '首页',
|
||||
img: [{ id: 1, url: new_url + 'home.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
img_checked: [{ id: 2, url: new_url + 'active/home.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
link: {
|
||||
name: '商城首页',
|
||||
page: '/pages/index/index',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '分类',
|
||||
img: [{ id: 3, url: new_url + 'category.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
img_checked: [{ id: 4, url: new_url + 'active/category.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
link: {
|
||||
name: '商品分类',
|
||||
page: '/pages/goods-category/goods-category',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '购物车',
|
||||
img: [{ id: 5, url: new_url + 'cart.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
img_checked: [{ id: 6, url: new_url + 'active/cart.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
link: {
|
||||
name: '购物车',
|
||||
page: '/pages/cart/cart',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: '4',
|
||||
name: '我的',
|
||||
img: [{ id: 7, url: new_url + 'user.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
img_checked: [{ id: 8, url: new_url + 'active/user.png', original: '', title: '', ext: '.png', type: 'img' }],
|
||||
link: {
|
||||
name: '我的',
|
||||
page: '/pages/user/user',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
style: {
|
||||
text_color_checked: 'rgba(255, 0, 0, 1)',
|
||||
default_text_color: 'rgba(0, 0, 0, 1)',
|
||||
common_style: { ...defaultCommon, color_list: [{ color: 'rgba(255,255,255,1)', color_percentage: undefined }] },
|
||||
},
|
||||
});
|
||||
|
||||
export default defaultFooterNav;
|
||||
|
|
@ -1,29 +0,0 @@
|
|||
const defaultCommon: componentsCommonCommonStyle = {
|
||||
direction: '90deg',
|
||||
color_list: [{ color: '', color_percentage: undefined }],
|
||||
background_img_style: 2,
|
||||
floating_up: 0,
|
||||
padding: 0,
|
||||
padding_top: 0,
|
||||
padding_bottom: 0,
|
||||
padding_left: 0,
|
||||
padding_right: 0,
|
||||
margin: 0,
|
||||
margin_top: 0,
|
||||
margin_bottom: 0,
|
||||
margin_left: 0,
|
||||
margin_right: 0,
|
||||
radius: 0,
|
||||
radius_top_left: 0,
|
||||
radius_top_right: 0,
|
||||
radius_bottom_left: 0,
|
||||
radius_bottom_right: 0,
|
||||
box_shadow_color: '',
|
||||
box_shadow_x: 0,
|
||||
box_shadow_y: 0,
|
||||
box_shadow_blur: 0,
|
||||
box_shadow_spread: 0,
|
||||
background_img: [] as uploadList[],
|
||||
};
|
||||
|
||||
export default defaultCommon;
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import defaultFooterNav from './default/footer-nav';
|
||||
import defaultFooterNav from '@/config/const/footer-nav';
|
||||
|
||||
interface DefaultSettings {
|
||||
footer_nav: any;
|
||||
|
|
|
|||
|
|
@ -44,7 +44,6 @@ const init = () => {
|
|||
let data = res.data;
|
||||
data.style.common_style = convert_strings_to_numbers(data.style.common_style);
|
||||
form.value = data;
|
||||
console.log(form.value);
|
||||
} else {
|
||||
form.value = cloneDeep(temp_form.value);
|
||||
}
|
||||
|
|
@ -128,10 +127,10 @@ const save_event = () => {
|
|||
:deep(.divider-line) {
|
||||
box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
|
||||
}
|
||||
:deep(.settings) {
|
||||
// box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
|
||||
.settings-title {
|
||||
// box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
|
||||
}
|
||||
}
|
||||
// :deep(.settings) {
|
||||
// // box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
|
||||
// .settings-title {
|
||||
// // box-shadow: 0 0.5rem 2rem rgba(50, 55, 58, 0.1);
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue