|
@@ -4,19 +4,21 @@
|
|
|
<text class="nav-back" :style="{ top: statusBarHeight + 'px' }" @click="onBack"></text>
|
|
<text class="nav-back" :style="{ top: statusBarHeight + 'px' }" @click="onBack"></text>
|
|
|
<text class="nav-title">药品追溯码查询</text>
|
|
<text class="nav-title">药品追溯码查询</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <view class="page" :style="{
|
|
|
|
|
|
|
+ <scroll-view class="page" :style="{
|
|
|
marginTop: statusBarHeight + 44 + 'px',
|
|
marginTop: statusBarHeight + 44 + 'px',
|
|
|
height: pageHeight + 'px',
|
|
height: pageHeight + 'px',
|
|
|
- }">
|
|
|
|
|
|
|
+ }" @scrolltolower="onHistoryScrollToLower" scroll-y="true">
|
|
|
<view class="scan-tip" @click="handleScanTipClick">
|
|
<view class="scan-tip" @click="handleScanTipClick">
|
|
|
<uni-icons type="help" size="18" color="#2c69ff"></uni-icons>
|
|
<uni-icons type="help" size="18" color="#2c69ff"></uni-icons>
|
|
|
<text :style="{ marginLeft: '5rpx', paddingBottom: '5rpx' }">可扫码生产企业及药品</text>
|
|
<text :style="{ marginLeft: '5rpx', paddingBottom: '5rpx' }">可扫码生产企业及药品</text>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="scan-card" @click="handleScan">
|
|
<view class="scan-card" @click="handleScan">
|
|
|
- <image src="../../static/images/camera.png" mode="scaleToFill" class="scan-icon" />
|
|
|
|
|
- <text class="scan-text">扫码查询</text>
|
|
|
|
|
|
|
+ <view class="scan-card-content">
|
|
|
|
|
+ <image src="../../static/images/camera.png" mode="scaleToFill" class="scan-icon" />
|
|
|
|
|
+ <text class="scan-text">扫码查询</text>
|
|
|
|
|
+ </view>
|
|
|
</view>
|
|
</view>
|
|
|
- <text class="hint">请扫描药品最小销售包装上的追溯码</text>
|
|
|
|
|
|
|
+ <view class="hint">请扫描药品最小销售包装上的追溯码</view>
|
|
|
<view class="input-wrap">
|
|
<view class="input-wrap">
|
|
|
<input class="input" v-model="traceCode" maxlength="23" @input="onTraceInput" placeholder="请输入 20 位药品追溯码" />
|
|
<input class="input" v-model="traceCode" maxlength="23" @input="onTraceInput" placeholder="请输入 20 位药品追溯码" />
|
|
|
</view>
|
|
</view>
|
|
@@ -27,8 +29,7 @@
|
|
|
<text class="tip">若扫码失败,可手动输入追溯码查询</text>
|
|
<text class="tip">若扫码失败,可手动输入追溯码查询</text>
|
|
|
<view class="section-title">扫码历史</view>
|
|
<view class="section-title">扫码历史</view>
|
|
|
|
|
|
|
|
- <scroll-view class="history-list" v-if="history.length != 0 && !loading" :scroll-y="history.length > 4"
|
|
|
|
|
- @scrolltolower="onHistoryScrollToLower">
|
|
|
|
|
|
|
+ <view class="history-list" v-if="history.length != 0 && !loading">
|
|
|
<view class="history-item" v-for="item in history" :key="item.code" @click="onTapHistory(item)">
|
|
<view class="history-item" v-for="item in history" :key="item.code" @click="onTapHistory(item)">
|
|
|
<view class="history-left">
|
|
<view class="history-left">
|
|
|
<view class="history-title">{{ item.physicName }}</view>
|
|
<view class="history-title">{{ item.physicName }}</view>
|
|
@@ -41,7 +42,7 @@
|
|
|
<image class="loading-icon" :src="loadingImg" />
|
|
<image class="loading-icon" :src="loadingImg" />
|
|
|
</view>
|
|
</view>
|
|
|
</view>
|
|
</view>
|
|
|
- </scroll-view>
|
|
|
|
|
|
|
+ </view>
|
|
|
<view v-else-if="!loading" style="margin-top: 20rpx;">
|
|
<view v-else-if="!loading" style="margin-top: 20rpx;">
|
|
|
<Empty text="暂无扫码历史" />
|
|
<Empty text="暂无扫码历史" />
|
|
|
</view>
|
|
</view>
|
|
@@ -49,7 +50,7 @@
|
|
|
<image class="loading-icon" src="../../static/images/loading.png" mode="scaleToFill"
|
|
<image class="loading-icon" src="../../static/images/loading.png" mode="scaleToFill"
|
|
|
:style="{ width: '66rpx', height: '50rpx' }" />
|
|
:style="{ width: '66rpx', height: '50rpx' }" />
|
|
|
</view>
|
|
</view>
|
|
|
- </view>
|
|
|
|
|
|
|
+ </scroll-view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
@@ -68,13 +69,20 @@ export default {
|
|
|
pageHeight: 0,
|
|
pageHeight: 0,
|
|
|
traceCode: "",
|
|
traceCode: "",
|
|
|
history: [],
|
|
history: [],
|
|
|
- totalCount: 20,
|
|
|
|
|
|
|
+ totalCount: 0,
|
|
|
pageNum: 1,
|
|
pageNum: 1,
|
|
|
pageSize: 7,
|
|
pageSize: 7,
|
|
|
loading: true,
|
|
loading: true,
|
|
|
isLoading: false,
|
|
isLoading: false,
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
|
|
+ onShow() {
|
|
|
|
|
+ this.history = []
|
|
|
|
|
+ this.totalCount = 0
|
|
|
|
|
+ this.pageNum = 1
|
|
|
|
|
+ this.isLoading = false
|
|
|
|
|
+ this.getHistoryData();
|
|
|
|
|
+ },
|
|
|
onLoad() {
|
|
onLoad() {
|
|
|
const info = uni.getSystemInfoSync();
|
|
const info = uni.getSystemInfoSync();
|
|
|
this.statusBarHeight = info.statusBarHeight || 20;
|
|
this.statusBarHeight = info.statusBarHeight || 20;
|
|
@@ -85,8 +93,6 @@ export default {
|
|
|
if (winH) {
|
|
if (winH) {
|
|
|
this.pageHeight = Math.max(0, winH - navH);
|
|
this.pageHeight = Math.max(0, winH - navH);
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
- this.getHistoryData();
|
|
|
|
|
},
|
|
},
|
|
|
computed: {
|
|
computed: {
|
|
|
canQuery() {
|
|
canQuery() {
|
|
@@ -198,7 +204,7 @@ export default {
|
|
|
|
|
|
|
|
<style>
|
|
<style>
|
|
|
.scan-tip {
|
|
.scan-tip {
|
|
|
- margin-top: -40rpx;
|
|
|
|
|
|
|
+ margin-top: 30rpx;
|
|
|
color: #2c69ff;
|
|
color: #2c69ff;
|
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
|
width: 100%;
|
|
width: 100%;
|
|
@@ -245,14 +251,20 @@ export default {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
- padding: 55rpx;
|
|
|
|
|
- padding-bottom: calc(55rpx + env(safe-area-inset-bottom));
|
|
|
|
|
|
|
+ padding: 0 55rpx;
|
|
|
|
|
+ padding-bottom: env(safe-area-inset-bottom);
|
|
|
background-color: rgb(243, 246, 249);
|
|
background-color: rgb(243, 246, 249);
|
|
|
overflow-y: auto;
|
|
overflow-y: auto;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.scan-card {
|
|
.scan-card {
|
|
|
flex-shrink: 0;
|
|
flex-shrink: 0;
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ justify-content: center;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.scan-card-content {
|
|
|
width: 320rpx;
|
|
width: 320rpx;
|
|
|
height: 320rpx;
|
|
height: 320rpx;
|
|
|
background-color: #fff;
|
|
background-color: #fff;
|
|
@@ -342,7 +354,6 @@ export default {
|
|
|
|
|
|
|
|
.history-list {
|
|
.history-list {
|
|
|
width: 640rpx;
|
|
width: 640rpx;
|
|
|
- height: 600rpx;
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.history-item {
|
|
.history-item {
|