yxk_h5_master/pages/fqbg/child.vue

718 lines
20 KiB
Vue
Raw Permalink Normal View History

2025-08-28 15:21:09 +08:00
<template>
<view class="search-list-container" v-show="showsearch">
<view class="search-list-out">
<view class="search-container">
<view class="back_btn" @click="toBack"><uni-icons type="arrowleft" size="30" color="#999"></uni-icons>
</view>
<view class="search-title">添加/编辑报工</view>
<!-- <view class="search_btn1" @click="to_submit">确定</view> -->
<view class="search_btn" @click="chooseItem">确定</view>
</view>
<!-- <view class="search-container2" style="height: 40px;"> -->
<!-- <view class="search-container2-flex">
<view class="search-input" style="width: 50%;">
<uni-icons color="#bbb" size="20" type="search" class="my-uni-icon-search"></uni-icons>
<input style="text" class="input-" placeholder="生箔卷号" v-model="sbjh" />
<uni-icons color="#bbb" size="20" type="close" class="my-uni-icon-close" v-if="sbjh.length > 0"
@click="clearInput"></uni-icons>
</view>
<view class="search-input" style="width: 50%;">
<uni-icons color="#bbb" size="20" type="search" class="my-uni-icon-search"></uni-icons>
<input style="text" class="input-" placeholder="克重" v-model="kz" />
<uni-icons color="#bbb" size="20" type="close" class="my-uni-icon-close" v-if="sbjh.length > 0"
@click="clearInput"></uni-icons>
</view> -->
<!-- <view class="searchSelectBox" style=" width: 50%;">
<view class="text" @click="showSinglePicker">{{ deptResult.name }}</view>
</view> -->
<!-- </view> -->
<!-- </view> -->
<mpvue-picker themeColor="#007AFF" style="z-index: 10001" ref="cjPicker" mode="selector" :deepLength="deepLength"
@onConfirm="pickerCjConfirm" :pickerValueArray="cjList"></mpvue-picker>
<view class="search-list" style="top: 50px">
<view class="panel flex-column">
<view class="flex-row">
<view class="flex-cell-single" @click="showSinglePicker">
<span style="width: 400rpx; padding-left: 0" class="redMi">后处理卷号</span>
<input class="iteminput InputRightMargin" disabled placeholder="请选择" :value="info.hcljh" />
<uni-icons type="arrowright" class="myarrowright" style="right: 20px"></uni-icons>
</view>
<!-- <view class="flex-cell-single" @click="selectPeople1(['czy', 'czyid'])">
<span style="width: 400rpx; padding-left: 0" class="redMi">操作员</span>
<input class="iteminput InputRightMargin" disabled placeholder="请输入" v-model="info.czy" />
</view> -->
<view class="flex-cell-single">
<span style="width: 400rpx; padding-left: 0">规格型号</span>
<input class="iteminput InputRightMargin" placeholder="自动带出" v-model="info.ggxh" />
</view>
<view class="flex-cell-single">
<span style="width: 400rpx; padding-left: 0">克重(g/):</span>
<input class="iteminput InputRightMargin" placeholder="自动带出" v-model="info.kz" />
</view>
<view class="flex-cell-single">
<span style="width: 400rpx; padding-left: 0">后处理卷重(kg):</span>
<input class="iteminput InputRightMargin" placeholder="自动带出" v-model="info.hcljz" />
</view>
<view class="flex-cell-single">
<span style="width: 400rpx; padding-left: 0">可用卷重(kg):</span>
<input class="iteminput InputRightMargin" placeholder="自动带出" v-model="info.kyjz" />
</view>
<view class="flex-cell-single">
<span style="width: 400rpx; padding-left: 0" class="redMi">成品净重(kg):</span>
<input class="iteminput InputRightMargin" placeholder="请输入" v-model="info.cpjz" />
</view>
<view class="flex-cell-single">
<span style="width: 400rpx; padding-left: 0">边角废料</span>
<input class="iteminput InputRightMargin" placeholder="请输入" v-model="info.bjfl" />
</view>
<view class="flex-cell-single">
<span style="width: 400rpx">异常废料</span>
<input class="iteminput InputRightMargin" placeholder="请输入" v-model="info.ycfl" />
</view>
<!-- <view class="flex-cell-single">
<span style="width: 460rpx">铜箔质量问题记录</span>
<input class="iteminput InputRightMargin" placeholder="请输入" v-model="info.tbzlwtjl" />
</view> -->
<view class="flex-cell-single">
<span style="width: 400rpx">备注</span>
<input class="iteminput InputRightMargin" placeholder="请输入" v-model="info.bz" />
</view>
<view class="flex-cell-single" v-if="showDanger">
<span style="width: 400rpx;color:red">请填写必填项</span>
</view>
<!-- <uni-icons type="checkbox-filled" size="20" :color="info.checked ? '#3699FF' : '#CECECE'"
class="checkbox-filled"></uni-icons> -->
</view>
</view>
<!-- <view class="toloadmore" v-show="show_toloadmore && !show_search_none && !loadingmore"
@click.stop="mysearchlist_">查看更多</view>
<view class="loading-container" v-if="loadingmore">加载中...</view>
<view class="search_none" v-show="show_search_none">搜索结果为空</view> -->
</view>
</view>
<lb-picker ref="picker" mode="multiSelector" :level="level" :pickerValueDefault="[0, 0]" @confirm="pickerConfirm"
:props="myProps" :list="deptArray"></lb-picker>
<!-- <view class="mysearchlist" style="z-index: 10001">
<chooseUserSingle ref="mysearchlist" :showsearch.sync="show_search_user1" :itemInfo_.sync="search_value_user1">
</chooseUserSingle>
</view> -->
<view class="mysearchlist" style="z-index: 10001">
<chooseHcljhSingle ref="mysearchlist" :showsearch.sync="show_search_hcl" :itemInfo_.sync="search_value_hcl">
</chooseHcljhSingle>
</view>
</view>
</template>
<script>
import LbPicker from "@/components/lb-picker";
import mpvuePicker from "@/components/mpvue-picker/mpvuePicker.vue"; //选择部门组件
import chooseUserSingle from "@/components/xinsoft-search-list/chooseUserSingle.vue";
import chooseHcljhSingle from "@/components/xinsoft-search-list/chooseHcljhSingle.vue";
// import uniIcons from '../../uni-icons/uni-icons.vue';
var searchListHeight, panelHeight, query;
// var requestTask;
// var requestTaskAbort = true;
var timeout = "";
export default {
mounted() {},
components: {
LbPicker,
// uniIcons,
mpvuePicker,
chooseUserSingle,
chooseHcljhSingle,
},
data() {
return {
showDanger:false,
show_search_hcl: false,
search_value_hcl: "",
index: null,
show_search_user1: false,
selFrom: "",
search_value_user1: "",
info: {},
deepLength: 1,
cjList: [],
list_: [],
list2_: [],
loadingmore: false,
lastpage: false, //是否加载完最后一页数据了
show_search_none: false,
show_toloadmore: false,
sbjh: "",
kz: "",
lastIndex: 0, //加载列表翻页数据时上一页的最后一个index
pagesize: 10, //每页显示多少条
pageno: 1, //第几页
dataList: [], //显示在页面的列表数据
level: 4,
myProps: {
label: "text",
value: "id",
children: "children",
},
deptArray: [],
deptResult: {
value: "",
name: "部门",
},
};
},
props: {
showsearch: {
type: Boolean,
},
itemInfo_: {},
singleRow: {
type: Array,
default: function () {
return [];
},
},
},
mounted() {
let _this = this;
//使用部门
this.$http
.request({
url: "/apis/dict/getDictsByType",
params: {
type: "bz",
},
})
.then((res) => {
if (res.statusCode == "200") {
var useType = res.data.datas;
for (let i = 0; i < useType.length; i++) {
var myVal = {
label: useType[i].name,
value: useType[i].id,
};
_this.cjList.push(myVal);
}
}
})
.catch((err) => {
console.log(err);
});
// var _this = this;
// //使用部门
// this.$http
// .request({
// url: '/apis/dept/tree',
// method: 'GET'
// })
// .then(res => {
// if (res.statusCode == '200') {
// var useType = res.data.data.children;
// let j = {
// label: '全部',
// value: '',
// children: [
// {
// label: '-',
// value: ''
// }
// ]
// };
// _this.deptArray.push(j);
// for (let i = 0; i < useType.length; i++) {
// var myVal = {
// label: useType[i].text,
// value: useType[i].id,
// children: [
// {
// label: '-',
// value: ''
// }
// ]
// };
// if (useType[i].children && useType[i].children.length > 0) {
// for (let j = 0; j < useType[i].children.length; j++) {
// var json = {
// label: useType[i].children[j].text,
// value: useType[i].children[j].id
// };
// myVal.children.push(json);
// }
// }
// _this.deptArray.push(myVal);
// }
// }
// })
// .catch(err => {});
},
watch: {
search_value_hcl(val) {
const { hcljh,id,ggxh,kz,hcljz,kyjz,} = val
this.info.hcljh = hcljh
this.info.hcljhid = id
this.info.ggxh = ggxh
this.info.kz = kz
this.info.hcljz = hcljz
this.info.kyjz = kyjz
this.info = { ...this.info };
},
search_value_user1(val) {
const { NAME, userId } = val;
this.info[this.selFrom[0]] = NAME;
this.info[this.selFrom[1]] = userId;
this.info = { ...this.info };
},
// showsearch(newv) {
// if (newv) {
// this.to_search();
// }
// }
},
methods: {
init(val, index) {
if (index || index == 0) {
this.index = index;
} else {
this.index = null;
}
if (val) {
this.info = { ...val };
} else {
// let userInfo = uni.getStorageSync("userInfo");
// const { name, userId } = userInfo;
this.info = {};
// this.info.czy = name;
// this.info.czyId = userId;
// this.info = { ...this.info };
}
},
showSinglePicker() {
this.show_search_hcl = true;
this.$refs.mysearchlist.to_search()
},
pickerConfirm(e) {
var value = e.value;
var name = "";
if (value[1] == "-") {
name = e.item[0].text;
this.deptResult.value = "";
} else {
this.deptResult.value = value[2] ? value[2] : value[1];
if (value[2]) {
// name = name.substring(0,name.length-2);
name = e.item[0].text + "/" + e.item[1].text + "/" + e.item[2].text;
} else {
name = e.item[0].text + "/" + e.item[1].text;
}
}
this.deptResult.name = name;
this.listCards = [];
this.page = 1;
this.loading_status = "more";
// this.set_request();
},
// pickerConfirm(e) {
// var value = e.value;
// this.deptResult.value = value[1] ? value[1] : value[0];
// var name = e.label;
// if (!value[1]) {
// name = name.substring(0, name.length - 2);
// }
// this.deptResult.name = name;
// },
selectPeople1(val) {
this.selFrom = val;
this.show_search_user1 = true;
// uni.navigateTo({
// url: "repairTurnTo?flag="+flag+'&url=addRepair'
// });
},
hiddenkeyboard() {
uni.hideKeyboard();
},
pickerCjConfirm(e) {
this.info.bb = e.label;
this.info.bbid = e.value[0];
this.info = { ...this.info };
},
chooseItem() {
let submitData = this.info;
if (!submitData.hcljh || !submitData.cpjz) {
uni.showToast({
title: "请填写必填项",
icon: "none",
});
this.showDanger = true;
setTimeout(() => {
this.showDanger = false;
}, 500);
return false;
}
console.log(this.index, "index");
this.$emit("ok", submitData, this.index);
this.clearAll();
uni.hideKeyboard();
},
clearAll() {
this.index = null;
this.info = {};
this.$emit("update:showsearch", false);
},
mysearchlist_() {
if (!this.lastpage) {
this.mysearchinput_();
}
},
clearInput() {
this.sbjh = "";
},
toBack() {
this.clearAll();
uni.hideKeyboard();
},
to_search() {
this.loadingmore = true;
this.show_toloadmore = false;
this.show_search_none = false;
var v = this;
this.pageno = 1;
this.dataList = [];
// v.set_request(v.sbjh);
},
set_request(d) {
let filterRes = {
pagesize: this.pagesize,
pageno: this.pageno,
sbjh: this.sbjh,
kz: this.kz,
// status: 1
};
this.loadingmore = true;
this.$http
.request({
url: "/apis/mdh/sbbg/pageList",
data: filterRes,
method: "POST",
})
.then((res) => {
this.loadingmore = false;
if (res.data.code != 0) {
uni.showToast({
title: res.msg,
icon: "none",
duration: 2000,
});
return false;
}
if (res.data.data == undefined) {
if (this.pageno == 1) {
//搜索结果为空
this.show_search_none = true;
}
//最后一页搜索结果为空
this.show_toloadmore = false;
return false;
}
if (res.data.code == 0 && res.data.data) {
this.pageno = this.pageno + 1;
this.dataList = this.dataList.concat(res.data.data.records);
if (this.pagesize == res.data.data.records.length) {
this.show_toloadmore = true;
} else if (this.pagesize > res.data.data.records.length) {
//已经加载到最后一页了
this.show_toloadmore = false;
}
}
this.$nextTick(function () {
//首次加载高度没有撑满页面,继续加载下一页
query = uni.createSelectorQuery().in(this);
query
.select(".search-list")
.boundingClientRect((data) => {
searchListHeight = data.height;
})
.exec();
query
.select(".panel")
.boundingClientRect((data) => {
panelHeight = data.height;
if (
panelHeight <= searchListHeight &&
res.data.data != undefined
) {
this.mysearchinput_();
}
})
.exec();
});
})
.catch((err) => {
this.loadingmore = false;
if (res.errMsg == "request:fail timeout") {
uni.showToast({
title: "请求超时",
icon: "none",
duration: 2000,
});
} else {
uni.showToast({
title: "请求失败",
icon: "none",
duration: 2000,
});
}
});
},
mysearchinput_() {
this.set_request(this.sbjh);
},
},
};
</script>
<style scoped>
.search-container,
.search-container2 {
position: fixed;
z-index: 10;
width: 100%;
background-color: #fff;
left: 0;
}
.search-container {
border-bottom: 1px solid #d9d9d9;
box-sizing: border-box;
height: 50px;
box-sizing: border-box;
}
.search-container2 {
top: 50px;
height: auto;
}
.search-container2-flex {
position: relative;
align-items: center;
height: 100%;
padding: 0 5px;
display: flex;
box-sizing: border-box;
justify-content: space-around;
flex-wrap: wrap;
}
.search-input {
position: relative;
height: 30px;
border: 1px solid #e6e6e6;
border-radius: 15px;
box-sizing: border-box;
}
.search-title {
position: absolute;
left: 60px;
right: 60px;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 18px;
color: #000;
}
.searchSelectBox {
float: left;
}
.searchSelectBox .text {
margin: 0px 3%;
background: #f6f6f6;
border-radius: 40px;
width: 94%;
line-height: 30px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
text-align: center;
color: #333;
}
.my-uni-icon-search {
line-height: 30px;
margin-left: 5px;
}
.input- {
position: absolute;
height: 100%;
left: 30px;
top: 0;
right: 0px;
border: none;
outline: medium;
color: #666;
font-size: 14px;
padding: 0 30px 0 0 !important;
box-sizing: border-box;
}
.my-uni-icon-close {
position: absolute;
height: 30px;
width: 30px;
right: 0px;
line-height: 30px;
top: 0;
text-align: center;
}
.search_btn,
.search_btn1,
.back_btn {
position: absolute;
width: 50px;
height: 30px;
right: 5px;
top: 10px;
font-size: 16px;
line-height: 30px;
text-align: center;
color: #007aff;
}
.search_btn1 {
right: 55px;
}
.back_btn {
left: 5px;
right: auto;
color: #999;
}
.search-list-container {
position: fixed;
z-index: 10000;
width: 100%;
left: 0;
top: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
}
.search-list-out {
position: absolute;
width: 100%;
left: 0;
top: 0px;
bottom: 0;
background-color: #fff;
z-index: 1;
}
.search-list {
position: absolute;
overflow: scroll;
bottom: 0;
width: 100%;
left: 0;
}
.panel view {
line-height: 20px;
padding: 8px 0 8px 10px;
box-sizing: border-box;
}
/* .panel .flex-row:nth-of-type(even) {
//奇数
background-color: #efefef;
}
.panel .flex-row:nth-of-type(odd) {
//偶数
background-color: #f9f9fb;
} */
.flex-row {
position: relative;
width: 100%;
padding-right: 45px !important;
/* display: flex; */
/* flex-direction: row; */
}
.flex-column {
display: flex;
flex-direction: column;
justify-content: center;
align-items: stretch;
}
.flex-cell {
width: 50%;
float: left;
text-align: left;
/* display: flex;
font-size: 15px;
flex: 1;
justify-content: center;
align-items: center; */
}
.flex-cell-single {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid #e6e6e6;
}
.flex-cell-single span,
.flex-cell span {
color: #333;
width: 50%;
}
.search_none,
.toloadmore {
position: relative;
font-size: 16px;
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
background-color: #fff;
left: 0;
}
.toloadmore {
color: #fff;
}
.loading-container {
position: relative;
font-size: 16px;
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
background-color: #fff;
left: 0;
}
.checkbox-filled {
right: 10px;
}
>>>.picker-item .lb-picker-column .lb-picker-column-label {
-webkit-transition: all 0.3s;
transition: all 0.3s;
line-height: 3.8 !important;
}
</style>