forked from github/dataease
fix: 数据集优化
This commit is contained in:
dataeaseShu
parent
505fb1cdd7
commit
1fc262ddad
@ -1436,7 +1436,7 @@ export default {
|
||||
field_rename: 'Rename Field',
|
||||
params_work: 'Effective only when editing SQL',
|
||||
sql_variable_limit_1: '1、SQL variables can only be used in where conditions',
|
||||
sql_variable_limit_2: '2、Example：select * from table_name where column_name1=${parm_name1} and column_name2 in ${parm_name2}',
|
||||
sql_variable_limit_2: "2、Example：select * from table_name where column_name1='${parm_name1}' and column_name2 in '${parm_name2}'",
|
||||
select_year: 'Select Year',
|
||||
select_month: 'Select Month',
|
||||
select_date: 'Select Date',
|
||||
|
||||
@ -1436,7 +1436,7 @@ export default {
|
||||
field_rename: '字段重命名',
|
||||
params_work: '僅在編輯 sql 時生效',
|
||||
sql_variable_limit_1: '1、SQL變數只能在WHERE條件中使用',
|
||||
sql_variable_limit_2: '2、示例：select * from table_name where column_name1=${parm_name1} and column_name2 in ${parm_name2}',
|
||||
sql_variable_limit_2: "2、示例：select * from table_name where column_name1='${parm_name1}' and column_name2 in '${parm_name2}'",
|
||||
selesql_variable_limit_2ct_year: '選擇年',
|
||||
select_month: '選擇月',
|
||||
select_date: '選擇日期',
|
||||
|
||||
@ -1436,7 +1436,7 @@ export default {
|
||||
params_work: '仅在编辑sql时生效',
|
||||
select_year: '选择年',
|
||||
sql_variable_limit_1: '1、SQL 变量只能在 WHERE 条件中使用',
|
||||
sql_variable_limit_2: '2、示例：select * from table_name where column_name1=${parm_name1} and column_name2 in ${parm_name2} ',
|
||||
sql_variable_limit_2: "2、示例：select * from table_name where column_name1='${parm_name1}' and column_name2 in '${parm_name2}'",
|
||||
select_month: '选择月',
|
||||
select_date: '选择日期',
|
||||
select_time: '选择时间',
|
||||
|
||||
@ -871,7 +871,7 @@ export default {
|
||||
border-radius: 4px;
|
||||
background: #e1eaff;
|
||||
position: relative;
|
||||
padding: 9px 19px 9px 40px;
|
||||
padding: 9px 0 9px 40px;
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
|
||||
@ -60,6 +60,16 @@
|
||||
:class="`ds-icon-${data.modelInnerType}`"
|
||||
/>
|
||||
</span>
|
||||
<span v-if="['db', 'sql'].includes(data.modelInnerType)">
|
||||
<span
|
||||
v-if="data.mode === 0"
|
||||
style="margin-left: 6px"
|
||||
><i class="el-icon-s-operation" /></span>
|
||||
<span
|
||||
v-if="data.mode === 1"
|
||||
style="margin-left: 6px"
|
||||
><i class="el-icon-alarm-clock" /></span>
|
||||
</span>
|
||||
<span
|
||||
style="
|
||||
margin-left: 6px;
|
||||
@ -247,16 +257,18 @@ export default {
|
||||
modelInnerTypeArray: this.customType
|
||||
},
|
||||
!userCache
|
||||
).then((res) => {
|
||||
if (cache) {
|
||||
localStorage.setItem('dataset-tree', JSON.stringify(res.data))
|
||||
}
|
||||
if (!userCache) {
|
||||
this.treeData = res.data
|
||||
}
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
)
|
||||
.then((res) => {
|
||||
if (cache) {
|
||||
localStorage.setItem('dataset-tree', JSON.stringify(res.data))
|
||||
}
|
||||
if (!userCache) {
|
||||
this.treeData = res.data
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
nodeClick(data, node) {
|
||||
if (data.modelInnerType !== 'group') {
|
||||
|
||||
985
frontend/src/views/dataset/data/UpdateRecords.vue
Normal file
985
frontend/src/views/dataset/data/UpdateRecords.vue
Normal file
@ -0,0 +1,985 @@
|
||||
<template>
|
||||
<el-col>
|
||||
<el-row>
|
||||
<el-button
|
||||
v-if="hasDataPermission('manage',param.privileges) && enableUpdate"
|
||||
icon="el-icon-setting"
|
||||
size="mini"
|
||||
@click="showConfig"
|
||||
>
|
||||
{{ $t('dataset.update_setting') }}
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="el-icon-refresh"
|
||||
size="mini"
|
||||
@click="refreshLog"
|
||||
>
|
||||
{{ $t('commons.refresh') }}
|
||||
</el-button>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 10px;">
|
||||
<el-table
|
||||
size="mini"
|
||||
:data="taskLogData"
|
||||
border
|
||||
:height="height"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
:label="$t('dataset.task_name')"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="startTime"
|
||||
:label="$t('dataset.start_time')"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.startTime | timestampFormatDate }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="endTime"
|
||||
:label="$t('dataset.end_time')"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.endTime | timestampFormatDate }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="status"
|
||||
:label="$t('dataset.status')"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span
|
||||
v-if="scope.row.status === 'Completed'"
|
||||
style="color: green"
|
||||
>{{ $t('dataset.completed') }}</span>
|
||||
<span
|
||||
v-if="scope.row.status === 'Underway'"
|
||||
class="blue-color"
|
||||
>
|
||||
<i class="el-icon-loading" />
|
||||
{{ $t('dataset.underway') }}
|
||||
</span>
|
||||
<span
|
||||
v-if="scope.row.status === 'Error'"
|
||||
style="color: red"
|
||||
>
|
||||
<el-link
|
||||
type="danger"
|
||||
style="font-size: 12px"
|
||||
@click="showErrorMassage(scope.row.info)"
|
||||
>{{ $t('dataset.error') }}</el-link>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row style="margin-top: 10px;text-align: right;">
|
||||
<el-pagination
|
||||
:current-page="page.currentPage"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:page-size="page.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="page.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</el-row>
|
||||
</el-row>
|
||||
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="$t('dataset.detail')"
|
||||
:visible="show_error_massage"
|
||||
:show-close="false"
|
||||
width="50%"
|
||||
class="dialog-css"
|
||||
>
|
||||
<span class="err-msg">{{ error_massage }}
|
||||
</span>
|
||||
<span
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
>
|
||||
<el-button
|
||||
size="mini"
|
||||
@click="show_error_massage = false"
|
||||
>{{ $t('dataset.close') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="table.name+' '+$t('dataset.update_setting')"
|
||||
:visible="update_setting"
|
||||
:show-close="false"
|
||||
width="50%"
|
||||
class="dialog-css"
|
||||
>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="update_task_dialog_title"
|
||||
:visible="update_task"
|
||||
:show-close="false"
|
||||
width="50%"
|
||||
class="dialog-css"
|
||||
append-to-body
|
||||
>
|
||||
<el-col>
|
||||
<el-form
|
||||
ref="taskForm"
|
||||
:form="taskForm"
|
||||
:model="taskForm"
|
||||
label-width="100px"
|
||||
size="mini"
|
||||
:rules="taskFormRules"
|
||||
>
|
||||
<el-form-item
|
||||
:label="$t('dataset.task_name')"
|
||||
prop="name"
|
||||
>
|
||||
<el-input
|
||||
v-model="taskForm.name"
|
||||
size="mini"
|
||||
style="width: 50%"
|
||||
:placeholder="$t('dataset.task_name')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('dataset.update_type')"
|
||||
prop="type"
|
||||
>
|
||||
<el-select
|
||||
v-model="taskForm.type"
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('dataset.all_scope')"
|
||||
value="all_scope"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('dataset.add_scope')"
|
||||
value="add_scope"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('dataset.execute_rate')"
|
||||
prop="rate"
|
||||
>
|
||||
<el-select
|
||||
v-model="taskForm.rate"
|
||||
size="mini"
|
||||
@change="onRateChange"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('dataset.execute_once')"
|
||||
value="SIMPLE"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('dataset.simple_cron')"
|
||||
value="SIMPLE_CRON"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('dataset.cron_config')"
|
||||
value="CRON"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
v-if="taskForm.rate === 'CRON'"
|
||||
label=""
|
||||
>
|
||||
<el-popover v-model="cronEdit">
|
||||
<cron
|
||||
v-model="taskForm.cron"
|
||||
@close="cronEdit = false"
|
||||
/>
|
||||
<el-input
|
||||
slot="reference"
|
||||
v-model="taskForm.cron"
|
||||
size="mini"
|
||||
style="width: 50%"
|
||||
@click="cronEdit = true"
|
||||
/>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
v-if="taskForm.rate === 'SIMPLE_CRON'"
|
||||
label=""
|
||||
>
|
||||
<el-form :inline="true">
|
||||
<el-form-item :label="$t('cron.every')">
|
||||
<el-input
|
||||
v-model="taskForm.extraData.simple_cron_value"
|
||||
size="mini"
|
||||
type="number"
|
||||
min="1"
|
||||
@change="onSimpleCronChange()"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item class="form-item">
|
||||
<el-select
|
||||
v-model="taskForm.extraData.simple_cron_type"
|
||||
filterable
|
||||
size="mini"
|
||||
@change="onSimpleCronChange()"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('cron.minute_default')"
|
||||
value="minute"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('cron.hour_default')"
|
||||
value="hour"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('cron.day_default')"
|
||||
value="day"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="form-item"
|
||||
:label="$t('cron.every_exec')"
|
||||
/>
|
||||
</el-form>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
v-if="taskForm.rate !== 'SIMPLE'"
|
||||
:label="$t('dataset.start_time')"
|
||||
prop="startTime"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="taskForm.startTime"
|
||||
type="datetime"
|
||||
:placeholder="$t('dataset.select_data_time')"
|
||||
size="mini"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="taskForm.rate !== 'SIMPLE'"
|
||||
:label="$t('dataset.end_time')"
|
||||
prop="end"
|
||||
>
|
||||
<el-select
|
||||
v-model="taskForm.end"
|
||||
size="mini"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('dataset.no_limit')"
|
||||
value="0"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('dataset.set_end_time')"
|
||||
value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="taskForm.end === '1'"
|
||||
label=""
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="taskForm.endTime"
|
||||
type="datetime"
|
||||
:placeholder="$t('dataset.select_data_time')"
|
||||
size="mini"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
<div
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
>
|
||||
<el-button
|
||||
class="dialog_cancel_button"
|
||||
size="mini"
|
||||
@click="closeTask"
|
||||
>{{ $t('dataset.cancel') }}</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
@click="saveTask(taskForm)"
|
||||
>{{ $t('dataset.confirm') }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-row>
|
||||
<el-button
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="addTask(undefined)"
|
||||
>
|
||||
{{ $t('dataset.add_task') }}
|
||||
</el-button>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 10px;">
|
||||
<el-table
|
||||
border
|
||||
size="mini"
|
||||
:data="taskData"
|
||||
style="width: 100%"
|
||||
height="240"
|
||||
>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
:label="$t('dataset.task_name')"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="rate"
|
||||
:label="$t('dataset.execute_rate')"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.rate === 'SIMPLE'">{{ $t('dataset.execute_once') }}</span>
|
||||
<span v-if="scope.row.rate === 'SIMPLE_CRON'">{{ $t('dataset.simple_cron') }}</span>
|
||||
<span v-if="scope.row.rate === 'CRON'">{{ $t('dataset.cron_config') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="status"
|
||||
:label="$t('dataset.task.task_status')"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span
|
||||
v-if="scope.row.status === 'Underway'"
|
||||
style="color: green"
|
||||
>
|
||||
<el-link
|
||||
type="success"
|
||||
style="font-size: 12px"
|
||||
@click="changeTaskStatus(scope.row)"
|
||||
>{{ $t('dataset.task.underway') }}</el-link>
|
||||
</span>
|
||||
<span v-if="scope.row.status === 'Stopped'">
|
||||
<div style="font-size: 12px">{{ $t('dataset.task.stopped') }}</div>
|
||||
</span>
|
||||
<span
|
||||
v-if="scope.row.status === 'Pending'"
|
||||
class="blue-color"
|
||||
>
|
||||
<el-link
|
||||
type="primary"
|
||||
style="font-size: 12px"
|
||||
@click="changeTaskStatus(scope.row)"
|
||||
>{{ $t('dataset.task.pending') }}</el-link>
|
||||
</span>
|
||||
<span
|
||||
v-if="scope.row.status === 'Exec'"
|
||||
class="blue-color"
|
||||
>
|
||||
<i class="el-icon-loading" />
|
||||
{{ $t('dataset.underway') }}
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:label="$t('dataset.operate')"
|
||||
>
|
||||
<template
|
||||
slot-scope="scope"
|
||||
>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
circle
|
||||
:disabled="scope.row.rate === 'SIMPLE' || scope.row.status === 'Stopped'"
|
||||
@click="addTask(scope.row)"
|
||||
/>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
circle
|
||||
@click="deleteTask(scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
|
||||
<el-divider />
|
||||
|
||||
<el-row
|
||||
v-if="table.type !== 'api'"
|
||||
style="height: 26px;"
|
||||
>
|
||||
<el-row>
|
||||
<el-col :span="4"><span>{{ $t('dataset.incremental_update_type') }}:</span></el-col>
|
||||
<el-col :span="18">
|
||||
<el-radio-group
|
||||
v-model="incrementalUpdateType"
|
||||
size="mini"
|
||||
@change="incrementalUpdateTypeChange"
|
||||
>
|
||||
<el-radio label="incrementalAdd">{{ $t('dataset.incremental_add') }}</el-radio>
|
||||
<el-radio label="incrementalDelete">{{ $t('dataset.incremental_delete') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-row>
|
||||
|
||||
<el-row
|
||||
v-if="table.type !== 'api'"
|
||||
style="height: 26px;"
|
||||
>
|
||||
<el-row>
|
||||
<el-col
|
||||
:span="4"
|
||||
style="height: 26px;"
|
||||
><span style="display: inline-block;height: 26px;line-height: 26px;">{{ $t('dataset.param') }}:</span></el-col>
|
||||
<el-col :span="18">
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
@click="insertParamToCodeMirror('${__last_update_time__}')"
|
||||
>{{ $t('dataset.last_update_time') }}</el-button>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
@click="insertParamToCodeMirror('${__current_update_time__}')"
|
||||
>{{ $t('dataset.current_update_time') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-row>
|
||||
|
||||
<el-row v-if="table.type !== 'api'">
|
||||
<el-col style="min-width: 200px;">
|
||||
<codemirror
|
||||
ref="myCm"
|
||||
v-model="sql"
|
||||
class="codemirror"
|
||||
:options="sqlOption"
|
||||
@ready="onCmReady"
|
||||
@focus="onCmFocus"
|
||||
@input="onCmCodeChange"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
>
|
||||
<el-button
|
||||
size="mini"
|
||||
@click="update_setting = false"
|
||||
>{{ $t('dataset.close') }}</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
@click="saveIncrementalConfig"
|
||||
>{{ $t('dataset.confirm') }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</el-col>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { post } from '@/api/dataset/dataset'
|
||||
import { codemirror } from 'vue-codemirror'
|
||||
// 核心样式
|
||||
import 'codemirror/lib/codemirror.css'
|
||||
// 引入主题后还需要在 options 中指定主题才会生效
|
||||
import 'codemirror/theme/solarized.css'
|
||||
import 'codemirror/mode/sql/sql.js'
|
||||
// require active-line.js
|
||||
import 'codemirror/addon/selection/active-line.js'
|
||||
// closebrackets
|
||||
import 'codemirror/addon/edit/closebrackets.js'
|
||||
// keyMap
|
||||
import 'codemirror/mode/clike/clike.js'
|
||||
import 'codemirror/addon/edit/matchbrackets.js'
|
||||
import 'codemirror/addon/comment/comment.js'
|
||||
import 'codemirror/addon/dialog/dialog.js'
|
||||
import 'codemirror/addon/dialog/dialog.css'
|
||||
import 'codemirror/addon/search/searchcursor.js'
|
||||
import 'codemirror/addon/search/search.js'
|
||||
import 'codemirror/keymap/emacs.js'
|
||||
// 引入代码自动提示插件
|
||||
import 'codemirror/addon/hint/show-hint.css'
|
||||
import 'codemirror/addon/hint/sql-hint'
|
||||
import 'codemirror/addon/hint/show-hint'
|
||||
// vue-cron
|
||||
import cron from '@/components/cron/cron'
|
||||
import { hasDataPermission } from '@/utils/permission'
|
||||
import { engineMode } from '@/api/system/engine'
|
||||
export default {
|
||||
name: 'UpdateInfo',
|
||||
components: { codemirror, cron },
|
||||
props: {
|
||||
table: {
|
||||
type: Object,
|
||||
default: null
|
||||
},
|
||||
param: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
height: 500,
|
||||
update_setting: false,
|
||||
update_task: false,
|
||||
show_error_massage: false,
|
||||
update_task_dialog_title: '',
|
||||
error_massage: '',
|
||||
taskForm: {
|
||||
name: '',
|
||||
type: 'all_scope',
|
||||
startTime: '',
|
||||
rate: 'SIMPLE',
|
||||
cron: '',
|
||||
endTime: '',
|
||||
end: '0',
|
||||
extraData: {
|
||||
simple_cron_type: 'hour',
|
||||
simple_cron_value: 1
|
||||
}
|
||||
},
|
||||
page: {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
},
|
||||
taskLogData: [],
|
||||
taskData: [],
|
||||
taskFormRules: {
|
||||
name: [
|
||||
{ required: true, message: this.$t('dataset.required'), trigger: 'change' },
|
||||
{ min: 2, max: 50, message: this.$t('datasource.input_limit_2_50', [2, 50]), trigger: 'blur' }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: this.$t('dataset.required'), trigger: 'change' }
|
||||
],
|
||||
startTime: [
|
||||
{ required: true, message: this.$t('dataset.required'), trigger: 'change' }
|
||||
],
|
||||
rate: [
|
||||
{ required: true, message: this.$t('dataset.required'), trigger: 'change' }
|
||||
],
|
||||
end: [
|
||||
{ required: true, message: this.$t('dataset.required'), trigger: 'change' }
|
||||
]
|
||||
},
|
||||
sqlOption: {
|
||||
tabSize: 2,
|
||||
styleActiveLine: true,
|
||||
lineNumbers: true,
|
||||
line: true,
|
||||
mode: 'text/x-sql',
|
||||
theme: 'solarized',
|
||||
hintOptions: { // 自定义提示选项
|
||||
completeSingle: false // 当匹配只有一项的时候是否自动补全
|
||||
}
|
||||
},
|
||||
incrementalUpdateType: 'incrementalAdd',
|
||||
sql: '',
|
||||
incrementalConfig: {},
|
||||
cronEdit: false,
|
||||
lang: this.$store.getters.language === 'en_US' ? 'en' : 'cn',
|
||||
taskLastRequestComplete: true,
|
||||
taskLogLastRequestComplete: true,
|
||||
enableUpdate: true,
|
||||
engineMode: 'local'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
codemirror() {
|
||||
return this.$refs.myCm.codemirror
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
table: {
|
||||
handler() {
|
||||
if (hasDataPermission('manage', this.param.privileges)) {
|
||||
this.listTask()
|
||||
}
|
||||
this.listTaskLog()
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.calHeight()
|
||||
},
|
||||
created() {
|
||||
this.taskLogTimer = setInterval(() => {
|
||||
if (!this.taskLogLastRequestComplete) {
|
||||
return
|
||||
} else {
|
||||
this.taskLogLastRequestComplete = false
|
||||
}
|
||||
this.listTaskLog(false)
|
||||
}, 10000)
|
||||
|
||||
this.taskTimer = setInterval(() => {
|
||||
if (!this.taskLastRequestComplete) {
|
||||
return
|
||||
} else {
|
||||
this.taskLastRequestComplete = false
|
||||
}
|
||||
if (hasDataPermission('manage', this.param.privileges)) {
|
||||
this.listTask(false)
|
||||
}
|
||||
}, 10000)
|
||||
|
||||
engineMode().then(res => {
|
||||
this.engineMode = res.data
|
||||
if (this.engineMode === 'simple') {
|
||||
if (this.table.type === 'api') {
|
||||
this.enableUpdate = true
|
||||
} else {
|
||||
this.enableUpdate = false
|
||||
}
|
||||
} else {
|
||||
if (this.table.type === 'excel') {
|
||||
this.enableUpdate = false
|
||||
} else {
|
||||
this.enableUpdate = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.taskTimer)
|
||||
clearInterval(this.taskLogTimer)
|
||||
},
|
||||
methods: {
|
||||
calHeight() {
|
||||
const that = this
|
||||
setTimeout(function() {
|
||||
const currentHeight = document.documentElement.clientHeight
|
||||
that.height = currentHeight - 56 - 30 - 26 - 25 - 55 - 38 - 28 - 10
|
||||
}, 10)
|
||||
},
|
||||
cellStyle({ row, column }) {
|
||||
// 状态列字体颜色
|
||||
if (row.status === 'Underway' && column === 'status') {
|
||||
return 'color: var(--Main, #0000ff)'
|
||||
} else if (row.status === 'Completed' && column === 'status') {
|
||||
return 'color: green'
|
||||
} else if (row.status === 'Error' && column === 'status') {
|
||||
return 'color: red'
|
||||
}
|
||||
},
|
||||
incrementalUpdateTypeChange: function() {
|
||||
if (this.incrementalUpdateType === 'incrementalAdd') {
|
||||
if (this.sql) {
|
||||
this.incrementalConfig.incrementalDelete = this.sql
|
||||
} else {
|
||||
this.incrementalConfig.incrementalDelete = ''
|
||||
}
|
||||
if (this.incrementalConfig.incrementalAdd) {
|
||||
this.sql = this.incrementalConfig.incrementalAdd
|
||||
} else {
|
||||
this.sql = ''
|
||||
}
|
||||
}
|
||||
|
||||
if (this.incrementalUpdateType === 'incrementalDelete') {
|
||||
if (this.sql) {
|
||||
this.incrementalConfig.incrementalAdd = this.sql
|
||||
} else {
|
||||
this.incrementalConfig.incrementalAdd = ''
|
||||
}
|
||||
if (this.incrementalConfig.incrementalDelete) {
|
||||
this.sql = this.incrementalConfig.incrementalDelete
|
||||
} else {
|
||||
this.sql = ''
|
||||
}
|
||||
}
|
||||
},
|
||||
showConfig() {
|
||||
this.update_setting = true
|
||||
this.listTask()
|
||||
this.getIncrementalConfig()
|
||||
},
|
||||
refreshLog() {
|
||||
this.listTaskLog()
|
||||
},
|
||||
showErrorMassage(massage) {
|
||||
this.show_error_massage = true
|
||||
this.error_massage = massage
|
||||
},
|
||||
addTask(task) {
|
||||
if (!task) {
|
||||
// add
|
||||
this.resetTaskForm()
|
||||
this.taskForm.name = this.table.name + ' ' + this.$t('dataset.task_update')
|
||||
this.taskForm.startTime = new Date()
|
||||
this.update_task_dialog_title = this.$t('dataset.task_add_title')
|
||||
} else {
|
||||
// update
|
||||
this.taskForm = JSON.parse(JSON.stringify(task))
|
||||
this.taskForm.extraData = JSON.parse(this.taskForm.extraData)
|
||||
this.update_task_dialog_title = this.$t('dataset.task_edit_title')
|
||||
}
|
||||
this.update_task = true
|
||||
},
|
||||
listTask(loading = true) {
|
||||
post('/dataset/task/list', { tableId: this.table.id }, loading).then(response => {
|
||||
this.taskData = response.data
|
||||
this.taskLastRequestComplete = true
|
||||
}).catch(() => {
|
||||
this.taskLastRequestComplete = true
|
||||
})
|
||||
},
|
||||
getIncrementalConfig() {
|
||||
post('/dataset/table/incrementalConfig', { tableId: this.table.id }).then(response => {
|
||||
this.incrementalConfig = response.data
|
||||
if (this.incrementalConfig.incrementalAdd.length === 0 && this.incrementalConfig.incrementalDelete.length === 0) {
|
||||
this.incrementalUpdateType = 'incrementalAdd'
|
||||
this.sql = ''
|
||||
return
|
||||
}
|
||||
if (this.incrementalConfig.incrementalAdd.length > 0) {
|
||||
this.incrementalUpdateType = 'incrementalAdd'
|
||||
this.sql = this.incrementalConfig.incrementalAdd
|
||||
} else {
|
||||
this.incrementalUpdateType = 'incrementalDelete'
|
||||
this.sql = this.incrementalConfig.incrementalDelete
|
||||
}
|
||||
})
|
||||
},
|
||||
saveIncrementalConfig() {
|
||||
if (this.incrementalUpdateType === 'incrementalAdd') {
|
||||
this.incrementalConfig.incrementalAdd = this.sql
|
||||
} else {
|
||||
this.incrementalConfig.incrementalDelete = this.sql
|
||||
}
|
||||
this.incrementalConfig.tableId = this.table.id
|
||||
post('/dataset/table/save/incrementalConfig', this.incrementalConfig).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('dataset.save_success'),
|
||||
type: 'success',
|
||||
showClose: true
|
||||
})
|
||||
this.update_setting = false
|
||||
})
|
||||
},
|
||||
saveTask(task) {
|
||||
this.$refs.taskForm.validate(valid => {
|
||||
if (valid) {
|
||||
if (this.incrementalUpdateType === 'incrementalAdd') {
|
||||
this.incrementalConfig.incrementalAdd = this.sql
|
||||
} else {
|
||||
this.incrementalConfig.incrementalDelete = this.sql
|
||||
}
|
||||
this.incrementalConfig.tableId = this.table.id
|
||||
task.startTime = new Date(task.startTime).getTime()
|
||||
task.endTime = new Date(task.endTime).getTime()
|
||||
task.tableId = this.table.id
|
||||
const form = JSON.parse(JSON.stringify(task))
|
||||
form.extraData = JSON.stringify(form.extraData)
|
||||
const dataSetTaskRequest = {
|
||||
datasetTableTask: form,
|
||||
datasetTableIncrementalConfig: this.incrementalConfig
|
||||
}
|
||||
post('/dataset/task/save', dataSetTaskRequest).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('dataset.save_success'),
|
||||
type: 'success',
|
||||
showClose: true
|
||||
})
|
||||
this.update_task = false
|
||||
this.resetTaskForm()
|
||||
this.listTask()
|
||||
this.listTaskLog()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
changeTaskStatus(task) {
|
||||
const param = task
|
||||
param.status = task.status === 'Underway' ? 'Pending' : 'Underway'
|
||||
post('/dataset/task/updateStatus', task).then(response => {
|
||||
task.status = param.status
|
||||
this.$message({
|
||||
message: this.$t('dataset.task.change_success'),
|
||||
type: 'success',
|
||||
showClose: true
|
||||
})
|
||||
})
|
||||
},
|
||||
deleteTask(task) {
|
||||
this.$confirm(this.$t('dataset.confirm_delete'), this.$t('dataset.tips'), {
|
||||
confirmButtonText: this.$t('dataset.confirm'),
|
||||
cancelButtonText: this.$t('dataset.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
post('/dataset/task/delete/' + task.id, null).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('dataset.delete_success'),
|
||||
type: 'success',
|
||||
showClose: true
|
||||
})
|
||||
this.resetTaskForm()
|
||||
this.listTask()
|
||||
this.listTaskLog()
|
||||
})
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
closeTask() {
|
||||
this.update_task = false
|
||||
this.resetTaskForm()
|
||||
},
|
||||
onSimpleCronChange() {
|
||||
if (this.taskForm.extraData.simple_cron_type === 'minute') {
|
||||
if (this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 59) {
|
||||
this.$message({ message: this.$t('cron.minute_limit'), type: 'warning', showClose: true })
|
||||
this.taskForm.extraData.simple_cron_value = 59
|
||||
}
|
||||
this.taskForm.cron = '0 0/' + this.taskForm.extraData.simple_cron_value + ' * * * ? *'
|
||||
return
|
||||
}
|
||||
if (this.taskForm.extraData.simple_cron_type === 'hour') {
|
||||
if (this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 23) {
|
||||
this.$message({ message: this.$t('cron.hour_limit'), type: 'warning', showClose: true })
|
||||
this.taskForm.extraData.simple_cron_value = 23
|
||||
}
|
||||
this.taskForm.cron = '0 0 0/' + this.taskForm.extraData.simple_cron_value + ' * * ? *'
|
||||
return
|
||||
}
|
||||
if (this.taskForm.extraData.simple_cron_type === 'day') {
|
||||
if (this.taskForm.extraData.simple_cron_value < 1 || this.taskForm.extraData.simple_cron_value > 31) {
|
||||
this.$message({ message: this.$t('cron.day_limit'), type: 'warning', showClose: true })
|
||||
this.taskForm.extraData.simple_cron_value = 31
|
||||
}
|
||||
this.taskForm.cron = '0 0 0 1/' + this.taskForm.extraData.simple_cron_value + ' * ? *'
|
||||
return
|
||||
}
|
||||
},
|
||||
onRateChange() {
|
||||
if (this.taskForm.rate === 'SIMPLE') {
|
||||
this.taskForm.end = '0'
|
||||
this.taskForm.endTime = ''
|
||||
this.taskForm.cron = ''
|
||||
}
|
||||
if (this.taskForm.rate === 'SIMPLE_CRON') {
|
||||
this.taskForm.cron = '0 0 0/1 * * ? *'
|
||||
}
|
||||
if (this.taskForm.rate === 'CRON') {
|
||||
this.taskForm.cron = '00 00 * ? * * *'
|
||||
}
|
||||
},
|
||||
listTaskLog(loading = true) {
|
||||
const params = { 'conditions': [{ 'field': 'dataset_table_task_log.table_id', 'operator': 'eq', 'value': this.table.id }], 'orders': [] }
|
||||
post('/dataset/taskLog/listForDataset/' + this.table.type + '/' + this.page.currentPage + '/' + this.page.pageSize, params, loading).then(response => {
|
||||
this.taskLogData = response.data.listObject
|
||||
this.page.total = response.data.itemCount
|
||||
this.taskLogLastRequestComplete = true
|
||||
}).catch(() => {
|
||||
this.taskLogLastRequestComplete = true
|
||||
})
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.page.pageSize = val
|
||||
this.listTaskLog()
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.page.currentPage = val
|
||||
this.listTaskLog()
|
||||
},
|
||||
resetTaskForm() {
|
||||
this.taskForm = {
|
||||
name: '',
|
||||
type: 'all_scope',
|
||||
startTime: '',
|
||||
rate: 'SIMPLE',
|
||||
endTime: '',
|
||||
end: '0',
|
||||
extraData: {
|
||||
simple_cron_type: 'hour',
|
||||
simple_cron_value: 1
|
||||
}
|
||||
}
|
||||
},
|
||||
showSQL(val) {
|
||||
this.sql = val || ''
|
||||
},
|
||||
onCmReady(cm) {
|
||||
this.codemirror.setSize('-webkit-fill-available', 'auto')
|
||||
},
|
||||
onCmFocus(cm) {
|
||||
},
|
||||
onCmCodeChange(newCode) {
|
||||
this.sql = newCode
|
||||
this.$emit('codeChange', this.sql)
|
||||
},
|
||||
insertParamToCodeMirror(param) {
|
||||
const pos1 = this.$refs.myCm.codemirror.getCursor()
|
||||
const pos2 = {}
|
||||
pos2.line = pos1.line
|
||||
pos2.ch = pos1.ch
|
||||
this.$refs.myCm.codemirror.replaceRange(param, pos2)
|
||||
},
|
||||
cronChange(val) {
|
||||
this.taskForm.cron = val
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-divider--horizontal {
|
||||
margin: 12px 0;
|
||||
}
|
||||
|
||||
.el-radio{
|
||||
margin-right: 10px;
|
||||
}
|
||||
.el-radio ::v-deep .el-radio__label{
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.dialog-css ::v-deep .el-dialog__header {
|
||||
padding: 20px 20px 0;
|
||||
}
|
||||
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
|
||||
.el-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.codemirror {
|
||||
height: 100px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.codemirror ::v-deep .CodeMirror-scroll {
|
||||
height: 100px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.err-msg{
|
||||
font-size: 12px;
|
||||
word-break:normal;
|
||||
width:auto;
|
||||
display:block;
|
||||
white-space:pre-wrap;
|
||||
word-wrap : break-word ;
|
||||
overflow: hidden ;
|
||||
}
|
||||
|
||||
.blackTheme .dialog_cancel_button {
|
||||
background-color: #171b22 !important;
|
||||
color: #2681ff !important;
|
||||
}
|
||||
|
||||
.span{
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
@ -125,14 +125,18 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane
|
||||
v-if="
|
||||
table.mode === 1 &&
|
||||
(table.type === 'db' || table.type === 'sql' || table.type === 'api')
|
||||
table.mode === 1 && ['api', 'sql', 'db', 'excel'].includes(table.type)
|
||||
"
|
||||
:label="$t('dataset.update_info')"
|
||||
name="updateInfo"
|
||||
>
|
||||
<update-info
|
||||
v-if="tabActive == 'updateInfo'"
|
||||
v-if="tabActive == 'updateInfo' && table.type !== 'excel'"
|
||||
:param="param"
|
||||
:table="table"
|
||||
/>
|
||||
<update-records
|
||||
v-if="tabActive == 'updateInfo' && table.type === 'excel'"
|
||||
:param="param"
|
||||
:table="table"
|
||||
/>
|
||||
@ -175,7 +179,7 @@ import DatasetDetail from '../common/DatasetDetail'
|
||||
import FieldEdit from './FieldEdit'
|
||||
import { pluginLoaded } from '@/api/user'
|
||||
import PluginCom from '@/views/system/plugin/PluginCom'
|
||||
|
||||
import UpdateRecords from './UpdateRecords'
|
||||
export default {
|
||||
name: 'ViewTable',
|
||||
components: {
|
||||
@ -183,6 +187,7 @@ export default {
|
||||
DatasetDetail,
|
||||
UpdateInfo,
|
||||
TabDataPreview,
|
||||
UpdateRecords,
|
||||
PluginCom
|
||||
},
|
||||
props: {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
<div class="organization">
|
||||
<el-tabs
|
||||
v-model="tabActive"
|
||||
class="de-tabs"
|
||||
@tab-click="changeTab"
|
||||
>
|
||||
<el-tab-pane
|
||||
|
||||
@ -33,9 +33,9 @@
|
||||
<div class="block">
|
||||
<el-tree
|
||||
ref="default_panel_tree"
|
||||
:data="defaultData"
|
||||
:data="expandedData"
|
||||
node-key="id"
|
||||
:highlight-current="activeTree==='system'"
|
||||
:highlight-current="activeTree === 'system'"
|
||||
:expand-on-click-node="true"
|
||||
:filter-node-method="filterNode"
|
||||
@node-click="nodeClick"
|
||||
@ -44,31 +44,36 @@
|
||||
slot-scope="{ node, data }"
|
||||
class="custom-tree-node father"
|
||||
>
|
||||
<span style="display: flex; flex: 1 1 0%; width: 0px;">
|
||||
<span style="display: flex; flex: 1 1 0%; width: 0px">
|
||||
<span>
|
||||
<svg-icon
|
||||
v-if="!data.mobileLayout"
|
||||
:icon-class="'panel-'+data.status"
|
||||
:icon-class="'panel-' + data.status"
|
||||
class="ds-icon-scene"
|
||||
/>
|
||||
<svg-icon
|
||||
v-if="data.mobileLayout"
|
||||
:icon-class="'panel-mobile-'+data.status"
|
||||
:icon-class="'panel-mobile-' + data.status"
|
||||
class="ds-icon-scene"
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span>
|
||||
</span>
|
||||
<span
|
||||
style="margin-left: 12px;"
|
||||
style="margin-left: 12px"
|
||||
class="child"
|
||||
@click.stop
|
||||
>
|
||||
<el-dropdown
|
||||
v-if="hasDataPermission('manage',data.privileges)"
|
||||
v-if="hasDataPermission('manage', data.privileges)"
|
||||
trigger="click"
|
||||
size="small"
|
||||
@command="clickMore"
|
||||
@ -83,13 +88,13 @@
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
icon="el-icon-edit-outline"
|
||||
:command="beforeClickMore('rename',data,node)"
|
||||
:command="beforeClickMore('rename', data, node)"
|
||||
>
|
||||
{{ $t('panel.rename') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
icon="el-icon-delete"
|
||||
:command="beforeClickMore('delete',data,node)"
|
||||
:command="beforeClickMore('delete', data, node)"
|
||||
>
|
||||
{{ $t('panel.delete') }}
|
||||
</el-dropdown-item>
|
||||
@ -98,6 +103,18 @@
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
<p
|
||||
v-if="defaultData.length > 3"
|
||||
class="default-expansion"
|
||||
@click="defaultExpansion = !defaultExpansion"
|
||||
>
|
||||
{{ defaultExpansion ? '收起' : '展开' }}
|
||||
<i
|
||||
:class="[
|
||||
defaultExpansion ? 'el-icon-arrow-up' : 'el-icon-arrow-down'
|
||||
]"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
@ -105,7 +122,7 @@
|
||||
<span class="header-title">
|
||||
{{ $t('panel.panel_list') }}
|
||||
<el-button
|
||||
style="float: right;padding-right: 7px;margin-top: -8px"
|
||||
style="float: right; padding-right: 7px; margin-top: -8px"
|
||||
icon="el-icon-plus"
|
||||
type="text"
|
||||
@click="showEditPanel(newFolder)"
|
||||
@ -119,7 +136,7 @@
|
||||
:default-expanded-keys="expandedArray"
|
||||
:data="tData"
|
||||
node-key="id"
|
||||
:highlight-current="activeTree==='self'"
|
||||
:highlight-current="activeTree === 'self'"
|
||||
:expand-on-click-node="true"
|
||||
:filter-node-method="filterNode"
|
||||
@node-expand="nodeExpand"
|
||||
@ -130,16 +147,16 @@
|
||||
slot-scope="{ node, data }"
|
||||
class="custom-tree-node-list father"
|
||||
>
|
||||
<span style="display: flex; flex: 1 1 0%; width: 0px;">
|
||||
<span style="display: flex; flex: 1 1 0%; width: 0px">
|
||||
<span v-if="data.nodeType === 'panel'">
|
||||
<svg-icon
|
||||
v-if="!data.mobileLayout"
|
||||
:icon-class="'panel-'+data.status"
|
||||
:icon-class="'panel-' + data.status"
|
||||
class="ds-icon-scene"
|
||||
/>
|
||||
<svg-icon
|
||||
v-if="data.mobileLayout"
|
||||
:icon-class="'panel-mobile-'+data.status"
|
||||
:icon-class="'panel-mobile-' + data.status"
|
||||
class="ds-icon-scene"
|
||||
/>
|
||||
</span>
|
||||
@ -148,16 +165,21 @@
|
||||
</span>
|
||||
<span
|
||||
:class="data.status"
|
||||
style="margin-left: 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"
|
||||
style="
|
||||
margin-left: 6px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
"
|
||||
:title="data.name"
|
||||
>{{ data.name }}</span>
|
||||
</span>
|
||||
<span
|
||||
v-if="hasDataPermission('manage',data.privileges)"
|
||||
v-if="hasDataPermission('manage', data.privileges)"
|
||||
class="child"
|
||||
>
|
||||
<span
|
||||
v-if="data.nodeType ==='folder'"
|
||||
v-if="data.nodeType === 'folder'"
|
||||
@click.stop
|
||||
>
|
||||
<el-dropdown
|
||||
@ -173,11 +195,15 @@
|
||||
/>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item :command="beforeClickEdit('folder','new',data,node)">
|
||||
<el-dropdown-item
|
||||
:command="beforeClickEdit('folder', 'new', data, node)"
|
||||
>
|
||||
<i class="el-icon-folder" />
|
||||
<span>{{ $t('panel.groupAdd') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item :command="beforeClickEdit('panel','new',data,node)">
|
||||
<el-dropdown-item
|
||||
:command="beforeClickEdit('panel', 'new', data, node)"
|
||||
>
|
||||
<svg-icon
|
||||
icon-class="panel"
|
||||
class="ds-icon-scene"
|
||||
@ -188,7 +214,7 @@
|
||||
</el-dropdown>
|
||||
</span>
|
||||
<span
|
||||
v-if="data.nodeType==='panel'"
|
||||
v-if="data.nodeType === 'panel'"
|
||||
@click.stop
|
||||
>
|
||||
<el-button
|
||||
@ -199,7 +225,7 @@
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
style="margin-left: 12px;"
|
||||
style="margin-left: 12px"
|
||||
@click.stop
|
||||
>
|
||||
<el-dropdown
|
||||
@ -216,56 +242,56 @@
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
v-if="data.nodeType==='panel'"
|
||||
v-if="data.nodeType === 'panel'"
|
||||
icon="el-icon-edit"
|
||||
:command="beforeClickMore('edit',data,node)"
|
||||
:command="beforeClickMore('edit', data, node)"
|
||||
>
|
||||
{{ $t('panel.edit') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="data.nodeType==='panel'"
|
||||
v-if="data.nodeType === 'panel'"
|
||||
icon="el-icon-share"
|
||||
:command="beforeClickMore('share',data,node)"
|
||||
:command="beforeClickMore('share', data, node)"
|
||||
>
|
||||
{{ $t('panel.share') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="data.nodeType==='panel'"
|
||||
v-if="data.nodeType === 'panel'"
|
||||
icon="el-icon-document-copy"
|
||||
:command="beforeClickMore('copy',data,node)"
|
||||
:command="beforeClickMore('copy', data, node)"
|
||||
>
|
||||
{{ $t('panel.copy') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
icon="el-icon-right"
|
||||
:command="beforeClickMore('move',data,node)"
|
||||
:command="beforeClickMore('move', data, node)"
|
||||
>
|
||||
{{ $t('dataset.move_to') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="data.nodeType==='panel'"
|
||||
v-if="data.nodeType === 'panel'"
|
||||
icon="el-icon-paperclip"
|
||||
:command="beforeClickMore('link',data,node)"
|
||||
:command="beforeClickMore('link', data, node)"
|
||||
>
|
||||
{{ $t('panel.create_public_links') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="data.nodeType==='panel'"
|
||||
v-if="data.nodeType === 'panel'"
|
||||
:disabled="data.isDefault"
|
||||
icon="el-icon-copy-document"
|
||||
:command="beforeClickMore('toDefaultPanel',data,node)"
|
||||
:command="beforeClickMore('toDefaultPanel', data, node)"
|
||||
>
|
||||
{{ $t('panel.to_default_panel') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
icon="el-icon-edit-outline"
|
||||
:command="beforeClickMore('rename',data,node)"
|
||||
:command="beforeClickMore('rename', data, node)"
|
||||
>
|
||||
{{ $t('panel.rename') }}
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
icon="el-icon-delete"
|
||||
:command="beforeClickMore('delete',data,node)"
|
||||
:command="beforeClickMore('delete', data, node)"
|
||||
>
|
||||
{{ $t('panel.delete') }}
|
||||
</el-dropdown-item>
|
||||
@ -305,7 +331,9 @@
|
||||
<el-button
|
||||
size="mini"
|
||||
@click="close()"
|
||||
>{{ $t('panel.cancel') }}</el-button>
|
||||
>{{
|
||||
$t('panel.cancel')
|
||||
}}</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
@ -379,7 +407,9 @@
|
||||
<el-button
|
||||
size="mini"
|
||||
@click="closeMoveGroup()"
|
||||
>{{ $t('dataset.cancel') }}</el-button>
|
||||
>{{
|
||||
$t('dataset.cancel')
|
||||
}}</el-button>
|
||||
<el-button
|
||||
:disabled="groupMoveConfirmDisabled"
|
||||
type="primary"
|
||||
@ -399,11 +429,17 @@ import LinkGenerate from '@/views/link/generate'
|
||||
import { uuid } from 'vue-uuid'
|
||||
import bus from '@/utils/bus'
|
||||
import EditPanel from './EditPanel'
|
||||
import { addGroup, delGroup, groupTree, defaultTree, initPanelData, panelUpdate, viewPanelLog } from '@/api/panel/panel'
|
||||
import { mapState } from 'vuex'
|
||||
import {
|
||||
DEFAULT_COMMON_CANVAS_STYLE_STRING
|
||||
} from '@/views/panel/panel'
|
||||
addGroup,
|
||||
delGroup,
|
||||
groupTree,
|
||||
defaultTree,
|
||||
initPanelData,
|
||||
panelUpdate,
|
||||
viewPanelLog
|
||||
} from '@/api/panel/panel'
|
||||
import { mapState } from 'vuex'
|
||||
import { DEFAULT_COMMON_CANVAS_STYLE_STRING } from '@/views/panel/panel'
|
||||
import TreeSelector from '@/components/TreeSelector'
|
||||
import { queryAuthModel } from '@/api/authModel/authModel'
|
||||
|
||||
@ -413,10 +449,8 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
responseSource: 'panelQuery',
|
||||
clearLocalStorage: [
|
||||
'chart-tree',
|
||||
'dataset-tree'
|
||||
],
|
||||
defaultExpansion: false,
|
||||
clearLocalStorage: ['chart-tree', 'dataset-tree'],
|
||||
historyRequestId: null,
|
||||
lastActiveNode: null, // 激活的节点 在这个节点下面动态放置子节点
|
||||
lastActiveNodeData: null,
|
||||
@ -490,15 +524,27 @@ export default {
|
||||
},
|
||||
groupFormRules: {
|
||||
name: [
|
||||
{ required: true, message: this.$t('commons.input_content'), trigger: 'blur' }
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('commons.input_content'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
},
|
||||
tableFormRules: {
|
||||
name: [
|
||||
{ required: true, message: this.$t('commons.input_content'), trigger: 'blur' }
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('commons.input_content'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
mode: [
|
||||
{ required: true, message: this.$t('commons.input_content'), trigger: 'blur' }
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('commons.input_content'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
},
|
||||
moveGroup: false,
|
||||
@ -514,19 +560,19 @@ export default {
|
||||
all: this.$t('commons.all'),
|
||||
folder: this.$t('commons.folder')
|
||||
},
|
||||
initLocalStorage: [
|
||||
'chart',
|
||||
'dataset'
|
||||
]
|
||||
initLocalStorage: ['chart', 'dataset']
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
panelDialogTitle() {
|
||||
return this.editPanel.titlePre + this.editPanel.titleSuf
|
||||
},
|
||||
...mapState([
|
||||
'nowPanelTrackInfo'
|
||||
])
|
||||
expandedData() {
|
||||
return this.defaultExpansion
|
||||
? this.defaultData
|
||||
: this.defaultData.slice(0, 3)
|
||||
},
|
||||
...mapState(['nowPanelTrackInfo'])
|
||||
},
|
||||
watch: {
|
||||
// 切换展示页面后 重新点击一下当前节点
|
||||
@ -558,7 +604,11 @@ export default {
|
||||
this.responseSource = routerParam.responseSource
|
||||
this.lastActiveNode = routerParam
|
||||
this.tree()
|
||||
} else if (routerParam && routerParam.nodeType === 'panel' && this.historyRequestId !== routerParam.requestId) {
|
||||
} else if (
|
||||
routerParam &&
|
||||
routerParam.nodeType === 'panel' &&
|
||||
this.historyRequestId !== routerParam.requestId
|
||||
) {
|
||||
this.historyRequestId = routerParam.requestId
|
||||
this.tree()
|
||||
this.edit(routerParam, null)
|
||||
@ -569,7 +619,7 @@ export default {
|
||||
methods: {
|
||||
fromAppActive() {
|
||||
this.activeNodeAndClickOnly(this.lastActiveNode)
|
||||
this.clearLocalStorage.forEach(item => {
|
||||
this.clearLocalStorage.forEach((item) => {
|
||||
localStorage.removeItem(item)
|
||||
})
|
||||
this.responseSource = 'panelQuery'
|
||||
@ -582,9 +632,9 @@ export default {
|
||||
},
|
||||
initCache() {
|
||||
// 初始化时提前加载视图和数据集的缓存
|
||||
this.initLocalStorage.forEach(item => {
|
||||
this.initLocalStorage.forEach((item) => {
|
||||
if (!localStorage.getItem(item + '-tree')) {
|
||||
queryAuthModel({ modelType: item }, false).then(res => {
|
||||
queryAuthModel({ modelType: item }, false).then((res) => {
|
||||
localStorage.setItem(item + '-tree', JSON.stringify(res.data))
|
||||
})
|
||||
}
|
||||
@ -596,7 +646,11 @@ export default {
|
||||
this.defaultTree()
|
||||
this.tree()
|
||||
// 默认展开 同时点击 新增的节点
|
||||
if (panelInfo && panelInfo.panelType === 'self' && this.lastActiveNodeData.id) {
|
||||
if (
|
||||
panelInfo &&
|
||||
panelInfo.panelType === 'self' &&
|
||||
this.lastActiveNodeData.id
|
||||
) {
|
||||
if (this.editPanel.optType === 'rename') {
|
||||
this.lastActiveNodeData.name = panelInfo.name
|
||||
return
|
||||
@ -692,10 +746,10 @@ export default {
|
||||
},
|
||||
beforeClickEdit(type, optType, data, node) {
|
||||
return {
|
||||
'type': type,
|
||||
'data': data,
|
||||
'node': node,
|
||||
'optType': optType
|
||||
type: type,
|
||||
data: data,
|
||||
node: node,
|
||||
optType: optType
|
||||
}
|
||||
},
|
||||
|
||||
@ -726,10 +780,10 @@ export default {
|
||||
|
||||
beforeClickMore(optType, data, node) {
|
||||
return {
|
||||
'type': data.nodeType,
|
||||
'data': data,
|
||||
'node': node,
|
||||
'optType': optType
|
||||
type: data.nodeType,
|
||||
data: data,
|
||||
node: node,
|
||||
optType: optType
|
||||
}
|
||||
},
|
||||
|
||||
@ -750,7 +804,7 @@ export default {
|
||||
saveGroup(group) {
|
||||
this.$refs['groupForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addGroup(group).then(res => {
|
||||
addGroup(group).then((res) => {
|
||||
this.close()
|
||||
this.$message({
|
||||
message: this.$t('commons.save_success'),
|
||||
@ -776,19 +830,20 @@ export default {
|
||||
confirmButtonText: this.$t('panel.confirm'),
|
||||
cancelButtonText: this.$t('panel.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
delGroup(data.id).then(response => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: this.$t('panel.delete_success'),
|
||||
showClose: true
|
||||
})
|
||||
this.clearCanvas()
|
||||
this.tree()
|
||||
this.defaultTree()
|
||||
})
|
||||
}).catch(() => {
|
||||
})
|
||||
.then(() => {
|
||||
delGroup(data.id).then((response) => {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: this.$t('panel.delete_success'),
|
||||
showClose: true
|
||||
})
|
||||
this.clearCanvas()
|
||||
this.tree()
|
||||
this.defaultTree()
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
},
|
||||
|
||||
clearCanvas() {
|
||||
@ -815,11 +870,11 @@ export default {
|
||||
},
|
||||
tree(cache = false) {
|
||||
const modelInfo = localStorage.getItem('panel-main-tree')
|
||||
const userCache = (modelInfo && cache)
|
||||
const userCache = modelInfo && cache
|
||||
if (userCache) {
|
||||
this.tData = JSON.parse(modelInfo)
|
||||
}
|
||||
groupTree(this.groupForm, !userCache).then(res => {
|
||||
groupTree(this.groupForm, !userCache).then((res) => {
|
||||
localStorage.setItem('panel-main-tree', JSON.stringify(res.data))
|
||||
if (!userCache) {
|
||||
this.tData = res.data
|
||||
@ -839,12 +894,12 @@ export default {
|
||||
panelType: 'system'
|
||||
}
|
||||
const modelInfo = localStorage.getItem('panel-default-tree')
|
||||
const userCache = (modelInfo && cache)
|
||||
const userCache = modelInfo && cache
|
||||
|
||||
if (userCache) {
|
||||
this.defaultData = JSON.parse(modelInfo)
|
||||
}
|
||||
defaultTree(requestInfo, false).then(res => {
|
||||
defaultTree(requestInfo, false).then((res) => {
|
||||
localStorage.setItem('panel-default-tree', JSON.stringify(res.data))
|
||||
if (!userCache) {
|
||||
this.defaultData = res.data
|
||||
@ -865,7 +920,7 @@ export default {
|
||||
// 清理pc布局缓存
|
||||
this.$store.commit('setComponentDataCache', null)
|
||||
initPanelData(data.id, false, function(response) {
|
||||
viewPanelLog({ panelId: data.id }).then(res => {
|
||||
viewPanelLog({ panelId: data.id }).then((res) => {
|
||||
bus.$emit('set-panel-show-type', 0)
|
||||
data.mobileLayout = response.data.mobileLayout
|
||||
})
|
||||
@ -889,7 +944,7 @@ export default {
|
||||
},
|
||||
beforeClickAddData(type) {
|
||||
return {
|
||||
'type': type
|
||||
type: type
|
||||
}
|
||||
},
|
||||
|
||||
@ -930,15 +985,13 @@ export default {
|
||||
},
|
||||
resetID(data) {
|
||||
if (data) {
|
||||
data.forEach(item => {
|
||||
data.forEach((item) => {
|
||||
item.type !== 'custom' && (item.id = uuid.v1())
|
||||
})
|
||||
}
|
||||
return data
|
||||
},
|
||||
newPanelSave(id) {
|
||||
|
||||
},
|
||||
newPanelSave(id) {},
|
||||
// 激活并点击当前节点
|
||||
activeNodeAndClick(panelInfo) {
|
||||
if (panelInfo) {
|
||||
@ -979,10 +1032,13 @@ export default {
|
||||
moveTo(data) {
|
||||
const _this = this
|
||||
this.moveInfo = data
|
||||
this.moveDialogTitle = this.$t('dataset.m1') + (data.name.length > 10 ? (data.name.substr(0, 10) + '...') : data.name) + this.$t('dataset.m2')
|
||||
this.moveDialogTitle =
|
||||
this.$t('dataset.m1') +
|
||||
(data.name.length > 10 ? data.name.substr(0, 10) + '...' : data.name) +
|
||||
this.$t('dataset.m2')
|
||||
const queryInfo = JSON.parse(JSON.stringify(this.groupForm))
|
||||
queryInfo['nodeType'] = 'folder'
|
||||
groupTree(queryInfo).then(res => {
|
||||
groupTree(queryInfo).then((res) => {
|
||||
if (data.nodeType === 'folder') {
|
||||
_this.tGroupData = [
|
||||
{
|
||||
@ -1005,7 +1061,7 @@ export default {
|
||||
saveMoveGroup() {
|
||||
this.moveInfo.pid = this.tGroup.id
|
||||
this.moveInfo['optType'] = 'move'
|
||||
panelUpdate(this.moveInfo).then(response => {
|
||||
panelUpdate(this.moveInfo).then((response) => {
|
||||
this.tree()
|
||||
this.closeMoveGroup()
|
||||
})
|
||||
@ -1050,6 +1106,22 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.default-expansion {
|
||||
height: 40px;
|
||||
width: 232px;
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: var(--deTextSecondary, #646a73);
|
||||
padding-left: 22px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
i {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
.main-area-input {
|
||||
::v-deep.el-input-group__append {
|
||||
width: 70px;
|
||||
@ -1059,47 +1131,47 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.header-title {
|
||||
font-size: 14px;
|
||||
flex: 1;
|
||||
color: var(--TextPrimary, #606266);
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
height: 100%;
|
||||
/*line-height: 36px;*/
|
||||
}
|
||||
.header-title {
|
||||
font-size: 14px;
|
||||
flex: 1;
|
||||
color: var(--TextPrimary, #606266);
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
height: 100%;
|
||||
/*line-height: 36px;*/
|
||||
}
|
||||
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-right:8px;
|
||||
}
|
||||
.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-tree-node-list {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 15px 20px;
|
||||
}
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 15px 20px;
|
||||
}
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
|
||||
.father .child {
|
||||
/*display: none;*/
|
||||
visibility: hidden;
|
||||
}
|
||||
.father:hover .child {
|
||||
/*display: inline;*/
|
||||
visibility: visible;
|
||||
}
|
||||
.father .child {
|
||||
/*display: none;*/
|
||||
visibility: hidden;
|
||||
}
|
||||
.father:hover .child {
|
||||
/*display: inline;*/
|
||||
visibility: visible;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user