150 lines
4.2 KiB
Vue
150 lines
4.2 KiB
Vue
<script setup lang="ts">
|
||
import { ref } from 'vue';
|
||
import { getAction } from '../../common/http';
|
||
import { formatDate } from '../../utils/date';
|
||
|
||
const list = ref([] as any[])
|
||
const form = ref({} as any)
|
||
|
||
const init=()=>{
|
||
list.value=[]
|
||
getAction('/tracking/op',{...form.value}).then((res:any)=>{
|
||
if(res.code===200){
|
||
res.data.forEach((l:any)=>{
|
||
if(l.logs.length>0){
|
||
l.trackingLog.yjccrq=addDaysToDate(l.logs[0].details.form.czrq , l.logs[0].details.form.yjccts)
|
||
if(l.logs.length>1&&l.logs[l.logs.length-1].details.zt!='已出厂'){
|
||
l.trackingLog.yjxybrq=l.logs[l.logs.length-1].details.form.yjxybrq
|
||
}else{
|
||
l.trackingLog.yjxybrq='暂无'
|
||
}
|
||
}else{
|
||
l.trackingLog.yjccrq='暂无'
|
||
}
|
||
list.value.push(l.trackingLog)
|
||
})
|
||
}
|
||
})
|
||
}
|
||
|
||
const secarch = () =>{
|
||
init()
|
||
}
|
||
|
||
const onClickLeft = () => {
|
||
history.back()
|
||
}
|
||
|
||
const zms = (xxs:any) =>{
|
||
let ms=0
|
||
xxs.forEach((l:any)=>{
|
||
ms+=l.ms*1
|
||
})
|
||
return ms.toFixed(1)
|
||
}
|
||
//日期差
|
||
function dateDiffInDays(date1:any, date2:any) {
|
||
// 将日期字符串转换为 Date 对象
|
||
const dt1 = new Date(date1);
|
||
const dt2 = new Date(date2);
|
||
|
||
// 计算时间差（以毫秒为单位）
|
||
const timeDifference = dt2 - dt1;
|
||
|
||
// 将时间差转换为天数
|
||
const daysDifference = timeDifference / (1000 * 3600 * 24);
|
||
|
||
// 返回绝对值，因为结果可能是负数，取决于哪个日期更早
|
||
return Math.abs(Math.round(daysDifference));
|
||
}
|
||
function addDaysToDate(date:any, days:any) {
|
||
// 将传入的 date 转换为 Date 对象
|
||
const result = new Date(date);
|
||
|
||
// 设置时间为0点，以避免时区影响
|
||
result.setHours(0, 0, 0, 0);
|
||
|
||
// 增加天数
|
||
result.setDate(result.getDate() + days);
|
||
|
||
// 返回新的日期
|
||
return formatDate(result);
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="flex">
|
||
<van-nav-bar title="订单状态查询" left-text="返回" left-arrow @click-left="onClickLeft" />
|
||
<view style="display: flex;align-items: center;">
|
||
<van-field class="bor" label="谁定" label-width="2.5em" colon v-model="form.sd" />
|
||
<van-field class="bor" label="做单人" label-width="3.5em" colon v-model="form.makeUser" />
|
||
<view style="width: 20%;margin-right: 5rpx;">
|
||
<van-button type="primary" style="width: 3rem;" @click="secarch">搜索</van-button>
|
||
</view>
|
||
</view>
|
||
<view class="content">
|
||
<view class="card" v-for="(item,index) in list">
|
||
<view class="grid-container">
|
||
<view class="grid-item">进厂日期：{{formatDate(new Date(item.createTime))}}</view>
|
||
<view class="grid-item" style="text-align: end;">当前进度：<text style="color: red;">{{item.zt}}</text></view>
|
||
<view class="grid-item">百合白，{{item.sd}}定</view>
|
||
<view class="grid-item" style="text-align: center;">做单人：{{item.makeUser}}</view>
|
||
<template v-for="(itemSecond,indexSecond) in item.mls">
|
||
<view class="grid-item">{{itemSecond.mz}}</view>
|
||
<view class="grid-item" style="text-align: center;">约{{zms(itemSecond.xxs)}}米~{{itemSecond.xxs.length}}匹</view>
|
||
</template>
|
||
<view class="grid-item">在厂天数：{{dateDiffInDays(item.createTime,new Date())}}天</view>
|
||
<view class="grid-item" style="text-align: center;">预计出厂日期：{{item.yjccrq}}</view>
|
||
<view class="grid-item">当前进度：{{item.zt}}</view>
|
||
<view class="grid-item" style="text-align: center;">当前操作日期：{{formatDate(new Date(item.updateTime))}}</view>
|
||
<view class="grid-item"></view>
|
||
<view class="grid-item" style="text-align: center;">预计下一步日期：{{item.yjxybrq}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
.flex {
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: 100vh;
|
||
width: 100vw;
|
||
overflow-y: hidden;
|
||
background-color: #fcfcfc;
|
||
}
|
||
|
||
.content {
|
||
flex: 1;
|
||
overflow-y: scroll;
|
||
}
|
||
|
||
.bor {
|
||
::v-deep .van-field__control {
|
||
border-bottom: 1px solid #d7d7d7;
|
||
}
|
||
}
|
||
|
||
::v-deep .van-button--normal {
|
||
padding: 5px 8px;
|
||
height: 30px;
|
||
}
|
||
::v-deep .van-cell{
|
||
background-color: #fcfcfc;
|
||
}
|
||
|
||
.grid-container {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
font-size: 14px;
|
||
.grid-item{
|
||
padding: 10rpx 0;
|
||
}
|
||
}
|
||
.card{
|
||
background-color: #fff;
|
||
padding: 5rpx 15rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
</style> |