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>
|