Merge branch 'develop'

king

2025-05-08 400fee62fb40006a9839f1c3a8244b82566b5057

 src/views/appmanage/index.jsx

@@ -1,14 +1,13 @@
import React, {Component} from 'react'
import { fromJS } from 'immutable'
import { Spin, notification, Input, Button, Table, Modal, ConfigProvider, Typography, Row, Col, Tooltip } from 'antd'
import { QuestionCircleOutlined } from '@ant-design/icons'
import { Spin, notification, Input, Button, Table, Modal, Typography, Row, Col, Tooltip } from 'antd'
import { QuestionCircleOutlined, LinkOutlined } from '@ant-design/icons'
import moment from 'moment'
import md5 from 'md5'
import enUS from 'antd/es/locale/en_US'
import zhCN from 'antd/es/locale/zh_CN'

import Api from '@/api'
import Utils from '@/utils/utils.js'
import { langs } from '@/store/options.js'
import asyncComponent from '@/utils/asyncComponent'
import './index.scss'

@@ -16,21 +15,12 @@
const { Paragraph } = Typography
const { Search } = Input

const _locale = sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
const Header = asyncComponent(() => import('./header'))
const MutilForm = asyncComponent(() => import('./mutilform'))
const TransForm = asyncComponent(() => import('./transform'))
const ScriptForm = asyncComponent(() => import('./scriptform'))
const SubMutilForm = asyncComponent(() => import('./submutilform'))

let base_url = ''
if (process.env.NODE_ENV === 'production') {
  base_url = document.location.origin + '/' + window.GLOB.service
} else {
  base_url = window.GLOB.location + '/' + window.GLOB.service
}

sessionStorage.setItem('isEditState', 'true')
const TransMenu = asyncComponent(() => import('./transmenu'))

const skinStyle = {
  bg_black_style_blue: {name: '蓝色', color: '#1890ff'},
@@ -42,11 +32,12 @@
  bg_black_style_yellow_green: {name: '黄绿色', color: '#a0d911'},
  bg_black_style_green: {name: '绿色', color: '#52c41a'},
  bg_black_style_cyan: {name: '青色', color: '#13c2c2'},
  bg_black_style_blue_purple: {name: '蓝紫色', color: '#2f54eb'},
  bg_black_style_blue_purple: {name: '蓝紫色', color: '#3860f4'},
  bg_black_style_purple: {name: '紫色', color: '#722ed1'},
  bg_black_style_magenta: {name: '洋红色', color: '#eb2f96'},
  bg_black_style_grass_green: {name: '草绿色', color: '#aeb303'},
  bg_black_style_deep_red: {name: '深红色', color: '#c32539'}
  bg_black_style_deep_red: {name: '深红色', color: '#c32539'},
  bg_black_style_deep_blue: {name: '深蓝色', color: '#1d3661'}
}

class AppManage extends Component {
@@ -118,6 +109,20 @@
  forbid = false

  UNSAFE_componentWillMount() {
    if (sessionStorage.getItem('devError') === 'true') {
      sessionStorage.clear()
      window.history.replaceState(null, null, window.location.href.split('#')[0] + '#/login')
      window.location.reload()
      return
    }

    if (!sessionStorage.getItem('UserID')) {
      this.props.history.replace('/login')
      return
    }

    window.GLOB.developing = true

    document.body.className = ''
    this.getAppList()
    this.getSmStemp()
@@ -372,7 +377,7 @@
  }

