Merge branch 'feature/insurance-h5-0718' into 'release'

多证件

See merge request !264

.env.dev

@@ -2,6 +2,9 @@ NODE_ENV=production
 # 自定义 VUE_APP_ENV
 VUE_APP_ENV ='dev'
 
+# 微信小程序的环境变量
+VUE_APP_MINI_PROGRAM_ENV = 'trial'
+
 VUE_APP_SERVICE_URL=https://dev-sc.yunqueyi.com
 
 # 阿里云OSS对象存储地址

.env.development.local

 NODE_ENV=development
 VUE_APP_ENV=development
-
+VUE_APP_MINI_PROGRAM_ENV='trial'
 VUE_APP_SERVICE_URL=
 
 # 模拟用户信息

.env.production

@@ -3,6 +3,9 @@ NODE_ENV=production
 # 自定义 VUE_APP_ENV
 VUE_APP_ENV ='production'
 
+# 微信小程序的环境变量
+VUE_APP_MINI_PROGRAM_ENV = 'release'
+
 VUE_APP_SERVICE_URL=https://sc.yunqueyi.com
 
 # 阿里云OSS对象存储地址

.env.testing

@@ -3,6 +3,9 @@ NODE_ENV=production
 # 自定义 VUE_APP_ENV
 VUE_APP_ENV ='production'
 
+# 微信小程序的环境变量
+VUE_APP_MINI_PROGRAM_ENV='trial'
+
 VUE_APP_SERVICE_URL=https://test1-sc.yunqueyi.com
 # 阿里云OSS对象存储地址
 VUE_APP_OSS_URL=https://pica-h5-test.yunqueyi.com/

README.md

 # pica-insurance
 > 请先查看每个目录的 md 文件
 
