Merge branch 'master' of http://223.93.170.82:10080/zhouna/preliminary into his/shaoyifu

# Conflicts:
#	config/index.js
#	package-lock.json

build/webpack.dev.conf.js

@@ -34,7 +34,7 @@ const devWebpackConfig = merge(baseWebpackConfig, {
     compress: true,
     // host: HOST || config.dev.host,
     // host: '192.168.3.6',
-    host: '192.168.1.108',
+    //host: '192.168.1.108',
     port: PORT || config.dev.port,
     open: config.dev.autoOpenBrowser,
     overlay: config.dev.errorOverlay

package.json

@@ -19,7 +19,7 @@
     "less-loader": "^4.1.0",
     "lib-flexible": "^0.3.2",
     "portal-vue": "^2.1.6",
-    "vant": "^2.2.0",
+    "vant": "^2.2.10",
     "vue": "^2.5.2",
     "vue-photo-preview": "^1.1.3",
     "vue-router": "^3.0.1",

src/common/OptionInp.vue

@@ -1,10 +1,11 @@
 <!-- 带输入框选项 -->
 <template>
   <div :class="['inpbox',{'check':item.select},{'exclu':exclu}]">
-    <span class="prefix" v-if="msg.prefix">{{msg.prefix}}</span>
+    <span class="prefix" v-if="msg.prefix" @click="focusInp">{{msg.prefix}}</span>
     <!-- <div class="inp" @click="preClick"> -->
-      <input :type="msg.type=='number'?'number':'text'" 
+      <input :type="msg.type=='number'?'number':'text'"
               :placeholder="msg.placeholder"
+              ref="inp"
               :style="{'width':!msg.prefix&&!msg.suffix?'90%':'33%'}"
               :disabled="exclu"
               :maxlength="msg.type=='number'?10:''"
@@ -15,7 +16,7 @@
               @focus="focus"
               @input="changeVal">
     <!-- </div> -->
-    <span class="suffix" v-if="msg.suffix">{{msg.suffix}}</span>
+    <span class="suffix" v-if="msg.suffix" @click="focusInp">{{msg.suffix}}</span>
   </div>
 </template>
 <script type="text/javascript">
@@ -37,11 +38,17 @@ import $ from 'jquery';
       this.select = this.item.select;
     },
     methods:{
+      focusInp(){
+        setTimeout(()=>{
+          this.$refs.inp.focus();
+        })
+
+      },
       changeVal(e){
         if(this.msg.type=='number'){//数字键盘
           this.txt = e.target.value=e.target.value.replace(/^\.$/,'')
         }
-        
+
         const newData = Object.assign({},this.part,{value:this.txt});
         this.$emit("updata",newData);
         this.$emit('handleInp',this.txt);
@@ -74,7 +81,7 @@ import $ from 'jquery';
         // const select = this.item.select;
         if(!this.select){//聚焦时自动选中该项
           this.$emit('handleSelec');
-        } 
+        }
       }
     },
     watch:{

src/common/PickTime.vue

@@ -4,7 +4,7 @@
     <p v-show="val" :class="['ptab',{'check':val != '请选择'}]" @click="showPicker">{{val}}</p>
     <p v-show="val != '请选择'" class="tip">点击可修改</p>
     <Picker ref="picker" :show="showTime" @comfirn="getTimeVal" @cancel="close" :picIndex="picIndex"/>
-  </div> 
+  </div>
 </template>
 <script type="text/javascript">
   import $ from 'jquery';
@@ -49,7 +49,9 @@
       item:{
         handler(newVal,oldVal){
           this.val = newVal.value|| '请选择';
-          if(!newVal.value){//没有值时复原时间组件中的index
+          //有初始值或者未选择时，重置index
+          const hasOrg =newVal.value==='1分钟'; //newVal.value.indexOf("分钟")>-1||newVal.value.indexOf("1")>-1||newVal.value.indexOf("0")>-1;
+          if(!newVal.value||hasOrg){//没有值时复原时间组件中的index
             this.$refs.picker.resetIndex();
           }
         },
@@ -81,4 +83,4 @@
       font-size: .24rem;
     }
   }
-</style>
+</style>

src/common/Picker.vue

@@ -6,6 +6,7 @@
           <van-picker
             :columns="columns"
             :visible-item-count='3'
+            :swipe-duration="100"
             @change="handlechange"
           />
           <div class="confBtn">
@@ -15,7 +16,7 @@
         </div>
       <div class="mask" @click="onCancel"></div>
       </div>
-  </portal> 
+  </portal>
 </template>
 <script type="text/javascript">
   import $ from 'jquery';
@@ -74,10 +75,12 @@
       },
       handlechange(picker, value, colum){//关掉提示
         this.showTip = false;
-        if(colum == 2){
-          this.columIndx[colum] = unit.lastIndexOf(value[colum]);
-        }else{
-          this.columIndx[colum] = num.lastIndexOf(value[colum]);
+        for(let i=0;i<3;i++){
+          if(i == 2){
+            this.columIndx[i] = unit.lastIndexOf(value[i]);
+          }else{
+            this.columIndx[i] = num.lastIndexOf(value[i]);
+          }
         }
       },
       resetIndex(){//清除时复原默认index
@@ -133,4 +136,4 @@
       z-index: 999;
     }
   }
