医生端小程序 v1.2 1、复筛表单

src/doctor/screening/second/FormCont.vue

@@ -20,6 +20,43 @@
                     class='input-back mt-2 form-input'
                 />
             </div>
+
+            <div v-if='medicalHistoryShow'>
+                <div class='label-title mt-5'>病史</div>
+                <van-field
+                    v-model='form.medicalHistoryName'
+                    readonly
+                    is-link
+                    placeholder='请选择'
+                    class='input-back mt-2 form-input'
+                    :rules='rules.medicalHistoryName'
+                    @click='showMedicalHistory= true'
+                >
+                    <template #input>
+                        <span class='text-end' v-if='form.medicalHistoryName'>{{ form.medicalHistoryName }}</span>
+                        <span class='text-end' v-if='!form.medicalHistoryName' style='color: #dfdfe1'>请选择</span>
+                    </template>
+                </van-field>
+                <van-popup v-model:show='showMedicalHistory' position='bottom'>
+                    <div class='p-4' style='height: 100%'>
+                        <div class='flex justify-between items-center mb-4 pop-title'>
+                            <div class='greyColor' @click='showMedicalHistory = false' style='font-weight: 400'>取消</div>
+                            <div>病史（可多选）</div>
+                            <div class='blueColor' @click='medicalHistoryConfirm'>确定</div>
+                        </div>
+                        <div style='height: 80%;overflow: auto'>
+                            <CheckBtn multiple
+                                      column-1
+                                      :options='medicalHistoryList'
+                                      v-model:value='form.medicalHistory'
+                                      :fieldNames="{text: 'name', value: 'value'}"
+                                      @change="e => form.medicalHistory = checkboxReject(form.medicalHistory, [99])"
+                            />
+                        </div>
+                    </div>
+                </van-popup>
+            </div>
+
         </van-form>
 
 
@@ -30,6 +67,7 @@
 
 import { useStore } from '@/doctor/store'
 import { checkboxReject } from '@/utils/common'
+import CheckBtn from '@/doctor/components/checkBtn/CheckBtn'
 
 const defaultForm = (info = {}) => {
     const form = {
@@ -40,6 +78,7 @@ const defaultForm = (info = {}) => {
         gender: undefined,
         genderName: undefined,
         medicalHistory: [],
+        medicalHistoryName: undefined,
         familyHistory: [],
         relativeType: undefined,
         height: undefined,
@@ -101,6 +140,7 @@ const defaultForm = (info = {}) => {
     return form
 }
 export default {
+    components: { CheckBtn },
     props: {
         info: Object,
         diseaseArraysInfo: Array
@@ -108,6 +148,9 @@ export default {
     data() {
         return {
             store: useStore(),
+            //病史弹窗
+            showMedicalHistory: false,
+
             form: {},
             formRight: {
                 hypertensionHighItemSelect: [],
@@ -126,7 +169,7 @@ export default {
             imageData: [],
             rules: {
                 diseaseArrays: [{ required: true, message: '请选择' }],
-                medicalHistory: [{ required: true, message: '请选择' }],
+                medicalHistoryName: [{ required: true, message: '请选择' }],
                 familyHistory: [{ required: true, message: '请选择' }],
                 height: [
                     { required: true, message: '请输入' },
@@ -1453,6 +1496,20 @@ export default {
                 this.drinkKindCapacityList = []
             }
         },
+
+        //病史弹窗确认选择
+        medicalHistoryConfirm() {
+            let res = []
+            this.medicalHistoryList.forEach(item => {
+                let selected = this.form.medicalHistory.filter(i => i == item.value)
+                if (selected && selected.length) {
+                    res.push(item.name)
+                }
+            })
+            this.form.medicalHistoryName = res.join()
+            this.showMedicalHistory = false
+        },
+
         //提交
         submit() {
             return new Promise((resolve, reject) => {
@@ -1548,8 +1605,15 @@ export default {
     background: #FAFAFA;
 }
 
+.pop-title {
+    color: #262626;
+    font-size: 16px;
+    line-height: 24px;
+    font-weight: bold;
+}
+
 :deep(.van-popup) {
-    min-height: 30% !important;
+    height: 50% !important;
 }
 
 :deep(.van-cell-group--inset) {