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

1.链接优化 

sws 2024-08-19
v1.0.0
sws 2024-08-19 10:33:51 +08:00
parent b1191d84d1
commit 55f5073307
10 changed files with 467 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/common/upload/index.vue
View File

@ -187,8 +187,8 @@
<script lang="ts" setup>
import { ext_img_name_list, ext_video_name_list, ext_file_name_list, ext_file_name_list_map } from './index';
import UploadAPI, { Tree } from '@/api/upload';
import { uploadrStore } from '@/store';
const upload_store = uploadrStore();
import { uploadStore } from '@/store';
const upload_store = uploadStore();
const app = getCurrentInstance();
/**
* @description: 图片上传
@ -309,6 +309,7 @@ const get_tree = () => {
type_data.value = [all_tree, ...res.data.category_list];
type_data_list.value = res.data.category_list;
upload_store.set_category(type_data_list.value);
upload_store.set_is_upload_api(true);
});
};
@ -588,7 +589,6 @@ onMounted(() => {
// 监听点击事件
document.addEventListener('click', video_show);
if (!upload_store.is_upload_api) {
upload_store.set_is_upload_api(true);
get_tree();
} else {
type_data.value = upload_store.category;

4
src/components/common/upload/upload-model.vue
View File

@ -157,8 +157,8 @@
</template>
<script lang="ts" setup>
import UploadAPI, { Tree } from '@/api/upload';
import { uploadrStore } from '@/store';
const upload_store = uploadrStore();
import { uploadStore } from '@/store';
const upload_store = uploadStore();
import type { UploadFile, UploadFiles, UploadUserFile, FormRules, FormInstance } from 'element-plus';
import { annex_size_to_unit, ext_name, get_math } from '@/utils';
import { ext_img_name_list, ext_video_name_list, ext_file_name_list, ext_file_name_list_map } from './index';

230
src/components/common/url-value/index copy.vue Normal file
View File

@ -0,0 +1,230 @@
<!-- 上传组件 -->
<template>
<el-dialog v-model="dialogVisible" class="radius-lg" width="1168" append-to-body @close="close_event">
<template #header>
<div class="title center re">
<div class="tc size-16 fw">选择链接</div>
</div>
</template>
<div class="url-value-content pa-20 flex-row">
<div 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>
</el-menu-item>
</el-menu>
</div>
<div class="right-content flex-1">
<template v-if="link_select == 'shop'">
<link-list v-model="link_value" :reset="reset_compontent"></link-list>
</template>
<template v-else-if="link_select == 'goods-category'">
<link-goods-category v-model="link_value" :reset="reset_compontent"></link-goods-category>
</template>
<template v-else-if="link_select == 'goods-search'">
<link-goods-search :reset="reset_compontent" :status="component_status" @update:link="goods_category_link" @type="goods_category_type_change" @required="required_tips"></link-goods-search>
</template>
<template v-else-if="link_select == 'goods'">
<link-goods v-model="link_value" :reset="reset_compontent"></link-goods>
</template>
<template v-else-if="link_select == 'articles'">
<link-articles v-model="link_value" :reset="reset_compontent"></link-articles>
</template>
<template v-else-if="link_select == 'diy'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'design'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'custom-view'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'custom'">
<link-custom :reset="reset_compontent" :status="component_status" @update:link="custom_link" @required="required_tips"></link-custom>
</template>
<template v-else-if="link_select == 'plugins'">
<link-list v-model="link_value" :reset="reset_compontent"></link-list>
</template>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button class="plr-28 ptb-10" @click="close_event">取消</el-button>
<el-button class="plr-28 ptb-10" type="primary" @click="confirm_event">确定</el-button>
</span>
</template>
</el-dialog>
<div class="flex-row align-c gap-10 br-d radius-sm plr-11 url-value-input" @click="dialogVisible = true">
<div class="flex-1 flex-width size-12 text-line-1">
<text v-if="!is_obj_empty(modelValue)">{{ modelValue.name }}</text>
<text v-else class="cr-9">{{ placeholder }}</text>
</div>
<div class="value-input-icon">
<template v-if="is_obj_empty(modelValue)">
<icon name="arrow-right" size="12" color="9"></icon>
</template>
<template v-else>
<div @click.stop="clear_model_value">
<icon name="close-o" size="12" color="c"></icon>
</div>
</template>
</div>
</div>
</template>
<script lang="ts" setup>
import { MenuItemClicked } from 'element-plus/es/components/menu/src/types';
import { is_obj_empty } from '@/utils';
import { PropType } from 'vue';
const app = getCurrentInstance();
/**
* @description: 页面链接
* @param modelValue{Object} 默认值
* @param dialogVisible {Boolean} 弹窗显示
* @param type{String} 链接类型为空数组则表示无限制，全部可用，传过来则表示传的值可用
* @param placeholder{String} 提示文字
* @return {*} update:modelValue
*/
const props = defineProps({
type: {
type: Array as PropType<string[]>,
default: () => [],
},
placeholder: {
type: String,
default: '请选择链接',
},
});
const modelValue = defineModel({ type: Object, default: {} });
const dialogVisible = defineModel('visibleDialog', { type: Boolean, default: false });
const link_value = ref({});
const reset_compontent = ref(false);
const custom_link_type = ref(props.type);
const base_data = reactive([
{
name: '商城页面',
type: 'shop',
data: [{ name: '基础链接', data: [{ name: '', page: '' }] }],
},
{
name: '商品分类',
type: 'goods-category',
data: null,
},
{
name: '商品搜索',
type: 'goods-search',
data: null,
},
{
name: '商品页面',
type: 'goods',
data: null,
},
{
name: '文章页面',
type: 'articles',
data: null,
},
{
name: 'DIY页面',
type: 'diy',
data: null,
},
{
name: '页面设计',
type: 'design',
data: null,
},
{
name: '自定义页面',
type: 'custom-view',
data: null,
},
{
name: '自定义链接',
type: 'custom',
data: null,
},
{
name: '插件',
type: 'plugins',
data: [{ name: '多商户', data: [{ name: '1', page: '2' }] }],
},
]);
// 弹窗显示
//#region 链接回调 -----------------------------------------------start
// 菜单选中回调
const link_select = ref(props.type.length == 0 ? 'shop' : props.type[0]);
const handle_select = (index: string, indexPath: string[], item: MenuItemClicked, routeResult: any) => {
// console.log(index, indexPath, item, routeResult);
link_select.value = index;
};
//#endregion 链接回调 -----------------------------------------------end
//@region 子组件回调 -----------------------------------------------start
const component_status = ref(false);
// 商品分类选中回调
const goods_category_type = ref(0);
const goods_category_type_change = (type: number) => {
goods_category_type.value = type;
};
const goods_category_link = (data: object, type: number) => {
if (type == 2) {
modelValue.value = data;
close_event();
} else {
link_value.value = data;
}
};
// 自定义地址回调
const custom_link = (data: object) => {
modelValue.value = data;
close_event();
};
// 错误回调
const required_tips = () => {
ElMessage({
type: 'warning',
message: '必填项不能为空',
});
};
//#endregion 子组件回调 -----------------------------------------------end
//#region 链接确认回调 -----------------------------------------------start
// 取消回调
const close_event = () => {
link_select.value = props.type.length == 0 ? 'shop' : props.type[0];
dialogVisible.value = false;
link_value.value = {};
reset_compontent.value = !reset_compontent.value;
};
// 确认回调
const confirm_event = () => {
// 判断是否是自定义页面和商品查询
if (link_select.value == 'custom' || (link_select.value == 'goods-search' && goods_category_type.value == 2)) {
component_status.value = !component_status.value;
} else {
if (is_obj_empty(link_value.value)) {
ElMessage({
type: 'warning',
message: '请先选择链接',
});
} else {
modelValue.value = link_value.value;
close_event();
}
}
};
//#endregion 链接确认回调 -----------------------------------------------end
//#endregion 链接清空-------------------------------------------------start
const clear_model_value = () => {
modelValue.value = {};
};
//#endregion 链接清空-------------------------------------------------end
</script>
<style lang="scss" scoped>
@import 'index.scss';
</style>

