135 lines
2.8 KiB
Vue
135 lines
2.8 KiB
Vue
<template>
|
|
<div v-if="show" style="width:100%;height:100%;background: #F1F5F9;;display: flex;align-items: center;justify-content: center">
|
|
<img src="@/assets/empty.png" style="width:65%;">
|
|
</div>
|
|
<div class="wrap" v-else>
|
|
<ul id="dataList" class="dataList" >
|
|
<li class="item" v-for="(item,i) in todolist" :key="i">
|
|
<div class="left">
|
|
<div class="repairName">
|
|
<span class="name">{{ item.toDoType.label }}</span>
|
|
<span class="carCode">{{item.plateNumber ? item.plateNumber : "无"}}</span></div>
|
|
<div class="addressName">{{ item.address }}</div>
|
|
<div class="time">{{item.toDoTime}} {{item.userName}}</div>
|
|
</div>
|
|
<div class="right">
|
|
<button class="nopass" @click="noPass(item)">不通过</button>
|
|
<button class="pass" @click="passThrough(item)">通过</button>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {getToDoList,toDoAudit} from "@/api/order"
|
|
export default {
|
|
name: "toDoList",
|
|
data(){
|
|
return{
|
|
todolist:[],
|
|
show:false
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getList()
|
|
},
|
|
methods:{
|
|
async getList(){
|
|
let result=await getToDoList();
|
|
if(result.code === 200){
|
|
this.todolist=result.data;
|
|
if(this.todolist.length === 0){
|
|
this.show=true
|
|
}else {
|
|
this.show=false
|
|
}
|
|
console.log("this.todolist",this.todolist.length)
|
|
}
|
|
},
|
|
async noPass(item){
|
|
let result=await toDoAudit({
|
|
toDoId:item.toDoId,
|
|
toDoType:item.toDoType.code
|
|
})
|
|
console.log("不通过",item,result)
|
|
},
|
|
async passThrough(item){
|
|
let result=await toDoAudit({
|
|
toDoId:item.toDoId,
|
|
toDoType:item.toDoType.code
|
|
})
|
|
console.log("通过",item,result)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "@/styles/mixin.scss";
|
|
@import "@/styles/common.scss";
|
|
.wrap {
|
|
@include wh(100%,100%);
|
|
box-sizing: border-box;
|
|
padding: 13px 13px 0 13px;
|
|
background-color: #F4F5F7;
|
|
}
|
|
|
|
.dataList {
|
|
padding: 0;
|
|
}
|
|
|
|
.item {
|
|
list-style: none;
|
|
@include flexColBet;
|
|
margin-bottom: 10px;
|
|
width: 100%;
|
|
background: #FFFFFF;
|
|
box-shadow: 0px 2px 10px 0px rgba(216, 216, 216, 0.5);
|
|
border-radius: 6px;
|
|
padding: 10px 13px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.repairName {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.name {
|
|
font-size: 14px;
|
|
margin-right: 22px;
|
|
}
|
|
|
|
.carCode {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.addressName {
|
|
margin-top: 8px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.addressName,
|
|
.time {
|
|
font-size: 12px;
|
|
}
|
|
|
|
button {
|
|
padding: 2px 8px;
|
|
@include fontWeightSize(bold,12px);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.nopass {
|
|
background: white;
|
|
border: 1px solid #DDDDDD !important;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.pass {
|
|
border: 1px solid #2A5094 !important;
|
|
@include bgFontColor(white,#2A5094);
|
|
}
|
|
|
|
|
|
</style> |