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

修改字段显示

v1.0.0
于肖磊 2024-09-14 17:29:59 +08:00
parent 9adeac21a3
commit d26a0049b0
24 changed files with 150 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/assets/icons/iconfont.css
View File

@ -1,9 +1,9 @@
@font-face {
font-family: "iconfont"; /* Project id 4607934 */
src: url('iconfont.woff2?t=1726043407380') format('woff2'),
url('iconfont.woff?t=1726043407380') format('woff'),
url('iconfont.ttf?t=1726043407380') format('truetype'),
url('iconfont.svg?t=1726043407380#iconfont') format('svg');
src: url('iconfont.woff2?t=1726304182208') format('woff2'),
url('iconfont.woff?t=1726304182208') format('woff'),
url('iconfont.ttf?t=1726304182208') format('truetype'),
url('iconfont.svg?t=1726304182208#iconfont') format('svg');
}
.iconfont {
@ -14,6 +14,14 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-fenlei-more:before {
content: "\e6b7";
}
.icon-jinzhi:before {
content: "\e799";
}
.icon-bofang:before {
content: "\e798";
}

2
src/assets/icons/iconfont.js
View File

File diff suppressed because one or more lines are too long

14
src/assets/icons/iconfont.json
View File

@ -5,6 +5,20 @@
"css_prefix_text": "icon-",
"description": "web端",
"glyphs": [
{
"icon_id": "37217394",
"name": "icon-fenlei-more",
"font_class": "fenlei-more",
"unicode": "e6b7",
"unicode_decimal": 59063
},
{
"icon_id": "41868113",
"name": "禁止",
"font_class": "jinzhi",
"unicode": "e799",
"unicode_decimal": 59289
},
{
"icon_id": "41814968",
"name": "播放 (2)",

4
src/assets/icons/iconfont.svg
View File

@ -14,6 +14,10 @@
/>
<missing-glyph />
<glyph glyph-name="fenlei-more" unicode="&#59063;" d="M0 486.4h1024v-102.4H0z m0-512h409.6v-102.4H0z m0 921.6h1024v-102.4H0z m524.3904-729.6a44.6464 44.6464 0 0 1 0-61.8496l213.6064-219.7504a41.6768 41.6768 0 0 1 60.0064 0L1011.5072 104.44799999999998a44.6464 44.6464 0 0 1 0 61.8496 41.5744 41.5744 0 0 1-60.0064 0L768-22.52800000000002 584.4992 166.39999999999998a41.6768 41.6768 0 0 1-60.1088 0z" horiz-adv-x="1024" />
<glyph glyph-name="jinzhi" unicode="&#59289;" d="M196.736 152.32A391.04 391.04 0 0 0 120.448 384 392 392 0 0 0 512 775.552c89.216 0 174.848-30.4 244.224-86.08L485.824 429.888l-289.088-277.504zM512-7.488a390.912 390.912 0 0 0-278.528 116.864l564.288 541.76A386.624 386.624 0 0 0 903.552 384 391.936 391.936 0 0 0 512-7.552z m327.168 698.368l-21.76 20.352-19.584 18.24-0.896-0.832A445.376 445.376 0 0 1 512 832C264.96 832 64 631.04 64 384c0-97.92 32.64-192.896 91.968-270.784l-0.832-0.832 17.408-20.224 19.52-22.592 1.088 1.088A446.848 446.848 0 0 1 512-64c247.04 0 448 200.96 448 448 0 115.2-43.328 222.464-121.92 305.792l1.088 1.024z" horiz-adv-x="1024" />
<glyph glyph-name="bofang" unicode="&#59288;" d="M512 844.8c-255.488 0-460.8-205.312-460.8-460.8s205.312-460.8 460.8-460.8 460.8 205.312 460.8 460.8-205.312 460.8-460.8 460.8z m173.824-506.88L488.96 224.768a52.5824 52.5824 0 0 0-79.616 46.08V497.152c0 39.7312 44.032 64.8704 79.616 46.08l196.864-113.152c33.536-20.992 33.536-71.168 0-92.16z" horiz-adv-x="1024" />
<glyph glyph-name="a-miaosha" unicode="&#59287;" d="M501.504-102.4V300.629333H248.746667l313.770666 492.373334v-350.72h248.32L501.589333-102.4z" horiz-adv-x="1024" />

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 69 KiB

After

Width:  |  Height:  |  Size: 70 KiB

BIN
src/assets/icons/iconfont.ttf
View File

Binary file not shown.

BIN
src/assets/icons/iconfont.woff
View File

Binary file not shown.

BIN
src/assets/icons/iconfont.woff2
View File

Binary file not shown.

15
src/components/base/drag/index.vue
View File

@ -2,18 +2,11 @@
<VueDraggable v-model="from" :animation="500" target=".sort-target" handle=".icon-drag" :scroll="true" :on-sort="on_sort">
<TransitionGroup type="transition" tag="ul" name="fade" class="sort-target flex-col gap-x-20">
<li v-for="(item, index) in from" :key="item.id" :class="className" class="flex gap-y-16 re" @click="on_click(item, index)">
<template v-if="!props.isNotCloseIndex.includes(index)">
<el-icon class="iconfont icon-drag size-16 cursor-move" />
</template>
<template v-else>
<el-icon class="iconfont icon-drag size-16 cursor-move" />
</template>
<el-icon class="iconfont icon-drag size-16 cursor-move" />
<slot :row="item" :index="index" />
<el-icon v-if="isShowEdit" class="iconfont icon-commodity-edit size-16 cr-primary do-not-trigger two-click" @click="edit(index)" />
<template v-if="!props.isNotCloseIndex.includes(index)">
<el-icon v-if="type == 'line'" class="iconfont icon-del-o size-16 do-not-trigger" @click="remove(index)" />
<el-icon v-if="type == 'card'" class="iconfont icon-close-o size-16 abs cr-c top-de-5 right-de-5" @click="remove(index)" />
</template>
<el-icon v-if="type == 'line'" class="iconfont icon-del-o size-16 do-not-trigger" @click="remove(index)" />
<el-icon v-if="type == 'card'" class="iconfont icon-close-o size-16 abs cr-c top-de-5 right-de-5" @click="remove(index)" />
</li>
</TransitionGroup>
</VueDraggable>
@ -29,13 +22,11 @@ interface Props {
spaceCol?: number; // 上下间距
iconPosition?: string; // top/bottom/center
isShowEdit?: boolean;
isNotCloseIndex?: number[];
}
const props = withDefaults(defineProps<Props>(), {
type: () => 'line',
isShowEdit: false,
spaceCol: () => 5,
isNotCloseIndex: () => [],
iconPosition: 'center',
});
const className = ref('');

12
src/components/model-article-list/index.vue
View File

@ -121,12 +121,12 @@ const interval_time = ref(2000);
// 轮播图是否滚动
const is_roll = ref(1);
const get_auto_data_list = async () => {
const { category, number, sort, sort_rules, is_cover } = new_content.value;
const { category_ids, number, order_by_type, order_by_rule, is_cover } = new_content.value;
const new_data = {
article_keywords: '',
article_category_ids: category.join(','),
article_order_by_type: sort,
article_order_by_rule: sort_rules,
article_category_ids: category_ids.join(','),
article_order_by_type: order_by_type,
article_order_by_rule: order_by_rule,
article_number: number,
article_is_cover: is_cover,
};
@ -165,8 +165,8 @@ onMounted(() => {
}
});
const data_list_computer = computed(() => {
const { data_type, category, number, sort, sort_rules, is_cover, data_list } = new_content.value;
return { data_type, category, number, sort, sort_rules, is_cover, data_list };
const { data_type, category_ids, number, order_by_type, order_by_rule, is_cover, data_list } = new_content.value;
return { data_type, category_ids, number, order_by_type, order_by_rule, is_cover, data_list };
});
watch(
() => data_list_computer.value,

10
src/components/model-article-list/model-article-list-content.vue
View File

@ -30,7 +30,7 @@
</template>
<template v-else>
<el-form-item label="文章分类">
<el-select v-model="form.category" multiple collapse-tags placeholder="请选择文章分类">
<el-select v-model="form.category_ids" multiple collapse-tags placeholder="请选择文章分类">
<el-option v-for="item in base_list.article_category_list" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
@ -38,13 +38,13 @@
<el-input-number v-model="form.number" :min="1" :max="50" type="number" placeholder="请输入显示数量" value-on-clear="min" class="w number-show" controls-position="right"></el-input-number>
</el-form-item>
<el-form-item label="排序类型">
<el-radio-group v-model="form.sort">
<el-radio-group v-model="form.order_by_type">
<el-radio v-for="item in base_list.sort_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序规则">
<el-radio-group v-model="form.sort_rules">
<el-radio v-for="item in base_list.sort_rules_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
<el-radio-group v-model="form.order_by_rule">
<el-radio v-for="item in base_list.order_by_rule_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="封面图片">
@ -118,7 +118,7 @@ const base_list = reactive({
{ name: '时间', value: '1' },
{ name: '浏览量', value: '2' },
],
sort_rules_list: [
order_by_rule_list: [
{ name: '降序（desc）', value: '0' },
{ name: '升序（asc）', value: '1' },
],

6
src/components/model-article-tabs/index.vue
View File

@ -23,13 +23,13 @@ watch(
let new_data = newVal;
new_data.content.theme = new_data.content.article_theme;
new_data.content.data_type = new_data.content.tabs_list[0].data_type;
new_data.content.category = new_data.content.tabs_list[0].category;
new_data.content.category_ids = new_data.content.tabs_list[0].category_ids;
new_data.content.carousel_col = new_data.content.article_carousel_col;
new_data.content.data_list = new_data.content.tabs_list[0].data_list;
new_data.content.data_ids = new_data.content.tabs_list[0].data_ids;
new_data.content.number = new_data.content.tabs_list[0].number;
new_data.content.sort = new_data.content.tabs_list[0].sort;
new_data.content.sort_rules = new_data.content.tabs_list[0].sort_rules;
new_data.content.order_by_type = new_data.content.tabs_list[0].order_by_type;
new_data.content.order_by_rule = new_data.content.tabs_list[0].order_by_rule;
new_data.content.field_show = new_data.content.field_show;
new_data.content.is_cover = new_data.content.tabs_list[0].is_cover;
article_tabs.value = new_data;

14
src/components/model-article-tabs/model-article-tabs-content.vue
View File

@ -49,7 +49,7 @@
</template>
<template v-else>
<el-form-item label="文章分类">
<el-select v-model="row.category" multiple collapse-tags placeholder="请选择文章分类">
<el-select v-model="row.category_ids" multiple collapse-tags placeholder="请选择文章分类">
<el-option v-for="item in base_list.article_category_list" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
@ -57,13 +57,13 @@
<el-input-number v-model="row.number" :min="1" :max="50" type="number" placeholder="请输入显示数量" value-on-clear="min" class="w number-show" controls-position="right"></el-input-number>
</el-form-item>
<el-form-item label="排序类型">
<el-radio-group v-model="row.sort">
<el-radio-group v-model="row.order_by_type">
<el-radio v-for="item in base_list.sort_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序规则">
<el-radio-group v-model="row.sort_rules">
<el-radio v-for="item in base_list.sort_rules_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
<el-radio-group v-model="row.order_by_rule">
<el-radio v-for="item in base_list.order_by_rule_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="封面图片">
@ -144,7 +144,7 @@ const base_list = reactive({
{ name: '时间', value: '1' },
{ name: '浏览量', value: '2' },
],
sort_rules_list: [
order_by_rule_list: [
{ name: '降序（desc）', value: '0' },
{ name: '升序（asc）', value: '1' },
],
@ -212,8 +212,8 @@ const tabs_add = () => {
data_type: '0',
category: [],
number: 4,
sort: '0',
sort_rules: '0',
order_by_type: '0',
order_by_rule: '0',
is_cover: '1',
data_list: [],
});

14
src/components/model-goods-list/index.vue
View File

@ -243,13 +243,13 @@ onMounted(() => {
});
const get_products = () => {
const { category, brand, number, sort, sort_rules } = form.value;
const { category_ids, brand_ids, number, order_by_type, order_by_rule } = form.value;
const params = {
goods_keywords: '',
goods_category_ids: category,
goods_brand_ids: brand,
goods_order_by_type: sort,
goods_order_by_rule: sort_rules,
goods_category_ids: category_ids,
goods_brand_ids: brand_ids,
goods_order_by_type: order_by_type,
goods_order_by_rule: order_by_rule,
goods_number: number,
};
// 获取商品列表
@ -264,8 +264,8 @@ const get_products = () => {
};
// 取出监听的数据
const watch_data = computed(() => {
const { category, brand, number, sort, sort_rules, data_type, data_list } = form.value;
return { category: category, brand: brand, number: number, sort: sort, sort_rules: sort_rules, data_type: data_type, data_list: data_list };
const { category_ids, brand, number, order_by_type, order_by_rule, data_type, data_list } = form.value;
return { category_ids: category_ids, brand: brand, number: number, order_by_type: order_by_type, order_by_rule: order_by_rule, data_type: data_type, data_list: data_list };
})
// 初始化的时候不执行, 监听数据变化
watch(() => watch_data.value, (val) => {

12
src/components/model-goods-list/model-goods-list-content.vue
View File

@ -33,12 +33,12 @@
</template>
<template v-else>
<el-form-item label="商品分类">
<el-select v-model="form.category" multiple collapse-tags placeholder="请选择商品分类">
<el-select v-model="form.category_ids" multiple collapse-tags placeholder="请选择商品分类">
<el-option v-for="item in base_list.product_category_list" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="指定品牌">
<el-select v-model="form.brand" multiple collapse-tags placeholder="请选择品牌">
<el-select v-model="form.brand_ids" multiple collapse-tags placeholder="请选择品牌">
<el-option v-for="item in base_list.product_brand_list" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
@ -46,13 +46,13 @@
<el-input-number v-model="form.number" :min="1" :max="50" type="number" placeholder="请输入显示数量" value-on-clear="min" class="w number-show" controls-position="right"></el-input-number>
</el-form-item>
<el-form-item label="排序类型">
<el-radio-group v-model="form.sort">
<el-radio-group v-model="form.order_by_type">
<el-radio v-for="item in base_list.sort_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序规则">
<el-radio-group v-model="form.sort_rules">
<el-radio v-for="item in base_list.sort_rules_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
<el-radio-group v-model="form.order_by_rule">
<el-radio v-for="item in base_list.order_by_rule_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
@ -117,7 +117,7 @@ const base_list = reactive({
{ name: '价格', value: '3' },
{ name: '最新', value: '4' },
],
sort_rules_list: [
order_by_rule_list: [
{ name: '降序(desc)', value: '0' },
{ name: '升序(asc)', value: '1' },
],

8
src/components/model-goods-tabs/index.vue
View File

@ -26,11 +26,11 @@ watch(tabs_list.value, (val) => {
let new_data = val;
// 产品的值
new_data.content.data_type = new_data.content.tabs_list[0].data_type;
new_data.content.category = new_data.content.tabs_list[0].category;
new_data.content.brand = new_data.content.tabs_list[0].brand;
new_data.content.category_ids = new_data.content.tabs_list[0].category_ids;
new_data.content.brand_ids = new_data.content.tabs_list[0].brand_ids;
new_data.content.number = new_data.content.tabs_list[0].number;
new_data.content.sort = new_data.content.tabs_list[0].sort;
new_data.content.sort_rules = new_data.content.tabs_list[0].sort_rules;
new_data.content.order_by_type = new_data.content.tabs_list[0].order_by_type;
new_data.content.order_by_rule = new_data.content.tabs_list[0].order_by_rule;
new_data.content.data_list = new_data.content.tabs_list[0].data_list;
tabs_list.value = new_data;

16
src/components/model-goods-tabs/model-goods-tabs-content.vue
View File

@ -55,12 +55,12 @@
</template>
<template v-else>
<el-form-item label="商品分类">
<el-select v-model="row.category" multiple collapse-tags placeholder="请选择商品分类">
<el-select v-model="row.category_ids" multiple collapse-tags placeholder="请选择商品分类">
<el-option v-for="item in base_list.product_category_list" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="指定品牌">
<el-select v-model="row.brand" multiple collapse-tags placeholder="请选择商品品牌">
<el-select v-model="row.brand_ids" multiple collapse-tags placeholder="请选择商品品牌">
<el-option v-for="item in base_list.product_brand_list" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
@ -68,13 +68,13 @@
<el-input-number v-model="row.number" :min="1" :max="50" type="number" placeholder="请输入显示数量" value-on-clear="min" class="w number-show" controls-position="right"></el-input-number>
</el-form-item>
<el-form-item label="排序类型">
<el-radio-group v-model="row.sort">
<el-radio-group v-model="row.order_by_type">
<el-radio v-for="item in base_list.sort_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序规则">
<el-radio-group v-model="row.sort_rules">
<el-radio v-for="item in base_list.sort_rules_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
<el-radio-group v-model="row.order_by_rule">
<el-radio v-for="item in base_list.order_by_rule_list" :key="item.value" :value="item.value">{{ item.name }}</el-radio>
</el-radio-group>
</el-form-item>
</template>
@ -152,7 +152,7 @@ const base_list = reactive({
{ name: '价格', value: '3' },
{ name: '最新', value: '4' },
],
sort_rules_list: [
order_by_rule_list: [
{ name: '降序（desc）', value: '0' },
{ name: '升序（asc）', value: '1' },
],
@ -200,8 +200,8 @@ const tabs_add = () => {
category: [],
data_ids: [],
number: 4,
sort: '0',
sort_rules: '0',
order_by_type: '0',
order_by_rule: '0',
data_list: [],
});
};

15
src/components/model-tabs/index.vue
View File

@ -1,11 +1,11 @@
<template>
<div :style="style">
<tabs-view ref="tabs" :value="props.value"></tabs-view>
<tabs-view ref="tabs" :value="tabs_list"></tabs-view>
</div>
</template>
<script setup lang="ts">
import { common_styles_computer } from '@/utils';
import { cloneDeep } from 'lodash';
const props = defineProps({
value: {
type: Object,
@ -15,7 +15,14 @@ const props = defineProps({
},
});
const tabs_list = ref(props.value);
watch(props.value, (val) => {
let new_data = cloneDeep(val);
const { home_data } = new_data.content;
new_data.content.tabs_list = [home_data, ...new_data.content.tabs_list];
tabs_list.value = new_data;
}, { immediate: true, deep: true });
const style = computed(() => common_styles_computer(props.value.style.common_style));
</script>
<style lang="scss" scoped>
</style>
<style lang="scss" scoped></style>

39
src/components/model-tabs/model-tabs-content.vue
View File

@ -17,13 +17,19 @@
<div class="divider-line"></div>
<card-container>
<div class="mb-12">选项卡设置</div>
<drag :data="form.tabs_list" type="card" :space-col="25" :is-not-close-index="[0]" @remove="remove" @on-sort="on_sort">
<template #default="scoped">
<div class="flex-col align-c jc-s gap-20 flex-1 w">
<el-form-item label="显示文字" class="w mb-0">
<el-input v-model="scoped.row.title" placeholder="请输入标题文字" clearable />
</el-form-item>
<template v-if="scoped.index != 0">
<div class="flex-col gap-x-20">
<div class="card-background box-shadow-sm ptb-25 flex gap-y-16 re align-c">
<el-icon class="iconfont icon-jinzhi size-16 cursor-move" />
<el-form-item label="显示文字" class="w mb-0">
<el-input v-model="form.home_data.title" placeholder="请输入标题文字" clearable />
</el-form-item>
</div>
<drag :data="form.tabs_list" type="card" :space-col="25" @remove="remove" @on-sort="on_sort">
<template #default="scoped">
<div class="flex-col align-c jc-s gap-20 flex-1 w">
<el-form-item label="显示文字" class="w mb-0">
<el-input v-model="scoped.row.title" placeholder="请输入标题文字" clearable />
</el-form-item>
<el-form-item label="数据类型" class="w mb-0">
<el-radio-group v-model="scoped.row.data_type">
<el-radio value="0">微页面</el-radio>
@ -38,11 +44,11 @@
<url-value v-model="scoped.row.classify" :type="['goods-category']"></url-value>
</template>
</el-form-item>
</template>
</div>
</template>
</drag>
<el-button class="mt-20 mb-20 w" @click="add">+添加</el-button>
</div>
</template>
</drag>
<el-button class="mt-20 mb-20 w" @click="add">+添加</el-button>
</div>
</card-container>
</el-form>
</div>
@ -99,4 +105,13 @@ const tabs_theme_change = (val: string | number | boolean | undefined): void =>
margin-bottom: 0;
}
}
.cursor-move {
color: #ddd;
cursor: move;
}
.card-background {
background: #fff;
padding-left: 1.6rem;
padding-right: 2rem;
}
</style>

8
src/views/layout/components/main/default/article-list.ts
View File

@ -12,12 +12,12 @@ interface DefaultArticleList {
theme: string;
carousel_col: string;
data_type: string;
category: string[];
category_ids: string[];
data_list: ArticleList[];
data_ids: string;
data_auto_list: ArticleList[];
number: number;
sort: string;
order_by_type: string;
sort_rules: string;
field_show: string[];
is_cover: string;
@ -48,12 +48,12 @@ const defaultArticleList: DefaultArticleList = {
theme: '0',
carousel_col: '2',
data_type: '0',
category: [],
category_ids: [],
data_list: [],
data_ids: '',
data_auto_list: [],
number: 4,
sort: '0',
order_by_type: '0',
sort_rules: '0',
field_show: ['0', '1'],
is_cover: '1',

16
src/views/layout/components/main/default/article-tabs.ts
View File

@ -10,9 +10,9 @@ interface articleTabsList {
title: string;
desc: string;
data_type: string;
category: string[];
category_ids: string[];
number: number;
sort: string;
order_by_type: string;
sort_rules: string;
is_cover: string;
data_list: ArticleList[];
@ -64,12 +64,12 @@ const defaultArticleTabs: DefaultArticleTabs = {
article_theme: '0',
article_carousel_col: '2',
tabs_list: [
{ id: '1', title: '热门推荐', desc: '简介', data_type: '0', category: [], number: 4, sort: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '2', title: '测试一', desc: '简介', data_type: '0', category: [], number: 4, sort: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '3', title: '测试二', desc: '简介', data_type: '0', category: [], number: 4, sort: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '4', title: '测试三', desc: '简介', data_type: '0', category: [], number: 4, sort: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '5', title: '测试四', desc: '简介', data_type: '0', category: [], number: 4, sort: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '6', title: '测试五', desc: '简介', data_type: '0', category: [], number: 4, sort: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '1', title: '热门推荐', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '2', title: '测试一', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '3', title: '测试二', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '4', title: '测试三', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '5', title: '测试四', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
{ id: '6', title: '测试五', desc: '简介', data_type: '0', category_ids: [], number: 4, order_by_type: '0', sort_rules: '0', is_cover: '1', data_list: [], data_auto_list: [] },
],
field_show: ['0', '1'],
},

12
src/views/layout/components/main/default/goods-list.ts
View File

@ -4,15 +4,15 @@ interface DefaultProductList {
theme: string;
data_type: string;
carousel_col: number;
category: string[];
brand: string[];
category_ids: string[];
brand_ids: string[];
data_ids: string[];
product_show_list: string[];
data_list: string[];
data_auto_list: string[];
is_price_solo: string;
number: number;
sort: string;
order_by_type: string;
sort_rules: string;
is_show: string[];
is_shop_show: string;
@ -60,12 +60,12 @@ const defaultProductList: DefaultProductList = {
product_show_list: [],
data_list: [],
data_auto_list: [],
category: [],
brand: [],
category_ids: [],
brand_ids: [],
data_ids: [],
is_price_solo: '1',
number: 4,
sort: '0',
order_by_type: '0',
sort_rules: '0',
is_show: ['title', 'plugins_view_icon', 'price', 'sales_count', 'original_price'],
is_shop_show: '1',

14
src/views/layout/components/main/default/goods-tabs.ts
View File

@ -5,11 +5,11 @@ interface articleTabsList {
img: uploadList[];
desc: string;
data_type: string;
category: string[];
brand: string[];
category_ids: string[];
brand_ids: string[];
data_ids: string[];
number: number;
sort: string;
order_by_type: string;
sort_rules: string;
data_list: [];
}
@ -75,10 +75,10 @@ const defaultProductList: DefaultProductList = {
theme: '0',
carousel_col: 3,
tabs_list: [
{ id: '1', title: '热门推荐', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] },
{ id: '2', title: '测试一', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] },
{ id: '3', title: '测试二', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] },
{ id: '4', title: '测试三', img: [], desc: '简介', data_type: '0', category: [], brand: [], data_ids: [], number: 4, sort: '0', sort_rules: '0', data_list: [] },
{ id: '1', title: '热门推荐', img: [], desc: '简介', data_type: '0', category_ids: [], brand_ids: [], data_ids: [], number: 4, order_by_type: '0', sort_rules: '0', data_list: [] },
{ id: '2', title: '测试一', img: [], desc: '简介', data_type: '0', category_ids: [], brand_ids: [], data_ids: [], number: 4, order_by_type: '0', sort_rules: '0', data_list: [] },
{ id: '3', title: '测试二', img: [], desc: '简介', data_type: '0', category_ids: [], brand_ids: [], data_ids: [], number: 4, order_by_type: '0', sort_rules: '0', data_list: [] },
{ id: '4', title: '测试三', img: [], desc: '简介', data_type: '0', category_ids: [], brand_ids: [], data_ids: [], number: 4, order_by_type: '0', sort_rules: '0', data_list: [] },
],
is_show: ['title', 'plugins_view_icon', 'price', 'sales_count', 'original_price'],
is_shop_show: '1',

4
src/views/layout/components/main/default/tabs.ts
View File

@ -14,6 +14,7 @@ interface defaultTabs {
content: {
tabs_theme: string;
tabs_top_up: string;
home_data: tabs_page;
tabs_list: tabs_page[];
};
style: {
@ -33,8 +34,9 @@ const defaultTabs: defaultTabs = {
content: {
tabs_theme: '0',
tabs_top_up: '1',
home_data: { id: get_math(), title: '首页', desc: '简介', data_type: '0', classify: {}, micro_page: '', micro_page_list: {}, category_list: {} },
tabs_list: [
{ id: get_math(), title: '首页', desc: '简介', data_type: '0', classify: {}, micro_page: '', micro_page_list: {}, category_list: {} },
{ id: get_math(), title: '热门推荐', desc: '简介', data_type: '0', classify: {}, micro_page: '', micro_page_list: {}, category_list: {} },
{ id: get_math(), title: '测试一', desc: '简介', data_type: '0', classify: {}, micro_page: '', micro_page_list: {}, category_list: {} },
{ id: get_math(), title: '测试二', desc: '简介', data_type: '0', classify: {}, micro_page: '', micro_page_list: {}, category_list: {} },
],

8
src/views/layout/components/main/index.vue
View File

@ -25,11 +25,11 @@
<div class="drawer-content pt-5" :style="{ left: drawer_selected ? '0' : '-100%' }">
<div class="size-14 cr-3 fw pl-12 drawer-title" :style="{ opacity: drawer_selected ? '1' : '0' }">已选组件({{ diy_data.length }})</div>
<div ref="left_scrollTop" class="drawer-drag-area">
<li v-for="(item, index) in tabs_data" :key="index" :class="['flex ptb-12 plr-10 gap-y-8 re align-c drawer-drag', { 'drawer-drag-bg': item.show_tabs == '1' }]" @click="set_tabs_event(true)">
<el-icon class="iconfont icon-drag size-16 cr-d" />
<div v-for="(item, index) in tabs_data" :key="index" :class="['flex ptb-12 plr-10 gap-y-8 re align-c drawer-drag', { 'drawer-drag-bg': item.show_tabs == '1' }]" @click="set_tabs_event(true)">
<el-icon class="iconfont icon-jinzhi size-16 cr-d" />
<span class="size-12 cr-6">{{ item.name }}</span>
<el-icon class="iconfont icon-close-b size-16 abs" :style="[item.show_tabs == '1' ? '' : 'display:none']" @click.stop="del(index, true)" />
</li>
</div>
<VueDraggable v-model="diy_data" :animation="500" target=".sort-target" :scroll="true" :on-sort="on_sort">
<TransitionGroup type="transition" tag="ul" name="fade" class="sort-target flex-col">
<li v-for="(item, index) in diy_data" :key="index" :class="['flex ptb-12 plr-10 gap-y-8 re align-c drawer-drag', { 'drawer-drag-bg': item.show_tabs == '1' }]" @click="on_choose(index, item.show_tabs)">
@ -40,7 +40,7 @@
</TransitionGroup>
</VueDraggable>
</div>
</div>
</div>34
</div>
<!-- 视图渲染 -->
<div class="main re">