From bfcfe9e8227ff2d0d2f54345ca72043b1522f056 Mon Sep 17 00:00:00 2001 From: whycq <123456> Date: 星期六, 23 四月 2022 09:04:54 +0800 Subject: [PATCH] # --- pages/basics/pakin.vue | 364 +++++++++++++++++++++++++++++++++++----------------- 1 files changed, 245 insertions(+), 119 deletions(-) diff --git a/pages/basics/pakin.vue b/pages/basics/pakin.vue index 386c623..b5772b1 100644 --- a/pages/basics/pakin.vue +++ b/pages/basics/pakin.vue @@ -1,13 +1,16 @@ <template> - <view> - <scroll-view scroll-y> + <view > + <scroll-view scroll-y catch:touchmove="touchmove"> <view class="pak-seach-box"> <view class="box-top"> <view class="color-block-blue"></view> <text class="title">鎵樼洏鏉$爜</text> </view> <view class="box-buttom"> - <input type="text" placeholder="鎵爜 / 杈撳叆"> + <input v-model="barcode" type="text" placeholder="鎵爜 / 杈撳叆"> + <view class="search-icon"> + <uni-icons type="closeempty" size="20" color="#a5a5a5" @click="removeBarcode()"></uni-icons> + </view> </view> </view> <view class="pak-seach-box"> @@ -16,88 +19,183 @@ <text class="title">妫�绱㈠晢鍝�</text> </view> <view class="box-buttom"> - <input type="text" placeholder="鎵爜 / 杈撳叆"> - <button class="cu-btn bg-blue">+鎻愬彇</button> + <input v-model="matnr" type="text" placeholder="鎵爜 / 杈撳叆" @input="findMat()"> + <view class="search-icon"> + <uni-icons type="closeempty" size="20" color="#a5a5a5" @click="removeMatnr()"></uni-icons> + </view> </view> + <button class="cu-btn bg-blue" @click="selectMat()">+鎻愬彇</button> </view> - <view class="pak-seach-box"> + <view class="pak-data-box"> <view class="box-top"> <view class="color-block-blue"></view> <text class="title">鍟嗗搧鍒楄〃</text> </view> </view> - <view class="pak-data-box"> - + <view class="pak-data-box" v-show="matList.length === 0"> + <view style="text-align: center;">鏆傛棤鏇村鏁版嵁</view> </view> + <checkbox-group @change="checkbox"> + <view v-for="(item,index) in matList" :key="index" class="data-list bg-false" :class="'bg-'+item.checked" > + <view class="data-list-left"> + <view class="matnr"><text style="width: 400rpx;">缂栫爜锛歿{item.matnr}}</text></view> + <view><text style="width: 400rpx;">鍝佸悕锛歿{item.maktx}}</text></view> + <view><text style="width: 400rpx;">鎵瑰彿锛歿{item.batch}}</text></view> + <view><text style="width: 400rpx;">鏁伴噺锛歿{item.anfme}}</text></view> + </view> + <view class="data-list-right"> + <uni-icons type="trash" size="25" color="#a5a5a5" @click="remove(item,index)"></uni-icons> + </view> + </view> + </checkbox-group> </scroll-view> <view class="footer flex justify-around"> <view> - <button class="cu-btn">閲嶇疆</button> + <button class="cu-btn lg" @click="resst()">閲嶇疆</button> </view> <view> - <button class="cu-btn pakin-btn bg-blue">缁勬墭</button> + <button class="cu-btn lg pakin-btn bg-blue" @click="comb()">缁勬墭</button> </view> - <view> - <button class="cu-btn bg-blue" @click="eject()"><text class="button-text">灞呬腑</text></button> - </view> - </view> - <!-- 寮瑰嚭灞� --> - <view> - <!-- 鍟嗗搧妫�绱㈠脊绐� --> - <view class="shade" :class="'shade-' + display"> - <view class="goodsSearch"> - <view class="head"> - <view class="color-block-blue"></view> - <view class="head-title">鎻愬彇鍟嗗搧</view> - <view class="head-icon"> - <uni-icons type="closeempty" size="25" @click="eject()"></uni-icons> - </view> - </view> - <view class="container"> - <view> - <text>鍟嗗搧缂栫爜</text> - </view> - <view> - <text>鍟嗗搧鍚嶇О</text> - </view> - <view> - <text>瑙勬牸</text> - </view> - <view> - <text>鎵瑰彿</text> - </view> - <view> - 鏁伴噺 - </view> - <view class="foot flex justify-center"> - <label for=""> - <button class="cu-btn bg-blue">鎻愬彇</button> - </label> - </view> - </view> - </view> - </view> - </view> </view> </template> <script> + import permision from "@/common/permission.js" export default { data() { return { + barcode: '', type: 'center', - display: 'show' + searchBox: 'hide', + pick:'hide', + matnr:'', + matList:[], + result: '' } }, + mounted(){ + const UIP = uni.getStorageSync('UIP'); + this.baseIP = UIP; + const UPORT = uni.getStorageSync('UPORT'); + this.basePORT = UPORT + }, methods: { - eject() { - if (this.display == 'show') { - this.display = 'hide' - } else { - this.display = 'show' - } + resst() { + this.matList = [] + this.barcode = '' + this.matnr = '' + uni.vibrateShort(); }, + removeBarcode() { + this.barcode = '' + uni.vibrateShort(); + }, + removeMatnr() { + this.matnr = '' + uni.vibrateShort(); + }, + remove(item,index) { + this.matList.splice(index,1) + uni.vibrateShort(); + }, + comb() { + uni.vibrateShort(); + let that = this; + if (that.barcode === '') { + uni.showToast({title: '璇锋壂鎻忔墭鐩樻潯鐮�', icon: "none", position: 'top'}); + return; + } + if (that.matList.length === 0) { + uni.showToast({title: '璇锋坊鍔犲晢鍝佸垪琛�', icon: "none", position: 'top'}); + return; + } + uni.showLoading(); + uni.request({ + url: that.baseHttp + that.baseIP + ':' +that.basePORT + that.baseUrl + '/mobile/comb/auth', + data: JSON.stringify({ + barcode: that.barcode, + combMats: that.matList + }), + method: 'POST', + header: { + 'token':uni.getStorageSync('token') + }, + success(result) { + uni.showLoading(); + var res = result.data + if (res.code === 200) { + uni.showToast({ + title: res.msg, + position: 'bottom', + duration: 1000 + }); + } else if (res.code == 403) { + uni.showToast({title: res.msg, icon: "none", position: 'top'}) + setTimeout(() => { + uni.reLaunch({ + url: '../login/login' + }); + }, 1000); + } else { + uni.showToast({title: res.msg, icon: "none",position: 'top'}) + } + } + }); + }, + selectMat() { + let that = this + uni.vibrateShort(); + uni.navigateTo({ + url: "matSelect", + events: { + // 涓烘寚瀹氫簨浠舵坊鍔犱竴涓洃鍚櫒锛岃幏鍙栬鎵撳紑椤甸潰浼犻�佸埌褰撳墠椤甸潰鐨勬暟鎹� + acceptDataFromOpenedPage: function(data) { + that.matnr = data.data + that.findMat(that.matnr) + }, + }, + success: function(res) { + // 閫氳繃eventChannel鍚戣鎵撳紑椤甸潰浼犻�佹暟鎹� + res.eventChannel.emit('acceptDataFromOpenerPage', {baseIP:that.baseIP, basePORT:that.basePORT }) + } + }); + that.matnr = '' + }, + findMat() { + let that = this + uni.request({ + url: that.baseHttp + that.baseIP + ':' +that.basePORT + that.baseUrl + '/mat/auth', + data: { + matnr:that.matnr + }, + header: { + 'token':uni.getStorageSync('token') + }, + success(result) { + uni.vibrateShort(); + let res = result.data + if (res.code === 200 && res.data) { + that.matData = res.data + uni.navigateTo({ + url: "matQuery", + events: { + // 涓烘寚瀹氫簨浠舵坊鍔犱竴涓洃鍚櫒锛岃幏鍙栬鎵撳紑椤甸潰浼犻�佸埌褰撳墠椤甸潰鐨勬暟鎹� + matList: function(data) { + that.matList.push(data.data) + }, + }, + success: function(res) { + // 閫氳繃eventChannel鍚戣鎵撳紑椤甸潰浼犻�佹暟鎹� + res.eventChannel.emit('matData', { data: that.matData }) + } + }); + } + + } + }); + }, + change(e) { console.log('褰撳墠妯″紡锛�' + e.type + ',鐘舵�侊細' + e.show); }, @@ -106,11 +204,35 @@ // open 鏂规硶浼犲叆鍙傛暟 绛夊悓鍦� uni-popup 缁勪欢涓婄粦瀹� type灞炴�� this.$refs.goodsSearch.open(type) }, + checkbox: function (e) { + var items = this.data, + values = e.detail.value; + for (var i = 0, lenI = items.length; i < lenI; ++i) { + const item = items[i] + item.id = item.id + '' + if(values.indexOf(item.id) >= 0){ + this.$set(item,'checked',true) + }else{ + this.$set(item,'checked',false) + } + } + if (values.length == items.length) { + this.check = true + this.checkText = "鍙栨秷鍏ㄩ��" + } else { + this.check = false + this.checkText = "鍏ㄩ��" + } + uni.vibrateShort(); + }, } } </script> <style> + /* @import "../../colorui/main.css"; + @import "../../colorui/icon.css"; */ + .pak-seach-box { background-color: #FFFFFF; margin: 15rpx 15rpx 0rpx 15rpx; @@ -143,11 +265,26 @@ margin-top: 10rpx; } .box-buttom { - display: block; - width: 720rpx; - height: 80rpx; + display: inline-block; + background-color: #ededed; + width: 65%; + height: 60rpx; + border-radius: 20rpx; + margin: 15rpx 15rpx 0rpx 15rpx; } - .pak-seach-box input { + .box-buttom input { + width: 75%; + float: left; + margin: 8rpx 10rpx 0rpx 25rpx; + } + .box-buttom .search-icon{ + width: 60rpx; + height: 60rpx; + float: right; + margin-top: 5rpx; + margin-right: 10rpx; + } + /* .pak-seach-box input { background-color: #ededed; border: 1rpx solid #d8d8d8; display: inline-block; @@ -158,13 +295,13 @@ line-height: 60rpx; margin: 15rpx 15rpx 0rpx 15rpx; padding-left: 20rpx; - } + } */ .pak-seach-box button { background-color: #1E9FFF; color: #ffffff; display: inline-block; float: right; - width: 150rpx; + width: 180rpx; height: 60rpx; margin: 15rpx 15rpx 0rpx 15rpx; line-height: 60rpx; @@ -172,70 +309,59 @@ .pakin-btn { background-color: #1E9FFF; } - /* 閬僵灞� */ - .shade-show { - display: block; + .pak-data-box { + background-color: #F1F1F1; + margin: 15rpx 15rpx 0rpx 15rpx; + width: 96%; + height: 70rpx; + border-radius: 20rpx; } - .shade-hide { - display: none; - } - .shade { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgba(0,0,0,0.6); - z-index: 90; - } - .goodsSearch { + .pak-data-box .box-top { background-color: #FFFFFF; - display: block; - position: fixed; - top: 5%; - left: 20rpx; - width: 720rpx; - height: 90%; - border-radius: 21rpx; - z-index: 100; + height: 70rpx; + border-radius: 20rpx 20rpx 20rpx 20rpx; } - .head { + .bg-false { background-color: #FFFFFF; - width: 100%; - height: 8%; - border-radius: 20rpx 20rpx 0 0 ; } - .head .color-block-blue { - margin: 36rpx 5rpx 0 30rpx; + .bg-true { + background-color: #ebebeb; } - .head-title { + .data-list { + border-bottom: 1px solid #d8d8d8; + height: 180rpx; + margin: 15rpx; + border-radius: 20rpx; + } + .data-list:first-child { + margin-top: 20rpx; + } + .data-list:last-child { + margin-bottom: 120rpx; + } + /* .data-list-left { display: inline-block; float: left; - font-size: 40rpx; - margin-top: 25rpx; - margin-left: 20rpx; + text-align: center; + width: 100rpx; + height: 180rpx; + line-height: 180rpx; + } */ + .data-list-left { + display: inline-block; + float: left; + margin-left: 6%; + height: 180rpx; + color: #676767; } - .head-icon { + .matnr { + padding-top: 10rpx; + } + .data-list-right { display: inline-block; float: right; - margin-top: 25rpx; - margin-right: 20rpx; + height: 180rpx; + line-height: 180rpx; + margin-right: 10%; } - .container { - width: 100%; - height: 92%; - background-color: #F1F1F1; - border-radius: 0 0 20rpx 20rpx; - } - .foot { - width: 95.7%; - height: 100rpx; - line-height: 100rpx; - background-color: #FFF; - position: fixed; - bottom: 5%; - border-top: 1px solid #d8d8d8; - border-radius: 0 0 20rpx 20rpx ; - z-index: 1; - } -</style> +</style> \ No newline at end of file -- Gitblit v1.9.1