Merge branch 'new' of http://192.168.2.236:10080/zhouna/preliminary into new

src/common/PickTime.vue

@@ -1,78 +1,60 @@
+<!-- 时间类型控件 -->
 <template>
   <div class="toast-wrap">
     <p v-show="val" :class="['ptab',{'check':val != '请选择'}]" @click="showPicker">{{val}}</p>
     <p v-show="val != '请选择'" class="tip">点击可修改</p>
-    <div class="content pc" v-show="show">
-      <van-picker
-        :columns="columns"
-        :visible-item-count='3'
-      />
-      <div class="confBtn">
-        <div @click="getVal">确认</div>
-      </div>
-    </div>
-  </div>
+    <Picker ref="picker" :show="showTime" @comfirn="getTimeVal" @cancel="close" :picIndex="picIndex"/>
+  </div> 
 </template>
 <script type="text/javascript">
   import $ from 'jquery';
-  // import {getNum} from '@utils/tools.js';
-  // const num = getNum();
-  const num = [0,1,2,3,4,5,6,7,8,9,0,1,2,3,4,5,6,7,8,9,0,1,2,3,4,5,6,7,8,9];
-  const unit = ['分钟', '小时', '天', '周', '月','年','分钟', '小时', '天', '周', '月','年','分钟', '小时', '天', '周', '月','年'];
+  import Picker from './Picker.vue';
   export default {
     name:'PickTime',
     data() {
       return {
-        columns: [
-          {
-            values:num,
-            className:'column1',
-            defaultIndex: 10
-          },
-          {
-            values:num,
-            className:'column2',
-            defaultIndex: 11
-          },
-          {
-            values:unit,
-            className:'column3',
-            defaultIndex: 6
-          },
-        ],
         val:this.item.value || '请选择',
-        show:false
+        showTime:false,
+        picIndex:this.item.pickIndex||[]
       }
     },
-    props:['item','outBoxClass'],
+    props:['item'],
     methods: {
       showPicker(){
-        const winH = $(window).height();
-        // outBoxClass 外层盒子的类名，用以获取高度
-        const HH = $("."+this.outBoxClass).height();
-        const pH = $('.ptab').offset().top;//时间组件距离顶部的高度
-        const btH = winH - pH;console.log("可视区高度：",winH,"时间距顶部的高度：",pH,"差值:",winH-pH) //距离底部的距离
-        // 如果底部距离小于弹窗的高度227px + 44，就显示在上方，否则显示下方
-        // ios和华为底部会有浏览器自带的箭头，故多减30
-        if(btH < 271){
-          $('.pc').css('bottom','.88rem'); 
+        this.showTime = true;
+        $(".btscroll").css({'position':'fixed'})
+        $(".foot").css({'position':'fixed'})
+      },
+      getTimeVal(value,index){//确定
+        // 首位为0则去掉
+        if(value.charAt(0) == 0){
+          this.val = value.substr(1);
         }else{
-          $('.pc').css('top','.88rem')
+          this.val = value;
         }
-        this.show = true;
-        this.$emit('forbidS'); //禁止滚动
-      },
-      getVal(){
-        const val1 = $(".column1 ul .van-picker-column__item--selected")[0].innerText;
-        const val2 = $(".column2 ul .van-picker-column__item--selected")[0].innerText;
-        const val3 = $(".column3 ul .van-picker-column__item--selected")[0].innerText;
-        this.val = val1 + val2 + val3;
-        this.show = false;
-        const newData = Object.assign({},this.item,{value:this.val,valueP:this.val});
+        this.showTime = false;
+        const newData = Object.assign({},this.item,{value:this.val,valueP:this.val,pickIndex:index});
         this.$emit("updata",newData);
-        const pH = $('.ptab').offset().top;//恢复滚动的位置
-        this.$emit('resetS',pH); //恢复滚动
+        $(".btscroll").css({'position':'absolute'})
       },
+      close(){//点击蒙层关闭
+        this.showTime = false;
+        $(".btscroll").css({'position':'absolute'})
+      }
+    },
+    components:{
+      Picker
+    },
+    watch:{
+      item:{
+        handler(newVal,oldVal){
+          this.val = newVal.value|| '请选择';
+          if(!newVal.value){//没有值时复原时间组件中的index
+            this.$refs.picker.resetIndex();
+          }
+        },
+        deep:true
+      }
     }
   };
 </script>
@@ -91,40 +73,12 @@
       border-radius: .1rem;
       color:#7C828E;
     }
