Merge branch 'dev' of github.com:dataease/dataease into dev

.gitignore

@@ -51,6 +51,7 @@ pnpm-debug.log*
 *.classpath
 *.project
 .settings/
+.lh
 
 
 package-lock.json

backend/src/main/java/io/dataease/base/domain/PanelPdfTemplate.java

+package io.dataease.base.domain;
+
+import java.io.Serializable;
+import lombok.Data;
+
+@Data
+public class PanelPdfTemplate implements Serializable {
+    private String id;
+
+    private String name;
+
+    private Long createTime;
+
+    private String createUser;
+
+    private Integer sort;
+
+    private String templateContent;
+
+    private static final long serialVersionUID = 1L;
+}
\ No newline at end of file

backend/src/main/java/io/dataease/base/mapper/PanelPdfTemplateMapper.java

+package io.dataease.base.mapper;
+
+import io.dataease.base.domain.PanelPdfTemplate;
+import io.dataease.base.domain.PanelPdfTemplateExample;
+import java.util.List;
+import org.apache.ibatis.annotations.Param;
+
+public interface PanelPdfTemplateMapper {
+    long countByExample(PanelPdfTemplateExample example);
+
+    int deleteByExample(PanelPdfTemplateExample example);
+
+    int deleteByPrimaryKey(String id);
+
+    int insert(PanelPdfTemplate record);
+
+    int insertSelective(PanelPdfTemplate record);
+
+    List<PanelPdfTemplate> selectByExampleWithBLOBs(PanelPdfTemplateExample example);
+
+    List<PanelPdfTemplate> selectByExample(PanelPdfTemplateExample example);
+
+    PanelPdfTemplate selectByPrimaryKey(String id);
+
+    int updateByExampleSelective(@Param("record") PanelPdfTemplate record, @Param("example") PanelPdfTemplateExample example);
+
+    int updateByExampleWithBLOBs(@Param("record") PanelPdfTemplate record, @Param("example") PanelPdfTemplateExample example);
+
+    int updateByExample(@Param("record") PanelPdfTemplate record, @Param("example") PanelPdfTemplateExample example);
+
+    int updateByPrimaryKeySelective(PanelPdfTemplate record);
+
+    int updateByPrimaryKeyWithBLOBs(PanelPdfTemplate record);
+
+    int updateByPrimaryKey(PanelPdfTemplate record);
+}
\ No newline at end of file

backend/src/main/java/io/dataease/controller/panel/PanelPdfTemplateController.java

+package io.dataease.controller.panel;
+
+import com.github.xiaoymin.knife4j.annotations.ApiSupport;
+import io.dataease.base.domain.PanelPdfTemplate;
+import io.dataease.service.panel.PanelPdfTemplateService;
+import io.swagger.annotations.Api;
+import org.springframework.web.bind.annotation.*;
+
+import javax.annotation.Resource;
+import java.util.List;
+
+
+/**
+ * Author: wangjiahao
+ * Date: 2021-03-05
+ * Description:
+ */
+@Api(tags = "仪表板：PDF导出模板")
+@ApiSupport(order = 170)
+@RestController
+@RequestMapping("pdf-template")
+public class PanelPdfTemplateController {
+
+    @Resource
+    private PanelPdfTemplateService panelPdfTemplateService;
+
+    @GetMapping("queryAll")
+    public List<PanelPdfTemplate> queryAll(){
+        return panelPdfTemplateService.queryAll();
+    }
+
+
+}

backend/src/main/java/io/dataease/provider/doris/DorisQueryProvider.java

@@ -690,7 +690,7 @@ public class DorisQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5 || field.getDeExtractType() == 1) {
                     whereName = String.format(DorisConstants.STR_TO_DATE, originName, DorisConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(DorisConstants.CAST, originName, DorisConstants.DEFAULT_INT_FORMAT) + "/1000";
                     whereName = String.format(DorisConstants.FROM_UNIXTIME, cast, DorisConstants.DEFAULT_DATE_FORMAT);
                 }
@@ -747,7 +747,7 @@ public class DorisQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5 || field.getDeExtractType() == 1) {
                     whereName = String.format(DorisConstants.STR_TO_DATE, originName, DorisConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(DorisConstants.CAST, originName, DorisConstants.DEFAULT_INT_FORMAT) + "/1000";
                     whereName = String.format(DorisConstants.FROM_UNIXTIME, cast, DorisConstants.DEFAULT_DATE_FORMAT);
                 }

backend/src/main/java/io/dataease/provider/mysql/MysqlQueryProvider.java

@@ -675,10 +675,13 @@ public class MysqlQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(MySQLConstants.STR_TO_DATE, originName, MySQLConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(MySQLConstants.CAST, originName, MySQLConstants.DEFAULT_INT_FORMAT) + "/1000";
                     whereName = String.format(MySQLConstants.FROM_UNIXTIME, cast, MySQLConstants.DEFAULT_DATE_FORMAT);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }
@@ -730,10 +733,13 @@ public class MysqlQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(MySQLConstants.STR_TO_DATE, originName, MySQLConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(MySQLConstants.CAST, originName, MySQLConstants.DEFAULT_INT_FORMAT) + "/1000";
                     whereName = String.format(MySQLConstants.FROM_UNIXTIME, cast, MySQLConstants.DEFAULT_DATE_FORMAT);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }

backend/src/main/java/io/dataease/provider/oracle/OracleQueryProvider.java

@@ -710,10 +710,13 @@ public class OracleQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(OracleConstants.TO_DATE, originName, OracleConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(OracleConstants.CAST, originName, OracleConstants.DEFAULT_INT_FORMAT) + "/1000";
                     whereName = String.format(OracleConstants.FROM_UNIXTIME, cast, OracleConstants.DEFAULT_DATE_FORMAT);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }
@@ -769,10 +772,13 @@ public class OracleQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(OracleConstants.TO_DATE, originName, OracleConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(OracleConstants.CAST, originName, OracleConstants.DEFAULT_INT_FORMAT) + "/1000";
                     whereName = String.format(OracleConstants.FROM_UNIXTIME, cast, OracleConstants.DEFAULT_DATE_FORMAT);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }

backend/src/main/java/io/dataease/provider/pg/PgQueryProvider.java

@@ -702,10 +702,13 @@ public class PgQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(PgConstants.TO_DATE, originName, PgConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(PgConstants.CAST, originName, "bigint");
                     whereName = String.format(PgConstants.FROM_UNIXTIME, cast);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }
@@ -757,10 +760,13 @@ public class PgQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(PgConstants.TO_DATE, originName, PgConstants.DEFAULT_DATE_FORMAT);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(PgConstants.CAST, originName, "bigint");
                     whereName = String.format(PgConstants.FROM_UNIXTIME, cast);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }

backend/src/main/java/io/dataease/provider/sqlserver/SqlserverQueryProvider.java

@@ -657,10 +657,13 @@ public class SqlserverQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(SqlServerSQLConstants.STRING_TO_DATE, originName);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(SqlServerSQLConstants.LONG_TO_DATE, originName + "/1000");
                     whereName = String.format(SqlServerSQLConstants.FROM_UNIXTIME, cast);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }
@@ -703,10 +706,13 @@ public class SqlserverQueryProvider extends QueryProvider {
                 if (field.getDeExtractType() == 0 || field.getDeExtractType() == 5) {
                     whereName = String.format(SqlServerSQLConstants.STRING_TO_DATE, originName);
                 }
-                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3) {
+                if (field.getDeExtractType() == 2 || field.getDeExtractType() == 3 || field.getDeExtractType() == 4) {
                     String cast = String.format(SqlServerSQLConstants.LONG_TO_DATE, originName + "/1000");
                     whereName = String.format(SqlServerSQLConstants.FROM_UNIXTIME, cast);
                 }
+                if (field.getDeExtractType() == 1) {
+                    whereName = originName;
+                }
             } else {
                 whereName = originName;
             }

backend/src/main/java/io/dataease/service/panel/PanelGroupService.java

