labsop_scientific_h5/pages/todo/components/document/AchPatentForm.vue

<template>
  <view class="document-form">
    <uv-loading-icon v-if="loading" mode="circle" text="正在加载专利详情..."></uv-loading-icon>
    <template v-else-if="form">
      <!-- 基本信息 -->
      <CommonSection title="基本信息" :isFirst="true">
        <CommonInfoRow label="专利名称" :value="form.patentName" />
        <CommonInfoRow label="所属科室" :value="form.deptName" />
        <!-- <CommonInfoRow label="代理公司" :value="form.companyName" /> -->
        <CommonInfoRow label="专利类型" :value="getDictLabel('sci_patent_class', form.patentClass)" />
        <CommonInfoRow label="专利范围" :value="getDictLabel('sci_patent_scope', form.patentScope)" />
        <CommonInfoRow label="专利状态" :value="getDictLabel('sci_patent_condition', form.patentCondition)" />
        <CommonInfoRow label="专利（申请）号" :value="form.patentNumber" />
        <CommonInfoRow label="申请人" :value="form.applicantName" />
        <CommonInfoRow label="第几参与人" :value="form.patentApplicationCode" />
        <CommonInfoRow label="申请日期" :value="formatDate(form.patentApplicationDate)" />
        <CommonInfoRow label="分类号" :value="form.classNum" />
        <CommonInfoRow label="公开号" :value="form.patentPublicCode" />
        <CommonInfoRow label="公开日期" :value="formatDate(form.patentPublicDate)" />
        <CommonInfoRow label="授权号" :value="form.patentAccreditCode" />
        <CommonInfoRow label="授权日期" :value="formatDate(form.effectiveTime)" />
        <CommonInfoRow label="署名" :value="getDictLabel('sci_circuit_signature', form.patentSchoolSignature)
          " />
        <CommonInfoRow label="专利权人" :value="form.patentObligee" />
        <CommonInfoRow label="专利代理机构" :value="form.entrustUnit" />
        <CommonInfoRow label="代理人" :value="form.agencyUserName" />
        <CommonInfoRow label="代理人联系电话" :value="form.agencyPhone" />
        <CommonInfoRow label="专利文献出版日" :value="formatDate(form.publicationDate)" />
        <CommonInfoRow label="所属年份" :value="form.patentYeat" />
        <CommonInfoRow label="是否失效" :value="form.patentEffectiveness === '10' ? '是' : '否'" />
        <CommonInfoRow label="合作类型" :value="getDictLabel('sci_cooperation', form.patentCooperation)" />
        <CommonInfoRow label="是否职务专利" :value="form.patentOffice === '10' ? '是' : '否'" />
        <CommonInfoRow label="是否为PCT专利" :value="form.patentCt === '10' ? '是' : '否'" />
        <CommonInfoRow label="成果权属" :value="getDictLabel('achievement_owner_unit', form.achievementOwnerUnit)
          " />

        <CommonInfoRow label="所属平台">
          <view class="platform-tags">
            <template v-if="platformList.length > 0">
              <uv-tags v-for="(p, index) in platformList" :key="index" :text="p.platformName === '其他'
                ? '其他'
                : p.platformType
                  ? p.platformName + ' (' + p.platformType + ')'
                  : p.platformName
                " type="primary" plain size="mini" class="mr5"></uv-tags>
            </template>
            <text v-else>-</text>
          </view>
        </CommonInfoRow>
        <CommonInfoRow label="所属团队" :value="form.belongTeam || '-'" />

        <!-- 专利转化特有字段 -->
        <template v-if="code.includes('专利转化')">
          <CommonInfoRow label="转化时间" :value="formatDate(form.invertTime)" />
          <CommonInfoRow label="转化金额" :value="(form.invertAmount || '0') + ' 元'" isAmount />
          <CommonInfoRow label="转化单位" :value="form.invertUnit" />
          <CommonInfoRow label="知识产权交易类型" :value="form.tradeType === '10'
            ? '转让'
            : form.tradeType === '20'
              ? '许可'
              : '-'
            " />
        </template>

        <CommonInfoRow label="专利简介" :value="form.patentDesc" isColumn />
      </CommonSection>

      <!-- 发明(设计)人信息 -->
      <CommonSection title="发明(设计)人信息" v-if="form.memberList?.length">
        <view class="member-list">
          <view class="member-item" v-for="(member, index) in form.memberList" :key="index">
            <view class="member-avatar">{{ Number(index) + 1 }}</view>
            <view class="member-body">
              <view class="member-header">
                <text class="name">{{ member.memberName }}</text>
                <text class="badge" :class="'badge-' + getMemberBadgeType(member.memberType)">
                  {{ getDictLabel("sci_paper_member_type", member.memberType) }}
                </text>
              </view>
              <view class="member-tags">
                <text class="tag" v-if="member.degree">{{
                  getDictLabel("sci_academic_degree", member.degree)
                  }}</text>
                <text class="tag" v-if="member.education">{{
                  getDictLabel("sci_education", member.education)
                  }}</text>
                <text class="tag" v-if="member.jobTitle">{{
                  getDictLabel("sci_discipline_job_title", member.jobTitle)
                  }}</text>
              </view>
              <view class="member-meta">
                <view class="meta-item" v-if="member.order">
                  <text class="meta-label">排名</text>
                  <text class="meta-value">{{ member.order }}</text>
                </view>
                <view class="meta-item" v-if="member.contributionRate">
                  <text class="meta-label">贡献率</text>
                  <text class="meta-value">{{ member.contributionRate }}%</text>
                </view>
              </view>
              <view class="member-dept" v-if="member.deptName">
                <uv-icon name="home" size="24rpx" color="#909399"></uv-icon>
                <text>{{ member.deptName }}</text>
              </view>
            </view>
          </view>
        </view>
      </CommonSection>

      <!-- 附件信息 -->
      <AttachmentList :list="mergedFileList" title="相关附件" />

      <!-- 标注经济来源 -->
      <CommonSection title="标注经济来源" v-if="form.projList?.length">
        <view class="achievement-card" v-for="(row, index) in form.projList" :key="index">
          <view class="a-row">
            <text class="al">关联类型：</text>
            <text class="av">{{
              row.sourceType === "10" ? "项目" : "学科"
              }}</text>
          </view>
          <view class="a-row">
            <text class="al">项目/学科：</text>
            <text class="av">{{ row.projectSource || "-" }}</text>
          </view>
        </view>
      </CommonSection>

      <!-- 审批信息 -->
      <CommonSection title="审批信息" v-if="form.id">
        <FlowTable :id="form.id" :businessCode="'学术专利-' + form.patentCode" defCode="sci_academic_achievement" />
      </CommonSection>

      <!-- 转化审批信息 -->
      <CommonSection title="转化审批信息" v-if="form.id && code.includes('专利转化')">
        <FlowTable :id="form.id" :businessCode="'专利转化-' + form.patentCode" defCode="sci_academic_achievement" />
      </CommonSection>
    </template>
    <uv-empty v-else mode="data" text="暂无数据"></uv-empty>
  </view>
