Merge branch 'dev-sws' into dev-yxl

v1.0.0
于肖磊 2024-08-20 18:31:54 +08:00
commit ebc44e37b6
12 changed files with 293 additions and 65 deletions

View File

@ -49,6 +49,14 @@ class UrlValueAPI {
data,
});
}
/** 获取品牌列表 */
static getBrandList(data: any) {
return request({
url: `diyapi/brandlist`,
method: 'post',
data,
});
}
}
export default UrlValueAPI;

View File

@ -132,7 +132,7 @@
</div>
</div>
<div class="mt-10 flex-row jc-e">
<el-pagination :current-page="page" :page-size="30" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="current_page_change" />
<el-pagination :current-page="page" background :page-size="30" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="current_page_change" />
</div>
</div>
</div>

View File

@ -16,7 +16,7 @@
</template>
</div>
</div>
<url-value-dialog v-model:modelValue="modelValue" v-model:dialogVisible="dialogVisible" :type="type"></url-value-dialog>
<url-value-dialog v-model:modelValue="new_model_value" v-model:dialogVisible="dialogVisible" :type="type" @update:model-value="model_value_call_back"></url-value-dialog>
</template>
<script lang="ts" setup>
import { is_obj_empty } from '@/utils';
@ -40,12 +40,18 @@ const props = defineProps({
},
});
const modelValue = defineModel({ type: Object, default: {} });
const new_model_value = ref<any[]>([]);
const dialogVisible = defineModel('dialogVisible', { type: Boolean, default: false });
//#endregion -------------------------------------------------start
const clear_model_value = () => {
modelValue.value = {};
};
//#endregion -------------------------------------------------end
const model_value_call_back = (value: any[]) => {
if (value.length > 0) {
modelValue.value = JSON.parse(JSON.stringify(value[0]));
}
};
</script>
<style lang="scss" scoped>
@import 'index.scss';

View File

@ -12,8 +12,9 @@
</el-input>
</div>
<div class="content">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click">
<el-table-column label="#" width="40" type="">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click" @select="handle_select" @select-all="handle_select">
<el-table-column v-if="multiple" type="selection" width="60" />
<el-table-column v-else label="#" width="60" type="">
<template #default="scope">
<el-radio v-model="template_selection" :label="scope.$index + ''">&nbsp;</el-radio>
</template>
@ -32,7 +33,7 @@
</template>
</el-table>
<div class="mt-10 flex-row jc-e">
<el-pagination :current-page="page" :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
<el-pagination :current-page="page" background :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
</div>
</div>
</div>
@ -47,6 +48,10 @@ const props = defineProps({
type: Boolean,
default: () => false,
},
multiple: {
type: Boolean,
default: () => false,
},
});
watch(
() => props.reset,
@ -78,17 +83,11 @@ interface articleCategory {
}
const article_category_list = ref<articleCategory[]>([]);
const template_selection = ref('');
const row_click = (row: any) => {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: linkData) => item.id == row.id).toString();
modelValue.value = row;
};
//#region -----------------------------------------------start
//
const page = ref(1);
//
const page_size = ref(10);
const page_size = ref(30);
//
const data_total = ref(0);
//
@ -106,6 +105,16 @@ const get_list = (new_page: number) => {
});
};
//#region -----------------------------------------------end
const row_click = (row: any) => {
if (!props.multiple) {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = [row];
}
};
const handle_select = (selection: any) => {
modelValue.value = selection;
};
</script>
<style lang="scss" scoped>
.container {
@ -118,7 +127,6 @@ const get_list = (new_page: number) => {
}
.img {
width: 3.6rem;
height: 3.6rem;
}
}
}

View File

