Browse Source

选项带输入框

liucf 5 năm trước cách đây
mục cha
commit
2a9ddc7da8
3 tập tin đã thay đổi với 13 bổ sung5 xóa
  1. 5 1
      src/common/CheckBox.vue
  2. 3 3
      src/common/OptionInp.vue
  3. 5 1
      src/common/Radio.vue

+ 5 - 1
src/common/CheckBox.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="check-wrap" v-if="item">
-    <p v-for="(it,index) in datas.questionDetailList" :key="it.id" class="list" @click="handleClick(it,index,'',true)">
+    <!-- <p v-for="(it,index) in datas.questionDetailList" :key="it.id" class="list" @click="handleClick(it,index,'',true)"> -->
+      <p v-for="(it,index) in datas.questionDetailList" :key="it.id" :class="['list',{'block':((it.description||it.name).indexOf('${'))!=-1}]" @click="handleClick(it,index,true)">
       <img :src="it.select==1?check:defaultPic">
       <span v-if="((it.description||it.name).indexOf('${'))==-1" :class="[{'check':it.select==1},{'exclu':exclusion !==999 && it.exclusion !== exclusion}]">{{it.description||it.name}}</span>
       <OptionInp v-else 
@@ -128,6 +129,9 @@ import OptionInp from '../common/OptionInp.vue';
     img{
       width:100%;
     }
+    .block{
+      width:100%;
+    }
     .list{
       color: #7C828E;
       margin:0 .1rem .1rem 0;

+ 3 - 3
src/common/OptionInp.vue

@@ -5,7 +5,7 @@
     <!-- <div class="inp" @click="preClick"> -->
       <input :type="msg.type=='number'?'tel':'text'" 
               :placeholder="msg.placeholder"
-              :style="{'width':msg.prefix&&msg.suffix?'33%':(msg.prefix || msg.suffix?'50%':'100%')}"
+              :style="{'width':!msg.prefix&&!msg.suffix?'90%':'33%'}"
               :disabled="exclu"
               :maxlength="msg.type=='number'?10:''"
               :class="[{'exclu':exclu},{'cancel':item.select==0}]"
@@ -25,7 +25,7 @@ import { getExpStr} from '@utils/tools';
       return{
         msg:{},
         txt:this.item.value || '',
-        select:0
+        select:0,
       }
     },
     props:['item','exclu'],
@@ -82,7 +82,7 @@ import { getExpStr} from '@utils/tools';
   .inpbox{
     color:#7C828E;
     display: inline-block;
-    width: 94%;
+    width: 100%;
     white-space: normal;
     vertical-align: middle;
     // padding-right: .3rem;

+ 5 - 1
src/common/Radio.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="radio-wrap" v-if="item">
-    <p v-for="(it,index) in datas.questionDetailList" :key="it.id" class="list" @click="handleClick(it,index,true)">
+    <!-- <p v-for="(it,index) in datas.questionDetailList" :key="it.id" class="list" @click="handleClick(it,index,true)"> -->
+    <p v-for="(it,index) in datas.questionDetailList" :key="it.id" :class="['list',{'block':((it.description||it.name).indexOf('${'))!=-1}]" @click="handleClick(it,index,true)">
       <img :src="it.select==1?check:defaultPic">
       <span v-if="((it.description||it.name).indexOf('${'))==-1" :class="{'check':it.select==1}">{{it.description||it.name}}</span>
       <OptionInp v-else :item="it" @handleInp="inpVal($event,index)" @handleSelec="handleClick(it,index)"/>
@@ -80,6 +81,9 @@ import OptionInp from '../common/OptionInp.vue';
     img{
       width:100%;
     }
+    .block{
+      width:100%;
+    }
     .list{
       color: #7C828E;
       margin:0 .1rem .1rem 0;