Merge pull request #9326 from dataease/pr@dev@style_code_format
style: code format
This commit is contained in:
wisonic-s
GitHub
commit
1eecb50e3f
@ -289,7 +289,7 @@ export function exportDataset(data) {
|
|||||||
url: 'dataset/table/exportDataset',
|
url: 'dataset/table/exportDataset',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: data,
|
data: data,
|
||||||
loading: true,
|
loading: true
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -93,7 +93,6 @@
|
|||||||
<script>
|
<script>
|
||||||
import { mapState } from 'vuex'
|
import { mapState } from 'vuex'
|
||||||
import DeEditor from '@/components/canvas/components/editor/DeEditor'
|
import DeEditor from '@/components/canvas/components/editor/DeEditor'
|
||||||
import elementResizeDetectorMaker from 'element-resize-detector'
|
|
||||||
import bus from '@/utils/bus'
|
import bus from '@/utils/bus'
|
||||||
import { deepCopy, imgUrlTrans } from '@/components/canvas/utils/utils'
|
import { deepCopy, imgUrlTrans } from '@/components/canvas/utils/utils'
|
||||||
import { uuid } from 'vue-uuid'
|
import { uuid } from 'vue-uuid'
|
||||||
|
|||||||
@ -206,7 +206,7 @@ import { uploadFileResult } from '@/api/staticResource/staticResource'
|
|||||||
import eventBus from '@/components/canvas/utils/eventBus'
|
import eventBus from '@/components/canvas/utils/eventBus'
|
||||||
import { hasDataPermission } from '@/utils/permission'
|
import { hasDataPermission } from '@/utils/permission'
|
||||||
import { exportExcelDownload } from '@/components/canvas/utils/utils'
|
import { exportExcelDownload } from '@/components/canvas/utils/utils'
|
||||||
import { Button } from "element-ui";
|
import { Button } from 'element-ui'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: { Background, LinkJumpSet, FieldsList, SettingMenu, LinkageField, MapLayerController },
|
components: { Background, LinkJumpSet, FieldsList, SettingMenu, LinkageField, MapLayerController },
|
||||||
@ -476,70 +476,70 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (val && val.success === false) {
|
if (val && val.success === false) {
|
||||||
this.openMessageSuccess( `${this.chart.title ? this.chart.title : this.chart.name} 导出失败，前往`, 'error',this.exportData);
|
this.openMessageSuccess(`${this.chart.title ? this.chart.title : this.chart.name} 导出失败，前往`, 'error', this.exportData)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
exportData() {
|
exportData() {
|
||||||
bus.$emit('data-export-center')
|
bus.$emit('data-export-center')
|
||||||
},
|
},
|
||||||
openMessageLoading(cb) {
|
openMessageLoading(cb) {
|
||||||
const h = this.$createElement;
|
const h = this.$createElement
|
||||||
const iconClass = `el-icon-loading`;
|
const iconClass = `el-icon-loading`
|
||||||
const customClass = `de-message-loading de-message-export`;
|
const customClass = `de-message-loading de-message-export`
|
||||||
this.$message({
|
this.$message({
|
||||||
message: h("p", null, [
|
message: h('p', null, [
|
||||||
this.$t('data_export.exporting'),
|
this.$t('data_export.exporting'),
|
||||||
h(
|
h(
|
||||||
Button,
|
Button,
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
type: "text",
|
type: 'text',
|
||||||
size: "mini",
|
size: 'mini'
|
||||||
},
|
},
|
||||||
class: "btn-text",
|
class: 'btn-text',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
cb();
|
cb()
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
this.$t('data_export.export_center'),
|
this.$t('data_export.export_center')
|
||||||
),
|
),
|
||||||
this.$t('data_export.export_info'),
|
this.$t('data_export.export_info')
|
||||||
]),
|
]),
|
||||||
iconClass,
|
iconClass,
|
||||||
showClose: true,
|
showClose: true,
|
||||||
customClass,
|
customClass
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
openMessageSuccess(text, type, cb) {
|
openMessageSuccess(text, type, cb) {
|
||||||
const h = this.$createElement;
|
const h = this.$createElement
|
||||||
const iconClass = `el-icon-${type || "success"}`;
|
const iconClass = `el-icon-${type || 'success'}`
|
||||||
const customClass = `de-message-${type || "success"} de-message-export`;
|
const customClass = `de-message-${type || 'success'} de-message-export`
|
||||||
this.$message({
|
this.$message({
|
||||||
message: h("p", null, [
|
message: h('p', null, [
|
||||||
h("span", null, text),
|
h('span', null, text),
|
||||||
h(
|
h(
|
||||||
Button,
|
Button,
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
type: "text",
|
type: 'text',
|
||||||
size: "mini",
|
size: 'mini'
|
||||||
},
|
},
|
||||||
class: "btn-text",
|
class: 'btn-text',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
cb();
|
cb()
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
this.$t('data_export.export_center'),
|
this.$t('data_export.export_center')
|
||||||
),
|
)
|
||||||
]),
|
]),
|
||||||
iconClass,
|
iconClass,
|
||||||
showClose: true,
|
showClose: true,
|
||||||
customClass,
|
customClass
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
exportExcelDownload() {
|
exportExcelDownload() {
|
||||||
exportExcelDownload(this.chart, null, null, null, null, this.exportDataCb)
|
exportExcelDownload(this.chart, null, null, null, null, this.exportDataCb)
|
||||||
|
|||||||
@ -239,7 +239,7 @@ import ChartComponent from '@/views/chart/components/ChartComponent.vue'
|
|||||||
import TableNormal from '@/views/chart/components/table/TableNormal'
|
import TableNormal from '@/views/chart/components/table/TableNormal'
|
||||||
import LabelNormal from '../../../views/chart/components/normal/LabelNormal'
|
import LabelNormal from '../../../views/chart/components/normal/LabelNormal'
|
||||||
import { uuid } from 'vue-uuid'
|
import { uuid } from 'vue-uuid'
|
||||||
import { Button } from "element-ui";
|
import { Button } from 'element-ui'
|
||||||
import bus from '@/utils/bus'
|
import bus from '@/utils/bus'
|
||||||
import { mapState } from 'vuex'
|
import { mapState } from 'vuex'
|
||||||
import { isChange } from '@/utils/conditionUtil'
|
import { isChange } from '@/utils/conditionUtil'
|
||||||
@ -760,63 +760,63 @@ export default {
|
|||||||
bus.$emit('data-export-center')
|
bus.$emit('data-export-center')
|
||||||
},
|
},
|
||||||
openMessageLoading(cb) {
|
openMessageLoading(cb) {
|
||||||
const h = this.$createElement;
|
const h = this.$createElement
|
||||||
const iconClass = `el-icon-loading`;
|
const iconClass = `el-icon-loading`
|
||||||
const customClass = `de-message-loading de-message-export`;
|
const customClass = `de-message-loading de-message-export`
|
||||||
this.$message({
|
this.$message({
|
||||||
message: h("p", null, [
|
message: h('p', null, [
|
||||||
this.$t('data_export.exporting'),
|
this.$t('data_export.exporting'),
|
||||||
h(
|
h(
|
||||||
Button,
|
Button,
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
type: "text",
|
type: 'text',
|
||||||
size: "mini",
|
size: 'mini'
|
||||||
},
|
},
|
||||||
class: "btn-text",
|
class: 'btn-text',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
cb();
|
cb()
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
this.$t('data_export.export_center'),
|
this.$t('data_export.export_center')
|
||||||
),
|
),
|
||||||
this.$t('data_export.export_info'),
|
this.$t('data_export.export_info')
|
||||||
]),
|
]),
|
||||||
iconClass,
|
iconClass,
|
||||||
showClose: true,
|
showClose: true,
|
||||||
customClass,
|
customClass
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
openMessageSuccess(text, type, cb) {
|
openMessageSuccess(text, type, cb) {
|
||||||
const h = this.$createElement;
|
const h = this.$createElement
|
||||||
const iconClass = `el-icon-${type || "success"}`;
|
const iconClass = `el-icon-${type || 'success'}`
|
||||||
const customClass = `de-message-${type || "success"} de-message-export`;
|
const customClass = `de-message-${type || 'success'} de-message-export`
|
||||||
this.$message({
|
this.$message({
|
||||||
message: h("p", null, [
|
message: h('p', null, [
|
||||||
h("span", null, text),
|
h('span', null, text),
|
||||||
h(
|
h(
|
||||||
Button,
|
Button,
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
type: "text",
|
type: 'text',
|
||||||
size: "mini",
|
size: 'mini'
|
||||||
},
|
},
|
||||||
class: "btn-text",
|
class: 'btn-text',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
cb();
|
cb()
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
this.$t('data_export.export_center'),
|
this.$t('data_export.export_center')
|
||||||
),
|
)
|
||||||
]),
|
]),
|
||||||
iconClass,
|
iconClass,
|
||||||
showClose: true,
|
showClose: true,
|
||||||
customClass,
|
customClass
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
exportExcel() {
|
exportExcel() {
|
||||||
this.dialogLoading = true
|
this.dialogLoading = true
|
||||||
@ -826,7 +826,7 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (val && val.success === false) {
|
if (val && val.success === false) {
|
||||||
this.openMessageSuccess( `${this.chart.title ? this.chart.title : this.chart.name} 导出失败，前往`, 'error',this.exportData);
|
this.openMessageSuccess(`${this.chart.title ? this.chart.title : this.chart.name} 导出失败，前往`, 'error', this.exportData)
|
||||||
}
|
}
|
||||||
this.dialogLoading = false
|
this.dialogLoading = false
|
||||||
})
|
})
|
||||||
@ -967,11 +967,14 @@ export default {
|
|||||||
if (this.chart.type === 'map' && this.scaleCoefficientType === 'mobile') {
|
if (this.chart.type === 'map' && this.scaleCoefficientType === 'mobile') {
|
||||||
customAttrChart.label.show = false
|
customAttrChart.label.show = false
|
||||||
}
|
}
|
||||||
|
const data = this.chart.data
|
||||||
|
delete this.chart.data
|
||||||
this.chart = {
|
this.chart = {
|
||||||
...this.chart,
|
...this.chart,
|
||||||
customAttr: JSON.stringify(customAttrChart),
|
customAttr: JSON.stringify(customAttrChart),
|
||||||
customStyle: JSON.stringify(customStyleChart)
|
customStyle: JSON.stringify(customStyleChart)
|
||||||
}
|
}
|
||||||
|
this.chart.data = data
|
||||||
},
|
},
|
||||||
getData(id, cache = true, dataBroadcast = false) {
|
getData(id, cache = true, dataBroadcast = false) {
|
||||||
if (this.requestStatus === 'waiting') {
|
if (this.requestStatus === 'waiting') {
|
||||||
@ -1031,8 +1034,12 @@ export default {
|
|||||||
try {
|
try {
|
||||||
// 将视图传入echart组件
|
// 将视图传入echart组件
|
||||||
if (response.success) {
|
if (response.success) {
|
||||||
|
const data = response.data.data
|
||||||
|
delete response.data.data
|
||||||
this.chart = response.data
|
this.chart = response.data
|
||||||
this.view = response.data
|
this.view = response.data
|
||||||
|
this.chart.data = data
|
||||||
|
this.view.data = data
|
||||||
if (this.chart.type.includes('table')) {
|
if (this.chart.type.includes('table')) {
|
||||||
this.$store.commit('setLastViewRequestInfo', { viewId: id, requestInfo: requestInfo })
|
this.$store.commit('setLastViewRequestInfo', { viewId: id, requestInfo: requestInfo })
|
||||||
}
|
}
|
||||||
|
|||||||
@ -96,7 +96,7 @@ import ChartComponentS2 from '@/views/chart/components/ChartComponentS2'
|
|||||||
import LabelNormalText from '@/views/chart/components/normal/LabelNormalText'
|
import LabelNormalText from '@/views/chart/components/normal/LabelNormalText'
|
||||||
import html2canvas from 'html2canvasde'
|
import html2canvas from 'html2canvasde'
|
||||||
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
||||||
import {deepCopy, exportExcelDownload, exportImg, exportImgNew, imgUrlTrans} from '@/components/canvas/utils/utils'
|
import { deepCopy, exportExcelDownload, exportImgNew, imgUrlTrans } from '@/components/canvas/utils/utils'
|
||||||
import { activeWatermark } from '@/components/canvas/tools/watermark'
|
import { activeWatermark } from '@/components/canvas/tools/watermark'
|
||||||
import { proxyUserLoginInfo, userLoginInfo } from '@/api/systemInfo/userLogin'
|
import { proxyUserLoginInfo, userLoginInfo } from '@/api/systemInfo/userLogin'
|
||||||
|
|
||||||
|
|||||||
@ -71,8 +71,8 @@ import ChartComponentS2 from '@/views/chart/components/ChartComponentS2'
|
|||||||
import PluginCom from '@/views/system/plugin/PluginCom'
|
import PluginCom from '@/views/system/plugin/PluginCom'
|
||||||
import { deepCopy, imgUrlTrans } from '@/components/canvas/utils/utils'
|
import { deepCopy, imgUrlTrans } from '@/components/canvas/utils/utils'
|
||||||
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
||||||
import {activeWatermark} from "@/components/canvas/tools/watermark";
|
import { activeWatermark } from '@/components/canvas/tools/watermark'
|
||||||
import {proxyUserLoginInfo, userLoginInfo} from "@/api/systemInfo/userLogin";
|
import { proxyUserLoginInfo, userLoginInfo } from '@/api/systemInfo/userLogin'
|
||||||
export default {
|
export default {
|
||||||
name: 'UserViewMobileDialog',
|
name: 'UserViewMobileDialog',
|
||||||
components: { ChartComponentS2, LabelNormalText, DeContainer, DeMainContainer, ChartComponentG2, ChartComponent, TableNormal, LabelNormal, PluginCom },
|
components: { ChartComponentS2, LabelNormalText, DeContainer, DeMainContainer, ChartComponentG2, ChartComponent, TableNormal, LabelNormal, PluginCom },
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
@click="handleClick(false)"
|
|
||||||
v-if="arrowSide && !isInside"
|
v-if="arrowSide && !isInside"
|
||||||
class="arrow-side-tree arrow-side-tree-left"
|
class="arrow-side-tree arrow-side-tree-left"
|
||||||
|
@click="handleClick(false)"
|
||||||
>
|
>
|
||||||
<svg-icon
|
<svg-icon
|
||||||
icon-class="icon_left_outlined"
|
icon-class="icon_left_outlined"
|
||||||
@ -10,9 +10,9 @@
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
@click="handleClick(true)"
|
|
||||||
v-else-if="!arrowSide && isInside"
|
v-else-if="!arrowSide && isInside"
|
||||||
class="arrow-side-tree arrow-side-tree-right"
|
class="arrow-side-tree arrow-side-tree-right"
|
||||||
|
@click="handleClick(true)"
|
||||||
>
|
>
|
||||||
<svg-icon
|
<svg-icon
|
||||||
icon-class="icon_right_outlined"
|
icon-class="icon_right_outlined"
|
||||||
@ -29,7 +29,7 @@ export default {
|
|||||||
isInside: {
|
isInside: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('app', [
|
...mapState('app', [
|
||||||
|
|||||||
@ -1,14 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-aside
|
<el-aside
|
||||||
:width="currentWidth"
|
:width="currentWidth"
|
||||||
@mouseenter.native="mouseenter"
|
|
||||||
@mouseleave.native="mouseleave"
|
|
||||||
class="ms-aside-container"
|
class="ms-aside-container"
|
||||||
:class="{ retract: !sideTreeStatus }"
|
:class="{ retract: !sideTreeStatus }"
|
||||||
:style="{'margin-left': !asideHidden ? 0 : '-' + currentWidth}"
|
:style="{'margin-left': !asideHidden ? 0 : '-' + currentWidth}"
|
||||||
|
@mouseenter.native="mouseenter"
|
||||||
|
@mouseleave.native="mouseleave"
|
||||||
>
|
>
|
||||||
<DeArrowSide v-if="!close" @changeSideTreeStatus="changeSideTreeStatus" :style="sideStyle" :isInside="!sideTreeStatus"></DeArrowSide>
|
<DeArrowSide
|
||||||
<slot/>
|
v-if="!close"
|
||||||
|
:style="sideStyle"
|
||||||
|
:is-inside="!sideTreeStatus"
|
||||||
|
@changeSideTreeStatus="changeSideTreeStatus"
|
||||||
|
/>
|
||||||
|
<slot />
|
||||||
<de-horizontal-drag-bar
|
<de-horizontal-drag-bar
|
||||||
v-if="isSystem"
|
v-if="isSystem"
|
||||||
:type="type"
|
:type="type"
|
||||||
@ -57,7 +62,7 @@ export default {
|
|||||||
return {
|
return {
|
||||||
asideHidden: false,
|
asideHidden: false,
|
||||||
currentWidth: '',
|
currentWidth: '',
|
||||||
sideTreeStatus: true,
|
sideTreeStatus: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -65,7 +70,7 @@ export default {
|
|||||||
// 系统管理不需要拖拽菜单
|
// 系统管理不需要拖拽菜单
|
||||||
return this.isTemplate || (!this.$route.fullPath.includes('system') && this.showDragBar)
|
return this.isTemplate || (!this.$route.fullPath.includes('system') && this.showDragBar)
|
||||||
},
|
},
|
||||||
sideStyle () {
|
sideStyle() {
|
||||||
return this.sideTreeStatus ? { right: '-12px' } : { left: 0 }
|
return this.sideTreeStatus ? { right: '-12px' } : { left: 0 }
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -80,11 +85,11 @@ export default {
|
|||||||
this.currentWidth = this.isCollapseWidth || this.type && getLayout(this.type) || this.width
|
this.currentWidth = this.isCollapseWidth || this.type && getLayout(this.type) || this.width
|
||||||
},
|
},
|
||||||
mouseenter() {
|
mouseenter() {
|
||||||
if(!this.sideTreeStatus) return
|
if (!this.sideTreeStatus) return
|
||||||
this.$store.dispatch('app/setArrowSide', true)
|
this.$store.dispatch('app/setArrowSide', true)
|
||||||
},
|
},
|
||||||
mouseleave() {
|
mouseleave() {
|
||||||
if(!this.sideTreeStatus) return
|
if (!this.sideTreeStatus) return
|
||||||
this.$store.dispatch('app/setArrowSide', false)
|
this.$store.dispatch('app/setArrowSide', false)
|
||||||
},
|
},
|
||||||
changeSideTreeStatus(val) {
|
changeSideTreeStatus(val) {
|
||||||
@ -106,7 +111,7 @@ export default {
|
|||||||
position: relative;
|
position: relative;
|
||||||
padding-bottom: 50px;
|
padding-bottom: 50px;
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
|
|
||||||
&.retract {
|
&.retract {
|
||||||
width: 0 !important;
|
width: 0 !important;
|
||||||
min-width: 0 !important;
|
min-width: 0 !important;
|
||||||
|
|||||||
@ -40,8 +40,7 @@
|
|||||||
v-model="keywords"
|
v-model="keywords"
|
||||||
size="mini"
|
size="mini"
|
||||||
class="input-with-select mb10"
|
class="input-with-select mb10"
|
||||||
>
|
/>
|
||||||
</el-input>
|
|
||||||
<p
|
<p
|
||||||
v-if="selectParams.multiple"
|
v-if="selectParams.multiple"
|
||||||
class="tree-select-all"
|
class="tree-select-all"
|
||||||
|
|||||||
@ -45,7 +45,7 @@
|
|||||||
class="vant-mobile"
|
class="vant-mobile"
|
||||||
:class="
|
:class="
|
||||||
['datetimerange', 'datetime', 'daterange'].includes(componentType) &&
|
['datetimerange', 'datetime', 'daterange'].includes(componentType) &&
|
||||||
'wr50'
|
'wr50'
|
||||||
"
|
"
|
||||||
@click="showPopupRight"
|
@click="showPopupRight"
|
||||||
/>
|
/>
|
||||||
@ -80,58 +80,58 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { ApplicationContext } from "@/utils/ApplicationContext";
|
import { ApplicationContext } from '@/utils/ApplicationContext'
|
||||||
import { timeSection } from "@/utils";
|
import { timeSection } from '@/utils'
|
||||||
import dayjs from "dayjs";
|
import dayjs from 'dayjs'
|
||||||
import {
|
import {
|
||||||
getThisStart,
|
getThisStart,
|
||||||
getLastStart,
|
getLastStart,
|
||||||
getAround,
|
getAround
|
||||||
} from "@/views/panel/filter/filterMain/time-format-dayjs.js";
|
} from '@/views/panel/filter/filterMain/time-format-dayjs.js'
|
||||||
import bus from "@/utils/bus";
|
import bus from '@/utils/bus'
|
||||||
import customInput from "@/components/widget/deWidget/customInput";
|
import customInput from '@/components/widget/deWidget/customInput'
|
||||||
import {
|
import {
|
||||||
dateMap,
|
dateMap,
|
||||||
years,
|
years,
|
||||||
seconds,
|
seconds
|
||||||
} from "@/components/widget/deWidget/serviceNameFn";
|
} from '@/components/widget/deWidget/serviceNameFn'
|
||||||
import { mapState } from "vuex";
|
import { mapState } from 'vuex'
|
||||||
import vanPopup from "vant/lib/popup";
|
import vanPopup from 'vant/lib/popup'
|
||||||
import vanDatetimePicker from "vant/lib/datetime-picker";
|
import vanDatetimePicker from 'vant/lib/datetime-picker'
|
||||||
import vanPicker from "vant/lib/picker";
|
import vanPicker from 'vant/lib/picker'
|
||||||
import "vant/lib/popup/style";
|
import 'vant/lib/popup/style'
|
||||||
import "vant/lib/datetime-picker/style";
|
import 'vant/lib/datetime-picker/style'
|
||||||
import "vant/lib/picker/style";
|
import 'vant/lib/picker/style'
|
||||||
export default {
|
export default {
|
||||||
components: { vanPopup, vanDatetimePicker, vanPicker },
|
components: { vanPopup, vanDatetimePicker, vanPicker },
|
||||||
mixins: [customInput],
|
mixins: [customInput],
|
||||||
props: {
|
props: {
|
||||||
canvasId: {
|
canvasId: {
|
||||||
type: String,
|
type: String,
|
||||||
required: true,
|
required: true
|
||||||
},
|
},
|
||||||
element: {
|
element: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: null,
|
default: null
|
||||||
},
|
},
|
||||||
inDraw: {
|
inDraw: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true,
|
default: true
|
||||||
},
|
},
|
||||||
inScreen: {
|
inScreen: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
required: false,
|
required: false,
|
||||||
default: true,
|
default: true
|
||||||
},
|
},
|
||||||
size: String,
|
size: String,
|
||||||
isRelation: {
|
isRelation: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
terminal: {
|
terminal: {
|
||||||
type: String,
|
type: String,
|
||||||
default: "pc",
|
default: 'pc'
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@ -140,7 +140,7 @@ export default {
|
|||||||
minDate: new Date(1980, 0, 1),
|
minDate: new Date(1980, 0, 1),
|
||||||
maxDate: new Date(2025, 10, 1),
|
maxDate: new Date(2025, 10, 1),
|
||||||
currentDate: new Date(),
|
currentDate: new Date(),
|
||||||
operator: "between",
|
operator: 'between',
|
||||||
defaultIndex: 2,
|
defaultIndex: 2,
|
||||||
columns: years,
|
columns: years,
|
||||||
values: null,
|
values: null,
|
||||||
@ -149,197 +149,194 @@ export default {
|
|||||||
selectSecondInput: false,
|
selectSecondInput: false,
|
||||||
selectSecond: false,
|
selectSecond: false,
|
||||||
outTimer: null,
|
outTimer: null,
|
||||||
innerTimer: null,
|
innerTimer: null
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
isMobileStatus() {
|
isMobileStatus() {
|
||||||
return this.mobileStatus || this.terminal === "mobile";
|
return this.mobileStatus || this.terminal === 'mobile'
|
||||||
},
|
},
|
||||||
isRange() {
|
isRange() {
|
||||||
if (!this.isMobileStatus) return false;
|
if (!this.isMobileStatus) return false
|
||||||
return ["datetimerange", "daterange"].includes(this.componentType);
|
return ['datetimerange', 'daterange'].includes(this.componentType)
|
||||||
},
|
},
|
||||||
showdDatetimePicker() {
|
showdDatetimePicker() {
|
||||||
if (!this.isMobileStatus) return false;
|
if (!this.isMobileStatus) return false
|
||||||
if (this.showSecond && this.selectSecond) return false;
|
if (this.showSecond && this.selectSecond) return false
|
||||||
return this.componentTypeVant !== "year";
|
return this.componentTypeVant !== 'year'
|
||||||
},
|
},
|
||||||
showSecond() {
|
showSecond() {
|
||||||
if (!this.isMobileStatus) return false;
|
if (!this.isMobileStatus) return false
|
||||||
return this.labelFormat?.endsWith("ss");
|
return this.labelFormat?.endsWith('ss')
|
||||||
},
|
},
|
||||||
componentTypeVant() {
|
componentTypeVant() {
|
||||||
if (!this.isMobileStatus) return "";
|
if (!this.isMobileStatus) return ''
|
||||||
if (this.showSecond) {
|
if (this.showSecond) {
|
||||||
return "datetime";
|
return 'datetime'
|
||||||
}
|
}
|
||||||
if (this.labelFormat?.endsWith("mm")) {
|
if (this.labelFormat?.endsWith('mm')) {
|
||||||
return "datetime";
|
return 'datetime'
|
||||||
}
|
}
|
||||||
if (this.labelFormat?.endsWith("HH")) {
|
if (this.labelFormat?.endsWith('HH')) {
|
||||||
return "datehour";
|
return 'datehour'
|
||||||
}
|
}
|
||||||
return dateMap[this.componentType];
|
return dateMap[this.componentType]
|
||||||
},
|
},
|
||||||
extPoperClass() {
|
extPoperClass() {
|
||||||
if (
|
if (
|
||||||
this.labelFormat &&
|
this.labelFormat &&
|
||||||
this.labelFormat.includes("HH") &&
|
this.labelFormat.includes('HH') &&
|
||||||
!this.labelFormat.includes("HH:mm")
|
!this.labelFormat.includes('HH:mm')
|
||||||
) {
|
) {
|
||||||
return "de-no-minite";
|
return 'de-no-minite'
|
||||||
}
|
}
|
||||||
return "";
|
return ''
|
||||||
},
|
},
|
||||||
defaultoptions() {
|
defaultoptions() {
|
||||||
if (
|
if (
|
||||||
!this.element ||
|
!this.element ||
|
||||||
!this.element.options ||
|
!this.element.options ||
|
||||||
!this.element.options.attrs.default
|
!this.element.options.attrs.default
|
||||||
)
|
) { return '' }
|
||||||
return "";
|
return JSON.stringify(this.element.options.attrs.default)
|
||||||
return JSON.stringify(this.element.options.attrs.default);
|
|
||||||
},
|
},
|
||||||
defaultValueStr() {
|
defaultValueStr() {
|
||||||
if (!this.element || !this.element.options || !this.element.options.value)
|
if (!this.element || !this.element.options || !this.element.options.value) { return '' }
|
||||||
return "";
|
return this.element.options.value.toString()
|
||||||
return this.element.options.value.toString();
|
|
||||||
},
|
},
|
||||||
viewIds() {
|
viewIds() {
|
||||||
if (
|
if (
|
||||||
!this.element ||
|
!this.element ||
|
||||||
!this.element.options ||
|
!this.element.options ||
|
||||||
!this.element.options.attrs.viewIds
|
!this.element.options.attrs.viewIds
|
||||||
)
|
) { return '' }
|
||||||
return "";
|
return this.element.options.attrs.viewIds.toString()
|
||||||
return this.element.options.attrs.viewIds.toString();
|
|
||||||
},
|
},
|
||||||
manualModify() {
|
manualModify() {
|
||||||
return !!this.element.options.manualModify;
|
return !!this.element.options.manualModify
|
||||||
},
|
},
|
||||||
isTimeWidget() {
|
isTimeWidget() {
|
||||||
const widget = ApplicationContext.getService(this.element.serviceName);
|
const widget = ApplicationContext.getService(this.element.serviceName)
|
||||||
return widget.isTimeWidget && widget.isTimeWidget();
|
return widget.isTimeWidget && widget.isTimeWidget()
|
||||||
},
|
},
|
||||||
componentType() {
|
componentType() {
|
||||||
let result = this.element.options.attrs.type || "date";
|
let result = this.element.options.attrs.type || 'date'
|
||||||
if (this.isTimeWidget && this.element.options.attrs.showTime) {
|
if (this.isTimeWidget && this.element.options.attrs.showTime) {
|
||||||
result =
|
result =
|
||||||
this.element.serviceName === "timeDateWidget"
|
this.element.serviceName === 'timeDateWidget'
|
||||||
? "datetime"
|
? 'datetime'
|
||||||
: "datetimerange";
|
: 'datetimerange'
|
||||||
}
|
}
|
||||||
return result;
|
return result
|
||||||
},
|
},
|
||||||
labelFormat() {
|
labelFormat() {
|
||||||
const result = "yyyy-MM-dd";
|
const result = 'yyyy-MM-dd'
|
||||||
if (
|
if (
|
||||||
this.isTimeWidget &&
|
this.isTimeWidget &&
|
||||||
this.element.options.attrs.showTime &&
|
this.element.options.attrs.showTime &&
|
||||||
this.element.options.attrs.accuracy
|
this.element.options.attrs.accuracy
|
||||||
) {
|
) {
|
||||||
return result + " " + this.element.options.attrs.accuracy;
|
return result + ' ' + this.element.options.attrs.accuracy
|
||||||
}
|
}
|
||||||
return null;
|
return null
|
||||||
},
|
},
|
||||||
pickerOptions() {
|
pickerOptions() {
|
||||||
const widget = ApplicationContext.getService(this.element.serviceName);
|
const widget = ApplicationContext.getService(this.element.serviceName)
|
||||||
if (this.element.options.attrs.type === "daterange" && widget.shortcuts) {
|
if (this.element.options.attrs.type === 'daterange' && widget.shortcuts) {
|
||||||
const cuts = widget.shortcuts();
|
const cuts = widget.shortcuts()
|
||||||
const result = cuts.map((cut) => {
|
const result = cuts.map((cut) => {
|
||||||
return {
|
return {
|
||||||
text: this.$t(cut.text),
|
text: this.$t(cut.text),
|
||||||
onClick: (picker) => {
|
onClick: (picker) => {
|
||||||
const param = cut.callBack();
|
const param = cut.callBack()
|
||||||
this.startWindowTime = param[0]
|
this.startWindowTime = param[0]
|
||||||
const disabled = param.some(ele => {
|
const disabled = param.some(ele => {
|
||||||
return this.disabledDate(ele - 1000)
|
return this.disabledDate(ele - 1000)
|
||||||
})
|
})
|
||||||
this.startWindowTime = 0
|
this.startWindowTime = 0
|
||||||
if (disabled) return
|
if (disabled) return
|
||||||
picker.$emit("pick", param);
|
picker.$emit('pick', param)
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
});
|
})
|
||||||
return {
|
return {
|
||||||
shortcuts: result,
|
shortcuts: result,
|
||||||
disabledDate: (val) => {
|
disabledDate: (val) => {
|
||||||
return this.disabledDate(val)
|
return this.disabledDate(val)
|
||||||
},
|
},
|
||||||
onPick: ({ minDate }) => {
|
onPick: ({ minDate }) => {
|
||||||
this.startWindowTime = +new Date(minDate);
|
this.startWindowTime = +new Date(minDate)
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
}
|
}
|
||||||
return null;
|
return null
|
||||||
},
|
},
|
||||||
defaultRangeTime() {
|
defaultRangeTime() {
|
||||||
if (
|
if (
|
||||||
this.element.options.attrs.type === "daterange" &&
|
this.element.options.attrs.type === 'daterange' &&
|
||||||
this.element.options.attrs.showTime
|
this.element.options.attrs.showTime
|
||||||
) {
|
) {
|
||||||
return ["00:00:00", "23:59:59"];
|
return ['00:00:00', '23:59:59']
|
||||||
}
|
}
|
||||||
return null;
|
return null
|
||||||
},
|
},
|
||||||
showRequiredTips() {
|
showRequiredTips() {
|
||||||
return (
|
return (
|
||||||
this.inDraw &&
|
this.inDraw &&
|
||||||
this.element.options.attrs.required &&
|
this.element.options.attrs.required &&
|
||||||
(!this.values || this.values.length === 0)
|
(!this.values || this.values.length === 0)
|
||||||
);
|
)
|
||||||
},
|
},
|
||||||
...mapState(["canvasStyleData", "mobileStatus"]),
|
...mapState(['canvasStyleData', 'mobileStatus'])
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
values: function (val, old) {
|
values: function(val, old) {
|
||||||
if (!this.inDraw) {
|
if (!this.inDraw) {
|
||||||
this.$emit("widget-value-changed", val);
|
this.$emit('widget-value-changed', val)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
viewIds: function (value, old) {
|
viewIds: function(value, old) {
|
||||||
if (typeof value === "undefined" || value === old) return;
|
if (typeof value === 'undefined' || value === old) return
|
||||||
this.setCondition();
|
this.setCondition()
|
||||||
},
|
},
|
||||||
defaultValueStr: function (value, old) {
|
defaultValueStr: function(value, old) {
|
||||||
if (this.element.options.attrs.default.isDynamic) {
|
if (this.element.options.attrs.default.isDynamic) {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
if (value === old) return;
|
if (value === old) return
|
||||||
this.values = this.fillValueDerfault();
|
this.values = this.fillValueDerfault()
|
||||||
this.dateChange(value);
|
this.dateChange(value)
|
||||||
},
|
},
|
||||||
defaultoptions: function (val, old) {
|
defaultoptions: function(val, old) {
|
||||||
if (!this.element.options.attrs.default.isDynamic) {
|
if (!this.element.options.attrs.default.isDynamic) {
|
||||||
this.values = this.fillValueDerfault(false);
|
this.values = this.fillValueDerfault(false)
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
if (val === old) return;
|
if (val === old) return
|
||||||
const widget = ApplicationContext.getService(this.element.serviceName);
|
const widget = ApplicationContext.getService(this.element.serviceName)
|
||||||
this.values = widget.dynamicDateFormNow(this.element);
|
this.values = widget.dynamicDateFormNow(this.element)
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
},
|
},
|
||||||
labelFormat: function (val, old) {
|
labelFormat: function(val, old) {
|
||||||
if (val !== old) {
|
if (val !== old) {
|
||||||
this.show = false;
|
this.show = false
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.show = true;
|
this.show = true
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.loadInit();
|
this.loadInit()
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.dynamicRefresh();
|
this.dynamicRefresh()
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
bus.$on("onScroll", this.onScroll);
|
bus.$on('onScroll', this.onScroll)
|
||||||
if (this.inDraw) {
|
if (this.inDraw) {
|
||||||
bus.$on("reset-default-value", this.resetDefaultValue);
|
bus.$on('reset-default-value', this.resetDefaultValue)
|
||||||
}
|
}
|
||||||
const _this = this
|
const _this = this
|
||||||
window.addEventListener('message', function(event) {
|
window.addEventListener('message', function(event) {
|
||||||
@ -349,15 +346,15 @@ export default {
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
this.clearTime();
|
this.clearTime()
|
||||||
bus.$off("onScroll", this.onScroll);
|
bus.$off('onScroll', this.onScroll)
|
||||||
bus.$off("reset-default-value", this.resetDefaultValue);
|
bus.$off('reset-default-value', this.resetDefaultValue)
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
disabledDate(val) {
|
disabledDate(val) {
|
||||||
const timeStamp = +new Date(val);
|
const timeStamp = +new Date(val)
|
||||||
if (!this.element.options.attrs.setTimeRange) {
|
if (!this.element.options.attrs.setTimeRange) {
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
const {
|
const {
|
||||||
intervalType,
|
intervalType,
|
||||||
@ -371,264 +368,264 @@ export default {
|
|||||||
maximumSingleQuery,
|
maximumSingleQuery,
|
||||||
timeNumRange,
|
timeNumRange,
|
||||||
relativeToCurrentTypeRange,
|
relativeToCurrentTypeRange,
|
||||||
aroundRange,
|
aroundRange
|
||||||
} = this.element.options.attrs.timeRange || {};
|
} = this.element.options.attrs.timeRange || {}
|
||||||
let isDynamicWindowTime = false;
|
let isDynamicWindowTime = false
|
||||||
if (this.startWindowTime && dynamicWindow) {
|
if (this.startWindowTime && dynamicWindow) {
|
||||||
isDynamicWindowTime =
|
isDynamicWindowTime =
|
||||||
dayjs(this.startWindowTime)
|
dayjs(this.startWindowTime)
|
||||||
.add(maximumSingleQuery, "day")
|
.add(maximumSingleQuery, 'day')
|
||||||
.startOf("day")
|
.startOf('day')
|
||||||
.valueOf() -
|
.valueOf() -
|
||||||
1000 <
|
1000 <
|
||||||
timeStamp;
|
timeStamp
|
||||||
}
|
}
|
||||||
if (intervalType === "none") {
|
if (intervalType === 'none') {
|
||||||
if (dynamicWindow) return isDynamicWindowTime;
|
if (dynamicWindow) return isDynamicWindowTime
|
||||||
return false;
|
return false
|
||||||
}
|
}
|
||||||
let startTime;
|
let startTime
|
||||||
if (relativeToCurrent === "custom") {
|
if (relativeToCurrent === 'custom') {
|
||||||
startTime = getAround(
|
startTime = getAround(
|
||||||
relativeToCurrentType,
|
relativeToCurrentType,
|
||||||
around === "f" ? "subtract" : "add",
|
around === 'f' ? 'subtract' : 'add',
|
||||||
timeNum,
|
timeNum
|
||||||
);
|
)
|
||||||
} else {
|
} else {
|
||||||
switch (relativeToCurrent) {
|
switch (relativeToCurrent) {
|
||||||
case "thisYear":
|
case 'thisYear':
|
||||||
startTime = getThisStart("year");
|
startTime = getThisStart('year')
|
||||||
break;
|
break
|
||||||
case "lastYear":
|
case 'lastYear':
|
||||||
startTime = getLastStart("year");
|
startTime = getLastStart('year')
|
||||||
break;
|
break
|
||||||
case "thisMonth":
|
case 'thisMonth':
|
||||||
startTime = getThisStart("month");
|
startTime = getThisStart('month')
|
||||||
break;
|
break
|
||||||
case "lastMonth":
|
case 'lastMonth':
|
||||||
startTime = getLastStart("month");
|
startTime = getLastStart('month')
|
||||||
break;
|
break
|
||||||
case "today":
|
case 'today':
|
||||||
startTime = getThisStart("day");
|
startTime = getThisStart('day')
|
||||||
break;
|
break
|
||||||
case "yesterday":
|
case 'yesterday':
|
||||||
startTime = getLastStart("day");
|
startTime = getLastStart('day')
|
||||||
break;
|
break
|
||||||
case "monthBeginning":
|
case 'monthBeginning':
|
||||||
startTime = getThisStart("month");
|
startTime = getThisStart('month')
|
||||||
break;
|
break
|
||||||
case "yearBeginning":
|
case 'yearBeginning':
|
||||||
startTime = getThisStart("year");
|
startTime = getThisStart('year')
|
||||||
break;
|
break
|
||||||
|
|
||||||
default:
|
default:
|
||||||
break;
|
break
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const startValue =
|
const startValue =
|
||||||
regularOrTrends === "fixed" ? regularOrTrendsValue : startTime;
|
regularOrTrends === 'fixed' ? regularOrTrendsValue : startTime
|
||||||
|
|
||||||
if (intervalType === "start") {
|
if (intervalType === 'start') {
|
||||||
return timeStamp < +new Date(startValue) || isDynamicWindowTime;
|
return timeStamp < +new Date(startValue) || isDynamicWindowTime
|
||||||
}
|
}
|
||||||
|
|
||||||
if (intervalType === "end") {
|
if (intervalType === 'end') {
|
||||||
return timeStamp > +new Date(startValue) || isDynamicWindowTime;
|
return timeStamp > +new Date(startValue) || isDynamicWindowTime
|
||||||
}
|
}
|
||||||
|
|
||||||
if (intervalType === "timeInterval") {
|
if (intervalType === 'timeInterval') {
|
||||||
const startTime =
|
const startTime =
|
||||||
regularOrTrends === "fixed"
|
regularOrTrends === 'fixed'
|
||||||
? regularOrTrendsValue[0]
|
? regularOrTrendsValue[0]
|
||||||
: getAround(
|
: getAround(
|
||||||
relativeToCurrentType,
|
relativeToCurrentType,
|
||||||
around === "f" ? "subtract" : "add",
|
around === 'f' ? 'subtract' : 'add',
|
||||||
timeNum,
|
timeNum
|
||||||
);
|
)
|
||||||
const endTime =
|
const endTime =
|
||||||
regularOrTrends === "fixed"
|
regularOrTrends === 'fixed'
|
||||||
? regularOrTrendsValue[1]
|
? regularOrTrendsValue[1]
|
||||||
: getAround(
|
: getAround(
|
||||||
relativeToCurrentTypeRange,
|
relativeToCurrentTypeRange,
|
||||||
aroundRange === "f" ? "subtract" : "add",
|
aroundRange === 'f' ? 'subtract' : 'add',
|
||||||
timeNumRange,
|
timeNumRange
|
||||||
);
|
)
|
||||||
return (
|
return (
|
||||||
timeStamp < +new Date(startTime) - 1000 ||
|
timeStamp < +new Date(startTime) - 1000 ||
|
||||||
timeStamp > +new Date(endTime) ||
|
timeStamp > +new Date(endTime) ||
|
||||||
isDynamicWindowTime
|
isDynamicWindowTime
|
||||||
);
|
)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
showPopupRight() {
|
showPopupRight() {
|
||||||
// eslint-disable-next-line
|
// eslint-disable-next-line
|
||||||
const [_, end] = this.values || [];
|
const [_, end] = this.values || [];
|
||||||
!!end && (this.currentDate = new Date(end));
|
!!end && (this.currentDate = new Date(end))
|
||||||
this.selectSecondInput = true;
|
this.selectSecondInput = true
|
||||||
this.showDate = true;
|
this.showDate = true
|
||||||
},
|
},
|
||||||
cancel() {
|
cancel() {
|
||||||
this.showDate = false;
|
this.showDate = false
|
||||||
},
|
},
|
||||||
confirm() {
|
confirm() {
|
||||||
this.setArrValue();
|
this.setArrValue()
|
||||||
if (this.showSecond) {
|
if (this.showSecond) {
|
||||||
this.columns = seconds;
|
this.columns = seconds
|
||||||
this.selectSecond = true;
|
this.selectSecond = true
|
||||||
}
|
}
|
||||||
if (this.selectSecond || this.componentTypeVant === "year") {
|
if (this.selectSecond || this.componentTypeVant === 'year') {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
this.showDate = false;
|
this.showDate = false
|
||||||
this.mobileDateChange();
|
this.mobileDateChange()
|
||||||
},
|
},
|
||||||
onCancel() {
|
onCancel() {
|
||||||
this.showDate = false;
|
this.showDate = false
|
||||||
if (this.showSecond) {
|
if (this.showSecond) {
|
||||||
this.selectSecond = false;
|
this.selectSecond = false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
setArrValue(val) {
|
setArrValue(val) {
|
||||||
if (!this.isRange) {
|
if (!this.isRange) {
|
||||||
if (this.selectSecond) {
|
if (this.selectSecond) {
|
||||||
this.values = this.values + val * 1000;
|
this.values = this.values + val * 1000
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
this.values = val ? +new Date(val) : +new Date(this.currentDate);
|
this.values = val ? +new Date(val) : +new Date(this.currentDate)
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
const [start, end] = this.values || [];
|
const [start, end] = this.values || []
|
||||||
if (this.selectSecond) {
|
if (this.selectSecond) {
|
||||||
if (this.selectSecondInput) {
|
if (this.selectSecondInput) {
|
||||||
this.values = [start, +new Date(this.currentDate) + val * 1000];
|
this.values = [start, +new Date(this.currentDate) + val * 1000]
|
||||||
} else {
|
} else {
|
||||||
this.values = [+new Date(this.currentDate) + val * 1000, end];
|
this.values = [+new Date(this.currentDate) + val * 1000, end]
|
||||||
}
|
}
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
if (this.selectSecondInput) {
|
if (this.selectSecondInput) {
|
||||||
this.values = [start, +new Date(this.currentDate)];
|
this.values = [start, +new Date(this.currentDate)]
|
||||||
} else {
|
} else {
|
||||||
this.values = [+new Date(this.currentDate), end];
|
this.values = [+new Date(this.currentDate), end]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onConfirm(val) {
|
onConfirm(val) {
|
||||||
this.showDate = false;
|
this.showDate = false
|
||||||
this.setArrValue(val);
|
this.setArrValue(val)
|
||||||
if (this.showSecond) {
|
if (this.showSecond) {
|
||||||
this.columns = years;
|
this.columns = years
|
||||||
this.selectSecond = false;
|
this.selectSecond = false
|
||||||
}
|
}
|
||||||
this.mobileDateChange();
|
this.mobileDateChange()
|
||||||
},
|
},
|
||||||
mobileDateChange() {
|
mobileDateChange() {
|
||||||
if (this.isRange) {
|
if (this.isRange) {
|
||||||
const [start, end] = this.values || [];
|
const [start, end] = this.values || []
|
||||||
if (!start || !end) return;
|
if (!start || !end) return
|
||||||
}
|
}
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
},
|
},
|
||||||
showPopup() {
|
showPopup() {
|
||||||
if (this.isRange) {
|
if (this.isRange) {
|
||||||
const [start] = this.values || [];
|
const [start] = this.values || []
|
||||||
!!start && (this.currentDate = new Date(start));
|
!!start && (this.currentDate = new Date(start))
|
||||||
} else {
|
} else {
|
||||||
this.currentDate = new Date(this.values);
|
this.currentDate = new Date(this.values)
|
||||||
if (this.componentTypeVant === "year") {
|
if (this.componentTypeVant === 'year') {
|
||||||
this.defaultIndex = years.findIndex(
|
this.defaultIndex = years.findIndex(
|
||||||
(ele) => `${this.currentDate.getFullYear()}` === ele,
|
(ele) => `${this.currentDate.getFullYear()}` === ele
|
||||||
);
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.selectSecondInput = false;
|
this.selectSecondInput = false
|
||||||
this.showDate = true;
|
this.showDate = true
|
||||||
},
|
},
|
||||||
loadInit() {
|
loadInit() {
|
||||||
this.clearTime();
|
this.clearTime()
|
||||||
const existLastValidFilters =
|
const existLastValidFilters =
|
||||||
this.$store.state.lastValidFilters &&
|
this.$store.state.lastValidFilters &&
|
||||||
this.$store.state.lastValidFilters[this.element.id];
|
this.$store.state.lastValidFilters[this.element.id]
|
||||||
if (
|
if (
|
||||||
this.element.options.attrs.default?.isDynamic &&
|
this.element.options.attrs.default?.isDynamic &&
|
||||||
!existLastValidFilters
|
!existLastValidFilters
|
||||||
) {
|
) {
|
||||||
return this.refreshHandler();
|
return this.refreshHandler()
|
||||||
}
|
}
|
||||||
if (this.element.options.value || existLastValidFilters) {
|
if (this.element.options.value || existLastValidFilters) {
|
||||||
this.values = this.fillValueDerfault();
|
this.values = this.fillValueDerfault()
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
refreshHandler() {
|
refreshHandler() {
|
||||||
if (this.element.options.attrs.default?.isDynamic) {
|
if (this.element.options.attrs.default?.isDynamic) {
|
||||||
const widget = ApplicationContext.getService(this.element.serviceName);
|
const widget = ApplicationContext.getService(this.element.serviceName)
|
||||||
this.values = widget.dynamicDateFormNow(this.element);
|
this.values = widget.dynamicDateFormNow(this.element)
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
return true;
|
return true
|
||||||
}
|
}
|
||||||
return false;
|
return false
|
||||||
},
|
},
|
||||||
clearTime() {
|
clearTime() {
|
||||||
if (this.outTimer) {
|
if (this.outTimer) {
|
||||||
clearTimeout(this.outTimer);
|
clearTimeout(this.outTimer)
|
||||||
this.outTimer = null;
|
this.outTimer = null
|
||||||
}
|
}
|
||||||
if (this.innerTimer) {
|
if (this.innerTimer) {
|
||||||
clearInterval(this.innerTimer);
|
clearInterval(this.innerTimer)
|
||||||
this.innerTimer = null;
|
this.innerTimer = null
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
dynamicRefresh() {
|
dynamicRefresh() {
|
||||||
if (this.inDraw && this.element.options.attrs.default?.isDynamic) {
|
if (this.inDraw && this.element.options.attrs.default?.isDynamic) {
|
||||||
const nowDate = new Date();
|
const nowDate = new Date()
|
||||||
const nowTime = nowDate.getTime();
|
const nowTime = nowDate.getTime()
|
||||||
const tomorrow = new Date(
|
const tomorrow = new Date(
|
||||||
`${nowDate.getFullYear()}-${nowDate.getMonth() + 1}-${
|
`${nowDate.getFullYear()}-${nowDate.getMonth() + 1}-${
|
||||||
nowDate.getDate() + 1
|
nowDate.getDate() + 1
|
||||||
} 00:00:01`,
|
} 00:00:01`
|
||||||
);
|
)
|
||||||
const tomorrowTime = tomorrow.getTime();
|
const tomorrowTime = tomorrow.getTime()
|
||||||
this.clearTime();
|
this.clearTime()
|
||||||
this.outTimer = setTimeout(() => {
|
this.outTimer = setTimeout(() => {
|
||||||
if (this.inDraw) {
|
if (this.inDraw) {
|
||||||
this.refreshHandler();
|
this.refreshHandler()
|
||||||
}
|
}
|
||||||
this.innerTimer = setInterval(
|
this.innerTimer = setInterval(
|
||||||
() => {
|
() => {
|
||||||
if (this.inDraw) {
|
if (this.inDraw) {
|
||||||
this.refreshHandler();
|
this.refreshHandler()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
24 * 3600 * 1000,
|
24 * 3600 * 1000
|
||||||
);
|
)
|
||||||
}, tomorrowTime - nowTime);
|
}, tomorrowTime - nowTime)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
clearHandler() {
|
clearHandler() {
|
||||||
this.values = null;
|
this.values = null
|
||||||
},
|
},
|
||||||
onScroll() {
|
onScroll() {
|
||||||
if (this.onFocus) {
|
if (this.onFocus) {
|
||||||
this.$refs.dateRef.hidePicker();
|
this.$refs.dateRef.hidePicker()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
textSame(str1, str2) {
|
textSame(str1, str2) {
|
||||||
if (str1 === null && str2 === null) {
|
if (str1 === null && str2 === null) {
|
||||||
return true;
|
return true
|
||||||
}
|
}
|
||||||
if (
|
if (
|
||||||
str1 !== null &&
|
str1 !== null &&
|
||||||
str2 !== null &&
|
str2 !== null &&
|
||||||
typeof str1 !== "undefined" &&
|
typeof str1 !== 'undefined' &&
|
||||||
typeof str2 !== "undefined"
|
typeof str2 !== 'undefined'
|
||||||
) {
|
) {
|
||||||
return str1.toString() === str2.toString();
|
return str1.toString() === str2.toString()
|
||||||
}
|
}
|
||||||
return false;
|
return false
|
||||||
},
|
},
|
||||||
resetDefaultValue(ele) {
|
resetDefaultValue(ele) {
|
||||||
const id = ele.id;
|
const id = ele.id
|
||||||
const eleVal = ele.options.value.toString();
|
const eleVal = ele.options.value.toString()
|
||||||
if (
|
if (
|
||||||
this.inDraw &&
|
this.inDraw &&
|
||||||
this.manualModify &&
|
this.manualModify &&
|
||||||
@ -637,141 +634,141 @@ export default {
|
|||||||
this.textSame(this.defaultValueStr, eleVal)
|
this.textSame(this.defaultValueStr, eleVal)
|
||||||
) {
|
) {
|
||||||
if (!this.element.options.attrs.default.isDynamic) {
|
if (!this.element.options.attrs.default.isDynamic) {
|
||||||
this.values = this.fillValueDerfault();
|
this.values = this.fillValueDerfault()
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
const widget = ApplicationContext.getService(this.element.serviceName);
|
const widget = ApplicationContext.getService(this.element.serviceName)
|
||||||
this.values = widget.dynamicDateFormNow(this.element);
|
this.values = widget.dynamicDateFormNow(this.element)
|
||||||
this.dateChange(this.values);
|
this.dateChange(this.values)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onBlur() {
|
onBlur() {
|
||||||
this.startWindowTime = 0;
|
this.startWindowTime = 0
|
||||||
this.onFocus = false;
|
this.onFocus = false
|
||||||
},
|
},
|
||||||
toFocus() {
|
toFocus() {
|
||||||
this.onFocus = true;
|
this.onFocus = true
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.handleCoustomStyle();
|
this.handleCoustomStyle()
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
search() {
|
search() {
|
||||||
this.setCondition();
|
this.setCondition()
|
||||||
},
|
},
|
||||||
getCondition() {
|
getCondition() {
|
||||||
const param = {
|
const param = {
|
||||||
canvasId: this.canvasId,
|
canvasId: this.canvasId,
|
||||||
component: this.element,
|
component: this.element,
|
||||||
value: this.formatFilterValue(),
|
value: this.formatFilterValue(),
|
||||||
operator: this.operator,
|
operator: this.operator
|
||||||
};
|
}
|
||||||
param.value = this.formatValues(param.value);
|
param.value = this.formatValues(param.value)
|
||||||
return param;
|
return param
|
||||||
},
|
},
|
||||||
setCondition() {
|
setCondition() {
|
||||||
if (this.showRequiredTips) {
|
if (this.showRequiredTips) {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
const param = this.getCondition();
|
const param = this.getCondition()
|
||||||
!this.isRelation &&
|
!this.isRelation &&
|
||||||
this.inDraw &&
|
this.inDraw &&
|
||||||
this.$store.commit("addViewFilter", param);
|
this.$store.commit('addViewFilter', param)
|
||||||
},
|
},
|
||||||
dateChange(value) {
|
dateChange(value) {
|
||||||
if (!this.inDraw) {
|
if (!this.inDraw) {
|
||||||
if (value === null) {
|
if (value === null) {
|
||||||
this.element.options.value = "";
|
this.element.options.value = ''
|
||||||
} else {
|
} else {
|
||||||
this.element.options.value = Array.isArray(value)
|
this.element.options.value = Array.isArray(value)
|
||||||
? value.join()
|
? value.join()
|
||||||
: value.toString();
|
: value.toString()
|
||||||
}
|
}
|
||||||
this.element.options.manualModify = false;
|
this.element.options.manualModify = false
|
||||||
} else {
|
} else {
|
||||||
this.element.options.manualModify = true;
|
this.element.options.manualModify = true
|
||||||
if (!this.showRequiredTips) {
|
if (!this.showRequiredTips) {
|
||||||
this.$store.commit("setLastValidFilters", {
|
this.$store.commit('setLastValidFilters', {
|
||||||
componentId: this.element.id,
|
componentId: this.element.id,
|
||||||
val:
|
val:
|
||||||
this.values && Array.isArray(this.values)
|
this.values && Array.isArray(this.values)
|
||||||
? this.values.join(",")
|
? this.values.join(',')
|
||||||
: this.values,
|
: this.values
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.setCondition();
|
this.setCondition()
|
||||||
},
|
},
|
||||||
formatFilterValue() {
|
formatFilterValue() {
|
||||||
if (this.values === null) return [];
|
if (this.values === null) return []
|
||||||
if (Array.isArray(this.values)) return this.values;
|
if (Array.isArray(this.values)) return this.values
|
||||||
return [this.values];
|
return [this.values]
|
||||||
},
|
},
|
||||||
formatValues(values) {
|
formatValues(values) {
|
||||||
if (!values || values.length === 0) {
|
if (!values || values.length === 0) {
|
||||||
return [];
|
return []
|
||||||
}
|
}
|
||||||
if (this.element.options.attrs.type === "daterange") {
|
if (this.element.options.attrs.type === 'daterange') {
|
||||||
if (values.length !== 2) {
|
if (values.length !== 2) {
|
||||||
return null;
|
return null
|
||||||
}
|
}
|
||||||
let start = values[0];
|
let start = values[0]
|
||||||
let end = values[1];
|
let end = values[1]
|
||||||
start = timeSection(start, "datetime", this.labelFormat)[0];
|
start = timeSection(start, 'datetime', this.labelFormat)[0]
|
||||||
end = timeSection(end, "datetime", this.labelFormat)[1];
|
end = timeSection(end, 'datetime', this.labelFormat)[1]
|
||||||
|
|
||||||
const results = [start, end];
|
const results = [start, end]
|
||||||
return results;
|
return results
|
||||||
} else {
|
} else {
|
||||||
const value = values[0];
|
const value = values[0]
|
||||||
return timeSection(
|
return timeSection(
|
||||||
parseFloat(value),
|
parseFloat(value),
|
||||||
this.componentType || this.element.options.attrs.type,
|
this.componentType || this.element.options.attrs.type,
|
||||||
this.labelFormat,
|
this.labelFormat
|
||||||
);
|
)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
fillValueDerfault(useLastFilter = true) {
|
fillValueDerfault(useLastFilter = true) {
|
||||||
let defaultV =
|
let defaultV =
|
||||||
this.element.options.value === null
|
this.element.options.value === null
|
||||||
? ""
|
? ''
|
||||||
: this.element.options.value.toString();
|
: this.element.options.value.toString()
|
||||||
if (this.inDraw && useLastFilter) {
|
if (this.inDraw && useLastFilter) {
|
||||||
let lastFilters = null;
|
let lastFilters = null
|
||||||
if (this.$store.state.lastValidFilters) {
|
if (this.$store.state.lastValidFilters) {
|
||||||
lastFilters = this.$store.state.lastValidFilters[this.element.id];
|
lastFilters = this.$store.state.lastValidFilters[this.element.id]
|
||||||
if (lastFilters) {
|
if (lastFilters) {
|
||||||
defaultV =
|
defaultV =
|
||||||
lastFilters.val === null || typeof lastFilters.val === "undefined"
|
lastFilters.val === null || typeof lastFilters.val === 'undefined'
|
||||||
? ""
|
? ''
|
||||||
: lastFilters.val.toString();
|
: lastFilters.val.toString()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (this.element.options.attrs.type === "daterange") {
|
if (this.element.options.attrs.type === 'daterange') {
|
||||||
if (
|
if (
|
||||||
defaultV === null ||
|
defaultV === null ||
|
||||||
typeof defaultV === "undefined" ||
|
typeof defaultV === 'undefined' ||
|
||||||
defaultV === "" ||
|
defaultV === '' ||
|
||||||
defaultV === "[object Object]"
|
defaultV === '[object Object]'
|
||||||
) {
|
) {
|
||||||
return [];
|
return []
|
||||||
}
|
}
|
||||||
return defaultV.split(",").map((item) => parseFloat(item));
|
return defaultV.split(',').map((item) => parseFloat(item))
|
||||||
} else {
|
} else {
|
||||||
if (
|
if (
|
||||||
defaultV === null ||
|
defaultV === null ||
|
||||||
typeof defaultV === "undefined" ||
|
typeof defaultV === 'undefined' ||
|
||||||
defaultV === "" ||
|
defaultV === '' ||
|
||||||
defaultV === "[object Object]"
|
defaultV === '[object Object]'
|
||||||
) {
|
) {
|
||||||
return null;
|
return null
|
||||||
}
|
}
|
||||||
return parseFloat(defaultV.split(",")[0]);
|
return parseFloat(defaultV.split(',')[0])
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.show-required-tips {
|
.show-required-tips {
|
||||||
|
|||||||
@ -15,8 +15,8 @@
|
|||||||
>
|
>
|
||||||
|
|
||||||
<el-button
|
<el-button
|
||||||
slot="append"
|
|
||||||
v-if="!isRelation"
|
v-if="!isRelation"
|
||||||
|
slot="append"
|
||||||
icon="el-icon-search"
|
icon="el-icon-search"
|
||||||
@click="search"
|
@click="search"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@ -27,123 +27,123 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { uuid } from "vue-uuid";
|
import { uuid } from 'vue-uuid'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "DeRadio",
|
name: 'DeRadio',
|
||||||
model: {
|
model: {
|
||||||
prop: "value", // 绑定的值，通过父组件传递
|
prop: 'value', // 绑定的值，通过父组件传递
|
||||||
event: "update", // 自定义名
|
event: 'update' // 自定义名
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
id: {
|
id: {
|
||||||
type: String,
|
type: String,
|
||||||
require: true,
|
require: true,
|
||||||
default: uuid.v1(),
|
default: uuid.v1()
|
||||||
},
|
},
|
||||||
radioStyle: {
|
radioStyle: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: () => {},
|
default: () => {}
|
||||||
},
|
},
|
||||||
list: {
|
list: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: () => {
|
default: () => {
|
||||||
return [];
|
return []
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
value: {
|
value: {
|
||||||
type: [String, Number],
|
type: [String, Number],
|
||||||
default: "",
|
default: ''
|
||||||
},
|
},
|
||||||
isConfig: {
|
isConfig: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
},
|
||||||
itemDisabled: {
|
itemDisabled: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false,
|
default: false
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
newList: [],
|
newList: [],
|
||||||
selectValue: this.value,
|
selectValue: this.value,
|
||||||
options: [],
|
options: [],
|
||||||
defaultFirst: false,
|
defaultFirst: false
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
maxLength() {
|
maxLength() {
|
||||||
return this.radioStyle.showNum || 5;
|
return this.radioStyle.showNum || 5
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
value(val) {
|
value(val) {
|
||||||
this.selectValue = val;
|
this.selectValue = val
|
||||||
},
|
},
|
||||||
selectValue(val) {
|
selectValue(val) {
|
||||||
this.$emit("update", val);
|
this.$emit('update', val)
|
||||||
if (!val) {
|
if (!val) {
|
||||||
this.resetList();
|
this.resetList()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
maxLength() {
|
maxLength() {
|
||||||
this.resetList();
|
this.resetList()
|
||||||
},
|
},
|
||||||
list() {
|
list() {
|
||||||
this.resetList();
|
this.resetList()
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.init();
|
this.init()
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
radioStyle: {
|
radioStyle: {
|
||||||
handler() {
|
handler() {
|
||||||
this.setPlaceholderColor();
|
this.setPlaceholderColor()
|
||||||
},
|
},
|
||||||
deep: true,
|
deep: true
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.resetList();
|
this.resetList()
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.init();
|
this.init()
|
||||||
this.setPlaceholderColor();
|
this.setPlaceholderColor()
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
let styleEle = document.querySelector(`#radio-style${this.id}`);
|
const styleEle = document.querySelector(`#radio-style${this.id}`)
|
||||||
if (styleEle) {
|
if (styleEle) {
|
||||||
styleEle.parentElement.removeChild(styleEle);
|
styleEle.parentElement.removeChild(styleEle)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
setPlaceholderColor() {
|
setPlaceholderColor() {
|
||||||
let styleEle = document.querySelector(`#radio-style${this.id}`);
|
let styleEle = document.querySelector(`#radio-style${this.id}`)
|
||||||
if (!styleEle) {
|
if (!styleEle) {
|
||||||
styleEle = document.createElement("style");
|
styleEle = document.createElement('style')
|
||||||
styleEle.id = `radio-style${this.id}`;
|
styleEle.id = `radio-style${this.id}`
|
||||||
document.querySelector("head").appendChild(styleEle);
|
document.querySelector('head').appendChild(styleEle)
|
||||||
}
|
}
|
||||||
styleEle.innerHTML = `#component${this.id} .el-radio-button:not(.is-active) .el-radio-button__inner {\n color: ${this.radioStyle.wordColor}; \n border-color: ${this.radioStyle.brColor}; \n background-color: ${this.radioStyle.innerBgColor}; \n } #component${this.id} .el-radio:not(.is-check) .el-radio__label {\n color: ${this.radioStyle.wordColor}; \n }`;
|
styleEle.innerHTML = `#component${this.id} .el-radio-button:not(.is-active) .el-radio-button__inner {\n color: ${this.radioStyle.wordColor}; \n border-color: ${this.radioStyle.brColor}; \n background-color: ${this.radioStyle.innerBgColor}; \n } #component${this.id} .el-radio:not(.is-check) .el-radio__label {\n color: ${this.radioStyle.wordColor}; \n }`
|
||||||
},
|
},
|
||||||
resetList(arrays) {
|
resetList(arrays) {
|
||||||
if (Array.isArray(arrays)) {
|
if (Array.isArray(arrays)) {
|
||||||
this.newList = arrays.slice();
|
this.newList = arrays.slice()
|
||||||
} else {
|
} else {
|
||||||
this.newList = this.list.slice();
|
this.newList = this.list.slice()
|
||||||
}
|
}
|
||||||
this.options = this.newList.slice(0, this.maxLength);
|
this.options = this.newList.slice(0, this.maxLength)
|
||||||
},
|
},
|
||||||
init() {
|
init() {
|
||||||
if (this.defaultFirst && this.list.length > 0) {
|
if (this.defaultFirst && this.list.length > 0) {
|
||||||
this.selectValue = this.list[0].value;
|
this.selectValue = this.list[0].value
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
visualChange(val) {
|
visualChange(val) {
|
||||||
this.$emit("change", val);
|
this.$emit('change', val)
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
|
|||||||
@ -31,7 +31,7 @@
|
|||||||
:indeterminate="isIndeterminate"
|
:indeterminate="isIndeterminate"
|
||||||
@change="handleCheckAllChange"
|
@change="handleCheckAllChange"
|
||||||
>
|
>
|
||||||
{{ $t('commons.all') }}
|
{{ $t('commons.all') }}
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
<el-checkbox-group
|
<el-checkbox-group
|
||||||
v-model="value"
|
v-model="value"
|
||||||
@ -39,8 +39,8 @@
|
|||||||
>
|
>
|
||||||
<template v-for="item in dataWithEmpty">
|
<template v-for="item in dataWithEmpty">
|
||||||
<el-checkbox
|
<el-checkbox
|
||||||
class="is-tree-select"
|
|
||||||
:key="item.id"
|
:key="item.id"
|
||||||
|
class="is-tree-select"
|
||||||
:label="item.id"
|
:label="item.id"
|
||||||
>{{ item.label || item.id }}
|
>{{ item.label || item.id }}
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
@ -63,7 +63,7 @@
|
|||||||
:label="item.id"
|
:label="item.id"
|
||||||
@click.native.prevent="testChange(item)"
|
@click.native.prevent="testChange(item)"
|
||||||
>
|
>
|
||||||
<span>{{item.label || item.id }}</span>
|
<span>{{ item.label || item.id }}</span>
|
||||||
</el-radio>
|
</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</div>
|
</div>
|
||||||
@ -132,7 +132,7 @@ export default {
|
|||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
dataWithEmpty() {
|
dataWithEmpty() {
|
||||||
return this.element.options.attrs.showEmpty ? [{ label: '空数据', id: '_empty_$'}, ...this.data] : this.data
|
return this.element.options.attrs.showEmpty ? [{ label: '空数据', id: '_empty_$' }, ...this.data] : this.data
|
||||||
},
|
},
|
||||||
operator() {
|
operator() {
|
||||||
return this.element.options.attrs.multiple ? 'in' : 'eq'
|
return this.element.options.attrs.multiple ? 'in' : 'eq'
|
||||||
|
|||||||
@ -492,6 +492,5 @@ export default {
|
|||||||
border-left: none;
|
border-left: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -14,7 +14,12 @@
|
|||||||
label="选项卡标题"
|
label="选项卡标题"
|
||||||
prop="titleShow"
|
prop="titleShow"
|
||||||
>
|
>
|
||||||
<el-checkbox v-model="styleInfo.titleHide" @change="styleChange">隐藏</el-checkbox>
|
<el-checkbox
|
||||||
|
v-model="styleInfo.titleHide"
|
||||||
|
@change="styleChange"
|
||||||
|
>
|
||||||
|
隐藏
|
||||||
|
</el-checkbox>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<template v-if="!styleInfo.titleHide">
|
<template v-if="!styleInfo.titleHide">
|
||||||
<el-form-item
|
<el-form-item
|
||||||
|
|||||||
@ -1,54 +1,54 @@
|
|||||||
<template>
|
<template>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
v-if="pwdPeriodWarn && !tipClosed"
|
v-if="pwdPeriodWarn && !tipClosed"
|
||||||
class="lic_tips"
|
class="lic_tips"
|
||||||
>
|
>
|
||||||
<el-alert
|
<el-alert
|
||||||
class="lic_alert"
|
class="lic_alert"
|
||||||
:title="warnMsg"
|
:title="warnMsg"
|
||||||
type="warning"
|
type="warning"
|
||||||
show-icon
|
show-icon
|
||||||
center
|
center
|
||||||
@close="closeTip"
|
@close="closeTip"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: 'PwdExpTips',
|
name: 'PwdExpTips',
|
||||||
components: {
|
components: {
|
||||||
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
tipClosed: false
|
tipClosed: false
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
pwdPeriodWarn() {
|
|
||||||
return this.$store.state.user.validityPeriod > 0 && this.$store.state.user.validityPeriod < 8
|
|
||||||
},
|
|
||||||
warnMsg() {
|
|
||||||
if (this.$store.state.user.validityPeriod > 0 && this.$store.state.user.validityPeriod < 8) {
|
|
||||||
return `密码将于${this.$store.state.user.validityPeriod}后过期，为了不影响正常使用，请及时进行修改！`
|
|
||||||
}
|
|
||||||
return null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
closeTip() {
|
|
||||||
this.tipClosed = true
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
pwdPeriodWarn() {
|
||||||
|
return this.$store.state.user.validityPeriod > 0 && this.$store.state.user.validityPeriod < 8
|
||||||
|
},
|
||||||
|
warnMsg() {
|
||||||
|
if (this.$store.state.user.validityPeriod > 0 && this.$store.state.user.validityPeriod < 8) {
|
||||||
|
return `密码将于${this.$store.state.user.validityPeriod}后过期，为了不影响正常使用，请及时进行修改！`
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
closeTip() {
|
||||||
|
this.tipClosed = true
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</script>
|
}
|
||||||
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.lic_tips {
|
.lic_tips {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -61,6 +61,5 @@
|
|||||||
top: 16px !important;
|
top: 16px !important;
|
||||||
right: 10px !important;
|
right: 10px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
@ -47,8 +47,8 @@
|
|||||||
>
|
>
|
||||||
<div class="download-export">
|
<div class="download-export">
|
||||||
<svg-icon
|
<svg-icon
|
||||||
@click="downloadClick"
|
|
||||||
icon-class="icon_download_outlined"
|
icon-class="icon_download_outlined"
|
||||||
|
@click="downloadClick"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
@ -124,9 +124,12 @@
|
|||||||
</el-dropdown>
|
</el-dropdown>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ExportExcel ref="ExportExcelRef"></ExportExcel>
|
<ExportExcel ref="ExportExcelRef" />
|
||||||
|
|
||||||
<ai-component v-if="aiBaseUrl" :base-url="aiBaseUrl"/>
|
<ai-component
|
||||||
|
v-if="aiBaseUrl"
|
||||||
|
:base-url="aiBaseUrl"
|
||||||
|
/>
|
||||||
|
|
||||||
<!--模板市场全屏显示框-->
|
<!--模板市场全屏显示框-->
|
||||||
<el-dialog
|
<el-dialog
|
||||||
|
|||||||
@ -7,7 +7,6 @@ const state = {
|
|||||||
hide: false
|
hide: false
|
||||||
},
|
},
|
||||||
device: 'desktop',
|
device: 'desktop',
|
||||||
|
|
||||||
size: Cookies.get('size') || 'small',
|
size: Cookies.get('size') || 'small',
|
||||||
arrowSide: false
|
arrowSide: false
|
||||||
}
|
}
|
||||||
@ -40,7 +39,7 @@ const mutations = {
|
|||||||
},
|
},
|
||||||
SET_ARROW_SIDE: (state, arrowSide) => {
|
SET_ARROW_SIDE: (state, arrowSide) => {
|
||||||
state.arrowSide = arrowSide
|
state.arrowSide = arrowSide
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const actions = {
|
const actions = {
|
||||||
|
|||||||
@ -11,7 +11,7 @@ export function timeSection(date, type, labelFormat = 'yyyy-MM-dd') {
|
|||||||
return null
|
return null
|
||||||
}
|
}
|
||||||
if (typeof date === 'string') {
|
if (typeof date === 'string') {
|
||||||
date = parseInt(date);
|
date = parseInt(date)
|
||||||
}
|
}
|
||||||
if (!(date instanceof Date)) {
|
if (!(date instanceof Date)) {
|
||||||
date = new Date(date)
|
date = new Date(date)
|
||||||
|
|||||||
@ -236,74 +236,74 @@
|
|||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<template v-if="this.curComponent.component === 'de-select' && !this.curComponent.options.attrs.multiple && this.curComponent.options.attrs.required">
|
<template v-if="curComponent.component === 'de-select' && !curComponent.options.attrs.multiple && curComponent.options.attrs.required">
|
||||||
<el-row
|
<el-row
|
||||||
style="height: 40px;overflow: hidden;"
|
style="height: 40px;overflow: hidden;"
|
||||||
>
|
>
|
||||||
<el-col
|
<el-col
|
||||||
:span="3"
|
:span="3"
|
||||||
style="padding-left: 10px;padding-top: 8px"
|
style="padding-left: 10px;padding-top: 8px"
|
||||||
>
|
>
|
||||||
{{ $t('deshowdate.open_mode') }}
|
{{ $t('deshowdate.open_mode') }}
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col
|
<el-col
|
||||||
:span="20"
|
:span="20"
|
||||||
style="padding-left: 10px;padding-top: 8px"
|
style="padding-left: 10px;padding-top: 8px"
|
||||||
>
|
>
|
||||||
<el-radio-group
|
<el-radio-group
|
||||||
v-model="curComponent.style.showMode"
|
v-model="curComponent.style.showMode"
|
||||||
size="mini"
|
size="mini"
|
||||||
>
|
>
|
||||||
<el-radio label="select">{{ $t('time.dropdown_display') }}</el-radio>
|
<el-radio label="select">{{ $t('time.dropdown_display') }}</el-radio>
|
||||||
<el-radio label="radio">{{ $t('time.tile_display') }}</el-radio>
|
<el-radio label="radio">{{ $t('time.tile_display') }}</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row
|
<el-row
|
||||||
v-if="curComponent.style.showMode === 'radio'"
|
v-if="curComponent.style.showMode === 'radio'"
|
||||||
style="height: 40px;overflow: hidden;"
|
style="height: 40px;overflow: hidden;"
|
||||||
>
|
>
|
||||||
<el-col
|
<el-col
|
||||||
:span="3"
|
:span="3"
|
||||||
style="padding-left: 10px;padding-top: 8px"
|
style="padding-left: 10px;padding-top: 8px"
|
||||||
>
|
>
|
||||||
{{ $t('time.display_format') }}
|
{{ $t('time.display_format') }}
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col
|
<el-col
|
||||||
:span="20"
|
:span="20"
|
||||||
style="padding-left: 10px;padding-top: 8px"
|
style="padding-left: 10px;padding-top: 8px"
|
||||||
>
|
>
|
||||||
<el-radio-group
|
<el-radio-group
|
||||||
v-model="curComponent.style.showStyle"
|
v-model="curComponent.style.showStyle"
|
||||||
size="mini"
|
size="mini"
|
||||||
>
|
>
|
||||||
<el-radio label="single">{{ $t('time.radio') }}</el-radio>
|
<el-radio label="single">{{ $t('time.radio') }}</el-radio>
|
||||||
<el-radio label="tab">{{ $t('time.tab_switching') }}</el-radio>
|
<el-radio label="tab">{{ $t('time.tab_switching') }}</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row
|
<el-row
|
||||||
v-if="curComponent.style.showMode === 'radio'"
|
v-if="curComponent.style.showMode === 'radio'"
|
||||||
style="height: 40px;overflow: hidden;"
|
style="height: 40px;overflow: hidden;"
|
||||||
>
|
>
|
||||||
<el-col
|
<el-col
|
||||||
:span="3"
|
:span="3"
|
||||||
style="padding-left: 10px;padding-top: 8px"
|
style="padding-left: 10px;padding-top: 8px"
|
||||||
>
|
>
|
||||||
{{$t('time.number_of_display_options')}}
|
{{ $t('time.number_of_display_options') }}
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col
|
<el-col
|
||||||
:span="8"
|
:span="8"
|
||||||
style="padding-left: 10px;padding-top: 8px"
|
style="padding-left: 10px;padding-top: 8px"
|
||||||
>
|
>
|
||||||
<el-input-number
|
<el-input-number
|
||||||
v-model="curComponent.style.showNum"
|
v-model="curComponent.style.showNum"
|
||||||
:min="1"
|
:min="1"
|
||||||
step-strictly
|
step-strictly
|
||||||
:max="10"
|
:max="10"
|
||||||
controls-position="right"
|
controls-position="right"
|
||||||
size="small"
|
size="small"
|
||||||
/>
|
/>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</template>
|
</template>
|
||||||
@ -400,10 +400,10 @@ export default {
|
|||||||
this.backgroundOrigin = deepCopy(this.curComponent.commonBackground ? this.curComponent.commonBackground : COMMON_BACKGROUND_NONE)
|
this.backgroundOrigin = deepCopy(this.curComponent.commonBackground ? this.curComponent.commonBackground : COMMON_BACKGROUND_NONE)
|
||||||
this.backgroundOrigin.style = deepCopy(this.curComponent.style || { brColor: '', innerBgColor: '', wordColor: '' })
|
this.backgroundOrigin.style = deepCopy(this.curComponent.style || { brColor: '', innerBgColor: '', wordColor: '' })
|
||||||
if (!this.backgroundOrigin.style.showStyle) {
|
if (!this.backgroundOrigin.style.showStyle) {
|
||||||
this.backgroundOrigin.style = {...this.backgroundOrigin.style, ...{ showStyle: 'single', showMode: 'select', showNum: 5 }}
|
this.backgroundOrigin.style = { ...this.backgroundOrigin.style, ...{ showStyle: 'single', showMode: 'select', showNum: 5 }}
|
||||||
}
|
}
|
||||||
if (!this.curComponent.style.showStyle) {
|
if (!this.curComponent.style.showStyle) {
|
||||||
this.curComponent.style = {...this.curComponent.style, ...{ showStyle: 'single', showMode: 'select', showNum: 5 }}
|
this.curComponent.style = { ...this.curComponent.style, ...{ showStyle: 'single', showMode: 'select', showNum: 5 }}
|
||||||
}
|
}
|
||||||
this.queryBackground()
|
this.queryBackground()
|
||||||
},
|
},
|
||||||
|
|||||||
@ -444,7 +444,7 @@ export function timeRangeBarOptionAntV(container, chart, action) {
|
|||||||
|
|
||||||
plot.off('interval:click')
|
plot.off('interval:click')
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
@ -535,7 +535,7 @@ export function baseBidirectionalBarOptionAntV(container, chart, action, isGroup
|
|||||||
const plot = new BidirectionalBar(container, options)
|
const plot = new BidirectionalBar(container, options)
|
||||||
|
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -438,7 +438,7 @@ export const configTopN = (data, chart) => {
|
|||||||
const initOtherItem = {
|
const initOtherItem = {
|
||||||
...cloneDeep(data[0]),
|
...cloneDeep(data[0]),
|
||||||
name: i18n.t('datasource.other'),
|
name: i18n.t('datasource.other'),
|
||||||
value: 0,
|
value: 0
|
||||||
}
|
}
|
||||||
otherItems.reduce((p, n) => {
|
otherItems.reduce((p, n) => {
|
||||||
p.value += n.value ?? 0
|
p.value += n.value ?? 0
|
||||||
|
|||||||
@ -1266,7 +1266,7 @@ export const configTopN = (data, chart) => {
|
|||||||
...data[0],
|
...data[0],
|
||||||
field: i18n.t('datasource.other'),
|
field: i18n.t('datasource.other'),
|
||||||
name: i18n.t('datasource.other'),
|
name: i18n.t('datasource.other'),
|
||||||
value: 0,
|
value: 0
|
||||||
}
|
}
|
||||||
otherItems.reduce((p, n) => {
|
otherItems.reduce((p, n) => {
|
||||||
p.value += n.value ?? 0
|
p.value += n.value ?? 0
|
||||||
@ -1351,12 +1351,12 @@ export function configPlotTrendLine(chart, plot) {
|
|||||||
offsetY: 10
|
offsetY: 10
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
regLine.axis(false);
|
regLine.axis(false)
|
||||||
regLine.data(totalData);
|
regLine.data(totalData)
|
||||||
regLine.line()
|
regLine.line()
|
||||||
.position('index*value')
|
.position('index*value')
|
||||||
.color('color', color => color)
|
.color('color', color => color)
|
||||||
.style('trendId',trendId => {
|
.style('trendId', trendId => {
|
||||||
const trend = trendLineMap[trendId]
|
const trend = trendLineMap[trendId]
|
||||||
return {
|
return {
|
||||||
stroke: trend?.color ?? 'grey',
|
stroke: trend?.color ?? 'grey',
|
||||||
@ -1425,7 +1425,7 @@ export function configAxisLabelLengthLimit(chart, plot) {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
const parentNode = e.event.target.parentNode
|
const parentNode = e.event.target.parentNode
|
||||||
let labelTooltipDom = parentNode.getElementsByClassName('g2-axis-label-tooltip')?.[0]
|
const labelTooltipDom = parentNode.getElementsByClassName('g2-axis-label-tooltip')?.[0]
|
||||||
if (labelTooltipDom) {
|
if (labelTooltipDom) {
|
||||||
labelTooltipDom.style.visibility = 'hidden'
|
labelTooltipDom.style.visibility = 'hidden'
|
||||||
}
|
}
|
||||||
|
|||||||
@ -264,7 +264,7 @@ export function getSize(chart) {
|
|||||||
size.colCfg.width = node => {
|
size.colCfg.width = node => {
|
||||||
const width = node.spreadsheet.container.cfg.el.offsetWidth
|
const width = node.spreadsheet.container.cfg.el.offsetWidth
|
||||||
if (!s.tableFieldWidth?.length) {
|
if (!s.tableFieldWidth?.length) {
|
||||||
let columnCount = s.showIndex ? chart.data.fields.length + 1 : chart.data.fields.length
|
const columnCount = s.showIndex ? chart.data.fields.length + 1 : chart.data.fields.length
|
||||||
return width / columnCount
|
return width / columnCount
|
||||||
}
|
}
|
||||||
const baseWidth = width / 100
|
const baseWidth = width / 100
|
||||||
|
|||||||
@ -26,7 +26,7 @@ export function baseFunnelOptionAntV(container, chart, action) {
|
|||||||
conversionTag = {
|
conversionTag = {
|
||||||
formatter: datum => {
|
formatter: datum => {
|
||||||
const rate = ((datum[Funnel.CONVERSATION_FIELD][1] / datum[Funnel.CONVERSATION_FIELD][0]) * 100).toFixed(2)
|
const rate = ((datum[Funnel.CONVERSATION_FIELD][1] / datum[Funnel.CONVERSATION_FIELD][0]) * 100).toFixed(2)
|
||||||
return `${labelAttr.conversionLabel ?? ''}${rate}%`;
|
return `${labelAttr.conversionLabel ?? ''}${rate}%`
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -68,7 +68,7 @@ export function baseFunnelOptionAntV(container, chart, action) {
|
|||||||
const plot = new Funnel(container, options)
|
const plot = new Funnel(container, options)
|
||||||
|
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -109,7 +109,7 @@ export function baseLineOptionAntV(container, chart, action) {
|
|||||||
plot.on('point:click', action)
|
plot.on('point:click', action)
|
||||||
// 趋势线
|
// 趋势线
|
||||||
configPlotTrendLine(chart, plot)
|
configPlotTrendLine(chart, plot)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
@ -215,7 +215,7 @@ export function baseAreaOptionAntV(container, chart, action, isStack) {
|
|||||||
const plot = new Area(container, options)
|
const plot = new Area(container, options)
|
||||||
|
|
||||||
plot.on('point:click', action)
|
plot.on('point:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -77,7 +77,7 @@ export async function baseFlowMapOption(chartId, chart) {
|
|||||||
return mapInstance
|
return mapInstance
|
||||||
}
|
}
|
||||||
|
|
||||||
const getMapKey = async () => {
|
const getMapKey = async() => {
|
||||||
const key = 'online-map-key'
|
const key = 'online-map-key'
|
||||||
if (!localStorage.getItem(key)) {
|
if (!localStorage.getItem(key)) {
|
||||||
await queryMapKey().then(res => localStorage.setItem(key, res.data))
|
await queryMapKey().then(res => localStorage.setItem(key, res.data))
|
||||||
|
|||||||
@ -102,7 +102,7 @@ export function baseMixOptionAntV(container, chart, action) {
|
|||||||
|
|
||||||
plot.on('point:click', action)
|
plot.on('point:click', action)
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -89,7 +89,7 @@ export function basePieOptionAntV(container, chart, action) {
|
|||||||
const plot = new Pie(container, options)
|
const plot = new Pie(container, options)
|
||||||
|
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
@ -162,7 +162,7 @@ export function basePieRoseOptionAntV(container, chart, action) {
|
|||||||
const plot = new Rose(container, options)
|
const plot = new Rose(container, options)
|
||||||
|
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -149,7 +149,7 @@ export function baseRadarOptionAntV(container, chart, action) {
|
|||||||
|
|
||||||
plot.off('point:click')
|
plot.off('point:click')
|
||||||
plot.on('point:click', action)
|
plot.on('point:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -8,8 +8,6 @@ import {
|
|||||||
getPadding,
|
getPadding,
|
||||||
getSlider,
|
getSlider,
|
||||||
getAnalyse,
|
getAnalyse,
|
||||||
getTooltipContainer,
|
|
||||||
TOOLTIP_TPL,
|
|
||||||
configPlotTooltipEvent
|
configPlotTooltipEvent
|
||||||
} from '@/views/chart/chart/common/common_antv'
|
} from '@/views/chart/chart/common/common_antv'
|
||||||
|
|
||||||
@ -91,7 +89,7 @@ export function baseScatterOptionAntV(container, chart, action) {
|
|||||||
|
|
||||||
plot.off('point:click')
|
plot.off('point:click')
|
||||||
plot.on('point:click', action)
|
plot.on('point:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -368,10 +368,6 @@ export function baseTableNormal(container, chart, action, tableData, vueCom, res
|
|||||||
}
|
}
|
||||||
|
|
||||||
const customAttr = JSON.parse(chart.customAttr)
|
const customAttr = JSON.parse(chart.customAttr)
|
||||||
const sortIconMap = {
|
|
||||||
'asc': 'SortUp',
|
|
||||||
'desc': 'SortDown'
|
|
||||||
}
|
|
||||||
// options
|
// options
|
||||||
const s2Options = {
|
const s2Options = {
|
||||||
width: containerDom.offsetWidth,
|
width: containerDom.offsetWidth,
|
||||||
@ -645,7 +641,7 @@ export function baseTablePivot(container, chart, action, headerAction, tableData
|
|||||||
position: 'absolute',
|
position: 'absolute',
|
||||||
padding: '4px 2px'
|
padding: '4px 2px'
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 开始渲染
|
// 开始渲染
|
||||||
@ -1106,7 +1102,7 @@ function getTooltipPosition(event) {
|
|||||||
if (!s2Instance) {
|
if (!s2Instance) {
|
||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
const { height, width} = s2Instance.getCanvasElement().getBoundingClientRect()
|
const { height, width } = s2Instance.getCanvasElement().getBoundingClientRect()
|
||||||
const { offsetHeight, offsetWidth } = s2Instance.tooltip.getContainer()
|
const { offsetHeight, offsetWidth } = s2Instance.tooltip.getContainer()
|
||||||
if (offsetWidth > width) {
|
if (offsetWidth > width) {
|
||||||
result.x = 0
|
result.x = 0
|
||||||
@ -1148,7 +1144,7 @@ function copyContent(s2Instance, event, fieldMeta) {
|
|||||||
const fieldMap = fieldMeta?.reduce((p, n) => {
|
const fieldMap = fieldMeta?.reduce((p, n) => {
|
||||||
p[n.field] = n.name
|
p[n.field] = n.name
|
||||||
return p
|
return p
|
||||||
},{})
|
}, {})
|
||||||
if (fieldMap?.[content]) {
|
if (fieldMap?.[content]) {
|
||||||
content = fieldMap[content]
|
content = fieldMap[content]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -53,7 +53,7 @@ export function baseTreemapOptionAntV(container, chart, action) {
|
|||||||
const plot = new Treemap(container, options)
|
const plot = new Treemap(container, options)
|
||||||
|
|
||||||
plot.on('polygon:click', action)
|
plot.on('polygon:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -3953,9 +3953,9 @@ export function adjustPosition(targetDom, parentDom, clickPosition, offset, init
|
|||||||
x: offsetX ? x + offsetX : x,
|
x: offsetX ? x + offsetX : x,
|
||||||
y: offsetY ? y + offsetY : y
|
y: offsetY ? y + offsetY : y
|
||||||
}
|
}
|
||||||
const width = targetWidth ? targetWidth : initSize.width
|
const width = targetWidth || initSize.width
|
||||||
const height = targetHeight ? targetHeight : initSize.height
|
const height = targetHeight || initSize.height
|
||||||
if ( result.x + width > parentWidth ) {
|
if (result.x + width > parentWidth) {
|
||||||
result.x = parentWidth - width
|
result.x = parentWidth - width
|
||||||
}
|
}
|
||||||
if (result.y + height > parentHeight) {
|
if (result.y + height > parentHeight) {
|
||||||
|
|||||||
@ -104,7 +104,7 @@ export function baseWaterfallOptionAntV(container, chart, action) {
|
|||||||
const plot = new Waterfall(container, options)
|
const plot = new Waterfall(container, options)
|
||||||
|
|
||||||
plot.on('interval:click', action)
|
plot.on('interval:click', action)
|
||||||
// 处理 tooltip 被其他视图遮挡
|
// 处理 tooltip 被其他视图遮挡
|
||||||
configPlotTooltipEvent(chart, plot)
|
configPlotTooltipEvent(chart, plot)
|
||||||
return plot
|
return plot
|
||||||
}
|
}
|
||||||
|
|||||||
@ -270,14 +270,14 @@
|
|||||||
:label="$t('chart.axis_label_length_limit')"
|
:label="$t('chart.axis_label_length_limit')"
|
||||||
class="form-item"
|
class="form-item"
|
||||||
>
|
>
|
||||||
<el-input-number
|
<el-input-number
|
||||||
v-model="axisForm.axisLabel.lengthLimit"
|
v-model="axisForm.axisLabel.lengthLimit"
|
||||||
:precision="0"
|
:precision="0"
|
||||||
:min="1"
|
:min="1"
|
||||||
:max="50"
|
:max="50"
|
||||||
size="mini"
|
size="mini"
|
||||||
@change="changeYAxisStyle('axisLabel')"
|
@change="changeYAxisStyle('axisLabel')"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
:label="$t('chart.axis_label_rotate')"
|
:label="$t('chart.axis_label_rotate')"
|
||||||
|
|||||||
@ -385,8 +385,8 @@
|
|||||||
<el-tooltip
|
<el-tooltip
|
||||||
v-if="item.enumValues && item.enumValues.length"
|
v-if="item.enumValues && item.enumValues.length"
|
||||||
>
|
>
|
||||||
<i class="el-icon-info"></i>
|
<i class="el-icon-info" />
|
||||||
<template v-slot:content>
|
<template #content>
|
||||||
<div style="max-width: 200px">
|
<div style="max-width: 200px">
|
||||||
{{ item.enumValues.join(',') }}
|
{{ item.enumValues.join(',') }}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -24,7 +24,7 @@
|
|||||||
<el-col
|
<el-col
|
||||||
:span="8"
|
:span="8"
|
||||||
>
|
>
|
||||||
{{ $t(`chart.regression_${item.algoType}`)}}
|
{{ $t(`chart.regression_${item.algoType}`) }}
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|||||||
@ -331,7 +331,7 @@
|
|||||||
<el-col
|
<el-col
|
||||||
v-if="item.field === '2'"
|
v-if="item.field === '2'"
|
||||||
:span="12"
|
:span="12"
|
||||||
>
|
>
|
||||||
<el-select
|
<el-select
|
||||||
v-if="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
|
v-if="!item.term.includes('null') && !item.term.includes('empty') && item.term !== 'between'"
|
||||||
v-model="item.enumValues"
|
v-model="item.enumValues"
|
||||||
@ -397,6 +397,7 @@ import { parseJson } from '@/views/chart/chart/util'
|
|||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'TableThresholdEdit',
|
name: 'TableThresholdEdit',
|
||||||
|
inject: ['filedList'],
|
||||||
props: {
|
props: {
|
||||||
threshold: {
|
threshold: {
|
||||||
type: Array,
|
type: Array,
|
||||||
@ -407,7 +408,6 @@ export default {
|
|||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
inject: ['filedList'],
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
thresholdArr: [],
|
thresholdArr: [],
|
||||||
@ -630,7 +630,7 @@ export default {
|
|||||||
const yAxis = parseJson(this.chart.yaxis)
|
const yAxis = parseJson(this.chart.yaxis)
|
||||||
const xAxis = parseJson(this.chart.xaxis)
|
const xAxis = parseJson(this.chart.xaxis)
|
||||||
const xAxisExt = parseJson(this.chart.xaxisExt)
|
const xAxisExt = parseJson(this.chart.xaxisExt)
|
||||||
this.fields.splice(0, this.fields.length, ...yAxis, ...xAxis, ...xAxisExt)
|
this.fields.splice(0, this.fields.length, ...yAxis, ...xAxis, ...xAxisExt)
|
||||||
} else {
|
} else {
|
||||||
const yAxis = parseJson(this.chart.yaxis)
|
const yAxis = parseJson(this.chart.yaxis)
|
||||||
const xAxis = parseJson(this.chart.xaxis)
|
const xAxis = parseJson(this.chart.xaxis)
|
||||||
|
|||||||
@ -172,7 +172,7 @@ export default {
|
|||||||
{ label: this.$t('chart.regression_log'), value: 'log' },
|
{ label: this.$t('chart.regression_log'), value: 'log' },
|
||||||
{ label: this.$t('chart.regression_quad'), value: 'quad' },
|
{ label: this.$t('chart.regression_quad'), value: 'quad' },
|
||||||
{ label: this.$t('chart.regression_pow'), value: 'pow' },
|
{ label: this.$t('chart.regression_pow'), value: 'pow' },
|
||||||
{ label: this.$t('chart.regression_loess'), value: 'loess' },
|
{ label: this.$t('chart.regression_loess'), value: 'loess' }
|
||||||
],
|
],
|
||||||
lineOptions: [
|
lineOptions: [
|
||||||
{ label: this.$t('chart.line_type_solid'), value: 'solid' },
|
{ label: this.$t('chart.line_type_solid'), value: 'solid' },
|
||||||
|
|||||||
@ -349,7 +349,7 @@
|
|||||||
:min="1"
|
:min="1"
|
||||||
:step-strictly="true"
|
:step-strictly="true"
|
||||||
@change="changeColorCase('topN')"
|
@change="changeColorCase('topN')"
|
||||||
/>
|
/>
|
||||||
<span>{{ $t('chart.top_n_input_2') }}</span>
|
<span>{{ $t('chart.top_n_input_2') }}</span>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
|
|||||||
@ -15,7 +15,7 @@
|
|||||||
<el-checkbox
|
<el-checkbox
|
||||||
v-model="labelForm.show"
|
v-model="labelForm.show"
|
||||||
@change="changeLabelAttr('show')"
|
@change="changeLabelAttr('show')"
|
||||||
></el-checkbox>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<div v-show="labelForm.show">
|
<div v-show="labelForm.show">
|
||||||
<el-form-item
|
<el-form-item
|
||||||
@ -148,7 +148,7 @@
|
|||||||
<el-checkbox
|
<el-checkbox
|
||||||
v-model="labelForm.showConversion"
|
v-model="labelForm.showConversion"
|
||||||
@change="changeLabelAttr('showConversion')"
|
@change="changeLabelAttr('showConversion')"
|
||||||
></el-checkbox>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
v-show="labelForm.showConversion && showProperty('conversionLabel')"
|
v-show="labelForm.showConversion && showProperty('conversionLabel')"
|
||||||
@ -159,7 +159,7 @@
|
|||||||
v-model="labelForm.conversionLabel"
|
v-model="labelForm.conversionLabel"
|
||||||
:maxlength="20"
|
:maxlength="20"
|
||||||
@change="changeLabelAttr('conversionLabel')"
|
@change="changeLabelAttr('conversionLabel')"
|
||||||
></el-input>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
|
|||||||
@ -266,7 +266,10 @@
|
|||||||
<el-radio label="custom">
|
<el-radio label="custom">
|
||||||
<span>{{ $t('chart.table_column_fixed') }}</span>
|
<span>{{ $t('chart.table_column_fixed') }}</span>
|
||||||
</el-radio>
|
</el-radio>
|
||||||
<el-radio v-if="equalsAny(chart.type, 'table-info', 'table-normal')" label="field">
|
<el-radio
|
||||||
|
v-if="equalsAny(chart.type, 'table-info', 'table-normal')"
|
||||||
|
label="field"
|
||||||
|
>
|
||||||
<span>{{ $t('chart.table_column_custom') }}</span>
|
<span>{{ $t('chart.table_column_custom') }}</span>
|
||||||
</el-radio>
|
</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
@ -324,7 +327,10 @@
|
|||||||
/>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" :offset="2">
|
<el-col
|
||||||
|
:span="12"
|
||||||
|
:offset="2"
|
||||||
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model.number="fieldColumnWidth.width"
|
v-model.number="fieldColumnWidth.width"
|
||||||
type="number"
|
type="number"
|
||||||
@ -1885,7 +1891,7 @@ export default {
|
|||||||
const fieldMap = this.sizeForm.tableFieldWidth.reduce((p, n) => {
|
const fieldMap = this.sizeForm.tableFieldWidth.reduce((p, n) => {
|
||||||
p[n.fieldId] = n
|
p[n.fieldId] = n
|
||||||
return p
|
return p
|
||||||
},{})
|
}, {})
|
||||||
this.sizeForm.tableFieldWidth.splice(0)
|
this.sizeForm.tableFieldWidth.splice(0)
|
||||||
allAxis.forEach(item => {
|
allAxis.forEach(item => {
|
||||||
let width = 10
|
let width = 10
|
||||||
|
|||||||
@ -1,46 +1,46 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog
|
<el-dialog
|
||||||
width="896px"
|
width="896px"
|
||||||
append-to-body
|
append-to-body
|
||||||
title="添加过滤"
|
title="添加过滤"
|
||||||
destroy-on-close
|
destroy-on-close
|
||||||
class="de-dialog-form filter-tree-cont"
|
class="de-dialog-form filter-tree-cont"
|
||||||
:visible.sync="dialogVisible"
|
:visible.sync="dialogVisible"
|
||||||
>
|
>
|
||||||
<div class="tree-cont">
|
<div class="tree-cont">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<rowAuth ref="rowAuth" />
|
<rowAuth ref="rowAuth" />
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
slot="footer"
|
|
||||||
class="dialog-footer"
|
|
||||||
>
|
|
||||||
<de-btn
|
|
||||||
secondary
|
|
||||||
@click="closeFilter"
|
|
||||||
>{{ $t('chart.cancel') }}
|
|
||||||
</de-btn>
|
|
||||||
<de-btn
|
|
||||||
type="primary"
|
|
||||||
@click="changeFilter"
|
|
||||||
>{{ $t('chart.confirm') }}
|
|
||||||
</de-btn>
|
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</div>
|
||||||
|
<div
|
||||||
|
slot="footer"
|
||||||
|
class="dialog-footer"
|
||||||
|
>
|
||||||
|
<de-btn
|
||||||
|
secondary
|
||||||
|
@click="closeFilter"
|
||||||
|
>{{ $t('chart.cancel') }}
|
||||||
|
</de-btn>
|
||||||
|
<de-btn
|
||||||
|
type="primary"
|
||||||
|
@click="changeFilter"
|
||||||
|
>{{ $t('chart.confirm') }}
|
||||||
|
</de-btn>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import rowAuth from '@/views/dataset/data/components/rowAuth.vue'
|
import rowAuth from '@/views/dataset/data/components/rowAuth.vue'
|
||||||
export default {
|
export default {
|
||||||
name: 'FilterTree',
|
name: 'FilterTree',
|
||||||
inject: ['filedList'],
|
|
||||||
components: {
|
components: {
|
||||||
rowAuth
|
rowAuth
|
||||||
},
|
},
|
||||||
data() {
|
inject: ['filedList'],
|
||||||
return {
|
data() {
|
||||||
dialogVisible: false,
|
return {
|
||||||
}
|
dialogVisible: false
|
||||||
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
computedFiledList() {
|
computedFiledList() {
|
||||||
@ -48,58 +48,58 @@ export default {
|
|||||||
if (next.id !== 'count') {
|
if (next.id !== 'count') {
|
||||||
pre[next.id] = next
|
pre[next.id] = next
|
||||||
}
|
}
|
||||||
return pre
|
return pre
|
||||||
}, {})
|
}, {})
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
closeFilter() {
|
|
||||||
this.dialogVisible = false
|
|
||||||
},
|
|
||||||
changeFilter() {
|
|
||||||
const { logic, items, errorMessage } = this.$refs.rowAuth.submit()
|
|
||||||
if (errorMessage) {
|
|
||||||
this.$message({
|
|
||||||
message: errorMessage,
|
|
||||||
type: 'error',
|
|
||||||
showClose: true
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
this.dfsTreeDelete(items)
|
|
||||||
this.$emit('filter-data', { logic, items })
|
|
||||||
this.dialogVisible = false
|
|
||||||
},
|
|
||||||
dfsTreeDelete(arr) {
|
|
||||||
arr.forEach((ele) => {
|
|
||||||
if (ele?.subTree?.items?.length) {
|
|
||||||
this.dfsTreeDelete(ele.subTree.items)
|
|
||||||
} else {
|
|
||||||
if (ele.field) {
|
|
||||||
this.$delete(ele, 'field')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
dfsTree(arr) {
|
|
||||||
arr.forEach((ele) => {
|
|
||||||
if (ele?.subTree?.items?.length) {
|
|
||||||
this.dfsTree(ele.subTree.items)
|
|
||||||
} else {
|
|
||||||
if (this.computedFiledList[ele.fieldId]) {
|
|
||||||
ele.field = this.computedFiledList[ele.fieldId]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
init(tree) {
|
|
||||||
this.dialogVisible = true
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.dfsTree(tree.items || [])
|
|
||||||
this.$refs.rowAuth.init(tree || {})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
closeFilter() {
|
||||||
|
this.dialogVisible = false
|
||||||
|
},
|
||||||
|
changeFilter() {
|
||||||
|
const { logic, items, errorMessage } = this.$refs.rowAuth.submit()
|
||||||
|
if (errorMessage) {
|
||||||
|
this.$message({
|
||||||
|
message: errorMessage,
|
||||||
|
type: 'error',
|
||||||
|
showClose: true
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.dfsTreeDelete(items)
|
||||||
|
this.$emit('filter-data', { logic, items })
|
||||||
|
this.dialogVisible = false
|
||||||
|
},
|
||||||
|
dfsTreeDelete(arr) {
|
||||||
|
arr.forEach((ele) => {
|
||||||
|
if (ele?.subTree?.items?.length) {
|
||||||
|
this.dfsTreeDelete(ele.subTree.items)
|
||||||
|
} else {
|
||||||
|
if (ele.field) {
|
||||||
|
this.$delete(ele, 'field')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
dfsTree(arr) {
|
||||||
|
arr.forEach((ele) => {
|
||||||
|
if (ele?.subTree?.items?.length) {
|
||||||
|
this.dfsTree(ele.subTree.items)
|
||||||
|
} else {
|
||||||
|
if (this.computedFiledList[ele.fieldId]) {
|
||||||
|
ele.field = this.computedFiledList[ele.fieldId]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
init(tree) {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.dfsTree(tree.items || [])
|
||||||
|
this.$refs.rowAuth.init(tree || {})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -119,4 +119,4 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -7,7 +7,7 @@
|
|||||||
trigger="hover"
|
trigger="hover"
|
||||||
width="300"
|
width="300"
|
||||||
:append-to-body="!previewVisible"
|
:append-to-body="!previewVisible"
|
||||||
:popper-class="previewVisible && 'remark-pop'"
|
:popper-class="previewVisible ? 'remark-pop' : ''"
|
||||||
:visible-arrow="false"
|
:visible-arrow="false"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@ -155,7 +155,6 @@
|
|||||||
>
|
>
|
||||||
<template
|
<template
|
||||||
slot="header"
|
slot="header"
|
||||||
slot-scope="scope"
|
|
||||||
>
|
>
|
||||||
{{ c.label }}
|
{{ c.label }}
|
||||||
<span v-if="c.rangeIndex === 0">({{ $t('data_fill.data.start') }})</span>
|
<span v-if="c.rangeIndex === 0">({{ $t('data_fill.data.start') }})</span>
|
||||||
|
|||||||
@ -443,7 +443,7 @@ export default {
|
|||||||
>
|
>
|
||||||
<transition-group>
|
<transition-group>
|
||||||
<div
|
<div
|
||||||
v-for="(item, $index) in componentList1"
|
v-for="(item) in componentList1"
|
||||||
:key="item.type"
|
:key="item.type"
|
||||||
class="m-item base-component-item"
|
class="m-item base-component-item"
|
||||||
@click="addComponentItem(item)"
|
@click="addComponentItem(item)"
|
||||||
@ -468,7 +468,7 @@ export default {
|
|||||||
>
|
>
|
||||||
<transition-group>
|
<transition-group>
|
||||||
<div
|
<div
|
||||||
v-for="(item, $index) in componentList2"
|
v-for="(item) in componentList2"
|
||||||
:key="item.type"
|
:key="item.type"
|
||||||
class="m-item base-component-item"
|
class="m-item base-component-item"
|
||||||
@click="addComponentItem(item)"
|
@click="addComponentItem(item)"
|
||||||
|
|||||||
@ -467,7 +467,6 @@ export default {
|
|||||||
<el-table-column>
|
<el-table-column>
|
||||||
<template
|
<template
|
||||||
slot="header"
|
slot="header"
|
||||||
slot-scope="scope"
|
|
||||||
>
|
>
|
||||||
{{ $t('data_fill.form.column_name') }}
|
{{ $t('data_fill.form.column_name') }}
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@ -424,10 +424,10 @@ export default {
|
|||||||
|
|
||||||
for (let i = 0; i < this.checkTableList.length; i++) {
|
for (let i = 0; i < this.checkTableList.length; i++) {
|
||||||
const table = this.tables.find(
|
const table = this.tables.find(
|
||||||
(ele) => ele.name === this.checkTableList[i]
|
(ele) => ele.name === this.checkTableList[i]
|
||||||
)
|
)
|
||||||
if(table.setKey && table.keys.length === 0 ){
|
if (table.setKey && table.keys.length === 0) {
|
||||||
this.openMessageSuccess(this.checkTableList[i] + this.$t('dataset.no_set_key') , 'error')
|
this.openMessageSuccess(this.checkTableList[i] + this.$t('dataset.no_set_key'), 'error')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
tables.push({
|
tables.push({
|
||||||
@ -437,7 +437,7 @@ export default {
|
|||||||
type: 'api',
|
type: 'api',
|
||||||
syncType: syncType,
|
syncType: syncType,
|
||||||
mode: parseInt(mode),
|
mode: parseInt(mode),
|
||||||
info: JSON.stringify({ table: this.checkTableList[i], setKey: table.setKey, keys: table.keys})
|
info: JSON.stringify({ table: this.checkTableList[i], setKey: table.setKey, keys: table.keys })
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
post('/dataset/table/batchAdd', tables)
|
post('/dataset/table/batchAdd', tables)
|
||||||
|
|||||||
@ -167,22 +167,25 @@
|
|||||||
{{ $t('deDataset.already_exists') }}
|
{{ $t('deDataset.already_exists') }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<el-checkbox v-if="mode === '1'" v-model="activeTable.setKey">{{ $t('dataset.set_key') }}</el-checkbox>
|
<el-checkbox
|
||||||
|
v-if="mode === '1'"
|
||||||
|
v-model="activeTable.setKey"
|
||||||
|
>{{ $t('dataset.set_key') }}</el-checkbox>
|
||||||
|
|
||||||
<el-select
|
<el-select
|
||||||
size="small"
|
v-if="mode === '1'"
|
||||||
v-model="activeTable.keys"
|
v-model="activeTable.keys"
|
||||||
v-if="mode === '1'"
|
size="small"
|
||||||
multiple
|
multiple
|
||||||
filterable
|
filterable
|
||||||
:disabled="!activeTable.setKey"
|
:disabled="!activeTable.setKey"
|
||||||
:placeholder="$t('dataset.selecet_key')"
|
:placeholder="$t('dataset.selecet_key')"
|
||||||
>
|
>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="field in fields"
|
v-for="field in fields"
|
||||||
:key="field.fieldName"
|
:key="field.fieldName"
|
||||||
:label="field.fieldName"
|
:label="field.fieldName"
|
||||||
:value="field.fieldName"
|
:value="field.fieldName"
|
||||||
/>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
|
|
||||||
@ -467,10 +470,10 @@ export default {
|
|||||||
const syncType = this.syncType
|
const syncType = this.syncType
|
||||||
for (let i = 0; i < this.checkTableList.length; i++) {
|
for (let i = 0; i < this.checkTableList.length; i++) {
|
||||||
const table = this.tables.find(
|
const table = this.tables.find(
|
||||||
(ele) => ele.name === this.checkTableList[i]
|
(ele) => ele.name === this.checkTableList[i]
|
||||||
)
|
)
|
||||||
if(table.setKey && table.keys.length === 0 ){
|
if (table.setKey && table.keys.length === 0) {
|
||||||
this.openMessageSuccess(this.checkTableList[i] + this.$t('dataset.no_set_key') , 'error')
|
this.openMessageSuccess(this.checkTableList[i] + this.$t('dataset.no_set_key'), 'error')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
tables.push({
|
tables.push({
|
||||||
@ -480,7 +483,7 @@ export default {
|
|||||||
type: 'db',
|
type: 'db',
|
||||||
syncType: syncType,
|
syncType: syncType,
|
||||||
mode: parseInt(mode),
|
mode: parseInt(mode),
|
||||||
info: JSON.stringify({ table: this.checkTableList[i], setKey: table.setKey, keys: table.keys})
|
info: JSON.stringify({ table: this.checkTableList[i], setKey: table.setKey, keys: table.keys })
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -61,23 +61,27 @@
|
|||||||
value="sync_latter"
|
value="sync_latter"
|
||||||
/>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
<el-checkbox style="margin-left: 12px" v-if="mode === '1' && engineMode !== 'simple'" v-model="param.setKey">{{ $t('dataset.set_key') }}</el-checkbox>
|
<el-checkbox
|
||||||
|
v-if="mode === '1' && engineMode !== 'simple'"
|
||||||
|
v-model="param.setKey"
|
||||||
|
style="margin-left: 12px"
|
||||||
|
>{{ $t('dataset.set_key') }}</el-checkbox>
|
||||||
|
|
||||||
<el-select
|
<el-select
|
||||||
size="small"
|
v-if="mode === '1' && engineMode !== 'simple'"
|
||||||
style="margin-left: 12px;width: 315px"
|
v-model="param.keys"
|
||||||
v-model="param.keys"
|
size="small"
|
||||||
v-if="mode === '1' && engineMode !== 'simple'"
|
style="margin-left: 12px;width: 315px"
|
||||||
multiple
|
multiple
|
||||||
filterable
|
filterable
|
||||||
:disabled="!param.setKey"
|
:disabled="!param.setKey"
|
||||||
:placeholder="$t('dataset.selecet_key')"
|
:placeholder="$t('dataset.selecet_key')"
|
||||||
>
|
>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="field in fields"
|
v-for="field in fields"
|
||||||
:key="field.fieldName"
|
:key="field.fieldName"
|
||||||
:label="field.fieldName"
|
:label="field.fieldName"
|
||||||
:value="field.fieldName"
|
:value="field.fieldName"
|
||||||
/>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
|
|
||||||
@ -966,7 +970,7 @@ export default {
|
|||||||
table.info.replace(/\n/g, '\\n').replace(/\r/g, '\\r')
|
table.info.replace(/\n/g, '\\n').replace(/\r/g, '\\r')
|
||||||
).sql
|
).sql
|
||||||
}
|
}
|
||||||
if (JSON.parse(table.info).hasOwnProperty("setKey")) {
|
if (JSON.parse(table.info).hasOwn('setKey')) {
|
||||||
this.$set(this.param, 'setKey', JSON.parse(table.info).setKey)
|
this.$set(this.param, 'setKey', JSON.parse(table.info).setKey)
|
||||||
this.param.keys = JSON.parse(table.info).keys
|
this.param.keys = JSON.parse(table.info).keys
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,6 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<de-container style="height: auto">
|
<de-container style="height: auto">
|
||||||
<de-aside-container close style="height: auto">
|
<de-aside-container
|
||||||
|
close
|
||||||
|
style="height: auto"
|
||||||
|
>
|
||||||
<el-button
|
<el-button
|
||||||
v-show="!showTargetSearchInput"
|
v-show="!showTargetSearchInput"
|
||||||
class="de-icon"
|
class="de-icon"
|
||||||
|
|||||||
@ -150,7 +150,7 @@
|
|||||||
:options="getFields(scope.row)"
|
:options="getFields(scope.row)"
|
||||||
@change="saveEdit(scope.row)"
|
@change="saveEdit(scope.row)"
|
||||||
>
|
>
|
||||||
<template slot-scope="{ node, data }">
|
<template slot-scope="{ data }">
|
||||||
<span>
|
<span>
|
||||||
<svg-icon
|
<svg-icon
|
||||||
v-if="data.value === 0"
|
v-if="data.value === 0"
|
||||||
@ -221,18 +221,22 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
property="key"
|
v-if="table.mode === 1 && (table.type === 'db' || table.type === 'sql')"
|
||||||
:label="$t('dataset.change_to_key')"
|
property="key"
|
||||||
v-if="table.mode === 1 && (table.type === 'db' || table.type === 'sql')"
|
:label="$t('dataset.change_to_key')"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-select v-model="scope.row.key" @change="saveKey(scope.row)" :disabled="scope.row.extField !== 0">
|
<el-select
|
||||||
|
v-model="scope.row.key"
|
||||||
|
:disabled="scope.row.extField !== 0"
|
||||||
|
@change="saveKey(scope.row)"
|
||||||
|
>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in getKeyFields(scope.row)"
|
v-for="item in getKeyFields(scope.row)"
|
||||||
:key="item.value"
|
:key="item.value"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:value="item.value">
|
:value="item.value"
|
||||||
</el-option>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@ -500,7 +504,7 @@
|
|||||||
:options="getFields(scope.row)"
|
:options="getFields(scope.row)"
|
||||||
@change="saveEdit(scope.row)"
|
@change="saveEdit(scope.row)"
|
||||||
>
|
>
|
||||||
<template slot-scope="{ node, data }">
|
<template slot-scope="{ data }">
|
||||||
<span>
|
<span>
|
||||||
<svg-icon
|
<svg-icon
|
||||||
v-if="data.value === 0"
|
v-if="data.value === 0"
|
||||||
@ -571,18 +575,22 @@
|
|||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
property="key"
|
v-if="table.mode === 1 && (table.type === 'db' || table.type === 'sql')"
|
||||||
:label="$t('dataset.change_to_key')"
|
property="key"
|
||||||
v-if="table.mode === 1 && (table.type === 'db' || table.type === 'sql')"
|
:label="$t('dataset.change_to_key')"
|
||||||
>
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-select v-model="scope.row.key" @change="saveKey(scope.row)" :disabled="scope.row.extField !== 0">
|
<el-select
|
||||||
|
v-model="scope.row.key"
|
||||||
|
:disabled="scope.row.extField !== 0"
|
||||||
|
@change="saveKey(scope.row)"
|
||||||
|
>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in getKeyFields(scope.row)"
|
v-for="item in getKeyFields(scope.row)"
|
||||||
:key="item.value"
|
:key="item.value"
|
||||||
:label="item.label"
|
:label="item.label"
|
||||||
:value="item.value">
|
:value="item.value"
|
||||||
</el-option>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
@ -768,7 +776,7 @@ import { batchEdit, dateformats, fieldListDQ, post } from '@/api/dataset/dataset
|
|||||||
import CalcFieldEdit from './CalcFieldEdit'
|
import CalcFieldEdit from './CalcFieldEdit'
|
||||||
import { getFieldName } from '@/views/dataset/data/utils'
|
import { getFieldName } from '@/views/dataset/data/utils'
|
||||||
import msgCfm from '@/components/msgCfm/index'
|
import msgCfm from '@/components/msgCfm/index'
|
||||||
import {engineMode} from "@/api/system/engine";
|
import { engineMode } from '@/api/system/engine'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'FieldEdit',
|
name: 'FieldEdit',
|
||||||
@ -804,7 +812,7 @@ export default {
|
|||||||
dimensionIndeterminate: false,
|
dimensionIndeterminate: false,
|
||||||
quotaChecked: false,
|
quotaChecked: false,
|
||||||
quotaIndeterminate: false,
|
quotaIndeterminate: false,
|
||||||
engineMode: 'local',
|
engineMode: 'local'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
@ -886,16 +894,16 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
saveKey(item ) {
|
saveKey(item) {
|
||||||
post('/dataset/field/saveKey', item)
|
post('/dataset/field/saveKey', item)
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.initField()
|
this.initField()
|
||||||
localStorage.setItem('reloadDsData', 'true')
|
localStorage.setItem('reloadDsData', 'true')
|
||||||
})
|
})
|
||||||
.catch((res) => {
|
.catch((res) => {
|
||||||
this.initField()
|
this.initField()
|
||||||
localStorage.setItem('reloadDsData', 'true')
|
localStorage.setItem('reloadDsData', 'true')
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
saveEdit(item, checkExp = true) {
|
saveEdit(item, checkExp = true) {
|
||||||
|
|||||||
@ -259,7 +259,7 @@ import { pluginLoaded } from '@/api/user'
|
|||||||
import PluginCom from '@/views/system/plugin/PluginCom'
|
import PluginCom from '@/views/system/plugin/PluginCom'
|
||||||
import UpdateRecords from './UpdateRecords'
|
import UpdateRecords from './UpdateRecords'
|
||||||
import rowAuth from './components/rowAuth.vue'
|
import rowAuth from './components/rowAuth.vue'
|
||||||
import {Button} from "element-ui";
|
import { Button } from 'element-ui'
|
||||||
import bus from '@/utils/bus'
|
import bus from '@/utils/bus'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@ -426,7 +426,7 @@ export default {
|
|||||||
show: 0
|
show: 0
|
||||||
}
|
}
|
||||||
this.previewDataSuccess = false
|
this.previewDataSuccess = false
|
||||||
if(this.$currentHttpRequestList.some((item, key) => {
|
if (this.$currentHttpRequestList.some((item, key) => {
|
||||||
return key.indexOf('dataset/table/getPreviewData') > -1
|
return key.indexOf('dataset/table/getPreviewData') > -1
|
||||||
})) return
|
})) return
|
||||||
this.tableLoading = false
|
this.tableLoading = false
|
||||||
@ -492,34 +492,34 @@ export default {
|
|||||||
this.showExport = false
|
this.showExport = false
|
||||||
},
|
},
|
||||||
openMessageLoading(cb) {
|
openMessageLoading(cb) {
|
||||||
const h = this.$createElement;
|
const h = this.$createElement
|
||||||
const iconClass = `el-icon-loading`;
|
const iconClass = `el-icon-loading`
|
||||||
const customClass = `de-message-loading de-message-export`;
|
const customClass = `de-message-loading de-message-export`
|
||||||
this.$message({
|
this.$message({
|
||||||
message: h("p", null, [
|
message: h('p', null, [
|
||||||
this.$t('data_export.exporting'),
|
this.$t('data_export.exporting'),
|
||||||
h(
|
h(
|
||||||
Button,
|
Button,
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
type: "text",
|
type: 'text',
|
||||||
size: "mini",
|
size: 'mini'
|
||||||
},
|
},
|
||||||
class: "btn-text",
|
class: 'btn-text',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
cb();
|
cb()
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
this.$t('data_export.export_center'),
|
this.$t('data_export.export_center')
|
||||||
),
|
),
|
||||||
this.$t('data_export.export_info'),
|
this.$t('data_export.export_info')
|
||||||
]),
|
]),
|
||||||
iconClass,
|
iconClass,
|
||||||
showClose: true,
|
showClose: true,
|
||||||
customClass,
|
customClass
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
callbackExport() {
|
callbackExport() {
|
||||||
bus.$emit('data-export-center')
|
bus.$emit('data-export-center')
|
||||||
|
|||||||
@ -1,87 +1,153 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-drawer
|
<el-drawer
|
||||||
|
v-loading="drawerLoading"
|
||||||
custom-class="de-user-drawer de-export-excel"
|
custom-class="de-user-drawer de-export-excel"
|
||||||
:title="$t('data_export.export_center')"
|
:title="$t('data_export.export_center')"
|
||||||
v-loading="drawerLoading"
|
|
||||||
:visible.sync="drawer"
|
:visible.sync="drawer"
|
||||||
direction="rtl"
|
direction="rtl"
|
||||||
size="1000px"
|
size="1000px"
|
||||||
append-to-body
|
append-to-body
|
||||||
:before-close="handleClose"
|
:before-close="handleClose"
|
||||||
>
|
>
|
||||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
<el-tabs
|
||||||
|
v-model="activeName"
|
||||||
|
@tab-click="handleClick"
|
||||||
|
>
|
||||||
<el-tab-pane
|
<el-tab-pane
|
||||||
v-for="tab in tabList"
|
v-for="tab in tabList"
|
||||||
:key="tab.name"
|
:key="tab.name"
|
||||||
:label="tab.label"
|
:label="tab.label"
|
||||||
:name="tab.name"
|
:name="tab.name"
|
||||||
></el-tab-pane>
|
/>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
<de-btn secondary icon="el-icon-delete" @click="delAll" v-show="multipleSelection.length === 0"
|
<de-btn
|
||||||
>{{ $t("data_export.del_all") }}
|
v-show="multipleSelection.length === 0"
|
||||||
|
secondary
|
||||||
|
icon="el-icon-delete"
|
||||||
|
@click="delAll"
|
||||||
|
>{{ $t("data_export.del_all") }}
|
||||||
</de-btn>
|
</de-btn>
|
||||||
<de-btn secondary icon="el-icon-delete" @click="delAll" v-show="multipleSelection.length !== 0"
|
<de-btn
|
||||||
|
v-show="multipleSelection.length !== 0"
|
||||||
|
secondary
|
||||||
|
icon="el-icon-delete"
|
||||||
|
@click="delAll"
|
||||||
>{{ $t("commons.delete") }}
|
>{{ $t("commons.delete") }}
|
||||||
</de-btn>
|
</de-btn>
|
||||||
<div class="table-container" :class="!tableData.length && 'hidden-bottom'">
|
<div
|
||||||
|
class="table-container"
|
||||||
|
:class="!tableData.length && 'hidden-bottom'"
|
||||||
|
>
|
||||||
<el-table
|
<el-table
|
||||||
ref="multipleTable"
|
ref="multipleTable"
|
||||||
:data="tableData"
|
:data="tableData"
|
||||||
@selection-change="handleSelectionChange"
|
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
|
@selection-change="handleSelectionChange"
|
||||||
>
|
>
|
||||||
<el-table-column type="selection" width="50"> </el-table-column>
|
<el-table-column
|
||||||
<el-table-column prop="fileName" :label="$t('driver.file_name')" width="332">
|
type="selection"
|
||||||
|
width="50"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
prop="fileName"
|
||||||
|
:label="$t('driver.file_name')"
|
||||||
|
width="332"
|
||||||
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<div class="name-excel">
|
<div class="name-excel">
|
||||||
<svg-icon style="font-size: 24px;" icon-class="icon_file-excel_colorful"> </svg-icon>
|
<svg-icon
|
||||||
|
style="font-size: 24px;"
|
||||||
|
icon-class="icon_file-excel_colorful"
|
||||||
|
/>
|
||||||
<div class="name-content">
|
<div class="name-content">
|
||||||
<div class="fileName">{{ scope.row.fileName }}</div>
|
<div class="fileName">{{ scope.row.fileName }}</div>
|
||||||
<div class="failed" v-if="activeName==='FAILED'">{{ $t("data_export.export_failed") }}</div>
|
<div
|
||||||
<div class="success" v-if="scope.row.exportStatus==='SUCCESS'">{{scope.row.fileSize}}{{scope.row.fileSizeUnit}}</div>
|
v-if="activeName==='FAILED'"
|
||||||
|
class="failed"
|
||||||
|
>{{ $t("data_export.export_failed") }}</div>
|
||||||
|
<div
|
||||||
|
v-if="scope.row.exportStatus==='SUCCESS'"
|
||||||
|
class="success"
|
||||||
|
>{{ scope.row.fileSize }}{{ scope.row.fileSizeUnit }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="activeName==='FAILED'" class="red-line" />
|
<div
|
||||||
<el-progress v-if="activeName==='IN_PROGRESS'" :percentage="+scope.row.exportPogress"></el-progress>
|
v-if="activeName==='FAILED'"
|
||||||
|
class="red-line"
|
||||||
|
/>
|
||||||
|
<el-progress
|
||||||
|
v-if="activeName==='IN_PROGRESS'"
|
||||||
|
:percentage="+scope.row.exportPogress"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="exportFromName" :label="$t('data_export.export_obj')" width="200">
|
<el-table-column
|
||||||
</el-table-column>
|
prop="exportFromName"
|
||||||
<el-table-column prop="exportFromType" width="120" :label="$t('data_export.export_from')">
|
:label="$t('data_export.export_obj')"
|
||||||
|
width="200"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
prop="exportFromType"
|
||||||
|
width="120"
|
||||||
|
:label="$t('data_export.export_from')"
|
||||||
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<span v-if="scope.row.exportFromType === 'dataset'">{{ $t("dataset.datalist") }}</span>
|
<span v-if="scope.row.exportFromType === 'dataset'">{{ $t("dataset.datalist") }}</span>
|
||||||
<span v-if="scope.row.exportFromType === 'chart'">{{ $t("panel.view") }}</span>
|
<span v-if="scope.row.exportFromType === 'chart'">{{ $t("panel.view") }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="exportTime" width="180" :label="$t('data_export.export_time')">
|
<el-table-column
|
||||||
|
prop="exportTime"
|
||||||
|
width="180"
|
||||||
|
:label="$t('data_export.export_time')"
|
||||||
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<span>{{ scope.row.exportTime | timestampFormatDate }}</span>
|
<span>{{ scope.row.exportTime | timestampFormatDate }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column fixed="right" prop="operate" width="80" :label="$t('commons.operating')">
|
<el-table-column
|
||||||
|
fixed="right"
|
||||||
|
prop="operate"
|
||||||
|
width="80"
|
||||||
|
:label="$t('commons.operating')"
|
||||||
|
>
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button v-if="scope.row.exportStatus === 'SUCCESS'" type="text" size="mini" @click="downloadClick(scope.row)">
|
<el-button
|
||||||
|
v-if="scope.row.exportStatus === 'SUCCESS'"
|
||||||
|
type="text"
|
||||||
|
size="mini"
|
||||||
|
@click="downloadClick(scope.row)"
|
||||||
|
>
|
||||||
<div class="download-export">
|
<div class="download-export">
|
||||||
<svg-icon
|
<svg-icon
|
||||||
icon-class="icon_download_outlined"
|
icon-class="icon_download_outlined"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button v-if="scope.row.exportStatus === 'FAILED'" type="text" size="mini" @click="retry(scope.row)">
|
<el-button
|
||||||
|
v-if="scope.row.exportStatus === 'FAILED'"
|
||||||
|
type="text"
|
||||||
|
size="mini"
|
||||||
|
@click="retry(scope.row)"
|
||||||
|
>
|
||||||
<div class="download-export">
|
<div class="download-export">
|
||||||
<i class="el-icon-refresh-right"></i>
|
<i class="el-icon-refresh-right" />
|
||||||
</div>
|
</div>
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button type="text" size="mini" @click="deleteField(scope.row)">
|
<el-button
|
||||||
|
type="text"
|
||||||
|
size="mini"
|
||||||
|
@click="deleteField(scope.row)"
|
||||||
|
>
|
||||||
<div class="download-export">
|
<div class="download-export">
|
||||||
<i class="el-icon-delete"></i>
|
<i class="el-icon-delete" />
|
||||||
</div>
|
</div>
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-empty
|
<el-empty
|
||||||
slot="empty"
|
|
||||||
v-if="!tableData.length"
|
v-if="!tableData.length"
|
||||||
|
slot="empty"
|
||||||
style="padding-top: 80px"
|
style="padding-top: 80px"
|
||||||
:image-size="125"
|
:image-size="125"
|
||||||
:image="errImg"
|
:image="errImg"
|
||||||
@ -92,46 +158,46 @@
|
|||||||
</el-drawer>
|
</el-drawer>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import msgCfm from "@/components/msgCfm/index";
|
import msgCfm from '@/components/msgCfm/index'
|
||||||
import request from "@/utils/request";
|
import request from '@/utils/request'
|
||||||
import {downloadFile, post} from '@/api/dataset/dataset'
|
import { downloadFile, post } from '@/api/dataset/dataset'
|
||||||
import bus from "@/utils/bus";
|
import bus from '@/utils/bus'
|
||||||
import {Button} from "element-ui";
|
import { Button } from 'element-ui'
|
||||||
export default {
|
export default {
|
||||||
mixins: [msgCfm],
|
mixins: [msgCfm],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
activeName: "ALL",
|
activeName: 'ALL',
|
||||||
multipleSelection: [],
|
multipleSelection: [],
|
||||||
errImg: require("@/assets/none-data.png"),
|
errImg: require('@/assets/none-data.png'),
|
||||||
tableData: [{ name: "附件名称" }],
|
tableData: [{ name: '附件名称' }],
|
||||||
drawer: false,
|
drawer: false,
|
||||||
drawerLoading: false,
|
drawerLoading: false,
|
||||||
description: this.$t("暂无任务"),
|
description: this.$t('暂无任务'),
|
||||||
tabList: [
|
tabList: [
|
||||||
{
|
{
|
||||||
label: "导出中(0)",
|
label: '导出中(0)',
|
||||||
name: "IN_PROGRESS",
|
name: 'IN_PROGRESS'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "成功(0)",
|
label: '成功(0)',
|
||||||
name: "SUCCESS",
|
name: 'SUCCESS'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "失败(0)",
|
label: '失败(0)',
|
||||||
name: "FAILED",
|
name: 'FAILED'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "等待中(0)",
|
label: '等待中(0)',
|
||||||
name: "PENDING",
|
name: 'PENDING'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: "全部(0)",
|
label: '全部(0)',
|
||||||
name: "ALL",
|
name: 'ALL'
|
||||||
},
|
}
|
||||||
],
|
],
|
||||||
loading : false
|
loading: false
|
||||||
};
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.handleClick()
|
this.handleClick()
|
||||||
@ -141,80 +207,80 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
init() {
|
init() {
|
||||||
this.drawer = true;
|
this.drawer = true
|
||||||
this.handleClick()
|
this.handleClick()
|
||||||
this.timer = setInterval(() => {
|
this.timer = setInterval(() => {
|
||||||
if(this.activeName === 'IN_PROGRESS'){
|
if (this.activeName === 'IN_PROGRESS') {
|
||||||
post(
|
post(
|
||||||
'/exportCenter/exportTasks/' + this.activeName,{}, true
|
'/exportCenter/exportTasks/' + this.activeName, {}, true
|
||||||
).then(
|
).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
this.tabList.forEach( item => {
|
this.tabList.forEach(item => {
|
||||||
if(item.name === 'ALL'){
|
if (item.name === 'ALL') {
|
||||||
item.label = '全部' + '(' + res.data.length + ')'
|
item.label = '全部' + '(' + res.data.length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'IN_PROGRESS'){
|
if (item.name === 'IN_PROGRESS') {
|
||||||
item.label = '导出中' + '(' + res.data.filter(task => task.exportStatus === 'IN_PROGRESS').length + ')'
|
item.label = '导出中' + '(' + res.data.filter(task => task.exportStatus === 'IN_PROGRESS').length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'SUCCESS'){
|
if (item.name === 'SUCCESS') {
|
||||||
item.label = '成功' + '(' + res.data.filter(task => task.exportStatus === 'SUCCESS').length + ')'
|
item.label = '成功' + '(' + res.data.filter(task => task.exportStatus === 'SUCCESS').length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'FAILED'){
|
if (item.name === 'FAILED') {
|
||||||
item.label = '失败' + '(' + res.data.filter(task => task.exportStatus === 'FAILED').length + ')'
|
item.label = '失败' + '(' + res.data.filter(task => task.exportStatus === 'FAILED').length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'PENDING'){
|
if (item.name === 'PENDING') {
|
||||||
item.label = '等待中' + '(' + res.data.filter(task => task.exportStatus === 'PENDING').length + ')'
|
item.label = '等待中' + '(' + res.data.filter(task => task.exportStatus === 'PENDING').length + ')'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
if(this.activeName === 'ALL'){
|
if (this.activeName === 'ALL') {
|
||||||
this.tableData = res.data
|
this.tableData = res.data
|
||||||
}else {
|
} else {
|
||||||
this.tableData = res.data.filter(task => task.exportStatus === this.activeName)
|
this.tableData = res.data.filter(task => task.exportStatus === this.activeName)
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}, 5000);
|
}, 5000)
|
||||||
},
|
},
|
||||||
format(percentage) {
|
format(percentage) {
|
||||||
return '';
|
return ''
|
||||||
},
|
},
|
||||||
taskExportTopicCall(task){
|
taskExportTopicCall(task) {
|
||||||
if(JSON.parse(task).exportStatus === 'SUCCESS'){
|
if (JSON.parse(task).exportStatus === 'SUCCESS') {
|
||||||
this.openMessageLoading(JSON.parse(task).exportFromName + ' ' + this.$t('excel.export') + this.$t('dataset.completed')+ this.$t('dataset.goto'), 'success', this.callbackExport)
|
this.openMessageLoading(JSON.parse(task).exportFromName + ' ' + this.$t('excel.export') + this.$t('dataset.completed') + this.$t('dataset.goto'), 'success', this.callbackExport)
|
||||||
}
|
}
|
||||||
if(JSON.parse(task).exportStatus === 'FAILED'){
|
if (JSON.parse(task).exportStatus === 'FAILED') {
|
||||||
this.openMessageLoading(JSON.parse(task).exportFromName + ' ' + this.$t('excel.export') + this.$t('dataset.error')+ this.$t('dataset.goto'), 'error', this.callbackExport)
|
this.openMessageLoading(JSON.parse(task).exportFromName + ' ' + this.$t('excel.export') + this.$t('dataset.error') + this.$t('dataset.goto'), 'error', this.callbackExport)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
openMessageLoading(text, type, cb) {
|
openMessageLoading(text, type, cb) {
|
||||||
const h = this.$createElement;
|
const h = this.$createElement
|
||||||
const iconClass = `el-icon-${type || 'success'}`
|
const iconClass = `el-icon-${type || 'success'}`
|
||||||
const customClass = `de-message-${type || 'success'} de-message-export`
|
const customClass = `de-message-${type || 'success'} de-message-export`
|
||||||
this.$message({
|
this.$message({
|
||||||
message: h("p", null, [
|
message: h('p', null, [
|
||||||
this.$t(text),
|
this.$t(text),
|
||||||
h(
|
h(
|
||||||
Button,
|
Button,
|
||||||
{
|
{
|
||||||
props: {
|
props: {
|
||||||
type: "text",
|
type: 'text',
|
||||||
size: "mini",
|
size: 'mini'
|
||||||
},
|
},
|
||||||
class: "btn-text",
|
class: 'btn-text',
|
||||||
on: {
|
on: {
|
||||||
click: () => {
|
click: () => {
|
||||||
cb();
|
cb()
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
this.$t('data_export.export_center'),
|
this.$t('data_export.export_center')
|
||||||
)
|
)
|
||||||
]),
|
]),
|
||||||
iconClass,
|
iconClass,
|
||||||
showClose: true,
|
showClose: true,
|
||||||
customClass,
|
customClass
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
callbackExport() {
|
callbackExport() {
|
||||||
bus.$emit('data-export-center')
|
bus.$emit('data-export-center')
|
||||||
@ -223,32 +289,32 @@ export default {
|
|||||||
this.tableData = []
|
this.tableData = []
|
||||||
this.drawerLoading = true
|
this.drawerLoading = true
|
||||||
post(
|
post(
|
||||||
'/exportCenter/exportTasks/' + this.activeName,{}, false
|
'/exportCenter/exportTasks/' + this.activeName, {}, false
|
||||||
).then(
|
).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
this.tabList.forEach( item => {
|
this.tabList.forEach(item => {
|
||||||
if(item.name === 'ALL'){
|
if (item.name === 'ALL') {
|
||||||
item.label = '全部' + '(' + res.data.length + ')'
|
item.label = '全部' + '(' + res.data.length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'IN_PROGRESS'){
|
if (item.name === 'IN_PROGRESS') {
|
||||||
item.label = '导出中' + '(' + res.data.filter(task => task.exportStatus === 'IN_PROGRESS').length + ')'
|
item.label = '导出中' + '(' + res.data.filter(task => task.exportStatus === 'IN_PROGRESS').length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'SUCCESS'){
|
if (item.name === 'SUCCESS') {
|
||||||
item.label = '成功' + '(' + res.data.filter(task => task.exportStatus === 'SUCCESS').length + ')'
|
item.label = '成功' + '(' + res.data.filter(task => task.exportStatus === 'SUCCESS').length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'FAILED'){
|
if (item.name === 'FAILED') {
|
||||||
item.label = '失败' + '(' + res.data.filter(task => task.exportStatus === 'FAILED').length + ')'
|
item.label = '失败' + '(' + res.data.filter(task => task.exportStatus === 'FAILED').length + ')'
|
||||||
}
|
}
|
||||||
if(item.name === 'PENDING'){
|
if (item.name === 'PENDING') {
|
||||||
item.label = '等待中' + '(' + res.data.filter(task => task.exportStatus === 'PENDING').length + ')'
|
item.label = '等待中' + '(' + res.data.filter(task => task.exportStatus === 'PENDING').length + ')'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
if(this.activeName === 'ALL'){
|
if (this.activeName === 'ALL') {
|
||||||
this.tableData = res.data
|
this.tableData = res.data
|
||||||
}else {
|
} else {
|
||||||
this.tableData = res.data.filter(task => task.exportStatus === this.activeName)
|
this.tableData = res.data.filter(task => task.exportStatus === this.activeName)
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
|
|
||||||
).finally(() => {
|
).finally(() => {
|
||||||
this.drawerLoading = false
|
this.drawerLoading = false
|
||||||
@ -271,7 +337,7 @@ export default {
|
|||||||
|
|
||||||
retry(item) {
|
retry(item) {
|
||||||
post(
|
post(
|
||||||
'/exportCenter/retry/' + item.id,{},
|
'/exportCenter/retry/' + item.id, {},
|
||||||
true
|
true
|
||||||
).then(
|
).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
@ -285,24 +351,24 @@ export default {
|
|||||||
method: 'get'
|
method: 'get'
|
||||||
}).then(
|
}).then(
|
||||||
(res) => {
|
(res) => {
|
||||||
this.handleClick()
|
this.handleClick()
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
this.openMessageSuccess("commons.delete_success");
|
this.openMessageSuccess('commons.delete_success')
|
||||||
},
|
},
|
||||||
handleSelectionChange(val) {
|
handleSelectionChange(val) {
|
||||||
this.multipleSelection = val;
|
this.multipleSelection = val
|
||||||
},
|
},
|
||||||
confirmDelete() {
|
confirmDelete() {
|
||||||
const options = {
|
const options = {
|
||||||
title: "确定删除该任务吗？",
|
title: '确定删除该任务吗？',
|
||||||
type: "primary",
|
type: 'primary',
|
||||||
cb: this.deleteField,
|
cb: this.deleteField
|
||||||
};
|
}
|
||||||
this.handlerConfirm(options);
|
this.handlerConfirm(options)
|
||||||
},
|
},
|
||||||
delAll() {
|
delAll() {
|
||||||
if(this.multipleSelection.length === 0 ){
|
if (this.multipleSelection.length === 0) {
|
||||||
post(
|
post(
|
||||||
'/exportCenter/deleteAll/' + this.activeName,
|
'/exportCenter/deleteAll/' + this.activeName,
|
||||||
this.multipleSelection.map((ele) => ele.id),
|
this.multipleSelection.map((ele) => ele.id),
|
||||||
@ -312,7 +378,7 @@ export default {
|
|||||||
this.handleClick()
|
this.handleClick()
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
this.openMessageSuccess("commons.delete_success");
|
this.openMessageSuccess('commons.delete_success')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
post(
|
post(
|
||||||
@ -324,15 +390,15 @@ export default {
|
|||||||
this.handleClick()
|
this.handleClick()
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
this.openMessageSuccess("commons.delete_success");
|
this.openMessageSuccess('commons.delete_success')
|
||||||
},
|
},
|
||||||
|
|
||||||
handleClose() {
|
handleClose() {
|
||||||
this.drawer = false;
|
this.drawer = false
|
||||||
clearInterval(this.timer);
|
clearInterval(this.timer)
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
.de-export-excel {
|
.de-export-excel {
|
||||||
|
|||||||
@ -122,7 +122,6 @@
|
|||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="login-msg"
|
class="login-msg"
|
||||||
|
|
||||||
>
|
>
|
||||||
{{ msg }}
|
{{ msg }}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -19,12 +19,11 @@
|
|||||||
import DeCanvas from '@/components/canvas/DeCanvas'
|
import DeCanvas from '@/components/canvas/DeCanvas'
|
||||||
import CanvasOptBar from '@/components/canvas/components/editor/CanvasOptBar'
|
import CanvasOptBar from '@/components/canvas/components/editor/CanvasOptBar'
|
||||||
import {
|
import {
|
||||||
imgUrlTrans,
|
imgUrlTrans
|
||||||
getNowCanvasComponentData
|
|
||||||
} from '@/components/canvas/utils/utils'
|
} from '@/components/canvas/utils/utils'
|
||||||
import { mapState } from 'vuex'
|
import { mapState } from 'vuex'
|
||||||
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
||||||
import store from '@/store'
|
|
||||||
export default {
|
export default {
|
||||||
components: { DeCanvas, CanvasOptBar },
|
components: { DeCanvas, CanvasOptBar },
|
||||||
data() {
|
data() {
|
||||||
|
|||||||
@ -659,9 +659,9 @@ export default {
|
|||||||
if (this.widgetInfo.name.indexOf('numberSelect') !== -1) {
|
if (this.widgetInfo.name.indexOf('numberSelect') !== -1) {
|
||||||
type = 'NUM'
|
type = 'NUM'
|
||||||
}
|
}
|
||||||
if(viewIds && viewIds.length > 0){
|
if (viewIds && viewIds.length > 0) {
|
||||||
paramsWithIds(type, viewIds).then(res => {
|
paramsWithIds(type, viewIds).then(res => {
|
||||||
this.childViews.datasetParams = res.data
|
this.childViews.datasetParams = res.data
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@ -30,7 +30,7 @@
|
|||||||
:close-on-click-modal="false"
|
:close-on-click-modal="false"
|
||||||
:before-close="sureRequired"
|
:before-close="sureRequired"
|
||||||
>
|
>
|
||||||
{{ $t('time.dropdown_display_must') }}
|
{{ $t('time.dropdown_display_must') }}
|
||||||
<div style="text-align: end;margin-top: 16px;">
|
<div style="text-align: end;margin-top: 16px;">
|
||||||
<span slot="footer">
|
<span slot="footer">
|
||||||
<el-button
|
<el-button
|
||||||
@ -134,33 +134,45 @@
|
|||||||
<span
|
<span
|
||||||
style="padding-left: 10px;"
|
style="padding-left: 10px;"
|
||||||
>
|
>
|
||||||
<el-popover popper-class="popover-more-parent" :visible-arrow="false" placement="bottom-start" :width="182" trigger="click">
|
<el-popover
|
||||||
<template v-if="showMore" #reference>
|
popper-class="popover-more-parent"
|
||||||
|
:visible-arrow="false"
|
||||||
|
placement="bottom-start"
|
||||||
|
:width="182"
|
||||||
|
trigger="click"
|
||||||
|
>
|
||||||
|
<template
|
||||||
|
v-if="showMore"
|
||||||
|
#reference
|
||||||
|
>
|
||||||
<div class="more-select-btn icon iconfont icon-icon-more">
|
<div class="more-select-btn icon iconfont icon-icon-more">
|
||||||
{{ $t('panel.more') }}
|
{{ $t('panel.more') }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<div class="check-item">
|
<div class="check-item">
|
||||||
<el-tooltip
|
<el-tooltip
|
||||||
|
v-model="visibleShowEmpty"
|
||||||
class="box-item"
|
class="box-item"
|
||||||
effect="dark"
|
effect="dark"
|
||||||
:content="$t('time.passing_parameters')"
|
:content="$t('time.passing_parameters')"
|
||||||
placement="top"
|
placement="top"
|
||||||
manual
|
manual
|
||||||
v-model="visibleShowEmpty"
|
|
||||||
>
|
>
|
||||||
<el-checkbox
|
<el-checkbox
|
||||||
v-if="widget.name && ['textSelectWidget', 'textSelectGridWidget'].includes(widget.name)"
|
v-if="widget.name && ['textSelectWidget', 'textSelectGridWidget'].includes(widget.name)"
|
||||||
:disabled="attrs.enableParameters"
|
|
||||||
v-model="attrs.showEmpty"
|
v-model="attrs.showEmpty"
|
||||||
><span @mouseenter="handlerVisibleShowEmpty" @mouseleave="handlerVisibleShowEmpty">{{ $t('panel.show_empty') }}</span>
|
:disabled="attrs.enableParameters"
|
||||||
|
><span
|
||||||
|
@mouseenter="handlerVisibleShowEmpty"
|
||||||
|
@mouseleave="handlerVisibleShowEmpty"
|
||||||
|
>{{ $t('panel.show_empty') }}</span>
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</div>
|
</div>
|
||||||
<div class="check-item">
|
<div class="check-item">
|
||||||
<el-checkbox
|
<el-checkbox
|
||||||
v-model="attrs.showTime"
|
|
||||||
v-if="widget.isTimeWidget && widget.isTimeWidget()"
|
v-if="widget.isTimeWidget && widget.isTimeWidget()"
|
||||||
|
v-model="attrs.showTime"
|
||||||
@change="showTimeChange"
|
@change="showTimeChange"
|
||||||
>
|
>
|
||||||
<span>{{ $t('panel.show_time') }} </span>
|
<span>{{ $t('panel.show_time') }} </span>
|
||||||
@ -189,9 +201,9 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<i
|
<i
|
||||||
|
v-if="widget.isTimeWidget && widget.isTimeWidget()"
|
||||||
slot="reference"
|
slot="reference"
|
||||||
:class="{'i-filter-active': attrs.showTime, 'i-filter-inactive': !attrs.showTime}"
|
:class="{'i-filter-active': attrs.showTime, 'i-filter-inactive': !attrs.showTime}"
|
||||||
v-if="widget.isTimeWidget && widget.isTimeWidget()"
|
|
||||||
class="el-icon-setting i-filter"
|
class="el-icon-setting i-filter"
|
||||||
/>
|
/>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
@ -202,30 +214,44 @@
|
|||||||
v-model="attrs.setTimeRange"
|
v-model="attrs.setTimeRange"
|
||||||
>{{ $t('time.set_time_filtering_range') }}
|
>{{ $t('time.set_time_filtering_range') }}
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
<el-popover :disabled="!attrs.setTimeRange" popper-class="popover-setting-parent" ref="popoverSetting" :visible-arrow="false" placement="bottom-start" :width="452" trigger="click">
|
<el-popover
|
||||||
<RangeFilterTime @changeData="changeData" :timeRangeData="attrs.timeRange" />
|
ref="popoverSetting"
|
||||||
|
:disabled="!attrs.setTimeRange"
|
||||||
|
popper-class="popover-setting-parent"
|
||||||
|
:visible-arrow="false"
|
||||||
|
placement="bottom-start"
|
||||||
|
:width="452"
|
||||||
|
trigger="click"
|
||||||
|
>
|
||||||
|
<RangeFilterTime
|
||||||
|
:time-range-data="attrs.timeRange"
|
||||||
|
@changeData="changeData"
|
||||||
|
/>
|
||||||
<i
|
<i
|
||||||
v-if="widget.name && ['timeDateRangeWidget'].includes(widget.name)"
|
v-if="widget.name && ['timeDateRangeWidget'].includes(widget.name)"
|
||||||
:class="{'i-filter-active': attrs.setTimeRange, 'i-filter-inactive': !attrs.setTimeRange}"
|
|
||||||
slot="reference"
|
slot="reference"
|
||||||
|
:class="{'i-filter-active': attrs.setTimeRange, 'i-filter-inactive': !attrs.setTimeRange}"
|
||||||
class="el-icon-setting i-filter"
|
class="el-icon-setting i-filter"
|
||||||
/>
|
/>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
</div>
|
</div>
|
||||||
<div class="check-item">
|
<div class="check-item">
|
||||||
<el-tooltip
|
<el-tooltip
|
||||||
manual
|
|
||||||
v-model="visibleEnableParameters"
|
v-model="visibleEnableParameters"
|
||||||
|
manual
|
||||||
>
|
>
|
||||||
<template #content>
|
<template #content>
|
||||||
<span>{{ $t('time.not_supported') }}</span>
|
<span>{{ $t('time.not_supported') }}</span>
|
||||||
</template>
|
</template>
|
||||||
<el-checkbox
|
<el-checkbox
|
||||||
v-if="showParams"
|
v-if="showParams"
|
||||||
:disabled="attrs.showEmpty"
|
|
||||||
v-model="attrs.enableParameters"
|
v-model="attrs.enableParameters"
|
||||||
|
:disabled="attrs.showEmpty"
|
||||||
@change="enableParametersChange"
|
@change="enableParametersChange"
|
||||||
><span @mouseenter="handlerVisibleEnableParameters" @mouseleave="handlerVisibleEnableParameters">
|
><span
|
||||||
|
@mouseenter="handlerVisibleEnableParameters"
|
||||||
|
@mouseleave="handlerVisibleEnableParameters"
|
||||||
|
>
|
||||||
{{ $t('panel.binding_parameters') }} </span>
|
{{ $t('panel.binding_parameters') }} </span>
|
||||||
</el-checkbox>
|
</el-checkbox>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
@ -306,8 +332,8 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<i
|
<i
|
||||||
slot="reference"
|
|
||||||
v-if="showParams"
|
v-if="showParams"
|
||||||
|
slot="reference"
|
||||||
:class="{'i-filter-active': attrs.enableParameters, 'i-filter-inactive': !attrs.enableParameters}"
|
:class="{'i-filter-active': attrs.enableParameters, 'i-filter-inactive': !attrs.enableParameters}"
|
||||||
class="el-icon-setting i-filter"
|
class="el-icon-setting i-filter"
|
||||||
/>
|
/>
|
||||||
@ -415,9 +441,9 @@ export default {
|
|||||||
handler(newName, oldName) {
|
handler(newName, oldName) {
|
||||||
this.allParams = JSON.parse(JSON.stringify(this.childViews.datasetParams))
|
this.allParams = JSON.parse(JSON.stringify(this.childViews.datasetParams))
|
||||||
if (this.datasetParams.length > 0) {
|
if (this.datasetParams.length > 0) {
|
||||||
for (var j = 0; j < this.datasetParams.length; j++) {
|
for (let j = 0; j < this.datasetParams.length; j++) {
|
||||||
var hasParam = false
|
let hasParam = false
|
||||||
for (var i = 0; i < this.childViews.datasetParams.length; i++) {
|
for (let i = 0; i < this.childViews.datasetParams.length; i++) {
|
||||||
if (this.childViews.datasetParams[i].id === this.datasetParams[j].id) {
|
if (this.childViews.datasetParams[i].id === this.datasetParams[j].id) {
|
||||||
hasParam = true
|
hasParam = true
|
||||||
}
|
}
|
||||||
@ -435,18 +461,18 @@ export default {
|
|||||||
this.attrs = this.controlAttrs
|
this.attrs = this.controlAttrs
|
||||||
if (!this.attrs.timeRange) {
|
if (!this.attrs.timeRange) {
|
||||||
this.$set(this.attrs, 'timeRange', {
|
this.$set(this.attrs, 'timeRange', {
|
||||||
intervalType: "none",
|
intervalType: 'none',
|
||||||
dynamicWindow: false,
|
dynamicWindow: false,
|
||||||
maximumSingleQuery: 0,
|
maximumSingleQuery: 0,
|
||||||
regularOrTrends: "fixed",
|
regularOrTrends: 'fixed',
|
||||||
regularOrTrendsValue: "",
|
regularOrTrendsValue: '',
|
||||||
relativeToCurrent: "custom",
|
relativeToCurrent: 'custom',
|
||||||
timeNum: 0,
|
timeNum: 0,
|
||||||
relativeToCurrentType: "year",
|
relativeToCurrentType: 'year',
|
||||||
around: "f",
|
around: 'f',
|
||||||
timeNumRange: 0,
|
timeNumRange: 0,
|
||||||
relativeToCurrentTypeRange: "year",
|
relativeToCurrentTypeRange: 'year',
|
||||||
aroundRange: "f",
|
aroundRange: 'f'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
if (this.widget.isTimeWidget) {
|
if (this.widget.isTimeWidget) {
|
||||||
@ -464,7 +490,7 @@ export default {
|
|||||||
this.$emit('required-change', false)
|
this.$emit('required-change', false)
|
||||||
},
|
},
|
||||||
requiredChange(val) {
|
requiredChange(val) {
|
||||||
if (val === false && (this.element.style.showMode && this.element.style.showMode === 'radio' && !this.element.options.attrs.multiple)) {
|
if (val === false && (this.element.style.showMode && this.element.style.showMode === 'radio' && !this.element.options.attrs.multiple)) {
|
||||||
this.dialogVisible = true
|
this.dialogVisible = true
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.element.options.attrs.required = true
|
this.element.options.attrs.required = true
|
||||||
@ -575,7 +601,7 @@ export default {
|
|||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
|
|
||||||
.more-select-btn {
|
.more-select-btn {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
width: 56px;
|
width: 56px;
|
||||||
@ -689,4 +715,4 @@ export default {
|
|||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,22 +1,22 @@
|
|||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
function getThisStart(val = 'month') {
|
function getThisStart(val = 'month') {
|
||||||
return new Date(dayjs().startOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
return new Date(dayjs().startOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
||||||
}
|
}
|
||||||
|
|
||||||
function getThisEnd(val = 'month') {
|
function getThisEnd(val = 'month') {
|
||||||
return new Date(dayjs().endOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
return new Date(dayjs().endOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
||||||
}
|
}
|
||||||
|
|
||||||
function getLastStart(val = 'month') {
|
function getLastStart(val = 'month') {
|
||||||
return new Date(dayjs().subtract(1, val).startOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
return new Date(dayjs().subtract(1, val).startOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
||||||
}
|
}
|
||||||
|
|
||||||
function getLastEnd(val = 'month') {
|
function getLastEnd(val = 'month') {
|
||||||
return new Date(dayjs().subtract(1, val).endOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
return new Date(dayjs().subtract(1, val).endOf(val).format('YYYY/MM/DD HH:mm:ss'))
|
||||||
}
|
}
|
||||||
|
|
||||||
function getAround(val = 'month', type = 'add', num = 0) {
|
function getAround(val = 'month', type = 'add', num = 0) {
|
||||||
return new Date(dayjs()[type](num, val).startOf('day').format('YYYY/MM/DD HH:mm:ss'))
|
return new Date(dayjs()[type](num, val).startOf('day').format('YYYY/MM/DD HH:mm:ss'))
|
||||||
}
|
}
|
||||||
|
|
||||||
export { getThisStart, getThisEnd, getLastStart, getLastEnd, getAround }
|
export { getThisStart, getThisEnd, getLastStart, getLastEnd, getAround }
|
||||||
|
|||||||
@ -1,7 +1,10 @@
|
|||||||
<template xmlns:el-col="http://www.w3.org/1999/html">
|
<template xmlns:el-col="http://www.w3.org/1999/html">
|
||||||
<el-col style="padding: 1px 24px 16px 24px">
|
<el-col style="padding: 1px 24px 16px 24px">
|
||||||
<el-col>
|
<el-col>
|
||||||
<el-row class="sticky-de-search-panel" style="margin-bottom: 10px">
|
<el-row
|
||||||
|
class="sticky-de-search-panel"
|
||||||
|
style="margin-bottom: 10px"
|
||||||
|
>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="filterText"
|
v-model="filterText"
|
||||||
|
|||||||
@ -19,7 +19,8 @@
|
|||||||
label-width="180px"
|
label-width="180px"
|
||||||
label-position="right"
|
label-position="right"
|
||||||
>
|
>
|
||||||
<el-form-item v-if="showItem(driverForm.id)"
|
<el-form-item
|
||||||
|
v-if="showItem(driverForm.id)"
|
||||||
:label="$t('driver.driver')"
|
:label="$t('driver.driver')"
|
||||||
prop="driverClass"
|
prop="driverClass"
|
||||||
>
|
>
|
||||||
@ -30,13 +31,13 @@
|
|||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
:label="$t('driver.surpportVersions')"
|
:label="$t('driver.surpportVersions')"
|
||||||
prop="surpportVersions"
|
prop="surpportVersions"
|
||||||
>
|
>
|
||||||
<el-input
|
<el-input
|
||||||
v-model="driverForm.surpportVersions"
|
v-model="driverForm.surpportVersions"
|
||||||
style="width: 600px"
|
style="width: 600px"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
@ -63,7 +64,10 @@
|
|||||||
{{ uploading ? $t('dataset.uploading') : $t('dataset.upload_file') }}
|
{{ uploading ? $t('dataset.uploading') : $t('dataset.upload_file') }}
|
||||||
</deBtn>
|
</deBtn>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
<p class="tips" v-show="showItem(driverForm.id)">
|
<p
|
||||||
|
v-show="showItem(driverForm.id)"
|
||||||
|
class="tips"
|
||||||
|
>
|
||||||
{{ $t('datasource.can_be_uploaded') }}
|
{{ $t('datasource.can_be_uploaded') }}
|
||||||
</p>
|
</p>
|
||||||
<div class="jar-cont">
|
<div class="jar-cont">
|
||||||
@ -305,13 +309,13 @@ export default {
|
|||||||
refreshType(form) {
|
refreshType(form) {
|
||||||
this.$emit('refresh-type', form)
|
this.$emit('refresh-type', form)
|
||||||
},
|
},
|
||||||
showItem(id){
|
showItem(id) {
|
||||||
if (id !== '' && id.indexOf("default") !== -1) {
|
if (id !== '' && id.indexOf('default') !== -1) {
|
||||||
return false
|
return false
|
||||||
} else {
|
} else {
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -696,7 +696,7 @@ export default {
|
|||||||
methods: {
|
methods: {
|
||||||
async cancelEdit() {
|
async cancelEdit() {
|
||||||
const params = this.configFromTabs?.id ? this.configFromTabs : this.$route.query
|
const params = this.configFromTabs?.id ? this.configFromTabs : this.$route.query
|
||||||
let { id, showModel } = params
|
const { id, showModel } = params
|
||||||
await this.getDatasourceDetail(id, showModel)
|
await this.getDatasourceDetail(id, showModel)
|
||||||
this.edit(this.params)
|
this.edit(this.params)
|
||||||
this.changeType(true)
|
this.changeType(true)
|
||||||
|
|||||||
@ -216,8 +216,9 @@
|
|||||||
:label="$t('datasource.driver_name')"
|
:label="$t('datasource.driver_name')"
|
||||||
prop="name"
|
prop="name"
|
||||||
>
|
>
|
||||||
<el-input :disabled="disabledEdit(driverForm.id)"
|
<el-input
|
||||||
v-model="driverForm.name"
|
v-model="driverForm.name"
|
||||||
|
:disabled="disabledEdit(driverForm.id)"
|
||||||
:placeholder="$t('fu.search_bar.please_input')"
|
:placeholder="$t('fu.search_bar.please_input')"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
@ -458,8 +459,8 @@ export default {
|
|||||||
handleClick() {
|
handleClick() {
|
||||||
document.querySelector(`.${this.tabActive}`).scrollIntoView()
|
document.querySelector(`.${this.tabActive}`).scrollIntoView()
|
||||||
},
|
},
|
||||||
disabledEdit(id){
|
disabledEdit(id) {
|
||||||
if (id !== '' && id.indexOf("default") !== -1) {
|
if (id !== '' && id.indexOf('default') !== -1) {
|
||||||
return true
|
return true
|
||||||
} else {
|
} else {
|
||||||
return false
|
return false
|
||||||
|
|||||||
@ -344,7 +344,7 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { columnOptions } from './options'
|
import { columnOptions } from './options'
|
||||||
import {addOrder, formatOrders} from '@/utils/index'
|
import { addOrder, formatOrders } from '@/utils/index'
|
||||||
import { datasetTaskList, post } from '@/api/dataset/dataset'
|
import { datasetTaskList, post } from '@/api/dataset/dataset'
|
||||||
import { hasDataPermission } from '@/utils/permission'
|
import { hasDataPermission } from '@/utils/permission'
|
||||||
import GridTable from '@/components/gridTable/index.vue'
|
import GridTable from '@/components/gridTable/index.vue'
|
||||||
@ -496,13 +496,13 @@ export default {
|
|||||||
this.search()
|
this.search()
|
||||||
},
|
},
|
||||||
sortChange({ column, prop, order }) {
|
sortChange({ column, prop, order }) {
|
||||||
this.orderConditions = [];
|
this.orderConditions = []
|
||||||
if (!order) {
|
if (!order) {
|
||||||
this.search(true);
|
this.search(true)
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
addOrder({ field: prop, value: order }, this.orderConditions);
|
addOrder({ field: prop, value: order }, this.orderConditions)
|
||||||
this.search(true);
|
this.search(true)
|
||||||
},
|
},
|
||||||
handleCurrentChange(currentPage) {
|
handleCurrentChange(currentPage) {
|
||||||
this.paginationConfig.currentPage = currentPage
|
this.paginationConfig.currentPage = currentPage
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user