227 lines
7.9 KiB
Vue
227 lines
7.9 KiB
Vue
<template>
|
|
<view class="accept page-common">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<span class="title">任务信息</span>
|
|
</div>
|
|
<uni-forms :model="taskInfo" label-width="160rpx" :border="true">
|
|
<uni-forms-item label="退料单位：" name="unitName">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ taskInfo.unitName }}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="退料工程：" name="proName">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ taskInfo.proName }}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="退料单号：" name="code">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ taskInfo.code }}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="退料人员：" name="backPerson">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ taskInfo.backPerson }}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="退料电话：" name="phone">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ taskInfo.phone }}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="创建人员：" name="backPerson">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ detailInfo.createBy }}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="创建时间：" name="phone">
|
|
<span style="height: 100%;display: flex;align-items: center;">{{ detailInfo.createTime }}</span>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
</div>
|
|
<div class="card" style="margin-top: 20px;">
|
|
<div>退料物资</div>
|
|
<div style="width: 92%;height: auto;margin: 10px;">
|
|
<uni-table border stripe emptyText="暂无更多数据" >
|
|
<!-- 表头行 -->
|
|
<uni-tr>
|
|
<uni-th width="100px" style="font-size: 24rpx;" align="center">类型名称</uni-th>
|
|
<uni-th width="100px" style="font-size: 24rpx;" align="center">规格型号</uni-th>
|
|
<uni-th width="80px" style="font-size: 24rpx;" align="center">在用数</uni-th>
|
|
<uni-th width="80px" style="font-size: 24rpx;" align="center">退料数</uni-th>
|
|
<uni-th width="100px" style="font-size: 24rpx;" align="center">外观</uni-th>
|
|
</uni-tr>
|
|
<!-- 表格数据行 -->
|
|
<uni-tr v-for="(item,index) in typeList" :key="item.id">
|
|
<uni-td style="font-size: 24rpx;text-align: center;">{{item.typeName}}</uni-td>
|
|
<uni-td style="font-size: 24rpx;text-align: center;">{{item.typeModel}}</uni-td>
|
|
<uni-td style="font-size: 24rpx;text-align: center;">{{item.num}}</uni-td>
|
|
<uni-td style="font-size: 24rpx;text-align: center;">
|
|
<span>{{item.preNum}}</span>
|
|
</uni-td>
|
|
<uni-td style="font-size: 24rpx;text-align: center;">
|
|
<span>{{item.apDetection}}</span>
|
|
</uni-td>
|
|
</uni-tr>
|
|
</uni-table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- <div class="btn"> -->
|
|
<!-- <button class="btn-cont" @click="reject">取消</button> -->
|
|
<!-- <button class="btn-cont">确认</button> -->
|
|
<!-- </div> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, reactive } from 'vue'
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import { getDetailsByIdApi } from '../../services/back.js';
|
|
const taskInfo = ref({})
|
|
const rowData = ref({})
|
|
const typeList = ref([])
|
|
const detailInfo = ref({})
|
|
//获取明细
|
|
const getDetails = async () => {
|
|
let param={
|
|
parentId:rowData.value.parentId,
|
|
typeId:rowData.value.typeId
|
|
}
|
|
const res = await getDetailsByIdApi(param)
|
|
detailInfo.value=res.data[0]
|
|
}
|
|
|
|
|
|
onLoad((options)=>{
|
|
console.log(options)
|
|
taskInfo.value = JSON.parse(options.taskInfo)
|
|
console.log(taskInfo.value)
|
|
rowData.value = JSON.parse(options.rowData)
|
|
console.log(rowData.value)
|
|
typeList.value = [rowData.value]
|
|
console.log(typeList.value)
|
|
getDetails()
|
|
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.accept {
|
|
padding: 24rpx;
|
|
height: 100vh;
|
|
word-break: break-all;
|
|
background-color: #f7f8fa;
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
// 卡片样式
|
|
.card {
|
|
padding: 32rpx;
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
|
margin-bottom: 24rpx;
|
|
|
|
// 卡片标题
|
|
> div:first-child {
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
color: #262626;
|
|
margin-bottom: 24rpx;
|
|
position: relative;
|
|
padding-left: 24rpx;
|
|
|
|
&::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
width: 6rpx;
|
|
height: 28rpx;
|
|
background: #3784fb;
|
|
border-radius: 6rpx;
|
|
}
|
|
}
|
|
|
|
// 表单样式
|
|
:deep(.uni-forms) {
|
|
.uni-forms-item {
|
|
padding: 24rpx 0;
|
|
margin-bottom: 0;
|
|
border-bottom: 2rpx solid #f5f5f5;
|
|
|
|
&:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.uni-forms-item__label {
|
|
color: #8c8c8c;
|
|
}
|
|
|
|
span {
|
|
color: #262626;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
// // 表格区域
|
|
// :deep(.uni-table) {
|
|
// margin: 24rpx -32rpx 0;
|
|
// width: calc(100% + 64rpx);
|
|
|
|
// .uni-table-tr {
|
|
// .uni-table-th {
|
|
// padding: 20rpx 16rpx;
|
|
// font-size: 26rpx;
|
|
// color: #8c8c8c;
|
|
// background-color: #f7f8fa;
|
|
// border-right: 2rpx solid #f0f0f0;
|
|
// border-bottom: 2rpx solid #f0f0f0;
|
|
|
|
// &:last-child {
|
|
// border-right: none;
|
|
// }
|
|
// }
|
|
|
|
// .uni-table-td {
|
|
// padding: 20rpx 16rpx;
|
|
// font-size: 26rpx;
|
|
// color: #262626;
|
|
// border-right: 2rpx solid #f0f0f0;
|
|
// border-bottom: 2rpx solid #f0f0f0;
|
|
|
|
// &:last-child {
|
|
// border-right: none;
|
|
// }
|
|
|
|
// span {
|
|
// display: block;
|
|
// text-align: center;
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
}
|
|
|
|
// 底部按钮
|
|
.btn {
|
|
margin-top: auto;
|
|
padding: 32rpx;
|
|
background: #fff;
|
|
box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05);
|
|
|
|
.btn-cont {
|
|
width: 100%;
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
text-align: center;
|
|
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
|
color: #fff;
|
|
border-radius: 44rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
|
transition: all 0.3s ease;
|
|
|
|
&:active {
|
|
transform: scale(0.98);
|
|
opacity: 0.9;
|
|
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|