Skip to content

Commit 72292cb

Browse files
dataeaseShudataeaseShu
committed
feat(embeddded): Reset App Secret
1 parent 283279f commit 72292cb

File tree

9 files changed

+238
-35
lines changed

9 files changed

+238
-35
lines changed

‎frontend/src/api/embedded.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export const embeddedApi = {
1212
request.get(`/system/embedded/${pageNum}/${pageSize}`, {
1313
params,
1414
}),
15+
secret: (id: any) => request.patch(`/system/embedded/secret/${id}`),
1516
updateEmbedded: (data: any) => request.put('/system/embedded', data),
1617
addEmbedded: (data: any) => request.post('/system/embedded', data),
1718
deleteEmbedded: (params: any) => request.delete('/system/embedded', { data: params }),

‎frontend/src/assets/embedded/Card.png‎

12 KB
Loading

‎frontend/src/assets/svg/tool-bar.svg‎

Lines changed: 67 additions & 0 deletions
Loading

‎frontend/src/i18n/en.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
"AI Model Configuration": "AI Model Configuration"
77
},
88
"professional": {
9+
"code_for_debugging": "Copy the following code for debugging",
10+
"full_screen_mode": "Full screen mode",
911
"editing_terminology": "Editing Terminology",
1012
"professional_terminology": "Professional Terminology",
1113
"term_name": "Term Name",
@@ -644,4 +646,4 @@
644646
"setting_successfully": "Setting Successfully",
645647
"customize_theme_color": "Customize theme color"
646648
}
647-
}
649+
}

‎frontend/src/i18n/zh-CN.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
"AI Model Configuration": "模型配置"
77
},
88
"professional": {
9+
"code_for_debugging": "复制以下代码进行调试",
10+
"full_screen_mode": "全屏模式",
911
"editing_terminology": "编辑术语",
1012
"professional_terminology": "专业术语",
1113
"term_name": "术语名称",
@@ -644,4 +646,4 @@
644646
"setting_successfully": "设置成功",
645647
"customize_theme_color": "自定义主题色"
646648
}
647-
}
649+
}