179
src/components/common/url-value/index.vue
View File

@ -1,59 +1,5 @@
<!-- 上传组件 -->
<template>
<el-dialog v-model="dialogVisible" class="radius-lg" width="1168" append-to-body @close="close_event">
<template #header>
<div class="title center re">
<div class="tc size-16 fw">选择链接</div>
</div>
</template>
<div class="url-value-content pa-20 flex-row">
<div 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>
</el-menu-item>
</el-menu>
</div>
<div class="right-content flex-1">
<template v-if="link_select == 'shop'">
<link-list v-model="link_value" :reset="reset_compontent"></link-list>
</template>
<template v-else-if="link_select == 'goods-category'">
<link-goods-category v-model="link_value" :reset="reset_compontent"></link-goods-category>
</template>
<template v-else-if="link_select == 'goods-search'">
<link-goods-search :reset="reset_compontent" :status="component_status" @update:link="goods_category_link" @type="goods_category_type_change" @required="required_tips"></link-goods-search>
</template>
<template v-else-if="link_select == 'goods'">
<link-goods v-model="link_value" :reset="reset_compontent"></link-goods>
</template>
<template v-else-if="link_select == 'articles'">
<link-articles v-model="link_value" :reset="reset_compontent"></link-articles>
</template>
<template v-else-if="link_select == 'diy'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'design'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'custom-view'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'custom'">
<link-custom :reset="reset_compontent" :status="component_status" @update:link="custom_link" @required="required_tips"></link-custom>
</template>
<template v-else-if="link_select == 'plugins'">
<link-list v-model="link_value" :reset="reset_compontent"></link-list>
</template>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button class="plr-28 ptb-10" @click="close_event">取消</el-button>
<el-button class="plr-28 ptb-10" type="primary" @click="confirm_event">确定</el-button>
</span>
</template>
</el-dialog>
<div class="flex-row align-c gap-10 br-d radius-sm plr-11 url-value-input" @click="dialogVisible = true">
<div class="flex-1 flex-width size-12 text-line-1">
<text v-if="!is_obj_empty(modelValue)">{{ modelValue.name }}</text>
@ -70,11 +16,10 @@
</template>
</div>
</div>
<url-value-dialog v-model:modelValue="modelValue" v-model:dialogVisible="dialogVisible" :type="type"></url-value-dialog>
</template>
<script lang="ts" setup>
import { MenuItemClicked } from 'element-plus/es/components/menu/src/types';
import { is_obj_empty } from '@/utils';
import { PropType } from 'vue';
const app = getCurrentInstance();
/**
@ -97,128 +42,6 @@ const props = defineProps({
});
const modelValue = defineModel({ type: Object, default: {} });
const dialogVisible = defineModel('visibleDialog', { type: Boolean, default: false });
const link_value = ref({});
const reset_compontent = ref(false);
const custom_link_type = ref(props.type);
const base_data = reactive([
{
name: '商城页面',
type: 'shop',
data: [{ name: '基础链接', data: [{ name: '', page: '' }] }],
},
{
name: '商品分类',
type: 'goods-category',
data: null,
},
{
name: '商品搜索',
type: 'goods-search',
data: null,
},
{
name: '商品页面',
type: 'goods',
data: null,
},
{
name: '文章页面',
type: 'articles',
data: null,
},
{
name: 'DIY页面',
type: 'diy',
data: null,
},
{
name: '页面设计',
type: 'design',
data: null,
},
{
name: '自定义页面',
type: 'custom-view',
data: null,
},
{
name: '自定义链接',
type: 'custom',
data: null,
},
{
name: '插件',
type: 'plugins',
data: [{ name: '多商户', data: [{ name: '1', page: '2' }] }],
},
]);
// 弹窗显示
//#region 链接回调 -----------------------------------------------start
// 菜单选中回调
const link_select = ref(props.type.length == 0 ? 'shop' : props.type[0]);
const handle_select = (index: string, indexPath: string[], item: MenuItemClicked, routeResult: any) => {
// console.log(index, indexPath, item, routeResult);
link_select.value = index;
};
//#endregion 链接回调 -----------------------------------------------end
//@region 子组件回调 -----------------------------------------------start
const component_status = ref(false);
// 商品分类选中回调
const goods_category_type = ref(0);
const goods_category_type_change = (type: number) => {
goods_category_type.value = type;
};
const goods_category_link = (data: object, type: number) => {
if (type == 2) {
modelValue.value = data;
close_event();
} else {
link_value.value = data;
}
};
// 自定义地址回调
const custom_link = (data: object) => {
modelValue.value = data;
close_event();
};
// 错误回调
const required_tips = () => {
ElMessage({
type: 'warning',
message: '必填项不能为空',
});
};
//#endregion 子组件回调 -----------------------------------------------end
//#region 链接确认回调 -----------------------------------------------start
// 取消回调
const close_event = () => {
link_select.value = props.type.length == 0 ? 'shop' : props.type[0];
dialogVisible.value = false;
link_value.value = {};
reset_compontent.value = !reset_compontent.value;
};
// 确认回调
const confirm_event = () => {
// 判断是否是自定义页面和商品查询
if (link_select.value == 'custom' || (link_select.value == 'goods-search' && goods_category_type.value == 2)) {
component_status.value = !component_status.value;
} else {
if (is_obj_empty(link_value.value)) {
ElMessage({
type: 'warning',
message: '请先选择链接',
});
} else {
modelValue.value = link_value.value;
close_event();
}
}
};
//#endregion 链接确认回调 -----------------------------------------------end
//#endregion 链接清空-------------------------------------------------start
const clear_model_value = () => {
modelValue.value = {};

204
src/components/common/url-value/url-value-dialog.vue Normal file
View File

@ -0,0 +1,204 @@
<template>
<el-dialog v-model="dialogVisible" class="radius-lg" width="1168" append-to-body @close="close_event">
<template #header>
<div class="title center re">
<div class="tc size-16 fw">选择链接</div>
</div>
</template>
<div class="url-value-content pa-20 flex-row">
<div 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>
</el-menu-item>
</el-menu>
</div>
<div class="right-content flex-1">
<template v-if="link_select == 'shop'">
<link-list v-model="link_value" :reset="reset_compontent"></link-list>
</template>
<template v-else-if="link_select == 'goods-category'">
<link-goods-category v-model="link_value" :reset="reset_compontent"></link-goods-category>
</template>
<template v-else-if="link_select == 'goods-search'">
<link-goods-search :reset="reset_compontent" :status="component_status" @update:link="goods_category_link" @type="goods_category_type_change" @required="required_tips"></link-goods-search>
</template>
<template v-else-if="link_select == 'goods'">
<link-goods v-model="link_value" :reset="reset_compontent"></link-goods>
</template>
<template v-else-if="link_select == 'articles'">
<link-articles v-model="link_value" :reset="reset_compontent"></link-articles>
</template>
<template v-else-if="link_select == 'diy'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'design'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'custom-view'">
<link-table v-model="link_value" :reset="reset_compontent"></link-table>
</template>
<template v-else-if="link_select == 'custom'">
<link-custom :reset="reset_compontent" :status="component_status" @update:link="custom_link" @required="required_tips"></link-custom>
</template>
<template v-else-if="link_select == 'plugins'">
<link-list v-model="link_value" :reset="reset_compontent"></link-list>
</template>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button class="plr-28 ptb-10" @click="close_event">取消</el-button>
<el-button class="plr-28 ptb-10" type="primary" @click="confirm_event">确定</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { MenuItemClicked } from 'element-plus/es/components/menu/src/types';
import { is_obj_empty } from '@/utils';
import { PropType } from 'vue';
const app = getCurrentInstance();
/**
* @description: 页面链接
* @param modelValue{Object} 默认值
* @param dialogVisible {Boolean} 弹窗显示
* @param type{String} 链接类型为空数组则表示无限制，全部可用，传过来则表示传的值可用
* @param placeholder{String} 提示文字
* @return {*} update:modelValue
*/
const props = defineProps({
type: {
type: Array as PropType<string[]>,
default: () => [],
},
});
const modelValue = defineModel({ type: Object, default: {} });
const dialogVisible = defineModel('visibleDialog', { type: Boolean, default: false });
const link_value = ref({});
const reset_compontent = ref(false);
const custom_link_type = ref(props.type);
const base_data = reactive([
{
name: '商城页面',
type: 'shop',
data: [{ name: '基础链接', data: [{ name: '', page: '' }] }],
},
{
name: '商品分类',
type: 'goods-category',
data: null,
},
{
name: '商品搜索',
type: 'goods-search',
data: null,
},
{
name: '商品页面',
type: 'goods',
data: null,
},
{
name: '文章页面',
type: 'articles',
data: null,
},
{
name: 'DIY页面',
type: 'diy',
data: null,
},
{
name: '页面设计',
type: 'design',
data: null,
},
{
name: '自定义页面',
type: 'custom-view',
data: null,
},
{
name: '自定义链接',
type: 'custom',
data: null,
},
{
name: '插件',
type: 'plugins',
data: [{ name: '多商户', data: [{ name: '1', page: '2' }] }],
},
]);
// 弹窗显示
//#region 链接回调 -----------------------------------------------start
// 菜单选中回调
const link_select = ref(props.type.length == 0 ? 'shop' : props.type[0]);
const handle_select = (index: string, indexPath: string[], item: MenuItemClicked, routeResult: any) => {
// console.log(index, indexPath, item, routeResult);
link_select.value = index;
};
//#endregion 链接回调 -----------------------------------------------end
//@region 子组件回调 -----------------------------------------------start
const component_status = ref(false);
// 商品分类选中回调
const goods_category_type = ref(0);
const goods_category_type_change = (type: number) => {
goods_category_type.value = type;
};
const goods_category_link = (data: object, type: number) => {
if (type == 2) {
modelValue.value = data;
close_event();
} else {
link_value.value = data;
}
};
// 自定义地址回调
const custom_link = (data: object) => {
modelValue.value = data;
close_event();
};
// 错误回调
const required_tips = () => {
ElMessage({
type: 'warning',
message: '必填项不能为空',
});
};
//#endregion 子组件回调 -----------------------------------------------end
//#region 链接确认回调 -----------------------------------------------start
// 取消回调
const close_event = () => {
link_select.value = props.type.length == 0 ? 'shop' : props.type[0];
dialogVisible.value = false;
link_value.value = {};
reset_compontent.value = !reset_compontent.value;
};
// 确认回调
const confirm_event = () => {
// 判断是否是自定义页面和商品查询
if (link_select.value == 'custom' || (link_select.value == 'goods-search' && goods_category_type.value == 2)) {
component_status.value = !component_status.value;
} else {
if (is_obj_empty(link_value.value)) {
ElMessage({
type: 'warning',
message: '请先选择链接',
});
} else {
modelValue.value = link_value.value;
close_event();
}
}
};
//#endregion 链接确认回调 -----------------------------------------------end
</script>
<style lang="scss" scoped>
@import 'index.scss';
</style>

