fix: 数据集优化

frontend/src/lang/en.js

@@ -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',

frontend/src/lang/tw.js

@@ -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: '選擇日期',

frontend/src/lang/zh.js

@@ -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: '选择时间',

frontend/src/views/dataset/add/AddSQL.vue

@@ -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;

frontend/src/views/dataset/common/datasetTree.vue

@@ -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) {
+        .then((res) => {
-          localStorage.setItem('dataset-tree', JSON.stringify(res.data))
+          if (cache) {
-        }
+            localStorage.setItem('dataset-tree', JSON.stringify(res.data))
-        if (!userCache) {
+          }
-          this.treeData = res.data
+          if (!userCache) {
-        }
+            this.treeData = res.data
-      }).finally(() => {
+          }
-        this.loading = false
+        })
-      })
+        .finally(() => {
+          this.loading = false
+        })
     },
     nodeClick(data, node) {
       if (data.modelInnerType !== 'group') {

frontend/src/views/dataset/data/UpdateRecords.vue

@@ -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>

frontend/src/views/dataset/data/ViewTable.vue

@@ -125,14 +125,18 @@
       </el-tab-pane>
       <el-tab-pane
         v-if="
-          table.mode === 1 &&
+          table.mode === 1 && ['api', 'sql', 'db', 'excel'].includes(table.type)
-            (table.type === 'db' || table.type === 'sql' || table.type === 'api')
         "
         :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: {

frontend/src/views/msg/all.vue

@@ -6,6 +6,7 @@
     <div class="organization">
       <el-tabs
         v-model="tabActive"
+        class="de-tabs"
         @tab-click="changeTab"
       >
         <el-tab-pane

frontend/src/views/panel/list/PanelList.vue

@@ -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
+  addGroup,
-} from '@/views/panel/panel'
+  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: [
+      defaultExpansion: false,
-        'chart-tree',
+      clearLocalStorage: ['chart-tree', 'dataset-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: [
+      initLocalStorage: ['chart', 'dataset']
-        'chart',
-        'dataset'
-      ]
     }
   },
   computed: {
     panelDialogTitle() {
       return this.editPanel.titlePre + this.editPanel.titleSuf
     },
-    ...mapState([
+    expandedData() {
-      'nowPanelTrackInfo'
+      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,
+        type: type,
-        'data': data,
+        data: data,
-        'node': node,
+        node: node,
-        'optType': optType
+        optType: optType
       }
     },
 
@@ -726,10 +780,10 @@ export default {
 
     beforeClickMore(optType, data, node) {
       return {
-        'type': data.nodeType,
+        type: data.nodeType,
-        'data': data,
+        data: data,
-        'node': node,
+        node: node,
-        'optType': optType
+        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 {
+.header-title {
-    font-size: 14px;
+  font-size: 14px;
-    flex: 1;
+  flex: 1;
-    color: var(--TextPrimary, #606266);
+  color: var(--TextPrimary, #606266);
-    font-weight: bold;
+  font-weight: bold;
-    display: block;
+  display: block;
-    height: 100%;
+  height: 100%;
-    /*line-height: 36px;*/
+  /*line-height: 36px;*/
-  }
+}
 
-  .custom-tree-node {
+.custom-tree-node {
-    flex: 1;
+  flex: 1;
-    display: flex;
+  display: flex;
-    align-items: center;
+  align-items: center;
-    justify-content: space-between;
+  justify-content: space-between;
-    font-size: 14px;
+  font-size: 14px;
-    padding-right:8px;
+  padding-right: 8px;
-  }
+}
 
-  .custom-tree-node-list {
+.custom-tree-node-list {
-    flex: 1;
+  flex: 1;
-    display: flex;
+  display: flex;
-    align-items: center;
+  align-items: center;
-    justify-content: space-between;
+  justify-content: space-between;
-    font-size: 14px;
+  font-size: 14px;
-    padding:0 8px;
+  padding: 0 8px;
-  }
+}
 
-  .dialog-css ::v-deep .el-dialog__body {
+.dialog-css ::v-deep .el-dialog__body {
-    padding: 15px 20px;
+  padding: 15px 20px;
-  }
+}
-  .dialog-css ::v-deep .el-dialog__body {
+.dialog-css ::v-deep .el-dialog__body {
-    padding: 10px 20px 20px;
+  padding: 10px 20px 20px;
-  }
+}
 
-  .father .child {
+.father .child {
-    /*display: none;*/
+  /*display: none;*/
-    visibility: hidden;
+  visibility: hidden;
-  }
+}
-  .father:hover .child {
+.father:hover .child {
-    /*display: inline;*/
+  /*display: inline;*/
-    visibility: visible;
+  visibility: visible;
-  }
+}
 </style>