Merge pull request #5308 from dataease/pr@dev_st_fix

fix: 组件优化导致加载异常
This commit is contained in:
dataeaseShu 2023-05-25 11:04:42 +08:00 committed by GitHub
commit 483f477fbe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
22 changed files with 49 additions and 329 deletions

View File

@ -17,9 +17,6 @@
</template>
<script>
import fullscreen from 'vue-fullscreen'
import Vue from 'vue'
Vue.use(fullscreen)
import Preview from './Preview'
import bus from '@/utils/bus'
import { mapState } from 'vuex'

View File

@ -37,11 +37,8 @@
import '@/custom-theme.css'
import { mapState } from 'vuex'
import bus from '@/utils/bus'
import { videoPlayer } from 'vue-video-player'
import 'video.js/dist/video-js.css'
export default {
components: { videoPlayer },
props: {
propValue: {
type: String,

View File

@ -2,6 +2,8 @@ import Vue from 'vue'
import Cookies from 'js-cookie'
import '@/styles/index.scss' // global css
import ElementUI from 'element-ui'
import Vuetify from 'vuetify'
import Fit2CloudUI from 'fit2cloud-ui'
import i18n from './lang' // internationalization
import App from './App'
@ -14,12 +16,16 @@ import api from '@/api/index.js'
import filter from '@/filter/filter'
import directives from './directive'
import VueClipboard from 'vue-clipboard2'
import widgets from '@/components/widget'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import './utils/dialog'
import DeComplexInput from '@/components/business/conditionTable/DeComplexInput'
import DeComplexSelect from '@/components/business/conditionTable/DeComplexSelect'
import DeViewSelect from '@/components/deViewSelect'
import RemarkEditor from '@/views/chart/components/componentStyle/dialog/RemarkEditor'
import TitleRemark from '@/views/chart/view/TitleRemark'
import '@/components/canvas/customComponent' // 注册自定义组件
import deBtn from '@/components/deCustomCm/DeBtn.vue'
import '@/utils/DateUtil'
@ -27,11 +33,15 @@ import draggable from 'vuedraggable'
import deWebsocket from '@/websocket'
import { GaodeMap } from '@antv/l7-maps'
import * as echarts from 'echarts'
import UmyUi from 'umy-ui'
// 全屏插件
import fullscreen from 'vue-fullscreen'
import VueFriendlyIframe from 'vue-friendly-iframe'
import vueToPdf from 'vue-to-pdf'
import VueVideoPlayer from 'vue-video-player'
import 'video.js/dist/video-js.css'
// 控制标签宽高成比例的指令
import proportion from 'vue-proportion-directive'
import xss from 'xss'
// 定义全局XSS解决方法
@ -41,13 +51,19 @@ Object.defineProperty(Vue.prototype, '$xss', {
Vue.config.productionTip = false
Vue.use(VueClipboard)
Vue.use(widgets)
Vue.component('Draggable', draggable)
Vue.prototype.$api = api
Vue.prototype.$echarts = echarts
Vue.prototype.$gaodeMap = GaodeMap
Vue.use(UmyUi)
Vue.use(fullscreen)
Vue.use(VueFriendlyIframe)
Vue.use(Vuetify)
// import TEditor from '@/components/Tinymce/index.vue'
// Vue.component('TEditor', TEditor)
@ -73,6 +89,9 @@ Vue.use(ElementUI, {
size: Cookies.get('size') || 'medium', // set element-ui default size
i18n: (key, value) => i18n.t(key, value)
})
Vue.use(Fit2CloudUI, {
i18n: (key, value) => i18n.t(key, value)
})
// Vue.use(VueAxios, axios)
Vue.use(filter)
Vue.use(directives)
@ -81,12 +100,18 @@ Vue.component('Treeselect', Treeselect)
Vue.component('DeComplexInput', DeComplexInput)
Vue.component('DeComplexSelect', DeComplexSelect)
Vue.component('DeViewSelect', DeViewSelect)
Vue.component('RemarkEditor', RemarkEditor)
Vue.component('TitleRemark', TitleRemark)
Vue.component('DeBtn', deBtn)
Vue.config.productionTip = false
Vue.use(vueToPdf)
Vue.use(VueVideoPlayer)
Vue.use(proportion)
Vue.prototype.hasDataPermission = function(pTarget, pSource) {
if (this.$store.state.user.user.isAdmin || pSource === 'ignore') {
return true

View File

@ -44,7 +44,7 @@ export const constantRoutes = [
},
{
path: '/login',
component: () => import(/* webpackChunkName:"login" */'@/views/login/index'),
component: () => import('@/views/login/index'),
hidden: true
},
@ -67,29 +67,29 @@ export const constantRoutes = [
children: [
{
path: 'edit',
component: () => import(/* webpackChunkName:"panelEdit" */'@/views/panel/edit')
component: () => import('@/views/panel/edit')
}
]
},
{
path: '/delink',
component: () => import(/* webpackChunkName:"link" */'@/views/link'),
component: () => import('@/views/link'),
hidden: true
},
{
path: '/preview/:reportId',
component: () => import(/* webpackChunkName:"preview" */'@/components/canvas/components/editor/PreviewEject'),
component: () => import('@/components/canvas/components/editor/PreviewEject'),
hidden: true
},
{
path: '/previewScreenShot/:reportId/:backScreenShot',
component: () => import(/* webpackChunkName:"PreviewEject" */'@/components/canvas/components/editor/PreviewEject'),
component: () => import('@/components/canvas/components/editor/PreviewEject'),
hidden: true
},
{
path: '/previewFullScreen',
component: () => import(/* webpackChunkName:"previewFullScreen" */'@/components/canvas/components/editor/PreviewFullScreen'),
component: () => import('@/components/canvas/components/editor/PreviewFullScreen'),
hidden: true
},
{

View File

@ -226,11 +226,9 @@
import { CHART_FONT_FAMILY, CHART_FONT_LETTER_SPACE, COLOR_PANEL, DEFAULT_TITLE_STYLE } from '../../chart/chart'
import { checkViewTitle } from '@/components/canvas/utils/utils'
import { mapState } from 'vuex'
import RemarkEditor from '@/views/chart/components/componentStyle/dialog/RemarkEditor'
export default {
name: 'TitleSelectorAntV',
components: { RemarkEditor },
props: {
param: {
type: Object,

View File

@ -99,10 +99,9 @@ import eventBus from '@/components/canvas/utils/eventBus'
import { DEFAULT_COLOR_CASE, DEFAULT_SCROLL, DEFAULT_SIZE, NOT_SUPPORT_PAGE_DATASET } from '@/views/chart/chart/chart'
import { mapState } from 'vuex'
import DePagination from '@/components/deCustomCm/pagination.js'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'TableNormal',
components: { DePagination, UxGrid, UxTableColumn },
components: { DePagination },
props: {
chart: {
type: Object,

View File

@ -1758,7 +1758,6 @@ import CalcChartFieldEdit from '@/views/chart/view/CalcChartFieldEdit'
import { equalsAny, includesAny } from '@/utils/StringUtils'
import PositionAdjust from '@/views/chart/view/PositionAdjust'
import MarkMapDataEditor from '@/views/chart/components/map/MarkMapDataEditor'
import FuSplitPane from './FuSplitPane.vue'
export default {
name: 'ChartEdit',
components: {
@ -1797,7 +1796,6 @@ export default {
PluginCom,
MapMapping,
MarkMapDataEditor,
FuSplitPane
},
props: {
param: {

View File

@ -1,237 +0,0 @@
<template>
<div :style="{ cursor, userSelect }" class="fu-split-pane" ref="outerWrapper">
<div
:class="[`is-${direction}`, 'fu-split-pane__left']"
:style="{
[attr]: isReverse ? valueAnother : `${value}px`,
'padding-right': padding,
}"
>
<slot :name="isHorizontal ? 'left' : 'top'"></slot>
</div>
<div
:class="resizerClasses"
:style="{ [resizerAttr]: `${value}px`, ...resizerStyle }"
@mousedown="onMouseDown"
@mouseover="hover = true"
@mouseleave="hover = false"
>
<div class="icon" v-if="resizerType === 'resizer'">
<slot name="resizer">
<i class="el-icon-more"></i>
</slot>
</div>
</div>
<div
:class="[`is-${direction}`, 'fu-split-pane__right']"
:style="{
[attr]: isReverse ? `${value}px` : valueAnother,
'padding-left': padding,
}"
>
<slot :name="isHorizontal ? 'right' : 'bottom'"></slot>
</div>
</div>
</template>
<script>
export default {
name: "FuSplitPane",
props: {
min: {
type: [Number, String],
default: "10px",
},
left: [Number, String],
right: [Number, String],
top: [Number, String],
bottom: [Number, String],
direction: {
validator: (val) => ["vertical", "horizontal"].includes(val),
default: "horizontal",
},
localKey: String,
resizable: {
type: Boolean,
default: true,
},
resizerType: {
validator: (val) => ["resizer", "line"].includes(val),
default: "resizer",
},
resizerClass: String,
resizerStyle: Object,
resizerHoverClass: String,
},
watch: {
left: {
immediate: true,
handler: function (newValue, oldValue) {
if (newValue !== oldValue) {
this.$nextTick(() => {
this.value = this.defaultValue;
});
}
},
},
bottom: {
immediate: true,
handler: function (newValue, oldValue) {
if (newValue !== oldValue) {
this.$nextTick(() => {
this.value = this.defaultValue;
});
}
},
},
},
computed: {
isReverse() {
return this.right || this.bottom;
},
isHorizontal() {
return this.direction === "horizontal";
},
userSelect() {
return this.active ? "none" : "";
},
cursor() {
return this.active && this.resizable
? this.isHorizontal
? "col-resize"
: "row-resize"
: "";
},
outerWrapperSize() {
return this.$refs.outerWrapper[this.offsetSize];
},
offsetSize() {
return this.isHorizontal ? "offsetWidth" : "offsetHeight";
},
defaultValue() {
if (this.isHorizontal) {
return this.left
? this.getMin(this.percentToValue(this.left))
: (this.right && this.getMin(this.percentToValue(this.right))) ||
this.outerWrapperSize / 2;
} else {
return this.top
? this.getMin(this.percentToValue(this.top))
: (this.bottom && this.getMin(this.percentToValue(this.bottom))) ||
this.outerWrapperSize / 2;
}
},
valueAnother() {
return `calc(100% - ${this.value}px)`;
},
attr() {
return this.isHorizontal ? "width" : "height";
},
resizerAttr() {
return this.isHorizontal
? this.isReverse
? "right"
: "left"
: this.isReverse
? "bottom"
: "top";
},
saveKey({ localKey }) {
return "Fu-SP-" + localKey;
},
resizerClasses() {
const classes = [
`fu-split-pane__${this.resizerType}`,
`is-${this.direction}`,
this.resizable && "is-resizable",
this.resizerClass,
this.hover && (this.resizerHoverClass || "hover"),
];
return classes;
},
padding() {
return this.resizerType === "resizer" && "3px";
},
},
data() {
return {
active: false,
value: 0,
oldValue: 0,
initOffset: 0,
hover: false,
};
},
mounted() {
this.readValue();
},
methods: {
onMouseDown(e) {
this.initOffset = this.isHorizontal ? e.pageX : e.pageY;
this.oldValue = this.value;
this.active = true;
document.addEventListener("mousemove", this.onMouseMove);
document.addEventListener("mouseup", this.onMouseUp);
},
onMouseUp() {
this.active = false;
document.removeEventListener("mousemove", this.onMouseMove);
document.removeEventListener("mouseup", this.onMouseUp);
this.$emit("changeSplit", this.value);
},
onMouseMove(e) {
if (!this.resizable) return;
if (this.active) {
const currentPage = this.isHorizontal ? e.pageX : e.pageY;
const offset = currentPage - this.initOffset;
const value = this.isReverse
? this.oldValue - offset
: this.oldValue + offset;
if (
value > this.percentToValue(this.min) &&
value < this.outerWrapperSize - this.percentToValue(this.min)
) {
this.value = value;
this.writeValue();
}
}
},
//
percentToValue(val) {
const size = this.$refs.outerWrapper[this.offsetSize];
if (typeof val === "string" && val.includes("%")) {
return (parseInt(val) / 100) * size;
} else {
return parseInt(val);
}
},
//
getMin(val) {
return val < this.percentToValue(this.min)
? this.percentToValue(this.min)
: val;
},
// localStorage
writeValue() {
const obj = {
[this.resizerAttr]: this.value,
};
if (this.localKey) {
localStorage.setItem(this.saveKey, JSON.stringify(obj));
}
},
readValue() {
if (this.localKey) {
const local = localStorage.getItem(this.saveKey);
if (local && local[this.resizerAttr]) {
this.value = parseInt(local) || this.defaultValue;
} else {
this.value = this.defaultValue;
}
} else {
this.value = this.defaultValue;
}
},
},
};
</script>

View File

@ -220,11 +220,9 @@ import cancelMix from './cancelMix'
import msgCfm from '@/components/msgCfm/index'
import { pySort } from './util'
import { updateCacheTree } from '@/components/canvas/utils/utils'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'AddApi',
components: { UxGrid, UxTableColumn },
mixins: [cancelMix, msgCfm],
props: {
param: {

View File

@ -109,11 +109,10 @@ import { getTable, post } from '@/api/dataset/dataset'
import DatasetGroupSelector from '../common/DatasetGroupSelector'
import DatasetCustomField from '../common/DatasetCustomField'
import { updateCacheTree } from '@/components/canvas/utils/utils'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'AddCustom',
components: { DatasetCustomField, DatasetGroupSelector, UxGrid, UxTableColumn },
components: { DatasetCustomField, DatasetGroupSelector },
props: {
param: {
type: Object,

View File

@ -228,11 +228,9 @@ import cancelMix from './cancelMix'
import { pySort } from './util'
import { updateCacheTree } from '@/components/canvas/utils/utils'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'AddDB',
components: { UxGrid, UxTableColumn },
mixins: [msgCfm, cancelMix],
props: {
param: {

View File

@ -239,7 +239,6 @@ import msgCfm from '@/components/msgCfm/index'
import cancelMix from './cancelMix'
import Config from "@/settings";
import { updateCacheTree } from '@/components/canvas/utils/utils'
import { UxGrid, UxTableColumn } from 'umy-ui'
const token = getToken()
const RefreshTokenKey = Config.RefreshTokenKey
@ -247,7 +246,6 @@ const RefreshTokenKey = Config.RefreshTokenKey
export default {
name: 'AddExcel',
mixins: [msgCfm, cancelMix],
components: { UxGrid, UxTableColumn },
props: {
param: {
type: Object,

View File

@ -23,11 +23,9 @@
<script>
import { post } from '@/api/dataset/dataset'
import _ from 'lodash'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'UnionPreview',
components: { UxGrid, UxTableColumn },
props: {
table: {
type: Object,

View File

@ -57,11 +57,9 @@
<script>
import { post } from '@/api/dataset/dataset'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'DatasetTableData',
components: { UxGrid, UxTableColumn },
props: {
table: {
type: Object,

View File

@ -81,10 +81,8 @@
<script>
import _ from 'lodash'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'TabDataPreview',
components: { UxGrid, UxTableColumn },
props: {
table: {
type: Object,

View File

@ -536,12 +536,6 @@ import TextAttr from '@/components/canvas/components/TextAttr'
import { userLoginInfo } from '@/api/systemInfo/userLogin'
import { activeWatermark } from '@/components/canvas/tools/watermark'
import PositionAdjust from '@/views/chart/view/PositionAdjust'
import fullscreen from 'vue-fullscreen'
import proportion from 'vue-proportion-directive'
import Vue from 'vue'
Vue.use(proportion)
Vue.use(fullscreen)
export default {
name: 'PanelEdit',
components: {

View File

@ -16,13 +16,20 @@
style="width:100%;height: 100%;margin:0 10px;border-radius: 4px;overflow-x: auto;display: flex;align-items: center;"
@end="end2"
>
<drag-item
:key="item.id"
:item="item"
:index="index"
<v-flex
v-for="(item,index) in element.options.attrs.dragItems"
@closeItem="closeItem"
/>
:key="item.id"
>
<drag-item
:key="item.id"
:item="item"
:index="index"
@closeItem="closeItem"
/>
</v-flex>
<span solt="footer">{{ $t('panel.drag_here') }}</span>
</draggable>
</el-row>
@ -127,20 +134,6 @@ export default {
padding: 4px 0 0 0;
height: 100%;
line-height: 100%;
.v-flex {
font-variant: tabular-nums;
font-feature-settings: "tnum";
text-rendering: optimizeLegibility;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, FangSong, SimHei, STHeiti, STKaiti, STSong, STFangsong sans-serif;
font-size: 14px;
word-break: break-all;
white-space: nowrap;
color: #9ea6b2;
line-height: 100%;
box-sizing: border-box;
margin: 0;
padding: 0;
}
}
}

View File

@ -19,9 +19,6 @@ import DeMainContainer from '@/components/dataease/DeMainContainer'
import DeContainer from '@/components/dataease/DeContainer'
import PanelMain from '@/views/panel/list/PanelMain'
import PanelEdit from '@/views/panel/edit'
import '@/components/canvas/customComponent' //
import '@/components/widget'
export default {
name: 'Panel',
components: { DeMainContainer, DeContainer, PanelMain, PanelEdit },

View File

@ -377,9 +377,6 @@
</el-row>
</template>
<script>
import Vue from 'vue'
import fullscreen from 'vue-fullscreen'
Vue.use(fullscreen)
import PDFPreExport from '@/views/panel/export/PDFPreExport'
import Preview from '@/components/canvas/components/editor/Preview'
import SaveToTemplate from '@/views/panel/list/SaveToTemplate'

View File

@ -796,13 +796,11 @@ import ApiHttpRequestForm from '@/views/system/datasource/ApiHttpRequestForm'
import dePwd from '@/components/deCustomCm/DePwd.vue'
import msgCfm from '@/components/msgCfm'
import { Base64 } from 'js-base64'
import { UxGrid, UxTableColumn } from 'umy-ui'
export default {
name: 'DsConfiguration',
components: {
ApiHttpRequestForm,
dePwd,
UxGrid, UxTableColumn
dePwd
},
mixins: [msgCfm],
props: {

View File

@ -47,18 +47,11 @@
</template>
<script>
import Vue from 'vue'
import Fit2CloudUI from 'fit2cloud-ui'
import DeLayoutContent from '@/components/business/DeLayoutContent'
import AsyncComponent from '@/components/asyncComponent'
import i18n from '@/lang'
import bus from '@/utils/bus'
import { execute } from '@/api/system/dynamic'
import RemarkEditor from '@/views/chart/components/componentStyle/dialog/RemarkEditor'
import DeRichText from '@/components/canvas/customComponent/DeRichText'
Vue.component('DeRichText', DeRichText)
Vue.component('RemarkEditor', RemarkEditor)
Vue.use(Fit2CloudUI)
export default {
name: 'Dynamic',

View File

@ -1,7 +1,6 @@
'use strict'
const path = require('path')
const defaultSettings = require('./src/settings.js')
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
const pkg = require('./package.json')
@ -57,7 +56,6 @@ module.exports = {
chunkFilename: `js/[name].[contenthash:8].${pkg.version}.js`
},
plugins: [
// new BundleAnalyzerPlugin(),
new CopyWebpackPlugin([
{
from: path.join(__dirname, 'static'),
@ -77,18 +75,7 @@ module.exports = {
// dll最终输出的目录
outputPath: './vendor'
})
],
optimization: {
splitChunks: {
cacheGroups: {
brace: {
name: 'chunk-brace',
priority: 20,
test: /[\\/]node_modules[\\/]brace/
}
}
},
},
]
},
chainWebpack: config => {
config.module.rules.delete('svg') // 删除默认配置中处理svg,
@ -124,9 +111,6 @@ module.exports = {
.options({
symbolId: '[name]'
})
// 删除预加载 针对请求 删除预加载 数进行优化
config.plugins.delete('prefetch-index')
config.plugins.delete('preload-index')
},
css: {
loaderOptions: {