From 9d5b4d650e5b01081d3537c750e7469db4d161e3 Mon Sep 17 00:00:00 2001 From: 马宇豪 <978517621@qq.com> Date: 星期二, 29 四月 2025 08:53:20 +0800 Subject: [PATCH] 提交 --- pages/tabBar/firstPage/firstPage.vue | 751 +++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 567 insertions(+), 184 deletions(-) diff --git a/pages/tabBar/firstPage/firstPage.vue b/pages/tabBar/firstPage/firstPage.vue index 9be04d7..80a7434 100644 --- a/pages/tabBar/firstPage/firstPage.vue +++ b/pages/tabBar/firstPage/firstPage.vue @@ -7,159 +7,480 @@ <!-- 真正的导航栏内容 --> <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 >--> +<!-- <u-button type="text" @click="loginOut" style="color: #1890ff;margin-right: 5px;width: 65px;">退出</u-button>--> +<!-- </view>--> </view> </view> - <view class="list"> - <view class="first" @click="goExamine" v-if="role == '审核领导'"> - <view class="badge"> - <u-badge type="error" :absolute="true" :offset="[90 + statusBarHeight ,65]" max="99" :value="examineNum" style="line-height: 40px;font-size: 14px;width: 30px;height: 40px;"> - </u-badge> - </view> - <view class="text">预警审核</view> - <view class="eng">WARNING REVIEW</view> - <view class="icon"> - <view class="heng"></view> - <image src="../../../static/examine.png" class="img"></image> - </view> - </view> - <view class="first" - @click="goCurrent" - style="background-color:rgb(255, 160, 235) ;" - > - <view class="text">信息查看</view> - <view class="eng">INFORMATION VIEWING</view> - <view class="icon"> - <view class="heng"></view> - <image src="../../../static/look.png" class="img"></image> - </view> - </view> - <view class="first" - style="background-color: rgb(112,179, 224);" - @click="goWeather" - > - <view class="text">实时气象</view> - <view class="eng">RWAL TIME WEATHER</view> - <view class="icon"> - <view class="heng"></view> - <image src="../../../static/we.png" class="img"></image> - </view> - </view> - <view class="first" - style="background-color: rgb(134, 204, 170) ;margin-bottom: 35px;" - @click="goCount" - > - <view class="text">统计分析</view> - <view class="eng">STATISTIC ANALYSIS</view> - <view class="icon"> - <view class="heng"></view> - <image src="../../../static/count1.png" class="img"></image> - </view> - </view> - - </view> - <tabBar :currentPagePath="page"></tabBar> + <u-toast ref="uToast"></u-toast> + <view class="tabList" 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 == '用尽取用' || 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="confirmTake1()"></u-button> + <u-button v-if="modalTitle == '用尽取用'" type="primary" style="margin-top: 20px" text="确认取用" @click="confirmTake2()"></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 {getExamine} from '../../../api/examine.js' -import { Value } from 'sass'; + 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 takeAll from '../../../static/takeAll.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 { - titleList:[ - { - label: '默认排序', - value: 1, - } - ], page: 'pages/tabBar/firstPage/firstPage', statusBarHeight: '', - leaderType: 'da', - examineNum: 0, - data: { - pageIndex: 1, - pageSize: 9999, - searchParams: { - emergType: null,//1-紧急;2-常规 - warningLevel: null,//1-红色预警;2-橙色预警;3-黄色预警;4-蓝色预警 - reviewStatus: null//1:未审核,2:已审核,3:审核已驳回 - } - }, - role: '', - realname:'' + cardList1: [ + { + icon: take, + title: '常规取用', + type: 1 + }, + { + icon: takeAll, + title: '用尽取用', + type: 5 + }, + { + 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(); - this.realname = uni - - + // uni.hideTabBar(); }, onShow(){ - this.role = uni.getStorageSync('roleName'); - this.realname = uni.getStorageSync('user').realName - console.log("role",uni.getStorageSync('user')) - this.getNum(); + // this.role = uni.getStorageSync('roleName'); + // this.realname = uni.getStorageSync('user').realName + // this.tabBarLists = uni.getStorageSync('tabBarList'); + }, + created(){ + uni.hideTabBar() + this.getUserInfo() + }, + mounted() { + + }, methods: { - loginOut() { - uni.clearStorageSync(); - uni.clearStorage(); - uni.navigateTo({ - url: '/pages/index/index' - }) - }, - getNum(){ - this.data.searchParams.reviewStatus = 1; - getExamine(this.data).then(res => { - if(res.code == 100) { - if(res.data && res.data.length > 0){ - this.examineNum = res.data.length; - }else { - this.examineNum = 0; - } - }else{ - uni.$u.toast(res.msg) - } - }) - }, - goExamine() { - uni.switchTab({ - url: '/pages/tabBar/examine/examine' - }) - }, - goCurrent() { - uni.switchTab({ - url: '/pages/tabBar/current/current' - }) - }, - goCount() { - uni.switchTab({ - url: '/pages/tabBar/count/count' - }) - }, - goWeather(){ - uni.switchTab({ - url: '/pages/tabBar/weather/weather' - }) - } + 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, + 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 + } + 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: '该二维码已失效或不包含条码信息', + }) + } + } + }) + }, + + confirmTake1(){ + const t = this + postHazmatUse(t.hazmat.id,0).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() + }, + + confirmTake2(){ + const t = this + postHazmatUse(t.hazmat.id,1).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> +<style lang="scss" scoped> .navBarBox .navBar { background-color:#fff; height: 50px; @@ -167,8 +488,7 @@ flex-direction: row; justify-content: center; align-items: center; - box-shadow: 0 3px 12px rgba(0,0,0,0.05); - + box-shadow: 0 3px 12px rgba(0,0,0,0.05); } .fix{ position: sticky; @@ -176,74 +496,137 @@ left: 0; right: 0; width: 100%; - z-index: 1; + z-index: 9999; +} +.barText{ + /* text-align: center; */ + font-size: 16px; + font-weight: 600; + flex: 2; + text-align: center; } .statusBar{ background-color:lightgrey; } -.list{ - margin: 12px 12px 0; - padding: 12px; +/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%; + } +} + +.tabList{ + width: 100%; box-sizing: border-box; + padding: 0 15px; + margin-top: 15px; display: flex; flex-direction: column; - justify-content: space-between; - width: calc(100% - 24px); - background: #fff; - border-radius: 5px; - box-shadow: 0 3px 12px rgba(0,0,0,0.05); - + align-items: center; + position: -webkit-sticky; + position: sticky; + top: 50px; + left: 0; + right: 0; + z-index: 9998; } -.first{ - width: 100%; - height: 110px; - border-radius: 15px; - background-color: rgb(241,161,108); - border: 1px solid lightgrey; - - margin-top: 40px; - -} -.text{ - font-size: 18px; - padding-top: 15px; - padding-left: 15px; - color: #faf9f4; - font-family: '宋体'; - font-weight: 600; -} -.eng{ - font-size: 14px; - padding-left: 15px; - color: rgba(250,249,244,0.5); -} -.icon{ - display: flex; - align-items: baseline; - justify-content: space-between; -} -.barText{ - /* text-align: center; */ - font-size: 16px; - font-weight: 600; - flex: 2; - margin-left: 45%; -} -.img{ - width: 45px; - height: 45px; - margin-right: 16px; - margin-bottom: 5px; +.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; + background: #f5f7fa; + + .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; + } } -.badge span{ - text-align: center; - width: 100%; + +.cardList{ + width: 100%; + box-sizing: border-box; + padding: 0 15px; + margin-top: 15px; + 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; + } + + &:last-of-type{ + margin-bottom: 75px; + } + + .cardTit{ + font-size: 36rpx; + font-weight: bold; + margin-left: 30px; + } + } } -.heng{ - width: 30px; - height: 3px; - background-color: rgba(230,230,230,0.5); - margin-left: 15px; -} + </style> \ No newline at end of file -- Gitblit v1.9.2