@@ -103,7 +103,19 @@ public class PanelGroupService {
             newDefaultPanel.setCreateBy(AuthUtils.getUser().getUsername());
             checkPanelName(newDefaultPanel.getName(), newDefaultPanel.getPid(), PanelConstants.OPT_TYPE_INSERT, newDefaultPanel.getId());
             panelGroupMapper.insertSelective(newDefaultPanel);
-        } else {
+        }  else if ("copy".equals(request.getOptType())) {
+            panelId = UUID.randomUUID().toString();
+            // 复制模板
+            PanelGroupWithBLOBs newPanel = panelGroupMapper.selectByPrimaryKey(request.getId());
+            // 插入校验
+            if (StringUtils.isNotEmpty(request.getName())) {
+                checkPanelName(request.getName(), newPanel.getPid(), PanelConstants.OPT_TYPE_INSERT, request.getId());
+            }
+            newPanel.setName(request.getName());
+            newPanel.setId(panelId);
+            newPanel.setCreateBy(AuthUtils.getUser().getUsername());
+            panelGroupMapper.insertSelective(newPanel);
+        }else {
             // 更新
             if (StringUtils.isNotEmpty(request.getName())) {
                 checkPanelName(request.getName(), request.getPid(), PanelConstants.OPT_TYPE_UPDATE, request.getId());

backend/src/main/java/io/dataease/service/panel/PanelPdfTemplateService.java

+package io.dataease.service.panel;
+
+import io.dataease.base.domain.PanelPdfTemplate;
+import io.dataease.base.domain.PanelPdfTemplateExample;
+import io.dataease.base.mapper.PanelPdfTemplateMapper;
+import org.springframework.stereotype.Service;
+
+import javax.annotation.Resource;
+import java.util.List;
+
+/**
+ * Author: wangjiahao
+ * Date: 9/1/21
+ * Description:
+ */
+@Service
+public class PanelPdfTemplateService {
+
+    @Resource
+    private PanelPdfTemplateMapper panelPdfTemplateMapper;
+
+    public List<PanelPdfTemplate> queryAll(){
+        PanelPdfTemplateExample example = new PanelPdfTemplateExample();
+        example.setOrderByClause("sort asc");
+        return panelPdfTemplateMapper.selectByExampleWithBLOBs(example);
+    }
+}

backend/src/main/resources/db/migration/V26__de1.3.sql

@@ -4,4 +4,50 @@
 BEGIN;
 INSERT INTO `sys_msg_type` VALUES (7, 0, 'i18n_msg_type_ds_invalid', 'datasource', 'to-msg-ds');
 INSERT INTO `sys_msg_type` VALUES (8, 7, 'i18n_msg_type_ds_invalid', 'datasource', 'to-msg-ds');
-COMMIT;
\ No newline at end of file
+COMMIT;
+
+-- ----------------------------
+-- Table structure for system_parameter
+-- ----------------------------
+DROP TABLE IF EXISTS `system_parameter`;
+CREATE TABLE `system_parameter` (
+  `param_key` varchar(64) NOT NULL COMMENT 'Parameter name',
+  `param_value` varchar(255) DEFAULT NULL COMMENT 'Parameter value',
+  `type` varchar(100) NOT NULL DEFAULT 'text' COMMENT 'Parameter type',
+  `sort` int(5) DEFAULT NULL COMMENT 'Sort',
+  PRIMARY KEY (`param_key`)
+) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
+
+-- ----------------------------
+-- Records of system_parameter
+-- ----------------------------
+BEGIN;
+INSERT INTO `system_parameter` VALUES ('', NULL, 'text', NULL);
+INSERT INTO `system_parameter` VALUES ('default.language', 'zh_CN', 'text', -1);
+INSERT INTO `system_parameter` VALUES ('ui.favicon', NULL, 'file', -1);
+INSERT INTO `system_parameter` VALUES ('ui.loginImage', NULL, 'file', 4);
+INSERT INTO `system_parameter` VALUES ('ui.loginLogo', NULL, 'file', 5);
+INSERT INTO `system_parameter` VALUES ('ui.loginTitle', NULL, 'text', 3);
+INSERT INTO `system_parameter` VALUES ('ui.logo', NULL, 'file', 6);
+INSERT INTO `system_parameter` VALUES ('ui.theme', NULL, 'text', 2);
+INSERT INTO `system_parameter` VALUES ('ui.title', NULL, 'text', 1);
+INSERT INTO `system_parameter` VALUES ('ui.topMenuActiveColor', NULL, 'text', 8);
+INSERT INTO `system_parameter` VALUES ('ui.topMenuColor', NULL, 'text', 7);
+INSERT INTO `system_parameter` VALUES ('ui.topMenuTextActiveColor', NULL, 'text', 10);
+INSERT INTO `system_parameter` VALUES ('ui.topMenuTextColor', NULL, 'text', 9);
+COMMIT;
+
+-- ----------------------------
+-- Table structure for panel_pdf_template
+-- ----------------------------
+DROP TABLE IF EXISTS `panel_pdf_template`;
+CREATE TABLE `panel_pdf_template` (
+  `id` varchar(50) NOT NULL COMMENT 'id',
+  `name` varchar(255) DEFAULT NULL COMMENT '模板名称',
+  `create_time` bigint(13) DEFAULT NULL COMMENT '创建时间',
+  `create_user` varchar(255) DEFAULT NULL COMMENT '创建人',
+  `template_content` longtext COMMENT '模板内容',
+  `sort` int(8) DEFAULT NULL COMMENT '排序',
+  PRIMARY KEY (`id`)
+) ENGINE=InnoDB DEFAULT CHARSET=utf8;
+

backend/src/main/resources/generatorConfig.xml

@@ -64,7 +64,7 @@
 
         <!--要生成的数据库表 -->
 
-        <table tableName="datasource"/>
+        <table tableName="panel_pdf_template"/>
 <!--        <table tableName="sys_dict_item"/>-->
 <!--        <table tableName="dataset_table_field"/>-->
 <!--        <table tableName="v_chart">-->

frontend/package.json

@@ -45,6 +45,7 @@
     "vue-fullscreen": "^2.5.2",
     "vue-i18n": "7.3.2",
     "vue-router": "3.0.6",
+    "vue-to-pdf": "^1.0.0",
     "vue-uuid": "2.0.2",
     "vuedraggable": "^2.24.3",
     "vuex": "3.1.0",

frontend/src/api/panel/pdfTemplate.js

+import request from '@/utils/request'
+
+
+export function queryAll() {
+  return request({
+    url: '/pdf-template/queryAll',
+    method: 'get',
+    loading: true,
+    timeout: 30000
+  })
+}

frontend/src/components/LangSelect/index.vue

 <template>
   <el-dropdown style="display: flex;align-items: center;" trigger="click" class="international" @command="handleSetLanguage">
     <div>
-      <svg-icon class-name="international-icon" icon-class="language" />
+      <svg-icon :style="{color: topMenuTextColor}" class-name="international-icon" icon-class="language" />
     </div>
     <el-dropdown-menu slot="dropdown">
       <el-dropdown-item :disabled="language==='zh_CN'" command="zh_CN">
@@ -24,10 +24,18 @@
 </template>
 
 <script>
+import variables from '@/styles/variables.scss'
 export default {
   computed: {
     language() {
       return this.$store.getters.language
+    },
+    variables() {
+      return variables
+    },
+    topMenuTextColor() {
+      if (this.$store.getters.uiInfo && this.$store.getters.uiInfo['ui.topMenuTextColor'] && this.$store.getters.uiInfo['ui.topMenuTextColor'].paramValue) { return this.$store.getters.uiInfo['ui.topMenuTextColor'].paramValue }
+      return this.variables.topBarMenuText
     }
   },
   methods: {

frontend/src/components/Notification/index.vue

@@ -232,7 +232,7 @@ export default {
     right: 178px;
     top: 8px;
     background: red;
-    color: #fff;
+    // color: #fff;
     border-radius: 17px;
     padding: 4px 7px;
     font-size: 16px;

frontend/src/components/RightPanel/index.vue

-<template>
-  <div ref="rightPanel" :class="{show:show}" class="rightPanel-container">
-    <div class="rightPanel-background" />
-    <div class="rightPanel">
-      <!--      <div class="handle-button" :style="{'top':buttonTop+'px','background-color':theme}" @click="show=!show">-->
-      <!--        <i :class="show?'el-icon-close':'el-icon-setting'" />-->
-      <!--      </div>-->
-      <div class="rightPanel-items">
-        <slot />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { addClass, removeClass } from '@/utils'
-
-export default {
-  name: 'RightPanel',
-  props: {
-    clickNotClose: {
-      default: false,
-      type: Boolean
-    },
-    buttonTop: {
-      default: 250,
-      type: Number
-    }
-  },
-  data() {
-    return {
-      show: false
-    }
-  },
-  computed: {
-    theme() {
-      return this.$store.state.settings.theme
-    }
-  },
-  watch: {
-    show(value) {
-      if (value && !this.clickNotClose) {
-        this.addEventClick()
-      }
-      if (value) {
-        addClass(document.body, 'showRightPanel')
-      } else {
-        removeClass(document.body, 'showRightPanel')
-      }
-    }
-  },
-  mounted() {
-    this.insertToBody()
-  },
-  beforeDestroy() {
-    const elx = this.$refs.rightPanel
-    elx.remove()
-  },
-  methods: {
-    addEventClick() {
-      window.addEventListener('click', this.closeSidebar)
-    },
-    closeSidebar(evt) {
-      const parent = evt.target.closest('.rightPanel')
-      if (!parent) {
-        this.show = false
-        window.removeEventListener('click', this.closeSidebar)
-      }
-    },
-    insertToBody() {
-      const elx = this.$refs.rightPanel
-      const body = document.querySelector('body')
-      body.insertBefore(elx, body.firstChild)
-    }
-  }
-}
-</script>
-
-<style>
-.showRightPanel {
-  overflow: hidden;
-  position: relative;
-  width:100%;
-}
-</style>
-
-<style lang="scss" scoped>
-.rightPanel-background {
-  position: fixed;
-  top: 0;
-  left: 0;
-  opacity: 0;
-  transition: opacity .3s cubic-bezier(.7, .3, .1, 1);
-  background: rgba(0, 0, 0, .2);
-  z-index: -1;
-}
-
-.rightPanel {
-  width: 100%;
-  max-width: 260px;
-  height: 100vh;
-  position: fixed;
-  top: 0;
-  right: 0;
-  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05);
-  transition: all .25s cubic-bezier(.7, .3, .1, 1);
-  transform: translate(100%);
-  background: #fff;
-  z-index: 40000;
-}
-
-.show {
-  transition: all .3s cubic-bezier(.7, .3, .1, 1);
-
-  .rightPanel-background {
-    z-index: 20000;
-    opacity: 1;
-    width: 100%;
-    height: 100%;
-  }
-
-  .rightPanel {
-    transform: translate(0);
-  }
-}
-
-.handle-button {
-  width: 48px;
-  height: 48px;
-  position: absolute;
-  left: -48px;
-  text-align: center;
-  font-size: 24px;
-  border-radius: 6px 0 0 6px !important;
-  z-index: 0;
-  pointer-events: auto;
-  cursor: pointer;
-  color: #fff;
-  line-height: 48px;
-  i {
-    font-size: 24px;
-    line-height: 48px;
-  }
-}
-</style>

frontend/src/components/Settings/index.vue

-<template>
-  <div class="drawer-container">
-    <div>
-      <h3 class="drawer-title">{{ $t('settings.title') }}</h3>
-
-      <div class="drawer-item">
-        <span>{{ $t('settings.theme') }}</span>
-        <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
-      </div>
-
-      <div class="drawer-item">
-        <span>{{ $t('settings.fixedHeader') }}</span>
-        <el-switch v-model="fixedHeader" class="drawer-switch" />
-      </div>
-
-      <div class="drawer-item">
-        <span>{{ $t('settings.sidebarLogo') }}</span>
-        <el-switch v-model="sidebarLogo" class="drawer-switch" />
-      </div>
-
-    </div>
-  </div>
-</template>
-
-<script>
-import ThemePicker from '@/components/ThemePicker'
-
-export default {
-  name: 'Settings',
-  components: { ThemePicker },
-  data() {
-    return {}
-  },
-  computed: {
-
-    fixedHeader: {
-      get() {
-        return this.$store.state.settings.fixedHeader
-      },
-      set(val) {
-        this.$store.dispatch('settings/changeSetting', {
-          key: 'fixedHeader',
-          value: val
-        })
-      }
-    },
-
-    sidebarLogo: {
-      get() {
-        return this.$store.state.settings.sidebarLogo
-      },
-      set(val) {
-        this.$store.dispatch('settings/changeSetting', {
-          key: 'sidebarLogo',
-          value: val
-        })
-      }
-    },
-
-    lang() {
-      return this.$store.getters.language
-    }
-  },
-  methods: {
-    themeChange(val) {
-      this.$store.dispatch('settings/changeSetting', {
-        key: 'theme',
-        value: val
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.drawer-container {
-  padding: 24px;
-  font-size: 14px;
-  line-height: 1.5;
-  word-wrap: break-word;
-
-  .drawer-title {
-    margin-bottom: 12px;
-    color: rgba(0, 0, 0, .85);
-    font-size: 14px;
-    line-height: 22px;
-  }
-
-  .drawer-item {
-    color: rgba(0, 0, 0, .65);
-    font-size: 14px;
-    padding: 12px 0;
-  }
-
-  .drawer-switch {
-    float: right
-  }
-
-  .job-link{
-    display: block;
-    position: absolute;
-    width: 100%;
-    left: 0;
-    bottom: 0;
-  }
-}
-</style>

frontend/src/components/ThemePicker/index.vue

@@ -8,9 +8,9 @@
 </template>
 
 <script>
+import { getThemeCluster } from '@/utils/style'
 const version = require('element-ui/package.json').version // element-ui version from node_modules
 const ORIGINAL_THEME = '#409EFF' // default color
-import Cookies from 'js-cookie'
 export default {
   data() {
     return {
@@ -31,15 +31,20 @@ export default {
       immediate: true
     },
     async theme(val) {
-      Cookies.set('theme', val, { expires: 365 })
-      const oldVal = this.chalk ? this.theme : Cookies.get('theme') ? Cookies.get('theme') : ORIGINAL_THEME
+      this.switch(val)
+    }
+  },
+
+  methods: {
+    async switch(val) {
+      const oldVal = this.chalk ? this.theme : ORIGINAL_THEME
       if (typeof val !== 'string') return
-      const themeCluster = this.getThemeCluster(val.replace('#', ''))
-      const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
+      const themeCluster = getThemeCluster(val.replace('#', ''))
+      const originalCluster = getThemeCluster(oldVal.replace('#', ''))
 
       const getHandler = (variable, id) => {
         return () => {
-          const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''))
+          const originalCluster = getThemeCluster(ORIGINAL_THEME.replace('#', ''))
           const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster)
 
           let styleTag = document.getElementById(id)
@@ -73,10 +78,7 @@ export default {
       })
 
       this.$emit('change', val)
-    }
-  },
-
-  methods: {
+    },
     updateStyle(style, oldCluster, newCluster) {
       let newStyle = style
       oldCluster.forEach((color, index) => {
@@ -97,8 +99,8 @@ export default {
         xhr.open('GET', url)
         xhr.send()
       })
-    },
-
+    }
+    /*
     getThemeCluster(theme) {
       const tintColor = (color, tint) => {
         let red = parseInt(color.slice(0, 2), 16)
@@ -143,6 +145,8 @@ export default {
       clusters.push(shadeColor(theme, 0.1))
       return clusters
     }
+     */
+
   }
 }
 </script>

frontend/src/components/back-button/index.vue

@@ -31,8 +31,6 @@ export default {
 </script>
 
 <style lang="scss">
-@import "~@/styles/mixin.scss";
-@import "~@/styles/variables.scss";
 
 .back-button {
   cursor: pointer;

frontend/src/components/business/LayoutContent.vue

@@ -39,11 +39,9 @@ export default {
 
 <style lang="scss">
 @import "~@/styles/mixin.scss";
-@import "~@/styles/variables.scss";
 
 .content-container {
   transition: 0.3s;
-  color: $--color-text-primary;
   background-color: #FFFFFF;
   overflow: auto;
   height: 100%;

frontend/src/components/business/complex-table/index.vue

@@ -9,7 +9,7 @@
       <div>
         <slot name="toolbar" />
       </div>
-      <fu-search-bar v-bind="searchConfig"  @exec="search" ref="search">
+      <fu-search-bar ref="search" v-bind="searchConfig" @exec="search">
         <template #complex>
           <slot name="complex" />
         </template>
@@ -65,7 +65,7 @@ export default {
   },
   data() {
     return {
-      condition: {},
+      condition: {}
     }
   },
   mounted() {
@@ -86,7 +86,6 @@ export default {
 
 <style lang="scss">
 @import "~@/styles/mixin.scss";
-@import "~@/styles/variables.scss";
 .complex-table {
   .complex-table__header {
     @include flex-row(flex-start, center);

frontend/src/components/business/tree-table/index.vue

@@ -79,7 +79,6 @@ export default {
 
 <style lang="scss">
 @import "~@/styles/mixin.scss";
-@import "~@/styles/variables.scss";
 .complex-table {
   .complex-table__header {
     @include flex-row(flex-start, center);

frontend/src/components/canvas/components/Editor/Preview.vue

 <template>
-  <div id="canvasInfoTemp" :style="customStyle" class="bg" @mouseup="deselectCurComponent" @mousedown="handleMouseDown">
+  <div id="canvasInfoTemp" ref="canvasInfoTemp" :style="customStyle" class="bg" @mouseup="deselectCurComponent" @mousedown="handleMouseDown">
     <el-row v-if="componentDataShow.length===0" style="height: 100%;" class="custom-position">
       {{ $t('panel.panelNull') }}
     </el-row>

frontend/src/icons/svg/PDF.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1630573390175" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2229" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M1024 140.8V128c0-19.2-25.6-38.4-44.8-38.4H608V0h-70.4L0 96v832c179.2 32 352 64 531.2 96h70.4v-96h352c19.2 0 44.8 0 57.6-12.8 12.8-19.2 12.8-44.8 12.8-70.4v-704zM326.4 537.6c-25.6 12.8-51.2 12.8-83.2 12.8v128l-64-6.4V313.6c57.6 0 128-25.6 179.2 19.2 51.2 64 38.4 172.8-32 204.8zM985.6 896h-384V128h384v768z" fill="#A33639" p-id="2230"></path><path d="M953.6 832v-51.2h-352V832zM652.8 697.6h300.8v44.8H652.8z m0-160h300.8v44.8H652.8z m0 83.2h300.8v44.8H652.8z m128-332.8c-6.4 25.6-19.2 57.6-32 83.2-64 25.6-64 44.8-64 51.2 0 6.4 6.4 12.8 12.8 19.2h12.8c19.2 0 38.4-19.2 57.6-57.6 25.6-12.8 51.2-19.2 76.8-25.6 12.8 12.8 32 19.2 51.2 19.2 12.8 0 32 0 32-25.6 0-6.4-6.4-25.6-32-25.6-12.8 0-25.6 0-38.4 6.4-19.2-12.8-32-32-38.4-51.2 12.8-38.4 12.8-64 6.4-70.4-6.4-6.4-12.8-6.4-19.2-6.4-6.4 0-19.2 6.4-19.2 12.8-32 19.2-12.8 57.6-6.4 70.4zM704 422.4c6.4-6.4 12.8-12.8 25.6-19.2-6.4 6.4-19.2 12.8-25.6 19.2zM883.2 352c12.8 0 19.2 6.4 19.2 6.4h-12.8c-6.4 0-12.8 0-19.2-6.4h12.8z m-70.4-6.4c-12.8 6.4-25.6 6.4-38.4 12.8 6.4-12.8 12.8-25.6 19.2-44.8 6.4 12.8 12.8 25.6 19.2 32zM787.2 224s6.4 0 0 0c6.4 12.8 6.4 25.6 6.4 32-6.4-12.8-6.4-19.2-6.4-32z m-544 153.6v115.2c19.2 0 51.2 0 64-25.6 12.8-25.6 12.8-51.2 0-76.8-12.8-19.2-38.4-12.8-64-12.8z" fill="#A33639" p-id="2231"></path></svg>
\ No newline at end of file

frontend/src/icons/svg/docs.svg

-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1623897748319" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="23219" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M512 1024C227.556 1024 0 796.444 0 512S227.556 0 512 0s512 227.556 512 512-227.556 512-512 512z m0-68.267c244.622 0 443.733-199.11 443.733-443.733S756.623 68.267 512 68.267 68.267 267.377 68.267 512 267.377 955.733 512 955.733z m11.378-694.044c45.51 0 85.333 11.378 113.778 39.822 28.444 22.756 45.51 62.578 45.51 102.4 0 34.133-11.377 68.267-28.444 91.022-5.689 5.69-28.444 28.445-62.578 56.89-11.377 11.377-22.755 22.755-28.444 39.821-5.689 17.067-11.378 34.134-11.378 45.512v11.377h-79.644v-11.377c0-28.445 5.689-51.2 17.066-68.267 11.378-22.756 39.823-51.2 79.645-91.022l11.378-11.378c11.377-17.067 22.755-34.133 22.755-51.2 0-22.756-5.689-45.511-22.755-56.889-17.067-17.067-34.134-22.756-62.578-22.756-34.133 0-56.889 11.378-73.956 28.445-11.377 17.067-17.066 39.822-17.066 73.955H352.71c0-51.2 17.067-96.71 45.511-125.155 28.445-34.133 73.956-51.2 125.156-51.2zM512 688.356c17.067 0 28.444 5.688 39.822 17.066 11.378 11.378 17.067 22.756 17.067 39.822 0 17.067-5.689 28.445-17.067 39.823-11.378 11.377-22.755 17.066-39.822 17.066-28.444 0-51.2-22.755-51.2-51.2 0-17.066 5.689-28.444 17.067-39.822 5.689-17.067 22.755-22.755 34.133-22.755z" p-id="23220" fill="#707070"></path></svg>
\ No newline at end of file
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1623897748319" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="23219" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M512 1024C227.556 1024 0 796.444 0 512S227.556 0 512 0s512 227.556 512 512-227.556 512-512 512z m0-68.267c244.622 0 443.733-199.11 443.733-443.733S756.623 68.267 512 68.267 68.267 267.377 68.267 512 267.377 955.733 512 955.733z m11.378-694.044c45.51 0 85.333 11.378 113.778 39.822 28.444 22.756 45.51 62.578 45.51 102.4 0 34.133-11.377 68.267-28.444 91.022-5.689 5.69-28.444 28.445-62.578 56.89-11.377 11.377-22.755 22.755-28.444 39.821-5.689 17.067-11.378 34.134-11.378 45.512v11.377h-79.644v-11.377c0-28.445 5.689-51.2 17.066-68.267 11.378-22.756 39.823-51.2 79.645-91.022l11.378-11.378c11.377-17.067 22.755-34.133 22.755-51.2 0-22.756-5.689-45.511-22.755-56.889-17.067-17.067-34.134-22.756-62.578-22.756-34.133 0-56.889 11.378-73.956 28.445-11.377 17.067-17.066 39.822-17.066 73.955H352.71c0-51.2 17.067-96.71 45.511-125.155 28.445-34.133 73.956-51.2 125.156-51.2zM512 688.356c17.067 0 28.444 5.688 39.822 17.066 11.378 11.378 17.067 22.756 17.067 39.822 0 17.067-5.689 28.445-17.067 39.823-11.378 11.377-22.755 17.066-39.822 17.066-28.444 0-51.2-22.755-51.2-51.2 0-17.066 5.689-28.444 17.067-39.822 5.689-17.067 22.755-22.755 34.133-22.755z" p-id="23220" ></path></svg>
\ No newline at end of file

frontend/src/icons/svg/language.svg

-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1623896817205" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12052" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M616.521143 407.478857h313.417143a69.485714 69.485714 0 0 1 69.705143 69.705143v452.754286a69.485714 69.485714 0 0 1-69.705143 69.705143h-452.754286a69.485714 69.485714 0 0 1-69.705143-69.705143V616.594286H94.061714a69.485714 69.485714 0 0 1-69.705143-69.705143v-452.754286a69.485714 69.485714 0 0 1 69.705143-69.705143h452.754286a69.485714 69.485714 0 0 1 69.705143 69.705143V407.405714z m0 69.705143v69.632a69.485714 69.485714 0 0 1-69.705143 69.705143h-69.632v278.674286c0 19.163429 15.579429 34.742857 34.816 34.742857h383.122286a34.816 34.816 0 0 0 34.816-34.742857V512a34.816 34.816 0 0 0-34.816-34.816h-278.674286zM94.061714 128.731429V512c0 19.236571 15.579429 34.816 34.742857 34.816H512A34.816 34.816 0 0 0 546.816 512V128.877714A34.816 34.816 0 0 0 512 94.061714H128.877714a34.816 34.816 0 0 0-34.816 34.742857z m69.632 265.947428V219.574857h122.733715V146.285714h50.834285c7.021714 1.024 10.532571 1.974857 10.532572 2.998857a11.483429 11.483429 0 0 1-1.462857 4.461715c-3.072 8.045714-4.534857 17.481143-4.534858 28.452571v37.376h130.194286v170.642286h-55.369143v-22.454857H341.796571v128.731428h-53.906285v-128.731428H214.601143v26.989714h-50.907429z m50.834286-133.193143v65.828572h73.362286v-65.828572H214.601143z m202.093714 65.828572v-65.828572H341.796571v65.828572h74.825143z m221.915429 531.163428h-56.905143l100.278857-276.918857h70.363429l97.28 276.918857h-59.830857l-20.992-58.368H659.456l-20.918857 58.368z m35.84-104.813714h79.36L716.361143 635.611429h-1.462857l-40.448 118.198857z m255.561143-450.706286h-69.632a139.337143 139.337143 0 0 0-139.337143-139.337143v-69.632a208.969143 208.969143 0 0 1 208.969143 208.969143zM94.061714 720.969143h69.632c0 76.946286 62.390857 139.337143 139.337143 139.337143v69.632a208.969143 208.969143 0 0 1-208.969143-208.969143z" p-id="12053" fill="#8a8a8a"></path></svg>
\ No newline at end of file
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1623896817205" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12052" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M616.521143 407.478857h313.417143a69.485714 69.485714 0 0 1 69.705143 69.705143v452.754286a69.485714 69.485714 0 0 1-69.705143 69.705143h-452.754286a69.485714 69.485714 0 0 1-69.705143-69.705143V616.594286H94.061714a69.485714 69.485714 0 0 1-69.705143-69.705143v-452.754286a69.485714 69.485714 0 0 1 69.705143-69.705143h452.754286a69.485714 69.485714 0 0 1 69.705143 69.705143V407.405714z m0 69.705143v69.632a69.485714 69.485714 0 0 1-69.705143 69.705143h-69.632v278.674286c0 19.163429 15.579429 34.742857 34.816 34.742857h383.122286a34.816 34.816 0 0 0 34.816-34.742857V512a34.816 34.816 0 0 0-34.816-34.816h-278.674286zM94.061714 128.731429V512c0 19.236571 15.579429 34.816 34.742857 34.816H512A34.816 34.816 0 0 0 546.816 512V128.877714A34.816 34.816 0 0 0 512 94.061714H128.877714a34.816 34.816 0 0 0-34.816 34.742857z m69.632 265.947428V219.574857h122.733715V146.285714h50.834285c7.021714 1.024 10.532571 1.974857 10.532572 2.998857a11.483429 11.483429 0 0 1-1.462857 4.461715c-3.072 8.045714-4.534857 17.481143-4.534858 28.452571v37.376h130.194286v170.642286h-55.369143v-22.454857H341.796571v128.731428h-53.906285v-128.731428H214.601143v26.989714h-50.907429z m50.834286-133.193143v65.828572h73.362286v-65.828572H214.601143z m202.093714 65.828572v-65.828572H341.796571v65.828572h74.825143z m221.915429 531.163428h-56.905143l100.278857-276.918857h70.363429l97.28 276.918857h-59.830857l-20.992-58.368H659.456l-20.918857 58.368z m35.84-104.813714h79.36L716.361143 635.611429h-1.462857l-40.448 118.198857z m255.561143-450.706286h-69.632a139.337143 139.337143 0 0 0-139.337143-139.337143v-69.632a208.969143 208.969143 0 0 1 208.969143 208.969143zM94.061714 720.969143h69.632c0 76.946286 62.390857 139.337143 139.337143 139.337143v69.632a208.969143 208.969143 0 0 1-208.969143-208.969143z" p-id="12053" ></path></svg>
\ No newline at end of file

frontend/src/lang/en.js

@@ -849,7 +849,12 @@ export default {
     custom_case: 'Custom',
     last_layer: 'This Is The Last Layer',
     radar_size: 'Size',
-    chart_mix: 'Mix'
+    chart_mix: 'Mix',
+    axis_value: 'Axis Value',
+    axis_value_min: 'Min',
+    axis_value_max: 'Max',
+    axis_value_split: 'Split',
+    axis_auto: 'Auto'
   },
   dataset: {
     sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',

frontend/src/lang/tw.js

@@ -848,7 +848,12 @@ export default {
     custom_case: '自定義',
     last_layer: '當前已經是最後一級',
     radar_size: '大小',
-    chart_mix: '組合圖'
+    chart_mix: '組合圖',
+    axis_value: '軸值',
+    axis_value_min: '最小值',
+    axis_value_max: '最大值',
+    axis_value_split: '間隔',
+    axis_auto: '自動'
   },
   dataset: {
     sheet_warn: '有多個sheet頁面，默認抽取第一個',

frontend/src/lang/zh.js

@@ -848,7 +848,12 @@ export default {
     custom_case: '自定义',
     last_layer: '当前已经是最后一级',
     radar_size: '大小',
-    chart_mix: '组合图'
+    chart_mix: '组合图',
+    axis_value: '轴值',
+    axis_value_min: '最小值',
+    axis_value_max: '最大值',
+    axis_value_split: '间隔',
+    axis_auto: '自动'
   },
   dataset: {
     sheet_warn: '有多个 Sheet 页，默认抽取第一个',
@@ -1245,7 +1250,16 @@ export default {
     loginImage: '登录页面右侧图片',
     loginTitle: '登录页面标题',
     title: '系统名称',
-    advice_size: '建议图片大小'
+    advice_size: '建议图片大小',
+    theme: '主题颜色',
+
+    topMenuColor: '头部背景',
+    topMenuActiveColor: '头部选中背景',
+
+    topMenuTextColor: '头部字体颜色',
+
+    topMenuTextActiveColor: '头部字体选中颜色'
+
   },
   auth: {
     authConfig: '权限配置',

frontend/src/layout/components/AppMain.vue

@@ -20,7 +20,6 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-    @import "~@/styles/variables.scss";
 
     .app-main {
         height: 100%;

frontend/src/layout/components/Licbar.vue

@@ -17,9 +17,9 @@ export default {
     }
   },
   computed: {
-    theme() {
+    /* theme() {
       return this.$store.state.settings.theme
-    },
+    }, */
     licValidate() {
       return this.$store.state.lic.validate
     },

frontend/src/layout/components/Settings/index.vue

-<template>
-  <div class="drawer-container">
-    <div>
-      <h3 class="drawer-title">系统布局设置</h3>
-
-      <div class="drawer-item">
-        <span>主题颜色</span>
-        <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
-      </div>
-
-      <!-- <div class="drawer-item">
-        <span>显示标签</span>
-        <el-switch v-model="tagsView" class="drawer-switch" />
-      </div>
-
-      <div class="drawer-item">
-        <span>固定头部</span>
-        <el-switch v-model="fixedHeader" class="drawer-switch" />
-      </div> -->
-
-      <div class="drawer-item">
-        <span>显示LOGO</span>
-        <el-switch v-model="sidebarLogo" class="drawer-switch" />
-      </div>
-
-      <!-- <div class="drawer-item">
-        <span>菜单UniqueOpened</span>
-        <el-switch v-model="uniqueOpened" class="drawer-switch" />
-      </div> -->
-
-      <div class="drawer-item">
-        <span>展开菜单</span>
-        <el-switch v-model="toggleSideBar" class="drawer-switch" />
-      </div>
-
-    </div>
-  </div>
-</template>
-
-<script>
-import ThemePicker from '@/components/ThemePicker'
-
-export default {
-  components: { ThemePicker },
-  data() {
-    return {
-      showMenu: true
-    }
-  },
-  computed: {
-    // fixedHeader: {
-    //   get() {
-    //     return this.$store.state.settings.fixedHeader
-    //   },
-    //   set(val) {
-    //     this.$store.dispatch('settings/changeSetting', {
-    //       key: 'fixedHeader',
-    //       value: val
-    //     })
-    //   }
-    // },
-    // tagsView: {
-    //   get() {
-    //     return this.$store.state.settings.tagsView
-    //   },
-    //   set(val) {
-    //     this.$store.dispatch('settings/changeSetting', {
-    //       key: 'tagsView',
-    //       value: val
-    //     })
-    //   }
-    // },
-    sidebarLogo: {
-      get() {
-        return this.$store.state.settings.sidebarLogo
-      },
-      set(val) {
-        this.$store.dispatch('settings/changeSetting', {
-          key: 'sidebarLogo',
-          value: val
-        })
-      }
-    },
-    toggleSideBar: {
-      get() {
-        return this.showMenu
-      },
-      set(val) {
-        this.showMenu = !this.showMenu
-        this.$store.dispatch('app/toggleSideBar')
-      }
-    }
-    // uniqueOpened: {
-    //   get() {
-    //     return this.$store.state.settings.uniqueOpened
-    //   },
-    //   set(val) {
-    //     this.$store.dispatch('settings/changeSetting', {
-    //       key: 'uniqueOpened',
-    //       value: val
-    //     })
-    //   }
-    // }
-  },
-  methods: {
-    themeChange(val) {
-      this.$store.dispatch('settings/changeSetting', {
-        key: 'theme',
-        value: val
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.drawer-container {
-  padding: 24px;
-  font-size: 14px;
-  line-height: 1.5;
-  word-wrap: break-word;
-
-  .drawer-title {
-    margin-bottom: 12px;
-    color: rgba(0, 0, 0, .85);
-    font-size: 14px;
-    line-height: 22px;
-  }
-
-  .drawer-item {
-    color: rgba(0, 0, 0, .65);
-    font-size: 14px;
-    padding: 12px 0;
-  }
-
-  .drawer-switch {
-    float: right
-  }
-}
-</style>

frontend/src/layout/components/Sidebar/Logo.vue

@@ -53,8 +53,7 @@ export default {
   width: 100%;
   height: 50px;
   line-height: 50px;
-//   background: #2b2f3a;
-  background-color: $menuBg;
+  background-color: $topBarBg;
   text-align: center;
   overflow: hidden;
 

frontend/src/layout/components/Sidebar/index.vue

 <template>
-  <div :class="{'has-logo':showLogo}">
+  <div :class="{'has-logo':showLogo}" :style="{'--active-bg': activeBg, '--theme':$store.state.settings.theme , '--left-menu-hovor': variables.leftMenuHovor}">
     <logo v-if="showLogo" :collapse="isCollapse" />
     <el-menu
       :default-active="activeMenu"
       :collapse="isCollapse"
-      :background-color="variables.menuBg"
-
       :unique-opened="false"
-      :active-text-color="variables.menuActiveText"
       :collapse-transition="false"
       mode="vertical"
     >
@@ -21,9 +18,12 @@ import { mapGetters } from 'vuex'
 import Logo from './Logo'
 import SidebarItem from './SidebarItem'
 import variables from '@/styles/variables.scss'
+import { getThemeCluster } from '@/utils/style'
 export default {
   components: { SidebarItem, Logo },
+
   computed: {
+
     ...mapGetters([
       'sidebar'
     ]),
@@ -48,7 +48,42 @@ export default {
     },
     isCollapse() {
       return false
+    },
+    activeBg() {
+      const theme = this.$store.state.settings.theme
+      const styleCluster = getThemeCluster(theme.replace('#', ''))
+      if (styleCluster.length > 2) {
+        const len = styleCluster.length
+        const val = styleCluster[len - 2]
+        return val
+      }
+      return ''
     }
   }
 }
 </script>
+
+<style lang="scss" scoped>
+.sidebar-container {
+    >>>li.el-menu-item.is-active {
+        background-color: var(--active-bg) !important;
+    }
+    >>>li.el-submenu.is-active:not(&:hover){
+         background-color: var(--active-bg) ;
+    }
+
+    >>>li.el-submenu__title {
+      &:hover {
+        background-color: var(--left-menu-hovor) !important;
+      }
+    }
+
+    >>>.el-submenu.is-active .el-submenu__title {
+      color: var(--theme) !important;
+    }
+
+    .is-active > .el-submenu__title {
+      color: var(--theme) !important;
+    }
+}
+</style>

frontend/src/layout/components/Topbar.vue

 <template>
-  <div class="top-nav" :style="{'background-color': '#f1f3f8'}">
+  <div class="top-nav" :style="{backgroundColor: topMenuColor, '--active-bg-color': topMenuActiveColor}">
     <div v-loading="!axiosFinished" class="log">
-      <!--      <img      v-if="!logoUrl" src="@/assets/DataEase-color.png" width="140" alt="" style="padding-top: 10px;">-->
       <svg-icon v-if="!logoUrl && axiosFinished" icon-class="DataEase" custom-class="top-nav-logo-icon" />
       <img v-if="logoUrl && axiosFinished" :src="logoUrl" width="140" alt="" style="padding-top: 10px;">
     </div>
     <el-menu
-      :active-text-color="variables.topMenuActiveText"
+      class="de-top-menu"
+      :background-color="topMenuColor"
+      :text-color="topMenuTextColor"
+      :active-text-color="topMenuTextActiveColor"
       :default-active="activeMenu"
       mode="horizontal"
-      :style="{'background-color': '#f1f3f8', 'margin-left': '260px', 'position': 'absolute'}"
+      :style="{'margin-left': '260px', 'position': 'absolute'}"
       @select="handleSelect"
     >
       <div v-for="item in permission_routes" :key="item.path" class="nav-item">
@@ -22,19 +24,9 @@
       </div>
     </el-menu>
 
-    <div class="right-menu">
+    <div class="right-menu" :style=" {color: topMenuTextColor}">
       <template>
-        <!--        <el-tooltip content="项目文档" effect="dark" placement="bottom">-->
-        <!--          <doc class="right-menu-item hover-effect" />-->
-        <!--        </el-tooltip>-->
 
-        <!--        <el-tooltip content="全屏缩放" effect="dark" placement="bottom">-->
-        <!--          <screenfull id="screenfull" class="right-menu-item hover-effect" />-->
-        <!--        </el-tooltip>-->
-
-        <!-- <el-tooltip :content="$t('navbar.size')" effect="dark" placement="bottom">
-          <size-select id="size-select" class="right-menu-item hover-effect" />
-        </el-tooltip> -->
         <notification class="right-menu-item hover-effect" />
         <lang-select class="right-menu-item hover-effect" />
         <div style="height: 100%;padding: 0 8px;" class="right-menu-item hover-effect">
@@ -45,7 +37,7 @@
       </template>
 
       <el-dropdown class="top-dropdown" style="display: flex;align-items: center; width:100px;">
-        <span class="el-dropdown-link" style="font-size: 14px;max-width: 80px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
+        <span :style=" {color: topMenuTextColor}" class="el-dropdown-link" style="font-size: 14px;max-width: 80px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
           {{ name }}
           <i class="el-icon-arrow-down el-icon--right" />
         </span>
@@ -61,9 +53,7 @@
           <router-link to="/person-pwd/index">
             <el-dropdown-item>{{ $t('user.change_password') }}</el-dropdown-item>
           </router-link>
-          <!--          <a href="https://de-docs.fit2cloud.com/" target="_blank">-->
-          <!--            <el-dropdown-item>{{ $t('commons.help_documentation') }} </el-dropdown-item>-->
-          <!--          </a>-->
+
           <router-link to="/about/index">
             <el-dropdown-item>{{ $t('commons.about_us') }}</el-dropdown-item>
           </router-link>
@@ -73,7 +63,9 @@
         </el-dropdown-menu>
       </el-dropdown>
     </div>
+    <theme-picker v-show="false" ref="de-theme" />
   </div>
+
 </template>
 
 <script>
@@ -82,19 +74,17 @@ import AppLink from './Sidebar/Link'
 import variables from '@/styles/variables.scss'
 import { isExternal } from '@/utils/validate'
 import Notification from '@/components/Notification'
-// import Screenfull from '@/components/Screenfull'
-// import SizeSelect from '@/components/SizeSelect'
+import bus from '@/utils/bus'
 import LangSelect from '@/components/LangSelect'
 import { getSysUI } from '@/utils/auth'
+import ThemePicker from '@/components/ThemePicker'
 export default {
   name: 'Topbar',
   components: {
     AppLink,
-    // Screenfull,
-    // SizeSelect,
     Notification,
-    LangSelect
-    // Doc
+    LangSelect,
+    ThemePicker
   },
   data() {
     return {
@@ -108,6 +98,26 @@ export default {
     theme() {
       return this.$store.state.settings.theme
     },
+
+    topMenuColor() {
+      if (this.$store.getters.uiInfo && this.$store.getters.uiInfo['ui.topMenuColor'] && this.$store.getters.uiInfo['ui.topMenuColor'].paramValue) { return this.$store.getters.uiInfo['ui.topMenuColor'].paramValue }
+      return this.variables.topBarBg
+    },
+    topMenuActiveColor() {
+      if (this.$store.getters.uiInfo && this.$store.getters.uiInfo['ui.topMenuActiveColor'] && this.$store.getters.uiInfo['ui.topMenuActiveColor'].paramValue) { return this.$store.getters.uiInfo['ui.topMenuActiveColor'].paramValue }
+      return this.variables.topBarMenuActive
+    },
+    topMenuTextColor() {
+      if (this.$store.getters.uiInfo && this.$store.getters.uiInfo['ui.topMenuTextColor'] && this.$store.getters.uiInfo['ui.topMenuTextColor'].paramValue) { return this.$store.getters.uiInfo['ui.topMenuTextColor'].paramValue }
+      return this.variables.topBarMenuText
+    },
+    topMenuTextActiveColor() {
+      if (this.$store.getters.uiInfo && this.$store.getters.uiInfo['ui.topMenuTextActiveColor'] && this.$store.getters.uiInfo['ui.topMenuTextActiveColor'].paramValue) { return this.$store.getters.uiInfo['ui.topMenuTextActiveColor'].paramValue }
+      return this.variables.topBarMenuTextActive
+    },
+    /* topMenuColor() {
+      return this.$store.getters.uiInfo.topMenuColor
+    }, */
     activeMenu() {
       const route = this.$route
       const { meta, path } = route
@@ -138,15 +148,14 @@ export default {
 
   mounted() {
     this.initCurrentRoutes()
+    bus.$on('set-theme-info', this.setThemeInfo)
+    bus.$on('set-top-menu-info', this.setTopMenuInfo)
+    bus.$on('set-top-menu-active-info', this.setTopMenuActiveInfo)
+    bus.$on('set-top-text-info', this.setTopTextInfo)
+    bus.$on('set-top-text-active-info', this.setTopTextActiveInfo)
   },
   created() {
-    this.$store.dispatch('user/getUI').then(() => {
-      this.uiInfo = getSysUI()
-      if (this.uiInfo['ui.logo'] && this.uiInfo['ui.logo'].paramValue) {
-        this.logoUrl = '/system/ui/image/' + this.uiInfo['ui.logo'].paramValue
-      }
-      this.axiosFinished = true
-    })
+    this.loadUiInfo()
   },
   methods: {
     // 通过当前路径找到二级菜单对应项，存到store，用来渲染左侧菜单
@@ -236,6 +245,38 @@ export default {
     async logout() {
       await this.$store.dispatch('user/logout')
       this.$router.push(`/login?redirect=${this.$route.fullPath}`)
+    },
+    loadUiInfo() {
+      this.$store.dispatch('user/getUI').then(() => {
+        this.uiInfo = getSysUI()
+        if (this.uiInfo['ui.logo'] && this.uiInfo['ui.logo'].paramValue) {
+          this.logoUrl = '/system/ui/image/' + this.uiInfo['ui.logo'].paramValue
+        }
+        if (this.uiInfo['ui.theme'] && this.uiInfo['ui.theme'].paramValue) {
+          const val = this.uiInfo['ui.theme'].paramValue
+          this.$store.dispatch('settings/changeSetting', {
+            key: 'theme',
+            value: val
+          })
+        }
+        this.axiosFinished = true
+      })
+    },
+    setThemeInfo(val) {
+      // console.log('切换的主题颜色是：' + val)
+      this.$refs['de-theme'] && this.$refs['de-theme'].switch && this.$refs['de-theme'].switch(val)
+    },
+    setTopMenuInfo(val) {
+      this.loadUiInfo()
+    },
+    setTopMenuActiveInfo(val) {
+      this.loadUiInfo()
+    },
+    setTopTextInfo(val) {
+      this.loadUiInfo()
+    },
+    setTopTextActiveInfo(val) {
+      this.loadUiInfo()
     }
 
   }
@@ -259,4 +300,11 @@ export default {
     vertical-align: text-bottom;
     margin-right: 10px;
   }
+
+  .de-top-menu {
+      >>>li.is-active {
+          // background-color: #0a7be0 !important;
+          background-color: var(--active-bg-color) !important;
+      }
+  }
 </style>

frontend/src/layout/components/index.js

 // export { default as Navbar } from './Navbar'
 export { default as Sidebar } from './Sidebar'
-export { default as Settings } from './Settings'
+// export { default as Settings } from './Settings'
 export { default as AppMain } from './AppMain'
 export { default as Topbar } from './Topbar'
 export { default as Licbar } from './Licbar'

frontend/src/main.js

@@ -77,6 +77,9 @@ Vue.component('DeComplexInput', DeComplexInput)
 Vue.component('DeComplexSelect', DeComplexSelect)
 Vue.config.productionTip = false
 
+import vueToPdf from 'vue-to-pdf'
+Vue.use(vueToPdf)
+
 Vue.prototype.hasDataPermission = function(pTarget, pSource) {
   if (this.$store.state.user.user.isAdmin) {
     return true

frontend/src/permission.js

@@ -7,6 +7,7 @@ import { getToken } from '@/utils/auth' // get token from cookie
 import getPageTitle from '@/utils/get-page-title'
 import { buildMenus } from '@/api/system/menu'
 import { filterAsyncRouter } from '@/store/modules/permission'
+// import bus from './utils/bus'
 
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
 
@@ -21,7 +22,7 @@ router.beforeEach(async(to, from, next) => {
 
   // determine whether the user has logged in
   const hasToken = getToken()
-
+  //   bus.$emit('set-theme-info', store.state.settings.theme)
   if (hasToken) {
     if (to.path === '/login') {
       // if is logged in, redirect to the home page
@@ -76,7 +77,6 @@ export const loadMenus = (next, to) => {
   buildMenus().then(res => {
     const filterDatas = filterRouter(res.data)
     const asyncRouter = filterAsyncRouter(filterDatas)
-    // addMsgMenu(asyncRouter)
     asyncRouter.push({ path: '*', redirect: '/404', hidden: true })
     store.dispatch('permission/GenerateRoutes', asyncRouter).then(() => { // 存储路由
       router.addRoutes(asyncRouter)
@@ -89,43 +89,6 @@ export const loadMenus = (next, to) => {
   })
 }
 
-export const addMsgMenu = asyncRouter => {
-  const menu = {
-    path: 'system-msg-web',
-    component: () => import('@/views/msg/index'),
-    name: 'sys-msg-web',
-    meta: { title: '站内消息', icon: 'all-msg' },
-    children: [
-      {
-        path: 'all',
-        component: () => import('@/views/msg/all'),
-        name: 'sys-msg-web-all',
-        meta: { title: '所有消息', icon: 'web-msg' }
-      },
-      {
-        path: 'unread',
-        component: () => import('@/views/msg/unread'),
-        name: 'sys-msg-web-unread',
-        meta: { title: '未读消息', icon: 'unread-msg' }
-
-      },
-      {
-        path: 'readed',
-        component: () => import('@/views/msg/readed'),
-        name: 'sys-msg-web-readed',
-        meta: { title: '已读消息', icon: 'readed-msg' }
-      }
-    ]
-  }
-  asyncRouter.forEach(element => {
-    if (element.name === 'system') {
-      if (element.children) {
-        element.children.splice(0, 0, menu)
-      }
-      // element.children.push(menu)
-    }
-  })
-}
 /**
  * 验证path是否有效
  * @param {*} path

frontend/src/styles/index.scss

@@ -277,6 +277,14 @@ div:focus {
   margin: 0 2px 1px 0;
 }
 
+.ds-icon-pdf {
+  width: 20px;
+  height: 20px;
+  margin-right: 5px;
+  color: #0a7be0;
+}
+
+
 .ds-icon-scene {
   width: 13px;
   height: 13px;

frontend/src/styles/sidebar.scss

@@ -15,9 +15,7 @@
 
   .sidebar-container {
     transition: width 0.28s;
-    // width: $sideBarWidth !important;
-    background-color: $menuBg;
-    // width: 260px;
+    background-color: $leftMenuBg;
     height: $contentHeight;
     position: fixed;
     font-size: 0px;
@@ -73,30 +71,30 @@
       height: 100%;
       width: 100% !important;
 
-      .is-active {
-        background-color: $menuHover;
-      }
+      /* .is-active {
+        background-color: $leftMenuActive;
+      } */
     }
 
     // menu hover
     .submenu-title-noDropdown,
     .el-submenu__title {
       &:hover {
-        background-color: $menuHover !important;
+        background-color: $leftMenuHovor !important;
       }
     }
 
-    .is-active > .el-submenu__title {
-      color: $menuActiveText !important;
-    }
+    /* .is-active > .el-submenu__title {
+      color: $leftMenuTextActive !important;
+    } */
 
     & .nest-menu .el-submenu > .el-submenu__title,
     & .el-submenu .el-menu-item {
       min-width: $sideBarWidth !important;
-      background-color: $subMenuBg !important;
+      background-color: $leftMenuBg !important;
 
       &:hover {
-        background-color: $menuHover !important;
+        background-color: $leftMenuHovor !important;
       }
     }
   }
@@ -198,8 +196,7 @@
   .nest-menu .el-submenu > .el-submenu__title,
   .el-menu-item {
     &:hover {
-      // you can use $subMenuHover
-      background-color: $menuHover !important;
+      background-color: $leftMenuHovor !important;
     }
   }
 

frontend/src/styles/topbar.scss

@@ -2,7 +2,7 @@
   // margin-left: $sideBarWidth;
   width: 100%;
   // background-color: #304156;
-  // background-color: $--color-primary;
+  background-color: $topBarBg;
   position: fixed;
   top: 0;
   left: 0;
@@ -17,7 +17,8 @@
     font-size: 24px;
     font-weight: bold;
     // color: rgb(191, 203, 217);
-    color: rgba(255, 255, 255, 0.87);
+    // color: rgba(255, 255, 255, 0.87);
+    // color: $topBarBg;
     float: left;
 
     img {
@@ -29,32 +30,27 @@
   .el-menu {
     float: left;
     border: none !important;
-    // background-color: #304156;
-    //   background-color: $--color-primary;
+    background-color: $topBarBg;
 
     .nav-item {
       display: inline-block;
 
       .el-menu-item:not(.is-active) {
-        // color: rgb(191, 203, 217);
-        color: $menuText;
+        color: $topBarMenuText;
 
         &:hover {
-          background-color: $menuHover !important;
-          // color: $subMenuActiveText !important;
+          background-color: $topBarMenuHovor !important;
         }
 
         &:focus {
-          background-color: $subMenuHover !important;
-          color: $subMenuActiveText !important;
+          background-color: $topBarMenuHovor !important;
         }
 
       }
 
-      .is-active {
-        background-color: $subMenuHover !important;
-        color: $subMenuActiveText !important;
-      }
+      /* .is-active {
+        background-color: $topBarMenuActive !important;
+      } */
     }
   }
 
@@ -76,7 +72,7 @@
       height: 100%;
       font-size: 18px;
       // color: #5a5e66;
-      color: #606266;
+      // color: #606266;
       vertical-align: text-bottom;
 
       &.hover-effect {

frontend/src/styles/variables.scss

@@ -3,7 +3,10 @@
 * So I modified the default color and you can modify it to your liking.
 **/
 
+
+
 /* theme color */
+
 $--color-primary: #0a7be0;
 $--color-success: #67C23A;
 $--color-warning: #E6A23C;
@@ -12,50 +15,49 @@ $--color-danger: #F56C6C;
 
 $--button-font-weight: 400;
 
-// $--color-text-regular: #1f2d3d;
-
 $--border-color-light: #dfe4ed;
 $--border-color-lighter: #e6ebf5;
 
 $--table-border: 1px solid #dfe6ec;
 
-/* icon font path, required */
 $--font-path: "~element-ui/lib/theme-chalk/fonts";
 
 @import "~element-ui/packages/theme-chalk/src/index";
 @import "~fit2cloud-ui/src/styles/common/variables";
-
+// topBar
+$topBarBg: #f1f3f8;
+$topBarMenuHovor: rgba(158,158,158,.2);
+$topBarMenuActive: $--color-primary;
+$topBarMenuText: #1e212a;
+$topBarMenuTextActive: #f4f4f5;
 // sidebar
-$menuText: #1e212a;
-$menuActiveText: #0a7be0;
-$topMenuActiveText: #f4f4f5;
-$subMenuActiveText: #f4f4f5; //https://github.com/ElemeFE/element/issues/12951
+$leftMenuBg: #ffffff;
+$leftMenuActive: #ebf4fd;
+$leftMenuHovor: rgba(158,158,158,.2);
+$leftMenuText: #1e212a;
+$leftMenuTextActive: $--color-primary;
 
-// $menuBg:#304156;
-$menuBg: #ffffff;
-// $menuHover:#263445;
-$menuHover: rgba(158, 158, 158, 0.2);
-
-$subMenuBg: #ffffff;
-// $subMenuHover:#001528;
-$subMenuHover: #0a7be0;
-$colorBg: rgba(10, 123, 224, .1);
 
+$colorBg: rgba(10, 123, 224, .1); 
 $sideBarWidth: 210px;
 $topBarHeight: 56px;
 $contentHeight: calc(100vh - 56px);
 
-// the :export directive is the magic sauce for webpack
-// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
+
 :export {
   theme: $--color-primary;
-  menuText: $menuText;
-  menuActiveText: $menuActiveText;
-  topMenuActiveText: $topMenuActiveText;
-  subMenuActiveText: $subMenuActiveText;
-  menuBg: $menuBg;
-  menuHover: $menuHover;
-  subMenuBg: $subMenuBg;
-  subMenuHover: $subMenuHover;
+
   sideBarWidth: $sideBarWidth;
+
+
+  topBarBg: $topBarBg;
+  topBarMenuHovor: $topBarMenuHovor;
+  topBarMenuActive: $topBarMenuActive;
+  topBarMenuText: $topBarMenuText;
+  topBarMenuTextActive: $topBarMenuTextActive;
+  leftMenuBg: $leftMenuBg;
+  leftMenuActive: $leftMenuActive;
+  leftMenuHovor: $leftMenuHovor;
+  leftMenuText: $leftMenuText;
+  leftMenuTextActive: $leftMenuTextActive;
 }

frontend/src/utils/StringUtils.js

+// 替换所有 标准模板格式 为 $panelName$
+export function pdfTemplateReplaceAll(content, source, target) {
+  const pattern = '\\$' + source + '\\$'
+  content = content.replace(new RegExp(pattern, 'gm'), target)
+  return content
+}
+

frontend/src/utils/style.js

+export function getThemeCluster(theme) {
+  const tintColor = (color, tint) => {
+    let red = parseInt(color.slice(0, 2), 16)
+    let green = parseInt(color.slice(2, 4), 16)
+    let blue = parseInt(color.slice(4, 6), 16)
+
+    if (tint === 0) { // when primary color is in its rgb space
+      return [red, green, blue].join(',')
+    } else {
+      red += Math.round(tint * (255 - red))
+      green += Math.round(tint * (255 - green))
+      blue += Math.round(tint * (255 - blue))
+
+      red = red.toString(16)
+      green = green.toString(16)
+      blue = blue.toString(16)
+
+      return `#${red}${green}${blue}`
+    }
+  }
+
+  const shadeColor = (color, shade) => {
+    let red = parseInt(color.slice(0, 2), 16)
+    let green = parseInt(color.slice(2, 4), 16)
+    let blue = parseInt(color.slice(4, 6), 16)
+
+    red = Math.round((1 - shade) * red)
+    green = Math.round((1 - shade) * green)
+    blue = Math.round((1 - shade) * blue)
+
+    red = red.toString(16)
+    green = green.toString(16)
+    blue = blue.toString(16)
+
+    return `#${red}${green}${blue}`
+  }
+
+  const clusters = [theme]
+  for (let i = 0; i <= 9; i++) {
+    clusters.push(tintColor(theme, Number((i / 10).toFixed(2))))
+  }
+  clusters.push(shadeColor(theme, 0.1))
+  return clusters
+}

frontend/src/views/chart/chart/chart.js

@@ -107,6 +107,12 @@ export const DEFAULT_XAXIS_STYLE = {
       width: 1,
       style: 'solid'
     }
+  },
+  axisValue: {
+    auto: true,
+    min: null,
+    max: null,
+    split: null
   }
 }
 export const DEFAULT_YAXIS_STYLE = {
@@ -131,6 +137,12 @@ export const DEFAULT_YAXIS_STYLE = {
       width: 1,
       style: 'solid'
     }
+  },
+  axisValue: {
+    auto: true,
+    min: null,
+    max: null,
+    split: null
   }
 }
 export const DEFAULT_BACKGROUND_COLOR = {

frontend/src/views/chart/chart/common/common.js

@@ -65,6 +65,18 @@ export function componentStyle(chart_option, chart) {
       if (!customStyle.xAxis.show) {
         chart_option.xAxis.axisLabel.show = false
       }
+
+      // 轴值设置
+      delete chart_option.xAxis.min
+      delete chart_option.xAxis.max
+      delete chart_option.xAxis.split
+      if (chart.type.includes('horizontal')) {
+        if (customStyle.xAxis.axisValue && !customStyle.xAxis.axisValue.auto) {
+          customStyle.xAxis.axisValue.min && (chart_option.xAxis.min = parseFloat(customStyle.xAxis.axisValue.min))
+          customStyle.xAxis.axisValue.max && (chart_option.xAxis.max = parseFloat(customStyle.xAxis.axisValue.max))
+          customStyle.xAxis.axisValue.split && (chart_option.xAxis.interval = parseFloat(customStyle.xAxis.axisValue.split))
+        }
+      }
     }
     if (customStyle.yAxis && (chart.type.includes('bar') || chart.type.includes('line') || chart.type.includes('scatter') || chart.type === 'chart-mix')) {
       chart_option.yAxis.show = customStyle.yAxis.show
@@ -80,6 +92,18 @@ export function componentStyle(chart_option, chart) {
       if (!customStyle.yAxis.show) {
         chart_option.yAxis.axisLabel.show = false
       }
+
+      // 轴值设置
+      delete chart_option.yAxis.min
+      delete chart_option.yAxis.max
+      delete chart_option.yAxis.split
+      if (!chart.type.includes('horizontal')) {
+        if (customStyle.yAxis.axisValue && !customStyle.yAxis.axisValue.auto) {
+          customStyle.yAxis.axisValue.min && (chart_option.yAxis.min = parseFloat(customStyle.yAxis.axisValue.min))
+          customStyle.yAxis.axisValue.max && (chart_option.yAxis.max = parseFloat(customStyle.yAxis.axisValue.max))
+          customStyle.yAxis.axisValue.split && (chart_option.yAxis.interval = parseFloat(customStyle.yAxis.axisValue.split))
+        }
+      }
     }
     if (customStyle.split && chart.type.includes('radar')) {
       chart_option.radar.name = customStyle.split.name

frontend/src/views/chart/components/ChartComponent.vue

@@ -155,7 +155,7 @@ export default {
       } else if (chart.type === 'chart-mix') {
         chart_option = baseMixOption(JSON.parse(JSON.stringify(BASE_MIX)), chart)
       }
-      console.log(JSON.stringify(chart_option))
+      // console.log(JSON.stringify(chart_option))
 
       if (chart.type === 'map') {
         const customAttr = JSON.parse(chart.customAttr)

frontend/src/views/chart/components/component-style/XAxisSelector.vue

@@ -23,6 +23,36 @@
               <el-option v-for="option in fontSize" :key="option.value" :label="option.name" :value="option.value" />
             </el-select>
           </el-form-item>
+          <span v-show="chart.type && chart.type.includes('horizontal')">
+            <el-divider />
+            <el-form-item class="form-item">
+              <span slot="label">
+                <span class="span-box">
+                  <span>{{ $t('chart.axis_value') }}</span>
+                  <el-tooltip class="item" effect="dark" placement="bottom">
+                    <div slot="content">
+                      最小值、最大值、间隔均为数值类型；若不填，则该项视为自动。
+                      <br>
+                      请确保填写数值能正确计算，否则将无法正常显示轴值。
+                    </div>
+                    <i class="el-icon-info" style="cursor: pointer;" />
+                  </el-tooltip>
+                </span>
+              </span>
+              <el-checkbox v-model="axisForm.axisValue.auto" @change="changeXAxisStyle">{{ $t('chart.axis_auto') }}</el-checkbox>
+            </el-form-item>
+            <span v-show="!axisForm.axisValue.auto">
+              <el-form-item :label="$t('chart.axis_value_min')" class="form-item">
+                <el-input v-model="axisForm.axisValue.min" @blur="changeXAxisStyle" />
+              </el-form-item>
+              <el-form-item :label="$t('chart.axis_value_max')" class="form-item">
+                <el-input v-model="axisForm.axisValue.max" @blur="changeXAxisStyle" />
+              </el-form-item>
+              <el-form-item :label="$t('chart.axis_value_split')" class="form-item">
+                <el-input v-model="axisForm.axisValue.split" @blur="changeXAxisStyle" />
+              </el-form-item>
+            </span>
+          </span>
           <el-divider />
           <el-form-item :label="$t('chart.axis_show')" class="form-item">
             <el-checkbox v-model="axisForm.splitLine.show" @change="changeXAxisStyle">{{ $t('chart.axis_show') }}</el-checkbox>
@@ -120,6 +150,9 @@ export default {
           if (!this.axisForm.nameTextStyle) {
             this.axisForm.nameTextStyle = JSON.parse(JSON.stringify(DEFAULT_XAXIS_STYLE.nameTextStyle))
           }
+          if (!this.axisForm.axisValue) {
+            this.axisForm.axisValue = JSON.parse(JSON.stringify(DEFAULT_XAXIS_STYLE.axisValue))
+          }
         }
       }
     },

frontend/src/views/chart/components/component-style/YAxisSelector.vue

@@ -23,6 +23,36 @@
               <el-option v-for="option in fontSize" :key="option.value" :label="option.name" :value="option.value" />
             </el-select>
           </el-form-item>
+          <span v-show="chart.type && !chart.type.includes('horizontal')">
+            <el-divider />
+            <el-form-item class="form-item">
+              <span slot="label">
+                <span class="span-box">
+                  <span>{{ $t('chart.axis_value') }}</span>
+                  <el-tooltip class="item" effect="dark" placement="bottom">
+                    <div slot="content">
+                      最小值、最大值、间隔均为数值类型；若不填，则该项视为自动。
+                      <br>
+                      请确保填写数值能正确计算，否则将无法正常显示轴值。
+                    </div>
+                    <i class="el-icon-info" style="cursor: pointer;" />
+                  </el-tooltip>
+                </span>
+              </span>
+              <el-checkbox v-model="axisForm.axisValue.auto" @change="changeYAxisStyle">{{ $t('chart.axis_auto') }}</el-checkbox>
+            </el-form-item>
+            <span v-show="!axisForm.axisValue.auto">
+              <el-form-item :label="$t('chart.axis_value_min')" class="form-item">
+                <el-input v-model="axisForm.axisValue.min" @blur="changeYAxisStyle" />
+              </el-form-item>
+              <el-form-item :label="$t('chart.axis_value_max')" class="form-item">
+                <el-input v-model="axisForm.axisValue.max" @blur="changeYAxisStyle" />
+              </el-form-item>
+              <el-form-item :label="$t('chart.axis_value_split')" class="form-item">
+                <el-input v-model="axisForm.axisValue.split" @blur="changeYAxisStyle" />
+              </el-form-item>
+            </span>
+          </span>
           <el-divider />
           <el-form-item :label="$t('chart.axis_show')" class="form-item">
             <el-checkbox v-model="axisForm.splitLine.show" @change="changeYAxisStyle">{{ $t('chart.axis_show') }}</el-checkbox>
@@ -120,6 +150,9 @@ export default {
           if (!this.axisForm.nameTextStyle) {
             this.axisForm.nameTextStyle = JSON.parse(JSON.stringify(DEFAULT_YAXIS_STYLE.nameTextStyle))
           }
+          if (!this.axisForm.axisValue) {
+            this.axisForm.axisValue = JSON.parse(JSON.stringify(DEFAULT_YAXIS_STYLE.axisValue))
+          }
         }
       }
     },

frontend/src/views/msg/all.vue

@@ -180,8 +180,8 @@ export default {
 
   >>>.el-radio-button__orig-radio:checked+.el-radio-button__inner {
     color: #fff;
-    background-color: #0a7be0;
-    border-color: #0a7be0;
+    // background-color: #0a7be0;
+    // border-color: #0a7be0;
     -webkit-box-shadow: 0px 0 0 0 #0a7be0;
     box-shadow: 0px 0 0 0 #0a7be0;
   }

frontend/src/views/msg/readed.vue

@@ -210,8 +210,8 @@ export default {
 
   >>>.el-radio-button__orig-radio:checked+.el-radio-button__inner {
     color: #fff;
-    background-color: #0a7be0;
-    border-color: #0a7be0;
+    /* background-color: #0a7be0;
+    border-color: #0a7be0; */
     -webkit-box-shadow: 0px 0 0 0 #0a7be0;
     box-shadow: 0px 0 0 0 #0a7be0;
   }

frontend/src/views/msg/unread.vue

@@ -218,8 +218,8 @@ export default {
 
   >>>.el-radio-button__orig-radio:checked+.el-radio-button__inner {
     color: #fff;
-    background-color: #0a7be0;
-    border-color: #0a7be0;
+    /* background-color: #0a7be0;
+    border-color: #0a7be0; */
     -webkit-box-shadow: 0px 0 0 0 #0a7be0;
     box-shadow: 0px 0 0 0 #0a7be0;
   }

frontend/src/views/panel/export/PDFExportTemplate.vue

+<template>
+  <div style="margin-top: 5px">
+    <div> 导出时间：$TIME$</div>
+    <div contenteditable="true"> 可以输入内容</div>
+    <div>
+      <img width="100%" src="$snapshot$">
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+    }
+  },
+  computed: {
+  },
+  watch: {
+
+  },
+  mounted() {
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

frontend/src/views/panel/export/PDFPreExport.vue

+<template>
+  <el-row>
+    <el-row class="export_body_class">
+      <div id="exportPdf" ref="exportPdf">
+        <div class="export_body_inner_class" v-html="templateContentChange" />
+      </div>
+    </el-row>
+    <el-row class="root_class">
+      <el-button size="mini" @click="cancel()">{{ $t('commons.cancel') }}</el-button>
+      <el-button type="primary" size="mini" @click="save()">导出PDF</el-button>
+    </el-row>
+  </el-row>
+</template>
+
+<script>
+import JsPDF from 'jspdf'
+import html2canvas from 'html2canvasde'
+import { formatTimeToStr } from './date.js'
+import { pdfTemplateReplaceAll } from '@/utils/StringUtils.js'
+
+export default {
+  name: 'PDFPreExport',
+  props: {
+    panelName: {
+      type: String,
+      required: false
+    },
+    snapshot: {
+      type: String,
+      required: true
+    },
+    templateContent: {
+      type: String,
+      required: true
+    }
+  },
+  data() {
+    return {
+      activeName: '',
+      templateContentChange: '',
+      time: '',
+      varsInfo: {
+        panelName: this.panelName,
+        snapshot: this.snapshot,
+        userName: this.$store.state.user.user.name
+      },
+      timeInfo: [
+        'yyyy-MM-dd',
+        'yyyy-MM-dd hh:mm:ss'
+      ]
+    }
+  },
+  computed: {
+
+  },
+  watch: {
+    templateContent(newVal, oldVla) {
+      this.initContent()
+    }
+
+  },
+  mounted() {
+    var date = new Date()
+    var _this = this
+    _this.timeInfo.forEach(timeFormat => {
+      _this.varsInfo[timeFormat] = formatTimeToStr(date, timeFormat)
+    })
+
+    this.initContent()
+  },
+  methods: {
+    initContent() {
+      this.templateContentChange = this.templateContent
+      for (const [key, value] of Object.entries(this.varsInfo)) {
+        this.templateContentChange = pdfTemplateReplaceAll(this.templateContentChange, key, value)
+      }
+    },
+
+    cancel() {
+      this.$emit('closePreExport')
+    },
+    save() {
+      const _this = this
+      html2canvas(document.getElementById('exportPdf')).then(function(canvas) {
+        const contentWidth = canvas.width
+        const contentHeight = canvas.height
+        const pageData = canvas.toDataURL('image/jpeg', 1.0)
+        const PDF = new JsPDF('p', 'pt', [contentWidth, contentHeight])
+        PDF.addImage(pageData, 'JPEG', 0, 0, contentWidth, contentHeight)
+        PDF.save(_this.panelName + '.pdf')
+      }
+      )
+    }
+
+  }
+}
+</script>
+
+<style scoped>
+  .root_class {
+    margin: 15px 0px 5px;
+    text-align: center;
+  }
+  .export_body_class{
+    border: 1px solid #dcdfe6 ;
+    height: 500px;
+    overflow-y: auto;
+  }
+
+  .export_body_inner_class{
+    margin: 10px;
+  }
+</style>

frontend/src/views/panel/export/date.js

+// 对Date的扩展，将 Date 转化为指定格式的String
+// 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符，
+// 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字)
+// (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423
+// (new Date()).Format("yyyy-M-d h:m:s.S")      ==> 2006-7-2 8:9:4.18
+Date.prototype.Format = function(fmt) {
+  var o = {
+    'M+': this.getMonth() + 1, // 月份
+    'd+': this.getDate(), // 日
+    'h+': this.getHours(), // 小时
+    'm+': this.getMinutes(), // 分
+    's+': this.getSeconds(), // 秒
+    'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
+    'S': this.getMilliseconds() // 毫秒
+  }
+  if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length)) }
+  for (var k in o) {
+    if (new RegExp('(' + k + ')').test(fmt)) { fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length))) }
+  }
+  return fmt
+}
+
+export function formatTimeToStr(times, pattern) {
+  var d = new Date(times).Format('yyyy-MM-dd hh:mm:ss')
+  if (pattern) {
+    d = new Date(times).Format(pattern)
+  }
+  return d.toLocaleString()
+}
+

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

@@ -109,6 +109,9 @@
                       <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-share" :command="beforeClickMore('share',data,node)">
                         {{ $t('panel.share') }}
                       </el-dropdown-item>
+                      <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-document-copy" :command="beforeClickMore('copy',data,node)">
+                        {{ $t('panel.copy') }}
+                      </el-dropdown-item>
                       <el-dropdown-item v-if="data.nodeType==='panel'" icon="el-icon-paperclip" :command="beforeClickMore('link',data,node)">
                         {{ $t('panel.create_public_links') }}
                       </el-dropdown-item>
@@ -306,11 +309,16 @@ export default {
             this.lastActiveNodeData.name = panelInfo.name
             return
           }
-          if (!this.lastActiveNodeData.children) {
-            this.$set(this.lastActiveNodeData, 'children', [])
+          // 复制后的仪表板 放在父节点下面
+          if (this.editPanel.optType === 'copy') {
+            this.lastActiveNode.parent.data.children.push(panelInfo)
+          } else {
+            if (!this.lastActiveNodeData.children) {
+              this.$set(this.lastActiveNodeData, 'children', [])
+            }
+            this.lastActiveNodeData.children.push(panelInfo)
+            this.lastActiveNode.expanded = true
           }
-          this.lastActiveNodeData.children.push(panelInfo)
-          this.lastActiveNode.expanded = true
           this.activeNodeAndClick(panelInfo)
         } else {
           this.tree(this.groupForm)
@@ -367,6 +375,18 @@ export default {
             }
           }
           break
+        case 'copy':
+          this.editPanel = {
+            visible: true,
+            titlePre: this.$t('panel.copy'),
+            optType: 'copy',
+            panelInfo: {
+              id: param.data.id,
+              name: param.data.name,
+              optType: 'copy'
+            }
+          }
+          break
       }
       switch (param.type) {
         case 'folder':
@@ -388,6 +408,7 @@ export default {
 
     clickMore(param) {
       switch (param.optType) {
+        case 'copy':
         case 'toDefaultPanel':
         case 'rename':
           this.showEditPanel(param)

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

@@ -54,7 +54,7 @@
       </el-row>
       <!-- 仪表板预览区域-->
       <el-row class="panel-design-preview">
-        <div ref="imageWrapper" style="width: 100%;height: 100%">
+        <div id="imageWrapper" ref="imageWrapper" style="width: 100%;height: 100%">
           <fullscreen style="height: 100%;background: #f7f8fa;overflow-y: auto" :fullscreen.sync="fullscreen">
             <Preview v-if="showMain" :in-screen="!fullscreen" :show-type="canvasStyleData.selfAdaption?'full':'width'" />
           </fullscreen>
@@ -75,9 +75,31 @@
     >
       <save-to-template :template-info="templateInfo" @closeSaveDialog="closeSaveDialog" />
     </el-dialog>
+    <el-dialog
+      v-if="pdfExportShow"
+      :title="'['+panelInfo.name+']'+'PDF导出'"
+      :visible.sync="pdfExportShow"
+      width="70%"
+      :destroy-on-close="true"
+      class="dialog-css2"
+    >
+      <span style="position: absolute;right: 70px;top:15px">
+        <svg-icon icon-class="PDF" class="ds-icon-pdf" />
+        <el-select v-model="pdfTemplateSelectedIndex" :placeholder="'切换PDF模板'" @change="changePdfTemplate()">
+          <el-option
+            v-for="(item, index) in pdfTemplateAll"
+            :key="index"
+            :label="item.name"
+            :value="index"
+          />
+        </el-select>
+      </span>
+      <PDFPreExport :snapshot="snapshotInfo" :panel-name="panelInfo.name" :template-content="pdfTemplateContent" @closePreExport="closePreExport" />
+    </el-dialog>
   </el-row>
 </template>
 <script>
+import PDFPreExport from '@/views/panel/export/PDFPreExport'
 import Preview from '@/components/canvas/components/Editor/Preview'
 import SaveToTemplate from '@/views/panel/list/SaveToTemplate'
 import { mapState } from 'vuex'
@@ -85,10 +107,11 @@ import html2canvas from 'html2canvasde'
 import FileSaver from 'file-saver'
 import { enshrineList, saveEnshrine, deleteEnshrine } from '@/api/panel/enshrine'
 import bus from '@/utils/bus'
-import JsPDF from 'jspdf'
+import { queryAll } from '@/api/panel/pdfTemplate'
+
 export default {
   name: 'PanelViewShow',
-  components: { Preview, SaveToTemplate },
+  components: { Preview, SaveToTemplate, PDFPreExport },
   props: {
     activeTab: {
       type: String,
@@ -98,11 +121,16 @@ export default {
   data() {
     return {
       showMain: true,
+      pdfTemplateSelectedIndex: 0,
+      pdfTemplateContent: '',
       templateInfo: {},
+      pdfTemplateAll: [],
       templateSaveTitle: '保存为模板',
       templateSaveShow: false,
       hasStar: false,
-      fullscreen: false
+      fullscreen: false,
+      pdfExportShow: false,
+      snapshotInfo: ''
     }
   },
   computed: {
@@ -133,8 +161,15 @@ export default {
     }
   },
   mounted() {
+    this.initPdfTemplate()
   },
   methods: {
+    initPdfTemplate() {
+      queryAll().then(res => {
+        this.pdfTemplateAll = res.data
+        this.changePdfTemplate()
+      })
+    },
     clickFullscreen() {
       this.fullscreen = true
     },
@@ -144,7 +179,7 @@ export default {
     },
     saveToTemplate() {
       this.templateSaveShow = true
-      html2canvas(this.$refs.imageWrapper).then(canvas => {
+      html2canvas(document.getElementById('canvasInfoTemp')).then(canvas => {
         const snapshot = canvas.toDataURL('image/jpeg', 0.1) // 0.2是图片质量
         if (snapshot !== '') {
           this.templateInfo = {
@@ -162,7 +197,7 @@ export default {
       })
     },
     downloadToTemplate() {
-      html2canvas(this.$refs.imageWrapper).then(canvas => {
+      html2canvas(document.getElementById('canvasInfoTemp')).then(canvas => {
         const snapshot = canvas.toDataURL('image/jpeg', 0.1) // 0.2是图片质量
         if (snapshot !== '') {
           this.templateInfo = {
@@ -180,34 +215,17 @@ export default {
     },
 
     downloadAsPDF() {
-      html2canvas(this.$refs.imageWrapper).then(canvas => {
-        const contentWidth = canvas.width
-        const contentHeight = canvas.height
-        const pageHeight = contentWidth / 592.28 * 841.89
-        let leftHeight = contentHeight
-        let position = 0
-        const imgWidth = 595.28
-        const imgHeight = 592.28 / contentWidth * contentHeight
-        const pageData = canvas.toDataURL('image/jpeg', 1.0)
-        const PDF = new JsPDF('', 'pt', 'a4')
-        if (leftHeight < pageHeight) {
-          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
-        } else {
-          while (leftHeight > 0) {
-            PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
-            leftHeight -= pageHeight
-            position -= 841.89
-            if (leftHeight > 0) {
-              PDF.addPage()
-            }
-          }
+      html2canvas(document.getElementById('canvasInfoTemp')).then(canvas => {
+        const snapshot = canvas.toDataURL('image/jpeg', 1) // 0.2是图片质量
+        if (snapshot !== '') {
+          this.snapshotInfo = snapshot
+          this.pdfExportShow = true
         }
-        PDF.save('PDF-test' + '.pdf')
       })
     },
     refreshTemplateInfo() {
       this.templateInfo = {}
-      html2canvas(this.$refs.imageWrapper).then(canvas => {
+      html2canvas(document.getElementById('canvasInfoTemp')).then(canvas => {
         const snapshot = canvas.toDataURL('image/jpeg', 0.1) // 0.2是图片质量
         if (snapshot !== '') {
           this.templateInfo = {
@@ -244,6 +262,12 @@ export default {
       if (this.activeTab !== 'PanelList') {
         bus.$emit('panle_start_list_refresh', isStar)
       }
+    },
+    changePdfTemplate() {
+      this.pdfTemplateContent = this.pdfTemplateAll[this.pdfTemplateSelectedIndex].templateContent
+    },
+    closePreExport() {
+      this.pdfExportShow = false
     }
 
   }
@@ -303,4 +327,14 @@ export default {
     flex-flow: row nowrap;
     color: #9ea6b2;
   }
+
+  .dialog-css2 ::v-deep .el-dialog__title {
+    font-size: 14px!important;
+  }
+  .dialog-css2 ::v-deep .el-dialog__header {
+    padding: 20px 20px 0!important;
+  }
+  .dialog-css2 ::v-deep .el-dialog__body {
+    padding: 0px 20px!important;
+  }
 </style>

frontend/src/views/system/datasource/form.vue

@@ -25,10 +25,10 @@
         </el-form-item>
 
         <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.host')" prop="configuration.host">
-          <el-input v-model="form.configuration.host" autocomplete="off"  />
+          <el-input v-model="form.configuration.host" autocomplete="off" />
         </el-form-item>
         <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.data_base')" prop="configuration.dataBase">
-          <el-input v-model="form.configuration.dataBase" autocomplete="off"  />
+          <el-input v-model="form.configuration.dataBase" autocomplete="off" />
         </el-form-item>
 
         <el-form-item v-if="form.type=='oracle'" :label="$t('datasource.oracle_connection_type')" prop="configuration.connectionType">
@@ -37,7 +37,7 @@
         </el-form-item>
 
         <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.user_name')" prop="configuration.username">
-          <el-input v-model="form.configuration.username" autocomplete="off"  />
+          <el-input v-model="form.configuration.username" autocomplete="off" />
         </el-form-item>
         <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.password')" prop="configuration.password">
           <el-input v-model="form.configuration.password" autocomplete="off" show-password />
@@ -52,7 +52,7 @@
         </el-form-item>
 
         <el-form-item v-if="form.type=='oracle' || form.type=='sqlServer' || form.type=='pg'" :label="$t('datasource.schema')">
-          <el-select filterable v-model="form.configuration.schema" :placeholder="$t('datasource.please_choose_schema')" class="select-width">
+          <el-select v-model="form.configuration.schema" filterable :placeholder="$t('datasource.please_choose_schema')" class="select-width">
             <el-option
               v-for="item in schemas"
               :key="item"
@@ -68,19 +68,19 @@
               <el-input v-model="form.configuration.initialPoolSize" autocomplete="off" type="number" min="0" size="small" />
             </el-form-item>
             <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.min_pool_size')" prop="configuration.minPoolSize">
-              <el-input v-model="form.configuration.minPoolSize" autocomplete="off" type="number" min="0"/>
+              <el-input v-model="form.configuration.minPoolSize" autocomplete="off" type="number" min="0" />
             </el-form-item>
             <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.max_pool_size')" prop="configuration.maxPoolSize">
-              <el-input v-model="form.configuration.maxPoolSize" autocomplete="off" type="number" min="0"/>
+              <el-input v-model="form.configuration.maxPoolSize" autocomplete="off" type="number" min="0" />
             </el-form-item>
             <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.max_idle_time')" prop="configuration.maxIdleTime">
-              <el-input v-model="form.configuration.maxIdleTime" autocomplete="off" type="number" min="0"/>
+              <el-input v-model="form.configuration.maxIdleTime" autocomplete="off" type="number" min="0" />
             </el-form-item>
             <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.acquire_increment')" prop="configuration.acquireIncrement">
-              <el-input v-model="form.configuration.acquireIncrement" autocomplete="off" type="number" min="0"/>
+              <el-input v-model="form.configuration.acquireIncrement" autocomplete="off" type="number" min="0" />
             </el-form-item>
             <el-form-item v-if="form.configuration.dataSourceType=='jdbc'" :label="$t('datasource.connect_timeout')" prop="configuration.connectTimeout">
-              <el-input v-model="form.configuration.connectTimeout" autocomplete="off" type="number" min="0"/>
+              <el-input v-model="form.configuration.connectTimeout" autocomplete="off" type="number" min="0" />
             </el-form-item>
 
           </el-collapse-item>
@@ -144,9 +144,9 @@ export default {
         'configuration.connectTimeout': [{ required: true, message: this.$t('datasource.please_input_connect_timeout'), trigger: 'change' }]
       },
       allTypes: [{ name: 'mysql', label: 'MySQL', type: 'jdbc' },
-                { name: 'oracle', label: 'Oracle', type: 'jdbc' },
-                { name: 'sqlServer', label: 'SQL Server', type: 'jdbc' },
-                { name: 'pg', label: 'PostgreSQL', type: 'jdbc' }],
+        { name: 'oracle', label: 'Oracle', type: 'jdbc' },
+        { name: 'sqlServer', label: 'SQL Server', type: 'jdbc' },
+        { name: 'pg', label: 'PostgreSQL', type: 'jdbc' }],
       schemas: [],
       canEdit: false,
       originConfiguration: {}
@@ -202,8 +202,8 @@ export default {
         this.$message.error(this.$t('datasource.please_choose_schema'))
         return
       }
-      if (this.form.configuration.initialPoolSize < 0 || this.form.configuration.minPoolSize < 0 || this.form.configuration.maxPoolSize < 0 || this.form.configuration.maxIdleTime < 0
-        || this.form.configuration.acquireIncrement < 0 || this.form.configuration.idleConnectionTestPeriod < 0 || this.form.configuration.connectTimeout < 0) {
+      if (this.form.configuration.initialPoolSize < 0 || this.form.configuration.minPoolSize < 0 || this.form.configuration.maxPoolSize < 0 || this.form.configuration.maxIdleTime < 0 ||
+        this.form.configuration.acquireIncrement < 0 || this.form.configuration.idleConnectionTestPeriod < 0 || this.form.configuration.connectTimeout < 0) {
         this.$message.error(this.$t('datasource.no_less_then_0'))
         return
       }
@@ -212,7 +212,7 @@ export default {
           const method = this.formType === 'add' ? addDs : editDs
           const form = JSON.parse(JSON.stringify(this.form))
           form.configuration = JSON.stringify(form.configuration)
-          if(this.formType !== 'add' && this.originConfiguration !== form.configuration) {
+          if (this.formType !== 'add' && this.originConfiguration !== form.configuration) {
             $confirm(this.$t('datasource.edit_datasource_msg'), () => {
               method(form).then(res => {
                 this.$success(this.$t('commons.save_success'))
@@ -220,7 +220,7 @@ export default {
                 this.backToList()
               })
             })
-          }else {
+          } else {
             method(form).then(res => {
               this.$success(this.$t('commons.save_success'))
               this.refreshTree()
@@ -255,23 +255,22 @@ export default {
         if (valid) {
           const data = JSON.parse(JSON.stringify(this.form))
           data.configuration = JSON.stringify(data.configuration)
-          if(data.showModel === 'show' && !this.canEdit){
+          if (data.showModel === 'show' && !this.canEdit) {
             validateDsById(data.id).then(res => {
-              if(res.success){
+              if (res.success) {
                 this.$success(this.$t('datasource.validate_success'))
-              }else {
+              } else {
                 this.$error(this.$t(res.message))
               }
               this.refreshTree()
             }).catch(res => {
               this.$error(res.message)
             })
-
-          }else {
+          } else {
             validateDs(data).then(res => {
-              if(res.success){
+              if (res.success) {
                 this.$success(this.$t('datasource.validate_success'))
-              }else {
+              } else {
                 this.$error(this.$t(res.message))
               }
             }).catch(res => {
@@ -301,8 +300,6 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-@import "~@/styles/mixin.scss";
-@import "~@/styles/variables.scss";
 
 .back-button {
   cursor: pointer;

frontend/src/views/system/plugin/dynamic.vue

 <template>
   <layout-content v-if="!noLayout" v-loading="$store.getters.loadingMap[$store.getters.currentPath]" :header="header" :back-name="backName">
-    <async-component v-if="showAsync" :url="url" @execute-axios="executeAxios" @on-add-languanges="addLanguages" @on-plugin-layout="setLayoutInfo" />
+    <async-component v-if="showAsync" :url="url" @execute-axios="executeAxios" @on-add-languanges="addLanguages" @on-plugin-layout="setLayoutInfo" @plugin-call-back="pluginCallBack" />
     <div v-else>
       <h1>未知组件无法展示</h1>
     </div>
   </layout-content>
   <div v-else>
-    <async-component v-if="showAsync" :url="url" @execute-axios="executeAxios" @on-add-languanges="addLanguages" @on-plugin-layout="setLayoutInfo" />
+    <async-component v-if="showAsync" :url="url" @execute-axios="executeAxios" @on-add-languanges="addLanguages" @on-plugin-layout="setLayoutInfo" @plugin-call-back="pluginCallBack" />
     <div v-else>
       <h1>未知组件无法展示</h1>
     </div>
@@ -18,6 +18,7 @@
 import LayoutContent from '@/components/business/LayoutContent'
 import AsyncComponent from '@/components/AsyncComponent'
 import i18n from '@/lang'
+import bus from '@/utils/bus'
 import { execute } from '@/api/system/dynamic'
 export default {
   name: 'Dynamic',
@@ -85,6 +86,12 @@ export default {
       const { header, backName } = param
       this.header = header
       this.backName = backName
+    },
+    pluginCallBack(param) {
+      // console.log(param)
+
+      const { eventName, eventParam } = param
+      bus.$emit(eventName, eventParam)
     }
   }
 }

frontend/src/views/system/user/index.vue

@@ -18,7 +18,6 @@
       <el-table-column :show-overflow-tooltip="true" prop="nickName" sortable="custom" :label="$t('commons.nick_name')" />
       <el-table-column prop="gender" :label="$t('commons.gender')" width="60" />
 
-      <!-- <el-table-column :show-overflow-tooltip="true" prop="phone" :label="$t('commons.phone')" /> -->
       <el-table-column :show-overflow-tooltip="true" prop="email" :label="$t('commons.email')" />
       <el-table-column :show-overflow-tooltip="true" prop="dept" sortable="custom" :label="$t('commons.organization')">
         <template slot-scope="scope">
@@ -162,7 +161,6 @@
 <script>
 import LayoutContent from '@/components/business/LayoutContent'
 import ComplexTable from '@/components/business/complex-table'
-// import { checkPermission } from '@/utils/permission'
 import { formatCondition, formatQuickCondition, addOrder, formatOrders } from '@/utils/index'
 import { PHONE_REGEX } from '@/utils/validate'
 import { LOAD_CHILDREN_OPTIONS, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect'
@@ -170,7 +168,6 @@ import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 
 import { userLists, addUser, editUser, delUser, editPassword, editStatus, allRoles } from '@/api/system/user'
-// import { allRoles } from '@/api/system/role'
 import { getDeptTree, treeByDeptId } from '@/api/system/dept'
 
 export default {
@@ -192,10 +189,7 @@ export default {
           label: this.$t('member.edit_password'), icon: 'el-icon-s-tools', type: 'success', click: this.editPassword,
           show: this.checkPermission(['user:editPwd'])
         }
-        // , {
-        //   label: '权限查看', icon: 'el-icon-lock', type: 'warning', click: this.showAuth,
-        //   show: this.checkPermission(['user:editPwd'])
-        // }
+
       ],
       searchConfig: {
         useQuickSearch: true,
@@ -307,7 +301,6 @@ export default {
     }
   },
   mounted() {
-    // this.form = Object.assign({}, this.defaultForm);
     this.allRoles()
     this.search()
   },
@@ -347,28 +340,14 @@ export default {
     create() {
       this.$router.push({ name: 'system-user-form' })
     },
-    // create() {
-    //   this.depts = null
-    //   this.formType = 'add'
-    //   this.form = Object.assign({}, this.defaultForm)
-    //   this.dialogVisible = true
-    // },
+
     edit(row) {
       this.$router.push({ name: 'system-user-form', params: row })
     },
     showAuth(row) {
       this.$router.push({ name: 'system-user-form', params: row })
     },
-    // edit(row) {
-    //   this.depts = null
-    //   this.formType = 'modify'
-    //   this.dialogVisible = true
-    //   this.form = Object.assign({}, row)
-    //   if (this.form.deptId === 0) {
-    //     this.form.deptId = null
-    //   }
-    //   this.initDeptTree()
-    // },
+
     editPassword(row) {
       this.editPasswordVisible = true
       const tempForm = Object.assign({}, row)