Commit 114368d3 authored by gengchunlei's avatar gengchunlei

列表添加下拉刷新操作

parent d64415a6
NODE_ENV=prod
VUE_APP_PATH = https://ynfymds-service.yiboshi.com
VUE_APP_BASE_URL1 = https://yaoju-service.yiboshi.com
VUE_APP_BASE_URL = https://beta-yjservice.yiboshi.com
VUE_APP_BASE_URL = https://yaoju-service.yiboshi.com
VUE_APP_BASE_URL1 = https://beta-yjservice.yiboshi.com
VUE_APP_BASE_URL1 = https://yyyaoju-service.yyjtzc.com
......@@ -14,7 +14,7 @@
src="https://webapi.amap.com/maps?v=1.4.15&key=e8a56e9582dbac15d801174310ea43d7"></script>
<script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
<script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.3.4/vconsole.min.js"></script>
<!-- <script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.3.4/vconsole.min.js"></script>-->
<title>云南省免费提供避孕药具服务平台</title>
<!-- <script>-->
<!-- //声明_czc对象:-->
......@@ -30,7 +30,7 @@
<script type="text/javascript">document.write(unescape("%3Cspan id='cnzz_stat_icon_1280549113'%3E%3C/span%3E%3Cscript src='https://v1.cnzz.com/z_stat.php%3Fid%3D1280549113%26show%3Dpic1' type='text/javascript'%3E%3C/script%3E"));</script>
</body>
<script>
var vConsole =new VConsole();
console.log('Hello world');
// var vConsole =new VConsole();
// console.log('Hello world');
</script>
</html>
import Vue from 'vue'
import {Button, Popup, Form, Field, Stepper, Notify } from "vant";
import {Button, Popup, Form, Field, Stepper, Notify, Dialog, PullRefresh } from "vant";
Vue.use(Button);
Vue.use(Popup);
......@@ -7,3 +7,5 @@ Vue.use(Form)
Vue.use(Field);
Vue.use(Stepper)
Vue.use(Notify)
Vue.use(Dialog)
Vue.use(PullRefresh)
<template>
<div>
<van-pull-refresh v-model="isLoading"
success-text="刷新成功"
@refresh="onRefresh"
:disabled="isRefreshDisable"
>
<mt-header title="领取记录">
<div slot="left" @click="goBack">
<mt-button icon="back"></mt-button>
......@@ -17,14 +22,15 @@
</mt-header>
<div>
<div
class="list-data"
v-infinite-scroll="loadMore"
:infinite-scroll-disabled="loading"
infinite-scroll-distance="10"
id="collectListIds"
v-if="!lossVisible"
v-show="!lossVisible"
ref="notLoss"
>
<div class="content" v-for="item in detailInfo" :key="item.id">
<!-- 领取记录-->
......@@ -67,6 +73,7 @@
</div>
</div>
<div
class="list-data"
v-infinite-scroll="loadLossReportMore"
......@@ -74,7 +81,7 @@
infinite-scroll-distance="10"
id="collectListId"
v-show="lossVisible"
ref="loss"
>
<div class="content" v-for="item in lossDetailInfo" :key="item.id">
<!--可重新申领列表-->
......@@ -121,12 +128,15 @@
</div>
</div>
<div class="loading" v-if="loading">
<span id="load-text">{{loadText}}</span>
</div>
<div v-if="noDataShow">
<NoData></NoData>
</div>
<van-popup
v-model="popupVisible"
position="bottom"
......@@ -182,7 +192,7 @@
</div>
</van-popup>
</div>
</van-pull-refresh>
</div>
</template>
......@@ -229,10 +239,50 @@
anewNumber: undefined,
otherReason: undefined,
lossReportReasonUser: undefined,
},
isLoading: false,
isRefreshDisable: false,
scrollTop: 0
}
},
watch: {
scrollTop(newval) {
if (newval> 0) {
this.isRefreshDisable = true
} else {
this.isRefreshDisable = false
}
}
},
mounted() {
this.$nextTick(() => {
const notlist = this.$refs.notLoss
notlist.addEventListener('scroll', () => {
this.scrollTop = notlist.scrollTop
})
const list = this.$refs.loss
list.addEventListener('scroll', () => {
this.scrollTop = list.scrollTop
})
})
},
methods: {
//刷新
onRefresh() {
this.isLoading = true
if (this.lossVisible) {//重新申领列表
this.lossLoading = false
this.lossParam.pageIndex = 1
this.getLossRRecordInfo()
} else {//领取记录列表
this.loading = true
this.param.pageIndex = 1
this.getRecordInfo()
}
},
getRecordInfo(callBack) {
Indicator.open();
this.param.telephone = JSON.parse(window.sessionStorage.getItem('mobileTokenIno')).phone
......@@ -241,6 +291,9 @@
this.detailInfo = []
}
const {dataList = []} = data.data
if (this.isLoading) { //刷新时先赋空
this.detailInfo = []
}
this.detailInfo = this.detailInfo.concat(dataList)
if (this.detailInfo.length == 0) {
this.noDataShow = true
......@@ -253,6 +306,7 @@
this.loading = false
}
Indicator.close();
this.isLoading = false
callBack && callBack()
}).catch(res => {
Toast({
......@@ -260,8 +314,10 @@
duration: 2000
});
this.loading = false
this.isLoading = false
}).finally(() => {
this.loading = false
this.isLoading = false
Indicator.close();
})
},
......@@ -278,6 +334,9 @@
if (this.lossParam.pageIndex == 1) {
this.lossDetailInfo = []
}
if (this.isLoading) { //刷新时先赋空
this.lossDetailInfo = []
}
dataList.forEach(item => item['checked'] = false)
this.lossDetailInfo = this.lossDetailInfo.concat(dataList)
if (this.lossDetailInfo.length == 0) {
......@@ -292,9 +351,12 @@
this.lossLoading = false
}
Indicator.close();
this.isLoading = false
callBack && callBack()
this.isLoading = false
}).finally(() => {
this.lossLoading = false
this.isLoading = false
Indicator.close();
})
},
......@@ -342,10 +404,12 @@
// this.lossDetailInfo = []
this.lossParam.pageIndex = 0
this.lossVisible = true
this.scrollTop = 0
this.loadLossReportMore()
},
cancelLossReport() {
// this.detailInfo = []
this.scrollTop = 0
this.clickInfo = {}
this.param.pageIndex = 0
this.loadMore()
......@@ -620,3 +684,9 @@
/*margin-left: calc(50% - 100px) ;*/
}
</style>
<style lang="less">
.van-pull-refresh__track {
height: 100vh!important;
}
</style>
......@@ -21,7 +21,8 @@
<div class="listTitle"><span class="listTitle_span">领取人信息</span></div>
<div class="inp_pad_resident">
<mt-field label="身份证号" placeholder="请输入领取人身份证号(必填)" v-model="formData.idCar" @change="changeIdCard"></mt-field>
<!--@change="changeIdCard"-->
<mt-field label="身份证号" placeholder="请输入领取人身份证号(必填)" v-model="formData.idCar" ></mt-field>
<mt-field label="领取人姓名" placeholder="请输入领取人姓名(必填)" v-model="formData.residentName"></mt-field>
<mt-field label="手机号码" placeholder="请输入领取人手机号(必填)" v-model="formData.telephone"></mt-field>
<mt-field label="验证码" placeholder="请输入验证码(必填)" v-model="formData.code">
......@@ -69,7 +70,7 @@
},
created() {
this.urltext()
let initPeople = JSON.parse(window.sessionStorage.getItem('initPeople'))
let initPeople = JSON.parse(window.localStorage.getItem('initPeople'))
if (initPeople) {
this.formData.residentName = initPeople.residentName
this.formData.idCar = initPeople.idCar
......@@ -109,7 +110,7 @@
idCard: this.formData.idCar
}
getUserInfoByIdCard(par).then(({data}) => {
this.formData.residentName = data.residentName
this.formData.residentName = data.data.residentName
this.formData.telephone = data.telephone
})
}
......@@ -117,6 +118,13 @@
getCode() {
var ckPhone = /^1(?:3[0-9]|4[5-9]|5[0-9]|6[12456]|7[0-8]|8[0-9]|9[0-9])[0-9]{8}$/;
var cktel = /^0[1-9][0-9]{1,2}-[2-8][0-9]{6,7}$/;
let idCardResult = /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i.test(this.formData.idCar)
if (!idCardResult) {
return Toast({
message: '请输入正确的身份证号!',
duration: 2000
});
}
if (ckPhone.test(this.formData.telephone) || cktel.test(this.formData.telephone)) {
this.countDownTime = 60
this.sendFlag = false
......@@ -196,7 +204,7 @@
...this.formData,
resource: '2'
}
window.sessionStorage.setItem('initPeople', JSON.stringify(this.formData))
window.localStorage.setItem('initPeople', JSON.stringify(this.formData))
this.$router.push({path:'/manualCollection', query: par})
} else {
return Toast({
......
<template>
<div>
<van-pull-refresh v-model="isLoading"
success-text="刷新成功"
@refresh="onRefresh"
:disabled="isRefreshDisable"
>
<mt-header title="人工网点申领">
<div slot="left" @click="goBack">
<mt-button icon="back"></mt-button>
......@@ -30,7 +35,8 @@
v-infinite-scroll="loadMore"
:infinite-scroll-disabled="loading"
infinite-scroll-distance="10"
v-if="!noDataShow"
v-show="!noDataShow"
ref="mc"
>
<div class="content" v-for="item in detailInfo" :key="item.id">
<div class="title_bor">
......@@ -89,8 +95,37 @@
</template>
</NoData>
</div>
</div>
<div>
<van-dialog v-model="showForm" show-cancel-button @confirm="confireForm" @cancel="closeForm">
<div style="padding: 8px">
<div style="font-weight: bold;padding: 7px" slot="title">输入领取人信息</div>
<!-- @change="changeIdCard"-->
<van-form ref="pform" :show-error-message="true">
<van-field
v-model="formData.idCard"
name="idCard"
class="res_input"
placeholder="请输入领取人身份证号码(必填)"
:rules="[
{ required: true, message: '请填身份证号码' },
{ pattern: /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i, message: '请输入正确的身份证号' }
]"
/>
<van-field
v-model="formData.residentName"
name="residentName"
class="res_input"
placeholder="请输入领取人姓名(必填)"
:rules="[{ required: true, message: '请填写姓名' }]"
/>
</van-form>
</div>
</van-dialog>
</div>
</div>
</van-pull-refresh>
</div>
</template>
......@@ -98,7 +133,8 @@
import {
addManualMedicalRecord,
getManualNetworkMedical,
addSingleManualMedicalRecord
addSingleManualMedicalRecord,
getUserInfoByIdCard
} from "../../utils/api";
import NoData from '../component/noData';
import { Toast,Indicator } from 'mint-ui';
......@@ -118,14 +154,57 @@
pageIndex: 0,
pageSize: 10
},
dataInfo: {}
dataInfo: {},
showForm: false,
hasError: false,
formData:{
idCard: undefined,
residentName: undefined
},
isLoading: false,
isRefreshDisable: false,
scrollTop: 0
}
},
watch: {
scrollTop(newval) {
if (newval> 0) {
this.isRefreshDisable = true
} else {
this.isRefreshDisable = false
}
}
},
mounted() {
this.$nextTick(() => {
const list = this.$refs.mc
list.addEventListener('scroll', () => {
this.scrollTop = list.scrollTop
})
})
},
created() {
this.routerDetail = this.$route.query
if (this.routerDetail.resource == 1) {
this.showForm = true
let AppPeople = JSON.parse(window.localStorage.getItem('AppPeople'))
if (AppPeople) {
this.formData.residentName = AppPeople.residentName
this.formData.idCard = AppPeople.idCard
}
} else {
this.showForm = false
}
// this.sessionInfo = JSON.parse(window.sessionStorage.getItem('mobileTokenIno'))
},
methods: {
//刷新
onRefresh() {
this.isLoading = true
this.loading = true
this.param.pageIndex = 1
this.getRecordInfo()
},
getRecordInfo(callBack) {
let par = {
relationId: this.routerDetail.id,
......@@ -138,6 +217,9 @@
item['number'] = 0
item['availableCopy'] = item.available
})
if (this.isLoading) { //刷新时先赋空
this.detailInfo = []
}
this.detailInfo = this.detailInfo.concat(dataList)
if (this.detailInfo.length == 0) {
this.noDataShow = true
......@@ -149,6 +231,7 @@
} else {
this.loading = false
}
this.isLoading = false
// callBack && callBack()
}).catch(res => {
Toast({
......@@ -158,6 +241,7 @@
this.loading = false
}).finally(() => {
this.loading = false
this.isLoading = false
})
},
loadMore() {
......@@ -165,6 +249,28 @@
this.param.pageIndex += 1
this.getRecordInfo()
},
changeIdCard() {
let result = /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|X)$/i.test(this.formData.idCard)
if (result) {
let par = {
idCard: this.formData.idCard
}
getUserInfoByIdCard(par).then(({data}) => {
this.formData.residentName = data.data.residentName
})
}
},
confireForm() {
this.$refs.pform.validate(['residentName', 'idCard']).then(() => {
window.localStorage.setItem('AppPeople', JSON.stringify(this.formData))
}).catch((err) => {
this.showForm = true
console.log(err)
})
},
closeForm() {
this.$router.push({path:'/'})
},
delNumber(val) {
this.detailInfo.forEach(item => {
if (item.id == val.id) {
......@@ -336,6 +442,14 @@
Indicator.open()
// let info = JSON.parse(window.sessionStorage.getItem('mobileTokenIno'))
// const {phone = '', userId =''} = info
let res = {idCard: undefined, residentName: undefined}
if (this.routerDetail.resource == 1) {
res.idCard = this.formData.idCard
res.residentName = this.formData.residentName
} else {
res.idCard = this.routerDetail.idCar
res.residentName = this.routerDetail.residentName
}
let par = {
...record,
phone: this.routerDetail.telephone,
......@@ -344,8 +458,9 @@
number: +record.number,
produceDate: record.produceDate + ' '+'00:00:00',
expireDate: record.expireDate + ' '+'00:00:00',
residentName: this.routerDetail.residentName,
resource: this.routerDetail.resource
residentName: res.residentName,
resource: this.routerDetail.resource,
idCard: res.idCard,
}
// console.log(JSON.stringify(par))
addSingleManualMedicalRecord(par).then(({data}) => {
......@@ -503,3 +618,17 @@
bottom: 20px;
}
</style>
<style lang="less">
.res_input {
input[type=text], input[type=date] {
background: #fff;
padding: 1.375rem 0.75rem!important;
}
}
</style>
<style lang="less">
.van-pull-refresh__track {
height: 100vh!important;
}
</style>
......@@ -141,31 +141,16 @@
}
},
toCollectRecords() {
/* this.$router.push({
path: `/siteDetails`, query: {
info: JSON.stringify({
"id": 1,
"createUnitId": 16625,
"netName": "网点1",
"netType": 1,
"netTypeName": "自助发放网点",
"distance": 0.6326,
"areaCode": "530111002004",
"areaName": "前卫路社区居委会",
"netAddress": "云南省昆明动物园",
"netLongitude": "102.719907",
"netLatitude": "25.029347",
"netPerson": "yang",
"netPhone": "15845254852",
"status": 0,
"statusName": "启用",
"created": "2020-11-02 11:48:15",
"updated": "2020-11-02 17:05:14",
'nowLocal': this.lngLat
})
}
});*/
// this.$router.push({path: `/choiceContraceptives`,query:{info:1}});
// let result = {
// id: 100,
// netType: '2',
// netTypeName:"人工发放网点",
// netName: '615优化测试',
// status: 0,
// telephone: '18288250254',
// resource: '1'
// }
// this.$router.push({path: `/manualCollection`, query: result});
this.$router.push('/collectRecords');
},
toRealHome() {
......
<template>
<div class="siteDetails">
<van-pull-refresh v-model="isLoading"
success-text="刷新成功"
@refresh="onRefresh"
:disabled="isRefreshDisable"
>
<mt-header title="网点详情">
<div @click="goBack" slot="left">
<mt-button icon="back"></mt-button>
......@@ -30,6 +35,7 @@
class="list-data"
infinite-scroll-distance="10"
v-infinite-scroll="loadMore"
ref="sited"
>
<div :key="item.id"
......@@ -58,6 +64,7 @@
<div v-if="noDataShow">
<NoData></NoData>
</div>
</van-pull-refresh>
</div>
</template>
......@@ -85,8 +92,28 @@
pageSize: 10
},
no_picture,
isLoading: false,
isRefreshDisable: false,
scrollTop: 0
}
},
watch: {
scrollTop(newval) {
if (newval> 0) {
this.isRefreshDisable = true
} else {
this.isRefreshDisable = false
}
}
},
mounted() {
this.$nextTick(() => {
const list = this.$refs.sited
list.addEventListener('scroll', () => {
this.scrollTop = list.scrollTop
})
})
},
created() {
/*发请求通过this.$route.query.id*/
this.siteDetail = JSON.parse(this.$route.query.info)
......@@ -94,6 +121,13 @@
// this.getMedicalInfoList()
},
methods: {
//刷新
onRefresh() {
this.isLoading = true
this.loading = true
this.param.pageIndex = 1
this.getMedicalInfoList()
},
loadMore() {
this.loading = true
this.param.pageIndex += 1
......@@ -107,6 +141,9 @@
}
getStockInfo(par).then(({data}) => {
const {dataList = []} = data.data
if (this.isLoading) { //刷新时先赋空
this.stockInfo = []
}
this.stockInfo = this.stockInfo.concat(dataList)
if (this.stockInfo.length == 0) {
this.noDataShow = true
......@@ -119,9 +156,11 @@
this.loading = false
}
Indicator.close();
this.isLoading = false
callBack && callBack()
}).finally(() => {
this.loading = false
this.isLoading = false
})
},
clickAddress() {
......@@ -293,3 +332,9 @@
overflow-y: auto;
}
</style>
<style lang="less">
.van-pull-refresh__track {
height: 100vh!important;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment