试验管理列表
This commit is contained in:
parent
92d6117314
commit
765d2e3a50
|
|
@ -0,0 +1,712 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="topTab">
|
||||
<view class="tab-header">
|
||||
<view class="left" >
|
||||
<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" @click="goCollectDetail(item)">
|
||||
<view class="header-name">
|
||||
{{item.customName}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-content" >
|
||||
<view class="content-box" @click="goCollectDetail(item)">
|
||||
<view class="item-text" >
|
||||
<image class="iconImg" src="../../static/images/time.png" alt="">
|
||||
<text class="label">派工时间：</text>
|
||||
<text class="info">{{item.dispatchTime}}</text>
|
||||
</view>
|
||||
<view class="item-text">
|
||||
<image class="iconImg" src="../../static/images/number.png" alt="">
|
||||
<text class="label">批次编号：</text>
|
||||
<text class="info">{{item.batchCode}}</text>
|
||||
</view>
|
||||
<view class="item-text">
|
||||
<image class="iconImg" src="../../static/images/device.png" alt="">
|
||||
<text class="label">送样设备：</text>
|
||||
<text class="info">{{item.sampleDev}}</text>
|
||||
</view>
|
||||
<view class="item-text">
|
||||
<image class="iconImg" src="../../static/images/number2.png" alt="">
|
||||
<text class="label">送样数量：</text>
|
||||
<text class="info">{{item.customNum}}</text>
|
||||
</view>
|
||||
<view class="item-text">
|
||||
<image class="iconImg" src="../../static/images/team.png" alt="">
|
||||
<text class="label">试验班组：</text>
|
||||
<text class="info">{{item.teamName}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="item-footer">
|
||||
<view class="foot-status" v-if="!item.teamName">未派工</view>
|
||||
<view class="foot-btn" v-if="!item.teamName" @click="sentTeam(item)">派工</view>
|
||||
|
||||
</view> -->
|
||||
</view>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
</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">
|
||||
<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 { getTestList,getToolsSelect,getCustomNameSelected } 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:[],
|
||||
item:{
|
||||
id:'111111122222222',
|
||||
name1:"国网安徽省电力公司宿州市埇桥区供电公司解集供电所",
|
||||
name2:"2024-7-10",
|
||||
name3:"安全帽、白棕绳、测距杆、登高板、安全带",
|
||||
name4:"P20240730-01",
|
||||
name5:"人脸验证已通过！",
|
||||
state:'1'
|
||||
},
|
||||
options: [{
|
||||
value: "1",
|
||||
label: "国网1111"
|
||||
}, {
|
||||
value: "2",
|
||||
label: "国网2222",
|
||||
}, {
|
||||
value: "3",
|
||||
label: "国网3333",
|
||||
}, {
|
||||
value: "4",
|
||||
label: "国网4444",
|
||||
}],
|
||||
showFilter: false,
|
||||
// 新增收样
|
||||
addPopup: false,
|
||||
customerList:[],
|
||||
addForm:{
|
||||
customName:'',
|
||||
customId:'',
|
||||
sampleUser:'',
|
||||
sampleTime:''
|
||||
},
|
||||
showDate: false,
|
||||
showDept: false,
|
||||
rules: {
|
||||
'customName': {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择单位',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
'sampleTime': {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择日期',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
},
|
||||
// 修改收样
|
||||
editPopup: false,
|
||||
editForm:{
|
||||
customName:'',
|
||||
customId:'',
|
||||
sampleUser:'',
|
||||
sampleTime:''
|
||||
},
|
||||
showDate2: false,
|
||||
showDept2: false,
|
||||
eRules: {
|
||||
'customName': {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择单位',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
'sampleTime': {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择日期',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
},
|
||||
page:1,
|
||||
page1:1,
|
||||
listData:[],
|
||||
listData1:[],
|
||||
showTeam: false,//派工班组picked组件
|
||||
teamList:[],//班组下拉数据
|
||||
sentData:{},//派工数据对象
|
||||
editData:{},//修改数据对象
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.getToolsSelect()
|
||||
this.getCustomNameSelected()
|
||||
},
|
||||
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) {
|
||||
uni.navigateBack({
|
||||
delta: len - 1 - pages.findIndex(page => page.route === backPage) // 返回到已存在的页面
|
||||
});
|
||||
}
|
||||
},
|
||||
//跳转搜索
|
||||
searchList(value){//搜索收样记录
|
||||
this.page = 1;
|
||||
this.listData=[]
|
||||
this.page1 = 1;
|
||||
this.listData1=[]
|
||||
this.loadmore()
|
||||
},
|
||||
openSearch(){
|
||||
this.searchValue="";
|
||||
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.page1 = 1;
|
||||
this.listData1=[]
|
||||
this.showFilter=false
|
||||
this.loadmore()
|
||||
},
|
||||
//筛选重置按钮
|
||||
handleReset(){
|
||||
this.sampleDev = ''
|
||||
this.handleSearch()
|
||||
},
|
||||
//滚动下拉1
|
||||
scrolltolower() {
|
||||
this.page += 1;
|
||||
this.loadmore()
|
||||
},
|
||||
//滚动下拉2
|
||||
scrolltolower1() {
|
||||
this.page1 += 1;
|
||||
this.loadmore()
|
||||
},
|
||||
//列表数据
|
||||
loadmore() {
|
||||
let obj = {
|
||||
"keyWord":this.searchValue,
|
||||
"sampleDev":this.sampleDev,
|
||||
"page":this.page,
|
||||
"limit":"10"
|
||||
}
|
||||
let param = {
|
||||
// encryptedData: AES.encrypt(JSON.stringify(obj))
|
||||
encryptedData: JSON.stringify(obj)
|
||||
}
|
||||
this.$http.post(getTestList,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)
|
||||
})
|
||||
// for (let i = 0; i < 15; i++) {
|
||||
// this.listData.push(
|
||||
// this.item
|
||||
// )
|
||||
// }
|
||||
// console.log(this.listData)
|
||||
},
|
||||
//进入收样批次设备列表
|
||||
goCollectDetail(item){
|
||||
uni.navigateTo({
|
||||
url: `/pages/samples/collectDevices?id=${item.id}&customName=${item.customName}&customId=${item.customId}&batchCode=${item.batchCode}`
|
||||
})
|
||||
},
|
||||
//新增收样-关闭
|
||||
closeAdd() {
|
||||
this.addPopup = false
|
||||
},
|
||||
// 获取送样单位
|
||||
getCustomNameSelected(){
|
||||
let obj = {}
|
||||
this.$http.post(getCustomNameSelected,{}).then(res => {
|
||||
if (res) {
|
||||
if(res.code == '200'){
|
||||
this.customerList.push(res.data);
|
||||
}else{
|
||||
this.customerList=[]
|
||||
}
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
},
|
||||
//侧边筛选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;
|
||||
}
|
||||
.tab-box {
|
||||
overflow: hidden;
|
||||
height: 100upx;
|
||||
background-color: #FFF;
|
||||
.tab-item {
|
||||
float: left;
|
||||
height: 70upx;
|
||||
width: 48%;
|
||||
font-size: 30upx;
|
||||
line-height: 70upx;
|
||||
text-align: center;
|
||||
}
|
||||
.active {
|
||||
color: #0052D9;
|
||||
border-radius: 10upx 10upx 0 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
.activeLine{
|
||||
background: #0052D9;
|
||||
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{
|
||||
padding:20rpx;
|
||||
// word-wrap: break-word;
|
||||
line-height: 40rpx;
|
||||
font-weight: bold;
|
||||
|
||||
}
|
||||
|
||||
.item-content{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px dashed #E3E9FA;
|
||||
font-size: 24rpx;
|
||||
|
||||
.content-box{
|
||||
width: 94%;
|
||||
height: auto;
|
||||
margin: 20rpx;
|
||||
// background-color: #F8F9FC;
|
||||
padding: 20rpx 0;
|
||||
|
||||
.item-text{
|
||||
width: 95%;
|
||||
margin-left: 20rpx;
|
||||
margin-top: 15rpx;
|
||||
// display: flex;
|
||||
align-items: center;
|
||||
|
||||
.iconImg{
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.label{
|
||||
color: #3A3A3A;
|
||||
font-weight: 500;
|
||||
}
|
||||
.info{
|
||||
color: #6F6F6F;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.item-footer{
|
||||
width: 100%;
|
||||
height: 72rpx;
|
||||
position: relative;
|
||||
.foot-status{
|
||||
width: 80rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
left: 5%;
|
||||
top: 20%;
|
||||
background: #DDEFFF;
|
||||
border-radius: 10rpx;
|
||||
color: #007DEB;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
.foot-status2{
|
||||
width: 80rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
right: 5%;
|
||||
top: 20%;
|
||||
background: #DDEFFF;
|
||||
border-radius: 10rpx;
|
||||
color: #007DEB;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
.foot-btn{
|
||||
width: 100rpx;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
right: 5%;
|
||||
top: 20%;
|
||||
background: #F2F3FF;
|
||||
border-radius: 10rpx;
|
||||
color: #0052D9;
|
||||
font-weight: bold;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.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: 0;
|
||||
width: 8rpx;
|
||||
height: 100%;
|
||||
background-color: #27ba9b;
|
||||
}
|
||||
}
|
||||
}
|
||||
.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>
|
||||
Loading…
Reference in New Issue