145 lines
3.2 KiB
Vue
145 lines
3.2 KiB
Vue
<template>
|
||
<view class="page">
|
||
<view class="body">
|
||
<scroll-view scroll-y class="scroll">
|
||
<view class="form-wrap">
|
||
<form-template v-if="items.length" ref="formRef" :items="items" :form="form" :rule="rules" @change="onChange" />
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<view class="footer">
|
||
<button class="btn plain" @click="cancel">取消</button>
|
||
<button class="btn primary" @click="save">完成</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { reactive, ref } from 'vue';
|
||
import { onLoad } from '@dcloudio/uni-app';
|
||
import FormTemplate from '@/components/form-template/index.vue';
|
||
|
||
const BASE_KEY = 'patient-create-base';
|
||
const INNER_KEY = 'patient-create-inner';
|
||
|
||
const formRef = ref(null);
|
||
|
||
const form = reactive({
|
||
customerSource: '',
|
||
firstVisitDate: '',
|
||
diseaseTag: '',
|
||
remark: ''
|
||
});
|
||
|
||
const items = [
|
||
{ title: 'customerSource', name: '患者来源', type: 'select', operateType: 'formCell', required: false, range: ['线上咨询', '同事推荐', '客户推荐', '其他'] },
|
||
{ title: 'firstVisitDate', name: '首次就诊日期', type: 'date', operateType: 'formCell', required: false },
|
||
{ title: 'diseaseTag', name: '慢病标签', type: 'select', operateType: 'formCell', required: false, range: ['糖尿病', '高血压', '冠心病', '慢阻肺'] },
|
||
{ title: 'remark', name: '备注', type: 'textarea', operateType: 'formCell', required: false, wordLimit: 200 }
|
||
];
|
||
|
||
const rules = {};
|
||
|
||
onLoad(() => {
|
||
const base = uni.getStorageSync(BASE_KEY);
|
||
if (!base || typeof base !== 'object') {
|
||
uni.showToast({ title: '请先填写基础信息', icon: 'none' });
|
||
uni.navigateBack();
|
||
return;
|
||
}
|
||
|
||
const cached = uni.getStorageSync(INNER_KEY);
|
||
if (cached && typeof cached === 'object') {
|
||
Object.assign(form, cached);
|
||
}
|
||
});
|
||
|
||
function onChange({ title, value }) {
|
||
form[title] = value;
|
||
}
|
||
|
||
function cancel() {
|
||
uni.navigateBack();
|
||
}
|
||
|
||
function save() {
|
||
if (formRef.value?.verify && !formRef.value.verify()) return;
|
||
|
||
const base = uni.getStorageSync(BASE_KEY) || {};
|
||
const payload = { ...base, ...form };
|
||
|
||
uni.setStorageSync(INNER_KEY, { ...form });
|
||
|
||
// 这里后续对接真实新增接口：payload 即最终提交数据
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '已完成新增（mock）。后续将对接真实建档接口。',
|
||
showCancel: false,
|
||
success: () => {
|
||
uni.removeStorageSync(BASE_KEY);
|
||
uni.removeStorageSync(INNER_KEY);
|
||
// 返回到病例列表
|
||
uni.navigateBack({ delta: 2 });
|
||
}
|
||
});
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.page {
|
||
height: 100vh;
|
||
background: #f6f6f6;
|
||
}
|
||
|
||
.body {
|
||
height: 100vh;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.scroll {
|
||
flex: 1;
|
||
}
|
||
|
||
|
||
.form-wrap {
|
||
background: #fff;
|
||
}
|
||
|
||
.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;
|
||
box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.06);
|
||
}
|
||
|
||
.btn {
|
||
flex: 1;
|
||
height: 44px;
|
||
line-height: 44px;
|
||
border-radius: 6px;
|
||
font-size: 15px;
|
||
}
|
||
|
||
.btn::after {
|
||
border: none;
|
||
}
|
||
|
||
.btn.plain {
|
||
background: #fff;
|
||
color: #666;
|
||
border: 1px solid #ddd;
|
||
}
|
||
|
||
.btn.primary {
|
||
background: #5d8aff;
|
||
color: #fff;
|
||
}
|
||
</style>
|