|
@@ -0,0 +1,394 @@
|
|
|
+<template>
|
|
|
+ <view class="unclear-container">
|
|
|
+ <uni-navbar pageName="待清运清单" :isBack="false" :isMap="true"></uni-navbar>
|
|
|
+ <scroll-view class="scroll-con" scroll-y :scroll-top="scrollTop" @scrolltolower="onreachBottom">
|
|
|
+ <!-- 列表数据 -->
|
|
|
+ <view class="cell-item-con">
|
|
|
+ <view class="cell-item" v-for="(item, index) in listdata" :key="index">
|
|
|
+ <view class="cell-item-c" @tap="goPage(item)">
|
|
|
+ <view class="cell-item-info">
|
|
|
+ <view class="cell-item-info-network">
|
|
|
+ {{item.stationName || '--'}}
|
|
|
+ <u-badge type="success" bgColor="#c90101" :count="item.unCleanNum" :offset="[-10,-32]" size="mini"></u-badge>
|
|
|
+ </view>
|
|
|
+ <view class="cell-item-info-weight">
|
|
|
+ <view class="cell-item-weight-bar">
|
|
|
+ {{ item.totalWeight ? (item.totalWeight/1000).toFixed(3) : 0 }}kg
|
|
|
+ <u-badge class="badge" type="primary" bgColor="#01c9b2" count="总" :offset="[0,0]"></u-badge>
|
|
|
+ </view>
|
|
|
+ <view class="cell-item-weight-bar">
|
|
|
+ {{ item.maxWeight ? (item.maxWeight/1000).toFixed(3) : 0 }}kg
|
|
|
+ <u-badge class="badge" type="warning" bgColor="#05695d" count="最大" :offset="[0,0]"></u-badge>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-icon name="arrow-right" class="arrow-right" :size="28" color="#999"></u-icon>
|
|
|
+ </view>
|
|
|
+ <u-button size="mini" class="handle-btn" hover-class="none" :custom-style="customBtnStyle" @click="removeFun(item)">移除</u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <u-empty class="nodata" :text="noDataText" v-if="listdata.length==0 && status!='loading'" mode="list"></u-empty>
|
|
|
+ <view class="loadmore" v-if="listdata.length!=0">
|
|
|
+ <u-loadmore v-if="total>pageSize || status=='loading'" :status="status" />
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+
|
|
|
+ <view class="footer-bar">
|
|
|
+ <u-button class="footer-handle-btn scan-btn" hover-class="none" :custom-style="scanBtnStyle" shape="circle" @click="clearingOutlets" size="medium" type="primary">
|
|
|
+ <u-icon name="scan" class="btn-icon" :size="28" color="#fff"></u-icon>
|
|
|
+ <text>扫码清运</text>
|
|
|
+ </u-button>
|
|
|
+ <u-button class="footer-handle-btn" hover-class="none" :custom-style="btnStyle" shape="circle" @click="openQuery" size="medium">
|
|
|
+ <u-icon name="plus" class="btn-icon" :size="28" color="#606266"></u-icon>
|
|
|
+ <text>增加清运网点</text>
|
|
|
+ </u-button>
|
|
|
+ </view>
|
|
|
+ <!-- 确认清运 -->
|
|
|
+ <u-popup v-model="messagePop" mode="center" class="custom-pop" length="80%" border-radius="14" :mask-close-able="false">
|
|
|
+ <view class="custom-con">
|
|
|
+ <view class="pop-title">提示</view>
|
|
|
+ <view class="pop-con">
|
|
|
+ <view class="pop-item">确认清运以下网点-设备内的可回收物?</view>
|
|
|
+ <view class="pop-item">{{networkData.stationName || ''}}</view>
|
|
|
+ <view class="pop-item">{{networkData.srcDeviceCode || ''}}</view>
|
|
|
+ <view class="form-con">
|
|
|
+ <u-form :model="form" ref="uForm">
|
|
|
+ <u-form-item label="备注" :border-bottom="false">
|
|
|
+ <u-input v-model="form.remarks" type="textarea" border />
|
|
|
+ </u-form-item>
|
|
|
+ </u-form>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="btn-con">
|
|
|
+ <view class="handle-pop-btn cancel-btn" @click="cancelFun">取消</view>
|
|
|
+ <view class="handle-pop-btn submit-btn" @click="submitFun">确定</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import { getSelfCleanTaskList, cleanDevice, cleanStationRemove, getDeviceMsg } from '@/api/unclear.js'
|
|
|
+ import { parseQueryString } from '@/libs/tools.js'
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ listdata: [],
|
|
|
+ pageNo: 1, // 当前页码
|
|
|
+ pageSize: 10, // 每页条数
|
|
|
+ total: 0, // 数据总条数
|
|
|
+ noDataText: '暂无数据', // 列表请求状态提示语
|
|
|
+ status: 'loadmore', // 加载中状态
|
|
|
+ customBtnStyle: { // 自定义按钮样式
|
|
|
+ borderColor: '#01c9b2',
|
|
|
+ backgroundColor: '#01c9b2',
|
|
|
+ color: '#fff'
|
|
|
+ },
|
|
|
+ scrollTop: 0, // 滚动条位置
|
|
|
+ scanBtnStyle: { // 自定义按钮样式
|
|
|
+ borderColor: '#07c160',
|
|
|
+ backgroundColor: '#07c160',
|
|
|
+ width: '100%'
|
|
|
+ },
|
|
|
+ btnStyle: { // 自定义按钮样式
|
|
|
+ width: '100%'
|
|
|
+ },
|
|
|
+ form: {
|
|
|
+ remarks: '' // 备注
|
|
|
+ },
|
|
|
+ boxData: null, // 箱体二维码数据
|
|
|
+ messagePop: false, // 确认清运
|
|
|
+ networkData: null // 网点详情
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.pageNo = 1
|
|
|
+ this.refresh()
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ // 是否可清运
|
|
|
+ clearingOutlets(){
|
|
|
+ if(this.listdata.length==0){
|
|
|
+ uni.showToast({ title: '请先选择待清运网点,再进行扫码清运', icon: 'none' })
|
|
|
+ }else{
|
|
|
+ this.openScan()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 扫码清运
|
|
|
+ openScan(){
|
|
|
+ const _this = this
|
|
|
+ uni.scanCode({
|
|
|
+ success(e) {
|
|
|
+ console.log(e)
|
|
|
+ // 箱体二维码数据
|
|
|
+ // {
|
|
|
+ // charSet: "ISO8859-1"
|
|
|
+ // errMsg: "scanCode:ok"
|
|
|
+ // rawData: "aHR0cDovL3d3dy5zeHp4eWoubmV0L3dlYi9zdGF0aWMvcXJjb2RlL2Rvd25sb2FkLWFwcC5odG1sP2lkPTFiODM3M2JhLWNmMDAtNDU2NS04Y2ZkLTVmOGZlNTYwYmNmMiZ0eXBlPWR1c3RiaW4="
|
|
|
+ // result: "http://www.sxzxyj.net/web/static/qrcode/download-app.html?id=1b8373ba-cf00-4565-8cfd-5f8fe560bcf2&type=dustbin"
|
|
|
+ // scanType: "QR_CODE"
|
|
|
+ // }
|
|
|
+ if(e.scanType == 'QR_CODE'){
|
|
|
+ // 将箱体二维码数据e.result携带参数转换为json
|
|
|
+ _this.boxData = parseQueryString(e.result)
|
|
|
+ _this.getNetworkInfo()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail(err) {
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 扫码获取网点信息
|
|
|
+ getNetworkInfo(){
|
|
|
+ const _this = this
|
|
|
+ getDeviceMsg(_this.boxData).then(res => {
|
|
|
+ if(res.status == 200){
|
|
|
+ _this.networkData = res.data
|
|
|
+ _this.form.remarks = ''
|
|
|
+ _this.messagePop = true
|
|
|
+ }else{
|
|
|
+ _this.messagePop = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 取消清运
|
|
|
+ cancelFun(){
|
|
|
+ this.messagePop = false
|
|
|
+ },
|
|
|
+ // 确定清运
|
|
|
+ submitFun(){
|
|
|
+ const _this = this
|
|
|
+ uni.showLoading({
|
|
|
+ mask: true,
|
|
|
+ title: '加载中'
|
|
|
+ })
|
|
|
+ let obj = {}
|
|
|
+ obj.deviceNo = (this.networkData && this.networkData.deviceNo) ? this.networkData.deviceNo : ''
|
|
|
+ obj.remarks = this.form.remarks
|
|
|
+ cleanDevice(obj).then(res => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if(res.status == 200){
|
|
|
+ uni.showToast({ icon:'none', title: '清运成功,库存重量已重置为0' })
|
|
|
+ _this.messagePop = false
|
|
|
+ setTimeout(()=>{
|
|
|
+ _this.refresh()
|
|
|
+ },1000)
|
|
|
+ }else{
|
|
|
+ uni.showToast({ icon:'none', title: res.message })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 增加清运网点
|
|
|
+ openQuery(){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/cleared/chooseNetwork'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取查询参数 刷新列表
|
|
|
+ refresh(){
|
|
|
+ this.listdata = []
|
|
|
+ this.total = 0
|
|
|
+ this.searchHandle(1)
|
|
|
+ },
|
|
|
+ // 搜索查询
|
|
|
+ searchHandle (pageNo) {
|
|
|
+ uni.showLoading({
|
|
|
+ mask: true,
|
|
|
+ title: '加载中'
|
|
|
+ })
|
|
|
+ this.status = "loading"
|
|
|
+ pageNo ? this.pageNo = pageNo : null
|
|
|
+ getSelfCleanTaskList({
|
|
|
+ pageNo: this.pageNo,
|
|
|
+ pageSize: this.pageSize
|
|
|
+ }).then(res => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if (res.status == 200) {
|
|
|
+ if(this.pageNo>1){
|
|
|
+ this.listdata = this.listdata.concat(res.data.list || [])
|
|
|
+ }else{
|
|
|
+ this.listdata = res.data.list || []
|
|
|
+ this.scrollTop = 0
|
|
|
+ }
|
|
|
+ this.total = res.data.count || 0
|
|
|
+ this.noDataText = '暂无数据'
|
|
|
+ } else {
|
|
|
+ this.noDataText = res.message
|
|
|
+ this.listdata = []
|
|
|
+ this.total = 0
|
|
|
+ }
|
|
|
+ this.status = "loadmore"
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 移除
|
|
|
+ removeFun(row){
|
|
|
+ const _this = this
|
|
|
+ uni.showModal({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认移除该网点的清运单?',
|
|
|
+ success(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ uni.showLoading({
|
|
|
+ mask: true,
|
|
|
+ title: '加载中'
|
|
|
+ })
|
|
|
+ cleanStationRemove({ stationNo: row.stationNo }).then(ret => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if(ret.status == 200){
|
|
|
+ uni.showToast({ title: ret.message, icon: 'none' })
|
|
|
+ _this.searchHandle(1)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 查看详情
|
|
|
+ goPage(row){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/cleared/network?stationNo='+row.stationNo
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // scroll-view到底部加载更多
|
|
|
+ onreachBottom() {
|
|
|
+ if(this.listdata.length!=0 && this.listdata.length < this.total){
|
|
|
+ this.pageNo++
|
|
|
+ this.searchHandle()
|
|
|
+ }else{
|
|
|
+ uni.showToast({ title: '已经到底了', icon: 'none' })
|
|
|
+ this.status = "nomore"
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ page{
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ .unclear-container {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding-bottom: 204rpx;
|
|
|
+ // 列表
|
|
|
+ .scroll-con{
|
|
|
+ flex: 1;
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+ // 列表样式
|
|
|
+ .cell-item-con{
|
|
|
+ .cell-item{
|
|
|
+ margin: $uni-spacing-col-base $uni-spacing-row-base;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: $uni-border-radius-base;
|
|
|
+ color: $uni-text-color;
|
|
|
+ font-size: $uni-font-size-base;
|
|
|
+ box-shadow: 3rpx 3rpx 5rpx #eee;
|
|
|
+ padding: 40rpx 20rpx;
|
|
|
+ position: relative;
|
|
|
+ .cell-item-c{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ .cell-item-info{
|
|
|
+ flex-grow: 1;
|
|
|
+ .cell-item-info-network{
|
|
|
+ word-break: break-all;
|
|
|
+ margin-bottom: 26rpx;
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .cell-item-info-weight{
|
|
|
+ font-size: 24rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ .cell-item-weight-bar{
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ padding-right: 50rpx;
|
|
|
+ &:nth-child(2){
|
|
|
+ padding-right: 76rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .arrow-right{
|
|
|
+ flex-shrink: 0;
|
|
|
+ margin-left: 80rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .handle-btn{
|
|
|
+ position: absolute;
|
|
|
+ right: $uni-spacing-row-sm;
|
|
|
+ top: $uni-spacing-col-sm;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .footer-bar{
|
|
|
+ width: 100%;
|
|
|
+ height: 204rpx;
|
|
|
+ padding: 0 10%;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ text-align: center;
|
|
|
+ .footer-handle-btn{
|
|
|
+ display: block;
|
|
|
+ .btn-icon{
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .scan-btn{
|
|
|
+ margin-top: 24rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 弹框样式
|
|
|
+ .custom-pop{
|
|
|
+ .custom-con{
|
|
|
+ text-align: center;
|
|
|
+ background: url(/static/pop-bg.png) no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #5a5a5a;
|
|
|
+ line-height: 54rpx;
|
|
|
+ .pop-title{
|
|
|
+ padding: 20rpx 0;
|
|
|
+ color: #fff;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ .pop-con{
|
|
|
+ padding: 80rpx 0 40rpx;
|
|
|
+ .pop-item{
|
|
|
+ padding: 0 20rpx;
|
|
|
+ }
|
|
|
+ .form-con{
|
|
|
+ padding: 10rpx 30rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btn-con{
|
|
|
+ border-top: 1rpx solid rgba(213,213,213,0.8);
|
|
|
+ .handle-pop-btn{
|
|
|
+ padding: 20rpx 0;
|
|
|
+ width: 50%;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .cancel-btn{
|
|
|
+ border-right: 1rpx solid rgba(213,213,213,0.8);
|
|
|
+ }
|
|
|
+ .submit-btn{
|
|
|
+ color: #16d1bc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .nodata{
|
|
|
+ padding-top: 400rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|