+## 仓库入口
+[pica-insurance](http://192.168.110.53/com.pica.cloud.frontend/pica-insurance)
+
 ## 启动
 ```shell script
 npm run start

imgMd5List.json

+{"9df2e49807c0fb85a7c17c755b86d4d7":"/Users/picahealth/works/pica-insurance/src/assets/logo.png","758b3ee484912d18635bdb57a579da59":"/Users/picahealth/works/pica-insurance/src/assets/images/arrow.png","6d1ef277c0b674cfafec0d894ad92a8c":"/Users/picahealth/works/pica-insurance/src/assets/images/bg-login.png","8b3fad76f68143f9d8e301ea21e27df3":"/Users/picahealth/works/pica-insurance/src/assets/images/close.png","7555ad3c7d6b640d44478adbe5658060":"/Users/picahealth/works/pica-insurance/src/assets/images/demo-bg.png","7fea351023298066f0d129f8d87d8fd3":"/Users/picahealth/works/pica-insurance/src/assets/images/icon-4.png","ff2f6fc418813d788e9fe3b574b0b189":"/Users/picahealth/works/pica-insurance/src/assets/images/loginicon.png","c2a3ed40e3889561bbd48cd5ab394885":"/Users/picahealth/works/pica-insurance/src/assets/images/nodata.png","b84ede3eebf479010ae4a8ce93688e16":"/Users/picahealth/works/pica-insurance/src/assets/images/slide-icon.png","2cb58967532667c6b5eff92f43c9ef51":"/Users/picahealth/works/pica-insurance/src/assets/images/slide-ok.png"}
\ No newline at end of file

src/api/entitlement.js

@@ -2,13 +2,13 @@ import request from 'mn-template/plugins/http';
 
 // 获取权益列表
 export const getEntitlementList = async (externalOrderNo, projectEquityNo) => {
-    return request({
-      method: 'get',
-      url: `/tis/insurance/projectEquityNo/externalOrderNo?externalOrderNo=${externalOrderNo}&projectEquityNo=${projectEquityNo}`,
-      withCredentials: true,
-      hasLoading:true,
-    });
-  };
+  return request({
+    method: 'get',
+    url: `/tis/insurance/projectEquityNo/externalOrderNo?externalOrderNo=${externalOrderNo}&projectEquityNo=${projectEquityNo}`,
+    withCredentials: true,
+    hasLoading: true,
+  });
+};
 
 // 获取banner
 export const getBanner = async (pageType, yunOrderNo) => {
@@ -16,6 +16,15 @@ export const getBanner = async (pageType, yunOrderNo) => {
     method: 'get',
     url: `/tis/insurance/explain/${yunOrderNo}/${pageType}`,
     withCredentials: true,
-    hasLoading:true,
+    hasLoading: true,
+  });
+};
+
+// 查询证件类型字典的接口
+export const getCardTypes = () => {
+  return request({
+    url: 'basic-data/constants/app?typeCodeList=P333',
+    method: 'get',
+    withCredentials: true,
   });
 };

src/main.js

-import { router, store, vueApp } from '@pica-cli/vue-cli-plugin-pica-cli-plugin/auto';
+import {
+  router,
+  store,
+  vueApp,
+} from '@pica-cli/vue-cli-plugin-pica-cli-plugin/auto';
 import * as dd from 'dingtalk-jsapi';
 import '@/router';
 console.log('router, store, vueApp: ', router, store, vueApp);
 import '@/assets/js/flexible';
-import {isWeixin } from './utils/index';
+import { isWeixin } from './utils/index';
 import Loading from '@/components/loading/loading.js';
 import CryptoJS from 'crypto-js/crypto-js';
 import JsEncrypt from 'jsencrypt/bin/jsencrypt';
@@ -39,22 +43,21 @@ document.documentElement.addEventListener(
     passive: false,
   }
 );
-
+console.log('z', vueApp.$rocNative);
 vueApp.$rocNative.appInit();
 vueApp.$rocNative.on('wx_ready', function () {
   console.log('-wx_ready-', window._picaWechat);
   // 初始化wx jssdk 后 执行 脚手架将 wx 对象挂在到 $rocNative对象上，后执行  小程序环境判断方法 miniProgram.getEnv
-  vueApp.$rocNative.WXInstance.miniProgram.getEnv(function(res) {
+  vueApp.$rocNative.WXInstance.miniProgram.getEnv(function (res) {
     console.log('_miniprogram', res.miniprogram); // true
     window._miniprogram = res.miniprogram;
   });
-
 });
 console.log('---', isWeixin());
-if(isWeixin()) {
+if (isWeixin()) {
   window._picaWechat = 'wechat';
 }
-if(dd.env.version) {
+if (dd.env.version) {
   window._picaWechat = 'dingtalk';
 }
 
@@ -63,7 +66,7 @@ sessionStorage.setItem('headerHeight', 0);
 window.Vue.use(Loading);
 // 设置安全密钥
 window._AMapSecurityConfig = {
-  securityJsCode: 'f5093bfce95bd0393749259bcc44ede8'
+  securityJsCode: 'f5093bfce95bd0393749259bcc44ede8',
 };
 
 console.log('router, store, vueApp: ', router, store, vueApp);

src/views/appoint/index.vue

@@ -6,12 +6,12 @@
       :header-info="headerInfo"
     />
     <div class="wrap">
-      <!-- <div class="title-1">
+      <div class="title-1">
         检测预约
       </div>
       <div class="title-2">
         及时接受检测结果检测报告
-      </div> -->
+      </div>
       <div class="choose-section">
         <van-form
           ref="dectionForm"
@@ -23,14 +23,13 @@
             required
           >
             <template #input>
-              <span style="font-weight:600">{{ dectionForm.detectName }}</span>
+              <span style="font-weight: 600">{{ dectionForm.detectName }}</span>
             </template>
           </van-field>
           <van-field
             label="受检人信息"
             required
             disabled
-
             class="appoint-form-title"
           />
           <van-field
@@ -40,14 +39,17 @@
             clearable
             class="appoint-form-items"
             placeholder="请输入受检人姓名"
-            :rules="[{ required: true, message: '请输入受检人姓名' },{
-                       pattern: /^[\u4e00-\u9fa5_a-zA-Z0-9]+$/,
-                       message: '请输入正确格式',
-                     },
-                     {
-                       pattern: /^.{2,20}$/,
-                       message: '受检人姓名请填写2-20位',
-                     },]"
+            :rules="[
+              { required: true, message: '请输入受检人姓名' },
+              {
+                pattern: /^[\u4e00-\u9fa5_a-zA-Z0-9]+$/,
+                message: '请输入正确格式',
+              },
+              {
+                pattern: /^.{2,20}$/,
+                message: '受检人姓名请填写2-20位',
+              },
+            ]"
           />
           <van-field
             v-model="dectionForm.beneficiaryPhone"
@@ -56,11 +58,13 @@
             label="手机号"
             clearable
             placeholder="请输入受检人手机号"
-            :rules="[{ required: true, message: '请输入受检人手机号' },
-                     {
-                       pattern: /^([1][3,4,5,6,7,8,9])\d{9}$/,
-                       message: '手机号格式填写有误',
-                     },]"
+            :rules="[
+              { required: true, message: '请输入受检人手机号' },
+              {
+                pattern: /^([1][3,4,5,6,7,8,9])\d{9}$/,
+                message: '手机号格式填写有误',
+              },
+            ]"
           />
           <van-field
             v-model="dectionForm.beneficiaryIdNum"
@@ -69,11 +73,13 @@
             clearable
             label="身份证号"
             placeholder="请输入受检人真实身份证号"
-            :rules="[{ required: true, message: '请输入受检人真实身份证号' },
-                     {
-                       pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
-                       message: '身份证号格式填写有误',
-                     },]"
+            :rules="[
+              { required: true, message: '请输入受检人真实身份证号' },
+              {
+                pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
+                message: '身份证号格式填写有误',
+              },
+            ]"
           />
           <van-field
             label="检测地点"
@@ -135,7 +141,6 @@
             label="预约时间"
             required
             right-icon="arrow"
-
             @click="showPopup('showSelectTime')"
           >
             <template #input>
@@ -160,15 +165,15 @@
         block
         type="info"
         :disabled="!canSubmit"
-        class="appoint-form-submit "
-        :class="canSubmit ? 'appoint-form-submit-active':''"
+        class="appoint-form-submit"
+        :class="canSubmit ? 'appoint-form-submit-active' : ''"
         @click="appointment"
       >
         提交
       </van-button>
       <div class="appoint-tel">
         客服电话：<a
-          style="font-weight:600"
+          style="font-weight: 600"
           href="tel:400-006-5252"
         >400-021-8282</a>
         <div class="serve-time">
@@ -199,18 +204,21 @@
       @confirm="confirm"
       @close="closePopup"
     />
-    <div
-      id="container"
-    />
+    <div id="container" />
   </div>
 </template>
 
 <script>
-import {getDetectionName, getOrderInfo, appointment, getHospitalList} from '@/api/appoint';
+import {
+  getDetectionName,
+  getOrderInfo,
+  appointment,
+  getHospitalList,
+} from '@/api/appoint';
 import SelectHospital from '@/components/selectHospital/index.vue';
 import SelectTime from '@/components/selectTime/index.vue';
 import PickArea from '@/components/pickArea/index.vue';
-import { getJumpPageStatus, getButtonStatus} from '@/api/question';
+import { getJumpPageStatus, getButtonStatus } from '@/api/question';
 import storejs from 'storejs';
 import dayjs from 'dayjs';
 import AMapLoader from '@amap/amap-jsapi-loader';
@@ -218,11 +226,11 @@ export default {
   components: {
     SelectHospital,
     SelectTime,
-    PickArea
+    PickArea,
   },
   data() {
     return {
-      picaWechat:window._picaWechat,
+      picaWechat: window._picaWechat,
       headerInfo: {
         title: '检测服务',
         isBlack: true,
@@ -230,21 +238,21 @@ export default {
         style: 'backgroundColor:#ffffff;zIndex:100;',
         background: '',
       },
-      dectionData:{},
+      dectionData: {},
       dectionForm: {
         detectName: '',
-        beneficiaryIdNum:'',
+        beneficiaryIdNum: '',
         beneficiaryName: '',
         appointmentTime: '',
         currentDate: '',
         timeBucket: '',
         beneficiaryPhone: '',
-        hospitalName:'',
+        hospitalName: '',
         goodsId: '',
       },
-      showAreaLabel:'',
-      showselectHospital:false,
-      showArea:false,
+      showAreaLabel: '',
+      showselectHospital: false,
+      showArea: false,
       reportShow: false,
       placeList: [],
       popType: '',
@@ -260,14 +268,14 @@ export default {
         value: [],
         label: '',
       },
-      geolocation:null,
+      geolocation: null,
       isShowAddress: false,
-      showSelectTime:false,
+      showSelectTime: false,
       isSelf: false,
       spEquityCode: '',
       position: {
         latitude: '',
-        longitude:''
+        longitude: '',
       },
       locationAreaCode: [],
       hospitalId: '',
@@ -275,7 +283,7 @@ export default {
       yunOrderNo: '',
       externalData: {
         latitude: '',
-        longitude:'',
+        longitude: '',
         provinceId: '',
         countyId: '',
         cityId: '',
@@ -310,14 +318,14 @@ export default {
     this.projectEquityNo = projectEquityNo;
     console.log('yunOrderNo', yunOrderNo);
     const data = {
-        yunOrderNo,
-        projectEquityNo:'',
-        externalOrderNo:'',
-      };
+      yunOrderNo,
+      projectEquityNo: '',
+      externalOrderNo: '',
+    };
     this.$sendBuriedData({
       action: 'ACTION_WEB_AFTER',
       component_tag: '7802852#0#0#预约',
-      web_data:{yunOrderNo: yunOrderNo},
+      web_data: { yunOrderNo: yunOrderNo },
     });
     this.getDetectionName(yunOrderNo);
     this.getOrderInfo(yunOrderNo);
@@ -328,7 +336,7 @@ export default {
   methods: {
     // 判断 库存
     getJumpPageStatus(data) {
-      getJumpPageStatus(data).then(res => {
+      getJumpPageStatus(data).then((res) => {
         if (res.code == '000000') {
           this.stock = res.data.stock;
           this.isDisabled = !this.stock;
@@ -344,10 +352,10 @@ export default {
     initMap() {
       const that = this;
       AMapLoader.load({
-        key:'c6636583d8d2991af64c9f7253e1a25b', // 申请好的Web端开发者Key，首次调用 load 时必填
-        plugins:[''], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+        key: 'c6636583d8d2991af64c9f7253e1a25b', // 申请好的Web端开发者Key，首次调用 load 时必填
+        plugins: [''], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
       }).then((AMap) => {
-        AMap.plugin('AMap.Geolocation', function() {
+        AMap.plugin('AMap.Geolocation', function () {
           var geolocation = new AMap.Geolocation({
             // 是否使用高精度定位，默认：true
             enableHighAccuracy: true,
@@ -358,12 +366,15 @@ export default {
             //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
             zoomToAccuracy: true,
             //  定位按钮的排放位置,  RB表示右下
-            buttonPosition: 'RB'
+            buttonPosition: 'RB',
           });
           geolocation.getCurrentPosition((status, result) => {
             console.log('geolocationgeolocation,', status, result.position);
             if (result.position) {
-              const position = { ...result.position, addr: result.formattedAddress };
+              const position = {
+                ...result.position,
+                addr: result.formattedAddress,
+              };
               that.position.latitude = result.position.lat || '';
               that.position.longitude = result.position.lng || '';
               storejs.set('geolocation', position);
@@ -371,9 +382,7 @@ export default {
               storejs.remove('geolocation');
             }
             that.initHospitalList();
-
           });
-
         });
       });
     },
@@ -388,30 +397,40 @@ export default {
         const data = {
           projectEquityNo: this.projectEquityNo,
           latitude: this.position.latitude,
-          longitude:this.position.longitude,
+          longitude: this.position.longitude,
         };
         this.getHospitalList(data);
       }
-
     },
     //  根据坐标获取最近的机构id
     getHospitalList(data) {
-      getHospitalList(data).then(res => {
-        const { provinceId, countyId, cityId, hospitalName, hospitalId } = res.data.data[0];
-        console.log('getHospitalListposition', res.data.data[0], provinceId, countyId, cityId, hospitalName, hospitalId);
+      getHospitalList(data).then((res) => {
+        const { provinceId, countyId, cityId, hospitalName, hospitalId } =
+          res.data.data[0];
+        console.log(
+          'getHospitalListposition',
+          res.data.data[0],
+          provinceId,
+          countyId,
+          cityId,
+          hospitalName,
+          hospitalId
+        );
         this.locationAreaCode = [provinceId, cityId, countyId];
         this.dectionForm.hospitalName = hospitalName;
         this.hospitalId = hospitalId;
         this.externalData = {
           latitude: this.position.latitude,
-          longitude:this.position.longitude,
-          provinceId, countyId, cityId
+          longitude: this.position.longitude,
+          provinceId,
+          countyId,
+          cityId,
         };
       });
     },
     // 目前是配置一个检测信息，可能会拓展，所以返回的是一个list
     getDetectionName(yunOrderNo) {
-      getDetectionName(yunOrderNo).then(res => {
+      getDetectionName(yunOrderNo).then((res) => {
         if (res.code === '000000' && res.data) {
           const dectionData = res.data[0] || {};
           console.log('getDetectionName', dectionData);
@@ -419,30 +438,42 @@ export default {
           this.dectionForm.detectName = dectionData.detectionName;
           this.dectionForm.goodsId = dectionData.goodsId;
           this.$store.dispatch('home/setInsuranceInfo', dectionData);
-
         }
       });
     },
     // 获取订单信息
     getOrderInfo(yunOrderNo) {
-      getOrderInfo(yunOrderNo).then(res => {
+      getOrderInfo(yunOrderNo).then((res) => {
         console.log('getOrderInfo', res);
         this.dectionForm.beneficiaryName = res.data.beneficiaryName;
         this.dectionForm.beneficiaryPhone = res.data.beneficiaryPhone;
         this.dectionForm.beneficiaryIdNum = res.data.beneficiaryIdNum;
-        this.isDisabled = (this.dectionForm.beneficiaryName != '' && this.dectionForm.beneficiaryPhone != '' && this.dectionForm.beneficiaryIdNum != '') && (this.dectionForm.beneficiaryName && this.dectionForm.beneficiaryPhone && this.dectionForm.beneficiaryIdNum );
+        this.isDisabled =
+          this.dectionForm.beneficiaryName != '' &&
+          this.dectionForm.beneficiaryPhone != '' &&
+          this.dectionForm.beneficiaryIdNum != '' &&
+          this.dectionForm.beneficiaryName &&
+          this.dectionForm.beneficiaryPhone &&
+          this.dectionForm.beneficiaryIdNum;
         this.$store.dispatch('home/setOrderInfo', res.data);
-
       });
     },
     selectTimes(times) {
       console.log(times);
-      const {value, currentItemChoosed} = times;
+      const { value, currentItemChoosed } = times;
       this.dectionForm.appointmentTime = value;
       this.closePopup('showSelectTime');
       // appointmentTimeShadow
-       const m = (Number(dayjs(currentItemChoosed.appointmentDate).month()) + 1) + '月' + (Number(dayjs(currentItemChoosed.appointmentDate).date())) + '日';
-      this.appointmentTimeShadow = m + ' ' + currentItemChoosed[currentItemChoosed.timeBucket + 'TimeContent'];
+      const m =
+        Number(dayjs(currentItemChoosed.appointmentDate).month()) +
+        1 +
+        '月' +
+        Number(dayjs(currentItemChoosed.appointmentDate).date()) +
+        '日';
+      this.appointmentTimeShadow =
+        m +
+        ' ' +
+        currentItemChoosed[currentItemChoosed.timeBucket + 'TimeContent'];
     },
     getTimes() {
       this.timsArray = [];
@@ -467,7 +498,6 @@ export default {
       if (this.stock) {
         this[name] = true;
       }
-
     },
     closePopup(name) {
       this[name] = false;
@@ -476,76 +506,78 @@ export default {
       this.$sendBuriedData({
         action: 'ACTION_WEB_CLICK',
         component_tag: '7802852#0#0#预约提交',
-        web_data:{yunOrderNo: this.yunOrderNo},
+        web_data: { yunOrderNo: this.yunOrderNo },
       });
 
-      this.$refs.dectionForm.validate().then(result => {
-        console.log('this.dectionForm', result);
-        const data = {
-          appointmentTime: this.dectionForm.appointmentTime,
-          goodsId: this.dectionForm.goodsId,
-          hospitalId: this.hospitalId,
-          hospitalName: this.dectionForm.hospitalName,
-          patientIdNo: this.dectionForm.beneficiaryIdNum,
-          patientMobile: this.dectionForm.beneficiaryPhone,
-          patientName: this.dectionForm.beneficiaryName,
-          yunOrderNo: this.yunOrderNo,
-          longitude: this.position.longitude || '',
-          latitude: this.position.latitude || '',
-
-        };
-        appointment(data).then(res => {
-          if (res.code === '000000') {
-            const l = window.location.origin;
-            const hr = l + `/pica-insurance/appoint-details?yunOrderNo=${this.yunOrderNo}&projectEquityNo=${this.projectEquityNo}`;
-            window.location.href = hr;
-            // this.$router.push({
-            //   path: '/appoint-details',
-            //   query: {
-            //     yunOrderNo: this.yunOrderNo,
-            //     projectEquityNo:this.projectEquityNo
-            //   }
-            // });
-          } else {
-            res.message && this.$toast(res.message);
-          }
+      this.$refs.dectionForm
+        .validate()
+        .then((result) => {
+          console.log('this.dectionForm', result);
+          const data = {
+            appointmentTime: this.dectionForm.appointmentTime,
+            goodsId: this.dectionForm.goodsId,
+            hospitalId: this.hospitalId,
+            hospitalName: this.dectionForm.hospitalName,
+            patientIdNo: this.dectionForm.beneficiaryIdNum,
+            patientMobile: this.dectionForm.beneficiaryPhone,
+            patientName: this.dectionForm.beneficiaryName,
+            yunOrderNo: this.yunOrderNo,
+            longitude: this.position.longitude || '',
+            latitude: this.position.latitude || '',
+          };
+          appointment(data).then((res) => {
+            if (res.code === '000000') {
+              const l = window.location.origin;
+              const hr =
+                l +
+                `/pica-insurance/appoint-details?yunOrderNo=${this.yunOrderNo}&projectEquityNo=${this.projectEquityNo}`;
+              window.location.href = hr;
+              // this.$router.push({
+              //   path: '/appoint-details',
+              //   query: {
+              //     yunOrderNo: this.yunOrderNo,
+              //     projectEquityNo:this.projectEquityNo
+              //   }
+              // });
+            } else {
+              res.message && this.$toast(res.message);
+            }
+          });
+        })
+        .catch((err) => {
+          console.log(err);
         });
-
-      }).catch(err => {
-        console.log(err);
-      });
     },
     // 获取按钮状态
     getButtonStatus(yunOrderNo) {
-      getButtonStatus(yunOrderNo).then(res => {
+      getButtonStatus(yunOrderNo).then((res) => {
         console.log(res);
         this.$loading.hide();
         this.buttonStatus = res.data.buttonStatus;
         this.buttonText = res.data.statusDesc;
-        !this.buttonStatus && this.$dialog.alert({
-          message: this.buttonText,
-          confirmButtonColor:'#00bda5'
-        });
+        !this.buttonStatus &&
+          this.$dialog.alert({
+            message: this.buttonText,
+            confirmButtonColor: '#00bda5',
+          });
       });
     },
     confirm(values) {
       console.log('confirm', values);
       if (values) {
         console.log('confirm1', values);
-        this.showAreaLabel = values.map(ele => ele.name).join('');
+        this.showAreaLabel = values.map((ele) => ele.name).join('');
         this.externalData.provinceId = values[0].id;
         this.externalData.countyId = values[2].id;
         this.externalData.cityId = values[1].id;
         console.log('confirm1', this.externalData);
         this.showArea = false;
       }
-
     },
-    selectHospital({hospitalId, hospitalName}) {
+    selectHospital({ hospitalId, hospitalName }) {
       this.hospitalId = hospitalId;
       this.dectionForm.hospitalName = hospitalName;
       this.showselectHospital = false;
-
     },
     showAreaFn() {
       if (this.stock) {
@@ -556,7 +588,7 @@ export default {
       console.log('cleanHospitalId');
       this.hospitalId = '';
       this.dectionForm.hospitalName = '';
-    }
+    },
   },
 };
 </script>
@@ -568,7 +600,7 @@ export default {
   overflow: auto;
   box-sizing: border-box;
   color: #ffffff;
-  background: #F3FCFF;
+  background: #f3fcff;
 
   .bg-img {
     width: 100%;
@@ -591,15 +623,15 @@ export default {
     margin-top: 2px;
     font-size: 12px;
   }
-  .appoint-form-title{
+  .appoint-form-title {
     font-size: 14px;
-    font-family:  PingFang SC;
+    font-family: PingFang SC;
     font-weight: 400;
     color: #212121;
-    padding-top:22px ;
+    padding-top: 22px;
     padding-bottom: 0;
 
-    line-height: 20px
+    line-height: 20px;
   }
 
   .choose-section {
@@ -607,10 +639,10 @@ export default {
     background: #ffffff;
     border-radius: 11px;
     margin-top: 15px;
-    /deep/ .van-field__label{
+    /deep/ .van-field__label {
       color: #212121;
     }
-    /deep/ .van-field__control:disabled{
+    /deep/ .van-field__control:disabled {
       color: #323233;
       -webkit-text-fill-color: #323233;
     }
@@ -652,30 +684,29 @@ export default {
       color: rgba(255, 56, 56, 1);
     }
   }
-  .appoint-form-items{
+  .appoint-form-items {
     // font-weight: 600;
 
-    /deep/ .van-field__label{
+    /deep/ .van-field__label {
       color: #999999;
     }
-    /deep/ .van-field__control{
+    /deep/ .van-field__control {
       font-weight: 600;
     }
-    /deep/ .van-field__control::placeholder{
+    /deep/ .van-field__control::placeholder {
       font-weight: 450;
     }
-    .appoint-form-placeholder{
+    .appoint-form-placeholder {
       font-weight: 450;
     }
-
   }
-  .appoint-form-value{
-      font-weight: 600;
-    }
-  .appoint-form-placeholder{
+  .appoint-form-value {
+    font-weight: 600;
+  }
+  .appoint-form-placeholder {
     color: #999999;
   }
-  .appoint-form-title::after{
+  .appoint-form-title::after {
     display: none;
   }
   // .sub-btn {
@@ -809,19 +840,19 @@ export default {
   // /deep/ .van-field__control::placeholder{
   //   color: #999999;
   // }
-  .appoint-form-submit{
+  .appoint-form-submit {
     margin-top: 30px;
     height: 40px;
     font-weight: 600;
-    background: #D9D9D9;
+    background: #d9d9d9;
     border-radius: 20px;
-    border: 1px solid #D9D9D9;
+    border: 1px solid #d9d9d9;
   }
-  .appoint-form-submit-active{
-    background: #00BDA5;
-    border: 1px solid #00BDA5;
+  .appoint-form-submit-active {
+    background: #00bda5;
+    border: 1px solid #00bda5;
   }
-  .appoint-tel{
+  .appoint-tel {
     margin-top: 25px;
     font-size: 14px;
     font-family: PingFangSC-Regular, PingFang SC;
@@ -829,7 +860,7 @@ export default {
     color: #666666;
     line-height: 22px;
     text-align: center;
-    .serve-time{
+    .serve-time {
       display: flex;
       align-items: center;
       justify-content: center;
@@ -839,11 +870,11 @@ export default {
       font-weight: 400;
       color: #999999;
       line-height: 18px;
-      span{
+      span {
         width: 1px;
         height: 12px;
         margin: 0 12px;
-        background: #BBBBBB;
+        background: #bbbbbb;
       }
     }
   }
@@ -883,9 +914,9 @@ export default {
 .mpvue-picker-div-show {
   color: #000000;
 }
-#container{
+#container {
   display: none;
-  padding:0px;
+  padding: 0px;
   margin: 0px;
   width: 100%;
   height: 800px;

src/views/appointDetails/index.vue

@@ -18,7 +18,7 @@
           alt=""
         >
 
-        {{ !expireFlag ? statusMap(detailInfo.status):'已过期' }}
+        {{ !expireFlag ? statusMap(detailInfo.status) : '已过期' }}
       </div>
       <div class="detail-top insurance-detection">
         <div class="detection-title">
@@ -33,13 +33,13 @@
         <div class="detail-top-info">
           <div class="detail-top-address">
             <div class="detail-top-address-name">
-              {{ detailInfo.hospitalName || "--" }}
+              {{ detailInfo.hospitalName || '--' }}
             </div>
             <div class="detail-top-address-info">
               检验科/检验室/采血室
             </div>
             <div class="detail-top-address-info">
-              {{ detailInfo.hospitalAddress || "--" }}
+              {{ detailInfo.hospitalAddress || '--' }}
             </div>
 
             <div
@@ -61,7 +61,9 @@
             alt=""
           >
           <div
-            v-if="detailInfo.hospitalRemarks && detailInfo.hospitalRemarks !== ''"
+            v-if="
+              detailInfo.hospitalRemarks && detailInfo.hospitalRemarks !== ''
+            "
             class="detail-top-hospitalInfo"
           >
             <img
@@ -118,7 +120,7 @@
             参保人:
           </div>
           <div class="value">
-            {{ detailInfo.patientName || "--" }}
+            {{ detailInfo.patientName || '--' }}
           </div>
         </div>
         <div class="detail-bottom-item">
@@ -126,17 +128,15 @@
             检测名称:
           </div>
           <div class="value">
-            {{ detailInfo.detectName || "--" }}
+            {{ detailInfo.detectName || '--' }}
           </div>
         </div>
         <div class="detail-bottom-item">
           <div class="title">
             检测编号:
           </div>
-          <div
-            class="value"
-          >
-            {{ detailInfo.recordNo || "--" }}
+          <div class="value">
+            {{ detailInfo.recordNo || '--' }}
             <img
               class="value-copy"
               src="https://files.yunqueyi.com/image/png/common/20230301110919111.png"
@@ -151,10 +151,21 @@
             </text> -->
           </div>
         </div>
+        <div
+          v-if="detailInfo.helpDetectionFlag == 1"
+          class="detail-bottom-item"
+        >
+          <div class="title">
+            采集方式:
+          </div>
+          <div class="value">
+            现场检测
+          </div>
+        </div>
       </div>
       <div class="appoint-detail-tel">
         客服电话：<a
-          style="font-weight:600"
+          style="font-weight: 600"
           href="tel:400-021-8282"
         >400-021-8282</a>
         <div class="serve-time">
@@ -165,12 +176,13 @@
         v-if="!expireFlag"
         class="detail-btn-bottom"
       >
-        <div
-
-          class="detail-btn-bottom-tips"
-        >
+        <div class="detail-btn-bottom-tips">
           <van-icon name="warning-o" />
-          请按时前往预约地点，并绑定{{ insuranceInfo && insuranceInfo.detectionKind == 0 ? '采样码' : '条形码' }}
+          请按时前往预约地点，并绑定{{
+            insuranceInfo && insuranceInfo.detectionKind == 0
+              ? '采样码'
+              : '条形码'
+          }}
         </div>
         <div
           class="detail-btn btn-empty reAppoint"
@@ -182,7 +194,11 @@
           class="detail-btn"
           @click="bindingCode"
         >
-          绑定{{ insuranceInfo && insuranceInfo.detectionKind == 0 ? '采样码' : '条形码' }}
+          绑定{{
+            insuranceInfo && insuranceInfo.detectionKind == 0
+              ? '采样码'
+              : '条形码'
+          }}
         </div>
       </div>
       <div
@@ -209,14 +225,18 @@
 </template>
 
 <script>
-import {getDetailByYunOrderNo, getDetectionName, getDetailtxt} from '@/api/appoint';
+import {
+  getDetailByYunOrderNo,
+  getDetectionName,
+  getDetailtxt,
+} from '@/api/appoint';
 import storejs from 'storejs';
 import AMapLoader from '@amap/amap-jsapi-loader';
 import { mapGetters } from 'vuex';
 export default {
   data() {
     return {
-      picaWechat:window._picaWechat,
+      picaWechat: window._picaWechat,
       headerInfo: {
         title: '预约详情',
         isBlack: true,
@@ -224,19 +244,23 @@ export default {
         style: 'backgroundColor:#ffffff;zIndex:100;',
         background: '',
       },
-      actions: [{ name: '高德地图', value:1 }, { name: '腾讯地图', value:2 }, { name: '百度地图', value:3}],
+      actions: [
+        { name: '高德地图', value: 1 },
+        { name: '腾讯地图', value: 2 },
+        { name: '百度地图', value: 3 },
+      ],
       detailInfo: {},
-      showSsheet:false,
+      showSsheet: false,
       yunOrderNo: '',
       projectEquityNo: '',
-      expireFlag:false,
+      expireFlag: false,
       query: {},
-      isUnderLine:false,
-      insuranceText:{},
-      qrcodeUrl:'',
-      verificationCode:'',
-      intervalId:null,
-      status:'',
+      isUnderLine: false,
+      insuranceText: {},
+      qrcodeUrl: '',
+      verificationCode: '',
+      intervalId: null,
+      status: '',
     };
   },
   computed: {
@@ -244,12 +268,12 @@ export default {
   },
 
   created() {
-   this.dataRefreh();
-},
+    this.dataRefreh();
+  },
 
   mounted() {
     this.$loading.show();
-    const { yunOrderNo, projectEquityNo} = this.$route.query;
+    const { yunOrderNo, projectEquityNo } = this.$route.query;
     this.yunOrderNo = yunOrderNo;
     this.projectEquityNo = projectEquityNo;
     console.log('yunOrderNo', yunOrderNo);
@@ -259,24 +283,23 @@ export default {
     this.$sendBuriedData({
       action: 'ACTION_WEB_AFTER',
       component_tag: '7802855#0#0#预约详情',
-      web_data:{yunOrderNo: yunOrderNo},
+      web_data: { yunOrderNo: yunOrderNo },
     });
   },
 
   destroyed() {
-   this.clear();
+    this.clear();
   },
 
   methods: {
-
     // 定时刷新数据函数
-   dataRefreh() {
-     // 计时器正在进行中，退出函数
-     if (this.intervalId != null) {
+    dataRefreh() {
+      // 计时器正在进行中，退出函数
+      if (this.intervalId != null) {
         return;
-     }
+      }
       // 计时器为空，操作
-    this.intervalId = setInterval(() => {
+      this.intervalId = setInterval(() => {
         this.dataRefreh();
         this.getDetailByYunOrderNo(this.yunOrderNo);
       }, 3000);
@@ -284,43 +307,53 @@ export default {
 
     // 停止定时器
     clear() {
-      clearInterval(this.intervalId);// 清除计时器
+      clearInterval(this.intervalId); // 清除计时器
       this.intervalId = null; // 设置为null
     },
 
     getDetailByYunOrderNo(yunOrderNo) {
       console.log('appointDetail-yunOrderNo', yunOrderNo);
       const that = this;
-      getDetailByYunOrderNo(yunOrderNo).then(res => {
-        if(res.code == '000000') {
+      getDetailByYunOrderNo(yunOrderNo).then((res) => {
+        if (res.code == '000000') {
           console.log('appointDetail-orderInfo', res);
-          const {expireFlag, qrCodeUrl, verificationCode, status, detectionKind, detectionServiceRecordId, sampleCode, externalOrderNo, projectEquityNo} = res.data;
+          const {
+            expireFlag,
+            qrCodeUrl,
+            verificationCode,
+            status,
+            detectionKind,
+            detectionServiceRecordId,
+            sampleCode,
+            externalOrderNo,
+            projectEquityNo,
+          } = res.data;
           this.detailInfo = res.data;
           this.expireFlag = expireFlag || '';
           this.isUnderLine = res.data.detectionCategory == 2;
           this.qrcodeUrl = qrCodeUrl;
           this.verificationCode = verificationCode;
-          if(window._miniprogram) {
-            if(status != '0202') {
+          if (window._miniprogram) {
+            if (status != '0202') {
               let url;
-              if(detectionKind == 1) {
+              if (detectionKind == 1) {
                 url = `/pagesInsurance/sz-insurance/quick-detection-confirm-success?detectionRecordId=${detectionServiceRecordId}&projectEquityNo=${that.projectEquityNo}&yunOrderNo=${that.yunOrderNo}`;
               }
-              if(detectionKind == 0) {
+              if (detectionKind == 0) {
                 url = `/pages/health/detection-confirm-success/index?detectionRecordId=${detectionServiceRecordId}&yunOrderNo=${that.yunOrderNo}&code=${sampleCode}`;
               }
               this.clear();
-              this.$rocNative.WXInstance.miniProgram.redirectTo({url});
+              this.$rocNative.WXInstance.miniProgram.redirectTo({ url });
             }
-          }else{
-            if(status != '0202') {
+          } else {
+            if (status != '0202') {
               this.clear();
               this.$router.push({
                 path: `/home?externalOrderNo=${externalOrderNo}&projectEquityNo=${projectEquityNo}`,
               });
             }
           }
-        }else{
+        } else {
           this.$toast(res.message || '操作失败');
         }
         this.$loading.hide();
@@ -328,10 +361,10 @@ export default {
     },
     initMap() {
       AMapLoader.load({
-        key:'c6636583d8d2991af64c9f7253e1a25b', // 申请好的Web端开发者Key，首次调用 load 时必填
-        plugins:[''], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+        key: 'c6636583d8d2991af64c9f7253e1a25b', // 申请好的Web端开发者Key，首次调用 load 时必填
+        plugins: [''], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
       }).then((AMap) => {
-        AMap.plugin('AMap.Geolocation', function() {
+        AMap.plugin('AMap.Geolocation', function () {
           var geolocation = new AMap.Geolocation({
             // 是否使用高精度定位，默认：true
             enableHighAccuracy: true,
@@ -342,19 +375,20 @@ export default {
             //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
             zoomToAccuracy: true,
             //  定位按钮的排放位置,  RB表示右下
-            buttonPosition: 'RB'
+            buttonPosition: 'RB',
           });
           geolocation.getCurrentPosition((status, result) => {
             console.log('geolocationgeolocation,', status, result);
             if (result.position) {
-              const position = { ...result.position, addr: result.formattedAddress };
+              const position = {
+                ...result.position,
+                addr: result.formattedAddress,
+              };
               storejs.set('geolocation', position);
             } else {
               storejs.remove('geolocation');
             }
-
           });
-
         });
       });
     },
@@ -363,24 +397,23 @@ export default {
       this.$sendBuriedData({
         action: 'ACTION_WEB_CLICK',
         component_tag: '7802855#0#0#重新预约',
-        web_data:{yunOrderNo: this.yunOrderNo},
+        web_data: { yunOrderNo: this.yunOrderNo },
       });
-      const {detectionKind} = this.insuranceInfo;
+      const { detectionKind } = this.insuranceInfo;
       console.log('detectionKind--', detectionKind);
-        if (window._miniprogram) {
-          this.$rocNative.WXInstance.miniProgram.navigateTo({
-            url:`/pagesInsurance/sz-insurance/screeningAppoint?yunOrderNo=${that.yunOrderNo}&projectEquityNo=${this.projectEquityNo}`
-          });
-        }else{
-          this.$router.push({
-            path: '/appoint',
-            query: {
-              projectEquityNo:this.projectEquityNo,
-              yunOrderNo:this.yunOrderNo
-            }
-          });
-        }
-
+      if (window._miniprogram) {
+        this.$rocNative.WXInstance.miniProgram.navigateTo({
+          url: `/pagesInsurance/sz-insurance/screeningAppoint?yunOrderNo=${that.yunOrderNo}&projectEquityNo=${this.projectEquityNo}`,
+        });
+      } else {
+        this.$router.push({
+          path: '/appoint',
+          query: {
+            projectEquityNo: this.projectEquityNo,
+            yunOrderNo: this.yunOrderNo,
+          },
+        });
+      }
     },
     selectItem(item) {
       console.log('--$rocNative', this.$rocNative);
@@ -396,8 +429,8 @@ export default {
         // https://uri.amap.com/navigation
         switch (item.value) {
           case 1:
-          // navigation?from=116.478346,39.997361,startpoint&to=116.3246,39.966577,endpoint&via=116.402796,39.936915,midwaypoint&mode=car&policy=1&src=mypage&coordinate=gaode&callnative=0
-          // https://lbs.amap.com/api/uri-api/guide/mobile-web/point api地址
+            // navigation?from=116.478346,39.997361,startpoint&to=116.3246,39.966577,endpoint&via=116.402796,39.936915,midwaypoint&mode=car&policy=1&src=mypage&coordinate=gaode&callnative=0
+            // https://lbs.amap.com/api/uri-api/guide/mobile-web/point api地址
             url = `https://uri.amap.com/navigation?from=${geolocation.lng},${geolocation.lat},${geolocation.addr}&to=${longitude},${latitude},${hospitalName}&mode=car&policy=1&src=mypage&coordinate=gaode&callnative=0`;
             break;
           case 2:
@@ -407,7 +440,22 @@ export default {
             break;
           case 3:
             // https://lbsyun.baidu.com/index.php?title=uri/api/web
-            url = 'http://api.map.baidu.com/direction?origin=latlng:' + geolocation.lat + ',' + geolocation.lng + '|name:' + geolocation.addr + '&destination=latlng:' + latitude + ',' + longitude + '|name:' + hospitalName + '&region=' + geolocation.city + '&mode=driving&output=html&src=webapp.baidu.openAPIdemo&coord_type=gcj02';
+            url =
+              'http://api.map.baidu.com/direction?origin=latlng:' +
+              geolocation.lat +
+              ',' +
+              geolocation.lng +
+              '|name:' +
+              geolocation.addr +
+              '&destination=latlng:' +
+              latitude +
+              ',' +
+              longitude +
+              '|name:' +
+              hospitalName +
+              '&region=' +
+              geolocation.city +
+              '&mode=driving&output=html&src=webapp.baidu.openAPIdemo&coord_type=gcj02';
             break;
           default:
             url = `https://uri.amap.com/navigation?from=${geolocation.lng},${geolocation.lat},${geolocation.addr}&to=${longitude},${latitude},${hospitalName}&mode=car&policy=1&src=mypage&coordinate=gaode&callnative=0`;
@@ -417,26 +465,51 @@ export default {
         console.log(item);
         switch (item.value) {
           case 1:
-          // https://lbs.amap.com/api/uri-api/guide/mobile-web/point api地址
-            url = 'https://uri.amap.com/marker?&name=' + hospitalName + '&position=' + longitude + ',' + latitude + '&callnative=1';
+            // https://lbs.amap.com/api/uri-api/guide/mobile-web/point api地址
+            url =
+              'https://uri.amap.com/marker?&name=' +
+              hospitalName +
+              '&position=' +
+              longitude +
+              ',' +
+              latitude +
+              '&callnative=1';
             break;
           case 2:
             // https://lbs.qq.com/webApi/uriV1/uriGuide/uriWebMarker  api地址
-            url = 'https://apis.map.qq.com/uri/v1/geocoder?coord=' + latitude + ',' + longitude + '&referer=DJ6BZ-AU6E2-XMJUH-CZVD6-T2WQV-27F3S';
+            url =
+              'https://apis.map.qq.com/uri/v1/geocoder?coord=' +
+              latitude +
+              ',' +
+              longitude +
+              '&referer=DJ6BZ-AU6E2-XMJUH-CZVD6-T2WQV-27F3S';
             break;
           case 3:
             // https://lbsyun.baidu.com/index.php?title=uri/api/web api地址
-            url = 'http://api.map.baidu.com/marker?location=' + latitude + ',' + longitude + '&title=' + hospitalName + '&coord_type=gcj02&output=html&src=webapp.baidu.openAPIdemo';
+            url =
+              'http://api.map.baidu.com/marker?location=' +
+              latitude +
+              ',' +
+              longitude +
+              '&title=' +
+              hospitalName +
+              '&coord_type=gcj02&output=html&src=webapp.baidu.openAPIdemo';
             break;
           default:
-            url = 'https://uri.amap.com/marker?&name=' + hospitalName + '&position=' + longitude + ',' + latitude + '&callnative=1';
+            url =
+              'https://uri.amap.com/marker?&name=' +
+              hospitalName +
+              '&position=' +
+              longitude +
+              ',' +
+              latitude +
+              '&callnative=1';
             break;
         }
       }
       console.log('geolocation', url);
       // window.open(url);
       window.location.href = url;
-
     },
     bindingCode() {
       const { pprotocolType, detectionServiceRecordId } = this.detailInfo;
@@ -444,12 +517,12 @@ export default {
       this.$sendBuriedData({
         action: 'ACTION_WEB_CLICK',
         component_tag: '7802855#0#0#去绑定',
-        web_data:{yunOrderNo: this.yunOrderNo},
+        web_data: { yunOrderNo: this.yunOrderNo },
       });
       if (window._miniprogram) {
-        const {detectionKind} = this.insuranceInfo;
+        const { detectionKind } = this.insuranceInfo;
         this.$rocNative.WXInstance.miniProgram.navigateTo({
-          url:`/pages/health/binding-code/index?yunOrderNo=${this.yunOrderNo}&projectEquityNo=${this.projectEquityNo}&detectionRecordId=${detectionServiceRecordId}&pprotocolType=${pprotocolType}&channelSource=insurance_channel&detectionKind=${detectionKind}`
+          url: `/pages/health/binding-code/index?yunOrderNo=${this.yunOrderNo}&projectEquityNo=${this.projectEquityNo}&detectionRecordId=${detectionServiceRecordId}&pprotocolType=${pprotocolType}&channelSource=insurance_channel&detectionKind=${detectionKind}`,
         });
       } else {
         this.$router.push({
@@ -457,8 +530,8 @@ export default {
           query: {
             pprotocolType,
             detectionRecordId: detectionServiceRecordId,
-            yunOrderNo:this.yunOrderNo
-          }
+            yunOrderNo: this.yunOrderNo,
+          },
         });
       }
     },
@@ -475,7 +548,6 @@ export default {
       }
       this.initMap();
       this.showSsheet = true;
-
     },
     // 复制快递单号
     copyNum() {
@@ -492,7 +564,7 @@ export default {
       console.log('已复制的内容：', copyText);
     },
     getDetectionName(yunOrderNo) {
-      getDetectionName(yunOrderNo).then(res => {
+      getDetectionName(yunOrderNo).then((res) => {
         if (res.code === '000000' && res.data) {
           const dectionData = res.data[0] || {};
           this.$store.dispatch('home/setInsuranceInfo', dectionData);
@@ -537,12 +609,12 @@ export default {
     getDetailtxt() {
       const o = {
         yunOrderNo: this.yunOrderNo,
-        pageType: 1
+        pageType: 1,
       };
-      getDetailtxt(o).then(res => {
+      getDetailtxt(o).then((res) => {
         this.insuranceText = res.data;
       });
-    }
+    },
   },
 };
 </script>
@@ -553,24 +625,23 @@ export default {
   width: 100%;
   box-sizing: border-box;
   background: #f5f6f8;
-  background: linear-gradient(180deg, #00BDA5 0%, #20C5B0 125px, #F5F6F8 257px);
+  background: linear-gradient(180deg, #00bda5 0%, #20c5b0 125px, #f5f6f8 257px);
   padding: 20px 12px 160px;
   overflow: auto;
-  .detail-status{
+  .detail-status {
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 20px;
     font-family: PingFangSC-Medium, PingFang SC;
     font-weight: 500;
-    color: #FFFFFF;
+    color: #ffffff;
     line-height: 28px;
-    img{
+    img {
       width: 24px;
       height: 24px;
       margin-right: 6px;
     }
-
   }
 
   .detail-top {
@@ -580,7 +651,7 @@ export default {
     margin-bottom: 10px;
   }
 
-  .detail-qrcode-content{
+  .detail-qrcode-content {
     padding: 20px 0;
     border-radius: 11px;
     background: #fff;
@@ -590,10 +661,10 @@ export default {
     justify-content: center;
     margin-bottom: 10px;
 
-    .cancel-code{
+    .cancel-code {
       width: 165px;
       height: 31px;
-      background: #F9FAFB;
+      background: #f9fafb;
       border-radius: 15px;
       font-size: 14px;
       color: #666666;
@@ -602,7 +673,7 @@ export default {
       margin: 2px 0 4.5px 0;
     }
 
-    .tips{
+    .tips {
       width: 210px;
       height: 50px;
       font-size: 18px;
@@ -614,7 +685,7 @@ export default {
   }
 
   .detail-top-info {
-    background: #F9FAFB;
+    background: #f9fafb;
     border-radius: 11px;
     padding-bottom: 10px;
     .detail-top-img {
@@ -625,7 +696,7 @@ export default {
       height: 6px;
       margin-bottom: 10px;
     }
-    .detail-top-hospitalInfo{
+    .detail-top-hospitalInfo {
       position: relative;
       display: flex;
       padding-left: 27px;
@@ -636,7 +707,7 @@ export default {
       line-height: 19px;
       align-items: center;
 
-      img{
+      img {
         position: absolute;
         left: 12px;
         top: 1px;
@@ -674,7 +745,7 @@ export default {
     position: relative;
     padding: 15px 52px 6px 12px;
     .detail-top-address-name {
-      height:21px;
+      height: 21px;
       width: 257px;
       font-size: 14px;
       font-family: PingFangSC-Medium, PingFang SC;
@@ -717,7 +788,7 @@ export default {
     border-radius: 15px;
     padding: 15px 15px 1px 15px;
     margin-bottom: 10px;
-    .detail-bottom-title{
+    .detail-bottom-title {
       height: 25px;
       font-size: 18px;
       font-family: PingFangSC-Medium, PingFang SC;
@@ -769,7 +840,8 @@ export default {
         color: #212121;
         line-height: 21px;
         margin-bottom: 18px;
-        background: url('https://files.yunqueyi.com/image/png/common/20230301094652399.png') no-repeat center center;
+        background: url('https://files.yunqueyi.com/image/png/common/20230301094652399.png')
+          no-repeat center center;
         background-size: 213px 4px;
       }
       .tip-grey {
@@ -782,16 +854,15 @@ export default {
         line-height: 18px;
         margin-bottom: 10px;
       }
-      .tip-grey-dot{
+      .tip-grey-dot {
         position: absolute;
         width: 4px;
         height: 4px;
-        background: #FF720C;
+        background: #ff720c;
         opacity: 0.5;
         border-radius: 50%;
         left: 0;
         top: 7px;
-
       }
     }
   }
@@ -821,90 +892,90 @@ export default {
     right: 16px;
   }
 }
-.insurance-detection{
-    background: #FFFFFF;
-    border-radius: 11px;
-    padding: 20px 15px;
-    margin-top: 22px;
-    .detection-title{
-      height: 18px;
-      font-size: 13px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #666666;
-      line-height: 18px;
-      text-align: center;
-      margin-bottom: 1px;
-    }
-    .detection-time{
-      height: 30px;
-      font-size: 21px;
-      font-family: PingFangSC-Semibold, PingFang SC;
-      font-weight: 600;
-      color: #212121;
-      line-height: 30px;
-      text-align: center;
-      margin-bottom: 15px ;
-    }
-    .mb5{
-      margin-bottom: 5px ;
-    }
-  }
-  .appoint-detail-tel{
-    margin-top: 25px;
-    font-size: 14px;
+.insurance-detection {
+  background: #ffffff;
+  border-radius: 11px;
+  padding: 20px 15px;
+  margin-top: 22px;
+  .detection-title {
+    height: 18px;
+    font-size: 13px;
     font-family: PingFangSC-Regular, PingFang SC;
     font-weight: 400;
     color: #666666;
-    line-height: 22px;
+    line-height: 18px;
     text-align: center;
-    .serve-time{
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      height: 18px;
-      font-size: 13px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #999999;
-      line-height: 18px;
-      span{
-        width: 1px;
-        height: 12px;
-        margin: 0 12px;
-        background: #BBBBBB;
-      }
-    }
+    margin-bottom: 1px;
   }
-  .detail-btn-bottom{
-    position: fixed;
-    background: #fff;
-    left: 0;
-    width: calc(100vw - 24px);
-    bottom: 0;
-    padding:5px 12px 5px 12px ;
+  .detection-time {
+    height: 30px;
+    font-size: 21px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #212121;
+    line-height: 30px;
+    text-align: center;
+    margin-bottom: 15px;
+  }
+  .mb5 {
+    margin-bottom: 5px;
+  }
+}
+.appoint-detail-tel {
+  margin-top: 25px;
+  font-size: 14px;
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  color: #666666;
+  line-height: 22px;
+  text-align: center;
+  .serve-time {
     display: flex;
-    padding-bottom: calc(5px + env(safe-area-inset-bottom) / 2);
-    .detail-btn-bottom-tips{
-      position: absolute;
-      padding: 6px 0;
-      left: 0;
-      top: -30px;
-      width: 100vw;
-      height: 18px;
-      font-size: 13px;
-      font-family: PingFangSC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #FF720C;
-      line-height: 18px;
-      background: #FFFBE7;
-      text-align: center;
-    }
-    .reAppoint{
-      width: 155px;
-      margin-right:11px ;
-      border: 1px solid #C0C0C0;
-      color: #212121;
+    align-items: center;
+    justify-content: center;
+    height: 18px;
+    font-size: 13px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #999999;
+    line-height: 18px;
+    span {
+      width: 1px;
+      height: 12px;
+      margin: 0 12px;
+      background: #bbbbbb;
     }
   }
+}
+.detail-btn-bottom {
+  position: fixed;
+  background: #fff;
+  left: 0;
+  width: calc(100vw - 24px);
+  bottom: 0;
+  padding: 5px 12px 5px 12px;
+  display: flex;
+  padding-bottom: calc(5px + env(safe-area-inset-bottom) / 2);
+  .detail-btn-bottom-tips {
+    position: absolute;
+    padding: 6px 0;
+    left: 0;
+    top: -30px;
+    width: 100vw;
+    height: 18px;
+    font-size: 13px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #ff720c;
+    line-height: 18px;
+    background: #fffbe7;
+    text-align: center;
+  }
+  .reAppoint {
+    width: 155px;
+    margin-right: 11px;
+    border: 1px solid #c0c0c0;
+    color: #212121;
+  }
+}
 </style>

src/views/entitlement/list.vue

@@ -18,7 +18,13 @@
           </div>
           <div
             class="status"
-            :class="{particlar : (item.statusCode == '0204' || item.statusCode == '0905' || item.statusCode == '0904'), 'red-particlar':item.statusCode == '0305'}"
+            :class="{
+              particlar:
+                item.statusCode == '0204' ||
+                item.statusCode == '0905' ||
+                item.statusCode == '0904',
+              'red-particlar': item.statusCode == '0305',
+            }"
           >
             {{ item.statusTxt || '--' }}
           </div>
@@ -39,7 +45,7 @@
                 运单号：
               </div>
               <div class="value">
-                {{ item.expressNo || "--" }}
+                {{ item.expressNo || '--' }}
               </div>
             </div>
             <div class="item">
@@ -47,7 +53,7 @@
                 物流进度：
               </div>
               <div class="value">
-                {{ item.expressContent || "--" }}
+                {{ item.expressContent || '--' }}
               </div>
             </div>
           </div>
@@ -66,18 +72,21 @@
                 检测时间：
               </div>
               <div class="value">
-                {{ formatDate(item.detectionTime) || "--" }}
+                {{ formatDate(item.detectionTime) || '--' }}
               </div>
             </div>
           </div>
-
         </div>
-        <div
-          class="btn"
-        >
+        <div class="btn">
           <wx-open-launch-weapp
             :id="`launch-btn${index}`"
-            style="position: absolute; top: 0; left: 0; width: 100%; height: 100%"
+            style="
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+            "
             :username="openWebAppConfig.username"
             :path="`pagesInsurance/all-entrance/index?channelSource=insurance_channel&projectEquityNo=${item.projectEquityNo}&yunOrderNo=${item.yunOrderNoFirst_self}&detectionKind=${item.detectionKind}&tradeDetectionServiceRecordId=${item.tradeDetectionServiceRecordId}`"
             :env-version="envVersion"
@@ -105,82 +114,79 @@
   </div>
 </template>
 
-  <script>
-  import { formatDate } from '@/utils/common';
-  const { VUE_APP_ENV } = process.env;
-  import {getEntitlementList, getBanner} from '@/api/entitlement';
-  export default {
-    data() {
-      return {
-        bgPath: '',
-        entitlementList: [],
-        emptyIconPath: 'https://files.yunqueyi.com/image/png/common/20230602155400880.png',
-        envVersion: VUE_APP_ENV == 'production' ? 'release' : 'trial',
-        // envVersion: 'trial',
-        openWebAppConfig:{
-          username:'gh_e92f58174364', // 小程序唯一username  1.gh_80d54796f2d5 云鹊助手 2. gh_e92f58174364 云鹊健康
-          path:'pagesInsurance/all-entrance/index', // 打开页面
-          extraData: JSON.stringify({})
-        },
-        externalOrderNo:'',
-        projectEquityNo:'',
-        showDialog: false,
-      };
-    },
-    computed() {
+<script>
+import { formatDate } from '@/utils/common';
+import { getEntitlementList, getBanner } from '@/api/entitlement';
 
-    },
+export default {
+  data() {
+    return {
+      bgPath: '',
+      entitlementList: [],
+      emptyIconPath:
+        'https://files.yunqueyi.com/image/png/common/20230602155400880.png',
+      envVersion: process.env.VUE_APP_MINI_PROGRAM_ENV,
+      openWebAppConfig: {
+        username: 'gh_e92f58174364', // 小程序唯一username  1.gh_80d54796f2d5 云鹊助手 2. gh_e92f58174364 云鹊健康
+        path: 'pagesInsurance/all-entrance/index', // 打开页面
+        extraData: JSON.stringify({}),
+      },
+      externalOrderNo: '',
+      projectEquityNo: '',
+      showDialog: false,
+    };
+  },
+  computed() {},
 
-    mounted() {
-      const {externalOrderNo, projectEquityNo} = this.$route.query;
-      this.externalOrderNo = externalOrderNo;
-      this.projectEquityNo = projectEquityNo;
-      this.getBanner(6, projectEquityNo);
-      this.getEntitlementList(externalOrderNo, projectEquityNo);
-      this.monitorMiniProgram();
+  mounted() {
+    const { externalOrderNo, projectEquityNo } = this.$route.query;
+    this.externalOrderNo = externalOrderNo;
+    this.projectEquityNo = projectEquityNo;
+    this.getBanner(6, projectEquityNo);
+    this.getEntitlementList(externalOrderNo, projectEquityNo);
+    this.monitorMiniProgram();
+  },
+  methods: {
+    getBanner(pageType, yunOrderNo) {
+      const self = this;
+      self.$loading.show();
+      getBanner(pageType, yunOrderNo).then((res) => {
+        if (res.code === '000000') {
+          self.bgPath = res.data.logoUrl;
+          self.$loading.hide();
+        }
+      });
     },
-    methods:{
 
-      getBanner(pageType, yunOrderNo) {
-        const self = this;
-        self.$loading.show();
-        getBanner(pageType, yunOrderNo).then(res => {
-          if(res.code === '000000') {
-            self.bgPath = res.data.logoUrl;
-            self.$loading.hide();
-          }
-        });
-      },
-
-      monitorMiniProgram() {
-        const self = this;
-        document.addEventListener('visibilitychange', () => {
-          self.entitlementList = [];
-          if(document.visibilityState == 'visible') {
-            self.refreshList();
-          }
-        });
-      },
+    monitorMiniProgram() {
+      const self = this;
+      document.addEventListener('visibilitychange', () => {
+        self.entitlementList = [];
+        if (document.visibilityState == 'visible') {
+          self.refreshList();
+        }
+      });
+    },
 
-      refreshList() {
-        this.getEntitlementList(this.externalOrderNo, this.projectEquityNo);
-      },
+    refreshList() {
+      this.getEntitlementList(this.externalOrderNo, this.projectEquityNo);
+    },
 
-      formatDate(detectionTime) {
+    formatDate(detectionTime) {
       if (!detectionTime) {
         return '--';
       }
       return formatDate(detectionTime);
     },
 
-      getEntitlementList(externalOrderNo, projectEquityNo) {
-        const that = this;
-        // that.$loading.show();
-        getEntitlementList(externalOrderNo, projectEquityNo).then(res => {
+    getEntitlementList(externalOrderNo, projectEquityNo) {
+      const that = this;
+      // that.$loading.show();
+      getEntitlementList(externalOrderNo, projectEquityNo).then((res) => {
         if (res.code === '000000') {
-          if(res?.data.length > 0) {
+          if (res?.data.length > 0) {
             let arr = [];
-            arr = res.data.map( r => {
+            arr = res.data.map((r) => {
               // 0905已完成 0101未填写问卷 0102已填写问卷 0202已预约 0902已结束 0104待支付 0201待预约 0302已采样 0901 已出报告
               // 0903 待报销 0904 已报销
               switch (r.statusCode) {
@@ -245,21 +251,24 @@
               }
 
               // 已采样 单独处理
-              if(r.statusCode == '0302') {
-                if(r.detectionKind == 1) {
+              if (r.statusCode == '0302') {
+                if (r.detectionKind == 1) {
                   r.btnTxt = '上传结果';
-                }else{
+                } else {
                   r.btnTxt = '检测详情';
                 }
               }
 
-              r.title = r.detectionKind == 1 ? '癌症早早检权益领取' : '癌症早检权益领取';
+              r.title =
+                r.detectionKind == 1
+                  ? '癌症早早检权益领取'
+                  : '癌症早检权益领取';
               return r;
             });
             arr.map((item, index) => {
-              if(item.statusCode == '0101') {
+              if (item.statusCode == '0101') {
                 arr[index]['yunOrderNoFirst_self'] = item.yunOrderNoFirst;
-              }else{
+              } else {
                 arr[index]['yunOrderNoFirst_self'] = item.yunOrderNo;
               }
             });
@@ -271,132 +280,132 @@
               path: '/sz-public-new',
               query: {
                 externalOrderNo: externalOrderNo,
-                projectEquityNo:projectEquityNo,
+                projectEquityNo: projectEquityNo,
                 reload: 'reload',
-              }
+              },
             });
           }
           // that.$loading.hide();
         }
       });
     },
-    }
-  };
-  </script>
+  },
+};
+</script>
 <style lang="scss" scoped>
-  .page-entitlement {
-    width: 100%;
-    height: 100vh;
-    background: #f5f6f8;
-    overflow-y: auto;
+.page-entitlement {
+  width: 100%;
+  height: 100vh;
+  background: #f5f6f8;
+  overflow-y: auto;
 
-    .banner{
-      width: 375px;
-      height: 287px;
-    }
-    .ul {
-      position: relative;
-      padding: 0 12px;
-      top: -186px;
-      .li {
-        border-radius: 10px;
-        background: #ffffff;
-        padding: 14px 15px 20px 15px;
-        margin-bottom: 10px;
+  .banner {
+    width: 375px;
+    height: 287px;
+  }
+  .ul {
+    position: relative;
+    padding: 0 12px;
+    top: -186px;
+    .li {
+      border-radius: 10px;
+      background: #ffffff;
+      padding: 14px 15px 20px 15px;
+      margin-bottom: 10px;
 
-        .title-row {
-          border-bottom: 1px solid #e9e9e9;
-          display: flex;
-          align-items: center;
-          padding-bottom: 10px;
+      .title-row {
+        border-bottom: 1px solid #e9e9e9;
+        display: flex;
+        align-items: center;
+        padding-bottom: 10px;
 
-          .title {
-            display: inline-block;
-            width: 260px;
-            font-size: 18px;
-            font-weight: 900;
-            color: #212121;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-          }
+        .title {
+          display: inline-block;
+          width: 260px;
+          font-size: 18px;
+          font-weight: 900;
+          color: #212121;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
 
-          .status {
-            width: 75px;
-            text-align: right;
-            font-size: 12px;
-            font-weight: 400;
-            color: #00BDA5;
-          }
+        .status {
+          width: 75px;
+          text-align: right;
+          font-size: 12px;
+          font-weight: 400;
+          color: #00bda5;
+        }
 
-          .particlar{
-            color: #999999;
-          }
+        .particlar {
+          color: #999999;
+        }
 
-          .red-particlar{
-            color: #FF4B33;
-          }
+        .red-particlar {
+          color: #ff4b33;
         }
+      }
 
-        .content {
-          margin-top: 10px;
-          .item {
-            font-size: 14px;
-            display: flex;
-            align-items: top;
-            margin-bottom: 5px;
-            .label {
-              display: inline-block;
-              width: 90px;
-              color: #999999;
-            }
-            .value {
-              display: inline-block;
-              width: 258px;
-              color: #212121;
-              font-weight: 700;
-              word-break: break-all;
-              overflow: hidden;
-              text-overflow: ellipsis;
-            }
+      .content {
+        margin-top: 10px;
+        .item {
+          font-size: 14px;
+          display: flex;
+          align-items: top;
+          margin-bottom: 5px;
+          .label {
+            display: inline-block;
+            width: 90px;
+            color: #999999;
+          }
+          .value {
+            display: inline-block;
+            width: 258px;
+            color: #212121;
+            font-weight: 700;
+            word-break: break-all;
+            overflow: hidden;
+            text-overflow: ellipsis;
           }
         }
-        .btn {
-          margin-left: auto;
-          width: 82px;
-          height: 33px;
-          text-align: center;
-          line-height: 33px;
-          font-size: 13px;
-          color: #00bda5;
-          font-weight: 400;
-          border-radius: 25px;
-          border: 1px solid #00bda5;
-          position: relative;
-        }
-
-        // .pbackground{
-        //   color: #fff;
-        //   background: #00BDA5;
-        // }
+      }
+      .btn {
+        margin-left: auto;
+        width: 82px;
+        height: 33px;
+        text-align: center;
+        line-height: 33px;
+        font-size: 13px;
+        color: #00bda5;
+        font-weight: 400;
+        border-radius: 25px;
+        border: 1px solid #00bda5;
+        position: relative;
       }
 
-      .empty-wrap{
-        padding: 154px 54px 250px 54px;
-        background: #fff;
-        border-radius: 10px;
-        .empty-icon{
-          width: 243px;
-          height: 127px;
-        }
+      // .pbackground{
+      //   color: #fff;
+      //   background: #00BDA5;
+      // }
+    }
 
-        .empty-text{
-          font-size: 18px;
-          font-weight: 500;
-          color: #02120F;
-          text-align: center;
-        }
+    .empty-wrap {
+      padding: 154px 54px 250px 54px;
+      background: #fff;
+      border-radius: 10px;
+      .empty-icon {
+        width: 243px;
+        height: 127px;
+      }
+
+      .empty-text {
+        font-size: 18px;
+        font-weight: 500;
+        color: #02120f;
+        text-align: center;
       }
     }
   }
+}
 </style>

src/views/sz-public-new/date-picker.vue

+<template>
+  <div class="pica-date-picker">
+    <van-field
+      :border="false"
+      readonly
+      placeholder="请选择出生年月日"
+      :value="value"
+      class="appoint-form-items"
+      @click="handleOpenPopup"
+    />
+    <van-popup
+      v-model="visible"
+      position="bottom"
+      :transition-appear="false"
+    >
+      <van-datetime-picker
+        type="date"
+        title="选择年月日"
+        :value="currentDate"
+        :min-date="minDate"
+        :max-date="maxDate"
+        @confirm="handleConfirm"
+        @cancel="visible = false"
+      />
+    </van-popup>
+  </div>
+</template>
+
+<script>
+import dayjs from 'dayjs';
+export default {
+  props: {
+    value: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      visible: false,
+      currentDate: new Date(),
+      minDate: new Date(1900, 0, 1),
+      maxDate: new Date(),
+    };
+  },
+
+  methods: {
+    handleOpenPopup() {
+      this.visible = true;
+    },
+
+    handleConfirm(value) {
+      this.visible = false;
+      const formatDate = dayjs(value).format('YYYY-MM-DD');
+      this.$emit('input', formatDate);
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.pica-date-picker {
+  width: 100%;
+  .van-cell {
+    padding: 0 !important;
+  }
+}
+</style>

src/views/sz-public-new/index.vue

@@ -7,9 +7,7 @@
     />
     <div class="insurance-register-bg">
       <div class="bg-img back-img">
-        <img
-          :src="bgPath"
-        >
+        <img :src="bgPath">
       </div>
       <div class="wrap-reg">
         <div class="choose-section">
@@ -29,28 +27,67 @@
               required
               class="appoint-form-items"
               placeholder="点击此处输入"
-              :rules="[{ required: true, message: '请输入参保人姓名' },{
-                         pattern: /^[\u4e00-\u9fa5_a-zA-Z0-9]+$/,
-                         message: '请输入正确格式',
-                       },
-                       {
-                         pattern: /^.{2,20}$/,
-                         message: '参保人姓名请填写2-20位',
-                       },]"
+              :rules="[
+                { required: true, message: '请输入参保人姓名' },
+                {
+                  pattern: /^[\u4e00-\u9fa5_a-zA-Z0-9]+$/,
+                  message: '请输入正确格式',
+                },
+                {
+                  pattern: /^.{2,20}$/,
+                  message: '参保人姓名请填写2-20位',
+                },
+              ]"
+            />
+            <van-field
+              :value="cardTypeName"
+              label="证件类型"
+              required
+              disabled
+              class="appoint-form-items"
+              right-icon="arrow"
+              @click="showCardTypeVisible = true"
             />
             <van-field
               v-model="dectionForm.idCard"
               class="appoint-form-items"
               clearable
               required
-              label="参保人身份证"
+              label="参保人证件号"
               placeholder="点击此处输入"
-              :rules="[{ required: true, message: '请输入真实身份证号' },
-                       {
-                         pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
-                         message: '身份证号格式填写有误',
-                       },]"
+              :rules="rules"
             />
+            <van-field
+              v-if="dectionForm.idType != 1"
+              class="appoint-form-items"
+              required
+              label="参保人性别"
+            >
+              <template #input>
+                <van-radio-group
+                  v-model="dectionForm.sex"
+                  direction="horizontal"
+                >
+                  <van-radio :name="1">
+                    男
+                  </van-radio>
+                  <van-radio :name="2">
+                    女
+                  </van-radio>
+                </van-radio-group>
+              </template>
+            </van-field>
+            <van-field
+              v-if="dectionForm.idType != 1"
+              class="appoint-form-items"
+              required
+              label="参保人出生日期"
+              right-icon="arrow"
+            >
+              <template #input>
+                <DatePicker v-model="dectionForm.birthTime" />
+              </template>
+            </van-field>
             <van-field
               v-model="dectionForm.mobilePhone"
               class="appoint-form-items"
@@ -59,36 +96,41 @@
               clearable
               required
               placeholder="点击此处输入"
-              :rules="[{ required: true, message: '请输入手机号' },
-                       {
-                         pattern: /^([1][3,4,5,6,7,8,9])\d{9}$/,
-                         message: '手机号格式填写有误',
-                       },]"
+              :rules="[
+                { required: true, message: '请输入手机号' },
+                {
+                  pattern: /^([1][3,4,5,6,7,8,9])\d{9}$/,
+                  message: '手机号格式填写有误',
+                },
+              ]"
             >
               <template #label>
                 <div class="phone-wrap">
-                  参保人手机号 <span class="sm-grey">该手机号将用于接收预约信息</span>
+                  参保人手机号
+                  <span class="sm-grey">该手机号将用于接收预约信息</span>
                 </div>
               </template>
             </van-field>
           </van-form>
         </div>
-        <div v-for="(i, ind) in staticINFO.logoUrlList" :key="ind" class="bg-img mt20">
-          <img
-            :src="i"
-          >
+        <div
+          v-for="(i, ind) in staticINFO.logoUrlList"
+          :key="ind"
+          class="bg-img mt20"
+        >
+          <img :src="i">
         </div>
-<!--        <div class="bg-img mt20">-->
-<!--          <img-->
-<!--            src="https://files.yunqueyi.com/image/png/common/20230628141650960.png"-->
-<!--          >-->
-<!--        </div>-->
+        <!--        <div class="bg-img mt20">-->
+        <!--          <img-->
+        <!--            src="https://files.yunqueyi.com/image/png/common/20230628141650960.png"-->
+        <!--          >-->
+        <!--        </div>-->
       </div>
     </div>
     <div class="bottom-btn">
       <van-button
         class="btn"
-        :class="canSubmit ? 'appoint-form-submit-active':''"
+        :class="canSubmit ? 'appoint-form-submit-active' : ''"
         @click="appointment"
       >
         领取权益
@@ -96,7 +138,7 @@
     </div>
     <van-popup
       v-model="showProtocol"
-      :style="{ height: '230px',width: '300px', }"
+      :style="{ height: '230px', width: '300px' }"
       :transition-appear="false"
       :close-on-click-overlay="false"
     >
@@ -113,7 +155,13 @@
         <div class="submit-button submit-button-empty">
           <wx-open-launch-weapp
             id="launchBtn"
-            style="position: absolute; top: 0; left: 0; width: 100%; height: 100%"
+            style="
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+            "
             :username="openWebAppConfigPositive.username"
             :path="openWebAppConfigPositive.path"
             :env-version="envVersion"
@@ -127,20 +175,43 @@
         </div>
       </div>
     </van-popup>
+
+    <!-- 选择证件类型弹框 -->
+    <van-popup
+      v-model="showCardTypeVisible"
+      position="bottom"
+      :style="{ height: '280px' }"
+    >
+      <van-cell
+        v-for="(item, index) in cardTypes"
+        :key="index"
+        :title="item.value"
+        style="display: flex; align-items: center"
+        @click="handleChooseCardType(item)"
+      >
+        <template #right-icon>
+          <van-icon
+            v-if="dectionForm.idType == item.no"
+            name="success"
+          />
+        </template>
+      </van-cell>
+    </van-popup>
   </div>
 </template>
 
 <script>
-import { createOrderSzV2} from '@/api/question';
-import {getBanner} from '@/api/entitlement';
-const { VUE_APP_ENV } = process.env;
+import { createOrderSzV2 } from '@/api/question';
+import { getBanner, getCardTypes } from '@/api/entitlement';
+import DatePicker from './date-picker.vue';
 let that;
 export default {
+  components: { DatePicker },
   data() {
     return {
       projectEquityNo: '',
       externalOrderNo: '',
-      picaWechat:window._picaWechat,
+      picaWechat: window._picaWechat,
       headerInfo: {
         title: '惠民保癌筛权益领取',
         isBlack: true,
@@ -150,48 +221,88 @@ export default {
       },
       dectionForm: {
         mobilePhone: '',
-        idCard:'',
+        idCard: '',
+        idType: 1 /** 默认为1:身份证 */,
         name: '',
+        sex: '',
+        birthTime: '',
       },
-      showProtocol:false,
-      envVersion: VUE_APP_ENV == 'production' ? 'release' : 'trial',
-      // envVersion:'trial',
-      openWebAppConfigPositive:{
-        username:'gh_e92f58174364', // 小程序唯一username  1.gh_80d54796f2d5 云鹊助手 2. gh_e92f58174364 云鹊健康
-        path:'pagesInsurance/all-entrance/index', // 打开页面
-        extraData: JSON.stringify({})
+      showProtocol: false,
+      showCardTypeVisible: false,
+      cardTypes: [],
+      // envVersion: process.env.MINI_PROGRAM_ENV,
+      envVersion: process.env.VUE_APP_MINI_PROGRAM_ENV,
+      openWebAppConfigPositive: {
+        username: 'gh_e92f58174364', // 小程序唯一username  1.gh_80d54796f2d5 云鹊助手 2. gh_e92f58174364 云鹊健康
+        path: 'pagesInsurance/all-entrance/index', // 打开页面
+        extraData: JSON.stringify({}),
       },
       bgPath: '',
       staticINFO: {
-        logoUrlList: []
-      }
+        logoUrlList: [],
+      },
     };
   },
   computed: {
     canSubmit() {
-      return (
+      const normalValidate =
         this.dectionForm.idCard &&
         this.dectionForm.name &&
-        this.dectionForm.mobilePhone
+        this.dectionForm.mobilePhone;
+      if (this.dectionForm.idType != 1) {
+        return (
+          normalValidate && this.dectionForm.birthTime && this.dectionForm.sex
+        );
+      }
+      return normalValidate;
+    },
+    cardTypeName() {
+      const item = this.cardTypes.find(
+        (item) => item.no == this.dectionForm.idType
       );
+      return item ? item.value : '';
+    },
+    rules() {
+      const rules = [{ required: true, message: '请输入真实证件号' }];
+      if (this.dectionForm.idType === 1) {
+        return [
+          ...rules,
+          {
+            pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/,
+            message: '身份证号格式填写有误',
+          },
+        ];
+      }
+
+      return rules;
     },
   },
   mounted() {
     document.title = '惠民保癌筛权益领取';
     that = this;
-    const {externalOrderNo, projectEquityNo} = this.$route.query;
+    const { externalOrderNo, projectEquityNo } = this.$route.query;
     this.projectEquityNo = projectEquityNo;
     this.externalOrderNo = externalOrderNo;
     // this.$loading.show();
     this.getBanner(7, projectEquityNo);
-
+    this.loadCardTypes();
   },
   methods: {
+    async loadCardTypes() {
+      const { data } = await getCardTypes();
+      this.cardTypes = data || [];
+    },
+
+    handleChooseCardType(item) {
+      this.dectionForm.idType = item.no;
+      this.showCardTypeVisible = false;
+    },
+
     getBanner(pageType, yunOrderNo) {
       const self = this;
       self.$loading.show();
-      getBanner(pageType, yunOrderNo).then(res => {
-        if(res.code === '000000') {
+      getBanner(pageType, yunOrderNo).then((res) => {
+        if (res.code === '000000') {
           self.bgPath = res.data.logoUrl;
           self.staticINFO = res.data;
           self.$loading.hide();
@@ -205,47 +316,58 @@ export default {
         ...this.dectionForm,
         projectEquityNo,
       };
-      if(externalOrderNo) {
+      if (externalOrderNo) {
         data['externalOrderNo'] = externalOrderNo;
       }
       createOrderSzV2(data).then((res) => {
         console.log(res);
-        if(res.code == '000000') {
-          const {yunOrderNo, statusCode, externalOrderNo, lanZhouOldflag, projectEquityNo} = res.data;
-          if(lanZhouOldflag) {
+        if (res.code == '000000') {
+          const {
+            yunOrderNo,
+            statusCode,
+            externalOrderNo,
+            lanZhouOldflag,
+            projectEquityNo,
+          } = res.data;
+          if (lanZhouOldflag) {
             const url = '/home';
             const l = window.location.origin;
-            const hr = l + `/pica-insurance${url}?projectEquityNo=${projectEquityNo}&externalOrderNo=${externalOrderNo}`;
+            const hr =
+              l +
+              `/pica-insurance${url}?projectEquityNo=${projectEquityNo}&externalOrderNo=${externalOrderNo}`;
             window.location.href = hr;
           }
-          if(statusCode == '0103') {
+          if (statusCode == '0103') {
             this.showProtocol = true;
             this.openWebAppConfigPositive.path = `pagesInsurance/all-entrance/index?channelSource=insurance_channel&projectEquityNo=${projectEquityNo}&yunOrderNo=${yunOrderNo}&externalOrderNo=${externalOrderNo}`;
-            console.log('-openWebAppConfigPositive', this.openWebAppConfigPositive);
-          }else{
-            this.$router.replace(
-              {
-                path: '/entitlement',
-                query: {
-                  projectEquityNo: projectEquityNo,
-                  externalOrderNo: externalOrderNo
-                },
-              }
+            console.log(
+              '-openWebAppConfigPositive',
+              this.openWebAppConfigPositive
             );
+          } else {
+            this.$router.replace({
+              path: '/entitlement',
+              query: {
+                projectEquityNo: projectEquityNo,
+                externalOrderNo: externalOrderNo,
+              },
+            });
           }
-        }else{
+        } else {
           this.$toast(res.message);
         }
-
       });
     },
     appointment() {
-      this.$refs.dectionForm.validate().then(result => {
-        console.log('this.dectionForm', result);
-        this.createOrderSz();
-      }).catch(err => {
-        console.log(err);
-      });
+      this.$refs.dectionForm
+        .validate()
+        .then((result) => {
+          console.log('this.dectionForm', result);
+          this.createOrderSz();
+        })
+        .catch((err) => {
+          console.log(err);
+        });
     },
     handleErrorFn(e) {
       console.log('handleErrorFn', e);
@@ -254,7 +376,7 @@ export default {
       console.log('handleLaunchFn', e);
       that.showProtocol = false;
     },
-  }
+  },
 };
 </script>
 
@@ -264,27 +386,26 @@ export default {
   overflow: auto;
   box-sizing: border-box;
   padding-bottom: 70px;
-  background-color: #BEE2FD;
-  .insurance-register-bg{
+  background-color: #bee2fd;
+  .insurance-register-bg {
     width: 100%;
-    .bg-img{
+    .bg-img {
       width: 100%;
 
-      img{
+      img {
         width: 100%;
         height: 100%;
       }
     }
-    .wrap-reg{
+    .wrap-reg {
       width: 350px;
       border-radius: 20px;
       margin: 0 auto;
-      margin-top: 230px;
+      margin-top: 280px;
       position: relative;
-
     }
   }
-  .back-img{
+  .back-img {
     position: absolute;
     top: 0;
   }
@@ -295,10 +416,10 @@ export default {
     font-weight: 600;
     padding-top: 0px;
     margin: 0 auto;
-    /deep/ .van-field__label{
+    /deep/ .van-field__label {
       color: #212121;
     }
-    /deep/ .van-field__control:disabled{
+    /deep/ .van-field__control:disabled {
       color: #323233;
       -webkit-text-fill-color: #323233;
     }
@@ -340,22 +461,22 @@ export default {
       color: rgba(255, 56, 56, 1);
     }
   }
-  .appoint-form-items{
-    /deep/ .van-field__label{
+  .appoint-form-items {
+    /deep/ .van-field__label {
       color: #212121;
+      width: auto;
     }
-
   }
-  .appoint-form-placeholder{
+  .appoint-form-placeholder {
     color: #999999;
   }
-  .appoint-form-title::after{
+  .appoint-form-title::after {
     display: none;
   }
-  .appoint-form-submit{
+  .appoint-form-submit {
     margin-top: 30px;
     height: 40px;
-    background: #D9D9D9;
+    background: #d9d9d9;
     border-radius: 20px;
     border: none;
     position: absolute;
@@ -365,33 +486,33 @@ export default {
 
   .sz-appoint-form-tips {
     width: 175px;
-    height:32px;
+    height: 32px;
     margin: 0 auto;
     margin-bottom: 10px;
   }
-  /deep/.van-cell{
+  /deep/.van-cell {
     display: block;
     font-weight: 300;
     font-size: 14px;
   }
-  .phone-wrap{
-    .sm-grey{
+  .phone-wrap {
+    .sm-grey {
       font-weight: 100;
       color: #999999;
       font-size: 12px;
     }
   }
-  .protocol-content{
+  .protocol-content {
     padding: 20px;
     border-radius: 20px;
   }
-  .block70{
+  .block70 {
     font-size: 14px;
-    color: #212121!important;
+    color: #212121 !important;
     text-align: center;
     margin-top: 15px;
   }
-  .f20{
+  .f20 {
     font-size: 20px;
   }
   .submit-button {
@@ -402,26 +523,26 @@ export default {
     font-size: 16px;
     display: flex;
     align-items: center;
-    background: #00BDA5;
+    background: #00bda5;
     justify-content: center;
     width: 130px;
     margin: 0 auto;
     margin-top: 30px;
   }
-  /deep/.van-popup--center{
+  /deep/.van-popup--center {
     border-radius: 20px;
   }
-  .bottom-btn{
+  .bottom-btn {
     width: 100%;
-    background: #FFFFFF;
-    box-shadow: inset 0px 1px 0px 0px #E9E9E9;
+    background: #ffffff;
+    box-shadow: inset 0px 1px 0px 0px #e9e9e9;
     overflow: hidden;
     text-align: center;
     padding-bottom: calc(5px + env(safe-area-inset-bottom) / 2);
     position: fixed;
     bottom: 0;
     left: 0;
-    .btn{
+    .btn {
       width: 351px;
       height: 40px;
       border-radius: 20px;
@@ -429,17 +550,17 @@ export default {
       font-size: 16px;
       background: #cccccc;
       font-weight: 600;
-      color: #FFFFFF;
+      color: #ffffff;
       line-height: 40px;
       text-align: center;
     }
-    .appoint-form-submit-active{
-      background: linear-gradient(270deg, #FF7400 0%, #FE4000 100%);
+    .appoint-form-submit-active {
+      background: linear-gradient(270deg, #ff7400 0%, #fe4000 100%);
     }
   }
-  .mt20{
+  .mt20 {
     margin-top: 10px;
-    background-color: #BEE2FD;
+    background-color: #bee2fd;
   }
 }
 </style>

vue.config.js

@@ -36,7 +36,7 @@ module.exports = {
     port: 8083,
     proxy: {
       '/proxy': {
-        target: 'https://test1-sc.yunqueyi.com/',
+        target: 'https://dev-sc.yunqueyi.com/',
         // target: 'https://test1-sc.yunqueyi.com/',
         // target: 'https://uat-sc.yunqueyi.com/',
         // http://10.241.65.90:3000/mock/1071/cs/route/removeUser