<template>
|
<el-dialog
|
ref="canvasCacheDialogRef"
|
:append-to-body="true"
|
v-model="dialogShow"
|
width="420px"
|
:show-close="false"
|
trigger="click"
|
modal-class="canvasCacheDialog-modal"
|
class="canvasCacheDialog"
|
>
|
<div style="display: flex; flex-direction: row; align-items: flex-start">
|
<Icon name="warn-tree">
|
<warnTree class="svg-icon warn-tree" />
|
</Icon>
|
<span class="tips">
|
{{ dialogInfo.tips }}
|
</span>
|
</div>
|
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button size="mini" @click="doUseCache(false)">{{ t('visualization.no') }}</el-button>
|
<el-button type="primary" size="mini" @click="doUseCache(true)"
|
>{{ t('visualization.yes') }}
|
</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script setup lang="ts">
|
import warnTree from '@/assets/svg/warn-tree.svg'
|
import { ref } from 'vue'
|
import { useI18n } from '@/hooks/web/useI18n'
|
const dialogShow = ref(false)
|
const { t } = useI18n()
|
const emits = defineEmits(['doUseCache'])
|
|
const dialogInfo = {
|
resourceId: null,
|
title: '',
|
tips: ''
|
}
|
|
const dialogInit = initInfo => {
|
const canvasTypeName =
|
initInfo.canvasType === 'dataV' ? t('work_branch.big_data_screen') : t('work_branch.dashboard')
|
dialogInfo.resourceId = initInfo.resourceId
|
dialogInfo.title = t('visualization.no_save_tips', [canvasTypeName])
|
dialogInfo.tips = t('visualization.no_save_tips2')
|
dialogShow.value = true
|
}
|
|
const doUseCache = flag => {
|
emits('doUseCache', flag)
|
dialogShow.value = false
|
}
|
|
defineExpose({
|
dialogInit
|
})
|
</script>
|
|
<style lang="less">
|
.canvasCacheDialog-modal {
|
background: rgba(31, 35, 41, 0.4);
|
}
|
.canvasCacheDialog {
|
.warn-tree {
|
width: 24px;
|
height: 24px;
|
}
|
.tips {
|
margin-left: 16px;
|
font-size: 16px;
|
font-weight: 500;
|
line-height: 24px;
|
}
|
.ed-dialog__header {
|
display: none;
|
}
|
:deep(.ed-dialog__header) {
|
display: none;
|
}
|
}
|
</style>
|
