/** @jsx createElement */
import { createElement, Component, render } from 'rax';
import View from 'nuke-view';
import Text from 'nuke-text';
import Link from 'nuke-link';

window.__QAP__ = {};
window.__QAP__.package = {};
window.__QAP__.package.config = {};
window.__QAP__.package.config.WebRootPath = 'http://30.5.96.129:4000';

const App = class NukeDemoIndex extends Component {
  constructor() {
    super();
    this.state = {
      href: '//m.taobao.com',
    };
  }

  render() {
    return (
      <View>
        <View style={styles.st}>
          <Text style={styles.stText}>跳转到h5页面</Text>
        </View>
        <Link style={styles.linkItem} href={this.state.href}>
          <Text style={styles.linkItemText}>使用 link 标签跳转</Text>
        </Link>

        <View style={styles.st}>
          <Text style={styles.stText}>发邮件</Text>
        </View>
        <Link style={styles.linkItem} href="mailto:yichen.test@163.com">
          <Text style={styles.linkItemText}>link标签发邮件</Text>
        </Link>
        <View style={styles.st}>
          <Text style={styles.stText}>发短信</Text>
        </View>
        <Link style={styles.linkItem} href="sms:10086">
          <Text style={styles.linkItemText}>link标签发短信</Text>
        </Link>
        <Link style={styles.linkItem} href="sms:10086">
          <Text style={styles.linkItemText}>带body的短信</Text>
        </Link>
        <View style={styles.st}>
          <Text style={styles.stText}>打电话</Text>
        </View>
        <Link style={styles.linkItem} href="tel:10086">
          <Text style={styles.linkItemText}>link标签打电话</Text>
        </Link>
        <View style={styles.st}>
          <Text style={styles.stText}>h5降级 target _self </Text>
        </View>
        <Link style={styles.linkItem} href="qap:///docs/next.js">
          <Text style={styles.linkItemText}>qap点我当前窗口</Text>
        </Link>
        <View style={styles.st}>
          <Text style={styles.stText}>h5降级 target _blank </Text>
        </View>
        <Link
          style={styles.linkItem}
          href="qap://docs/next.js?a=ccc"
          target="_blank"
        >
          <Text style={styles.linkItemText}>qap点我去新窗口打开页面</Text>
        </Link>
      </View>
    );
  }
};
const styles = {
  linkItem: {},
  linkItemText: {
    fontSize: '36rem',
    color: '#EB7E10',
  },
  st: {
    marginBottom: '30rem',
    marginTop: '10rem',
    paddingTop: '10rem',
    paddingBottom: '10rem',
    paddingLeft: '20rem',
    backgroundColor: '#dddddd',
  },
  stText: {
    fontSize: '36rem',
  },
};
render(<App />);