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

add

上级 cb5f074e
//
import request from 'mn-template/plugins/http';
export const getHospitalList = (data) => {
return request({
method: 'POST',
data,
url: 'store/admin/customer/list/dropdown',
withCredentials: true,
});
};
<template>
<van-popup
v-show="show"
v-model="show"
closeable
round
position="bottom"
:style="{ height: '60%' }"
:style="{ height: '560px',overflow:hidden }"
@close="close"
>
<div>选择检测机构</div>
<div class="select-hospital">
<div class="select-hospital-title">
选择检测机构
</div>
<div class="select-hospital-input">
<van-search
v-model="searchValue"
shape="round"
show-action
background="#fff"
placeholder="输入检测地点"
@blur="getHospitalList(false)"
>
<template #action>
<div @click="cancel">
取消
</div>
</template>
</van-search>
</div>
<div class="select-hospital-list">
<van-list
v-if="list.length >0"
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
>
<van-cell
v-for="(item,index) in list"
:key="index"
class="list-item"
@click="selectItem(item)"
>
<div
class="list-item-name"
v-html="$commonJs.highLight(item.hospitalName, searchValue)"
/>
<!-- <div class="list-item-name">
{{ item.hospitalName }}
</div> -->
<div class="list-item-address">
{{ item.provinceName }}{{ item.cityName }}{{ item.countyName }}{{ item.townName }}
</div>
<div
v-if="hospitalId == item.hospitalId"
class="list-item-icon"
/>
</van-cell>
</van-list>
<div
v-else
class="select-hospital-nodata"
>
<img
class="img"
src="@/assets/images/nodata.png"
alt=""
>
<div class="text">
暂未搜索到相关检测点
</div>
</div>
</div>
</div>
</van-popup>
</template>
<script>
import {getHospitalList} from './api';
export default {
props: {
hospitalId: {
type: Number,
default:() => null
},
show: {
type: Boolean,
default:() => false
}
},
data() {
return {
show: true
hospitalName: '',
list: [],
loading: false,
finished: false,
pageNum: 0,
pageSize: 50,
searchValue:''
};
},
mounted() {
this.getHospitalList(false);
},
methods: {
// 获取机构列表
getHospitalList(isLoad) {
this.finished = false;
this.pageNum = isLoad ? this.pageNum + 1 : 1;
const data = {
certifyStatus: '0',
hospitalId: '',
hospitalIds: [],
pageNum: this.pageNum,
pageSize: this.pageSize,
searchStr: this.searchValue,
};
console.log(data);
getHospitalList(data).then(res => {
console.log(res.data.list);
if (isLoad) {
this.list = [...this.list, ...res.data.list];
} else {
this.list = res.data.list;
}
if (res.data.list.length < this.pageSize) {
this.finished = true;
}
this.loading = false;
});
},
selectItem(item) {
console.log(item);
this.$emit('change', item);
},
cancel() {
this.finished = false;
this.searchValue = '';
this.pageNum = 0;
this.onLoad();
},
onLoad() {
this.loading = true;
this.finished = false;
this.getHospitalList(true);
},
close() {
this.$emit('close', 'showselectHospital');
}
}
};
</script>
<style>
<style lang="scss" scoped>
.select-hospital{
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.select-hospital-title{
position: absolute;
width: 100%;
top: 0;
padding-top: 18px;
padding-bottom: 21px;
height: 18px;
font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #02120F;
line-height: 18px;
text-align: center;
}
.select-hospital-input{
position: absolute;
width: calc(100% - 15px);
top: 58px;
padding-right: 15px;
border-bottom: 1px solid #ebedf0;
/deep/ .van-search__action{
padding-left: 13px;
padding-right: 0;
}
}
.select-hospital-list{
padding-top: 120px;
height: calc(100% - 120px);
overflow: hidden;
// position: absolute;
// top: 100px;
// left: 0;
// right: 0;
// bottom: 0;
// min-height: 450px;
// height: 450px;
.van-list{
height: 100%;
overflow: auto;
.list-item{
position: relative;
padding-top: 14px;
padding-bottom: 12px;
&-name{
height: 15px;
font-size: 15px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #212121;
line-height: 15px;
margin-bottom: 12px;
}
&-address{
height: 12px;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 12px
}
&-icon{
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
width: 19px;
height: 19px;
background: url('~@/assets/images/icon-4.png') 0 0 / 100%
100% no-repeat;
}
}
}
.select-hospital-nodata{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
.img{
width: 155px;
height: 85px;
margin: 21px auto;
}
.text{
height: 25px;
font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #02120F;
line-height: 25px;
}
}
}
</style>
//
import request from 'mn-template/plugins/http';
export const getHospitalList = (data) => {
return request({
method: 'POST',
data,
url: 'store/admin/customer/list/dropdown',
withCredentials: true,
});
};
<template>
<van-popup
v-show="show"
v-model="show"
closeable
round
position="bottom"
:style="{ height: '560px',overflow:hidden }"
@close="close"
>
<div class="select-time">
<div class="select-time-title">
预约时间
</div>
<div class="select-time-list">
<div class="time-list-left">
<div
v-for="item in timsArray"
:key="item"
class="text"
:class="selectTimes === item ?'selected':''"
@click="selectTime(item)"
>
{{ item }}
</div>
</div>
<div class="time-list-right">
<div
class="text"
:class="selectTimeBucket === 'am' ?'selected':''"
@click="selectTimeB('am')"
>
上午
</div>
<div
class="text"
:class="selectTimeBucket === 'pm' ?'selected':''"
@click="selectTimeB('pm')"
>
下午
</div>
</div>
</div>
</div>
</van-popup>
</template>
<script>
// import {getHospitalList} from './api';
export default {
props: {
hospitalId: {
type: Number,
default:() => null
},
show: {
type: Boolean,
default:() => false
}
},
data() {
return {
hospitalName: '',
timsArray: [],
selectTimes: '',
selectTimeBucket:'',
loading: false,
finished: false,
pageNum: 0,
pageSize: 50,
searchValue: '',
timeBucket: {
am: '上午',
pm: '下午',
},
};
},
mounted() {
this.getTimes();
},
methods: {
// 获取机构列表
selectItem() {
if (this.selectTimes === '') {
this.$toast('请选择日期');
return;
}
if (this.selectTimeBucket === '') {
this.$toast('请选择时间段');
return;
}
this.$emit('change', this.selectTimes + ' ' + this.timeBucket[this.selectTimeBucket]);
},
cancel() {
this.finished = false;
this.searchValue = '';
this.pageNum = 0;
this.onLoad();
},
close() {
this.$emit('close', 'showSelectTime');
},
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;
},
selectTime(item) {
this.selectTimes = item;
this.selectItem();
},
selectTimeB(item) {
this.selectTimeBucket = item;
this.selectItem();
}
}
};
</script>
<style lang="scss" scoped>
.select-time{
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.select-time-title{
position: absolute;
width: 100%;
top: 0;
padding-top: 18px;
padding-bottom: 21px;
height: 18px;
font-size: 18px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #02120F;
line-height: 18px;
text-align: center;
border-bottom: 1px solid #ebedf0;
}
.select-time-list{
padding-top: 59px;
height: calc(100% - 59px);
overflow: hidden;
display: flex;
.time-list-left{
width: 130px;
height: 100%;
overflow: auto;
background: #F5F6F8;
.text{
width: 130px;
font-size: 16px;
text-align: center;
height: 38px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #02120F;
line-height: 38px;
}
}
.time-list-right{
padding: 10px 0;
.text{
padding-left: 22px;
height: 41px;
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 41px;
}
}
}
.selected{
color: #00BDA5 !important;
background: #FFFFFF
}
</style>
......@@ -4,9 +4,11 @@ import { PicaArea } from 'pica-area';
console.log('router, store, vueApp: ', router, store, vueApp);
const { Vue } = window;
import Loading from '@/components/loading/loading.js';
import commonJs from '@/utils/common';
import '@/assets/js/flexible';
Vue.use(Loading);
Vue.use(PicaArea);
Vue.prototype.$commonJs = commonJs;
// 禁用双指放大
var lastTouchEnd = 0;
document.addEventListener('touchstart', function (event) {
......
export default {
highLight: function (str, val) {
// str 表示原字符串
// val 高亮的文本
if (str !== '' || !val) {
str = str.replace(val, `<span style="color:#00BDA5">${val}</span>`);
return str;
}
return str;
},
callPhone: function (phone) {
window.location.href = `tel:${phone}`;
},
};
......@@ -61,29 +61,49 @@
@click="showAreaFn"
/>
<van-field
v-model="password"
v-model="dectionForm.hospitalName"
class="appoint-form-items"
type="password"
label="检测地点"
disabled
right-icon="arrow"
placeholder="请选择检测机构"
:rules="[{ required: true, message: '请选择检测机构' }]"
/>
@click="showPopup('showselectHospital')"
>
<template #input>
<div
v-if="!dectionForm.hospitalName"
class="appoint-form-placeholder"
>
请选择检测机构
</div>
<div
v-else
class="appoint-form-value"
>
{{ dectionForm.hospitalName }}
</div>
</template>
</van-field>
<van-field
name="checkboxGroup"
label="预约时间"
required
right-icon="arrow"
@click="showPopup('showSelectTime')"
>
<template #input>
<div
v-if="false"
v-if="!dectionForm.time"
class="appoint-form-placeholder"
>
请选择预约时间
</div>
<div class="appoint-form-value">
{{ dectionForm.detectName }}
<div
v-else
class="appoint-form-value"
>
{{ dectionForm.time }}
</div>
</template>
</van-field>
......@@ -98,19 +118,31 @@
提交
</van-button>
</div>
<SelectHospital
:show="showselectHospital"
:hospital-id="hospitalId"
@change="selectHospital"
@close="close"
/>
<SelectTime
:show="showSelectTime"
@change="selectTimes"
@close="close"
/>
<PicaArea
v-model="showArea"
@confirm="confirm"
/>
<SelectHospital />
</div>
</template>
<script>
import SelectHospital from '@/components/selectHospital';
import SelectHospital from '@/components/selectHospital/index.vue';
import SelectTime from '@/components/selectTime/index.vue';
export default {
components: {
SelectHospital
SelectHospital,
SelectTime,
},
data() {
return {
......@@ -121,8 +153,10 @@ export default {
currentDate: '',
timeBucket: '',
hospitalId: '',
hospitalName:'',
goodsId: '',
},
showselectHospital:false,
showArea:false,
reportShow: false,
placeList: [],
......@@ -140,8 +174,10 @@ export default {
label: '',
},
isShowAddress: false,
showSelectTime:false,
isSelf: false,
spEquityCode: '',
hospitalId:''
};
},
computed: {
......@@ -154,14 +190,17 @@ export default {
);
},
},
mounted() {},
mounted() {
},
methods: {
choose() {},
submit() {},
chooseHospital() {},
getMeixinHospitalList() {},
chooseDate() {},
chooseTime() {},
selectTimes(times) {
console.log(times);
},
getTimes() {
this.timsArray = [];
const current = new Date().getTime();
......@@ -180,14 +219,25 @@ export default {
plusZero(num) {
return num > 9 ? num + '' : '0' + num;
},
inputChange() {},
showPopup(name) {
console.log(name);
this[name] = true;
},
close(name) {
this[name] = false;
},
cancelSearch() {},
selectAddress() {},
onConfirm() {},
onCancel() {},
getDetailByUnionId() { },
confirm() {
},
selectHospital({hospitalId, hospitalName}) {
this.hospitalId = hospitalId;
this.dectionForm.hospitalName = hospitalName;
this.showselectHospital = false;
},
showAreaFn() {
this.showArea = true;
......@@ -224,8 +274,8 @@ export default {
font-weight: 600;
}
.title-2 {
margin-top: 4rpx;
font-size: 24rpx;
margin-top: 2px;
font-size: 12px;
}
.appoint-form-title{
font-size: 14px;
......@@ -246,6 +296,10 @@ export default {
/deep/ .van-field__label{
color: #212121;
}
/deep/ .van-field__control:disabled{
color: #323233;
-webkit-text-fill-color: #323233;
}
.item {
color: #212121;
font-size: 14px;
......@@ -343,7 +397,7 @@ export default {
}
}
.pop-wrap {
width: calc(100% - 64rpx);
width: calc(100% - 32px);
padding: 0 16px;
.tab-list {
position: relative;
......@@ -400,7 +454,7 @@ export default {
position: absolute;
top: 58px;
left: 130px;
width: calc(100% - 260rpx);
width: calc(100% - 130px);
.right-item {
padding-left: 22px;
width: 100%;
......@@ -408,7 +462,7 @@ export default {
font-size: 16px;
font-weight: 400;
color: #666666;
line-height: 82rpx;
line-height: 41px;
}
.right-item-active {
color: #00bda5;
......@@ -421,27 +475,7 @@ export default {
.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;
......
此差异已折叠。
......@@ -30,7 +30,25 @@ module.exports = {
});
config.plugins.delete('prefetch');
config.plugins.delete('preload');
}
},
devServer: {
port: 8083,
proxy: {
'/proxy': {
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
// target: 'http://10.241.65.90:3000/mock/1067',
ws: false,
changeOrigin: true,
secure: true,
pathRewrite: {
'^/proxy': '/',
},
},
},
},
};
module.exports.publicPath = process.env.VUE_APP_ENV === 'development' && process.env.VUE_APP_IS_LOCAL ? process.env.BASE_URL : `${process.env.VUE_APP_OSS_URL}/static${process.env.BASE_URL}`;
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册