8 changed files with 848 additions and 191 deletions
@ -0,0 +1,169 @@ |
|||
<template> |
|||
<view class="bed-wait-item" v-for="(item, index) in bedWaitList" :key="index" @tap="lookDetail(item)"> |
|||
|
|||
<view class="bed-wait-info"> |
|||
<view class="bed-wait-name PfScMedium">{{ item.coin_name }}</view> |
|||
|
|||
<view class="bed-desc flex"> |
|||
<view :class="['bed-age',type == '1' ? 'bold':'']">{{ item.buying_price }}元{{ type == '2' ?'进':'' }}</view> |
|||
<view class="bed-sex bed-sex-bold" v-if="type == '2'">{{ item.price }}元售</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="bed-wait-time"> |
|||
<view class="bed-left"> |
|||
<!-- 布局修改 --> |
|||
<view class="bed-left-flex"> |
|||
<view class="bed-sex">{{ item.year }}</view> |
|||
<view class="bed-visit-format" v-if="item.format">{{ item.format }}</view> |
|||
</view> |
|||
<view>{{ item.rating_department }}</view> |
|||
</view> |
|||
|
|||
<view class="bed-checkin-time flex-between"> |
|||
<view class="bed-visit-time">{{ item.operate_time }}</view> |
|||
<view>{{ item.rating_code }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
export default { |
|||
props:['bedWaitList','type'], |
|||
options: { styleIsolation: "shared" }, |
|||
components: { |
|||
|
|||
}, |
|||
data() { |
|||
return { |
|||
list:[] |
|||
} |
|||
}, |
|||
methods:{ |
|||
lookDetail(item) { |
|||
uni.setStorageSync('detail', JSON.stringify(item)) |
|||
let url = `/pages/coinsDetail/index?id=${item.rating_code}` |
|||
this.$nav.navToPath(url) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
.bold{ |
|||
font-weight: 500 !important; |
|||
color: #000000 !important; |
|||
|
|||
} |
|||
.bed-wait-item { |
|||
padding: 36rpx 0rpx; |
|||
border-bottom: 2rpx solid #F1F1F1; |
|||
position: relative; |
|||
|
|||
} |
|||
|
|||
.bed-wait-info { |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
.bed-wait-name { |
|||
font-size: 32rpx; |
|||
color: #000000; |
|||
margin-right: 24rpx; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.bed-visit-type-desc { |
|||
padding: 0 18rpx; |
|||
height: 40rpx; |
|||
box-sizing: border-box; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 26rpx; |
|||
line-height: normal; |
|||
border-radius: 6rpx; |
|||
margin-left: 24rpx; |
|||
background: #F7FCFF; |
|||
color: #007FD0; |
|||
border: 1rpx solid #5FA1CB; |
|||
|
|||
&.ml-auto { |
|||
margin-left: auto; |
|||
} |
|||
} |
|||
|
|||
.bed-desc { |
|||
color: #999999; |
|||
font-size: 28rpx; |
|||
margin-left: auto; |
|||
gap: 12rpx; |
|||
} |
|||
|
|||
|
|||
.bed-sex { |
|||
font-size: 28rpx; |
|||
font-weight: normal; |
|||
line-height: 44rpx; |
|||
color: #242833; |
|||
letter-spacing: 0.86rpx; |
|||
} |
|||
.bed-sex-bold,.bed-age{ |
|||
font-family: PingFang SC; |
|||
font-size: 30rpx; |
|||
font-weight: 500; |
|||
line-height: 44rpx; |
|||
letter-spacing: 0.86rpx; |
|||
color: #000000; |
|||
} |
|||
.bed-age { |
|||
font-size: 30rpx; |
|||
font-weight: normal; |
|||
line-height: 44rpx; |
|||
letter-spacing: 0.86rpx; |
|||
color: #999999; |
|||
font-weight: normal; |
|||
} |
|||
} |
|||
|
|||
.bed-wait-time { |
|||
display: flex; |
|||
column-gap: 24rpx; |
|||
margin-top: 16rpx; |
|||
flex-direction: column; |
|||
gap: 16rpx; |
|||
view { |
|||
font-size: 24rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.bed-visit-format { |
|||
border-radius: 6rpx; |
|||
background: #EBEBEB; |
|||
padding: 2rpx 16rpx; |
|||
font-family: PingFang SC; |
|||
font-size: 26rpx; |
|||
font-weight: normal; |
|||
line-height: normal; |
|||
letter-spacing: normal; |
|||
color: #666666; |
|||
width: fit-content; |
|||
} |
|||
|
|||
.bed-left { |
|||
display: flex; |
|||
gap: 16rpx; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
.bed-left-flex{ |
|||
display: flex; |
|||
gap: 24rpx; |
|||
align-items: center; |
|||
} |
|||
} |
|||
.flex-between{ |
|||
display: flex; |
|||
justify-content: space-between; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,250 @@ |
|||
<template> |
|||
<view class="column"> |
|||
<view class="search-wrapper flex"> |
|||
<div class="search-main" :class="{ 'search-main-focus': keyWords > 0 }"> |
|||
<image class="icon" :src="cssUrl + 'prescriptSearch.svg'" mode="widthFix"></image> |
|||
<input class="ft46 input-box" placeholder-class="placeholder-style" placeholder="搜索患者姓名" |
|||
v-model="keyword" /> |
|||
<view class="search-text" :class="{ 'green': keyWords > 0 }" @click="getSearch">搜索</view> |
|||
</div> |
|||
</view> |
|||
<view class="patientTab"> |
|||
<view :class="'notActive ft32' + (status == '1' ? ' active PfScMedium' : '')" @tap="changeWaitType('1')"> |
|||
库存列表</view> |
|||
<view :class="'notActive ft32' + (status == '2' ? ' active PfScMedium' : '')" @tap="changeWaitType('2')"> |
|||
出库列表 |
|||
</view> |
|||
</view> |
|||
|
|||
<scroll-view class="patient-type-tab1" @scrolltolower="onScroll" scroll-y> |
|||
<view class="bed-wait-container"> |
|||
<ListWrap :bedWaitList="bedWaitList" :type="status" /> |
|||
</view> |
|||
<view v-if="loading" class="loading-text">加载中...</view> |
|||
<view v-if="noMore" class="no-more-text">没有更多数据了</view> |
|||
<view class="page-padding" v-show="bedWaitList && bedWaitList.length && bedWaitList.length > 0"> |
|||
</view> |
|||
</scroll-view> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
import ListWrap from '@/components/listWrap.vue' |
|||
|
|||
export default { |
|||
options: { styleIsolation: "shared" }, |
|||
components: { |
|||
ListWrap, |
|||
}, |
|||
data() { |
|||
return { |
|||
list: [], |
|||
cssUrl: this.cssUrl1, |
|||
status: '1', |
|||
loading: false, |
|||
noMore: false, |
|||
page: 1, |
|||
pagesize: 10, |
|||
keyword: '', |
|||
bedWaitList: [] |
|||
} |
|||
}, |
|||
computed: { |
|||
keyWords() { |
|||
return this.keyword.length |
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
// var token = uni.getStorageSync("u_token"); |
|||
// 初始化情求 |
|||
this.getCoinsList() |
|||
// this.$refs.coinsPopup.openPop(); |
|||
}, |
|||
onPullDownRefresh() { |
|||
this.bedWaitList = []; |
|||
this.page = 1; |
|||
this.getCoinsList() |
|||
}, |
|||
onReachBottom() { |
|||
if (!this.noMore && !this.loading) { |
|||
this.page++; |
|||
this.getCoinsList(); |
|||
} |
|||
}, |
|||
methods: { |
|||
onScroll() { |
|||
if (!this.noMore && !this.loading) { |
|||
this.page++; |
|||
this.getCoinsList(); |
|||
} |
|||
}, |
|||
getSearch(){ |
|||
this.page = 1; |
|||
this.getCoinsList() |
|||
}, |
|||
changeWaitType(type) { |
|||
this.status = type; |
|||
this.page = 1; |
|||
this.bedWaitList = []; |
|||
// 调用列表查询接口 |
|||
this.getCoinsList() |
|||
}, |
|||
getCoinsList() { |
|||
this.loading = true; |
|||
// 获取列表信息 |
|||
this.$http.req('/api/getlist', { status: this.status, page: this.page, pagesize: this.pagesize, keyword: this.keyword }, 'POST').then(data => { |
|||
uni.stopPullDownRefresh(); |
|||
this.loading = false; |
|||
if (data.list.length === 0 || data.length == 0) { |
|||
this.noMore = true; |
|||
uni.showToast({ title: '没有更多数据了', icon: 'none' }); |
|||
return; |
|||
} |
|||
// 如果是第一页直接替换,否则追加 |
|||
if (this.page === 1) { |
|||
this.bedWaitList = data.list; |
|||
} else { |
|||
this.bedWaitList = [...this.bedWaitList, ...data.list]; |
|||
} |
|||
console.log(this.bedWaitList,'bedWaitList==='); |
|||
this.storage_count = data.storage_count; |
|||
this.delivery_count = data.delivery_count; |
|||
}).catch(res => { |
|||
this.loading = false; |
|||
}); |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
.column{ |
|||
display: flex; |
|||
height: 100%; |
|||
flex-direction: column; |
|||
} |
|||
.loading-text, |
|||
.no-more-text { |
|||
text-align: center; |
|||
padding: 20rpx; |
|||
color: #999; |
|||
} |
|||
.patient-type-tab1 { |
|||
height: 0; |
|||
width: 100%; |
|||
background: white; |
|||
flex: 1; |
|||
|
|||
.bed-wait-container { |
|||
padding: 0rpx 42rpx; |
|||
background: white; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
} |
|||
|
|||
.search-main-focus { |
|||
border: 2rpx solid #39D067 !important; |
|||
transition: all .3s; |
|||
background: #fff; |
|||
} |
|||
|
|||
.green { |
|||
color: #4DC56D !important; |
|||
} |
|||
|
|||
.search-wrapper { |
|||
margin-top: 20rpx; |
|||
padding: 20rpx 42rpx; |
|||
background: #fff; |
|||
|
|||
input:focus { |
|||
border-color: #39D067; |
|||
} |
|||
|
|||
.search-main { |
|||
transition: all .3s; |
|||
border: 2rpx solid transparent; |
|||
width: 100%; |
|||
border-radius: 6px; |
|||
background: #F7F7F7; |
|||
box-sizing: border-box; |
|||
display: flex; |
|||
height: 70rpx; |
|||
align-items: center; |
|||
padding: 0rpx 20rpx; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.search-main-left { |
|||
align-items: center; |
|||
gap: 12rpx; |
|||
color: #999999; |
|||
} |
|||
|
|||
.input-box { |
|||
height: 70rpx; |
|||
line-height: 70rpx; |
|||
font-size: 28rpx; |
|||
color: #000000; |
|||
text-align: left; |
|||
flex: 1; |
|||
padding-left: 12rpx; |
|||
} |
|||
|
|||
.icon { |
|||
width: 34rpx; |
|||
display: block; |
|||
} |
|||
} |
|||
|
|||
.patientTab { |
|||
width: 100%; |
|||
display: flex; |
|||
justify-content: center; |
|||
height: 120rpx; |
|||
align-items: center; |
|||
margin-top: 20rpx; |
|||
padding: 0 62rpx; |
|||
box-sizing: border-box; |
|||
justify-content: space-between; |
|||
background: white; |
|||
border-radius: 12rpx 12rpx 0rpx 0rpx; |
|||
border-bottom: 2rpx solid rgba(0, 0, 0, 0.15); |
|||
// box-shadow: 0px 1rpx 0rpx 0rpx rgba(0, 0, 0, 0.15); |
|||
|
|||
.notActive { |
|||
width: 269rpx; |
|||
height: 100%; |
|||
text-align: center; |
|||
font-weight: 400; |
|||
color: #666666; |
|||
font-size: 32rpx; |
|||
line-height: 120rpx; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
|
|||
.wait-bed-num { |
|||
padding: 0px 14rpx; |
|||
box-sizing: border-box; |
|||
width: auto; |
|||
height: 38rpx; |
|||
min-width: 60rpx; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
border-radius: 60rpx; |
|||
background: #FFEBEB; |
|||
font-size: 28rpx; |
|||
color: #FF1818; |
|||
margin-left: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.active { |
|||
font-weight: 500; |
|||
color: #4DC56D; |
|||
box-sizing: border-box; |
|||
border-bottom: 4rpx solid #4DC56D; |
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 6.0 KiB |
Loading…
Reference in new issue