refactor(@vben/common-ui): 优化多个组件的样式和功能
-调整 PPT 预览和工作视图组件的布局和样式 - 优化蜘蛛预览和工作视图组件的加载逻辑 - 更新 Word 预览组件的加载逻辑 - 移除不必要的样式和结构,提高组件性能
This commit is contained in:
parent
4c9cc17366
commit
97593b7dc1
@ -45,7 +45,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
|
|||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<Drawer title="文档预览" :footer="false">
|
<Drawer class="w-[880px]" title="文档预览" :footer="false">
|
||||||
<div v-if="isLoading" class="loading-overlay">正在加载文档,请稍候...</div>
|
<div v-if="isLoading" class="loading-overlay">正在加载文档,请稍候...</div>
|
||||||
<VueOfficePptx
|
<VueOfficePptx
|
||||||
:src="pptx"
|
:src="pptx"
|
||||||
|
@ -427,33 +427,20 @@ watch(
|
|||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
.layout {
|
.layout {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 1000px;
|
min-width: 1400px;
|
||||||
height: 100%;
|
max-height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
background: hsl(216deg 21.74% 95.49%);
|
background: hsl(216deg 21.74% 95.49%);
|
||||||
font-family: AlibabaPuHuiTi, v-deep(var(--ant-font-family)), sans-serif;
|
font-family: AlibabaPuHuiTi, v-deep(var(--ant-font-family)), sans-serif;
|
||||||
border-radius: v-deep(var(--ant-border-radius));
|
border-radius: v-deep(var(--ant-border-radius));
|
||||||
}
|
}
|
||||||
|
|
||||||
.menu {
|
|
||||||
background: #ffffff;
|
|
||||||
width: 280px;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.conversations {
|
|
||||||
padding: 0 12px;
|
|
||||||
flex: 1;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chat {
|
.chat {
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
max-height: 88vh;
|
||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
max-height: 900px;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -462,10 +449,6 @@ watch(
|
|||||||
gap: 16px;
|
gap: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
//.messages {
|
|
||||||
// flex: 1;
|
|
||||||
//}
|
|
||||||
|
|
||||||
.placeholder {
|
.placeholder {
|
||||||
padding-top: 32px;
|
padding-top: 32px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
@ -474,36 +457,7 @@ watch(
|
|||||||
|
|
||||||
.sender {
|
.sender {
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
|
width: 100%;
|
||||||
box-shadow: v-deep(var(--ant-box-shadow));
|
box-shadow: v-deep(var(--ant-box-shadow));
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
|
||||||
display: flex;
|
|
||||||
height: 72px;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: start;
|
|
||||||
padding: 0 24px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo-img {
|
|
||||||
width: 24px;
|
|
||||||
height: 24px;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.logo-span {
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 8px;
|
|
||||||
font-weight: bold;
|
|
||||||
color: v-deep(var(--ant-color-text));
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.addBtn {
|
|
||||||
background: #1677ff0f;
|
|
||||||
border: 1px solid #1677ff34;
|
|
||||||
width: calc(100% - 24px);
|
|
||||||
margin: 12px 12px 24px 12px;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -35,7 +35,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
|
|||||||
if (isOpen) {
|
if (isOpen) {
|
||||||
const data = drawerApi.getData<Record<string, any>>();
|
const data = drawerApi.getData<Record<string, any>>();
|
||||||
if (data) {
|
if (data) {
|
||||||
isLoading.value = false; // 出错时也关闭加载状态
|
isLoading.value = true;
|
||||||
// docx.value = `/spider/${data}`; // 更新 docx 的值
|
// docx.value = `/spider/${data}`; // 更新 docx 的值
|
||||||
docx.value = data; // 更新 docx 的值
|
docx.value = data; // 更新 docx 的值
|
||||||
}
|
}
|
||||||
|
@ -76,9 +76,11 @@ defineOptions({
|
|||||||
|
|
||||||
const props = withDefaults(defineProps<Props>(), {
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
itemMessage: () => null,
|
itemMessage: () => null,
|
||||||
item: () => {
|
item: () => ({
|
||||||
return null;
|
id: '',
|
||||||
},
|
name: '',
|
||||||
|
url: '',
|
||||||
|
}),
|
||||||
runSpider: () => async () => ({
|
runSpider: () => async () => ({
|
||||||
msg: '',
|
msg: '',
|
||||||
code: '',
|
code: '',
|
||||||
@ -279,10 +281,7 @@ const startFetching = async () => {
|
|||||||
userId: '1562',
|
userId: '1562',
|
||||||
conversationId: '',
|
conversationId: '',
|
||||||
files: [],
|
files: [],
|
||||||
inputs: {
|
inputs: {},
|
||||||
publish_start_time,
|
|
||||||
publish_end_time,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
if (res.data.outputs.files) {
|
if (res.data.outputs.files) {
|
||||||
@ -396,7 +395,7 @@ const fetchStatus = ref('');
|
|||||||
|
|
||||||
// 监听 title 变化并更新 resultItems
|
// 监听 title 变化并更新 resultItems
|
||||||
watch(
|
watch(
|
||||||
() => props.title,
|
() => props.item,
|
||||||
() => {
|
() => {
|
||||||
resultItems.value = [];
|
resultItems.value = [];
|
||||||
},
|
},
|
||||||
@ -508,6 +507,7 @@ watch(
|
|||||||
</CardContent>
|
</CardContent>
|
||||||
<CardFooter class="flex justify-end">
|
<CardFooter class="flex justify-end">
|
||||||
<RangePicker
|
<RangePicker
|
||||||
|
v-if="item.id === '77c068fd-d5b6-4c33-97d8-db5511a09b26'"
|
||||||
class="mx-2"
|
class="mx-2"
|
||||||
v-model:value="selectedDateRange"
|
v-model:value="selectedDateRange"
|
||||||
format="YYYY/MM/DD"
|
format="YYYY/MM/DD"
|
||||||
|
@ -35,7 +35,7 @@ const [Drawer, drawerApi] = useVbenDrawer({
|
|||||||
if (isOpen) {
|
if (isOpen) {
|
||||||
const data = drawerApi.getData<Record<string, any>>();
|
const data = drawerApi.getData<Record<string, any>>();
|
||||||
if (data) {
|
if (data) {
|
||||||
isLoading.value = false; // 出错时也关闭加载状态
|
isLoading.value = true;
|
||||||
docx.value = `/docx/${data}`; // 更新 docx 的值
|
docx.value = `/docx/${data}`; // 更新 docx 的值
|
||||||
}
|
}
|
||||||
// url.value = drawerApi.getData<Record<string, any>>();
|
// url.value = drawerApi.getData<Record<string, any>>();
|
||||||
|
Loading…
Reference in New Issue
Block a user