738 lines
18 KiB
Vue
738 lines
18 KiB
Vue
<template>
|
|
<view>
|
|
<view class="topTab">
|
|
<view class="tab-header">
|
|
<view class="left" style="width: 30%;">
|
|
<image @click="customNavigateBack" src="@/static/img/back.png" mode=""></image>试验样品
|
|
</view>
|
|
<view class="right" style="justify-content: flex-end;width: 45%;">
|
|
<!-- 搜索 -->
|
|
<!-- <view class="text-btn" @click="openSearch">
|
|
<image src="@/static/images/search1.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
|
|
</view> -->
|
|
<!-- 筛选 -->
|
|
<!-- <view class="text-btn" @click="filter">
|
|
<image src="@/static/images/filter.png" style="width: 50rpx;height: 50rpx;" mode=""></image>
|
|
</view> -->
|
|
<!-- 收样 -->
|
|
<!-- <view class="add-btn" @click="addCollect">
|
|
<u-icon name="plus" color="#FFF" size="24"></u-icon>
|
|
<text>收样</text>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="page-content">
|
|
<view class="search" v-show="isShowSearch">
|
|
<u-search :showAction="true" style="width: 80%;margin: 0 auto;" :input-style="inputStyle" bgColor='#F3F3F3' :searchIconSize="36" v-model="searchValue" actionText="搜索" :animation="false" @custom="searchList" ></u-search>
|
|
</view>
|
|
<view class="main-box">
|
|
<!-- 列表 -->
|
|
<view class="list-box">
|
|
<u-list @scrolltolower="scrolltolower" :height="isShowSearch ? '82vh' : '88vh'">
|
|
<u-list-item v-for="(item, index) in listData" :key="index">
|
|
<view class="list-item" >
|
|
<view class="item-header">
|
|
<view class="header-name">
|
|
<!-- <u-checkbox-group v-model="item.checked" style="transform:scale(1.4)" @change="checkDevice(item)">
|
|
<u-checkbox :customStyle="{margin: '0rpx 20rpx'}" shape="circle" :label="''" :name="item.id" :disabled="item.auditStatus==null"></u-checkbox>
|
|
</u-checkbox-group> -->
|
|
<text>{{item.devTypeName}} {{item.devModule}}</text>
|
|
</view>
|
|
<view style="margin-right: 40rpx;">
|
|
<text v-if="item.isHg==0" style="color: #0052D9;">{{item.sampleNum}}</text>
|
|
<text v-else style="color: #FC4D72;">{{item.sampleNum}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="item-content">
|
|
<view class="content-box" v-if="item.remarks">
|
|
{{item.remarks}}
|
|
</view>
|
|
</view>
|
|
<view class="item-footer">
|
|
<view class="status-box">
|
|
<view class="foot-status2" v-if="item.statusResult.indexOf('不')>-1">{{item.statusResult}}</view>
|
|
<view class="foot-status" v-else>{{item.statusResult}}</view>
|
|
</view>
|
|
<view class="btn-box">
|
|
<view class="foot-btn" v-if="item.auditStatus!=null" @click="viewOrganization(item)">查看</view>
|
|
<view class="foot-btn1" v-if="item.auditStatus!=1&&item.statusResult!='待审阅'&&item.statusResult!='待审核'&&item.statusResult!='待审批'" @click="goOrganization(item)">编制</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</u-list-item>
|
|
</u-list>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- 固定底部-全选框 -->
|
|
<!-- <view class="bottom-box">
|
|
<view style="width: 100%;height: 120rpx;position: absolute;bottom: 0;display: flex;background-color: #FFF;">
|
|
<view style="margin-left: 60rpx;font-size: 24rpx;margin-top: 10rpx;">
|
|
<u-checkbox-group v-model="checkAll" @change="checkedAll" style="transform:scale(1.4)">
|
|
<u-checkbox :customStyle="{marginTop: '20rpx'}" labelSize="12px" shape="circle" label="全选" name="1"></u-checkbox>
|
|
</u-checkbox-group>
|
|
</view>
|
|
<view style="margin-left: 20rpx;font-size: 24rpx;margin-top: 28rpx;">(已选{{chosenNum}})</view>
|
|
<view class="sumbit-btn" @click="commit">提交审阅</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
|
|
|
|
<!-- 筛选表单 -->
|
|
<u-popup :show="showFilter" mode="right" @close="closeFilter" >
|
|
<view style="width: 100%;height: 96vh;position: relative;background-color: #eee;top: 4vh;">
|
|
<view class="search-box">
|
|
<view style="margin: 0 20rpx;"><u-icon name="arrow-left" size="36" @click="closeFilter"></u-icon></view>
|
|
<u-search style="margin-right:20rpx;" :showAction="true" :input-style="inputStyle" :searchIconSize="36" v-model="filterSearch" actionText="搜索" :animation="false" @custom="searchDevices" ></u-search>
|
|
</view>
|
|
<view class="filter-content">
|
|
<!-- 左侧：一级分类 -->
|
|
<scroll-view class="primary" scroll-y>
|
|
<view class="item active">
|
|
<text class="name"> 样品类别 </text>
|
|
</view>
|
|
</scroll-view>
|
|
<!-- 右侧：二级分类 -->
|
|
<scroll-view class="secondary" scroll-y>
|
|
<view v-for="(item, index) in toolsList"
|
|
:key="item.id" class="item" @click="sampleDev = item.name">
|
|
<text class="name"> {{item.name}} </text>
|
|
<u-icon name="checkmark" color="#2979ff" size="32" v-if="sampleDev == item.name"></u-icon>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<view class="submit-box">
|
|
<u-button type="primary" shape="circle" class="submit-btn" @click="handleSearch">查 询</u-button>
|
|
<u-button shape="circle" class="submit-btn" @click="handleReset">重置</u-button>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import { getDetailList,getToolsSelect,commitCheckTestData } from '@/service/url.js';
|
|
import tabHeader from '@/components/tab-Header.vue';
|
|
import eselect from '@/components/eselect.vue';
|
|
import searchSelect from '@/components/search-select.vue';
|
|
import AES from "@/utils/cryptoJs/aes.js";
|
|
export default {
|
|
components: {
|
|
tabHeader,
|
|
eselect,
|
|
searchSelect
|
|
},
|
|
data() {
|
|
return {
|
|
isShowSearch:false,
|
|
searchValue:'',
|
|
filterSearch:'',//筛选弹框-搜索样品类别
|
|
inputStyle:{
|
|
fontSize:'24rpx',//修改搜索框里面的文字大小
|
|
height:'60rpx',
|
|
},
|
|
sampleDev:'',
|
|
toolsList:[],
|
|
showFilter: false,
|
|
testId:'',
|
|
page:1,
|
|
listData:[],
|
|
checkAll:[],
|
|
chosenNum:0,
|
|
};
|
|
},
|
|
onLoad(option) {
|
|
console.log(option)
|
|
this.testId = option.id || '';
|
|
this.getToolsSelect()
|
|
},
|
|
onShow() {
|
|
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) {
|
|
let prevPage = pages[ pages.length - 2 ] //上一个页面的实例
|
|
prevPage.$vm.loadmore()
|
|
uni.navigateBack({
|
|
delta: len - 1 - pages.findIndex(page => page.route === backPage) // 返回到已存在的页面
|
|
});
|
|
}
|
|
},
|
|
//跳转搜索
|
|
searchList(value){//搜索收样记录
|
|
this.page = 1;
|
|
this.listData=[]
|
|
this.chosenNum=0
|
|
this.loadmore()
|
|
},
|
|
// 开关列表搜索框
|
|
openSearch(){
|
|
this.searchValue="";
|
|
this.page = 1;
|
|
this.listData=[]
|
|
this.loadmore()
|
|
this.chosenNum=0;
|
|
this.isShowSearch=!this.isShowSearch;
|
|
},
|
|
//筛选弹框-搜索样品类别
|
|
searchDevices(value){
|
|
this.getToolsSelect()
|
|
},
|
|
//样品类型下拉数据
|
|
getToolsSelect(){
|
|
let obj = {
|
|
"keyWord":this.filterSearch,
|
|
}
|
|
let param = {
|
|
encryptedData: AES.encrypt(JSON.stringify(obj))
|
|
// encryptedData: JSON.stringify(obj)
|
|
}
|
|
this.$http.post(getToolsSelect,param).then(res => {
|
|
if (res) {
|
|
if(res.code == '200'){
|
|
this.toolsList=res.data
|
|
}else{
|
|
this.toolsList=[]
|
|
}
|
|
}
|
|
}).catch(error => {
|
|
console.log(error)
|
|
})
|
|
},
|
|
//筛选确定按钮-开始筛选
|
|
handleSearch(){
|
|
//分页
|
|
this.page = 1;
|
|
this.listData=[]
|
|
this.showFilter=false;
|
|
this.checkAll=[];
|
|
this.chosenNum=0;
|
|
this.loadmore()
|
|
},
|
|
//筛选重置按钮
|
|
handleReset(){
|
|
this.sampleDev = ''
|
|
this.handleSearch()
|
|
},
|
|
//滚动下拉1
|
|
scrolltolower() {
|
|
this.page += 1;
|
|
this.loadmore()
|
|
},
|
|
//列表数据
|
|
loadmore() {
|
|
let obj = {
|
|
"id":this.testId,
|
|
"page":this.page,
|
|
"limit":"10"
|
|
}
|
|
let param = {
|
|
encryptedData: AES.encrypt(JSON.stringify(obj))
|
|
// encryptedData: JSON.stringify(obj)
|
|
}
|
|
this.$http.post(getDetailList,param).then(res => {
|
|
if (res) {
|
|
console.log(res)
|
|
if(res.code == 200){
|
|
if(res.data?.length>0){
|
|
res.data.forEach(item=>{
|
|
item.checked=[];
|
|
})
|
|
if(this.page == 1){
|
|
this.listData = res.data;
|
|
}else{
|
|
this.listData = [...this.listData, ...res.data];
|
|
}
|
|
}else{
|
|
console.log("没有更多了")
|
|
}
|
|
|
|
}
|
|
}
|
|
}).catch(error => {
|
|
console.log(error)
|
|
})
|
|
},
|
|
// 全选
|
|
checkedAll(n){
|
|
if(n.length>0){
|
|
this.chosenNum=0
|
|
this.listData.forEach(item=>{
|
|
if(item.auditStatus==null){
|
|
item.checked=[]
|
|
}else{
|
|
item.checked=[item.id];
|
|
this.chosenNum=this.chosenNum+1
|
|
}
|
|
|
|
})
|
|
// this.chosenNum=this.listData.length;
|
|
}else{
|
|
this.listData.forEach(item=>{
|
|
item.checked=[]
|
|
})
|
|
this.chosenNum=0;
|
|
}
|
|
},
|
|
// 单选
|
|
checkDevice(chosen){
|
|
this.listData.forEach(item=>{
|
|
if(item.id==chosen.id){
|
|
if(chosen.auditStatus==null){
|
|
item.checked=[]
|
|
}else{
|
|
if(item.checked.length==0){
|
|
item.checked=[item.id]
|
|
}else{
|
|
item.checked=[]
|
|
}
|
|
}
|
|
|
|
}
|
|
})
|
|
},
|
|
//编制按钮---进入收样批次样品列表
|
|
goOrganization(item){
|
|
if(item.experId&&item.experId!=""){
|
|
uni.navigateTo({
|
|
url: `/pages/test/organization?experId=${item.experId}&sampleId=${item.sampleId}&devTypeCode=${item.devTypeCode}`
|
|
})
|
|
}else{
|
|
uni.navigateTo({
|
|
url: `/pages/test/organization?sampleId=${item.sampleId}&devTypeCode=${item.devTypeCode}`
|
|
})
|
|
}
|
|
|
|
},
|
|
//查看按钮---进入收样批次样品列表
|
|
viewOrganization(item){
|
|
uni.navigateTo({
|
|
url: `/pages/test/organization?experId=${item.experId}&sampleId=${item.sampleId}&devTypeCode=${item.devTypeCode}&isView=isView`
|
|
})
|
|
},
|
|
//提交审阅
|
|
commit(){
|
|
let arr = [];
|
|
this.listData.forEach(item=>{
|
|
if(item.checked.length>0){
|
|
arr.push(item.experId)
|
|
}
|
|
})
|
|
console.log(arr)
|
|
if(arr.length>0){
|
|
let obj = {
|
|
"id":this.testId,
|
|
"ids":arr,
|
|
}
|
|
let param = {
|
|
encryptedData: AES.encrypt(JSON.stringify(obj))
|
|
// encryptedData: JSON.stringify(obj)
|
|
}
|
|
this.$http.post(commitCheckTestData,param).then(res => {
|
|
if (res) {
|
|
console.log(res)
|
|
if(res.code == 200){
|
|
uni.showToast({
|
|
title: "提交审阅成功",
|
|
icon: "none"
|
|
})
|
|
this.page = 1;
|
|
this.listData=[]
|
|
this.loadmore()
|
|
this.chosenNum=0
|
|
// this.customNavigateBack()
|
|
}
|
|
}
|
|
}).catch(error => {
|
|
console.log(error)
|
|
})
|
|
}else{
|
|
uni.showToast({
|
|
title: "请先勾选试验样品类型！",
|
|
icon: "none"
|
|
})
|
|
}
|
|
|
|
|
|
},
|
|
|
|
//侧边筛选Popup-关闭
|
|
closeFilter() {
|
|
this.showFilter = false
|
|
console.log('closeFilter');
|
|
},
|
|
//侧边筛选Popup-打开
|
|
filter(){
|
|
this.showFilter = true;
|
|
console.log("筛选打开")
|
|
},
|
|
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
/deep/.u-popup .u-slide-right-enter-active{
|
|
left: 0;
|
|
}
|
|
|
|
|
|
.searchInput{
|
|
height: 100%;
|
|
}
|
|
.page-content{
|
|
width: 100%;
|
|
height: 90vh;
|
|
position: absolute;
|
|
top:8.5vh;
|
|
padding: 0rpx 0;
|
|
background-color: #F3F3F3;
|
|
.search{
|
|
width: 90%;
|
|
height: 100rpx;
|
|
padding: 0 5%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background-color: #FFF;
|
|
}
|
|
.main-box{
|
|
width: 100%;
|
|
height: auto;
|
|
.list-box{
|
|
width: 94%;
|
|
height: auto;
|
|
// height: auto;
|
|
overflow: hidden;
|
|
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{
|
|
padding:10rpx 20rpx;
|
|
font-weight: bold;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.item-content{
|
|
width: 100%;
|
|
height: auto;
|
|
border: 1px dashed #E3E9FA;
|
|
font-size: 24rpx;
|
|
|
|
.content-box{
|
|
width: 92%;
|
|
height: auto;
|
|
margin: 20rpx;
|
|
background-color: #F8F9FC;
|
|
padding: 10rpx;
|
|
word-wrap: break-word;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.item-footer{
|
|
width: 100%;
|
|
height: 100rpx;
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.status-box{
|
|
width: 40%;
|
|
height:100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.foot-status{
|
|
height: 48rpx;
|
|
padding: 0 10rpx;
|
|
line-height: 48rpx;
|
|
text-align: center;
|
|
background: #DDEFFF;
|
|
border-radius: 10rpx;
|
|
color: #007DEB;
|
|
font-size: 20rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
.foot-status2{
|
|
height: 48rpx;
|
|
padding: 0 10rpx;
|
|
line-height: 48rpx;
|
|
text-align: center;
|
|
background: #FFE7EB;
|
|
border-radius: 10rpx;
|
|
color: #FC4D72;
|
|
font-size: 20rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
|
|
|
|
.btn-box{
|
|
width: 45%;
|
|
height:100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
|
|
.foot-btn{
|
|
width: 100rpx;
|
|
height: 50rpx;
|
|
line-height: 50rpx;
|
|
text-align: center;
|
|
background: #FFF;
|
|
border-radius: 10rpx;
|
|
color: #5973FD;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
border: 1rpx solid #5973FD;
|
|
margin-right: 20rpx;
|
|
}
|
|
.foot-btn1{
|
|
width: 100rpx;
|
|
height: 50rpx;
|
|
line-height: 50rpx;
|
|
text-align: center;
|
|
background: #5973FD;
|
|
border-radius: 10rpx;
|
|
color: #FFF;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
// border: 2rpx solid #5973FD;
|
|
margin-right: 20rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
.bottom-box{
|
|
width: 100%;
|
|
min-height: 120rpx;
|
|
transition: min-height 0.8s ease;
|
|
background-color: #FFF;
|
|
position: fixed;
|
|
bottom: 0;
|
|
.add-form{
|
|
width: 98%;
|
|
height: auto;
|
|
padding: 10rpx;
|
|
background-color: #FFF;
|
|
border-top-right-radius: 60rpx;
|
|
border-top-left-radius: 60rpx;
|
|
}
|
|
.sumbit-btn{
|
|
width: 160rpx;
|
|
height: 70rpx;
|
|
margin-right: 20rpx;
|
|
line-height: 70rpx;
|
|
text-align: center;
|
|
color: #FFF;
|
|
background: #0052D9;
|
|
position: absolute;right: 20rpx;top: 20rpx;
|
|
border-radius: 10rpx;
|
|
|
|
}
|
|
.open-btn{
|
|
width: 100%;
|
|
height: 40rpx;
|
|
position: absolute;
|
|
top: -30rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
|
|
}
|
|
.visitor-form{
|
|
width: auto;
|
|
padding: 80rpx 20rpx;
|
|
}
|
|
.visitor-input-box{
|
|
|
|
}
|
|
.search-box{
|
|
width: 100%;
|
|
height: 100rpx;
|
|
position: fixed;
|
|
top: 4vh;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
background-color: #FFF;
|
|
}
|
|
.filter-content{
|
|
width: 100%;
|
|
height: 87%;
|
|
position: absolute;
|
|
top: 100rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
}
|
|
.submit-box {
|
|
width: 100%;
|
|
height: 100rpx;
|
|
position: fixed;
|
|
bottom: 0;
|
|
display: flex;
|
|
padding-bottom: 20rpx;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
background-color: #FFF;
|
|
.submit-btn {
|
|
width: 40%;
|
|
margin: 0 auto;
|
|
height: 65rpx;
|
|
font-size: 26rpx;
|
|
// background: linear-gradient( 90deg, #5193FE 0%, #00EEF0 100%);
|
|
box-shadow: 0px 4px 2px 0px rgba(81,147,254,0.15);
|
|
border-radius: 32rpx;
|
|
}
|
|
.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);
|
|
}
|
|
}
|
|
/* 一级分类 */
|
|
.primary {
|
|
overflow: hidden;
|
|
height: 100%;
|
|
width: 24%;
|
|
flex: none;
|
|
background-color: #f6f6f6;
|
|
|
|
.item {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 96rpx;
|
|
font-size: 26rpx;
|
|
color: #0052D9;
|
|
font-weight: 600;
|
|
position: relative;
|
|
background-color: #FFF;
|
|
&::after {
|
|
content: '';
|
|
position: absolute;
|
|
left: 42rpx;
|
|
bottom: 0;
|
|
width: 96rpx;
|
|
border-top: 1rpx solid #e3e4e7;
|
|
}
|
|
}
|
|
.active {
|
|
background-color: #fff;
|
|
&::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 24rpx;
|
|
width: 10rpx;
|
|
height: 50%;
|
|
background-color: #0052D9;
|
|
border-radius: 10rpx; }
|
|
}
|
|
}
|
|
.primary .item:last-child::after,
|
|
.primary .active::after {
|
|
display: none;
|
|
}
|
|
.secondary{
|
|
overflow: hidden;
|
|
height: 100%;
|
|
width: 80%;
|
|
background-color: #fff;
|
|
.item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 96rpx;
|
|
font-size: 26rpx;
|
|
padding: 0 50rpx;
|
|
position: relative;
|
|
|
|
&::after {
|
|
content: '';
|
|
position: absolute;
|
|
left: 42rpx;
|
|
bottom: 0;
|
|
width: 96rpx;
|
|
// border-top: 1rpx solid #e3e4e7;
|
|
}
|
|
}
|
|
.active {
|
|
background-color: #fff;
|
|
&::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 8rpx;
|
|
height: 50%;
|
|
// background-color: #27ba9b;
|
|
}
|
|
}
|
|
}
|
|
|
|
.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: 26vh;
|
|
background-color: #fff;
|
|
}
|
|
|
|
</style>
|