postdischarge-ui/src/views/manage/components/portrait.vue

<template>
  <div class="topform">
    <div v-if="getParamslistData">
      <div v-for="(aitem, aindex) in getParamslistData"  :key="aindex">
          <div style="margin-left: 60px;">
            <div class="toptitle">{{ aitem.taskPartitionDictName }}</div>
            <div
              style="display: flex"
              v-for="(bitem, bindex) in aitem.portraitSnVOList"
              :key="bindex"
            >
              <el-card class="box-card">
                <el-form
                  ref="form"
                  :inline="true"
                  :model="form"
                  class="form"
                  label-width="100px"
                  :rules="rules"
                >
                  <el-form-item
                    v-for="(cItem, cIndex) in bitem.groupingValues"
                    :key="cIndex"
                    :label="cItem.fieldName"
                  >
                  <el-input class="textarea" v-model="cItem.fieldValue" v-if="!portaitCheckStatus"></el-input>
              <el-input class="textarea" v-model="cItem.fieldValue" disabled  v-else></el-input>
                  </el-form-item>
                </el-form>
              </el-card>
              <div class="icon" v-if="!portaitCheckStatus">
                <i
                  class="el-icon-delete"
                  @click="delitem(aindex,bindex)"
                  v-if="bindex != 0"
                ></i>
                <i
                  v-if="bindex == 0"
                  class="el-icon-circle-plus-outline"
                  @click="additem(aindex,bindex)"
                ></i>
              </div>
            </div>
          </div>
        </div>
      <!-- <div
        v-for="(item, index) in getParamslistData"
        :key="index"
        style="display: flex"
      >
        <el-card class="box-card">
          <el-form
            ref="form"
            :inline="true"
            :model="form"
            class="form"
            label-width="100px"
            :rules="rules"
          >
            <el-form-item
              v-for="(ite, ind) in item"
              :label="ite.fieldName"
              :key="ind"
            >
              <el-input class="textarea" v-model="ite.fieldValue" v-if="!portaitCheckStatus"></el-input>
              <el-input class="textarea" v-model="ite.fieldValue" disabled  v-else></el-input>

            </el-form-item>
          </el-form>
        </el-card>
        <div class="icon" v-if="!portaitCheckStatus">
          <i
            class="el-icon-delete"
            @click="delitem(index)"
            v-if="index != 0"
          ></i>
          <i
            v-if="index == 0"
            class="el-icon-circle-plus-outline"
            @click="additem(index)"
          ></i>
        </div>
      </div> -->
    </div>


  </div>

</template>

<script>
import { groupingValue } from '@/api/manage/Portraitedit'

export default {
  props:['patientId','portaitCheckStatus'],//接收psMsg值

  data() {
    return {
      CheckStatus:'',
      moban: [],
      querytParams: {
        taskPartitionDictId: 0,
        // patientId: this.$route.query.patientId,
        patientId: null,
      },
      rules: {
        routeCheckStatus: [
          { required: true, message: '请选择节点审核状态', trigger: 'change' }
        ],
      },
      form: {},
      getParamslistData: [],

    }
  },
  watch: {
    "getParamslistData": {
      handler(newValue, oldValue) {
        console.log(newValue,'newValue')
        this.$emit("portraitlist", newValue);
      },
      deep: true,
    },
    portaitCheckStatus: {
      handler(newValue, oldValue) {
        this.portaitCheckStatus=newValue
        console.log(newValue, "portaitCheckStatus");
      },
    }

  },
  created() {
    this.CheckStatus=this.$route.query.routeCheckStatus
  },
  mounted() {
    this.querytParams.patientId=this.patientId
    this.getParams()
  },
  methods: {
    // 右侧列表
    getParams() {
      groupingValue(this.querytParams).then(res => {
        console.log(res, 'res')
        this.moban = JSON.parse(JSON.stringify(res))
        this.getParamslistData = res
        console.log(this.getParamslistData, '009090')

      })
    },
    // 添加
    additem(aindex, bindex) {
      // console.log(this.form.list,'this.form.list')
      const newVal = JSON.parse(JSON.stringify(this.moban[aindex].portraitSnVOList[0]))
      newVal.groupingValues.forEach(e => {
        e.fieldValue = ""
        e.portraitSn = ''

      });

      this.getParamslistData[aindex].portraitSnVOList.push(newVal)
    },
    // 删除
    delitem(aindex, bindex) {
      this.getParamslistData[aindex].portraitSnVOList.splice(bindex, 1)
    },

  },

}
</script>
<style scoped lang="scss">
::v-deep .el-input.is-disabled .el-input__inner{
  background: #fff;
}
::v-deep .el-card {
    margin-bottom: 20px !important;
  }
.topform {
  width: 100%;
  position: relative;
  height: calc(100% - 177px);
  // overflow-y: auto;
  padding: 15px 70px 30px 15px;
  .toptitle {
    margin-left: 0px;
    margin-top: 21px;
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 30px;
  }
  .box-card {
    // width:calc(100% - 149px);
    width: 97%;
    margin-left: 20px;
    padding-top: 25px;
    margin-bottom: 20px;
    .textarea {
      display: flex;
      // width: 500px;
      // width: 100%;
    }
  }
  .icon {
    width: 45px;
    right: -20px;
    top: 40px;
    position: relative;
  }
  .form {
    width: 100%;
    ::v-deep .el-form-item {
      display: flex;
    }
    ::v-deep .el-form-item__content {
      flex: 1;
    }
    ::v-deep .el-input__inner {
      height: 30px !important;
      line-height: 30px !important;
    }

    ::v-deep .el-form-item__label {
      font-size: 12px !important;
    }
  }
}
</style>