</template>

<script setup lang="ts">
import { ref, onMounted, watch, computed } from "vue";
import { useDict } from "@/hooks/useDict";
import { useDocumentApi } from "@/api/document";
import { formatDate } from "@/utils/date";
import to from "await-to-js";
import AttachmentList from "./AttachmentList.vue";
import FlowTable from "@/pages/project/components/detail/FlowTable.vue";
import CommonSection from "@/components/ui/CommonSection.vue";
import CommonInfoRow from "@/components/ui/CommonInfoRow.vue";

const props = defineProps<{
  code: string;
}>();

const { getDictLabel } = useDict(
  "sci_patent_class",
  "sci_patent_scope",
  "sci_patent_condition",
  "sci_circuit_signature",
  "sci_cooperation",
  "achievement_owner_unit",
  "sci_paper_member_type",
  "sci_academic_degree",
  "sci_education",
  "sci_discipline_job_title"
);
const documentApi = useDocumentApi();

const form = ref<any>(null);
const loading = ref(false);

const platformList = computed(() => {
  if (form.value?.belongPlatform) {
    try {
      const data = JSON.parse(form.value.belongPlatform);
      return Array.isArray(data) ? data : [];
    } catch (e) {
      if (form.value.belongPlatform === "其他")
        return [{ platformName: "其他" }];
      return [{ platformName: form.value.belongPlatform }];
    }
  }
  return [];
});