-</style>
+</style>

src/common/UploadImg.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="img-wrap">
     <div class="box">
-      
+
       <ul class="upload-imgs">
         <li
           v-show="imgLen<6"
@@ -55,7 +55,7 @@ export default {
     this.$previewRefresh();//预览刷新
     /*if(isIos()){
       $('.upload').removeAttr("capture")
-    }else if(!isWX()){ 
+    }else if(!isWX()){
     // 微信端添加这个属性直接调拍照
     //安卓手机且非微信端添加相机属性，否则QQ浏览器打不开相机
       $('.upload').attr("capture","camera")
@@ -71,7 +71,7 @@ export default {
       const inp = this.$refs.inp;
       if(this.flag){
         inp.click();
-      } 
+      }
     },
     delImg(key) {
       let obj = this.imgs;
@@ -89,16 +89,16 @@ export default {
       let file = fileTag.files[0];
       const that = this;
       this.imgBase64(file, function (image, canvas) {
-        var maxSize = 4 * 1024; // 4M
+        var maxSize = 0.5 * 1024; // 0.5M
         var fileSize = file.size / 1024; //kb 图片大小
         var uploadSrc;
         var uploadFile;
-        if (fileSize > maxSize) { // 如果图片大小大于4m，进行压缩
-          uploadSrc = canvas.toDataURL(file.type, maxSize / fileSize);
-          uploadFile = that.dataURLtoFile(uploadSrc, file.name.split('.')[0]); // 转成file文件
+        if (fileSize > maxSize) { // 如果图片大小大于0.5M，进行压缩
+          uploadSrc = canvas.toDataURL(file.type, 0.1);
+          uploadFile = that.dataURLtoFile(uploadSrc, file.name); // 转成file文件
           // uploadFile = that.convertBase64UrlToBlob(uploadSrc); // 转成blob
         } else {
-          uploadSrc = image.src; 
+          uploadSrc = image.src;
           uploadFile = file;
         }
 

src/components/Detail.vue

@@ -2,17 +2,17 @@
   <div class="detail-wrap">
     <!-- <div v-for="(item,index) in datas"> -->
     <div v-for="(item,index) in checkDatas.questionMapping">
-      <p class="quest"><span v-show="item.required==1" style="color: red;">*</span>{{index + 1 +'.' + (item.description || item.name)}}</p>
+      <p class="quest"><img v-show="item.required==1" src="../images/ip.svg"/>{{index + 1 +'.' + (item.description || item.name)}}</p>
       <img class="questionImg" :src="item.url.replace('{imageUrlPrefix}',imgUrl)" v-if="item.url">
-      <Radio v-if="item.controlType==1" 
+      <Radio v-if="item.controlType==1"
             :item="item"
             :key="item.id"
             @updata="updataData"/>
-      <RadioSelect v-if="item.controlType==8" 
+      <RadioSelect v-if="item.controlType==8"
             :item="item"
             :key="item.id"
             @updata="updataData"/>
-      <CheckBox v-if="item.controlType==2" 
+      <CheckBox v-if="item.controlType==2"
             :item="item"
             :key="item.id"
             @updata="updataData"/>
@@ -36,7 +36,7 @@
           @updata="updataData($event,item)"
         ></MultiLineInput>
       </template>
-      <PickTime v-if="item.controlType == 9" 
+      <PickTime v-if="item.controlType == 9"
               @updata="updataData"
               :item="item"/>
     </div>
@@ -87,7 +87,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
                 if(detList[k].id==data.id){
                   detList.splice(k,1,data)
                 }
-              } 
+              }
               for(let n in detList){//给父级赋值
                 if(detList[n].value){
                   tempVal += detList[n].name.replace(patt,detList[n].value)+'，';
@@ -103,7 +103,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
               mapping.splice(i,1,data)
             }
           }
-          
+
         }
         // 实时更新清空样式
         if(data.value){
@@ -117,19 +117,19 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
           }
         }
         // 更新完成样式
-        let checkReq = this.checkReq();
+        /*let checkReq = this.checkReq();
         if(checkReq){
           this.$emit('checkReq',true)
         }else{
           this.$emit('checkReq',false)
-        }
+        }*/
       },
       saveData(){//存值
         this.checkDatas = Object.assign({},this.checkDatas,{select:1});
         const datas = this.checkDatas.questionMapping;
         const id = this.checkDatas.id;
         let chooseSymp = this.$store.state.symptom.choose;
-        
+
         let text = ""; //医生
         let textP = "";//患者
         let special = ""; //拼到主诉
@@ -158,7 +158,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
             }
           }
         }
