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