12 changed files with 829 additions and 50 deletions
@ -0,0 +1,205 @@ |
|||
<template> |
|||
<view class="uni-numbox"> |
|||
<view @click="_calcValue('minus')" class="uni-numbox__minus uni-numbox-btns" :style="{ background }"> |
|||
<text class="uni-numbox--text" :class="{ 'uni-numbox--disabled': inputValue <= min || disabled }">-</text> |
|||
</view> |
|||
<input :disabled="disabled" @input="onKeyInput" @blur="_onBlur" class="uni-numbox__value" type="number" v-model="inputValue" /> |
|||
<view @click="_calcValue('plus')" class="uni-numbox__plus uni-numbox-btns" :style="{ background }"> |
|||
<text class="uni-numbox--text" :class="{ 'uni-numbox--disabled': inputValue >= max || disabled }">+</text> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
<script> |
|||
/** |
|||
* NumberBox 数字输入框 |
|||
* @description 带加减按钮的数字输入框 |
|||
* @tutorial https://ext.dcloud.net.cn/plugin?id=31 |
|||
* @property {Number} value 输入框当前值 |
|||
* @property {Number} min 最小值 |
|||
* @property {Number} max 最大值 |
|||
* @property {Number} step 每次点击改变的间隔大小 |
|||
* @property {String} background 背景色 |
|||
* @property {Boolean} disabled = [true|false] 是否为禁用状态 |
|||
* @event {Function} change 输入框值改变时触发的事件，参数为输入框当前的 value |
|||
*/ |
|||
|
|||
export default { |
|||
name: 'UniNumberBox', |
|||
emits: ['change'], |
|||
props: { |
|||
value: { |
|||
type: [Number, String], |
|||
default: 1 |
|||
}, |
|||
min: { |
|||
type: Number, |
|||
default: 0 |
|||
}, |
|||
max: { |
|||
type: Number, |
|||
default: 100 |
|||
}, |
|||
step: { |
|||
type: Number, |
|||
default: 1 |
|||
}, |
|||
background: { |
|||
type: String, |
|||
default: '#f5f5f5' |
|||
}, |
|||
disabled: { |
|||
type: Boolean, |
|||
default: false |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
inputValue: 0 |
|||
} |
|||
}, |
|||
watch: { |
|||
inputValue(newVal, oldVal) { |
|||
if (+newVal !== +oldVal) { |
|||
this.$emit('change', newVal) |
|||
} |
|||
} |
|||
}, |
|||
created() { |
|||
this.inputValue = +this.value |
|||
}, |
|||
methods: { |
|||
// 输入框实时获取输入内容 |
|||
onKeyInput(event) { |
|||
// this.value = event.target.value; |
|||
}, |
|||
// 加、减操作(minus:减;plus:加) |
|||
_calcValue(type) { |
|||
if (this.disabled) { |
|||
return |
|||
} |
|||
const scale = this._getDecimalScale() |
|||
let value = this.inputValue * scale |
|||
const step = this.step * scale |
|||
if (type === 'minus') { |
|||
value -= step |
|||
if (value < this.min * scale) { |
|||
return |
|||
} |
|||
if (value > this.max * scale) { |
|||
value = this.max * scale |
|||
} |
|||
} else if (type === 'plus') { |
|||
value += step |
|||
if (value > this.max * scale) { |
|||
return |
|||
} |
|||
if (value < this.min * scale) { |
|||
value = this.min * scale |
|||
} |
|||
} |
|||
if (`${value}`.length > 5) { |
|||
value = value.toFixed(6) // toFixed保留小数点位数方法 |
|||
} |
|||
this.inputValue = String(value / scale) |
|||
}, |
|||
_getDecimalScale() { |
|||
let scale = 1 |
|||
// 浮点型 |
|||
if (~~this.step !== this.step) { |
|||
scale = 10 ** `${this.step}`.split('.')[1].length |
|||
} |
|||
return scale |
|||
}, |
|||
_onBlur(event) { |
|||
let { value } = event.detail |
|||
if (!value) { |
|||
return |
|||
} |
|||
value = +value |
|||
if (value > this.max) { |
|||
value = this.max |
|||
} else if (value < this.min) { |
|||
value = this.min |
|||
} |
|||
this.inputValue = value |
|||
/* 小数点后保留四位 */ |
|||
if (value > 0) { |
|||
event.detail.value = parseFloat(event.detail.value).toFixed(6) |
|||
} else { |
|||
event.detail.value = -parseFloat(event.detail.value).toFixed(6) |
|||
} |
|||
// 重新赋值给input |
|||
this.$nextTick(() => { |
|||
this.inputValue = event.detail.value |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
$box-height: 26px; |
|||
$bg: #f5f5f5; |
|||
$br: 2px; |
|||
$color: #333; |
|||
|
|||
.uni-numbox { |
|||
/* #ifndef APP-NVUE */ |
|||
display: flex; |
|||
/* #endif */ |
|||
flex-direction: row; |
|||
} |
|||
|
|||
.uni-numbox-btns { |
|||
/* #ifndef APP-NVUE */ |
|||
display: flex; |
|||
/* #endif */ |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: center; |
|||
padding: 0 8px; |
|||
background-color: $bg; |
|||
/* #ifdef H5 */ |
|||
cursor: pointer; |
|||
/* #endif */ |
|||
} |
|||
|
|||
.uni-numbox__value { |
|||
margin: 0 2px; |
|||
background-color: $bg; |
|||
width: 100px; |
|||
height: $box-height; |
|||
text-align: center; |
|||
font-size: 14px; |
|||
border-left-width: 0; |
|||
border-right-width: 0; |
|||
color: $color; |
|||
} |
|||
|
|||
.uni-numbox__minus { |
|||
border-top-left-radius: $br; |
|||
border-bottom-left-radius: $br; |
|||
width: 64rpx; |
|||
} |
|||
|
|||
.uni-numbox__plus { |
|||
border-top-right-radius: $br; |
|||
border-bottom-right-radius: $br; |
|||
width: 64rpx; |
|||
} |
|||
|
|||
.uni-numbox--text { |
|||
// fix nvue |
|||
line-height: 20px; |
|||
|
|||
font-size: 20px; |
|||
font-weight: 300; |
|||
color: $color; |
|||
} |
|||
|
|||
.uni-numbox .uni-numbox--disabled { |
|||
color: #c0c0c0 !important; |
|||
/* #ifdef H5 */ |
|||
cursor: not-allowed; |
|||
/* #endif */ |
|||
} |
|||
</style> |
|||
@ -0,0 +1,369 @@ |
|||
<template> |
|||
<view class=""> |
|||
<uni-popup ref="popup" :maskClick="false"> |
|||
<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="closeRequestPopup()"></image> |
|||
</view> |
|||
<view class="split_line"></view> |
|||
<view class="uni-flex uni-column" style="background-color: white"> |
|||
<view class="uni-flex uni-column"> |
|||
<view class="uni-flex uni-row padding title u-col-center" style="width: 100%"> |
|||
<view class="" style="width: 25%"> |
|||
<text>生产线：</text> |
|||
</view> |
|||
|
|||
<view class=""> |
|||
<uni-combox :candidates="productLineList" v-model="productLineCode" placeholder="请扫描来源库位" @confirm="handleConfirm" style="height: 30rpx; border: 1px solid #fff"></uni-combox> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="split_line"></view> |
|||
|
|||
<view class="title padding" style="display: flex"> |
|||
<text style="flex-shrink: 0">物料：</text> |
|||
<view class="" style="width: 100%"> |
|||
{{ itemCode }} |
|||
</view> |
|||
<view class=""> |
|||
<image src="/static/search.svg" mode="" style="width: 40rpx; height: 40rpx; margin-left: 20rpx" @click="itemCodeClick"> </image> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="split_line"></view> |
|||
<view class="uni-flex uni-row padding title u-col-center"> |
|||
<text>数量： </text> |
|||
<view class="uni-flex uni-row uni-center" style="display: flex; align-items: center; margin-left: 20rpx; justify-content: center"> |
|||
<input style="text-align: center" class="qty_input" v-model="counQty" type="number" @confirm="confirm()" :focus="numberFocus" @input="checkNum" :maxlength="maxlength" /> |
|||
|
|||
<uom :uom="uom"></uom> |
|||
<view class="" v-if="stdPackInfo != undefined" style="display: flex; flex-direction: row; margin-left: 10rpx"> (<packQty :dataContent="stdPackInfo"></packQty>) </view> |
|||
</view> |
|||
</view> |
|||
<view class="split_line"></view> |
|||
</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 class="btn_edit_big_confirm" hover-class="btn_edit_big_after" @click="confirm()">确认</button> |
|||
</view> |
|||
</view> |
|||
</uni-popup> |
|||
<win-scan-item ref="scanPopup" title="物料代码" @getScanResult="getItemScanResult" :itemCodeTypeList="itemCodeTypeList"> </win-scan-item> |
|||
<comMessage ref="comMessage"></comMessage> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { getBasicItemByCode, getProductionlineItem, getWorkShopLineStation, getWarehouseCodeList } from '@/api/request2.js' |
|||
import { getLocationTypeName, getListLocationTypeDesc, checkDirectoryItemExist } from '@/common/directory.js' |
|||
import uom from '@/mycomponents/qty/uom.vue' |
|||
import packQty from '@/mycomponents/qty/packQty.vue' |
|||
import balanceStatus from '@/mycomponents/status/balanceStatus.vue' |
|||
import winScanItem from '@/mycomponents/scan/winScanItem.vue' |
|||
|
|||
export default { |
|||
components: { |
|||
uom, |
|||
balanceStatus, |
|||
winScanItem, |
|||
packQty |
|||
}, |
|||
data() { |
|||
return { |
|||
workshopCode: '', // 车间 |
|||
workShopName: '', |
|||
productionLineCode: '', // 生产线 |
|||
productionLineName: '', |
|||
workStationCode: '', // 工位 |
|||
workStationName: '', |
|||
itemCode: '请扫描物料信息', |
|||
fromWarehouseCode: '请选择仓库代码', |
|||
itemName: '', |
|||
qty: 0, |
|||
rawLocationCode: '', |
|||
fgLocationCode: '', |
|||
itemCodeFocus: false, |
|||
requestInfo: null, |
|||
itemCodeList: [], |
|||
counQty: undefined, |
|||
editPosition: true, |
|||
numberFocus: false, |
|||
uom: '', |
|||
positionInfo: '请选择位置', |
|||
show: false, |
|||
isModifiedPosition: true, |
|||
positionList: [], |
|||
stdQty: 0, // 标包 |
|||
maxlength: 10, |
|||
stdPackInfo: undefined, |
|||
wareHouseList: [], |
|||
showWareHouse: false, |
|||
productLineList: [], |
|||
productLineCode: '' |
|||
} |
|||
}, |
|||
props: { |
|||
title: { |
|||
type: String, |
|||
default: '完工信息' |
|||
}, |
|||
itemCodeTypeList: { |
|||
type: Array, |
|||
default: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
checkNum(e) { |
|||
const { value } = e.detail |
|||
const dot = value.indexOf('.') // 包含小数点 |
|||
const reg = /^[0-9]+$/ // 正整数 |
|||
if (dot > -1) { |
|||
this.maxlength = dot + 7 // 长度是小数点后两位 |
|||
if (value.length > dot + 7) { |
|||
} |
|||
} |
|||
if (reg.test(value)) { |
|||
// 如果是正整数不包含小数点 |
|||
this.maxlength = 10 |
|||
} |
|||
this.change(value) |
|||
}, |
|||
openRequestPopup(editPosition) { |
|||
if (this.positionList.length == 0) { |
|||
getWorkShopLineStation() |
|||
.then((res) => { |
|||
if (res.data != null && res.data.length > 0) { |
|||
this.positionList = res.data |
|||
} else { |
|||
this.showErrorMessage('未查找到位置信息') |
|||
} |
|||
}) |
|||
.catch((error) => { |
|||
this.showErrorMessage(error) |
|||
}) |
|||
} |
|||
|
|||
this.editPosition = editPosition |
|||
if (this.isModifiedPosition) { |
|||
this.isModifiedPosition = false |
|||
} else { |
|||
this.itemCode = '请扫描物料信息' |
|||
this.show = false |
|||
this.showWareHouse = false |
|||
this.uom = '' |
|||
this.qty = 0 |
|||
this.stdPackInfo = undefined |
|||
this.counQty = undefined |
|||
this.numberFocus = false |
|||
this.itemCodeGetFocus() |
|||
} |
|||
|
|||
setTimeout((res) => { |
|||
this.$refs.popup.open('bottom') |
|||
}, 500) |
|||
}, |
|||
initData() { |
|||
this.positionList = [] |
|||
;(this.wareHouseList = []), (this.showWareHouse = false) |
|||
this.editPosition = true |
|||
this.itemCode = '请扫描物料信息' |
|||
this.rawLocationCode = '' |
|||
this.positionInfo = '请选择位置' |
|||
this.fromWarehouseCode = '请选择仓库代码' |
|||
this.workshopCode = '' // 车间 |
|||
this.workShopName = '' |
|||
this.productionLineCode = '' // 生产线 |
|||
this.productionLineName = '' |
|||
this.workStationCode = '' // 工位 |
|||
this.workStationName = '' |
|||
this.show = false |
|||
this.uom = '' |
|||
this.qty = 0 |
|||
this.stdPackInfo = undefined |
|||
this.counQty = undefined |
|||
this.numberFocus = false |
|||
}, |
|||
|
|||
closeRequestPopup() { |
|||
this.$refs.popup.close() |
|||
}, |
|||
locationConfirm() { |
|||
// 查询库位信息 |
|||
this.checkLocatioCode() |
|||
}, |
|||
itemCodeClick() { |
|||
this.$refs.scanPopup.openScanPopup() |
|||
}, |
|||
|
|||
itemCodeGetFocus() { |
|||
this.itemCodeFocus = true |
|||
}, |
|||
itemCodeLoseFocus() { |
|||
this.itemCodeFocus = false |
|||
}, |
|||
|
|||
confirm() { |
|||
if (this.positionInfo == '请选择位置') { |
|||
this.showErrorMessage('请选择位置') |
|||
return |
|||
} |
|||
|
|||
if (this.fromWarehouseCode == '请选择仓库代码') { |
|||
this.showErrorMessage('请选择仓库代码') |
|||
return |
|||
} |
|||
|
|||
if (this.itemCode == '请扫描物料信息') { |
|||
this.showErrorMessage('请输入物料', 'itemCode') |
|||
return |
|||
} |
|||
if (this.counQty == undefined) { |
|||
this.showErrorMessage('请输入数量') |
|||
return |
|||
} |
|||
|
|||
if (this.qty == 0) { |
|||
this.showErrorMessage('数量必须大于0') |
|||
return |
|||
} |
|||
|
|||
if (this.rawLocationCode == '') { |
|||
this.showErrorMessage(`${this.workStationName}的原材料库位为空`) |
|||
return |
|||
} |
|||
this.callback('add') |
|||
}, |
|||
|
|||
callback(action) { |
|||
const item = { |
|||
positionInfo: this.positionInfo, |
|||
workshopCode: this.workshopCode, // 车间 |
|||
workShopName: this.workShopName, |
|||
productionLineCode: this.productionLineCode, // 生产线 |
|||
productionLineName: this.productionLineName, |
|||
workStationCode: this.workStationCode, // 工位 |
|||
workStationName: this.workStationName, |
|||
rawLocationCode: this.rawLocationCode, |
|||
fgLocationCode: this.fgLocationCode, |
|||
fromWarehouseCode: this.fromWarehouseCode, |
|||
toWarehouseCode: this.fromWarehouseCode, |
|||
itemCode: this.itemCode, |
|||
itemName: this.itemName, |
|||
uom: this.uom, |
|||
qty: this.qty |
|||
} |
|||
this.closeRequestPopup() |
|||
this.$emit('confirm', action, item) |
|||
}, |
|||
|
|||
showErrorMessage(message, type) { |
|||
setTimeout((r) => { |
|||
this.$refs.comMessage.showErrorMessage(message, (res) => { |
|||
if (type == 'itemCode') { |
|||
this.itemCodeGetFocus() |
|||
} else { |
|||
this.numberFocus = true |
|||
} |
|||
}) |
|||
if (type == 'itemCode') { |
|||
this.itemCode = '请扫描物料信息' |
|||
} |
|||
}) |
|||
}, |
|||
change(value) { |
|||
this.qty = value |
|||
}, |
|||
cancel(e) { |
|||
this.closeRequestPopup() |
|||
}, |
|||
showSelect() { |
|||
if (this.editPosition) { |
|||
this.show = true |
|||
} |
|||
}, |
|||
|
|||
showWarseHouseSelect() { |
|||
if (this.editPosition) { |
|||
this.wareHouseClick() |
|||
} |
|||
}, |
|||
|
|||
confirmSelect(e) { |
|||
this.positionInfo = `${e[0].label}-${e[1].label}-${e[2].label}` |
|||
console.log('位置', this.positionInfo) |
|||
this.workshopCode = e[0].value |
|||
this.productionLineCode = e[1].value |
|||
this.workStationCode = e[2].value |
|||
this.workShopName = e[0].label |
|||
this.productionLineName = e[1].label |
|||
this.workStationName = e[2].label |
|||
|
|||
const shop = this.positionList.find((shop) => shop.value == this.workshopCode) |
|||
if (shop != undefined && shop.children != undefined) { |
|||
const prodLine = shop.children.find((line) => line.value == this.productionLineCode) |
|||
if (prodLine != undefined && prodLine.children != undefined) { |
|||
const station = prodLine.children.find((r) => r.value == this.workStationCode) |
|||
if (station.rawLocationCode == '' && station.rawLocationCode == null) { |
|||
this.showErrorMessage(`${this.workStationName}的原材料库位为空,请重新选择`) |
|||
} else { |
|||
this.rawLocationCode = station.rawLocationCode |
|||
this.fgLocationCode = station.fgLocationCode |
|||
} |
|||
} else { |
|||
this.showErrorMessage('生产线-工位基础信息维护错误') |
|||
} |
|||
} else { |
|||
this.showErrorMessage('车间-生产线基础信息维护错误') |
|||
} |
|||
}, |
|||
|
|||
getItemScanResult(code, scanResult) { |
|||
this.itemCode = code |
|||
this.itemName = scanResult.name |
|||
this.uom = scanResult.uom |
|||
this.stdPackInfo = scanResult.package |
|||
this.numberFocus = true |
|||
}, |
|||
wareHouseClick() { |
|||
uni.showLoading({ |
|||
title: '查询中....', |
|||
mask: true |
|||
}) |
|||
getWarehouseCodeList(1, 100) |
|||
.then((res) => { |
|||
uni.hideLoading() |
|||
if (res.data != null && res.data.list.length > 0) { |
|||
res.data.list.forEach((item) => { |
|||
item.value = item.code |
|||
item.label = item.name |
|||
}) |
|||
this.wareHouseList = res.data.list |
|||
this.showWareHouse = true |
|||
} else { |
|||
this.showErrorMessage('未查找到仓库代码') |
|||
} |
|||
}) |
|||
.catch((error) => { |
|||
uni.hideLoading() |
|||
this.showErrorMessage(error) |
|||
}) |
|||
}, |
|||
|
|||
confirmWareHouse(e) { |
|||
this.fromWarehouseCode = e[0].value |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.title { |
|||
font-size: 30rpx; |
|||
} |
|||
</style> |
|||
@ -1,14 +1,22 @@ |
|||
<template> |
|||
<view class=""> |
|||
<com-blank-view @goScan="openFg" v-if="detailSource.length == 0"></com-blank-view> |
|||
<view class=""> |
|||
<com-blank-view @goScan="openFg" v-if="detailSource.length == 0"></com-blank-view> |
|||
</view> |
|||
<comReceiptPopup ref="comReceiptPopupRef" @confirm="requestConfirm"></comReceiptPopup> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { ref, onMounted, nextTick, watch, getCurrentInstance } from 'vue' |
|||
import comBlankView from '@/mycomponents/common/comBlankView.vue' |
|||
import comReceiptPopup from '@/pages/fg/coms/comReceiptPopup.vue' |
|||
|
|||
const detailSource = ref([]) |
|||
const comReceiptPopupRef = ref() |
|||
const openFg = () => { |
|||
comReceiptPopupRef.value.openRequestPopup('') |
|||
} |
|||
</script> |
|||
|
|||
<style></style> |
|||
|
|||
@ -0,0 +1,28 @@ |
|||
<template> |
|||
<view class="page-wraper"> |
|||
<comMoveJob :title="title" ref="comMoveJobRef" businessTypeCode="NokToHold"> </comMoveJob> |
|||
</view> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import { ref, onLoad, onPullDownRefresh, onNavigationBarButtonTap } from 'vue' |
|||
import comMoveJob from '@/pages/inventoryMove/coms/comMoveJob.vue' |
|||
|
|||
const title = ref('') |
|||
const comMoveJobRef = ref() |
|||
onLoad((option) => { |
|||
title.value = option.title |
|||
}) |
|||
|
|||
onPullDownRefresh(() => { |
|||
comMoveJobRef.value.refresh() |
|||
}) |
|||
|
|||
onNavigationBarButtonTap((e) => { |
|||
if (e.index === 0) { |
|||
comMoveJobRef.value.toHome() |
|||
} else if (e.index == 1) { |
|||
comMoveJobRef.value.openFilter() |
|||
} |
|||
}) |
|||
</script> |
|||
@ -0,0 +1,132 @@ |
|||
# wz-select-popup |
|||
|
|||
## 示例 |
|||
|
|||
```vue |
|||
<template> |
|||
<view> |
|||
<view class="" style="margin-bottom: 16px;"> |
|||
<view style="margin-bottom: 8px;">names:{{userForm.names}}</view> |
|||
<view style="margin-bottom: 8px;">values:{{userForm.values}}</view> |
|||
<view style="margin-bottom: 8px;">origin:{{userForm.origin}}</view> |
|||
</view> |
|||
<button @click="open">打开</button> |
|||
<wz-select-popup ref="wzSelectPopup" @select="selectCheckbox" /> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
simulationReqGetList, |
|||
getDataList |
|||
} from "@/common/mock.js" |
|||
export default { |
|||
data() { |
|||
return { |
|||
userForm: { |
|||
names: [], |
|||
values: [], |
|||
origin:[] |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
open() { |
|||
this.$refs.wzSelectPopup.open({ |
|||
mode: 'checkbox', //radio checkbox 单选、多选 |
|||
// dataList:[], //如果dataList传入了数组则直接使用传入的数组渲染，无需再配置proxyConfig |
|||
selected: this.userForm.values, //已选中的数据 |
|||
proxyConfig: { //组件内部代理请求数据配置 |
|||
reqFun: this.reqGetList, //请求方法,在方法中请返回Promise.resolve([]) |
|||
localPaging: false //前端本地分页 |
|||
}, |
|||
search: { |
|||
type: 'local', //local本地数据搜索 | remote请求接口 |
|||
}, |
|||
fields: { |
|||
label: 'name', |
|||
value: 'code' |
|||
} |
|||
}) |
|||
}, |
|||
selectCheckbox(mode, data) { |
|||
console.log(mode, data) |
|||
this.userForm.names = data.names |
|||
this.userForm.values = data.values |
|||
this.userForm.origin = data.origin |
|||
}, |
|||
reqGetList(data) { |
|||
return simulationReqGetList({ |
|||
pageIndex: data.pageIndex, |
|||
pageSize: data.pageSize, |
|||
name: data.searchValue |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
``` |
|||
|
|||
## 属性props |
|||
|
|||
| 属性 | 类型 | 默认值 | 说明 | |
|||
| ------- | ------ | ------ | ------------------------------------------------------------ | |
|||
| scrollH | String | 50vh | 滚动内容的高度，不包含搜索框和多选时的底部按钮栏。需要带单位 | |
|||
|
|||
|
|||
## 方法methods |
|||
|
|||
| 方法名 | 说明 | 参数 | |
|||
| ------ | -------- | ----------------------------- | |
|||
| open | 打开弹窗 | [configs](#open方法的configs) | |
|||
| close | 关闭弹窗 | | |
|||
|
|||
### open方法的configs |
|||
|
|||
| 参数名 | 说明 | 类型 | 默认值 | |
|||
| ----------- | ------------------------------------------------------------ | ------------- | -------------------------- | |
|||
| mode | 选择模式radio单选 ，checkbox多选 | String | radio | |
|||
| selected | 已选中的value, 单选传字符串，多选传数组 | String\|Array | [] | |
|||
| dataList | 传入了数组，则直接使用传入的数组渲染，无需再配置proxyConfig | Array | null | |
|||
| proxyConfig | 组件内部代理请求数据配置 | Object | [proxyConfig](#proxyConfig的属性) | |
|||
| search | 搜索配置 | Object | [search](#search的属性) | |
|||
| page | 分页配置，如果是组件内部代理请求会把page的值加入到proxyConfig.reqFun请求参数里 | Object | [page](#page的属性) | |
|||
| fields | 显示和取值的label,value | Object | [fields](#fields的属性) | |
|||
|
|||
#### proxyConfig的属性 |
|||
|
|||
| 参数名 | 说明 | 类型 | 默认值 | 返回值 | |
|||
| ----------- | --------------------------------------------------------- | ------- | ------------------- | --------------------------------------- | |
|||
| reqFun | 向服务器请求数据的Promise方法,会返回页码以及搜索框的value | Promise | Promise.resolve([]) | ({pageIndex, pageSize,searchValue})=>{} | |
|||
| localPaging | 是否本地分页 | Boolean | false | | |
|||
|
|||
#### search的属性 |
|||
|
|||
| 参数名 | 说明 | 类型 | 默认值 | |
|||
| ------ | ------------------------------------------------------------ | ------ | ------ | |
|||
| type | 搜索的类型,local本地搜索, remote向服务器请求。只有使用proxyConfig.reqFun请求才能配置为remote | String | local | |
|||
|
|||
#### page的属性 |
|||
|
|||
| 参数名 | 说明 | 类型 | 默认值 | |
|||
| --------- | ------ | ------ | ------ | |
|||
| pageIndex | 当前页 | Number | 1 | |
|||
| pageSize | 页大小 | Number | 20 | |
|||
|
|||
#### fields的属性 |
|||
|
|||
| 参数名 | 说明 | 类型 | 默认值 | |
|||
| ------ | ------------ | ------ | ------ | |
|||
| label | 显示的字段名 | String | name | |
|||
| value | 取值的字段名 | String | code | |
|||
|
|||
## 事件enevt |
|||
|
|||
| 名称 | 触发时机 | 返回值 | |
|||
| ------ | ------------------------------------------ | ------------------------------------------------------------ | |
|||
| select | 单选点击列表时触发，多选点击确定按钮时触发 | mode等于radio时：(mode, {check,name,code})=>{}<br/>mode等于checkbox时：(mode, {names,values,origin})=>{} | |
|||
| close | popup关闭 | void | |
|||
Loading…
Reference in new issue