-        
+
         let msg = this.checkDatas.name+ '，' + text;
         let msgP = (this.checkDatas.description || this.checkDatas.name)+ '，' + textP;
         let newMsg = "";
@@ -185,7 +185,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
           if(datas[i].controlType ==9){
             if(datas[i].pickIndex){
               datas[i].pickIndex = [];
-            } 
+            }
           }
           datas[i].value = "";
           datas[i].valueP = "";
@@ -215,7 +215,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
         }else{
           this.$store.commit('setDatas',{data:Object.assign({},this.checkDatas,{select:1}),pId:this.checkDatas.id,type:this.data.moduleType,ppId:this.data.ppId});
         }
-        
+
         this.$store.commit('setText',{text:msg,textP:msgP,pId:this.checkDatas.id,type:this.data.moduleType,flag:true,order:this.data.order,arrFlag:true,index:this.data.index});
       },
       check(){// 校验是否有已填项
@@ -240,7 +240,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
         }
         return false;
       },
-      checkReq(){// 校验必填项
+      /*checkReq(){// 校验必填项
         const datas = this.checkDatas.questionMapping;
         for(let k in datas){
           if(datas[k].required==1 && !datas[k].value){
@@ -248,7 +248,7 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
           }
         }
         return true;
-      }
+      }*/
     },
   }
 </script>
@@ -261,6 +261,11 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
     .quest{
       color:#colors[quest];
       margin-bottom: .2rem;
+      img{
+        width: 16px;
+        vertical-align: text-top;
+        margin-right: 4px;
+      }
     }
     .questionImg {
       width: 100%;

src/components/DetailBox.vue

@@ -5,11 +5,10 @@
       <div class="content detailBoxMain" ref="detailBox">
         <div class="tmpDom"></div>
         <div class="main">
-          <Detail :datas="privateData" 
+          <Detail :datas="privateData"
                   ref="detail"
                   :data="data"
-                  @check="changeCheck($event)"
-                  @checkReq="changeFins($event)"/>
+                  @check="changeCheck($event)"/>
         </div>
         <!-- <div class="foot" @click="complete">完成</div> -->
       </div>
@@ -23,10 +22,10 @@
       </div>
     </div>
     <!-- <div :class="['foot',{'noCheck':!checkF}]" @click="complete">完成</div> -->
-    <div style="position:absolute" :class="['foot',{'noCheck':!checkF || !reqFinish}]" @click="complete">完成</div>
-    <Toast :message="clearTxt" 
+    <div style="position:absolute" :class="['foot']" @click="complete">完成</div>
+    <Toast :message="clearTxt"
           :show="showToast"
-          @comfirn="comfirnDel" 
+          @comfirn="comfirnDel"
           @cancel="cancelDel"/>
   </portal>
 </template>
@@ -51,7 +50,7 @@
         tips:"（请完成病情预问诊可让医生提前了解病情）",
         checkF:false, //详情页有无已选项标识
         show:detailShow,
-        reqFinish:false,
+        //reqFinish:false,
         showPic:false
       }
     },
