<template>
|
<view>
|
<!-- 自定义导航栏 -->
|
<view class="navBarBox fix">
|
<!-- 状态栏占位 -->
|
<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view>
|
<!-- 真正的导航栏内容 -->
|
<view class="navBar">
|
<view class="barText">首页</view>
|
<!-- <view >-->
|
<!-- <u-button type="text" @click="loginOut" style="color: #1890ff;margin-right: 5px;width: 65px;">退出</u-button>-->
|
<!-- </view>-->
|
</view>
|
</view>
|
<u-toast ref="uToast"></u-toast>
|
<view class="cardList" v-if="user.useProd == 1">
|
<view class="switchPanel">
|
<view class="switchBtns">
|
<view class="btnItem" @click="changeTab(1)">
|
危化品
|
</view>
|
<view class="btnItem" @click="changeTab(2)">
|
成品
|
</view>
|
</view>
|
<view class="colBlock" :style="blockStyle">
|
{{blockText}}
|
</view>
|
</view>
|
</view>
|
<view class="cardList" v-show="tabNum == 1">
|
<view class="cardItem" v-for="(item,index) in cardList1" :key="index" @click="scanCode(item.title)">
|
<u-image radius="16px" width="140rpx" height="140rpx" :show-loading="true" :src="item.icon" mode="aspectFill">
|
</u-image>
|
<view class="cardTit">
|
{{item.title}}
|
</view>
|
</view>
|
</view>
|
<view class="cardList" v-show="tabNum == 2">
|
<view class="cardItem" v-for="(item,index) in cardList2" :key="index" @click="scanCode(item.title)">
|
<u-image radius="16px" width="140rpx" height="140rpx" :show-loading="true" :src="item.icon" mode="aspectFill">
|
</u-image>
|
<view class="cardTit">
|
{{item.title}}
|
</view>
|
</view>
|
</view>
|
<u-modal :show="showModal" :title="modalTitle" :showConfirmButton="false" :closeOnClickOverlay="true" ref="uModal" :asyncClose="true" @close="closeModal()">
|
<view v-if="tabNum == 1" style="font-size: 32rpx;font-weight: bold;margin-bottom: 10px">
|
{{hazmat.hazmatBasic?hazmat.hazmatBasic.name:'--'}}（{{hazmat.hazmatBasic?hazmat.hazmatBasic.productSn:'--'}}）
|
</view>
|
<view v-if="tabNum == 2" style="font-size: 32rpx;font-weight: bold;margin-bottom: 10px">
|
{{product.productBasic?product.productBasic.name:'--'}}（{{product.productBasic?product.productBasic.productSn:'--'}}）
|
</view>
|
<view>
|
二维码识别号：{{tabNum == 1?hazmat.code:product.code}}
|
</view>
|
<view>
|
入库时间：{{tabNum == 1?hazmat.createTime:product.createTime}}
|
</view>
|
<view v-if="modalTitle == '取用' || modalTitle == '扫码作废'">
|
<span v-if="tabNum == 1">当前包装存量：{{hazmat.remaining}}{{hazmat.hazmatBasic?hazmat.hazmatBasic.unit:''}}</span>
|
<span v-else>当前包装存量：{{product.remaining}}{{product.productBasic?product.productBasic.unit:''}}</span>
|
</view>
|
<view v-if="modalTitle == '归还' || modalTitle == '用尽登记'">
|
取用时存量：{{hazmat.remaining}}{{hazmat.hazmatBasic?hazmat.hazmatBasic.unit:''}}
|
</view>
|
<br>
|
<view v-if="modalTitle == '归还'">
|
请输入归还剩余量：
|
<u--form labelPosition="left" :model="hazmatBack" :rules="rules" ref="uForm">
|
<u-form-item
|
prop="remaining"
|
ref="remaining"
|
>
|
<u--input
|
v-model="hazmatBack.remaining"
|
:placeholder="'必填(单位：' + (hazmat.hazmatBasic?hazmat.hazmatBasic.unit:'') + ')'"
|
type="number"
|
></u--input>
|
</u-form-item>
|
</u--form>
|
</view>
|
<u-button v-if="modalTitle == '取用'" type="primary" style="margin-top: 20px" text="确认取用" @click="confirmTake()"></u-button>
|
<u-button v-if="modalTitle == '归还'" type="primary" style="margin-top: 20px" text="确认归还" @click="confirmBack()"></u-button>
|
<u-button v-if="modalTitle == '用尽登记'" type="warning" style="margin-top: 20px" text="确认用尽登记" @click="confirmCheck()"></u-button>
|
<u-button v-if="modalTitle == '销售'" type="primary" style="margin-top: 20px" text="确认销售" @click="confirmSell()"></u-button>
|
<u-button v-if="modalTitle == '扫码作废'" type="error" style="margin-top: 20px" text="确认作废该二维码" @click="confirmCancle()"></u-button>
|
</u-modal>
|
<tabBar :currentPagePath="page"></tabBar>
|
</view>
|
</template>
|
|
<script>
|
import tabBar from '../tabBarIndex.vue'
|
import {
|
getHazmatByCode,
|
postHazmatReturn,
|
postHazmatUse,
|
postHazmatUsed,
|
postHazmatDiscard,
|
postProductDiscard, getProductByCode, postProductSold,
|
getUserInfo
|
} from '../../../api/index.js'
|
import VUE_APP_BASE_URL from 'common/constant.js'
|
import take from '../../../static/take.png'
|
import takeBack from '../../../static/return.png'
|
import check from '../../../static/check.png'
|
import del from '../../../static/delete.png'
|
import sell from '../../../static/sell.png'
|
import {postEndExam} from "../../../api/wearhouse";
|
export default {
|
components:{
|
tabBar
|
},
|
data() {
|
return {
|
page: 'pages/tabBar/firstPage/firstPage',
|
statusBarHeight: '',
|
cardList1: [
|
{
|
icon: take,
|
title: '取用',
|
type: 1
|
},
|
{
|
icon: takeBack,
|
title: '归还',
|
type: 2
|
},
|
{
|
icon: check,
|
title: '用尽登记',
|
type: 3
|
},
|
{
|
icon: del,
|
title: '扫码作废',
|
type: 4
|
}
|
],
|
cardList2: [
|
{
|
icon: sell,
|
title: '销售',
|
type: 1
|
},
|
{
|
icon: del,
|
title: '扫码作废',
|
type: 4
|
}
|
],
|
showModal: false,
|
modalTitle: '取用',
|
hazmat: {},
|
product: {},
|
hazmatBack: {
|
id: null,
|
remaining: ''
|
},
|
user: {},
|
rules: {
|
remaining: {
|
type: 'string',
|
required: true,
|
message: '归还剩余量不可为空',
|
trigger: ['blur', 'change']
|
}
|
},
|
tabNum: 1,
|
blockText: '危化品',
|
blockStyle: {
|
transform: 'translateX(0px)'
|
}
|
}
|
|
},
|
onLoad() {
|
//获取手机状态栏高度
|
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
|
// uni.hideTabBar();
|
},
|
onShow(){
|
// this.role = uni.getStorageSync('roleName');
|
// this.realname = uni.getStorageSync('user').realName
|
// this.tabBarLists = uni.getStorageSync('tabBarList');
|
|
},
|
created(){
|
uni.hideTabBar()
|
this.getUserInfo()
|
},
|
mounted() {
|
|
},
|
methods: {
|
getUserInfo(){
|
getUserInfo().then(res => {
|
if(res.code == 200) {
|
this.user = res.data
|
uni.setStorageSync('userSet', res.data)
|
}else{
|
uni.$u.toast(res.message)
|
}
|
})
|
},
|
|
scanCode(title){
|
const t = this
|
t.modalTitle = title
|
uni.scanCode({
|
autoZoom: false,
|
success: function (res) {
|
if(res && res.result){
|
if(t.tabNum == 1){
|
getHazmatByCode({code: res.result}).then((re)=>{
|
if(re.code == 200){
|
t.hazmat = re.data
|
t.showModal = true
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: re.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
}else{
|
getProductByCode({code: res.result}).then((re)=>{
|
if(re.code == 200){
|
t.product = re.data
|
t.showModal = true
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: re.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
}
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: '该二维码已失效或不包含条码信息',
|
})
|
}
|
}
|
})
|
},
|
|
confirmTake(){
|
const t = this
|
postHazmatUse(t.hazmat.id).then((r)=>{
|
if(r.code == 200){
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
t.closeModal()
|
},
|
|
confirmBack() {
|
const t = this
|
t.$refs.uForm.validate().then(res => {
|
t.hazmatBack.id = t.hazmat.id
|
t.hazmatBack.remaining = Number(t.hazmatBack.remaining)
|
postHazmatReturn(t.hazmatBack).then((r)=>{
|
if(r.code == 200){
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
t.closeModal()
|
}).catch(errors => {
|
uni.$u.toast('请完善必填信息')
|
})
|
},
|
|
confirmCheck(){
|
const t = this
|
postHazmatUsed(t.hazmat.id).then((r)=>{
|
if(r.code == 200){
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
t.closeModal()
|
},
|
|
confirmSell(){
|
const t = this
|
postProductSold(t.product.id).then((r)=>{
|
if(r.code == 200){
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
t.closeModal()
|
},
|
|
confirmCancle(){
|
const t = this
|
if(t.tabNum == 1){
|
postHazmatDiscard(t.hazmat.id).then((r)=>{
|
if(r.code == 200){
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
}else{
|
postProductDiscard(t.product.id).then((r)=>{
|
if(r.code == 200){
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}else{
|
t.$refs.uToast.show({
|
type: 'default',
|
message: r.message
|
})
|
}
|
}).catch((err) => {
|
uni.showToast({
|
title: err,
|
duration: 2000
|
})
|
})
|
}
|
t.closeModal()
|
},
|
|
closeModal(){
|
this.hazmat = {}
|
this.product = {}
|
this.hazmatBack={
|
id: null,
|
remaining: ''
|
}
|
this.showModal = false
|
},
|
|
changeTab(num){
|
this.tabNum = num
|
if(num == 1){
|
this.blockStyle.transform = 'translateX(0px)'
|
this.blockText = '危化品'
|
}else{
|
this.blockStyle.transform = 'translateX(calc(100% - 2px))'
|
this.blockText = '成品'
|
}
|
console.log(this.tabNum,'num')
|
},
|
|
toStudy(item) {
|
uni.setStorageSync("prevPage", '/pages/tabBar/firstPage/firstPage');
|
uni.navigateTo({
|
url: `/pages/tabBar/current/detail?bank=` + encodeURIComponent(JSON.stringify(item))
|
})
|
},
|
|
toCourses(){
|
uni.switchTab({
|
url: '/pages/tabBar/current/current'
|
})
|
},
|
|
}
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
.navBarBox .navBar {
|
background-color:#fff;
|
height: 50px;
|
display: flex;
|
flex-direction: row;
|
justify-content: center;
|
align-items: center;
|
box-shadow: 0 3px 12px rgba(0,0,0,0.05);
|
}
|
.fix{
|
position: sticky;
|
top: 0;
|
left: 0;
|
right: 0;
|
width: 100%;
|
z-index: 1;
|
}
|
.barText{
|
/* text-align: center; */
|
font-size: 16px;
|
font-weight: 600;
|
flex: 2;
|
text-align: center;
|
}
|
.statusBar{
|
background-color:lightgrey;
|
}
|
/deep/ .u-toast__content{
|
white-space: pre-wrap !important;
|
word-break: break-all !important;
|
word-wrap: break-word !important;
|
}
|
/deep/ .u-modal__content{
|
display: flex;
|
flex-direction: column !important;
|
align-items: center;
|
text-align: left;
|
|
&>view{
|
width: 100%;
|
}
|
}
|
.switchPanel{
|
width: 100%;
|
height: 84rpx;
|
position: relative;
|
border: 2px solid #fff;
|
box-sizing: border-box;
|
border-radius: 8px;
|
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.05) inset !important;
|
|
.switchBtns{
|
width: 100%;
|
height: 80rpx;
|
position: absolute;
|
top: 0;
|
left: 0;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
z-index: 99;
|
|
.btnItem{
|
width: 50%;
|
height: 100%;
|
box-sizing: border-box;
|
text-align: center;
|
line-height: 80rpx;
|
}
|
}
|
|
.colBlock{
|
position: absolute;
|
top: 5rpx;
|
left: 0;
|
z-index: 999;
|
width: 50%;
|
height: 70rpx;
|
border-radius: 8px;
|
background: rgb(0,172,238);
|
background: linear-gradient(0deg, rgba(0,172,238,1) 0%, rgba(2,126,251,1) 100%);
|
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) !important;
|
transition: .4s;
|
text-align: center;
|
line-height: 70rpx;
|
color: #fff;
|
font-weight: bold;
|
letter-spacing: 2px;
|
border: 2rpx solid #fff;
|
}
|
}
|
.cardList{
|
width: 100%;
|
box-sizing: border-box;
|
padding: 0 15px;
|
margin-top: 20px;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
flex-wrap: wrap;
|
|
.cardItem{
|
width: 100%;
|
padding: 15px 30px;
|
box-sizing: border-box;
|
margin-bottom: 15px;
|
background: #fff;
|
border-radius: 40rpx;
|
display: flex;
|
align-items: center;
|
box-shadow: 0 10rpx 20rpx rgba(0,0,0,.05);
|
transition: box-shadow .15s ease !important;
|
|
&:active{
|
box-shadow: none;
|
}
|
|
.cardTit{
|
font-size: 36rpx;
|
font-weight: bold;
|
margin-left: 30px;
|
}
|
}
|
}
|
|
</style>
|