@ -0,0 +1,138 @@
<template>
<!-- 品牌 -->
<div class="container">
<div class="flex-row jc-e gap-20 mb-20">
<el-select v-model="brand_ids" class="search-w" placeholder="品牌" clearable @change="handle_search">
<el-option v-for="item in brand_category" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
<el-input v-model="search_value" placeholder="请输入搜索内容" class="search-w" @change="handle_search">
<template #suffix>
<icon name="search" size="16" color="9" class="c-pointer" @click="handle_search"></icon>
</template>
</el-input>
</div>
<div class="content">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click" @select="handle_select" @select-all="handle_select">
<el-table-column v-if="multiple" type="selection" width="60" />
<el-table-column v-else label="#" width="60" type="">
<template #default="scope">
<el-radio v-model="template_selection" :label="scope.$index + ''">&nbsp;</el-radio>
</template>
</el-table-column>
<el-table-column prop="id" label="ID" width="80" type="" />
<el-table-column prop="images" label="品牌">
<template #default="scope">
<div class="flex-row align-c gap-10">
<image-empty v-model="scope.row.logo" class="img"></image-empty>
<div class="flex-1">{{ scope.row.name }}</div>
</div>
</template>
</el-table-column>
<el-table-column prop="brand_category_text" label="分类名称" />
<template #empty>
<no-data></no-data>
</template>
</el-table>
<div class="mt-10 flex-row jc-e">
<el-pagination :current-page="page" background :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
</div>
</div>
</div>
</template>
<script lang="ts" setup>
import UrlValueAPI from '@/api/url-value';
import { urlValueStore, urlValue, pageLinkList } from '@/store';
const url_value_store = urlValueStore();
const props = defineProps({
//
reset: {
type: Boolean,
default: () => false,
},
multiple: {
type: Boolean,
default: () => false,
},
});
watch(
() => props.reset,
() => {
init();
}
);
onMounted(() => {
init();
});
const modelValue = defineModel({ type: Object, default: {} });
const tableData = ref<pageLinkList[]>([]);
const search_value = ref('');
const cascader_config = {
value: 'id',
label: 'name',
children: 'items',
};
const init = () => {
template_selection.value = '';
category_ids.value = [];
brand_ids.value = '';
search_value.value = '';
brand_category.value = url_value_store.url_value.brand_category;
get_list(1);
};
const handle_search = () => {
get_list(1);
};
const category_ids = ref([]);
const brand_ids = ref('');
const brand_category = ref<any[]>([]);
const emit = defineEmits(['update:link']);
const template_selection = ref('');
//#region -----------------------------------------------start
//
const page = ref(1);
//
const page_size = ref(30);
//
const data_total = ref(0);
//
const get_list = (new_page: number) => {
let new_data = {
page: new_page,
keywords: search_value.value,
page_size: page_size.value,
category_ids: brand_ids.value,
};
UrlValueAPI.getBrandList(new_data).then((res: any) => {
tableData.value = res.data.data_list;
data_total.value = res.data.data_total;
page.value = res.data.page;
});
};
//#region -----------------------------------------------end
const row_click = (row: any) => {
if (!props.multiple) {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = [row];
}
};
const handle_select = (selection: any) => {
modelValue.value = selection;
};
</script>
<style lang="scss" scoped>
.container {
.search-w {
width: 22.5rem;
}
.content {
:deep(.el-table__inner-wrapper:before) {
background-color: transparent;
}
.img {
width: 3.6rem;
}
}
}
</style>

View File

@ -10,12 +10,12 @@
</div>
<div class="content">
<el-table :data="new_table_data" class="w" :header-cell-style="{ background: '#f7f7f7' }" :tree-props="{ children: 'items' }" row-key="id" height="460" fixed @row-click="row_click">
<el-table-column label="#" width="120" type="">
<el-table-column label="#" width="60" type="">
<template #default="scope">
<el-radio v-model="template_selection" :label="scope.$index + ''">&nbsp;</el-radio>
</template>
</el-table-column>
<el-table-column prop="id" label="ID" width="180" type="" />
<el-table-column prop="id" label="ID" width="80" type="" />
<el-table-column prop="name" label="分类名称"></el-table-column>
<el-table-column prop="icon" label="分类图标">
<template #default="scope">
@ -120,7 +120,7 @@ const row_click = (row: any) => {
};
const new_table_datas = array_conversion(JSON.parse(JSON.stringify(new_table_data.value)));
template_selection.value = new_table_datas.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = row;
modelValue.value = [row];
};
</script>
<style lang="scss" scoped>

View File

