2020-07-14

king

2020-07-14 f36141f3075edf9d41928d64f759ad6bd1b1ac60

 src/mob/components/login/mob-login-2/index.jsx

@@ -2,6 +2,7 @@
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { InputItem, Button } from 'antd-mobile'
import { Icon } from 'antd'

import zhCN from '@/locales/zh-CN/mob.js'
import enUS from '@/locales/en-US/mob.js'
@@ -31,8 +32,15 @@
      login: { uuid: Utils.getuuid(), eleType: 'button', content: '登录', style: {fontSize: '16px', color: '#ffffff', textAlign: 'center', lineHeight: 2.4, backgroundColor: '#44a8f2'}},
      phone: { uuid: Utils.getuuid(), eleType: 'button', content: '手机短信登录/注册', style: {fontSize: '16px', color: '#44a8f2', textAlign: 'center', lineHeight: 2.4, border: '1px solid #44a8f2'}},
      lose: { uuid: Utils.getuuid(), eleType: 'text', content: '忘记密码？', style: {fontSize: '12px', color: '#44a8f2', textAlign: 'right', textDecoration: 'underline'}},
      register: { uuid: Utils.getuuid(), eleType: 'text', content: '注册明科账号', style: {fontSize: '16px', color: '#44a8f2', textAlign: 'center', marginTop: '20px', marginBottom: '30px'}},
      copyright: { uuid: Utils.getuuid(), eleType: 'textarea', content: 'Copyright©2017  所有相关版权归  北京明科普华信息技术有限公司', style: {fontSize: '12px', textAlign: 'center'} }
      register: { uuid: Utils.getuuid(), eleType: 'text', subItems: [
        {type: 'qq', icon: 'qq', label: 'QQ'},
        {type: 'wechat', icon: 'wechat', label: '微信'},
      ], content: '其他登录方式', style: {fontSize: '14px', color: '#bcbcbc', textAlign: 'center', marginTop: '30px', marginBottom: '20px'}},
      copyright: { uuid: Utils.getuuid(), eleType: 'textarea', content: 'Copyright©2017  所有相关版权归  北京明科普华信息技术有限公司', style: {fontSize: '12px', textAlign: 'center'} },
      links: { uuid: Utils.getuuid(), eleType: 'link', substyle: false, subItems: [
        {eleType: 'link', content: '隐私政策', url: '', uuid: Utils.getuuid()},
        {eleType: 'link', content: '使用条款', url: '', uuid: Utils.getuuid()},
      ], style: {fontSize: '12px', textAlign: 'center', color: '#44a8f2', textDecoration: 'underline'} }
    }
  }

@@ -79,6 +87,19 @@
      ...fromJS(card.copyright.style).toJS(),
      componentId: card.uuid,
      uuid: card.copyright.uuid,
      items: ['font'],
    }
    this.props.triggerEdit(element)
  }
  
  editLinks = (e, item) => {
    const { card } = this.props
    e.stopPropagation()
    let element = {
      ...fromJS(card.links.style).toJS(),
      componentId: card.uuid,
      classId: card.links.uuid,
      uuid: item.uuid,
      items: ['font'],
    }
    this.props.triggerEdit(element)
@@ -132,7 +153,39 @@
    this.props.triggerEdit(element)
  }

  linkItemAdd = (e) => {
    let card = fromJS(this.props.card).toJS()
    e.stopPropagation()

    card.links.subItems.push({
      eleType: 'link',
      content: 'link',
      url: '',
      uuid: Utils.getuuid()
    })

    this.props.updateConfig(card)
  }

  updateContent = (card) => {
    this.props.updateConfig(card)
  }

  updateLinkItem = (val, item) => {
    let card = fromJS(this.props.card).toJS()

    if (!val) {
      card.links.subItems = card.links.subItems.filter(cell => cell.uuid !== item.uuid)
    } else {
      card.links.subItems = card.links.subItems.map(cell => {
        if (cell.uuid === item.uuid) {
          return val
        } else {
          return cell
        }
      })
    }

    this.props.updateConfig(card)
  }

@@ -155,7 +208,7 @@
    if (view === 'account') return (
      <div className="mob-login-2" onClick={this.editBox} style={card.box.style}>
        <div className="mob-login-body">
          {card.title ? <div className={'plat-name ' + (editId === card.title.uuid ? 'editing' : '')} style={card.title.style} onClick={this.editTitle}>
          {card.title ? <div className={'plat-name ' + (editId === card.title.uuid ? 'editing' : '')} style={titleStyle} onClick={this.editTitle}>
            <ContentUpdate element={card.title} updateContent={(ele) => this.updateContent({...card, title: ele})}/>
            {card.title.content}
          </div> : null}
@@ -183,7 +236,7 @@
            style={card.phone.style}
            onClick={(e) => this.editLogin(e, 'phone')}
          >
            <ContentUpdate element={card.phone} deletable={false} updateContent={(ele) => this.updateContent({...card, phone: ele})}/>
            <ContentUpdate element={card.phone} updateContent={(ele) => this.updateContent({...card, phone: ele})}/>
            {card.phone.content}
          </Button>
          {card.lose ? <div className={'plat-name ' + (editId === card.lose.uuid ? 'editing' : '')} style={card.lose.style} onClick={this.editLose}>
@@ -194,11 +247,28 @@
            <ContentUpdate element={card.register} updateContent={(ele) => this.updateContent({...card, register: ele})}/>
            {card.register.content}
          </div> : null}
          {card.register ? <div className="other-register">
            {card.register.subItems.map(cell => (
              <span key={cell.type}>
                <Icon type={cell.icon} />
                <p>{cell.label}</p>
              </span>
            ))}
          </div> : null}
        </div>
        {card.copyright ? <div className={'company-msg ' + (editId === card.copyright.uuid ? 'editing' : '')} style={card.copyright.style} onClick={this.editMsg}>
          <ContentUpdate element={card.copyright} updateContent={(ele) => this.updateContent({...card, copyright: ele})}/>
          {card.copyright.content}
        </div> : null}
        {card.links ? <div className="links" style={card.links.style}>
          {card.links.subItems.map(item => (
            <span className={(editId === item.uuid ? 'editing' : '')} key={item.uuid} onClick={(e) => this.editLinks(e, item)}>
              <ContentUpdate element={item} updateContent={(val) => this.updateLinkItem(val, item)}/>
              {item.content}
            </span>
          ))}
          <Icon type="plus" onClick={this.linkItemAdd} />
        </div> : null}
      </div>
    )
  }