居民信息表单

src/assets/css/base.less

@@ -34,6 +34,10 @@ body {
 // van组件样式调整
 // 表单
 .screen-form {
+    input::placeholder {
+        color: #999999;
+        float: right;
+    }
     .van-cell:after {
         transform: scaleY(1);
     }

src/assets/icons/doc-left.svg

+<svg width="9" height="18" viewBox="0 0 9 18" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9 16.4375L7.95453 17.5L0.280918 9.70137C-0.10202 9.31219 -0.102019 8.68781 0.280918 8.29863L7.95453 0.5L9 1.5625L1.68173 9L9 16.4375Z" fill-opacity="0.9"/>
+</svg>

src/components/docAddress/DocAddress.vue

 <template>
     <van-cascader class="address-select"
-        :closeable="false"
         v-model="innerValue"
         title="请选择所在地区"
         :options="areaData"
@@ -18,6 +17,7 @@ export default {
     props: {
         value: [String, Number],
         viewData: Array,
+        level: { default: 4 },
     },
     emits: ['update:value', 'change', 'close'],
     data() {
@@ -47,7 +47,7 @@ export default {
             const targetOption = options[options.length - 1]
             targetOption.loading = true
             getAreaChild(targetOption.value).then(res => {
-                targetOption.children = this.dataField(res || [], options.length === 4)
+                targetOption.children = this.dataField(res || [], options.length === this.level)
                 this.areaData = [...this.areaData]
             }).finally(() => {
                 targetOption.loading = false
@@ -73,7 +73,7 @@ export default {
                     const res = await getAreaChild(current.value)
                     const result = res || []
                     if (!result.length) break
-                    current.children = this.dataField(result, index === 4)
+                    current.children = this.dataField(result, index === this.level)
                     current = current.children.find(e => e.value === val[index])
                     this.areaData = [...this.areaData]
                     if (!current) break
@@ -91,13 +91,13 @@ export default {
             const targetOption = options[options.length - 1]
             if (tabIndex < 4 ) {
                 getAreaChild(val.value).then(res => {
-                    targetOption.children = this.dataField(res || [], options.length === 4)
+                    targetOption.children = this.dataField(res || [], options.length === this.level)
                     this.areaData = [...this.areaData]
                 })
             }
             this.$emit('update:value', val.value)
             this.$emit('change', val)
-            if (tabIndex === 4 ) {
+            if (tabIndex === this.level) {
                 this.$emit('close')
             }
         }
@@ -111,9 +111,11 @@ export default {
         },
         // 地址同步使用
         viewData(val) {
+            if (val) {
                 this.viewHandle(val)
             }
         }
+    }
 }
 </script>
 

src/resident/screening/first/form/IdCheck.vue

@@ -5,7 +5,8 @@
             <div class="px-4 font-semibold title">居民证件信息</div>
             <div class="text-12">请准确填写您的证件信息，标*内容为必填</div>
         </div>
-        <van-form label-width="5em" ref="form" input-align="right"
+        <van-form label-width="5em" ref="form"
+            error-message-align="right"
             class="screen-form">
             <van-field required
                 v-model="form.certificateTypeTrans"
@@ -17,7 +18,6 @@
                 disabled/>
             <van-field v-model="form.idCard"
                 required
-                center
                 clearable
                 name="idCard"  
                 label="证件号码"
@@ -36,7 +36,7 @@
             <div class="text-12 tip">提示：所填写的信息只用于慢病初筛，不会用于其他用途。</div>
         </div>
 
-        <div class="px-4 pb-4 grow flex flex-col justify-end">
+        <div class="px-5 pb-4 grow flex flex-col justify-end">
             <van-button type="primary" block round
                 @click="submit">下一步</van-button>
         </div>

src/resident/screening/first/form/Index.vue

@@ -38,12 +38,15 @@ export default {
             step: 1,
             setpHistory: [1],
             // 查询信息
-            checkInfo: {}
+            checkInfo: {},
+            // 表单暂时保存的信息
+            recordForm: {}
         }
     },
     provide() {
         return {
-            checkInfo: this.checkInfo
+            checkInfo: this.checkInfo,
+            recordForm: this.recordForm
         }
     },
     computed: {

src/resident/screening/first/form/ScreenInfo.vue

 <template>
     <div class="screen-info">
-        筛查信息
+        <div class="flex items-end py-4"
+            style="border-bottom: 1px solid var(--van-cell-border-color);">
+            <div class="px-4 font-semibold title">筛查信息</div>
+            <div class="text-12">请根据您身体实际情况填写以下内容</div>
+        </div>
     </div>
 </template>
 
@@ -11,5 +15,5 @@ export default {
 </script>
 
 <style lang="less" scoped>
-
+@import '../../../utils/common.less';
 </style>

src/resident/utils/common.less

@@ -7,7 +7,7 @@
         display: inline-block;
         background: var(--van-primary-color);
         height: 16px;
-        width: 4px;
-        margin-right: 4px;
+        width: 3px;
+        margin-right: 6px;
     }
 }
\ No newline at end of file

src/utils/common.js

@@ -36,7 +36,9 @@ export function fetchDataHandle(source = {}, obj = {}) {
     Reflect.ownKeys(obj).forEach(key => {
         // 数组 <=> 字符串
         if (obj[key] === 'arrToStr') {
-            result[key] = data[key] ? data[key].join(',') : ''
+            const temp = data[key] || []
+            temp.sort((a, b) => a - b)
+            result[key] = temp.join(',') || ''
         } else if (obj[key] === 'strToArr') {
             result[key] = data[key] ? data[key].split(',') : []
         } else if (obj[key] === 'strToArrNum') {
@@ -45,18 +47,27 @@ export function fetchDataHandle(source = {}, obj = {}) {
             // 地址数组 => 最后一级地址
             result[key] = data[key] ? data[key][data[key].length - 1] : ''
         } else if (obj[key] === 'addToArr') {
-            if (!data[key]) return []
-            // 最后一级地址 => 地址数组
-            if (data[key].length === 2) {
-                result[key] = [data[key]]
-                return
+            result[key] = addToArr(data[key])
+        }
+    })
+    return {
+        ...data,
+        ...result
+    }
+}
+
+// 最后一级地址 => 地址数组
+export function addToArr(str = '', level = 5) {
+    if (!str) return []
+    if (str.length === 2) {
+        return [str]
     }
     let temp = [
-                data[key].substring(0, 2),
-                data[key].substring(2, 4),
-                data[key].substring(4, 6),
-                data[key].substring(6, 9),
-                data[key].substring(9, 12),
+        str.substring(0, 2),
+        str.substring(2, 4),
+        str.substring(4, 6),
+        str.substring(6, 9),
+        str.substring(9, 12),
     ]
     temp = temp.filter(e => e !== '00' || e !== '000')
     const suffix = {1: '00000000', 2: '000000', 3: '000', 4: ''}
@@ -66,13 +77,7 @@ export function fetchDataHandle(source = {}, obj = {}) {
     for (let i = 1; i < temp.length; i++) {
         temp[i] = temp[i] + suffix[i]
     }
-            result[key] = temp
-        }
-    })
-    return {
-        ...data,
-        ...result
-    }
+    return temp.slice(0, level)
 }
 
 // 从身份证号获取基础信息

src/utils/commonReg.js

@@ -51,7 +51,9 @@ export const idCardRule = { validator: (value = '') => {
 
 // 5级地址校验
 export const addressValidator = { validator: (value) => {
-    if (!value || !value.length || value.length === 5) {
+    if (!value) return
+    const array = value.split('/')
+    if (!array.length || array.length === 5) {
         return
     }
     if (value.length < 5) {