@ -13,8 +13,9 @@
</el-input>
</div>
<div class="content">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click">
<el-table-column label="#" width="40" type="">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click" @select="handle_select" @select-all="handle_select">
<el-table-column v-if="multiple" type="selection" width="60" />
<el-table-column v-else label="#" width="60" type="">
<template #default="scope">
<el-radio v-model="template_selection" :label="scope.$index + ''">&nbsp;</el-radio>
</template>
@ -35,7 +36,7 @@
</template>
</el-table>
<div class="mt-10 flex-row jc-e">
<el-pagination :current-page="page" :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
<el-pagination :current-page="page" background :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
</div>
</div>
</div>
@ -50,6 +51,10 @@ const props = defineProps({
type: Boolean,
default: () => false,
},
multiple: {
type: Boolean,
default: () => false,
},
});
watch(
() => props.reset,
@ -91,12 +96,6 @@ const category_list = ref<pageLinkList[]>([]);
const brand_list = ref<any[]>([]);
const emit = defineEmits(['update:link']);
const template_selection = ref('');
const row_click = (row: any) => {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = row;
};
//#region -----------------------------------------------start
//
const page = ref(1);
@ -121,6 +120,16 @@ const get_list = (new_page: number) => {
});
};
//#region -----------------------------------------------end
const row_click = (row: any) => {
if (!props.multiple) {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = [row];
}
};
const handle_select = (selection: any) => {
modelValue.value = selection;
};
</script>
<style lang="scss" scoped>
.container {
@ -133,7 +142,6 @@ const get_list = (new_page: number) => {
}
.img {
width: 3.6rem;
height: 3.6rem;
}
}
}

View File

@ -17,7 +17,9 @@
<div v-for="item in new_base_data" :key="item.type">
<div class="fw mb-15">{{ item.name }}</div>
<div class="flex-row flex-wrap gap-15">
<div v-for="(child, index) in item.data" :key="index" class="item" :class="menu_active == item.page ? 'active' : ''" @click="menu_link_event(child)">{{ child.name }}</div>
<div v-for="(child, index) in item.data" :key="index" class="item" :class="menu_active == child.page ? 'active' : ''" @click="menu_link_event(child)">
{{ child.name }}
</div>
</div>
</div>
</template>
@ -50,7 +52,7 @@ watch(
init();
}
);
const modelValue = defineModel({ type: Object, default: {} });
const modelValue = defineModel({ type: Array, default: [] });
const search_value = ref('');
const base_data = ref<pageLinkList[]>([]);
const new_base_data = ref<pageLinkList[]>([]);
@ -104,10 +106,10 @@ const emit = defineEmits(['update:link']);
const menu_link_event = (item: any) => {
if (item.page == menu_active.value) {
menu_active.value = '';
modelValue.value = {};
modelValue.value = [];
} else {
menu_active.value = item.page;
modelValue.value = item;
modelValue.value = [item];
}
};
</script>

View File

@ -9,21 +9,29 @@
</el-input>
</div>
<div class="content">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click">
<el-table-column label="#" width="120" type="">
<el-table :data="tableData" class="w" :header-cell-style="{ background: '#f7f7f7' }" row-key="id" height="438" fixed @row-click="row_click" @select="handle_select" @select-all="handle_select">
<el-table-column v-if="multiple" type="selection" width="60" />
<el-table-column v-else label="#" width="60" type="">
<template #default="scope">
<el-radio v-model="template_selection" :label="scope.$index + ''">&nbsp;</el-radio>
</template>
</el-table-column>
<el-table-column prop="id" label="ID" width="180" type="" />
<el-table-column prop="id" label="ID" width="80" type="" />
<el-table-column prop="logo" label="logo" width="100" type="">
<template #default="scope">
<div class="flex-row align-c gap-10">
<image-empty v-model="scope.row.logo" class="img"></image-empty>
<div class="flex-1">{{ scope.row.title }}</div>
</div>
</template>
</el-table-column>
<el-table-column prop="name" label="页面名称" />
<el-table-column prop="link" label="页面链接" />
<template #empty>
<no-data></no-data>
</template>
</el-table>
<div class="mt-10 flex-row jc-e">
<el-pagination :current-page="page" :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
<el-pagination :current-page="page" background :page-size="page_size" :pager-count="5" layout="prev, pager, next" :total="data_total" @current-change="get_list" />
</div>
</div>
</div>
@ -41,6 +49,10 @@ const props = defineProps({
type: Boolean,
default: () => false,
},
multiple: {
type: Boolean,
default: () => false,
},
});
watch(
() => props.reset,
@ -65,12 +77,6 @@ const handle_search = () => {
};
const emit = defineEmits(['update:link']);
const template_selection = ref('');
const row_click = (row: any) => {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = row;
};
//#region -----------------------------------------------start
//
const page = ref(1);
@ -106,6 +112,17 @@ const get_list = (new_page: number) => {
}
};
//#region -----------------------------------------------end
const row_click = (row: any) => {
if (!props.multiple) {
const new_table_data = JSON.parse(JSON.stringify(tableData.value));
template_selection.value = new_table_data.findIndex((item: pageLinkList) => item.id == row.id).toString();
modelValue.value = [row];
}
};
const handle_select = (selection: any) => {
modelValue.value = selection;
};
</script>
<style lang="scss" scoped>
.container {
@ -118,7 +135,6 @@ const get_list = (new_page: number) => {
}
.img {
width: 3.6rem;
height: 3.6rem;
}
}
}

