Bladeren bron

新增文本域组件

Luolei 6 jaren geleden
bovenliggende
commit
9b50ae5cf4
3 gewijzigde bestanden met toevoegingen van 154 en 92 verwijderingen
  1. 42 0
      src/common/ComTextArea.vue
  2. 104 86
      src/components/AddContent.vue
  3. 8 6
      src/components/TabPage.vue

+ 42 - 0
src/common/ComTextArea.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="comArea">
+    <textarea @input="changeVal" :style={width:width,height:height} v-model="txt"></textarea>
+  </div>
+</template>
+
+<script type="text/javascript">
+export default {
+  name:'ComTextArea',
+  props: {
+    width: {
+      default: '100%',
+      type: String
+    },
+    height: {
+      default: '2rem',
+      type: String
+    },
+  },
+  data() {
+    return {
+      txt:''
+    }
+  },
+  methods:{
+    changeVal(){
+      this.$emit('changeVal',this.txt)
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+  .comArea {
+    textarea {
+      border: 1px solid #DFE0E4;
+      border-radius: .08rem /* 8/100 */;
+      padding: .16rem /* 16/100 */ .3rem /* 30/100 */;
+      resize: none;
+      box-sizing: border-box;
+    }
+  }
+</style>

+ 104 - 86
src/components/AddContent.vue

@@ -1,110 +1,128 @@
 <template>
   <div class="symp-wrap">
     <div class="choose">
-      <h3>添加内容</h3>
+      <ul class="addPart">
+        <li v-for="(item,idx) in dataTrd">
+          <p class="question">{{idx+1 + '. ' +item.name}}</p>
+          <ComTextArea @changeVal="changeVal($event,idx)"></ComTextArea>
+        </li>
+      </ul>
     </div>
+    <div
+      class="footer"
+      @click="toNext"
+    >上一步</div>
   </div>
 </template>
 <script type="text/javascript">
-  export default {
-    name:'Symptom',
-    data(){
-      const pathInfo = this.$store.state.pathInfo;
-      return {
-        age:pathInfo.patientAge,
-        sexType:pathInfo.patientSex=='男'?1:(pathInfo.patientSex=='女'?2:3),
-        deptName:pathInfo.selfDeptName,
-        hosCode:pathInfo.hospitalCode,
-        choose:false,
-        check:false,
-        show:false, //显示明细
-        chooseSymp:[], //已选症状
-        symp:[], //症状
-        labelDetail:{}, //明细
-        checkText:{}, //选中拼好的明细
-        current:null,
-        delText:"是否删除该信息?",
-        delIndex:null,
-        showToast:false
-      }
+import ComTextArea from '../common/ComTextArea.vue';
+
+export default {
+  name: 'AddContent',
+  props: ['allMoudles'],
+  data() {
+    return {
+      dataTrd: []
+    }
+  },
+  mounted() {
+    this.dataTrd = this.allMoudles&&this.allMoudles.moduleDetailDTOList
+  },
+  methods: {
+    toNext() {
+      // 把1切换成完成图标,且2高亮
+      this.$emit("nextStep", 0);
     },
-    methods:{
-      
+    changeVal(value,idx){
+      console.log(value,idx)
     }
+  },
+  components: {
+    ComTextArea,
   }
+}
 </script>
 <style lang="less" scoped>
-@import '../less/base.less';
-  .symp-wrap{
-    font-size: .3rem;
-    h3{
-      color: #000;
-      margin-bottom: .36rem;
-    }
+@import "../less/base.less";
+.symp-wrap {
+  font-size: 0.3rem;
+  h3 {
+    color: #000;
+    margin-bottom: 0.36rem;
   }
-  .choose{
-    padding-bottom: .2rem;
-    .choo-symp{
-      display: inline-block;
-      width:1.9rem;
-      height: .74rem;
-      background: linear-gradient(-270deg, #4F4FFF, #4F8BFF);
-      box-shadow: 0 .08rem .16rem 0 rgba(79,129,255,0.40);
-      border-radius: .08rem;
-      white-space: nowrap;
-      margin: 0 .3rem .3rem 0;
-      span{
-        display: inline-block;
-        vertical-align: top;
-      }
-      span:first-child{
-        width:1.34rem;
-        height: .74rem;
-        line-height: .74rem;
-        text-align: center;
-        color: #fff;
-      }
-      img{
-        width:.56rem;
-        height: .74rem;
-      }
+}
+.choose {
+  padding-bottom: 0.2rem;
+  .addPart {
+    li {
+      margin-bottom: .5rem /* 50/100 */;
+    }
+    .question {
+      margin-bottom: .3rem /* 30/100 */;
+      font-weight: bold;
     }
   }
-  .label{
-    padding-bottom: .2rem;
-    .symp{
+  .choo-symp {
+    display: inline-block;
+    width: 1.9rem;
+    height: 0.74rem;
+    background: linear-gradient(-270deg, #4f4fff, #4f8bff);
+    box-shadow: 0 0.08rem 0.16rem 0 rgba(79, 129, 255, 0.4);
+    border-radius: 0.08rem;
+    white-space: nowrap;
+    margin: 0 0.3rem 0.3rem 0;
+    span {
       display: inline-block;
-      width:1.9rem;
-      height: .74rem;
-      line-height: .74rem;
-      border: 1px solid #DFE0E4;
-      border-radius: .08rem;
+      vertical-align: top;
+    }
+    span:first-child {
+      width: 1.34rem;
+      height: 0.74rem;
+      line-height: 0.74rem;
       text-align: center;
-      color: #7C828E;
-      margin: 0 0 .3rem .3rem;
-      box-sizing: border-box;
+      color: #fff;
     }
-    .symp:nth-child(3n+2){
-      margin-left: 0;
+    img {
+      width: 0.56rem;
+      height: 0.74rem;
     }
   }
-  .result{
-    h4{
-      color: #4F50FF;
-      padding-left: .1rem;
-      border-left: .08rem solid #4F50FF;
-      margin-bottom: .19rem;
-    }
-    p{
-      color: #666;
-      line-height: .44rem;
-    }
+}
+.label {
+  padding-bottom: 0.2rem;
+  .symp {
+    display: inline-block;
+    width: 1.9rem;
+    height: 0.74rem;
+    line-height: 0.74rem;
+    border: 1px solid #dfe0e4;
+    border-radius: 0.08rem;
+    text-align: center;
+    color: #7c828e;
+    margin: 0 0 0.3rem 0.3rem;
+    box-sizing: border-box;
+  }
+  .symp:nth-child(3n + 2) {
+    margin-left: 0;
   }
-  .footer{
-    .footer;
+}
+.result {
+  h4 {
+    color: #4f50ff;
+    padding-left: 0.1rem;
+    border-left: 0.08rem solid #4f50ff;
+    margin-bottom: 0.19rem;
   }
-  .detail{
-    .mask;
-    z-index: 66;
+  p {
+    color: #666;
+    line-height: 0.44rem;
   }
+}
+.footer {
+  .footer;
+}
+.detail {
+  .mask;
+  z-index: 66;
+}
 </style>

+ 8 - 6
src/components/TabPage.vue

@@ -11,7 +11,7 @@
     <!-- 内容 -->
     <div class="content">
       <Symptom @nextStep="nextStep" v-show="step == 0"/>
-      <AddContent  v-show="step == 3"/>
+      <AddContent :allMoudles="modlues[3]" @nextStep="nextStep" v-show="step == 3"/>
     </div>
     <!-- <div class="footer">下一步</div> -->
   </div>
@@ -28,20 +28,22 @@
         config:sysConfig,
         modlues:allMoudles,
         type:{
-          "1":sysConfig.filter(item=>item.code=="symptoms_show")[0].value,
-          "2":sysConfig.filter(item=>item.code=="diagnosis_show")[0].value,
-          "3":sysConfig.filter(item=>item.code=="omhistory_show")[0].value,
-          "4":sysConfig.filter(item=>item.code=="replenish_show")[0].value,
+          "1":sysConfig.length>0&&sysConfig.filter(item=>item.code=="symptoms_show")[0].value,
+          "2":sysConfig.length>0&&sysConfig.filter(item=>item.code=="diagnosis_show")[0].value,
+          "3":sysConfig.length>0&&sysConfig.filter(item=>item.code=="omhistory_show")[0].value,
+          "4":sysConfig.length>0&&sysConfig.filter(item=>item.code=="replenish_show")[0].value,
         },
         step:0
       }
     },
     created(){
       // console.log('配置信息:',this.config,'type',this.type)
+      if(this.config.length==0){
+        this.$router.go(-1)
+      }
     },
     methods:{
       nextStep(idx){
-        console.log(idx)
         this.step = idx
       }
     },