ykt-wxapp/pages/case/patient-create.vue

<template>
  <view class="page">
    <view class="body">
      <scroll-view scroll-y class="scroll">
        <view class="form-wrap">
          <form-template ref="formRef" :items="baseItems" :form="form" :rule="rules" @change="onChange" />
        </view>
        <view class="scroll-spacer" />
      </scroll-view>


      <!-- #ifdef MP-WEIXIN -->
      <cover-view class="footer">
        <cover-view class="btn plain" @tap="cancel">取消</cover-view>
        <cover-view class="btn primary" @tap="next">下一步</cover-view>
      </cover-view>
      <!-- #endif -->

      <!-- #ifndef MP-WEIXIN -->
      <view class="footer">
        <button class="btn plain" @click="cancel">取消</button>
        <button class="btn primary" @click="next">下一步</button>
      </view>
      <!-- #endif -->
    </view>
  </view>
</template>

<script setup>
import { reactive, ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { storeToRefs } from 'pinia';
import dayjs from 'dayjs';
import FormTemplate from '@/components/form-template/index.vue';
import api from '@/utils/api';
import useAccountStore from '@/store/account';
import { hideLoading, loading, toast } from '@/utils/widget';
import validate from '@/utils/validate';

const STORAGE_KEY = 'patient-create-base';
const CURRENT_TEAM_STORAGE_KEY = 'ykt_case_current_team';

const formRef = ref(null);
const form = reactive({});
const baseItems = ref([]);

const accountStore = useAccountStore();
const { account, doctorInfo } = storeToRefs(accountStore);
const { getDoctorInfo } = accountStore;

function normalizeChangeValue(value) {
  if (value && typeof value === 'object' && 'value' in value) return value.value;
  return value;
}

function normalizeOptions(options) {
  if (!Array.isArray(options)) return [];
  if (!options.length) return [];
  if (typeof options[0] === 'string') return options.filter((i) => typeof i === 'string');
  if (typeof options[0] === 'object') {
    return options
      .map((i) => {
        const label = i?.label ?? i?.name ?? i?.text ?? i?.title ?? '';
        const value = i?.value ?? i?.id ?? i?.key ?? label;
        if (!label && (value === undefined || value === null || value === '')) return null;
        return { label: String(label || value), value: String(value) };
      })
      .filter(Boolean);
  }
  return [];
}

function normalizeTemplateItem(item) {
  const next = { ...(item || {}) };

  if (next.operateType === 'custom') next.operateType = 'formCell';

  const originalType = next.type;
  const customTypeMap = {
    customerSource: 'select',
    customerStage: 'select',
    tag: 'multiSelectAndOther',
    reference: 'input',
    selectWwuser: 'select',
    files: 'files',
    corpProject: 'select',
    diagnosis: 'textarea',
    BMI: 'input',
    bloodPressure: 'textarea',
    selfMultipleDiseases: 'textarea',
  };
  if (originalType && customTypeMap[originalType]) {
    next.__originType = originalType;
    next.type = customTypeMap[originalType];
  }

  const aliasTypeMap = {
    text: 'input',
    string: 'input',
    number: 'input',
    integer: 'input',
    int: 'input',
  };
  if (next.type && aliasTypeMap[next.type]) {
    next.type = aliasTypeMap[next.type];
    if (!next.inputType && (originalType === 'number' || originalType === 'integer' || originalType === 'int')) next.inputType = 'number';
  }

  const rawRange = next.range || next.options || next.optionList || next.values || [];
  const range = normalizeOptions(rawRange);

  if (next.type === 'select' || next.type === 'selectAndOther' || next.type === 'selectAndImage') {
    next.range = range;
  } else if (next.type === 'radio') {
    // wxapp 目前 radio 组件只支持字符串列表；模板如为对象选项则降级为 select
    if (range.length && typeof range[0] === 'object') {
      next.type = 'select';
      next.range = range;
    } else {
      next.range = Array.isArray(rawRange) ? rawRange : [];
    }
  }

  if (!next.operateType) next.operateType = 'formCell';
  next.required = Boolean(next.required);

  if (next.type === 'input' && (next.wordLimit === undefined || next.wordLimit === null || next.wordLimit === '')) next.wordLimit = 20;
  if (next.type === 'textarea' && (next.wordLimit === undefined || next.wordLimit === null || next.wordLimit === '')) next.wordLimit = 200;
  return next;
}

async function loadBaseTemplate() {
  const corpId = String(account.value?.corpId || doctorInfo.value?.corpId || '') || '';
  if (!corpId) return;

  loading('加载中...');
  const res = await api('getCurrentTemplate', { corpId, templateType: 'baseTemplate' });
  hideLoading();

  if (!res?.success) {
    toast(res?.message || '获取模板失败');
    return;
  }

  const temp = res?.data && typeof res.data === 'object' ? res.data : res;
  const list = Array.isArray(temp.templateList) ? temp.templateList : [];
  baseItems.value = list
    .filter((i) => i && i.fieldStatus !== 'disable')
    .filter((i) => i.operateType !== 'onlyRead')
    .map(normalizeTemplateItem);

  const initialValue = { relationship: '本人', cardType: '身份证' };
  baseItems.value.forEach((i) => {
    const title = i?.title;
    if (!title) return;
    if (!(title in form) && initialValue[title] !== undefined) {
      form[title] = initialValue[title];
    }
  });

  const cachedTeam = uni.getStorageSync(CURRENT_TEAM_STORAGE_KEY) || {};
  if (cachedTeam?.teamId && !form.teamId) form.teamId = String(cachedTeam.teamId);
}

const rules = {
  idNo(value) {
    if (!value) return true;
    if (form.idType === '身份证' || form.cardType === '身份证') {
      const [ok, msg] = validate.isChinaId(value);
      if (!ok) return msg || '证件号格式不正确';
    }
    return true;
  },
  idCard(value) {
    if (!value) return true;
    if (form.cardType === '身份证' || form.idType === '身份证') {
      const [ok, msg] = validate.isChinaId(value);
      if (!ok) return msg || '证件号格式不正确';
    }
    return true;
  }
};

onLoad(async () => {
  const cached = uni.getStorageSync(STORAGE_KEY);
  if (cached && typeof cached === 'object') {
    Object.assign(form, cached);
  }

  if (!doctorInfo.value && account.value?.openid) {
    try {
      await getDoctorInfo();
    } catch (e) {
      // ignore
    }
  }
  await loadBaseTemplate();
});

function onChange({ title, value }) {
  form[title] = normalizeChangeValue(value);

  if (title === 'idCard' || title === 'idNo') handleIdCardChange(form[title]);
  else if (title === 'birthday') handleBirthdayChange(form[title]);
}

function cancel() {
  uni.navigateBack();
}

function next() {
  if (!formRef.value?.verify?.()) return;
  uni.setStorageSync(STORAGE_KEY, { ...form });
  uni.navigateTo({ url: '/pages/case/patient-inner-info' });
}

function handleBirthdayChange(value) {
  if (!value) return;
  if (!baseItems.value.some((i) => i?.title === 'age')) return;
  const d = dayjs(String(value));
  if (!d.isValid()) return;
  form.age = getAgeFromBirthday(d.format('YYYY-MM-DD'));
}

function handleIdCardChange(value) {
  if (!value) return;
  const [ok, birthday, gender] = validate.isChinaId(String(value));
  if (!ok) return;

  if (baseItems.value.some((i) => i?.title === 'cardType')) form.cardType = '身份证';
  if (baseItems.value.some((i) => i?.title === 'birthday')) form.birthday = birthday;
  if (baseItems.value.some((i) => i?.title === 'sex')) form.sex = gender === 'MALE' ? '男' : '女';
  if (baseItems.value.some((i) => i?.title === 'gender')) form.gender = gender === 'MALE' ? '男' : '女';
  if (baseItems.value.some((i) => i?.title === 'age')) form.age = getAgeFromBirthday(birthday);
}

function getAgeFromBirthday(birthday) {
  const d = dayjs(String(birthday));
  if (!d.isValid()) return '';
  const now = dayjs();
  let age = now.year() - d.year();
  if (now.isBefore(d.add(age, 'year'))) age -= 1;
  if (age < 0) age = 0;
  return String(age);
}
</script>

<style lang="scss" scoped>
.page {
  height: 100vh;
  background: #f6f6f6;
  display: flex;
  flex-direction: column;
}

.body {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.scroll {
  flex: 1;
  min-height: 0;
  height: 0;
}

.form-wrap {
  background: #fff;
}

.step-note {
  position: fixed;
  left: 50%;
  bottom: 92px;
  transform: translateX(-50%);
  background: #f2df52;
  color: #000;
  font-size: 14px;
  padding: 10px 16px;
  border-radius: 4px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18);
}

.footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
  display: flex;
  gap: 12px;
  z-index: 10;
  box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.06);
}

.scroll-spacer {
  height: calc(120px + env(safe-area-inset-bottom));
}

.btn {
  flex: 1;
  height: 44px;
  line-height: 44px;
  border-radius: 6px;
  font-size: 15px;
  text-align: center;
}

.btn::after {
  border: none;
}

.btn.plain {
  background: #fff;
  color: #666;
  border: 1px solid #ddd;
}

.btn.primary {
  background: #5d8aff;
  color: #fff;
}
</style>