15 changed files with 1175 additions and 435 deletions
@ -1,418 +1,370 @@ |
|||||
<template> |
<template> |
||||
<view class="page-wraper"> |
<view class="page-wraper"> |
||||
<view class=""> |
<view class=""> |
||||
<com-blank-view @goScan='getBusinessType' v-if="detailSource.length==0"></com-blank-view> |
<com-blank-view @goScan="getBusinessType" v-if="detailSource.length == 0"></com-blank-view> |
||||
</view> |
</view> |
||||
|
|
||||
<view class="page-wraper" v-if="detailSource.length>0"> |
<view class="page-wraper" v-if="detailSource.length > 0"> |
||||
<view class="page-main"> |
<view class="page-main"> |
||||
<scroll-view scroll-y="true" class="page-main-scroll"> |
<scroll-view scroll-y="true" class="page-main-scroll"> |
||||
<view class="detail-list" v-for="(item, index) in detailSource" :key="item.id"> |
<view class="detail-list" v-for="(item, index) in detailSource" :key="item.id"> |
||||
<view class=""> |
<view class=""> |
||||
<record-com-detail-card :dataContent="item" @removeItem="removeItem(index,item)" |
<record-com-detail-card :dataContent="item" @removeItem="removeItem(index, item)" @updateData="updateData" @removePack="updateData" :isShowToLocation="false"> </record-com-detail-card> |
||||
@updateData="updateData" @removePack='updateData' :isShowToLocation="false"> |
</view> |
||||
</record-com-detail-card> |
</view> |
||||
</view> |
<view class="uni-flex uni-row" style="margin-left: 30rpx; margin-top: 10rpx"> |
||||
</view> |
<text style="font-size: 35rpx; margin-right: 20rpx">拆出数量 :</text> |
||||
<view class="uni-flex uni-row" style="margin-left: 30rpx;margin-top: 10rpx; "> |
<uni-number-box @change="calcQty($event, splitCount)" :value="splitCount"> </uni-number-box> |
||||
|
<uom :uom="detailSource[0].uom"></uom> |
||||
<text style="font-size: 35rpx; margin-right: 20rpx;">拆出数量 :</text> |
</view> |
||||
<uni-number-box @change="calcQty($event,splitCount)" :value="splitCount"> |
</scroll-view> |
||||
</uni-number-box> |
</view> |
||||
<uom :uom="detailSource[0].uom"></uom> |
|
||||
</view> |
<view class="page-footer"> |
||||
</scroll-view> |
<view class="uni-flex u-col-center space-between padding_10" style="background-color: ghostwhite; width: 100%"> |
||||
</view> |
<view class=""> </view> |
||||
|
<view class="uni-flex uni-row"> |
||||
<view class="page-footer"> |
<button class="btn_single_commit" hover-class="btn_commit_after" @click="commit">提交</button> |
||||
<view class="uni-flex u-col-center space-between padding_10" |
</view> |
||||
style="background-color:ghostwhite; width: 100%; "> |
</view> |
||||
<view class=""> |
</view> |
||||
</view> |
|
||||
<view class=" uni-flex uni-row"> |
<win-scan-button @goScan="openScanPopup"></win-scan-button> |
||||
<button class="btn_single_commit" hover-class="btn_commit_after" @click="commit">提交</button> |
</view> |
||||
</view> |
|
||||
</view> |
<winComScanBalance ref="scanPopup" @getBalance="getScanResult" :bussinessCode="typeCode"> </winComScanBalance> |
||||
</view> |
<comMessage ref="comMessage"></comMessage> |
||||
|
</view> |
||||
<win-scan-button @goScan='openScanPopup'></win-scan-button> |
|
||||
</view> |
|
||||
|
|
||||
<winComScanBalance ref="scanPopup" @getBalance='getScanResult' :bussinessCode="typeCode"> |
|
||||
</winComScanBalance> |
|
||||
<comMessage ref="comMessage"></comMessage> |
|
||||
</view> |
|
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { |
import { goHome, showConfirmMsg } from '@/common/basic.js' |
||||
goHome, |
import { splitPackageRecordSubmit } from '@/api/request2.js' |
||||
showConfirmMsg |
|
||||
} from '@/common/basic.js'; |
import { calc } from '@/common/calc.js' |
||||
import { |
|
||||
splitPackageRecordSubmit |
import { getInventoryStatusDesc, getDirectoryItemArray } from '@/common/directory.js' |
||||
} from '@/api/request2.js'; |
|
||||
|
import { getBusinessType, createItemInfo, createDetailInfo, calcHandleQty } from '@/common/record.js' |
||||
import { |
|
||||
calc |
import winScanButton from '@/mycomponents/scan/winScanButton.vue' |
||||
} from '@/common/calc.js'; |
import winScanPack from '@/mycomponents/scan/winScanPack.vue' |
||||
|
import requiredLocation from '@/mycomponents/location/requiredLocation.vue' |
||||
import { |
import recordComDetailCard from '@/mycomponents/record/recordComDetailCard.vue' |
||||
getInventoryStatusDesc, |
import comBlankView from '@/mycomponents/common/comBlankView.vue' |
||||
getDirectoryItemArray |
import winScanLocation from '@/mycomponents/scan/winScanLocation.vue' |
||||
} from '@/common/directory.js'; |
import winScanPackAndLocation from '@/mycomponents/scan/winScanPackAndLocation.vue' |
||||
|
import recommendBalance from '@/mycomponents/balance/recommendBalance.vue' |
||||
import { |
import comPackageRecord from '@/pages/package/coms/comPackageRecord.vue' |
||||
getBusinessType, |
import winComScanBalance from '@/mycomponents/scan/winComScanBalance.vue' |
||||
createItemInfo, |
import uom from '@/mycomponents/qty/uom.vue' |
||||
createDetailInfo, |
|
||||
calcHandleQty |
export default { |
||||
} from '@/common/record.js'; |
components: { |
||||
|
winScanButton, |
||||
import winScanButton from '@/mycomponents/scan/winScanButton.vue' |
winScanPack, |
||||
import winScanPack from '@/mycomponents/scan/winScanPack.vue' |
requiredLocation, |
||||
import requiredLocation from '@/mycomponents/location/requiredLocation.vue' |
comBlankView, |
||||
import recordComDetailCard from '@/mycomponents/record/recordComDetailCard.vue' |
winScanLocation, |
||||
import comBlankView from '@/mycomponents/common/comBlankView.vue' |
winScanPackAndLocation, |
||||
import winScanLocation from "@/mycomponents/scan/winScanLocation.vue" |
recommendBalance, |
||||
import winScanPackAndLocation from "@/mycomponents/scan/winScanPackAndLocation.vue" |
recordComDetailCard, |
||||
import recommendBalance from '@/mycomponents/balance/recommendBalance.vue' |
comPackageRecord, |
||||
import comPackageRecord from '@/pages/package/coms/comPackageRecord.vue' |
winComScanBalance, |
||||
import winComScanBalance from '@/mycomponents/scan/winComScanBalance.vue' |
uom |
||||
import uom from '@/mycomponents/qty/uom.vue' |
}, |
||||
|
data() { |
||||
export default { |
return { |
||||
components: { |
id: '', |
||||
winScanButton, |
detailSource: [], // 绑定在页面上的数据源 |
||||
winScanPack, |
fromLocationCode: '', |
||||
requiredLocation, |
toLocationCode: '', |
||||
comBlankView, |
fromLocationAreaTypeList: [], |
||||
winScanLocation, |
inInventoryStatus: '', // 目标入库库存状态 |
||||
winScanPackAndLocation, |
outInventoryStatus: '', // 来源出库库存状态 |
||||
recommendBalance, |
businessType: {}, |
||||
recordComDetailCard, |
dataContent: {}, |
||||
comPackageRecord, |
currentItemCode: '', |
||||
winComScanBalance, |
toPackingNumber: '', |
||||
uom |
itemCode: '', |
||||
}, |
splitCount: 1, |
||||
data() { |
typeCode: 'SplitPackage' |
||||
return { |
} |
||||
id: '', |
}, |
||||
detailSource: [], //绑定在页面上的数据源 |
onLoad(option) { |
||||
fromLocationCode: "", |
uni.setNavigationBarTitle({ |
||||
toLocationCode: "", |
title: option.title |
||||
fromLocationAreaTypeList: [], |
}) |
||||
inInventoryStatus: "", //目标入库库存状态 |
this.getBusinessType() |
||||
outInventoryStatus: "", //来源出库库存状态 |
}, |
||||
businessType: {}, |
// 返回首页 |
||||
dataContent: {}, |
onNavigationBarButtonTap(e) { |
||||
currentItemCode: "", |
if (e.index === 0) { |
||||
toPackingNumber: "", |
goHome() |
||||
itemCode:"", |
} |
||||
splitCount:1, |
}, |
||||
typeCode:"SplitPackage" |
// 拦截返回按钮事件 |
||||
}; |
onBackPress(e) {}, |
||||
}, |
|
||||
onLoad(option) { |
onPullDownRefresh() {}, |
||||
<<<<<<< Updated upstream |
|
||||
uni.setNavigationBarTitle({ |
mounted() {}, |
||||
title: option.title |
methods: { |
||||
}) |
getBusinessType() { |
||||
var typeCode = "SplitPackage" |
getBusinessType(this.typeCode, (res) => { |
||||
getBusinessType(typeCode, res => { |
if (res.success) { |
||||
if (res.success) { |
this.businessType = res.businessType |
||||
this.businessType = res.businessType; |
this.fromInventoryStatuses = getDirectoryItemArray(res.fromInventoryStatuses) |
||||
this.fromLocationAreaTypeList = res.fromLocationAreaTypeList; |
this.fromLocationAreaTypeList = res.fromLocationAreaTypeList |
||||
this.showFromLocationPopup(); |
this.openScanPopup() |
||||
} else { |
} else { |
||||
this.showErrorMessage(res.message) |
this.showErrorMessage(res.message) |
||||
} |
} |
||||
}); |
}) |
||||
======= |
}, |
||||
this.getBusinessType(); |
openScanPopup() { |
||||
>>>>>>> Stashed changes |
if (this.businessType) { |
||||
}, |
if (this.detailSource.length > 0) { |
||||
//返回首页 |
showConfirmMsg('拆包信息还没提交，是否要重新扫描?', (res) => { |
||||
onNavigationBarButtonTap(e) { |
if (res) { |
||||
if (e.index === 0) { |
this.clearData() |
||||
goHome(); |
this.$refs.scanPopup.openScanPopup(this.businessType) |
||||
} |
} |
||||
}, |
}) |
||||
//拦截返回按钮事件 |
} else { |
||||
onBackPress(e) {}, |
this.$refs.scanPopup.openScanPopup(this.businessType) |
||||
|
} |
||||
onPullDownRefresh() {}, |
} else { |
||||
|
this.getBusinessType() |
||||
mounted() {}, |
} |
||||
methods: { |
}, |
||||
getBusinessType() { |
|
||||
getBusinessType(this.typeCode, res => { |
getScanResult(result) { |
||||
if (res.success) { |
this.setData(result) |
||||
this.businessType = res.businessType; |
}, |
||||
this.fromInventoryStatuses = getDirectoryItemArray(res.fromInventoryStatuses); |
|
||||
this.fromLocationAreaTypeList = res.fromLocationAreaTypeList |
setData(result) { |
||||
this.openScanPopup(); |
const { balance } = result |
||||
} else { |
const { label } = result |
||||
this.showErrorMessage(res.message) |
const pack = result.package |
||||
} |
this.fromPackUnit = pack.packUnit |
||||
}); |
this.fromPack = pack |
||||
}, |
if (this.fromLocationCode && this.fromLocationCode != balance.locationCode) { |
||||
openScanPopup() { |
this.showErrorMessage(`箱码[${balance.packingNumber}批次[${balance.batch}]在库位[${this.fromLocationCode}]没有库存余额`) |
||||
if (this.businessType) { |
return |
||||
if(this.detailSource.length>0){ |
} |
||||
showConfirmMsg("拆包信息还没提交，是否要重新扫描?",res=>{ |
|
||||
if(res){ |
const item = this.detailSource.find((res) => { |
||||
this.clearData(); |
if (res.itemCode == balance.itemCode) { |
||||
this.$refs.scanPopup.openScanPopup(this.businessType); |
return res |
||||
} |
} |
||||
}) |
}) |
||||
}else { |
if (item == undefined) { |
||||
this.$refs.scanPopup.openScanPopup(this.businessType); |
if (this.itemCode != '' && this.itemCode != balance.itemCode) { |
||||
} |
this.showErrorMessage(`请扫描物料为【${this.itemCode}】的箱码`) |
||||
} else { |
return |
||||
this.getBusinessType() |
} |
||||
} |
const itemp = createItemInfo(balance, pack) |
||||
}, |
itemp.handleQty = 0 |
||||
|
const newDetail = createDetailInfo(balance, pack) // |
||||
getScanResult(result) { |
newDetail.handleQty = 0 |
||||
this.setData(result); |
newDetail.scaned = false |
||||
}, |
itemp.subList.push(newDetail) |
||||
|
this.detailSource.push(itemp) |
||||
setData(result) { |
this.itemCode = balance.itemCode |
||||
let balance = result.balance; |
this.fromLocationCode = balance.locationCode |
||||
let label = result.label; |
this.closeScanPopup() |
||||
let pack = result.package; |
} else { |
||||
this.fromPackUnit = pack.packUnit; |
const detail = item.subList.find((r) => { |
||||
this.fromPack = pack; |
if (r.packingNumber == balance.packingNumber && r.batch == balance.batch && r.locationCode == balance.locationCode && r.inventoryStatus == balance.inventoryStatus) { |
||||
if (this.fromLocationCode && this.fromLocationCode != balance.locationCode) { |
return r |
||||
this.showErrorMessage("箱码[" + balance.packingNumber + "批次[" + balance.batch + "]在库位[" + this |
} |
||||
.fromLocationCode + "]没有库存余额") |
}) |
||||
return; |
if (detail == undefined) { |
||||
} |
const newDetail = createDetailInfo(balance, pack) |
||||
|
newDetail.handleQty = 0 |
||||
var item = this.detailSource.find(res => { |
item.subList.push(newDetail) |
||||
if (res.itemCode == balance.itemCode) { |
this.closeScanPopup() |
||||
return res |
} else if (detail.scaned == true) { |
||||
} |
this.showErrorMessage(`箱码[${balance.packingNumber}批次[${balance.batch}]已经在列表中`) |
||||
}) |
} |
||||
if (item == undefined) { |
} |
||||
if (this.itemCode != "" && this.itemCode != balance.itemCode) { |
this.calcHandleQty() |
||||
this.showErrorMessage("请扫描物料为【" + this.itemCode + "】的箱码") |
}, |
||||
return; |
|
||||
} |
calcHandleQty() { |
||||
var itemp = createItemInfo(balance, pack); |
calcHandleQty(this.detailSource) |
||||
itemp.handleQty=0 |
this.$forceUpdate() |
||||
let newDetail = createDetailInfo(balance, pack); // |
}, |
||||
newDetail.handleQty=0 |
|
||||
newDetail.scaned=false |
showErrorMessage(message) { |
||||
itemp.subList.push(newDetail); |
this.$refs.comMessage.showErrorMessage(message, (res) => { |
||||
this.detailSource.push(itemp) |
if (res) { |
||||
this.itemCode = balance.itemCode; |
} |
||||
this.fromLocationCode = balance.locationCode |
}) |
||||
this.closeScanPopup() |
}, |
||||
} else { |
|
||||
var detail = item.subList.find(r => { |
updateData() { |
||||
if (r.packingNumber == balance.packingNumber && |
this.calcHandleQty() |
||||
r.batch == balance.batch && |
for (let i = 0; i < this.detailSource.length; i++) { |
||||
r.locationCode == balance.locationCode && |
const item = this.detailSource[i] |
||||
r.inventoryStatus == balance.inventoryStatus) { |
if (item.qty == 0) { |
||||
return r; |
this.detailSource.splice(i, 1) |
||||
} |
} |
||||
}) |
} |
||||
if (detail == undefined) { |
}, |
||||
let newDetail = createDetailInfo(balance, pack); |
removeItem(index, item) { |
||||
newDetail.handleQty=0 |
this.detailSource.splice(index, 1) |
||||
item.subList.push(newDetail); |
}, |
||||
this.closeScanPopup() |
|
||||
} else { |
closeScanPopup() { |
||||
if (detail.scaned == true) { |
if (this.$refs.scanPopup != undefined) { |
||||
this.showErrorMessage("箱码[" + balance.packingNumber + "批次[" + balance.batch + "]已经在列表中") |
this.$refs.scanPopup.closeScanPopup() |
||||
} |
} |
||||
} |
}, |
||||
} |
|
||||
this.calcHandleQty(); |
scanPopupGetFocus() { |
||||
}, |
if (this.$refs.scanPopup != undefined) { |
||||
|
this.$refs.scanPopup.getfocus() |
||||
calcHandleQty() { |
} |
||||
calcHandleQty(this.detailSource) |
}, |
||||
this.$forceUpdate(); |
|
||||
}, |
commit() { |
||||
|
if (this.detailSource.length > 0 && this.detailSource[0].subList.length > 0) { |
||||
|
if (this.splitCount == 0) { |
||||
showErrorMessage(message) { |
this.showErrorMessage('拆出数量不能等于0') |
||||
this.$refs.comMessage.showErrorMessage(message, res => { |
return |
||||
if (res) { |
} |
||||
|
if (this.splitCount > this.detailSource[0].qty) { |
||||
} |
this.showErrorMessage('拆出数量不能大于库存数量') |
||||
}); |
return |
||||
}, |
} |
||||
|
uni.showLoading({ |
||||
updateData() { |
title: '提交中....', |
||||
this.calcHandleQty(); |
mask: true |
||||
for (var i = 0; i < this.detailSource.length; i++) { |
}) |
||||
let item = this.detailSource[i]; |
|
||||
if (item.qty == 0) { |
const params = this.setParams() |
||||
this.detailSource.splice(i, 1) |
console.log(`提交${JSON.stringify(params)}`) |
||||
} |
// splitPackageRecordSubmit(params).then(res => { |
||||
} |
// uni.hideLoading() |
||||
}, |
// if (res.data) { |
||||
removeItem(index, item) { |
|
||||
this.detailSource.splice(index, 1) |
// let list = [] |
||||
}, |
// res.data.forEach(item => { |
||||
|
// list.push({ |
||||
closeScanPopup() { |
// itemCode: item.itemCode, // 物品代码 |
||||
if (this.$refs.scanPopup != undefined) { |
// itemName: item.itemName, // 物品名称 |
||||
this.$refs.scanPopup.closeScanPopup(); |
// packName: item.packName, // 包装名称 |
||||
} |
// packageCode: item.toPackingNumber, // 包装号 |
||||
}, |
// batch: item.toBatch, //批次 |
||||
|
// parentNumber: item.parentNumber, //父包装号 |
||||
scanPopupGetFocus() { |
// itemType: item.itemType, //物料类型 |
||||
if (this.$refs.scanPopup != undefined) { |
// asnNumber: item.asnNumber, //ASN |
||||
this.$refs.scanPopup.getfocus(); |
// supplierCode: item.supplierCode, // 供应商 |
||||
} |
// qty: item.qty, // 数量 |
||||
}, |
// printTimes: getCurrDateTime(), // 打印时间 |
||||
|
// productionLineCode: item.productionLineCode, //生产线 |
||||
commit() { |
// barcodeString: item.barcodeString, // 标签信息 |
||||
if (this.detailSource.length > 0 && this.detailSource[0].subList.length > 0) { |
// barcodeBase64: '', |
||||
|
// }) |
||||
if(this.splitCount==0){ |
// }) |
||||
this.showErrorMessage("拆出数量不能等于0") |
// this.showCommitSuccessMessage("提交成功<br>生成拆包记录<br>", list) |
||||
return; |
|
||||
} |
// } else { |
||||
if(this.splitCount>this.detailSource[0].qty){ |
// this.showErrorMessage("提交失败[" + res.msg + "]") |
||||
this.showErrorMessage("拆出数量不能大于库存数量") |
// } |
||||
return; |
// }).catch(error => { |
||||
} |
// uni.hideLoading() |
||||
uni.showLoading({ |
// this.showErrorMessage(error) |
||||
title: "提交中....", |
// }) |
||||
mask: true |
} else { |
||||
}); |
this.showErrorMessage('没有要提交的数据') |
||||
|
} |
||||
var params = this.setParams(); |
}, |
||||
console.log("提交" + JSON.stringify(params)) |
|
||||
// splitPackageRecordSubmit(params).then(res => { |
setParams() { |
||||
// uni.hideLoading() |
const subList = [] |
||||
// if (res.data) { |
const creator = this.$store.state.user.id |
||||
|
this.detailSource.forEach((item) => { |
||||
// let list = [] |
item.subList.forEach((detail) => { |
||||
// res.data.forEach(item => { |
const subItem = {} |
||||
// list.push({ |
Object.assign(subItem, detail) |
||||
// itemCode: item.itemCode, // 物品代码 |
subItem.itemCode = subItem.itemCode |
||||
// itemName: item.itemName, // 物品名称 |
subItem.itemName = detail.package.itemName |
||||
// packName: item.packName, // 包装名称 |
subItem.itemDesc1 = detail.package.itemDesc1 |
||||
// packageCode: item.toPackingNumber, // 包装号 |
subItem.itemDesc2 = detail.package.itemDesc2 |
||||
// batch: item.toBatch, //批次 |
|
||||
// parentNumber: item.parentNumber, //父包装号 |
subItem.fromInventoryStatus = subItem.inventoryStatus |
||||
// itemType: item.itemType, //物料类型 |
subItem.toInventoryStatus = subItem.inventoryStatus |
||||
// asnNumber: item.asnNumber, //ASN |
|
||||
// supplierCode: item.supplierCode, // 供应商 |
subItem.fromQty = subItem.qty |
||||
// qty: item.qty, // 数量 |
subItem.toQty = subItem.qty |
||||
// printTimes: getCurrDateTime(), // 打印时间 |
|
||||
// productionLineCode: item.productionLineCode, //生产线 |
subItem.fromPackingNumber = subItem.packingNumber |
||||
// barcodeString: item.barcodeString, // 标签信息 |
subItem.toPackingNumber = subItem.packingNumber |
||||
// barcodeBase64: '', |
|
||||
// }) |
subItem.fromBatch = subItem.batch |
||||
// }) |
subItem.toBatch = subItem.batch |
||||
// this.showCommitSuccessMessage("提交成功<br>生成拆包记录<br>", list) |
subItem.fromLocationCode = subItem.fromLocationCode |
||||
|
subItem.package = '' |
||||
// } else { |
subItem.Records = '' |
||||
// this.showErrorMessage("提交失败[" + res.msg + "]") |
subList.push(subItem) |
||||
// } |
}) |
||||
// }).catch(error => { |
}) |
||||
// uni.hideLoading() |
|
||||
// this.showErrorMessage(error) |
this.dataContent.subList = subList |
||||
// }) |
this.dataContent.creator = creator |
||||
} else { |
return this.dataContent |
||||
this.showErrorMessage("没有要提交的数据") |
}, |
||||
} |
|
||||
|
showMessage(message) { |
||||
}, |
this.$refs.comMessage.showMessage(message, (res) => { |
||||
|
if (res) { |
||||
setParams() { |
} |
||||
var subList = [] |
}) |
||||
var creator = this.$store.state.user.id |
}, |
||||
this.detailSource.forEach(item => { |
|
||||
item.subList.forEach(detail => { |
showScanMessage(message) { |
||||
var subItem = {}; |
this.$refs.comMessage.showScanMessage(message) |
||||
Object.assign(subItem, detail) |
}, |
||||
subItem.itemCode = subItem.itemCode; |
|
||||
subItem.itemName = detail.package.itemName; |
afterCloseMessage() { |
||||
subItem.itemDesc1 = detail.package.itemDesc1; |
this.scanPopupGetFocus() |
||||
subItem.itemDesc2 = detail.package.itemDesc2; |
}, |
||||
|
|
||||
subItem.fromInventoryStatus = subItem.inventoryStatus; |
closeScanMessage() { |
||||
subItem.toInventoryStatus = subItem.inventoryStatus; |
this.scanPopupGetFocus() |
||||
|
}, |
||||
subItem.fromQty = subItem.qty |
|
||||
subItem.toQty = subItem.qty |
showCommitSuccessMessage(hint, pointData) { |
||||
|
this.$refs.comMessage.showSuccessMessage(hint, (res) => { |
||||
subItem.fromPackingNumber = subItem.packingNumber; |
this.clearData() |
||||
subItem.toPackingNumber = subItem.packingNumber; |
if (pointData.length > 0) { |
||||
|
uni.navigateTo({ |
||||
subItem.fromBatch = subItem.batch; |
url: `/pages/point/index?points=${JSON.stringify(pointData)}` |
||||
subItem.toBatch = subItem.batch; |
}) |
||||
subItem.fromLocationCode = subItem.fromLocationCode; |
} |
||||
subItem.package = "" |
}) |
||||
subItem.Records = "" |
}, |
||||
subList.push(subItem) |
|
||||
|
clearData() { |
||||
}) |
this.detailSource = [] |
||||
}) |
this.fromLocationCode = '' |
||||
|
this.currentItemCode = '' |
||||
this.dataContent.subList = subList; |
this.dataContent = {} |
||||
this.dataContent.creator = creator; |
this.itemCode = '' |
||||
return this.dataContent; |
this.splitCount = 1 |
||||
}, |
}, |
||||
|
|
||||
showMessage(message) { |
calcQty(val) { |
||||
this.$refs.comMessage.showMessage(message, res => { |
this.splitCount = val |
||||
if (res) {} |
// if(val<=0){ |
||||
}); |
// this.showErrorMessage("数量必须大于0") |
||||
}, |
// } |
||||
|
} |
||||
showScanMessage(message) { |
} |
||||
this.$refs.comMessage.showScanMessage(message); |
} |
||||
}, |
|
||||
|
|
||||
afterCloseMessage() { |
|
||||
this.scanPopupGetFocus(); |
|
||||
}, |
|
||||
|
|
||||
closeScanMessage() { |
|
||||
this.scanPopupGetFocus(); |
|
||||
}, |
|
||||
|
|
||||
showCommitSuccessMessage(hint, pointData) { |
|
||||
this.$refs.comMessage.showSuccessMessage(hint, res => { |
|
||||
this.clearData(); |
|
||||
if (pointData.length > 0) { |
|
||||
uni.navigateTo({ |
|
||||
url: `/pages/point/index?points=${JSON.stringify(pointData)}` |
|
||||
}); |
|
||||
} |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
clearData(){ |
|
||||
this.detailSource = [] |
|
||||
this.fromLocationCode = ''; |
|
||||
this.currentItemCode = "" |
|
||||
this.dataContent = {} |
|
||||
this.itemCode="" |
|
||||
this.splitCount=1 |
|
||||
}, |
|
||||
|
|
||||
calcQty(val) { |
|
||||
this.splitCount =val; |
|
||||
// if(val<=0){ |
|
||||
// this.showErrorMessage("数量必须大于0") |
|
||||
// } |
|
||||
}, |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
</script> |
</script> |
||||
|
|
||||
<style scoped lang="scss"> |
<style scoped lang="scss"></style> |
||||
|
|
||||
</style> |
|
||||
|
|||||
@ -1,20 +1,23 @@ |
|||||
<template> |
<template> |
||||
<job-com-main-card :dataContent="dataContent"> |
<job-com-main-card :dataContent="dataContent"> |
||||
<jobComMainDetailCard :dataContent="dataContent"></jobComMainDetailCard> |
<jobComMainDetailCard :dataContent="dataContent"></jobComMainDetailCard> |
||||
</job-com-main-card> |
</job-com-main-card> |
||||
</template> |
</template> |
||||
|
|
||||
<script setup lang="ts"> |
<script setup lang="ts"> |
||||
import jobComMainCard from '@/mycomponents/job/jobComMainCard.vue' |
import jobComMainCard from '@/mycomponents/job/jobComMainCard.vue' |
||||
import jobComMainDetailCard from '@/mycomponents/job/jobComMainDetailCard.vue' |
import jobComMainDetailCard from '@/mycomponents/job/jobComMainDetailCard.vue' |
||||
const props = defineProps({ |
|
||||
dataContent: { |
|
||||
type: Object, |
|
||||
default: {} |
|
||||
} |
|
||||
}) |
|
||||
</script> |
|
||||
|
|
||||
<style lang="scss"> |
const props = defineProps({ |
||||
|
dataContent: { |
||||
|
type: Object, |
||||
|
default: {} |
||||
|
}, |
||||
|
isShowToLocation: { |
||||
|
type: Boolean, |
||||
|
default: true |
||||
|
} |
||||
|
}) |
||||
|
</script> |
||||
|
|
||||
</style> |
<style lang="scss"></style> |
||||
|
|||||
@ -0,0 +1,8 @@ |
|||||
|
## 1.0.11（2023-11-15） |
||||
|
reqFun只允许传入Promise |
||||
|
## 1.0.10（2023-11-13） |
||||
|
去除默认值 |
||||
|
## 1.0.1（2023-11-13） |
||||
|
更新插件依赖 |
||||
|
## 1.0.0（2023-11-13） |
||||
|
第一次发布 |
||||
@ -0,0 +1,22 @@ |
|||||
|
export default { |
||||
|
mode: 'radio', //radio checkbox 单选、多选
|
||||
|
showType: 'text', //暂时不用 text image 纯文字、图文
|
||||
|
selected: '', //已选中的
|
||||
|
dataList: null, //如果dataList传入了数组则直接使用传入的数组渲染，无需再配置proxyConfig
|
||||
|
proxyConfig: { //组件内部代理请求数据配置
|
||||
|
reqFun: Promise.resolve(), //请求方法
|
||||
|
localPaging: false //前端本地分页,如果使用的是dataList默认是本地分页
|
||||
|
}, |
||||
|
page: { //如果是组件内部代理请求会把page的值加入到请求参数里
|
||||
|
pageIndex: 1, //当前页
|
||||
|
pageSize: 20 //页大小
|
||||
|
}, |
||||
|
search: { |
||||
|
type: 'local', //搜索的类型,local本地搜索, remote向服务器请求。只有使用proxyConfig.reqFun请求才能配置为remote
|
||||
|
}, |
||||
|
fields: { //显示的key,value
|
||||
|
label: 'name', |
||||
|
value: 'code', |
||||
|
image: 'image', //暂时不用
|
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,74 @@ |
|||||
|
/**深度合并对象*/ |
||||
|
export const deepMerge = function(target = {}, source = {}) { |
||||
|
target = deepClone(target); //深度克隆
|
||||
|
if (typeof target !== 'object' || typeof source !== 'object') return false; //判断类型
|
||||
|
for (let prop in source) { |
||||
|
if (!source.hasOwnProperty(prop)) continue; //检测属性是否为对象的自有属性
|
||||
|
if (prop in target) { //prop 中是否有 target 属性
|
||||
|
if (typeof target[prop] !== 'object') { |
||||
|
target[prop] = source[prop]; |
||||
|
} else { |
||||
|
if (typeof source[prop] !== 'object') { |
||||
|
target[prop] = source[prop]; |
||||
|
} else { |
||||
|
if (target[prop].concat && source[prop].concat) { |
||||
|
target[prop] = target[prop].concat(source[prop]); //合并
|
||||
|
} else { |
||||
|
target[prop] = deepMerge(target[prop], source[prop]); //递归
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} else { |
||||
|
target[prop] = source[prop]; |
||||
|
} |
||||
|
} |
||||
|
return target; |
||||
|
} |
||||
|
|
||||
|
const isArray = function(arr) { |
||||
|
return Object.prototype.toString.call(arr) === '[object Array]'; |
||||
|
} |
||||
|
|
||||
|
/**深度合并对象*/ |
||||
|
export const deepClone = function(obj) { |
||||
|
// 对常见的“非”值，直接返回原来值
|
||||
|
if ([null, undefined, NaN, false].includes(obj)) return obj; |
||||
|
if (typeof obj !== "object" && typeof obj !== 'function') { |
||||
|
//原始类型直接返回
|
||||
|
return obj; |
||||
|
} |
||||
|
let o = isArray(obj) ? [] : {}; |
||||
|
for (let i in obj) { |
||||
|
if (obj.hasOwnProperty(i)) { |
||||
|
o[i] = typeof obj[i] === "object" ? deepClone(obj[i]) : obj[i]; |
||||
|
} |
||||
|
} |
||||
|
return o; |
||||
|
}; |
||||
|
|
||||
|
let timeout = null |
||||
|
/** |
||||
|
* 防抖原理：一定时间内，只有最后一次操作，再过wait毫秒后才执行函数 |
||||
|
* |
||||
|
* @param {Function} func 要执行的回调函数 |
||||
|
* @param {Number} wait 延时的时间 |
||||
|
* @param {Boolean} immediate 是否立即执行 |
||||
|
* @return null |
||||
|
*/ |
||||
|
export const debounce = function(func, wait = 500, immediate = false) { |
||||
|
// 清除定时器
|
||||
|
if (timeout !== null) clearTimeout(timeout) |
||||
|
// 立即执行，此类情况一般用不到
|
||||
|
if (immediate) { |
||||
|
const callNow = !timeout |
||||
|
timeout = setTimeout(() => { |
||||
|
timeout = null |
||||
|
}, wait) |
||||
|
if (callNow) typeof func === 'function' && func() |
||||
|
} else { |
||||
|
// 设置定时器，当最后一次操作后，timeout不会再被清除，所以在延时wait毫秒后执行func回调方法
|
||||
|
timeout = setTimeout(() => { |
||||
|
typeof func === 'function' && func() |
||||
|
}, wait) |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,130 @@ |
|||||
|
<template> |
||||
|
<view class="wz-list"> |
||||
|
<view :class="item.check?'check-item':'list-item'" v-for="(item,index) in list" :key="index" |
||||
|
@click="$emit('checkList',item)"> |
||||
|
<view class="" v-if="isShowIcon"> |
||||
|
<uni-icons v-if="item.check" type="checkbox-filled" color="#007aff" size="24"></uni-icons> |
||||
|
<uni-icons v-else type="circle" color="#999" size="24"></uni-icons> |
||||
|
</view> |
||||
|
|
||||
|
({{index+1}}) |
||||
|
<view class="uni-flex" style="flex-direction: column; font-size: 32rpx;"> |
||||
|
<view class="list-item-text">ERP料号 : {{item.itemCode}}</view> |
||||
|
<view class="list-item-text">名称 : {{item.itemName}}</view> |
||||
|
<view class="list-item-text">描述 : {{item.itemDesc1}}</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<view class="loadmore" @click="$emit('loadmore')"> |
||||
|
<view v-if="page.loading == 'loading'" class="icon"> |
||||
|
<uni-icons type="spinner-cycle" size="24"></uni-icons> |
||||
|
</view> |
||||
|
<view class="">{{loadmore[page.loading]}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'wz-list', |
||||
|
props: { |
||||
|
list: { |
||||
|
type: Array, |
||||
|
default: () => [] |
||||
|
}, |
||||
|
isShowIcon: { |
||||
|
type: Boolean, |
||||
|
default: true |
||||
|
}, |
||||
|
page: { |
||||
|
type: Object, |
||||
|
default: () => { |
||||
|
return { |
||||
|
loading: 'loading', //loading|loadmore|nomore |
||||
|
isEmpty: false |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
fields: { |
||||
|
type: Object, |
||||
|
default: () => { |
||||
|
return { |
||||
|
label: 'name', |
||||
|
value: 'code', |
||||
|
image: 'image' |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
loadmore: { |
||||
|
loading: '正在加载', |
||||
|
loadmore: '点击或上拉加载更多', |
||||
|
nomore: '没有更多了' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
onLoad() { |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.wz-list { |
||||
|
@mixin wz-line ($line) { |
||||
|
overflow: hidden; |
||||
|
word-break: break-all; |
||||
|
text-overflow: ellipsis; |
||||
|
display: -webkit-box; // 弹性伸缩盒 |
||||
|
-webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式 |
||||
|
-webkit-line-clamp: $line; |
||||
|
} |
||||
|
|
||||
|
.list-item { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
color: $uni-text-color-grey; |
||||
|
padding: $uni-spacing-col-base; |
||||
|
margin-bottom: $uni-spacing-col-sm; |
||||
|
background-color: #fff; |
||||
|
|
||||
|
.list-item-text { |
||||
|
@include wz-line(2); |
||||
|
margin-left: 4px; |
||||
|
margin-bottom: 1px |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.check-item { |
||||
|
@extend .list-item; |
||||
|
color: $uni-text-color; |
||||
|
} |
||||
|
|
||||
|
.loadmore { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
font-size: $uni-font-size-sm; |
||||
|
padding: 8px; |
||||
|
|
||||
|
@keyframes rotateInfinite { |
||||
|
form { |
||||
|
transform: rotate(0deg); |
||||
|
} |
||||
|
|
||||
|
to { |
||||
|
transform: rotate(360deg); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.icon { |
||||
|
animation: rotateInfinite infinite 1s linear; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,90 @@ |
|||||
|
<template> |
||||
|
<view class="wz-search"> |
||||
|
<view class="search-input"> |
||||
|
<uni-icons color="#808080" size="22" type="search"></uni-icons> |
||||
|
<view class="right"> |
||||
|
<input :value="value" :placeholder="placeholder" @input="change" /> |
||||
|
</view> |
||||
|
<uni-icons v-if="value || value === 0 || value === '0'" color="#808080" size="22" type="clear" |
||||
|
@click="clear"> |
||||
|
</uni-icons> |
||||
|
</view> |
||||
|
<view class="search-button"> |
||||
|
<button class="button" @click="searchData">搜索</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'wz-search', |
||||
|
props: { |
||||
|
value: {}, |
||||
|
placeholder: { |
||||
|
type: String, |
||||
|
default: '请输入搜索关键字' |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
searchVal: '' |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
change({ |
||||
|
detail |
||||
|
}) { |
||||
|
this.$emit('input', detail.value) |
||||
|
}, |
||||
|
clear() { |
||||
|
this.$emit('clear') |
||||
|
this.$emit('input', '') |
||||
|
}, |
||||
|
searchData() { |
||||
|
this.$emit('search', this.value) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.wz-search { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
font-size: $uni-font-size-base; |
||||
|
|
||||
|
.search-input { |
||||
|
flex: 1; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
height: 32px; |
||||
|
padding: 0 8px; |
||||
|
border: 1px solid $uni-border-color; |
||||
|
border-radius: 100px; |
||||
|
|
||||
|
.right { |
||||
|
flex: 1; |
||||
|
width: 100%; |
||||
|
margin: 0 4px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.search-button { |
||||
|
margin-left: 8px; |
||||
|
|
||||
|
.button { |
||||
|
padding: 0; |
||||
|
font-size: inherit; |
||||
|
background-color: transparent; |
||||
|
color: inherit; |
||||
|
width: 100%; |
||||
|
height: 32px; |
||||
|
line-height: 32px; |
||||
|
|
||||
|
&::after { |
||||
|
border: 0; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,357 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<u-popup ref="popup" v-model="showPopup" border-radius="15" style="width: 100%;" mode="center"> |
||||
|
<view class="select-popup-content"> |
||||
|
<view class="uni-flex" style="display: flex; width: 100%;justify-content: center; "> |
||||
|
<view class="" style=" font-size: 35rpx; margin: 20rpx; font-weight: bold;"> |
||||
|
{{title}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<u-line></u-line> |
||||
|
|
||||
|
<view class="popup-search"> |
||||
|
<wz-search v-model="searchValue" @search="searchData('search')" @clear="searchData('clear')" @input="change"/> |
||||
|
</view> |
||||
|
<scroll-view class="popup-scroll-y" :scroll-top="scroll.newTop" scroll-y |
||||
|
:style="{'--popup-scroll-height': scrollH}" @scrolltolower="scrolltolower" @scroll="viewScroll"> |
||||
|
<wz-list :list="dataList" :fields="popConfig.fields" :page="pageStatus" @checkList="checkList" |
||||
|
@loadmore="scrolltolower" :isShowIcon="false" /> |
||||
|
</scroll-view> |
||||
|
<view v-if="popConfig.mode =='checkbox'" class="footer-button"> |
||||
|
<view class="button-item"> |
||||
|
<button class="button" @click="close">取消</button> |
||||
|
</view> |
||||
|
<view class="button-item"> |
||||
|
<button class="button" type="primary" @click="checkboxConfirm">确定</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</u-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import wzSearch from "./wz-search.vue" |
||||
|
import wzList from "./wz-list.vue" |
||||
|
import { |
||||
|
deepMerge, |
||||
|
deepClone, |
||||
|
debounce |
||||
|
} from "./util/index.js" |
||||
|
import defaultConfig from "./util/defaultConfig.js" |
||||
|
let allDataList = null |
||||
|
/** |
||||
|
* 下拉选择弹窗 |
||||
|
* @function open 打开弹窗 |
||||
|
* @property {String} scrollH 滚动内容的高度，不包含搜索框和多选时的底部按钮栏。需要带单位 |
||||
|
* @property {String} popType = popup弹出方向默认bottom 请查看uni-popup文档 |
||||
|
*/ |
||||
|
export default { |
||||
|
name: "wz-select-popup", |
||||
|
components: { |
||||
|
wzSearch, |
||||
|
wzList |
||||
|
}, |
||||
|
props: { |
||||
|
scrollH: { |
||||
|
type: String, |
||||
|
default: '50vh' |
||||
|
}, |
||||
|
popType: { |
||||
|
type: String, |
||||
|
default: 'bottom' |
||||
|
}, |
||||
|
title: { |
||||
|
type: String, |
||||
|
default: '物料查询' |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
dataList: [], |
||||
|
searchValue: '', |
||||
|
pageStatus: { |
||||
|
loading: '', //loading|loadmore|nomore |
||||
|
isEmpty: false |
||||
|
}, |
||||
|
scroll: { |
||||
|
oldTop: 0, |
||||
|
newTop: 0 |
||||
|
}, |
||||
|
popConfig: {}, |
||||
|
showPopup:false |
||||
|
}; |
||||
|
}, |
||||
|
mounted() { |
||||
|
this.popConfig = deepClone(defaultConfig) |
||||
|
}, |
||||
|
destroyed() { |
||||
|
allDataList = null |
||||
|
}, |
||||
|
methods: { |
||||
|
viewScrollTop() { |
||||
|
// 解决view层不同步的问题 |
||||
|
this.scroll.newTop = this.scroll.oldTop |
||||
|
this.$nextTick(function() { |
||||
|
this.scroll.newTop = 0 |
||||
|
}); |
||||
|
}, |
||||
|
viewScroll(e) { |
||||
|
debounce(() => { |
||||
|
this.scroll.oldTop = e.detail.scrollTop |
||||
|
}, 100) |
||||
|
}, |
||||
|
change(data){ |
||||
|
console.log("输入",data) |
||||
|
this.searchData("search") |
||||
|
}, |
||||
|
searchData(type) { |
||||
|
const { |
||||
|
search, |
||||
|
fields, |
||||
|
proxyConfig |
||||
|
} = this.popConfig |
||||
|
this.pageStatus.loading == 'loading' |
||||
|
this.pageStatus.isEmpty = false |
||||
|
this.popConfig.page.pageIndex = 1 |
||||
|
this.dataList = [] |
||||
|
this.viewScrollTop() |
||||
|
if (search.type === 'local' && proxyConfig.localPaging) { |
||||
|
if (type === 'clear') { |
||||
|
this.listInit(allDataList) |
||||
|
return |
||||
|
} |
||||
|
this.dataList = allDataList?.filter(v => v[fields.label].includes(this.searchValue)) |
||||
|
} else { |
||||
|
this.proxyRequest() |
||||
|
} |
||||
|
}, |
||||
|
/** |
||||
|
* 打开弹窗选择器 |
||||
|
* @function |
||||
|
* @param {Object} configs 弹出层配置 |
||||
|
* @prmam {String} configs.mode 选择模式radio单选 | checkbox多选 默认是radio |
||||
|
* @param {String | Array} configs.selected 已选中的value,单选传字符串，多选传数组 |
||||
|
* |
||||
|
* @param {Array} dataList 如果dataList传入了数组，则直接使用传入的数组渲染，无需再配置proxyConfig |
||||
|
* |
||||
|
* @param {Object} configs.proxyConfig 组件内部代理请求数据配置 |
||||
|
* @param {Function} proxyConfig.reqFun 请求数据的方法 |
||||
|
* @param {Boolean} proxyConfig.localPaging 是否本地分页 |
||||
|
* |
||||
|
* @param {Object} configs.search //搜索相关参数 |
||||
|
* @param {String} search.type = local组件内部排序搜索 | remote请求接口，会把输入的搜索文字传入proxyConfig.reqFun |
||||
|
* |
||||
|
* @param {Object} configs.page 分页的页码参数 |
||||
|
* @param {Number} page.pageIndex 当前页 |
||||
|
* @param {Number} page.pageSize 页大小 |
||||
|
* |
||||
|
* @param {Object} configs.fields 传入选项数据的key value |
||||
|
* @param {String} fields.label 用于显示文字的key |
||||
|
* @param {String} fields.value 用于取值的key |
||||
|
*/ |
||||
|
open(configs = {}) { |
||||
|
const { |
||||
|
dataList, |
||||
|
...config |
||||
|
} = configs || {} |
||||
|
|
||||
|
if (config) { |
||||
|
this.popConfig = deepMerge(this.popConfig, config) |
||||
|
} |
||||
|
this.dataList=[] |
||||
|
this.searchValue="" |
||||
|
this.listInit(dataList) |
||||
|
this.showPopup =true; |
||||
|
}, |
||||
|
/**列表数据初始化*/ |
||||
|
listInit(dataList) { |
||||
|
|
||||
|
this.pageStatus.loading = 'loading' |
||||
|
//如果dataList传入了数组，则不再调用proxyConfig.reqFun请求方法 |
||||
|
if (dataList && dataList instanceof Array) { |
||||
|
console.warn('直接使用传入的dataList') |
||||
|
allDataList = deepClone(dataList) |
||||
|
this.popConfig.proxyConfig.localPaging = true |
||||
|
this.getLocalPagingData() |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
if (this.popConfig.proxyConfig.reqFun instanceof Function) { |
||||
|
// if (Object.prototype.toString.call(this.popConfig.proxyConfig.reqFun) != '[object Promise]') { |
||||
|
// throw 'proxyConfig.reqFun需要return Promise.resolve(列表数据)' |
||||
|
// } |
||||
|
this.proxyRequest() |
||||
|
} |
||||
|
}, |
||||
|
/**组件代理请求*/ |
||||
|
proxyRequest() { |
||||
|
console.log("请求proxyRequest") |
||||
|
const { |
||||
|
proxyConfig, |
||||
|
page |
||||
|
} = this.popConfig |
||||
|
this.pageStatus.loading = 'loading' |
||||
|
|
||||
|
proxyConfig.reqFun({ |
||||
|
...page, |
||||
|
searchValue: this.searchValue |
||||
|
}).then(list => { |
||||
|
list.items.forEach(res=>{ |
||||
|
res.code =res.itemCode |
||||
|
res.name =res.itemName; |
||||
|
}) |
||||
|
|
||||
|
if (proxyConfig.localPaging) { //前端本地分页 |
||||
|
allDataList = list.items |
||||
|
this.getLocalPagingData() |
||||
|
return |
||||
|
} |
||||
|
this.pageStatus.loading = 'loadmore' |
||||
|
|
||||
|
// if (!list.items || list.items.length != page.pageSize) { |
||||
|
// this.pageStatus.loading = 'nomore' |
||||
|
// this.pageStatus.isEmpty = true |
||||
|
// } |
||||
|
if (!list.items || list.items.length ==0) { |
||||
|
this.pageStatus.loading = 'nomore' |
||||
|
this.pageStatus.isEmpty = true |
||||
|
} |
||||
|
|
||||
|
this.handleSelected(list.items) |
||||
|
this.dataList = this.dataList.concat(list.items) |
||||
|
}) |
||||
|
}, |
||||
|
close() { |
||||
|
this.showPopup =false; |
||||
|
this.$emit('close') |
||||
|
setTimeout(() => { |
||||
|
this.allDataList = null |
||||
|
this.pageStatus.isEmpty = false |
||||
|
this.pageStatus.loading = 'loading' |
||||
|
this.popConfig = defaultConfig |
||||
|
this.dataList = [] |
||||
|
}, 500) |
||||
|
}, |
||||
|
/**上拉触底*/ |
||||
|
scrolltolower() { |
||||
|
if (!this.pageStatus.isEmpty && this.pageStatus.loading != 'loading') { |
||||
|
this.popConfig.page.pageIndex++ |
||||
|
if (this.popConfig.proxyConfig.localPaging) { |
||||
|
this.getLocalPagingData() |
||||
|
} else { |
||||
|
this.proxyRequest() |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
/**前端本地分页*/ |
||||
|
getLocalPagingData() { |
||||
|
const { |
||||
|
pageIndex, |
||||
|
pageSize |
||||
|
} = this.popConfig.page |
||||
|
const list = allDataList.slice(pageSize * (pageIndex - 1), pageSize + (pageSize * (pageIndex - 1))) |
||||
|
this.pageStatus.loading = 'loadmore' |
||||
|
this.handleSelected(list) |
||||
|
this.dataList = this.dataList.concat(list) |
||||
|
if (!list || list.length != pageSize) { |
||||
|
this.pageStatus.loading = 'nomore' |
||||
|
this.pageStatus.isEmpty = true |
||||
|
} |
||||
|
}, |
||||
|
/**多选点击确定*/ |
||||
|
checkboxConfirm() { |
||||
|
const list = this.dataList.filter(v => v.check) |
||||
|
const data = { |
||||
|
names: [], |
||||
|
values: [] |
||||
|
} |
||||
|
const { |
||||
|
fields, |
||||
|
mode |
||||
|
} = this.popConfig |
||||
|
list.forEach(v => { |
||||
|
data.names.push(v[fields.label]) |
||||
|
data.values.push(v[fields.value]) |
||||
|
}) |
||||
|
this.$emit('select', mode, { |
||||
|
...data, |
||||
|
origin: list, |
||||
|
}) |
||||
|
this.close() |
||||
|
}, |
||||
|
/**选择*/ |
||||
|
checkList(data, index) { |
||||
|
const { |
||||
|
mode, |
||||
|
fields |
||||
|
} = this.popConfig |
||||
|
if (mode == 'radio') { |
||||
|
this.dataList.forEach(v => { |
||||
|
v.check = v[fields.value] == data[fields.value] ? true : false |
||||
|
}) |
||||
|
this.$emit('select', mode, data) |
||||
|
this.close() |
||||
|
} else { |
||||
|
data.check = !data.check |
||||
|
} |
||||
|
}, |
||||
|
/**处理已选中的选项*/ |
||||
|
handleSelected(list) { |
||||
|
const { |
||||
|
selected, |
||||
|
fields |
||||
|
} = this.popConfig |
||||
|
list?.forEach(item => { |
||||
|
const valueCode = item.itemCode |
||||
|
const isChecked = selected instanceof Array ? selected.includes(valueCode) : selected == |
||||
|
valueCode |
||||
|
item.check = isChecked ? true : false |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.select-popup-content { |
||||
|
background-color: #fff; |
||||
|
|
||||
|
.popup-search { |
||||
|
font-size: $uni-font-size-base; |
||||
|
padding: 4px $uni-spacing-row-base; |
||||
|
border-bottom: 1px solid $uni-border-color; |
||||
|
} |
||||
|
|
||||
|
.footer-button { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
text-align: center; |
||||
|
|
||||
|
.button-item { |
||||
|
flex: 1; |
||||
|
padding: 4px 16px; |
||||
|
|
||||
|
.button { |
||||
|
width: 100%; |
||||
|
height: 36px; |
||||
|
line-height: 36px; |
||||
|
font-size: $uni-font-size-base; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.popup-scroll-y { |
||||
|
height: var(--popup-scroll-height); |
||||
|
padding: $uni-spacing-col-sm $uni-spacing-col-base; |
||||
|
box-sizing: border-box; |
||||
|
background-color: $uni-bg-color-grey; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,82 @@ |
|||||
|
{ |
||||
|
"id": "wz-select-popup", |
||||
|
"displayName": "popup弹窗选择器", |
||||
|
"version": "1.0.11", |
||||
|
"description": "popup弹窗选择器支持单选，多选，组件内部代理请求，自定义label，value显示，分页加载，", |
||||
|
"keywords": [ |
||||
|
"wz-select-popup" |
||||
|
], |
||||
|
"repository": "", |
||||
|
"engines": { |
||||
|
"HBuilderX": "^3.96" |
||||
|
}, |
||||
|
"dcloudext": { |
||||
|
"type": "component-vue", |
||||
|
"sale": { |
||||
|
"regular": { |
||||
|
"price": "0.00" |
||||
|
}, |
||||
|
"sourcecode": { |
||||
|
"price": "0.00" |
||||
|
} |
||||
|
}, |
||||
|
"contact": { |
||||
|
"qq": "" |
||||
|
}, |
||||
|
"declaration": { |
||||
|
"ads": "无", |
||||
|
"data": "插件不采集任何数据", |
||||
|
"permissions": "无" |
||||
|
}, |
||||
|
"npmurl": "" |
||||
|
}, |
||||
|
"uni_modules": { |
||||
|
"dependencies": ["uni-icons", "uni-popup"], |
||||
|
"encrypt": [], |
||||
|
"platforms": { |
||||
|
"cloud": { |
||||
|
"tcb": "y", |
||||
|
"aliyun": "y" |
||||
|
}, |
||||
|
"client": { |
||||
|
"Vue": { |
||||
|
"vue2": "y", |
||||
|
"vue3": "u" |
||||
|
}, |
||||
|
"App": { |
||||
|
"app-vue": "y", |
||||
|
"app-nvue": "u", |
||||
|
"app-uvue": "n" |
||||
|
}, |
||||
|
"H5-mobile": { |
||||
|
"Safari": "u", |
||||
|
"Android Browser": "u", |
||||
|
"微信浏览器(Android)": "y", |
||||
|
"QQ浏览器(Android)": "u" |
||||
|
}, |
||||
|
"H5-pc": { |
||||
|
"Chrome": "y", |
||||
|
"IE": "u", |
||||
|
"Edge": "y", |
||||
|
"Firefox": "u", |
||||
|
"Safari": "u" |
||||
|
}, |
||||
|
"小程序": { |
||||
|
"微信": "y", |
||||
|
"阿里": "u", |
||||
|
"百度": "u", |
||||
|
"字节跳动": "u", |
||||
|
"QQ": "u", |
||||
|
"钉钉": "u", |
||||
|
"快手": "u", |
||||
|
"飞书": "u", |
||||
|
"京东": "u" |
||||
|
}, |
||||
|
"快应用": { |
||||
|
"华为": "u", |
||||
|
"联盟": "u" |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
Loading…
Reference in new issue