@@ -59,13 +58,13 @@
       this.$nextTick(()=>{
         // 校验是否有已填项，有--弹窗；无--return
         let hasCheck = this.$refs.detail.check();
-        let checkReq = this.$refs.detail.checkReq();
+        //let checkReq = this.$refs.detail.checkReq();
         if(hasCheck){
           this.checkF = true;
         }
-        if(checkReq && hasCheck){
+        /*if(checkReq && hasCheck){
           this.reqFinish = true;
-        }
+        }*/
         setTimeout(() => {
           let scroll = setScroll(BScroll,true,'.viewPrew')
           this.scroll = scroll
@@ -76,7 +75,7 @@
     methods:{
       onScroll(data) {
         this.$store.commit('setScroll', data)
-        document.activeElement.scrollIntoViewIfNeeded(true);        
+        document.activeElement.scrollIntoViewIfNeeded(true);
       },
       close(){
         // 有必填项但没值则将choose移除 8-19
@@ -96,31 +95,31 @@
             }
           }
         }
-        
+
         this.$store.commit('setDetail',{detail:{}})
       },
       complete(){
       //有选中内容才可以点完成#1919
         // if(this.checkF){
       //必填项都填完了才可以点完成
-        if(this.reqFinish && this.checkF){
+        //if(this.checkF){
           this.$refs.detail.saveData();
           this.$store.commit('setSearchShow', false);
-        }
+       // }
       },
       changeCheck(flag){//是否有选中项
         this.checkF = flag;
       },
-      changeFins(flag){//必填项是否都填了
+      /*changeFins(flag){//必填项是否都填了
         this.reqFinish = flag;
-      },
+      },*/
       handleClear(){//清空
         // 校验是否有已填项，有--弹窗；无--return
         if(this.checkF){
           this.showToast = true;
           $(".btscroll").css({'position':'fixed'})
           $(".foot").css({'position':'fixed'})
-        }  
+        }
       },
       cancelDel(){
         $(".btscroll").css({'position':'absolute'})
@@ -131,7 +130,7 @@
         this.$refs.detail.clearData();
         this.showToast = false;
         this.checkF = false;
-        this.reqFinish = false;
+        //this.reqFinish = false;
         // 让detail组件更新
         const type = this.data.moduleType;
         if(type == moduleCP['symp']){ //症状情况单独处理
@@ -140,7 +139,7 @@
           const data = read[id];
           this.$store.commit('setDetail',{detail:data,ppId:null,moduleType:moduleCP['symp']})
         }
-        
+
       },
     },
     components:{
@@ -184,7 +183,7 @@
     background: #fff;
     border-radius: .08rem .08rem 0 0;
     font-size: .3rem;
-    animation: wave .4s linear;
+    animation: wave .6s linear;
     height: 100%;
     overflow: hidden;
     .head{
@@ -256,9 +255,9 @@
     50% {top: 50%;}
     75% {top: 25%;}
     100% {top: 45px;}
-  } 
+  }
   @keyframes foo {
     0% {bottom:-1rem;}
     100% {bottom:0;}
   }
-</style>
+</style>

src/components/Login.vue

@@ -15,8 +15,8 @@
         <div class="slideType" v-if="show">
           <ul>
             <!-- <li @click="handleType('手机号',103)">手机号</li> -->
-            <li @click="handleType('身份证号',101)">身份证号</li>
             <li @click="handleType('病历号',102)">病历号</li>
+            <li @click="handleType('身份证号',101)">身份证号</li>
             <li @click="handleType('市民卡号',104)" style="border:0 none">市民卡号</li>
           </ul>
         </div>
@@ -46,7 +46,7 @@
       </div>
       <div :class="['btn',value&&patName?'btnClick':'btnDis']" @click="handleDepart">进入预问诊</div>
     </div>
-    <div class="tip">注：建议您可先输入病情情况，方便医生提前了解情况</div>
+    <!--<div class="tip">注：建议您可先输入病情情况，方便医生提前了解情况</div>-->
     <Submit v-if="submit" :showType="showType" :fail="failMsg" @showSubmit="showSubmit"></Submit>
     <Tiptoast
         :show="showTip"
@@ -111,7 +111,7 @@ export default {
     changeName() {
       document.activeElement.scrollIntoViewIfNeeded(true);
       const { patName } = this;
-      this.patName = patName.replace(/[0-9]*$/,'').replace(/[`~!@#$%^&)(*_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/im,'')
+      this.patName = patName.replace(/[`~!@#$%^&)(*_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/im,'')
     },
     changeVal() {
       document.activeElement.scrollIntoViewIfNeeded(true);

src/components/PathInfo.vue

@@ -31,7 +31,7 @@
             <p class="big">智能预问诊</p>
           </div>
           <div class="inner">
-            <p>该系统通过智能引导式问诊，帮助医生规范、全面的采集患者的症状、体征、病史等信息，从而实现诊疗流程的优化和配置。</p>
+            <p>请认真填写以下内容，以便就诊时医生可以更好的了解病情，感谢您的配合！</p>
             <button @click="getStart">开始</button>
           </div>
           <!-- <p v-if="type==3">您已完成过一次预问诊，是否再次录入</p> -->
@@ -195,7 +195,7 @@
           this.submit = false
           clearTimeout(timer)
         }, 2000);
-      }, 
+      },
     },
     components:{
       Submit
@@ -258,7 +258,7 @@
       white-space: nowrap;
       overflow-x: auto;
       padding:0 .15rem .15rem 0;
-      -webkit-overflow-scrolling: touch;  
+      -webkit-overflow-scrolling: touch;
       text-align: center;//隐藏儿童
     }
     .emery,.child{
@@ -315,4 +315,4 @@
       background-size: cover;
     }
   }
