From 17c63ddd016876d846b6e8f9c74d54c0316f9ee9 Mon Sep 17 00:00:00 2001 From: whycq <whycq> Date: 星期一, 27 六月 2022 16:27:08 +0800 Subject: [PATCH] # --- pages/basics/pakin.vue | 382 ++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 326 insertions(+), 56 deletions(-) diff --git a/pages/basics/pakin.vue b/pages/basics/pakin.vue index 6d7f53c..06f3bb5 100644 --- a/pages/basics/pakin.vue +++ b/pages/basics/pakin.vue @@ -1,69 +1,145 @@ <template> <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 class="square-2"> + <view class="square-title"> + <view class="title-sign"><view class="sign"></view></view> + <view class="title-text"><text>鎵樼洏鏉$爜</text></view> </view> - <view class="box-buttom"> - <input v-model="barcode" type="text" placeholder="鎵爜 / 杈撳叆"> + <view class="square-content"> + <view class="content-input"> + <input v-model="barcode" type="text" placeholder="鎵爜 / 杈撳叆" maxlength="10" + :focus="barcodeFocus" @input="barcodeInput"> + <uni-icons type="closeempty" size="20" color="#dadada" @click="removeBarcode()"></uni-icons> + </view> </view> </view> - <view class="pak-seach-box"> - <view class="box-top"> - <view class="color-block-blue"></view> - <text class="title">妫�绱㈠晢鍝�</text> + + + <view class="square-2"> + <view class="square-title"> + <view class="title-sign"><view class="sign"></view></view> + <view class="title-text"><text>妫�绱㈠晢鍝�</text></view> </view> - <view class="box-buttom"> - <input v-model="matnr" type="text" placeholder="鎵爜 / 杈撳叆" @input="findMat()"> - <button class="cu-btn bg-blue" @click="selectMat()">+鎻愬彇</button> + <view class="square-content"> + <view class="content-input-btn"> + <input v-model="matnr" type="text" placeholder="鎵爜 / 杈撳叆" @input="findMat()" + :focus="focus"> + <uni-icons type="closeempty" size="20" color="#dadada" @click="removeMatnr()"></uni-icons> + </view> + <view class="content-btn"> + <button class="cu-btn bg-blue pda-btn" @click="selectMat()">+鎻愬彇</button> + </view> </view> </view> - <view class="pak-data-box"> - <view class="box-top"> - <view class="color-block-blue"></view> - <text class="title">鍟嗗搧鍒楄〃</text> - <text v-show="matList.length === 0">鏃犳暟鎹�</text> + + + <view class="square-1"> + <view class="square-title"> + <view class="title-sign"><view class="sign"></view></view> + <view class="title-text"><text>鍟嗗搧鍒楄〃</text></view> + <!-- <label v-show="matList.length != 0" style="float: right;margin-right: 20px;margin-top: 13px;"><uni-icons type="trash" size="25" color="#a5a5a5" @click="remove()"></uni-icons></label> --> </view> - </view> + + <view class="square-none" v-show="matList.length === 0"> + <view class="v-show">鏆傛棤鏇村鏁版嵁...</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"> - <checkbox :value="item.id+''" :checked="item.checked" style="display: block;" /> - </view> - <view class="data-list-right"> - <view><text style="width: 400rpx;">缂栫爜锛歿{item.matnr}}</text></view> + <!-- <view> + <checkbox :value="item.id+''" :checked="item.checked" style="display: block;" /> + </view> --> + <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> + <text style="width: 400rpx;">鏁伴噺锛歿{item.anfme}}</text> + </view> + </view> + <view class="data-list-right"> + <label><uni-icons type="compose" size="20" color="#a5a5a5" @click="revise(item,index)"></uni-icons></label> + <label><uni-icons type="trash" size="25" color="#a5a5a5" @click="remove(item,index)"></uni-icons></label> </view> </view> </checkbox-group> </scroll-view> + + + <!-- 搴曢儴鎸夐挳 --> <view class="footer flex justify-around"> - <view> + <!-- <label class="label-btn" style="width: 170rpx;"> + <checkbox :checked="check" @click="allChecked()">{{checkText}}</checkbox> + </label> + <label class="label-btn" style="width: 100rpx;"> + <text @click="reChecked()">鍙嶉��</text> + </label> --> + + <label class="label-btn" style="width: 150rpx;"> <button class="cu-btn" @click="resst()">閲嶇疆</button> - </view> - <view> - <button class="cu-btn pakin-btn bg-blue" @click="comb()">缁勬墭</button> - </view> + </label> + <label class="label-btn"> + <button class="cu-btn bg-blue " @click="comb()">缁勬墭</button> + </label> </view> + + <!-- 寮圭獥 --> + <!-- 淇敼鏁伴噺 --> + <uni-popup ref="revise" background-color="#fff" @change="change"> + <view class="revise-box"> + <view class="revise-box-top"> + <view class="color-block-blue"></view> + <text class="title">缁勬墭鏁伴噺</text> + </view> + <view class="text-box"> + <text>鍙粍鏁伴噺锛歿{enableQty}}</text> + </view> + <view class="changeBox"> + <view class="num-box"> + <uni-number-box v-model="count" :min="minCount" :max="maxCount" color="#747474" @change="changeValue"/> + </view> + </view> + <view class="revise-box-buttom"> + <view> + <button class="cu-btn bg-blue" @click="confirm()">纭</button> + </view> + </view> + </view> + </uni-popup> </view> </template> <script> + import permision from "@/common/permission.js" export default { data() { return { barcode: '', + barcodeFocus:true, + focus:false, type: 'center', searchBox: 'hide', pick:'hide', matnr:'', - matList:[] + matList:[], + result: '', + enableQty:'', + count:'', + minCount:0, + maxCount:'', + rowNum:'', + check:false, + checkText:'鍏ㄩ��', + checkedData:[], } + }, + onShow() { + setTimeout(()=>{ + // this.focuss() + }, 100); + }, mounted(){ const UIP = uni.getStorageSync('UIP'); @@ -71,23 +147,75 @@ const UPORT = uni.getStorageSync('UPORT'); this.basePORT = UPORT }, - onShow() { - let that = this; - uni.$on('matData', function(data) { - console.log(that.matList) - console.log(data) - // that.matList.push(data) - }) - - - }, methods: { + // barcode input 浜嬩欢 + barcodeInput() { + var len = this.barcode.length + if (len != 8) { + uni.showToast({title: '鎵樼洏鐮佹湁璇閲嶈瘯', icon: "none", position: 'top'}); + this.barcodeFocuss() + return; + } + if (len == 8) { + this.focuss() + } + }, + // 鎵樼洏鐮佹湁璇噸缃� + barcodeFocuss() { + // #ifdef APP + let that = this; + that.barcodeFocus = false; + setTimeout(()=>{ + that.barcode = ''; + that.barcodeFocus = true; + }, 100); + // #endif + }, + // 鍟嗗搧鍏夋爣娓呯┖閲嶇疆 + focuss() { + // #ifdef APP + let that = this; + that.focus = false; + setTimeout(()=>{ + that.matnr = ''; + that.focus = true; + }, 100); + // #endif + }, resst() { this.matList = [] this.barcode = '' + this.barcodeFocuss() + uni.vibrateShort(); + }, + removeBarcode() { + this.barcode = '' + uni.vibrateShort(); + this.barcodeFocus = false; + this.$nextTick(function() { + this.barcodeFocus = true; + }); + }, + removeMatnr() { this.matnr = '' + uni.vibrateShort(); + this.focus = false; + this.$nextTick(function() { + this.focus = true; + }); + }, + remove() { + // this.matList.splice(index,1) + for (var i = 0; i < this.matList.length; i++) { + if (this.matList[i].checked == true) { + this.matList.splice(i,1) + } + } + this.checkList(); + uni.vibrateShort(); }, comb() { + uni.vibrateShort(); let that = this; if (that.barcode === '') { uni.showToast({title: '璇锋壂鎻忔墭鐩樻潯鐮�', icon: "none", position: 'top'}); @@ -112,6 +240,7 @@ uni.hideLoading(); var res = result.data if (res.code === 200) { + that.resst(); uni.showToast({ title: res.msg, position: 'bottom', @@ -123,7 +252,7 @@ uni.reLaunch({ url: '../login/login' }); - }, 500); + }, 1000); } else { uni.showToast({title: res.msg, icon: "none",position: 'top'}) } @@ -131,7 +260,24 @@ }); }, 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 @@ -144,15 +290,30 @@ 'token':uni.getStorageSync('token') }, success(result) { + uni.vibrateShort(); let res = result.data if (res.code === 200 && res.data) { + that.matData = res.data + that.matnr = '' uni.navigateTo({ - url:"matQuery?matnr=" + that.matnr + "&baseIP=" + that.baseIP + "&basePORT=" + that.basePORT - }) + url: "matQuery", + events: { + // 涓烘寚瀹氫簨浠舵坊鍔犱竴涓洃鍚櫒锛岃幏鍙栬鎵撳紑椤甸潰浼犻�佸埌褰撳墠椤甸潰鐨勬暟鎹� + matList: function(data) { + that.matList.push(data.data) + console.log(that.matList) + }, + }, + success: function(res) { + // 閫氳繃eventChannel鍚戣鎵撳紑椤甸潰浼犻�佹暟鎹� + res.eventChannel.emit('matData', { data: that.matData }) + }, + }); } } }); + }, change(e) { @@ -164,7 +325,7 @@ this.$refs.goodsSearch.open(type) }, checkbox: function (e) { - var items = this.data, + var items = this.matList, values = e.detail.value; for (var i = 0, lenI = items.length; i < lenI; ++i) { const item = items[i] @@ -184,6 +345,80 @@ } uni.vibrateShort(); }, + revise(item,index) { + var maxCount = this.matList[index].maxCount + if (maxCount == undefined ) { + this.matList[index]["maxCount"] = item.enableQty + } + this.enableQty = item.enableQty + this.count = this.minCount + this.maxCount = item.maxCount + this.rowNum = index + this.eject() + }, + eject(type) { + this.type = type + // open 鏂规硶浼犲叆鍙傛暟 绛夊悓鍦� uni-popup 缁勪欢涓婄粦瀹� type灞炴�� + this.$refs.revise.open(type) + }, + changeValue() { + + }, + confirm() { + this.matList[this.rowNum].anfme = this.count + this.$refs.revise.close() + }, + // 鍒楄〃鍙嶉�� + reChecked() { + if (this.matList.length == 0) { + return; + } + var checkArr = [] + for (var i = 0; i < this.matList.length;i++) { + if (this.matList[i].checked == true) { + this.$set(this.matList[i],'checked',false) + }else{ + this.$set(this.matList[i],'checked',true) + } + if (this.matList[i].checked == true) { + checkArr.push(this.matList[i].checked) + } + } + if (checkArr.length == this.matList.length) { + this.check = true + this.checkText = "鍙栨秷鍏ㄩ��" + } else { + this.check = false + this.checkText = "鍏ㄩ��" + } + uni.vibrateShort(); + }, + // 鍒楄〃鍏ㄩ�� + allChecked(e){ + + if (this.check == true) { + for (var i = 0; i < this.matList.length;i++) { + this.$set(this.matList[i],'checked',false) + } + this.check = false + this.checkText = "鍏ㄩ��" + } else { + for (var i = 0; i < this.matList.length;i++) { + this.$set(this.matList[i],'checked',true) + } + this.check = true + this.checkText = "鍙栨秷鍏ㄩ��" + } + uni.vibrateShort(); + }, + // 妫�楠屽垪琛ㄩ暱搴� 绛変簬0 鏄剧ず鍏ㄩ�� + checkList() { + if (this.matList.length == 0) { + this.check = false + this.checkText = "鍏ㄩ��" + return; + } + } } } </script> @@ -224,11 +459,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; @@ -239,13 +489,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; @@ -283,19 +533,39 @@ .data-list:last-child { margin-bottom: 120rpx; } - .data-list-left { + /* .data-list-left { display: inline-block; float: left; 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; + } + .matnr { + padding-top: 10rpx; } .data-list-right { display: inline-block; - float: left; + float: right; height: 180rpx; - color: #828282; + line-height: 180rpx; } - -</style> + /* display: inline-block; + float: right; + width: 200rpx; + height: 180rpx; + line-height: 180rpx; */ + .data-list-right label { + display: inline-block; + float: left; + width: 80rpx; + height: 180rpx; + } +</style> \ No newline at end of file -- Gitblit v1.9.1