import React, {Component} from 'react';
import {
  Text,
  View,
  TouchableOpacity,
  SafeAreaView,
  ScrollView,
  DeviceEventEmitter,
  StyleSheet,
} from 'react-native';
import {
  WhiteSpace,
  Modal,
  Switch,
  List,
  WingBlank,
} from '@ant-design/react-native';
import public_css from '../../source/css/public_css';
import {rightArrowIcon} from '../../source/icon/icon';
import {SvgXml} from 'react-native-svg';
import {ClearAll} from '../../data/storage';

export default class set extends Component {
  constructor(props) {
    super(props);
    this.props.navigation.dangerouslyGetParent().setOptions({
      tabBarVisible: false,
    });
    this.state = {
      noticeCheck: true,
    };
  }

  render() {
    return (
      <SafeAreaView style={public_css.body}>
        <ScrollView>
          <WhiteSpace />
          <WingBlank>
            <List>
              <List.Item
                style={styles.notice}
                extra={
                  <Switch
                    checked={this.state.noticeCheck}
                    onChange={() => this.noticeCheckChange()}
                  />
                }>
                <Text style={styles.noticeText}>推送通知</Text>
              </List.Item>
            </List>
          </WingBlank>
          <WhiteSpace />
          <WingBlank>
            <TouchableOpacity onPress={() => this.cleanCache()}>
              <View style={styles.cache}>
                <View style={styles.cacheView}>
                  <Text style={styles.cacheText}>清除缓存</Text>
                </View>
                <View>
                  <SvgXml height={18} xml={rightArrowIcon()} />
                </View>
              </View>
            </TouchableOpacity>
          </WingBlank>
          <WhiteSpace />
        </ScrollView>
      </SafeAreaView>
    );
  }

  // 推送通知切换
  noticeCheckChange = () => {
    this.setState({
      noticeCheck: !this.state.noticeCheck,
    });
  };

  // 清空缓存
  cleanCache = () => {
    Modal.alert('清除缓存', '是否确认要清除缓存！', [
      {
        text: '取消',
        onPress: () => console.log('cancel'),
        style: 'cancel',
      },
      {text: '确认', onPress: () => this.cleanAll()},
    ]);
  };

  // 清空本地缓存
  cleanAll = async () => {
    await ClearAll();
    DeviceEventEmitter.emit('updateCompany');
    this.props.route.params.refresh(false);
    this.props.navigation.goBack();
  };
}

const styles = StyleSheet.create({
  notice: {
    backgroundColor: '#F7F7F7',
  },
  noticeText: {
    color: '#393939',
    fontWeight: 'bold',
    fontSize: 15,
  },
  cache: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    height: 45,
    backgroundColor: '#F7F7F7',
  },
  cacheView: {
    marginLeft: 15,
  },
  cacheText: {
    color: '#393939',
    fontWeight: 'bold',
    fontSize: 15,
  },
});