forked from github/dataease
Merge branch 'dev' into pr@dev_eslint_auto_fix
This commit is contained in:
dataeaseShu
commit
ec2b362561
11
backend/src/main/resources/db/migration/V42__1.16.sql
Normal file
11
backend/src/main/resources/db/migration/V42__1.16.sql
Normal file
@ -0,0 +1,11 @@
|
||||
UPDATE `sys_menu` set `component` = REPLACE(`component`, 'SysParam', 'sysParam') where (`component` like '%SysParam%');
|
||||
|
||||
UPDATE `sys_menu` set `component` = REPLACE(`component`, 'privateForm', 'PrivateForm') where (`component` like '%privateForm%');
|
||||
|
||||
UPDATE `sys_menu` set `component` = REPLACE(`component`, 'personPwd', 'PersonPwd') where (`component` like '%personPwd%');
|
||||
|
||||
UPDATE `sys_menu` set `component` = REPLACE(`component`, 'dataset', 'Dataset') where (`component` = 'system/task/dataset');
|
||||
|
||||
UPDATE `sys_menu` set `component` = REPLACE(`component`, 'form', 'Form') where (`component` = 'system/task/form');
|
||||
|
||||
|
||||
@ -2,11 +2,34 @@ import { hexColorToRGBA } from '@/views/chart/chart/util'
|
||||
import { DEFAULT_XAXIS_STYLE, DEFAULT_YAXIS_EXT_STYLE, DEFAULT_YAXIS_STYLE } from '@/views/chart/chart/chart'
|
||||
import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
|
||||
|
||||
let xAxisLabelFormatter = null
|
||||
let yAxisLabelFormatter = null
|
||||
let yExtAxisLabelFormatter = null
|
||||
|
||||
export function componentStyle(chart_option, chart) {
|
||||
let xAxisLabelFormatter = null
|
||||
let yAxisLabelFormatter = null
|
||||
let yExtAxisLabelFormatter = null
|
||||
const xFormatter = function(value) {
|
||||
if (!xAxisLabelFormatter) {
|
||||
return valueFormatter(value, formatterItem)
|
||||
} else {
|
||||
return valueFormatter(value, xAxisLabelFormatter)
|
||||
}
|
||||
}
|
||||
|
||||
const yFormatter = function(value) {
|
||||
if (!yAxisLabelFormatter) {
|
||||
return valueFormatter(value, formatterItem)
|
||||
} else {
|
||||
return valueFormatter(value, yAxisLabelFormatter)
|
||||
}
|
||||
}
|
||||
|
||||
const yExtFormatter = function(value) {
|
||||
if (!yExtAxisLabelFormatter) {
|
||||
return valueFormatter(value, formatterItem)
|
||||
} else {
|
||||
return valueFormatter(value, yExtAxisLabelFormatter)
|
||||
}
|
||||
}
|
||||
|
||||
const padding = '8px'
|
||||
if (chart.customStyle) {
|
||||
const customStyle = JSON.parse(chart.customStyle)
|
||||
@ -224,6 +247,7 @@ export function componentStyle(chart_option, chart) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const getMarginUnit = marginForm => {
|
||||
if (!marginForm.marginModel || marginForm.marginModel === 'auto') return null
|
||||
if (marginForm.marginModel === 'absolute') return 'px'
|
||||
@ -241,6 +265,7 @@ const hexToRgba = (hex, opacity) => {
|
||||
}
|
||||
return rgbaColor
|
||||
}
|
||||
|
||||
export function seniorCfg(chart_option, chart) {
|
||||
if (chart.senior && chart.type && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('mix'))) {
|
||||
const senior = JSON.parse(chart.senior)
|
||||
@ -366,30 +391,6 @@ export function seniorCfg(chart_option, chart) {
|
||||
}
|
||||
}
|
||||
|
||||
const xFormatter = function(value) {
|
||||
if (!xAxisLabelFormatter) {
|
||||
return valueFormatter(value, formatterItem)
|
||||
} else {
|
||||
return valueFormatter(value, xAxisLabelFormatter)
|
||||
}
|
||||
}
|
||||
|
||||
const yFormatter = function(value) {
|
||||
if (!yAxisLabelFormatter) {
|
||||
return valueFormatter(value, formatterItem)
|
||||
} else {
|
||||
return valueFormatter(value, yAxisLabelFormatter)
|
||||
}
|
||||
}
|
||||
|
||||
const yExtFormatter = function(value) {
|
||||
if (!yExtAxisLabelFormatter) {
|
||||
return valueFormatter(value, formatterItem)
|
||||
} else {
|
||||
return valueFormatter(value, yExtAxisLabelFormatter)
|
||||
}
|
||||
}
|
||||
|
||||
export const reverseColor = colorValue => {
|
||||
colorValue = '0x' + colorValue.replace(/#/g, '')
|
||||
const str = '000000' + (0xFFFFFF - colorValue).toString(16)
|
||||
|
||||
@ -1,385 +0,0 @@
|
||||
<template>
|
||||
<div class="kettle-setting">
|
||||
<deBtn
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="create(undefined)"
|
||||
>{{
|
||||
$t("kettle.add")
|
||||
}}</deBtn>
|
||||
<div class="table-box">
|
||||
<grid-table
|
||||
:table-data="data"
|
||||
:pagination="paginationConfig"
|
||||
@size-change="sizeChange"
|
||||
@current-change="currentChange"
|
||||
>
|
||||
<el-table-column
|
||||
prop="configuration.carte"
|
||||
:label="$t('kettle.carte')"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="configuration.port"
|
||||
:label="$t('kettle.port')"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="status"
|
||||
:label="$t('kettle.status')"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span
|
||||
v-if="scope.row.status === 'Error'"
|
||||
class="de-tag"
|
||||
style="color: #646a73; background: rgba(31, 35, 41, 0.1)"
|
||||
>{{ $t("datasource.invalid") }}</span>
|
||||
<span
|
||||
v-if="scope.row.status === 'Success'"
|
||||
class="de-tag"
|
||||
style="color: green; background: rgba(52, 199, 36, 0.2)"
|
||||
>{{ $t("datasource.valid") }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
slot="__operation"
|
||||
:label="$t('commons.operating')"
|
||||
fixed="right"
|
||||
width="168"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
class="text-btn"
|
||||
type="text"
|
||||
@click="create(scope.row)"
|
||||
>{{ $t("commons.edit") }}</el-button>
|
||||
<el-button
|
||||
class="text-btn"
|
||||
type="text"
|
||||
@click="validateById(scope.row)"
|
||||
>{{ $t("commons.validate") }}</el-button>
|
||||
<el-button
|
||||
class="text-btn"
|
||||
type="text"
|
||||
@click="del(scope.row)"
|
||||
>{{
|
||||
$t("commons.delete")
|
||||
}}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</grid-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="edit_dialog_title"
|
||||
:visible="show_dialog"
|
||||
:before-close="closeDialog"
|
||||
:show-close="true"
|
||||
width="50%"
|
||||
class="dialog-css de-kettle"
|
||||
append-to-body
|
||||
>
|
||||
<el-col>
|
||||
<el-form
|
||||
ref="kettleform"
|
||||
class="de-form-item"
|
||||
:form="form"
|
||||
:model="form"
|
||||
label-width="120px"
|
||||
:rules="rule"
|
||||
>
|
||||
<el-form-item
|
||||
:label="$t('kettle.carte')"
|
||||
prop="configuration.carte"
|
||||
>
|
||||
<el-input
|
||||
v-model="form.configuration.carte"
|
||||
:placeholder="$t('components.enter_kettle_address')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('kettle.port')"
|
||||
prop="configuration.port"
|
||||
>
|
||||
<el-input-number
|
||||
v-model="form.configuration.port"
|
||||
controls-position="right"
|
||||
:placeholder="$t('components.enter_the_port')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('kettle.user')"
|
||||
prop="configuration.user"
|
||||
>
|
||||
<el-input
|
||||
v-model="form.configuration.user"
|
||||
:placeholder="$t('components.one_user_name')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('kettle.passwd')"
|
||||
prop="configuration.passwd"
|
||||
>
|
||||
<dePwd
|
||||
v-model="form.configuration.passwd"
|
||||
:placeholder="$t('components.input_a_password')"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
<div
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
>
|
||||
<deBtn
|
||||
secondary
|
||||
@click="closeDialog"
|
||||
>
|
||||
{{ $t("commons.cancel") }}
|
||||
</deBtn>
|
||||
<deBtn
|
||||
secondary
|
||||
@click="validate()"
|
||||
>{{
|
||||
$t("commons.validate")
|
||||
}}</deBtn>
|
||||
<deBtn
|
||||
type="primary"
|
||||
@click="save()"
|
||||
>{{
|
||||
$t("commons.confirm")
|
||||
}}</deBtn>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
deleteKettle,
|
||||
validate,
|
||||
save,
|
||||
pageList,
|
||||
validateById
|
||||
} from '@/api/system/kettle'
|
||||
import GridTable from '@/components/gridTable/index.vue'
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
|
||||
export default {
|
||||
name: 'KettleSetting',
|
||||
components: { GridTable, dePwd },
|
||||
mixins: [msgCfm],
|
||||
data() {
|
||||
return {
|
||||
paginationConfig: {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
},
|
||||
data: [],
|
||||
show_dialog: false,
|
||||
edit_dialog_title: '',
|
||||
form: {
|
||||
configuration: {
|
||||
carte: '',
|
||||
port: '',
|
||||
user: '',
|
||||
passwd: ''
|
||||
}
|
||||
},
|
||||
rule: {
|
||||
'configuration.carte': [
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('components.address_is_required'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
'configuration.port': [
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('components.port_is_required'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
'configuration.user': [
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('components.name_is_required'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
'configuration.passwd': [
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('components.password_is_required'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.search()
|
||||
},
|
||||
methods: {
|
||||
initSearch() {
|
||||
this.currentChange(1)
|
||||
},
|
||||
currentChange(currentPage) {
|
||||
this.paginationConfig.currentPage = currentPage
|
||||
this.search()
|
||||
},
|
||||
sizeChange(pageSize) {
|
||||
this.paginationConfig.pageSize = pageSize
|
||||
this.paginationConfig.currentPage = 1
|
||||
this.search()
|
||||
},
|
||||
search() {
|
||||
const { currentPage, pageSize } = this.paginationConfig
|
||||
pageList('/kettle/pageList/' + currentPage + '/' + pageSize, {}).then(
|
||||
(response) => {
|
||||
this.data = response.data.listObject
|
||||
this.data.forEach((item) => {
|
||||
item.configuration = JSON.parse(item.configuration)
|
||||
})
|
||||
this.paginationConfig.total = response.data.itemCount
|
||||
}
|
||||
)
|
||||
},
|
||||
del(item) {
|
||||
deleteKettle(item.id).then((response) => {
|
||||
this.initSearch()
|
||||
})
|
||||
},
|
||||
create(item) {
|
||||
if (!item) {
|
||||
this.targetObjs = []
|
||||
this.form = {
|
||||
configuration: { carte: '', port: '', user: '', passwd: '' }
|
||||
}
|
||||
this.edit_dialog_title = this.$t('kettle.add')
|
||||
} else {
|
||||
this.edit_dialog_title = this.$t('commons.edit')
|
||||
this.form = JSON.parse(JSON.stringify(item))
|
||||
}
|
||||
this.show_dialog = true
|
||||
},
|
||||
|
||||
save() {
|
||||
this.$refs.kettleform.validate((valid) => {
|
||||
if (!valid) {
|
||||
return false
|
||||
}
|
||||
const form = JSON.parse(JSON.stringify(this.form))
|
||||
form.configuration = JSON.stringify(form.configuration)
|
||||
save(form).then((res) => {
|
||||
this.show_dialog = false
|
||||
this.openMessageSuccess('commons.save_success')
|
||||
this.initSearch()
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
closeDialog() {
|
||||
this.$refs.kettleform.resetFields()
|
||||
this.show_dialog = false
|
||||
this.form = {
|
||||
configuration: { carte: '', port: '', user: '', passwd: '' }
|
||||
}
|
||||
},
|
||||
|
||||
validate() {
|
||||
this.$refs.kettleform.validate((valid) => {
|
||||
if (valid) {
|
||||
validate(this.form.configuration)
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
this.openMessageSuccess('datasource.validate_success')
|
||||
} else {
|
||||
if (res.message.length < 2500) {
|
||||
this.$error(res.message)
|
||||
} else {
|
||||
this.$error(res.message.substring(0, 2500) + '......')
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$error(res.message)
|
||||
})
|
||||
} else {
|
||||
return
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
validateById(item) {
|
||||
validateById(item.id)
|
||||
.then((res) => {
|
||||
if (res.success) {
|
||||
item.status = res.data.status
|
||||
this.openMessageSuccess('datasource.validate_success')
|
||||
} else {
|
||||
item.status = 'Error'
|
||||
if (res.message.length < 2500) {
|
||||
this.$error(res.message)
|
||||
} else {
|
||||
this.$error(res.message.substring(0, 2500) + '......')
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$error(res.message)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.kettle-setting {
|
||||
height: 100%;
|
||||
.table-box {
|
||||
height: calc(100% - 52px);
|
||||
margin-top: 16px;
|
||||
|
||||
.text-btn {
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
margin-left: 2px;
|
||||
border: none;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
|
||||
.text-btn:hover {
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.de-kettle {
|
||||
.el-input-number {
|
||||
width: 100%;
|
||||
.el-input__inner {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.el-input-number__decrease,
|
||||
.el-input-number__increase {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.de-tag {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 2px;
|
||||
padding: 1px 6px;
|
||||
height: 24px;
|
||||
}
|
||||
</style>
|
||||
@ -1,284 +0,0 @@
|
||||
<template>
|
||||
<el-col class="tree-style">
|
||||
<el-col>
|
||||
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-input
|
||||
v-model="filterText"
|
||||
size="small"
|
||||
:placeholder="$t('commons.search')"
|
||||
prefix-icon="el-icon-search"
|
||||
clearable
|
||||
class="main-area-input"
|
||||
/>
|
||||
|
||||
</el-row>
|
||||
|
||||
<el-col class="custom-tree-container">
|
||||
<div class="block">
|
||||
<el-tree
|
||||
ref="tree"
|
||||
class="filter-tree"
|
||||
:data="treeDatas"
|
||||
:props="defaultProps"
|
||||
:filter-node-method="filterNode"
|
||||
:expand-on-click-node="false"
|
||||
node-key="code"
|
||||
:accordion="true"
|
||||
highlight-current
|
||||
:default-expanded-keys="expandedKeys"
|
||||
@current-change="nodeClick"
|
||||
>
|
||||
<span
|
||||
slot-scope="{ node, data }"
|
||||
class="custom-tree-node father"
|
||||
>
|
||||
<span style="display: flex;flex: 1;width: 0;">
|
||||
|
||||
<span
|
||||
style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"
|
||||
:title="data.name"
|
||||
>{{ node.data.name }}</span>
|
||||
</span>
|
||||
<span
|
||||
v-if="!isChina(data.code)"
|
||||
class="child"
|
||||
>
|
||||
<span @click.stop>
|
||||
<span class="el-dropdown-link">
|
||||
<el-button
|
||||
icon="el-icon-plus"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="addHandler(data, node)"
|
||||
/>
|
||||
</span>
|
||||
</span>
|
||||
<span
|
||||
v-if="!isGlobal(data.code)"
|
||||
style="margin-left: 12px;"
|
||||
@click.stop
|
||||
>
|
||||
<span class="el-dropdown-link">
|
||||
<el-button
|
||||
icon="el-icon-delete"
|
||||
type="text"
|
||||
size="small"
|
||||
@click="removeHandler(data, node)"
|
||||
/>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</div>
|
||||
|
||||
</el-col>
|
||||
|
||||
</el-col>
|
||||
|
||||
</el-col>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { removeMap } from '@/api/map/map'
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
export default {
|
||||
name: 'MapSettingLeft',
|
||||
mixins: [msgCfm],
|
||||
props: {
|
||||
treeDatas: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
filterText: '',
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'name',
|
||||
value: 'id'
|
||||
},
|
||||
expandedKeys: []
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
filterText(val) {
|
||||
this.$refs.tree.filter(val)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
|
||||
filterNode(value, data) {
|
||||
if (!value) return true
|
||||
return data.name.indexOf(value) !== -1
|
||||
},
|
||||
|
||||
nodeClick(data, node) {
|
||||
let parent = null
|
||||
if (node.parent.data instanceof Array) {
|
||||
parent = node.parent.data[0]
|
||||
} else {
|
||||
parent = node.parent.data
|
||||
}
|
||||
const nodeInfo = {
|
||||
code: data.code,
|
||||
name: data.name,
|
||||
pcode: data.pcode,
|
||||
pname: parent.name
|
||||
}
|
||||
this.$emit('show-node-info', this.setStatus(nodeInfo, 'read-only'))
|
||||
},
|
||||
addHandler(data, node) {
|
||||
let form = {
|
||||
pLevel: node.level,
|
||||
pCode: data.code
|
||||
}
|
||||
if (node.level > 4) {
|
||||
this.$error('不支持4级行政级别')
|
||||
form = {}
|
||||
}
|
||||
this.$emit('emit-add', this.setStatus(form, 'add'))
|
||||
},
|
||||
removeHandler(data, node) {
|
||||
let parent = null
|
||||
if (node.parent.data instanceof Array) {
|
||||
parent = node.parent.data[0]
|
||||
} else {
|
||||
parent = node.parent.data
|
||||
}
|
||||
const param = {
|
||||
code: data.code,
|
||||
pcode: parent.code,
|
||||
plevel: node.parent.level,
|
||||
name: data.name
|
||||
}
|
||||
const msg = this.$t('map_setting.cur_node') + '[' + data.name + ']' + this.$t('map_setting.delete_confirm')
|
||||
this.$confirm(msg, '', {
|
||||
confirmButtonText: this.$t('commons.confirm'),
|
||||
cancelButtonText: this.$t('commons.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
removeMap(param).then(res => {
|
||||
this.$store.dispatch('map/setGeo', {
|
||||
key: param.code,
|
||||
value: null
|
||||
}).then(() => {
|
||||
this.$emit('refresh-tree')
|
||||
this.openMessageSuccess('commons.delete_success')
|
||||
})
|
||||
})
|
||||
}).catch(() => {
|
||||
this.$info(this.$t('commons.delete_cancel'))
|
||||
})
|
||||
},
|
||||
setStatus(data, status) {
|
||||
const form = JSON.parse(JSON.stringify(data))
|
||||
return Object.assign(form, {
|
||||
status: status || 'read-only'
|
||||
})
|
||||
},
|
||||
showNewNode(code) {
|
||||
this.$refs.tree.setCurrentKey(code)
|
||||
},
|
||||
isChina(code) {
|
||||
return code && code.startsWith('156')
|
||||
},
|
||||
isGlobal(code) {
|
||||
return code && code.startsWith('000')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-divider--horizontal {
|
||||
margin: 12px 0
|
||||
}
|
||||
|
||||
.search-input {
|
||||
padding: 12px 0;
|
||||
}
|
||||
|
||||
.custom-tree-container{
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.tree-list ::v-deep .el-tree-node__expand-icon.is-leaf{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-right:8px;
|
||||
}
|
||||
|
||||
.custom-tree-node-list {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding:0 8px;
|
||||
}
|
||||
|
||||
.custom-position {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
flex-flow: row nowrap;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.title-css {
|
||||
height: 26px;
|
||||
}
|
||||
|
||||
.title-text {
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
.scene-title{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
.scene-title-name{
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.father .child {
|
||||
visibility: hidden;
|
||||
}
|
||||
.father:hover .child {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
|
||||
.inner-dropdown-menu{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%
|
||||
}
|
||||
.tree-style {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
@ -1,88 +0,0 @@
|
||||
<template>
|
||||
<de-container
|
||||
v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
|
||||
class="de-earth"
|
||||
style="height: calc(100vh - 150px);"
|
||||
>
|
||||
|
||||
<de-aside-container
|
||||
type="mapset"
|
||||
style="height: 100%;"
|
||||
>
|
||||
<map-setting-left
|
||||
ref="map_setting_tree"
|
||||
:tree-datas="treeDatas"
|
||||
@emit-add="emitAdd"
|
||||
@refresh-tree="refreshTree"
|
||||
@show-node-info="loadForm"
|
||||
/>
|
||||
</de-aside-container>
|
||||
|
||||
<de-main-container style="height: 100%;">
|
||||
<map-setting-right
|
||||
ref="map_setting_form"
|
||||
:tree-datas="treeDatas"
|
||||
:status="formStatus"
|
||||
@refresh-tree="refreshTree"
|
||||
/>
|
||||
</de-main-container>
|
||||
</de-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DeMainContainer from '@/components/dataease/DeMainContainer'
|
||||
import DeContainer from '@/components/dataease/DeContainer'
|
||||
import DeAsideContainer from '@/components/dataease/DeAsideContainer'
|
||||
import { areaMapping } from '@/api/map/map'
|
||||
import MapSettingLeft from './MapSettingLeft'
|
||||
import MapSettingRight from './MapSettingRight'
|
||||
export default {
|
||||
name: 'MapSetting',
|
||||
components: { DeMainContainer, DeContainer, DeAsideContainer, MapSettingLeft, MapSettingRight },
|
||||
data() {
|
||||
return {
|
||||
formStatus: 'empty',
|
||||
treeDatas: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadTreeData()
|
||||
},
|
||||
methods: {
|
||||
emitAdd(form) {
|
||||
this.setStatus(form.status)
|
||||
this.$refs && this.$refs['map_setting_form'] && this.$refs['map_setting_form'].emitAdd(form)
|
||||
},
|
||||
|
||||
loadForm(nodeInfo) {
|
||||
this.setStatus(nodeInfo.status)
|
||||
this.$refs && this.$refs['map_setting_form'] && this.$refs['map_setting_form'].loadForm(nodeInfo)
|
||||
},
|
||||
|
||||
setStatus(status) {
|
||||
this.formStatus = status
|
||||
},
|
||||
loadTreeData() {
|
||||
Object.keys(this.treeDatas).length === 0 && areaMapping().then(res => {
|
||||
this.treeDatas = res.data
|
||||
})
|
||||
},
|
||||
refreshTree(node) {
|
||||
areaMapping().then(res => {
|
||||
this.treeDatas = res.data
|
||||
if (node && node.code) {
|
||||
this.$refs && this.$refs['map_setting_tree'] && this.$refs['map_setting_tree'].showNewNode(node.code)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.de-earth {
|
||||
padding: 24px;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
@ -1,145 +0,0 @@
|
||||
<template>
|
||||
<de-layout-content
|
||||
v-loading="$store.getters.loadingMap[$store.getters.currentPath]"
|
||||
>
|
||||
<div class="sys-setting">
|
||||
<el-tabs
|
||||
v-model="activeName"
|
||||
class="de-tabs"
|
||||
>
|
||||
<el-tab-pane
|
||||
:lazy="true"
|
||||
:label="$t('system_parameter_setting.basic_setting')"
|
||||
name="zero"
|
||||
/>
|
||||
|
||||
<el-tab-pane
|
||||
:lazy="true"
|
||||
:label="$t('system_parameter_setting.mailbox_service_settings')"
|
||||
name="first"
|
||||
/>
|
||||
|
||||
<el-tab-pane
|
||||
:lazy="true"
|
||||
:label="$t('sysParams.map')"
|
||||
name="ten"
|
||||
/>
|
||||
|
||||
<el-tab-pane
|
||||
v-if="engineMode === 'simple'"
|
||||
:lazy="true"
|
||||
:label="$t('system_parameter_setting.engine_mode_setting')"
|
||||
name="six"
|
||||
/>
|
||||
|
||||
<el-tab-pane
|
||||
v-if="engineMode === 'cluster'"
|
||||
:lazy="true"
|
||||
:label="$t('system_parameter_setting.engine_mode_setting')"
|
||||
name="seven"
|
||||
/>
|
||||
|
||||
<el-tab-pane
|
||||
v-if="engineMode === 'cluster'"
|
||||
:lazy="true"
|
||||
:label="$t('system_parameter_setting.kettle_setting')"
|
||||
name="eight"
|
||||
/>
|
||||
</el-tabs>
|
||||
<div
|
||||
class="tabs-container"
|
||||
:class="[activeName !== 'eight' ? 'is-center' : 'pad-center']"
|
||||
>
|
||||
<div class="min-w600">
|
||||
<basic-setting
|
||||
v-if="activeName === 'zero'"
|
||||
:is-plugin-loaded="isPluginLoaded"
|
||||
/>
|
||||
<email-setting v-if="activeName === 'first'" />
|
||||
<map-setting
|
||||
v-if="activeName === 'ten'"
|
||||
ref="mapSetting"
|
||||
/>
|
||||
<simple-mode v-if="activeName === 'six'" />
|
||||
<cluster-mode v-if="activeName === 'seven'" />
|
||||
<kettle-setting v-if="activeName === 'eight'" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</de-layout-content>
|
||||
</template>
|
||||
<script>
|
||||
import BasicSetting from './BasicSetting'
|
||||
import MapSetting from './MapSetting'
|
||||
import EmailSetting from './EmailSetting'
|
||||
import SimpleMode from './SimpleModeSetting'
|
||||
import ClusterMode from './ClusterModeSetting'
|
||||
import KettleSetting from './KettleSetting'
|
||||
import DeLayoutContent from '@/components/business/DeLayoutContent'
|
||||
import { pluginLoaded } from '@/api/user'
|
||||
import { engineMode } from '@/api/system/engine'
|
||||
export default {
|
||||
components: {
|
||||
BasicSetting,
|
||||
EmailSetting,
|
||||
DeLayoutContent,
|
||||
SimpleMode,
|
||||
ClusterMode,
|
||||
KettleSetting,
|
||||
MapSetting
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: 'zero',
|
||||
isPluginLoaded: false,
|
||||
engineMode: 'local'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
beforeCreate() {
|
||||
pluginLoaded().then((res) => {
|
||||
this.isPluginLoaded = res.success && res.data
|
||||
})
|
||||
engineMode().then((res) => {
|
||||
this.engineMode = res.data
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handlerBtn(btn) {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.sys-setting {
|
||||
height: 100%;
|
||||
background-color: var(--MainBG, #f5f6f7);
|
||||
|
||||
.tabs-container {
|
||||
height: calc(100% - 48px);
|
||||
background: var(--ContentBG, #ffffff);
|
||||
overflow-x: auto;
|
||||
|
||||
.min-w600 {
|
||||
min-width: 600px;
|
||||
height: 100%;
|
||||
& > :nth-child(1) {
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-center {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 20px 20px 20px;
|
||||
}
|
||||
|
||||
.pad-center {
|
||||
padding: 24px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,36 +0,0 @@
|
||||
<template>
|
||||
<div class="operater-bar">
|
||||
<p class="title">{{ $t(title) }}</p>
|
||||
<div class="btn-grounp">
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.operater-bar {
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.title {
|
||||
font-family: PingFang SC;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
line-height: 24px;
|
||||
color: #1f2329;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,355 +0,0 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
<div class="el-drawer__body-cont">
|
||||
<div class="filter">
|
||||
<span>{{ $t("dataset.datalist") }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
v-for="ele in selectDatasetsCahe"
|
||||
:key="ele.id"
|
||||
class="item"
|
||||
:class="[activeDataset.includes(ele.id) ? 'active' : '']"
|
||||
@click="activeDatasetChange(ele.id)"
|
||||
>{{ ele.name }}</span>
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
popper-class="user-popper"
|
||||
width="200"
|
||||
trigger="click"
|
||||
>
|
||||
<el-popover
|
||||
v-loading="treeLoading"
|
||||
placement="bottom"
|
||||
popper-class="user-popper dept"
|
||||
width="200"
|
||||
trigger="click"
|
||||
>
|
||||
<el-tree
|
||||
ref="datasetTreeRef"
|
||||
current-node-key="id"
|
||||
:data="treeData"
|
||||
node-key="id"
|
||||
highlight-current
|
||||
:filter-node-method="filterNode"
|
||||
:expand-on-click-node="true"
|
||||
@node-click="nodeClick"
|
||||
>
|
||||
<span
|
||||
slot-scope="{ data }"
|
||||
class="custom-tree-node"
|
||||
>
|
||||
<span v-if="data.modelInnerType === 'group'">
|
||||
<svg-icon icon-class="scene" />
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span>
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>
|
||||
<svg-icon
|
||||
:icon-class="`ds-${data.modelInnerType}`"
|
||||
:class="`ds-icon-${data.modelInnerType}`"
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
|
||||
<el-select
|
||||
ref="datasetSelect"
|
||||
slot="reference"
|
||||
v-model="selectDatasets"
|
||||
popper-class="tree-select"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
value-key="id"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in selectDatasets"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
</el-popover>
|
||||
<span
|
||||
slot="reference"
|
||||
class="more"
|
||||
>+ {{ $t("panel.more") }}</span>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-for="ele in filterDataset"
|
||||
:key="ele.name"
|
||||
class="filter"
|
||||
>
|
||||
<span>{{ $t(ele.name) }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
v-for="item in ele.list"
|
||||
:key="item.name"
|
||||
class="item"
|
||||
:class="[active[ele.activeType].includes(item.value) ? 'active' : '']"
|
||||
@click="statusChange(item.value, ele.activeType)"
|
||||
>{{ $t(item.name) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter">
|
||||
<span>{{ $t("dedaterange.label") }}</span>
|
||||
<div class="filter-item">
|
||||
<DeDatePick v-model="dataRange" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<el-button
|
||||
class="btn normal"
|
||||
@click="reset"
|
||||
>{{
|
||||
$t("commons.reset")
|
||||
}}</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
class="btn"
|
||||
@click="search"
|
||||
>{{
|
||||
$t("commons.adv_search.search")
|
||||
}}</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { filterDataset, dateFormat } from './options'
|
||||
import { queryAuthModel } from '@/api/authModel/authModel'
|
||||
import DeDatePick from '@/components/deCustomCm/deDatePick.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
DeDatePick
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
treeLoading: false,
|
||||
dataRange: [],
|
||||
selectDatasets: [],
|
||||
datasetCahe: [],
|
||||
activeDataset: [],
|
||||
selectDatasetsCahe: [],
|
||||
treeData: [],
|
||||
filterDataset,
|
||||
active: {
|
||||
execStatus: [],
|
||||
status: [],
|
||||
rate: []
|
||||
},
|
||||
userDrawer: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.treeNode()
|
||||
},
|
||||
methods: {
|
||||
treeNode() {
|
||||
this.treeLoading = true
|
||||
queryAuthModel(
|
||||
{
|
||||
modelType: 'dataset',
|
||||
privileges: 'manage',
|
||||
datasetMode: 1,
|
||||
clearEmptyDir: true,
|
||||
mode: 1,
|
||||
modelInnerTypeArray: ['db', 'sql', 'api', 'group']
|
||||
},
|
||||
true
|
||||
)
|
||||
.then((res) => {
|
||||
this.treeData = res.data
|
||||
})
|
||||
.finally(() => {
|
||||
this.treeLoading = false
|
||||
})
|
||||
},
|
||||
nodeClick(data) {
|
||||
const { id, name, modelInnerType: type } = data
|
||||
if (type === 'group') return
|
||||
this.handleNodeClick(id, name)
|
||||
},
|
||||
filterNode(value, data) {
|
||||
if (!value) return true
|
||||
return !this.activeDataset.includes(data.id)
|
||||
},
|
||||
clearFilter() {
|
||||
this.active = {
|
||||
execStatus: [],
|
||||
status: [],
|
||||
rate: []
|
||||
}
|
||||
this.dataRange = []
|
||||
this.activeDataset = []
|
||||
this.selectDatasets = []
|
||||
this.datasetCahe = []
|
||||
this.selectDatasetsCahe = []
|
||||
this.$refs.datasetTreeRef.filter()
|
||||
this.$emit('search', [], [])
|
||||
},
|
||||
clearOneFilter(index) {
|
||||
(this.filterTextMap[index] || []).forEach((ele) => {
|
||||
const eleKey = ele.split('.')
|
||||
if (eleKey.length === 2) {
|
||||
const [p, c] = eleKey
|
||||
this[p][c] = []
|
||||
} else {
|
||||
this[ele] = []
|
||||
}
|
||||
if (ele === 'activeDataset') {
|
||||
this.$refs.datasetTreeRef.filter()
|
||||
}
|
||||
})
|
||||
},
|
||||
statusChange(value, type) {
|
||||
const statusIndex = this.active[type].findIndex((ele) => ele === value)
|
||||
if (statusIndex === -1) {
|
||||
this.active[type].push(value)
|
||||
} else {
|
||||
this.active[type].splice(statusIndex, 1)
|
||||
}
|
||||
},
|
||||
handleNodeClick(id, name) {
|
||||
const datasetIdx = this.selectDatasets.findIndex((ele) => ele.id === id)
|
||||
if (datasetIdx !== -1) {
|
||||
this.selectDatasets.splice(datasetIdx, 1)
|
||||
}
|
||||
this.activeDataset.push(id)
|
||||
this.selectDatasetsCahe.push({ id, name })
|
||||
this.datasetCahe.push({ id, name })
|
||||
this.$refs.datasetTreeRef.filter(id)
|
||||
},
|
||||
activeDatasetChange(id) {
|
||||
const dataset = this.datasetCahe.find((ele) => ele.id === id)
|
||||
this.selectDatasets.push(dataset)
|
||||
this.activeDataset = this.activeDataset.filter((ele) => ele !== id)
|
||||
this.datasetCahe = this.datasetCahe.filter(
|
||||
(ele) => ele.id !== id
|
||||
)
|
||||
this.selectDatasetsCahe = this.selectDatasetsCahe.filter(
|
||||
(ele) => ele.id !== id
|
||||
)
|
||||
this.$refs.datasetTreeRef.filter(true)
|
||||
},
|
||||
search() {
|
||||
this.userDrawer = false
|
||||
this.$emit('search', this.formatCondition(), this.formatText())
|
||||
},
|
||||
formatText() {
|
||||
this.filterTextMap = []
|
||||
const params = []
|
||||
if (this.activeDataset.length) {
|
||||
const str = `${this.$t('dataset.datalist')}:${this.activeDataset.reduce(
|
||||
(pre, next) =>
|
||||
(this.datasetCahe.find((ele) => ele.id === next) || {}).name +
|
||||
'、' +
|
||||
pre,
|
||||
''
|
||||
)}`
|
||||
params.push(str.slice(0, str.length - 1))
|
||||
this.filterTextMap.push([
|
||||
'activeDataset',
|
||||
'selectDatasets',
|
||||
'selectDatasetsCahe',
|
||||
'datasetCahe'
|
||||
])
|
||||
}
|
||||
[
|
||||
'dataset.execute_rate',
|
||||
'dataset.task.task_status',
|
||||
'dataset.task.last_exec_status'
|
||||
].forEach((ele, index) => {
|
||||
const { activeType: type, list } =
|
||||
this.filterDataset[index]
|
||||
if (this.active[type].length) {
|
||||
params.push(
|
||||
`${this.$t(ele)}:${this.active[type]
|
||||
.map((item) => this.$t(list.find((itx) => itx.value === item).name))
|
||||
.join('、')}`
|
||||
)
|
||||
this.filterTextMap.push([`active.${type}`])
|
||||
}
|
||||
})
|
||||
if (this.dataRange.length) {
|
||||
params.push(
|
||||
`${this.$t('dedaterange.label')}:${this.dataRange
|
||||
.map((ele) => {
|
||||
return dateFormat('YYYY-mm-dd', ele)
|
||||
})
|
||||
.join('-')}`
|
||||
)
|
||||
this.filterTextMap.push(['dataRange'])
|
||||
}
|
||||
return params
|
||||
},
|
||||
formatCondition() {
|
||||
const fildMap = {
|
||||
'dataset_table_task.rate': this.active.rate,
|
||||
'dataset_table_task.status': this.active.status,
|
||||
'dataset_table_task.last_exec_status': this.active.execStatus,
|
||||
'dataset_table.id': this.activeDataset
|
||||
}
|
||||
const conditions = []
|
||||
Object.keys(fildMap).forEach((ele) => {
|
||||
if (fildMap[ele].length) {
|
||||
conditions.push({
|
||||
field: ele,
|
||||
operator: 'in',
|
||||
value: fildMap[ele]
|
||||
})
|
||||
}
|
||||
})
|
||||
// eslint-disable-next-line
|
||||
let [min, max] = this.dataRange
|
||||
if (min && max) {
|
||||
if (+min === +max) {
|
||||
max = +max + 24 * 3600 * 1000
|
||||
}
|
||||
conditions.push({
|
||||
field: 'dataset_table_task.last_exec_time',
|
||||
operator: 'between',
|
||||
value: [+min, +max]
|
||||
})
|
||||
}
|
||||
return conditions
|
||||
},
|
||||
init() {
|
||||
this.userDrawer = true
|
||||
},
|
||||
reset() {
|
||||
this.clearFilter()
|
||||
this.userDrawer = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,349 +0,0 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
<div class="el-drawer__body-cont">
|
||||
<div class="filter">
|
||||
<span>{{ $t("dataset.datalist") }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
v-for="ele in selectDatasetsCahe"
|
||||
:key="ele.id"
|
||||
class="item"
|
||||
:class="[activeDataset.includes(ele.id) ? 'active' : '']"
|
||||
@click="activeDatasetChange(ele.id)"
|
||||
>{{ ele.name }}</span>
|
||||
<el-popover
|
||||
placement="bottom"
|
||||
popper-class="user-popper"
|
||||
width="200"
|
||||
trigger="click"
|
||||
>
|
||||
<el-popover
|
||||
v-loading="treeLoading"
|
||||
placement="bottom"
|
||||
popper-class="user-popper dept"
|
||||
width="200"
|
||||
trigger="click"
|
||||
>
|
||||
<el-tree
|
||||
ref="datasetTreeRef"
|
||||
current-node-key="id"
|
||||
:data="treeData"
|
||||
node-key="id"
|
||||
highlight-current
|
||||
:filter-node-method="filterNode"
|
||||
:expand-on-click-node="true"
|
||||
@node-click="nodeClick"
|
||||
>
|
||||
<span
|
||||
slot-scope="{ data }"
|
||||
class="custom-tree-node"
|
||||
>
|
||||
<span v-if="data.modelInnerType === 'group'">
|
||||
<svg-icon icon-class="scene" />
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span>
|
||||
</span>
|
||||
<span v-else>
|
||||
<span>
|
||||
<svg-icon
|
||||
:icon-class="`ds-${data.modelInnerType}`"
|
||||
:class="`ds-icon-${data.modelInnerType}`"
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
|
||||
<el-select
|
||||
ref="datasetSelect"
|
||||
slot="reference"
|
||||
v-model="selectDatasets"
|
||||
popper-class="tree-select"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
value-key="id"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in selectDatasets"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
</el-popover>
|
||||
<span
|
||||
slot="reference"
|
||||
class="more"
|
||||
>+ {{ $t("panel.more") }}</span>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-for="ele in filterDataset"
|
||||
:key="ele.name"
|
||||
class="filter"
|
||||
>
|
||||
<span>{{ $t(ele.name) }}</span>
|
||||
<div class="filter-item">
|
||||
<span
|
||||
v-for="item in ele.list"
|
||||
:key="item.name"
|
||||
class="item"
|
||||
:class="[
|
||||
active[ele.activeType].includes(item.value) ? 'active' : '',
|
||||
]"
|
||||
@click="statusChange(item.value, ele.activeType)"
|
||||
>{{ $t(item.name) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="filter">
|
||||
<span>{{ $t("dedaterange.label") }}</span>
|
||||
<div class="filter-item">
|
||||
<DeDatePick v-model="dataRange" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<el-button
|
||||
class="btn normal"
|
||||
@click="reset"
|
||||
>{{
|
||||
$t("commons.reset")
|
||||
}}</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
class="btn"
|
||||
@click="search"
|
||||
>{{
|
||||
$t("commons.adv_search.search")
|
||||
}}</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { filterDatasetRecord, dateFormat } from './options'
|
||||
import { queryAuthModel } from '@/api/authModel/authModel'
|
||||
import DeDatePick from '@/components/deCustomCm/deDatePick.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
DeDatePick
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
treeLoading: false,
|
||||
filterTextMap: [],
|
||||
dataRange: [],
|
||||
selectDatasets: [],
|
||||
datasetCahe: [],
|
||||
activeDataset: [],
|
||||
selectDatasetsCahe: [],
|
||||
treeData: [],
|
||||
filterDataset: [filterDatasetRecord],
|
||||
active: {
|
||||
execStatus: []
|
||||
},
|
||||
userDrawer: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.treeNode()
|
||||
},
|
||||
methods: {
|
||||
treeNode() {
|
||||
this.treeLoading = true
|
||||
queryAuthModel(
|
||||
{
|
||||
modelType: 'dataset',
|
||||
privileges: 'manage',
|
||||
datasetMode: 1,
|
||||
clearEmptyDir: true,
|
||||
mode: 1,
|
||||
modelInnerTypeArray: ['db', 'sql', 'api', 'group']
|
||||
},
|
||||
true
|
||||
)
|
||||
.then((res) => {
|
||||
this.treeData = res.data
|
||||
})
|
||||
.finally(() => {
|
||||
this.treeLoading = false
|
||||
})
|
||||
},
|
||||
nodeClick(data) {
|
||||
const { id, name, modelInnerType: type } = data
|
||||
if (type === 'group') return
|
||||
this.handleNodeClick(id, name)
|
||||
},
|
||||
filterNode(value, data) {
|
||||
if (!value) return true
|
||||
return !this.activeDataset.includes(data.id)
|
||||
},
|
||||
clearFilter() {
|
||||
this.active = {
|
||||
execStatus: []
|
||||
}
|
||||
this.dataRange = []
|
||||
this.activeDataset = []
|
||||
this.selectDatasets = []
|
||||
this.datasetCahe = []
|
||||
this.selectDatasetsCahe = []
|
||||
this.$refs.datasetTreeRef.filter()
|
||||
this.$emit('search', [], [])
|
||||
},
|
||||
clearOneFilter(index) {
|
||||
(this.filterTextMap[index] || []).forEach((ele) => {
|
||||
const eleKey = ele.split('.')
|
||||
if (eleKey.length === 2) {
|
||||
const [p, c] = eleKey
|
||||
this[p][c] = []
|
||||
} else {
|
||||
this[ele] = []
|
||||
}
|
||||
if (ele === 'activeDataset') {
|
||||
this.$refs.datasetTreeRef.filter()
|
||||
}
|
||||
})
|
||||
},
|
||||
statusChange(value, type) {
|
||||
const statusIndex = this.active[type].findIndex((ele) => ele === value)
|
||||
if (statusIndex === -1) {
|
||||
this.active[type].push(value)
|
||||
} else {
|
||||
this.active[type].splice(statusIndex, 1)
|
||||
}
|
||||
},
|
||||
handleNodeClick(id, name) {
|
||||
const datasetIdx = this.selectDatasets.findIndex((ele) => ele.id === id)
|
||||
if (datasetIdx !== -1) {
|
||||
this.selectDatasets.splice(datasetIdx, 1)
|
||||
}
|
||||
this.activeDataset.push(id)
|
||||
this.selectDatasetsCahe.push({ id, name })
|
||||
this.datasetCahe.push({ id, name })
|
||||
this.$refs.datasetTreeRef.filter(id)
|
||||
},
|
||||
activeDatasetChange(id) {
|
||||
const dataset = this.datasetCahe.find((ele) => ele.id === id)
|
||||
this.selectDatasets.push(dataset)
|
||||
this.activeDataset = this.activeDataset.filter((ele) => ele !== id)
|
||||
this.datasetCahe = this.datasetCahe.filter(
|
||||
(ele) => ele.id !== id
|
||||
)
|
||||
this.selectDatasetsCahe = this.selectDatasetsCahe.filter(
|
||||
(ele) => ele.id !== id
|
||||
)
|
||||
this.$refs.datasetTreeRef.filter(true)
|
||||
},
|
||||
search() {
|
||||
this.userDrawer = false
|
||||
this.$emit('search', this.formatCondition(), this.formatText())
|
||||
},
|
||||
formatText() {
|
||||
this.filterTextMap = []
|
||||
const params = []
|
||||
if (this.activeDataset.length) {
|
||||
const str = `${this.$t('dataset.datalist')}:${this.activeDataset.reduce(
|
||||
(pre, next) =>
|
||||
(this.datasetCahe.find((ele) => ele.id === next) || {}).name +
|
||||
'、' +
|
||||
pre,
|
||||
''
|
||||
)}`
|
||||
params.push(str.slice(0, str.length - 1))
|
||||
this.filterTextMap.push([
|
||||
'activeDataset',
|
||||
'selectDatasets',
|
||||
'selectDatasetsCahe',
|
||||
'datasetCahe'
|
||||
])
|
||||
}
|
||||
['dataset.task.last_exec_status'].forEach((ele, index) => {
|
||||
const { activeType: type, list } = this.filterDataset[index]
|
||||
if (this.active[type].length) {
|
||||
params.push(
|
||||
`${this.$t(ele)}:${this.active[type]
|
||||
.map((item) =>
|
||||
this.$t(list.find((itx) => itx.value === item).name)
|
||||
)
|
||||
.join('、')}`
|
||||
)
|
||||
this.filterTextMap.push([`active.${type}`])
|
||||
}
|
||||
})
|
||||
if (this.dataRange.length) {
|
||||
params.push(
|
||||
`${this.$t('dedaterange.label')}:${this.dataRange
|
||||
.map((ele) => {
|
||||
return dateFormat('YYYY-mm-dd', ele)
|
||||
})
|
||||
.join('-')}`
|
||||
)
|
||||
this.filterTextMap.push(['dataRange'])
|
||||
}
|
||||
return params
|
||||
},
|
||||
formatCondition() {
|
||||
const fildMap = {
|
||||
'dataset_table_task.last_exec_status': this.active.execStatus,
|
||||
'dataset_table.id': this.activeDataset
|
||||
}
|
||||
const conditions = []
|
||||
Object.keys(fildMap).forEach((ele) => {
|
||||
if (fildMap[ele].length) {
|
||||
conditions.push({
|
||||
field: ele,
|
||||
operator: 'in',
|
||||
value: fildMap[ele]
|
||||
})
|
||||
}
|
||||
})
|
||||
// eslint-disable-next-line
|
||||
let [min, max] = this.dataRange
|
||||
if (min && max) {
|
||||
if (+min === +max) {
|
||||
max = +max + 24 * 3600 * 1000
|
||||
}
|
||||
conditions.push({
|
||||
field: 'dataset_table_task.last_exec_time',
|
||||
operator: 'between',
|
||||
value: [+min, +max]
|
||||
})
|
||||
}
|
||||
return conditions
|
||||
},
|
||||
init() {
|
||||
this.userDrawer = true
|
||||
},
|
||||
reset() {
|
||||
this.clearFilter()
|
||||
this.userDrawer = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,144 +0,0 @@
|
||||
<template>
|
||||
<layout-content>
|
||||
<div style="width: 100%;display: flex;justify-content: center;">
|
||||
<el-card class="box-card about-card">
|
||||
<div class="form-header">
|
||||
<span>{{ $t('user.change_password') }}</span>
|
||||
</div>
|
||||
<el-form
|
||||
ref="createUserForm"
|
||||
:model="form"
|
||||
:rules="rule"
|
||||
size="small"
|
||||
label-width="auto"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item
|
||||
:label="$t('user.origin_passwd')"
|
||||
prop="oldPwd"
|
||||
>
|
||||
<dePwd
|
||||
v-model="form.oldPwd"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('user.new_passwd')"
|
||||
prop="newPwd"
|
||||
>
|
||||
<dePwd
|
||||
v-model="form.newPwd"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('user.confirm_passwd')"
|
||||
prop="repeatPwd"
|
||||
>
|
||||
<dePwd
|
||||
v-model="form.repeatPwd"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="save"
|
||||
>{{ $t('commons.confirm') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</layout-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LayoutContent from '@/components/business/LayoutContent'
|
||||
import { updatePersonPwd } from '@/api/system/user'
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
export default {
|
||||
|
||||
components: { LayoutContent, dePwd },
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
|
||||
},
|
||||
rule: {
|
||||
|
||||
oldPwd: [
|
||||
{ required: true, message: this.$t('user.input_password'), trigger: 'blur' }
|
||||
],
|
||||
newPwd: [
|
||||
{ required: true, message: this.$t('user.input_password'), trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
|
||||
message: this.$t('member.password_format_is_incorrect'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
repeatPwd: [
|
||||
{ required: true, message: this.$t('user.input_password'), trigger: 'blur' },
|
||||
{ required: true, trigger: 'blur', validator: this.repeatValidator }
|
||||
]
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('app/toggleSideBarHide', true)
|
||||
})
|
||||
},
|
||||
created() {
|
||||
this.$store.dispatch('app/toggleSideBarHide', true)
|
||||
},
|
||||
methods: {
|
||||
repeatValidator(rule, value, callback) {
|
||||
if (value !== this.form.newPwd) {
|
||||
callback(new Error(this.$t('member.inconsistent_passwords')))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
|
||||
save() {
|
||||
this.$refs.createUserForm.validate(valid => {
|
||||
if (valid) {
|
||||
const param = {
|
||||
password: this.form.oldPwd,
|
||||
newPassword: this.form.newPwd
|
||||
}
|
||||
updatePersonPwd(param).then(res => {
|
||||
this.$success(this.$t('commons.save_success'))
|
||||
this.logout()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
async logout() {
|
||||
await this.$store.dispatch('user/logout')
|
||||
this.$router.push('/')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.about-card {
|
||||
background: inherit;
|
||||
margin-top: 5%;
|
||||
flex-direction: row;
|
||||
width: 640px;
|
||||
min-width: 640px;
|
||||
height: auto;
|
||||
position: relative;
|
||||
::v-deep div.el-card__header {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.form-header {
|
||||
line-height: 60px;
|
||||
font-size: 18px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user