const mergedFileList = computed(() => {
  if (!form.value) return [];
  const list: any[] = [];
  if (form.value.patentFile) {
    try {
      const file = JSON.parse(form.value.patentFile);
      list.push({ ...file, fileType: "专利附件" });
    } catch (e) { }
  }
  if (form.value.agencyContractFile) {
    try {
      const file = JSON.parse(form.value.agencyContractFile);
      list.push({ ...file, fileType: "委托合同" });
    } catch (e) { }
  }
  if (form.value.invertUrl) {
    try {
      const file = JSON.parse(form.value.invertUrl);
      list.push({ ...file, fileType: "转化附件" });
    } catch (e) { }
  }
  return list;
});

const fetchData = async () => {
  if (!props.code) return;
  loading.value = true;
  const patentCode = props.code.includes("-")
    ? props.code.split("-")[1]
    : props.code;
  const [err, res] = await to(documentApi.getPatentByCode(patentCode));
  if (!err && res?.data) {
    form.value = res.data;
  }
  loading.value = false;
};

onMounted(() => {
  fetchData();
});

watch(
  () => props.code,
  () => {
    fetchData();
  }
);

const getMemberBadgeType = (type: string) => {
  const map: Record<string, string> = {
    "10": "primary",
    "20": "success",
    "30": "warning",
  };
  return map[type] || "default";
};
</script>

<style lang="scss" scoped>
@import "./common.scss";

.member-list {
  .member-item {
    display: flex;
    align-items: flex-start;
    background: #fff;
    border: 2rpx solid #f0f2f5;
    border-radius: 16rpx;
    padding: 24rpx;
    margin-bottom: 20rpx;
    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.04);

    &:last-child {
      margin-bottom: 0;
    }
  }

  .member-avatar {
    width: 56rpx;
    height: 56rpx;
    background: linear-gradient(135deg, #2979ff 0%, #1a66ff 100%);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26rpx;
    font-weight: 600;
    flex-shrink: 0;
    margin-right: 20rpx;
  }

  .member-body {
    flex: 1;
    min-width: 0;
  }

  .member-header {
    display: flex;
    align-items: center;
    margin-bottom: 16rpx;
    flex-wrap: wrap;

    .name {
      font-size: 32rpx;
      font-weight: 600;
      color: #1a1a1a;
      margin-right: 16rpx;
    }

    .badge {
      font-size: 22rpx;
      padding: 4rpx 16rpx;
      border-radius: 20rpx;
      color: #fff;
    }

    .badge-primary {
      background: #2979ff;
    }

    .badge-success {
      background: #19be6b;
    }

    .badge-warning {
      background: #ff9900;
    }

    .badge-default {
      background: #909399;
    }
  }

  .member-tags {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 16rpx;

    .tag {
      font-size: 24rpx;
      color: #606266;
      background: #f4f4f5;
      padding: 6rpx 16rpx;
      border-radius: 8rpx;
      margin-right: 12rpx;
      margin-bottom: 8rpx;

      &:last-child {
        margin-right: 0;
      }
    }
  }

  .member-meta {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 12rpx;

    .meta-item {
      display: flex;
      align-items: center;
      margin-right: 32rpx;
      margin-bottom: 8rpx;

      &:last-child {
        margin-right: 0;
      }

      .meta-label {
        font-size: 24rpx;
        color: #909399;
        margin-right: 8rpx;
      }

      .meta-value {
        font-size: 24rpx;
        color: #606266;
        font-weight: 500;
      }
    }
  }

  .member-dept {
    display: flex;
    align-items: center;
    font-size: 24rpx;
    color: #909399;

    text {
      margin-left: 8rpx;
    }
  }
}
</style>