基层医生会话布局

src/routes/ChatBase/ChatBaseView.js

@@ -0,0 +1,95 @@
+import React from 'react'
+import DefaultAvatar from './assets/img-defaultAvatar.png'
+import Logo from './assets/img-logo.png'
+import Thumb from './assets/img-thumb.jpg'
+import Detail from './assets/img-xunzhen-detail.jpg'
+import {Grid, Row, Col, Image, FormGroup, InputGroup, FormControl, Glyphicon, Button, Table, ControlLabel, Form} from 'react-bootstrap'
+import classes from './ChatBaseView.css'
+
+export const ChatBaseView = () => (
+    <div>
+        <div className="home-top clearfix">
+            <div className="left">
+                <Image src={Logo} responsive></Image>
+            </div>
+            <div className="right">
+                南方医务通医生工作台
+            </div>
+        </div>
+
+        <div className="home-body clearfix">
+            <div className="left">
+                <div className="avatarbox">
+                    <Image className="avatar" src={DefaultAvatar} rounded responsive/>
+                    <div className="name">李秋豪</div>
+                </div>
+                <div className="col-lg-12 list">
+                    <ul className="parent">
+                        <li><a href="/message"><span className="icon icon-message"></span><span className="text-message">消息&nbsp;&nbsp;2</span></a></li>
+                        <li><a href="/home"><span className="icon icon-home"></span><span>首页</span></a></li>
+                        <ul className="childList">
+                            <li className="active"><a href="#">专家询诊</a></li>
+                            <li><a href="#">双向转诊</a></li>
+                            <li><a href="#">名医主诊</a></li>
+                            <li><a href="#">名医主诊</a></li>
+                        </ul>
+                        <li><a href="#"><span className="icon icon-patient"></span><span>我的患者</span></a></li>
+                        <li><a href="#"><span className="icon icon-doctor"></span><span>我的关联医生</span></a></li>
+                        <li><a href="#"><span className="icon icon-expert"></span><span>平台所有医生</span></a></li>
+                    </ul>
+                </div>
+            </div>
+            <div className="right" style={{overflow: "auto"}}>
+                <div className="body">
+                    <div className="head">
+                        <ul className="clearfix">
+                            <li className="col-lg-4 col-md-4 col-xs-4"><a href="/findpatient">找患者</a></li>
+                            <li className="col-lg-4 col-md-4 col-xs-4 active" ><a href="/myorders">我的订单</a></li>
+                            <li className="col-lg-4 col-md-4 col-xs-4"><a href="/expert">专家询诊流程</a></li>
+                        </ul>
+                    </div>
+                    <div className="chatbox">
+                        <div className="chat-header">
+                            <div className="doctorName">王瀚哲医生</div>
+                            <Button bsSize="xsmall" className="btn-endTalk">结束会话</Button>
+                        </div>
+                        <div className="chat-title">本次会话，是关于患者王帆的病情讨论！</div>
+                        <div className="chat-body">
+                            <div className="time">11:00</div>
+                            <div className="clearfix">
+                                <div className="receive-bubble">我这有位心肌缺血患者，需要您指导治疗，病史、检查报告如下。</div>
+                            </div>
+                            <div className="clearfix">
+                                <div className="receive-bubble receive-img">
+                                    <a href="#"><img src={Thumb} alt=""/></a>
+                                </div>
+                            </div>
+                            <div className="clearfix">
+                                <div className="send-bubble">好的，我先看看！</div>
+                            </div>
+                            <div className="clearfix">
+                                <div className="send-bubble send-img">
+                                    <a href="#"><img src={Thumb} alt=""/></a>
+                                </div>
+                            </div>
+                            <div className="clearfix">
+                                <div className="receive-bubble">
+                                    好的，我先看看！
+                                </div>
+                            </div>
+                        </div>
+                        <div className="chat-footer clearfix">
+                            <div className="toolbox">
+                                <Button style={{border: 0}}><Glyphicon glyph="picture" /></Button>
+                            </div>
+                            <textarea className="messagebox"></textarea>
+                            <Button className="btn-send pull-right" bsStyle="primary">发送</Button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+)
+
+export default ChatBaseView

src/routes/ChatBase/index.js

@@ -0,0 +1,7 @@
+import ChatBaseView from './ChatBaseView'
+
+
+export default {
+    path: 'chatbase',
+    component: ChatBaseView,
+}