SmartStorage/pages/backMaterialReceive/backMaterialReceive.vue

805 lines
28 KiB
Vue

<template>
<view>
<view class="search-bar">
<uni-easyinput
suffixIcon="search"
v-model="exitIpt"
placeholder="请输入关键字"
@iconClick="searchKeyword"></uni-easyinput>
</view>
<uni-swipe-action>
<uni-swipe-action-item
class="single-fetch"
v-for="(fetch, index) in fetchMaterialList"
:key="index"
:right-options="fetch.taskStatus== '139' ? optionsTwo:options"
@click="optionClick($event, fetch.id, fetch.modelId,fetch.agreementId)">
<view class="fetch-upper">
<!-- {{ fetch.taskStatus }} -->
<!-- <checkbox-group
v-show="fetch.taskStatus != '35'"
style="margin-right: 15rpx;"
@change="checkClick(fetch)"
>
<checkbox :checked="fetch.checked" />
</checkbox-group> -->
<view class="upper-lef">
{{
fetch.backPerson == null
? ""
: fetch.backPerson.slice(0, 1)
}}
</view>
<view class="upper-rig">
<h4 style="font-size: 16px">{{ fetch.backPerson }}</h4>
<h4 style="color: #989898">{{ fetch.unitName }}</h4>
</view>
</view>
<view class="fetch-lower" @click="seeDetail(fetch)">
<view>
<span>退料单号</span>
<h4>{{ fetch.code }}</h4>
</view>
<view>
<span>退料工程</span>
<h4>{{ fetch.lotName }}</h4>
</view>
<view>
<span>工机具类型</span>
<h4>{{ fetch.typeName }}</h4>
</view>
<view>
<span>申请日期</span>
<h4>{{ fetch.backTime }}</h4>
</view>
</view>
<!-- <view class="fetch-btns">
<view
style="background-color: #3788FF;"
@click="seeDetail(fetch.taskId)"
v-show="fetch.taskStatus != '33'"
>
<uni-icons style="color: #fff;" type="eye" size="36"></uni-icons>
查看
</view>
<view
style="background-color: #FCA30D;"
v-show="fetch.taskStatus != '33'"
@click="seeExam(fetch)"
>
<uni-icons style="color: #fff;" type="auth" size="36"></uni-icons>
审核
</view>
</view> -->
<!-- <view class="sticky-area">
<image
src="/static/accomplished.png"
v-show="fetch.taskStatus == '40'"
mode=""></image>
<image
src="/static/notAccomplished.png"
v-show="fetch.taskStatus != '40'"
mode=""></image>
</view> -->
<view class="sticky-area">
<h4 v-show="fetch.taskStatus == '139'">退料未开始</h4>
<h4 v-show="fetch.taskStatus == '39'" style="border: 1px solid #E6A23C; color: #E6A23C">退料进行中</h4>
<h4
v-show="fetch.taskStatus == '40'"
style="border: 1px solid #27d870; color: #27d870">
退料完成
</h4>
</view>
</uni-swipe-action-item>
</uni-swipe-action>
<!-- <view class="btm-sticky">
<view class="checked">
<checkbox-group @tap="checkAll" style="margin-right: 15rpx;">
<checkbox :checked="allChecked" />
</checkbox-group>
<text>全选</text>
</view>
<view
class="exam"
@click="toggleExam"
>
审核
</view>
</view> -->
<uni-popup ref="popup" type="center" :mask-click="false">
<view class="popup">
<view class="pop-top">
<h4>新增退料申请</h4>
<uni-icons
style="color: #aaaaaa; font-weight: bold"
type="closeempty"
size="24"
@click="closePopup">
</uni-icons>
</view>
<view class="select-area">
<uni-forms
ref="exitForm"
:modelValue="exitFormData"
:rules="rules"
label-position="top">
<uni-forms-item
name="backPerson"
required
label="退料人"
label-width="150">
<uni-easyinput
style="width: 520rpx"
v-model="exitFormData.backPerson"
placeholder="请输入"></uni-easyinput>
</uni-forms-item>
<uni-forms-item
name="phone"
label="退料人电话"
label-width="150">
<uni-easyinput
style="width: 520rpx"
type="number"
maxlength="11"
v-model="exitFormData.phone"
placeholder="请输入"></uni-easyinput>
</uni-forms-item>
<uni-forms-item
name="unitId"
required
label="选择退料单位"
label-width="150">
<uni-data-select
style="width: 520rpx"
v-model="exitFormData.unitId"
:localdata="deptRange"
@change="deptChange"
:clear="false"></uni-data-select>
</uni-forms-item>
<uni-forms-item
name="lotId"
required
label="选择退料工程"
label-width="150">
<view class="project-select">
<uni-data-select
style="width: 520rpx"
v-model="exitFormData.lotId"
:localdata="projRange"
:clear="false"></uni-data-select>
</view>
</uni-forms-item>
<uni-forms-item
name="exitTime"
required
label="选择预退料时间"
label-width="150">
<uni-datetime-picker
style="width: 520rpx"
type="date"
:clear-icon="false"
v-model="exitFormData.exitTime" />
</uni-forms-item>
<uni-forms-item
name="remark"
label="备注"
label-width="150">
<uni-easyinput
style="width: 520rpx"
v-model="exitFormData.remark"
placeholder="请输入"></uni-easyinput>
</uni-forms-item>
<button class="submit-btn" @click="formSubmit">
确认
</button>
</uni-forms>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import { basePath } from "../../public";
export default {
data() {
return {
allChecked: false,
fetchMaterialList: [],
examList: [],
exitIpt: "",
options: [
{
text: "查看",
style: {
backgroundColor: "#007aff",
},
},
],
optionsTwo: [
{
text: "查看",
style: {
backgroundColor: "#007aff",
},
},
{
text: "修改",
style: {
backgroundColor: "#E6A23C",
},
},
],
exitFormData: {
backPerson: "",
phone: "",
unitId: "",
lotId: "",
exitTime: "",
remark: "",
},
deptRange: [],
projRange: [],
rules: {
backPerson: {
rules: [
{
required: true,
errorMessage: "请输入退料人!",
},
],
},
phone: {
rules: [
{
required: false,
errorMessage: "请输入退料人电话!",
},
],
},
unitId: {
rules: [
{
required: true,
errorMessage: "请选择退料部门!",
},
],
},
lotId: {
rules: [
{
required: true,
errorMessage: "请选择退料工程!",
},
],
},
exitTime: {
rules: [
{
required: true,
errorMessage: "请选择预退料时间!",
},
],
},
},
newAdd: {
taskType: "36",
taskStatus: "139",
createBy: uni.getStorageSync("userInfo").userid,
companyId: uni.getStorageSync("userInfo").sysUser.companyId,
agreementId: "",
unitId: "",
unitName: "",
// agreementName: '',
lotId: "",
phone: "",
backTime: "",
backPerson: "",
remark: "",
},
fetchedList: [],
phoneReg: /^(?:(?:\+|00)86)?1[3-9]\d{9}$/,
};
},
computed: {
listData: function () {
if (!this.exitIpt) {
return this.fetchMaterialList;
}
return this.fetchMaterialList.filter((item) => {
return item.backPerson.includes(this.exitIpt);
});
},
},
methods: {
deptChange(e) {
let that = this;
console.log(e, that.fetchedList);
for (let i = 0; i < that.fetchedList.length; i++) {
if (e == that.fetchedList[i].id) {
that.newAdd.unitName = that.fetchedList[i].name;
}
}
this.$api.fetchMaterial
.getProjList(
{
id: e,
},
null
)
.then((res) => {
console.log('res',res);
if (res.data.code == 200) {
that.projRange = res.data.data.map((item) => {
return {
text: item["name"],
value: item["id"],
};
});
}
})
.catch((err) => {
console.log(err);
});
},
optionClick(e, id, modelId,agreeId) {
console.log(id, modelId, "modelId");
if(e.index==0){
uni.navigateTo({
url: `/pages/seeBackMaterialDetail/seeBackMaterialDetail?id=${id}&typeId=${modelId}`,
});
}else{
uni.navigateTo({
url: `/pages/exitMaterialSelect/exitMaterialSelect?agreeId=${agreeId}&id=${id}`,
});
}
},
seeDetail(item) {
if (item.taskStatus == 40) {
uni.showToast({
icon: "none",
title: "退料已完成,请勿再点击!",
});
} else {
uni.navigateTo({
url: `/pages/backMaterialReceiveDetail/backMaterialReceiveDetail?id=${item.id}&taskId=${item.taskId}&taskStatus=${item.taskStatus}`,
});
}
},
/* checkAll() {
this.allChecked = !this.allChecked
if (this.allChecked) {
this.fetchMaterialList.map(item => {
if (item.checked == false) {
item.checked = true
}
})
} else {
this.fetchMaterialList.map(item => {
if (item.checked == true) {
item.checked = false
}
})
}
},
checkClick(item) {
item.checked = !item.checked
if (!item.checked) {
this.allChecked = false
} else {
const goods = this.fetchMaterialList.every(item => {
return item.checked === true
})
if (goods) {
this.allChecked = true
} else {
this.allChecked = false
}
}
}, */
toggleExam() {
let that = this;
that.examList = that.fetchMaterialList
.filter((item) => {
return item.checked == true;
})
.map((subItem) => {
return {
name: subItem["name"],
number: subItem["fetchNum"],
};
});
console.log(that.examList);
},
closePopup() {
this.$refs.popup.close();
},
seeExam(name) {
console.log(name);
this.$refs.popup.open();
},
// formSubmit() {
// let that = this;
// that.$refs.examForm.validate().then((formData) => {
// console.log(formData);
// that.$refs.popup.close();
// });
// },
formSubmit() {
let that = this;
that.$refs.exitForm.validate().then((formData) => {
console.log("formData", formData);
if (formData.phone!="" && !that.phoneReg.test(formData.phone)) {
uni.showToast({
icon: "none",
title: "请输入正确格式的手机号!",
});
} else {
that.$refs.popup.close();
// 判断单位id和工程id是否匹配
that.$api.exitMaterial
.ifAgreementNew({
unitId: formData.unitId,
projectId: formData.lotId,
})
.then((res) => {
console.log("判断协议问题成功", res);
if (res.data.code == 200) {
if (res.data.data.agreementId != null) {
that.newAdd.agreementId =
res.data.data.agreementId;
that.newAdd.backPerson =
formData.backPerson;
that.newAdd.phone = formData.phone;
that.newAdd.unitId = formData.unitId;
that.newAdd.lotId = formData.lotId;
that.newAdd.backTime =
formData.exitTime;
that.newAdd.remark = formData.remark;
console.log(
"退料参数====",
that.newAdd
);
that.$api.exitMaterial
.newExitList(that.newAdd)
.then((res) => {
console.log(res);
if (res.data.code == 200) {
uni.showToast({
icon: "none",
title: "新增申请成功!",
success: () => {
uni.redirectTo({
url: "/pages/backMaterialReceive/backMaterialReceive",
});
},
});
}
})
.catch((err) => {
console.log(err);
});
}
}
})
.catch((err) => {
console.log("判断协议问题失败", err);
console.log(err);
});
}
});
},
// chooseMaterial(agreeId, id) {
// uni.navigateTo({
// url: `/pages/exitMaterialSelect/exitMaterialSelect?agreeId=${agreeId}&id=${id}`,
// });
// },
ifPassChange(e) {
let that = this;
console.log(e);
if (e == 1) {
that.rules = {
ifPass: {
rules: [
{
required: true,
errorMessage: "请选择是否通过!",
},
],
},
noPassReason: {
rules: [
{
required: true,
errorMessage: "请填写不通过原因!",
},
],
},
};
} else {
that.examFormData.noPassReason = "";
that.rules = {
ifPass: {
rules: [
{
required: true,
errorMessage: "请选择是否通过!",
},
],
},
};
}
},
getList(keyWord) {
console.log(keyWord);
let that = this;
// 获取退料接收列表
that.$api.backMaterialReceive
.backMaterialReceiveList({
companyId:
uni.getStorageSync("userInfo").sysUser.companyId,
flag: 0,
keyWord,
})
.then((res) => {
console.log(res);
if (res.data.code == 200) {
if (res.data.data.length == 0) {
uni.showToast({
icon: "none",
title: "未查询到相关数据!",
});
} else {
that.fetchMaterialList = res.data.data;
console.log(
"fetchMaterialList",
that.fetchMaterialList
);
}
} else {
uni.showToast({
icon: "none",
title: res.data.msg,
});
}
})
.catch((err) => {
console.log(err);
});
},
searchKeyword() {
this.getList(this.exitIpt);
},
},
onShow() {
this.getList("");
let that = this;
that.$api.fetchMaterial
.getDeptList()
.then((res) => {
if (res.data.code == 200) {
// console.log(res, "获取单位和工程---");
that.fetchedList = res.data.data;
that.deptRange = res.data.data.map((item) => {
return {
text: item["name"],
value: item["id"],
};
});
}
})
.catch((err) => {
console.log(err);
});
},
onNavigationBarButtonTap() {
this.$refs.popup.open();
},
};
</script>
<style lang="scss">
body {
background-color: #f8f8f8;
box-sizing: border-box;
padding-bottom: 10vh;
}
.search-bar {
width: 95%;
margin: 20rpx auto;
}
.single-fetch {
width: 95%;
margin: 20rpx auto;
background-color: #fff;
border-radius: 15rpx;
box-sizing: border-box;
padding: 5rpx;
position: relative;
.fetch-upper {
width: 100%;
box-sizing: border-box;
padding: 15rpx;
border-bottom: 1px solid #d7d7d7;
display: flex;
align-items: center;
.upper-lef {
width: 12%;
height: 5vh;
border-radius: 15rpx;
display: flex;
justify-content: center;
align-items: center;
background-color: #3789fd;
color: #fff;
font-size: 24px;
}
.upper-rig {
flex: 1;
box-sizing: border-box;
padding: 10rpx 20rpx;
display: flex;
flex-direction: column;
justify-content: space-around;
h4 {
font-weight: normal;
font-size: 14px;
}
}
}
.fetch-lower {
width: 100%;
box-sizing: border-box;
padding: 15rpx;
view {
width: 100%;
display: flex;
align-items: center;
margin-bottom: 15rpx;
font-size: 14px;
span {
color: #9d9d9d;
padding-right: 20rpx;
}
h4 {
color: #000;
font-size: 14px;
font-weight: normal;
}
}
view:last-child {
margin-bottom: 0;
}
}
.fetch-btns {
width: 100%;
box-sizing: border-box;
padding: 15rpx;
display: flex;
justify-content: flex-end;
view {
box-sizing: border-box;
padding: 8rpx 25rpx;
border-radius: 15rpx;
color: #fff;
margin-right: 15rpx;
font-size: 14px;
}
view:last-child {
margin-right: 0;
}
}
// .sticky-area {
// position: absolute;
// top: 0;
// right: 0;
// width: 10vh;
// height: 9vh;
// image {
// width: 100%;
// height: 100%;
// }
// }
.sticky-area {
position: absolute;
top: 20rpx;
right: 20rpx;
/* width: 11vh;
height: 10vh;
image{
width: 100%;
height: 100%;
} */
h4 {
box-sizing: border-box;
padding: 8rpx 20rpx;
border-radius: 15rpx;
font-size: 14px;
font-weight: normal;
background-color: #fff;
border: 1px solid #3788ff;
color: #3788ff;
}
}
}
/* .btm-sticky{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
box-sizing: border-box;
padding: 15rpx 30rpx;
background-color: #fff;
display: flex;
justify-content: space-between;
align-items: center;
.checked{
display: flex;
align-items: center;
}
.exam{
box-sizing: border-box;
padding: 10rpx 50rpx;
border-radius: 30rpx;
background-color: #3788FF;
font-size: 14px;
color: #fff;
}
}
.popup{
width: 80vw;
height: 60vh;
background-color: #fff;
border-radius: 15rpx;
overflow: hidden;
background: linear-gradient(#D9E7FE, #fff, #fff, #fff);
.pop-top{
width: 100%;
height: 5vh;
box-sizing: border-box;
padding: 0 25rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
.select-area{
width: 85%;
margin: 40rpx auto;
.submit-btn{
background-color: #409EFF;
color: #fff;
}
}
} */
.popup {
width: 80vw;
height: 90vh;
background-color: #fff;
border-radius: 15rpx;
overflow-y: auto;
background: linear-gradient(#d9e7fe, #fff, #fff, #fff);
.pop-top {
width: 100%;
height: 5vh;
box-sizing: border-box;
padding: 0 25rpx;
display: flex;
justify-content: space-between;
align-items: center;
}
.select-area {
width: 85%;
margin: 40rpx auto;
.submit-btn {
background-color: #409eff;
color: #fff;
}
}
}
</style>