1
src/components/model-auxiliary-line/index.vue
View File

@ -17,7 +17,6 @@ const style_container = ref('');
watch(
props.value,
(newVal, oldValue) => {
console.log(1);
const new_content = newVal?.content || {};
const new_style = newVal?.style || {};
let border_content = `border-bottom-style: ${new_content?.styles || 'solid'};`;

1
src/components/model-hot-zone/index.vue
View File

@ -38,7 +38,6 @@ watch(
img_height.value = new_content?.hot.img_height || 1;
style_container.value = common_styles_computer(new_style.common_style);
hot_data.value = new_content?.hot?.data || [];
console.log(1);
},
{ immediate: true, deep: true }
);

1
src/store/index.ts
View File

@ -9,4 +9,5 @@ export function setupStore(app: App<Element>) {
}
export * from './modules/footer-nav-content';
export * from './modules/upload';
export * from './modules/url-value';
export { store };

2
src/store/modules/upload.ts
View File

@ -1,7 +1,7 @@
import { ref, computed } from 'vue';
import { defineStore } from 'pinia';
export const uploadrStore = defineStore('upload', () => {
export const uploadStore = defineStore('upload', () => {
// 上传是否需要调接口判断
const is_upload_api = ref(false);
// 上传分类列表

25
src/store/modules/url-value.ts Normal file
View File

@ -0,0 +1,25 @@
import { ref, computed } from 'vue';
import { defineStore } from 'pinia';
export const urlValueStore = defineStore('urlValue', () => {
// 链接是否需要调接口判断
const is_urlValue_api = ref(false);
// 链接数据
const category = ref<any[]>([]);
// 存储链接数据
const set_category = (data: any[]) => {
category.value = data;
is_urlValue_api.value = true;
};
// 如果为false 则转为true
const set_is_urlValue_api = (bool: boolean) => {
is_urlValue_api.value = bool;
};
return {
category,
is_urlValue_api,
set_category,
set_is_urlValue_api,
};
});