WEB端的 弹框尺寸可以放大,但不做缩小。
This commit is contained in:
@@ -2,6 +2,7 @@
|
||||
import ChatContent from "./components/chatContent.vue";
|
||||
import ThinkingBar from "./components/thinkingBar.vue";
|
||||
import {mapState} from "vuex";
|
||||
import AiDrag from "../../dv/AiDrag.vue";
|
||||
|
||||
export default {
|
||||
name: "AiCopilot",
|
||||
@@ -39,7 +40,7 @@ export default {
|
||||
{icon: "https://cdn.sinoecare.com/i/2024/07/04/66866eda99e4d.png", label: "删除", click: row => v.handleDeleteConversation(row.conversationId)},
|
||||
]
|
||||
},
|
||||
components: {ThinkingBar, ChatContent},
|
||||
components: {AiDrag, ThinkingBar, ChatContent},
|
||||
methods: {
|
||||
getHistory(params) {
|
||||
this.http.post("/app/appaicopilotinfo/list", null, {params}).then(res => {
|
||||
@@ -140,7 +141,7 @@ export default {
|
||||
|
||||
<template>
|
||||
<section class="AiCopilot">
|
||||
<div class="copilot" v-if="show">
|
||||
<ai-drag class="copilot" v-if="show" :w="468" :h="600" :minHeight="600" :minWidth="468" :x="-480" :y="-542">
|
||||
<div class="flex header">
|
||||
<b class="fill" v-text="title"/>
|
||||
<div class="expandBtn pointer" v-text="expandBtn" @click="expand=!expand"/>
|
||||
@@ -181,7 +182,7 @@ export default {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ai-drag>
|
||||
<img class="icon" src="https://cdn.sinoecare.com/i/2024/06/04/665ec6f5ef213.png" @click="show=!show"/>
|
||||
</section>
|
||||
</template>
|
||||
@@ -197,10 +198,23 @@ export default {
|
||||
z-index: 1888;
|
||||
|
||||
.copilot {
|
||||
border-radius: 0 0 8px 8px;
|
||||
height: 600px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 0 20px 1px #0a255c1a;
|
||||
:deep(.vdr) {
|
||||
border-radius: 0 0 8px 8px;
|
||||
height: 600px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 0 20px 1px #0a255c1a;
|
||||
border: none;
|
||||
|
||||
.handle {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.handle {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
height: 48px;
|
||||
@@ -256,7 +270,7 @@ export default {
|
||||
|
||||
& + .right {
|
||||
border-left-color: #ddd;
|
||||
width: 660px;
|
||||
min-width: 660px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -372,7 +386,8 @@ export default {
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 468px;
|
||||
width: 100%;
|
||||
min-width: 468px;
|
||||
height: 100%;
|
||||
padding: 14px 0 14px 14px;
|
||||
align-items: stretch;
|
||||
|
||||
35
ui/packages/basic/AiDrag.vue
Normal file
35
ui/packages/basic/AiDrag.vue
Normal file
@@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<section class="AiDrag">
|
||||
<vue-draggable-resizable v-bind="$attrs">
|
||||
<slot/>
|
||||
</vue-draggable-resizable>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'vue-draggable-resizable/dist/VueDraggableResizable.css'
|
||||
import VueDraggableResizable from 'vue-draggable-resizable'
|
||||
|
||||
export default {
|
||||
name: "AiDrag",
|
||||
components: {VueDraggableResizable},
|
||||
props: {
|
||||
type: {default: "show"} //show:只拖拽
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AiDrag {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
pointer-events: none;
|
||||
|
||||
:deep(.vdr) {
|
||||
pointer-events: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user