专病随访表单开发

src/doctor/Doctor.vue

@@ -66,7 +66,7 @@ export default {
             if (!token) {
                 token = sessionStorage.getItem('token')
                 if (process.env.NODE_ENV !== 'production') {
-                    token = '1b8515e3-66a8-458b-b4d9-0cef6f73b8c1'
+                    token = '361df83a-2c4a-4e0d-9f31-24012976b993'
                 }
             }
             if (token) {

src/doctor/followUp/separateFU/form/BaseInfo.vue

+<template>
+    <van-form>
+        <div class="label-title" required>专病名称</div>
+        <van-field
+            v-model="form.diseaseTypeName"
+            isLink
+            readonly
+            placeholder="请选择"
+            :rules="rules.diseaseTypeName"
+            @click="showDiseaseType = true"
+            class="form-input"
+        />
+        <van-popup v-model:show="showDiseaseType" position="bottom">
+            <van-picker
+                :columns-field-names="{ text: 'name', value: 'value' }"
+                :columns="store.getDict('CP00117')"
+                @confirm="diseaseConfirm"
+                @cancel="showDiseaseType = false"
+            />
+        </van-popup>
+
+        <div class="label-title mt-5" required>请选择</div>
+        <van-field style="padding: 0" class="mb-5">
+            <template #input>
+                <van-radio-group
+                    v-model="form.serveType"
+                    shape="dot"
+                    direction="horizontal"
+                    class="doc-radio-group"
+                >
+                    <van-radio :name="3" label-position="left">新增专病随访（常规）</van-radio>
+                    <van-radio :name="4" label-position="left" class="mt-2">新增专病随访（增加）</van-radio>
+                </van-radio-group>
+            </template>
+        </van-field>
+
+        <!-- <div class="font-semibold mt-4">居民信息</div> -->
+        <!-- <div class="label-title mt-4" required>证件类型</div>
+        <van-field
+            v-model="form.certificateTypeName"
+            isLink
+            readonly
+            placeholder="请选择"
+            :rules="rules.certificateTypeName"
+            @click="showCertificateType = true"
+            class="form-input"
+        />
+        <van-popup v-model:show="showCertificateType" position="bottom">
+            <van-picker
+                :columns-field-names="{ text: 'name', value: 'value' }"
+                :columns="store.getDict('DC00004')"
+                @confirm="certificateConfirm"
+                @cancel="showDiseaseType = false"
+            />
+        </van-popup> -->
+        <ArchiveCommon ref="archive"></ArchiveCommon>
+    </van-form>
+</template>
+<script>
+import { useStore } from '@/doctor/store'
+import ArchiveCommon from '@/doctor/components/archiveCommon/archiveCommon.vue'
+export default {
+    components: { ArchiveCommon },
+    data() {
+        return {
+            store: useStore(),
+            form: {},
+            rules: {},
+            showDiseaseType: false,
+            showCertificateType: false
+        }     
+    },
+    methods: {
+        diseaseConfirm({ selectedValues, selectedOptions }) {
+            this.form.diseaseType = selectedValues[0]
+            this.form.diseaseTypeName = selectedOptions[0].name
+            this.showDiseaseType = false
+        },
+        certificateConfirm({ selectedValues, selectedOptions }) {
+            this.form.certificateType = selectedValues[0]
+            this.form.certificateTypeName = selectedOptions[0].name
+            this.showCertificateType = false
+        },
+        async onSubmit() {
+            let baseInfo = {}
+            try {
+                baseInfo = await this.$refs.archive.onSubmit()
+            } catch(e) {
+
+            }
+        }
+    }
+}
+</script>
+<style lang="less" scoped>
+.label-title {
+    font-size: 13px;
+    color: #595959;
+    font-weight: 500;
+    margin-bottom: 8px;
+    &[required] {
+        &::after {
+            content: '*';
+            color: #FF4D4F;
+            font-weight: bold;
+            margin-left: 4px;
+        }
+    }
+}
+.form-input {
+    background-color: #FAFAFA;
+    padding: 8px 12px;
+    border-radius: 8px;
+}
+:deep(.van-cell:after) {
+    border-bottom: 0px;
+}
+</style>
\ No newline at end of file

src/doctor/followUp/separateFU/form/FormCont.vue

+<template>
+    <div>
+        <HypertensionForm v-if="diseaseType === 1"></HypertensionForm>
+    </div>
+</template>
+<script>
+import HypertensionForm from './components/HypertensionForm.vue'
+export default {
+    components: { HypertensionForm },
+    data() {
+        return {
+            diseaseType: 1
+        }
+    }
+}
+</script>
\ No newline at end of file

src/doctor/followUp/separateFU/form/Index.vue

+<template>
+    <div>
+        <van-nav-bar
+            :title="routeQuery.id ? '修改专病随访' : '新增专病随访'"
+            left-arrow
+            @click-left="toBack">
+        </van-nav-bar>
+
+        <div class="p-4 h-overflow">
+            <BaseInfo v-if="step === 1" ref="baseInfo"></BaseInfo>
+            <FormCont v-if="step === 2"></FormCont>
+        </div>
+        <div class="bottom-small-line"></div>
+        <div class="p-4">
+            <van-button v-if="step === 1" type="primary" block round @click="toNext">下一步</van-button>
+            <van-button v-if="step === 2" type="primary" block round>提交</van-button>
+        </div>
+        
+    </div>
+</template>
+<script>
+import BaseInfo from './BaseInfo.vue'
+import FormCont from './FormCont.vue'
+export default {
+    components: { BaseInfo, FormCont },
+    data() {
+        return {
+            step: 1
+        }
+    },
+    computed: {
+        routeQuery() {
+            return this.$route.query
+        }
+    },
+    created() {
+
+    },
+    methods: {
+        toBack() {
+            this.$router.back()
+        },
+        async toNext() {
+            // this.$refs.baseInfo.onSubmit()
+            // console.log(666, obj)
+            this.step = 2
+        }
+    }
+}
+</script>
+<style lang="less" scoped>
+.h-overflow {
+    height: calc(100vh - 124px);
+    overflow: auto;
+}
+.bottom-small-line {
+    height: 1px;
+    box-shadow: 0 0.5Px #D7DADE;
+}
+</style>
\ No newline at end of file

src/doctor/followUp/separateFU/form/components/HypertensionForm.vue

+<template>
+    <van-form>
+        <div class="first-title">
+            <span class="font-semibold">随访信息</span>
+            <div class="btn-title">引入数据</div>
+        </div>
+        <div class="label-title mt-2" required>随访方式</div>
+        <van-field
+            v-model="form.visitWayName"
+            isLink
+            readonly
+            placeholder="请选择"
+            :rules="rules.visitWayName"
+            @click="showVisitWay = true"
+            class="form-input"
+        />
+        <van-popup v-model:show="showVisitWay" position="bottom">
+            <!-- <van-picker
+                :columns-field-names="{ text: 'name', value: 'value' }"
+                :columns="list"
+                @confirm="visitWayConfirm"
+                @cancel="showVisitWay = false"
+            /> -->
+            <div class="p-4" style="height: 100%">
+                <div class="flex justify-between items-center mb-4 pop-title">
+                    <div class="greyColor" @click="showVisitWay = false">取消</div>
+                    <div>随访方式（单选）</div>
+                    <div></div>
+                </div>
+                <div style="height: 80%; overflow: auto">
+                    <CheckBtn
+                        column-1
+                        :options="list"
+                        v-model:value="form.visitWay"
+                        :fieldNames="{ text: 'name', value: 'value' }"
+                        @change="visitWayChange"
+                    />
+                </div>
+            </div>
+        </van-popup>
+
+        <div class="label-title mt-2" required>采用纸质表格原因</div>
+        <van-field
+            v-model="form.paperReasonsName"
+            isLink
+            readonly
+            placeholder="请选择"
+            :rules="rules.paperReasonsName"
+            @click="showPaperReasons = true"
+            class="form-input"
+        />
+        <van-popup v-model:show="showPaperReasons" position="bottom">
+            <!-- <van-picker
+                :columns-field-names="{ text: 'name', value: 'value' }"
+                :columns="store.getDict('CP00055')"
+                @confirm="paperReasonsConfirm"
+                @cancel="showPaperReasons = false"
+            /> -->
+            <div class="p-4" style="height: 100%">
+                <div class="flex justify-between items-center mb-4 pop-title">
+                    <div class="greyColor" @click="showPaperReasons = false">取消</div>
+                    <div>采用纸质表格原因（单选）</div>
+                    <div></div>
+                </div>
+                <div style="height: 80%; overflow: auto">
+                    <CheckBtn
+                        column-1
+                        :options="store.getDict('CP00055')"
+                        v-model:value="form.paperReasons"
+                        :fieldNames="{ text: 'name', value: 'value' }"
+                        @change="paperReasonsChange"
+                    />
+                </div>
+            </div>
+        </van-popup>
+
+        <div class="label-title mt-2" required>症状</div>
+        <van-field
+            v-model="form.symptomName"
+            isLink
+            readonly
+            placeholder="请选择"
+            :rules="rules.symptomName"
+            @click="showSymptom = true"
+            class="form-input"
+        />
+        <van-popup v-model:show="showSymptom" position="bottom">
+            <van-picker
+                :columns-field-names="{ text: 'name', value: 'value' }"
+                :columns="store.getDict('CP00058')"
+                @confirm="symptomConfirm"
+                @cancel="showSymptom = false"
+            />
+        </van-popup>
+    </van-form>
+</template>
+<script>
+import { useStore } from '@/doctor/store'
+import CheckBtn from '@/doctor/components/checkBtn/CheckBtn.vue'
+export default {
+    components: { CheckBtn },
+    data() {
+        return {
+            store: useStore(),
+            form: {},
+            rules: {},
+            showVisitWay: false,
+            list: [
+                {
+                    value: 1,
+                    name: '面访（家庭）'
+                },
+                {
+                    value: 2,
+                    name: '面访（门诊）'
+                },
+                {
+                    value: 3,
+                    name: '远程视频随访'
+                },
+                {
+                    value: 4,
+                    name: '电话随访'
+                },
+                {
+                    value: 5,
+                    name: '面访先填纸质表格，后录入电子系统（家庭）'
+                },
+                {
+                    value: 6,
+                    name: '面访先填纸质表格，后录入电子系统（门诊）'
+                }
+            ],
+            showPaperReasons: false,
+            showSymptom: false
+        }
+    },
+    methods: {
+        visitWayChange() {
+            this.form.visitWayName = this.list.find(e => e.value === this.form.visitWay).name
+            this.showVisitWay = false
+        },
+        paperReasonsChange() {
+            // this.form.paperReasons = selectedValues[0]
+            // this.form.paperReasonsName = selectedOptions[0].name
+            // this.showPaperReasons = false
+            // this.form.paperReasonsName = this.store.getDict('CP00055').find(e => e.value === this.form.paperReasons).name
+            this.showPaperReasons = false
+            console.log(this.form.paperReasons)
+        },
+        symptomConfirm({ selectedValues, selectedOptions }) {
+            this.form.symptom = selectedValues[0]
+            this.form.symptomName = selectedOptions[0].name
+            this.showSymptom = false
+        }
+    }
+}
+</script>
+<style lang="less" scoped>
+.first-title {
+    display: flex;
+    align-items: center;
+    .btn-title {
+        background-color: #F0F3FF;
+        color: #607FF0;
+        border-radius: 9999px;
+        padding: 4px 16px;
+        margin-left: 8px;
+    }
+}
+.label-title {
+    font-size: 13px;
+    color: #595959;
+    font-weight: 500;
+    margin-bottom: 8px;
+    &[required] {
+        &::after {
+            content: '*';
+            color: #FF4D4F;
+            font-weight: bold;
+            margin-left: 4px;
+        }
+    }
+}
+.form-input {
+    background-color: #FAFAFA;
+    padding: 8px 12px;
+    border-radius: 8px;
+}
+:deep(.van-cell:after) {
+    border-bottom: 0px;
+}
+:deep(.van-popup) {
+    height: 50% !important;
+}
+.pop-title {
+    color: #262626;
+    font-size: 16px;
+    line-height: 24px;
+    font-weight: bold;
+}
+.greyColor {
+    color: var(--van-text-color-2);
+    font-weight: 400;
+}
+</style>
\ No newline at end of file

src/doctor/patientDetail/PatientDetail.vue

@@ -134,6 +134,7 @@ export default {
                 { name: '新增慢病诊断', value: 3, path: '/doctor/diagnose/form' },
                 { name: '新增通用随访', value: 4, path: '/doctor/followUp/generalFU/add' },
                 { name: '新增死亡记录', value: 5, path: '/doctor/deathRecord/add' },
+                { name: '新增专病随访', value: 6, path: '/doctor/followUp/separateFU/add' }
             ]
         }
     },

src/router/index.js

@@ -105,6 +105,12 @@ const routes = [
                 name: 'deathRecord-add',
                 component: () => import(/* webpackChunkName: "doctor" */ '@/doctor/deathRecord/form/Index.vue')
             },
+            // 专病随访
+            {
+                path: 'followUp/separateFU/add',
+                name: 'followUp-separateFU-add',
+                component: () => import(/* webpackChunkName: "doctor" */ '@/doctor/followUp/separateFU/form/Index')
+            }
         ]
     },
     {