-    .content{
-      box-sizing: border-box;
-      padding-top: 25px;
-      width: 100%;
-      height: 227px;
-      background: #fff;
-      z-index: 999;
-      position: absolute;
-      // top:.88rem;
-      left: 50%;
-      transform: translateX(-50%);
-      box-sizing: border-box;
-      border-radius: .1rem;
-      z-index: 1000;
-      font-size: .3rem;
-      overflow-y: hidden;
-      box-shadow: 0 .12rem .24rem 0 rgba(79,129,255,0.40);
-      // box-shadow:0 .15rem .35rem 0 rgba(179,196,236,0.3);
-      .confBtn{
-        height: 44px;
-        line-height: 44px;
-        text-align: center;
-        border-top: 1px solid #ebedf0;
-        margin-top: 25px;
-        div{
-          color: #colors[theme];
-        }
-      }
-    }
     .check{
       color: #colors[theme] !important;
     }
     .tip{
       color: #7C828E;
+      font-size: .24rem;
     }
   }
 </style>

src/common/Picker.vue

@@ -1,12 +1,17 @@
+<!-- 时间选择弹窗 -->
 <template>
   <portal to="notification-outlet">
       <div class="toast-wrap" v-if="show">
         <div class="content">
           <van-picker
             :columns="columns"
-            @cancel="onCancel"
-            @confirm="onConfirm"
+            :visible-item-count='3'
+            @change="handlechange"
           />
+          <div class="confBtn">
+            <p class="tip" v-show="showTip">请选择正确的时间</p>
+            <div @click="getVal">确认</div>
+          </div>
         </div>
       <div class="mask" @click="onCancel"></div>
       </div>
@@ -14,9 +19,8 @@
 </template>
 <script type="text/javascript">
   import $ from 'jquery';
-  import {getNum} from '@utils/tools.js';
-  const unit = ['分钟', '小时', '天', '周', '月','年'];
-  const num = getNum();
+  const num = [0,1,2,3,4,5,6,7,8,9,0,1,2,3,4,5,6,7,8,9];
+  const unit = ['分钟', '小时', '天', '周', '月','年','分钟', '小时', '天', '周', '月','年'];
   export default {
     name:'Picker',
     data() {
@@ -24,26 +28,62 @@
         columns: [
           {
             values:num,
-            className:'column1'
+            className:'column1',
+            defaultIndex: 10
+          },
+          {
+            values:num,
+            className:'column2',
+            defaultIndex: 11
           },
           {
             values:unit,
-            className:'column2'
+            className:'column3',
+            defaultIndex: 6
           },
-        ]
+        ],
+        showTip:false,
+        columIndx:[]
       }
     },
-    props:['show'],
+    props:['show','picIndex'],
+    created(){//记录位置
+      this.columns[0].defaultIndex = this.columIndx[0] = this.picIndex[0] || 10;
+      this.columns[1].defaultIndex = this.columIndx[1] = this.picIndex[1] || 11;
+      this.columns[2].defaultIndex = this.columIndx[2] = this.picIndex[2] || 6;
+    },
     methods: {
-      onConfirm(value, index) {
-        console.log("值：",value,"索引：",index,)
-        $(".btscroll").css({'position':'absolute'})
-        this.$emit("comfirn",value)
+      getVal() {
+        const val1 = $(".column1 ul .van-picker-column__item--selected")[0].innerText;
+        const val2 = $(".column2 ul .van-picker-column__item--selected")[0].innerText;
+        const val3 = $(".column3 ul .van-picker-column__item--selected")[0].innerText;
+        // 如果选两个0,则提示
+        if(val1 == 0 && val2 == 0){
+          this.showTip = true;
+          return
+        }
+        const value = val1 + val2 + val3;
+        this.$emit("comfirn",value,this.columIndx)
+        this.columns[0].defaultIndex = this.columIndx[0] || 10;
+        this.columns[1].defaultIndex = this.columIndx[1] || 11;
+        this.columns[2].defaultIndex = this.columIndx[2] || 6;
       },
       onCancel() {
-        console.log('取消');
-        $(".btscroll").css({'position':'absolute'})
         this.$emit("cancel")
+        this.showTip = false;
+      },
+      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]);
+        }
+      },
+      resetIndex(){//清除时复原默认index
+        this.columns[0].defaultIndex = 10;
+        this.columns[1].defaultIndex = 11;
+        this.columns[2].defaultIndex = 6;
       }
     }
   };
