lanan-repair-app/pages-home/service/todoDetail.vue

296 lines
6.5 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="container">
<VNavigationBar background-color="#fff" :title="title" title-color="#333"></VNavigationBar>
<view class="body">
<view class="repairInfo">
<view class="header">
配件信息
</view>
<view class="repairItem" v-for="(item, index) in repairList" :key="index">
<view class="repairName">{{ item.waresName }} <text class="repairNum">×{{item.waresCount}}</text></view>
<view class="grid">
<view style="grid-area: a" class="girdItem">
<text class="label">配件分类</text>
<text class="value">{{ item.typeName }}</text>
</view>
<view style="grid-area: b" class="girdItem">
<text class="label">当前库存</text>
<text class="value">{{ item.wares.stock }}</text>
</view>
<view style="grid-area: c" class="girdItem">
<text class="label">单位</text>
<text class="value">{{ item.wares.unit }}</text>
</view>
<!-- <view style="grid-area: d" class="girdItem">-->
<!-- <text class="label">编码</text>-->
<!-- <text class="value">{{ item.wares.code || ""}}</text>-->
<!-- </view>-->
<view style="grid-area: d" class="girdItem">
<text class="label">售价</text>
<text class="value" ><input type="number" placeholder="请输入售价" v-model="item.wares.price" /></text>
</view>
</view>
</view>
</view>
</view>
<view v-if="canOperate" class="footer">
<view class="no" @click="confirmOpe('no')">
{{ backText }}
</view>
<view class="yes" @click="confirmOpe('yes')">
{{ yesText }}
</view>
</view>
</view>
</template>
<script>
import VNavigationBar from "@/components/VNavigationBar.vue";
import request from '@/utils/request';
import {getDictTextByCodeAndValue} from "@/utils/utils";
export default {
components: {
VNavigationBar
},
data() {
return {
viewType:"",
id:"",
title:"",
canOperate:false,
backText:"",
yesText:"",
repairList: [
// {
// name: '7字小钩',
// num: 3,
// type: '机电',
// unit: '桶',
// total: 35,
// code: 'XCQHCJYS7 SPI SP 5W30 4L'
// },
// {
// name: '7字小钩',
// num: 3,
// type: '机电',
// unit: '桶',
// total: 35,
// code: 'XCQHCJYS7 SPI SP 5W30 4L'
// }
]
};
},
onLoad(data){
this.canOperate = data.canOperate
this.id = data.id
this.getDetail()
},
methods:{
getDetail(){
let url;
let params={};
this.title = "配件申请单详情"
//配件申请单
url = "/admin-api/repair/twi/list"
params.twId = this.id
this.yesText="审批通过"
this.backText="驳回"
request({
url: url,
method: 'get',
params:params
}).then((res) => {
if (res.code == 200) {
this.repairList = res.data
}
})
},
confirmOpe(type){
let forSign = true
this.repairList.map(item=>{
if (item.wares.price == null || item.wares.price == ''){
uni.showToast({
title: '售价不能为空!',
icon: 'none'
})
forSign = false
return;
}
})
if (!forSign) {
return;
}
let url = '/admin-api/repair/tw/audit'
let dataObj={
id:this.id,
type:"01",
status:"yes"==type?"02":"05"
}
dataObj.repairWaresList = [...this.repairList.map(item => {
return{
id:item.id,
price:item.wares.price
}
})]
request({
url: url,
method: 'POST',
data:dataObj
}).then((res) => {
if (res.code == 200) {
uni.showToast({
title: '审批成功!',
icon: 'none'
})
setTimeout(() => {
uni.navigateBack()
}, 700)
}
})
},
}
}
</script>
<style lang="less" scoped>
.container {
height: 100%;
background: #F3F5F7;
display: flex;
flex-direction: column;
}
.body {
flex: 1;
height: 0;
overflow: auto;
.todoInfo {
margin: 20rpx 32rpx;
background-color: #fff;
border-radius: 8rpx 8rpx 8rpx 8rpx;
padding: 30rpx;
.todoName {
font-weight: bold;
font-size: 32rpx;
color: #333333;
margin-bottom: 16rpx;
}
.todoDate {
font-size: 24rpx;
color: #858BA0;
margin-bottom: 30rpx;
}
.line {
height: 1rpx;
background-color: #DDDDDD;
margin: 30rpx 0;
}
.grid {
display: grid;
grid-template-areas:
'a b'
'c c';
gap: 20rpx;
.gridItem {
display: flex;
flex-direction: column;
row-gap: 10rpx;
font-size: 28rpx;
.gridItemLabel {
color: #858BA0;
}
.gridItemValue {
color: #333333;
}
}
}
}
.repairInfo {
margin: 20rpx 32rpx;
background-color: #fff;
border-radius: 8rpx 8rpx 8rpx 8rpx;
.header {
padding: 30rpx;
border-bottom: 1rpx solid #DDDDDD;
}
.repairItem {
padding: 30rpx;
border-bottom: 1rpx solid #DDDDDD;
&:last-child {
border-bottom: none;
}
}
.repairName {
display: flex;
align-items: center;
column-gap: 20rpx;
font-size: 32rpx;
color: #333333;
margin-bottom: 30rpx;
.repairNum {
font-size: 28rpx;
color: #0174F6;
}
}
.grid {
display: grid;
grid-template-areas:
'a b'
'c d';
grid-template-columns: 1fr 1fr;
gap: 30rpx;
.girdItem {
display: flex;
flex-direction: column;
row-gap: 12rpx;
font-size: 28rpx;
.label {
color: #858BA0;
}
.value {
color: #333333;
}
}
}
}
}
.footer {
background-color: #fff;
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx 32rpx;
.yes, .no {
width: 310rpx;
height: 76rpx;
border-radius: 38rpx 38rpx 38rpx 38rpx;
display: flex;
align-items: center;
justify-content: center;
column-gap: 10rpx;
}
.yes {
background: #0174F6;
color: #FFFFFF;
}
.no {
border: 2rpx solid #858BA0;
color: #858BA0;
}
}
</style>