| | |
| | | this.temp = ''; |
| | | this.otherOptionInput = ''; |
| | | |
| | | this.answer = {}; |
| | | this.answer = { |
| | | radio: { |
| | | optionIndex: "0", |
| | | optionValue: "大于10小于50" |
| | | } |
| | | }; |
| | | } |
| | | |
| | | // static defaultProps = { |
| | |
| | | answer, |
| | | warnFlag |
| | | } = editor; |
| | | this.answer = answer ? JSON.parse(JSON.stringify(answer)) : {}; |
| | | this.otherOptionValue = answer ? this.answer[type].otherOptionValue : []; |
| | | |
| | | console.log(this.answer) |
| | | // this.answer = answer ? JSON.parse(JSON.stringify(answer)) : {}; |
| | | // this.otherOptionValue = answer ? this.answer[type].otherOptionValue : []; |
| | | /* |
| | | * |
| | | * 以下元素为编辑状态下的元素 |
| | |
| | | <span>{otherOptionBackwards}</span> |
| | | </div> |
| | | ) : ( |
| | | data |
| | | )} |
| | | data |
| | | )} |
| | | </span> |
| | | </label> |
| | | ); |
| | |
| | | <span>{otherOptionBackwards}</span> |
| | | </div> |
| | | ) : ( |
| | | data |
| | | )} |
| | | data |
| | | )} |
| | | </span> |
| | | </label> |
| | | ); |
| | |
| | | type === 'dropdown' |
| | | ? subDropdownEl |
| | | : type === 'radio' |
| | | ? subRadioEl |
| | | : subCheckboxEl; |
| | | ? subRadioEl |
| | | : subCheckboxEl; |
| | | //填写状态下的单行文本、多行文本 |
| | | const subTextEl = ( |
| | | <input |
| | |
| | | </div> |
| | | </ShakeTransition> |
| | | ) : ( |
| | | <div |
| | | className="questionnair-subject" |
| | | style={{ |
| | | background: drag ? '' : hover ? '#F5F5F5' : '#fff', |
| | | borderTopColor: drag && index === 0 ? '#dbdbdb' : '', |
| | | borderBottomColor: drag ? '#dbdbdb' : '', |
| | | cursor: acitveAnswer ? '' : 'move', |
| | | display: 'flex', |
| | | justifyContent: 'center' |
| | | }} |
| | | onMouseEnter={this.mouseEnter} |
| | | onMouseLeave={this.mouseLeave} |
| | | > |
| | | <div |
| | | className="questionnair-subject-inner" |
| | | style={{ margin: acitveAnswer ? '' : '0 auto' }} |
| | | className="questionnair-subject" |
| | | style={{ |
| | | background: drag ? '' : hover ? '#F5F5F5' : '#fff', |
| | | borderTopColor: drag && index === 0 ? '#dbdbdb' : '', |
| | | borderBottomColor: drag ? '#dbdbdb' : '', |
| | | cursor: acitveAnswer ? '' : 'move', |
| | | display: 'flex', |
| | | justifyContent: 'center' |
| | | }} |
| | | onMouseEnter={this.mouseEnter} |
| | | onMouseLeave={this.mouseLeave} |
| | | > |
| | | <div className="subject-row"> |
| | | <span>{index + 1}.</span> |
| | | {'input' === type ? subCompletionEl : <span>{title}</span>} |
| | | {required == 'true' && ( |
| | | <span className="subject-title-require">*</span> |
| | | )} |
| | | |
| | | {type == 'checkbox' && <span>(多选题)</span>} |
| | | {type == 'radio' && <span>(单选题)</span>} |
| | | </div> |
| | | {remark && ( |
| | | <div className="subject-row subject-remarks">{remarkText}</div> |
| | | )} |
| | | <div className="subject-row"> |
| | | {['radio', 'dropdown', 'checkbox'].includes(type) && optionsEl} |
| | | {type === 'text' && subTextEl} |
| | | {type === 'textarea' && subTextareaEl} |
| | | </div> |
| | | </div> |
| | | {!acitveAnswer && ( |
| | | <div |
| | | className="subject-control-mask" |
| | | style={{ |
| | | background: |
| | | curMoveItem === index ? 'rgba(245,245,245,0.3)' : '' |
| | | }} |
| | | ></div> |
| | | )} |
| | | <div |
| | | className="subject-control-bar" |
| | | style={{ transform: drag ? '' : hover ? 'translateX(0)' : '' }} |
| | | > |
| | | <div className="control-bar-inner"> |
| | | <div className="control-bar-button" onClick={this.edit}> |
| | | <i className="iconfont icon-grey_bianji"></i> |
| | | className="questionnair-subject-inner" |
| | | style={{ margin: acitveAnswer ? '' : '0 auto' }} |
| | | > |
| | | <div className="subject-row"> |
| | | <span>{index + 1}.</span> |
| | | {'input' === type ? subCompletionEl : <span>{title}</span>} |
| | | {required == 'true' && ( |
| | | <span className="subject-title-require">*</span> |
| | | )} |
| | | |
| | | {type == 'checkbox' && <span>(多选题)</span>} |
| | | {type == 'radio' && <span>(单选题)</span>} |
| | | </div> |
| | | <div className="control-bar-button" onClick={this.copy}> |
| | | <i className="iconfont icon-grey_fuzhi"></i> |
| | | {remark && ( |
| | | <div className="subject-row subject-remarks">{remarkText}</div> |
| | | )} |
| | | <div className="subject-row"> |
| | | {['radio', 'dropdown', 'checkbox'].includes(type) && optionsEl} |
| | | {type === 'text' && subTextEl} |
| | | {type === 'textarea' && subTextareaEl} |
| | | </div> |
| | | <div className="control-bar-button" onClick={this.remove}> |
| | | <i className="iconfont icon-grey_shanchu"></i> |
| | | </div> |
| | | {!acitveAnswer && ( |
| | | <div |
| | | className="subject-control-mask" |
| | | style={{ |
| | | background: |
| | | curMoveItem === index ? 'rgba(245,245,245,0.3)' : '' |
| | | }} |
| | | ></div> |
| | | )} |
| | | <div |
| | | className="subject-control-bar" |
| | | style={{ transform: drag ? '' : hover ? 'translateX(0)' : '' }} |
| | | > |
| | | <div className="control-bar-inner"> |
| | | <div className="control-bar-button" onClick={this.edit}> |
| | | <i className="iconfont icon-grey_bianji"></i> |
| | | </div> |
| | | <div className="control-bar-button" onClick={this.copy}> |
| | | <i className="iconfont icon-grey_fuzhi"></i> |
| | | </div> |
| | | <div className="control-bar-button" onClick={this.remove}> |
| | | <i className="iconfont icon-grey_shanchu"></i> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | )} |
| | | )} |
| | | </div> |
| | | ); |
| | | } |