‎frontend/src/views/dashboard/canvas/CanvasCore.vue‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { findComponent } from '@/views/dashboard/components/component-list.ts'
88
import { storeToRefs } from 'pinia'
99
import { useEmitt, useEmittLazy } from '@/utils/useEmitt.ts'
1010
import html2canvas from 'html2canvas'
11-
import EmptyBackground from '@/views/dashboard/common/EmptyBackground.vue'
11+
import EmptyBackground from '@/views/dashboard/common/EmptyBackgroundSvgMain.vue'
1212
import { useI18n } from 'vue-i18n'
1313
import { isMainCanvas } from '@/views/dashboard/utils/canvasUtils.ts'
1414
@@ -1209,7 +1209,6 @@ defineExpose({
12091209
<EmptyBackground
12101210
v-if="!canvasComponentData.length && isMainCanvas(canvasId)"
12111211
:description="t('dashboard.add_component_tips')"
1212-
img-type="addComponent"
12131212
/>
12141213
<template v-if="renderOk">
12151214
<CanvasShape

‎frontend/src/views/dashboard/common/EmptyBackgroundSvgMain.vue‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<script lang="ts" setup>
2+
import nothingSelectDashboard from '@/assets/svg/tool-bar.svg'
3+
defineProps({
4+
imageSize: {
5+
type: Number,
6+
default: 125,
7+
},
8+
description: {
9+
type: String,
10+
default: '',
11+
},
12+
})
13+
</script>
14+
15+
<template>
16+
<div class="ed-empty empty-info">
17+
<div class="ed-empty__image" style="width: 125px">
18+
<el-icon size="125" class="icon-primary">
19+
<nothingSelectDashboard></nothingSelectDashboard>
20+
</el-icon>
21+
</div>
22+
<div class="ed-empty__description">
23+
<p>{{ description }}</p>
24+
</div>
25+
</div>
26+
</template>
27+
28+
<style lang="less" scoped>
29+
.empty-info {
30+
height: 90%;
31+
padding-top: 0;
32+
}
33+
:deep(.ed-empty__description) {
34+
margin-top: 8px;
35+
36+
color: var(--N600, #646a73);
37+
text-align: center;
38+
font-size: 14px;
39+
font-style: normal;
40+
font-weight: 400;
41+
line-height: 22px;
42+
}
43+
</style>

‎frontend/src/views/system/embedded/Page.vue‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -168,6 +168,9 @@ const cancelRefresh = (row: any) => {
168168
}
169169
170170
const refresh = (row: any) => {
171+
embeddedApi.secret(row.id).then(() => {
172+
ElMessage.success(t('common.update_success'))
173+
})
171174
cancelRefresh(row)
172175
}
173176

‎frontend/src/views/system/embedded/iframe.vue‎

Lines changed: 117 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import EmptyBackground from '@/views/dashboard/common/EmptyBackground.vue'
77
import icon_database_colorful from '@/assets/embedded/icon_database_colorful.png'
88
import icon_web_site_colorful from '@/assets/embedded/icon_web-site_colorful.png'
99
import floating_window from '@/assets/embedded/window.png'
10+
import full_window from '@/assets/embedded/Card.png'
1011
import icon_edit_outlined from '@/assets/svg/icon_edit_outlined.svg'
1112
import icon_delete from '@/assets/svg/icon_delete.svg'
1213
import icon_copy_outlined from '@/assets/embedded/icon_copy_outlined.svg'
@@ -43,6 +44,7 @@ const urlFormRef = ref()
4344
const certificateFormRef = ref()
4445
const dialogTitle = ref('')
4546
const drawerTitle = ref('')
47+
const activeMode = ref('full')
4648
4749
const embeddedList = ref<any[]>([])
4850
const systemCredentials = ['localStorage', 'custom', 'cookie', 'sessionStorage']
@@ -374,6 +376,7 @@ const saveEmbedded = () => {
374376
const dialogVisible = ref(false)
375377
const scriptElement = ref('')
376378
const jsCodeElement = ref('')
379+
const jsCodeElementFull = ref('')
377380
const handleEmbedded = (row: any) => {
378381
dialogVisible.value = true
379382
const { origin, pathname } = window.location
@@ -393,6 +396,19 @@ const handleEmbedded = (row: any) => {
393396
script.id = "sqlbot-assistant-float-script-${row.id}";
394397
document.head.appendChild(script);
395398
})()`
399+
400+
jsCodeElementFull.value = `(function(){
401+
const script = document.createElement('script');
402+
script.defer = true;
403+
script.async = true;
404+
script.src = "${origin + pathname}xpack_static/sqlbot-embedded-dynamic.umd.js";
405+
document.head.appendChild(script);
406+
})()
407+
408+
sqlbot_embedded_handler.mounted('.copilot', {
409+
"embeddedId": "${row.id}",
410+
"online": true
411+
})`
396412
}
397413
const copyJsCode = () => {
398414
copy(jsCodeElement.value)
@@ -403,6 +419,16 @@ const copyJsCode = () => {
403419
ElMessage.error(t('embedded.copy_successful'))
404420
})
405421
}
422+
423+
const copyJsCodeFull = () => {
424+
copy(jsCodeElementFull.value)
425+
.then(function () {
426+
ElMessage.success(t('embedded.copy_successful'))
427+
})
428+
.catch(function () {
429+
ElMessage.error(t('embedded.copy_successful'))
430+
})
431+
}
406432
const copyCode = () => {
407433
copy(scriptElement.value)
408434
.then(function () {
@@ -836,37 +862,70 @@ const saveHandler = () => {
836862
modal-class="embed-third_party"
837863
>
838864
<div class="floating-window">
839-
<div class="floating">
840-
<div class="title">{{ $t('embedded.floating_window_mode') }}</div>
841-
<img :src="floating_window" width="180px" height="120px" alt="" />
842-
</div>
843-
<div class="code">
844-
<div class="copy">
845-
{{ $t('embedded.code_to_embed') }}
846-
<el-tooltip effect="dark" :content="t('datasource.copy')" placement="top">
847-
<el-icon size="16" @click="copyCode">
848-
<icon_copy_outlined></icon_copy_outlined>
849-
</el-icon>
850-
</el-tooltip>
865+
<div class="mode">
866+
<div
867+
class="floating"
868+
:class="activeMode === 'full' && 'active'"
869+
@click="activeMode = 'full'"
870+
>
871+
<div class="title">{{ $t('professional.full_screen_mode') }}</div>
872+
<img :src="full_window" width="180px" height="120px" alt="" />
851873
</div>
852-
853-
<div class="script">
854-
{{ scriptElement }}
874+
<div
875+
class="floating"
876+
:class="activeMode === 'floating' && 'active'"
877+
@click="activeMode = 'floating'"
878+
>
879+
<div class="title">{{ $t('embedded.floating_window_mode') }}</div>
880+
<img :src="floating_window" width="180px" height="120px" alt="" />
855881
</div>
856882
</div>
883+
<div v-if="activeMode === 'floating'" class="code-bg">
884+
<div class="code">
885+
<div class="copy">
886+
{{ $t('embedded.code_to_embed') }}
887+
<el-tooltip effect="dark" :content="t('datasource.copy')" placement="top">
888+
<el-icon size="16" @click="copyCode">
889+
<icon_copy_outlined></icon_copy_outlined>
890+
</el-icon>
891+
</el-tooltip>
892+
</div>
857893

858-
<div class="code">
859-
<div class="copy">
860-
{{ $t('common.or') }}
861-
<el-tooltip effect="dark" :content="t('datasource.copy')" placement="top">
862-
<el-icon size="16" @click="copyJsCode">
863-
<icon_copy_outlined></icon_copy_outlined>
864-
</el-icon>
865-
</el-tooltip>
894+
<div class="script">
895+
{{ scriptElement }}
896+
</div>
866897
</div>
898+
<div class="line"></div>
899+
900+
<div class="code">
901+
<div class="copy">
902+
{{ $t('professional.code_for_debugging') }}
903+
<el-tooltip effect="dark" :content="t('datasource.copy')" placement="top">
904+
<el-icon size="16" @click="copyJsCode">
905+
<icon_copy_outlined></icon_copy_outlined>
906+
</el-icon>
907+
</el-tooltip>
908+
</div>
867909

868-
<div class="script">
869-
{{ jsCodeElement }}
910+
<div class="script">
911+
{{ jsCodeElement }}
912+
</div>
913+
</div>
914+
</div>
915+
<div v-else class="code-bg">
916+
<div class="code">
917+
<div class="copy">
918+
{{ $t('embedded.code_to_embed') }}
919+
<el-tooltip effect="dark" :content="t('datasource.copy')" placement="top">
920+
<el-icon size="16" @click="copyJsCodeFull">
921+
<icon_copy_outlined></icon_copy_outlined>
922+
</el-icon>
923+
</el-tooltip>
924+
</div>
925+
926+
<div class="script">
927+
{{ jsCodeElementFull }}
928+
</div>
870929
</div>
871930
</div>
872931
</div>
@@ -1197,25 +1256,52 @@ const saveHandler = () => {
11971256
11981257
.embed-third_party {
11991258
.floating-window {
1200-
border: 1px solid #dee0e3;
12011259
width: 552px;
1202-
height: 431px;
1203-
opacity: 1;
1204-
border-radius: 4px;
1260+
.mode {
1261+
display: flex;
1262+
align-items: center;
1263+
justify-content: space-between;
1264+
}
1265+
1266+
.code-bg {
1267+
background: #f5f6f7;
1268+
border-radius: 6px;
1269+
overflow: hidden;
1270+
margin-top: 16px;
1271+
}
12051272
12061273
.floating {
12071274
padding: 16px;
12081275
padding-bottom: 0;
1276+
border-radius: 6px;
1277+
border: 1px solid #dee0e3;
1278+
cursor: pointer;
1279+
width: 268px;
1280+
height: 182px;
1281+
display: flex;
1282+
align-items: center;
1283+
flex-direction: column;
1284+
12091285
.title {
12101286
font-weight: 500;
12111287
font-size: 14px;
12121288
line-height: 22px;
1213-
margin-bottom: 16px;
1289+
margin-bottom: 8px;
12141290
}
1291+
1292+
&.active {
1293+
background: var(--ed-color-primary-1a, #1cba901a);
1294+
border-color: var(--ed-color-primary, #1cba90);
1295+
}
1296+
}
1297+
.line {
1298+
background-color: #1f232926;
1299+
width: calc(100% - 32px);
1300+
height: 1px;
1301+
margin-left: 16px;
12151302
}
12161303
12171304
.code {
1218-
border-top: 1px solid #1f232926;
12191305
padding: 16px;
12201306
.copy {
12211307
display: flex;

0 commit comments

Comments
 (0)