  deleteTran = (record) => {
    const _this = this
    const that = this

    let param = {
      func: 's_sVersion_del',
@@ -390,7 +395,7 @@
                message: '操作成功！',
                duration: 3
              })
              _this.getTransList()
              that.getTransList()
            } else {
              notification.warning({
                top: 92,
@@ -409,7 +414,7 @@
  }

  enableTran = (record) => {
    const _this = this
    const that = this

    let param = {
      func: 's_sVersion_sub',
@@ -427,7 +432,7 @@
                message: '操作成功！',
                duration: 3
              })
              _this.getTransList()
              that.getTransList()
            } else {
              Modal.error({
                title: result.message,
@@ -473,17 +478,30 @@
              cell.delay = _param.delay || 0
              cell.statusBarColor = _param.statusBarColor || 'black'
              cell.sysBgColor = _param.sysBgColor || '#ffffff'
              cell.direction = _param.direction || 'vertical'
              cell.adapter = _param.adapter || ''
              cell.topHeight = _param.topHeight || ''
              cell.share = _param.share || 'false' // 分享
              cell.share_des = _param.share_des || '' // 分享描述
              cell.share_url = _param.share_url || '' // 分享图片
              cell.share_link = _param.share_link || '' // 分享链接
              cell.wxAppId = _param.wxAppId || ''
              cell.wxAppName = _param.wxAppName || ''
              cell.wxMerchId = _param.wxMerchId || ''
              cell.wxMerchName = _param.wxMerchName || ''

              if (cell.adapter && (cell.adapter === 'true' || cell.adapter === 'false')) {
                cell.adapter = ''
              }

              cell.userbind = _param.userbind || ''
              cell.instantMessage = _param.instantMessage || ''
            }

            if (cell.user_binding !== 'true') {
              cell.user_binding = 'false'
            }
            if (cell.share !== 'true') {
              cell.share = 'false'
            }

            if (!cell.adapter && cell.apptype) {
@@ -501,18 +519,26 @@
        })

        if (!selectApp && applist[0]) {
          let _href = window.location.href.split('#')[0] + 'app_record'
          let record = localStorage.getItem(_href)
          let record = localStorage.getItem(window.GLOB.sysSign + 'app_record')
          record = record ? JSON.parse(record) : null
          
          if (record) {
            if (record.activeId) {
              let index = applist.findIndex(item => item.ID === record.activeId)
              if (index === -1) {
                localStorage.setItem(_href, JSON.stringify({preId: '', activeId: ''}))
              } else if (index !== 0) {
                applist.unshift(...applist.splice(index, 1))

          if (record && record.dates) {
            let ids = applist.map(item => item.ID)
            let reset = false

            Object.keys(record.dates).forEach(key => {
              if (!ids.includes(key)) {
                delete record.dates[key]
                reset = true
              }
            })

            applist.sort((a, b) => {
              return (record.dates[b.ID] || 0) - (record.dates[a.ID] || 0)
            })

            if (reset) {
              localStorage.setItem(window.GLOB.sysSign + 'app_record', JSON.stringify(record))
            }
          }
        }
@@ -540,24 +566,25 @@
  }

  getSmStemp = () => {
    let _sql = `select ID,TemplateCode,SignName from (select * from bd_msn_sms_temp where deleted=0 and status=20 ) a 
      inner join (select openid from sapp where id='${window.GLOB.appkey}') b
    let _sql = `select ID,TemplateCode,SignName+'_'+describe as SignName from (select * from bd_msn_sms_temp where deleted=0 and status=20 ) a 
      inner join (select openid from sapp where id='${window.GLOB.appkey}') b 
      on a.openid=b.openid`

    _sql = Utils.formatOptions(_sql)
    _sql = Utils.formatOptions(_sql, 'x')

    let param = {
      func: 'sPC_Get_SelectedList',
      LText: _sql,
      obj_name: 'data',
      arr_field: 'ID,TemplateCode,SignName'
      arr_field: 'ID,TemplateCode,SignName',
      exec_type: 'x'
    }
    
    param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
    param.secretkey = Utils.encrypt(param.LText, param.timestamp)
    param.secretkey = Utils.encrypt('', param.timestamp)
    param.open_key = Utils.encryptOpenKey(param.secretkey, param.timestamp) // 云端数据验证
    
    Api.getSystemConfig(param).then(res => {
    Api.getCloudConfig(param).then(res => {
      let msgs = []
      if (!res.status) {
        notification.warning({
@@ -573,7 +600,7 @@
  }

  deleteApp = (record) => {
    const _this = this
    const that = this

    confirm({
      content: '确定删除《' + record.remark + '》吗？',
@@ -593,12 +620,12 @@
                duration: 5
              })

              _this.setState({
              that.setState({
                selectApp: null,
                selectSubApp: null,
                loading: true
              })
              _this.getAppList()
              that.getAppList()
            } else {
              if (result.message.indexOf('kei_no已被菜单使用，不可删除') > -1) {
                result.message = 'kei_no已被菜单使用，不可删除'
@@ -621,16 +648,15 @@
  
  deleteSubApp = (record) => {
    const { selectApp } = this.state
    const _this = this
    const that = this

    let param = {
      func: 's_kei_addupt',
      ID: selectApp.ID,
      exec_type: 'y',
      exec_type: 'x',
      remark: selectApp.remark,
      kei_no: selectApp.kei_no,
      cus_param_type: 'A',
      LText: ''
      cus_param_type: 'A'
    }

    param.del_typename = record.typename
@@ -643,15 +669,18 @@
    sublist = sublist.map(item => {
      if (item.typename !== 'pc') {
        item.userbind = md5(selectApp.kei_no + item.typename + item.lang).replace(/^.{8}/, 'userbind')
        item.instantMessage = md5(selectApp.kei_no + item.typename + item.lang).replace(/^.{14}/, 'instantmessage')
      }
      return item
    })

    // 子应用ID、typename、应用ID、CloudUserID、appkey、login_types(是否需要登录，已弃用)、link_type(是否使用短连接，已弃用)、role_type(是否使用角色管理)、lang、css(皮肤)、title(标题)、favicon(图标)、user_binding(用户绑定)、sms_id(短信模板ID)、自定义
    param.LText = sublist.map(item => `select '${item.ID}','${item.typename}','${selectApp.ID}','${sessionStorage.getItem('CloudUserID') || ''}','${window.GLOB.appkey || ''}','false','false','${item.role_type || 'true'}','${item.lang || 'zh-CN'}','${item.css || ''}','${item.title || ''}','${item.favicon || ''}','${item.user_binding || 'false'}','','${window.btoa(window.encodeURIComponent(JSON.stringify({userbind: item.userbind || '', instantMessage: item.instantMessage || '', apptype: item.apptype || '', delay: item.delay || 0, statusBarColor: item.statusBarColor || 'black', sysBgColor: item.sysBgColor || '#ffffff', adapter: item.adapter || ''})))}'`)
    param.LText = sublist.map(item => {
      let _par = this.getCusParam(item)

      return `select '${item.ID}','${item.typename}','${selectApp.ID}','${sessionStorage.getItem('CloudUserID') || ''}','${window.GLOB.appkey || ''}','false','false','${item.role_type || 'true'}','${item.lang || 'zh-CN'}','${item.css || ''}','${item.title || ''}','${item.favicon || ''}','${item.user_binding || 'false'}','','${window.btoa(window.encodeURIComponent(JSON.stringify(_par)))}','${item.app_name || selectApp.remark || ''}','${item.app_icon || ''}','${item.allow_subscribe || ''}','${item.link_remark || ''}'`
    })
    param.LText = param.LText.join(' union all ')
    param.LText = Utils.formatOptions(param.LText)
    param.LText = Utils.formatOptions(param.LText, 'x')
    
    confirm({
      content: '确定删除该子应用吗？',
@@ -665,11 +694,11 @@
                duration: 5
              })
      
              _this.setState({
              that.setState({
                selectSubApp: null,
                loading: true
              })
              _this.getAppList()
              that.getAppList()
            } else {
              notification.warning({
                top: 92,
@@ -690,17 +719,16 @@
  jumpApp = (item) => {
    const { selectApp } = this.state

    let _href = window.location.href.split('#')[0] + 'app_record'
    let record = localStorage.getItem(_href)
    let record = localStorage.getItem(window.GLOB.sysSign + 'app_record')
    record = record ? JSON.parse(record) : null

    if (!record) {
      localStorage.setItem(_href, JSON.stringify({preId: selectApp.ID, activeId: ''}))
    if (!record || !record.dates) {
      localStorage.setItem(window.GLOB.sysSign + 'app_record', JSON.stringify({preId: selectApp.ID, activeId: selectApp.ID, dates: {[selectApp.ID]: new Date().getTime()}}))
    } else {
      if (record.preId === selectApp.ID) {
        localStorage.setItem(_href, JSON.stringify({preId: selectApp.ID, activeId: selectApp.ID}))
      if (record.preId === selectApp.ID || record.activeId === selectApp.ID) {
        localStorage.setItem(window.GLOB.sysSign + 'app_record', JSON.stringify({preId: selectApp.ID, activeId: selectApp.ID, dates: {...record.dates, [selectApp.ID]: new Date().getTime()}}))
      } else {
        localStorage.setItem(_href, JSON.stringify({...record, preId: selectApp.ID}))
        localStorage.setItem(window.GLOB.sysSign + 'app_record', JSON.stringify({...record, preId: selectApp.ID}))
      }
    }

@@ -709,13 +737,43 @@
      route = 'pcdesign'
    }

    window.open(window.location.href.replace(/#.+/ig, `#/${route}/${window.btoa(window.encodeURIComponent(JSON.stringify({...item, kei_no: selectApp.kei_no, remark: selectApp.remark, type: 'app'})))}`))
    let applangList = []
    if (item.lang === 'zh-CN') {
      selectApp.sublist.forEach(cell => {
        if (cell.typename === item.typename && cell.lang !== 'zh-CN') {
          applangList.push(cell.lang)
        }
      })
    }
    if (applangList.length) {
      applangList = JSON.stringify(applangList)
    } else {
      applangList = ''
    }

    let param = {...item, kei_no: selectApp.kei_no, remark: selectApp.remark, applangList, type: 'app'}

    window.open(window.location.href.replace(/#.+/ig, `#/${route}/${window.btoa(window.encodeURIComponent(JSON.stringify(param)))}`))
  }

  jumpMenu = (item) => {
    const { selectApp } = this.state

    window.open(window.location.href.replace(/#.+/ig, `#/role/${window.btoa(window.encodeURIComponent(JSON.stringify({...item, kei_no: selectApp.kei_no, remark: selectApp.remark, type: 'app'})))}`))
    let applangList = []
    if (item.lang === 'zh-CN') {
      selectApp.sublist.forEach(cell => {
        if (cell.typename === item.typename && cell.lang !== 'zh-CN') {
          applangList.push(cell.lang)
        }
      })
    }
    if (applangList.length) {
      applangList = JSON.stringify(applangList)
    } else {
      applangList = ''
    }

    window.open(window.location.href.replace(/#.+/ig, `#/role/${window.btoa(window.encodeURIComponent(JSON.stringify({...item, kei_no: selectApp.kei_no, remark: selectApp.remark, applangList, type: 'app'})))}`))
  }

  onSelectChange = selectedRowKeys => {
@@ -759,7 +817,7 @@
      }
    })

    const _this = this
    const that = this

    confirm({
      content: '确定要执行吗？',
@@ -795,10 +853,10 @@
                message: '执行成功。',
                duration: 3
              })
              _this.setState({
              that.setState({
                scriptIndex: 1
              }, () => {
                _this.getScriptList()
                that.getScriptList()
              })
            }
            resolve()
@@ -850,10 +908,10 @@
        ID = selectApp.ID
      } else {
        let lowerKei = res.kei_no.toLowerCase()
        if (lowerKei === 'mob') {
        if (['mob', 'pad', 'pc', 'admin'].includes(lowerKei)) {
          notification.warning({
            top: 92,
            message: '应用编码不允许使用mob！',
            message: '应用编码不允许使用mob、pad、pc、admin！',
            duration: 3
          })
          return
@@ -875,7 +933,7 @@
      let param = {
        func: 's_kei_addupt',
        ID: ID,
        exec_type: 'y',
        exec_type: 'x',
        remark: res.remark,
        kei_no: res.kei_no,
        cus_param_type: 'A',
@@ -889,14 +947,17 @@
        selectApp.sublist = selectApp.sublist.map(item => {
          if (item.typename !== 'pc') {
            item.userbind = md5(selectApp.kei_no + item.typename + item.lang).replace(/^.{8}/, 'userbind')
            item.instantMessage = md5(selectApp.kei_no + item.typename + item.lang).replace(/^.{14}/, 'instantmessage')
          }
          return item
        })

        param.LText = selectApp.sublist.map(item => `select '${item.ID}','${item.typename}','${selectApp.ID}','${sessionStorage.getItem('CloudUserID') || ''}','${window.GLOB.appkey || ''}','false','false','${item.role_type || 'true'}','${item.lang || 'zh-CN'}','${item.css || ''}','${item.title || ''}','${item.favicon || ''}','${item.user_binding || 'false'}','','${window.btoa(window.encodeURIComponent(JSON.stringify({userbind: item.userbind || '', instantMessage: item.instantMessage || '', apptype: item.apptype || '', delay: item.delay || 0, statusBarColor: item.statusBarColor || 'black', sysBgColor: item.sysBgColor || '#ffffff', adapter: item.adapter || ''})))}'`)
        param.LText = selectApp.sublist.map(item => {
          let _par = this.getCusParam(item)
    
          return `select '${item.ID}','${item.typename}','${selectApp.ID}','${sessionStorage.getItem('CloudUserID') || ''}','${window.GLOB.appkey || ''}','false','false','${item.role_type || 'true'}','${item.lang || 'zh-CN'}','${item.css || ''}','${item.title || ''}','${item.favicon || ''}','${item.user_binding || 'false'}','','${window.btoa(window.encodeURIComponent(JSON.stringify(_par)))}','${item.app_name || selectApp.remark || ''}','${item.app_icon || ''}','${item.allow_subscribe || ''}','${item.link_remark || ''}'`
        })
        param.LText = param.LText.join(' union all ')
        param.LText = Utils.formatOptions(param.LText)
        param.LText = Utils.formatOptions(param.LText, 'x')
      }

      Api.getCloudConfig(param).then(result => {
@@ -933,6 +994,53 @@
    })
  }

  getCusParam = (item) => {
    let _par = {
      sysBgColor: item.sysBgColor || '#ffffff'
    }
    if (item.userbind) {
      _par.userbind = item.userbind
    }
    if (item.apptype) {
      _par.apptype = item.apptype
    }
    if (item.topHeight) {
      _par.topHeight = item.topHeight
    }
    if (item.typename === 'pad') {
      _par.direction = item.direction || 'vertical'
    }
    if (item.typename !== 'pc') {
      _par.statusBarColor = item.statusBarColor || 'black'
      _par.delay = item.delay || 0
    }
    if (item.adapter) {
      _par.adapter = item.adapter
    }
    if (item.share) {
      _par.share = item.share
    }
    if (item.share_des) {
      _par.share_des = item.share_des
    }
    if (item.share_url) {
      _par.share_url = item.share_url
    }
    if (item.share_link) {
      _par.share_link = item.share_link
    }
    if (item.wxAppId) {
      _par.wxAppId = item.wxAppId
      _par.wxAppName = item.wxAppName || item.wxAppId
    }
    if (item.wxMerchId) {
      _par.wxMerchId = item.wxMerchId
      _par.wxMerchName = item.wxMerchName || item.wxMerchId
    }

    return _par
  }

  submitSubCard = () => {
    const { selectApp, subVisible, selectSubApp } = this.state

@@ -952,7 +1060,7 @@
      let param = {
        func: 's_kei_addupt',
        ID: selectApp.ID,
        exec_type: 'y',
        exec_type: 'x',
        remark: selectApp.remark,
        kei_no: selectApp.kei_no,
        cus_param_type: 'A',
@@ -982,14 +1090,17 @@
      sublist = sublist.map(item => {
        if (item.typename !== 'pc') {
          item.userbind = md5(selectApp.kei_no + item.typename + item.lang).replace(/^.{8}/, 'userbind')
          item.instantMessage = md5(selectApp.kei_no + item.typename + item.lang).replace(/^.{14}/, 'instantmessage')
        }
        return item
      })

      param.LText = sublist.map(item => `select '${item.ID}','${item.typename}','${selectApp.ID}','${sessionStorage.getItem('CloudUserID') || ''}','${window.GLOB.appkey || ''}','false','false','${item.role_type || 'true'}','${item.lang || 'zh-CN'}','${item.css || ''}','${item.title || ''}','${item.favicon || ''}','${item.user_binding || 'false'}','','${window.btoa(window.encodeURIComponent(JSON.stringify({userbind: item.userbind || '', instantMessage: item.instantMessage || '', apptype: item.apptype || '', delay: item.delay || 0, statusBarColor: item.statusBarColor || 'black', sysBgColor: item.sysBgColor || '#ffffff', adapter: item.adapter || ''})))}'`)
      param.LText = sublist.map(item => {
        let _par = this.getCusParam(item)

        return `select '${item.ID}','${item.typename}','${selectApp.ID}','${sessionStorage.getItem('CloudUserID') || ''}','${window.GLOB.appkey || ''}','false','false','${item.role_type || 'true'}','${item.lang || 'zh-CN'}','${item.css || ''}','${item.title || ''}','${item.favicon || ''}','${item.user_binding || 'false'}','','${window.btoa(window.encodeURIComponent(JSON.stringify(_par)))}','${item.app_name || selectApp.remark || ''}','${item.app_icon || ''}','${item.allow_subscribe || ''}','${item.link_remark || ''}'`
      })
      param.LText = param.LText.join(' union all ')
      param.LText = Utils.formatOptions(param.LText)
      param.LText = Utils.formatOptions(param.LText, 'x')

      Api.getCloudConfig(param).then(result => {
        if (result.status) {
@@ -1024,216 +1135,265 @@
    })
  }

  updateLink = (item) => {
    let link = `${window.GLOB.baseurl}${item.typename === 'pad' ? 'mob' : item.typename}/index.html#/index/${this.state.selectApp.kei_no}/${item.typename !== 'pc' ? item.typename + '/' : ''}${item.lang}`

    let param = {
      func: 's_miniapp_kei_linkurl_upt',
      id: item.ID,
      linkurl: link
    }

    confirm({
      content: '确定更新应用链接地址吗？',
      onOk() {
        return new Promise(resolve => {
          Api.getCloudConfig(param).then(result => {
            if (result.status) {
              notification.success({
                top: 92,
                message: '操作成功！',
                duration: 3
              })
            } else {
              notification.warning({
                top: 92,
                message: result.message,
                duration: 5
              })
            }
            resolve()
          }, () => {
            resolve()
          })
        })
      },
      onCancel() {}
    })
  }

  render () {
    const { loading, visible, subVisible, columns, transcolumns, applist, translist, transVisible, selectApp, selectTran, selectSubApp, scriptVisible, scriptlist, scriptcolumns, selectScriptKeys } = this.state

    return (
      <div className="mk-app-manage">
        <ConfigProvider locale={_locale}>
          <Header view="manage" />
          {loading ?
            <div className="loading-mask">
              <Spin size="large" />
            </div> : null
          }
          <div className="view-wrap">
            <div className="left-view">
              <div className="app-table">
                <div className="app-action">
                  <Button className="mk-green" onClick={() => this.setState({ visible: 'plus' })}>添加应用</Button>
                </div>
                <Table
                  rowKey="ID"
                  columns={columns}
                  dataSource={applist}
                  pagination={false}
                  rowSelection={{ type: 'radio', selectedRowKeys: selectApp ? [selectApp.ID] : [], onChange: this.onSelectChange }}
                  onRow={(record) => ({ onClick: () => this.setState({ selectApp: record })})}
                />
        <Header view="manage" />
        {loading ?
          <div className="loading-mask">
            <Spin size="large" />
          </div> : null
        }
        <div className="view-wrap">
          <div className="left-view">
            <div className="app-table">
              <div className="app-action">
                <Button className="mk-green" onClick={() => this.setState({ visible: 'plus' })}>添加应用</Button>
              </div>
              <div className={'trans-table' + (this.state.transTotal <= 10 ? ' no-footer' : '')}>
                <div className="app-action">
                  <Button className="mk-green" onClick={() => this.setState({ transVisible: 'plus' })}>添加传输号</Button>
                  <Search placeholder="综合搜索" onSearch={value => this.tranSearch(value)} enterButton />
                </div>
                <Table
                  rowKey="ID"
                  columns={transcolumns}
                  dataSource={translist}
                  pagination={{
                    current: this.state.transIndex,
                    pageSize: 10,
                    total: this.state.transTotal || 0,
                    showTotal: (total, range) => `${range[0]}-${range[1]} 共 ${total} 条`
                  }}
                  rowSelection={{ type: 'radio', selectedRowKeys: selectTran ? [selectTran.ID] : [], onChange: this.onTransChange }}
                  onRow={(record) => ({ onClick: () => {
                    if (this.forbid) {
                      this.forbid = false
                      return
                    }
                    this.onTransSelect(record)
                  }})}
                  onChange={this.changeTable}
                />
              <Table
                rowKey="ID"
                columns={columns}
                dataSource={applist}
                pagination={false}
                rowSelection={{ type: 'radio', selectedRowKeys: selectApp ? [selectApp.ID] : [], onChange: this.onSelectChange }}
                onRow={(record) => ({ onClick: () => this.setState({ selectApp: record })})}
              />
            </div>
            <div className={'trans-table' + (this.state.transTotal <= 10 ? ' no-footer' : '')}>
              <div className="app-action">
                <Button className="mk-green" onClick={() => this.setState({ transVisible: 'plus' })}>添加传输号</Button>
                <Search placeholder="综合搜索" onSearch={value => this.tranSearch(value)} enterButton />
              </div>
              {selectTran ? <div className="script-table">
                <div className="app-action">
                  <Button className="mk-green" onClick={() => this.setState({ scriptVisible: true })}>添加脚本</Button>
                  <Button className="mk-danger" onClick={this.deleteScripts} style={{marginLeft: '15px'}}>删除</Button>
                  <Search placeholder="综合搜索" defaultValue={this.state.scriptSearchKey} onSearch={value => this.scriptSearch(value)} enterButton />
                </div>
                <Table
                  rowKey="ID"
                  columns={scriptcolumns}
                  dataSource={scriptlist}
                  pagination={{
                    current: this.state.scriptIndex,
                    pageSize: 10,
                    total: this.state.scriptTotal || 0,
                    showTotal: (total, range) => `${range[0]}-${range[1]} 共 ${total} 条`
                  }}
                  rowSelection={{ type: 'checkbox', selectedRowKeys: selectScriptKeys, onChange: this.onScriptChange }}
                  onRow={(record) => ({ onClick: () => this.onScriptSelect(record)})}
                  onChange={this.changeScriptTable}
                />
              </div> : null}
              <Table
                rowKey="ID"
                columns={transcolumns}
                dataSource={translist}
                pagination={{
                  current: this.state.transIndex,
                  pageSize: 10,
                  total: this.state.transTotal || 0,
                  showTotal: (total, range) => `${range[0]}-${range[1]} 共 ${total} 条`
                }}
                rowSelection={{ type: 'radio', selectedRowKeys: selectTran ? [selectTran.ID] : [], onChange: this.onTransChange }}
                onRow={(record) => ({ onClick: () => {
                  if (this.forbid) {
                    this.forbid = false
                    return
                  }
                  this.onTransSelect(record)
                }})}
                onChange={this.changeTable}
              />
            </div>
            <div className="right-view">
              {selectApp ? <div className="app-title">{selectApp.remark}</div> : null}
              {selectApp && selectApp.sublist.map((item, index) => {
                let css = skinStyle[item.css] ? skinStyle[item.css].name : ''
                let color = skinStyle[item.css] ? skinStyle[item.css].color : '#e8e8e8'
                let binding = ''
                if (item.user_binding === 'true') {
                  binding = '需要'
                }
                return (
                  <div className="sub-app" key={index} style={{borderColor: color}}>
                    <Row>
                      <Col span={12}>
                        <div className="app-item">
                          <div className="label">应用类型:</div>
                          <div className="content" style={{fontSize: '18px', fontWeight: 600}}>{item.typename}</div>
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          <div className="label">语言:</div>
                          <div className="content" style={{textDecoration: 'underline'}}>{item.lang === 'en-US' ? '英文' : '中文'}</div>
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          <div className="label">权限管理:</div>
                          <div className="content">{item.role_type === 'false' ? '不启用' : '启用'}</div>
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          {/* <div className="label">皮肤:</div>
                          <div className="content" style={{color: color}}>{css}</div> */}
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          <div className="label">皮肤:</div>
                          <div className="content" style={{color: color}}>{css}</div>
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          {binding ? <div className="label">
                            <Tooltip placement="topLeft" title="微信公众号登录时，系统用户与微信用户的绑定方式。">
                              <QuestionCircleOutlined className="mk-form-tip" />
                              用户绑定:
                            </Tooltip>
                          </div> : null}
                          <div className="content">{binding}</div>
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          <div className="label">标题:</div>
                          <div className="content">{item.title || '无'}</div>
                        </div>
                      </Col>
                      <Col span={12}>
                        <div className="app-item">
                          <div className="label">网站头像:</div>
                          <div className="content">{item.favicon ? <img style={{width: '18px', height: '18px'}} src={item.favicon} alt="" /> : '无'}</div>
                        </div>
                      </Col>
                    </Row>
                    <div className="action">
                      <Button type="link" onClick={() => this.jumpMenu(item)} style={{color: 'rgba(30, 228, 224, 1)'}}>菜单&权限</Button>
                      <Button type="link" onClick={() => this.setState({ selectSubApp: item, subVisible: 'edit' })} style={{color: '#8E44AD'}}>修改</Button>
                      <Button type="link" onClick={() => this.deleteSubApp(item)} style={{color: '#ff4d4f'}}>删除</Button>
                      <Button type="link" onClick={() => this.jumpApp(item)}>编辑应用</Button>
                      <Paragraph style={{display: 'inline-block', margin: 0}} copyable={{ text: `${base_url}${item.typename === 'pad' ? 'mob' : item.typename}/index.html#/index/${this.state.selectApp.kei_no}/${item.typename !== 'pc' ? item.typename + '/' : ''}${item.lang}` }}></Paragraph>
                    </div>
                  </div>
                )
              })}
            </div>
            {selectTran ? <div className="script-table">
              <div className="app-action">
                <Button className="mk-green" onClick={() => this.setState({ scriptVisible: true })}>添加脚本</Button>
                <Button className="mk-danger" onClick={this.deleteScripts} style={{marginLeft: '15px'}}>删除</Button>
                <Search placeholder="综合搜索" defaultValue={this.state.scriptSearchKey} onSearch={value => this.scriptSearch(value)} enterButton />
              </div>
              <Table
                rowKey="ID"
                columns={scriptcolumns}
                dataSource={scriptlist}
                pagination={{
                  current: this.state.scriptIndex,
                  pageSize: 10,
                  total: this.state.scriptTotal || 0,
                  showTotal: (total, range) => `${range[0]}-${range[1]} 共 ${total} 条`
                }}
                rowSelection={{ type: 'checkbox', selectedRowKeys: selectScriptKeys, onChange: this.onScriptChange }}
                onRow={(record) => ({ onClick: () => this.onScriptSelect(record)})}
                onChange={this.changeScriptTable}
              />
            </div> : null}
          </div>
          <Modal
            title={'编辑应用'}
            width={'600px'}
            maskClosable={false}
            visible={visible !== false}
            onCancel={() => this.setState({visible: false, confirmloading: false})}
            confirmLoading={this.state.confirmloading}
            onOk={this.submitCard}
            cancelText="取消"
            okText="确定"
            destroyOnClose
          >
            <MutilForm type={visible} card={visible === 'edit' ? selectApp : ''} wrappedComponentRef={(inst) => this.mobcardRef = inst} inputSubmit={this.submitCard} />
          </Modal>
          <Modal
            title={transVisible === 'plus' ? '添加传输号' : '编辑传输号'}
            width={'600px'}
            maskClosable={false}
            visible={transVisible !== false}
            onCancel={() => this.setState({transVisible: false, confirmloading: false})}
            confirmLoading={this.state.confirmloading}
            onOk={this.submitTrans}
            cancelText="取消"
            okText="确定"
            destroyOnClose
          >
            <TransForm type={transVisible} card={transVisible === 'edit' ? this.state.editTran : ''} wrappedComponentRef={(inst) => this.transRef = inst} inputSubmit={this.submitTrans} />
          </Modal>
          <Modal
            title={'添加脚本'}
            width={750}
            maskClosable={false}
            visible={scriptVisible}
            onCancel={() => this.setState({scriptVisible: false, confirmloading: false})}
            confirmLoading={this.state.confirmloading}
            onOk={this.submitScript}
            cancelText="取消"
            okText="确定"
            destroyOnClose
          >
            <ScriptForm applist={applist} wrappedComponentRef={(inst) => this.scriptRef = inst} inputSubmit={this.submitScript} />
          </Modal>
          <Modal
            title={'编辑子应用'}
            width={'850px'}
            maskClosable={false}
            visible={subVisible !== false}
            onCancel={() => this.setState({subVisible: false, confirmloading: false})}
            confirmLoading={this.state.confirmloading}
            onOk={this.submitSubCard}
            cancelText="取消"
            okText="确定"
            destroyOnClose
          >
            <SubMutilForm type={subVisible} card={subVisible === 'edit' ? selectSubApp : ''} wrappedComponentRef={(inst) => this.submobcardRef = inst} inputSubmit={this.submitSubCard} />
          </Modal>
        </ConfigProvider>
          <div className="right-view">
            {selectApp ? <div className="app-title">{selectApp.remark}</div> : null}
            {selectApp && selectApp.sublist.map((item, index) => {
              let css = skinStyle[item.css] ? skinStyle[item.css].name : ''
              let color = skinStyle[item.css] ? skinStyle[item.css].color : '#e8e8e8'
              let binding = ''
              if (item.user_binding === 'true') {
                binding = '用户绑定'
              }
              if (item.share === 'true') {
                binding = binding ? binding + '、分享' : '分享'
              }

              return (
                <div className="sub-app" key={index} style={{borderColor: color}}>
                  <Row>
                    <Col span={12}>
                      <div className="app-item">
                        <div className="label">应用类型:</div>
                        <div className="content" style={{fontSize: '18px', fontWeight: 600}}>{item.typename}</div>
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        <div className="label">语言:</div>
                        <div className="content" style={{textDecoration: 'underline'}}>{langs[item.lang]}</div>
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        <div className="label">权限管理:</div>
                        <div className="content">{item.role_type === 'false' ? '不启用' : '启用'}</div>
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        {item.wxAppName || item.wxMerchName ? <>
                          <div className="label">关联应用:</div>
                          <div className="content">{`${item.wxAppName}${item.wxAppName && item.wxMerchName ? ' / ' + item.wxMerchName : item.wxMerchName || ''}`}</div>
                        </> : null}
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        <div className="label">皮肤:</div>
                        <div className="content" style={{color: color}}>{css}</div>
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        {/* {binding ? <div className="label">
                          <Tooltip placement="topLeft" title="微信公众号登录时，系统用户与微信用户的绑定方式。">
                            <QuestionCircleOutlined className="mk-form-tip" />
                            用户绑定:
                          </Tooltip>
                        </div> : null} */}
                        {binding ? <div className="label">
                          <Tooltip placement="topLeft" title="微信公众号或小程序中，绑定系统用户、自定义分享等功能。">
                            <QuestionCircleOutlined className="mk-form-tip" />
                            扩展功能:
                          </Tooltip>
                        </div> : null}
                        <div className="content">{binding}</div>
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        <div className="label">应用名称:</div>
                        <div className="content">{item.app_name || ''}</div>
                      </div>
                    </Col>
                    <Col span={12}>
                      <div className="app-item">
                        <div className="label">LOGO:</div>
                        <div className="content">{item.app_icon ? <img style={{width: '18px', height: '18px', borderRadius: '4px'}} src={item.app_icon} alt="" /> : '无'}</div>
                      </div>
                    </Col>
                  </Row>
                  <div className="action">
                    {item.lang !== 'zh-CN' ? <TransMenu app={item} supApp={selectApp} /> : null}
                    <Button type="link" onClick={() => this.jumpMenu(item)} style={{color: 'rgba(30, 228, 224, 1)'}}>菜单&权限</Button>
                    <Button type="link" onClick={() => this.setState({ selectSubApp: item, subVisible: 'edit' })} style={{color: '#8E44AD'}}>修改</Button>
                    <Button type="link" onClick={() => this.deleteSubApp(item)} style={{color: '#ff4d4f'}}>删除</Button>
                    <Button type="link" onClick={() => this.jumpApp(item)}>编辑应用</Button>
                    <Button type="link" onClick={() => this.updateLink(item)}><LinkOutlined style={{color: 'orange'}}/></Button>
                    <Paragraph style={{display: 'inline-block', margin: 0}} copyable={{ text: `${window.GLOB.baseurl}${item.typename === 'pad' ? 'mob' : item.typename}/index.html#/index/${this.state.selectApp.kei_no}/${item.typename !== 'pc' ? item.typename + '/' : ''}${item.lang}${item.wxAppId ? '/' + item.wxAppId : ''}` }}></Paragraph>
                  </div>
                </div>
              )
            })}
          </div>
        </div>
        <Modal
          title={'编辑应用'}
          width={'600px'}
          maskClosable={false}
          visible={visible !== false}
          onCancel={() => this.setState({visible: false, confirmloading: false})}
          confirmLoading={this.state.confirmloading}
          onOk={this.submitCard}
          cancelText="取消"
          okText="确定"
          destroyOnClose
        >
          <MutilForm type={visible} card={visible === 'edit' ? selectApp : ''} wrappedComponentRef={(inst) => this.mobcardRef = inst} inputSubmit={this.submitCard} />
        </Modal>
        <Modal
          title={transVisible === 'plus' ? '添加传输号' : '编辑传输号'}
          width={'600px'}
          maskClosable={false}
          visible={transVisible !== false}
          onCancel={() => this.setState({transVisible: false, confirmloading: false})}
          confirmLoading={this.state.confirmloading}
          onOk={this.submitTrans}
          cancelText="取消"
          okText="确定"
          destroyOnClose
        >
          <TransForm type={transVisible} card={transVisible === 'edit' ? this.state.editTran : ''} wrappedComponentRef={(inst) => this.transRef = inst} inputSubmit={this.submitTrans} />
        </Modal>
        <Modal
          title={'添加脚本'}
          width={900}
          maskClosable={false}
          visible={scriptVisible}
          onCancel={() => this.setState({scriptVisible: false, confirmloading: false})}
          confirmLoading={this.state.confirmloading}
          onOk={this.submitScript}
          cancelText="取消"
          okText="确定"
          destroyOnClose
        >
          <ScriptForm applist={applist} wrappedComponentRef={(inst) => this.scriptRef = inst} inputSubmit={this.submitScript} />
        </Modal>
        <Modal
          title={subVisible === 'plus' ? '添加子应用' : '编辑子应用'}
          width={'970px'}
          maskClosable={false}
          visible={subVisible !== false}
          onCancel={() => this.setState({subVisible: false, confirmloading: false})}
          confirmLoading={this.state.confirmloading}
          onOk={this.submitSubCard}
          cancelText="取消"
          okText="确定"
          destroyOnClose
        >
          <SubMutilForm type={subVisible} selectApp={selectApp} card={subVisible === 'edit' ? selectSubApp : ''} wrappedComponentRef={(inst) => this.submobcardRef = inst} inputSubmit={this.submitSubCard} />
        </Modal>
      </div>
    )
  }