feat: 删除多余页面

config/webpack.common.js

@@ -16,7 +16,7 @@ const plugins = [
     languages: ['sql', 'javascript']
   }),
   new HtmlWebpackPlugin({
-    title: "统一数据门户",
+    title: "运营数据中心",
     filename: "transfer.html",
     stylefile: path.resolve(__dirname, "../src/assets/css/common.css"),
     template: path.resolve(__dirname, "../public/index.html"),

config/webpack.dev.js

@@ -128,14 +128,14 @@ module.exports = merge(common, {
     // inline: true, // 实时刷新
     // contentBase: join(__dirname, "../dist"),
     compress: true,
-    port: 9003,
+    port: 9008,
     host: "0.0.0.0",
     hot: true,
     proxy: {
       "/api": {
         // target: "http://47.96.100.195:9081"
         // target: "http://dataportal-test.agile.com.cn:8081"
-        target: "http://14.29.205.92:9081",
+        target: "http://106.52.242.177:9081",
         // target:"http://dataportal.dtyunxi.cn/demo",
         changeOrigin:true,
 

src/index.js

@@ -78,9 +78,9 @@ if (ticket && ssoEmpId) {
 // reportWebVitals();
 
 if (process.env.NODE_ENV === "production") {
-  document.title = "统一数据门户";
+  document.title = "运营数据中心";
 } else {
-  document.title = "(测试)统一数据门户";
+  document.title = "(测试)运营数据中心";
 }
 
 // 获取socket id , 建立socket连接

src/pages/SqlIndex/FilesPopUp/style.less

@@ -1,31 +0,0 @@
-.sqlIndexFiles {
-    max-height: calc(100vh - 170px);
-    padding: 0 !important;
-
-    :global {
-        // 默认隐藏滚动条
-        .ant-table-body {
-            overflow: hidden !important;
-
-            &:hover {
-                overflow: auto !important;
-            }
-        }
-
-        // 组件消除内边距(Modal, Popover)
-        .ant-modal-body,
-        .ant-popover-inner-content,
-        .ant-card-body {
-            padding: 0 !important;
-        }
-
-        // 弹出窗，SQL 文件列表的表格样式
-        .tablePading {
-
-            .ant-table-tbody>tr>td,
-            .ant-table-thead>tr>th {
-                padding: 13px 16px !important;
-            }
-        }
-    }
-}

src/pages/SqlIndex/FilesPopUp/view.jsx

@@ -1,187 +0,0 @@
-import React, { Component } from 'react'
-import { DeleteOutlined } from '@ant-design/icons'
-import { Card, Input, Table, Modal,Tooltip } from 'antd'
-const { confirm } = Modal
-import { observer, inject } from 'mobx-react'
-import SqlIndexMod from '../SqlIndexMod'
-
-import styles from './style.less'
-import { SearchInput } from '../SearchInput/SearchInput'
-
-/**
- * sql文件列表弹出窗
- */
-// 在视图注入module层数据
-// 将组件设置为响应式组件，成为观察者，以便响应被观察数据的变化
-@observer
-export default class FilesPopUp extends Component {
-  selfRef = React.createRef()
-
-  static fixWidth = 330
-
-  constructor(props) {
-    super(props)
-    this.stores = SqlIndexMod
-
-    this.state = {
-      focusIndex: '-1',
-      fileList: []
-    }
-  }
-
-
-  resetFileList = () => {
-    this.setState({
-      fileList: this.originFileList()
-    })
-  }
-
-  componentDidMount() {
-    console.log(document.getElementById('outerContainer'))
-    const rect = document.getElementById('outerContainer') ? document.getElementById('outerContainer').getBoundingClientRect() : 0
-    this.tableScrollHeight = document.body.offsetHeight - rect.top - 168
-    this.updateFileList()
-  }
-
-  updateFileList = () => {
-    this.stores.getFileList(((data)=>{
-      this.setState({
-        fileList: data
-      })  
-    }))
-  }
-
-  deleteFileAndUpdate = (fileId) => {
-    this.stores.deleteFile({ id: fileId }).then(() => {
-      this.updateFileList()
-    })
-  }
-
-  getFileList = (fileList) => {
-    const list = []
-    for (let i = 0; i < fileList.length; i++) {
-      list.push({ key: i, ...fileList[i] })
-    }
-
-    return list
-  }
-
-  doSearch = (text) => {
-    const { fileList } = this.stores.state;
-    const filterFileList = fileList.filter((value) => {
-      return value.sqlFileName.indexOf(text) != -1
-    })
-
-    this.setState({
-      fileList: filterFileList
-    })
-  }
-    /**
-   * 表名列表
-   */
-     columnsTableName = [
-        {
-          title: '文件名称',
-          dataIndex: 'sqlFileName',
-          key: 'key',
-          ellipsis: true,
-          render: (text) => {
-            return (
-              <Tooltip title={text}>
-                <span className="textEllipsis">{text}</span>
-              </Tooltip>
-            )
-          }
-        },
-        {
-          title: '创建时间',
-          dataIndex: 'createTime',
-          key: 'key',
-          width: 200,
-          render: (text, item, index) => (
-            <span style={{ width: '100%' }}>
-              {text ? text : ' - '}
-              <DeleteOutlined
-                style={{
-                  marginLeft: '10px',
-                  width: '30px',
-                  visibility: this.state.focusIndex == item.key ? 'visible' : 'hidden'
-                }}
-                onClick={(e) => {
-                  e.stopPropagation()
-    
-                  confirm({
-                    centered: true,
-                    title: '确认要删除SQL文件吗？',
-                    content: `${item.sqlFileName}`,
-                    okText: '删除',
-                    okType: 'primary',
-                    cancelText: '取消',
-                    onOk: () => {
-                      this.deleteFileAndUpdate(item.id)
-                    }
-                  })
-                }}
-              />
-            </span>
-          )
-        }
-      ]
-    
-      render() {
-        const { fileList } = this.state
-    
-        return (
-          <Card
-            ref={(dom) => {
-              this.selfRef = dom
-            }}
-            id="outerContainer"
-            className={styles.sqlIndexFiles}
-            style={{ width: FilesPopUp.fixWidth }}
-            title="SQL文件"
-          >
-            <SearchInput
-              size={'middle'}
-              placeholder="请输入名称搜索"
-              allowClear
-              onSearch={(text) => {
-                this.doSearch(text)
-              }}
-              onChange={(e) => {
-                const { value } = e.target
-                if (value.length == 0) {
-                  this.resetFileList()
-                } else {
-                  this.doSearch(value)
-                }
-              }}
-            />
-                    <Table
-          className={styles.tablePading}
-          pagination={false}
-          columns={this.columnsTableName}
-          dataSource={this.getFileList(fileList)}
-          onRow={(record) => {
-            return {
-              onMouseEnter: () => {
-                this.setState({
-                  focusIndex: record.key
-                })
-              },
-              onMouseLeave: () => {
-                this.setState({
-                  focusIndex: '-1'
-                })
-              },
-              onClick: () => {
-                this.props.onFileSelect(record)
-              }
-            }
-          }}
-          scroll={{ y: this.tableScrollHeight }}
-        />
-      </Card>
-    )
-  }
-}

src/pages/SqlIndex/LeftTableList.jsx

@@ -1,516 +0,0 @@
-import React, { Component } from 'react'
-import { observer, inject } from 'mobx-react'
-import { Tree, TreeSelect, Typography, Input, Table, Tooltip, Modal } from 'antd'
-import { Form } from '@ant-design/compatible';
-
-import DynamicTooltip from '@widget/DynamicTooltip/DynamicTooltip'
-import { SearchInput } from './SearchInput/SearchInput'
-import SqlIndexMod from './SqlIndexMod'
-const { TreeNode } = Tree
-const { Search } = Input
-const { warn } = Modal
-// 
-// 工具方法
-import { cloneDeep, debounce, isEmpty } from 'lodash'
-
-// 引入当前页样式 - 模块化
-import styles from './sqlIndexStyle.less'
-
-import { FixedSizeList as List } from 'react-window'
-import AutoSizer from 'react-virtualized-auto-sizer'
-
-/**
- * 数据查询主页
- */
-// 将组件设置为响应式组件，成为观察者，以便响应被观察数据的变化
-@observer
-export default class extends Component {
-  // 构造函数，组件的实例创建时，最先执行
-  constructor(props, context) {
-    super(props, context)
-    this.stores = SqlIndexMod
-
-    this.state = {
-      treeMaxHeight: 0,
-      query: this.props.query,
-
-      // 用于虚拟滚动的高度计算，bottom的暂时没用到
-      leftTopListHeight: 0,
-      leftBottomListHeight: 0
-    }
-
-    this.leftTopDataListContainer = React.createRef()
-  }
-
-  componentDidMount() {
-    this.stores.resetAll()
-    this.getContainersId()
-    this.addListener()
-
-    // 页面加载完不会触发resize，这里手动调用一次
-    this.debounceResizeHandler()
-  }
-
-  // 标记首次渲染状态，避免多次渲染触发了多次首次渲染的逻辑
-  isDataExist = false
-
-  componentWillUnmount() {
-    this.isDataExist = false
-    this.removeListener()
-  }
-
-  componentWillReceiveProps(nextProps) {
-    /**
-     * 由于渲染顺序的问题，首次打开数据查询页面时，
-     * 这里的componentDidMount和componentWillReceiveProps都会触发一次
-     * 所以用isDataExist来区分
-     */
-    if (this.isDataExist) {
-      this.handleDataFromProps(nextProps.query)
-    } else {
-      this.isDataExist = true
-      this.stores.getAllDsAndDbsAndTables().then(() => {
-        this.stores.recoveryEditorTabsFromLocalStorage().then(() => {
-          this.stores.updateTablesAndSetDefault()
-          this.getTreeDefaultExpandedKeys()
-          this.handleDataFromProps(this.state.query)
-          this.dbsTreeNode = this.treeNodeChildRender(this.getDbsTreeData())
-        })
-      })
-    }
-  }  
-  getStyle = (element, attr) => {
-    // 兼容IE浏览器
-    if (element.currentStyle) {
-      return element.currentStyle[attr]
-    } else {
-      return getComputedStyle(element, false)[attr]
-    }
-  }
-
-  debounceResizeHandler = debounce(() => {
-    const { clientHeight } = document.body
-
-    const treeRect = this.dsTreeContainer.getBoundingClientRect()
-    const treeMaxHeight = clientHeight - treeRect.top - 60
-
-    this.setState({
-      treeMaxHeight: treeMaxHeight
-    })
-  }, 100)
-
-  // 虚拟列表会实时自动计算宽高，在拉动分割线调整高度时会有比较严重的卡顿，这里用防抖避免该问题
-  debounceResizeListHeight = debounce((newTopHeight, newBottomHeight) => {
-    this.setState({
-      leftTopListHeight: newTopHeight,
-      leftBottomListHeight: newBottomHeight
-    })
-  }, 200)
-
-  getStyle = (element, attr) => {
-    // 兼容IE浏览器
-    if (element.currentStyle) {
-      return element.currentStyle[attr]
-    } else {
-      return getComputedStyle(element, false)[attr]
-    }
-  }
-
-  getContainersId() {
-    this.dsTreeContainer = document.getElementById('sqlIndexDsTreeSelectContainer')
-    this.bottomDataList = document.getElementById('bottomDataList')
-
-    this.sqlIndexLeftResizeLine = document.getElementById('sqlIndexLeftResizeLine')
-  }
-
-  addListener() {
-    window.addEventListener('resize', this.debounceResizeHandler)
-
-    this.sqlIndexLeftResizeLine.addEventListener('mousedown', this.handleLeftResizeLineMouseDown)
-  }
-
-  removeListener() {
-    window.removeEventListener('resize', this.debounceResizeHandler)
-
-    this.sqlIndexLeftResizeLine.removeEventListener('mousedown', this.handleLeftResizeLineMouseDown)
-  }
-  handleLeftResizeLineMouseDown = (e) => {
-    e.preventDefault()
-
-    const startY = e.clientY
-    const oldHeight = parseInt(window.getComputedStyle(this.bottomDataList).height)
-    const oldTopHeight = parseInt(window.getComputedStyle(this.leftTopDataListContainer.current).height)
-
-    document.onmousemove = (evt) => {
-      const offset = evt.clientY - startY
-      const newTopHeight = oldTopHeight + offset
-      const newBottomHeight = oldHeight - offset
-      this.leftTopDataListContainer.current.style.height = newTopHeight + 'px'
-      this.bottomDataList.style.height = newBottomHeight + 'px'
-
-      if (newTopHeight < 100) {
-        return
-      }
-
-      this.debounceResizeListHeight(newTopHeight, newBottomHeight)
-    }
-
-    document.onmouseup = (evt) => {
-      evt.stopPropagation()
-      document.onmousemove = null
-      document.onmouseup = null
-    }
-  }
-
-  /**
-   * 处理路由跳转过来携带的参数
-   * @param {*} query
-   */
-  handleDataFromProps(query) {
-    if (query) {
-      // 跳转过来前已经做了权限判断，这里不需要再判断权限
-      this.stores.addEditorTabFromQuery(query)
-    }
-  }
-
-  // 防抖处理，避免每次双击都触发两次选中逻辑
-  debounceTableRowClick = debounce(
-    (row) => {
-      const { dbInfo } = row
-
-      // 已选择当前项，不再重复触发选择操作
-      if (this.stores.isRowSelected(row)) {
-        return
-      }
-
-      this.stores.updateSelectedTableRow(dbInfo)
-    },
-    300,
-    {
-      trailing: true
-    }
-  )
-
-  handleFieldClickRow = (row, index) => {
-    return {
-      onClick: () => {
-        this.stores.updateFieldSelectedId(row.key)
-      }
-    }
-  }
-
-  doSearch = (text) => {
-    this.stores.updateTableNameFilter(text)
-  }
-  
-  // 把数据转成Tree组件的可用数据格式
-  getDbsTreeData = () => {
-    const { allDsAndDbs } = this.stores.state
-    const result = allDsAndDbs.map((parentValue) => {
-      return {
-        title: (
-          // <DynamicTooltip placement="right" title={parentValue.name}>
-            <Typography.Text ellipsis={true}>{parentValue.name}</Typography.Text>
-          // </DynamicTooltip> 
-        ),
-        value: parentValue.dsId,
-        key: parentValue.dsId,
-        selectable: false,
-        children: parentValue.dbs.map((value) => {
-          const fullName = `${parentValue.name}.${value.dataBaseName}`
-          return {
-            title: (
-              // <DynamicTooltip placement="right" title={value.dataBaseName}>
-                <Typography.Text ellipsis={true}>{value.dataBaseName}</Typography.Text>
-              // </DynamicTooltip>
-            ),
-            value: fullName,
-            key: fullName,
-            parentId: parentValue.dsId,
-            parentName: parentValue.name,
-            // 用于回显
-            selectedFullDbName: fullName
-          }
-        })
-      }
-    })
-
-    result.unshift({
-      title: (
-        <Tooltip placement="right" title="列出全部表名">
-          全部
-        </Tooltip>
-      ),
-      value: '全部',
-      key: 'all',
-      selectable: true
-    })
-
-    return result
-  }
-
-  /**
-   * 数据源下拉框默认展开第一项
-   */
-  getTreeDefaultExpandedKeys = () => {
-    let result = null
-    this.dbsTreeData = this.getDbsTreeData()
-    const treeData = this.dbsTreeData
-    if (treeData && treeData.length > 1) {
-      const firstItem = treeData[0]
-
-      // 0是全部
-      result = [firstItem.key]
-    }
-
-    this.defaultExpandedKeys = result
-  }
-
-  treeNodeChildRender = (treeData) => {
-    if (!treeData || !treeData.length) {
-      return
-    }
-
-    return treeData.map((v, i) => {
-      return (
-        <TreeNode blockNode key={v.key} {...v}>
-          {v.children && this.treeNodeChildRender(v.children)}
-        </TreeNode>
-      )
-    })
-  }
-  
-  getFieldDS = () => {
-    const { curTableFields } = this.stores.state
-
-    return curTableFields
-      ? curTableFields.map((value, index) => {
-          return {
-            key: index,
-            ...value
-          }
-        })
-      : []
-  }
-
-  /**
-   * 字段列表
-   */
-  fieldColumns = [
-    {
-      title: 'name',
-      dataIndex: 'columnName',
-      key: 'columnName',
-      width: '35%',
-      ellipsis: true,
-      render: (text) => (
-        // <DynamicTooltip placement="topLeft" title={text}>
-          <Typography.Text ellipsis={true}>{text}</Typography.Text>
-        // </DynamicTooltip>
-      )
-    },
-    {
-      title: 'name',
-      dataIndex: 'columnType',
-      key: 'columnType',
-      width: '25%',
-      ellipsis: true,
-      render: (text) => (
-        // <DynamicTooltip placement="topLeft" title={text}>
-          <Typography.Text ellipsis={true}>{text}</Typography.Text>
-        // </DynamicTooltip>
-      )
-    },
-    {
-      title: 'name',
-      dataIndex: 'columnRemarks',
-      key: 'columnRemarks',
-      width: '25%',
-      ellipsis: true,
-      render: (text) => (
-        // <DynamicTooltip placement="topLeft" title={text}>
-          <Typography.Text ellipsis={true}>{text}</Typography.Text>
-        // </DynamicTooltip>
-      )
-    }
-  ]
-
-  parseDbInfoToKey = (dbInfo) => {
-    const { dsId, dsName, dbName, tableName } = dbInfo
-    return `${dsId}.${dbName}.${tableName}`
-  }
-
-  getTableDS = (selectedDbTables) => {
-    return selectedDbTables
-      ? selectedDbTables.map((value, index) => {
-          return {
-            key: this.parseDbInfoToKey(value),
-            name: value.tableName,
-            dbInfo: value
-          }
-        })
-      : []
-  }
-  topRowRenderer = ({ index, style }) => {
-    const { selectedDbTables } = this.stores
-    const { selectedFullDbName } = this.stores.state
-    const list = this.getTableDS(selectedDbTables)
-    const item = list[index]
-    const { dsName, dbName, tableName } = item.dbInfo
-    const tooltip = selectedFullDbName == '全部' ? `${dsName}.${dbName}.${tableName}` : tableName
-    return (
-      <div
-        className={`${[styles.tableRow]} ${this.stores.isRowSelected(item) ? styles.tableRowSelected : null}`}
-        style={{ ...style }}
-        onClick={() => this.debounceTableRowClick(item)}
-        onDoubleClick={() => this.stores.updateTabOrAddTab(item.dbInfo)}
-      >
-        <div className={[styles.rowInner]}>
-          {/* <DynamicTooltip placement="right" title={tooltip}> */}
-            <Typography.Text ellipsis={true}>{tableName}</Typography.Text>
-          {/* </DynamicTooltip> */}
-        </div>
-      </div>
-    )
-  }
-
-  getTableColumns = () => {
-    const { selectedFullDbName } = this.stores.state
-    return [
-      {
-        title: 'name',
-        dataIndex: 'name',
-        key: 'key',
-        ellipsis: true,
-        render: (text, item, index) => {
-          const { dsName, dbName } = item.dbInfo
-          const tooltip = selectedFullDbName == '全部' ? `${dsName}.${dbName}.${text}` : text
-          return (
-            <div>
-              {/* <DynamicTooltip placement="right" title={tooltip}> */}
-                <Typography.Text ellipsis={true}>{text}</Typography.Text>
-              {/* </DynamicTooltip> */}
-            </div>
-          )
-        }
-      }
-    ]
-  }
-  render() {
-    const { selectedFullDbName, treeExpandKeys, fieldSelectedId, selectedTableRow } = this.stores.state
-    const { selectedDbTables } = this.stores
-    const { treeMaxHeight } = this.state
-    return (
-        <div className={[styles.containerInside]}>
-          <div id="sqlIndexDsTreeSelectContainer" className={[styles.top]}>
-            <TreeSelect
-              showSearch
-              className={[styles.containerContent]}
-              dropdownStyle={{
-                textOverflow: 'clip',
-                maxHeight: treeMaxHeight,
-                maxWidth: 225,
-                marginBottom: 16,
-                overflowX: 'hidden'
-              }}
-              // 留出与底部的距离
-              listHeight={treeMaxHeight - 20}
-              placeholder="请选择"
-              // 下拉框显示的内容对应的变量名
-              treeNodeLabelProp={'selectedFullDbName'}
-              treeDefaultExpandedKeys={this.defaultExpandedKeys}
-              treeExpandedKeys={treeExpandKeys}
-              value={selectedFullDbName}
-              onChange={(value, label, extra) => {
-                if (value == '全部') {
-                  this.stores.getTables().then(() => {
-                    this.stores.updateTablesAndSetDefault(true)
-                  })
-                } else {
-                  const parentData = extra.triggerNode.props
-                  const dsId = parentData.parentId
-                  const dsName = parentData.parentName
-                  // value=数据源名+数据库名
-                  const dbName = value.split('.')[1]
-  
-                  this.stores.updateSelectedFullName(value)
-                  this.stores
-                    .getTables({
-                      dsId: dsId,
-                      dataBaseName: dbName
-                    })
-                    .then(() => {
-                      this.stores.resetSelectedTables()
-                      this.stores.getFirstTableFields()
-                    })
-                  this.stores.updateDbInfo({
-                    dsId: dsId,
-                    dsName: dsName,
-                    dbName: dbName
-                  })
-                }
-              }}
-              onTreeExpand={(keys) => {
-                this.stores.updateTreeExpandedKeys(keys)
-              }}
-            >
-              {this.dbsTreeNode}
-            </TreeSelect>
-            <SearchInput
-              size={'small'}
-              placeholder="请输入表名搜索"
-              allowClear
-              onSearch={(text) => {
-                this.doSearch(text)
-              }}
-              onChange={(e) => {
-                const { value } = e.target
-                if (value.length == 0) {
-                  this.stores.resetSelectedTables()
-                }
-  
-                this.doSearch(value)
-              }}
-            />
-                      <div ref={this.leftTopDataListContainer} className={[styles.dataList]}>
-            <AutoSizer>
-              {({ height, width }) => {
-                return (
-                  <List
-                    className={[styles.autoHideScroller]}
-                    height={height}
-                    itemCount={this.getTableDS(selectedDbTables).length}
-                    itemSize={34}
-                    width={width}
-                  >
-                    {(item) => {
-                      // 第二个参数在这里没有实际用到，只是为了在selectedTableRow发生变化时触发mobx的渲染机制，切勿去掉
-                      return this.topRowRenderer(item, selectedTableRow)
-                    }}
-                  </List>
-                )
-              }}
-            </AutoSizer>
-          </div>
-        </div>
-        <span id="sqlIndexLeftResizeLine" className={[styles.resizableLine]}></span>
-        <div id="bottomDataList" className={[styles.bottomDataList]}>
-          <div className={[styles.innerTableContainer]}>
-            {/* <Spin spinning={tableFieldsLoading}> */}
-            <Table
-              showHeader={false}
-              pagination={false}
-              columns={this.fieldColumns}
-              dataSource={this.getFieldDS()}
-              onRow={this.handleFieldClickRow}
-              rowClassName={(record, index) => {
-                return fieldSelectedId == index ? styles.tableRowSelected : null
-              }}
-            />
-            {/* </Spin> */}
-          </div>
-        </div>
-      </div>
-    )
-  }
-}

src/pages/SqlIndex/SearchInput/SearchInput.jsx

@@ -1,13 +0,0 @@
-import React from 'react'
-import { Input } from 'antd'
-import { SearchOutlined } from '@ant-design/icons'
-import styles from './SearchInputStyle.less'
-
-// 自定义搜索图标的输入框，antd4自带的搜索框太难调样式
-export const SearchInput = (props) => {
-  return (
-    <div className={styles.rootContainer}>
-      <Input className={styles.container} {...props} suffix={<SearchOutlined />}></Input>
-    </div>
-  )
-}

src/pages/SqlIndex/SearchInput/SearchInputStyle.less

@@ -1,33 +0,0 @@
-.rootContainer {
-
-    :global {
-        .ant-input-suffix {
-            display: inline-flex;
-            position: absolute;
-            right: 10px;
-        }
-
-        // 覆盖输入框宽度样式，默认是100%
-        .ant-input-group-wrapper {
-            width: auto;
-        }
-
-        & .ant-input-affix-wrapper {
-            width: auto;
-            white-space: nowrap;
-        }
-
-        .anticon-search {
-            cursor: pointer;
-        }
-
-    }
-
-    .container {
-        display: flex;
-        height: 32px;
-        margin: 10px 16px;
-        position: relative;
-        align-items: center;
-    }
-}

src/pages/SqlIndex/SqlEditor/ButtonWithIcon.jsx

@@ -1,36 +0,0 @@
-import React, { Component } from 'react'
-import { Button } from 'antd'
-import styles from './style.less'
-
-export default class ButtonWithIcon extends Component {
-  constructor(props) {
-    super(props)
-    this.state = {
-      formatBtnIconType: this.props.normalicontype
-    }
-  }
-
-  render() {
-    const { formatBtnIconType } = this.state
-
-    return (
-      <Button
-        className={styles.sqlButton}
-        type="default"
-        onMouseEnter={() => {
-          this.setState({
-            formatBtnIconType: this.props.hovericontype
-          })
-        }}
-        onMouseLeave={() => {
-          this.setState({
-            formatBtnIconType: this.props.normalicontype
-          })
-        }}
-        {...this.props}
-      >
-        {this.props.children}
-      </Button>
-    )
-  }
-}

src/pages/SqlIndex/SqlEditor/style.less

@@ -1,167 +0,0 @@
-.rootContainer {
-    height: 100%;
-
-    // 父容器是display: flex
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-
-    .nameBar {
-        width: 100%;
-        height: 40px;
-
-        background: #fafbfc;
-
-        // .content {
-        //     vertical-align: middle;
-        //     display: inline-block;
-        //     line-height: 40px;
-
-        //     margin-left: 10px;
-
-        //     width: 300px;
-            
-        //     white-space: nowrap;
-        //     text-overflow: ellipsis;
-        //     overflow: hidden;
-        // }
-    }
-
-    .operationBar {
-        width: 100%;
-        height: 52px;
-
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-
-        .leftIcons {
-            height: 100%;
-
-            padding-top: 12px;
-            padding-bottom: 12px;
-            margin-left: 16px;
-
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-
-            & :not(:first-child) {
-                margin-left: 8px;
-            }
-
-            .sqlButton {
-                transition: all 0.3s;
-                height: 28px;
-
-                &:hover {
-                    opacity: 0.7;
-                }
-            }
-
-            .sqlRunningButton {
-                background-color: white;
-                border-color: red;
-                color: red;
-            }
-
-            .iconContainer {
-                margin-left: 20px;
-                cursor: pointer;
-                transform: scale(1.1);
-
-                &:hover {
-                    opacity: 0.8;
-                }
-
-                .text {
-                    margin-left: 3px;
-                    color: #5a89cf;
-                }
-            }
-        }
-
-        .innerRight {
-            display: flex;
-            flex-direction: row-reverse;
-            margin-right: 16px;
-            width: 60%;
-
-            .seperator {
-                color: #e1e1e1;
-                margin: 0 8px;
-            }
-
-            .content {
-                margin-right: 0;
-                max-width: 70%;
-            }
-
-            .executeTime {
-                margin-right: 0;
-                white-space: nowrap;
-            }
-        }
-    }
-    
-    .editorContainer {
-        // SQL编辑器的右下角菜单使用了absolute，所以这里必须用relative
-        position: relative;
-        min-height: 50px;
-        margin: 16px;
-        margin-top: 0;
-        flex: 1;
-
-        :global {
-
-            // 覆盖sql编辑器默认样式
-            .monaco-editor,
-            .monaco-editor-background,
-            .monaco-editor .inputarea.ime-input,
-            .monaco-editor .margin {
-                background-color: #f8f8f8;
-            }
-
-            .decorationsOverviewRuler {
-                display: none
-            }
-        }
-    }
-
-    .hoverArea {
-        position: absolute;
-        bottom: 0;
-
-        width: 100%;
-        height: 30px;
-        display: flex;
-        flex-direction: column;
-        opacity: 0;
-        transition: all 0.3s;
-
-        .operationButton {
-            position: absolute;
-            width: 64px;
-            height: 20px;
-            bottom: 16px;
-            left: 50%;
-            transform: translateX(-50%);
-
-            display: flex;
-            justify-content: center;
-            align-items: center;
-
-            background-color: #EAEDF0;
-            border-radius: 4px;
-
-            &:hover {
-                cursor: pointer;
-            }
-        }
-
-        &:hover {
-            opacity: 1;
-        }
-    }
-
-}

src/pages/SqlIndex/SqlEditor/view.jsx

@@ -1,558 +0,0 @@
-import React, { Component } from 'react'
-import { message, Button, Col, Row, Input, Modal, Tooltip } from 'antd'
-import { inject, observer } from 'mobx-react'
-import { Editor, CompletionItemKind } from 'bravo-editor'
-import styles from './style.less'
-import { isEmpty, debounce } from 'lodash'
-import { computed } from 'mobx'
-import ButtonWithIcon from './ButtonWithIcon'
-import SqlIndexMod from '../SqlIndexMod'
-import { UpOutlined, } from '@ant-design/icons'
-import { format } from 'sql-formatter';
-const { confirm } = Modal
-let sqlResultCache = {} //对sql请求的结果进行缓存，防止频发请求
-
-// 在视图注入module层数据
-
-// 将组件设置为响应式组件，成为观察者，以便响应被观察数据的变化
-@observer
-class SqlEditorTabs extends Component {
-  constructor(props, context) {
-    super(props, context)
-    this.stores = SqlIndexMod
-    this.rootContainerRef = React.createRef()
-    this.editorRef = React.createRef()
-    this.hoverAreaRef = React.createRef()
-
-    this.state = {
-      isVerticalExpanded: false,
-      isShowSqlFileSaveModel: false,
-      maxExpandHeightOfEditor: props.maxExpandHeightOfEditor,
-      useStandardFormat: false
-    }
-  }
-
-  oldActiveTabKey = ''
-
-  componentDidMount() {
-    /**
-     * bravo-editor（版本1.3.11）源码中useStandardFormat为false时，getSelections()不会返回选中的内容。
-     * 不能初始化useStandardFormat为true，因为那样会导致handleFormat的格式化功能失效。
-     * 如果在编辑器实例化（渲染）完成后修改它的useStandardFormat属性，使其可以返回选中内容。
-     *
-     * useStandardFormat为true的情况下，不能直接使用默认的handleFormat()，因为此时在有选中内容的情况下可能产生问题
-     * 所以，格式化时需要调用editor.getAction('editor.action.formatDocument').run()对全量内容进行格式化
-     */
-    this.setState({
-      useStandardFormat: true
-    })
-
-    this.editorContainer = document.getElementById('sqlEditor')
-    this.editorContainer.addEventListener('mousedown', this.handleEditorMouseDown)
-
-    this.editorContainer.addEventListener('keyup', (e) => {
-      this.debounceCheckCursorPosAndShowButton()
-    })
-
-    this.hoverAreaRef.current.addEventListener('mouseenter', this.handleHoverAreaMouseEnter)
-    this.hoverAreaRef.current.addEventListener('mouseleave', this.handleHoverAreaMouseLeave)
-  }
-
-  handleHoverAreaMouseEnter = () => {
-    this.showHoverArea()
-  }
-
-  showHoverArea = () => {
-    this.hoverAreaRef.current.style.opacity = 1
-  }
-
-  handleHoverAreaMouseLeave = () => {
-    this.hideHoverArea()
-  }
-
-  hideHoverArea = () => {
-    this.hoverAreaRef.current.style.opacity = 0
-  }
-  componentWillUnmount() {
-    this.editorContainer.removeEventListener('mousedown', this.handleEditorMouseDown)
-    this.hoverAreaRef.current.removeEventListener('mouseenter', this.handleHoverAreaMouseEnter)
-    this.hoverAreaRef.current.addEventListener('mouseleave', this.handleHoverAreaMouseLeave)
-  }
-
-  componentWillReceiveProps(nextProps) {
-    const { maxExpandHeightOfEditor } = this.state
-    const newMaxHeight = nextProps.maxExpandHeightOfEditor
-    if (newMaxHeight != maxExpandHeightOfEditor) {
-      this.setState({
-        maxExpandHeightOfEditor: newMaxHeight
-      })
-
-      this.checkVerticalExpandState(newMaxHeight)
-    }
-  }
-
-  checkVerticalExpandState(maxHeight) {
-    const { maxExpandHeightOfEditor, isVerticalExpanded } = this.state
-    const newMaxHeight = maxHeight || maxExpandHeightOfEditor
-
-    if (!isVerticalExpanded && this.rootHeight >= newMaxHeight) {
-      this.setState({
-        isVerticalExpanded: true
-      })
-    } else if (isVerticalExpanded && this.rootHeight < newMaxHeight) {
-      this.setState({
-        isVerticalExpanded: false
-      })
-    }
-  }
-
-  componentWillUpdate() {
-    if (this.oldActiveTabKey != this.stores.activeTabKey) {
-      this.oldActiveTabKey = this.stores.activeTabKey
-      sqlResultCache = {}
-    }
-  }
-
-  rootHeight = 0
-  editorHeight = 0
-  componentDidUpdate() {
-    this.editorHeight = 200
-    // this.editorHeight = this.editorContainer.getElementsByClassName('dt-monaco-editor')[0].clientHeight
-    this.rootHeight = this.rootContainerRef.current.clientHeight
-
-    this.checkVerticalExpandState()
-  }
-
-  /**
-   * 这里必须使用箭头函数来保证this的正确性
-   */
-  updateSelectedTextAfterMouseUp = () => {
-    document.removeEventListener('mouseup', this.updateSelectedTextAfterMouseUp)
-
-    const selectedText = this.editorRef.current.editorRef.getSelections().selectionText
-    if (selectedText != this.selectedTextInEditor) {
-      this.selectedTextInEditor = selectedText
-    }
-
-    this.debounceCheckCursorPosAndShowButton()
-  }
-
-  handleEditorMouseDown = (e) => {
-    document.addEventListener('mouseup', this.updateSelectedTextAfterMouseUp)
-  }
-
-  @computed get completionTables() {
-    const { dsId, dbName } = this.stores.curActiveTab.dbInfo
-    const tables = this.stores.getTablesInSilence({ dsId: dsId, dataBaseName: dbName })
-
-    return tables.map((value) => {
-      return value.tableName
-    })
-  }
-  /**
- * 延时触发保存
- */
-  debounceUpdateSqlEditorContent = debounce(this.updateSqlEditorContent, 300)
-
-  updateSqlEditorContent(editValue) {
-    this.stores.updateSqlEditorValue(editValue)
-  }
-
-  /**
-   * 延时触发光标位置检查
-   */
-  debounceCheckCursorPosAndShowButton = debounce(this.checkCursorPosAndShowButton, 300)
-
-  /**
-   * 根据光标距离编辑器底部的距离来展示折叠/展开的按钮
-   */
-  checkCursorPosAndShowButton() {
-    if (this.state.isVerticalExpanded) {
-      this.hoverAreaRef.current.style.opacity = 0
-      return
-    }
-
-    const currentLines = this.editorContainer.getElementsByClassName('current-line')
-
-    if (currentLines && currentLines.length > 0) {
-      // 光标所在位置距离顶部的距离
-      const cursorPosY = currentLines[0].getBoundingClientRect().top
-      if (cursorPosY - this.editorHeight > 110) {
-        this.hoverAreaRef.current.style.opacity = 1
-      } else {
-        this.hoverAreaRef.current.style.opacity = 0
-      }
-    }
-  }
-  renderSqlEdit() {
-    const { useStandardFormat } = this.state
-    const { data, dbInfo } = this.stores.curActiveTab
-    const types = {
-      SAMPLE_TYPE_ONE: {
-        text: '样例类型1',
-        kind: CompletionItemKind.Method
-      },
-      SAMPLE_TYPE_TWO: {
-        text: '样例类型2',
-        kind: CompletionItemKind.Method
-      },
-      KEYWORD: {
-        text: '关键词',
-        kind: CompletionItemKind.Keyword
-      },
-      CONSTS: {
-        text: '常量',
-        kind: CompletionItemKind.Snippet
-      },
-      FUNCTION: {
-        text: '函数',
-        kind: CompletionItemKind.Function
-      },
-      TABLE: {
-        text: '表名',
-        kind: CompletionItemKind.Method
-      },
-      TABLEALIAS: {
-        text: '表别名',
-        kind: CompletionItemKind.Method
-      },
-      FIELD: {
-        text: '表字段',
-        kind: CompletionItemKind.Field
-      },
-      FIELDALIAS: {
-        text: '表字段别名',
-        kind: CompletionItemKind.Field
-      },
-      SNIPPET: {
-        text: '代码块',
-        kind: CompletionItemKind.Snippet
-      },
-      STREAM_FUNCTION: {
-        text: '函数',
-        kind: CompletionItemKind.Function
-      },
-      STREAM_TABLE_FIELD: {
-        text: '表字段',
-        kind: CompletionItemKind.Field
-      }
-    }
-    // 编辑器配置
-    const editorOpts = {
-      operation: false,
-      readOnly: false,
-
-      // onFormat是在默认格式化执行完成后，对编辑框内的所有内容进行二次处理
-      // onFormat: (value) => {
-      // },
-      onChange: (val) => {
-        this.debounceUpdateSqlEditorContent(val)
-
-        // 只要编辑了内容就清除选中文本（很多时候鼠标选中内容是为了直接删掉并编辑新的内容）
-        this.selectedTextInEditor = ''
-      },
-      options: {
-        theme: `white`,
-        language: 'sql',
-        value: data ? data.value : '',
-        useStandardFormat: useStandardFormat,
-        // formatOnPaste: true,
-      },
-      completionTypes: types,
-      sorter: (type) => {
-        switch (type) {
-          case 'TABLEALIAS':
-          case 'TABLE':
-            return 'c'
-          case 'FIELD':
-          case 'FIELDALIAS':
-            return 'd'
-          case 'KEYWORD':
-          case 'CONSTS':
-            return 'e'
-          case 'FUNCTION':
-            return 'f'
-          case 'BIZ_MODULE':
-            return 'g'
-        }
-      },
-      // 智能提示表名
-      onSuggestTables: (keyword, options) => {
-        /**
-         * 因为同一个tab中，数据源和数据库都是固定的，所以表名列表也是固定的
-         */
-        // completionTables只是一个表名的数组
-        const entities = this.completionTables.map((value) => {
-          const item = {}
-          item.label = value
-          item.insertText = value
-          item.type = 'TABLE'
-          item.kind = CompletionItemKind.Method
-          item.sortText = 'a'
-          return item
-        })
-        // sqlResultCache[dbInfo.dsId + '_table_' + keyword] = entities
-
-        return entities
-      },
-      // 智能提示字段名
-      onSuggestFields: (keyword, options) => {
-        keyword = keyword.replace('.', '')
-        if (sqlResultCache && sqlResultCache[dbInfo.dsId + '_fields_' + keyword]) {
-          return sqlResultCache[dbInfo.dsId + '_fields_' + keyword]
-        }
-
-        return this.stores
-          .getFieldsInSilence({
-            dsId: dbInfo.dsId,
-            dataBaseName: dbInfo.dbName,
-            tableName: keyword
-          })
-          .then((curTableFields) => {
-            if (curTableFields) {
-              // 子项的结构： {columnName: string, columnType: string, columnRemarks: string}
-              const entities = curTableFields.map((value) => {
-                const item = {}
-                item.label = `${value.columnName}  ${value.columnRemarks}`
-                item.insertText = value.columnName
-                item.type = 'FIELD'
-                item.kind = CompletionItemKind.Field
-                item.sortText = 'b'
-                return item
-              })
-
-              sqlResultCache[dbInfo.dsId + '_fields_' + keyword] = entities
-              return entities
-            } else {
-              return []
-            }
-          })
-      }
-    }
-
-    return <Editor ref={this.editorRef} {...editorOpts} />
-  }
-  /**
- * 执行sql语句, 默认查第一页
- * @param {*} dbInfo 数据库信息
- * @param {*} sql sql语句
- * @param {*} page 查询的页码
- */
-  executeSql = (dbInfo, sql = null, page = 1) => {
-    const { executingSql } = this.stores.curActiveTab
-
-    let dbInfo_ = dbInfo
-    if (isEmpty(dbInfo)) {
-      dbInfo_ = this.stores.curActiveTab.dbInfo
-    }
-
-    // 没有传入sql则默认使用之前执行过的语句
-    let sqlStr = sql
-    if (!sqlStr) {
-      sqlStr = executingSql
-    }
-
-    if (!sqlStr) {
-      message.warn('请输入sql语句')
-      return
-    }
-    this.stores.getSqlKeyAndExecute({
-      dataSourceId: dbInfo_.dsId,
-      dataBaseName: dbInfo_.dbName,
-      sql: sqlStr,
-      pageNum: page,
-      pageSize: 10
-    })
-  }
-
-  // inputSqlFileName = ''
-
-  render() {
-    const { isVerticalExpanded, isShowSqlFileSaveModel } = this.state
-    const { data, dbInfo, executingSqlKey } = this.stores.curActiveTab
-    const { curTabSqlLoading } = this.stores
-    const tooltipVar = '{city_name}' //tooltip中变量的对应字符串，防止转义
-    const scoreVar = '{score}'
-    const idVar = '{id}'
-    const aidVar = '{aid}'
-    const anameVar = '{aname}'
-    return (
-      <div ref={this.rootContainerRef} className={styles.rootContainer}>
-        <div className={styles.operationBar}>
-          <div className={styles.leftIcons}>
-            <Button
-              // loading={curTabSqlLoading}
-              type={curTabSqlLoading ? 'danger' : 'primary'}
-              onClick={() => {
-                if (curTabSqlLoading) {
-                  this.stores.cancelExecuteSql(executingSqlKey)
-                } else {
-                  const editValue = data.value.trim()
-                  if (!(dbInfo && dbInfo.dsId)) {
-                    message.error('请选择数据源')
-                    return
-                  }
-
-                  if (editValue.length == 0) {
-                    message.error('请输入SQL内容')
-                    return
-                  }
-
-                  this.executeSql(dbInfo, this.selectedTextInEditor ? this.selectedTextInEditor : editValue)
-                }
-              }}
-            >
-              {curTabSqlLoading ? '暂停' : '运行'}
-            </Button>
-            <ButtonWithIcon
-              onClick={() => {
-                const editorRef_s = this.editorRef.current.editorRef.editor;
-                editorRef_s.setValue(
-                  format(editorRef_s.getValue(), {
-                    indentStyle: 'tabularLeft',
-                  }),
-                )
-              }}
-              normalicontype="geshihua"
-              hovericontype="geshihua-2"
-            >
-              格式化
-            </ButtonWithIcon>
-            <ButtonWithIcon
-              onClick={() => {
-                const editValue = data.value.trim()
-                if (editValue.length == 0) {
-                  message.error('请输入SQL内容')
-                  return
-                }
-
-                const activeTab = this.stores.curActiveTab
-                if (isEmpty(activeTab.dbInfo) || isEmpty(activeTab.dbInfo.dsId) || isEmpty(activeTab.dbInfo.dbName)) {
-                  message.error('请选择数据源')
-                  return
-                }
-
-                const { fileId, dbInfo, data: editorData, tabName } = this.stores.curActiveTab
-                if (fileId) {
-                  confirm({
-                    title: '确认保存文件吗？',
-                    content: `文件名：${tabName}`,
-                    okText: '确定',
-                    cancelText: '取消',
-                    onOk: () => {
-                      this.stores.modifyFile({
-                        id: fileId,
-                        dataBaseName: dbInfo.dbName,
-                        dataSourceId: dbInfo.dsId,
-                        sqlFileName: tabName,
-                        sqlContent: editorData.value
-                      })
-                    }
-                  })
-
-                  return
-                }
-
-                this.setState({
-                  isShowSqlFileSaveModel: true
-                })
-              }}
-              normalicontype="baocun"
-              hovericontype="baocun-2"
-            >
-              保存
-            </ButtonWithIcon>
-          </div>
-          <div className={styles.innerRight}>
-            <span className={styles.executeTime}>执行时间：{data && data.time} s</span>
-            <span className={styles.seperator}>|</span>
-            <span className={styles.content}>
-              <Tooltip title={dbInfo && dbInfo.dsName ? `${dbInfo.dsName}.${dbInfo.dbName}` : ''}>
-                <span className="textEllipsis">
-                  {dbInfo && dbInfo.dsName ? `${dbInfo.dsName}.${dbInfo.dbName}` : ''}
-                </span>
-              </Tooltip>
-            </span>
-          </div>
-        </div>
-        <div id="sqlEditor" className={styles.editorContainer}>
-          {this.renderSqlEdit()}
-        </div>
-        <div ref={this.hoverAreaRef} className={styles.hoverArea}>
-          <div
-            className={styles.operationButton}
-            onClick={() => {
-              // 展开，收回
-              this.setState(
-                {
-                  isVerticalExpanded: !isVerticalExpanded
-                },
-                () => {
-                  this.props.onEditorExpand(this.state.isVerticalExpanded)
-                }
-              )
-            }}
-          >
-            <UpOutlined />
-          </div>
-        </div>
-        {/** 保存SQL文件弹窗 */}
-        <Modal
-          centered
-          destroyOnClose
-          title="保存SQL"
-          visible={isShowSqlFileSaveModel}
-          onOk={() => {
-            const fileName = this.inputSqlFileName.trim()
-            if (fileName.length == 0) {
-              message.error('请输入文件名')
-              return
-            }
-
-            this.setState({
-              isShowSqlFileSaveModel: false
-            })
-
-            // // 前面已经做过容错判断
-            const { dbInfo, data: editorData } = this.stores.curActiveTab
-            this.stores
-              .addFile({
-                dataBaseName: dbInfo.dbName,
-                dataSourceId: dbInfo.dsId,
-                sqlFileName: fileName,
-                sqlContent: editorData.value
-              })
-              .then((value) => {
-                this.stores.updateTabNameAndFileId(fileName, value)
-              })
-          }}
-          onCancel={() => {
-            this.setState({
-              isShowSqlFileSaveModel: false
-            })
-          }}
-        >
-          <div>
-            <Row type="flex" align="middle">
-              <Col span={3}>
-                <span>SQL名称: </span>
-              </Col>
-              <Col span={21}>
-                <Input
-                  allowClear
-                  placeholder="编写SQL名称"
-                  onChange={(e) => {
-                    this.inputSqlFileName = e.target.value
-                  }}
-                ></Input>
-              </Col>
-            </Row>
-          </div>
-        </Modal>
-      </div>
-    )
-  }
-}
-export default SqlEditorTabs
-
-

src/pages/SqlIndex/SqlEditorTabs/style.less

@@ -1,398 +0,0 @@
-@import url("../../../themes/themes.less");
-
-.subMenuPop {
-    ul {
-        max-height: 500px;
-        overflow: auto;
-    }
-}
-
-.sqlFilesModal {
-    padding: 0 !important;
-
-    :global {
-
-        .ant-modal-body,
-        .ant-popover-inner-content,
-        .ant-card-body {
-            padding: 0 !important;
-        }
-    }
-}
-
-// 隐藏tabs 显示title
-.pageTitle {
-    // .yx_yxFont_heading;
-    padding: 8 * @yx_yxHd 8 * @yx_yxHd @yx_yxHd 8 * @yx_yxHd;
-}
-
-//页签栏类型
-.yx_yxTabsbar_navigation {
-    .more {
-        color: @yx_yxColor_neutral_2;
-    }
-
-    //更多选项颜色
-    .leftBorderColor {
-        border-left: 1px @yx_yxColor_neutral_6 solid !important;
-    }
-
-    .backgrioundColor {
-        background-color: @yx_yxColor_neutral_8  !important;
-    }
-}
-
-//页签
-.yx_yxTabs_navigation {
-
-    //默认状态
-    .yx_yxTabs_navigation_normal {
-        .text {
-            // .yx_yxFont_base(inherit);
-        }
-
-        //文字类型
-        .textColor {
-            color: @yx_yxColor_neutral_3  !important;
-        }
-
-        //文字颜色
-        .closeColor {
-            color: @yx_yxColor_brand_10  !important;
-        }
-
-        //关闭图标颜色
-        .rightBorderColor {
-            // border-right: 1px @yx_yxColor_neutral_6 solid !important;
-        }
-
-        .tabsLeftLine {
-            &:before {
-                content: "";
-                background-color: @yx_yxColor_neutral_6;
-                width: 1px;
-                height: 16px;
-                display: block;
-                margin-left: -16px;
-                margin-top: 10px;
-                float: left;
-            }
-
-            &:after {
-                content: "";
-                margin-top: -3px;
-            }
-        }
-
-        //右侧隔线颜色
-        .backgrioundCOlor {
-            background-color: @yx_yxColor_neutral_9  !important;
-        }
-
-        //小圆圈边框颜色
-        .tipsBorder {
-            border: 1px @yx_yxColor_brand_9 solid !important;
-        }
-
-        //背景颜色
-        .tipsBackgroundColor {
-            background-color: @yx_yxColor_neutral_8  !important;
-        }
-
-        //小圆圈背景颜色
-    }
-    
-    //鼠标移过
-    .yx_yxTabs_navigation_hover {
-        .textColor {
-            color: @yx_yxColor_neutral_1  !important;
-        }
-
-        //文字类型
-        .closeColor {
-            color: @yx_yxColor_brand_2  !important;
-        }
-
-        //小圆圈边框颜色
-        .tipsBorder {
-            border: 1px @yx_yxColor_brand_10 solid !important;
-        }
-
-        //关闭图标颜色
-    }
-
-    .yx_yxTabs_navigation_press {
-        .closeColor {
-            color: @yx_yxColor_brand_1  !important;
-        }
-
-        //关闭图标颜色
-    }
-
-    //选中状态
-    .yx_yxTabs_navigation_selected {
-        .text {
-            // .yx_yxFont_subhead(inherit);
-        }
-
-        //文字类型
-        .textColor {
-            color: @yx_yxColor_neutral_1  !important;
-        }
-
-        //文字颜色
-        .tipsBackgroundColor {
-            background-color: @yx_yxColor_brand_1  !important;
-        }
-
-        //文字类型
-        .closeColor {
-            color: @yx_yxColor_brand_2  !important;
-        }
-
-        //小圆圈背景颜色
-        .yuanBg {
-            background-color: @yx_yxColor_brand_1  !important;
-        }
-
-        //小圆圈边框颜色
-        .tipsBorder {
-            border: 1px @yx_yxColor_brand_1 solid !important;
-        }
-
-        .backgroundColor {
-            background-color: #fff !important;
-        }
-    }
-}
-
-//页签大小
-.yx_yxTabs_size_navigation {
-    height: 18 * @yx_yxHd;
-    line-height: 18 * @yx_yxHd;
-    padding-left: 8 * @yx_yxHd;
-    padding-right: 8 * @yx_yxHd;
-}
-.router-tabs {
-
-    .clickableIcon {
-        cursor: pointer;
-        padding: 10px;
-
-        :hover {
-            opacity: 0.8 !important;
-        }
-    }
-
-    // .yx_yxShadow_down;
-    // border-bottom  : 1px @yx_yxColor_neutral_6 solid;
-    user-select: none;
-    display: flex;
-    justify-content: space-between;
-    transition: all 0.3s;
-    position: relative;
-    z-index: 10;
-    padding: 0 !important;
-
-    >div>div {
-        padding: 0 !important;
-    }
-
-    .yx_yxTabs_size_navigation;
-    .yx_yxTabsbar_navigation.backgrioundColor;
-    .yx_yxTabsbar_navigation.leftBorderColor;
-
-    :global {
-        .ant-tag {
-            background: none;
-            transition: none;
-        }
-    }
-    .tag {
-        // border-bottom: 1px @yx_yxColor_neutral_5 solid;
-        .yx_yxTabs_size_navigation;
-        .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.rightBorderColor;
-        .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.tabsLeftLine;
-        .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.text;
-        .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.textColor;
-        .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.backgrioundCOlor;
-        border: 0;
-        border-radius: 0;
-        cursor: pointer;
-        margin: 0;
-        padding-top: 4px;
-
-        span:not(span[role="img"]) {
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.tipsBorder;
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.backgrioundCOlor;
-        }
-
-        &:hover {
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_hover.textColor;
-
-            span:not(span[role="img"]) {
-                .yx_yxTabs_navigation.yx_yxTabs_navigation_hover.tipsBorder;
-            }
-        }
-
-        .icon {
-            display: inline-block;
-            .yx_yxCircle_sm;
-            margin-right: 4 * @yx_yxHd;
-            border-radius: 50%;
-            border-color: @yx_yxColor_brand_9;
-            background-color: @yx_yxColor_neutral_8;
-        }
-
-        span[role="img"] {
-            margin-left: 8 * @yx_yxHd;
-            font-size: 10px;
-            position: relative;
-            // top        : 2px;
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.closeColor;
-
-            &:hover {
-                .yx_yxTabs_navigation.yx_yxTabs_navigation_hover.closeColor;
-            }
-
-            &:active {
-                .yx_yxTabs_navigation.yx_yxTabs_navigation_press.closeColor;
-            }
-        }
-        
-        background-position: -120px -3px;
-
-        &.active {
-            &+.tag {
-                &:before {
-                    background-color: #fff;
-                }
-            }
-
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_selected.text;
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_selected.textColor;
-            // .yx_yxTabs_navigation.yx_yxTabs_navigation_selected.backgroundColor;
-            border-bottom: 0;
-
-            &:before {
-                content: "";
-                margin-top: -3px;
-                width: 16px;
-                height: 36px;
-                // background-image: url("assets/imgs/tabsAction.png");
-                background-size: 134px;
-                background-position: -1px 0px;
-                background-color: #fff;
-            }
-
-            &:after {
-                content: "";
-                margin-top: -3px;
-                width: 16px;
-                height: 36px;
-                float: right;
-                margin-right: -16px;
-                background-size: 134px;
-                background-position: -117px 0px;
-                // background-image: url("assets/imgs/tabsAction.png");
-                background-color: #fff;
-            }
-
-            height: 36px; //覆盖外层阴影
-            // background-image: url("assets/imgs/tabsActionCenter.png");
-            background-size: 6px;
-            background-position: -120px -3px;
-            background-repeat: repeat-x;
-
-            .icon {
-                .yx_yxTabs_navigation.yx_yxTabs_navigation_selected.yuanBg;
-                .yx_yxTabs_navigation.yx_yxTabs_navigation_selected.tipsBorder;
-            }
-        }
-
-        &[ant-click-animating-without-extra-node="true"] {
-            position: static;
-            transition: none;
-
-            &:after {
-                position: static;
-                opacity: 1;
-                transition: none;
-                animation: none;
-            }
-        }
-    }
-
-    >div:nth-child(2) {
-        width: 40px !important;
-        border-top: 0 !important;
-        line-height: 0 !important;
-        padding: 0 !important;
-    }
-    
-    :global {
-        .close-box {
-            // 固定宽度，避免被flex挤压
-            width: 39px;
-
-            border-left: 1px solid @yx_yxColor_brand_9;
-            border-bottom: 3px #f3f4f6 solid;
-            height: 39px;
-        }
-
-        .ant-dropdown-trigger {
-            background-color: #fff !important;
-            width: 100%;
-            height: 100%;
-            cursor: pointer;
-            position: relative;
-
-            &:hover {
-                .icon {
-                    border-color: @yx_yxColor_brand_10;
-                }
-
-                span[role="img"] {
-                    color: @yx_yxColor_brand_2;
-                }
-            }
-
-            span[role="img"] {
-                color: @yx_yxColor_brand_10  !important;
-            }
-        }
-    }
-}
-
-:global {
-
-    .close-box-mune,
-    .close-box-sub-menu {
-
-        .ant-dropdown-menu-item:hover,
-        .ant-dropdown-menu-submenu-title:hover {
-            background-color: #fff;
-            color: @yx_yxColor_brand_1;
-
-            span[role="img"] {
-                color: @yx_yxColor_brand_1;
-            }
-        }
-    }
-    
-    .close-icon {
-        margin-left: 8 * @yx_yxHd;
-        font-size: 10px;
-        position: relative;
-        // top        : 2px;
-        .yx_yxTabs_navigation.yx_yxTabs_navigation_normal.closeColor;
-
-        &:hover {
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_hover.closeColor;
-        }
-
-        &:active {
-            .yx_yxTabs_navigation.yx_yxTabs_navigation_press.closeColor;
-        }
-    }
-}

src/pages/SqlIndex/SqlEditorTabs/view.jsx

@@ -1,341 +0,0 @@
-import React, { Component } from 'react'
-import { observer, inject } from 'mobx-react'
-import { checkIsIe10 } from "@utils/util";
-import { SnippetsOutlined, PlusOutlined, QuestionCircleOutlined, DeleteOutlined,DashOutlined } from '@ant-design/icons'
-import { Tag, Dropdown, Tooltip, Menu, Modal } from 'antd'
-import classNames from 'classnames'
-
-import styles from './style.less'
-import SqlIndexMod from '../SqlIndexMod'
-// import { YxAction, YxText } from 'yx-widget'
-import CubeI8N from '@utils/cubeI8N'
-import { autorun, computed } from 'mobx'
-
-import FilesPopUp from '../FilesPopUp/view'
-/**
- * 关联了sql编辑器与查询结果的tab菜单
- */
-// 在视图注入module层数据
-// 将组件设置为响应式组件，成为观察者，以便响应被观察数据的变化
-@observer
-export default class extends Component {
-  constructor(props) {
-    super(props)
-
-    this.tabsRef = React.createRef()
-    this.stores = SqlIndexMod
-    this.state = {
-      isShowFileListPanel: false
-    }
-
-    this.CubeI8N = new CubeI8N()
-  }
-
-  componentDidUpdate() {
-    this.scrollIntoTags(this.activeTabKey)
-  }
-
-  isLastTab(tabKey) {
-    return tabKey == this.stores.lastTabKey
-  }
-
-  @computed get activeTabKey() {
-    return this.stores.activeTabKey
-  }
-
-  scrollIntoTags(tabKey) {
-    let dom
-    try {
-      if (this.isLastTab(tabKey)) {
-        dom = this.tabsRef.current.querySelector(`[id="iconAdd"]`)
-      } else {
-        dom = this.tabsRef.current.querySelector(`[data-key="${tabKey}"]`)
-      }
-
-      if (dom === null) {
-        // 菜单 还没有加入 导航条(横)
-      } else {
-        // 菜单 已经加入 导航条(横)
-        dom.scrollIntoView(false)
-      }
-    } catch (e) {
-      console.error(e)
-    }
-  }
-
-  /**
-   * 点击加号新增标签
-   * @param {*} e
-   * @returns
-   */
-  handleAdd = (e) => {
-    if (e && e.target.tagName.toLowerCase() === 'i') {
-      return
-    }
-
-    if (e) {
-      // 阻止事件冒泡
-      e.stopPropagation()
-      e.nativeEvent.stopImmediatePropagation()
-    }
-
-    this.stores.addNewEmptyTab()
-  }
-
-  handleClose = (e, tabKey) => {
-    if (e) {
-      // 阻止事件冒泡
-      e.stopPropagation()
-      e.nativeEvent.stopImmediatePropagation()
-    }
-
-    this.stores.closeEditorTab(tabKey).then((value) => {
-      this.stores.updateTablesAndSetDefault()
-    })
-  }
-
-  handleClickTag = (tabKey, e) => {
-    if (e && e.target.tagName.toLowerCase() === 'i') {
-      return
-    }
-
-    const { tabKey: activeTabKey } = this.stores.curActiveTab
-    if (tabKey !== activeTabKey) {
-      this.stores
-        .updateState({
-          activeTabKey: tabKey
-        })
-        .then((value) => {
-          this.stores.updateTablesAndSetDefault()
-        })
-    }
-  }
-
-  /**
-   * 右侧的【···】菜单
-   * @param {*} e
-   * @returns
-   */
-  handleMenuClick = (e) => {
-    const eKey = e.key
-
-    if (0 === this.stores.tabsLength) {
-      return false
-    }
-
-    // 关闭其它
-    if (eKey === '1') {
-      this.stores.closeOtherEditorTabs(this.stores.curActiveTab.tabKey)
-    } else {
-      this.handleClickTag(eKey)
-      return
-    }
-  }
-
-  maxTabNameLength = 20
-
-  /**
-   *
-   * @param {*} tabKey
-   * @param {*} activeTabKey 当前活动页面标题
-   * @param {*} tabName 要渲染的页面标题
-   * @returns
-   */
-  renderTag = (tabKey, activeTabKey, tabName, len) => {
-    const isLongTag = tabName.length > this.maxTabNameLength
-    const iconParam = {
-      className: 'close-icon',
-      type: 'iconguanbi',
-      iconfont: true,
-      onClick: (e) => this.handleClose(e, tabKey)
-    }
-    const DOM = (
-      <Tag
-        key={tabKey}
-        data-key={tabKey}
-        className={classNames(styles.tag, {
-          [styles.active]: tabKey == activeTabKey
-        })}
-        onClick={(e) => this.handleClickTag(tabKey, e)}
-      >
-        <span className={styles.icon} />
-        {isLongTag ? `${tabName.slice(0, this.maxTabNameLength)}...` : tabName}
-        {len == 1 ? <span style={{ width: '4px', display: 'inline-block', opacity: '0' }}></span> : ''}
-        {/* 设计特殊要求当一个时候加宽 */}
-        {len > 1 && <DeleteOutlined className="close-icon"
-          onClick={(e) => {
-            this.handleClose(e, tabKey)
-          }}
-        />}
-      </Tag>
-    )
-    return DOM
-  }
-  supportFuncs = (
-    <span>
-      1、编辑器支持函数如下：
-      <br />
-      聚合函数：AVG、COUNT、MAX、MIN、SUM。
-      <br />
-      内置时间函数：DAY、MDY、MONTH、WEEKDAY、YEAR、CURRENT、EXTEND。
-      <br />
-      字符串操作函数：LOWER、UPPER、INITCAP、REPLACE、SUBSTR、SUBSTRING、LPAD、RPAD。
-      <br />
-      2、使用数据查询功能时,尽量在sql后面添加: limit 限定查询量,方便快速返回数据。
-      <br />
-      3、使用下载功能时,sql不需要添加 limit 限定条件。系统默认最多返回的30万的下载数据。
-      <br /> 
-      4、sql附带注释说明的注释 -- 符号前需要保持空格。
-      <br />
-      5、遇到超时或者内存不足的查询结果返回时,请加 limit 限定条件,并低频重试几次。
-    </span>
-  )
-
-  render() {
-    const { editorTabs, activeTabKey } = this.stores.state
-    const { isShowFileListPanel } = this.state
-
-    const cls = classNames(styles['router-tabs'])
-    const isIe10 = checkIsIe10()
-    const len = this.stores.tabsLength
-
-    const tags = editorTabs.map((item, index) => {
-      if (!item) {
-        console.error('your page has incorrect syntax！')
-        return <span>&nbsp;</span>
-      }
-      const { tabKey, tabName } = item
-      const isLongTag = tabName.length > this.maxTabNameLength
-      const tagElem = this.renderTag(tabKey, activeTabKey, tabName, len)
-      return isLongTag ? (
-        <Tooltip title={tabName} key={`tooltip_${tabKey}`}>
-          {tagElem}
-        </Tooltip>
-      ) : (
-        tagElem
-      )
-    })
-
-    /* eslint-disable */
-    return (
-      <div
-        className={cls}
-        style={{
-          width: '100%'
-        }}
-      >
-        <div
-          style={{
-            flex: '1',
-            height: '39px',
-            position: 'relative',
-            overflow: 'hidden',
-            padding: '0px 0px',
-            borderBottom: '3px #f3f4f6 solid'
-          }}
-        >
-          <div
-            ref={this.tabsRef}
-            style={{
-              position: `${isIe10 ? 'inline-block' : 'absolute'}`,
-              whiteSpace: 'nowrap',
-              marginRight: `${isIe10 ? '-3px' : 0}`,
-              width: '100%',
-              top: '0px',
-              padding: '0px 10px 0px 10px',
-              overflowX: 'auto',
-              overflowY: 'hidden',
-              clear: 'both'
-            }}
-          >
-            {tags}
-            {
-              <PlusOutlined
-                id="iconAdd"
-                onClick={(e) => {
-                  this.handleAdd(e)
-                }}
-              />
-            }
-          </div>
-        </div>
-        {this.props.children}
-        <Tooltip placement="leftTop" title={this.supportFuncs}>
-          <QuestionCircleOutlined className={styles.clickableIcon} />
-        </Tooltip>
-        <Tooltip title="SQL文件">
-          <SnippetsOutlined  className={styles.clickableIcon}
-            onClick={(e) => {
-              this.setState({
-                isShowFileListPanel: true
-              })
-            }}
-          />
-        </Tooltip>
-        <div className="close-box">
-          <Dropdown
-            overlayClassName={styles.subMenuPop}
-            overlay={
-              <Menu
-                onClick={(e) => {
-                  this.handleMenuClick(e)
-                }}
-                className={`close-box-mune`}
-              >
-                <Menu.Item key="1">{this.CubeI8N.getString('basic.code-002')}</Menu.Item>
-                {tags.map((item) => (
-                  <Menu.Item key={item.key}>{item.props.children}</Menu.Item>
-                ))}
-              </Menu>
-            }
-          >
-            <DashOutlined />
-          </Dropdown>
-        </div>
-
-        {/* 文件列表弹窗 */}
-        <Modal
-          className={styles.sqlFilesModal}
-          visible={isShowFileListPanel}
-          style={{
-            position: 'absolute',
-            top: '130px',
-            right: '8px'
-          }}
-          footer={null}
-          closable={false}
-          mask={false}
-          width={FilesPopUp.fixWidth}
-          destroyOnClose
-          onCancel={() => {
-            this.setState({
-              isShowFileListPanel: false
-            })
-          }}
-        >
-          <FilesPopUp
-            onFileSelect={(data) => {
-              const tabInfo = {
-                tabKey: data.sqlFileName,
-                tabName: data.sqlFileName,
-                fileId: data.id,
-                data: {
-                  value: data.sqlContent,
-                  time: 0
-                },
-                dbInfo: {
-                  dsId: data.dataSourceId,
-                  dsName: data.dataSourceName,
-                  dbName: data.dataBaseName
-                }
-              }
-
-              this.stores.checkExistAndAddTab(data.sqlFileName, tabInfo)
-            }}
-          ></FilesPopUp>
-        </Modal>
-      </div>
-    )
-  }
-}
-

src/pages/SqlIndex/SqlIndexServ.js

@@ -1,193 +0,0 @@
-import request from '@utils/request'
-import { CancelToken } from 'axios'
-
-export default class {
-  /**
-   * 查询用户拥有的所有数据源、数据库、数据表的所有信息
-   */
-  static getAllDsAndDbsAndTables() {
-    return request({
-      url: 'api/os/datasource/sqlData/listDsAndDbTables',
-      method: 'post',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 查询当前用户所拥有的数据源-数据库列表
-   */
-  static getAllDsAndDbs() {
-    return request({
-      url: 'sqlData/listDsAndDbs',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 查询当前用户某个 数据源 某个库 拥有权限的表列表
-   * dsId 数据源Id，dataBaseName 数据库名
-   * @param {{dsId: number, dataBaseName: string}} params
-   */
-  static getTables(params) {
-    return request({
-      url: 'sqlData/listTables',
-      method: 'GET',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 查询当前用户 某个数据源 某个库 某个表 的字段列表
-   * dsId 数据源Id，dataBaseName 数据库名，tableName 表名
-   * @param {{dsId: number, dataBaseName: string, tableName: stirng}} params
-   */
-  static getFields(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/listColumns',
-      method: 'post',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 查询Sql文件列表
-   */
-  static getFileList(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/listSqlFilesByUserAccount',
-      method: 'GET',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  static addFile(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/addSqlFile',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 修改Sql文件
-   */
-  static modifyFile(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/modSqlFile',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 删除Sql文件
-   */
-  static deleteFile(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/deleteSqlFile?id=' + params.id,
-      method: 'post',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 获取执行sql语句的key
-   * 后端执行sql语句和中止sql语句需要根据key来确定对应关系
-   * @param {*} params
-   * @returns
-   */
-  static getSqlExecuteKey() {
-    return request({
-      url: 'api/os/datasource/sqlData/getExecuteSqlKey',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  static preCheckExportExcel(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/executeSql/preCheckExportExcel',
-      method: 'post',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  
-  /**
-   * 执行sql语句
-   */
-   static executeSql(params, extraData) {
-    params.pageSize = 200
-    return request({
-      url: 'api/os/datasource/sqlData/executeSql',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application',
-      extraData: extraData
-    })
-  }
-
-  /**
-   * 中止执行sql语句
-   * @param {{executeKey: string}} params
-   */
-  static cancelExecuteSql(params) {
-    return request({
-      url: 'api/os/datasource/sqlData/cancelExecute?executeKey=' + params.executeKey,
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
-   * 记录下载操作的日志
-   */
-  static recordLogOfDownload(params) {
-    const urls = params.type == "csv" ? 'api/os/datasource/sqlData/executeSql/exportCvs' : 'api/os/datasource/sqlData/executeSql/exportExcel';
-    delete params.type
-    return request({
-      url: urls,
-      method: 'POST',
-      responseType: 'arraybuffer',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-}
-

src/pages/SqlIndex/SqlIndexStyle.less

@@ -1,536 +0,0 @@
-@import url("../../themes/themes.less");
-
-
-:global {
-    #dy-table{
-        .ant-pagination-simple-pager{
-            display:none;
-        }
-    }
-    .ant-btn {
-        line-height: 1;
-    }
-
-    .ant-select-tree .ant-select-tree-treenode {
-        padding: 4px 0 4px;
-    }
-
-    .ant-select-tree .ant-select-tree-node-content-wrapper.ant-select-tree-node-selected {
-        background-color: rgba(24, 97, 242, 0.1);
-    }
-
-    .ant-select-tree .ant-select-tree-node-content-wrapper:hover {
-        background-color: rgba(24, 97, 242, 0.1);
-    }
-
-    // 下拉框样式
-    .ant-select-tree .ant-select-tree-node-content-wrapper {
-        text-overflow: ellipsis;
-        vertical-align: bottom;
-        overflow: hidden;
-    }
-
-    .ant-select-tree-list-holder {
-        overflow: auto !important;
-    }
-
-    .ant-select-tree-list-scrollbar-thumb {
-        display: none;
-    }
-
-    .ant-select-tree-node-content-wrapper {
-        overflow: hidden;
-    }
-}
-
-@globalStylesInResult: {
-    :global {
-
-        .ant-select-tree-list-holder {
-            overflow: auto !important;
-        }
-
-        //  .ant-select-tree-list-scrollbar-thumb {
-        //     display: none;
-        //     height: 0px;
-        //  }
-
-        .ant-select-tree-list-scrollbar,
-        .ant-select-tree-list-scrollbar-show {
-            display: none;
-
-        }
-
-        // 表格“暂无数据”的边框
-        .ant-table-placeholder {
-            border: none;
-        }
-
-        // 标题栏字段分割线
-        .ant-table-thead>tr>th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan]):before {
-            width: 0;
-        }
-
-        // 表格标题：“结果”
-        .ant-card-head {
-            padding: 0 19px;
-            font-weight: 700;
-            font-size: 14px;
-            min-height: 24px;
-            margin-bottom: 0;
-        }
-
-        .ant-card-head-title {
-            padding: 10px 0;
-        }
-
-        .ant-card-body {
-            padding: 0;
-            overflow: hidden;
-        }
-
-        .ant-card-extra {
-            padding: 0;
-        }
-
-        .ant-card-bordered {
-            border: none;
-            height: 100%;
-        }
-
-        // 默认隐藏滚动条
-        .ant-table-body {
-            overflow: auto !important;
-            border-bottom: 1px solid #ebebeb;
-        }
-
-        .ant-table.ant-table-bordered>.ant-table-container {
-            border-left: none;
-        }
-
-        .ant-table-thead>tr>th,
-        .ant-table-tbody>tr>td {
-            padding: 6px;
-            padding-left: 15px;
-        }
-
-        // 最后一列固定列的标题文本左对齐
-        .ant-table-fixed-right .ant-table-fixed .ant-table-thead th {
-            text-align: left !important;
-        }
-
-        // 页数指示器右边距
-        .ant-table-pagination.ant-pagination {
-            margin-right: 16px;
-        }
-    }
-}
-
-.show {
-    display: block;
-}
-
-.hide {
-    display: none;
-}
-
-.iconRightBottom {
-    position: absolute;
-    right: 30px;
-    bottom: 30px;
-}
-
-// 分割线宽度
-@splitLineWidth: 3px;
-// 右上角编辑器模块的高度
-@leftTopHeight: 355px;
-.sqlIndexView {
-    display: flex;
-    box-sizing: border-box;
-    border-radius: 4px;
-
-    .tableRowSelected {
-        background: #fbfbfc !important;
-        color: #5a89cf;
-
-        :global {
-            .ant-typography {
-                color: #5a89cf;
-            }
-        }
-
-        // 选中行时覆盖hover样式，才能在选中时马上切换样式
-        :hover {
-            background: #fbfbfc !important;
-        }
-    }
-
-    :global {
-
-        // 表格“暂无数据”的边框
-        .ant-table-placeholder {
-            border: none;
-        }
-
-        // table 调节单元格高度
-        .ant-table-tbody>tr>td,
-        .ant-table-thead>tr>th {
-            padding: 6px;
-
-            // 关闭动画
-            -webkit-transition: all 0s, border 0s;
-            transition: all 0s, border 0s;
-        }
-    }
-
-    .containerContent {
-        display: flex;
-        height: 32px;
-        margin: 10px 16px;
-        position: relative;
-
-    }
-    @leftContainerWidth: 245px;
-
-    .containerLeft {
-        width: @leftContainerWidth;
-        height: 100%;
-        background-color: white;
-        min-width: 200px;
-
-        :global {
-
-            // 覆盖输入框宽度样式，默认是100%
-            .ant-input-affix-wrapper {
-                width: auto;
-            }
-        }
-    }
-
-    .containerRight {
-        position: relative;
-        flex: 1;
-        height: 100%;
-        min-width: 400px;
-        display: flex;
-        flex-direction: column;
-        background-color: white;
-
-        .tabBar {
-            width: 100%;
-            height: 36px;
-
-            display: flex;
-            align-items: center;
-        }
-
-        .containerRightExceptTabbar {
-            flex: 1;
-
-            display: flex;
-            flex-direction: column;
-            overflow: hidden;
-
-            .containerSqlEditor {
-                flex: 1;
-                position: relative;
-                width: 100%;
-                // 40是tabbar高度，这里的高度是为了使左右两边的分割线对齐
-                height: calc(~'@{leftTopHeight} - 41px');
-
-                // sql编辑器有最小高度限制，这个是它的父容器，也要做限制，否则调节分割线时，超过sql编辑器的最小高度后会把内容挡住
-                min-height: 180px;
-
-                // 解决margin折叠导致容器整体下移的问题，两种方式均可
-                // border-top: 1px solid transparent;
-                // display: inline-block;
-                display: flex;
-                flex-direction: column;
-
-                :global {
-                    .ant-empty .ant-empty-normal {
-                        margin: 0
-                    }
-                }
-            }
-
-            .containerSearchResult {
-                height: 300px;
-                // transition: all 0.3s;
-
-                .fullScreenIcon {
-                    right: 10px;
-                    top: 14px;
-                }
-
-                .downloadIcon {
-                    margin-right: 20px;
-                    color: #9DA1A7;
-
-                    &:hover {
-                        color: #70767F;
-                    }
-                }
-
-                .emptyStyle {
-                    :global {
-                        .ant-table-body {
-                            border-bottom: none;
-                        }
-
-                        .ant-table-thead>tr>th {
-                            padding: 0;
-                        }
-
-                        .ant-table-tbody>tr>td {
-                            border-bottom: none
-                        }
-                    }
-                }
-
-                @globalStylesInResult();
-            }
-
-            .noTransitions {
-                transition: all 0s;
-            }
-        }
-    }
-        // 可调节分割线
-        .resizableLine {
-            display: block;
-            width: 100%;
-            // 使用min-height来避免调节过程线条宽度被各种原因影响
-            min-height: @splitLineWidth;
-            border-radius: 2px;
-            background-color: #ebedf0;
-            z-index: 10;
-    
-            cursor: s-resize;
-    
-            &:hover {
-                box-shadow: 0 0 5px rgba(71, 109, 171, 1);
-                background-color: rgba(71, 109, 171, 1);
-            }
-        }
-    
-        // 可调节分割线，垂直方向
-        .resizableVerticalLine {
-            display: block;
-            height: 100%;
-            // 使用min-width来避免调节过程线条宽度被各种原因影响
-            min-width: @splitLineWidth;
-            border-radius: 2px;
-            background-color: #ebedf0;
-            z-index: 10;
-    
-            cursor: e-resize;
-    
-            &:hover {
-                box-shadow: 0 0 5px rgba(71, 109, 171, 1);
-                background-color: rgba(71, 109, 171, 1);
-            }
-        }
-        .containerInside {
-            display: flex;
-            flex-direction: column;
-    
-            width: 100%;
-            height: 100%;
-    
-            // 解决margin折叠导致容器整体下移的问题，两种方式均可
-            // border-top: 1px solid transparent;
-            // display: inline-block;
-    
-            :global {
-                .ant-table-tbody>tr>td {
-                    padding-left: 0;
-                    border: none;
-                }
-            }
-    
-            .iconLeft {
-                display: inline-block;
-                width: 10px;
-                height: 10px;
-                margin: auto 10px;
-                margin-left: 0;
-                margin-right: 15px;
-            }
-    
-            .top {
-                position: relative;
-                display: flex;
-                flex-direction: column;
-    
-                height: @leftTopHeight;
-                min-height: 200px;
-                flex: 1;
-    
-                :global {
-                    .ant-btn {
-                        border-left: none;
-                    }
-                }
-            }
-            
-        .tableRow {
-            padding: 6px 16px;
-
-            .rowInner {
-                margin-right: 24px;
-                white-space: nowrap;
-            }
-
-            &:hover {
-                cursor: pointer;
-                background-color: rgba(24, 97, 242, 0.1);
-            }
-        }
-
-        .tableRow {
-            padding: 6px 16px;
-
-            .rowInner {
-                margin-right: 24px;
-                white-space: nowrap;
-            }
-
-            &:hover {
-                cursor: pointer;
-                background-color: rgba(24, 97, 242, 0.1);
-            }
-        }
-
-        .innerTableContainer {
-            margin: 8px 0;
-            flex: 1;
-            overflow: hidden;
-
-            &:hover {
-                overflow: auto;
-            }
-
-            :global {
-                .ant-table-tbody>tr>td {
-                    cursor: pointer;
-                }
-            }
-
-        }
-
-        .autoHideScroller {
-            overflow: hidden !important;
-
-            &:hover {
-                overflow: auto !important;
-            }
-        }
-        .dataList {
-            margin: 8px 0;
-            padding: 0;
-            flex: 1;
-
-            overflow: hidden;
-            display: flex;
-
-            :global {
-
-                // 左侧表格不显示边框
-                .ant-table-tbody>tr>td {
-                    // border-bottom: 0;
-                    padding-left: 16px !important;
-                    padding-right: 16px !important;
-                }
-            }
-        }
-
-        .bottomDataList {
-            min-height: 100px;
-            height: 300px;
-
-            display: flex;
-
-            :global {
-
-                // 三个字段不同的边距
-                .ant-table .ant-table-tbody .ant-table-row {
-                    &>:nth-child(1) {
-                        padding-left: 16px !important;
-                        padding-right: 0 !important;
-                    }
-
-                    &>:nth-child(2) {
-                        padding-left: 5px !important;
-                        padding-right: 5px !important;
-                    }
-
-                    &>:nth-child(3) {
-                        padding-left: 0 !important;
-                        padding-right: 16px !important;
-                    }
-                }
-            }
-        }
-    }
-
-    .topBorder {
-        border-top: 1px solid rgba(143, 143, 143, 0.2);
-    }
-    
-    .bottomBorder {
-        border-bottom: 1px solid rgba(143, 143, 143, 0.2);
-    }
-
-    .rightBorder {
-        border-right: 1px solid rgba(143, 143, 143, 0.2);
-    }
-
-    .iconDropdown {
-        flex: none !important;
-        width: 40px !important;
-    }
-
-
-    .hoverArea {
-        position: absolute;
-        left: 0;
-        top: 10%;
-
-        width: 20px;
-        height: 80%;
-        display: flex;
-        flex-direction: column;
-        opacity: 0;
-        transition: all 0.3s;
-        z-index: 100;
-
-        .iconRotate {
-            transform: rotate(90deg);
-        }
-
-        .operationButton {
-            position: absolute;
-            width: 20px;
-            height: 64px;
-            left: 0;
-            top: 50%;
-            transform: translateY(-50%);
-
-            display: flex;
-            justify-content: center;
-            align-items: center;
-
-            background-color: #EAEDF0;
-            border-radius: 4px;
-
-            &:hover {
-                cursor: pointer;
-            }
-        }
-
-        &:hover {
-            opacity: 1;
-        }
-    }
-}

src/pages/SqlIndex/SqlIndexView.jsx

@@ -1,306 +0,0 @@
-import React, { useState, useEffect, Component } from "react";
-import { withRouter } from 'react-router-dom'
-// import { createFromIconfontCN } from '@ant-design/icons'
-// const IconFont = createFromIconfontCN({
-//   scriptUrl: '../../../../assets/iconfont/iconfont.js'
-// })
-import { LeftOutlined, } from '@ant-design/icons'
-
-import { cloneDeep, debounce, isEqual } from 'lodash'
-
-import SqlEditor from "./SqlEditor/view.jsx";
-import SqlEditorTabs from './SqlEditorTabs/view.jsx'
-import SqlResultView from './SqlResultView.jsx'
-import LeftTableList from './LeftTableList.jsx'
-
-// // 引入当前页样式 - 模块化
-import styles from './sqlIndexStyle.less'
-const resultMinHeight = '42px'
-
-/**
- * 数据查询主页
- */
-// 在组件中可通过this.props.history.push跳转路由
-@withRouter
-class SqlIndexView extends Component {
-  // defaultResultHeight = -999
-
-  constructor(props, context) {
-    super(props, context)
-    this.query = this.props.location.query
-    this.state = {
-      sqlResultTableScrollHeight: this.defaultResultHeight,
-      isHorizonExpanded: false,
-      maxExpandHeightOfEditor: 0,
-
-      // 仅用于触发渲染，true与false无所谓
-      updateTrigger: true
-    }
-  }
-
-  componentDidMount() {
-    // this.stores.resetAll()
-
-    this.getContainersId()
-    // this.addListener()
-
-    // 页面加载完不会触发resize，这里手动调用一次
-    this.debounceResizeHandler()
-  }
-
-  query = null
-  componentWillReceiveProps(nextProps) {
-    const oldQuery = this.state.query
-    const newQuery = nextProps.location.query
-
-    if (!isEqual(oldQuery, newQuery)) {
-      this.query = newQuery
-      this.setState({
-        updateTrigger: true
-      })
-    }
-  }
-
-  componentDidUpdate() {
-    // 渲染完成后把query清掉，避免因其它条件触发渲染时，再次传入query
-    this.query = null
-  }
-
-  componentWillUnmount() {
-    this.removeListener()
-  }
-
-  handleVerticalExpand = (isExpand) => {
-    if (isExpand) {
-      this.sqlIndexContainerResult.style.height = resultMinHeight
-    } else {
-      this.sqlIndexContainerResult.style.height = this.initailHeightOfSqlResult
-      this.updateSqlResultTableSize()
-    }
-  }
-
-  handleHorizonExpand = (isExpand) => {
-    if (isExpand) {
-      this.containerLeft.style.display = 'none'
-      this.sqlIndexVerticalResizeLine.style.display = 'none'
-    } else {
-      this.containerLeft.style.display = 'block'
-      this.sqlIndexVerticalResizeLine.style.display = 'block'
-    }
-  }
-
-  getStyle = (element, attr) => {
-    // 兼容IE浏览器
-    if (element.currentStyle) {
-      return element.currentStyle[attr]
-    } else {
-      return getComputedStyle(element, false)[attr]
-    }
-  }
-
-  debounceResizeHandler = debounce(() => {
-    const { clientHeight } = document.body
-
-    const rootContainerHeight = clientHeight - 101
-    this.rootContainer.style.height = `${rootContainerHeight}px`
-
-    // 限制sqlresult区域的高度，最大可以展开到只保留查询结果的标题栏
-    const editorMaxHeight = `${rootContainerHeight - 84}px`
-    this.containerTopRight.style.maxHeight = editorMaxHeight
-
-    if (!this.initailHeightOfSqlResult) {
-      this.initailHeightOfSqlResult = this.getStyle(this.sqlIndexContainerResult, 'height')
-    }
-    this.setState({
-      // 除去底部结果的标题栏高度42和顶部tab栏的高度42，才是编辑器组件的高度。这里多预留4个像素的误差范围
-      maxExpandHeightOfEditor: this.containerRight.getBoundingClientRect().height - 88
-    })
-
-    this.updateSqlResultTableSize()
-  }, 100)
-
-  isResultFullScreen = false
-
-  handleOnSmall = () => {
-    this.isResultFullScreen = false
-    this.updateSqlResultTableSize()
-  }
-  handleOnFull = () => {
-    this.isResultFullScreen = true
-    this.updateSqlResultTableSize()
-  }
-
-  debounceResizeSqlResultTable = debounce(
-    () => {
-      this.updateSqlResultTableSize()
-    },
-    200,
-    {
-      trailing: true
-    }
-  )
-
-  updateSqlResultTableSize = () => {
-    // 动态计算右下方表格容器的滚动高度（以及全屏模式的表格滚动高度），预留了页脚的高度64
-    const rect = this.containerTopRight.getBoundingClientRect()
-    let sqlResultTableScrollHeight = this.rootContainer.getBoundingClientRect().bottom - rect.bottom - 144
-
-    if (this.isResultFullScreen) {
-      const { clientHeight } = document.body
-      sqlResultTableScrollHeight = clientHeight - 144
-    }
-
-    this.setState({
-      sqlResultTableScrollHeight: sqlResultTableScrollHeight
-    })
-  }
-
-  getContainersId() {
-    this.rootContainer = document.getElementById('sqlIndexRootContainer')
-    this.containerTopRight = document.getElementById('sqlIndexContainerTopRight')
-    this.sqlIndexContainerResult = document.getElementById('sqlIndexContainerResult')
-    this.containerLeft = document.getElementsByClassName(styles.containerLeft)[0]
-    this.containerRight = document.getElementsByClassName(styles.containerRight)[0]
-
-    this.sqlIndexRightResizeLine = document.getElementById('sqlIndexRightResizeLine')
-    this.sqlIndexVerticalResizeLine = document.getElementById('sqlIndexVerticalResizeLine')
-  }
-
-  addListener() {
-    window.addEventListener('resize', this.debounceResizeHandler)
-
-    this.sqlIndexRightResizeLine.addEventListener('mousedown', this.handleRightResizeLineMouseDown)
-    this.sqlIndexVerticalResizeLine.addEventListener('mousedown', this.handleVerticalResizeLineMouseDown)
-  }
-  removeListener() {
-    window.removeEventListener('resize', this.debounceResizeHandler)
-
-    this.sqlIndexRightResizeLine.removeEventListener('mousedown', this.handleRightResizeLineMouseDown)
-    this.sqlIndexVerticalResizeLine.removeEventListener('mousedown', this.handleVerticalResizeLineMouseDown)
-  }
-
-  handleRightResizeLineMouseDown = (e) => {
-    e.preventDefault()
-
-    // 手动拖拽的时候关闭动画
-    this.disableTransitions()
-
-    const startY = e.clientY
-    const oldHeight = parseInt(window.getComputedStyle(this.sqlIndexContainerResult).height)
-
-    document.onmousemove = (evt) => {
-      evt.stopPropagation()
-      const offset = evt.clientY - startY
-      this.sqlIndexContainerResult.style.height = oldHeight - offset + 'px'
-      this.debounceResizeSqlResultTable()
-    }
-    document.onmouseup = (evt) => {
-      evt.stopPropagation()
-      document.onmousemove = null
-      document.onmouseup = null
-
-      this.enableTransitions()
-    }
-  }
-
-  handleVerticalResizeLineMouseDown = (e) => {
-    e.preventDefault()
-
-    // x是分割线的最左侧，当反方向移动时，需要加上分割线的宽度去计算
-    const startX = e.clientX
-    const oldWidth = parseInt(window.getComputedStyle(this.containerLeft).width)
-
-    document.onmousemove = (evt) => {
-      evt.stopPropagation()
-      const offset = evt.clientX - startX
-      this.containerLeft.style.width = oldWidth + offset + 'px'
-    }
-    document.onmouseup = (evt) => {
-      evt.stopPropagation()
-      document.onmousemove = null
-      document.onmouseup = null
-    }
-  }
-
-  enableTransitions = () => {
-    const { className } = this.sqlIndexContainerResult
-    const classNames = className.split(' ')
-    const index = classNames.indexOf(styles.noTransitions)
-    if (index > -1) {
-      classNames.splice(index, 1)
-    }
-    this.sqlIndexContainerResult.className = classNames.join(' ')
-  }
-
-  disableTransitions = () => {
-    const { className } = this.sqlIndexContainerResult
-    this.sqlIndexContainerResult.className = className + ' ' + styles.noTransitions
-  }
-
-  render() {
-    const { sqlResultTableScrollHeight, isHorizonExpanded, maxExpandHeightOfEditor } = this.state
-
-    return (
-      <div>
-        {/* <Spin spinning={loading}> */}
-        <div id="sqlIndexRootContainer" className={[styles.sqlIndexView]}>
-          <div className={[styles.containerLeft]}>
-            <LeftTableList query={this.query}></LeftTableList>
-          </div>
-          <span id="sqlIndexVerticalResizeLine" className={[styles.resizableVerticalLine]}></span>
-          <div className={[styles.containerRight]}>
-            <div id="sqlIndexTabDiv" className={[styles.tabBar]}>
-              <SqlEditorTabs></SqlEditorTabs>
-            </div>
-            <div className={[styles.containerRightExceptTabbar]}>
-              <div id="sqlIndexContainerTopRight" className={[styles.containerSqlEditor]}>
-                {/* sql编辑器---start */}
-                <div style={{ height: '100%' }}>
-                  <SqlEditor
-                    className={[styles.bottomBorder]}
-                    style={{ height: '100%' }}
-                    maxExpandHeightOfEditor={maxExpandHeightOfEditor}
-                    onEditorExpand={(isExpand) => {
-                      this.handleVerticalExpand(isExpand)
-                    }}
-                  ></SqlEditor>
-                </div>
-                {/* sql编辑器---end */}
-              </div>
-              <span id="sqlIndexRightResizeLine" className={[styles.resizableLine]}></span>
-              <div id="sqlIndexContainerResult" className={[styles.containerSearchResult]}>
-                <SqlResultView
-                  sqlResultTableScrollHeight={sqlResultTableScrollHeight}
-                  onSmall={this.handleOnSmall}
-                  onFull={this.handleOnFull}
-                ></SqlResultView>
-              </div>
-            </div>
-
-            {/* hover显示左右收缩图标 */}
-            <div className={[styles.hoverArea]}>
-              <div
-                className={[styles.operationButton]}
-                onClick={() => {
-                  // 展开，收回
-                  this.setState(
-                    {
-                      isHorizonExpanded: !isHorizonExpanded
-                    },
-                    () => {
-                      this.handleHorizonExpand(this.state.isHorizonExpanded)
-                    }
-                  )
-                }}
-              >
-                <LeftOutlined />
-              </div>
-            </div>
-          </div>
-        </div>
-        {/* </Spin> */}
-      </div>
-    )
-  }
-}
-export default SqlIndexView;

src/pages/SqlIndex/SqlResultView.jsx

@@ -1,493 +0,0 @@
-import React, { Component } from 'react'
-import { Table, Select, Spin, Card, Popover, Button, message,Modal } from 'antd'
-import { VerticalAlignBottomOutlined } from '@ant-design/icons'
-import { isEmpty } from 'lodash'
-import { inject, observer } from 'mobx-react'
-import { toJS } from 'mobx'
-import XLSX from 'xlsx'
-import SqlIndexMod from './SqlIndexMod'
-import moment from 'moment'
-const { Option } = Select;
-import FullScreen from '@widget/FullScreen'
-import styles from './sqlIndexStyle.less'
-
-/**
- * sql查询结果表格
- */
-// 将组件设置为响应式组件，成为观察者，以便响应被观察数据的变化
-@observer
-export default class extends Component {
-  constructor(props) {
-    super(props)
-    this.stores = SqlIndexMod
-    this.state = {
-      visible: false,
-      showMassagepop:false,
-      iconLoding:false,
-      fileType: 'excel',
-      sqlResultTableScrollHeight: props.sqlResultTableScrollHeight,
-
-      // 这个值只是用来触发渲染的手段，true和false都无所谓
-      activeRender: false,
-
-      // 全屏模式下的当前页码，因为全屏模式和普通模式的pageSize不同，页码也要区分开
-      fullScreenCurPage: 1,
-      pageSize: 10,
-      pageNum: 1,
-      isSizeChange: false,
-    }
-
-    this.sqlResultPageSize = this.minPageSize
-  }
-
-  // 查询结果最少的pageSize
-  minPageSize = 10
-
-  componentWillReceiveProps(nextProps) {
-    this.setState({
-      sqlResultTableScrollHeight: nextProps.sqlResultTableScrollHeight
-    })
-  }
-
-  // 为了降低切换tab时的卡顿感，将渲染查询结果的时机延迟到切换tab完成后，这个变量用于此标记
-  allowRender = false
-  delayRenderTimer = null
-
-  /**
-   * 通过willupdatge 和 didupdate将渲染Table延迟到tab切换完成之后
-   * 减小pageSize之后，这个优化就可以不需要了
-   */
-  componentWillUpdate(nextProps, nextState) {
-    // 对于改变表格大小引起的渲染（拖拽分割线，全屏按钮），不需要延时渲染
-    if (nextState.sqlResultTableScrollHeight != this.state.sqlResultTableScrollHeight) {
-      this.allowRender = true
-      return
-    }
-
-    // 避免陷入死循环
-    if (this.allowRender == true) {
-      return
-    }
-
-    clearTimeout(this.delayRenderTimer)
-
-    this.delayRenderTimer = setTimeout(() => {
-      this.allowRender = true
-      this.setState({
-        activeRender: true
-      })
-    }, 0)
-  }
-
-  componentDidUpdate() {
-    this.allowRender = false
-  }
-
-  componentWillUnmount() {
-    this.allowRender = false
-    clearTimeout(this.delayRenderTimer)
-    this.delayRenderTimer = null
-  }
-
-  /**
-   * 动态计算分页。例如：当前高度可以展示24条数据，那么分页就按30每页来
-   */
-  getPageSize = () => {
-    const { sqlResultTableScrollHeight } = this.state
-    const rowHeight = 34
-
-    let pageSize = sqlResultTableScrollHeight / rowHeight
-    if (pageSize <= this.minPageSize) {
-      pageSize = this.minPageSize
-    } else {
-      pageSize = (Math.floor(pageSize / 10) + 1) * 10
-    }
-
-    return pageSize
-  }
-
-  getCurPage = () => {
-    const { sqlResultPage } = this.stores.curActiveTab
-
-    let curPage = sqlResultPage
-    if (this.isFullScreen) {
-      curPage = this.state.fullScreenCurPage
-    }
-
-    return curPage
-  }
-
-  getSqlResultList = () => {
-    const { sqlResult } = this.stores.curActiveTab
-
-    // allowRender为false时返回空列表，把Table的子节点清除。切换tab的瞬间卡顿主要是table的子节点一直保留着的缘故
-    if (!isEmpty(sqlResult) && this.allowRender) {
-      return sqlResult.data
-      // return this.stores.getSqlResult(sqlResult.data, this.state.pageNum, this.state.pageSize)
-    } else {
-      return []
-    }
-  }
-
-  updateCurPage = (page) => {
-    if (this.isFullScreen) {
-      this.setState({
-        fullScreenCurPage: page
-      })
-    } else {
-      this.stores.updateTabSqlCurPage(page)
-    }
-  }
-
-  paginationProps = (num) => {
-    // return false
-    const { sqlResult } = this.stores.curActiveTab
-    const { executeSqlpar } = this.stores.state;
-    const curPage = this.getCurPage()
-
-    return {
-      // showQuickJumper: true,
-      // showSizeChanger: true,
-      // size:"small",
-      simple: true,
-      defaultCurrent: 1,
-      // showSizeChanger: false, //隐藏条数切换器，固定20条，解决切换无效
-      // // 切换数据源时，页码不会自动重置为1，需要跟踪设置current来确保页码正确显示
-      // current: this.state.pageNum,
-      // pageSize: this.getPageSize(),
-      // pageSizeOptions: [10, 20, 50, 100, 500, 1000],//分页器下拉选择 指定每页可以显示多少条
-      total: num
-    }
-  }
-
-
-  getSqlResultTableColumns = () => {
-    const { sqlResult: sqlResultData } = this.stores.curActiveTab
-    const curPage = this.getCurPage()
-
-    if (!isEmpty(sqlResultData)) {
-      const { tableHeaders = [], tableHeadersRemarks = {} } = sqlResultData
-
-      const itemBeginIndex = this.getPageSize() * (curPage - 1) + 1
-
-      const columns = []
-      for (const fieldName of tableHeaders) {
-        // 30给padding，字符宽度按8计算（都是英文字符）
-        const width = fieldName.length * 8 + 30
-        columns.push({
-          // title: (
-          //   <Tooltip
-          //     placement="top"
-          //     title={tableHeadersRemarks && tableHeadersRemarks[fieldName] ? tableHeadersRemarks[fieldName] : fieldName}
-          //   >
-          //     <Typography.Text ellipsis={true}>{fieldName}</Typography.Text>
-          //   </Tooltip>
-          // ),
-          title: fieldName,
-          dataIndex: fieldName,
-          width: width,
-          ellipsis: {
-            showTitle: false
-          },
-          render: (text) => (<span>{text}</span>)
-          // (
-          //   <Tooltip
-          //     placement="top"
-          //     title={text}
-          //   >
-          //     <Typography.Text ellipsis={true}>{text}</Typography.Text>
-          //   </Tooltip>
-          // )
-        })
-      }
-
-      if (columns.length > 0) {
-        columns.unshift({
-          title: '序号',
-          dataIndex: 'itemOrderNum',
-          width: 60,
-          ellipsis: true,
-          render: (text, item, index) => itemBeginIndex + index + ''
-        })
-      }
-
-      return columns
-    } else {
-      return null
-    }
-  }
-
-  getResultFailedText = () => {
-    const { sqlResult } = this.stores.curActiveTab
-    const sqlResultData = toJS(sqlResult)
-    if (!isEmpty(sqlResultData)) {
-      const { tableHeaders = [], data: sqlResultList = [] } = sqlResultData
-
-      // 后端在执行sql失败时，没有返回特殊标记，只能通过这种硬编码来判断
-      if (tableHeaders && tableHeaders.length == 2 && tableHeaders[0] == '查询结果' && tableHeaders[1] == '原因') {
-        const str = typeof (sqlResultList[0]['原因']) == 'object' && sqlResultList[0]['原因']['resultMsg'] ? sqlResultList[0]['原因']['resultMsg'] : sqlResultList[0]['原因']
-        return '查询失败：' + str
-      }
-    }
-    return false
-  }
-
-  getNowTimeFormat = () => {
-    // 大写HH是24小时制
-    return moment(new Date()).format('YYYYMMDD_HHmmss')
-  }
-
-  load_ = () => {
-    // this.setState({ showMassagepop: false,iconLoding:true });
-    message.info('即将开始下载，请稍候...');
-    this.downloading = true
-    const { dbInfo, sqlResult, executingSql } = this.stores.curActiveTab;
-    const { executingSqlKey } = this.stores.state;
-    this.setState({ visible: false });
-    this.stores
-      .recordLogOfDownload({
-        type: this.state.fileType,
-        sql: executingSql,
-        dataSourceId: dbInfo.dsId,
-        dataBaseName: dbInfo.dbName,
-        executeKey: executingSqlKey
-        // data: sqlResult.data
-      }, ((data, fileName) => {
-        this.setState({ iconLoding:false });
-        var blob = new Blob([data], {
-          type: "application/vnd.ms-excel",
-        });
-        var downloadElement = document.createElement("a");
-        // 下载的文件名
-        // downloadElement.download = fileName.replace('.csv','.xls');
-        downloadElement.download = fileName;
-        // 创建下载的链接
-        downloadElement.href = window.URL.createObjectURL(blob);
-        // 点击下载
-        downloadElement.click();
-        document.body.appendChild(downloadElement);
-        // 下载完成移除元素
-        document.body.removeChild(downloadElement);
-        // 释放掉blob对象
-        window.URL.revokeObjectURL(downloadElement.href);
-        // this.handleExportToExcel()
-      }))
-      .then((data) => {
-      })
-      .catch(() => {
-        this.downloading = false
-      })
-
-  }
-  handleDownload = () => {
-    // if(Number(this.stores.state.sql_total) >= 65000 && this.state.fileType == 'excel'){
-    //   message.error('数据量大于65000条，请使用csv方式导出!');
-    //   return
-    // }
-    const { dbInfo, sqlResult, executingSql } = this.stores.curActiveTab;
-    const { executingSqlKey } = this.stores.state;
-
-    // if (this.state.fileType == 'excel') {
-    //   this.stores.preCheckExportExcel({
-    //     sql: executingSql,
-    //     dataSourceId: dbInfo.dsId,
-    //     dataBaseName: dbInfo.dbName,
-    //   }, ((data) => {
-    //     if (data && Number(data) >= 65000) {
-    //       this.setState({ showMassagepop: true });
-    //     } else {
-    //       this.load_()
-    //     }
-    //   }))
-    // } else {
-    //   this.load_()
-    // }
-    this.load_()
-
-  }
-
-  handleExportToExcel = () => {
-    const { sqlResult } = this.stores.curActiveTab
-    const sqlResultData = toJS(sqlResult)
-
-    if (!isEmpty(sqlResultData)) {
-      const { tableHeaders = [], data: sqlResultList = [] } = sqlResultData
-
-      // columns 是二维数组
-      const columns = [[...tableHeaders]]
-      // 数据和表头字段名顺序不一致，需要对齐一下
-      for (const item of sqlResultList) {
-        const row = []
-        for (const header of tableHeaders) {
-          row.push(item[header])
-        }
-        columns.push(row)
-      }
-
-      const wb = XLSX.utils.book_new()
-      const ws = XLSX.utils.aoa_to_sheet(columns)
-      XLSX.utils.book_append_sheet(wb, ws, '数据')
-      const fileName = '数据服务平台_' + this.getNowTimeFormat() + '.xlsx'
-      XLSX.writeFile(wb, fileName) //导出Excel
-    }
-    this.downloading = false
-  }
-
-  handleOnSmall = () => {
-    this.isFullScreen = false
-    this.props.onSmall()
-  }
-
-  handleOnFull = () => {
-    this.isFullScreen = true
-    this.props.onFull()
-
-    this.setState({
-      fullScreenCurPage: 1
-    })
-  }
-
-  isFullScreen = false
-
-  // 用来标记当次渲染是否在原本的tab上查询导致的render，是的话不需要延迟渲染
-  oldTabKey = ''
-  render() {
-    const { sqlResultTableScrollHeight,iconLoding } = this.state
-    const { curTabSqlLoading } = this.stores
-    const { tabKey, sqlResult } = this.stores.curActiveTab
-
-    if (this.oldTabKey == tabKey) {
-      this.allowRender = true
-    }
-    this.oldTabKey = tabKey
-    const resultFailText = this.getResultFailedText()
-    let resultList = []
-    if (!resultFailText) {
-      resultList = this.getSqlResultList()
-      // console.log(resultList)
-    }
-    return (
-      <Spin spinning={curTabSqlLoading} id={"dy-table"}>
-        <FullScreen
-          small={{ icon: { position: styles.fullScreenIcon } }}
-          max={{ icon: { position: styles.fullScreenIcon } }}
-          onSmall={this.handleOnSmall}
-          onFull={this.handleOnFull}
-        >
-          <Card
-            // style={{
-            //   // card标题栏和页码栏高度106
-            //   minHeight: sqlResultTableScrollHeight + 106
-            // }}
-            title={'结果'}
-            extra={
-              sqlResult && sqlResult.extendResp && sqlResult.extendResp.canDownload && resultList.length > 0 ? (
-                <Popover
-                  placement="left"
-                  content={
-                    <div>
-                      <span style={{ marginRight: '10px' }}>下载文件格式:</span><Select value={this.state.fileType} style={{ width: 120 }} disabled={iconLoding} onChange={(val) => { this.setState({ fileType: val }); }}>
-                        <Option value="csv">csv</Option>
-                        <Option value="excel">excel</Option>
-                      </Select>
-                      <p style={{ display: 'block', textAlign: 'right', marginTop: '5px' }}><Button type="primary" size={'small'} onClick={() => { this.handleDownload(); }} loading={iconLoding} disabled={iconLoding}>
-                        导出
-                      </Button></p>
-                    </div>
-                  }
-                  title="导出"
-                  trigger="click"
-                  visible={this.state.visible}
-                  onVisibleChange={(visible) => { 
-                    if(iconLoding){return}
-                    if(visible){this.setState({fileType:'excel' }); }
-                    this.setState({ visible }); 
-                  }}
-                >
-                  {
-                    !iconLoding ? <VerticalAlignBottomOutlined className={styles.downloadIcon} />  : <Button shape="round" icon="download" size={'small'} loading={iconLoding} disabled={iconLoding}/>
-                  }
-                </Popover>
-
-              ) : (sqlResult && sqlResult.extendResp && sqlResult.extendResp.canDownload && resultList.length == 0 ? (
-                <VerticalAlignBottomOutlined className={styles.downloadIcon} onClick={() => {
-                  message.warning('数据为空,请核对!')
-                }} />
-              ) : (
-                ""
-              ))
-            }
-          >
-            {resultFailText ? (
-              <p
-                style={{
-                  padding: '16px',
-                  height: sqlResultTableScrollHeight + 80,
-                  wordWrap: 'break-word',
-                  wordBreak: 'breakAll',
-                  overflow: 'auto',
-                  fontWeight: '700',
-                  color: 'red'
-                }}
-              >
-                {resultFailText}
-              </p>
-            ) : (
-              <Table
-                className={resultList.length == 0 ? styles.emptyStyle : ''}
-                ref={this.resultTableRef}
-                style={{
-                  userSelect: 'none'
-                }}
-                dataSource={resultList}
-                pagination={this.paginationProps(resultList.length)}
-                columns={this.getSqlResultTableColumns() || []}
-                rowKey={(record, index) => {
-                  return index
-                }}
-                scroll={{
-                  y: sqlResultTableScrollHeight
-                }}
-              />
-            )}
-          </Card>
-        </FullScreen>
-        <Modal
-          className="xxpop"
-          title="提示"
-          centered
-          maskClosable={false}
-          visible={this.state.showMassagepop}
-          footer={[
-            <Button
-              onClick={() => {
-                this.load_()
-                this.setState({ showMassagepop: false,iconLoding:true })
-              }}
-            >
-              继续Excel导出
-            </Button>,
-            <Button
-            type="primary"
-            onClick={() => {
-              this.setState({ fileType: 'csv',showMassagepop: false,iconLoding:true });
-              setTimeout(()=>{
-                this.load_()
-              },100)
-            }}
-          >
-            Csv导出
-          </Button>,
-        ]}
-          onCancel={() => {
-            this.setState({ showMassagepop: false })
-          }}
-
-        >
-          <p>导出数据量大于65000条，建议使用csv方式导出!</p>
-        </Modal>
-
-      </Spin>
-    )
-  }
-}

src/pages/SqlIndex/mock/key.js

@@ -1,10 +0,0 @@
-let key = {
-	"extFields": {},
-	"exceptCauseIp": null,
-	"exceptCauseApp": null,
-	"exceptClass": null,
-	"resultCode": "0",
-	"resultMsg": "success",
-	"data": "execute_7091920910191797289"
-}
-export default key;

src/pages/SqlIndex/mock/leftb.js

@@ -1,318 +0,0 @@
-let leftb = {
-	"extFields": {},
-	"exceptCauseIp": null,
-	"exceptCauseApp": null,
-	"exceptClass": null,
-	"resultCode": "0",
-	"resultMsg": "success",
-	"data": [{
-		"columnName": "business_date",
-		"columnType": "DATE",
-		"columnRemarks": "日期"
-	}, {
-		"columnName": "oper_center_name",
-		"columnType": "STRING",
-		"columnRemarks": "营运中心"
-	}, {
-		"columnName": "region_name",
-		"columnType": "STRING",
-		"columnRemarks": "大区"
-	}, {
-		"columnName": "prov_id",
-		"columnType": "BIGINT",
-		"columnRemarks": "省份编码"
-	}, {
-		"columnName": "prov_name",
-		"columnType": "STRING",
-		"columnRemarks": "省份名称"
-	}, {
-		"columnName": "city_id",
-		"columnType": "BIGINT",
-		"columnRemarks": "城市编码"
-	}, {
-		"columnName": "city_name",
-		"columnType": "STRING",
-		"columnRemarks": "城市名称"
-	}, {
-		"columnName": "city_level",
-		"columnType": "STRING",
-		"columnRemarks": "城市等级"
-	}, {
-		"columnName": "district_id",
-		"columnType": "BIGINT",
-		"columnRemarks": "区县编码"
-	}, {
-		"columnName": "district_name",
-		"columnType": "STRING",
-		"columnRemarks": "区县名称"
-	}, {
-		"columnName": "busi_area_type",
-		"columnType": "STRING",
-		"columnRemarks": "商圈"
-	}, {
-		"columnName": "channel_name",
-		"columnType": "STRING",
-		"columnRemarks": "渠道"
-	}, {
-		"columnName": "business_type",
-		"columnType": "STRING",
-		"columnRemarks": "业务类型"
-	}, {
-		"columnName": "user_type",
-		"columnType": "STRING",
-		"columnRemarks": "用户类型"
-	}, {
-		"columnName": "time_name",
-		"columnType": "STRING",
-		"columnRemarks": "时段"
-	}, {
-		"columnName": "total_amount",
-		"columnType": "DECIMAL",
-		"columnRemarks": "流水金额"
-	}, {
-		"columnName": "total_amount_last_day",
-		"columnType": "DECIMAL",
-		"columnRemarks": "流水金额上一天金额"
-	}, {
-		"columnName": "total_amount_last_week",
-		"columnType": "DECIMAL",
-		"columnRemarks": "流水金额上周同期金额"
-	}, {
-		"columnName": "total_amount_last_year",
-		"columnType": "DECIMAL",
-		"columnRemarks": "流水金额去年同期金额"
-	}, {
-		"columnName": "order_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "订单量"
-	}, {
-		"columnName": "order_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "订单量上一天值"
-	}, {
-		"columnName": "order_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "订单量上周值"
-	}, {
-		"columnName": "order_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "订单量去年同期值"
-	}, {
-		"columnName": "pay_amount",
-		"columnType": "DECIMAL",
-		"columnRemarks": "实收金额"
-	}, {
-		"columnName": "pay_amount_last_day",
-		"columnType": "DECIMAL",
-		"columnRemarks": "实收金额上一天值"
-	}, {
-		"columnName": "pay_amount_last_week",
-		"columnType": "DECIMAL",
-		"columnRemarks": "实收金额上周值"
-	}, {
-		"columnName": "pay_amount_last_year",
-		"columnType": "DECIMAL",
-		"columnRemarks": "实收金额去年同期值"
-	}, {
-		"columnName": "return_total_amount",
-		"columnType": "DECIMAL",
-		"columnRemarks": "退单金额"
-	}, {
-		"columnName": "return_total_amount_last_day",
-		"columnType": "DECIMAL",
-		"columnRemarks": "退单金额上一天值"
-	}, {
-		"columnName": "return_total_amount_last_week",
-		"columnType": "DECIMAL",
-		"columnRemarks": "退单金额上周值"
-	}, {
-		"columnName": "return_total_amount_last_year",
-		"columnType": "DECIMAL",
-		"columnRemarks": "退单金额去年同期值"
-	}, {
-		"columnName": "return_order_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "退订单量"
-	}, {
-		"columnName": "return_order_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "退订单量上一天值"
-	}, {
-		"columnName": "return_order_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "退订单量上周值"
-	}, {
-		"columnName": "return_order_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "退订单量去年同期值"
-	}, {
-		"columnName": "trade_people_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易用户数"
-	}, {
-		"columnName": "trade_people_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易用户数上一天值"
-	}, {
-		"columnName": "trade_people_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易用户数上周值"
-	}, {
-		"columnName": "trade_people_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易用户数去年同期值"
-	}, {
-		"columnName": "trade_shop_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易门店数"
-	}, {
-		"columnName": "trade_shop_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易门店数上一天值"
-	}, {
-		"columnName": "trade_shop_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易门店数上周值"
-	}, {
-		"columnName": "trade_shop_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "交易门店数去年同期值"
-	}, {
-		"columnName": "item_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "商品销量"
-	}, {
-		"columnName": "item_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "商品销量上周值"
-	}, {
-		"columnName": "item_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "商品销量上周值"
-	}, {
-		"columnName": "item_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "商品销量去年同期值"
-	}, {
-		"columnName": "mkt_total_amount",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销流水金额"
-	}, {
-		"columnName": "mkt_total_amount_last_day",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销流水金额上一天值"
-	}, {
-		"columnName": "mkt_total_amount_last_week",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销流水金额上周值"
-	}, {
-		"columnName": "mkt_total_amount_last_year",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销流水金额去年同期值"
-	}, {
-		"columnName": "mkt_extend_amount",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销带动金额"
-	}, {
-		"columnName": "mkt_extend_amount_last_day",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销带动金额上一天值"
-	}, {
-		"columnName": "mkt_extend_amount_last_week",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销带动金额上周值"
-	}, {
-		"columnName": "mkt_extend_amount_last_year",
-		"columnType": "DECIMAL",
-		"columnRemarks": "营销带动金额去年同期值"
-	}, {
-		"columnName": "add_mements",
-		"columnType": "BIGINT",
-		"columnRemarks": "新增会员数"
-	}, {
-		"columnName": "add_mements_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "新增会员数上周值"
-	}, {
-		"columnName": "add_mements_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "新增会员数上周值"
-	}, {
-		"columnName": "add_mements_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "新增会员数去年同期值"
-	}, {
-		"columnName": "ispassstring",
-		"columnType": "DECIMAL",
-		"columnRemarks": "常规QSC区域内巡检累计分"
-	}, {
-		"columnName": "ispassstring_last_day",
-		"columnType": "DECIMAL",
-		"columnRemarks": "常规QSC区域内巡检累计分上一天值"
-	}, {
-		"columnName": "ispassstring_last_week",
-		"columnType": "DECIMAL",
-		"columnRemarks": "常规QSC区域内巡检累计分上周值"
-	}, {
-		"columnName": "ispassstring_last_year",
-		"columnType": "DECIMAL",
-		"columnRemarks": "常规QSC区域内巡检累计分去年同期值"
-	}, {
-		"columnName": "ispass_report_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "常规QSC区域内巡检累计报告数"
-	}, {
-		"columnName": "ispass_report_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "常规QSC区域内巡检累计报告数上一天值"
-	}, {
-		"columnName": "ispass_report_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "常规QSC区域内巡检累计报告数上周值"
-	}, {
-		"columnName": "ispass_report_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "常规QSC区域内巡检累计报告数去年同期值"
-	}, {
-		"columnName": "ispass_shop_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "巡检门店数"
-	}, {
-		"columnName": "ispass_shop_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "巡检门店数上一天值"
-	}, {
-		"columnName": "ispass_shop_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "巡检门店数上周值"
-	}, {
-		"columnName": "ispass_shop_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "巡检门店数去年同期值"
-	}, {
-		"columnName": "shop_count",
-		"columnType": "BIGINT",
-		"columnRemarks": "区域内门店总数"
-	}, {
-		"columnName": "shop_count_last_day",
-		"columnType": "BIGINT",
-		"columnRemarks": "区域内门店总数上一天值"
-	}, {
-		"columnName": "shop_count_last_week",
-		"columnType": "BIGINT",
-		"columnRemarks": "区域内门店总数上周值"
-	}, {
-		"columnName": "shop_count_last_year",
-		"columnType": "BIGINT",
-		"columnRemarks": "区域内门店总数去年同期值"
-	}, {
-		"columnName": "load_time",
-		"columnType": "STRING",
-		"columnRemarks": "数据更新时间"
-	}, {
-		"columnName": "pt",
-		"columnType": "STRING",
-		"columnRemarks": ""
-	}]
-}
-export default leftb;

src/pages/SqlIndex/mock/test.js

@@ -1,20 +0,0 @@
-let arr = {
-	"extFields": {},
-	"exceptCauseIp": null,
-	"exceptCauseApp": null,
-	"exceptClass": null,
-	"resultCode": "0",
-	"resultMsg": "success",
-	"data": [{
-		"dsId": "1602960297754152962",
-		"name": "hive185IP",
-		"dbs": [{
-			"dataBaseName": "beifeng_test",
-			"tableNames": ["ods_lgzk_projbld_df", "ods_lgzk_projbld_df1", "test_abc"]
-		}, {
-			"dataBaseName": "cbd_dw_dev",
-			"tableNames": ["ads_dbs_trade_time_di"]
-		}]
-	}]
-}
-export default arr;

src/pages/businessWarning/list/businessWarningLess.less

@@ -1,112 +0,0 @@
-// 其中assets文件夹已经做了webpack别名配置，不需要再使用../../访问，直接加个波浪线
-
-.sys_account {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-
-  :global {
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-
-:global {
-  .ant-modal {
-    top: 50px;
-  }
-}
-
-.sys_account {
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-
-    .module_search,
-    .module_line {
-      border-bottom: 8px solid #f5f5f5;
-      padding-bottom: 20px;
-    }
-
-    .cursor {
-      cursor: pointer;
-    }
-
-    .col_blue {
-      color: #009F95;
-    }
-
-    .flex {
-      display: flex;
-    }
-
-    .module_body {
-      .list_top {
-        display: flex;
-        justify-content: space-between;
-
-        .module_button_area {
-          button {
-            float: right;
-            margin-left: 10px;
-          }
-        }
-      }
-    }
-
-    .ckxq_but {
-      cursor: pointer;
-      color: skyblue;
-    }
-
-  }
-}
-
-.DataSourceAddModal {
-  :global {
-    .ant-form-item-children>div {
-      display: inline-block !important;
-    }
-
-    .ant-form-explain {
-      font-weight: 400;
-      font-size: 12px;
-      line-height: normal;
-      color: #e54747;
-      padding-top: 4px;
-    }
-
-    .has-error .ant-input,
-    .has-error .ant-select-selector {
-      color: rgba(0, 0, 0, 0.6);
-      background-color: #fff;
-      border: 1px #e54747 solid;
-    }
-  }
-}

src/pages/businessWarning/list/businessWarningMod.js

@@ -1,340 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, runInAction, autorun, toJS, computed, makeObservable } from 'mobx'
-// 工具方法
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-// 引入Serv
-import Serv from './businessWarningServ'
-import { message } from 'antd'
-
-
-// 严格模式
-configure({
-  enforceActions: 'observed'
-});
-
-const defaultForm = {
-  dsId:'',
-  bizTableConfigName:'',
-  endTime:'',
-  dayTime:'',
-}
-
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class BusinessWarningMod {
-  constructor() {
-    makeObservable(this);
-  }
-
-  // 监视状态
-  @observable state = {
-    visible: false,
-    createType: 'add', //创建类型，add:新增，edit：修改
-    formData: cloneDeep(defaultForm),
-    version: '',
-    loading: false,
-    dbTypeList: [],
-    tableArr: [{bizTableKey:1}]
-  }
-
-  /*
-   * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-   * 设置内容可视性
-   */
-  @action updateState = async (payload) => {
-    // 设置到状态机 - 如果是异步，必须在runInAction
-    runInAction(() => {
-      this.state = {
-        ...this.state,
-        ...payload,
-        formData: {
-          ...this.state.formData,
-          ...payload.formData
-        }
-      }
-    })
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 重置from表单
-  @action restForm = async (payload) => {
-    this.state.formData = cloneDeep(defaultForm)
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 创建数据源
-  @action addDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.addDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-  // 根据id查询业务预警定义详情
-  @action selectById = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      const { resultCode, resultMsg, data } = await Serv.selectById(params)
-      if (resultCode == '0') {
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-    }
-  }
-
-  /**
-   * 记录下载操作的日志
-   */
-  @action recordLogOfDownload = async (params, callback) => {
-    try {
-      const res = await Serv.recordLogOfDownload(params);
-      const { resultCode, resultMsg, data } = res;
-      const fileName = decodeURI(res.headers['content-disposition'].split(";")[1].split("filename=")[1]);
-      callback && callback(data, fileName)
-    } catch (error) {
-      // message.error('请求异常！')
-    }
-  }
-
-
-  // 获取数据源类型
-  @action queryDbType = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbType(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const dbTypeList = data ? data : []
-        this.updateState({
-          dbTypeList: dbTypeList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 分页查询数据源信息
-  @action pageQueryDsInfoMod = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr = get(data,"records",[]);
-        this.updateState({
-          tableArr: tableArr
-        })
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-
-
-  // 修改数据源
-  @action updateDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.updateDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-  // 删除数据源记录
-  @action deleteDs = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('删除中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.deleteDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('删除成功！')
-        callback && callback()
-      } else {
-        message.warn(resultMsg || '删除失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      //message.error({ content: '发生异常，删除失败！', key: 'deleteDs' })
-    }
-  }
-
-  // 测试数据源连通性
-  @action testDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('测试中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.testDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('测试成功！')
-        if (_callbck) {
-          _callbck(resultCode)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn('链接失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'testDs' })
-    }
-  }
-  // 潍柴项目设置调度时间
-  @action setDataSourceTask = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      message.loading({ content: '设置中，请稍等...', key: 'setDataSourceTask' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.setDataSourceTask(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date() })
-        message.success({ content: '设置成功！', key: 'setDataSourceTask' })
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'setDataSourceTask' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'setDataSourceTask' })
-    }
-  }
-  // 潍柴手动同步数据源信息
-  @action manualSyncDataSourceMeta = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      //message.loading({ content: '设置中，请稍等...', key: 'manualSyncDataSourceMeta' })
-      const loaddingDialog = message.loading('设置中，请稍等...', 5)
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.manualSyncDataSourceMeta(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        /*
-         * 设置成功，不需要进行提示
-         * message.success({ content: '设置成功！', key: 'manualSyncDataSourceMeta' })
-         */
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'manualSyncDataSourceMeta' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-  // 潍柴获取数据源同步状态
-  @action queryDsSyncStatus = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDsSyncStatus(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        if (data && data.latestSyncStatus == 'success') {
-          message.success({ content: '数据同步成功!' })
-        } else if (data && data.latestSyncStatus == 'fail') {
-          message.success({ content: '数据同步失败!' })
-        }
-        if (_callbck) {
-          _callbck(resultMsg, data)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const businessWarningMod = new BusinessWarningMod()
-export default businessWarningMod

src/pages/businessWarning/list/businessWarningServ.js

@@ -1,138 +0,0 @@
-import request from '@utils/request'
-
-export default class {
-  //创建数据源
-  static addDs(params) {
-    return request({
-      url: 'api/biz/table/config/insertBizTableConfigEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 根据id查询业务预警定义详情
-  static selectById(alarmDefId) {
-    return request({
-      url: `api/bus/alarm/def/selectById/${alarmDefId}`,
-      method: 'get',
-      headers: {
-        'Content-type': 'application/json'
-      },
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  /**
- * 记录下载操作的日志
- */
-  static recordLogOfDownload(params) {
-    return request({
-      url: `api/biz/table/config/downloadTempFile/${params}`,
-      method: 'POST',
-      responseType: 'arraybuffer',
-      // data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  //更新数据源
-  static updateDs(params) {
-    return request({
-      url: 'api/bus/alarm/def/updateBusAlarmDefEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 删除数据源
-  static deleteDs(params) {
-    return request({
-      url: 'api/os/datasource/info/deleteById/' + params.id,
-      method: 'DELETE',
-      //data: params,
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 测试数据源连通性
-  static testDs(params) {
-    return request({
-      url: 'api/os/datasource/info/testConnect',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询数据源类型
-  static queryDbType(params) {
-    return request({
-      url: 'api/biz/table/config/queryDsListForBizConf',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询数据源类型
-  static pageQueryDsInfo(params) {
-    return request({
-      url: `api/bus/alarm/def/pageQueryBusAlarmDef`,
-      method: 'post',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  //潍柴项目，设置调度任务
-  static setDataSourceTask(params) {
-    return request({
-      url: 'api/os/datasource/info/setDataSourceTask',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-
-  //潍柴项目，手动同步数据源
-  static manualSyncDataSourceMeta(params) {
-    return request({
-      url: 'api/os/datasource/info/manualSyncDataSourceMeta?dsId=' + params.dsId,
-      method: 'GET',
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-  //潍柴项目，获取数据源同步状态
-  static queryDsSyncStatus(params) {
-    return request({
-      url: `api/os/datasource/info/queryDetail/${params}`,
-      method: 'GET',
-    })
-  }
-}

src/pages/businessWarning/list/businessWarningView.jsx

@@ -1,439 +0,0 @@
-/*
- * 业务预警列表
- * @Author: dayan_hjm 
- * @Date: 2023-06-14 15:57:57 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2023-07-07 16:02:11
- */
-
-import React, { Component } from "react";
-import { useHistory, useLocation, withRouter } from "react-router-dom";
-import { Table, Button, Radio, Modal, Input, Select, message, DatePicker, TimePicker, Upload, Row, Col } from 'antd'
-import { Form } from '@ant-design/compatible';
-import { QuestionCircleOutlined, UploadOutlined, EditOutlined, CloseOutlined, DeleteOutlined } from '@ant-design/icons';
-import '@ant-design/compatible/assets/index.css';
-import { observer } from 'mobx-react'
-import { isEmpty, uniqueId, get } from 'lodash'
-import { Encrypt, Decrypt } from "@utils/util"
-import moment from 'moment'
-const FormItem = Form.Item;
-import utils from "@utils/index";
-import {
-    getAllTableConfigs, // 文件上传分页
-    preViewFillInData
-} from "@apis/system";
-
-// 站点配置
-import config from '@config/config';
-import TreeSelectModel from "@pages/frame/component/TreeSelectModel/view.jsx";
-
-// 引入当前页样式 - 模块化
-import styles from './businessWarningless.less'
-// 多类名样式管理工具
-import { toJS } from 'mobx'
-import businessWarningMod from './businessWarningMod';
-
-@withRouter
-class businessWarningView extends Component {
-    // 构造函数，组件的实例创建时，最先执行
-    constructor(props, context) {
-        super(props, context)
-        // 注入的businessWarningMod
-        this.stores = businessWarningMod;
-        this.state = {
-            total_: {
-                total: 0,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            bizTableConfigId: 0,
-            total: 0,
-            searchParam: {
-                alarmName: '',
-                pageNum: 1,
-                pageSize: 10,
-            },
-            visible: false,
-            resetRoom: [
-                "excludeShopInfos",
-                "startDate",
-                "endDate",
-                "alarmHour",
-            ],
-        }
-        this.TreeSelectRef = null;
-    }
-
-    componentDidMount() {
-        this.loadRoles()
-        this.stores.queryDbType()
-    }
-
-    loadRoles(attrs = []) {
-        const { searchParam } = this.state;
-        let params = { ...searchParam, ...attrs };
-        this.stores.pageQueryDsInfoMod(params, (res = 0) => {
-            this.setState({ total: res })
-        })
-    };
-
-    inputChange(key, value) {
-        this.stores.updateState({
-            formData: {
-                [key]: value
-            }
-        })
-    }
-
-    // 渲染新增修改表单
-    renderForm() {
-        const { getFieldDecorator } = this.props.form
-        const { formData = {}, dbTypeList } = toJS(this.stores.state);
-        const timeList = [];
-        for (let index = 1; index < 25; index++) {
-            timeList.push({ key: index+'', name: '每天' + index + '点' })
-        }
-
-        return (
-            <Form layout="horizontal" labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} form={this.props.form}>
-
-                <FormItem label="预警开始日期">
-                    {getFieldDecorator('startDate', {
-                        rules: [
-                            { required: true, message: '请选择预警开始日期' },
-                        ],
-                        initialValue: formData.startDate
-                    })(
-                        <DatePicker style={{ width: "100%" }} format={'YYYY-MM-DD'} onChange={(e, dateString) => this.inputChange('startDate', dateString)} />
-                    )}
-                </FormItem>
-                <FormItem label="预警结束日期">
-                    {getFieldDecorator('endDate', {
-                        rules: [
-                            { required: true, message: '请选择预警结束日期' },
-                        ],
-                        initialValue: formData.endDate
-                    })(
-                        <DatePicker style={{ width: "100%" }} format={'YYYY-MM-DD'} onChange={(e, dateString) => this.inputChange('endDate', dateString)} />
-                    )}
-                </FormItem>
-                <FormItem label="预警周期">
-                    {getFieldDecorator('alarmHour', {
-                        rules: [
-                            { required: true, message: '请选择预警周期' },
-                        ],
-                        initialValue: formData.alarmHour
-                    })(
-                        <Select placeholder="选择时间" style={{ width: "calc(100% - 40px)" }} onChange={(e) =>
-                            this.inputChange('alarmHour', e)}>
-                            {timeList.map((item) => (
-                                <Option key={item.key} value={item.key}>{item.name}</Option>
-                            ))}
-                        </Select>
-
-                        // <div style={{ display: "flex", "justify-content": "space-between" }}>
-                        //     <span style={{ color: "#ccc", "font-size": "12px" }}>每天</span>
-                        //     <Select placeholder="选择时间" style={{ width: "calc(100% - 40px)" }} onChange={(e) => 
-                        //         this.inputChange('alarmHour', e)}>
-                        //         {timeList.map((item) => (
-                        //             <Option key={item.key} value={item.key}>{item.name}</Option>
-                        //         ))}
-                        //     </Select>
-                        //     {/* <TimePicker format={'h:mm:ss'} style={{ width: "95%" }} onChange={(e) => {
-                        //         this.inputChange('alarmHour', e)
-                        //     }} defaultOpenValue={moment('00:00:00', 'HH:mm:ss')} /> */}
-                        // </div>
-                    )}
-                </FormItem>
-                <FormItem label="是否通知">
-                    {getFieldDecorator('ifNotify', {
-                        rules: [
-                            { required: true, message: '是否通知' },
-                        ],
-                        initialValue: formData.ifNotify
-                    })(
-                        <Radio.Group onChange={(e) => this.inputChange('ifNotify', e.target.value)}>
-                            <Radio value={true}>是</Radio>
-                            <Radio value={false}>否</Radio>
-                        </Radio.Group>)}
-                </FormItem>
-                <FormItem label='排除门店'>
-                    {getFieldDecorator('excludeShopInfos', {
-                        rules: [{ required: false, message: '请选择排除门店' }],
-                        initialValue: formData.excludeShopInfos
-                    })(
-                        <TreeSelectModel onRef={(ref) => {
-                            this.TreeSelectRef = ref
-                        }} avtiveId={''} justQy={true} />
-                    )}
-                </FormItem>
-            </Form>
-        )
-    }
-
-    handleCancel() {
-        this.setState({ visible: false })
-        this.props.form.resetFields(this.state.resetRoom)
-        // 延期清除表单数据，处理关闭时，闪烁问题
-        setTimeout(() => {
-            this.stores.restForm({})
-        }, 100)
-    }
-
-    handleOk() {
-        const { validateFieldsAndScroll } = this.props.form
-        const { formData } = toJS(this.stores.state)
-        validateFieldsAndScroll((err, valus) => {
-            if (isEmpty(err)) {
-                if (formData.alarmDefId) {
-                    let excludeShopInfos = [];
-                    get(this.TreeSelectRef.state, "shop", []).map(x => {
-                        const hasNum =x.indexOf('@') > -1 ? x.split('@')[1] : x ? true : false;
-                        let activeTree = utils.findNodeTree(this.TreeSelectRef.state.shopData, x, "dataResourceName", "children",hasNum ? "dataResourceType" : '');
-                        if (activeTree) { excludeShopInfos.push({ shopCode: activeTree.shopCode, shopName: activeTree.dataResourceName }) }
-                    })
-
-                    formData.excludeShopInfos = excludeShopInfos;
-                    //处理未更改的时间格式x
-                    formData.endDate = moment(formData.endDate).format('YYYY-MM-DD')
-                    formData.startDate = moment(formData.startDate).format('YYYY-MM-DD')
-                    // if(formData.endDate.indexOf('T') > -1){
-                    //     formData.endDate = formData.endDate.split('T')[0]
-                    // }
-                    // if(formData.startDate.indexOf('T') > -1){
-                    //     formData.startDate = formData.startDate.split('T')[0]
-                    // }
-                    this.stores.updateDs(formData, () => {
-                        // this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm();
-                            this.setState({ visible: false })
-                        }, 100)
-                        this.loadRoles()
-                    })
-                } else {
-                    this.stores.addDs(formData, () => {
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                            this.setState({ visible: false })
-                        }, 100)
-                        this.loadRoles()
-                    })
-                }
-            }
-        })
-    }
-    renderModalFooter() {
-        const { loading, formData } = this.stores.state
-
-        return (
-            <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-                <div>
-                    <Button key="back" style={{ display: 'inline' }} onClick={() => this.handleCancel()}>
-                        取消
-                    </Button>
-
-                    <Button
-                        key="submit"
-                        type="primary"
-                        style={{ display: 'inline', marginLeft: '10px' }}
-                        loading={loading}
-                        onClick={() => this.handleOk()}
-                    >
-                        确定
-                    </Button>
-                </div>
-            </div>
-        )
-    }
-
-    getParam() {
-        const { searchParam, total_, bizTableConfigId, total } = this.state;
-
-        return {
-            scroll: { x: 1000 },
-            pagination: {
-                onChange: (pageNum) => {
-                    searchParam.pageNum = pageNum;
-                    this.setState({ ...searchParam });
-                    this.loadRoles();
-                },
-                current: searchParam.pageNum,
-                total,
-                pageSize: searchParam.pageSize,
-            },
-            columns: [
-                //key=one的表头
-                {
-                    title: '监控名称',
-                    dataIndex: 'alarmName'
-                },
-                {
-                    title: '监控周期',
-                    dataIndex: 'alarmHour',
-                    render: (data, row) => {
-                        return <span>每日{data}点</span>
-                    }
-                },
-                {
-                    title: '监控开始日期',
-                    dataIndex: 'startDate'
-                },
-                {
-                    title: '监控结束日期',
-                    dataIndex: 'endDate'
-                },
-                {
-                    title: '创建时间',
-                    dataIndex: 'createTime'
-                },
-                {
-                    title: '操作',
-                    // fixed: 'right',
-                    // width: 250,
-                    render: (val, record) => {
-                        let data = record;
-                        return (
-                            <span style={{ marginRight: "24px" }}>
-                                <a
-                                    onClick={() => {
-                                        this.stores.selectById(record.alarmDefId, (res => {
-                                            this.setState({ bizTableConfigId: data.alarmDefId })
-                                            const {
-                                                ifNotify,
-                                                startDate = "",
-                                                endDate = "",
-                                                alarmHour,
-                                                alarmDefId,
-                                                excludeShopInfos = []
-                                            } = data
-                                            console.log(moment(startDate, 'YYYY-MM-DD'));
-                                            const editData = {
-                                                ifNotify,
-                                                startDate: moment(startDate, 'YYYY-MM-DD'),
-                                                endDate: moment(endDate, 'YYYY-MM-DD'),
-                                                alarmHour,
-                                                alarmDefId,
-                                                excludeShopInfos
-                                            }
-                                            let shopArr = [];
-                                            const exclude_ = excludeShopInfos && excludeShopInfos.length > 0 ? excludeShopInfos.map(x => {
-                                                shopArr.push({ value: x.shopName, title: x.shopName, key: x.shopName,dataResourceName:x.shopName, ...x })
-                                                return x.shopName
-                                            }) : [];
-                                            this.stores.updateState({ createType: 'edit', formData: editData });
-                                            setTimeout(() => {
-                                                this.setState({ visible: true });
-                                                if (exclude_ && exclude_.length > 0) {
-                                                    setTimeout(() => {
-                                                        this.TreeSelectRef.setState({ shopData:shopArr,shop: exclude_ })
-                                                    }, 1000)
-                                                }
-                                            }, 500)
-                                        }))
-                                    }}
-                                >
-                                    配置预警规则
-                                </a>
-                            </span>
-                        )
-                    }
-                }
-            ],
-            dataSource: toJS(this.stores.state.tableArr)
-        }
-    }
-    render() {
-        const { createType } = this.stores.state;
-        const { searchParam, visible } = this.state;
-        const param = this.getParam();
-
-        return (
-            <div className={styles.sys_account}>
-                <div className="module_search">
-                    <div className="module_title space">查询条件</div>
-                    <Row type="flex" justify="start" align="middle">
-                        <Col>
-                            <span>监控名称：</span>
-                            <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.alarmName}
-                                placeholder="请输入监控名称"
-                                onChange={(e) => {
-                                    searchParam.alarmName = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input>
-                        </Col>
-                    </Row>
-                    <Row type="flex" justify="end" align="middle">
-                        <Col>
-                            <Button
-                                type="primary"
-                                onClick={(e) => {
-                                    this.loadRoles();
-                                }}
-                            >
-                                搜索
-                            </Button>
-                        </Col>
-                        <Col>
-                            <Button
-                                // type="text"
-                                style={{ marginLeft: 14 }}
-                                onClick={(e) => {
-                                    searchParam.alarmName = "";
-                                    searchParam.pageNum = 1;
-                                    this.setState({ ...searchParam });
-                                    this.loadRoles();
-                                }}
-                            >
-                                重置
-                            </Button>
-                        </Col>
-                    </Row>
-                </div>
-
-                <div className="module_body">
-                    <div className="title_with_btn list_top">
-                        <div className="module_title">业务预警列表</div>
-                    </div>
-                    <Table style={{ marginTop: "16px" }} {...param}></Table>
-                </div>
-
-
-                <Modal
-                    destroyOnClose
-                    width="900px"
-                    title={createType === 'add' ? '预警规则' : '预警规则'}
-                    className={styles.DataSourceAddModal}
-                    visible={visible}
-                    onCancel={() => {
-                        this.setState({ visible: false })
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                        }, 100)
-                    }}
-                    footer={this.renderModalFooter()}
-                >
-                    {this.renderForm()}
-                </Modal>
-
-            </div>
-        )
-    }
-}
-export default Form.create()(businessWarningView)
-// export default businessWarningView;

src/pages/businessWarning/monitoringList/monitoringLess.less

@@ -1,120 +0,0 @@
-// 其中assets文件夹已经做了webpack别名配置，不需要再使用../../访问，直接加个波浪线
-
-:global {
-  .ant-modal {
-    top: 50px;
-  }
-  .dy_module_search{
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    .ant-row{
-      width: 80%;
-    }
-  }
-
-}
-
-.sys_account {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-
-  :global {
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-
-.sys_account {
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-    .module_search,
-    .module_line {
-      border-bottom: 8px solid #f5f5f5;
-      padding-bottom: 20px;
-    }
-    
-    .cursor {
-      cursor: pointer;
-    }
-
-    .col_blue {
-      color: #009F95;
-    }
-
-    .flex {
-      display: flex;
-    }
-
-    .module_body {
-      .list_top {
-        display: flex;
-        justify-content: space-between;
-
-        .module_button_area {
-          button {
-            float: right;
-            margin-left: 10px;
-          }
-        }
-      }
-    }
-
-    .ckxq_but {
-      cursor: pointer;
-      color: skyblue;
-    }
-
-  }
-}
-
-.DataSourceAddModal {
-  :global {
-    .ant-form-item-children>div {
-      display: inline-block !important;
-    }
-
-    .ant-form-explain {
-      font-weight: 400;
-      font-size: 12px;
-      line-height: normal;
-      color: #e54747;
-      padding-top: 4px;
-    }
-
-    .has-error .ant-input,
-    .has-error .ant-select-selector {
-      color: rgba(0, 0, 0, 0.6);
-      background-color: #fff;
-      border: 1px #e54747 solid;
-    }
-  }
-}

src/pages/businessWarning/monitoringList/monitoringMod.js

@@ -1,428 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, runInAction, autorun, toJS, computed, makeObservable } from 'mobx'
-// 工具方法
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-// 引入Serv
-import Serv from './monitoringServ'
-import { message } from 'antd'
-
-
-// 严格模式
-configure({
-  enforceActions: 'observed'
-});
-
-const defaultForm = {
-  dsId: '',
-  bizTableConfigName: '',
-  endTime: '',
-  dayTime: '',
-}
-
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class MonitoringMod {
-  constructor() {
-    makeObservable(this);
-  }
-
-  // 监视状态
-  @observable state = {
-    visible: false,
-    createType: 'add', //创建类型，add:新增，edit：修改
-    formData: cloneDeep(defaultForm),
-    version: '',
-    loading: false,
-    dbTypeList: [],
-    tableArr: [{ bizTableKey: 1 }],
-    shengList:[],
-    shiList:[],
-    quList:[],
-    shopList:[],
-    activeData: {
-      type: 1,
-      num1: 0,
-      num2: 0,
-      title: ''
-    }
-  }
-
-  /*
-   * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-   * 设置内容可视性
-   */
-  @action updateState = async (payload) => {
-    // 设置到状态机 - 如果是异步，必须在runInAction
-    runInAction(() => {
-      this.state = {
-        ...this.state,
-        ...payload,
-        formData: {
-          ...this.state.formData,
-          ...payload.formData
-        }
-      }
-    })
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 重置from表单
-  @action restForm = async (payload) => {
-    this.state.formData = cloneDeep(defaultForm)
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 创建数据源
-  @action addDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.addDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-    /**
-   * 记录下载操作的日志
-   */
-    @action recordLogOfDownload = async (params, callback) => {
-      try {
-        const res = await Serv.recordLogOfDownload(params);
-        const { resultCode, resultMsg, data } = res;
-        const fileName = decodeURI(res.headers['content-disposition'].split(";")[1].split("filename=")[1]);
-        callback && callback(data, fileName)
-      } catch (error) {
-        // message.error('请求异常！')
-      }
-    }
-
-
-  // 获取数据源类型
-  @action queryDbType = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbType(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const dbTypeList = data ? data : []
-        this.updateState({
-          dbTypeList: dbTypeList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 获取省份
-  @action queryDbTypeSheng = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbTypeSheng(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const shengList = data ? data.filter((ele) => ele !== null && ele !== 'null') : []
-        this.updateState({
-          shengList: shengList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 获取区域
-  @action queryDbTypeQu = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbTypeQu(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const quList = data ? data.filter((ele) => ele !== null && ele !== 'null') : []
-        this.updateState({
-          quList: quList
-        })
-      }
-    } catch (error) { }
-  }
-  // 获取市
-  @action queryDbTypeShi = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbTypeShi(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const shiList = data ? data.filter((ele) => ele !== null && ele !== 'null') : []
-        this.updateState({
-          shiList: shiList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 获取门店
-  @action queryDbTypeShop = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbTypeShop(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const shopList = data ? data : []
-        this.updateState({
-          shopList: shopList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 分页查询数据源信息
-  @action pageQueryDsInfoMod = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr = get(data, "records", []);
-        this.updateState({
-          tableArr: tableArr
-        })
-        callback && callback(data.total)
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-
-
-  // 修改数据源
-  @action updateDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.updateDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-  // 根据id查询业务预警定义详情
-  @action selectById = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      const { resultCode, resultMsg, data } = await Serv.selectById(params)
-      if (resultCode == '0') {
-        if (_callbck) {
-          _callbck(data)
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-    }
-  }
-
-  // 实例预警数据重推企业微信
-  @action rePushBusAlarmInstanceToQw = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      const { resultCode, resultMsg, data } = await Serv.rePushBusAlarmInstanceToQw(params)
-      if (resultCode == '0') {
-        message.success('操作成功!');
-        if (_callbck) {
-          _callbck(data)
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-    }
-  }
-
-
-  @action pageQueryBusAlarmDetail = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryBusAlarmDetail(params)
-      if (resultCode == '0') {
-        callback && callback(data)
-      } else {
-        message.warn(resultMsg || '删除失败！')
-      }
-    } catch (error) {
-      //message.error({ content: '发生异常，删除失败！', key: 'deleteDs' })
-    }
-  }
-
-  // 测试数据源连通性
-  @action testDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.testDs(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('测试成功！')
-        if (_callbck) {
-          _callbck(resultCode)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn('链接失败！')
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'testDs' })
-    }
-  }
-  // 潍柴项目设置调度时间
-  @action setDataSourceTask = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      message.loading({ content: '设置中，请稍等...', key: 'setDataSourceTask' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.setDataSourceTask(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date() })
-        message.success({ content: '设置成功！', key: 'setDataSourceTask' })
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'setDataSourceTask' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'setDataSourceTask' })
-    }
-  }
-  
-  // 潍柴手动同步数据源信息
-  @action manualSyncDataSourceMeta = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      //message.loading({ content: '设置中，请稍等...', key: 'manualSyncDataSourceMeta' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.manualSyncDataSourceMeta(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        /*
-         * 设置成功，不需要进行提示
-         * message.success({ content: '设置成功！', key: 'manualSyncDataSourceMeta' })
-         */
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'manualSyncDataSourceMeta' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-  // 潍柴获取数据源同步状态
-  @action queryDsSyncStatus = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDsSyncStatus(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        if (data && data.latestSyncStatus == 'success') {
-          message.success({ content: '数据同步成功!' })
-        } else if (data && data.latestSyncStatus == 'fail') {
-          message.success({ content: '数据同步失败!' })
-        }
-        if (_callbck) {
-          _callbck(resultMsg, data)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const monitoringMod = new MonitoringMod()
-export default monitoringMod

src/pages/businessWarning/monitoringList/monitoringServ.js

@@ -1,195 +0,0 @@
-import request from '@utils/request'
-
-export default class {
-  //创建数据源
-  static addDs(params) {
-    return request({
-      url: 'api/biz/table/config/insertBizTableConfigEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  /**
- * 记录下载操作的日志
- */
-  static recordLogOfDownload(params) {
-    return request({
-      url: `api/bus/alarm/detail/pageQueryBusAlarmDetailForExport`,
-      method: 'POST',
-      responseType: 'arraybuffer',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  //更新数据源
-  static updateDs(params) {
-    return request({
-      url: 'api/biz/table/config/updateBizTableConfigEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 删除数据源
-  static deleteDs(params) {
-    return request({
-      url: 'api/os/datasource/info/deleteById/' + params.id,
-      method: 'DELETE',
-      //data: params,
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 测试数据源连通性
-  static testDs(params) {
-    return request({
-      url: 'api/os/datasource/info/testConnect',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询数据源类型
-  static queryDbType(params) {
-    return request({
-      url: 'api/biz/table/config/queryDsListForBizConf',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询省份
-  static queryDbTypeSheng(params) {
-    return request({
-      url: 'api/bus/alarm/detail/listProvNameByAlarmInstanceId',
-      method: 'GET',
-      data:params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询省份
-  static queryDbTypeQu(params) {
-    return request({
-      url: 'api/bus/alarm/detail/listOperCenterNameByAlarmInstanceId',
-      method: 'GET',
-      data:params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询市
-  static queryDbTypeShi(params) {
-    return request({
-      data:params,
-      url: 'api/bus/alarm/detail/listCityNameByAlarmInstanceId',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询门店
-  static queryDbTypeShop(params) {
-    return request({
-      url: 'api/biz/table/config/queryDsListForBizConf',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询数据源类型
-  static pageQueryDsInfo(params) {
-    return request({
-      url: `api/bus/alarm/instance/pageQueryBusAlarmInstance`,
-      method: 'post',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 根据id查询业务预警定义详情
-  static selectById(alarmDefId) {
-    return request({
-      url: `api/bus/alarm/def/selectById/${alarmDefId}`,
-      method: 'get',
-      headers: {
-        'Content-type': 'application/json'
-      },
-      app: 'ide-op-mgmt-application'
-    })
-  }
-  // 实例预警数据重推企业微信
-  static rePushBusAlarmInstanceToQw(params) {
-    return request({
-      url: `api/bus/alarm/instance/rePushBusAlarmInstanceToQw?instanceId=${params}`,
-      method: 'post',
-      headers: {
-        'Content-type': 'application/json'
-      },
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-
-  //分页查询业务预警明细信息
-  static pageQueryBusAlarmDetail(params) {
-    return request({
-      url: 'api/bus/alarm/detail/pageQueryBusAlarmDetail',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-
-  //潍柴项目，手动同步数据源
-  static manualSyncDataSourceMeta(params) {
-    return request({
-      url: 'api/os/datasource/info/manualSyncDataSourceMeta?dsId=' + params.dsId,
-      method: 'GET',
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-  //潍柴项目，获取数据源同步状态
-  static queryDsSyncStatus(params) {
-    return request({
-      url: `api/os/datasource/info/queryDetail/${params}`,
-      method: 'GET',
-    })
-  }
-}

src/pages/businessWarning/monitoringList/monitoringView.jsx

@@ -1,857 +0,0 @@
-/*
- * 业务预警监控列表
- * @Author: dayan_hjm 
- * @Date: 2023-06-14 15:57:57 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2023-08-11 17:14:02
- */
-
-import React, { Component } from "react";
-import { useHistory, useLocation, withRouter } from "react-router-dom";
-import { Table, message, Button, Alert, Modal, Input, Select, Radio, DatePicker, TimePicker, Drawer, Row, Col } from 'antd'
-import { Form } from '@ant-design/compatible';
-import { QuestionCircleOutlined, UploadOutlined, EditOutlined, CloseOutlined, DeleteOutlined } from '@ant-design/icons';
-import '@ant-design/compatible/assets/index.css';
-import { observer } from 'mobx-react'
-import { isEmpty, get } from 'lodash'
-import moment from 'moment'
-const FormItem = Form.Item;
-const { TextArea } = Input;
-import { preRecordViewFillInData } from "@apis/system";
-
-// 引入当前页样式 - 模块化
-import styles from './monitoringless.less'
-// 多类名样式管理工具
-import { toJS } from 'mobx'
-import monitoringMod from './monitoringMod';
-
-@withRouter
-class monitoringView extends Component {
-    // 构造函数，组件的实例创建时，最先执行
-    constructor(props, context) {
-        super(props, context)
-        // 注入的monitoringMod
-        this.stores = monitoringMod;
-        this.state = {
-            searchParam2: {
-                operCenterName: '',
-                cityName: '',
-                provName: '',
-            },
-            activeTIP: {},
-            drawerVisible: false,
-            activeDrawer: {
-                message: '',
-                description: ''
-            },
-            total_: {
-                total: 0,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            total_2: {
-                total: 0,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            alarmInstanceId: '',
-            bizTableConfigId: 0,
-            total: 0,
-            searchParam: {
-                alarmName: '',
-                ifAlarm: "",
-                monitorDateStr: moment(moment(new Date(new Date(new Date().toLocaleDateString()).getTime() - 24 * 60 * 60 * 1000)).format('YYYY-MM-DD'), 'YYYY-MM-DD'),
-                pageNum: 1,
-                pageSize: 10,
-            },
-            visible: false,
-            resetRoom: [
-                "dsId",
-                "bizTableConfigName",
-                "endTime",
-                "dayTime",
-            ],
-        }
-    }
-
-    componentDidMount() {
-        this.loadRoles();
-        //获取省份数据
-        this.stores.queryDbType();
-    }
-
-    loadRoles(attrs = []) {
-        const { searchParam } = this.state;
-        let params = { ...searchParam, ...attrs };
-        params.monitorDateStr = params.monitorDateStr ? moment(params.monitorDateStr).format('YYYY-MM-DD') : ''
-        this.stores.pageQueryDsInfoMod(params, (res = 0) => {
-            this.setState({ total: res })
-        })
-    };
-
-    inputChange(key, value) {
-        this.stores.updateState({
-            formData: {
-                [key]: value
-            }
-        })
-    }
-
-    // 渲染新增修改表单
-    renderForm() {
-        const { getFieldDecorator } = this.props.form
-        const { formData = {}, dbTypeList } = toJS(this.stores.state)
-        return (
-            <Form layout="horizontal" labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} form={this.props.form}>
-
-                <FormItem label="预警开始日期">
-                    {getFieldDecorator('bizTableConfigName', {
-                        rules: [
-                            { required: true, message: '请选择预警开始日期' },
-                        ],
-                        initialValue: formData.bizTableConfigName
-                    })(
-                        <DatePicker style={{ width: "100%" }} format={'YYYY/MM/DD'} onChange={(e) => this.inputChange('bizTableConfigName', e)} />
-                    )}
-                </FormItem>
-                <FormItem label="预警结束日期">
-                    {getFieldDecorator('endTime', {
-                        rules: [
-                            { required: true, message: '请选择预警结束日期' },
-                        ],
-                        initialValue: formData.endTime
-                    })(
-                        <DatePicker style={{ width: "100%" }} format={'YYYY/MM/DD'} onChange={(e) => this.inputChange('endTime', e)} />
-                    )}
-                </FormItem>
-                <FormItem label="预警周期">
-                    {getFieldDecorator('dayTime', {
-                        rules: [
-                            { required: true, message: '请选择预警周期' },
-                        ],
-                        initialValue: formData.dayTime
-                    })(
-                        <div style={{ display: "flex", "justify-content": "space-between" }}>
-                            <span style={{ color: "#ccc", "font-size": "12px" }}>每天</span><TimePicker format={'h:mm:ss'} style={{ width: "95%" }} onChange={(e) => {
-                                this.inputChange('dayTime', e)
-                            }} defaultOpenValue={moment('00:00:00', 'HH:mm:ss')} />
-                        </div>
-                    )}
-                </FormItem>
-                <FormItem label='预警对象'>
-                    {getFieldDecorator('dsId', {
-                        rules: [{ required: false, message: '请选择预警对象' }],
-                        initialValue: formData.dsId
-                    })(
-                        <Select
-                            // disabled={formData.id ? true : false}
-                            placeholder={'请选择预警对象'}
-                            onChange={(value) => {
-                                this.inputChange('dsId', value)
-                            }}
-                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
-                        >
-                            {dbTypeList.map((item) => {
-                                return (
-                                    <Select.Option key={item.id} value={item.id}>
-                                        {item.name}
-                                    </Select.Option>
-                                )
-                            })}
-                        </Select>
-                    )}
-                </FormItem>
-            </Form>
-        )
-    }
-
-    handleCancel() {
-        const { searchParam2 } = this.state;
-        searchParam2.provName = "";
-        searchParam2.operCenterName = '';
-        searchParam2.cityName = '';
-        this.setState({ ...searchParam2 });
-
-        this.setState({ visible: false })
-        this.props.form.resetFields(this.state.resetRoom)
-        // 延期清除表单数据，处理关闭时，闪烁问题
-        setTimeout(() => {
-            this.stores.restForm({})
-        }, 100)
-    }
-
-    handleOk() {
-        const { validateFieldsAndScroll } = this.props.form
-        const { formData } = toJS(this.stores.state)
-        validateFieldsAndScroll((err, valus) => {
-            if (isEmpty(err)) {
-                if (formData.bizTableConfigId) {
-                    this.stores.updateDs(formData, () => {
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                            this.setState({ visible: false })
-                        }, 100)
-                        this.loadRoles()
-                    })
-                } else {
-                    this.stores.addDs(formData, () => {
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                            this.setState({ visible: false })
-                        }, 100)
-                        this.loadRoles()
-                    })
-                }
-            }
-        })
-    }
-    renderModalFooter() {
-        const { loading, formData } = this.stores.state
-
-        return (
-            <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-                <div>
-                    <Button key="back" style={{ display: 'inline' }} onClick={() => this.handleCancel()}>
-                        关闭
-                    </Button>
-                </div>
-            </div>
-        )
-    }
-
-    handleDownload = (par) => {
-        message.info('即将开始下载，请稍候...')
-        this.stores
-            .recordLogOfDownload(par, ((data, fileName) => {
-                var blob = new Blob([data], {
-                    type: "application/vnd.ms-excel",
-                });
-                var downloadElement = document.createElement("a");
-                downloadElement.download = fileName;
-                downloadElement.href = window.URL.createObjectURL(blob);
-                downloadElement.click();
-                document.body.appendChild(downloadElement);
-                document.body.removeChild(downloadElement);
-                window.URL.revokeObjectURL(downloadElement.href);
-            }))
-            .then((data) => {
-            })
-            .catch(() => {
-            })
-    }
-
-
-    getParam() {
-        const { searchParam, total_, bizTableConfigId, total } = this.state;
-
-        return {
-            scroll: { x: 1000 },
-            pagination: {
-                onChange: (pageNum) => {
-                    searchParam.pageNum = pageNum;
-                    this.setState({ ...searchParam });
-                    this.loadRoles();
-                },
-                current: searchParam.pageNum,
-                total,
-                pageSize: searchParam.pageSize,
-            },
-            columns: [
-                //key=one的表头
-                {
-                    title: '预警名称',
-                    dataIndex: 'alarmName'
-                },
-                {
-                    title: '预警周期',
-                    dataIndex: 'alarmHour',
-                    render: (data, row) => {
-                        return <span>每日{data}点</span>
-                    }
-                },
-                {
-                    title: '监控日期',
-                    dataIndex: 'monitorDate',
-                },
-                {
-                    title: '任务运行时间',
-                    dataIndex: 'monitorDateTime'
-                },
-                // {
-                //     title: '任务结束日期',
-                //     dataIndex: 'endDate'
-                // },
-
-                {
-                    title: '运行状态',
-                    dataIndex: 'ifSuccess',
-                    render: (data, row) => {
-                        return <span>{data ? '运行成功' : "运行失败"}</span>
-                    }
-                },
-                {
-                    title: '是否触发预警',
-                    dataIndex: 'ifAlarm',
-                    render: (data, row) => {
-                        return <span>{data ? '是' : "否"}</span>
-                    }
-                },
-                {
-                    title: '推送企微结果',
-                    dataIndex: 'ifPushQwSuccess',
-                    render: (data, row) => {
-                        if (row.ifSuccess && row.ifPushQwSuccess) {
-                            return <span>成功</span>
-                        } else if (row.ifSuccess && !row.ifPushQwSuccess) {
-                            return <span type="link" style={{ "text-decoration": "underline", "color": "blue", "cursor": "pointer" }} onClick={() => {
-                                this.setState({
-                                    drawerVisible: true, activeDrawer: {
-                                        message: `${row.alarmName}-推送企微错误原因`,
-                                        style: {
-                                            width: 600,
-                                        },
-                                        description: `${row.pushQwDesc}`,
-                                    }
-                                })
-                            }}>失败</span>
-                        } else if (!row.ifSuccess) {
-                            return <span>-</span>
-                        }
-                    }
-                },
-                {
-                    title: '操作',
-                    // fixed: 'right',
-                    // width: 250,
-                    render: (val, record) => {
-                        let data = record;
-                        const { total_2 } = this.state;
-                        const { activeData } = this.stores.state;
-                        return (
-                            <span style={{ marginRight: "24px" }}>
-                                {
-                                    record.ifAlarm ? <a
-                                        onClick={() => {
-                                            let str = "";
-                                            this.stores.selectById(record.alarmDefId, (res) => {
-                                                this.stores.queryDbTypeSheng({ alarmInstanceId: record.alarmInstanceId })
-                                                this.stores.queryDbTypeQu({ alarmInstanceId: record.alarmInstanceId })
-                                                this.stores.queryDbTypeShi({ alarmInstanceId: record.alarmInstanceId })
-
-                                                str = res ? (record.alarmType == 4 ? `GMV比上周涨幅阈值>${res.gmvThreshold || 0}元 或 单均价>${res.orderAvgPriceThreshold || 0}元 或 杯均价>${res.cupAvgPriceThreshold || 0}元 或 单均销量>${res.orderCupNumThreshold || 0}元` :
-                                                    `店均(堂食/外卖)环比、同比降幅(全国业绩大屏)< ${res.decreaseThreshold}%`) : "";
-                                                this.setState({ activeTIP: res });
-                                                this.stores.pageQueryBusAlarmDetail({
-                                                    alarmInstanceId: record.alarmInstanceId,
-                                                    pageSize: total_2.pageSize,
-                                                    pageNum: total_2.pageNum,
-                                                }, (res => {
-                                                    this.setState({ alarmInstanceId: record.alarmInstanceId, uploadList: get(res, "records", []), total_2: { ...total_2, total: res.total } })
-                                                    this.stores.updateState({
-                                                        activeData: {
-                                                            ...activeData,
-                                                            ...record,
-                                                            regulation: str,
-                                                            type: record.alarmType,//1、营运中心业绩2、省份业绩3、城市业绩4、门店业绩
-                                                        }
-                                                    });
-                                                    console.log(activeData)
-                                                    setTimeout(() => {
-                                                        this.setState({ visible: true });
-                                                    }, 200)
-                                                }))
-                                            })
-                                        }}
-                                    >
-                                        查看监控结果
-                                    </a>
-                                        : null
-                                }
-                                {
-                                    record.ifSuccess && !record.ifPushQwSuccess ? <a style={{ "margin-left": record.ifAlarm ? "10px" : 0 }} onClick={() => {
-                                        this.stores.rePushBusAlarmInstanceToQw(record.alarmInstanceId, (res) => {
-                                            this.loadRoles()
-                                        })
-                                    }}
-                                    >
-                                        重推企微
-                                    </a>
-                                        : null
-                                }
-                            </span>
-                        )
-                    }
-                }
-            ],
-            dataSource: toJS(this.stores.state.tableArr)
-
-        }
-    }
-
-    getRed(data, type) {
-        const arr_ = ["", "gmvThreshold", "orderAvgPriceThreshold", "cupAvgPriceThreshold", "", "decreaseThreshold"]
-        let color_ = "unset";
-        const { activeTIP } = this.state;
-        if (data && activeTIP) {
-            if (type != 5) {
-                color_ = Number(data) > Number(activeTIP[arr_[type]]) ? "red" : 'unset';
-            } else {
-                color_ = Number(data) < Number(activeTIP[arr_[type]]) ? "red" : 'unset';
-            }
-        }
-        return <span style={{ color: color_ }}>{data}</span>
-    }
-
-    noticeTableOPt() {
-        const { total_2, alarmInstanceId } = this.state;
-        const q_ = ["", "监控区域", "监控省份", "监控城市"];
-        const d_ = ["", "operCenterName", "provName", "cityName"];
-        const noticeTableOPt_modal = {
-            dataSource: this.state.uploadList,
-            columns: this.stores.state.activeData.type != 4 ? [
-                ...(() => {
-                    return this.stores.state.activeData.type != 1 ? [
-                        {
-                            title: '营运中心',
-                            dataIndex: 'operCenterName',
-                        }
-                    ] : []
-                })(),
-                ...(() => {
-                    return this.stores.state.activeData.type != 1 && this.stores.state.activeData.type != 2 ? [
-                        {
-                            title: '省份',
-                            dataIndex: 'provName',
-                        }
-                    ] : []
-                })(),
-                {
-                    title: q_[this.stores.state.activeData.type],
-                    dataIndex: d_[this.stores.state.activeData.type],
-                },
-                {
-                    title: '本月预警次数',
-                    dataIndex: 'warningNumberOfMonth',
-                },
-                {
-                    title: '堂食店均',
-                    dataIndex: 'averageShopDine',
-                },
-                {
-                    title: '堂食店均周环比',
-                    dataIndex: 'averageShopDineWeekRatio',
-                    render: (data, row) => {
-                        return this.getRed(data, 5);
-                    }
-                },
-                {
-                    title: '堂食店均年同比',
-                    dataIndex: 'averageShopDineYearRatio',
-                    render: (data, row) => {
-                        return this.getRed(data, 5);
-                    }
-                },
-                {
-                    title: '外卖店均',
-                    dataIndex: 'averageShopTakeout',
-                },
-                {
-                    title: '外卖店均周环比',
-                    dataIndex: 'averageShopTakeoutWeekRatio',
-                    render: (data, row) => {
-                        return this.getRed(data, 5);
-                    }
-                },
-                {
-                    title: '外卖店均年同比',
-                    dataIndex: 'averageShopTakeoutYearRatio',
-                    render: (data, row) => {
-                        return this.getRed(data, 5);
-                    }
-                },
-            ] : [
-                {
-                    title: '门店ID',
-                    dataIndex: 'shopCode',
-                },
-                {
-                    title: '门店名称',
-                    dataIndex: 'shopName',
-                },
-                {
-                    title: '营运中心',
-                    dataIndex: 'operCenterName',
-                },
-                {
-                    title: '省份',
-                    dataIndex: 'provName',
-                },
-                {
-                    title: '城市',
-                    dataIndex: 'cityName',
-                },                
-                {
-                    title: '本月预警次数',
-                    dataIndex: 'warningNumberOfMonth',
-                },
-                {
-                    title: '流水金额',
-                    dataIndex: 'turnoverAmount',
-                },
-                {
-                    title: '流水金额相比上周波动',
-                    dataIndex: 'turnoverAmountFluctuates',
-                    render: (data, row) => {
-                        return this.getRed(data, 1);
-                    }
-                },
-                {
-                    title: '单均价',
-                    dataIndex: 'averagePriceOfTurnoverAmount',
-                    render: (data, row) => {
-                        return this.getRed(data, 2);
-                    }
-                },
-                {
-                    title: '杯均价',
-                    dataIndex: 'averageCupOfTurnoverAmount',
-                    render: (data, row) => {
-                        return this.getRed(data, 3);
-                    }
-                },
-                {
-                    title: '异常杯量的订单量',
-                    dataIndex: 'singleCupNumber',
-                    render: (data, row) => {
-                        return <span style={{ color: data && Number(data) > 0 ? 'red' : 'unset' }}>{data}</span>
-                    }
-                },
-            ],
-            pagination: {
-                showSizeChanger: false,
-                onChange: (pageNum) => {
-                    this.stores.pageQueryBusAlarmDetail({
-                        alarmInstanceId: alarmInstanceId,
-                        pageSize: total_2.pageSize,
-                        pageNum: pageNum,
-                    }, (res => {
-                        this.setState({ uploadList: get(res, "records", []), total_2: { ...total_2, total: res.total, pageNum: pageNum } })
-                    }))
-                },
-                total: total_2.total,
-                pageSize: total_2.pageSize,
-                current: Number(total_2.pageNum),
-            },
-
-            scroll: { x: 1000 },
-        };
-        return noticeTableOPt_modal
-    }
-    render() {
-        const { activeData, shengList = [], quList = [], shiList = [], shopList = [], } = this.stores.state;
-        const { searchParam, visible, activeDrawer, searchParam2, total_,total_2, alarmInstanceId } = this.state;
-        const param = this.getParam();
-
-        return (
-            <div className={styles.sys_account}>
-                <div className="module_search">
-                    <div className="module_title space">查询条件</div>
-                    <Row type="flex" justify="start" align="middle">
-                        <Col span={6}>
-                            <span>监控日期：</span>
-                            <DatePicker style={{ width: "180px" }} format={'YYYY-MM-DD'}
-                                defaultValue={searchParam.monitorDateStr}
-                                onChange={(e, dateString) => {
-                                    searchParam.monitorDateStr = dateString;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e, dateString) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            />
-                            {/* <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.monitorDateStr}
-                                placeholder="请输入监控日期"
-                                onChange={(e) => {
-                                    searchParam.monitorDateStr = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input> */}
-                        </Col>
-                        <Col span={6}>
-                            <span>预警名称：</span>
-                            <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.alarmName}
-                                placeholder="请输入预警名称"
-                                onChange={(e) => {
-                                    searchParam.alarmName = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input>
-                        </Col>
-                        <Col span={6}>
-                            <span>是否预警：</span>
-                            <Radio.Group value={searchParam.ifAlarm} onKeyDown={(e) => {
-                                if (e.keyCode === 13) {
-                                    searchParam.pageNum = 1;
-                                    this.setState(searchParam);
-                                    this.loadRoles();
-                                }
-                            }}
-                                onChange={(e) => {
-                                    searchParam.ifAlarm = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}>
-                                <Radio value={true}>是</Radio>
-                                <Radio value={false}>否</Radio>
-                            </Radio.Group>
-                        </Col>
-                    </Row>
-                    <Row type="flex" justify="end" align="middle">
-                        <Col>
-                            <Button
-                                type="primary"
-                                onClick={(e) => {
-                                    this.loadRoles();
-                                }}
-                            >
-                                搜索
-                            </Button>
-                        </Col>
-                        <Col>
-                            <Button
-                                // type="text"
-                                style={{ marginLeft: 14 }}
-                                onClick={(e) => {
-                                    searchParam.alarmName = "";
-                                    searchParam.monitorDateStr = '';
-                                    searchParam.pageNum = 1;
-                                    searchParam.ifAlarm = "";
-                                    this.setState({ ...searchParam });
-                                    this.loadRoles();
-                                }}
-                            >
-                                重置
-                            </Button>
-                        </Col>
-                    </Row>
-                </div>
-
-                <div className="module_body">
-                    <div className="title_with_btn list_top">
-                        <div className="module_title">业务预警监控列表</div>
-                    </div>
-                    <Table style={{ marginTop: "16px" }} {...param}></Table>
-                </div>
-
-
-                <Modal
-                    destroyOnClose
-                    width="1300px"
-                    title={'监控结果'}
-                    className={styles.DataSourceAddModal}
-                    visible={visible}
-                    onCancel={() => {
-                        searchParam2.provName = "";
-                        searchParam2.operCenterName = '';
-                        searchParam2.cityName = '';
-                        this.setState({ ...searchParam2 });
-
-                        this.setState({ visible: false, })
-                        
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                        }, 100)
-                    }}
-                    footer={this.renderModalFooter()}
-                >
-                    <Alert message={<p><strong style={{ marginRight: '5px' }}>{activeData.monitorDate}</strong><strong>{activeData.alarmName}</strong></p>
-                    } type="info" showIcon />
-                    <p style={{ margin: '0 0 8px 17px', fontSize: '12px' }}>预警规则: {activeData.regulation}</p>
-                    {/* <p style={{margin:'0 0 8px 17px',fontSize: '12px'}}>已监控区域: <strong style={{ color: "#358dcf", marginRight: '5px' }}>{activeData.num1}</strong>告警区域: <strong style={{ color: "red" }}>{activeData.num2}</strong></p>
-                    <p style={{margin:'0 0 8px 17px',fontSize: '12px'}}>周环比日期: {activeData.regulation}</p> */}
-                    <div className="module_search dy_module_search" style={{ 'padding-left': '15px' }}>
-                        <Row type="flex" justify="start" align="middle">
-                            {
-                                this.stores.state.activeData.type != 1 ? <Col span={8}>
-                                    <span>营运中心：</span>
-                                    <Select
-                                        getPopupContainer={(triggerNode) => triggerNode.parentNode}
-                                        defaultValue=""
-                                        style={{ width: "120px" }}
-                                        value={searchParam2.operCenterName}
-                                        placeholder="全部"
-                                        onChange={(val) => {
-                                            this.setState({ searchParam2: { ...searchParam2, ...{ operCenterName: val } } });
-                                        }}
-                                    >
-                                        <Select.Option value="">全部</Select.Option>
-                                        {quList.map((item, i) => {
-                                            return (
-                                                <Select.Option key={item + i} value={item}>
-                                                    {item}
-                                                </Select.Option>
-                                            );
-                                        })}
-                                    </Select>
-
-                                </Col> : null
-                            }
-                            {
-                                this.stores.state.activeData.type != 1 && this.stores.state.activeData.type != 2 ? <Col span={8}>
-                                    <span>省份：</span>
-                                    <Select
-                                        getPopupContainer={(triggerNode) => triggerNode.parentNode}
-                                        defaultValue=""
-                                        style={{ width: "120px" }}
-                                        value={searchParam2.provName}
-                                        placeholder="全部"
-                                        onChange={(val) => {
-                                            this.setState({ searchParam2: { ...searchParam2, ...{ provName: val } } });
-                                        }}
-                                    >
-                                        <Select.Option value="">全部</Select.Option>
-                                        {shengList.map((item, i) => {
-                                            return (
-                                                <Select.Option key={item + i} value={item}>
-                                                    {item}
-                                                </Select.Option>
-                                            );
-                                        })}
-                                    </Select>
-
-                                </Col> : null
-                            }
-                            {
-                                this.stores.state.activeData.type == 4 ? <Col span={8}>
-                                    <span>城市：</span>
-                                    <Select
-                                        getPopupContainer={(triggerNode) => triggerNode.parentNode}
-                                        defaultValue=""
-                                        style={{ width: "120px" }}
-                                        value={searchParam2.cityName}
-                                        placeholder="全部"
-                                        onChange={(val) => {
-                                            this.setState({ searchParam2: { ...searchParam2, ...{ cityName: val } } });
-                                        }}
-                                    >
-                                        <Select.Option value="">全部</Select.Option>
-                                        {shiList.map((item, i) => {
-                                            return (
-                                                <Select.Option key={item + i} value={item}>
-                                                    {item}
-                                                </Select.Option>
-                                            );
-                                        })}
-                                    </Select>
-
-                                </Col> : null
-                            }
-
-                        </Row>
-                        <Row type="flex" justify="end" align="middle">
-                            <Col>
-                                <Button
-                                    type="primary"
-                                    onClick={(e) => {
-                                        this.stores.pageQueryBusAlarmDetail({
-                                            alarmInstanceId: alarmInstanceId,
-                                            pageSize: total_2.pageSize,
-                                            pageNum: 1,
-                                            ...searchParam2
-                                        }, (res => {
-                                            this.setState({ uploadList: get(res, "records", []), total_2: { ...total_2, total: res.total, pageNum: total_2.pageNum } })
-                                        }))
-                                    }}
-                                >
-                                    搜索
-                                </Button>
-                            </Col>
-                            <Col>
-                                <Button
-                                    // type="text"
-                                    style={{ marginLeft: 14 }}
-                                    onClick={(e) => {
-                                        searchParam2.provName = "";
-                                        searchParam2.operCenterName = '';
-                                        searchParam2.cityName = '';
-                                        this.setState({ ...searchParam2 });
-                                        this.stores.pageQueryBusAlarmDetail({
-                                            alarmInstanceId: alarmInstanceId,
-                                            pageSize: total_2.pageSize,
-                                            pageNum: total_2.pageNum,
-                                            ...searchParam2
-                                        }, (res => {
-                                            this.setState({ uploadList: get(res, "records", []), total_2: { ...total_2, total: res.total, pageNum: total_2.pageNum } })
-                                        }))
-                                    }}
-                                >
-                                    重置
-                                </Button>
-                            </Col>
-                            <Col>
-                                <Button
-                                    // type="text"
-                                    style={{ marginLeft: 14 }}
-                                    onClick={(e) => {
-                                        this.handleDownload({
-                                            alarmInstanceId: alarmInstanceId,
-                                            pageSize: total_2.pageSize,
-                                            pageNum: total_2.pageNum,
-                                            ...searchParam2
-                                        });
-                                    }}
-                                >
-                                    导出Excel
-                                </Button>
-                            </Col>
-                        </Row>
-                    </div>
-
-                    <Table {...this.noticeTableOPt()} scroll={{ y: 300 }} />
-                </Modal>
-
-                <Drawer
-                    title={activeDrawer.message}
-                    placement="left"
-                    closable={false}
-                    onClose={() => { this.setState({ drawerVisible: false }) }}
-                    visible={this.state.drawerVisible}
-                >
-                    <div>
-                        {activeDrawer.description}
-                    </div>
-                </Drawer>
-
-            </div>
-        )
-    }
-}
-export default Form.create()(monitoringView)
-// export default monitoringView;

src/pages/client/index.js

@@ -1,304 +0,0 @@
-import $store from "@store/";
-import {
-  getTrendYearData, // 近一年客户量趋势
-  getCrossCustomerStatus,
-  getCustomerFeatureList,
-  getCustomerNativePlaceList,
-  getCustomerBuyPurposeList, // 购房分布等级
-  getIntentionRankList, // 购房意向等级
-  getCustomerServiceStatusList, // 物业工单状态分布
-  getCustomerEducateLevelList, // 家长文化程度分布
-  getCustomerIndustryList, // 家长工作职位分布
-  getCustomerServiceInfoList, // 物业工单汇总
-} from "@apis/client";
-
-export function loadTrend() {
-  getTrendYearData({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let trendXData = [];
-        let trendYData = [];
-        let rateXData = [];
-        let rateYData = [];
-        data.map((item) => {
-          rateXData.push(item.monthNo);
-          rateYData.push(item.lastRate);
-          trendXData.push(item.monthNo);
-          trendYData.push(item.allNum);
-        });
-
-        $store.client.setTrendObj({
-          rateXData,
-          rateYData,
-          trendXData,
-          trendYData,
-        });
-      }
-    }
-  );
-}
-
-export function loadWish() {
-  getIntentionRankList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        $store.client.setWishObj({
-          data: data.map((item) => {
-            return {
-              name: item.intentionRank,
-              value: item.allNum,
-              rate: item.rate,
-            };
-          }),
-        });
-      }
-    }
-  );
-}
-
-export function loadEffect() {
-  getCustomerBuyPurposeList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let xData = [];
-        let yData = [];
-        let rates = [];
-        data.map((item) => {
-          xData.push(item.buyPurpose);
-          yData.push(item.allNum);
-          rates.push(`${item.rate}%`);
-        });
-        $store.client.setEffectObj({ xData, yData, rates });
-      }
-    }
-  );
-}
-
-export function loadCharac() {
-  getCustomerFeatureList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let males = [];
-        let females = [];
-        let femaleRate = "";
-        let maleRate = "";
-        let femaleTotal = 0;
-        let maleTotal = 0;
-        data.map((item) => {
-          let obj = {
-            rate: `${item.sexBirthRate}%`,
-            name: item.dateBirth,
-            value: item.sexBirthNum,
-            sexRate: item.sexRate,
-            sexDataNum: item.sexNum,
-          };
-          let index = 0;
-
-          switch (item.dateBirth) {
-            case "60前":
-              index = 0;
-              break;
-            case "60后":
-              index = 1;
-              break;
-            case "70后":
-              index = 2;
-              break;
-            case "80后":
-              index = 3;
-              break;
-            case "90后":
-              index = 4;
-              break;
-            case "00后":
-              index = 5;
-              break;
-            case "10后":
-              index = 6;
-              break;
-            case "20后":
-              index = 7;
-              break;
-          }
-
-          if (item.sex === "女") {
-            females[index] = obj;
-          } else {
-            males[index] = obj;
-          }
-        });
-
-        femaleRate = ((females[0] || {}).sexRate || -1) + "%";
-        maleRate = ((males[0] || {}).sexRate || -1) + "%";
-        femaleTotal = (females[0] || {}).sexDataNum || -1;
-        maleTotal = (males[0] || {}).sexDataNum || -1;
-
-        $store.client.setCharacObj({
-          females,
-          males,
-          femaleRate,
-          maleRate,
-          femaleTotal,
-          maleTotal,
-        });
-      }
-    }
-  );
-}
-
-export function loadOrigin() {
-  getCustomerNativePlaceList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        $store.client.setOriginObj({
-          data: data.map((item) => {
-            return {
-              name: item.nativePlace.replace(/省|市|区|自治区/g, ""),
-              value: +item.allNum,
-              key: item.nativePlace,
-              rate: item.rate + '%',
-            };
-          }),
-        });
-      }
-    }
-  );
-}
-
-export function loadCross() {
-  getCrossCustomerStatus({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let [setData] = data || [];
-        if (setData) {
-          let sets = [
-            {
-              label: "地产",
-              size: +setData.cstNum,
-              sets: ["地产"],
-              content: "",
-              data: +setData.cstNum
-            },
-            {
-              label: "雅生活",
-              size: +setData.xscNum,
-              sets: ["雅生活"],
-              content: "",
-              data: +setData.xscNum,
-            },
-            {
-              label: "教育",
-              size: +setData.eduNum,
-              content: "",
-              sets: ["教育"],
-              data: +setData.eduNum,
-            },
-            {
-              label: "",
-              size: +setData.ceNum,
-              content: "地产&教育",
-              sets: ["地产", "教育"],
-              data: ''
-            },
-            {
-              label: "",
-              size: +setData.cxNum,
-              content: "地产&雅生活",
-              sets: ["地产", "雅生活"],
-              data: ''
-            },
-            {
-              label: "",
-              size: +setData.xeNum,
-              content: "雅生活&教育",
-              sets: ["雅生活", "教育"],
-              data: ''
-            },
-            {
-              label: "",
-              size: +setData.cxeNum,
-              content: "地产&雅生活&教育",
-              sets: ["地产", "雅生活", "教育"],
-              data: ''
-            },
-          ];
-
-          $store.client.setMergerObj({ data: sets });
-        }
-      }
-    }
-  );
-}
-
-export function loadOrder() {
-  getCustomerServiceStatusList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let xData = [];
-        let yData = [];
-        let rates = [];
-        data.map((item) => {
-          xData.push(item.sevicestate);
-          yData.push(item.num);
-          rates.push(`${item.rate}%`);
-        });
-        $store.client.setOrderObj({ xData, yData, rates });
-      }
-    }
-  );
-}
-
-export function loadEducation() {
-  getCustomerEducateLevelList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let xData = [];
-        let yData = [];
-        let rates = [];
-        data.map((item) => {
-          xData.push(item.educateLevel);
-          yData.push(item.num);
-          rates.push(`${item.rate}%`);
-        });
-        $store.client.setEduObj({ xData, yData, rates });
-      }
-    }
-  );
-}
-
-export function loadPosition() {
-  getCustomerIndustryList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let xData = [];
-        let yData = [];
-        let rates = [];
-        data.map((item) => {
-          xData.push(item.industry);
-          yData.push(item.num);
-          rates.push(`${item.rate}%`);
-        });
-        $store.client.setPosiObj({ xData, yData, rates });
-      }
-    }
-  );
-}
-
-export function loadOrderSum() {
-  getCustomerServiceInfoList({ type: $store.client.clientType }).then(
-    ({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        $store.client.setOrderSumObj({
-          orderTotal: data.allNum,
-          completeRate: data.completeRate,
-          completeNum: data.completeNum,
-          orderNew: data.newNum,
-        });
-      }
-    }
-  );
-}
-
-export function changeType(payload = 0) {
-  $store.client.setType(payload);
-}

src/pages/client/index.jsx

@@ -1,924 +0,0 @@
-import "./index.scss";
-import { useState, useEffect } from "react";
-import {
-  Form,
-  Button,
-  Input,
-  Select,
-  message,
-  Spin,
-  Tooltip,
-  Table,
-} from "antd";
-import { useHistory } from "react-router-dom";
-import { maxBy, minBy } from "lodash";
-import { formatNum } from "@utils/";
-import $store from "@store/";
-import { observer } from "mobx-react";
-import "@libs/map/js/china.js";
-import "@utils/chartTheme.js";
-import { toJS } from "mobx";
-
-import Venen from "@components/venen/";
-import Chart from "@components/chart";
-
-import IconClient from "@images/icon-client.png";
-
-import {
-  loadWish,
-  loadTrend,
-  loadEffect,
-  loadCharac,
-  loadOrigin,
-  loadCross,
-  loadOrder,
-  loadPosition,
-  loadEducation,
-  loadOrderSum,
-  changeType,
-} from "./";
-
-import imgFemale from "@images/female.png";
-import imgMale from "@images/male.png";
-import { configure } from "mobx";
-configure({ useProxies: "never" });
-
-function handdleMarker(marker = "") {
-  return marker.replace(/10px/g, "6px");
-}
-
-export default observer(function (props) {
-  const history = useHistory();
-  const [form] = Form.useForm();
-
-  let {
-    trendObj,
-    mergerObj,
-    originObj,
-    characObj,
-    wishObj,
-    effectObj,
-    orderObj,
-    orderSumObj,
-    posiObj,
-    eduObj,
-    clientType,
-  } = $store.client;
-
-  useEffect(() => {
-    switch (clientType) {
-      case 0:
-        loadTrend();
-        loadCross();
-        loadCharac();
-        loadOrigin();
-        break;
-      case 1:
-        loadTrend();
-        loadCharac();
-        loadOrigin();
-        loadEffect();
-        loadWish();
-        break;
-      case 2:
-        loadTrend();
-        loadCharac();
-        loadOrigin();
-        loadOrder();
-        loadOrderSum();
-        break;
-      case 3:
-        loadTrend();
-        loadCharac();
-        loadOrigin();
-        loadEducation();
-        loadPosition();
-        break;
-    }
-  }, []);
-
-  let trendGraphOption = {
-    color: ["skyblue", "#006699"],
-    tooltip: {
-      trigger: "axis",
-      axisPointer: {
-        type: "shadow",
-      },
-      formatter: function (params) {
-        var result = "";
-        result = params[0].axisValue;
-        params.forEach(function (item) {
-          var dotHtml = `<span style="display:inline-block;margin-right:5px;border-radius:8px;width:8px;height:8px;background-color:${item.color};margin-top:5px;"></span>`;
-          result +=
-            "</br>" +
-            dotHtml +
-            item.seriesName +
-            ":" +
-            (formatNum(item.data) || 0) +
-            (item.seriesName === "增长率" ? "%" : "人");
-        });
-        return result;
-      },
-    },
-
-    legend: {},
-    xAxis: [
-      {
-        type: "category",
-        axisTick: {
-          show: false,
-        },
-        data: trendObj.trendXData,
-      },
-      {
-        show: false,
-      },
-    ],
-    yAxis: [
-      {
-        type: "value",
-        position: "left",
-        // min(value) {
-        //   return value;
-        // },
-        min: clientType >> 1 === 0 ? 2000000 : 0,
-      },
-      {
-        type: "value",
-        splitLine: {
-          show: false,
-        },
-      },
-    ],
-    series: [
-      {
-        name: /* 系列名称 */ "客户数",
-        type: "bar",
-        seriesLayoutBy: "row",
-        data: trendObj.trendYData,
-        barWidth: 20,
-        yAxisIndex: 0,
-      },
-      {
-        name: /* 系列名称 */ "增长率",
-        type: "line",
-        seriesLayoutBy: "row",
-        data: trendObj.rateYData,
-        yAxisIndex: 1,
-      },
-    ],
-  };
-
-  let femaleGraphOption = {
-    title: {
-      show: false,
-    },
-    tooltip: {
-      trigger: "item",
-      formatter(params) {
-        // debugger
-        return `${params.data.name}:${formatNum(
-          params.data.value
-        )}人<br/>女性中占比:${params.data.rate}`;
-      },
-    },
-    legend: {
-      orient: "horizontal",
-      left: "center",
-      top: 0,
-    },
-    series: [
-      {
-        name: "female",
-        type: "pie",
-        radius: ["35%", "60%"],
-        top: 0,
-        left: 100,
-        label: {
-          show: true,
-          width: 50,
-          formatter(params) {
-            // debugger
-            return params.data.rate;
-          },
-        },
-        labelLine: {
-          show: true,
-        },
-        data: /* name,value组成的元数组 */ characObj.females,
-        emphasis: {
-          itemStyle: {
-            shadowBlur: 10,
-            shadowOffsetX: 0,
-            shadowColor: "rgba(0, 0, 0, 0.5)",
-          },
-        },
-      },
-    ],
-  };
-
-  let colors = [
-    "#1890ff",
-    "#2fc25b",
-    "#facc14",
-    "#999",
-    "#999",
-    "#999",
-    "#999",
-    "#999",
-  ];
-
-  let maleGraphOption = {
-    title: {
-      show: false,
-    },
-    tooltip: {
-      trigger: "item",
-      formatter(params) {
-        return `${params.data.name}:${formatNum(
-          params.data.value
-        )}人<br/>男性中占比:${params.data.rate}`;
-      },
-    },
-    legend: {
-      orient: "horizontal",
-      left: "center",
-      top: 0,
-    },
-    series: [
-      {
-        name: "",
-        type: "pie",
-        radius: ["35%", "60%"],
-        top: "20",
-        left: "-100",
-        label: {
-          show: true,
-          width: 50,
-          formatter(params) {
-            return params.data.rate;
-          },
-        },
-        labelLine: {
-          show: true,
-        },
-        data: /* name,value组成的元数组 */ characObj.males,
-        emphasis: {
-          itemStyle: {
-            shadowBlur: 10,
-            shadowOffsetX: 0,
-            shadowColor: "rgba(0, 0, 0, 0.5)",
-          },
-        },
-      },
-    ],
-  };
-
-  let originGraphOption = {
-    color: ["#35C635", "#FAD337", "#FA5469"],
-    title: {
-      show: false,
-    },
-    tooltip: {
-      show: true,
-      formatter: function (params) {
-        let label = "客户数";
-        let unit = "人";
-        let { name = "", value = "0", rate = "0.00" } = params.data || {};
-        params.marker = handdleMarker(params.marker);
-        return `${params.name} </br>${params.marker} ${label}：${
-          formatNum(value) || 0
-        }${unit}`;
-      },
-    },
-    legend: {
-      show: false,
-      icon: "circle",
-      top: "0",
-      left: "center",
-      textStyle: {
-        rich: {
-          title: {},
-        },
-      },
-    },
-    toolbox: {
-      show: false,
-    },
-    visualMap: {
-      show: true,
-      type: "continuous",
-      min: 0,
-      max:
-        originObj.data.length > 0
-          ? +maxBy(originObj.data, "value").value
-          : 1000,
-      itemWidth: 12,
-      itemHeight: 110,
-      orient: "horizontal",
-      left: "4%",
-      bottom: "0",
-      text: ["高", "低"], // 文本，默认为数值文本
-      calculable: true,
-      inRange: {
-        color: ["#BAE7FF", "#3FA3FC"],
-        // symbolSize: [5, 5],
-      },
-      textStyle: {
-        color: "#666",
-      },
-    },
-    grid: {
-      containLabel: false,
-    },
-    series: [
-      {
-        name: "区域分布",
-        type: "map",
-        mapType: "china",
-        top: "20",
-        left: "50",
-        bottom: "20",
-        normal: {
-          areaColor: "#D4EAFF",
-          borderColor: "#eeeeee",
-          borderWidth: 1,
-        },
-        emphasis: {
-          areaColor: "#35C635",
-        },
-        label: {
-          show: true,
-          formatter: "{b}",
-          color: "#444",
-        },
-        data: originObj.data,
-      },
-    ],
-  };
-
-  let originTableOption = {
-    scroll: { y: 240 },
-    dataSource: toJS(originObj.data),
-    pagination: false,
-    columns: [
-      {
-        title: "省份",
-        dataIndex: "name",
-        width: "150",
-      },
-      {
-        title: "客户数",
-        dataIndex: "value",
-        width: "120",
-        render(val, record) {
-          return formatNum(val);
-        },
-      },
-      {
-        title: "占比",
-        dataIndex: "rate",
-        width: "120",
-      },
-    ],
-  };
-
-  let wishGraphOption = {
-    title: {
-      show: false,
-    },
-    tooltip: {
-      trigger: "item",
-      formatter(params) {
-        return `${params.data.name}:${params.data.value}人<br/>占比:${params.data.rate}%`;
-      },
-    },
-    legend: {
-      orient: "verticle",
-      left: "left",
-      top: 0,
-    },
-    series: [
-      {
-        name: "",
-        type: "pie",
-        radius: ["50%", "70%"],
-        top: 30,
-        left: 100,
-        label: {
-          show: false,
-          width: 50,
-          formatter(params) {
-            return params.data.rate;
-          },
-        },
-        labelLine: {
-          show: false,
-        },
-        data: /* name,value组成的元数组 */ wishObj.data,
-        emphasis: {
-          itemStyle: {
-            shadowBlur: 10,
-            shadowOffsetX: 0,
-            shadowColor: "rgba(0, 0, 0, 0.5)",
-          },
-        },
-      },
-    ],
-  };
-
-  let clientTypes = [
-    {
-      label: "客户总览",
-      value: 0,
-    },
-    {
-      label: "地产客户",
-      value: 1,
-    },
-    {
-      label: "雅生活客户",
-      value: 2,
-    },
-    {
-      label: "教育客户",
-      value: 3,
-    },
-  ];
-
-  let effectGraphOption = {
-    color: ["skyblue"],
-    tooltip: {
-      trigger: "axis",
-      axisPointer: {
-        type: "shadow",
-      },
-      formatter: function (params) {
-        var result = "";
-        result = params[0].axisValue;
-        params.forEach(function (item) {
-          var dotHtml = `<span style="display:inline-block;margin-right:5px;border-radius:8px;width:8px;height:8px;background-color:${item.color};margin-top:5px;"></span>`;
-          result +=
-            "</br>" +
-            dotHtml +
-            item.seriesName +
-            ":" +
-            (item.data || 0) +
-            (item.seriesName === "占比" ? "" : "人");
-        });
-        return result;
-      },
-    },
-    xAxis: [
-      {
-        type: "category",
-        axisTick: {
-          show: false,
-        },
-        data: effectObj.xData,
-      },
-    ],
-    yAxis: [
-      {
-        type: "value",
-        show: true,
-        axisLine: /* 轴线 */ {
-          show: true,
-        },
-        axisTick: /* 刻度 */ {
-          show: false,
-        },
-        axisLabel: {
-          show: false,
-        },
-      },
-      { type: "value" },
-    ],
-    series: [
-      {
-        name: /* 系列名称 */ "客户数",
-        type: "bar",
-        data: effectObj.yData,
-        barWidth: 20,
-      },
-      {
-        show: false,
-        name: /* 系列名称 */ "占比",
-        type: "line",
-        data: effectObj.rates,
-      },
-    ],
-  };
-
-  let orderGraphOption = {
-    color: ["skyblue"],
-    tooltip: {
-      trigger: "axis",
-      axisPointer: {
-        type: "shadow",
-      },
-      formatter: function (params) {
-        var result = "";
-        result = params[0].axisValue;
-        params.forEach(function (item) {
-          var dotHtml = `<span style="display:inline-block;margin-right:5px;border-radius:8px;width:8px;height:8px;background-color:${item.color};margin-top:5px;"></span>`;
-          result +=
-            "</br>" +
-            dotHtml +
-            item.seriesName +
-            ":" +
-            formatNum(item.data || 0) +
-            (item.seriesName === "占比" ? "" : "件");
-        });
-        return result;
-      },
-    },
-    grid: {
-      width: '100%',
-    },
-    xAxis: [
-      {
-        type: "category",
-        axisTick: {
-          show: false,
-        },
-        data: orderObj.xData,
-      },
-    ],
-    yAxis: [
-      {
-        type: "value",
-        show: true,
-        axisLine: /* 轴线 */ {
-          show: true,
-        },
-        axisTick: /* 刻度 */ {
-          show: false,
-        },
-        axisLabel: {
-          show: false,
-        },
-      },
-      { type: "value" },
-    ],
-    series: [
-      {
-        name: /* 系列名称 */ "工单数",
-        type: "bar",
-        data: orderObj.yData,
-        barWidth: 20,
-        left: "80",
-      },
-      {
-        show: false,
-        name: /* 系列名称 */ "占比",
-        type: "line",
-        data: orderObj.rates,
-      },
-    ],
-  };
-
-  let posiGraphOption = {
-    color: ["skyblue"],
-    tooltip: {
-      trigger: "axis",
-      axisPointer: {
-        type: "shadow",
-      },
-      formatter: function (params) {
-        var result = "";
-        result = params[0].axisValue;
-        params.forEach(function (item) {
-          var dotHtml = `<span style="display:inline-block;margin-right:5px;border-radius:8px;width:8px;height:8px;background-color:${item.color};margin-top:5px;"></span>`;
-          result +=
-            "</br>" +
-            dotHtml +
-            item.seriesName +
-            ":" +
-            (item.data || 0) +
-            (item.seriesName === "占比" ? "" : "人");
-        });
-        return result;
-      },
-    },
-    xAxis: [
-      {
-        type: "category",
-        axisTick: {
-          show: false,
-        },
-        data: posiObj.xData,
-      },
-    ],
-    yAxis: [
-      {
-        type: "value",
-        show: true,
-        axisLine: /* 轴线 */ {
-          show: true,
-        },
-        axisTick: /* 刻度 */ {
-          show: false,
-        },
-        axisLabel: {
-          show: false,
-        },
-      },
-      { type: "value" },
-    ],
-    series: [
-      {
-        name: /* 系列名称 */ "客户数",
-        type: "bar",
-        data: posiObj.yData,
-        barWidth: 20,
-      },
-      {
-        show: false,
-        name: /* 系列名称 */ "占比",
-        type: "line",
-        data: posiObj.rates,
-      },
-    ],
-  };
-
-  let eduGraphOption = {
-    color: ["skyblue"],
-    tooltip: {
-      trigger: "axis",
-      axisPointer: {
-        type: "shadow",
-      },
-      formatter: function (params) {
-        var result = "";
-        result = params[0].axisValue;
-        params.forEach(function (item) {
-          var dotHtml = `<span style="display:inline-block;margin-right:5px;border-radius:8px;width:8px;height:8px;background-color:${item.color};margin-top:5px;"></span>`;
-          result +=
-            "</br>" +
-            dotHtml +
-            item.seriesName +
-            ":" +
-            (item.data || 0) +
-            (item.seriesName === "占比" ? "" : "人");
-        });
-        return result;
-      },
-    },
-    xAxis: [
-      {
-        type: "category",
-        axisTick: {
-          show: false,
-        },
-        data: eduObj.xData,
-      },
-    ],
-    yAxis: [
-      {
-        type: "value",
-        show: true,
-        axisLine: /* 轴线 */ {
-          show: true,
-        },
-        axisTick: /* 刻度 */ {
-          show: false,
-        },
-        axisLabel: {
-          show: false,
-        },
-      },
-      { type: "value" },
-    ],
-    series: [
-      {
-        name: /* 系列名称 */ "客户数",
-        type: "bar",
-        data: eduObj.yData,
-        barWidth: 20,
-      },
-      {
-        show: false,
-        name: /* 系列名称 */ "占比",
-        type: "line",
-        data: eduObj.rates,
-      },
-    ],
-  };
-
-  let summaryArr = toJS(trendObj.trendYData);
-
-  let summaryTotal = formatNum(
-    +summaryArr[summaryArr.length - 1] || +summaryArr[summaryArr.length - 2]
-  );
-
-  return (
-    <div className="client_home">
-      <div
-        className="navs"
-        onClick={(e) => {
-          let type = +e.target.dataset.type;
-
-          if (type === clientType) {
-            return;
-          }
-          changeType(type);
-          switch (type) {
-            case 0:
-              loadTrend();
-              loadCross();
-              loadCharac();
-              loadOrigin();
-              break;
-            case 1:
-              loadTrend();
-              loadCharac();
-              loadOrigin();
-              loadEffect();
-              loadWish();
-              loadEffect();
-              break;
-            case 2:
-              loadTrend();
-              loadCharac();
-              loadOrigin();
-              loadEffect();
-              loadOrder();
-              loadOrderSum();
-              break;
-            case 3:
-              loadTrend();
-              loadCharac();
-              loadOrigin();
-              loadEducation();
-              loadPosition();
-              break;
-          }
-        }}
-      >
-        {clientTypes.map((type) => (
-          <li
-            className={clientType === type.value ? "actived" : ""}
-            data-type={type.value}
-          >
-            {type.label}
-          </li>
-        ))}
-      </div>
-
-      {/* 客户总数 */}
-      {clientType !== 0 && (
-        <div
-          className="chart"
-          data-title={`${
-            clientType === 1 ? "地产" : clientType === 2 ? "雅生活" : "教育"
-          }客户总数`}
-        >
-          <div className="flex summary">
-            <img src={IconClient} alt="" />
-            <div>{summaryTotal}人</div>
-          </div>
-        </div>
-      )}
-
-      {/* 近一年客户量趋势 */}
-      <div className="chart" data-title="近一年客户量趋势">
-        <Chart Option={trendGraphOption}></Chart>
-      </div>
-
-      {/* 事业部交叉客户数 */}
-      {clientType === 0 && (
-        <div className="chart" data-title="事业部交叉客户数">
-          <Venen sets={mergerObj.data}></Venen>
-          <div className="list">
-            {toJS(mergerObj.data)
-              .filter((item) => item.content !== "")
-              .map((item, index) => {
-                return (
-                  <li>
-                    <span
-                      className="point"
-                      style={{ background: "#999" }}
-                    ></span>
-                    <span className="label">{item.content}：</span>
-                    <span className="polulation" style={{ color: "#999" }}>
-                      {formatNum(item.size)}
-                    </span>
-                    人
-                  </li>
-                );
-              })}
-          </div>
-        </div>
-      )}
-
-      {/* 客户特征分布 */}
-      <div className="chart" data-title="客户特征分布">
-        <div className="flex" style={{ maxWidth: 1080, margin: "auto" }}>
-          <div className="chart2" data-title="">
-            <Chart Option={maleGraphOption} height={400} width={500}></Chart>
-            <div className="male">
-              <img src={imgMale} alt="" />
-              <div className="rate">{characObj.maleRate}</div>
-              <div className="block2">
-                <div className="content">
-                  男性客户数:
-                  <br />
-                  {formatNum(characObj.maleTotal)}人
-                </div>
-                <div className="angle"></div>
-              </div>
-            </div>
-          </div>
-          <div className="chart2" data-title="">
-            <Chart Option={femaleGraphOption} height={400} width={500}></Chart>
-            <div className="female">
-              <img src={imgFemale} alt="" />
-              <div className="rate">{characObj.femaleRate}</div>
-              <div className="block1">
-                <div className="content">
-                  女性客户数:
-                  <br />
-                  {formatNum(characObj.femaleTotal)}人
-                </div>
-                <div className="angle"></div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      {/* 客户籍贯分布 */}
-      <div className="chart" data-title="客户籍贯分布">
-        <Chart Option={originGraphOption} theme="myTheme" height={460}></Chart>
-        <div className="rank">
-          <Table {...originTableOption}></Table>
-        </div>
-      </div>
-
-      {/* 意向等级分布 & 购房用途分布 */}
-      {clientType === 1 && (
-        <div className="flex">
-          <div className="chart mr" data-title="意向等级分布">
-            <Chart Option={wishGraphOption} theme="myTheme" width={500}></Chart>
-          </div>
-          <div className="chart" data-title="购房用途分布">
-            <Chart
-              Option={effectGraphOption}
-              theme="myTheme"
-              width={500}
-            ></Chart>
-          </div>
-        </div>
-      )}
-
-      {/* 工单模块 */}
-      {clientType === 2 && (
-        <div className="flex">
-          <div
-            className="chart mr"
-            data-title="汇总信息"
-            style={{ flexGrow: 3 }}
-          >
-            <div className="order">
-              <li>
-                <div>工单总数:</div>
-                <div>{formatNum(orderSumObj.orderTotal)}</div>
-              </li>
-              <li>
-                <div>工单完成率:</div>
-                <div>{formatNum(orderSumObj.completeRate)}</div>
-              </li>
-              <li>
-                <div>新增工单:</div>
-                <div>{formatNum(orderSumObj.orderNew)}</div>
-              </li>
-            </div>
-          </div>
-          <div
-            className="chart"
-            data-title="物业工单状态分布"
-            style={{ flexGrow: 7 }}
-          >
-            <Chart
-              Option={orderGraphOption}
-              // theme="myTheme"
-              width={640}
-            ></Chart>
-          </div>
-        </div>
-      )}
-
-      {clientType === 3 && (
-        <div className="flex">
-          <div className="chart mr" data-title="家长工作职位分布">
-            <Chart Option={posiGraphOption} theme="myTheme" width={520}></Chart>
-          </div>
-          <div className="chart" data-title="家长文化程度分布">
-            <Chart Option={eduGraphOption} theme="myTheme" width={520}></Chart>
-          </div>
-        </div>
-      )}
-    </div>
-  );
-});

src/pages/client/index.scss

@@ -1,223 +0,0 @@
-.client_home {
-  padding: 12px 12px 60px 12px;
-  background-color: #f8f8f8;
-  .mr {
-    margin-right: 12px;
-  }
-  .mt {
-    margin-top: 30px;
-  }
-
-  .navs {
-    display: flex;
-    margin-bottom: 12px;
-    // background-color: #fff;
-    // padding: 8px 0;
-    li {
-      list-style: none;
-      padding: 0;
-      border-radius: 32px;
-      line-height: 32px;
-      text-align: center;
-      border: #e7e7e7 1px solid;
-      width: 120px;
-      margin-right: 10px;
-      cursor: pointer;
-
-      &.actived {
-        background-color: skyblue;
-        color: #fff;
-      }
-      &:hover {
-        background-color: lightskyblue;
-      }
-    }
-  }
-  .chart {
-    border-radius: 5px;
-    position: relative;
-    padding: 10px;
-    margin-bottom: 12px;
-    background-color: #fff;
-    &::before {
-      content: attr(data-title);
-      font-size: 16px;
-      font-weight: bold;
-      display: block;
-      padding-bottom: 6px;
-      border-bottom: 1px solid #e7e7e7;
-      color: #333;
-    }
-    .list {
-      top: 20px;
-      position: absolute;
-      right: 80px;
-      padding-top: 40px;
-      font-size: 14px;
-      li {
-        list-style: none;
-        margin-bottom: 10px;
-      }
-      .point {
-        opacity: 0;
-        border-radius: 50%;
-        margin-right: 5px;
-        width: 10px;
-        height: 10px;
-        display: inline-block;
-        vertical-align: middle;
-      }
-      .label {
-        width: 150px;
-        display: inline-block;
-        text-align: right;
-      }
-      .polulation{
-        width: 80px;
-        text-align: right;
-        display: inline-block;
-      }
-    }
-  }
-  .chart2 {
-    position: relative;
-    &::before {
-      content: attr(data-title);
-      font-size: 16px;
-      font-weight: bold;
-      display: block;
-      padding-bottom: 6px;
-      padding-top: 6px;
-    }
-  }
-  .flex {
-    display: flex;
-    justify-content: space-between;
-    & > div {
-      flex-grow: 1;
-    }
-  }
-  .female,
-  .male {
-    position: absolute;
-    bottom: 0;
-    img {
-      width: 80px;
-      height: 180px;
-      position: relative;
-      z-index: 1;
-    }
-
-    .rate {
-      position: inherit;
-      bottom: 3px;
-      color: #fff;
-      width: 100%;
-      text-align: center;
-      z-index: 3;
-    }
-    .block1 {
-      color: #999;
-      position: absolute;
-      bottom: 50px;
-      right: 60px;
-      .content {
-        width: 120px;
-        height: 60px;
-        line-height: 2;
-        box-shadow: 0 0 6px 0 #d9d9d9;
-        border-radius: 12px;
-        background-color: #fff;
-        z-index: 4;
-        padding: 2px 8px;
-        position: relative;
-      }
-      .angle {
-        position: absolute;
-        box-shadow: 0 0 6px 0 #d9d9d9;
-        width: 10px;
-        height: 10px;
-        transform: rotate(45deg);
-        right: -5px;
-        top: 50%;
-        z-index: 3;
-      }
-    }
-    .block2 {
-      color: #999;
-      position: absolute;
-      bottom: 150px;
-      left: 80px;
-      .content {
-        width: 120px;
-        height: 60px;
-        line-height: 2;
-        box-shadow: 0 0 6px 0 #d9d9d9;
-        border-radius: 12px;
-        background-color: #fff;
-        z-index: 4;
-        padding: 2px 8px;
-        position: relative;
-      }
-      .angle {
-        position: absolute;
-        box-shadow: 0 0 6px 0 #d9d9d9;
-        width: 10px;
-        height: 10px;
-        transform: rotate(45deg);
-        left: -5px;
-        top: 50%;
-        z-index: 3;
-      }
-    }
-  }
-  .male {
-    right: 80px;
-  }
-  .female {
-    left: 40px;
-  }
-  .order {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-around;
-    align-items: center;
-    height: 90%;
-    li {
-      border-bottom: 1px solid #f8f8f8;
-      padding: 20px;
-      list-style: none;
-      width: 100%;
-      text-align: center;
-      & > div:first-child {
-        color: #666;
-        font-size: 14px;
-      }
-      &>div:last-child{
-        color: skyblue;
-        font-size: 32px;
-        font-weight: 700;
-      }
-    }
-  }
-  .rank{
-    width: 400px;
-    right: 12px;
-    position: absolute;
-    top: 120px;
-    height: 300px;
-    overflow: auto;
-    border: 1px solid #e5e5e5;
-    border-radius: 5px;
-  }
-  .summary{
-    // display: flex;
-    color: #333;
-    align-items: center;
-    padding: 15px 20px;
-    img{margin-right: 70px;}
-    font-size: 40px;
-    font-weight: bold;
-  }
-  
-}

src/pages/clush/style.less

@@ -1,270 +0,0 @@
-.fetch_data {
-  padding-bottom: 80px;
-
-  .hidden {
-    display: none !important;
-  }
-
-  &.disabled {
-    color: rgba(0, 0, 0, 0.25) !important;
-    cursor: not-allowed !important;
-  }
-
-  .loading {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    margin-top: -30px;
-  }
-
-  .pageView {
-    //background: #fff;
-    //padding: 16px;
-    border-radius: 3px;
-    padding: 0px;
-    min-height: e("calc(100vh - 168px)");
-    position: relative;
-    //padding-bottom: 33px;
-  }
-
-  .toolTipIcon {
-    display: inline-block;
-    width: 8px;
-    height: 8px;
-    // background-color: @primary-color;
-    border-radius: 50%;
-    vertical-align: middle;
-    margin-right: 8px;
-  }
-
-  .labelItem {
-    background: #ffffff;
-    border: 1px solid #e8e8e8;
-    border-radius: 2px;
-    padding: 8px 18px;
-    //margin-bottom: 16px;
-    // cursor: pointer;
-    line-height: normal;
-
-    &:not(:last-child) {
-      margin-right: 16px;
-    }
-
-    &:hover {
-      background: rgba(34, 152, 103, 0.1);
-      border: 1px solid #229867;
-      color: #229867;
-      //font-weight: bold;
-    }
-
-    &.active {
-      background: rgba(34, 152, 103, 0.1);
-      border: 1px solid #229867;
-      border-radius: 2px;
-      color: #229867;
-      //font-weight: bold;
-    }
-  }
-  :global{
-
-  
-  .pageContainer {
-    display: flex;
-
-    & > .section {
-      //height: e("calc(100vh - 186px)");
-      overflow-y: auto;
-    }
-
-    .section {
-      background-color: #fff;
-
-      &:first-child {
-        //width: 80%;
-        flex: 1;
-      }
-
-      & ~ .section {
-        //margin-left: 16px;
-        flex: 0.1 1 280px;
-      }
-    }
-
-    .formBox {
-      //width: 20%;
-      padding: 16px;
-    }
-  }
-
-  .btnList {
-    text-align: center;
-    /* margin-top: 16px; */
-    background: #ffffff;
-    box-shadow: 0 -6px 7px 0 rgba(0, 0, 0, 0.04);
-    padding: 8px 0;
-    position: fixed;
-    bottom: 0;
-    width: 100vw;
-    left: 0;
-    display: flex;
-    justify-content: flex-end;
-    padding-right: 16px;
-
-    button {
-      & ~ button {
-        margin-left: 16px;
-      }
-    }
-  }
-
-  .conBox {
-    display: flex;
-    min-height: e("calc(100vh - 168px)");
-  }
-
-  .tabBar {
-    background-color: #fafafa;
-    width: 18%;
-    min-width: 150px;
-
-    .list {
-      font-size: 14px;
-      color: rgba(0, 0, 0, 0.85);
-
-      .item {
-        height: 62px;
-        line-height: 62px;
-        //text-align: center;
-        cursor: pointer;
-        padding-left: 24px;
-        text-align: left;
-        font-weight: 600;
-
-        &.active {
-          background-color: #fff;
-          color: #229867;
-          font-weight: bold;
-        }
-
-        &:hover {
-          color: #229867;
-          //border-color: rgba(34,152,103,1);
-        }
-      }
-    }
-  }
-
-  .labelBox {
-    margin-top: 20px;
-    margin-left: 32px;
-    // height: calc(100vh - 188px);
-    // overflow: auto;
-    overflow: auto;
-    // max-height: 350px;
-    flex: 1;
-
-    .group {
-      .groupName {
-        font-size: 14px;
-        color: rgba(0, 0, 0, 0.85);
-        margin-bottom: 16px;
-        font-weight: bold;
-      }
-
-      & ~ .group {
-        margin-top: 12px;
-      }
-    }
-
-    .list {
-      display: flex;
-      flex-wrap: wrap;
-      font-size: 14px;
-      color: rgba(0, 0, 0, 0.65);
-
-      .item {
-        background: #ffffff;
-        border: 1px solid #e8e8e8;
-        border-radius: 2px;
-        padding: 8px 18px;
-        margin-bottom: 16px;
-        cursor: pointer;
-        position: relative;
-
-        &:not(:last-child) {
-          margin-right: 16px;
-        }
-
-        &:hover {
-          color: #229867;
-        }
-
-        &.active {
-          background: rgba(34, 152, 103, 0.1);
-          border: 1px solid #229867;
-          border-radius: 2px;
-          color: #229867;
-          //font-weight: bold;
-        }
-      }
-    }
-  }
-
-  .formBox {
-    .section-title {
-      font-family: PingFangSC-Semibold;
-      font-size: 14px;
-      color: rgba(0, 0, 0, 0.85);
-      font-weight: bold;
-      margin-bottom: 24px;
-    }
-
-    .fetchHistory {
-      text-align: right;
-    }
-
-    .selectLabelList {
-      display: flex;
-      flex-wrap: wrap;
-      align-items: center;
-      margin-top: 16px;
-
-      .item {
-        position: relative;
-        & ~ .item {
-          margin-left: 16px;
-          margin-bottom: 16px;
-        }
-        .icon_close {
-          position: absolute;
-          right: 2px;
-          top: -1px;
-          cursor: pointer;
-        }
-      }
-    }
-  }
-
-  .applyForm {
-    line-height: normal;
-
-    .selectLabelList {
-      display: flex;
-      flex-wrap: wrap;
-      align-items: center;
-      //margin-top: 16px;
-      line-height: normal;
-
-      .item {
-        margin-bottom: 12px;
-        height: 32px;
-        line-height: 32px;
-
-        & ~ .item {
-          margin-left: 12px;
-          //margin-bottom: 12px;
-        }
-      }
-    }
-  }
-}}

src/pages/dataApply/applyModal.jsx

@@ -1,310 +0,0 @@
-/*
-    权限申请
- * @Author: dayan_hjm 
- * @Date: 2023-02-03 17:09:46 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2023-02-24 14:30:30
- */
-
-import React, { Component } from "react";
-import { withRouter } from "react-router-dom";
-import { Table, Button, Input, Modal, TreeSelect, Select, message, Tooltip, InputNumber, Checkbox, Tabs, Row, Col } from 'antd';
-const { TabPane } = Tabs;
-const { SHOW_CHILD } = TreeSelect;
-
-import { Form } from '@ant-design/compatible';
-import '@ant-design/compatible/assets/index.css';
-import { get, isEmpty, uniqueId } from 'lodash'
-import utils from "@utils/index";
-const FormItem = Form.Item;
-// 多类名样式管理工具
-import { toJS } from 'mobx'
-import dataApplyMod from './dataApplyMod';
-// 引入当前页样式 - 模块化
-import styles from './dataApplyLess.less'
-import { mapTree2 } from "@utils/util";
-
-@withRouter
-class ApplyModalView extends Component {
-    // 构造函数，组件的实例创建时，最先执行
-    constructor(props, context) {
-        super(props, context)
-        // 注入的DataApplyMod
-        this.stores = dataApplyMod;
-        this.state = {
-            visible: this.props.visible,
-            treeDatas: [],
-            treeValue: [],
-            extraArr: [],
-            resetRoom: [
-                'tableNames',
-                'applyReason',
-                'bizTableConfigName',
-            ],
-        }
-    }
-
-    componentDidMount() {
-        this.props.onRef(this);
-        // this.getTree()
-    }
-
-    getTree(name = "data_portal", id) {
-        const { isDetails } = this.props;
-        this.stores.listDbTables({
-            accountId: sessionStorage.getItem("accountId"),
-            tableType: 'biz',
-            dsId: id,
-            dbs: [name]
-        }).then((res) => {
-            let treeData_s = [{
-                title: name,
-                value: id,
-                key: id,
-                disabled:isDetails,
-                children: get(res, "tableNames", []).map(x => {
-                    return {
-                        title: x,
-                        value: x,
-                        key: x,
-                        disabled:isDetails
-                    }
-                })
-            }]
-            this.setState({ treeDatas: treeData_s })
-        })
-        // this.stores.getAllDsAndDbsAndTables({
-        //     type:'biz',
-        //     dataBaseName:name
-        // }).then((res) => {
-        //     if (res && res[0]) {
-        //         const treeData_s = res.map((item) => {
-        //             return mapTree2(item, 'tableNames', 'dataBaseName')
-        //         })
-        //         this.setState({ treeDatas: treeData_s })
-        //     }
-
-        // })
-
-    }
-
-    getFormData(id,type=1,datas={}) {//权限申请新增反序列化  但不需要调接口 type2=数据权限
-        this.stores.selectById({id,type,datas}, (data) => {
-            this.setState({ visible: true, treeValue: toJS(data) })
-        })
-    }
-
-    onChange = (value, label, extra) => {
-        this.setState({ treeValue: value, extraArr: extra.allCheckedNodes });
-    };
-
-    // 渲染新增修改表单
-    renderForm() {
-        const { getFieldDecorator } = this.props.form;
-        const { isDetails, activeData={
-            hasDownload:null,
-            hasSelect:null,
-            hasDownload:null,
-        } } = this.props;
-        const { formData = {} } = toJS(this.stores.state)
-        const tProps = {
-            treeData: this.state.treeDatas,
-            value: this.state.treeValue,
-            treeDefaultExpandAll: isDetails,
-            maxTagCount: 3,
-            onChange: this.onChange,
-            // treeCheckable: true,
-            treeCheckable: true,
-            showCheckedStrategy: SHOW_CHILD,
-            placeholder: '请选择',
-            multiple: true,
-            // disabled:isDetails,
-            allowClear: isDetails ? false : true,
-            style: {
-                width: '100%',
-            },
-        };
-        const options = [
-            { label: '下载', value: 'hasDownload' },
-            { label: '增删改', value: 'hasModify' },
-            { label: '查询', value: 'hasSelect' },
-        ];
-        return (
-            <Form layout="horizontal" labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} form={this.props.form}>
-                {
-                    isDetails ? <FormItem label="申请人">
-                        {getFieldDecorator('createPerson', {
-                            rules: [
-                                { required: true, message: '请输入申请人' },
-                            ],
-                            initialValue: formData.createPerson
-                        })(
-                            <Input placeholder="请输入申请人" disabled={true}
-                                style={{ resize: 'none' }}
-                            />
-                        )}
-                    </FormItem> : null
-                }
-                {
-                    isDetails ? <FormItem label="申请时间">
-                        {getFieldDecorator('createTime', {
-                            rules: [
-                                { required: true, message: '请输入申请时间' },
-                            ],
-                            initialValue: formData.createTime
-                        })(
-                            <Input placeholder="请输入申请时间" disabled={true}
-                                style={{ resize: 'none' }}
-                            />
-                        )}
-                    </FormItem> : null
-                }
-                <FormItem label="申请内容">
-                    {getFieldDecorator('tableNames', {
-                        rules: [
-                            { required: true, message: '请选择申请内容' },
-                        ],
-                        initialValue: formData.tableNames
-                    })(
-                        <TreeSelect {...tProps} />
-                    )}
-                </FormItem>
-                <FormItem label="数据权限类型">
-                    {getFieldDecorator('bizTableConfigName', {
-                        rules: [
-                            { required: true, message: '请选择数据权限类型' },
-                        ],
-                        initialValue: formData.bizTableConfigName
-                    })(
-                        <Checkbox.Group options={options} defaultValue={[]} disabled={isDetails} />
-                    )}
-                </FormItem>
-                <FormItem label="申请理由">
-                    {getFieldDecorator('applyReason', {
-                        initialValue: formData.applyReason,
-                        rules: [
-                            { required: true, message: '请填写申请理由' },
-                        ],
-                    })(
-                        <Input.TextArea
-                            placeholder="请输入申请理由"
-                            autoSize={{ minRows: 5, maxRows: 10 }}
-                            disabled={isDetails}
-                            style={{ resize: 'none' }}
-                        // onChange={(e) => this.inputChange('applyReason', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-            </Form>
-        )
-    }
-
-    handleCancel() {
-        this.setState({ visible: false })
-        this.props.form.resetFields(this.state.resetRoom)
-        // 延期清除表单数据，处理关闭时，闪烁问题
-        setTimeout(() => {
-            this.stores.restForm({})
-        }, 100)
-    }
-
-    handleOk(type) {
-        const { validateFieldsAndScroll } = this.props.form
-        const { formData } = toJS(this.stores.state);
-        if (type == 1) {
-            validateFieldsAndScroll((err, valus) => {
-                if (isEmpty(err)) {
-                    // let tableNamesList = [];
-                    // get(valus, "tableNames", []).map(items => {
-                    //     const actives_s = utils.findNodeTree(this.state.treeDatas, items, "value", "children");
-                    //     if (actives_s) {
-                    //         valus.dataSourceId = actives_s.dsId
-                    //         valus.dataBaseName = actives_s.name
-                    //         tableNamesList.push(actives_s)
-                    //     }
-                    // })
-                    valus.dataSourceId = get(this.props.activeData,"dataSourceId","");
-                    valus.dataBaseName = get(this.props.activeData,"dataBaseName","");
-                    valus.tableNames = valus.tableNames.join(',');
-                    valus.hasDownload = valus.bizTableConfigName.indexOf('hasDownload') > -1 ? true : false;
-                    valus.hasModify = valus.bizTableConfigName.indexOf('hasModify') > -1 ? true : false;
-                    valus.hasSelect = valus.bizTableConfigName.indexOf('hasSelect') > -1 ? true : false;
-                    delete valus.bizTableConfigName;
-                    // this.stores.addDs({...this.props.activeData,...valus}, () => {
-                    this.stores.addDs(valus, () => {
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                            this.setState({ visible: false })
-                            this.props.reloadData()
-                        }, 100)
-                    })
-                }
-            })
-        } else {
-
-        }
-    }
-
-    renderModalFooter(type) {
-        const { loading, formData } = this.stores.state
-        const isDetails = this.props.isDetails;
-
-        return (
-            <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-                <div>
-                    <Button key="back" style={{ display: 'inline' }} onClick={() => this.handleCancel(type)}>
-                        关闭
-                    </Button>
-                    {
-                        !isDetails ? <Button
-                            key="submit"
-                            type="primary"
-                            style={{ display: 'inline', marginLeft: '10px' }}
-                            loading={loading}
-                            onClick={() => this.handleOk(type)}
-                        >
-                            确定
-                        </Button>
-                            : null
-                    }
-
-                </div>
-            </div>
-        )
-    }
-    render() {
-        const { version } = this.stores.state;
-        const { visible } = this.state;
-        const { isDetails, hideAuchStatus = false } = this.props;
-        const { formData } = toJS(this.stores.state);
-        return (
-            <div className={styles.sys_account2} style={{ padding: '12px 16px 16px 16px' }}>
-                <Modal
-                    destroyOnClose
-                    width="900px"
-                    title={isDetails ? '权限详情' : '权限申请'}
-                    className={styles.DataSourceAddModal}
-                    visible={visible}
-                    onCancel={() => {
-                        this.setState({ visible: false })
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                        }, 100)
-                    }}
-                    footer={this.renderModalFooter(1)}
-                >
-                    {
-                        isDetails && !hideAuchStatus ? <p class={'authP'} style={{ border: '2px solid #cd0e0e' }}><span style={{ color: '#cd0e0e' }}>{(formData.auditStatus === null || formData.auditStatus === 0) ? '审批中' : (formData.auditStatus == 1 ? '审批通过' : '已驳回')}</span></p> : null
-                    }
-                    {this.renderForm()}
-                </Modal>
-            </div>
-        )
-    }
-}
-export default Form.create()(ApplyModalView)
-    // export default ApplyModalView;

src/pages/dataApply/dataApplyLess.less

@@ -1,126 +0,0 @@
-
-.sys_account {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-
-  :global {
-    .authP{
-      font-size: 19px;
-      text-align: right;
-      border: 2px solid;
-      display: inline-block;
-      padding: 5px 30px;
-      margin-left: 80%;
-      font-weight: 700;
-    }
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-.authP{
-  font-size: 19px;
-    text-align: right;
-    border: 2px solid;
-    display: inline-block;
-    padding: 5px 30px;
-    font-weight: 700;
-    position: absolute;
-    right: 80px;
-    top: 76px;
-    z-index: 999;
-    transform: rotate(13deg);
-}
-
-.sys_account {
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-    .module_search,
-    .module_line {
-      border-bottom: 8px solid #f5f5f5;
-      padding-bottom: 20px;
-    }
-    
-    .cursor {
-      cursor: pointer;
-    }
-
-    .col_blue {
-      color: #009F95;
-    }
-
-    .flex {
-      display: flex;
-    }
-
-    .module_body {
-      .list_top {
-        display: flex;
-        justify-content: space-between;
-
-        .module_button_area {
-          button {
-            float: right;
-            margin-left: 10px;
-          }
-        }
-      }
-    }
-
-    .ckxq_but {
-      cursor: pointer;
-      color: skyblue;
-    }
-
-  }
-}
-
-.DataSourceAddModal {
-  :global {
-    .ant-form-item-children>div {
-      display: inline-block !important;
-    }
-
-    .ant-form-explain {
-      font-weight: 400;
-      font-size: 12px;
-      line-height: normal;
-      color: #e54747;
-      padding-top: 4px;
-    }
-
-    .has-error .ant-input,
-    .has-error .ant-select-selector {
-      color: rgba(0, 0, 0, 0.6);
-      background-color: #fff;
-      border: 1px #e54747 solid;
-    }
-  }
-}

src/pages/dataApply/dataApplyMod.js

@@ -1,466 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, runInAction, autorun, toJS, computed, makeObservable } from 'mobx'
-// 工具方法
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-// 引入Serv
-import Serv from './dataApplyServ'
-import { message } from 'antd'
-
-
-// 严格模式
-configure({
-  enforceActions: 'observed'
-});
-
-const defaultForm = {
-  id: '',
-  dataSourceName: '',
-  dataSourceType: undefined,
-  remarks: '',
-  jdbcUrl: '',
-  userName: '',
-  passWord: '',
-  originPassword: '',
-  connectionStatus: '',
-  defaultDb: '',
-  kerberos: false,
-  kerberosConfig: '',
-  kerberosConfigFileName: '',
-  kerberosKey: '',
-  kerberosKeyFileName: '',
-  kerberosPrincipal: '',
-  kerberosService: '',
-  defaultFs: '',
-  configuration: ''
-}
-
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class DataApplyMod {
-  constructor() {
-    makeObservable(this);
-  }
-
-  // 监视状态
-  @observable state = {
-    visible: false,
-    createType: 'add', //创建类型，add:新增，edit：修改
-    formData: cloneDeep(defaultForm),
-    version: '',
-    loading: false,
-    selectedTabIndex: "1",
-    dbTypeList: [
-      {
-        value: 'HIVE', babel: 'HIVE'
-      },
-      {
-        value: 'IMPALA', babel: 'IMPALA'
-      },
-      // {
-      //   value:"MYSQL",babel:'MYSQL' //mock
-      // }
-    ],
-    confList: [], //配置文件列表
-    keytabList: [], //证书文件列表
-    tableArr: [],
-    tableArr2: [],
-    allDsAndDbs: []
-  }
-
-  /*
-   * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-   * 设置内容可视性
-   */
-  @action updateState = async (payload) => {
-    // 设置到状态机 - 如果是异步，必须在runInAction
-    runInAction(() => {
-      this.state = {
-        ...this.state,
-        ...payload,
-        formData: {
-          ...this.state.formData,
-          ...payload.formData
-        }
-      }
-    })
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 重置from表单
-  @action restForm = async (payload) => {
-    this.state.formData = cloneDeep(defaultForm)
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 创建数据源
-  @action addDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.addDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-  /**
-   * 记录下载操作的日志
-   */
-  @action recordLogOfDownload = async (params, callback) => {
-    try {
-      const res = await Serv.recordLogOfDownload(params);
-      const { resultCode, resultMsg, data } = res;
-      // 设置的下载文件文件名
-      const fileName = decodeURI(res.headers['content-disposition'].split(";")[1].split("filename=")[1]);
-      callback && callback(data, fileName)
-      // 设置到状态机 - 如果是异步，必须在runInAction
-      if (resultMsg === 'success') {
-      } else {
-        // message.error('请求异常！')
-      }
-    } catch (error) {
-      // message.error('请求异常！')
-    }
-  }
-
-
-  // 获取数据源类型
-  @action queryDbType = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbType(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const dbTypeList = get(data, 'list', [])
-        this.updateState({
-          dbTypeList: dbTypeList
-        })
-      }
-    } catch (error) { }
-  }
-
-
-  /**
- * 查询当前用户所拥有的数据源-数据库列表
- */
-  @action getAllDsAndDbsAndTables = async (params) => {
-    // 请求参数
-    this.updateState({ tableFieldsLoading: true })
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.getAllDsAndDbsAndTables(params)
-      // const { resultCode, resultMsg, data } = arr //mock
-      return new Promise((resolve, reject) => {
-        const allDsAndDbs = data || []
-        // 设置到状态机 - 如果是异步，必须在runInAction
-        runInAction(() => {
-          this.state.allDsAndDbs = allDsAndDbs
-          resolve(allDsAndDbs)
-        })
-      })
-    } catch (error) {
-      console.error(error)
-    } finally {
-      this.updateState({ tableFieldsLoading: false })
-    }
-  }
-  /**
- * 查询当前用户所拥有的数据源-数据库列表
- */
-  @action listDbTables = async (params) => {
-    // 请求参数
-    this.updateState({ tableFieldsLoading: true })
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.listDbTables(params)
-      // const { resultCode, resultMsg, data } = arr //mock
-      return new Promise((resolve, reject) => {
-        resolve(data && data[0] ? data[0] : [])
-        // runInAction(() => {
-        //   // this.state.allDsAndDbs = allDsAndDbs
-        // })
-      })
-    } catch (error) {
-      console.error(error)
-    } finally {
-      this.updateState({ tableFieldsLoading: false })
-    }
-  }
-
-
-  // 分页查询数据源信息
-  @action pageQueryDsInfoMod = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsTblInfo(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr = data ? data.records : []
-        this.updateState({
-          tableArr: tableArr
-        })
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-  // 分页查询数据源信息2
-  @action pageQueryDsInfoMod2 = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo2(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr2 = data ? data.records.map(x => {
-          let str = (x.hasSelect ? '表查询、' : '') + (x.hasDownload ? '下载、' : '') + (x.hasModify ? '增删改、' : '')
-          return {
-            ...x,
-            ...{
-              key: Math.random(),
-              testArr: get(x, 'tableNames', '').split(','),
-              bizTableKey: str.substring(0, str.length - 1)
-              // description : x.bizTableCreateSql,
-            }
-          }
-        }) : [];
-        console.log(tableArr2, "tableArr2")
-        this.updateState({
-          tableArr2: tableArr2
-        })
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-
-  // 根据id查询数据源业务申请权限信息
-  @action selectById = async (payload, callback) => {
-    const params = payload
-
-    try {
-      if (params.type == 2) {
-        payload.datas.bizTableConfigName = [];
-        if (payload.datas.hasDownload) { payload.datas.bizTableConfigName.push('hasDownload') }
-        if (payload.datas.hasModify) { payload.datas.bizTableConfigName.push('hasModify') }
-        if (payload.datas.hasSelect) { payload.datas.bizTableConfigName.push('hasSelect') }
-        payload.datas.tableNames = payload.datas.tableName.split(',');
-        this.updateState({ formData: payload.datas });
-        callback && callback(payload.datas.tableNames)
-      } else {
-        const { resultCode, resultMsg, data } = await Serv.selectById(params.id)
-        if (resultCode == '0') {
-          data.bizTableConfigName = [];
-          if (data.hasDownload) { data.bizTableConfigName.push('hasDownload') }
-          if (data.hasModify) { data.bizTableConfigName.push('hasModify') }
-          if (data.hasSelect) { data.bizTableConfigName.push('hasSelect') }
-          data.tableNames = data.tableNames.split(',');
-          this.updateState({ formData: data });
-
-          callback && callback(data.tableNames)
-        }
-      }
-    } catch (error) { }
-  }
-
-
-
-  // 修改数据源
-  @action updateDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.updateDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-  // 删除数据源记录
-  @action deleteDs = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('删除中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.deleteDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('删除成功！')
-        callback && callback()
-      } else {
-        message.warn(resultMsg || '删除失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      //message.error({ content: '发生异常，删除失败！', key: 'deleteDs' })
-    }
-  }
-
-  // 测试数据源连通性
-  @action testDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('测试中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.testDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('测试成功！')
-        if (_callbck) {
-          _callbck(resultCode)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn('链接失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'testDs' })
-    }
-  }
-  // 潍柴项目设置调度时间
-  @action setDataSourceTask = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      message.loading({ content: '设置中，请稍等...', key: 'setDataSourceTask' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.setDataSourceTask(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date() })
-        message.success({ content: '设置成功！', key: 'setDataSourceTask' })
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'setDataSourceTask' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'setDataSourceTask' })
-    }
-  }
-  // 潍柴手动同步数据源信息
-  @action manualSyncDataSourceMeta = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      //message.loading({ content: '设置中，请稍等...', key: 'manualSyncDataSourceMeta' })
-      const loaddingDialog = message.loading('设置中，请稍等...', 5)
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.manualSyncDataSourceMeta(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        /*
-         * 设置成功，不需要进行提示
-         * message.success({ content: '设置成功！', key: 'manualSyncDataSourceMeta' })
-         */
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'manualSyncDataSourceMeta' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-  // 潍柴获取数据源同步状态
-  @action queryDsSyncStatus = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDsSyncStatus(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        if (data && data.latestSyncStatus == 'success') {
-          message.success({ content: '数据同步成功!' })
-        } else if (data && data.latestSyncStatus == 'fail') {
-          message.success({ content: '数据同步失败!' })
-        }
-        if (_callbck) {
-          _callbck(resultMsg, data)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const dataApplyMod = new DataApplyMod()
-export default dataApplyMod

src/pages/dataApply/dataApplyServ.js

@@ -1,169 +0,0 @@
-import request from '@utils/request'
-
-export default class {
-  //创建数据源
-  static addDs(params) {
-    return request({
-      url: 'api/os/datasource/table/apply/info/insertOsDatasourceTableApplyInfoEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  /**
- * 记录下载操作的日志
- */
-  static recordLogOfDownload(params) {
-    return request({
-      url: `api/biz/table/config/downloadTempFile/${params}`,
-      method: 'POST',
-      responseType: 'arraybuffer',
-      // data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  //更新数据源
-  static updateDs(params) {
-    return request({
-      url: 'api/biz/table/config/updateBizTableConfigEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 删除数据源
-  static deleteDs(params) {
-    return request({
-      url: 'api/os/datasource/info/deleteById/' + params.id,
-      method: 'DELETE',
-      //data: params,
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 测试数据源连通性
-  static testDs(params) {
-    return request({
-      url: 'api/os/datasource/info/testConnect',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询数据源类型
-  static queryDbType(params) {
-    return request({
-      url: 'dataSource/queryDbType',
-      method: 'GET',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-    /**
-   * 查询用户拥有的所有数据源、数据库、数据表的所有信息
-   */
-     static getAllDsAndDbsAndTables(params) {
-      return request({
-        url: 'api/os/datasource/sqlData/listDsAndDbTables',
-        method: 'post',
-        data:params,
-        // 对应后端的应用工程名
-        app: 'ide-op-mgmt-application'
-      })
-    }
-  
-    /**
-   * 查询用户拥有的所有数据源、数据库、数据表的所有信息 - 新
-   */
-     static listDbTables(params) {
-      return request({
-        url: 'api/os/datasource/auth/listDbTables',
-        method: 'post',
-        data:params,
-        // 对应后端的应用工程名
-        app: 'ide-op-mgmt-application'
-      })
-    }
-  
-    
-  // 分页查询用户申请授权表信息
-  static pageQueryDsTblInfo(params) {
-    return request({
-      url: `api/os/datasource/auth/pageQueryDsTblInfo`,
-      method: 'post',
-      data: params,
-    })
-  }
-
-  // 根据id查询数据源业务申请权限信息
-  static selectById(params) {
-    return request({
-      url: `api/os/datasource/table/apply/info/selectById/${params}`,
-      method: 'get',
-      // data: params,
-    })
-  }
-
-  // 查询数据源类型
-  static pageQueryDsInfo2(params) {
-    return request({
-      url: `api/os/datasource/table/apply/info/pageQueryApplyListInfo`,
-      method: 'post',
-      data: params,
-    })
-  }
-
-  //潍柴项目，设置调度任务
-  static setDataSourceTask(params) {
-    return request({
-      url: 'api/os/datasource/info/setDataSourceTask',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-
-  //潍柴项目，手动同步数据源
-  static manualSyncDataSourceMeta(params) {
-    return request({
-      url: 'api/os/datasource/info/manualSyncDataSourceMeta?dsId=' + params.dsId,
-      method: 'GET',
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-  //潍柴项目，获取数据源同步状态
-  static queryDsSyncStatus(params) {
-    return request({
-      url: `api/os/datasource/info/queryDetail/${params}`,
-      method: 'GET',
-    })
-  }
-}

src/pages/dataApply/dataApplyView.jsx

@@ -1,666 +0,0 @@
-/*
-    权限申请
- * @Author: dayan_hjm 
- * @Date: 2023-02-03 17:09:46 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2023-02-24 14:18:37
- */
-
-import React, { Component } from "react";
-import { useHistory, useLocation, withRouter } from "react-router-dom";
-import { Table, Button, Typography, Input, Select, message, Tooltip, InputNumber, Checkbox, Tabs, Row, Col } from 'antd';
-const { TabPane } = Tabs;
-
-import { Form } from '@ant-design/compatible';
-import { QuestionCircleOutlined, UploadOutlined, EditOutlined, CloseOutlined, DeleteOutlined } from '@ant-design/icons';
-import '@ant-design/compatible/assets/index.css';
-import { observer } from 'mobx-react'
-import { isEmpty, uniqueId, get } from 'lodash'
-import { Encrypt, Decrypt } from "@utils/util"
-import moment from 'moment'
-const FormItem = Form.Item;
-import ApplyModal from './applyModal'
-import ApplyModal2 from './applyModal'
-
-// 多类名样式管理工具
-import { toJS } from 'mobx'
-import dataApplyMod from './dataApplyMod';
-// 引入当前页样式 - 模块化
-import styles from './dataApplyless.less'
-
-@withRouter
-class DataApplyView extends Component {
-    // 构造函数，组件的实例创建时，最先执行
-    constructor(props, context) {
-        super(props, context)
-        // 注入的DataApplyMod
-        this.stores = dataApplyMod;
-        this.state = {
-            activeData: 0,
-            uploadInfo: {
-                file: {
-                    status: 0,
-                    response: {
-                        resultCode: 0,
-                        resultMsg: ''
-                    },
-                    name: ''
-                },
-            },
-            total_: {
-                total: 0,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            fruitsuploadList: [],
-            uploadList: [],
-            bizTableConfigId: 0,
-            total: 0,
-            total2: 0,
-            editRecordId: '', //数据编辑行的id
-            setTimeValue: '', //设置的时间x
-            searchParam: {
-                tableName: '',
-                dbsName: '',
-                dataBaseName: '',
-                pageNum: 1,
-                pageSize: 10,
-            },
-            searchParam2: {
-                pageNum: 1,
-                pageSize: 10,
-            },
-            visible: false,
-            resetRoom: [
-                'bizTableName',
-                'bizTableJdbcDs',
-                'dbsName',
-                'bizTableConfigName',
-                'bizTableJdbcUrl',
-                'bizTableJdbcUsername',
-                'bizTableCreateSql',
-                'bizTableJdbcPassword',
-            ],
-        }
-    }
-
-    componentDidMount() {
-        this.loadRoles()
-
-    }
-
-    loadRoles(attrs = []) {
-        const { searchParam, searchParam2 } = this.state;
-        if (this.stores.state.selectedTabIndex == 1) {
-            this.stores.pageQueryDsInfoMod({ ...searchParam, ...attrs }, (res = 0) => {
-                this.setState({ total: res })
-            })
-        } else {
-            const name = localStorage.getItem("account");
-            this.stores.pageQueryDsInfoMod2({
-                ...searchParam2, ...{
-                    account: name
-                }
-            }, (res = 0) => {
-                this.setState({ total2: res })
-            })
-        }
-    };
-
-    inputChange(key, value) {
-        const { resetFields } = this.props.form
-        if (key === 'dbType' || key === 'MYSQL') {
-            this.stores.updateState({
-                formData: {
-                    bizTableConfigName: '',
-                    remarks: '',
-                    jdbcUrl: '',
-                    jdbcUserName: '',
-                    bizTableJdbcPassword: '',
-                    connectionStatus: '',
-                    defaultDb: '',
-                    kerberos: false,
-                    kerberosConfig: '',
-                    kerberosConfigFileName: '',
-                    kerberosKey: '',
-                    kerberosKeyFileName: '',
-                    kerberos: '',
-                    kerberosService: '',
-                    defaultFs: '',
-                    configuration: '',
-                    [key]: value,
-                    originPassword: ''
-                },
-                confList: [],
-                keytabList: []
-            })
-            resetFields(this.state.resetRoom)
-        } else if (key === 'jdbcUrl' || key === 'jdbcUserName' || key === 'bizTableJdbcPassword' || key === 'defaultDb') {
-            this.stores.updateState({
-                formData: {
-                    connectionStatus: '',
-                    [key]: value
-                }
-            })
-        } else if (key === 'kerberos') {
-            this.stores.updateState({
-                formData: {
-                    kerberosConfig: '',
-                    kerberosConfigFileName: '',
-                    kerberosKey: '',
-                    kerberosKeyFileName: '',
-                    kerberos: '',
-                    kerberosService: '',
-                    //jdbcUrl: '',
-                    jdbcUserName: '',
-                    bizTableJdbcPassword: '',
-                    [key]: value
-                },
-                confList: [],
-                keytabList: []
-            })
-            resetFields([
-                'kerberosConfig',
-                'kerberosKey',
-                'kerberos',
-                'kerberosService',
-                //'jdbcUrl',
-                'jdbcUserName',
-                'bizTableJdbcPassword'
-            ])
-        } else {
-            this.stores.updateState({
-                formData: {
-                    [key]: value
-                }
-            })
-        }
-    }
-
-    // 判断是否清空数据源密码
-    getValueFromEvent(e) {
-        let newValue = e.target.value
-        let {
-            formData: { originPassword }
-        } = toJS(this.stores.state)
-        // if (originPassword != '') {
-        //     newValue = ''
-        //     originPassword = ''
-        //     const { setFieldsValue } = this.props.form
-        //     setFieldsValue({ bizTableJdbcPassword: '' })
-        // }
-        this.stores.updateState({
-            formData: {
-                connectionStatus: '',
-                bizTableJdbcPassword: newValue,
-                originPassword: originPassword
-            }
-        })
-        return newValue
-    }
-
-    // 渲染新增修改表单
-    renderForm() {
-        const { getFieldDecorator } = this.props.form
-        const { formData = {} } = toJS(this.stores.state)
-
-        return (
-            <Form layout="horizontal" labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} form={this.props.form}>
-                <FormItem label="权限类型">
-                    {getFieldDecorator('bizTableConfigName', {
-                        rules: [
-                            { required: false, message: '请选择权限类型' },
-                        ],
-                        initialValue: formData.bizTableConfigName
-                    })(
-                        <Checkbox>表查询limit</Checkbox>
-                    )}
-                    <InputNumber min={0} max={200} defaultValue={3} placeholder={'请填写0-200的正整数'} onChange={(val) => {
-                        this.setState({ limitNum1: val })
-                    }} />
-                    <span className="login-form-forgot" href="" style={{ marginLeft: '10px', color: '#b8b8b8', 'font-size': '12px' }}>
-                        注:默认返回200行
-                    </span>
-                </FormItem>
-                <FormItem label="权限类型">
-                    {getFieldDecorator('bizTableConfigName', {
-                        rules: [
-                            { required: false, message: '请选择权限类型' },
-                        ],
-                        initialValue: formData.bizTableConfigName
-                    })(
-                        <Checkbox>下载limit</Checkbox>
-                    )}
-                    <InputNumber min={0} max={30000} defaultValue={3} placeholder={'请填写0-30000的正整数'} onChange={(val) => {
-                        this.setState({ limitNum2: val })
-                    }} />
-                    <span className="login-form-forgot" href="" style={{ marginLeft: '10px', color: '#b8b8b8', 'font-size': '12px' }}>
-                        注:默认返回30000行
-                    </span>
-                </FormItem>
-            </Form>
-        )
-    }
-
-    handleCancel() {
-        this.setState({ visible: false })
-        this.props.form.resetFields(this.state.resetRoom)
-        // 延期清除表单数据，处理关闭时，闪烁问题
-        setTimeout(() => {
-            this.stores.restForm({})
-        }, 100)
-    }
-
-    handleOk(type) {
-        const { validateFieldsAndScroll } = this.props.form
-        const { formData } = toJS(this.stores.state);
-        if (type == 1) {
-            validateFieldsAndScroll((err, valus) => {
-                if (isEmpty(err)) {
-                    //formData.jdbcPassword = Encrypt(formData.jdbcPassword)
-                    formData.bizTableJdbcPassword = Encrypt(formData.bizTableJdbcPassword)
-                    // Encrypt(formData.bizTableJdbcPassword)
-                    if (formData.bizTableConfigId) {
-                        this.stores.updateDs(formData, () => {
-                            this.loadRoles()
-                        })
-                    } else {
-                        this.stores.addDs(formData, () => {
-                            this.loadRoles()
-                        })
-                    }
-                    this.props.form.resetFields()
-                    // 延期清除表单数据，处理关闭时，闪烁问题
-                    setTimeout(() => {
-                        this.stores.restForm({})
-                        this.setState({ visible: false })
-                    }, 100)
-                }
-            })
-        } else {
-
-        }
-    }
-
-    handleDownload = (id) => {
-        message.info('即将开始下载，请稍候...')
-        this.stores
-            .recordLogOfDownload(id, ((data, fileName) => {
-                var blob = new Blob([data], {
-                    type: "application/vnd.ms-excel",
-                });
-                var downloadElement = document.createElement("a");
-                downloadElement.download = fileName;
-                downloadElement.href = window.URL.createObjectURL(blob);
-                downloadElement.click();
-                document.body.appendChild(downloadElement);
-                document.body.removeChild(downloadElement);
-                window.URL.revokeObjectURL(downloadElement.href);
-            }))
-            .then((data) => {
-            })
-            .catch(() => {
-            })
-    }
-
-    renderModalFooter(type) {
-        const { loading, formData } = this.stores.state
-
-        return (
-            <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-                <div>
-                    <Button key="back" style={{ display: 'inline' }} onClick={() => this.handleCancel(type)}>
-                        取消
-                    </Button>
-
-                    <Button
-                        key="submit"
-                        type="primary"
-                        style={{ display: 'inline', marginLeft: '10px' }}
-                        loading={loading}
-                        onClick={() => this.handleOk(type)}
-                    >
-                        确定
-                    </Button>
-                </div>
-            </div>
-        )
-    }
-
-    getParam() {
-        const { searchParam, bizTableConfigId, total } = this.state;
-        return {
-            scroll: { x: 1000 },
-            pagination: {
-                total,
-                pageSize: searchParam.pageSize,
-                onChange: (pageNum) => {
-                    searchParam.pageNum = pageNum;
-                    this.setState(searchParam);
-                    this.loadRoles();
-                }
-            },
-            columns: [
-                //key=one的表头
-                {
-                    title: '数据源名称',
-                    dataIndex: 'name'
-                },
-                {
-                    title: '数据库名称',
-                    dataIndex: 'dataBaseName'
-                },
-                {
-                    title: '数据表名称',
-                    dataIndex: 'tableName'
-                },
-                {
-                    title: '数据源类型',
-                    dataIndex: 'dbType',
-                    emum: {
-                        1: 'Mysql',
-                        2: 'Sqlserver',
-                        3: 'Oracle',
-                        4: 'DRDS',
-                        5: 'Postgresql',
-                        6: 'Prest',
-                        7: 'Hive',
-                        8: 'Elasticsearch',
-                        9: 'MonagDB',
-                        10: 'impala'
-                    }
-                },
-                {
-                    title: '创建时间',
-                    dataIndex: 'createTime'
-                },
-                {
-                    title: '数据权限类型',
-                    dataIndex: 'bizTableKey',
-                    render: (data, row) => {
-                        let str = (row.hasSelect ? '表查询、' : '') + (row.hasDownload ? '下载、' : '') + (row.hasModify ? '增删改、' : '')
-                        return <span>{str.substring(0, str.length - 1)}</span>
-                    }
-                },
-                {
-                    title: '操作',
-                    // fixed: 'right',
-                    // width: 250,
-                    render: (val, record) => {
-                        let data = record;
-                        let showBtn = true;
-                        if ((data.hasDownload && data.hasDownload !== null) && (data.hasModify && data.hasModify !== null) && (data.hasSelect && data.hasSelect !== null)) {
-                            showBtn = false;
-                        }
-                        return (
-                            <span style={{ marginRight: "24px" }}>
-                                {
-                                    showBtn ? <span>
-                                        <a onClick={() => {
-                                            this.setState({ activeData: data })
-                                            this.ApplyModal.getTree(data.dataBaseName, data.dataSourceId)
-                                            setTimeout(() => {
-                                                this.ApplyModal.getFormData(data.dataSourceId,2,data)
-                                            }, 500)
-                                        }}
-                                        >权限申请</a>
-                                    </span> :
-                                        <span>
-                                            <span>已有权限</span>
-                                        </span>
-                                }
-                            </span>
-                        )
-                    }
-                }
-            ],
-            dataSource: toJS(this.stores.state.tableArr)
-        }
-    }
-    getParam2() {
-        const { searchParam2, bizTableConfigId, total2 } = this.state;
-        return {
-            scroll: { x: 1000 },
-            pagination: {
-                total: total2,
-                pageSize: searchParam2.pageSize,
-                onChange: (pageNum) => {
-                    searchParam2.pageNum = pageNum;
-                    this.setState(searchParam2);
-                    this.loadRoles();
-                }
-            },
-            columns: [
-                //key=one的表头
-                {
-                    title: '数据源名称',
-                    dataIndex: 'dataSourceName',
-                    width: 250
-                },
-                {
-                    title: '数据源类型',
-                    dataIndex: 'dbType',
-                    width: 100,
-                    // emum: {
-                    //     1: 'Mysql',
-                    //     2: 'Sqlserver',
-                    //     3: 'Oracle',
-                    //     4: 'DRDS',
-                    //     5: 'Postgresql',
-                    //     6: 'Prest',
-                    //     7: 'Hive',
-                    //     8: 'Elasticsearch',
-                    //     9: 'MonagDB',
-                    //     10: 'impala'
-                    // }
-                },
-                {
-                    title: '数据权限类型',
-                    dataIndex: 'bizTableKey	',
-                    width: 200,
-                    render: (data, row) => {
-                        let str = (row.hasSelect ? '表查询、' : '') + (row.hasDownload ? '下载、' : '') + (row.hasModify ? '增删改、' : '')
-                        return <span>{str.substring(0, str.length - 1)}</span>
-                    }
-                },
-                {
-                    title: '申请人',
-                    dataIndex: 'createPerson',
-                },
-                {
-                    title: '申请时间',
-                    dataIndex: 'createTime'
-                },
-                {
-                    title: '申请状态',
-                    dataIndex: 'auditStatus',
-                    render: (data, row) => {
-                        return <span>{data == 1 ? "审批通过" : (data == 2 ? "已驳回" : "审批中")}</span>
-                    }
-                },
-                {
-                    title: '操作',
-                    // fixed: 'right',
-                    // width: 250,
-                    render: (val, record) => {
-                        let data = record;
-                        return (
-                            <span style={{ marginRight: "24px" }}>
-                                <a
-                                    onClick={() => {
-                                        this.setState({ activeData: data })
-                                        this.ApplyModal2.getTree(data.dataBaseName, data.dataSourceId)
-                                        setTimeout(() => {
-                                            this.ApplyModal2.getFormData(data.id);
-                                            // this.ApplyModal2.setState({ visible: true })
-                                        }, 500)
-                                    }}
-                                >
-                                    详情
-                                </a>
-                            </span>
-                        )
-                    }
-                }
-            ],
-            expandedRowRender: record => {
-                const name_s = get(record, 'tableNames', '').split(',');
-                return (
-                    <div>
-                        {
-                            record.testArr.map((xx, i) => {
-                                return <p style={{ margin: "0px 0 0 46px" }} key={record.id + '0' + i}>
-                                    <span style={{ width: "250px", "display": "inline-block" }} key={record.id + '1' + i}>{name_s[i]}</span>
-                                    <span style={{ width: "100px", "display": "inline-block" }} key={record.id + '2' + i}>{record.dbType}</span>
-                                    <span style={{ width: "200px", "display": "inline-block" }} key={record.id + '3' + i}>{record.bizTableKey}</span></p>
-                            })
-                        }
-                    </div>
-                )
-            },
-            dataSource: toJS(this.stores.state.tableArr2)
-
-        }
-    }
-    render() {
-        const { createType, version, selectedTabIndex } = this.stores.state;
-        const { searchParam, searchParam2, visible } = this.state
-        const param = this.getParam();
-        const param2 = this.getParam2();
-        return (
-            <div className={styles.sys_account2} style={{ padding: '12px 16px 16px 16px' }}>
-                <Tabs
-                    activeKey={selectedTabIndex}
-                    className="main_content_tabs"
-                    onChange={(val) => {
-                        this.stores.updateState({ selectedTabIndex: val });
-                        this.loadRoles()
-                    }}
-                >
-                    <TabPane
-                        tab="权限申请"
-                        key="1"
-                    >
-                        <div className="module_search">
-                            <div className="module_title space">查询条件</div>
-                            <Row type="flex" justify="start" align="middle">
-                                <Col>
-                                    <span>数据源名称：</span>
-                                    <Input
-                                        style={{ width: "180px" }}
-                                        value={searchParam.dbsName}
-                                        placeholder="请输入数据源名称"
-                                        onChange={(e) => {
-                                            searchParam.dbsName = e.target.value;
-                                            this.setState({ ...searchParam });
-                                        }}
-                                        onKeyDown={(e) => {
-                                            if (e.keyCode === 13) {
-                                                searchParam.pageNum = 1;
-                                                this.setState(searchParam);
-                                                this.loadRoles();
-                                            }
-                                        }}
-                                    ></Input>
-                                </Col>
-                                <Col offset={1}>
-                                    <span>数据库名称：</span>
-                                    <Input
-                                        style={{ width: "180px" }}
-                                        value={searchParam.dataBaseName}
-                                        placeholder="请输入数据库名称"
-                                        onChange={(e) => {
-                                            searchParam.dataBaseName = e.target.value;
-                                            this.setState({ ...searchParam });
-                                        }}
-                                        onKeyDown={(e) => {
-                                            if (e.keyCode === 13) {
-                                                searchParam.pageNum = 1;
-                                                this.setState(searchParam);
-                                                this.loadRoles();
-                                            }
-                                        }}
-                                    ></Input>
-                                </Col>
-                                <Col offset={1}>
-                                    <span>数据表名称：</span>
-                                    <Input
-                                        style={{ width: "180px" }}
-                                        value={searchParam.tableName}
-                                        placeholder="请输入数据表名称"
-                                        onChange={(e) => {
-                                            searchParam.tableName = e.target.value;
-                                            this.setState({ ...searchParam });
-                                        }}
-                                        onKeyDown={(e) => {
-                                            if (e.keyCode === 13) {
-                                                searchParam.pageNum = 1;
-                                                this.setState(searchParam);
-                                                this.loadRoles();
-                                            }
-                                        }}
-                                    ></Input>
-                                </Col>
-                            </Row>
-                            <Row type="flex" justify="end" align="middle">
-                                <Col>
-                                    <Button
-                                        type="primary"
-                                        onClick={(e) => {
-                                            this.loadRoles();
-                                        }}
-                                    >
-                                        搜索
-                                    </Button>
-                                </Col>
-                                <Col>
-                                    <Button
-                                        // type="text"
-                                        style={{ marginLeft: 14 }}
-                                        onClick={(e) => {
-                                            searchParam.tableName = "";
-                                            searchParam.dbsName = "";
-                                            searchParam.dataBaseName = '';
-                                            searchParam.pageNum = 1;
-                                            this.setState({ ...searchParam });
-                                            this.loadRoles();
-                                        }}
-                                    >
-                                        重置
-                                    </Button>
-                                </Col>
-                            </Row>
-                        </div>
-                        <span></span>
-                        <div className="module_body">
-                            <div className="title_with_btn list_top">
-                                <div className="module_title">数据申请列表</div>
-                            </div>
-                            <Table style={{ marginTop: "16px" }} {...param}></Table>
-                        </div>
-                        <ApplyModal onRef={(ref) => { this.ApplyModal = ref }} isDetails={false} activeData={this.state.activeData} reloadData={
-                            () => {
-                                this.loadRoles();
-                            }
-                        }></ApplyModal>
-
-                    </TabPane>
-                    <TabPane
-                        tab="我申请的"
-                        key="2"
-                    >
-                        <div className="module_body">
-                            <div className="title_with_btn list_top">
-                            </div>
-                            <Table style={{ marginTop: "16px" }} {...param2}></Table>
-                        </div>
-                        <ApplyModal2 onRef={(ref) => { this.ApplyModal2 = ref }} isDetails={true}></ApplyModal2>
-                    </TabPane>
-
-                </Tabs>
-            </div>
-        )
-    }
-}
-export default Form.create()(DataApplyView)
-// export default DataApplyView;

src/pages/dataSourceManage/dsListLess.less

@@ -1,105 +0,0 @@
-// 其中assets文件夹已经做了webpack别名配置，不需要再使用../../访问，直接加个波浪线
-
-.sys_account {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-
-  :global {
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-
-.sys_account {
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-    .module_search,
-    .module_line {
-      border-bottom: 8px solid #f5f5f5;
-      padding-bottom: 20px;
-    }
-    
-    .cursor {
-      cursor: pointer;
-    }
-
-    .col_blue {
-      color: #009F95;
-    }
-
-    .flex {
-      display: flex;
-    }
-
-    .module_body {
-      .list_top {
-        display: flex;
-        justify-content: space-between;
-
-        .module_button_area {
-          button {
-            float: right;
-            margin-left: 10px;
-          }
-        }
-      }
-    }
-
-    .ckxq_but {
-      cursor: pointer;
-      color: skyblue;
-    }
-
-  }
-}
-
-.DataSourceAddModal {
-  :global {
-    .ant-form-item-children>div {
-      display: inline-block !important;
-    }
-
-    .ant-form-explain {
-      font-weight: 400;
-      font-size: 12px;
-      line-height: normal;
-      color: #e54747;
-      padding-top: 4px;
-    }
-
-    .has-error .ant-input,
-    .has-error .ant-select-selector {
-      color: rgba(0, 0, 0, 0.6);
-      background-color: #fff;
-      border: 1px #e54747 solid;
-    }
-  }
-}

src/pages/dataSourceManage/dsListMod.js

@@ -1,335 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, runInAction, autorun, toJS, computed, makeObservable } from 'mobx'
-// 工具方法
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-// 引入Serv
-import Serv from './dsListServ'
-import { message } from 'antd'
-
-
-// 严格模式
-configure({
-  enforceActions: 'observed'
-});
-
-const defaultForm = {
-  id: '',
-  dataSourceName: '',
-  dataSourceType: undefined,
-  remarks: '',
-  jdbcUrl: '',
-  userName: '',
-  passWord: '',
-  originPassword: '',
-  connectionStatus: '',
-  defaultDb: '',
-  kerberos: false,
-  kerberosConfig: '',
-  kerberosConfigFileName: '',
-  kerberosKey: '',
-  kerberosKeyFileName: '',
-  kerberosPrincipal: '',
-  kerberosService: '',
-  defaultFs: '',
-  configuration: ''
-}
-
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class DsListMod {
-  constructor() {
-    makeObservable(this);
-  }
-
-  // 监视状态
-  @observable state = {
-    visible: false,
-    createType: 'add', //创建类型，add:新增，edit：修改
-    formData: cloneDeep(defaultForm),
-    version: '',
-    loading: false,
-    dbTypeList: [
-      {
-        value: 'HIVE', babel: 'HIVE'
-      },
-      {
-        value: 'IMPALA', babel: 'IMPALA'
-      },
-      {
-        value:"MYSQL",babel:'MYSQL' //mock
-      }
-    ],
-    confList: [], //配置文件列表
-    keytabList: [], //证书文件列表
-    tableArr: []
-  }
-
-  /*
-   * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-   * 设置内容可视性
-   */
-  @action updateState = async (payload) => {
-    // 设置到状态机 - 如果是异步，必须在runInAction
-    runInAction(() => {
-      this.state = {
-        ...this.state,
-        ...payload,
-        formData: {
-          ...this.state.formData,
-          ...payload.formData
-        }
-      }
-    })
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 重置from表单
-  @action restForm = async (payload) => {
-    this.state.formData = cloneDeep(defaultForm)
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 创建数据源
-  @action addDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.addDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-  // 获取数据源类型
-  @action queryDbType = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbType(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const dbTypeList = get(data, 'list', [])
-        this.updateState({
-          dbTypeList: dbTypeList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 分页查询数据源信息
-  @action pageQueryDsInfoMod = async (payload,callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr = get(data, 'records', [])
-        this.updateState({
-          tableArr: tableArr
-        })
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-
-
-  // 修改数据源
-  @action updateDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.updateDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-  // 删除数据源记录
-  @action deleteDs = async (payload,callback) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('删除中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.deleteDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('删除成功！')
-        debugger
-        callback && callback()
-      } else {
-        message.warn(resultMsg || '删除失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      //message.error({ content: '发生异常，删除失败！', key: 'deleteDs' })
-    }
-  }
-
-  // 测试数据源连通性
-  @action testDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('测试中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.testDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('测试成功！')
-        if (_callbck) {
-          _callbck(resultCode)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn('链接失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'testDs' })
-    }
-  }
-  // 潍柴项目设置调度时间
-  @action setDataSourceTask = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      message.loading({ content: '设置中，请稍等...', key: 'setDataSourceTask' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.setDataSourceTask(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date() })
-        message.success({ content: '设置成功！', key: 'setDataSourceTask' })
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'setDataSourceTask' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'setDataSourceTask' })
-    }
-  }
-  // 潍柴手动同步数据源信息
-  @action manualSyncDataSourceMeta = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      //message.loading({ content: '设置中，请稍等...', key: 'manualSyncDataSourceMeta' })
-      const loaddingDialog = message.loading('设置中，请稍等...', 5)
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.manualSyncDataSourceMeta(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        /*
-         * 设置成功，不需要进行提示
-         * message.success({ content: '设置成功！', key: 'manualSyncDataSourceMeta' })
-         */
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'manualSyncDataSourceMeta' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-  // 潍柴获取数据源同步状态
-  @action queryDsSyncStatus = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDsSyncStatus(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        if (data && data.latestSyncStatus == 'success') {
-          message.success({ content: '数据同步成功!' })
-        } else if (data && data.latestSyncStatus == 'fail') {
-          message.success({ content: '数据同步失败!' })
-        }
-        if (_callbck) {
-          _callbck(resultMsg, data)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const dsListMod = new DsListMod()
-export default dsListMod

src/pages/dataSourceManage/dsListServ.js

@@ -1,109 +0,0 @@
-import request from '@utils/request'
-
-export default class {
-  //创建数据源
-  static addDs(params) {
-    return request({
-      url: 'api/os/datasource/info/add',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  //更新数据源
-  static updateDs(params) {
-    return request({
-      url: 'api/os/datasource/info/update',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 删除数据源
-  static deleteDs(params) {
-    return request({
-      url: 'api/os/datasource/info/deleteById/' + params.id,
-      method: 'DELETE',
-      //data: params,
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 测试数据源连通性
-  static testDs(params) {
-    return request({
-      url: 'api/os/datasource/info/testConnect',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询数据源类型
-  static queryDbType(params) {
-    return request({
-      url: 'dataSource/queryDbType',
-      method: 'GET',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询数据源类型
-  static pageQueryDsInfo(params) {
-    return request({
-      url: 'api/os/datasource/info/pageQueryDsInfo',
-      method: 'post',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  //潍柴项目，设置调度任务
-  static setDataSourceTask(params) {
-    return request({
-      url: 'api/os/datasource/info/setDataSourceTask',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-
-  //潍柴项目，手动同步数据源
-  static manualSyncDataSourceMeta(params) {
-    return request({
-      url: 'api/os/datasource/info/manualSyncDataSourceMeta?dsId=' + params.dsId,
-      method: 'GET',
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-    //潍柴项目，获取数据源同步状态
-    static queryDsSyncStatus(params) {
-        return request({
-          url: `api/os/datasource/info/queryDetail/${params}`,
-          method: 'GET',
-        })
-      }
-    }

src/pages/drive/view.jsx

@@ -1,6 +0,0 @@
-import React, { useState } from "react";
-
-const Drive = () => {
-  return <h2>驾驶舱</h2>;
-};
-export default Drive;

src/pages/fileUpload/style.less

@@ -1,22 +0,0 @@
-.systemNotice {
-  :global {
-    background-color: #fff;
-    padding: 20px 16px 16px 16px;
-
-    .publish_btn {
-      display: flex;
-      justify-content: flex-end;
-      margin-bottom: 14px;
-    }
-
-
-    // 系统公告内容
-    .notice_content {
-      display: inline-block;
-      width: 880px;
-      text-overflow: ellipsis;
-      overflow: hidden;/** 隐藏超出的内容 **/
-      white-space: nowrap;
-    }
-  }
-}

src/pages/fileUpload/view.jsx

@@ -1,255 +0,0 @@
-/*
- * @Author: dayan_hjm 
- * @Date: 2022-11-25 09:57:07 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2022-11-28 19:22:35
- */
-
-import React from "react";
-import { useState, useEffect, useRef } from "react";
-import styles from "./style.less";
-import { observer } from "mobx-react";
-import { useHistory } from "react-router-dom";
-import { UploadOutlined } from '@ant-design/icons';
-import {
-  Spin,
-  Form,
-  Modal,
-  Input,
-  Table,
-  Select,
-  Row,
-  Col,
-  Button,
-  message,
-  Breadcrumb,
-  List,
-  Tooltip,
-  Upload
-} from "antd";
-import {
-  getAllTableConfigs, // 文件上传分页
-  preViewFillInData
-} from "@apis/system";
-import { getUnReadMessageNum, getAccountTotalUnReadAndDealMsgInfo } from "@apis/personal";
-import $store from "@store/";
-import TreeSearch from "@components/TreeSelectSearch/view";
-
-export default observer(function (props) {
-  const [form] = Form.useForm();
-  const { TextArea } = Input;
-  const [noticeList, setNoticeList] = useState([]); //文件上传table数据
-  const [uploadList, setUploadList] = useState([]);
-  const [fruitsuploadList, setFruitsUploadList] = useState([]);
-  const [total, setTotal] = useState({
-    total: 0,
-    pageNum: 1,
-    pageSize: 10,
-  }); //文件上传分页总数
-  const [bizTableConfigId, setBizTableConfigId] = useState(0);
-  const [sysUpdateMsgType, setSysUpdateMsgType] = useState(0); //文件上传类型
-  const [loading, setLoading] = useState(false); //加载分页loading
-  const [isShowFeedback, setIsShowFeedback] = useState(false);
-  const [uploadInfo, setuploadInfo] = useState({
-    file: {
-      status: 0,
-      response: {
-        resultCode: 0,
-        resultMsg: ''
-      },
-      name: ''
-    },
-  });
-
-  const uploadProps = {
-    maxCount: 1,
-    showUploadList: false,
-    name: 'excelFile',
-    action: `/api/biz/table/config/uploadExcelDataToDB/${bizTableConfigId}`,
-    headers: {
-      authorization: 'authorization-text',
-      token: sessionStorage.getItem("token")
-    },
-    onChange(info) {
-      if (info.file.status !== 'uploading' && info.file.status !== "removed") {
-        console.log(info.file, info.fileList);
-        setuploadInfo(info);
-        if (info.file.status === 'done' && info.file.response.resultCode == 0) {
-          preViewFillInData(bizTableConfigId,{
-            pageNum:total.pageNum,
-            pageSize: total.pageSize  
-          })
-            .then(({ data, resultCode }) => {
-              if (+resultCode === 0) {
-                let newData = data && data.data && data.data.length > 0 ? data.data : [];
-                setUploadList(newData);
-                setTotal({
-                  total: data.total,
-                  pageNum: data.pageNum,
-                  pageSize: data.pageSize,
-                });
-                if (newData && newData[0]) {
-                  setFruitsUploadList(Object.keys(newData[0]))
-                }
-              }
-            })
-            .catch((resultMsg) => {
-              message.error(resultMsg);
-            });
-        }
-        setTimeout(() => {
-          setIsShowFeedback(true)
-        }, 300);
-      }
-    },
-  };
-  const publishColumn = [
-    {
-      title: "填报配置名称",
-      dataIndex: "bizTableConfigName",
-      key: "bizTableConfigName",
-    },
-    {
-      title: "业务表名",
-      dataIndex: "bizTableName",
-      key: "bizTableName",
-    },
-    {
-      title: "创建时间",
-      dataIndex: "createTime",
-      key: "createTime",
-    },
-    {
-      title: "更新时间",
-      dataIndex: "updateTime",
-      key: "updateTime",
-    },
-    {
-      title: "操作",
-      dataIndex: "operation",
-      render: (val, record, e) => {
-        setBizTableConfigId(record.bizTableConfigId)
-        return (
-          <div className="col_blue">
-            <span>
-              <Upload {...uploadProps}>
-                <Button icon={<UploadOutlined />}>点击上传文件</Button>
-              </Upload>              </span>
-          </div>
-        );
-      },
-    },
-
-  ];
-  const noticeTableOPt = {
-    dataSource: noticeList,
-    columns: publishColumn,
-    pagination: {
-      showSizeChanger: true,
-    },
-  };
-  const noticeTableOPt_modal = {
-    dataSource: uploadList,
-    columns: fruitsuploadList.map(x => {
-      return {
-        dataIndex: x + "",
-        key: x + "",
-        title: x,
-      }
-    }),
-    pagination: {
-      showSizeChanger: false,
-      onChange: (pageNum) => {
-        preViewFillInData(bizTableConfigId,{
-          pageNum:pageNum,
-          pageSize: total.pageSize
-        }).then(({ data, resultCode }) => {
-          if (+resultCode === 0) {
-            let newData = data && data.data && data.data.length > 0 ? data.data : [];
-            setUploadList(newData);
-            setTotal({
-              total: data.total,
-              pageNum: data.pageNum,
-              pageSize: data.pageSize,
-            });
-            if (newData && newData[0]) {
-              setFruitsUploadList(Object.keys(newData[0]))
-            }
-          }
-        })
-        .catch((resultMsg) => {
-          message.error(resultMsg);
-        });
-        setTotal({
-          total: total.total,
-          pageNum: pageNum,
-          pageSize: total.pageSize,
-        });
-      },
-      total: total.total,
-      pageSize: total.pageSize,
-      current: Number(total.pageNum),
-    },
-    scroll: { x: 1300 },
-  };
-  useEffect(() => {
-    getSystemNoticeList();
-  }, []);
-  // 获取文件上传分页数据
-  const getSystemNoticeList = () => {
-    setLoading(true);
-    getAllTableConfigs()
-      .then(({ data, resultCode }) => {
-        setLoading(false);
-        if (+resultCode === 0) {
-          let newData = data && data.length > 0 ? data : [];
-          setNoticeList(newData);
-        }
-      })
-      .catch((resultMsg) => {
-        message.error(resultMsg);
-        setLoading(false);
-      });
-  };
-
-  return (
-    <div className={styles.systemNotice}>
-      <Spin spinning={loading || false}>
-        <div className="module_title space">文件上传</div>
-        <div className="publish_table">
-          <Table {...noticeTableOPt} />
-        </div>
-        <Modal
-          width={900}
-          title="文件上传"
-          visible={isShowFeedback}
-          onCancel={() => {
-            setIsShowFeedback(false);
-          }}
-          footer={
-            [
-              <Button
-                type="primary"
-                key="feedback_1"
-                onClick={() => {
-                  setIsShowFeedback(false);
-                }}
-              >
-                确定
-              </Button>,
-            ]
-          }
-        >
-          {
-            uploadInfo.file.status === 'done' && uploadInfo.file.response.resultCode == 0 ?
-              <div>
-                <p style={{ marginBottom: "20px" }}>文件-{`${uploadInfo.file.name}:`}<span style={{ color: 'green' }}>：上传成功!</span></p>
-                <Table {...noticeTableOPt_modal} />
-              </div>
-              : ((uploadInfo.file.status === 'error' || uploadInfo.file.status === 'done') ? <p>文件-{`${uploadInfo.file.name}:`}<span style={{ color: 'red' }}>上传失败!原因:{uploadInfo.file.response.resultMsg}</span></p> : null)
-          }
-        </Modal>
-      </Spin>
-    </div>
-  );
-});

src/pages/fileUploadDetail/fileUploadDetailLess.less

@@ -1,105 +0,0 @@
-// 其中assets文件夹已经做了webpack别名配置，不需要再使用../../访问，直接加个波浪线
-
-.sys_account {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-
-  :global {
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-
-.sys_account {
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-    .module_search,
-    .module_line {
-      border-bottom: 8px solid #f5f5f5;
-      padding-bottom: 20px;
-    }
-    
-    .cursor {
-      cursor: pointer;
-    }
-
-    .col_blue {
-      color: #009F95;
-    }
-
-    .flex {
-      display: flex;
-    }
-
-    .module_body {
-      .list_top {
-        display: flex;
-        justify-content: space-between;
-
-        .module_button_area {
-          button {
-            float: right;
-            margin-left: 10px;
-          }
-        }
-      }
-    }
-
-    .ckxq_but {
-      cursor: pointer;
-      color: skyblue;
-    }
-
-  }
-}
-
-.DataSourceAddModal {
-  :global {
-    .ant-form-item-children>div {
-      display: inline-block !important;
-    }
-
-    .ant-form-explain {
-      font-weight: 400;
-      font-size: 12px;
-      line-height: normal;
-      color: #e54747;
-      padding-top: 4px;
-    }
-
-    .has-error .ant-input,
-    .has-error .ant-select-selector {
-      color: rgba(0, 0, 0, 0.6);
-      background-color: #fff;
-      border: 1px #e54747 solid;
-    }
-  }
-}

src/pages/fileUploadDetail/fileUploadDetailMod.js

@@ -1,335 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, runInAction, autorun, toJS, computed, makeObservable } from 'mobx'
-// 工具方法
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-// 引入Serv
-import Serv from './fileUploadDetailServ'
-import { message } from 'antd'
-
-
-// 严格模式
-configure({
-  enforceActions: 'observed'
-});
-
-const defaultForm = {
-  id: '',
-  dataSourceName: '',
-  dataSourceType: undefined,
-  remarks: '',
-  jdbcUrl: '',
-  userName: '',
-  passWord: '',
-  originPassword: '',
-  connectionStatus: '',
-  defaultDb: '',
-  kerberos: false,
-  kerberosConfig: '',
-  kerberosConfigFileName: '',
-  kerberosKey: '',
-  kerberosKeyFileName: '',
-  kerberosPrincipal: '',
-  kerberosService: '',
-  defaultFs: '',
-  configuration: ''
-}
-
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class FileUploadDetailMod {
-  constructor() {
-    makeObservable(this);
-  }
-
-  // 监视状态
-  @observable state = {
-    visible: false,
-    createType: 'add', //创建类型，add:新增，edit：修改
-    formData: cloneDeep(defaultForm),
-    version: '',
-    loading: false,
-    dbTypeList: [
-      {
-        value: 'HIVE', babel: 'HIVE'
-      },
-      {
-        value: 'IMPALA', babel: 'IMPALA'
-      },
-      // {
-      //   value:"MYSQL",babel:'MYSQL' //mock
-      // }
-    ],
-    confList: [], //配置文件列表
-    keytabList: [], //证书文件列表
-    tableArr: []
-  }
-
-  /*
-   * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-   * 设置内容可视性
-   */
-  @action updateState = async (payload) => {
-    // 设置到状态机 - 如果是异步，必须在runInAction
-    runInAction(() => {
-      this.state = {
-        ...this.state,
-        ...payload,
-        formData: {
-          ...this.state.formData,
-          ...payload.formData
-        }
-      }
-    })
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 重置from表单
-  @action restForm = async (payload) => {
-    this.state.formData = cloneDeep(defaultForm)
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 创建数据源
-  @action addDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.addDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-  // 获取数据源类型
-  @action queryDbType = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbType(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const dbTypeList = get(data, 'list', [])
-        this.updateState({
-          dbTypeList: dbTypeList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 分页查询数据源信息
-  @action pageQueryDsInfoMod = async (payload,callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr = get(data, 'records', [])
-        this.updateState({
-          tableArr: tableArr
-        })
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-
-
-  // 修改数据源
-  @action updateDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.updateDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-  // 删除数据源记录
-  @action deleteDs = async (payload,callback) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('删除中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.deleteDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('删除成功！')
-        debugger
-        callback && callback()
-      } else {
-        message.warn(resultMsg || '删除失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      //message.error({ content: '发生异常，删除失败！', key: 'deleteDs' })
-    }
-  }
-
-  // 测试数据源连通性
-  @action testDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('测试中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.testDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('测试成功！')
-        if (_callbck) {
-          _callbck(resultCode)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn('链接失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'testDs' })
-    }
-  }
-  // 潍柴项目设置调度时间
-  @action setDataSourceTask = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      message.loading({ content: '设置中，请稍等...', key: 'setDataSourceTask' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.setDataSourceTask(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date() })
-        message.success({ content: '设置成功！', key: 'setDataSourceTask' })
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'setDataSourceTask' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'setDataSourceTask' })
-    }
-  }
-  // 潍柴手动同步数据源信息
-  @action manualSyncDataSourceMeta = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      //message.loading({ content: '设置中，请稍等...', key: 'manualSyncDataSourceMeta' })
-      const loaddingDialog = message.loading('设置中，请稍等...', 5)
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.manualSyncDataSourceMeta(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        /*
-         * 设置成功，不需要进行提示
-         * message.success({ content: '设置成功！', key: 'manualSyncDataSourceMeta' })
-         */
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'manualSyncDataSourceMeta' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-  // 潍柴获取数据源同步状态
-  @action queryDsSyncStatus = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDsSyncStatus(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        if (data && data.latestSyncStatus == 'success') {
-          message.success({ content: '数据同步成功!' })
-        } else if (data && data.latestSyncStatus == 'fail') {
-          message.success({ content: '数据同步失败!' })
-        }
-        if (_callbck) {
-          _callbck(resultMsg, data)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const fileUploadDetailMod = new FileUploadDetailMod()
-export default fileUploadDetailMod

src/pages/fileUploadDetail/fileUploadDetailServ.js

@@ -1,109 +0,0 @@
-import request from '@utils/request'
-
-export default class {
-  //创建数据源
-  static addDs(params) {
-    return request({
-      url: 'api/os/datasource/info/add',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  //更新数据源
-  static updateDs(params) {
-    return request({
-      url: 'api/os/datasource/info/update',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 删除数据源
-  static deleteDs(params) {
-    return request({
-      url: 'api/os/datasource/info/deleteById/' + params.id,
-      method: 'DELETE',
-      //data: params,
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 测试数据源连通性
-  static testDs(params) {
-    return request({
-      url: 'api/os/datasource/info/testConnect',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询数据源类型
-  static queryDbType(params) {
-    return request({
-      url: 'dataSource/queryDbType',
-      method: 'GET',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询数据源类型
-  static pageQueryDsInfo(params) {
-    return request({
-      url: 'api/biz/table/config/pageUploadRecordInfo',
-      method: 'post',
-      data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  //潍柴项目，设置调度任务
-  static setDataSourceTask(params) {
-    return request({
-      url: 'api/os/datasource/info/setDataSourceTask',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-
-  //潍柴项目，手动同步数据源
-  static manualSyncDataSourceMeta(params) {
-    return request({
-      url: 'api/os/datasource/info/manualSyncDataSourceMeta?dsId=' + params.dsId,
-      method: 'GET',
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-    //潍柴项目，获取数据源同步状态
-    static queryDsSyncStatus(params) {
-        return request({
-          url: `api/os/datasource/info/queryDetail/${params}`,
-          method: 'GET',
-        })
-      }
-    }

src/pages/fileUploadDetail/fileUploadDetailView.jsx

@@ -1,624 +0,0 @@
-/*
-    新-文件上传
- * @Author: dayan_hjm 
- * @Date: 2022-12-20 10:27:48 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2023-02-15 11:45:33
- */
-
-
-import React, { Component } from "react";
-import { Table, Button, Badge, Modal, Input, Select, message, Tooltip, Radio, Upload, TimePicker, Row, Col } from 'antd'
-import { Form } from '@ant-design/compatible';
-import { QuestionCircleOutlined, UploadOutlined, EditOutlined, CloseOutlined, DeleteOutlined } from '@ant-design/icons';
-import '@ant-design/compatible/assets/index.css';
-import { observer } from 'mobx-react'
-import { withRouter } from 'react-router-dom'
-import { isEmpty, uniqueId, queryToObj } from 'lodash'
-import { Encrypt } from "@utils/util"
-import moment from 'moment'
-const FormItem = Form.Item;
-import { preRecordViewFillInData } from "@apis/system";
-// 站点配置
-import config from '@config/config';
-
-// 引入当前页样式 - 模块化
-import styles from './fileUploadDetailless.less'
-// 多类名样式管理工具
-import { toJS } from 'mobx'
-import fileUploadDetailMod from './fileUploadDetailMod'
-
-// 在组件中可通过this.props.history.push跳转路由
-@withRouter
-@observer
-
-class FileUploadDetailView extends Component {
-    // 构造函数，组件的实例创建时，最先执行
-    constructor(props, context) {
-        super(props, context)
-        // 注入的FileUploadDetailMod
-        this.stores = fileUploadDetailMod;
-        this.state = {
-            fruitsuploadList: [],
-            uploadList: [],
-            str:'< 返回上一页',
-            uploadInfo: {
-                file: {
-                    status: 0,
-                    response: {
-                        resultCode: 0,
-                        resultMsg: ''
-                    },
-                    name: ''
-                },
-            },
-            total_: {
-                total: 0,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            isShowFeedback: false,
-            bizTableConfigId: 0,
-            total: 0,
-            editRecordId: '', //数据编辑行的id
-            setTimeValue: '', //设置的时间x
-            searchParam: {
-                name: '',
-                dbType: '',
-                pageNum: 1,
-                pageSize: 10,
-            },
-            visible: false,
-            resetRoom: [
-                'name',
-                'remarks',
-                'jdbcUrl',
-                'jdbcUserName',
-                'jdbcPassword',
-                'defaultDb',
-                'kerberos',
-                'kerberosConfig',
-                'kerberosKey',
-                'kerberos',
-                'kerberosService',
-                'defaultFs',
-                'configuration'
-            ]
-        }
-        this.timer = null //定时器，用于检测同步状态
-        this.count = 0 //检测的次数
-    }
-
-    componentDidMount() {
-        this.loadRoles()
-    }
-
-    loadRoles(attrs = []) {
-        // let searchInstance = queryToObj(); // url查询参数对象化
-        const { searchParam } = this.state;
-        let params = { ...searchParam, ...attrs, ...{ bizTableConfigId: this.props.match.params.id } };
-        this.stores.pageQueryDsInfoMod(params, (res = 0) => {
-            this.setState({ total: res })
-        })
-    };
-
-    inputChange(key, value) {
-        const { resetFields } = this.props.form
-        if (key === 'dbType' || key === 'MYSQL') {
-            this.stores.updateState({
-                formData: {
-                    name: '',
-                    remarks: '',
-                    jdbcUrl: '',
-                    jdbcUserName: '',
-                    jdbcPassword: '',
-                    connectionStatus: '',
-                    defaultDb: '',
-                    kerberos: false,
-                    kerberosConfig: '',
-                    kerberosConfigFileName: '',
-                    kerberosKey: '',
-                    kerberosKeyFileName: '',
-                    kerberos: '',
-                    kerberosService: '',
-                    defaultFs: '',
-                    configuration: '',
-                    [key]: value,
-                    originPassword: ''
-                },
-                confList: [],
-                keytabList: []
-            })
-            resetFields(this.state.resetRoom)
-        } else if (key === 'jdbcUrl' || key === 'jdbcUserName' || key === 'jdbcPassword' || key === 'defaultDb') {
-            this.stores.updateState({
-                formData: {
-                    connectionStatus: '',
-                    [key]: value
-                }
-            })
-        } else if (key === 'kerberos') {
-            this.stores.updateState({
-                formData: {
-                    kerberosConfig: '',
-                    kerberosConfigFileName: '',
-                    kerberosKey: '',
-                    kerberosKeyFileName: '',
-                    kerberos: '',
-                    kerberosService: '',
-                    //jdbcUrl: '',
-                    jdbcUserName: '',
-                    jdbcPassword: '',
-                    [key]: value
-                },
-                confList: [],
-                keytabList: []
-            })
-            resetFields([
-                'kerberosConfig',
-                'kerberosKey',
-                'kerberos',
-                'kerberosService',
-                //'jdbcUrl',
-                'jdbcUserName',
-                'jdbcPassword'
-            ])
-        } else {
-            this.stores.updateState({
-                formData: {
-                    [key]: value
-                }
-            })
-        }
-    }
-
-    // 判断是否清空数据源密码
-    getValueFromEvent(e) {
-        let newValue = e.target.value
-        let {
-            formData: { originPassword }
-        } = toJS(this.stores.state)
-        if (originPassword != '') {
-            newValue = ''
-            originPassword = ''
-            const { setFieldsValue } = this.props.form
-            setFieldsValue({ jdbcPassword: '' })
-        }
-        this.stores.updateState({
-            formData: {
-                connectionStatus: '',
-                jdbcPassword: newValue,
-                originPassword: originPassword
-            }
-        })
-        return newValue
-    }
-
-    // 渲染新增修改表单
-    renderForm() {
-        const { getFieldDecorator } = this.props.form
-        const { formData = {} } = toJS(this.stores.state)
-
-        return (
-            <Form layout="horizontal" labelCol={{ span: 5 }} wrapperCol={{ span: 19 }}>
-
-                <FormItem label="文件名称">
-                    {getFieldDecorator('name', {
-                        rules: [
-                            { required: true, message: '请输入文件名称' },
-                            { max: 32, message: '最多只能输入32个字' }
-                        ],
-                        initialValue: formData.name
-                    })(
-                        <Input
-                            /* disabled={formData.id ? true : false} */
-                            placeholder="请输入文件名称，32个字"
-                            onChange={(e) => this.inputChange('name', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-                <FormItem label="分类">
-                    {getFieldDecorator('type', {
-                        rules: [
-                            { required: true, message: '请输入分类' },
-                        ],
-                        initialValue: formData.type
-                    })(
-                        <Input
-                            /* disabled={formData.id ? true : false} */
-                            placeholder="请输入分类，32个字"
-                            onChange={(e) => this.inputChange('type', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-                <FormItem label='表名'>
-                    {getFieldDecorator('jdbcUrl', {
-                        rules: [{ required: true, message: '请输入表名' }],
-                        initialValue: formData.jdbcUrl
-                    })(
-                        <Input
-                            placeholder={'请输入表名'}
-                            onChange={(e) => this.inputChange('jdbcUrl', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-
-                <FormItem label="数据源名称">
-                    {getFieldDecorator('defaultDb', {
-                        rules: [
-                            {
-                                required: formData.dbType == '2' ? false : true,
-                                message: '请输入数据源名称'
-                            }
-                        ],
-                        initialValue: formData.defaultDb
-                    })(<Input placeholder="请输入数据源名称" onChange={(e) => this.inputChange('defaultDb', e.target.value)} />)}
-                </FormItem>
-
-                <FormItem label="数据源连接">
-                    {getFieldDecorator('kerberos', {
-                        rules: [
-                            {
-                                required: true,
-                                message: '请输入数据源连接'
-                            }
-                        ],
-                        initialValue: formData.kerberos
-                    })(
-                        <Input
-                            placeholder="Kerberos认证数据源连接名，比如XXXX/Hadoopclient@xxx.xxx"
-                            onChange={(e) => this.inputChange('kerberos', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-
-                <FormItem label="数据源账号">
-                    {getFieldDecorator('jdbcUserName', {
-                        rules: [{ required: false, message: '请输入数据源账号' }],
-                        initialValue: formData.jdbcUserName
-                    })(<Input placeholder="请输入数据源账号" onChange={(e) => this.inputChange('jdbcUserName', e.target.value)} />)}
-                </FormItem>
-                <FormItem label="数据源密码">
-                    {getFieldDecorator('jdbcPassword', {
-                        rules: [{ required: false, message: '请输入数据源密码' }],
-                        initialValue: formData.jdbcPassword,
-                        getValueFromEvent: (e) => this.getValueFromEvent(e)
-                    })(<Input type="jdbcpassword" placeholder="请输入数据源密码" />)}
-                </FormItem>
-
-                <FormItem label="业务表建表数据">
-                    {getFieldDecorator('kerberosService', {
-                        rules: [{ required: true, message: '请输入kerberos业务表建表数据' }],
-                        initialValue: formData.kerberosService
-                    })(
-                        <Input
-                            placeholder="请输入kerberos业务表建表数据"
-                            onChange={(e) => this.inputChange('kerberosService', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-            </Form>
-        )
-    }
-
-    handleCancel() {
-        this.stores.updateState({ visible: false })
-        this.props.form.resetFields(this.state.resetRoom)
-    }
-
-    handleOk() {
-        const { validateFieldsAndScroll } = this.props.form
-        const { formData } = toJS(this.stores.state)
-        validateFieldsAndScroll((err, valus) => {
-            if (isEmpty(err)) {
-                //formData.jdbcPassword = Encrypt(formData.jdbcPassword)
-                formData.jdbcPassword = formData.originPassword ? formData.jdbcPassword : Encrypt(formData.jdbcPassword)
-                delete formData.kerberos
-                delete formData.connectionStatus
-                // Encrypt(formData.jdbcPassword)
-                if (formData.id) {
-                    formData.dsId = formData.id
-                    this.stores.updateDs(formData, () => {
-                        this.props.form.resetFields(this.state.resetRoom)
-                        this.loadRoles()
-                    })
-                } else {
-                    this.stores.addDs(formData, () => {
-                        this.props.form.resetFields(this.state.resetRoom)
-                        this.loadRoles()
-                    })
-                }
-            }
-        })
-    }
-    renderModalFooter() {
-        const { loading, formData } = this.stores.state
-
-        return (
-            <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-                <div>
-                    <Button key="back" style={{ display: 'inline' }} onClick={() => this.handleCancel()}>
-                        取消
-                    </Button>
-
-                    <Button
-                        key="submit"
-                        type="primary"
-                        style={{ display: 'inline', marginLeft: '10px' }}
-                        loading={loading}
-                        onClick={() => this.handleOk()}
-                    >
-                        确定
-                    </Button>
-                </div>
-            </div>
-        )
-    }
-
-    getParam() {
-        const { searchParam, total, bizTableConfigId, total_ } = this.state;
-
-        return {
-            scroll: { x: 1000 },
-            pagination: {
-                onChange: (pageNum) => {
-                    searchParam.pageNum = pageNum;
-                    this.setState({ ...searchParam });
-                    this.loadRoles();
-                },
-                current: searchParam.pageNum,
-                pageSize: searchParam.pageSize,
-                total: Number(total),
-            },
-            columns: [
-                //key=one的表头
-                // {
-                //     title: '文件名称',
-                //     dataIndex: 'name'
-                // },
-                {
-                    title: '数据量',
-                    dataIndex: 'successNum',
-                },
-                {
-                    title: '状态',
-                    dataIndex: 'fillStatus',
-                    render: (data, row) => {
-                        return <span>{data == '0' ? '填报中' : (data == '1' ? '成功' : '失败')}</span>
-                    }
-                },
-                {
-                    title: '操作人',
-                    dataIndex: 'fillPerson'
-                },
-                {
-                    title: '操作时间',
-                    dataIndex: 'fillTime'
-                },
-                {
-                    title: '操作',
-                    // fixed: 'right',
-                    // width: 250,
-                    render: (val, record) => {
-                        let data = record;
-                        return (
-                            <span style={{ marginRight: "24px" }}>
-                                <span>
-                                    <a onClick={() => {
-                                        preRecordViewFillInData(data.bizTableResultId, {
-                                            pageNum: 1,
-                                            pageSize: total_.pageSize
-                                        }).then(({ data, resultCode }) => {
-                                            if (+resultCode === 0) {
-                                                let newData = data && data.data && data.data.length > 0 ? data.data : [];
-                                                this.setState({
-                                                    uploadList: newData, total_: {
-                                                        // total: data.total,
-                                                        pageNum: data.pageNum,
-                                                        pageSize: data.pageSize,
-                                                    }
-                                                })
-                                                if (newData && newData[0]) {
-                                                    this.setState({ fruitsuploadList: Object.keys(newData[0]) })
-                                                }
-                                            }
-                                            this.setState({ isShowFeedback: true })
-                                        })
-                                    }}
-                                    >数据预览</a>
-                                </span>
-
-                            </span>
-                        )
-                    }
-                }
-            ],
-            dataSource: toJS(this.stores.state.tableArr)
-
-        }
-    }
-    render() {
-        const { visible, createType, version } = this.stores.state;
-
-        const { isShowFeedback, total_, bizTableConfigId, uploadInfo, uploadList, fruitsuploadList } = this.state
-        const noticeTableOPt_modal = {
-            dataSource: uploadList,
-            columns: fruitsuploadList.map(x => {
-                return {
-                    dataIndex: x + "",
-                    key: x + "",
-                    title: x,
-                }
-            }),
-            pagination: false,
-            // pagination: {
-            //     showSizeChanger: false,
-            //     onChange: (pageNum) => {
-            //         preRecordViewFillInData(bizTableConfigId, {
-            //             pageNum: pageNum,
-            //             pageSize: total_.pageSize
-            //         }).then(({ data, resultCode }) => {
-            //             if (+resultCode === 0) {
-            //                 let newData = data && data.data && data.data.length > 0 ? data.data : [];
-            //                 this.setState({
-            //                     uploadList: newData, total_: {
-            //                         total: data.total,
-            //                         pageNum: data.pageNum,
-            //                         pageSize: data.pageSize,
-            //                     }
-            //                 })
-            //                 if (newData && newData[0]) {
-            //                     this.setState({ fruitsuploadList: Object.keys(newData[0]) })
-            //                 }
-            //             }
-            //         })
-            //             .catch((resultMsg) => {
-            //                 message.error(resultMsg);
-            //             });
-            //         // setTotal({
-            //         //   total: total.total,
-            //         //   pageNum: pageNum,
-            //         //   pageSize: total.pageSize,
-            //         // });
-            //     },
-            //     total: total_.total,
-            //     pageSize: total_.pageSize,
-            //     current: Number(total_.pageNum),
-            // },
-            scroll: { x: 1000 },
-        };
-
-        const param = this.getParam();
-
-        return (
-            <div className={styles.sys_account}>
-                {/* <div className="module_search">
-                    <div className="module_title space">查询条件</div>
-                    <Row type="flex" justify="start" align="middle">
-                        <Col>
-                            <span>分类：</span>
-                            <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.roleName}
-                                placeholder="请输入分类"
-                                onChange={(e) => {
-                                    searchParam.name = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input>
-                        </Col>
-                        <Col offset={1}>
-                            <span>文件名称:</span>
-                            <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.roleName2}
-                                placeholder="请输入文件名称"
-                                onChange={(e) => {
-                                    searchParam.roleName2 = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input>
-                        </Col>
-                    </Row>
-                    <Row type="flex" justify="end" align="middle">
-                        <Col>
-                            <Button
-                                type="primary"
-                                onClick={(e) => {
-                                    this.loadRoles();
-                                }}
-                            >
-                                搜索
-                            </Button>
-                        </Col>
-                        <Col>
-                            <Button
-                                // type="text"
-                                style={{ marginLeft: 14 }}
-                                onClick={(e) => {
-                                    searchParam.name = "";
-                                    searchParam.dbType = "";
-                                    searchParam.pageNum = 1;
-                                    this.setState({ ...searchParam });
-                                    this.loadRoles();
-                                }}
-                            >
-                                重置
-                            </Button>
-                        </Col>
-                    </Row>
-                </div> */}
-
-                <div className="module_body">
-                    <Button type="dashed" shape="round" style={{'margin-bottom': '10px'}} onClick={(e) => {
-                        this.props.history.push("/home/fileUploadNewView");
-                    }}>{this.state.str}</Button>
-                    <div className="title_with_btn list_top">
-                        <div className="module_title">上传记录</div>
-                    </div>
-                    <Table style={{ marginTop: "16px" }} {...param}></Table>
-                </div>
-
-
-                <Modal
-                    maskClosable={false}
-                    width="900px"
-                    title={createType === 'add' ? '新增文件' : '修改文件'}
-                    className={styles.DataSourceAddModal}
-                    visible={visible}
-                    onCancel={() => {
-                        this.stores.updateState({ visible: false })
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                        }, 100)
-                    }}
-                    footer={this.renderModalFooter()}
-                >
-                    {this.renderForm()}
-                </Modal>
-                <Modal
-                    width={900}
-                    title="文件上传"
-                    visible={isShowFeedback}
-                    onCancel={() => {
-                        this.setState({ isShowFeedback: false });
-                    }}
-                    footer={
-                        [
-                            <Button
-                                type="primary"
-                                key="feedback_1"
-                                onClick={() => {
-                                    this.setState({ isShowFeedback: false });
-                                }}
-                            >
-                                确定
-                            </Button>,
-                        ]
-                    }
-                >
-                    <Table {...noticeTableOPt_modal} />
-                </Modal>
-
-            </div>
-        )
-    }
-}
-export default Form.create()(FileUploadDetailView)
-// export default FileUploadDetailView;

src/pages/fileUploadNew/api.js

@@ -1,238 +0,0 @@
-import request from "@utils/request";
-export const fileUrl =
-  window.location.origin +
-  window.location.pathname.split("/transfer")[0] +
-  (window.location.href.indexOf("/suggest-report") !== -1
-    ? ""
-    : "/suggest-report");
-
-//配置
-//同步部门数据到区域权限
-export function syncData() {
-  return request({
-    url: `suggest-report/api/data-resource/sync-department-data-resource`,
-    method: "post",
-  });
-}
-//可配置基地/leader/configurable-bases
-export function configurableBases() {
-  return request({
-    url: `suggest-report/api/leader/configurable-bases`,
-    method: "GET",
-  });
-}
-//用户列表/leader/users
-export function configurableUsers(params) {
-  return request({
-    url: `suggest-report/api/leader/users`,
-    method: "GET",
-    data: params,
-  });
-}
-//新增负责人
-export function leaderAdd(data) {
-  return request({
-    url: `suggest-report/api/leader/add`,
-    method: "post",
-    data,
-  });
-}
-//删除
-export function leaderDelete(data) {
-  return request({
-    url: `suggest-report/api/leader/delete`,
-    method: "post",
-    data,
-  });
-}
-//更新/leader/update
-export function leaderUpdate(data) {
-  return request({
-    url: `suggest-report/api/leader/update`,
-    method: "post",
-    data,
-  });
-}
-
-// 建议提报
-//建议类型
-export function reportCategories(data) {
-  return request({
-    url: `suggest-report/api/report/categories`,
-    method: "GET",
-    data,
-  });
-}
-//基地
-export function reportBases() {
-  return request({
-    url: `suggest-report/api/report/bases`,
-    method: "GET",
-  });
-}
-//部门
-export function reportDepartments() {
-  return request({
-    url: `suggest-report/api/report/report-departments`,
-    method: "GET",
-  });
-}
-//提报列表/report/page-and-count
-export function reportList(data) {
-  return request({
-    url: `suggest-report/api/report/page-and-count`,
-    method: "post",
-    data,
-  });
-}
-
-//提报主题
-export function reportSubjects() {
-  return request({
-    url: `suggest-report/api/report/subjects`,
-    method: "GET",
-  });
-}
-
-//新建提报
-export function reportSubmit(data) {
-  return request({
-    url: `suggest-report/api/report/submit`,
-    method: "post",
-    data,
-  });
-}
-
-//提报详情 /report/detail
-export function reportDetail(params) {
-  return request({
-    url: `suggest-report/api/report/detail`,
-    method: "GET",
-    data: params,
-  });
-}
-//撤回提报/report/revocation
-export function reportRevocation(data) {
-  return request({
-    url: `suggest-report/api/report/revocation`,
-    method: "post",
-    data,
-  });
-}
-//提报人信息
-// 提报人ID，为空时默认当前用户,reporterId?: number;
-export function reportInfo() {
-  return request({
-    url: `suggest-report/api/report/reporter-info`,
-    method: "GET",
-  });
-}
-
-//审核
-//主负责部门
-export function dutyDepartments(data) {
-  return request({
-    url: `suggest-report/api/report/duty-departments`,
-    method: "GET",
-    data,
-  });
-}
-//主责任人/report/duty-persons
-export function dutyPersons(params) {
-  return request({
-    url: `suggest-report/api/report/duty-persons`,
-    method: "GET",
-    data: params,
-  });
-}
-//常用意见列表
-export function reportAdvices(params) {
-  return request({
-    url: `suggest-report/api/report/common-advices`,
-    method: "GET",
-    data: params,
-  });
-}
-//归口部门复核
-export function reportRecheck(data) {
-  return request({
-    url: `suggest-report/api/report/recheck`,
-    method: "post",
-    data,
-  });
-}
-//责任部门评审/report/duty-approval
-export function dutyApproval(data) {
-  return request({
-    url: `suggest-report/api/report/duty-approval`,
-    method: "post",
-    data,
-  });
-}
-//总经理审批/report/general-manager-approval
-export function generalManagerApproval(data) {
-  return request({
-    url: `suggest-report/api/report/general-manager-approval`,
-    method: "post",
-    data,
-  });
-}
-//实施总结/report/improvement-sum-up
-export function improvementSumUp(data) {
-  return request({
-    url: `suggest-report/api/report/improvement-sum-up`,
-    method: "post",
-    data,
-  });
-}
-//验收/report/finally-check
-export function finallyCheck(data) {
-  return request({
-    url: `suggest-report/api/report/finally-check`,
-    method: "post",
-    data,
-  });
-}
-//默认奖金金额/report/default-bonus-amount
-export function defaultBonusAmount(data) {
-  return request({
-    url: `suggest-report/api/report/default-bonus-amount`,
-    method: "get",
-    data,
-  });
-}
-//采纳奖金/report/accept-bonus-check
-export function acceptBonusCheck(data) {
-  return request({
-    url: `suggest-report/api/report/accept-bonus-check`,
-    method: "post",
-    data,
-  });
-}
-//评优奖金/report/appraise-bonus-check
-export function appraiseBonusCheck(data) {
-  return request({
-    url: `suggest-report/api/report/appraise-bonus-check`,
-    method: "post",
-    data,
-  });
-}
-//结果评优/report/appraise
-export function reportAppraise(data) {
-  return request({
-    url: `suggest-report/api/report/appraise`,
-    method: "post",
-    data,
-  });
-}
-
-
-
-//负责人列表/leader/page
-export function leaderPage(data) {
-  return request({
-    url: `api/biz/table/role/relation/queryBizTableConfigs?bizTableConfigName=&bizTableKey=`,
-    method: "get",
-    data,
-  });
-}

src/pages/fileUploadNew/components/index.jsx

@@ -1,151 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-
-import { useHistory, useLocation } from "react-router-dom";
-import { Button, Modal, Form, Select, message } from "antd";
-import ProTable from "@ant-design/pro-table";
-// import ConfigurationModal from "../components/ConfigurationModal";
-import { leaderDelete, leaderPage, syncData } from "../api";
-const ConfigurationPerson = () => {
-    const [form] = Form.useForm();
-
-    const [isModalOpen, setIsModalOpen] = useState(false);
-    const [modalType, setModalType] = useState(true); //true:新增，false:更新
-    const [modalData, setModalData] = useState({});
-    const [syncLoading, setSyncLoading] = useState(false);
-    const actionRef = useRef();
-    //新建
-    const showModal = () => {
-        setModalType(true);
-        setModalData({});
-        setIsModalOpen(true);
-    };
-
-    const handleCancel = (refresh) => {
-        setIsModalOpen(false);
-        setModalData(null);
-        //刷新
-        if (refresh) {
-            actionRef.current.reload();
-        }
-    };
-    //修改
-    const updateClick = (row) => {
-        setModalType(false);
-        setModalData(row);
-        setIsModalOpen(true);
-    };
-    //删除
-    const deleteClick = (row) => {
-        Modal.confirm({
-            title: "温馨提示",
-            content: "您确定要删除该数据吗？",
-            onOk: () => {
-                //单条数据删除
-                leaderDelete({ ids: [row.id] }).then((res) => {
-                    message.success("删除成功");
-                    actionRef.current.reload();
-                });
-            },
-        });
-    };
-    const columns = [
-        {
-            title: "文件名称",
-            dataIndex: "baseName",
-            search: false,
-        },
-        {
-            title: "导入批次",
-            dataIndex: "type",
-            valueEnum: {
-                1: { text: "归口部门" },
-                3: { text: "基地总经理" },
-                4: { text: "基地体系管理员" },
-            },
-        },
-        {
-            title: "修改人",
-            dataIndex: "bizTableConfigId",
-            // valueType: 'dateRange',
-            // hideInTable: true,
-            // search: {
-            //   transform: (value) => {
-            //     return {
-            //       startTime: value[0],
-            //       endTime: value[1],
-            //     };
-            //   },
-            // },
-        },
-        {
-            title: "修改时间",
-            dataIndex: "userName",
-            search: false,
-        },
-        //     {
-        //   title: "操作",
-        //   key: "option",
-        //   valueType: "option",
-        //   render: (_, it) => [
-        //     <Button key="delete" type="link" onClick={() => deleteClick(it)}>
-        //       删除
-        //     </Button>,
-        //     <Button key="link2" type="link" onClick={() => updateClick(it)}>
-        //       修改
-        //     </Button>,
-        //   ],
-        // },
-    ];
-
-    return (
-        <>
-            <div>
-                <ProTable
-                    actionRef={actionRef}
-                    request={(params) => {
-                        params.pageNum = params.current;
-                        delete params.current;
-                        return leaderPage(params).then((res) => {
-                            if (res.resultCode === "0") {
-                                return {
-                                    data: res?.data,
-                                    success: true,
-                                    total: res.data.length,
-                                };
-                            }
-                        });
-                    }}
-                    rowKey="id"
-                    options={false}
-                    columns={columns}
-                    // search={{
-                    //     labelWidth: 'auto',
-                    // }}
-                    search={false}
-                    dateFormatter="string"
-                    headerTitle=""
-                    toolBarRender={() => [
-                        // <Button type="primary" key="new" onClick={showModal}>
-                        //   新建
-                        // </Button>,
-                        // <Button
-                        //   type="primary"
-                        //   key="synchronous"
-                        //   loading={syncLoading}
-                        //   onClick={() => {
-                        //     setSyncLoading(true);
-                        //     syncData().then((res) => {
-                        //       setSyncLoading(false);
-                        //       message.success("同步成功");
-                        //     });
-                        //   }}
-                        // >
-                        //   同步区域权限
-                        // </Button>,
-                    ]}
-                />
-            </div>
-        </>
-    );
-};
-export default ConfigurationPerson;

src/pages/fileUploadNew/fileUploadNewLess.less

@@ -1,105 +0,0 @@
-// 其中assets文件夹已经做了webpack别名配置，不需要再使用../../访问，直接加个波浪线
-
-.sys_account {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-
-  :global {
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-
-.sys_account {
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-    .module_search,
-    .module_line {
-      border-bottom: 8px solid #f5f5f5;
-      padding-bottom: 20px;
-    }
-    
-    .cursor {
-      cursor: pointer;
-    }
-
-    .col_blue {
-      color: #009F95;
-    }
-
-    .flex {
-      display: flex;
-    }
-
-    .module_body {
-      .list_top {
-        display: flex;
-        justify-content: space-between;
-
-        .module_button_area {
-          button {
-            float: right;
-            margin-left: 10px;
-          }
-        }
-      }
-    }
-
-    .ckxq_but {
-      cursor: pointer;
-      color: skyblue;
-    }
-
-  }
-}
-
-.DataSourceAddModal {
-  :global {
-    .ant-form-item-children>div {
-      display: inline-block !important;
-    }
-
-    .ant-form-explain {
-      font-weight: 400;
-      font-size: 12px;
-      line-height: normal;
-      color: #e54747;
-      padding-top: 4px;
-    }
-
-    .has-error .ant-input,
-    .has-error .ant-select-selector {
-      color: rgba(0, 0, 0, 0.6);
-      background-color: #fff;
-      border: 1px #e54747 solid;
-    }
-  }
-}

src/pages/fileUploadNew/fileUploadNewMod.js

@@ -1,339 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, runInAction, autorun, toJS, computed, makeObservable } from 'mobx'
-// 工具方法
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-// 引入Serv
-import Serv from './fileUploadNewServ'
-import { message } from 'antd'
-
-
-// 严格模式
-configure({
-  enforceActions: 'observed'
-});
-
-const defaultForm = {
-  id: '',
-  dataSourceName: '',
-  dataSourceType: undefined,
-  remarks: '',
-  jdbcUrl: '',
-  userName: '',
-  passWord: '',
-  originPassword: '',
-  connectionStatus: '',
-  defaultDb: '',
-  kerberos: false,
-  kerberosConfig: '',
-  kerberosConfigFileName: '',
-  kerberosKey: '',
-  kerberosKeyFileName: '',
-  kerberosPrincipal: '',
-  kerberosService: '',
-  defaultFs: '',
-  configuration: ''
-}
-
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class FileUploadNewMod {
-  constructor() {
-    makeObservable(this);
-  }
-
-  // 监视状态
-  @observable state = {
-    visible: false,
-    createType: 'add', //创建类型，add:新增，edit：修改
-    formData: cloneDeep(defaultForm),
-    version: '',
-    loading: false,
-    dbTypeList: [],
-    confList: [], //配置文件列表
-    keytabList: [], //证书文件列表
-    tableArr: []
-  }
-
-  /*
-   * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-   * 设置内容可视性
-   */
-  @action updateState = async (payload) => {
-    // 设置到状态机 - 如果是异步，必须在runInAction
-    runInAction(() => {
-      this.state = {
-        ...this.state,
-        ...payload,
-        formData: {
-          ...this.state.formData,
-          ...payload.formData
-        }
-      }
-    })
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 重置from表单
-  @action restForm = async (payload) => {
-    this.state.formData = cloneDeep(defaultForm)
-    /*
-     * Mod中跳转使用  window.app.router.push(url);
-     * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-     */
-    autorun(() => {
-      // console.info("visible: ", this.state.visible);
-    })
-  }
-  // 创建数据源
-  @action addDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.addDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-
-  /**
-   * 记录下载操作的日志
-   */
-  @action recordLogOfDownload = async (params, callback) => {
-    try {
-      const res = await Serv.recordLogOfDownload(params);
-      const { resultCode, resultMsg, data } = res;
-      const fileName = decodeURI(res.headers['content-disposition'].split(";")[1].split("filename=")[1]);
-      callback && callback(data, fileName)
-    } catch (error) {
-      // message.error('请求异常！')
-    }
-  }
-
-
-  // 获取数据源类型
-  @action queryDbType = async (payload) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDbType(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        const dbTypeList = data ? data : []
-        this.updateState({
-          dbTypeList: dbTypeList
-        })
-      }
-    } catch (error) { }
-  }
-
-  // 分页查询数据源信息
-  @action pageQueryDsInfoMod = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultCode == '0') {
-        const tableArr = data ? data : []
-        this.updateState({
-          tableArr: tableArr
-        })
-        callback && callback(data.total)
-      }
-    } catch (error) { }
-  }
-
-
-  // 修改数据源
-  @action updateDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      this.updateState({ loading: true })
-      const { resultCode, resultMsg, data } = await Serv.updateDs(params)
-      this.updateState({ loading: false })
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date(), visible: false })
-        message.success('保存成功！')
-        if (_callbck) {
-          _callbck()
-        }
-      } else {
-        message.warn(resultMsg)
-      }
-    } catch (error) {
-      this.updateState({ loading: false })
-      //message.error({ content: '发生异常，保存失败！' })
-    }
-  }
-  // 删除数据源记录
-  @action deleteDs = async (payload, callback) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('删除中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.deleteDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('删除成功！')
-        callback && callback()
-      } else {
-        message.warn(resultMsg || '删除失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      //message.error({ content: '发生异常，删除失败！', key: 'deleteDs' })
-    }
-  }
-
-  // 测试数据源连通性
-  @action testDs = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    message.destroy()
-    const loaddingDialog = message.loading('测试中，请稍等...', 0)
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.testDs(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        message.success('测试成功！')
-        if (_callbck) {
-          _callbck(resultCode)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn('链接失败！')
-      }
-    } catch (error) {
-      setTimeout(loaddingDialog, 0)
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'testDs' })
-    }
-  }
-  // 潍柴项目设置调度时间
-  @action setDataSourceTask = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      message.loading({ content: '设置中，请稍等...', key: 'setDataSourceTask' })
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.setDataSourceTask(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        this.updateState({ version: +new Date() })
-        message.success({ content: '设置成功！', key: 'setDataSourceTask' })
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'setDataSourceTask' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'setDataSourceTask' })
-    }
-  }
-  // 潍柴手动同步数据源信息
-  @action manualSyncDataSourceMeta = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      //message.loading({ content: '设置中，请稍等...', key: 'manualSyncDataSourceMeta' })
-      const loaddingDialog = message.loading('设置中，请稍等...', 5)
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.manualSyncDataSourceMeta(params)
-      setTimeout(loaddingDialog, 0)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        /*
-         * 设置成功，不需要进行提示
-         * message.success({ content: '设置成功！', key: 'manualSyncDataSourceMeta' })
-         */
-        if (_callbck) {
-          _callbck(resultMsg)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-        message.warn({ content: '设置失败！', key: 'manualSyncDataSourceMeta' })
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-  // 潍柴获取数据源同步状态
-  @action queryDsSyncStatus = async (payload, _callbck) => {
-    // 请求参数
-    const params = payload
-    try {
-      // 异步请求方法
-      const { resultCode, resultMsg, data } = await Serv.queryDsSyncStatus(params)
-      // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-      if (resultMsg == 'success') {
-        if (data && data.latestSyncStatus == 'success') {
-          message.success({ content: '数据同步成功!' })
-        } else if (data && data.latestSyncStatus == 'fail') {
-          message.success({ content: '数据同步失败!' })
-        }
-        if (_callbck) {
-          _callbck(resultMsg, data)
-        }
-      } else {
-        if (_callbck) {
-          _callbck()
-        }
-      }
-    } catch (error) {
-      if (_callbck) {
-        _callbck()
-      }
-      //message.error({ content: '发生异常，操作失败！', key: 'manualSyncDataSourceMeta' })
-    }
-  }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const fileUploadNewMod = new FileUploadNewMod()
-export default fileUploadNewMod

src/pages/fileUploadNew/fileUploadNewServ.js

@@ -1,126 +0,0 @@
-import request from '@utils/request'
-
-export default class {
-  //创建数据源
-  static addDs(params) {
-    return request({
-      url: 'api/biz/table/config/insertBizTableConfigEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  /**
- * 记录下载操作的日志
- */
-  static recordLogOfDownload(params) {
-    return request({
-      url: `api/biz/table/config/downloadTempFile/${params}`,
-      method: 'POST',
-      responseType: 'arraybuffer',
-      // data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-    })
-  }
-
-  //更新数据源
-  static updateDs(params) {
-    return request({
-      url: 'api/biz/table/config/updateBizTableConfigEntity',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 删除数据源
-  static deleteDs(params) {
-    return request({
-      url: 'api/os/datasource/info/deleteById/' + params.id,
-      method: 'DELETE',
-      //data: params,
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 测试数据源连通性
-  static testDs(params) {
-    return request({
-      url: 'api/os/datasource/info/testConnect',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      },
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-  // 查询数据源类型
-  static queryDbType(params) {
-    return request({
-      url: 'api/biz/table/config/queryDsListForBizConf',
-      method: 'GET',
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  // 查询数据源类型
-  static pageQueryDsInfo(params) {
-    return request({
-      url: `api/biz/table/role/relation/queryBizTableConfigs?bizTableConfigName=${params.bizTableConfigName}&bizTableKey=${params.bizTableKey}`,
-      method: 'get',
-      // data: params,
-      // 对应后端的应用工程名
-      app: 'ide-op-mgmt-application'
-      //isLocMock: true
-    })
-  }
-
-  //潍柴项目，设置调度任务
-  static setDataSourceTask(params) {
-    return request({
-      url: 'api/os/datasource/info/setDataSourceTask',
-      method: 'POST',
-      data: params,
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-
-  //潍柴项目，手动同步数据源
-  static manualSyncDataSourceMeta(params) {
-    return request({
-      url: 'api/os/datasource/info/manualSyncDataSourceMeta?dsId=' + params.dsId,
-      method: 'GET',
-      headers: {
-        'Content-type': 'application/json'
-      }
-    })
-  }
-  //潍柴项目，获取数据源同步状态
-  static queryDsSyncStatus(params) {
-    return request({
-      url: `api/os/datasource/info/queryDetail/${params}`,
-      method: 'GET',
-    })
-  }
-}

src/pages/fileUploadNew/fileUploadNewView.jsx

@@ -1,823 +0,0 @@
-/*
-    新-文件上传
- * @Author: dayan_hjm 
- * @Date: 2022-12-20 10:27:48 
- * @Last Modified by: dayan_hjm
- * @Last Modified time: 2023-08-22 15:03:16
- */
-
-
-import React, { Component } from "react";
-import { useHistory, useLocation, withRouter } from "react-router-dom";
-import { Table, Button, Badge, Modal, Input, Select, message, Tooltip, Radio, Upload, TimePicker, Row, Col } from 'antd'
-import { Form } from '@ant-design/compatible';
-import { QuestionCircleOutlined, UploadOutlined, EditOutlined, CloseOutlined, DeleteOutlined } from '@ant-design/icons';
-import '@ant-design/compatible/assets/index.css';
-import { observer } from 'mobx-react'
-import { isEmpty, uniqueId } from 'lodash'
-import { Encrypt, Decrypt } from "@utils/util"
-import moment from 'moment'
-const FormItem = Form.Item;
-const { TextArea } = Input;
-import {
-    getAllTableConfigs, // 文件上传分页
-    preViewFillInData
-} from "@apis/system";
-
-// 站点配置
-import config from '@config/config';
-
-// 引入当前页样式 - 模块化
-import styles from './fileUploadNewless.less'
-// 多类名样式管理工具
-import { toJS } from 'mobx'
-import fileUploadNewMod from './fileUploadNewMod';
-import ConfigurationPerson from './components/index'
-
-@withRouter
-class FileUploadNewView extends Component {
-    // 构造函数，组件的实例创建时，最先执行
-    constructor(props, context) {
-        super(props, context)
-        // 注入的FileUploadNewMod
-        this.stores = fileUploadNewMod;
-        this.state = {
-            sqlInitialValue: `CREATE TABLE data_example (
-                data_example_name varchar(32) DEFAULT NULL COMMENT '样例字段名称',
-                data_example_type varchar(32) DEFAULT NULL COMMENT '样例类型',
-                create_person varchar(32) DEFAULT NULL COMMENT '创建人',
-                update_person varchar(32) DEFAULT NULL COMMENT '更新人'
-) ENGINE=InnoDB COMMENT='样例表';`,
-            uploadInfo: {
-                file: {
-                    status: 0,
-                    response: {
-                        resultCode: 0,
-                        resultMsg: ''
-                    },
-                    name: ''
-                },
-            },
-            total_: {
-                total: 0,
-                pageNum: 1,
-                pageSize: 10,
-            },
-            fruitsuploadList: [],
-            uploadList: [],
-            bizTableConfigId: 0,
-            total: 0,
-            editRecordId: '', //数据编辑行的id
-            setTimeValue: '', //设置的时间x
-            searchParam: {
-                bizTableConfigName: '',
-                bizTableKey: '',
-                pageNum: 1,
-                pageSize: 10,
-            },
-            visible: false,
-            visible2: false,
-            resetRoom: [
-                'bizTableName',
-                'bizTableJdbcDs',
-                'bizTableKey',
-                'bizTableConfigName',
-                'bizTableJdbcUrl',
-                'bizTableJdbcUsername',
-                'bizTableCreateSql',
-                'bizTableJdbcPassword',
-            ],
-        }
-    }
-
-    componentDidMount() {
-        this.loadRoles()
-        this.stores.queryDbType()
-    }
-
-    loadRoles(attrs = []) {
-        const { searchParam } = this.state;
-        let params = { ...searchParam, ...attrs };
-        this.stores.pageQueryDsInfoMod(params, (res = 0) => {
-            this.setState({ total: res })
-        })
-    };
-
-    inputChange(key, value) {
-        const { resetFields } = this.props.form
-        if (key === 'dbType' || key === 'MYSQL') {
-            this.stores.updateState({
-                formData: {
-                    bizTableConfigName: '',
-                    remarks: '',
-                    jdbcUrl: '',
-                    jdbcUserName: '',
-                    bizTableJdbcPassword: '',
-                    connectionStatus: '',
-                    defaultDb: '',
-                    kerberos: false,
-                    kerberosConfig: '',
-                    kerberosConfigFileName: '',
-                    kerberosKey: '',
-                    kerberosKeyFileName: '',
-                    kerberos: '',
-                    kerberosService: '',
-                    defaultFs: '',
-                    configuration: '',
-                    [key]: value,
-                    originPassword: ''
-                },
-                confList: [],
-                keytabList: []
-            })
-            resetFields(this.state.resetRoom)
-        } else if (key === 'jdbcUrl' || key === 'jdbcUserName' || key === 'bizTableJdbcPassword' || key === 'defaultDb') {
-            this.stores.updateState({
-                formData: {
-                    connectionStatus: '',
-                    [key]: value
-                }
-            })
-        } else if (key === 'kerberos') {
-            this.stores.updateState({
-                formData: {
-                    kerberosConfig: '',
-                    kerberosConfigFileName: '',
-                    kerberosKey: '',
-                    kerberosKeyFileName: '',
-                    kerberos: '',
-                    kerberosService: '',
-                    //jdbcUrl: '',
-                    jdbcUserName: '',
-                    bizTableJdbcPassword: '',
-                    [key]: value
-                },
-                confList: [],
-                keytabList: []
-            })
-            resetFields([
-                'kerberosConfig',
-                'kerberosKey',
-                'kerberos',
-                'kerberosService',
-                //'jdbcUrl',
-                'jdbcUserName',
-                'bizTableJdbcPassword'
-            ])
-        } else {
-            this.stores.updateState({
-                formData: {
-                    [key]: value
-                }
-            })
-        }
-    }
-
-    // 判断是否清空数据源密码
-    getValueFromEvent(e) {
-        let newValue = e.target.value
-        let {
-            formData: { originPassword }
-        } = toJS(this.stores.state)
-        // if (originPassword != '') {
-        //     newValue = ''
-        //     originPassword = ''
-        //     const { setFieldsValue } = this.props.form
-        //     setFieldsValue({ bizTableJdbcPassword: '' })
-        // }
-        this.stores.updateState({
-            formData: {
-                connectionStatus: '',
-                bizTableJdbcPassword: newValue,
-                originPassword: originPassword
-            }
-        })
-        return newValue
-    }
-
-    // 渲染新增修改表单
-    renderForm() {
-        const { getFieldDecorator } = this.props.form
-        const { formData = {}, dbTypeList } = toJS(this.stores.state)
-        return (
-            <Form layout="horizontal" labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} form={this.props.form}>
-
-                <FormItem label="文件名称">
-                    {getFieldDecorator('bizTableConfigName', {
-                        rules: [
-                            { required: true, message: '请输入文件名称' },
-                            // { max: 32, message: '最多只能输入32个字' }
-                        ],
-                        initialValue: formData.bizTableConfigName
-                    })(
-                        <Input
-                            /* disabled={formData.id ? true : false} */
-                            placeholder="请输入文件名称"
-                            onChange={(e) => this.inputChange('bizTableConfigName', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-                <FormItem label="分类">
-                    {getFieldDecorator('bizTableKey', {
-                        rules: [
-                            { required: true, message: '请输入分类' },
-                        ],
-                        initialValue: formData.bizTableKey
-                    })(
-                        <Input
-                            /* disabled={formData.id ? true : false} */
-                            placeholder="请输入分类"
-                            onChange={(e) => this.inputChange('bizTableKey', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-                <FormItem label='表名'>
-                    {getFieldDecorator('bizTableName', {
-                        rules: [{ required: true, message: '请输入表名' }],
-                        initialValue: formData.bizTableName
-                    })(
-                        <Input
-                            placeholder={'请输入表名'}
-                            onChange={(e) => {
-                                this.inputChange('bizTableName', e.target.value)
-                            }}
-                        />
-                    )}
-                </FormItem>
-
-                <FormItem label='数据源'>
-                    {getFieldDecorator('dsId', {
-                        rules: [{ required: true, message: '请选择数据源' }],
-                        initialValue: formData.dsId
-                    })(
-                        <Select
-                            // disabled={formData.id ? true : false}
-                            placeholder={'请选择数据源'}
-                            onChange={(value) => {
-                                this.inputChange('dsId', value)
-                            }}
-                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
-                        >
-                            {dbTypeList.map((item) => {
-                                return (
-                                    <Select.Option key={item.id} value={item.id}>
-                                        {item.name}
-                                    </Select.Option>
-                                )
-                            })}
-                        </Select>
-                    )}
-                </FormItem>
-
-                {/* <FormItem label="数据源名称">
-                    {getFieldDecorator('bizTableJdbcDs', {
-                        rules: [
-                            {
-                                required: formData.dbType == '2' ? false : true,
-                                message: '请输入数据源名称'
-                            }
-                        ],
-                        initialValue: formData.bizTableJdbcDs
-                    })(<Input placeholder="请输入数据源名称" onChange={(e) => this.inputChange('bizTableJdbcDs', e.target.value)} />)}
-                </FormItem>
-
-                <FormItem label="数据源连接">
-                    {getFieldDecorator('bizTableJdbcUrl', {
-                        rules: [
-                            {
-                                required: true,
-                                message: '请输入数据源连接'
-                            }
-                        ],
-                        initialValue: formData.bizTableJdbcUrl
-                    })(
-                        <Input
-                            placeholder="请输入数据源连接"
-                            onChange={(e) => this.inputChange('bizTableJdbcUrl', e.target.value)}
-                        />
-                    )}
-                </FormItem>
-
-                <FormItem label="数据源账号">
-                    {getFieldDecorator('bizTableJdbcUsername', {
-                        rules: [{ required: true, message: '请输入数据源账号' }],
-                        initialValue: formData.bizTableJdbcUsername
-                    })(<Input placeholder="请输入数据源账号" onChange={(e) => this.inputChange('bizTableJdbcUsername', e.target.value)} />)}
-                </FormItem>
-                <FormItem label="数据源密码">
-                    {getFieldDecorator('bizTableJdbcPassword', {
-                        rules: [{ required: true, message: '请输入数据源密码' }],
-                        initialValue: formData.bizTableJdbcPassword,
-                        getValueFromEvent: (e) => this.getValueFromEvent(e)
-                    })(<Input type="password" placeholder="请输入数据源密码" />)}
-                </FormItem> */}
-
-                <FormItem label="业务建表语句">
-                    {getFieldDecorator('bizTableCreateSql', {
-                        rules: [{ required: true, message: `请输入业务建表语句` }],
-                        initialValue: formData.bizTableCreateSql || this.state.sqlInitialValue,
-                    })(
-                        // <div>
-                        <TextArea
-                            placeholder={'请输入业务建表语句'}
-                            showCount
-                            allowClear
-                            autoSize={{ minRows: 3, maxRows: 5 }}
-                            onChange={(e) => this.inputChange('bizTableCreateSql', e.target.value)}
-                        />
-                        // </div>
-                    )}
-                </FormItem>
-                <span style={{ color: "#ff7979", 'font-size': '12px', display: "block", 'text-align': "right", "width": " 100%", 'marginTop': '-30px' }}>注意：“业务建表语句”中创建的表名称需与“表名”中所填写表名称保持一致；</span>
-            </Form>
-        )
-    }
-
-    handleCancel() {
-        this.setState({ visible: false })
-        this.props.form.resetFields(this.state.resetRoom)
-        // 延期清除表单数据，处理关闭时，闪烁问题
-        setTimeout(() => {
-            this.stores.restForm({})
-        }, 100)
-    }
-
-    handleOk() {
-        const { validateFieldsAndScroll } = this.props.form
-        const { formData } = toJS(this.stores.state)
-        validateFieldsAndScroll((err, valus) => {
-            if (isEmpty(err)) {
-                //formData.jdbcPassword = Encrypt(formData.jdbcPassword)
-                // formData.bizTableJdbcPassword = Encrypt(formData.bizTableJdbcPassword)
-                formData.bizTableCreateSql = formData.bizTableCreateSql ? formData.bizTableCreateSql : this.state.sqlInitialValue
-                // Encrypt(formData.bizTableJdbcPassword)
-                if (formData.bizTableConfigId) {
-                    this.stores.updateDs(formData, () => {
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                            this.setState({ visible: false })
-                        }, 100)
-                        this.loadRoles()
-                    })
-                } else {
-                    this.stores.addDs(formData, () => {
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                            this.setState({ visible: false })
-                        }, 100)
-                        this.loadRoles()
-                    })
-                }
-            }
-        })
-    }
-
-    handleDownload = (id) => {
-        message.info('即将开始下载，请稍候...')
-        this.stores
-            .recordLogOfDownload(id, ((data, fileName) => {
-                var blob = new Blob([data], {
-                    type: "application/vnd.ms-excel",
-                });
-                var downloadElement = document.createElement("a");
-                downloadElement.download = fileName;
-                downloadElement.href = window.URL.createObjectURL(blob);
-                downloadElement.click();
-                document.body.appendChild(downloadElement);
-                document.body.removeChild(downloadElement);
-                window.URL.revokeObjectURL(downloadElement.href);
-            }))
-            .then((data) => {
-            })
-            .catch(() => {
-            })
-    }
-
-    renderModalFooter() {
-        const { loading, formData } = this.stores.state
-
-        return (
-            <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-                <div>
-                    <Button key="back" style={{ display: 'inline' }} onClick={() => this.handleCancel()}>
-                        取消
-                    </Button>
-
-                    <Button
-                        key="submit"
-                        type="primary"
-                        style={{ display: 'inline', marginLeft: '10px' }}
-                        loading={loading}
-                        onClick={() => this.handleOk()}
-                    >
-                        确定
-                    </Button>
-                </div>
-            </div>
-        )
-    }
-
-    getParam() {
-        const { searchParam, total_, bizTableConfigId, total } = this.state;
-        const uploadProps = {
-            maxCount: 1,
-            showUploadList: false,
-            name: 'excelFile',
-            action: `/api/biz/table/config/uploadExcelDataToDB/${bizTableConfigId}`,
-            headers: {
-                authorization: 'authorization-text',
-                token: sessionStorage.getItem("token")
-            },
-            onChange: (info) => {
-                if (info.file.status !== 'uploading' && info.file.status !== "removed") {
-                    console.log(info.file, info.fileList);
-                    this.setState({ uploadInfo: info });
-                    if (info.file.status === 'done' && info.file.response.resultCode == 0) {
-                        preViewFillInData(bizTableConfigId, {
-                            pageNum: total_.pageNum,
-                            pageSize: total_.pageSize
-                        })
-                            .then(({ data, resultCode }) => {
-                                if (+resultCode === 0) {
-                                    let newData = data && data.data && data.data.length > 0 ? data.data : [];
-                                    this.setState({ uploadList: newData })
-                                    this.setState({
-                                        total_: {
-                                            total: data.total,
-                                            pageNum: data.pageNum,
-                                            pageSize: data.pageSize,
-                                        }
-                                    });
-                                    if (newData && newData[0]) {
-                                        this.setState({ fruitsuploadList: Object.keys(newData[0]) })
-                                    }
-                                }
-                            })
-                            .catch((resultMsg) => {
-                                message.error(resultMsg);
-                            });
-                    }
-                    setTimeout(() => {
-                        this.setState({ isShowFeedback: true })
-                    }, 300);
-                }
-            },
-        };
-
-        return {
-            scroll: { x: 1000 },
-            pagination: {
-                // onChange:(pageNum)=>{
-                //     searchParam.pageNum = pageNum;
-                //     this.setState({ ...searchParam });
-                //     this.loadRoles();
-                // },
-                // current: searchParam.pageNum,
-                total,
-                pageSize: searchParam.pageSize,
-            },
-            columns: [
-                //key=one的表头
-                {
-                    title: '文件名称',
-                    dataIndex: 'bizTableConfigName'
-                },
-                {
-                    title: '表名',
-                    dataIndex: 'bizTableName',
-                },
-                // {
-                //     title: '上传周期',
-                //     dataIndex: 'remarks'
-                // },
-                // {
-                //     title: '状态',
-                //     dataIndex: 'jdbcUrlInfo',
-                // },
-                {
-                    title: '最近更新时间',
-                    dataIndex: 'updateTime'
-                },
-                {
-                    title: '分类',
-                    dataIndex: 'bizTableKey'
-                },
-                {
-                    title: '操作',
-                    // fixed: 'right',
-                    // width: 250,
-                    render: (val, record) => {
-                        let data = record;
-                        return (
-                            <span style={{ marginRight: "24px" }}>
-                                {
-                                    sessionStorage.getItem("isSuper") === 'true' ? <a
-                                        onClick={() => {
-                                            this.setState({ bizTableConfigId: data.bizTableConfigId })
-                                            const {
-                                                dsId,
-                                                bizTableConfigId,
-                                                bizTableName,
-                                                // bizTableJdbcDs,
-                                                bizTableKey,
-                                                bizTableConfigName,
-                                                // bizTableJdbcUrl,
-                                                // bizTableJdbcUsername,
-                                                bizTableCreateSql,
-                                                // bizTableJdbcPassword,
-                                            } = data
-                                            const editData = {
-                                                dsId,
-                                                bizTableConfigId,
-                                                // originPassword: bizTableJdbcPassword, //对数据源密码进行解密,
-                                                // bizTableJdbcPassword: Decrypt(bizTableJdbcPassword),
-                                                bizTableName,
-                                                // bizTableJdbcDs,
-                                                bizTableKey,
-                                                bizTableConfigName,
-                                                // bizTableJdbcUrl,
-                                                // bizTableJdbcUsername,
-                                                bizTableCreateSql: bizTableCreateSql ? bizTableCreateSql : this.state.sqlInitialValue,
-                                            }
-                                            let confList = [] //配置文件列表
-                                            let keytabList = []
-                                            this.setState({ visible: true })
-                                            this.stores.updateState({ createType: 'edit', formData: editData, confList, keytabList })
-                                        }}
-                                    >
-                                        编辑
-                                    </a>
-                                        : null
-                                }
-                                {
-                                    sessionStorage.getItem("isSuper") === 'true' ? <span style={{ margin: "0 10px" }}>|</span> : null
-                                }
-                                <span>
-                                    <Upload {...uploadProps}>
-                                        <a onClick={() => {
-                                            this.setState({ bizTableConfigId: data.bizTableConfigId })
-                                        }}
-                                        >上传文件</a>
-                                    </Upload>
-                                </span>
-                                <span style={{ margin: "0 10px" }}>|</span>
-                                <span>
-                                    <a onClick={() => {
-                                        this.handleDownload(data.bizTableConfigId);
-                                    }}
-                                    >下载上传模板</a>
-                                </span>
-                                <span style={{ margin: "0 10px" }}>|</span>
-                                <span>
-                                    <a onClick={() => {
-                                        this.props.history.push(`/home/fileUploadDetailView/${data.bizTableConfigId}`);
-                                    }}
-                                    >上传记录</a>
-                                </span>
-                                {/* <span style={{ margin: "0 10px" }}>|</span>
-                                <span>
-                                    <a onClick={() => {
-                                        this.setState({ visible2: true })
-                                    }}
-                                    >数据修改记录</a>
-                                </span>
-                                <span style={{ margin: "0 10px" }}>|</span>
-                                <span>
-                                    <a onClick={() => {
-                                        this.props.history.push(`/home/msgLoad/${data.bizTableConfigId}`);
-                                    }}
-                                    >数据查询</a>
-                                </span> */}
-
-                            </span>
-                        )
-                    }
-                }
-            ],
-            dataSource: toJS(this.stores.state.tableArr)
-
-        }
-    }
-    render() {
-        const { createType, version } = this.stores.state;
-        const { total_, searchParam, bizTableConfigId, isShowFeedback, uploadInfo, uploadList, fruitsuploadList, visible,visible2 } = this.state
-        const param = this.getParam();
-        const noticeTableOPt_modal = {
-            dataSource: uploadList,
-            columns: fruitsuploadList.map(x => {
-                return {
-                    dataIndex: x + "",
-                    key: x + "",
-                    title: x,
-                }
-            }),
-            pagination: {
-                showSizeChanger: false,
-                onChange: (pageNum) => {
-                    preViewFillInData(bizTableConfigId, {
-                        pageNum: pageNum,
-                        pageSize: total_.pageSize
-                    }).then(({ data, resultCode }) => {
-                        if (+resultCode === 0) {
-                            let newData = data && data.data && data.data.length > 0 ? data.data : [];
-                            this.setState({
-                                uploadList: newData, total_: {
-                                    total: data.total,
-                                    pageNum: data.pageNum,
-                                    pageSize: data.pageSize,
-                                }
-                            })
-                            if (newData && newData[0]) {
-                                this.setState({ fruitsuploadList: Object.keys(newData[0]) })
-                            }
-                        }
-                    })
-                        .catch((resultMsg) => {
-                            message.error(resultMsg);
-                        });
-                    // setTotal({
-                    //   total: total.total,
-                    //   pageNum: pageNum,
-                    //   pageSize: total.pageSize,
-                    // });
-                },
-                total: total_.total,
-                pageSize: total_.pageSize,
-                current: Number(total_.pageNum),
-            },
-            scroll: { x: 1000 },
-        };
-
-        return (
-            <div className={styles.sys_account}>
-                <div className="module_search">
-                    <div className="module_title space">查询条件</div>
-                    <Row type="flex" justify="start" align="middle">
-                        <Col>
-                            <span>分类：</span>
-                            <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.bizTableKey}
-                                placeholder="请输入分类"
-                                onChange={(e) => {
-                                    searchParam.bizTableKey = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input>
-                        </Col>
-                        <Col offset={1}>
-                            <span>文件名称: </span>
-                            <Input
-                                style={{ width: "180px" }}
-                                value={searchParam.bizTableConfigName}
-                                placeholder="请输入文件名称"
-                                onChange={(e) => {
-                                    searchParam.bizTableConfigName = e.target.value;
-                                    this.setState({ ...searchParam });
-                                }}
-                                onKeyDown={(e) => {
-                                    if (e.keyCode === 13) {
-                                        searchParam.pageNum = 1;
-                                        this.setState(searchParam);
-                                        this.loadRoles();
-                                    }
-                                }}
-                            ></Input>
-                        </Col>
-                    </Row>
-                    <Row type="flex" justify="end" align="middle">
-                        <Col>
-                            <Button
-                                type="primary"
-                                onClick={(e) => {
-                                    this.loadRoles();
-                                }}
-                            >
-                                搜索
-                            </Button>
-                        </Col>
-                        <Col>
-                            <Button
-                                // type="text"
-                                style={{ marginLeft: 14 }}
-                                onClick={(e) => {
-                                    searchParam.bizTableConfigName = "";
-                                    searchParam.bizTableKey = "";
-                                    searchParam.pageNum = 1;
-                                    this.setState({ ...searchParam });
-                                    this.loadRoles();
-                                }}
-                            >
-                                重置
-                            </Button>
-                        </Col>
-                    </Row>
-                </div>
-
-                <div className="module_body">
-                    <div className="title_with_btn list_top">
-                        <div className="module_title">文件列表</div>
-                        {
-                            sessionStorage.getItem("isSuper") === 'true' ?
-                                <Button
-                                    type="primary"
-                                    onClick={(e) => {
-                                        this.props.form.resetFields(this.state.resetRoom)
-                                        this.setState({ visible: true })
-                                        this.stores.updateState({ createType: 'add' })
-                                    }}
-                                >
-                                    新增文件
-                                </Button>
-                                : null
-                        }
-
-                    </div>
-                    <Table style={{ marginTop: "16px" }} {...param}></Table>
-                </div>
-                <Modal
-                    destroyOnClose
-                    width="900px"
-                    title={'数据修改记录'}
-                    className={styles.DataSourceAddModal}
-                    visible={visible2}
-                    onCancel={() => {
-                        this.setState({ visible2: false })
-                    }}
-                    footer={[
-                        <Button type="primary" key="new" onClick={()=>{this.setState({ visible2: false })}}>
-                            取消
-                        </Button>
-                    ]}
-                >
-                    <ConfigurationPerson></ConfigurationPerson>
-                </Modal>
-
-
-
-                <Modal
-                    destroyOnClose
-                    width="900px"
-                    title={createType === 'add' ? '新增文件' : '修改文件'}
-                    className={styles.DataSourceAddModal}
-                    visible={visible}
-                    onCancel={() => {
-                        this.setState({ visible: false })
-                        this.props.form.resetFields()
-                        // 延期清除表单数据，处理关闭时，闪烁问题
-                        setTimeout(() => {
-                            this.stores.restForm({})
-                        }, 100)
-                    }}
-                    footer={this.renderModalFooter()}
-                >
-                    {this.renderForm()}
-                </Modal>
-                <Modal
-                    width={900}
-                    title="文件上传"
-                    visible={isShowFeedback}
-                    onCancel={() => {
-                        this.setState({ isShowFeedback: false });
-                    }}
-                    footer={
-                        [
-                            <Button
-                                type="primary"
-                                key="feedback_1"
-                                onClick={() => {
-                                    this.setState({ isShowFeedback: false });
-                                }}
-                            >
-                                确定
-                            </Button>,
-                        ]
-                    }
-                >
-                    {
-                        uploadInfo.file.status === 'done' && uploadInfo.file.response.resultCode == 0 ?
-                            <div>
-                                <p style={{ marginBottom: "20px" }}>文件-{`${uploadInfo.file.name}:`}<span style={{ color: 'green' }}>：上传成功!</span></p>
-                                <Table {...noticeTableOPt_modal} />
-                            </div>
-                            : ((uploadInfo.file.status === 'error' || uploadInfo.file.status === 'done') ? <p>文件-{`${uploadInfo.file.name}:`}<span style={{ color: 'red' }}>上传失败!原因:{uploadInfo.file.response.resultMsg}</span></p> : null)
-                    }
-                </Modal>
-
-            </div>
-        )
-    }
-}
-export default Form.create()(FileUploadNewView)
-// export default FileUploadNewView;

src/pages/fileUploadNew/msgLoad/ConfigurationModal.jsx

@@ -1,274 +0,0 @@
-import React, { useRef, useEffect, useMemo, useState } from "react";
-
-import { Spin, Modal, Form, Select, TreeSelect, message } from "antd";
-import {
-  configurableBases,
-  configurableUsers,
-  leaderAdd,
-  leaderUpdate,
-} from "../api";
-import debounce from "lodash/debounce";
-const ConfigurationModal = (props) => {
-  const { isModalOpen, handleCancel, type, data } = props;
-  //基地信息
-  const [configurableBasesData, setConfigurableBasesData] = useState([]);
-  const [baseValue, setBaseValue] = useState("");
-  //用户信息
-  const [userData, setUserData] = useState([]);
-  const [userValue, setUserValue] = useState("");
-  const [form] = Form.useForm();
-
-  useEffect(() => {
-    configurableBases().then((res) => {
-      setConfigurableBasesData(res.data);
-    });
-  }, []);
-  useEffect(() => {
-    if (isModalOpen) {
-      form.resetFields();
-      setUserData([]);
-      if (!type) {
-        setBaseValue(data?.baseId);
-        configurableUsers({
-          pageSize: 100,
-          pageNum: 1,
-          baseId: data?.baseId,
-        }).then((res) => {
-          const arr =
-            res.data?.list && res.data?.list.length ? res.data?.list : [];
-          setUserData(arr);
-        });
-      }
-    }
-  }, [isModalOpen]);
-
-  //远程搜索下拉框
-  const DebounceSelect = ({
-    fetchOptions,
-    debounceTimeout = 800,
-    defaultData,
-    ...props
-  }) => {
-    const [fetching, setFetching] = useState(false);
-    const [options, setOptions] = useState(defaultData);
-    const fetchRef = useRef(0);
-    const debounceFetcher = useMemo(() => {
-      const loadOptions = (value) => {
-        if (!baseValue) {
-          message.warning("请选择基地");
-          return;
-        }
-        fetchRef.current += 1;
-        const fetchId = fetchRef.current;
-        setOptions(defaultData);
-        setFetching(true);
-        fetchOptions(value).then((newOptions) => {
-          if (fetchId !== fetchRef.current) {
-            return;
-          }
-          setOptions(newOptions);
-          setFetching(false);
-        });
-      };
-      return debounce(loadOptions, debounceTimeout);
-    }, [fetchOptions, debounceTimeout]);
-    return (
-      <Select
-        labelInValue
-        showSearch={true}
-        fieldNames={{ label: "name", value: "id" }}
-        filterOption={false}
-        onSearch={debounceFetcher}
-        notFoundContent={fetching ? <Spin size="small" /> : null}
-        {...props}
-        options={options}
-      />
-    );
-  };
-  //用户搜索
-  const fetchOptions = useMemo(() => {
-    const userData = async (value) => {
-      if (!isModalOpen) {
-        return [];
-      }
-      let arr;
-      await configurableUsers({
-        pageSize: 100,
-        pageNum: 1,
-        baseId: baseValue,
-        name: value ?? null,
-      }).then((res) => {
-        arr = res.data?.list && res.data?.list.length ? res.data?.list : [];
-      });
-      return arr;
-    };
-    return userData;
-  }, [baseValue]);
-  //基地change事件
-  const onChangeBase = (value) => {
-    setBaseValue(value);
-    form.setFieldsValue({ userId: null });
-    if (!value) {
-      setUserData([]);
-      return;
-    }
-    configurableUsers({
-      pageSize: 100,
-      pageNum: 1,
-      baseId: value,
-    }).then((res) => {
-      const arr = res.data?.list && res.data?.list.length ? res.data?.list : [];
-      setUserData(arr);
-    });
-  };
-  const onCancel = () => {
-    const isTouched = form.isFieldsTouched();
-    if (isTouched) {
-      Modal.confirm({
-        title: "温馨提示",
-        content: "取消后当前页面操作数据不保留，确认取消？",
-        onOk: () => {
-          handleCancel(false);
-        },
-      });
-    } else {
-      handleCancel(false);
-    }
-  };
-
-  //提交操作
-  const handleOk = () => {
-    form
-      .validateFields()
-      .then((values) => {
-        const paramValue = {
-          baseId: values?.baseId,
-          type: values?.type,
-          userId: values?.userId.value,
-        };
-        //新建责任人
-        if (type) {
-          leaderAdd(paramValue).then((res) => {
-            message.success("添加成功");
-            handleCancel(true);
-          });
-          return;
-        }
-        //修改负责人
-        const isTouched = form.isFieldsTouched();
-        if (isTouched) {
-          leaderUpdate({ ...data, ...paramValue }).then((res) => {
-            message.success("修改成功");
-            handleCancel(true);
-          });
-        } else {
-          message.warning("当前数据尚未更改，请勿提交重复数据");
-        }
-      })
-      .catch((err) => {
-        return;
-      });
-  };
-  return (
-    <Modal
-      title={`${type ? "新建" : "修改"}`}
-      visible={isModalOpen}
-      onOk={handleOk}
-      onCancel={onCancel}
-    >
-      <Form
-        form={form}
-        wrapperCol={{ span: 16 }}
-        labelCol={{ span: 4 }}
-        initialValues={{
-          baseId: data?.baseId ?? null,
-          type: data?.type ? Number(data?.type) : null,
-          userId: data?.userId ?? null,
-        }}
-      >
-        <Form.Item
-          label="基地"
-          name="baseId"
-          rules={[
-            {
-              required: true,
-              message: "请选择基地",
-            },
-          ]}
-        >
-          <TreeSelect
-            showSearch
-            disabled={!type}
-            style={{
-              width: "100%",
-            }}
-            value={baseValue}
-            dropdownStyle={{
-              maxHeight: 400,
-              overflow: "auto",
-            }}
-            fieldNames={{ label: "name", value: "id", children: "child" }}
-            placeholder="请选择基地"
-            allowClear
-            // treeDefaultExpandAll
-            onChange={onChangeBase}
-            treeData={configurableBasesData}
-          />
-        </Form.Item>
-        <Form.Item
-          label="类型"
-          name="type"
-          // initialValue={data?.type ?? null}
-          rules={[
-            {
-              required: true,
-              message: "请选择类型",
-            },
-          ]}
-        >
-          <Select
-            placeholder="请选择类型"
-            disabled={!type}
-            //1-归口部门，3-基地总经理，4-基地体系管理员
-            options={[
-              {
-                value: 1,
-                label: "归口部门",
-              },
-              {
-                value: 3,
-                label: "基地总经理",
-              },
-              {
-                value: 4,
-                label: "基地体系管理员",
-              },
-            ]}
-          ></Select>
-        </Form.Item>
-        <Form.Item
-          label="用户"
-          name="userId"
-          rules={[
-            {
-              required: true,
-              message: "请选择用户",
-            },
-          ]}
-        >
-          <DebounceSelect
-            value={userValue}
-            defaultData={userData}
-            placeholder="请输入搜索用户"
-            fetchOptions={fetchOptions}
-            onChange={setUserValue}
-            style={{
-              width: "100%",
-            }}
-          />
-        </Form.Item>
-      </Form>
-    </Modal>
-  );
-};
-export default ConfigurationModal;

src/pages/fileUploadNew/msgLoad/index.jsx

@@ -1,159 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-
-import { useHistory, useLocation } from "react-router-dom";
-import { Button, Modal, Form, Select, message } from "antd";
-import ProTable from "@ant-design/pro-table";
-import ConfigurationModal from "./ConfigurationModal";
-import { leaderDelete, leaderPage, syncData } from "../api";
-const ConfigurationPerson = () => {
-    const [form] = Form.useForm();
-    const history = useHistory();
-
-    const [isModalOpen, setIsModalOpen] = useState(false);
-    const [modalType, setModalType] = useState(true); //true:新增，false:更新
-    const [modalData, setModalData] = useState({});
-    const [syncLoading, setSyncLoading] = useState(false);
-    const actionRef = useRef();
-    //新建
-    const showModal = () => {
-        setModalType(true);
-        setModalData({});
-        setIsModalOpen(true);
-    };
-
-    const handleCancel = (refresh) => {
-        setIsModalOpen(false);
-        setModalData(null);
-        //刷新
-        if (refresh) {
-            actionRef.current.reload();
-        }
-    };
-    //修改
-    const updateClick = (row) => {
-        setModalType(false);
-        setModalData(row);
-        setIsModalOpen(true);
-    };
-    //删除
-    const deleteClick = (row) => {
-        Modal.confirm({
-            title: "温馨提示",
-            content: "您确定要删除该数据吗？",
-            onOk: () => {
-                //单条数据删除
-                leaderDelete({ ids: [row.id] }).then((res) => {
-                    message.success("删除成功");
-                    actionRef.current.reload();
-                });
-            },
-        });
-    };
-    const columns = [
-        {
-            title: "文件名称",
-            dataIndex: "baseName",
-        },
-        {
-            title: "导入批次",
-            dataIndex: "type",
-            valueEnum: {
-                1: { text: "归口部门" },
-                3: { text: "基地总经理" },
-                4: { text: "基地体系管理员" },
-            },
-        },
-        {
-            title: "修改人",
-            dataIndex: "bizTableConfigId",
-        },
-        {
-            title: "修改时间",
-            dataIndex: "userName",
-            valueType: 'dateRange',
-            hideInTable: true,
-            search: {
-                transform: (value) => {
-                    return {
-                        startTime: value[0],
-                        endTime: value[1],
-                    };
-                },
-            },
-        },
-        {
-            title: "操作",
-            key: "option",
-            valueType: "option",
-            render: (_, it) => [
-                // <Button key="delete" type="link" onClick={() => deleteClick(it)}>
-                //   删除
-                // </Button>,
-                <Button key="link2" type="link" onClick={() => updateClick(it)}>
-                    修改
-                </Button>,
-            ],
-        },
-    ];
-
-    return (
-        <>
-            <div>
-                <Button type="dashed" shape="round" style={{ 'margin': '20px 0 0 20px' }} onClick={(e) => {
-                    history.push("/home/fileUploadNewView");
-                }}>返回上一页</Button>
-
-                <ProTable
-                    actionRef={actionRef}
-                    request={(params) => {
-                        params.pageNum = params.current;
-                        delete params.current;
-                        return leaderPage(params).then((res) => {
-                            if (res.resultCode === "0") {
-                                return {
-                                    data: res?.data,
-                                    success: true,
-                                    total: res.data.length,
-                                };
-                            }
-                        });
-                    }}
-                    rowKey="id"
-                    options={false}
-                    columns={columns}
-                    search={{
-                        labelWidth: 'auto',
-                    }}
-                    dateFormatter="string"
-                    headerTitle="数据查询"
-                    toolBarRender={() => [
-                        <Button type="primary" key="new" onClick={showModal}>
-                            新建
-                        </Button>,
-                        <Button
-                            type="primary"
-                            key="synchronous"
-                            loading={syncLoading}
-                            onClick={() => {
-                                setSyncLoading(true);
-                                syncData().then((res) => {
-                                    setSyncLoading(false);
-                                    message.success("同步成功");
-                                });
-                            }}
-                        >
-                            导出
-                        </Button>,
-                    ]}
-                />
-                <ConfigurationModal
-                    isModalOpen={isModalOpen}
-                    handleCancel={handleCancel}
-                    type={modalType}
-                    data={modalData}
-                />
-            </div>
-        </>
-    );
-};
-export default ConfigurationPerson;

src/pages/frame/component/top/view.jsx

@@ -819,7 +819,7 @@ export default observer(function (props) {
         />
       </div> */}
       {$store.app.styleCommon.theme == 'chaBaiDao' ? null :
-        <div className="title">统一数据门户</div>
+        <div className="title">运营数据中心</div>
       }
       <div
         className="menu fg1"

src/pages/frame/view.jsx

@@ -59,7 +59,6 @@ import utils from "@utils/index";
 import "@themes/themes.less";
 import { saveMenu } from "@apis/enter.js";
 import { careOrCancelResource, getUserResourceTree } from "./api";
-import { getMenuDesc } from "../system/menu/api";
 import { observer, observable } from "mobx-react";
 import { toJS } from "mobx";
 const { SubMenu } = Menu;
@@ -429,62 +428,6 @@ export default observer(function Frame(props) {
                 <span className="text_over" title={menu.resourceName}>
                   {menu.resourceName}
                 </span>
-                {menu.resourceType.match(/fine_bi|dmpReport/) && (
-                  <>
-                    <span
-                      style={{ paddingLeft: 5 }}
-                      onClick={(e) => {
-                        e.stopPropagation();
-                        getMenuDesc({
-                          resourceId: menu.resourceId,
-                        }).then(({ data, resultCode }) => {
-                          if (+resultCode === 0) {
-                            $store.app.setMetaData({
-                              data,
-                              visible: true,
-                            });
-                          }
-                        });
-                      }}
-                    >
-                      <InfoCircleOutlined />
-                    </span>
-
-                    <span
-                      className="emptystar"
-                      twotonecolor ="#FFBF00"
-                      style={{ paddingLeft: 5 }}
-                      onClick={(e) => {
-                        menu.isCare = !menu.isCare;
-                        $store.sysMenu.setSubmenuList(
-                          $store.sysMenu.submenuList
-                        );
-                        sessionStorage.setItem(
-                          "subMenuList",
-                          JSON.stringify($store.sysMenu.submenuList)
-                        );
-
-                        const config = {
-                          isCare: menu.isCare,
-                          resourceId: menu.resourceId,
-                        };
-                        careOrCancelResource(config).then(
-                          ({ data, resultCode }) => {
-                            if (+resultCode === 0) {
-                              message.success(
-                                menu.isCare ? "关注成功" : "取消关注成功"
-                              );
-                              //重新发送请求
-                            }
-                          }
-                        );
-                        e.stopPropagation();
-                      }}
-                    >
-                      {menu.isCare ? <StarFilled /> : <StarOutlined />}
-                    </span>
-                  </>
-                )}
               </span>
             </Menu.Item>
           </>

src/pages/labelSystem/index.jsx

@@ -1,396 +0,0 @@
-import "./index.scss";
-import {
-  getLtLevel3Labels,
-  getLevel3Labels,
-  previewClusterCst,
-} from "@apis/label";
-import React,{ useState, useEffect } from "react";
-import { Form, Button, Input, Select, message, Spin, Tooltip } from "antd";
-import { useHistory } from "react-router-dom";
-import { cloneDeep, get, groupBy, isEmpty, orderBy, pick } from "lodash";
-import { loopTree, formatNum } from "@utils/";
-
-import $store from "@store/";
-import { observer } from "mobx-react";
-import { configure,toJS } from "mobx";
-configure({ useProxies: "never" });
-
-export default observer(function (props) {
-  const history = useHistory();
-  const [form] = Form.useForm();
-
-  const [scopeIndex, setScopeIndex] = useState("");
-  const [tabIndex, setTabIndex] = useState(0);
-  let [cusScopeInfo, setCusScopeInfo] = useState({});
-  const [type, setType] = useState("");
-
-  function loadLevel3(payload = {}) {
-    try {
-      let { tabIndex = 0, tagIds = "" } = payload;
-      let labelTree = toJS($store.label.labelTree);
-      let parentObj = labelTree[tabIndex];
-      let ids = [];
-      let noOrderArr = ["年代", "年龄段", "人生阶段"];
-      if (parentObj.loaded) {
-        return false;
-      }
-      ((parentObj || {}).children || []).map((item, index) => {
-        ids.push(item.id);
-      });
-      let params = { tagIds: ids.join(",") || "" };
-      setTabIndex(tabIndex);
-
-      getLevel3Labels(params).then(({ resultCode, data }) => {
-        let list = data || [];
-
-        if (+resultCode === 0) {
-          data.map((item, index) => {
-            // 隐藏籍贯城市
-            if (item.tagName === "籍贯城市") {
-              data.splice(index, 1);
-            }
-
-            // 年代排序
-            if (item.tagName === "年代") {
-              let arr = [];
-              let key = 0;
-              item.enumData.map((it) => {
-                if (it.tagValue === "60前") {
-                  key = 0;
-                } else if (it.tagValue === "60后") {
-                  key = 1;
-                } else if (it.tagValue === "70后") {
-                  key = 2;
-                } else if (it.tagValue === "80后") {
-                  key = 3;
-                } else if (it.tagValue === "90后") {
-                  key = 4;
-                } else if (it.tagValue === "00后") {
-                  key = 5;
-                } else if (it.tagValue === "10后") {
-                  key = 6;
-                } else if (it.tagValue === "20后") {
-                  key = 7;
-                }
-                arr[key] = { ...it };
-                return it;
-              });
-              item.enumData = arr;
-            }
-
-            // 人生阶段排序
-            if (item.tagName === "人生阶段") {
-              let arr = [];
-              let key = 0;
-
-              item.enumData.map((it) => {
-                if (it.tagValue === "少年") {
-                  key = 0;
-                } else if (it.tagValue === "青年") {
-                  key = 1;
-                } else if (it.tagValue === "中年") {
-                  key = 2;
-                } else if (it.tagValue === "老年") {
-                  key = 3;
-                }
-                arr[key] = it;
-                return it;
-              });
-
-              item.enumData = arr;
-            }
-
-            // 年龄段排序
-            if (item.tagName === "年龄段") {
-              let arr = [];
-              let key = 0;
-              item.enumData.map((it) => {
-                if (it.tagValue === "18岁以内") {
-                  key = 0;
-                } else if (it.tagValue === "19-25岁") {
-                  key = 1;
-                } else if (it.tagValue === "26-30岁") {
-                  key = 2;
-                } else if (it.tagValue === "31-35岁") {
-                  key = 3;
-                } else if (it.tagValue === "36-40岁") {
-                  key = 4;
-                } else if (it.tagValue === "41-50岁") {
-                  key = 5;
-                } else if (it.tagValue === "51-60岁") {
-                  key = 6;
-                } else if (it.tagValue === "60岁以上") {
-                  key = 7;
-                }
-                arr[key] = it;
-                return it;
-              });
-
-              item.enumData = arr;
-            }
-
-            return item;
-          });
-          
-          list = orderBy(list, ["tagId", "tagName"], ["asc", "asc"]);
-
-          let arr = [];
-
-          list.map((item, index) => {
-            item.logic = "1";
-            item.name = `${item.tagName || ""}`.split("-")[0] || "";
-            item.id = item.tagId;
-            item.children = item.enumData || [];
-            let exp = new RegExp("(" + item.name + "[：:-]?)(?=\\S+)");
-            let children = cloneDeep(get(item, "children", []));
-            children.map((item_s, index_s) => {
-              item_s.tagValue = `${item_s.tagValue || ""}`.replace(
-                /(m2|平方米)/g,
-                "㎡"
-              );
-              item_s.parentId = parentObj.id;
-              item_s.parentName = parentObj.name;
-              item_s.labelId = item.id;
-              item_s.labelName = item.name;
-              item_s.labelValue = item_s.tagValue;
-              item_s.name = item_s.tagValue;
-              item_s.name_alias = item_s.name.replace(exp, "") || "";
-              // 排序key
-              let numArr = item_s.tagValue.match(/\d+/g) || [];
-              item_s._ordering = Number(numArr[0] || 0);
-              if (item_s._ordering) {
-                if (item_s.name_alias.indexOf("以下") > -1) {
-                  item_s._ordering = item_s._ordering - 1;
-                } else if (item_s.name_alias.indexOf("以上") > -1) {
-                  item_s._ordering = item_s._ordering + 1;
-                }
-                // 某些标签不需要前端处理排序
-                if (noOrderArr.indexOf(item.name) > -1) {
-                  item_s._ordering = 0;
-                }
-              }
-            });
-
-            item = pick(item, ["name", "id", "children"]);
-            item.children = children;
-            list[index] = item;
-          });
-
-          list.map((item) => {
-            if (item.name.match(/地产/)) {
-              arr.splice(0, 0, item);
-            } else if (item.name.match(/物业/)) {
-              arr.splice(1, 0, item);
-            } else if (item.name.match(/教育/)) {
-              arr.splice(2, 0, item);
-            } else {
-              arr.push(item);
-            }
-          });
-
-          list = arr;
-        }
-
-        // 二级标签tagName进行合并
-        let arr = cloneDeep(list);
-        arr = groupBy(arr, "name");
-        // console.log(arr);
-        list = [];
-        for (let key in arr) {
-          let list_s = [];
-          (arr[key] || []).map((item_s, index_s) => {
-            (item_s.children || []).map((item_ss) => {
-              list_s.push(item_ss);
-            });
-          });
-
-          list_s = orderBy(list_s, ["_ordering"], ["asc"]);
-          list.push({
-            name: key,
-            id: "-1",
-            children: list_s,
-          });
-        }
-
-        labelTree[tabIndex]["children"] = list;
-        labelTree[tabIndex].loaded = true;
-
-        // 设置tree位置标志_index
-        let scopeIndex_s = "";
-        loopTree({
-          data: labelTree,
-          childrenName: "children",
-          cbk(item = {}, parent = {}) {
-            item.labelPath = parent
-              ? `${parent.labelPath}>${item.name}`
-              : `${item.name}`;
-            item["logic"] = "1";
-            if (item.name === "所属项目公司") {
-              cusScopeInfo = item || {};
-              scopeIndex_s = item._index || 0;
-            }
-          },
-        });
-        if (scopeIndex_s) {
-          let scopeIndex_t = `${scopeIndex_s}`.split(".");
-          cusScopeInfo = cloneDeep(cusScopeInfo || {});
-          cusScopeInfo.children = cusScopeInfo.children || [];
-          cusScopeInfo.children.unshift({
-            name: "全部",
-            title: "全部",
-            value: "-1",
-            key: "-1",
-            id: "-1",
-          });
-          cusScopeInfo.children.map((item, index) => {
-            item.title = item.name;
-            item.value = index;
-            item.key = index;
-          });
-
-          // $store.label.labelTree[scopeIndex_t[0]].children.splice(scopeIndex_t[1],1)
-        }
-
-        $store.label.setLabelTree([...labelTree]);
-        setCusScopeInfo({ ...cusScopeInfo });
-      });
-    } catch (e) {
-      console.error(e);
-    }
-  }
-
-  useEffect(() => {
-    getLtLevel3Labels().then(({ data, resultCode }) => {
-      if (+resultCode === 0) {
-        let list = (data && data.objectiveTagCategory) || [];
-        let scopeIndex = "";
-        let ids = [];
-        list = list.filter((item, index) => {
-          return item.name !== "组合标签";
-        });
-        list.map((item, index) => {
-          item.children = item.tag || [];
-          item.children.map((item_s, index_s) => {
-            item_s.name = item_s.tagCn;
-            item_s.id = item_s.tagId;
-            item.children[index_s] = pick(item_s, ["name", "id"]);
-          });
-          list[index] = pick(item, ["name", "id", "children"]);
-          // 基础标签
-          if ((item.name === "基础标签")) {
-            scopeIndex = index;
-          }
-        });
-
-        if (!isEmpty(get(list, "[0].children", []))) {
-          let tags = get(list, "[0].children", []);
-          tags.map((item, index) => {
-            ids.push(item.id);
-          });
-        }
-        $store.label.setLabelTree(list);
-        if (!isEmpty(list)) {
-          loadLevel3({ tabIndex: 0 });
-          // 基础标签》所属项目公司，这个作为客户范围
-          // if (scopeIndex !== "") {
-          //   loadLevel3({ tabIndex: scopeIndex });
-          // }
-        }
-      }
-    });
-  }, []);
-
-  return (
-    <div className="pageLayout pageView label_system">
-      {/* <Spin className="loading" spinning={modelObj.loading || false}></Spin> */}
-      <div className="pageTitle">客户标签体系</div>
-      <div className="pageContainer">
-        <div className="section">
-          <div className="conBox">
-            {/*左侧tab*/}
-            <div className="tabBar">
-              <div className="list">
-                {!isEmpty(toJS($store.label.labelTree)) &&
-                  (toJS($store.label.labelTree) || []).map((item, index) => {
-                    return (
-                      <div
-                        className={`item ${index == tabIndex ? "active" : ""}`}
-                        key={index}
-                        onClick={() => {
-                          if (item.loaded) {
-                            setTabIndex(index);
-                          } else {
-                            loadLevel3({ tabIndex: index });
-                          }
-                        }}
-                      >
-                        <div className="icon"></div>
-                        <div className="itemName">{item.name || ""}</div>
-                      </div>
-                    );
-                  })}
-              </div>
-            </div>
-            {/*右侧内容区*/}
-
-            <div className="labelBox">
-              {!isEmpty(toJS($store.label.labelTree)) &&
-                toJS($store.label.labelTree).map((item, index) => {
-                  return (
-                    <div
-                      className={`groupBox ${
-                        index == tabIndex ? "" : "hidden"
-                      }`}
-                      key={index}
-                    >
-                      {item.loaded &&
-                        !isEmpty(item.children || []) &&
-                        item.children.map((item_s, index_s) => {
-                          if (isEmpty(item_s.children || [])) {
-                            return null;
-                          }
-                          return (
-                            <div className="group" key={`${index}_${index_s}`}>
-                              <div className="groupItem">
-                                <div className="groupName">
-                                  {item_s.name || ""}
-                                </div>
-                                <div className="list">
-                                  {!isEmpty(item_s.children || []) &&
-                                    item_s.children.map((item_ss, index_ss) => {
-                                      return (
-                                        <Tooltip
-                                          key={`${index}_${index_s}_${index_ss}`}
-                                          placement="topLeft"
-                                          title={
-                                            "标签覆盖客户数：" +
-                                            (formatNum(item_ss.total) || 0) +
-                                            " 人"
-                                          }
-                                        >
-                                          <div
-                                            className={`item ${
-                                              item_ss.total ? "" : "disabled"
-                                            }`}
-                                            key={`group_list_${index_ss}`}
-                                          >
-                                            {item_ss.name_alias || ""}
-                                          </div>
-                                        </Tooltip>
-                                      );
-                                    })}
-                                </div>
-                              </div>
-                            </div>
-                          );
-                        })}
-                    </div>
-                  );
-                })}
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-});

src/pages/labelSystem/index.scss

@@ -1,136 +0,0 @@
-.label_system {
-  padding: 16px 16px 40px 16px;
-  .hidden {
-    display: none !important;
-  }
-
-  .loading {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    margin-top: -30px;
-  }
-
-  .pageContainer {
-    display: flex;
-
-    .section {
-      &:first-child {
-        //width: 80%;
-        flex: 1;
-      }
-
-      & ~ .section {
-        margin-left: 16px;
-        flex: 0.1 1 280px;
-      }
-    }
-
-    .labelBox {
-      height: e("calc(100vh - 150px)");
-      overflow: auto;
-      flex: 1;
-      position: relative;
-    }
-
-    .formBox {
-      //width: 20%;
-      padding: 16px;
-    }
-  }
-
-  .pageView {
-    background: #fff;
-    //padding: 16px;
-    border-radius: 3px;
-
-    
-  }
-  .pageTitle{
-    line-height: 30px;
-    font-weight: bold;
-  }
-
-  .conBox {
-    display: flex;
-    //min-height: e("calc(100vh - 168px)");
-  }
-
-  .tabBar {
-    background-color: #fafafa;
-    width: 18%;
-    min-width: 150px;
-
-    .list {
-      font-size: 14px;
-      color: rgba(0, 0, 0, 0.85);
-
-      .item {
-        height: 62px;
-        line-height: 62px;
-        //text-align: center;
-        cursor: pointer;
-        padding-left: 24px;
-        text-align: left;
-        font-weight: 600;
-
-        &.active {
-          background-color: #fff;
-          color: #229867;
-          font-weight: bold;
-        }
-
-        &:hover {
-          color: #229867;
-          //border-color: rgba(34,152,103,1);
-        }
-      }
-    }
-  }
-
-  .labelBox {
-    margin-top: 20px;
-    margin-left: 32px;
-
-    .group {
-      .groupName {
-        font-size: 14px;
-        color: rgba(0, 0, 0, 0.85);
-        margin-bottom: 16px;
-        font-weight: bold;
-      }
-
-      & ~ .group {
-        margin-top: 12px;
-      }
-    }
-
-    .list {
-      display: flex;
-      flex-wrap: wrap;
-      font-size: 14px;
-      color: rgba(0, 0, 0, 0.65);
-
-      .item {
-        background: #ffffff;
-        border: 1px solid #e8e8e8;
-        border-radius: 2px;
-        padding: 5px 16px;
-        margin-bottom: 16px;
-        cursor: pointer;
-
-        &:not(:last-child) {
-          margin-right: 16px;
-        }
-
-        &:hover {
-          background: rgba(34, 152, 103, 0.1);
-          border: 1px solid #229867;
-          border-radius: 2px;
-          color: #229867;
-          //font-weight: bold;
-        }
-      }
-    }
-  }
-}

src/pages/myManage/DataSearchPermisssion/IndexLess.less

@@ -1,138 +0,0 @@
-@import url("../../../themes/themes.less");
-:global{
-  .reasonInput .ant-legacy-form-item-control {
-    width: 400px !important;
-  }
-}
-.DataSearchPermisssionView{
-  :global{
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body{
-      max-height: calc(100vh - 360px) !important
-    }
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography{
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-.permissionContainer {
-  min-width: 1000px; //设置内容区域最小宽度为1000px，防止表格不断被挤压重叠
-  background-color: #fff;
-  padding: 12px 16px 16px 16px;
-
-  :global {
-    background-color: #fff;
-    padding: 12px 16px 16px 16px;
-    .timeSetting {
-      .ant-time-picker {
-        width: 110px;
-        margin: 0px 4px;
-      }
-
-      .saveBtn {
-        cursor: pointer;
-        padding-right: 4px;
-      }
-
-      .closeBtn {
-        cursor: pointer;
-      }
-
-      .editBtn {
-        cursor: pointer;
-      }
-    }
-
-    //此处主要是使表格内滚动能根据屏幕高度自适应
-    .ant-table-fixed-header>.ant-table-container>.ant-table-body {
-      max-height: calc(100vh - 330px) !important
-    }
-
-    //处理Badge，与按钮，不对齐
-    .ant-table-tbody .yx_table_row_tr td .table_cell_box .ant-typography {
-      line-height: 20px;
-      height: 20px;
-    }
-  }
-}
-
-.permissionContainer {
-  min-height: 400px;
-  :global {
-    .ant-tabs-bar {
-      background-color: white;
-    }
-    .numItem {
-      text-decoration: underline;
-      cursor: pointer;
-      //color: #1861f2;
-      color: @yx_yxColor_brand_1
-    }
-    .apiJump {
-      text-decoration: underline;
-      cursor: pointer;
-      //color: #1861f2;
-      color: @yx_yxColor_brand_1
-    }
-  }
-}
-
-.DsAuthModalStyle {
-  :global {
-    .ant-form-item {
-      margin: 0px 0px 12px;
-    }
-    .ant-legacy-form-item-label {
-      width: 120px;
-    }
-    .ant-legacy-form-item{
-      margin-right: 0;
-    }
-    
-    // antd4官方样式会使用下面这个样式，导致.ant-form-item-control设置的宽度无效，所以下面的.ant-form-item-control宽度都加上了!important
-    // .ant-form-item-control:first-child:not([class^=ant-col-]):not([class*=" ant-col-"]) {
-    //   width: 100%;
-    // }
-
-    .ant-legacy-form-item-control {
-      width: 200px !important;
-      padding-right: 8px;
-      text-overflow: ellipsis;
-      overflow: hidden;
-      display: block;
-    }
-    
-    .reasonInput .ant-legacy-form-item-control {
-      width: 400px !important;
-    }
-  }
-}
-.RecycleModalStyle {
-  :global {
-    .ant-legacy-form-item{
-      margin-right: 0;
-    }
-    .ant-form-item {
-      margin: 0px 0px 12px;
-    }
-    .ant-legacy-form-item-label {
-      width: 100px;
-    }
-    .ant-legacy-form-item-control {
-      width: 200px !important;
-      padding-right: 8px;
-      text-overflow: ellipsis;
-      overflow: hidden;
-      display: block;
-    }
-    .reasonInput .ant-legacy-form-item-control {
-      width: 400px !important;
-    }
-  }
-}
-
-.btnMarginLeft {
-  margin-right: 10px;
-}

src/pages/myManage/DataSearchPermisssion/IndexMod.js

@@ -1,445 +0,0 @@
-// 状态管理方法
-import { observable, action, configure, makeObservable, runInAction, autorun } from 'mobx'
-// 引入Serv
-import Serv from './IndexServ'
-import { message } from 'antd'
-import { isEqual, cloneDeep, trim, get } from 'lodash'
-
-// 严格模式
-configure({
-    enforceActions: 'observed'
-});
-/**
- * mod层 - 业务逻辑，数据逻辑应该存储于此
- */
-class MyManage_DataSearchPermisssion_Mod {
-    constructor() {
-        makeObservable(this);
-    }
-    // 监视状态
-    @observable state = {
-        version: '',
-        selectedTabIndex: "1",
-        DsAuthModalMod: {
-            dsId: '',
-            DsAuthModalVisable: false,
-            saveLoading: false,
-            authType: 'user', //授权类型，app:'应用'，user:'用户'
-            appsList: [], //应用列表
-            usersList: [], //用户列表
-            dbList: [], //数据库列表
-            tableList: [], //数据表列表
-            dbs: [], //选择的数据库
-            tables: [], //选择的数据表
-            items: [], //存放，数据表与数据库的对应数据
-            appIds: [], //选择的应用
-            userIds: [], //选择的用户
-            permissionTypes: [], //权限类型
-            authorizeReason: ''
-        },
-        recycleModalMod: {
-            dsId: '',
-            recycleModalVisable: false,
-            saveLoading: false,
-            appsList: [], //应用列表
-            usersList: [], //用户列表
-            dbList: [], //数据库列表
-            tableList: [], //数据表列表
-            dbs: [], //选择的数据库
-            tables: [], //选择的数据表
-            items: [], //存放，数据表与数据库的对应数据
-            objId: undefined, //选择的回收权限对象
-            permissionTypes: [], //权限类型
-            retrieveType: 'user', //回收权限类型，app:'应用'，user:'用户'
-            retrieveReason: ''
-        }
-    }
-
-    /*
-     * 如果设定了useStrict严格模式，那么所有observable的值的修改必须在action定义的方法内，否则可以直接修改
-     * 设置内容可视性
-     */
-    @action updateState = async (payload) => {
-        // 设置到状态机 - 如果是异步，必须在runInAction
-        runInAction(() => {
-            this.state = {
-                ...this.state,
-                ...payload,
-                DsAuthModalMod: {
-                    ...this.state.DsAuthModalMod,
-                    ...payload.DsAuthModalMod
-                },
-                recycleModalMod: {
-                    ...this.state.recycleModalMod,
-                    ...payload.recycleModalMod
-                }
-            }
-        })
-        /*
-         * Mod中跳转使用  window.app.router.push(url);
-         * 监控数据变化的回调,读取什么参数，即代表将要监控什么数据
-         */
-        autorun(() => {
-            // console.info("visible: ", this.state.visible);
-        })
-    }
-    // 更新一条数据源业务申请权限信息
-    @action updateOsDatasourceTableApplyInfoEntity = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.updateOsDatasourceTableApplyInfoEntityServ(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                message.success('操作成功!')
-                callback && callback()
-            }
-        } catch (error) { }
-    }
-
-    // 查询数据查询限制配置信息
-    @action querySqlLimitConfig = async (payload, callback) => {
-        // 请求参数
-        try {
-            const { resultCode, resultMsg, data } = await Serv.querySqlLimitConfig()
-            if (resultCode == '0') {
-                this.updateState({formData:data})
-                callback && callback(data)
-            }
-        } catch (error) { }
-    }
-
-    // 设置数据查询限制配置信息
-    @action setSqlLimitConfig = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.setSqlLimitConfig(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                message.success('操作成功!')
-                callback && callback()
-            }
-        } catch (error) { }
-    }
-
-    // 分页查询数据源信息
-    @action pageQueryDsInfoMod2 = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo2(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                const tableArr2 = data ? data.records.map(x => {
-                    let str = (x.hasSelect ? '表查询、' : '') + (x.hasDownload ? '下载、' : '') + (x.hasModify ? '增删改、' : '')
-                    return {
-                        ...x,
-                        ...{
-                            key: Math.random(),
-                            testArr: get(x, 'tableNames', '').split(','),
-                            bizTableKey:str.substring(0,str.length-1)
-                            // description : x.bizTableCreateSql,
-                        }
-                    }
-                }) : [];
-                console.log(tableArr2, "tableArr2")
-                this.updateState({
-                    tableArr2: tableArr2
-                })
-                callback && callback(data.total)
-            }
-        } catch (error) { }
-    }
-
-    // 数据查询限制配置
-    @action limitSet = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.limitSet(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                message.success('提交成功!')
-                callback && callback()
-            }
-        } catch (error) { }
-    }
-
-
-
-    //获取所有的应用
-    @action getAllApps = async (payload) => {
-        const { type } = payload
-        // 请求参数
-        const params = {
-            pageNum: 1,
-            pageSize: 9999
-        }
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.getAllApps(params)
-            if (resultMsg == 'success') {
-                let list = (data && data.list) || []
-                list = list.map((item) => {
-                    return {
-                        label: item.appName,
-                        value: item.appId
-                    }
-                })
-                if (type == 'auth') {
-                    this.updateState({ DsAuthModalMod: { appsList: list } })
-                } else if (type == 'recycle') {
-                    this.updateState({ recycleModalMod: { appsList: list } })
-                }
-            } else {
-                if (type == 'auth') {
-                    this.updateState({ DsAuthModalMod: { appsList: [] } })
-                } else if (type == 'recycle') {
-                    this.updateState({ recycleModalMod: { appsList: [] } })
-                }
-            }
-        } catch (error) {
-            if (type == 'auth') {
-                this.updateState({ DsAuthModalMod: { appsList: [] } })
-            } else if (type == 'recycle') {
-                this.updateState({ recycleModalMod: { appsList: [] } })
-            }
-        }
-    }
-
-    // 分页查询数据源信息
-    @action pageQueryDsInfoMod = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.pageQueryDsInfo(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                const tableArr = get(data, 'records', [])
-                this.updateState({
-                    tableArr: tableArr
-                })
-                callback && callback(data.total)
-            }
-        } catch (error) { }
-    }
-
-
-    //获取所有的用户
-    @action getAllUsers = async (payload) => {
-        const { type } = payload
-        // 请求参数
-        const params = {
-            pageNum: 1,
-            pageSize: 9999
-        }
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.getAllUsers(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                let list = (data && data.records) || []
-                list = list.map((item) => {
-                    return {
-                        label: item.account + '(' + item.name + ')',
-                        value: item.accountId
-                    }
-                })
-                if (type == 'auth') {
-                    this.updateState({ DsAuthModalMod: { usersList: list } })
-                } else if (type == 'recycle') {
-                    this.updateState({ recycleModalMod: { usersList: list } })
-                }
-            } else {
-                if (type == 'auth') {
-                    this.updateState({ DsAuthModalMod: { usersList: [] } })
-                } else if (type == 'recycle') {
-                    this.updateState({ recycleModalMod: { usersList: [] } })
-                }
-            }
-        } catch (error) {
-            if (type == 'auth') {
-                this.updateState({ DsAuthModalMod: { usersList: [] } })
-            } else if (type == 'recycle') {
-                this.updateState({ recycleModalMod: { usersList: [] } })
-            }
-        }
-    }
-
-    //获取所有的数据库列表
-    @action getAllDbList = async (payload) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.getAllDbList(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                let list = data || []
-                list = list.map((item) => {
-                    return {
-                        label: item,
-                        value: item
-                    }
-                })
-                this.updateState({ DsAuthModalMod: { dbList: list, tableList: [] } })
-            } else {
-                this.updateState({ DsAuthModalMod: { dbList: [], tableList: [] } })
-            }
-        } catch (error) {
-            this.updateState({ DsAuthModalMod: { dbList: [], tableList: [] } })
-        }
-    }
-    //获取所选数据库下的数据表
-    @action getAllTableList = async (payload) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            const { resultCode, resultMsg, data } = await Serv.getAllTableList(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                const list = data || []
-                const tableList_noAuth = [] //无授权表
-                const tableList_hadAuth = [] //有授权表
-                list.map((item) => {
-                    if (item.tables && item.tables.length > 0) {
-                        item.tables.map((table) => {
-                            const obj = {
-                                label: table.tableName,
-                                value: table.tableName,
-                                hasAuth: table.hasAuth,
-                                dbName: item.dataBaseName
-                            }
-                            if (table.hasAuth) {
-                                tableList_hadAuth.push(obj)
-                            } else {
-                                tableList_noAuth.push(obj)
-                            }
-                        })
-                    }
-                })
-                this.updateState({ DsAuthModalMod: { tableList: [...tableList_noAuth, ...tableList_hadAuth] } })
-            } else {
-                this.updateState({ DsAuthModalMod: { tableList: [] } })
-            }
-        } catch (error) {
-            this.updateState({ DsAuthModalMod: { tableList: [] } })
-        }
-    }
-
-    //授权数据表权限
-    @action grantDsTable = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            this.updateState({ DsAuthModalMod: { saveLoading: true } })
-            const { resultMsg, data } = await Serv.grantDsTable(params)
-            this.updateState({ DsAuthModalMod: { saveLoading: false } })
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultMsg == 'success') {
-                message.success('授权成功！')
-                this.updateState({ DsAuthModalMod: { DsAuthModalVisable: false }, version: +new Date() })
-                if (callback) {
-                    callback()
-                }
-            } else {
-                message.warn(resultMsg || '操作失败！')
-            }
-        } catch (error) {
-            //message.error('发生异常，操作失败！')
-            this.updateState({ DsAuthModalMod: { saveLoading: false } })
-        }
-    }
-
-    //回收数据源
-    @action recycleDsTable = async (payload, callback) => {
-        // 请求参数
-        const params = payload
-        try {
-            // 异步请求方法
-            this.updateState({ recycleModalMod: { saveLoading: true } })
-            const { resultMsg, data } = await Serv.recycleDsTable(params)
-            this.updateState({ recycleModalMod: { saveLoading: false } })
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultMsg == 'success') {
-                message.success('回收成功！')
-                this.updateState({ recycleModalMod: { recycleModalVisable: false }, version: +new Date() })
-                if (callback) {
-                    callback()
-                }
-            } else {
-                message.warn(resultMsg || '操作失败！')
-            }
-        } catch (error) {
-            console.error(error)
-            //message.error('发生异常，操作失败！')
-            this.updateState({ recycleModalMod: { saveLoading: false } })
-        }
-    }
-    //获取授权的数据库列表
-    @action getDbList_Auth = async (payload) => {
-        // 请求参数
-        const params = payload
-        try {
-            const { resultCode, resultMsg, data } = await Serv.getDbList_Auth(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultCode == '0') {
-                let list = data || []
-                list = list.map((item) => {
-                    return {
-                        label: item,
-                        value: item
-                    }
-                })
-
-                this.updateState({ recycleModalMod: { dbList: list, tableList: [] } })
-            } else {
-                this.updateState({ recycleModalMod: { dbList: [], tableList: [] } })
-            }
-        } catch (error) {
-            this.updateState({ recycleModalMod: { dbList: [], tableList: [] } })
-        }
-    }
-    //获取选择授权数据库，授权的数据表
-    @action getTableList_Auth = async (payload) => {
-        // 请求参数
-        const params = payload
-        try {
-            const { resultCode, resultMsg, data } = await Serv.getTableList_Auth(params)
-            // 使用lodash的get方法获取嵌套对象属性，避免当data为null时导致的data.list为undefined报错
-            if (resultMsg == 'success') {
-                const list = data || []
-                const tableList = []
-                list.map((item) => {
-                    if (item.tableNames && item.tableNames.length > 0) {
-                        item.tableNames.map((table) => {
-                            tableList.push({
-                                label: table,
-                                value: table,
-                                dbName: item.dataBaseName
-                            })
-                        })
-                    }
-                })
-
-                this.updateState({ recycleModalMod: { tableList: tableList } })
-            } else {
-                this.updateState({ recycleModalMod: { tableList: [] } })
-            }
-        } catch (error) {
-            this.updateState({ recycleModalMod: { tableList: [] } })
-        }
-    }
-}
-
-// 将组件实例化，这意味着组件将不能从别处实例化
-const myManage_DataSearchPermisssion_Mod = new MyManage_DataSearchPermisssion_Mod()
-export default myManage_DataSearchPermisssion_Mod