From 9d5b4d650e5b01081d3537c750e7469db4d161e3 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: Tue, 29 Apr 2025 08:53:20 +0800
Subject: [PATCH] 提交
---
pages/tabBar/current/current.vue | 361 +++++++++++++++++++++++++++------------------------
1 files changed, 191 insertions(+), 170 deletions(-)
diff --git a/pages/tabBar/current/current.vue b/pages/tabBar/current/current.vue
index 44bedb3..88df9d9 100644
--- a/pages/tabBar/current/current.vue
+++ b/pages/tabBar/current/current.vue
@@ -6,36 +6,54 @@
<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view>
<!-- 真正的导航栏内容 -->
<view class="navBar">
-<!-- <u-icon style=" margin-left: 13px;" name="arrow-left" color="black" size="17" @click="goBack"/>-->
- <view class="barText">课程</view>
-<!-- <view >-->
-<!-- <u-button type="text" @click="loginOut" style="color: #1890ff;margin-right: 5px;width: 65px;">退出</u-button>-->
-<!-- </view>-->
+ <view class="barText">记录查询</view>
</view>
</view>
<!-- 页面内容 -->
+ <u-toast ref="uToast"></u-toast>
<view class="m-p-15">
- <view class="cardList">
- <scroll-view scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
- @scrolltolower="lower" lower-threshold="150" @scroll="scrollView" style="height:100%">
- <view style="padding: 20px 0 20px">
- <view class="card-i" v-for="(item,index) in classList" :key="index">
- <u-image radius="16px" width="200rpx" height="200rpx" :show-loading="true" :src="getImageUrl(item.course.logo)" mode="aspectFill">
- </u-image>
- <!-- <view class="card-i-t">目前已学：{{item.totalProgress}}分钟</view>-->
- <view class="card-i-r">
- <view class="card-i-r-t">
- <view>{{item.phaseName + '-' + item.course.name}}</view>
- <span style="color: #999;font-size: 12px;display: flex;align-items: center"><u-icon name="account" color="#999" size="18" style="margin-bottom: 0;margin-right: 2px"></u-icon>{{item.createName +'('+ item.createTime +')'}}</span>
- </view>
- <view class="card-i-r-b">
- <u-tag icon="clock" :text="secondsToHms(item.course.period)" type="success" size="mini" shape="circle" plain plainFill></u-tag>
- <u-button class="study-button" type="primary" text="开始学习" shape="circle" size="small" @click="toStudy(item)"></u-button>
- </view>
+ <view class="searchBar">
+ <u-input placeholder="请输入或扫描二维码编号进行搜索" v-model="searchContent">
+ <template slot="prefix">
+ <u-icon name="scan" color="#2979ff" size="28" @click="scanCode()"></u-icon>
+ </template>
+ <template slot="suffix">
+ <u-button type="primary" class="searchBtn" size="small" text="溯源查询" shape="circle" @click="getList()"></u-button>
+ </template>
+ </u-input>
+ </view>
+ <view class="productCard" v-if="dataList && dataList.length>0">
+ <view v-if="dataList[0].hazmatBasic">
+ <view>名称：<span>{{dataList[0].hazmatBasic?dataList[0].hazmatBasic.name:''}}({{dataList[0].hazmatBasic?dataList[0].hazmatBasic.productSn :''}})</span></view>
+ <view>条码：<span>{{dataList[0].code}}</span></view>
+ </view>
+ <view v-if="dataList[0].productBasic">
+ <view>名称：{{dataList[0].productBasic?dataList[0].productBasic.name:''}}({{dataList[0].productBasic?dataList[0].productBasic.productSn :''}})</view>
+ <view>条码：{{dataList[0].code}}</view>
+ </view>
+ </view>
+ <view class="cardList" v-if="dataList && dataList.length>0">
+ <view class="card-i" v-for="(item,index) in dataList" :key="index">
+ <view class="card-i-l">
+ <span><u-icon name="clock-fill" color="#2979ff" size="18" style="margin-right: 4px"></u-icon>{{item.updateTime}}</span>
+ <view v-if="item.user">
+ <span></span>{{item.user.departName}}部门的<span style="font-weight: bold">{{item.user.name }}</span>进行了<span :class="item.num>=0?'green':'red'">{{item.state==0?'入库':item.state==1?'取用':item.state==2?'归还':item.state==3?'标签作废':item.state==4?'用尽登记':item.state==5?'销售':item.state==6?'零头入库 ':'--'}}</span>
</view>
</view>
+ <view v-if="item.hazmatBasic" class="card-i-r" :class="item.num>=0?'green':'red'">
+ <span v-if="item.num > 0">+</span>{{item.num + item.hazmatBasic.unit}}
</view>
- </scroll-view>
+ <view v-if="item.productBasic" class="card-i-r" :class="item.num>=0?'green':'red'">
+ <span v-if="item.num > 0">+</span>{{item.num + item.productBasic.unit}}
+ </view>
+ </view>
+ </view>
+ <view v-else style="margin-top: 200rpx">
+ <u-empty
+ mode="list"
+ text="通过条码搜索记录"
+ >
+ </u-empty>
</view>
</view>
<tabBar :currentPagePath="page"></tabBar>
@@ -44,7 +62,7 @@
<script>
import tabBar from '../tabBarIndex.vue'
- import {getClassList} from '../../../api/index.js'
+ import {getHazmatFlowByCode} from '../../../api/index.js'
import tebBar from '../tabBarIndex.vue'
import VUE_APP_BASE_URL from "../../../common/constant";
export default {
@@ -54,59 +72,70 @@
data() {
return {
page: 'pages/tabBar/current/current',
- statusBarHeight: 0,
- classParams: {
- pageNum: 1,
- pageSize: 10,
- },
- classList: [],
- totalPage: 0
+ statusBarHeight: '',
+ searchContent: '',
+ dataList: []
}
},
onLoad() {
- // this.unitType = uni.getStorageSync('unittype') + 1;
- //获取手机状态栏高度
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
- this.classParams.pageNum = 1
- this.getClass();
},
onShow() {
+ // this.getList()
// this.role = uni.getStorageSync('roleName');
},
created(){
uni.hideTabBar()
},
methods: {
- loginOut() {
- uni.clearStorageSync();
- uni.clearStorage();
- uni.navigateTo({
- url: '/pages/index/index'
- })
- },
- goBack() {
- uni.switchTab({
- url:'/pages/tabBar/firstPage/firstPage'
- });
- },
- getClass(){
- getClassList(this.classParams).then(res => {
- if(res.code == 200) {
- let list = res.data.list?res.data.list: [];
- if (res.data.pageNum != 1) {
- this.classList = this.classList.concat(list)
- } else {
- this.classList = res.data.list
+ scanCode(){
+ const t = this
+ t.dataList = []
+ t.searchContent = ''
+ uni.scanCode({
+ autoZoom: false,
+ scanType: ['qrCode'],
+ success: function (res) {
+ if(res && res.result){
+ if(res.result.indexOf('SJ') == -1 && res.result.indexOf('CP') == -1){
+ t.$refs.uToast.show({
+ type: 'default',
+ message: '没有识别到正确的编码，请重新扫码',
+ duration: 2000
+ })
+ return
+ }
+ t.searchContent = res.result
+ getHazmatFlowByCode({code: res.result}).then(re => {
+ if(re.code == 200) {
+ t.dataList = re.data?re.data: []
+ }else{
+ uni.$u.toast(re.message)
+ }
+ })
+ }else{
+ uni.showToast({
+ title: '该二维码已失效或不包含条码信息',
+ duration: 2000
+ })
}
- this.totalPage = res.data.totalPage
- }else{
- uni.$u.toast(res.message)
}
})
},
- getImageUrl(logo) {
- return logo ? VUE_APP_BASE_URL + '/api/' + logo : '/static/defaultCover.jpg';
+ getList(){
+ const t = this
+ if(t.searchContent == ''){
+ uni.$u.toast('请输入二维码编号')
+ }else{
+ getHazmatFlowByCode({code: t.searchContent}).then(re => {
+ if(re.code == 200) {
+ t.dataList = re.data?re.data: []
+ }else{
+ uni.$u.toast(re.message)
+ }
+ })
+ }
},
toStudy(item) {
@@ -115,35 +144,6 @@
url: `/pages/tabBar/current/detail?bank=` + encodeURIComponent(JSON.stringify(item))
})
},
-
- secondsToHms(seconds) {
- seconds = Number(seconds);
- const h = Math.floor(seconds / 3600);
- const m = Math.floor(seconds % 3600 / 60);
- const s = Math.floor(seconds % 3600 % 60);
-
- const hDisplay = h > 0 ? String(h).padStart(2, '0') : '00';
- const mDisplay = m > 0 ? String(m).padStart(2, '0') : '00';
- const sDisplay = s > 0 ? String(s).padStart(2, '0') : '00';
- return `${hDisplay}:${mDisplay}:${sDisplay}`;
- },
-
- upper(e) {
- // console.log(e)
- },
- lower(e) {
- //并且让页码+1,调用获取数据的方法获取第二页数据
- this.classParams.pageNum++
- if (this.classParams.pageNum > this.totalPage){
- uni.$u.toast('已加载全部数据')
- return
- }
- //此处调用自己获取数据列表的方法
- this.getClass()
- },
- scrollView(e) {
- // console.log(e)
- }
}
}
@@ -166,7 +166,7 @@
left: 0;
right: 0;
width: 100%;
- z-index: 1;
+ z-index: 9999;
}
.statusBar{
background-color:lightgrey;
@@ -176,110 +176,131 @@
font-size: 16px;
font-weight: 600;
flex: 2;
- margin-left: 45%;
-}
-.examineList{
- margin-top: 12px;
- height: calc(100vh - 246px);
- overflow: hidden;
- overflow-y: scroll;
+ text-align: center;
}
-.content{
- .tit{
- width: 100%;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- }
- .cont{
- width: 100%;
- font-size: 14px;
- color: #666;
- display: block;
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- margin-bottom: 6px;
- }
- .btnGroup{
- width: 100%;
- display: flex;
- justify-content: space-between;
- }
+.u-input{
+ border-color: #f5f7fa !important;
+ border-radius: 99px;
+ background: #f5f7fa;
+ box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.1),0px 3px 6px rgba(0, 0, 0, 0.1) inset !important;
+ transition: box-shadow .1s ease !important;
}
-.buttonCo{
- margin-top: 5px;
- margin-bottom: 10px;
+.searchBtn{
+ border: 1px solid #fff;
+ padding: 0 30rpx;
+ box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.15)!important;
}
.m-p-15{
width: 100%;
-}
-.cardList{
- width: 100%;
- height: calc(100vh - 130px);
+ padding: 0 15px;
+ margin-top: 20px;
box-sizing: border-box;
- .card-i{
- width: calc(100% - 30px);
+ .searchBar{
+ position: -webkit-sticky;
+ position: sticky;
+ top: 50px;
+ left: 0;
+ right: 0;
+ z-index: 9998;
+ }
+
+ .productCard{
+ width: 100%;
background: #fff;
border-radius: 20px;
padding: 15px;
- margin: 0 auto 15px;
- position: relative;
- display: flex;
- align-items: flex-start;
+ margin: 15px auto;
box-sizing: border-box;
box-shadow: 4px 4px 12px rgba(150,150,150,.05);
- &:last-of-type{
- margin-bottom: 0;
- }
- .card-i-t{
- position: absolute;
- width: 250rpx;
- height: 30px;
- border-radius: 20px;
- line-height: 30px;
- color: #fff;
- padding: 0 10rpx;
- box-sizing: border-box;
- left: 0;
- bottom: 0;
- background: rgba(0,0,0,.4);
- }
- .card-i-r{
+ &>view>view{
width: 100%;
- height: 200rpx;
- margin-left: 20rpx;
+ font-size: 28rpx;
+ font-weight: bold;
+ margin-bottom: 10rpx;
+
+ span{
+ color: #2979ff;
+ }
+
+ &:last-of-type{
+ margin-bottom: 0;
+ }
+ }
+ }
+
+ .cardList{
+ width: 100%;
+ box-sizing: border-box;
+ margin-top: 15px;
+ box-shadow: 4px 4px 12px rgba(150,150,150,.05);
+ padding-bottom: 75px;
+
+ .card-i{
+ width: 100%;
+ background: #fff;
+ border-radius: 12px;
+ padding: 20px 15px;
+ box-sizing: border-box;
+ margin: 0 auto;
display: flex;
- flex-direction: column;
justify-content: space-between;
- .card-i-r-t{
- view{
- font-size: 32rpx;
- margin-bottom: 20rpx;
- font-family: "PingFang SC";
- font-weight: 800;
+ align-items: center;
+ border-bottom: 1px dashed #ccc;
+
+ &:first-of-type{
+ border-radius: 20px 20px 12px 12px;
+ }
+
+ &:last-of-type{
+ margin-bottom: 0;
+ border-bottom: none;
+ border-radius: 12px 12px 20px 20px;
+ }
+
+ .card-i-l{
+ height: 100%;
+ width: 75%;
+ flex-direction: column;
+ align-items: flex-end;
+ justify-content: space-between;
+ &>span{
+ display: flex;
+ align-items: center;
+ font-size: 30rpx;
+ font-weight: bold;
+ margin-bottom: 15rpx;
+ }
+
+ &>view{
+ width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
+ span{
+ &:first-of-type{
+ display: inline-block;
+ width: 22px;
+ }
+ }
}
}
- .card-i-r-b{
- width: 100%;
- display: flex;
- align-items: center;
- justify-content: space-between;
-
- .study-button{
- width: 220rpx;
- margin: 0;
- box-shadow: 3px 3px 12px rgba(51,133,217,.3), -2px -2px 6px #fff;
- border: 1px solid rgba(255,255,255,.8);
- }
+ .card-i-r{
+ height: 100%;
+ width: 25%;
+ text-align: right;
+ font-size: 32rpx;
+ font-weight: bolder;
+ }
+ .green{
+ color: #5fb734;
+ }
+ .red{
+ color: #ed6464
}
}
}
--
Gitblit v1.9.2