irc_web/src/views/trials/trials-panel/trial-summary/trial-information/index.vue

<template>
  <div class="trial-information">
    <el-descriptions :column="2" border style="width: 1000px">
      <el-descriptions-item :label="$t('trials:trials-list:form:trialId')">
        {{ trialInfo.TrialCode }}
        <el-tag
          v-show="trialInfo.TrialStatusStr"
          size="small"
          style="margin-left: 10px"
        >
          ( {{ $fd("TrialStatusEnum", trialInfo.TrialStatusStr) }} )
        </el-tag>
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:trialType')">
        {{ $fd("TrialType", trialInfo.TrialType) }}
      </el-descriptions-item>

      <el-descriptions-item
        :label="$t('trials:trials-list:form:experimentName')"
        :contentStyle="{ 'max-width': '300px' }"
      >
        {{ trialInfo.ExperimentName }}
      </el-descriptions-item>
      <el-descriptions-item
        :label="$t('trials:trials-list:form:researchNumber')"
        :contentStyle="{ 'max-width': '300px' }"
      >
        {{ trialInfo.ResearchProgramNo }}
      </el-descriptions-item>

      <el-descriptions-item :label="$t('trials:trials-list:form:researchUnit')">
        {{ trialInfo.MainResearchUnit }}
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:pi')">
        {{ trialInfo.HeadPI }}
      </el-descriptions-item>

      <el-descriptions-item :label="$t('trials:trials-list:form:sponsor')">
        {{ trialInfo.Sponsor }}
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:cro')">
        {{ trialInfo.CRO }}
      </el-descriptions-item>

      <el-descriptions-item
        :label="$t('trials:trials-list:form:declarationType')"
      >
        <span v-if="trialInfo.DeclarationTypeEnumList">{{
          trialInfo.DeclarationTypeEnumList.map((v) =>
            $fd("DeclarationType", v)
          ).join(", ")
        }}</span>
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:phase')">
        {{ trialInfo.Phase }}
      </el-descriptions-item>

      <el-descriptions-item
        :label="$t('trials:trials-list:form:indicationType')"
      >
        {{ $fd("IndicationType", trialInfo.IndicationTypeId, "id") }}
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:indication')">
        {{ $fd("Indication", trialInfo.IndicationEnum)
        }}{{ trialInfo.Indication }}
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:modality')">
        {{ trialInfo.Modalitys }}
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:siteCount')">
        {{ trialInfo.PlanSiteCount }}
      </el-descriptions-item>

      <el-descriptions-item :label="$t('trials:trials-list:form:patientsNum')">
        {{ trialInfo.ExpectedPatients }}
      </el-descriptions-item>
      <el-descriptions-item
        :label="$t('trials:trials-list:form:timePointsPerPatient')"
      >
        {{ trialInfo.TimePointsPerPatient }}
      </el-descriptions-item>

      <el-descriptions-item
        :span="2"
        :label="$t('trials:trials-list:form:visitCount')"
      >
        {{ trialInfo.PlanVisitCount }}
      </el-descriptions-item>

      <el-descriptions-item
        :span="2"
        :label="$t('trials:trials-list:form:criterion')"
      >
        {{ trialInfo.Criterion }}
      </el-descriptions-item>
      <!--      <el-descriptions-item :label="$t('trials:trials-list:form:reviewMode')">-->
      <!--        <span>{{$fd('ReadingType', trialInfo.ReadingType)}}</span>-->
      <!--      </el-descriptions-item>-->

      <el-descriptions-item :label="$t('trials:trials-list:form:expedited')">
        {{ $fd("YesOrNoForInt", trialInfo.Expedited) }}
      </el-descriptions-item>
      <el-descriptions-item :label="$t('trials:trials-list:form:projectCycle')">
        {{ trialInfo.ProjectCycle }}
      </el-descriptions-item>

      <el-descriptions-item
        :label="$t('trials:trials-list:form:totalReviewers')"
      >
        {{ trialInfo.TotalReviewers }}
      </el-descriptions-item>
      <el-descriptions-item
        :label="$t('trials:trials-list:form:typeofReviewers')"
      >
        <span v-if="trialInfo.AttendedReviewerTypeEnumList">{{
          trialInfo.AttendedReviewerTypeEnumList.map((v) =>
            $fd("AttendedReviewerType", v)
          ).join(", ")
        }}</span>
      </el-descriptions-item>
    </el-descriptions>

    <el-badge
      :value="trialInfo.UserFeedBackUnDealedCount || 0"
      :max="99"
      class="inBox"
    >
      <i class="el-icon-message" @click.stop="openFeedBack"></i>
    </el-badge>
  </div>
</template>
<script>
import { getTrialInfo } from "@/api/trials";
export default {
  data() {
    return {
      trialInfo: {},
      trialId: "",
      trialStatus: "",
      formLoading: false,
    };
  },
  mounted() {
    this.trialId = this.$route.query.trialId;
    this.initForm();
  },
  methods: {
    initForm() {
      this.formLoading = true;
      getTrialInfo(this.trialId)
        .then((res) => {
          this.formLoading = false;
          this.trialInfo = res.Result;
          this.trialInfo.ReviewTypeList =
            this.trialInfo.ReviewTypeList.length > 0
              ? this.trialInfo.ReviewTypeList.join(", ")
              : "";
          var modalityArr = [];
          res.Result.ModalityIds.map((i) => {
            modalityArr.push(this.$fd("Modality", i, "id"));
          });
          this.trialInfo.ModalityList = modalityArr.join(", ");
          this.trialInfo.Criterion =
            res.Result.CriterionList && res.Result.CriterionList.length > 0
              ? res.Result.CriterionList.join(", ")
              : "";
          // this.trialInfo.Expedited = this.$fd('Trial_BasicInfo', res.Result.Expedited)
          // this.trialInfo.AttendedReviewerType = this.$fd('Trial_BasicInfo', res.Result.AttendedReviewerType)
        })
        .catch(() => {
          this.formLoading = false;
        });
    },
    // 打开反馈意见列表
    openFeedBack() {
      this.$FBT({
        data: {
          code: this.$route.query.trialCode,
          name: this.$route.query.researchProgramNo,
          trialId: this.trialId,
        },
        callBack: () => {
          this.initForm();
        },
      });
    },
  },
};
</script>
<style lang="scss">
.trial-information {
  min-height: 100%;
  padding: 10px 0 0 10px;
  background: #fff;
}
.inBox {
  font-size: 32px;
  margin-top: 30px;
  cursor: pointer;
}
</style>