lanan-repair-app/components/inWareCard.vue

476 lines
9.6 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 class="orderCard">
<view class="order-top">
<view class="orderNo">
入库单号{{ order.id }}
</view>
</view>
<view class="order-body">
<view v-if="goodsList && goodsList.length > 0" class="card cardInfo projCard" style="width: 100%">
<view class="projTitle">配件信息</view>
<view class="projList">
<template>
<view v-for="item in goodsList" :key="item.id" class="projEditItem">
<view class="projEditLine1">
<text>{{ item.repairWares.name }}</text>
</view>
<view class="projBaseInfo">
<view>单价:{{ item.goodsPrice || "" }}</view>
<view>入库数量:{{ item.inCount || "" }}</view>
</view>
</view>
</template>
</view>
</view>
<view class="baseInfo">
<view>
入库时间:{{ soTime }}
</view>
<view>
入库人:{{ order.userName }}
</view>
</view>
<!-- <view class="footer">-->
<!-- <view @click="gotoInWare" class="btn pg" style="margin-right: 40rpx">-->
<!-- &lt;!&ndash; 在什么都不能操作的情况下,可以查看详情&ndash;&gt;-->
<!-- 查看入库单-->
<!-- </view>-->
<!-- <view @click="gotoDetail" class="btn pg">-->
<!-- &lt;!&ndash; 在什么都不能操作的情况下可以查看详情&ndash;&gt;-->
<!-- 入库-->
<!-- </view>-->
<!-- </view>-->
</view>
</view>
</template>
<script>
import {
getUserInfo,
getStrData
} from '@/utils/auth';
import request from '@/utils/request';
import {formatTimestamp, getDictTextByCodeAndValue} from "@/utils/utils";
export default {
name: "repairSoCard",
props: {
order: {
type: Object,
default: () => {
return {}
}
}
},
computed: {
},
data() {
return {
soStatusText:'',
soiIds:[],
soTime:'',
goodsList:[]
}
},
mounted() {
// this.getDictTextByCodeAndValue(this.order.soStatus); // 组件加载时调用方法
this.getSoiDetail()
},
onLoad() {
},
methods: {
getSoiDetail(){
request({
url: '/admin-api/repair/so/get',
method: 'get',
params: {
id: this.order.id
}
}).then(res => {
res.data.goodsList.forEach(item => {
this.soiIds.push(item.id)
})
this.soTime = formatTimestamp(res.data.updateTime)
if (this.soiIds.length > 0) {
console.log('返回', res.data)
request({
url: '/admin-api/repair/soi/get',
method: 'get',
params: {
ids: this.soiIds.join(',')
}
}).then((res) => {
this.goodsList = res.data
})
}
})
},
/**
* 项目派工
*/
projectDis() {
uni.navigateTo({
url: '/pages-order/choosePeople/choosePeople?id=' + this.order.id
})
}
},
getStatus() {
}
}
</script>
<style lang="less" scoped>
.orderCard {
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border-left: 4rpx solid #FFB323;
padding: 0 30rpx;
margin: 15rpx 0;
}
.order-top {
padding: 20rpx 0;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #F3F5F7;
.orderNo {
font-weight: 500;
font-size: 24rpx;
color: #858BA0;
}
.flag {
font-family: PingFang SC, PingFang SC;
font-weight: 500;
font-size: 24rpx;
}
}
.order-body {
.card {
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
margin: 20rpx 0;
}
.projCard {
padding-bottom: 30rpx;
.projList {
//padding: 0 30rpx;
display: flex;
flex-direction: column;
gap: 20rpx;
margin-top: 20rpx;
.projItem {
background: #FFFFFF;
border-radius: 4rpx 4rpx 4rpx 4rpx;
border: 2rpx solid #DDDDDD;
padding: 0 20rpx;
.projTop {
padding: 20rpx 0;
border-bottom: 1rpx solid #DDDDDD;
display: flex;
align-items: center;
justify-content: space-between;
font-weight: 500;
font-size: 28rpx;
color: #333333;
.projAmount {
font-weight: bold;
color: #0174F6;
}
}
.projBody {
padding-bottom: 20rpx;
.projDate {
font-weight: 500;
font-size: 24rpx;
color: #858BA0;
display: flex;
align-items: center;
column-gap: 10rpx;
padding: 20rpx 0;
}
.projDesc {
font-weight: 500;
font-size: 24rpx;
color: #858BA0;
}
.projImg {
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fill, 120rpx);
justify-content: space-between;
gap: 20rpx;
padding: 20rpx 0;
.projImgItem {
width: 120rpx;
height: 120rpx;
background-color: #efefef;
}
}
.projSend {
display: flex;
align-items: center;
font-weight: 500;
font-size: 28rpx;
column-gap: 8rpx;
}
}
}
.projEditItem {
padding: 0 20rpx;
background: #F2F2F7;
border-radius: 4rpx 4rpx 4rpx 4rpx;
.projEditLine1 {
display: flex;
align-items: center;
justify-content: space-between;
font-weight: 500;
font-size: 28rpx;
color: #333333;
padding: 30rpx 0;
.projAmount {
color: #0174F6;
}
}
.projBaseInfo {
display: grid;
grid-template-columns: 1fr 1fr;
font-size: 24rpx;
color: #999999;
gap: 20rpx;
margin-bottom: 20rpx;
}
.projEditFoot {
padding: 30rpx 0;
border-top: 1px solid #DDDDDD;
display: flex;
align-items: center;
column-gap: 10rpx;
.block1, .block2 {
flex: 1;
width: 0;
display: flex;
align-items: center;
justify-content: center;
column-gap: 8rpx;
font-size: 28rpx;
color: #0174F6;
line-height: 28rpx;
.editPeople {
flex: 1;
width: 0;
display: flex;
justify-content: space-between;
align-items: center;
.editForm {
display: flex;
flex-direction: column;
row-gap: 10rpx;
font-size: 28rpx;
color: #333333;
.label {
font-size: 24rpx;
color: #999999;
}
}
}
}
.line {
height: 28rpx;
width: 2rpx;
background-color: #DDDDDD;
}
}
}
}
}
.cardInfo {
.noReviewPart {
padding: 10rpx 36rpx 10rpx 36rpx;
display: flex;
align-items: center;
column-gap: 10rpx;
margin-top: 10rpx;
background: #FFF6E7;
border-radius: 4rpx 4rpx 4rpx 4rpx;
font-weight: 500;
font-size: 28rpx;
color: #E8A321;
.messageText {
flex: 1;
width: 0;
}
}
&.none {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
.cardNoneIcon {
width: 336rpx;
}
.btn {
position: absolute;
bottom: 40rpx;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
column-gap: 10rpx;
font-weight: 500;
font-size: 28rpx;
color: #0174F6;
}
}
}
.carNum {
margin: 20rpx 0;
}
.carModel {
margin: 20rpx 0;
font-weight: 500;
font-size: 28rpx;
color: #858BA0;
}
.project {
padding: 20rpx 10rpx;
background: #F2F2F7;
border-radius: 4rpx 4rpx 4rpx 4rpx;
display: flex;
align-items: center;
.project-left {
flex: 1;
width: 0;
}
.project-right {
padding: 0 16rpx;
display: flex;
flex-direction: column;
align-items: center;
border-left: 1rpx solid #DDDDDD;
.rightIcon {
width: 40rpx;
height: 40rpx;
}
.rightText {
font-weight: 500;
font-size: 24rpx;
color: #17DBB1;
}
}
.title {
font-weight: 500;
font-size: 24rpx;
color: #0174F6;
display: flex;
align-items: center;
column-gap: 8rpx;
}
.titleIcon {
width: 24rpx;
height: 24rpx;
}
.desc {
font-weight: 500;
font-size: 24rpx;
color: #333333;
margin-top: 10rpx;
}
}
.baseInfo {
font-weight: 500;
font-size: 28rpx;
color: #858BA0;
padding-bottom: 10rpx;
& > view {
margin: 30rpx 0;
}
}
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
column-gap: 10rpx;
padding-bottom: 30rpx;
.btn {
width: 172rpx;
height: 60rpx;
border-radius: 30rpx 30rpx 30rpx 30rpx;
border: 2rpx solid #0174F6;
display: flex;
align-items: center;
justify-content: center;
font-weight: 500;
font-size: 28rpx;
color: #0174F6;
&.qc {
background: #0174F6;
color: #fff;
}
}
}
}
</style>