diff --git a/backend/src/main/java/io/dataease/job/sechedule/strategy/impl/EmailTaskHandler.java b/backend/src/main/java/io/dataease/job/sechedule/strategy/impl/EmailTaskHandler.java
index 4f9d1bced1..d293f49dca 100644
--- a/backend/src/main/java/io/dataease/job/sechedule/strategy/impl/EmailTaskHandler.java
+++ b/backend/src/main/java/io/dataease/job/sechedule/strategy/impl/EmailTaskHandler.java
@@ -25,6 +25,8 @@ import io.dataease.plugins.xpack.email.dto.response.XpackEmailTemplateDTO;
 import io.dataease.plugins.xpack.email.service.EmailXpackService;
 import io.dataease.plugins.xpack.lark.dto.entity.LarkMsgResult;
 import io.dataease.plugins.xpack.lark.service.LarkXpackService;
+import io.dataease.plugins.xpack.larksuite.dto.response.LarksuiteMsgResult;
+import io.dataease.plugins.xpack.larksuite.service.LarksuiteXpackService;
 import io.dataease.plugins.xpack.wecom.dto.entity.WecomMsgResult;
 import io.dataease.plugins.xpack.wecom.service.WecomXpackService;
 import io.dataease.service.chart.ViewExportExcel;
@@ -297,6 +299,30 @@ public class EmailTaskHandler extends TaskHandler implements Job {
                                 }
                             }
 
+                        }
+                        break;
+                    case "larksuite":
+                        if (SpringContextUtil.getBean(AuthUserService.class).supportLarksuite()) {
+                            List<String> larksuiteUsers = new ArrayList<>();
+                            for (int j = 0; j < reciLists.size(); j++) {
+                                String reci = reciLists.get(j);
+                                SysUserEntity userBySub = userService.getUserByName(reci);
+                                if (ObjectUtils.isEmpty(userBySub)) continue;
+                                Long userId = userBySub.getUserId();
+                                SysUserAssist sysUserAssist = sysUserService.assistInfo(userId);
+                                if (ObjectUtils.isEmpty(sysUserAssist) || StringUtils.isBlank(sysUserAssist.getLarksuiteId()))
+                                    continue;
+                                larksuiteUsers.add(sysUserAssist.getLarksuiteId());
+                            }
+
+                            if (CollectionUtils.isNotEmpty(larksuiteUsers)) {
+                                LarksuiteXpackService larksuiteXpackService = SpringContextUtil.getBean(LarksuiteXpackService.class);
+                                LarksuiteMsgResult larksuiteMsgResult = larksuiteXpackService.pushOaMsg(larksuiteUsers, emailTemplateDTO.getTitle(), contentStr, bytes, files);
+                                if (larksuiteMsgResult.getCode() != 0) {
+                                    errorMsgs.add("larksuite: " + larksuiteMsgResult.getMsg());
+                                }
+                            }
+
                         }
                         break;
                     default:
diff --git a/backend/src/main/java/io/dataease/service/message/service/strategy/SendLarksuite.java b/backend/src/main/java/io/dataease/service/message/service/strategy/SendLarksuite.java
new file mode 100644
index 0000000000..d5f49cfc77
--- /dev/null
+++ b/backend/src/main/java/io/dataease/service/message/service/strategy/SendLarksuite.java
@@ -0,0 +1,39 @@
+package io.dataease.service.message.service.strategy;
+
+
+import io.dataease.auth.service.AuthUserService;
+import io.dataease.plugins.common.base.domain.SysUserAssist;
+import io.dataease.plugins.config.SpringContextUtil;
+import io.dataease.plugins.xpack.larksuite.service.LarksuiteXpackService;
+import io.dataease.service.message.service.SendService;
+import io.dataease.service.sys.SysUserService;
+import org.apache.commons.lang3.ObjectUtils;
+import org.apache.commons.lang3.StringUtils;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import javax.annotation.Resource;
+import java.util.ArrayList;
+import java.util.List;
+
+@Service("sendLarksuite")
+public class SendLarksuite implements SendService {
+
+    @Autowired
+    private AuthUserService authUserService;
+
+    @Resource
+    private SysUserService sysUserService;
+
+    @Override
+    public void sendMsg(Long userId, Long typeId, String content, String param) {
+        SysUserAssist sysUserAssist = sysUserService.assistInfo(userId);
+        if (ObjectUtils.isNotEmpty(sysUserAssist) && StringUtils.isNotBlank(sysUserAssist.getLarksuiteId()) && authUserService.supportLarksuite()) {
+            String username = sysUserAssist.getLarksuiteId();
+            LarksuiteXpackService larksuiteXpackService = SpringContextUtil.getBean(LarksuiteXpackService.class);
+            List<String> userIds = new ArrayList<>();
+            userIds.add(username);
+            larksuiteXpackService.pushMsg(userIds, content);
+        }
+    }
+}
\ No newline at end of file
diff --git a/backend/src/main/resources/db/migration/V42__1.16.sql b/backend/src/main/resources/db/migration/V42__1.16.sql
index db7fbd29ef..6a02f442ad 100644
--- a/backend/src/main/resources/db/migration/V42__1.16.sql
+++ b/backend/src/main/resources/db/migration/V42__1.16.sql
@@ -37,4 +37,8 @@ ALTER TABLE `dataset_table_field` CHANGE COLUMN `type` `type` VARCHAR(255) NOT N
 INSERT INTO `my_plugin` (`name`, `store`, `free`, `cost`, `category`, `descript`, `version`, `creator`, `load_mybatis`,
                          `install_time`, `module_name`, `ds_type`)
 VALUES ('Apache Kylin 数据源插件', 'default', '0', '0', 'datasource', 'Apache Kylin 数据源插件', '1.0-SNAPSHOT', 'DATAEASE', '0',
-        '1650765903630', 'kylin-backend', 'kylin');
\ No newline at end of file
+        '1650765903630', 'kylin-backend', 'kylin');
+
+
+
+INSERT INTO `sys_msg_channel` (`msg_channel_id`, `channel_name`, `service_name`) VALUES ('6', 'webmsg.channel_larksuite_msg', 'sendLarksuite');
diff --git a/frontend/src/components/GradientColorSelector/base.js b/frontend/src/components/GradientColorSelector/base.js
index 557047a9a5..bf88a65f75 100644
--- a/frontend/src/components/GradientColorSelector/base.js
+++ b/frontend/src/components/GradientColorSelector/base.js
@@ -86,7 +86,7 @@ export const colorCases = [
 export const gradientColorCases = [
   {
     name: '渐变色1',
-    value: 'gradient1',
+    value: 'gradient1_continuous_gradient',
     colors: [
       ['rgba(144,202,249,0.5)', 'rgba(1,87,155,0.9)'],
       ['rgba(127,222,234,1)', 'rgba(0,77,65,1)'],
@@ -101,3 +101,72 @@ export const gradientColorCases = [
 export const isGradientValue = value => {
   return value && gradientColorCases.some(item => item.value === value)
 }
+
+export const getColorType = value => {
+  if (value.endsWith('_split_gradient')) {
+    return 'split_gradient'
+  }
+  const cloneColorCases = JSON.parse(JSON.stringify(colorCases))
+  if (cloneColorCases.some(item => item.value === value)) {
+    return 'simple'
+  }
+  return 'gradient'
+}
+
+export const getMapColorCases = () => {
+  const cloneColorCases = JSON.parse(JSON.stringify(colorCases))
+  return cloneColorCases.map(colorItem => {
+    const curColors = colorItem.colors
+    const len = curColors.length
+    const start = curColors[0]
+    const end = curColors[len - 1]
+    const itemResult = {
+      name: colorItem.name,
+      value: colorItem.value + '_split_gradient',
+      baseColors: [start, end],
+      colors: stepsColor(start, end, 9, 1)
+    }
+    return itemResult
+  })
+}
+
+export function stepsColor(start, end, steps, gamma) {
+  var i; var j; var ms; var me; var output = []; var so = []
+  gamma = gamma || 1
+  var normalize = function(channel) {
+    return Math.pow(channel / 255, gamma)
+  }
+  start = parseColor(start).map(normalize)
+  end = parseColor(end).map(normalize)
+  for (i = 0; i < steps; i++) {
+    ms = (steps - 1) === 0 ? 0 : (i / (steps - 1))
+    me = 1 - ms
+    for (j = 0; j < 3; j++) {
+      so[j] = pad(
+        Math.round(
+          Math.pow(start[j] * me + end[j] * ms, 1 / gamma) * 255
+        ).toString(16)
+      )
+    }
+    output.push('#' + so.join(''))
+  }
+  function parseColor(hexStr) {
+    return hexStr.length === 4
+      ? hexStr
+        .substr(1)
+        .split('')
+        .map(function(s) {
+          return 0x11 * parseInt(s, 16)
+        })
+      : [hexStr.substr(1, 2), hexStr.substr(3, 2), hexStr.substr(5, 2)].map(
+        function(s) {
+          return parseInt(s, 16)
+        }
+      )
+  }
+  function pad(s) {
+    return s.length === 1 ? '0' + s : s
+  }
+  return output
+}
+
diff --git a/frontend/src/components/GradientColorSelector/index.vue b/frontend/src/components/GradientColorSelector/index.vue
index 48da711b0d..8bffc71dab 100644
--- a/frontend/src/components/GradientColorSelector/index.vue
+++ b/frontend/src/components/GradientColorSelector/index.vue
@@ -20,7 +20,7 @@
         <el-tooltip
           class="item"
           effect="dark"
-          content="重置"
+          :content="$t('commons.reset')"
           placement="top"
         >
           <i class="el-icon-refresh" />
@@ -38,7 +38,7 @@
       <div class="custom-switch-div">
         <el-switch
           v-model="enableCustom"
-          active-text="自定义"
+          :active-text="$t('commons.custom')"
           inactive-text=""
         />
       </div>
@@ -47,7 +47,7 @@
         @tab-click="handleClick"
       >
         <el-tab-pane
-          v-for="(pane, i) in tabPanes"
+          v-for="(pane, i) in tabPanes.filter(item => item.name === 'simple' || (showIndex === 1 && item.name === 'split_gradient') || (showIndex === 2 && item.name === 'gradient'))"
           :key="i"
           :label="pane.label"
           :name="pane.name"
@@ -84,22 +84,29 @@
                 v-for="(co,index) in option.colors"
                 v-else
                 :key="index"
-                class="color-span-base is-editor"
+                class="color-span-base"
+                :class="option.value.endsWith('_split_gradient') && index % 8 !== 0 ? 'static-editor' : 'is-editor'"
               >
-                <el-color-picker
-                  v-if="i === 0"
-                  v-model="option.colors[index]"
-                  @change="switchColorItem(option.colors, index)"
+                <span
+                  v-if="option.value.endsWith('_split_gradient') && index % 8 !== 0"
+                  class="color-span-base-split"
+                  :style="{background: formatBgColor(co)}"
                 />
+
                 <de-color-picker
-                  v-else
+                  v-else-if="option.value.endsWith('_continuous_gradient')"
                   :id="option.value + index"
                   ref="de-color-picker"
                   v-model="option.colors[index]"
                   :base-id="option.value + index"
                   show-alpha
                   color-format="rgb"
-                  @change="switchColorItem(option.colors, index)"
+                  @change="switchColorItem(option.colors, option.value)"
+                />
+                <el-color-picker
+                  v-else
+                  v-model="option.colors[index]"
+                  @change="switchColorItem(option.colors, option.value)"
                 />
               </span>
 
@@ -132,7 +139,7 @@
 </template>
 
 <script>
-import { colorCases, gradientColorCases } from './base'
+import { colorCases, gradientColorCases, getMapColorCases, getColorType, stepsColor } from './base'
 import DeColorPicker from './DeColorPicker'
 export default {
   name: 'GradientColorSelector',
@@ -148,6 +155,10 @@ export default {
           colors: []
         }
       }
+    },
+    showIndex: {
+      type: Number,
+      default: 1
     }
   },
   data() {
@@ -161,12 +172,17 @@ export default {
       activeName: 'simple',
       tabPanes: [
         {
-          label: '纯色',
+          label: this.$t('chart.solid_color'),
           name: 'simple',
           data: JSON.parse(JSON.stringify(colorCases))
         },
         {
-          label: '渐变',
+          label: this.$t('chart.split_gradient'),
+          name: 'split_gradient',
+          data: JSON.parse(JSON.stringify(getMapColorCases()))
+        },
+        {
+          label: this.$t('chart.continuous_gradient'),
           name: 'gradient',
           data: JSON.parse(JSON.stringify(gradientColorCases))
         }
@@ -200,10 +216,27 @@ export default {
         parents.scrollTo(0, top)
       }
     },
-    switchColorItem(colors, index) {
-      this.colorDto.colors = JSON.parse(JSON.stringify(colors))
+    switchColorItem(colors, value) {
+      const activeName = getColorType(value)
+      if (activeName === 'split_gradient') {
+        const start = colors[0]
+        const end = colors[colors.length - 1]
+        const targetColors = stepsColor(start, end, 9, 1)
+        this.colorDto.colors = JSON.parse(JSON.stringify(targetColors))
+        this.fillSplitGradientPanel()
+      } else {
+        this.colorDto.colors = JSON.parse(JSON.stringify(colors))
+      }
+
       this.$emit('color-change', JSON.parse(JSON.stringify(this.colorDto)))
     },
+    fillSplitGradientPanel() {
+      this.tabPanes[1].data.forEach(item => {
+        if (item.value === this.colorDto.value) {
+          item.colors = this.colorDto.colors
+        }
+      })
+    },
     initcolorDto() {
       let haspPropValue = true
       if (!this.colorDto.value) {
@@ -211,9 +244,9 @@ export default {
         this.colorDto.colors = this.colorCases[0].colors
         haspPropValue = false
       }
-      this.activeName = this.colorCases.some(item => item.value === this.colorDto.value) ? 'simple' : 'gradient'
+      this.activeName = getColorType(this.colorDto.value)
       if (haspPropValue) {
-        this.tabPanes[this.activeName === 'simple' ? 0 : 1].data.forEach(item => {
+        this.tabPanes[this.activeName === 'simple' ? 0 : this.activeName === 'split_gradient' ? 1 : 2].data.forEach(item => {
           if (item.value === this.colorDto.value) {
             item.colors = JSON.parse(JSON.stringify(this.colorDto.colors))
           }
@@ -270,14 +303,15 @@ export default {
           return str
         })
       })
-      this.tabPanes[1].data = JSON.parse(JSON.stringify(this.gradientColorCases))
+      const len = this.tabPanes.length
+      this.tabPanes[len - 1].data = JSON.parse(JSON.stringify(this.gradientColorCases))
     },
     formatBgColor(color, useValue) {
       let activeName = this.activeName
       if (useValue) {
-        activeName = this.colorCases.some(item => item.value === this.colorDto.value) ? 'simple' : 'gradient'
+        activeName = getColorType(this.colorDto.value)
       }
-      if (activeName === 'simple') {
+      if (activeName === 'simple' || activeName === 'split_gradient') {
         return color
       }
       return 'linear-gradient(0.0deg,' + color[0] + ' 0.0,' + color[1] + ' 100.0%)'
@@ -296,11 +330,8 @@ export default {
     },
     reset() {
       if (this.colorDto.value) {
-        let activeName = 'simple'
-        if (this.gradientColorCases.some(item => item.value === this.colorDto.value)) {
-          activeName = 'gradient'
-        }
-        (activeName === 'simple' ? colorCases : gradientColorCases).forEach(curcase => {
+        const activeName = getColorType(this.colorDto.value);
+        (activeName === 'simple' ? colorCases : activeName === 'split_gradient' ? getMapColorCases() : gradientColorCases).forEach(curcase => {
           if (curcase.value === this.colorDto.value) {
             this.colorDto.colors = JSON.parse(JSON.stringify(curcase.colors))
             this.$emit('color-change', JSON.parse(JSON.stringify(this.colorDto)))
@@ -318,7 +349,7 @@ export default {
 }
 .gradient-popper {
   background: #fff;
-  padding: 0 10px;
+  padding: 0 10px !important;
   margin-top: 1px !important;
   border-top: none;
   height: 300px;
@@ -340,7 +371,8 @@ export default {
 .color-span-base {
   width: 20px;
   height: 20px;
-  display:inline-block;
+  display:flex;
+  align-items: center;
 }
 .is-editor {
   width:23px !important;
@@ -352,7 +384,11 @@ export default {
   align-items: center !important;
   cursor: pointer;
   padding-left: 5px !important;
+  .static-editor:nth-child(2) {
+    margin-left: 5px !important;
+  }
 }
+
 .custom-switch-div {
   position: absolute;
   top: 8px;
@@ -380,4 +416,11 @@ export default {
     }
   }
 }
+.is-split {
+  width: 28px !important;
+}
+.color-span-base-split {
+  width: 20px;
+  height: 20px;
+}
 </style>
diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js
index e17d775d0b..4f82005fc9 100644
--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@@ -912,6 +912,9 @@ export default {
     password_input_error: 'Original password input error'
   },
   chart: {
+    solid_color: 'Solid color',
+    split_gradient: 'Split gradient',
+    continuous_gradient: 'Continuous gradient',
     map_center_lost: 'The graph is missing the centroid or center attribute, please complete it and try again',
     margin_model: 'Model',
     margin_model_auto: 'Auto',
diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js
index 49ad2ec52a..f78a36a957 100644
--- a/frontend/src/lang/tw.js
+++ b/frontend/src/lang/tw.js
@@ -912,6 +912,9 @@ export default {
     password_input_error: '原始密碼輸入錯誤'
   },
   chart: {
+    solid_color: '純色',
+    split_gradient: '分離漸變',
+    continuous_gradient: '連續漸變',
     map_center_lost: '圖形缺失中心點centroid或center屬性，請補全後再試',
     margin_model: '模式',
     margin_model_auto: '自動',
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index f3b9652ced..32046fca47 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -911,6 +911,9 @@ export default {
     password_input_error: '原始密码输入错误'
   },
   chart: {
+    solid_color: '纯色',
+    split_gradient: '分离渐变',
+    continuous_gradient: '连续渐变',
     map_center_lost: '图形缺失中心点centroid或center属性，请补全后再试',
     margin_model: '模式',
     margin_model_auto: '自动',