Merge branch 'master' into fix_4248_owner_exit

dm/ui/locales/en.json

@@ -5,6 +5,7 @@
  "add new source": "Add new source",
  "add source config": "Add source config",
  "address": "address",
+ "are you sure to delete task {{name}}": "Are you sure to delete task \"{{name}}\"?",
  "are you sure to offline this master": "Are you sure to offline this master",
  "are you sure to offline this worker": "Are you sure to offline this worker",
  "basic info": "Basics",
@@ -33,6 +34,7 @@
  "enable gtid": "Enable GTID",
  "enable relay": "Enable relay",
  "enabled": "Enabled",
+ "error": "Error",
  "event filter": "Event filter",
  "event filter ignore event": "Ignore event",
  "event filter ignore sql": "Ignore SQL",
@@ -71,14 +73,15 @@
  "password is required": "Password is required",
  "pause": "Pause",
  "please check the log": "Please check the log",
+ "please select at least one task": "Please select at least one task",
  "port": "Port",
  "port is required": "Port is required",
  "previous": "Previous",
  "processing imports": "Processing imports",
  "reading task list": "Reading task list",
  "refresh": "Refresh",
  "relay config (optional)": "Relay log (optional)",
- "relay log": "Relay Log",
+ "replication detail": "Replication Detail",
  "request success": "Request success",
  "requesting": "Requesting",
  "resume": "Resume",
@@ -93,9 +96,10 @@
  "source name": "Source name",
  "source name is required": "Source name is required",
  "start import": "Start import",
+ "start task": "Start",
+ "start task and remove meta data": "Remove meta and tart task",
  "status": "Status",
  "sync config": "Replication config",
- "sync detail": "Sync Detail",
  "synchronous concurrency": "Sync concurrency",
  "table": "Table",
  "target": "Target",
@@ -113,10 +117,6 @@
  "user name": "User",
  "user name is required": "User name is required",
  "view": "View",
- "{{count}} filters": "{{count}} filter",
- "{{count}} filters_plural": "{{count}} filters",
- "{{count}} rules": "{{count}} rule",
- "{{count}} rules_plural": "{{count}} rules",
- "{{val}} and other {{count}}": "{{val}}",
- "{{val}} and other {{count}}_plural": "{{val}} and {{count}} others"
+ "{{val}} and {{count}} others": "{{val}} and {{count}} in total",
+ "{{val}} and {{count}} others_plural": "{{val}} and {{count}} in total"
 }

dm/ui/locales/zh.json

@@ -5,6 +5,7 @@
  "add new source": "添加上游",
  "add source config": "添加上游配置",
  "address": "地址",
+ "are you sure to delete task {{name}}": "确定要删除任务 \"{{name}}\" 吗?",
  "are you sure to offline this master": "确定要下线此主节点吗？",
  "are you sure to offline this worker": "确定要下线此从节点吗？",
  "basic info": "基本信息",
@@ -33,6 +34,7 @@
  "enable gtid": "启用 GTID",
  "enable relay": "启用 Relay log",
  "enabled": "已启用",
+ "error": "错误",
  "event filter": "事件过滤",
  "event filter ignore event": "忽略事件",
  "event filter ignore sql": "忽略 SQL",
@@ -71,14 +73,15 @@
  "password is required": "密码不能为空",
  "pause": "暂停",
  "please check the log": "请查看日志",
+ "please select at least one task": "请选择至少一个任务",
  "port": "端口",
  "port is required": "端口不能为空",
  "previous": "上一步",
  "processing imports": "正在导入中",
  "reading task list": "读取任务列表",
  "refresh": "刷新",
  "relay config (optional)": "Relay 配置 (可选)",
- "relay log": "Relay 日志",
+ "replication detail": "同步详情",
  "request success": "请求成功",
  "requesting": "请求中",
  "resume": "恢复",
@@ -93,9 +96,10 @@
  "source name": "名称",
  "source name is required": "名称不能为空",
  "start import": "开始导入",
+ "start task": "启动任务",
+ "start task and remove meta data": "清理元数据启动",
  "status": "状态",
  "sync config": "同步配置",
- "sync detail": "同步详情",
  "synchronous concurrency": "同步并发数",
  "table": "表",
  "target": "下游",