-</style>
+</style>

src/components/Search.vue

@@ -45,7 +45,7 @@
 <script>
 import api from '@utils/api.js';
 export default {
-  props: ['age', 'sexType', 'chooseSymp'],
+  props: ['age', 'sexType', 'chooseSymp','setText'],
   data() {
     return {
       searchVal: '',
@@ -69,6 +69,11 @@ export default {
   },
   methods: {
     showDetil(item) {
+      if(this.chooseSymp.length>0){     //已有选中症状，不展开详情
+        this.$emit('setText',item);     //选中症状
+        this.search();      //关闭搜索页
+        return;
+      }
       let flg = false;
       if(JSON.stringify(this.tmpItem)==JSON.stringify(item)){//eg:重复点击胸痛bug
         flg = true

src/components/Symptom.vue

@@ -34,10 +34,12 @@
         <span
           class="symp"
           v-for="(it,ind) in symp"
+          v-if="ind<9||showAll"
           :key="it.conceptId"
           @touchstart.stop.prevent="touchstart(it)"
           @touchend.stop.prevent="touchend(it)"
         >{{it.description || it.name}}</span>
+        <p class="show-all" v-if="chooseSymp.length===0" @click="showAllLabel">{{showAll?"收起":"展开全部"}}</p>
         <p class="tip" v-show="chooseSymp.length==0">长按症状按钮可显示症状解释说明</p>
       </div>
       <div
@@ -65,6 +67,7 @@
     <Search
       v-if="this.$store.state.searchShow"
       @search="search"
+      @setText="common"
       @showDetil="showDetil"
       :age="age"
       :chooseSymp="chooseSymp"
@@ -109,6 +112,7 @@ export default {
       startTime:'',
       timer:null,
       showExp:false,
+      showAll:false,    //默认显示9个症状，showAll=true展开全部
       message:{
         title:'',
         text:''
@@ -136,6 +140,7 @@ export default {
     touchstart(it){
       this.startTime = +new Date();
       const that = this;
+      this.start = this.$store.state.scroll;
       this.timer = setTimeout(function(){
         // 长按事件
           that.showExp = true;
@@ -146,7 +151,7 @@ export default {
             that.message.title = "";
             that.message.text = "暂无资料";
           }
-          
+
         },600)
     },
     closeTip(){
@@ -191,8 +196,8 @@ export default {
       const id = item.questionId || item.id; //常见症状questionId，推送id,两者均有可能没有
       //将选中的name存到store中的text
       this.$store.commit('setText', { type: moduleCP['symp'], text: item.name,textP: item.description||item.name, pId: this.questId });
-      
-      if (id) {
+      //不是第一个症状，都不弹出详情
+      if (this.chooseSymp.length === 0&&id) {
         const param = {
           "age": this.age,
           "id": id,
@@ -203,20 +208,20 @@ export default {
           if (result.code == 0) {
             const mapping = result.data.questionMapping;
             this.labelDetail = result.data;
-            this.$store.commit('setOrigin', { type: moduleCP['symp'], data: result.data });
+            //this.$store.commit('setOrigin', { type: moduleCP['symp'], data: result.data }); //2544暂时不存，被删除后加上详情不会再显示
             if (mapping && mapping.length > 0) {
               this.$store.commit('setDetail',{detail:result.data,ppId:null,moduleType:moduleCP['symp']})
               if(flg){
                 return
               }
               this.chooseSymp.push(item);
-            } else { 
+            } else {
               this.chooseSymp.push(item);
               this.$store.commit('setSearchShow', false);
             }
           }
         })
-      } else {//没有questionId或id 
+      } else {//没有questionId或id
         this.chooseSymp.push(item);
         this.checkText = this.$store.state.symptom.text;
       }
@@ -228,12 +233,19 @@ export default {
     },
     touchend(item,flg) {//症状点开详情
       clearTimeout(this.timer);
+      this.end = this.$store.state.scroll;
+      if(JSON.stringify(this.start)!== JSON.stringify(this.end)){
+        return;
+      }
       let endTime = +new Date();
       if(endTime - this.startTime < 500){//点击事件
         this.common(item,flg);
       }
       this.startTime = "";
     },
+    showAllLabel(){
+      this.showAll = !this.showAll;
+    },
     getSympText() {//推送使用医生端信息
       const text = this.$store.state.symptom.text;
       let msg = "";
@@ -272,7 +284,8 @@ export default {
       $(".btscroll").css({'position':'absolute'})
       this.chooseSymp.splice(this.delIndex, 1);
       this.checkText.splice(this.delIndex, 1);
-      this.$store.commit('delText', { type: moduleCP['symp'], pId: this.questId })
+      this.$store.commit('delText', { type: moduleCP['symp'], pId: this.questId });
+      console.log(this.$store.state)
       // 删除setDatas数据,防止回读
       this.$store.commit('setDatas', { type: moduleCP['symp'], pId: this.questId ,data:''})
       // 删除完-常见；其他-推送
@@ -300,7 +313,7 @@ export default {
       const read = this.$store.state.symptom.datas;
       const data = read[(item.questionId||item.id)] || origin[(item.questionId||item.id)];
       if (data&&data.questionMapping && data.questionMapping.length > 0) {
-        this.$store.commit('setDetail',{detail:data,ppId:null,moduleType:moduleCP['symp']})       
+        this.$store.commit('setDetail',{detail:data,ppId:null,moduleType:moduleCP['symp']})
       }
     },
   },
@@ -320,7 +333,7 @@ export default {
         }else{
           this.getSympList();
           this.quesText = "请问您这次哪里最不舒服？";
-        } 
+        }
       },
       deep:true
     }
@@ -397,6 +410,18 @@ export default {
 }
 .label{
   .label;
+  .show-all{
+    text-align: right;
+    color: #4f7aff;
+    font-size: 0.25rem;
+    height:35px;
+    line-height: 35px;
+    float: right;
+   /* width: 80px;
+    border:1px #4f7aff solid;
+    border-radius: 5px;
+    margin: auto;*/
+  }
 }
 .result{
   .result;