Skip to content

P
pica-insurance
提交 d9f6a4a1 编写于 作者: 张敬贤's avatar 张敬贤
浏览文件
操作

更新UI

上级 f96a53b1
展开全部 显示空白字符变更
内嵌 并排
正在显示 包含 562 行增加 和 210 行删除
src/views/appoint/index.vue
浏览文件 @ d9f6a4a1
...@@ -6,12 +6,12 @@ ...@@ -6,12 +6,12 @@
:header-info="headerInfo" :header-info="headerInfo"
/> />
<div class="wrap"> <div class="wrap">
<div class="title-1"> <!-- <div class="title-1">
检测预约 检测预约
</div> </div>
<div class="title-2"> <div class="title-2">
及时接受检测结果检测报告 及时接受检测结果检测报告
</div> </div> -->
<div class="choose-section"> <div class="choose-section">
<van-form <van-form
ref="dectionForm" ref="dectionForm"
...@@ -173,6 +173,9 @@ ...@@ -173,6 +173,9 @@
> >
提交 提交
</van-button> </van-button>
<div class="appoint-tel">
客服电话：<a href="tel:400-006-5252">400-006-5252</a>
</div>
</div> </div>
<SelectHospital <SelectHospital
:external-data="externalData" :external-data="externalData"
...@@ -561,6 +564,7 @@ export default { ...@@ -561,6 +564,7 @@ export default {
overflow: auto; overflow: auto;
box-sizing: border-box; box-sizing: border-box;
color: #ffffff; color: #ffffff;
background: #F3FCFF;
.bg-img { .bg-img {
width: 100%; width: 100%;
...@@ -572,9 +576,6 @@ export default { ...@@ -572,9 +576,6 @@ export default {
.wrap { .wrap {
padding: 0 12px; padding: 0 12px;
overflow: auto; overflow: auto;
background: url('https://files.yunqueyi.com/image/png/common/20221213160647748.png')
no-repeat top left;
background-size: 100% 281px;
} }
.title-1 { .title-1 {
font-size: 20px; font-size: 20px;
...@@ -800,6 +801,16 @@ export default { ...@@ -800,6 +801,16 @@ export default {
.appoint-form-submit-active{ .appoint-form-submit-active{
background: #00BDA5; background: #00BDA5;
} }
.appoint-tel{
margin-top: 25px;
height: 22px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 22px;
text-align: center;
}
} }
::v-deep { ::v-deep {
.address-wrap { .address-wrap {
......
src/views/appointDetails/index.vue
浏览文件 @ d9f6a4a1
此差异已折叠。
src/views/insurance-bind-code/insurance-bind-code.vue
浏览文件 @ d9f6a4a1
<template> <template>
<div class="insurance-binding-code-container" :class="picaWechat == 'wechat' && 'mt20'"> <div
class="insurance-binding-code-container"
:class="picaWechat == 'wechat' && 'mt20'"
>
<page-model <page-model
v-if="picaWechat != 'wechat'" v-if="picaWechat != 'wechat'"
ref="PageModel" ref="PageModel"
......
src/views/insurance-question-result/insuranceQuestionResult.vue
浏览文件 @ d9f6a4a1
...@@ -6,56 +6,75 @@ ...@@ -6,56 +6,75 @@
:header-info="headerInfo" :header-info="headerInfo"
/> />
<div class="insuranceQuestionResult"> <div class="insuranceQuestionResult">
<div class="icon-item"> <div class="insuranceQuestionResult-info">
<img <template v-if="!needDetect">
:src=" <div class="info-top">
!needDetect <div class="info-top-title">
? 'https://files.yunqueyi.com/image/png/common/20221213144514273.png' 防癌专家提醒您尽快进行
: 'https://files.yunqueyi.com/image/png/common/20221213144810625.png'
"
>
</div> </div>
<div <div class="info-top-name">
class="font-big" {{ detectionName }}
:class="needDetect && 'green'"
>
{{ !needDetect ? '建议领用' : '暂无需领用' }}
</div> </div>
<div class="font-normal"> <div class="info-top-tips">
{{ <div class="tips-item">
!needDetect <div class="tips-item-dot" />
? '参照本次评估结果，建议您接受防癌早筛检测。坚持良好生活方式，定期接受体检，关注个人健康' DNA甲基化检测技术，对比传统肿瘤标志物检查,早期癌变检出率高5-10倍
: '参照本次评估结果，建议您可暂不进行防癌早筛检测。坚持良好生活方式，定期接受体检，关注个人健康。'
}}
</div> </div>
<div <div class="tips-item">
v-if="!needDetect" <div class="tips-item-dot" />
class="advise" 早期检出、早期干预、实现可逆
> </div>
<div class="fs"> <div class="tips-item">
建议您进行以下防癌筛查： <div class="tips-item-dot" />
检测报告阳性，最高可报销300元复查费用
</div> </div>
<div class="ad-fs">
{{ detectionName || '' }}
</div> </div>
</div> </div>
<div
v-if="!needDetect"
class="progress"
>
<img <img
src="https://files.yunqueyi.com/image/png/common/20221226103307358.png" src="https://files.yunqueyi.com/image/gif/common/20230228173135233.gif"
class="info-btn"
> >
<div class="info-tips">
点击上方按钮预约，并前往预约的医疗机构采样
</div> </div>
<div </template>
<template v-else>
<div class="info-noNeed">
<div class="info-noNeed-title">
<div class="text-left" />
参照本次评估结果
<div class="text-right" />
</div>
<div class="info-noNeed-result">
您可暂不进行防癌早筛检测
</div>
<div class="info-noNeed-tips">
<div class="tips-item">
<div class="tips-item-dot" />
坚持良好生活方式；
</div>
<div class="tips-item">
<div class="tips-item-dot" />
定期接受体检，关注个人健康
</div>
</div>
</div>
</template>
</div>
<!-- <div
v-if="!needDetect" v-if="!needDetect"
class="custom-style" class="custom-style"
@click="toAppoint" @click="toAppoint"
> >
{{ buttonText || '免费预约检测' }} {{ buttonText || '免费预约检测' }}
</div> </div> -->
<div class="tips">
<div
class="tips-fixed"
>
注：该问卷评估结果仅供填写人自行参考。 注：该问卷评估结果仅供填写人自行参考。
</div> </div>
</div> </div>
...@@ -151,105 +170,191 @@ export default { ...@@ -151,105 +170,191 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.insuranceQuestionResult-box{ .insuranceQuestionResult-box{
background: #fff; height: 100vh;
background: #F3FCFF;
} }
.insuranceQuestionResult { .insuranceQuestionResult {
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding: 0 16px;
color: #676869; color: #676869;
overflow: auto; overflow: auto;
text-align: center; text-align: center;
.icon-item { background: url('https://files.yunqueyi.com/image/png/common/20230228101352132.png') no-repeat left top;
width: 50px; background-size: 100% 209px ;
height: 60px;
margin: 0 auto; }
margin-top: 30px; .insuranceQuestionResult-info{
img { width: 348px;
width: 100%; background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
height: 100%; box-shadow: 0px 9px 6px 0px #EBF9F8;
} border-radius: 20px;
border: 1px solid rgba(0,189,165,0.33);
margin: 168px auto 54px;
.info-top{
width: 308px;
height: 200px;
background: #FFFBF9;
border-radius: 11px;
margin: 10px auto 20px;
overflow: hidden;
.info-top-title{
margin-top: 25px;
height: 21px;
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #EF8337;
line-height: 21px;
} }
.font-big { .info-top-name{
margin-top: 8px; margin-top: 8px;
font-size: 25px; height: 22px;
font-weight: 500; font-size: 20px;
color: #ef8337; font-family: PingFangSC-Semibold, PingFang SC;
} font-weight: 600;
.green { color: #EF8337;
color: #179082; line-height: 22px;
} }
.font-normal { .info-top-tips{
margin-top: 15px; margin-top: 25px;
font-size: 15px; .tips-item{
position: relative;
padding-left: 25px;
padding-right: 14px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #666666; color: #212121;
line-height: 20px;
text-align: left;
} }
.advise {
height: 48px; .tips-item-dot{
background: #fffbf9; position: absolute;
border-radius: 11px; width: 3px;
border: 1px solid #fbe0ce; height: 3px;
padding: 15px; background: #EF8337;
opacity: 0.8;
left: 15px;
top: 9px;
border-radius: 50%;
}
}
}
.info-btn{
position: relative;
width: 375px;
height: 105px;
margin: 0 auto;
font-size: 21px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #FFFFFF;
left: 50%;
transform: translateX(-50%);
line-height: 64px;
text-align: center; text-align: center;
margin: 16px auto; margin-bottom: 20px;
} }
.fs { .info-tips{
font-size: 12px; height: 18px;
font-size: 13px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
color: #666666;
line-height: 18px;
margin-bottom: 38px;
}
}
.tips{
height: 21px;
font-size: 13px;
font-family: PingFangSC-Light, PingFang SC;
font-weight: 300;
color: #999999; color: #999999;
margin-bottom:6px ; line-height: 21px;
}
.info-noNeed{
width: 307px;
height: 154px;
background: #F9FAFB;
border-radius: 11px;
margin: 22px auto;
overflow: hidden;
.info-noNeed-title{
height: 21px;
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #00BDA5;
line-height: 21px;
margin-top: 20px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
.text-left{
width: 20px;
height: 1px;
background: linear-gradient(270deg, #EEEEEE 0%, #D8D8D8 100%);
border-radius: 1px;
margin-right: 6px;
}
.text-right{
width: 20px;
height: 1px;
background: linear-gradient(270deg, #EEEEEE 0%, #D8D8D8 100%);
border-radius: 1px;
margin-left: 6px;
}
} }
.ad-fs { .info-noNeed-result{
margin-top: 4px;
height: 20px;
font-size: 18px; font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
color: #ef8337; color: #00BDA5;
line-height: 20px;
margin-bottom: 25px;
} }
.custom-style { .info-noNeed-tips{
background: #00bda5;
font-size: 16px; margin-bottom: 25px;
color: #ffffff; .tips-item{
font-weight: 600; position: relative;
width: 90%; font-size: 14px;
height: 40px; font-family: PingFangSC-Regular, PingFang SC;
line-height: 40px; font-weight: 400;
border-radius: 40px; color: #666666;
//position: absolute; line-height: 20px;
//bottom: 120px; text-align: left;
margin: 0 auto; padding-left:38px ;
margin-top: 70px; .tips-item-dot{
position: absolute;
width: 3px;
height: 3px;
background: #179082;
opacity: 0.8;
left: 27px;
top: 9px;
border-radius: 50%;
} }
.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 { .tips-fixed{
display: flex; position: fixed;
justify-content: center; width: 100%;
align-items: center; bottom: 70px;
height: 100vh; height: 21px;
width: 100vw; font-size: 13px;
position: absolute; font-family: PingFangSC-Light, PingFang SC;
top: 0; font-weight: 300;
left: 0; color: #999999;
background: rgba($color: #000000, $alpha: 0.3); line-height: 21px;
} }
</style> </style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或