king
2020-12-30 e003a8ee8843aa60b0b7135f413b2b99857acff9
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
import React, {Component} from 'react'
// import PropTypes from 'prop-types'
// import { is, fromJS } from 'immutable'
import { TabBar, Toast } from 'antd-mobile'
 
import Api from '@/api'
import '@/assets/css/style.css'
import './index.scss'
 
class NavBar1 extends Component {
  static propTpyes = {}
 
  state = {
    selectedTab: ''
  }
 
  UNSAFE_componentWillMount () {
    if (!this.props.location.state) {
      Api.getMockData({
        func: 'sPC_Get_LongParam',
        MenuID: this.props.match.params.viewId,
        TypeCharOne: 'mob'
      }).then((res) => {
        if (res.status) {
          let config = ''
  
          try {
            // config = JSON.parse(window.decodeURIComponent(window.atob(res.LongParam)))
            config = res.LongParam
          } catch {
            config = ''
          }
  
          if (!config) {
            Toast.fail('配置解析错误!', 3)
            return
          }
 
          let _config = config.components[0]
  
          if (_config && _config.sublist && _config.sublist[0]) {
            let _url = window.location.href.replace(/#(.*)/ig, '#/tabview/')
 
            _config.sublist = _config.sublist.map((item, index) => {
              item.url = _url + item.uuid
              item.index = index
 
              return item
            })
 
            this.setState({
              selectedTab: _config.sublist[0].field,
              config: _config
            })
            if (window.GLOB.systemType === 'ios' && window.webkit) {
              let options = _config.sublist.map(item => ({url: item.url}))
 
              window.webkit.messageHandlers.initContentFragments.postMessage(JSON.stringify(options))
              window.webkit.messageHandlers.clickNavigation.postMessage(0)
            } else if (window.GLOB.systemType === 'android' && window.android) {
              let options = _config.sublist.map(item => ({url: item.url}))
 
              window.android.initContentFragments(JSON.stringify(options))
              window.android.clickNavigation(0)
            }
          }
        } else {
          Toast.fail(res.message, 3)
        }
      })
    } else if (!this.props.location.state) {
      this.props.history.replace({pathname: `/loading/${this.props.match.params.viewId}`})
      return
    } else {
      let _config = this.props.location.state.config.components[0]
  
      if (_config.sublist && _config.sublist[0]) {
        this.setState({
          selectedTab: _config.sublist[0].field,
          config: _config
        })
      }
    }
  }
 
  // shouldComponentUpdate (nextProps, nextState) {
  //   return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
  // }
 
  changeTab = (item) => {
    this.setState({
      selectedTab: item.field
    })
    if (window.GLOB.systemType === 'ios' && window.webkit) {
      window.webkit.messageHandlers.clickNavigation.postMessage(item.index)
    } else if (window.GLOB.systemType === 'android' && window.android) {
      window.android.clickNavigation(item.index)
    }
  }
 
  render () {
    const { config, selectedTab } = this.state
 
    return (
      <div className="tab-bar-wrap">
        <TabBar
          unselectedTintColor="#949494"
          tintColor="#33A3F4"
          barTintColor="white"
        >
          {config && config.sublist.map(item => (
            <TabBar.Item
              title={item.label}
              key={item.field}
              icon={<i className={item.icon} />}
              selectedIcon={<i className={item.icon} />}
              selected={selectedTab === item.field}
              onPress={() => {this.changeTab(item)}}
            >
            </TabBar.Item>
          ))}
        </TabBar>
      </div>
    )
  }
}
 
export default NavBar1