陈薪名
9 months ago
2 changed files with 345 additions and 0 deletions
@ -0,0 +1,269 @@ |
|||
<template> |
|||
<view class=""> |
|||
<uni-popup ref="popup"> |
|||
<view class="uni-flex uni-column pop_customer"> |
|||
<view class="" style="padding:10rpx"> |
|||
<view class="uni-flex u-col-center uni-row space-between" style="padding: 10rpx 10rpx 20rpx 10rpx"> |
|||
<view class="" style="font-size: 35rpx;"> |
|||
{{title}} |
|||
</view> |
|||
<image style="width: 35rpx;height: 35rpx;" src="/static/icons/icons_close.svg" |
|||
@click="closeEditPopup"></image> |
|||
</view> |
|||
<u-line /> |
|||
<view class="uni-flex uni-column" style="background-color: white; height:60%;"> |
|||
<view class="uni-flex uni-column "> |
|||
<view class="uni-flex uni-row space-between padding title "> |
|||
<text>标包个数 : </text> |
|||
<view class="uni-flex uni-row u-col-center"> |
|||
<uni-number-box @change="calcQty($event,stdCount)" :value="stdCount" :focus="false"> |
|||
</uni-number-box> |
|||
<view class="std_pack"> |
|||
{{getStdPackUnitInfo(dataContent.stdPackUnit)}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<u-line /> |
|||
<view class="uni-flex uni-row space-between padding title u-col-center"> |
|||
<text>标包量 : </text> |
|||
<view class="uni-flex u-col-center uni-row"> |
|||
<text>{{Number(dataContent.stdPackQty)}}</text> |
|||
<uom :uom="dataContent.uom"></uom> |
|||
</view> |
|||
</view> |
|||
|
|||
<u-line /> |
|||
<view class="uni-flex uni-row space-between padding title u-col-center"> |
|||
<text>数量 : </text> |
|||
<view class="uni-flex uni-row uni-center" style="align-items: center;"> |
|||
<input class="qty_input" v-model="allQty" :focus="true" type="number" |
|||
@mousedown="mousedown" @input="checkNum" :maxlength="maxlength" /> |
|||
<uom :uom="dataContent.uom"></uom> |
|||
</view> |
|||
</view> |
|||
<u-line /> |
|||
<view v-if="isShowBalance" |
|||
class="uni-flex uni-row space-between padding title u-col-center"> |
|||
<text>库存数量 : </text> |
|||
<view class="uni-flex uni-row uni-center" style="align-items: center;"> |
|||
<text class="text_recommend">{{Number(dataContent.balanceQty)}}</text> |
|||
<uom :uom="dataContent.uom"></uom> |
|||
</view> |
|||
</view> |
|||
<u-line /> |
|||
<view v-if="isShowStatus" class="uni-flex uni-row space-between title" |
|||
style="align-items: center; padding-left: 30rpx;"> |
|||
<text>库存状态 : </text> |
|||
<view class="uni-flex uni-row uni-center" style="align-items: center;"> |
|||
<balanceStatus ref="balanceStatus" :status="inventoryStatus" :allowEdit='true' |
|||
@updateStatus="updateStatus" @onOpen="clickState"> |
|||
</balanceStatus> |
|||
</view> |
|||
</view> |
|||
<u-line /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="uni-flex uni-row hide_border"> |
|||
<button class="btn_edit_big_cancle" hover-class="btn_edit_big_after" @click="cancel()">取消</button> |
|||
<button v-if="showConfirmCountdown" class="btn_edit_big_confirm" hover-class="btn_edit_big_after" |
|||
@click="confirm()">确认({{seconds}}s关闭)</button> |
|||
<button v-else class="btn_edit_big_confirm" hover-class="btn_edit_big_after" |
|||
@click="confirm()">确认</button> |
|||
</view> |
|||
</view> |
|||
|
|||
</uni-popup> |
|||
<comMessage ref="comMessage"></comMessage> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import uom from '@/mycomponents/qty/uom.vue' |
|||
import balanceStatus from '@/mycomponents/status/balanceStatus.vue' |
|||
import { |
|||
getStdPackUnitInfo |
|||
} from "@/common/directory.js" |
|||
import { |
|||
getInventoryStatusName |
|||
} from '@/common/directory.js'; |
|||
|
|||
export default { |
|||
components: { |
|||
uom, |
|||
balanceStatus, |
|||
}, |
|||
data() { |
|||
return { |
|||
allQty: 0, |
|||
stdCount: 0, |
|||
stateData: 0, |
|||
balanceQty: 0, |
|||
inventoryStatus: "", |
|||
dataContent: {}, |
|||
handleQty: 0, |
|||
seconds: 0, |
|||
timer: {}, |
|||
showConfirmCountdown: false, |
|||
detailList: [], |
|||
maxlength: 10, |
|||
mode: 'add' //add 新增 edit 编辑 |
|||
} |
|||
}, |
|||
watch: { |
|||
|
|||
}, |
|||
created() { |
|||
|
|||
}, |
|||
|
|||
props: { |
|||
title: { |
|||
type: String, |
|||
default: "编辑数量" |
|||
}, |
|||
settingParam: { |
|||
type: Object, |
|||
default: {} |
|||
}, |
|||
isShowStatus: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
isShowBalance: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
allowEditStatus: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
}, |
|||
methods: { |
|||
checkNum(e) { |
|||
let value = e.detail.value; |
|||
let dot = value.indexOf('.'); //包含小数点 |
|||
let reg = /^[0-9]+$/; //正整数 |
|||
if (dot > -1) { |
|||
this.maxlength = dot + 7; //长度是小数点后两位 |
|||
if (value.length > dot + 7) { |
|||
|
|||
} |
|||
} |
|||
if (reg.test(value)) { //如果是正整数不包含小数点 |
|||
this.maxlength = 10; |
|||
} |
|||
}, |
|||
|
|||
//编辑时弹出 |
|||
openEditPopup(item, detailList) { |
|||
this.initData(item, detailList); |
|||
// this.dataContent = item |
|||
// this.inventoryStatus = this.dataContent.inventoryStatus; |
|||
// this.allQty = Number(this.dataContent.qty) |
|||
// this.stdCount = Math.ceil(this.allQty / this.dataContent.stdPackQty); |
|||
// this.detailList = detailList |
|||
this.showConfirmCountdown = false; |
|||
this.mode = 'edit'; |
|||
setTimeout(res => { |
|||
this.$refs.popup.open('bottom') |
|||
}, 500) |
|||
clearInterval(this.timer) |
|||
}, |
|||
|
|||
//新增时弹出 |
|||
openEditPopupShowSeconds(item, detailList) { |
|||
this.initData(item, detailList); |
|||
this.showConfirmCountdown = true; |
|||
this.mode = 'add'; |
|||
setTimeout(res => { |
|||
this.$refs.popup.open('bottom') |
|||
}, 500) |
|||
this.startTimer() |
|||
}, |
|||
|
|||
initData(item, detailList) { |
|||
this.dataContent = item; |
|||
this.inventoryStatus = this.dataContent.inventoryStatus; |
|||
this.allQty = Number(this.dataContent.handleQty); |
|||
this.stdCount = Math.ceil(this.allQty / this.dataContent.stdPackQty); |
|||
this.detailList = detailList; |
|||
}, |
|||
|
|||
mousedown() { |
|||
this.showConfirmCountdown = false; |
|||
clearInterval(this.timer) |
|||
}, |
|||
|
|||
clickState() { |
|||
this.showConfirmCountdown = false; |
|||
clearInterval(this.timer) |
|||
}, |
|||
|
|||
closeEditPopup() { |
|||
clearInterval(this.timer) |
|||
this.$emit("close"); |
|||
this.$refs.popup.close() |
|||
}, |
|||
confirm() { |
|||
this.setValue(); |
|||
}, |
|||
cancel() { |
|||
this.closeEditPopup(); |
|||
}, |
|||
startTimer() { |
|||
this.seconds = 3; |
|||
clearInterval(this.timer) |
|||
this.timer = setInterval(() => { |
|||
this.seconds-- |
|||
if (this.seconds <= 0) { |
|||
this.confirm(); |
|||
// this.cancel() |
|||
return |
|||
} |
|||
}, 1000) |
|||
}, |
|||
calcQty(val) { |
|||
if (val > 0) { |
|||
this.allQty = val * Number(this.dataContent.stdPackQty); |
|||
} |
|||
}, |
|||
|
|||
setValue() { |
|||
this.dataContent.handleQty = Number(this.allQty) |
|||
this.$emit("confirm", Number(this.allQty), this.inventoryStatus, this.mode); |
|||
this.closeEditPopup(); |
|||
}, |
|||
|
|||
updateStatus(value) { |
|||
this.inventoryStatus = value |
|||
}, |
|||
|
|||
getStdPackUnitInfo(value) { |
|||
return getStdPackUnitInfo(value).name |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.uni-popup .uni-popup__wrapper { |
|||
width: 100% !important; |
|||
padding: 30rpx; |
|||
} |
|||
|
|||
.hide_border { |
|||
button { |
|||
border: none; |
|||
} |
|||
|
|||
button::after { |
|||
border: none; |
|||
} |
|||
} |
|||
|
|||
.title { |
|||
font-size: 30rpx; |
|||
} |
|||
</style> |
@ -0,0 +1,76 @@ |
|||
<template> |
|||
<view> |
|||
<view class="uni-flex uni-row center"> |
|||
<status v-if="isShowStatus" :status='dataContent.inventoryStatus'></status> |
|||
<view class="text_recommend "> |
|||
{{Number(dataContent.qty)}} |
|||
</view> |
|||
<!-- v-show="!isShowStdPack" --> |
|||
<uom :uom="dataContent.uom"></uom> |
|||
</view> |
|||
<view> |
|||
<pack-unit :dataContent="dataContent"></pack-unit> |
|||
<!-- <std-pack-qty v-show="isShowStdPack" :dataContent="dataContent"></std-pack-qty> --> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
// import stdPackQty from '@/mycomponents/qty/stdPackQty.vue' |
|||
import packUnit from '@/mycomponents/qty/packUnit.vue' |
|||
import uom from '@/mycomponents/qty/uom.vue' |
|||
import status from '@/mycomponents/status/status.vue' |
|||
|
|||
export default { |
|||
components: { |
|||
// stdPackQty, |
|||
packUnit, |
|||
uom, |
|||
status |
|||
}, |
|||
data() { |
|||
return { |
|||
|
|||
}; |
|||
}, |
|||
// 此处定义传入的数据 |
|||
props: { |
|||
type: { |
|||
type: String, |
|||
default: 'default' //recommend:推荐 compare:对比 |
|||
}, |
|||
|
|||
dataContent: { |
|||
type: Object, |
|||
default: {} |
|||
}, |
|||
recommendQty: { |
|||
type: Number, |
|||
default: 0 |
|||
}, |
|||
|
|||
handleQty: { |
|||
type: Number, |
|||
default: 0 |
|||
}, |
|||
|
|||
isShowStatus: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
isShowStdPack: { |
|||
type: Boolean, |
|||
default: true |
|||
} |
|||
}, |
|||
watch: { |
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
</style> |
Loading…
Reference in new issue