ah_sz_gqj_app/pages/samples/samplesDetail.vue

503 lines
12 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view>
<view class="topTab"></view>
<view class="page-content">
<view class="search">
<image @click="customNavigateBack" style="width: 40rpx;height: 40rpx;margin:0 20rpx;" src="@/static/img/back.png" mode=""></image>
<u-search :showAction="false" style="margin-right: 20rpx;" :input-style="inputStyle" bgColor='#F3F3F3' :searchIconSize="36" v-model="searchValue" @change="searchList" ></u-search>
<view style="width: 20%;height: 100%;display: flex;align-items: center;justify-content: center;">
<view class="addBtn" @click="addDevice">添加样品</view>
<!-- <view class="addBtn" v-if="hasTeam" @click="searchList">查询</view> -->
</view>
</view>
<view class="main-header">
<view style="color: #A6A6A6;font-size: 24rpx;width: 110rpx;margin-left: 20rpx;">送样单位</view>
<view style="margin:0 20rpx;font-size: 24rpx;">{{customName}}</view>
</view>
<view class="main-box">
<!-- 列表 -->
<view class="list-box" >
<u-list @scrolltolower="scrolltolower" height="82vh" v-if="listData.length>0">
<u-list-item v-for="(item, index) in listData" :key="index">
<view class="list-item">
<view class="item-header">
<view class="header-name">
{{item.sampleTools+' '+item.devModule}}
</view>
<view class="header-time">
{{item.sampleTime}}
</view>
</view>
<view class="item-content">
<view class="content-box">
<view class="item-text">
<text class="label">送样部门</text>
<text class="info">{{item.sampleDepartment}}</text>
</view>
<view class="item-text">
<text class="label">样品编号</text>
<text class="info">{{item.devCode}}</text>
</view>
<view class="item-text">
<text class="label">收样编号</text>
<text class="info">{{item.customerCode}}</text>
<image src="../../static/images/del.png" @click="delDevice(item)" v-if="item.experStatus==0" style="width: 30rpx;height: 30rpx;float: right;margin-right: 20rpx;" alt="">
</view>
</view>
</view>
<view class="item-footer">
<view class="footer-left">
<view style="font-size: 22rpx;">收样标签</view>
<view class="foot-btn" @click="goSamplesCode(item)">查看</view>
</view>
<!-- <view class="footer-right">已打印</view> -->
</view>
</view>
</u-list-item>
</u-list>
<view style="width: 100%;height: 80vh;display: flex;flex-direction:column;justify-content: center;align-items: center;" v-if="listData.length==0">
<image src="../../static/images/noDevices.png" style="width: 60%;height: 20vh;" alt="">
<view style="color: rgba(0, 0, 0, 0.45);">未添加样品</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import { getDetailsList,delSamplesDetails,getFlag } from '@/service/url.js';
import tabHeader from '@/components/tab-Header.vue';
import eselect from '@/components/eselect.vue';
import AES from "@/utils/cryptoJs/aes.js";
export default {
components: {
tabHeader,
eselect,
},
data() {
return {
addData:{},//新增
searchValue:'',//搜索记录
inputStyle:{
fontSize:'24rpx',//修改搜索框里面的文字大小
height:'60rpx',
},
batchCode:'',//编辑
collectId:'',
customId:'',
customName:'',
hasTeam:false,
// 新增收样
addPopup: false,
addForm:{
collectDept:'',
},
showDate: false,
showDept: false,
columns: [['曹村供电所', '王村供电所', '张村供电所', '周村供电所', '李村供电所']],
rules: {
'collectDept': {
type: 'string',
required: true,
message: '请选择部门',
trigger: ['blur', 'change']
},
},
isFlag:true,
listData:[],
page:1,
};
},
onLoad(option) {
console.log(option)
if(option.addData){
this.addData=JSON.parse(option.addData)||{};
this.customName=this.addData.customName;
}else{
this.collectId = option.id || '';
this.customId = option.customId || '';
this.customName = option.customName|| ''
this.batchCode = option.batchCode|| ''
if(option.hasTeam&&option.hasTeam!=""){
this.hasTeam=true;
}else{
this.hasTeam=false;
}
}
},
onShow() {
if(this.collectId&&this.collectId!=""){
this.loadmore()
}
},
methods: {
customNavigateBack() {
// 自定义返回逻辑
const pages = getCurrentPages(); // 获取页面栈
const len = pages.length;
let backPage = ''; // 要返回的页面路径
for (let i = len - 2; i >= 0; i--) {
// 从倒数第二个页面开始遍历,找到第一个不是当前页面的页面
if (pages[i].route !== 'pages/A/A') {
backPage = pages[i].route;
break;
}
}
if (backPage) {
uni.navigateBack({
delta: len - 1 - pages.findIndex(page => page.route === backPage) // 返回到已存在的页面
});
}
},
searchList(value){//搜索收样记录
// console.log(value)
// console.log(this.searchValue)
this.page = 1;
this.listData=[]
this.loadmore()
},
scrolltolower() {
this.page += 1;
this.loadmore()
},
loadmore() {
let obj = {
"keyWord":this.searchValue,
"id":this.collectId,
"page":this.page,
"limit":"10"
}
let param = {
encryptedData: AES.encrypt(JSON.stringify(obj))
}
this.$http.post(getDetailsList,param).then(res => {
if (res) {
console.log(res)
if(res.code == 200){
if(res.data?.length>0){
if(this.page == 1){
this.listData = res.data;
}else{
this.listData = [...this.listData, ...res.data];
}
}else{
console.log("没有更多了")
}
}
}
}).catch(error => {
console.log(error)
// this.$utils.showHttpError(error)
})
// console.log(this.listData)
},
goSamplesCode(item){
uni.navigateTo({
url: `/pages/samples/sampleCode?customerCode=sybq/${item.customerCode}`
})
},
//判断是否可操作
hasFlag(){
},
//新增按钮触发
addDevice(){
if(this.collectId){
let obj = {"id":this.collectId}
let param = {encryptedData: AES.encrypt(JSON.stringify(obj))}
this.$http.post(getFlag,param).then(response => {
if (response) {
if(response.code == 200){
uni.navigateTo({//修改收样批次
url: `/pages/samples/addDevice?id=${this.collectId}&customName=${this.customName}&customId=${this.customId}&batchCode=${this.batchCode}`
})
}
}
}).catch(error => {
uni.showToast({
title: error.msg,
icon: "none"
})
})
}else{
uni.navigateTo({//新建收样批次
url: `/pages/samples/addDevice?addData=${JSON.stringify(this.addData)}`
})
}
},
//为派工可删除
delDevice(chosen){
let obj = {"id":this.collectId}
let param = {encryptedData: AES.encrypt(JSON.stringify(obj))}
this.$http.post(getFlag,param).then(response => {
if (response){
if(response.code == 200){
uni.showModal({
title: '确认',
content: '请确认是否删除该样品!',
showCancel: true,
cancelText: '取消',
confirmText: '确认',
success: res => {
if (res.confirm) {
let obj = {
"id":chosen.id,
}
let param = {
encryptedData: AES.encrypt(JSON.stringify(obj))
// encryptedData: JSON.stringify(obj)
}
this.$http.post(delSamplesDetails,param).then(response => {
if (response) {
if(response.code == '200'){
uni.showToast({
title: "删除成功",
icon: "none"
})
this.page = 1;
this.listData=[];
this.loadmore()
}else{
uni.showToast({
title: "删除失败",
icon: "none"
})
}
}
}).catch(error => {
console.log(error)
})
} else if (res.cancel) {}
}
});
}
}
}).catch(error => {})
},
},
}
</script>
<style lang="scss">
/deep/.u-popup .u-slide-right-enter-active{
left: 0;
}
.searchInput{
height: 100%;
}
.page-content{
width: 100%;
height: 96vh;
position: absolute;
top: 4vh;
padding: 0 0;
background-color: #F3F3F3;
.search{
width: 100%;
height: 120rpx;
margin: 0rpx auto;
display: flex;
justify-content: space-between;
align-items: center;
background-color: #FFF;
}
.addBtn{
width: 120rpx;
height: 50rpx;
line-height: 50rpx;
text-align: center;
color: #fff;
border-radius: 30rpx;
font-size: 20rpx;
background-color: #0052D9;
margin:0 20rpx;
}
.main-box{
width: 100%;
height: auto;
}
.main-header{
width: 100%;
height: auto;
display: flex;
align-items: center;
background-color: #FFF;
padding-bottom: 20rpx;
}
.tab-box {
overflow: hidden;
height: 80upx;
.tab-item {
float: left;
height: 70upx;
width: 48%;
font-size: 30upx;
line-height: 70upx;
text-align: center;
}
.active {
color: #333;
border-radius: 10upx 10upx 0 0;
font-weight: bold;
}
.activeLine{
background: linear-gradient( 90deg, #50CBA1 0%, #06AEA6 100%), #5685F2;
border-radius: 10upx;
width: 50upx;
height: 10upx;
margin: 0 auto;
}
}
.list-box{
width: 94%;
height: auto;
// border: 1px solid #000;
margin: 20rpx auto;
.list-item{
width: 100%;
height: auto;
background-color: #fff;
border-radius: 20rpx;
margin: 20rpx 0;
.item-header{
width: 100%;
height: auto;
line-height: 72rpx;
font-size: 28rpx;
border: 1px dashed #E3E9FA;
display: flex;
align-items: center;
justify-content: space-between;
}
.header-name{
width: 72%;
padding:20rpx;
// word-wrap: break-word;
line-height: 40rpx;
}
.header-time{
width: 26%;
color: #999999;
font-size: 20rpx;
}
.item-content{
width: 100%;
height: auto;
border: 1px dashed #E3E9FA;
font-size: 24rpx;
.content-box{
width: 94%;
height: auto;
margin: 20rpx;
background-color: #F7F7F7;
padding: 20rpx 0;
border-radius: 10rpx;
.item-text{
margin-left: 20rpx;
margin-top: 15rpx;
.label{
color: #999999;
}
.info{
color: #373737;
}
}
}
}
.item-footer{
width: 100%;
height: 72rpx;
position: relative;
.footer-left{
width: 300rpx;
height: 70rpx;
display: flex;
align-items: center;
position: absolute;
left: 0;
font-size: 20rpx;
margin-left: 40rpx;
}
.footer-right{
width: 100rpx;
height: 70rpx;
display: flex;
align-items: center;
position: absolute;
right: 0;
color: #999999;
font-size: 20rpx;
}
.foot-btn{
width: 80rpx;
height: 40rpx;
line-height: 40rpx;
text-align: center;
background: rgba(0,133,255,0.05);
border-radius: 10rpx;
color: #0052D9;
font-size: 20rpx;
margin-left: 20rpx;
}
}
}
}
}
.submit-box {
width: 100%;
height: 100rpx;
padding-bottom: 20rpx;
position: fixed;
bottom: 0;
display: flex;
justify-content: space-between;
align-items: center;
background-color: #FFF;
.submit-add{
width: 80%;
margin: 0 auto;
height: 65rpx;
font-size: 26rpx;
background: #0052D9;
box-shadow: 0px 4px 2px 0px rgba(81,147,254,0.15);
}
}
.add-header{
width: 100%;
height: 80rpx;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
background-color: #fff;
}
.add-form{
width: 100%;
height: 20vh;
padding: 20rpx 0;
background-color: #fff;
}
</style>