@@ -113,7 +117,6 @@
  "user name": "用户名",
  "user name is required": "用户名不能为空",
  "view": "查看",
- "{{count}} filters_0": "{{count}} 条",
- "{{count}} rules_0": "{{count}} 条",
- "{{val}} and other {{count}}_0": "{{val}} 等 {{count}} 个"
+ "{{val}} and {{count}} others": "{{val}} 等总计 {{count}} 个",
+ "{{val}} and {{count}} others_plural": "{{val}} 等总计 {{count}} 个"
 }

dm/ui/package.json

@@ -50,7 +50,7 @@
  "less": "^4.1.2",
  "lint-staged": "^12.1.2",
  "msw": "^0.36.3",
- "msw-auto-mock": "^0.5.0",
+ "msw-auto-mock": "^0.5.2",
  "prettier": "^2.5.1",
  "rollup-plugin-visualizer": "^5.5.2",
  "typescript": "4.5.4",

dm/ui/src/components/BatchImportTaskConfig/index.tsx

@@ -24,7 +24,7 @@ const BlinkingText: React.FC<{ text: string; active: boolean }> = ({
 
  useEffect(() => {
  if (active) {
- timer.current = window.setInterval(() => setCount(c => c + 1), 300)
+ timer.current = window.setInterval(() => setCount(c => (c + 1) % 4), 300)
  }
  return () => {
  if (timer.current) {
@@ -49,7 +49,7 @@ const BatchImportTaskConfig: React.FC = () => {
  const [overwrite, setOverwrite] = useState(false)
  const [batchImportTaskConfig] = useDmapiBatchImportTaskConfigMutation()
  const timerId = useRef<number>()
- const stopTimer = useRef<boolean>(false)
+ const stopTimer = useRef(false)
 
  const calcStepStatus = (thisStep: number): Pick<StepProps, 'status'> => {
  if (currentStep === thisStep) {

dm/ui/src/components/CreateTaskConfig/MigrateRule.tsx

@@ -21,12 +21,13 @@ const itemLayout = {
  wrapperCol: { span: 18 },
 }
 
-const createPattern = (name: string[]) => name.join('|')
+const createPattern = (name: string[]) =>
+ name.length === 0 ? '*' : name.join('|')
 
 const MigrateRule: StepCompnent = ({ prev, initialValues }) => {
  const [t] = useTranslation()
  const [currentSource, setCurrentSource] = useState('')
- const [cascaderValue, setCascaderValue] = useState<string[]>([])
+ const [cascaderValue, setCascaderValue] = useState<string[][]>([])
  const [form] = Form.useForm()
  const { data } = useDmapiGetSourceListQuery({ withStatus: false })
  const [getSourceTable] = useDmapiGetSourceTableListMutation()
@@ -59,6 +60,28 @@ const MigrateRule: StepCompnent = ({ prev, initialValues }) => {
  setCascaderOptions([...cascaderOptions])
  }
 
+ const handelSchemaSelectInCascader = (value: string[][], field: any) => {
+ setCascaderValue(value)
+ const dbPattern = createPattern([
+ ...new Set(value.map((item: string[]) => item[0])),
+ ] as string[])
+ const tablePattern = createPattern([
+ ...new Set(value.map((item: string[]) => item[1]).filter(Boolean)),
+ ] as string[])
+ const newData = [...form.getFieldValue('table_migrate_rule')]
+ newData[field.key] = {
+ ...newData[field.key],
+ source: {
+ ...newData[field.key].source,
+ schema: dbPattern,
+ table: tablePattern,
+ },
+ }
+ form.setFieldsValue({
+ table_migrate_rule: newData,
+ })
+ }
+
  useEffect(() => {
  if (schemas) {
  setCascaderOptions(
@@ -124,35 +147,9 @@ const MigrateRule: StepCompnent = ({ prev, initialValues }) => {
  multiple
  maxTagCount="responsive"
  value={cascaderValue}
- onChange={(value: any) => {
- setCascaderValue(value)
- const dbPattern = createPattern([
- ...new Set(
- value.map((item: string[]) => item[0])
- ),
- ] as string[])
- const tablePattern = createPattern([
- ...new Set(
- value
- .map((item: string[]) => item[1])
- .filter(Boolean)
- ),
- ] as string[])
- const newData = [
- ...form.getFieldValue('table_migrate_rule'),
- ]
- newData[field.key] = {
- ...newData[field.key],
- source: {
- ...newData[field.key].source,
- schema: dbPattern,
- table: tablePattern,
- },
- }
- form.setFieldsValue({
- table_migrate_rule: newData,
- })
- }}
+ onChange={(val: any) =>
+ handelSchemaSelectInCascader(val, field)
+ }
  >
  {isFetching ? (
  <LoadingOutlined />

dm/ui/src/components/CreateTaskConfig/TargetInfo.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { useTranslation } from 'react-i18next'
 
-import { Form, Input, Button } from '~/uikit'
+import { Form, Input, Button, InputNumber } from '~/uikit'
 import { StepCompnent } from '~/components/CreateTaskConfig/shared'
 
 const IPv4Pattern =
@@ -38,7 +38,7 @@ const TargetInfo: StepCompnent = ({ prev, initialValues }) => {
  name={['target_config', 'port']}
  rules={[{ required: true, message: t('port is required') }]}
  >
- <Input placeholder="3306" />
+ <InputNumber min={1} max={65535} />
  </Form.Item>
 
  <Form.Item
@@ -55,17 +55,7 @@ const TargetInfo: StepCompnent = ({ prev, initialValues }) => {
  <Input placeholder="root" />
  </Form.Item>
 
- <Form.Item
- label={t('password')}
- name={['target_config', 'password']}
- rules={[
- {
- required: true,
- whitespace: true,
- message: t('password is required'),
- },
- ]}
- >
+ <Form.Item label={t('password')} name={['target_config', 'password']}>
  <Input type="password" />
  </Form.Item>
  </div>

dm/ui/src/components/CreateTaskConfig/index.tsx

@@ -1,7 +1,7 @@
-import React, { useState, useCallback } from 'react'
+import React, { useState, useCallback, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import { merge } from 'lodash'
-import { useNavigate } from 'react-router-dom'
+import { useNavigate, useLocation } from 'react-router-dom'
 
 import { Card, Form, Steps, message } from '~/uikit'
 import {
@@ -15,7 +15,10 @@ import SourceInfo from '~/components/CreateTaskConfig/SourceInfo'
 import TargetInfo from '~/components/CreateTaskConfig/TargetInfo'
 import EventFilters from '~/components/CreateTaskConfig/EventFilter'
 import MigrateRule from '~/components/CreateTaskConfig/MigrateRule'
-import { useDmapiCreateTaskConfigMutation } from '~/models/taskConfig'
+import {
+ useDmapiCreateTaskConfigMutation,
+ useDmapiGetTaskConfigQuery,
+} from '~/models/taskConfig'
 
 const { Step } = Steps
 
@@ -48,10 +51,16 @@ const stepComponents = [
 const CreateTaskConfig: React.FC = () => {
  const [t] = useTranslation()
  const navigate = useNavigate()
+ const loc = useLocation()
+ const shouldFetch = loc.hash.startsWith('#edit')
+ const [loading, setLoading] = useState(true)
  const [currentStep, setCurrentStep] = useState(0)
  const [taskData, setTaskData] = useState<TaskFormData>(defaultValue)
  const [createTaskConfig] = useDmapiCreateTaskConfigMutation()
-
+ const { data } = useDmapiGetTaskConfigQuery(
+ { taskName: loc.hash.split('-')[1] },
+ { skip: !shouldFetch }
+ )
  const goNextStep = useCallback(() => {
  setCurrentStep(c => c + 1)
  }, [])
@@ -94,8 +103,21 @@ const CreateTaskConfig: React.FC = () => {
  })
  }
 
+ useEffect(() => {
+ if (shouldFetch && data) {
+ setTaskData(
+ merge({}, defaultValue, data, {
+ binlog_filter_rule_array: Object.entries(
+ data?.binlog_filter_rule ?? {}
+ ).map(([name, value]) => ({ name, ...value })),
+ })
+ )
+ setLoading(false)
+ }
+ }, [shouldFetch, data])
+
  return (
- <Card className="!m-4">
+ <Card className="!m-4" loading={shouldFetch && loading}>
  <Steps current={currentStep}>
  <Step title={t('basic info')} />
  <Step title={t('source info')} />