Compare commits
No commits in common. '31c8d8e5746567970706eddd5dda723e319730ab' and 'a068365acf484caf9452d32d8799cfa54c0684f8' have entirely different histories.
31c8d8e574
...
a068365acf
@ -1,354 +0,0 @@
|
|||||||
<template>
|
|
||||||
|
|
||||||
<u-popup
|
|
||||||
id="popup-content"
|
|
||||||
v-model="showPopup"
|
|
||||||
mode="center"
|
|
||||||
:mask-close-able="false"
|
|
||||||
width="700rpx"
|
|
||||||
height="90%"
|
|
||||||
borderRadius="12rpx"
|
|
||||||
>
|
|
||||||
<view class="page-product-receipt">
|
|
||||||
|
|
||||||
<u-form id="queryFrom" style="margin-top: -40px;" class="queryFrom" ref="form" label-width="180rpx">
|
|
||||||
<u-form-item label="备件类型" label-width="23vw">
|
|
||||||
<jPicker sureColor="#ff0000" @bindpicker="changSpareType" showKey="dictLabel" valKey="dictLabel" :val="query.spareType" :options="spareTypeList" :clearable="true"/>
|
|
||||||
</u-form-item>
|
|
||||||
<u-form-item label="备件品类" label-width="23vw">
|
|
||||||
<jPicker sureColor="#ff0000" @bindpicker="changSpareCategory" showKey="dictLabel" valKey="dictLabel" :val="query.spareCategory" :options="spareCategoryList" :clearable="true" />
|
|
||||||
</u-form-item>
|
|
||||||
<u-form-item label="备件号/名称" label-width="23vw">
|
|
||||||
<u-search placeholder="请输入备件号/名称" :focus="true" :show-action="false" v-model="query.materialCode" @search="getList"></u-search>
|
|
||||||
</u-form-item>
|
|
||||||
</u-form>
|
|
||||||
<scroll-view id="list" scroll-y="true" :style="{ height: listHeight + 'px' }" :lower-threshold="50" @touchmove.stop>
|
|
||||||
<!-- 列表 -->
|
|
||||||
<u-form class="list">
|
|
||||||
<view v-if="list.length > 0">
|
|
||||||
<view class="list-item" v-for="(item, index) in list" :key="index" :class="{ active: spareItem && item.materialCode === spareItem.materialCode }" @click="selectItem(item)">
|
|
||||||
<lj-list-row label="备件编码:" :value="item.materialCode" />
|
|
||||||
<lj-list-row label="备件名称:" :value="item.materialDesc" />
|
|
||||||
<lj-list-row label="单价:" :value="item.unitPrice || 0" />
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view v-else> 暂无数据 </view>
|
|
||||||
</u-form>
|
|
||||||
</scroll-view>
|
|
||||||
|
|
||||||
<!-- 底部按钮区 -->
|
|
||||||
<view class="popup-footer" id="footer" ref="footer">
|
|
||||||
<u-button
|
|
||||||
@click="closePopup"
|
|
||||||
type="default"
|
|
||||||
class="footer-btn cancel-btn"
|
|
||||||
:style="{width: '160rpx'}"
|
|
||||||
>
|
|
||||||
取消
|
|
||||||
</u-button>
|
|
||||||
<u-button
|
|
||||||
type="primary"
|
|
||||||
class="footer-btn confirm-btn"
|
|
||||||
:style="{width: '160rpx'}"
|
|
||||||
@click="confirm"
|
|
||||||
>
|
|
||||||
确认
|
|
||||||
</u-button>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</u-popup>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import JPicker from "@/components/J-Picker/jPicker.vue";
|
|
||||||
import LjListRow from "@/components/lanju/lj-list-row/index.vue";
|
|
||||||
import {getDict, getSparePartsList} from "@/components/lanju/lj-choose-spare/model";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'SpareSelectPopup',
|
|
||||||
components: {LjListRow, JPicker},
|
|
||||||
props: {
|
|
||||||
show: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
listHeight:400,
|
|
||||||
showPopup: false,
|
|
||||||
spareItem: null,
|
|
||||||
query:{
|
|
||||||
pageSize:9999,
|
|
||||||
spareType:undefined,
|
|
||||||
spareCategory:undefined,
|
|
||||||
materialCode:undefined,
|
|
||||||
},
|
|
||||||
list:[],
|
|
||||||
spareTypeList:[],
|
|
||||||
spareCategoryList:[],
|
|
||||||
spareCategoryObj:{}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
show(newVal) {
|
|
||||||
this.showPopup = newVal;
|
|
||||||
this.resetListHeight();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
getList(){
|
|
||||||
getSparePartsList(this.query).then(res=>{
|
|
||||||
this.list = res.rows
|
|
||||||
})
|
|
||||||
},
|
|
||||||
changSpareType(type){
|
|
||||||
this.query.spareType = type.pickerName.dictValue
|
|
||||||
this.spareCategoryList = this.spareCategoryObj[type.pickerName.dictValue]
|
|
||||||
this.getList()
|
|
||||||
},
|
|
||||||
changSpareCategory(type){
|
|
||||||
this.query.spareCategory = type.pickerName.dictValue
|
|
||||||
this.getList()
|
|
||||||
},
|
|
||||||
selectItem(item){
|
|
||||||
item.spareQuantity = 1
|
|
||||||
this.spareItem = item
|
|
||||||
},
|
|
||||||
closePopup() {
|
|
||||||
this.query.spareType = undefined
|
|
||||||
this.query.spareCategory = undefined
|
|
||||||
this.spareItem = undefined
|
|
||||||
this.$emit('close');
|
|
||||||
},
|
|
||||||
confirm(){
|
|
||||||
if (this.spareItem){
|
|
||||||
this.$emit('confirm',this.spareItem);
|
|
||||||
}else {
|
|
||||||
uni.showToast({
|
|
||||||
title: '请选择数据！',
|
|
||||||
icon: 'none'
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
},
|
|
||||||
resetListHeight(){
|
|
||||||
this.$nextTick(() => {
|
|
||||||
let footer = 0;
|
|
||||||
let buttonHeight = 0
|
|
||||||
//获取底部按钮信息
|
|
||||||
const query = uni.createSelectorQuery().in(this);
|
|
||||||
query
|
|
||||||
.select('#popup-content')
|
|
||||||
.boundingClientRect((data) => {
|
|
||||||
if (data){
|
|
||||||
footer = data.height;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.exec();
|
|
||||||
|
|
||||||
query
|
|
||||||
.select('#footer')
|
|
||||||
.boundingClientRect((data) => {
|
|
||||||
//获取列表到顶部距离
|
|
||||||
if (data){
|
|
||||||
|
|
||||||
buttonHeight = data.height * 2;
|
|
||||||
}
|
|
||||||
|
|
||||||
})
|
|
||||||
.exec();
|
|
||||||
|
|
||||||
//获取列表信息
|
|
||||||
query
|
|
||||||
.select('#list')
|
|
||||||
.boundingClientRect((data) => {
|
|
||||||
//获取列表到顶部距离
|
|
||||||
if (data){
|
|
||||||
const listTop = data.top;
|
|
||||||
console.log(footer)
|
|
||||||
console.log(listTop)
|
|
||||||
console.log(buttonHeight)
|
|
||||||
this.listHeight = footer - listTop - buttonHeight - 10;
|
|
||||||
}
|
|
||||||
|
|
||||||
})
|
|
||||||
.exec();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
initPickerOptions () {
|
|
||||||
getDict("spare_part_type").then(async res => {
|
|
||||||
this.spareTypeList = res.data
|
|
||||||
|
|
||||||
for (const item of this.spareTypeList) {
|
|
||||||
await getDict(item.dictValue).then(res => {
|
|
||||||
this.spareCategoryObj[item.dictValue] = res.data
|
|
||||||
})
|
|
||||||
}
|
|
||||||
for (const key in this.spareCategoryObj){
|
|
||||||
this.spareCategoryList = this.spareCategoryList.concat(this.spareCategoryObj[key]);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.getList()
|
|
||||||
this.resetListHeight()
|
|
||||||
this.initPickerOptions()
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
|
|
||||||
.list {
|
|
||||||
background-color: #fff;
|
|
||||||
margin-top: 20rpx;
|
|
||||||
padding: 20rpx 20rpx 25rpx;
|
|
||||||
border-radius: 10rpx;
|
|
||||||
box-shadow: 0 0 20rpx 0 rgba(128, 128, 128, 0.2);
|
|
||||||
color: #8d8989;
|
|
||||||
|
|
||||||
.list-item {
|
|
||||||
padding: 20rpx;
|
|
||||||
margin-bottom: 10rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.list-item.active {
|
|
||||||
box-shadow: 0 0 0 3px #0c7bf3;
|
|
||||||
}
|
|
||||||
|
|
||||||
.righttitle {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
|
|
||||||
.boder-icon-rigth {
|
|
||||||
font-size: 30rpx;
|
|
||||||
border-radius: 5px;
|
|
||||||
border: 1rpx solid #fa3534;
|
|
||||||
text-align: center;
|
|
||||||
background: #fa3534;
|
|
||||||
color: #ffffff;
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* 奇数行背景色 */
|
|
||||||
.list-item:nth-child(odd) {
|
|
||||||
background-color: #ffffff;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 偶数行背景色 */
|
|
||||||
.list-item:nth-child(even) {
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.popup-content {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-scroll {
|
|
||||||
border-radius: 8rpx;
|
|
||||||
background-color: #fafafa;
|
|
||||||
margin-bottom: 30rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-header {
|
|
||||||
display: flex;
|
|
||||||
background-color: #e8f4f8;
|
|
||||||
border-radius: 8rpx 8rpx 0 0;
|
|
||||||
height: 80rpx;
|
|
||||||
line-height: 80rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-th {
|
|
||||||
text-align: center;
|
|
||||||
font-size: 28rpx;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-body {
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-tr {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
height: 100rpx;
|
|
||||||
border-bottom: 1rpx solid #f5f5f5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-td {
|
|
||||||
padding: 0 20rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
text-align: center;
|
|
||||||
border: 1rpx solid #e5e5e5;
|
|
||||||
line-height: 75rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-item {
|
|
||||||
width: 100%;
|
|
||||||
border-radius: 8rpx;
|
|
||||||
border: 1rpx solid #e5e5e5;
|
|
||||||
padding: 0 16rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
.delete-icon {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.add-row {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
height: 100rpx;
|
|
||||||
background-color: #fafafa;
|
|
||||||
border-radius: 0 0 8rpx 8rpx;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.add-text {
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #8c8c8c;
|
|
||||||
margin-left: 16rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.popup-footer {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 40rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.footer-btn {
|
|
||||||
height: 80rpx;
|
|
||||||
line-height: 80rpx;
|
|
||||||
border-radius: 40rpx;
|
|
||||||
font-size: 32rpx;
|
|
||||||
margin-top: 20rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cancel-btn {
|
|
||||||
border: 1rpx solid #e5e5e5;
|
|
||||||
color: #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
.confirm-btn {
|
|
||||||
background-color: #1989fa;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,12 +0,0 @@
|
|||||||
import http from "@/utils/request";
|
|
||||||
import {url} from "@/utils/url";
|
|
||||||
|
|
||||||
export function getSparePartsList(data: any): Promise<any> {
|
|
||||||
return http.get(url.lanjuequipment.product.Repair.list, {
|
|
||||||
params: data,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getDict(type: any): Promise<any> {
|
|
||||||
return http.get(url.wmspda.system.dict+'/'+type, );
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue