WXL
2023-11-24 ac84e789feb9ef287134dec829edf93f7ad3ac69
src/views/patient/patient/profile/index.vue
@@ -11,10 +11,34 @@
            <div>吴大龙</div>
          </div></el-col
        >
        <el-col :span="4"
        <el-col :span="8"
          ><div class="xinz-inf">
            <div class="addtag">+新增标签</div>
            <div class="tagvalue">心血管</div>
            <el-tag
              :key="tag"
              v-for="tag in dynamicTags"
              closable
              :disable-transitions="false"
              @close="handleClose(tag)"
            >
              {{ tag }}
            </el-tag>
            <el-input
              class="input-new-tag"
              v-if="inputVisible"
              v-model="inputValue"
              ref="saveTagInput"
              size="small"
              @keyup.enter.native="handleInputConfirm"
              @blur="handleInputConfirm"
            >
            </el-input>
            <el-button
              v-else
              class="button-new-tag"
              size="small"
              @click="showInput"
              >+ 新增标签</el-button
            >
          </div></el-col
        >
        <el-col :span="4"
@@ -315,6 +339,9 @@
      activeName: "health", //一类导航
      sonactiveName: "outpatient", //健康监测导航
      sontwoactiveName: "blood", //医疗档案导航
      dynamicTags: ["标签一", "标签二", "标签三"],
      inputVisible: false,
      inputValue: "",
      // 查询参数
      queryParams: {
        pageNum: 1,
@@ -385,15 +412,27 @@
        this.loading = false;
      });
    },
    // getUser() {
    //   getUserProfile().then((response) => {
    //     this.user = response.data;
    //     this.roleGroup = response.roleGroup;
    //     this.postGroup = response.postGroup;
    //   });
    // },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    // 血压图表部分
@@ -680,11 +719,27 @@
    }
  }
  .xinz-inf {
    display: flex;
    font-size: 18px;
    cursor: pointer;
    .addtag{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 48px;
    .el-tag + .el-tag {
      margin-left: 10px;
    }
    .button-new-tag {
      margin-left: 10px;
      height: 32px;
      line-height: 30px;
      padding-top: 0;
      padding-bottom: 0;
    }
    .input-new-tag {
      width: 90px;
      margin-left: 10px;
      vertical-align: bottom;
    }
  }
}