Skip to content

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

Merge branch 'feature/zjx' into 'develop' 

add page

See merge request !3
上级 930030ce 688c57f1
隐藏空白字符变更
内嵌 并排
正在显示 包含 171 行增加 和 215 行删除
src/main.js
浏览文件 @ f9c98787
import { router, store, vueApp } from '@pica-cli/vue-cli-plugin-pica-cli-plugin/auto';
import '@/router';
import { PicaArea } from 'pica-area';
console.log('router, store, vueApp: ', router, store, vueApp);
const { Vue } = window;
import Loading from '@/components/loading/loading.js';
Vue.use(Loading);
Vue.use(PicaArea);
// 禁用双指放大
var lastTouchEnd = 0;
document.addEventListener('touchstart', function (event) {
......
src/views/appoint/index.vue
浏览文件 @ f9c98787
<template>
<div class="insurance-detection-appoint">
<img
class="bg-img"
src=""
>
<div class="wrap">
<div class="title-1">
检测预约
......@@ -12,226 +8,112 @@
及时接受检测结果检测报告
</div>
<div class="choose-section">
<div class="item">
<div class="input-key required">
检测项目
</div>
<div class="input-value">
{{ dectionForm.detectName }}
</div>
</div>
<div class="item height60">
<div class="input-key required">
检测地点
</div>
<div class="input-value" />
</div>
<div
class="item"
@click="choose('province')"
>
<div class="input-key">
省市区
</div>
<input
v-model="selectPicker.label"
disabled
class="input-value"
placeholder-style="color:#999999;font-weight:300"
placeholder="请选择检省市区"
<van-form @submit="onSubmit">
<van-field
name="checkboxGroup"
label="检测项目"
required
>
<!-- <u-icon
class="right"
style="margin-left: 8rpx"
name="arrow-right"
color="#999999"
size="22"
/> -->
</div>
<div
class="item"
@click="choose('place')"
>
<div class="input-key">
检测地点
</div>
<input
v-model="dectionForm.place"
<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
class="input-value"
placeholder-style="color:#999999;font-weight:300"
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"
>
<!-- <u-icon
class="right"
style="margin-left: 8rpx"
name="arrow-right"
color="#999999"
size="22"
/> -->
</div>
<div
class="item"
@click="choose('time')"
>
<div class="input-key required">
预约时间
</div>
<input
v-model="dectionForm.time"
disabled
class="input-value"
placeholder-style="color:#999999;font-weight:300"
placeholder="请选择检测时间"
>
<!-- <u-icon
class="right"
style="margin-left: 8rpx"
name="arrow-right"
color="#999999"
size="22"
/> -->
</div>
<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>
<div
class="sub-btn"
:class="checkValue && isSelf ? '' : 'disabled'"
@click="submit"
>
提交
</div>
<!-- <u-popup
v-model="reportShow"
mode="bottom"
:height="popType == 'place' ? '80%' : '700'"
closeable
border-radius="20"
>
<div class="content">
<div class="title-wrap">
<div class="title">
{{ popType == "place" ? "选择检测地点" : "预约时间" }}
</div>
<div
v-if="popType == 'place'"
class="search"
>
<input
v-model="searchPlace"
class="search-input"
placeholder-style="color:#999999;font-weight:300"
placeholder="请输入检测地点"
@input="inputChange"
>
<div @click="cancelSearch">
取消
</div>
</div>
</div>
<scroll-div
v-if="popType == 'place'"
class="pop-wrap"
:scroll-y="false"
style="height: 100%; padding-top: 140rpx"
:show-scrollbar="false"
:enhanced="true"
>
<div
v-for="(info, index) in placeList"
v-if="placeList.length > 0"
:key="index"
:class="dectionForm.hospitalId === info.hospitalId ? 'hospitalActive' : ''"
class="tab-list"
@click="chooseHospital(info)"
>
<div class="list-1">
{{ info.hospitalName }}
</div>
<div class="list-2">
{{ info.hospitalAddress }}
</div>
<image
v-if="dectionForm.hospitalId === info.hospitalId"
class="hospitalActive-icon"
src="https://files.yunqueyi.com/image/png/common/2022081612011851.png"
/>
</div>
<div
v-if="placeList.length == 0"
class="no-content"
>
<div class="no-content-img">
<image src="https://files.yunqueyi.com/image/png/common/20221226163921746.png" />
</div>
<div class="mt40">
暂未搜索到相关检测点
</div>
</div>
</scroll-div>
<div
v-else
class="date-wrap"
>
<scroll-div
class="left"
:scroll-y="true"
:show-scrollbar="false"
:enhanced="true"
>
<div
v-for="item in timsArray"
:key="item"
class="date-item"
:class="item === dectionForm.currentDate ? 'date-item-active' : ''"
@click="chooseDate(item)"
>
{{ item }}
</div>
</scroll-div>
<div class="right">
<div
class="right-item"
:class="dectionForm.timeBucket === timeBucket['am'] ? 'right-item-active' : ''"
@click="chooseTime('am')"
>
上午
</div>
<div
class="right-item"
:class="dectionForm.timeBucket === timeBucket['pm'] ? 'right-item-active' : ''"
@click="chooseTime('pm')"
>
下午
</div>
</div>
</div>
</div>
</u-popup> -->
<!-- <pickAddressModel
v-if="isShowAddress"
:default-pick="selectPicker"
:need-town="false"
:sp-equity-code="spEquityCode"
@onConfirm="onConfirm"
@onCancel="onCancel"
/> -->
<PicaArea
v-model="showArea"
@confirm="confirm"
/>
</div>
</template>
<script>
// import { getMeixinHospitalList, appointment, throttle, getDetailByUnionId } from './api';
// import pickAddressModel from '@/components/pick-address-model/modal.vue';
// let that;
export default {
components: {
// pickAddressModel,
},
data() {
return {
dectionForm: {
detectName: '',
detectName: '癌症甲基化早筛检测',
place: '',
time: '',
currentDate: '',
......@@ -239,6 +121,7 @@ export default {
hospitalId: '',
goodsId: '',
},
showArea:false,
reportShow: false,
placeList: [],
popType: '',
......@@ -300,7 +183,13 @@ export default {
selectAddress() {},
onConfirm() {},
onCancel() {},
getDetailByUnionId() {},
getDetailByUnionId() { },
confirm() {
},
showAreaFn() {
this.showArea = true;
}
},
};
</script>
......@@ -308,11 +197,14 @@ export default {
<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;
......@@ -333,12 +225,25 @@ export default {
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: 0 12px;
padding: 10px 12px;
background: #ffffff;
border-top-left-radius: 22px;
border-top-right-radius: 22px;
border-radius: 11px;
margin-top: 15px;
/deep/ .van-field__label{
color: #212121;
}
.item {
color: #212121;
font-size: 14px;
......@@ -377,6 +282,15 @@ export default {
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;
......@@ -526,7 +440,47 @@ export default {
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 {
......
vue.config.js
浏览文件 @ f9c98787
module.exports = {
transpileDependencies: [
/[/\\]node_modules[/\\][@\\]pica-cli[/\\]vue-cli-plugin-pica-cli-plugin[/\\]core/,
/[/\\]node_modules[/\\][@\\]pica-kit[/\\]page-model/
/[/\\]node_modules[/\\][@\\]pica-kit[/\\]page-model/,
/[/\\]node_modules[/\\][@\\]pica-kit[/\\]page-area/
],
productionSourceMap: false,
pluginOptions: {
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或