View File

@ -2,11 +2,11 @@
<el-dialog v-model="dialogVisible" class="radius-lg" width="1168" draggable append-to-body @close="close_event">
<template #header>
<div class="title center re">
<div class="tc size-16 fw">选择链接</div>
<div class="tc size-16 fw">{{ dialog_title }}</div>
</div>
</template>
<div class="url-value-content pa-20 flex-row">
<div class="left-content">
<div v-if="type.length !== 1" class="left-content">
<el-menu :default-active="link_select" class="w br-none" @select="handle_select">
<el-menu-item v-for="item in base_data" :key="item.type" :index="item.type" :disabled="!(custom_link_type.length == 0 || custom_link_type.includes(item.type))">
<span>{{ item.name }}</span>
@ -24,13 +24,16 @@
<link-goods-search :reset="reset_compontent" :status="component_status" @update:link="goods_category_link" @type="goods_category_type_change"></link-goods-search>
</template>
<template v-else-if="link_select == 'goods'">
<link-goods v-model="link_value" :reset="reset_compontent"></link-goods>
<link-goods v-model="link_value" :multiple="multiple" :reset="reset_compontent"></link-goods>
</template>
<template v-else-if="link_select == 'article'">
<link-articles v-model="link_value" :reset="reset_compontent"></link-articles>
<link-articles v-model="link_value" :multiple="multiple" :reset="reset_compontent"></link-articles>
</template>
<template v-else-if="link_select == 'diy' || link_select == 'design' || link_select == 'custom-view'">
<link-table :key="link_select" v-model="link_value" :type="link_select" :reset="reset_compontent"></link-table>
<link-table :key="link_select" v-model="link_value" :multiple="multiple" :type="link_select" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'brand'">
<link-brand v-model="link_value" :multiple="multiple" :reset="reset_compontent"></link-brand>
</template>
<template v-else-if="link_select == 'custom-url'">
<link-custom :reset="reset_compontent" :status="component_status" @update:link="custom_link"></link-custom>
@ -48,10 +51,9 @@
<script lang="ts" setup>
import { MenuItemClicked } from 'element-plus/es/components/menu/src/types';
import { is_obj_empty } from '@/utils';
import { PropType } from 'vue';
import UrlValueAPI from '@/api/url-value';
import { urlValueStore, urlValue } from '@/store';
import { urlValueStore } from '@/store';
const url_value_store = urlValueStore();
const app = getCurrentInstance();
/**
@ -66,10 +68,15 @@ const props = defineProps({
type: Array as PropType<string[]>,
default: () => [],
},
// goods/ article/ DIY diy/ design/ custom-view/ brand
multiple: {
type: Boolean,
default: false,
},
});
const modelValue = defineModel({ type: Object, default: {} });
const modelValue = defineModel({ type: Array, default: [] });
const dialogVisible = defineModel('dialogVisible', { type: Boolean, default: false });
const link_value = ref({});
const link_value = ref<any[]>([]);
const reset_compontent = ref(false);
const custom_link_type = ref(props.type);
const base_data = ref<any[]>([]);
@ -117,6 +124,37 @@ const init = () => {
}
}
};
const dialog_title = computed(() => {
if (props.type.length == 1) {
let name = '';
if (props.type[0] == 'shop') {
name = '商城';
} else if (props.type[0] == 'goods-category') {
name = '商品分类';
} else if (props.type[0] == 'goods-search') {
name = '商品搜索';
} else if (props.type[0] == 'goods') {
name = '商品';
} else if (props.type[0] == 'article') {
name = '文章';
} else if (props.type[0] == 'diy') {
name = 'DIY';
} else if (props.type[0] == 'design') {
name = '页面设计';
} else if (props.type[0] == 'custom-view') {
name = '自定义页面';
} else if (props.type[0] == 'custom-url') {
name = '自定义';
} else if (props.type[0] == 'brand') {
name = '品牌';
} else if (props.type[0] == 'plugins') {
name = '插件';
}
return name + '链接';
} else {
return '选择链接';
}
});
//#region -----------------------------------------------start
//
@ -135,15 +173,15 @@ const goods_category_type_change = (type: number) => {
};
const goods_category_link = (data: object, type: number) => {
if (type == 2) {
modelValue.value = data;
modelValue.value = [data];
close_event();
} else {
link_value.value = data;
link_value.value = [data];
}
};
//
const custom_link = (data: object) => {
modelValue.value = data;
modelValue.value = [data];
close_event();
};
//#endregion -----------------------------------------------end
@ -153,7 +191,7 @@ const custom_link = (data: object) => {
const close_event = () => {
link_select.value = props.type.length == 0 ? 'shop' : props.type[0];
dialogVisible.value = false;
link_value.value = {};
link_value.value = [];
reset_compontent.value = !reset_compontent.value;
};
//
@ -162,7 +200,7 @@ const confirm_event = () => {
if (link_select.value == 'custom-url' || (link_select.value == 'goods-search' && goods_category_type.value == 2)) {
component_status.value = !component_status.value;
} else {
if (is_obj_empty(link_value.value)) {
if (link_value.value.length < 1) {
ElMessage({
type: 'warning',
message: '请先选择链接',

View File

@ -92,7 +92,7 @@
</el-form-item>
</card-container>
</el-form>
<url-value-dialog v-model:dialog-visible="urlValueDialogVisible" :type="['article']" @update:model-value="url_value_dialog_call_back"></url-value-dialog>
<url-value-dialog v-model:dialog-visible="urlValueDialogVisible" :type="['article']" multiple @update:model-value="url_value_dialog_call_back"></url-value-dialog>
</div>
</template>
<script setup lang="ts">
@ -172,7 +172,7 @@ const tabs_add = () => {
//
const article_list_remove = (index: number) => {
form.tabs_list[index].article_list.splice(index, 1);
form.tabs_list[active_index.value].article_list.splice(index, 1);
};
const article_list_sort = (item: any) => {
// emit('update:value', item);
@ -183,13 +183,15 @@ const article_add = (index: number) => {
urlValueDialogVisible.value = true;
article_index.value = index;
};
const url_value_dialog_call_back = (item: any) => {
console.log(item);
form.tabs_list[article_index.value].article_list.push({
id: get_math(),
src: 'carousel',
new_url: [],
link: item,
const url_value_dialog_call_back = (item: any[]) => {
// console.log(item);
item.forEach((child: any) => {
form.tabs_list[article_index.value].article_list.push({
id: get_math(),
src: 'carousel',
new_url: [],
link: child,
});
});
};
</script>

View File

@ -9,6 +9,7 @@ export const urlValueStore = defineStore('urlValue', () => {
brand_list: [],
article_category_list: [],
page_link_list: [],
brand_category: [],
});
// 存储链接数据
const set_url_value = (data: urlValue) => {
@ -47,6 +48,7 @@ export interface pageLinkList {
export interface urlValue {
goods_category: any[];
brand_list: any[];
brand_category: any[];
article_category_list: any[];
page_link_list: pageLinkList[];
}