提交 bdca9f7d 编写于 作者: 张敬贤's avatar 张敬贤

Feature/zjx2

上级 dbe76765
...@@ -31,6 +31,7 @@ ...@@ -31,6 +31,7 @@
"vant": "^2.8.4", "vant": "^2.8.4",
"vconsole": "^3.3.4", "vconsole": "^3.3.4",
"vue": "^2.6.11", "vue": "^2.6.11",
"pica-area": "^1.2.1",
"vue-fragment": "^1.5.1", "vue-fragment": "^1.5.1",
"vue-router": "^3.3.1", "vue-router": "^3.3.1",
"vuescroll": "^4.15.1", "vuescroll": "^4.15.1",
...@@ -89,7 +90,6 @@ ...@@ -89,7 +90,6 @@
"browserslist": [ "browserslist": [
"> 1%", "> 1%",
"last 2 versions", "last 2 versions",
"not dead",
"android 4", "android 4",
"opera 12" "opera 12"
], ],
......
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 '@/router'; import '@/router';
import { PicaArea } from 'pica-area';
console.log('router, store, vueApp: ', router, store, vueApp); console.log('router, store, vueApp: ', router, store, vueApp);
const { Vue } = window; const { Vue } = window;
import Loading from '@/components/loading.js'; import Loading from '@/components/loading/loading.js';
Vue.use(Loading); Vue.use(Loading);
Vue.use(PicaArea);
// 禁用双指放大 // 禁用双指放大
var lastTouchEnd = 0; var lastTouchEnd = 0;
document.addEventListener('touchstart', function (event) { document.addEventListener('touchstart', function (event) {
......
...@@ -15,6 +15,21 @@ const routerConfig = [ ...@@ -15,6 +15,21 @@ const routerConfig = [
name: 'insuranceDetectionDetail', name: 'insuranceDetectionDetail',
component: insuranceDetectionDetail component: insuranceDetectionDetail
}, },
{
path: '/result',
name: 'result',
component: () => import('@/views/result/index.vue'),
},
{
path: '/result-risk',
name: 'resultRisk',
component: () => import('@/views/result/risk.vue'),
},
{
path: '/appoint',
name: 'appoint',
component: () => import('@/views/appoint/index.vue'),
},
{ {
path: '*', path: '*',
redirect: process.env.VUE_APP_BASE_ROUTE redirect: process.env.VUE_APP_BASE_ROUTE
......
<template>
<div class="insurance-detection-appoint">
<div class="wrap">
<div class="title-1">
检测预约
</div>
<div class="title-2">
及时接受检测结果检测报告
</div>
<div class="choose-section">
<van-form @submit="onSubmit">
<van-field
name="checkboxGroup"
label="检测项目"
required
>
<template #input>
{{ dectionForm.detectName }}
</template>
</van-field>
<van-field
label="受检人信息"
required
class="appoint-form-title"
/>
<van-field
v-model="username"
label="受检人"
class="appoint-form-items"
placeholder="请输入受检人姓名"
:rules="[{ required: true, message: '请输入受检人姓名' }]"
/>
<van-field
v-model="username"
class="appoint-form-items"
label="手机号"
placeholder="请输入受检人手机号"
:rules="[{ required: true, message: '请输入受检人手机号' }]"
/>
<van-field
v-model="password"
class="appoint-form-items"
type="password"
label="身份证号"
placeholder="请输入受检人真实身份证号"
:rules="[{ required: true, message: '请输入受检人真实身份证号' }]"
/>
<van-field
label="检测地点"
required
class="appoint-form-title"
/>
<van-field
v-model="username"
class="appoint-form-items"
label="省市区"
disabled
right-icon="arrow"
placeholder="请选择省市区"
:rules="[{ required: true, message: '请选择省市区' }]"
@click="showAreaFn"
/>
<van-field
v-model="password"
class="appoint-form-items"
type="password"
label="检测地点"
right-icon="arrow"
placeholder="请选择检测机构"
:rules="[{ required: true, message: '请选择检测机构' }]"
/>
<van-field
name="checkboxGroup"
label="预约时间"
required
right-icon="arrow"
>
<template #input>
<div
v-if="false"
class="appoint-form-placeholder"
>
请选择预约时间
</div>
<div class="appoint-form-value">
{{ dectionForm.detectName }}
</div>
</template>
</van-field>
</van-form>
</div>
<van-button
round
block
type="info"
class="appoint-form-submit appoint-form-submit-active"
>
提交
</van-button>
</div>
<PicaArea
v-model="showArea"
@confirm="confirm"
/>
</div>
</template>
<script>
export default {
components: {
},
data() {
return {
dectionForm: {
detectName: '癌症甲基化早筛检测',
place: '',
time: '',
currentDate: '',
timeBucket: '',
hospitalId: '',
goodsId: '',
},
showArea:false,
reportShow: false,
placeList: [],
popType: '',
timsArray: [],
timeBucket: {
am: '上午',
pm: '下午',
},
provinceList: [],
showProvinces: false,
searchPlace: '',
selectPicker: {
value: [],
label: '',
},
isShowAddress: false,
isSelf: false,
spEquityCode: '',
};
},
computed: {
checkValue() {
return (
this.dectionForm.hospitalId !== '' &&
this.dectionForm.time !== '' &&
this.dectionForm.currentDate !== '' &&
this.dectionForm.timeBucket !== ''
);
},
},
mounted() {},
methods: {
choose() {},
submit() {},
chooseHospital() {},
getMeixinHospitalList() {},
chooseDate() {},
chooseTime() {},
getTimes() {
this.timsArray = [];
const current = new Date().getTime();
const ss = 24 * 60 * 60 * 1000;
for (let i = 5; i < 35; i++) {
var addTime = i * ss + current;
var myDate = new Date(addTime);
var year = myDate.getFullYear();
var month = myDate.getMonth() + 1;
var date = myDate.getDate();
var timeStr =
year + '-' + this.plusZero(month) + '-' + this.plusZero(date);
this.timsArray.push(timeStr);
}
},
plusZero(num) {
return num > 9 ? num + '' : '0' + num;
},
inputChange() {},
cancelSearch() {},
selectAddress() {},
onConfirm() {},
onCancel() {},
getDetailByUnionId() { },
confirm() {
},
showAreaFn() {
this.showArea = true;
}
},
};
</script>
<style lang="scss" scoped>
.insurance-detection-appoint {
width: 100%;
height: 100vh;
overflow: auto;
box-sizing: border-box;
color: #ffffff;
background: url('https://files.yunqueyi.com/image/png/common/20221213160647748.png')
no-repeat top left;
background-size: 100% 281px;
.bg-img {
width: 100%;
height: 281px;
position: absolute;
top: 0;
z-index: -1;
}
.wrap {
padding: 0 12px;
}
.title-1 {
font-size: 20px;
margin-top: 23px;
font-style: oblique;
font-weight: 600;
}
.title-2 {
margin-top: 4rpx;
font-size: 24rpx;
}
.appoint-form-title{
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #212121;
padding-top:22px ;
padding-bottom: 0;
line-height: 20px
}
.choose-section {
padding: 10px 12px;
background: #ffffff;
border-radius: 11px;
margin-top: 15px;
/deep/ .van-field__label{
color: #212121;
}
.item {
color: #212121;
font-size: 14px;
display: flex;
height: 60px;
align-items: center;
position: relative;
.input-key {
font-weight: 300;
margin-left: 10px;
}
.input-value {
margin-left: 18px;
font-weight: 500;
overflow: visible;
}
.right {
position: absolute;
right: 10px;
top: 25px;
}
}
.height60 {
height: 30px;
}
.required {
position: relative;
}
.required::after {
position: absolute;
content: '*';
display: block;
left: -10px;
top: 0;
text-align: center;
color: rgba(255, 56, 56, 1);
}
}
.appoint-form-items{
/deep/ .van-field__label{
color: #999999;
}
}
.appoint-form-title::after{
display: none;
}
// .sub-btn {
// background: #00bda5;
// font-size:16px;
// color: #ffffff;
// font-weight: 600;
// width: 90%;
// height: 40px;
// line-height: 40px;
// border-radius: 40px;
// margin: 0 auto;
// position: absolute;
// top: 922rpx;
// left: 5%;
// text-align: center;
// }
.content {
color: #02120f;
height: 350px;
overflow: hidden;
.title-wrap {
font-size: 18px;
font-weight: 500;
text-align: center;
padding-top: 18px;
position: fixed;
width: 100%;
left: 0;
background: #ffffff;
z-index: 1;
margin: 0 auto;
.search {
display: flex;
align-items: center;
justify-content: space-evenly;
}
.search-input {
width: 303px;
height: 35px;
background: #f5f6f8;
border-radius: 13px;
text-align: left;
padding-left: 20px;
}
.title {
font-size: 18px;
font-weight: 500;
}
}
}
.pop-wrap {
width: calc(100% - 64rpx);
padding: 0 16px;
.tab-list {
position: relative;
border-bottom: 0.5px solid #e7e8e9;
height: 64px;
.hospitalActive-icon {
position: absolute;
width: 17px;
height: 17px;
top: 14px;
right: 0;
}
.list-1 {
font-weight: 500;
color: #212121;
font-size: 15px;
margin-top: 14px;
}
.list-2 {
font-size: 12px;
font-weight: 400;
color: #999999;
margin-top: 2px;
}
}
.hospitalActive {
}
}
.date-wrap {
height: 100%;
padding-top: 58px;
display: flex;
.left {
min-height: 100vh;
overflow: scroll;
width: 130px;
padding-bottom: 50px;
background: #f5f6f8;
.date-item {
height: 38px;
background: #f5f6f8;
line-height: 38px;
font-size: 16px;
font-weight: 500;
color: #02120f;
text-align: center;
}
.date-item-active {
color: #00bda5;
background: #ffffff;
}
}
.right {
position: absolute;
top: 58px;
left: 130px;
width: calc(100% - 260rpx);
.right-item {
padding-left: 22px;
width: 100%;
height: 41px;
font-size: 16px;
font-weight: 400;
color: #666666;
line-height: 82rpx;
}
.right-item-active {
color: #00bda5;
}
}
.date-item {
height: 38px;
}
}
.disabled {
background: #d9d9d9 !important;
}
.no-content {
font-size: 36rpx;
font-weight: 500;
color: #02120f;
.no-content-img {
width: 310rpx;
height: 171rpx;
margin: 0 auto;
margin-top: 169rpx;
image {
width: 100%;
height: 100%;
}
}
.mt40 {
margin-top: 40rpx;
width: 100%;
text-align: center;
font-size: 36rpx;
}
}
.appoint-form-submit{
margin-top: 30px;
height: 40px;
background: #D9D9D9;
border-radius: 20px;
border: 1px solid #D9D9D9;
}
.appoint-form-submit-active{
background: #00BDA5;
}
}
::v-deep {
.address-wrap {
height: 590px;
#province {
height: 500px;
}
#city {
height: 500px;
}
#county {
height: 500px;
}
#town {
height: 500px;
}
.tip-header h3 {
font-weight: 700;
color: #212121;
}
.tip-header .submit-btn {
color: #00bda5 !important;
}
.address-select .show-address-header .item.active:after {
background-color: #00bda5;
}
.address-select .address-content ul li.active {
color: #00bda5;
}
}
}
</style>
<style>
.mpvue-picker-div-show {
color: #000000;
}
</style>
<template>
<div class="insurance-research-result">
<div class="icon-item">
<img
src="https://files.yunqueyi.com/image/png/common/20221213135338128.png"
>
</div>
<div class="font-big">
提交成功
</div>
<div class="font-normal">
{{
evaluationInfo.detectionScoreFlag == 1
? '结果计算中...'
: '您的结果将于次日以短信形式推送,烦请留意!'
}}
</div>
<div class="custom-style">
{{ evaluationInfo.detectionScoreFlag == 1 ? '查看结果' : '完成' }}
</div>
<pica-guide-app
:open-web-app="true"
:open-web-app-config="openWebAppConfig"
:is-need-wx-config="false"
/>
</div>
</template>
<script>
// import {evaluationResults, getDetailByUnionId} from '@/api/home.js';
const { VUE_APP_ENV } = process.env;
export default {
data() {
return {
openWebAppConfig: {
content:
'<script' +
' type=text/wxtag-template><style>.btn {position:absolute; top: 0; left: 0; width:100%; height: 100%;}</style> <div class="btn"></div></' +
'script>', // 标签内容
username: 'gh_e92f58174364', // 小程序唯一username 1.gh_80d54796f2d5 云鹊助手 2. gh_e92f58174364 云鹊健康
path: 'pagesUserCenter/insurance/insurance-risk-result', // 打开页面
envVersion: VUE_APP_ENV != 'testing' ? 'release' : 'trial', // release 生产
extraData: '',
},
extraData_MX: {},
evaluationInfo: {},
};
},
created() {
console.log('123123');
},
methods: {
// evaluationResults(id) {
// evaluationResults(id).then(res => {
// console.log('evaluationResults', res);
// if (res.code === '000000') {
// console.log('evaluationResults', res);
// this.evaluationInfo = res.data;
// }
// });
// const questionInfo_MX = JSON.parse(localStorage.getItem('questionInfo_MX'));
// getDetailByUnionId(questionInfo_MX.patientId).then( res => {
// if (res.code === '000000') {
// const { status, detectionServiceRecord} = res.data;
// const data = JSON.parse(localStorage.getItem('extraData_MX'));
// const d = {userId: questionInfo_MX.patientId, detectionDetailID:detectionServiceRecord.id, ...data};
// this.openWebAppConfig.extraData = JSON.stringify(d);
// if(status == 0) {
// console.log('111');
// }
// if(status == 1 || status == 5) {
// this.openWebAppConfig.path = 'pagesUserCenter/insurance/insurance-detection-detail';
// }
// if(status == 2 || status == 3 || status == 4) {
// this.openWebAppConfig.path = 'pages/health/detection-detail/index';
// }
// }
// console.log('--this.openWebAppConfig', this.openWebAppConfig);
// });
// },
},
};
</script>
<style lang="scss" scoped>
.insurance-research-result {
width: 100%;
height: 100vh;
background: #ffffff;
box-sizing: border-box;
padding: 20px 16px;
color: #676869;
text-align: center;
.icon-item {
width: 57px;
height: 65px;
margin: 0 auto;
margin-top: 83px;
image {
width: 100%;
height: 100%;
}
}
.font-big {
margin-top: 22px;
font-size: 20px;
font-weight: 700;
color: #02120f;
}
.font-normal {
margin-top: 12px;
font-size: 15px;
font-weight: 400;
color: #666666;
}
.custom-style {
width: 350px;
height: 40px;
background: #00bda5;
font-size: 16px;
color: #ffffff;
font-weight: 600;
line-height: 40px;
border-radius: 40px;
border: none;
margin-top: 148px;
}
}
</style>
<template>
<div class="insurance-risk-result">
<div class="icon-item">
<img
:src="
!needDetect
? 'https://files.yunqueyi.com/image/png/common/20221213144514273.png'
: 'https://files.yunqueyi.com/image/png/common/20221213144810625.png'
"
>
</div>
<div
class="font-big"
:class="needDetect && 'green'"
>
{{ !needDetect ? '建议领用' : '暂无需领用' }}
</div>
<div class="font-normal">
{{
!needDetect
? '参照本次评估结果,建议您接受防癌早筛检测。坚持良好生活方式,定期接受体检,关注个人健康'
: '参照本次评估结果,建议您可暂不进行防癌早筛检测。坚持良好生活方式,定期接受体检,关注个人健康。'
}}
</div>
<div
v-if="!needDetect"
class="advise"
>
<div class="fs">
建议您进行以下防癌筛查:
</div>
<div class="ad-fs">
{{ result.detectName || '' }}
</div>
</div>
<div
v-if="!needDetect"
class="progress"
>
<img
src="https://files.yunqueyi.com/image/png/common/20221226103307358.png"
>
</div>
<div
v-if="!needDetect"
class="custom-style"
@click="toAppoint"
>
{{ statusMap(detailInfo.status) || '免费预约检测' }}
</div>
<div class="tips">
注:该问卷评估结果仅供填写人自行参考。
</div>
</div>
</template>
<script>
export default {
data() {
return {
needDetect: false,
result: {},
detailInfo: {},
isLoading: true,
};
},
mounted() {
console.log(11223);
},
methods: {
statusMap(status) {
const m = {
0: '免费预约检测',
4: '免费预约检测',
5: '免费预约检测',
1: '查看详情',
2: '查看详情',
3: '查看详情',
};
return m[status];
},
},
};
</script>
<style lang="scss" scoped>
.insurance-risk-result {
width: 100%;
height: 100vh;
box-sizing: border-box;
padding: 20px 16px;
color: #676869;
text-align: center;
.icon-item {
width: 50px;
height: 60px;
margin: 0 auto;
margin-top: 45px;
img {
width: 100%;
height: 100%;
}
}
.font-big {
margin-top: 8px;
font-size: 25px;
font-weight: 500;
color: #ef8337;
}
.green {
color: #179082;
}
.font-normal {
margin-top: 15px;
font-size: 15px;
font-weight: 400;
color: #666666;
}
.advise {
height: 78px;
background: #fffbf9;
border-radius: 11px;
border: 1px solid #fbe0ce;
padding: 15px;
text-align: center;
margin: 10 auto;
}
.fs {
font-size: 12px;
font-weight: 400;
color: #999999;
}
.ad-fs {
font-size: 18px;
font-weight: 500;
color: #ef8337;
}
.custom-style {
background: #00bda5;
font-size: 16px;
color: #ffffff;
font-weight: 600;
width: 90%;
height: 40px;
line-height: 40px;
border-radius: 40px;
//position: absolute;
//bottom: 120px;
margin: 0 auto;
margin-top: 150px;
}
.tips {
font-size: 13px;
font-weight: 300;
color: #212121;
//bottom: 60px;
//position: absolute;
margin: 0 auto;
text-align: center;
width: 100%;
margin-top: 38px;
}
.progress {
margin-top: 24px;
height: 168px;
width: 100%;
image {
width: 100%;
height: 100%;
}
}
}
.loadingShow {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
width: 100vw;
position: absolute;
top: 0;
left: 0;
background: rgba($color: #000000, $alpha: 0.3);
}
</style>
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册