@@ -52,51 +92,40 @@
   @import '../less/base.less';
   .toast-wrap{
     .content{
+      padding-top: 25px;
       width: 6.3rem;
-      height: 4.8rem;
+      // height: 4.8rem;
+      height: 227px;
       background: #fff;
       z-index: 999;
-      // position: absolute;
       position: fixed;
       top:50%;
       left: 50%;
       transform: translate(-50%,-50%);
-      // padding: .5rem;
       box-sizing: border-box;
       border-radius: .2rem;
       z-index: 1000;
       font-size: .3rem;
       overflow-y: hidden;
-    }
-    // /deep/ .column1 .van-picker-column__item--selected{
-    /deep/ .column1{
-      &:before{
-        // content: '▷';
-        content: '';
-        width:0;
-        height: 0;
-        position: absolute;
-        left: 0.3rem;
-        // top: 2rem;
-        top: 100px;
-        border-left: 10px solid #colors[theme];
-        border-bottom: 10px solid transparent;
-        border-top: 10px solid transparent;
-      }
-    }
-    // /deep/ .column2 .van-picker-column__item--selected{
-    /deep/ .column2{
-      &:after{
-        // content: '◁';
-        content: '';
-        width:0;
-        height: 0;
-        position: absolute;
-        right: 0.3rem;
-        top: 100px;
-        border-right: 10px solid #colors[theme];
-        border-bottom: 10px solid transparent;
-        border-top: 10px solid transparent;
+      .confBtn{
+        height: 44px;
+        line-height: 44px;
+        text-align: center;
+        border-top: 1px solid #ebedf0;
+        margin-top: 25px;
+        position: relative;
+        .tip{
+          position: absolute;
+          top:-22px;
+          font-size: .24rem;
+          color: red;
+          line-height: 20px;
+          width:100%;
+          text-align: center;
+        }
+        div{
+          color: #colors[theme];
+        }
       }
     }
     .mask{

src/components/AddContent.vue

@@ -39,9 +39,6 @@
             <PickTime v-if="item.controlType==9"
               :item="item"
               :key="item.id"
-              outBoxClass="addc-wrap"
-              @forbidS="destyScroll" 
-              @resetS="resetScroll"
               @updata="updataData($event,idx,item)"/>
           </li>
         </ul>
@@ -95,18 +92,6 @@ export default {
     })
   },
   methods: {
-    // 点击时间控件时 先销毁再重新建立
-      destyScroll(){
-        this.scroll.destroy();
-      },
-      resetScroll(){
-        setTimeout(() => {
-          let scroll = setScroll(BScroll,true,'.addper')
-          this.scroll = scroll
-          scroll.on('scroll', this.onScroll);
-          scroll.scrollTo(0,scrollH+'px');
-        }, 400);
-      },
     onScroll(data) {
       this.$store.commit('setScroll', data)
       document.activeElement.scrollIntoViewIfNeeded(true);        

src/components/Detail.vue

@@ -37,11 +37,8 @@
         ></MultiLineInput>
       </template>
       <PickTime v-if="item.controlType == 9" 
-              @updata="updataData" 
-              @forbidS="forbid" 
-              @resetS="regain" 
-              :item="item"
-              outBoxClass="detail-wrap"/>
+              @updata="updataData"
+              :item="item"/>
     </div>
   </div>
 </template>
@@ -77,13 +74,6 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
       PickTime
     },
     methods:{
-      // 禁止滚动
-      forbid(){
-        this.$emit('destyS')
-      },
-      regain(HH){//恢复滚动
-        this.$emit('resetS',HH)
-      },
       updataData(data,item){
         const origMapping = this.datas.questionMapping;
         let mapping = this.checkDatas.questionMapping;
@@ -191,6 +181,12 @@ import {patt,trimDots,imageUrlPrefix} from '@utils/tools.js'
         const datas = JSON.parse(JSON.stringify(this.checkDatas.questionMapping))
         let reqFlag = false;//必填项标识
         for(let i in datas){
+          // 时间控件需要清除缓存的index
+          if(datas[i].controlType ==9){
+            if(datas[i].pickIndex){
+              datas[i].pickIndex = [];
+            } 
+          }
           datas[i].value = "";
           datas[i].valueP = "";
           if(datas[i].required==1){

src/components/DetailBox.vue

@@ -9,9 +9,7 @@
                   ref="detail"
                   :data="data"
                   @check="changeCheck($event)"
-                  @checkReq="changeFins($event)"
-                  @destyS="destyScroll"
-                  @resetS="resetScroll($event)"/>
+                  @checkReq="changeFins($event)"/>
         </div>
         <!-- <div class="foot" @click="complete">完成</div> -->
       </div>
@@ -19,7 +17,7 @@
         <span class="icon" @click="close">
           <img src="../images/small-close.png">
         </span>
-        <span class="name" @click="showPicker">{{(privateData.description ||privateData.name)+'详情'}}</span>
+        <span class="name">{{(privateData.description ||privateData.name)+'详情'}}</span>
         <span @click="handleClear" :class="{'check':checkF}">清空</span>
         <i>{{tips}}</i>
       </div>
@@ -30,7 +28,6 @@
           :show="showToast"
           @comfirn="comfirnDel" 
           @cancel="cancelDel"/>
-    <Picker :show="showPic" />
   </portal>
 </template>
 <script type="text/javascript">
@@ -77,18 +74,6 @@
       })
     },
     methods:{
-      // 点击时间控件时 先销毁再重新建立
-      destyScroll(){
-        this.scroll.destroy();
-      },
-      resetScroll(scrollH){
-        setTimeout(() => {
-          let scroll = setScroll(BScroll,true,'.viewPrew')
-          this.scroll = scroll
-          scroll.on('scroll', this.onScroll);
-          scroll.scrollTo(0,scrollH+'px');
-        }, 400);
-      },
       onScroll(data) {
         this.$store.commit('setScroll', data)
         document.activeElement.scrollIntoViewIfNeeded(true);        
@@ -157,21 +142,10 @@
         }
         
       },
-      showPicker(){
-        this.showPic = true;
-      },
-      hidePic(){
-        this.showPic = false;
-      },
-      comfirnPic(msg){
-        this.showPic = false;
-        console.log(88,msg)
-      }
     },
     components:{
       Detail,
-      Toast,
-      Picker
+      Toast
     },
     computed: {
       getStoreItem () {

src/components/DiagTreat.vue

@@ -49,9 +49,6 @@
         <PickTime v-if="it.controlType==9"
             :item="it"
             :key="it.id"
-            outBoxClass="treat-wrap"
-            @forbidS="destyScroll" 
-            @resetS="resetScroll"
             @updata="updataData($event,it.id,i)"/>
       </div>
       <div class="result" v-if="getText()">
@@ -108,18 +105,6 @@
       })
     },
     methods:{
-      // 点击时间控件时 先销毁再重新建立
-      destyScroll(){
-        this.scroll.destroy();
-      },
-      resetScroll(scrollH){
-        setTimeout(() => {
-          let scroll = setScroll(BScroll,true,'.treatper')
-          this.scroll = scroll
-          scroll.on('scroll', this.onScroll);
-          scroll.scrollTo(0,scrollH+'px');
-        }, 400);
-      },
       onScroll(data) {
         this.$store.commit('setScroll', data);
         document.activeElement.scrollIntoViewIfNeeded(true);

src/components/Others.vue

@@ -44,9 +44,6 @@
         <PickTime v-if="it.controlType==9"
             :item="it"
             :key="it.id"
-            outBoxClass="other-wrap"
-            @forbidS="destyScroll" 
-            @resetS="resetScroll($event)"
             @updata="updataData($event,it.id,i)"/>
       </div>
       <div class="result" v-if="getText()">
@@ -102,18 +99,6 @@
       })
     },
     methods:{
-      // 点击时间控件时 先销毁再重新建立
-      destyScroll(){
-        this.scroll.destroy();
-      },
-      resetScroll(scrollH){
-        setTimeout(() => {
-          let scroll = setScroll(BScroll,true,'.otherper')
-          this.scroll = scroll
-          scroll.on('scroll', this.onScroll);
-          scroll.scrollTo(0,scrollH+'px'); //解决选择完时间后滚动从头开始的问题
-        }, 400);
-      },
       onScroll(data) {
         this.$store.commit('setScroll', data)
         document.activeElement.scrollIntoViewIfNeeded(true);