thoth-frontend-test/src/store/modules/monthlyReport/edit/index.js

import { uuid10 } from '@/utils'
import {
  getMonthlyReport,
  updateMonthlyReport,
  delMonthlyReport,
  getAllSubReportCatalog,
  getSubReport,
  // getReportDependence,
  getDeptArch,
  sendConfirm,
  returnReport,
  sendSubConfirm,
  publishReport,
  getSubReportInfo,
  updateSubReport,
  pullDataAgain
} from '@/api/qualityMonthlyReport/edit'
import { getAvaliableInfo } from '@/api/qualityMonthlyReport'

import {
  reportDataBack,
  setReportData,
  setTabActive,
  setDeptArch,
  setIndexTitle,
  arrToObj,
  objToArr,
  setTableHeader
} from './utils'
import { message } from '@/utils/mesDebounce'

import _ from 'lodash'

export default {
  /* 月报编辑 */
  namespaced: true,
  state: {
    pageDate: null, // 页面的完整数据
    tabsList: [
      '上月问题跟进',
      '本月重点问题',
      '服务端详情',
      '客户端详情',
      '硬件详情',
      '本月优秀&持续改进'
    ],
    tabsActive: '', // 最上层tabs焦点
    tabPageData: null, // 单个标签页数据
    reportData: [], // 所有标签页数据
    editKeys: [], // 存放需要编辑的区域的  domKey（唯一）
    subTabsActive: [], // 当前页签中所有已切换的数据
    domKeys: [], // 记录所有元素区域的唯一标识
    selectEnum: [], // 部门数据
    userNames: [], // 人员数据
    subTitle: '新建月报',
    subReportName: '',
    subReportInfo: null, // 为回退时，当前页面为查看完整时，无法获取子月报数据情况设置
    offsetList: [],
    /**
     * 用户身份权限编号
     * 100        月报发起人
     * 50         确认人
     * 30         用户
     * 0          管理员
     */
    roleCode: 50, // 默认为用户
    reportList: [], // 默认为用户
    pageType: 'edit', // edit:(月报编辑和新建); readAll:(查看月报详情)
    loading: false,
    clientTypeList: [],
    // 单业务线编辑时，数据迁移
    saveAsTargetList: []
    // saveAsData: {
    //   tableRow: '',
    //   targetSubReportId: ''
    // }
  },
  mutations: {
    // 页面基础数据赋值
    INIT_PAGE_DATA(state, params) {
      const { pageType } = state
      if (pageType === 'read' || pageType === 'edit') return
      if (pageType === 'readAll') {
        // 设置tabs数据
        state.tabsList = state.tabsList.map((elm) => ({
          label: elm,
          name: `tab_${elm}`
        }))
        state.tabsActive = 'tab_上月问题跟进'
        return
      }
      state.pageDate = { ...params }
      delete state.pageDate.subReports
      // state.subTitle = state.pageDate.reportName
      const subReports = [...params.subReports]
      // 设置部门数据
      // state.selectEnum = [...params.dependence.deptArch.children]
      // setDeptArch(state.selectEnum)
      // 设置端数据
      if (params.dependence.clientType) {
        state.clientTypeList = [...params.dependence.clientType]
      }
      setDeptArch(state.clientTypeList)
      if (subReports.length) {
        state.tabsList = []
        subReports.forEach((elm, index) => {
          // 设置tabs数据
          state.tabsList.push({
            label: elm.reportName,
            reportName: elm.reportName,
            id: elm.id,
            name: `tab_${elm.id}`
          })
        })
        state.subReportInfo = _.cloneDeep(state.tabsList)
        // 设置tabs数据
        state.tabsActive = state.tabsList[0].name
        // table页签
        state.reportData = [...subReports]
      }
    },
    // 设置页面的是否为编辑页面
    SET_PAGE_TYPE(state, key) {
      state.pageType = key
    },
    // 单个tab页面数据初始化设置
    INIT_TAB_PAGE_DATA(state, tabsActive = '') {
      const { pageType } = state

      const setKey = (arr, depth) => {
        if (arr && arr.length) {
          arr.forEach((elm) => {
            elm.domKey = uuid10()
            elm.depth = depth
            if (arr.children && arr.children.length) {
              setKey(arr.children, depth + 1)
            }
            if (arr.content && arr.content.length) {
              setKey(arr.content, depth + 1)
            }
          })
        }
      }

      if (pageType === 'readAll') {
        state.tabsActive = tabsActive || state.tabsActive
        return
      }
      state.reportData.forEach((elm) => {
        setKey(elm.reportCatalog.children, 0)
      })
      // 从其他页面跳转过来
      const [tabPageData] = state.reportData.filter((elm) => {
        return (
          `${elm.id}` === setTabActive('tab_', tabsActive || state.tabsActive)
        )
      })
      if (tabsActive) {
        state.tabsActive = `tab_${tabsActive}`
      }
      // state.tabPageData = setReportData(tabPageData)
      const { newObj, domKeys } = setReportData(
        tabPageData
          ? tabPageData.reportCatalog
          : state.reportData[0].reportCatalog
      )
      state.tabPageData = newObj
      state.domKeys = domKeys
    },
    // 切换页面之后数据维护
    TAB_ACTIVE_CHANGE(state, tabsActive) {
      // 获取原来页签的选中对象的id
      const newTabsActive = setTabActive('tab_', tabsActive)
      // tabPageData => 后台源数据结构
      const oldTabPageData = reportDataBack({ ...state.tabPageData })
      // console.log(oldTabPageData)
      let newTabPageData = {}
      const reportData = state.reportData.map((elm) => {
        // 找出新页面的数据    && newTabsActive !== oldTabPageData.id
        if (newTabsActive === `${elm.id}`) {
          newTabPageData = { ...elm }
        }
        // 将上一个被选中的页签数据赋值给源数据（reportData）
        if (`${elm.reportName}` === `${oldTabPageData.title}`) {
          return {
            ...elm,
            reportCatalog: { ...oldTabPageData }
          }
        }
        return elm
      })
      state.reportData = [...reportData]
      // console.log(state.reportData)
      // 对新数据进行转换
      const { newObj, domKeys } = setReportData(
        newTabPageData.reportCatalog,
        108
      )
      state.tabsActive = `tab_${newTabsActive}`
      state.tabPageData = newObj
      state.domKeys = domKeys
      // 页面恢复待编辑状态
      state.editKeys = []
      // 子页面页签切换，清空原来的tabs选中状态
      state.subTabsActive = []
    },
    // 添加行
    ADD_EDIT_KEYS(state, key) {
      state.editKeys.push(key)
      // const index = state.editKeys.indexOf(key)
      // if (index < 0) {
      //   state.editKeys.push(key)
      // }
    },
    INIT_EDIT_KEYS(state) {
      state.editKeys = []
    },
    // 获取子页面所有距离顶部的集合基础信息
    GET_ALL_OFFSETTOP(state) {
      const getOffsetTop = (id) => {
        const dom = document.getElementById(id)
        if (!dom) return 0.9527
        return dom.getBoundingClientRect().top
      }
      const list = []
      state.domKeys.forEach((elm) => {
        const top = getOffsetTop(elm)
        if (top > 0 && top !== 0.9527) {
          list.push({
            domKey: elm,
            top: getOffsetTop(elm)
          })
        }
      })
      state.offsetList = [...list]
    },
    // 子页签数据切换
    SUB_TABS_ACTIVE(state, { key, oldKey }) {
      const index = state.subTabsActive.indexOf(oldKey)
      if (index < 0) {
        state.subTabsActive.push(key)
      } else {
        state.subTabsActive.splice(index, 1, key)
      }
    },
    // 删除行
    /**
     * @param params.domKey   String   当前表格唯一标识
     * @param params.btnItem  Object   点击按钮的基础数据
     * @param params.scope    Object   当前行的数据
     * @constructor
     */
    DELETE_TABLE_LINE(state, params) {
      //         const { btnItem, scope } = params
      //
      // const deepDeleteArray = (arr, key) =>{
      //           arr.forEach(elm=>{
      //             if(elm.content && elm.content.length){
      //               elm.content.forEach(item )
      //             }
      //           })
      // }
      //
      //       state.tabPageData.children.forEach((elm) => {
      //         elm.content.forEach((item) => {
      //           item.domKey = uuid10(4)
      //           if (item.type === 'table') {
      //             setTableHeader(item.tableHeaders)
      //             item.tableRows = arrToObj(item.tableRows, item.tableHeaders)
      //           }
      //         })
      //       })
    },
    // 切换tabs之后，重新生成左侧树
    CREATE_TREE_DATA(state) {},
    // 菜单添加子项setInit
    ADD_MENU_CHILDREN(state, params) {},
    // 删除某一条数据
    DELETE_ITEM(state, domKey) {
      const tabPageData = [...state.tabPageData.children]
      const delDom = (arr, key) => {
        if (arr && _.isArray(arr) && arr.length) {
          for (let i = 0; i < arr.length; i++) {
            if (arr[i].domKey === key) {
              arr.splice(i, 1)
              return
            }

            if (arr[i].content && arr[i].content.length) {
              delDom(arr[i].content, key)
            }
            if (arr[i].children && arr[i].children.length) {
              delDom(arr[i].children, key)
            }
          }
        }
      }
      delDom(tabPageData, domKey)
      state.tabPageData.children = [...tabPageData]
    },
    /**
     * 添加同级或者子集
     * @param state   Object  数据源
     * @param domKey  String  当前点击元素的唯一标识
     * @param params  Object  要添加的内容
     * @param isSub   Boolean 要添加的内容(true：添加子项|false：添加同级)
     * @constructor
     */
    ADD_ITEM(state, { domKey, params, isSub = false }) {
      if (domKey && params) {
        const tabPageData = [...state.tabPageData.children]
        const addItem = (arr, key) => {
          if (arr && _.isArray(arr) && arr.length) {
            for (let i = 0; i < arr.length; i++) {
              if (arr[i].domKey === key) {
                // 添加子项
                if (isSub) {
                  // params.domIndexKey = arr[i].children
                  arr[i].children = [...arr[i].children, { ...params }]
                }
                // 添加同级
                if (!isSub) {
                  // params.domIndexKey = i + 1
                  arr.splice(i + 1, 0, params)
                }
                return
              }
              if (arr[i].content && arr[i].content.length) {
                addItem(arr[i].content, key)
              }
              if (arr[i].children && arr[i].children.length) {
                addItem(arr[i].children, key)
              }
            }
          }
        }
        addItem(tabPageData, domKey)
        state.tabPageData.children = [...tabPageData]
      }
    },
    // 数据初始化
    INIT_STATE_DATA(state) {
      state.pageDate = null // 页面的完整数据
      state.tabsList = [
        '上月问题跟进',
        '本月重点问题',
        '服务端详情',
        '客户端详情',
        '硬件详情',
        '本月优秀&持续改进'
      ]
      state.tabsActive = '' // 最上层tabs焦点
      state.tabPageData = null // 单个标签页数据
      state.reportData = [] // 所有标签页数据
      state.editKeys = [] // 存放需要编辑的区域的  domKey（唯一）
      state.subTabsActive = [] // 当前页签中所有已切换的数据
      state.domKeys = [] // 记录所有元素区域的唯一标识
      state.selectEnum = [] // 部门数据
      state.userNames = [] // 人员数据
      state.subTitle = '新建月报'
      state.subReportName = ''
      state.subReportInfo = null // 为回退时，当前页面为查看完整时，无法获取子月报数据情况设置
      state.offsetList = []
      /**
       * 用户身份权限编号
       * 100        月报发起人
       * 50         确认人
       * 30         用户
       * 0          管理员
       */
      state.roleCode = 50 // 默认为用户
      state.reportList = [] // 默认为用户
      state.pageType = 'edit' // edit:(月报编辑和新建); readAll:(查看月报详情)
      state.loading = false
      state.clientTypeList = []
      // 单业务线编辑时，数据迁移
      state.saveAsTargetList = []
    },
    // tabPageData
    SET_TAB_PAGE_DATA(state, { data, id, tabsActive }) {
      // 对新数据进行转换
      const { newObj, domKeys } = setReportData(
        {
          children: _.cloneDeep(data)
        },
        108
      )
      // state.tabPageData = {
      //   children: _.cloneDeep(data)
      // }
      // console.log(365, state.tabPageData)
      state.tabPageData = newObj
      state.domKeys = domKeys
      // 页面恢复待编辑状态
      state.editKeys = []
      // 子页面页签切换，清空原来的tabs选中状态
      state.subTabsActive = []
      state.tabsActive = '' + tabsActive
    },
    // 设置人员数据，避免重复请求 userNames
    SET_USER_NAME(state, { key, value }) {
      if (!state.userNames.hasOwnProperty(key) && !state.userNames[key]) {
        state.userNames[key] = value
      }
    },
    // 获取部门数据
    SET_SELECT_ENUM(state, params) {
      console.log(params)
      state.selectEnum = params
      console.log(state.selectEnum)
      // setDeptArch(state.selectEnum)
    },
    // 标记为本月重点问题
    MARK_ISSUES(state, { cascaderValue, normalAreaName, multiplePeople }) {
      let isAdd = true
      const run = (arr) => {
        arr.forEach((elm) => {
          if (
            isAdd &&
            elm.title === '本月重点问题' &&
            elm.content &&
            elm.content.length
          ) {
            elm.content.forEach((item) => {
              if (item.type === 'Table') {
                const row = { analyticFeedback: null }
                item.tableHeaders.forEach((subItem) => {
                  if (subItem.name === '归属团队') {
                    row[subItem.headerKey] = cascaderValue
                  }
                  if (subItem.name === '问题') {
                    row[subItem.headerKey] = normalAreaName
                  }
                  if (subItem.name === '责任人') {
                    row[subItem.headerKey] = multiplePeople
                  }
                })
                if (!item.tableRows) {
                  item.tableRows = []
                }
                item.tableRows.push(row)
                isAdd = false
              }
            })
          }
          if (isAdd && elm.children && elm.children.length) {
            run(elm.children)
          }
        })
      }
      run(state.tabPageData.children)
    },
    // 设置右侧树的提示内容
    SET_HEADER_TITLE(state, { domKey, headerTitle }) {
      let isAdd = true
      const run = (arr) => {
        arr.forEach((elm) => {
          if (isAdd && elm.domKey === domKey) {
            elm.headerTitle = headerTitle
            isAdd = false
          }
          if (isAdd && elm.content && elm.content.length) {
            run(elm.content)
          }
          if (isAdd && elm.children && elm.children.length) {
            run(elm.children)
          }
        })
      }
      run(state.tabPageData.children)
    },
    // 获取用户月报操作区域权限
    GET_USER_PERMISSION(state, { roleCode, reportList }) {
      state.roleCode = roleCode
      state.reportList = reportList
    },
    // 设置月报子标题 // 设置月报子标题   parentId: 163
    // 设置月报标题
    // (state, name) {
    //   state.subTitle = name
    // },
    SET_SUB_TITLE(state, { id, name }) {
      // commit('SET_SUB_TITLE', {
      //   parentId: res.data.parentId,
      //   name: res.data.reportName
      // })
      state.reportList &&
        state.reportList.forEach((elm) => {
          if (`${elm.id}` === `${id}`) {
            if (!name) {
              state.pageDate = {
                status: elm.status
              }
            }
            // console.log(elm.reportName)
            // 如果是
            if (elm.status === 10) {
              state.subTitle = `确认月报｜${elm.reportName}`
            } else if (elm.status === 20) {
              state.subTitle = `发布月报｜${elm.reportName}`
            } else if (elm.status === 30) {
              state.subTitle = `查看｜${elm.reportName}`
            } else {
              state.subTitle = `${elm.statueStr}｜${elm.reportName}`
            }
          }
        })
      // 如果是单业务线查看
      if (name) {
        state.subReportName = `${name}`
        state.subTitle += `｜${name}`
      }
    },
    // 设置页面基础数据
    SET_PAGE_DATA(state, params) {
      state.pageDate = _.cloneDeep(params)
      delete state.pageDate.reportCatalog
      delete state.pageDate.reportContent
    },
    // 设置子月报数据
    SET_REPORT_INFO(state, params) {
      state.subReportInfo = params
    },
    // 设置页面状态
    SET_LOADING(state, isShow) {
      state.loading = isShow
    },
    // 设置 页面区域 下标
    SET_INDEX_TITLE(state) {
      state.tabPageData = setIndexTitle(state.tabPageData)
    },
    // 设置拉取之后的页面数据 tabPageData
    // 设置`端数据`
    SET_CLIENT_TYPE_LIST(state, list) {
      state.clientTypeList = list
      setDeptArch(state.clientTypeList)
    },
    /**
    * 数据另存为
    *
    */
    SAVE_AS(state, { tableHeaders, tableRows, subReportid, key = 'only' }) {
      // setTableHeader(data.tableHeaders)
      const rowData = objToArr(
        [tableRows],
        tableHeaders
      )
      const find = (arr) => {
        arr.forEach(elm => {
          if (elm.title === '线上问题') {
            // console.log(532, elm, rowData)
            // console.log(elm.content[0].tableRows, rowData)
            elm.content[0].tableRows.push(rowData[0])
          }
          if (elm.children && elm.children.length) {
            find(elm.children)
          }
        })
      }
      // 多业务线转移
      if (state.pageType === 'editAll') {
        for (let i = state.reportData.length - 1; i >= 0; i--) {
          const elm = state.reportData[i]
          if (elm.id === subReportid) {
            find(elm.reportCatalog.children)
          }
        }
      } else {
        // 单业务线转移
        // 判断数据是否存在，不存在，就插入
        if (state.saveAsTargetList.filter(elm => elm.targetSubReportId === subReportid).length) {
          state.saveAsTargetList.forEach(elm => {
            if (elm.targetSubReportId === subReportid) {
              if (!elm.tableRow) {
                elm.tableRow = []
              }
              elm.tableRow.push(rowData[0])
            }
          })
        } else {
          state.saveAsTargetList.push({
            targetSubReportId: subReportid,
            tableRow: [rowData[0]]
          })
        }
      }
    }
  },
  actions: {
    // 月报数据获取
    async initPageData(
      { commit, state, dispatch },
      { id, subReportId, subActive }
    ) {
      dispatch('setSubReportInfo', id)
      const { pageType } = state
      if (
        pageType === 'readAll' ||
        pageType === 'read' ||
        pageType === 'edit'
      ) {
        commit('INIT_PAGE_DATA')
        dispatch('getSubReportData', {
          id,
          subReportId,
          tabsActive: `tab_${subActive || '上月问题跟进'}`
        })
      } else {
        const res = await getMonthlyReport(id)
        // 设置月报子标题
        commit('SET_SUB_TITLE', {
          id: id
        })
        if (res.code === 200 && res.data) {
          commit('INIT_PAGE_DATA', { ...res.data })
          commit('INIT_TAB_PAGE_DATA', subActive && `tab_${subActive}`)
        }
      }
    },
    // 页面切换 TAB_ACTIVE_CHANGE
    tabActiveChange({ commit, state, dispatch }, { id, tabsActive }) {
      const { pageType } = state
      if (pageType === 'editAll') {
        return commit('TAB_ACTIVE_CHANGE', tabsActive)
      }
      if (pageType === 'readAll') {
        dispatch('getSubReportData', { id, tabsActive })
      }
    },
    // 获取查看月报数据
    async getSubReportData({ commit, state }, { id, subReportId, tabsActive }) {
      const { pageType } = state
      let params = {}
      const method =
        pageType === 'readAll' ? getAllSubReportCatalog : getSubReport
      if (pageType === 'read' || pageType === 'edit') {
        params = {
          subReportId
        }
      }
      if (pageType === 'readAll') {
        // state.pageDate = {
        //   status: 10
        // }
        params = {
          reportId: id,
          catalogTitle: setTabActive('tab_', tabsActive)
        }
      }
      const res = await method(params)
      if (res.code === 200) {
        // 单个月报与完整月报数据梳理
        if (pageType === 'read' || pageType === 'edit') {
          commit('SET_CLIENT_TYPE_LIST', res.data.dependence.clientType)
          // commit('SET_SELECT_ENUM', res.data.dependence.deptArch.children)
          commit('SET_PAGE_DATA', res.data)
        }
        console.log(res)
        if (pageType === 'readAll' && params.catalogTitle.search(/服务端详情|客户端详情/) > -1) {
          res.data.splice(0, 0, { depth: 1, fromUser: false, hiddenAncestor: null, isVisible: true, subTitles: null, title: '整体概览', type: 'Head1', content: [{ type: 'overallOverviewo' }] })
          console.log(params)
        }
        commit('SET_TAB_PAGE_DATA', {
          data:
            pageType === 'readAll' ? res.data : res.data.reportCatalog.children,
          id,
          tabsActive
        })
        // 设置月报子标题
        setTimeout(() => {
          commit('SET_SUB_TITLE', {
            id: pageType.search(/All/) > -1 ? `${id}` : `${res.data.parentId}`,
            name: pageType.search(/All/) > -1 ? '' : res.data.reportName
          })
        }, 700)
      }
    },
    // 子月报更新
    async upDateSubReport({ state }, callback) {
      const params = _.cloneDeep(state.pageDate)
      params.reportCatalog = {
        children: _.cloneDeep(state.tabPageData.children),
        content: [],
        depth: 0,
        fromUser: false,
        hiddenAncestor: null,
        isVisible: true,
        subTitles: null,
        title: params.reportName,
        type: 'Tag'
      }
      params.reportCatalog = reportDataBack(params.reportCatalog)
      if (state.saveAsTargetList.length) {
        params.saveAsTargetList = _.cloneDeep(state.saveAsTargetList)
      }
      params.dependence = null
      const res = await updateSubReport(params)
      if (res.code === 200) {
        callback()
      }
    },
    // 月报更新
    async upDateReport({ dispatch, state }, callback) {
      const params = _.cloneDeep(state.pageDate)
      const tabPageData = _.cloneDeep(state.tabPageData)
      const tabsActive = setTabActive('tab_', state.tabsActive)
      params.subReports = state.reportData.map((elm) => {
        // 将上一个被选中的页签数据赋值给源数据（reportData）
        if (`${elm.id}` === tabsActive) {
          return {
            ...elm,
            dependence: null,
            reportCatalog: { ...reportDataBack({ ...tabPageData }) }
          }
        }
        return elm
      })
      // 转换数据结构
      const res = await updateMonthlyReport(params)
      if (res.code === 200) {
        callback()
      }
    },
    // 获取部门数据
    async setSelectEnum({ commit }, reportId) {
      const depth = JSON.parse(window.localStorage.getItem('depth'))
      console.log(depth)
      if (!depth) {
        const res = await getDeptArch({ reportId })
        if (res.code === 200) {
          window.localStorage.setItem('depth', JSON.stringify(res.data.children))
          commit('SET_SELECT_ENUM', res.data.children)
        }
      } else {
        commit('SET_SELECT_ENUM', depth)
      }
    },
    // 删除月报
    async deleteReport(
      { commit, state, context },
      { key, callback, isMsg = true }
    ) {
      const res = await delMonthlyReport(state.pageDate.id)
      if (res.code === 200) {
        if (isMsg) {
          message.success('删除成功！')
        }
        callback && callback()
      }
    },
    // 月报发送确认
    async sendReport({ commit, state, context }, { id, callback }) {
      const params = _.cloneDeep(state.pageDate)
      const tabPageData = _.cloneDeep(state.tabPageData)
      const tabsActive = setTabActive('tab_', state.tabsActive)
      params.subReports = state.reportData.map((elm) => {
        // 将上一个被选中的页签数据赋值给源数据（reportData）
        if (`${elm.id}` === tabsActive) {
          return {
            ...elm,
            dependence: null,
            reportCatalog: { ...reportDataBack({ ...tabPageData }) }
          }
        }
        return elm
      })
      const res = await sendConfirm({
        ...params,
        id
      })
      if (res.code === 200) {
        message.success('发送成功！')
        callback()
      }
    },
    // 月报发布
    async publishAllReport({ commit, state, context }, { id, callback }) {
      const res = await publishReport({
        id
      })
      if (res.code === 200) {
        message.success('发布成功！')
        callback()
      }
    },
    // 月报确认
    async confirmReport({ state }, { id, callback }) {
      const res = await sendSubConfirm({
        subReportId: id
      })
      if (res.code === 200) {
        callback()
      }
    },
    // 月报回退
    async returnReport({ commit, state, context }, { data, callback }) {
      const res = await returnReport(data)
      if (res.code === 200) {
        callback()
      }
    },
    // 获取用户月报操作区域权限
    async getUserPermission({ commit }) {
      const res = await getAvaliableInfo()
      if (res.code === 200) {
        commit('GET_USER_PERMISSION', res.data)
      }
    },
    // 获取子月报列表数据
    async setSubReportInfo({ commit }, id) {
      const res = await getSubReportInfo(id)
      if (res.code === 200) {
        commit('SET_REPORT_INFO', res.data)
      }
    },
    // 重新拉取数据
    async refreshReport(
      { commit, state },
      { domKey, title, subReportId, callback }
    ) {
      const tabPageData = _.cloneDeep(state.tabPageData)
      // console.log('refreshReport', domKey, title)
      const [tabKey, subTabKey] = state.subTabsActive
      const tabDataObj = {
        tabKey: '',
        subTabKey: ''
      }
      const setValue = (item, key, value) => {
        if (item.domKey === value) {
          tabDataObj[key] = item
        }
      }
      const find = (arr) => {
        arr &&
          arr.length &&
          arr.forEach((elm) => {
            setValue(elm, 'tabKey', tabKey)
            setValue(elm, 'subTabKey', subTabKey)
            if (elm.content && elm.content.length) {
              elm.content.forEach((item) => {
                setValue(elm, 'tabKey', tabKey)
                setValue(elm, 'subTabKey', subTabKey)
              })
            }
            if (elm.children && elm.children.length) {
              find(elm.children)
            }
          })
      }
      const params = {
        subReportId: '',
        catalogTitle: title,
        isServer: false,
        clientType: ''
      }
      if (title !== '上月问题跟进') {
        find(tabPageData.children)
        if (tabDataObj.tabKey.title === '服务端') {
          params.isServer = true
        }
        if (!params.isServer) {
          params.clientType = tabDataObj.subTabKey.title
        }
      }
      if (state.pageType.search(/All/) > -1) {
        // console.log(state, setTabActive('tab_', state.tabsActive))
        params.subReportId = setTabActive('tab_', state.tabsActive)
      }
      if (state.pageType === 'edit') {
        params.subReportId = subReportId
      }
      // console.log(params)
      /**
       * 线上问题、
       */
      const res = await pullDataAgain(params)
      if (title !== '上月问题跟进' && title !== '线下缺陷' && title !== '线上问题') {
        if (res.data.type.search(/Table|TableAndRichText/) > -1) {
          setTableHeader(res.data.tableHeaders)
          res.data.tableRows = arrToObj(
            res.data.tableRows,
            res.data.tableHeaders
          )
        }
      }
      if (title.search(/上月问题跟进|发布&回滚|线上问题/) > -1) {
        setTableHeader(res.data.content[0].tableHeaders)
        res.data.content[0].tableRows = arrToObj(
          res.data.content[0].tableRows,
          res.data.content[0].tableHeaders
        )
      }
      const setDomData = (arr) => {
        arr &&
          arr.length &&
          arr.forEach((elm) => {
            if (elm.domKey === domKey) {
              // console.log(elm, res.data)
              if (title.search(/上月问题跟进|发布&回滚|线上问题|线上问题/) > -1) {
                elm.content = [{ ...res.data.content[0] }]
              } else if (title.search(/线下缺陷/) > -1) {
                elm.content = [{ ...res.data.content[0] }]
                elm.subTitles = [...res.data.subTitles]
              } else {
                elm.content = [{ ...res.data }]
              }
            }
            if (elm.content && elm.content.length) {
              elm.content.forEach((item) => {
                if (title.search(/上月问题跟进|发布&回滚|线上问题/) > -1) {
                  item.content = [{ ...res.data.content[0] }]
                } else {
                  item.content = [{ ...res.data }]
                }
              })
            }
            if (elm.children && elm.children.length) {
              setDomData(elm.children)
            }
          })
      }
      setDomData(tabPageData.children)
      state.tabPageData = tabPageData
      // console.log(res.data, tabPageData)
      if (res.code === 200) {
        callback && callback()
      }
      // setTimeout(() => {
      //   callback && callback()
      // }, 5000)
    }
  }
}