349 lines
9.8 KiB
Vue
349 lines
9.8 KiB
Vue
|
<template>
|
|||
|
<view class="content">
|
|||
|
<statusNav navBarTitle="处理工单"></statusNav>
|
|||
|
|
|||
|
<view class="work-order-schedule">
|
|||
|
<view class="li">
|
|||
|
<view class="icon icon-after">
|
|||
|
1
|
|||
|
</view>
|
|||
|
<view class="text">
|
|||
|
签到执行
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="icon on icon-after">
|
|||
|
2
|
|||
|
</view>
|
|||
|
<view class="text">
|
|||
|
填写维保单
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="icon">
|
|||
|
3
|
|||
|
</view>
|
|||
|
<view class="text">
|
|||
|
结算审核
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="work-order-from">
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
工单编号:
|
|||
|
</view>
|
|||
|
<input type="text" class="input" placeholder="" value="GD20211203-001" />
|
|||
|
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
项目编号:
|
|||
|
</view>
|
|||
|
<input type="text" class="input" placeholder="" value="XM20211203-001" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
项目名称:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="湖南省林业科学院11楼会议室P2.5" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
产品类型:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="Q2.5-E" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
安装位置:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="详细地址+某某栋11楼会议室" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
故障类型:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="供电不足" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
服务方式:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="上门服务" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
|
|||
|
故障说明:
|
|||
|
</view>
|
|||
|
|
|||
|
<textarea auto-height class="input input-black"
|
|||
|
value="*********************************************************************************************************"
|
|||
|
placeholder="" />
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
故障图片:
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="input add-display">
|
|||
|
<view class="">
|
|||
|
<image class="img" src="../../static/del/微信图片_20220113152400.png" mode="aspectFill"></image>
|
|||
|
<image class="img" src="../../static/del/微信图片_20220113152400.png" mode="aspectFill"></image>
|
|||
|
</view>
|
|||
|
|
|||
|
|
|||
|
<view class="add-img">
|
|||
|
<image class="icon" src="../../static/iocn/jia.png" mode=""></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
开始时间:
|
|||
|
</view>
|
|||
|
<input type="text" class="input " placeholder="" value="2022-01-25 09:39" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
结束时间:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="2022-01-25 15:30" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
维保用时:
|
|||
|
</view>
|
|||
|
<input type="text" class="input " placeholder="" value="5小时51分钟" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
维保费用:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="¥500.00元" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
等待时长:
|
|||
|
</view>
|
|||
|
<input type="text" class="input " placeholder="" value="1天6小时35分钟" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
主维保人:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="陈志远" />
|
|||
|
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
更换配件:
|
|||
|
</view>
|
|||
|
<view class="rideo">
|
|||
|
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
|
|||
|
|
|||
|
<view class="work-order-from">
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
|
|||
|
工作描述:
|
|||
|
</view>
|
|||
|
|
|||
|
<textarea auto-height class="input input-black"
|
|||
|
value="*********************************************************************************************************"
|
|||
|
placeholder="" />
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
维保图片:
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="input add-display">
|
|||
|
<view class="">
|
|||
|
<image class="img" src="../../static/del/微信图片_20220113152400.png" mode="aspectFill"></image>
|
|||
|
<image class="img" src="../../static/del/微信图片_20220113152400.png" mode="aspectFill"></image>
|
|||
|
</view>
|
|||
|
|
|||
|
|
|||
|
<view class="add-img">
|
|||
|
<image class="icon" src="../../static/iocn/jia.png" mode=""></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
|
|||
|
故障原因:
|
|||
|
</view>
|
|||
|
|
|||
|
<textarea auto-height class="input input-black"
|
|||
|
value="*********************************************************************************************************"
|
|||
|
placeholder="" />
|
|||
|
</view>
|
|||
|
<view class="li">
|
|||
|
<view class="title">
|
|||
|
主维保人:
|
|||
|
</view>
|
|||
|
<input type="text" class="input input-black" placeholder="" value="罗帅 陈志远" />
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<button class="submit-button" type="default">签到</button>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
import statusNav from '../../components/status-nav.vue';
|
|||
|
import footTabOne from "../../components/foot-tabs/foot-tab-one.vue"
|
|||
|
export default {
|
|||
|
components: {
|
|||
|
footTabOne,
|
|||
|
statusNav
|
|||
|
},
|
|||
|
data() {
|
|||
|
return {
|
|||
|
|
|||
|
}
|
|||
|
},
|
|||
|
methods: {
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style>
|
|||
|
.content {
|
|||
|
padding-top: 80rpx;
|
|||
|
}
|
|||
|
|
|||
|
.submit-button {
|
|||
|
width: 686rpx;
|
|||
|
border-radius: 50rpx;
|
|||
|
height: 90rpx;
|
|||
|
background-color: #02A2ea;
|
|||
|
line-height: 90rpx;
|
|||
|
color: #FFFFFF;
|
|||
|
margin-top: 60rpx;
|
|||
|
text-align: center;
|
|||
|
font-size: 30rpx;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-schedule {
|
|||
|
display: flex;
|
|||
|
padding: 22rpx 29rpx;
|
|||
|
margin-top: 10rpx;
|
|||
|
background-color: #FFFFFF;
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-schedule .icon {
|
|||
|
width: 38rpx;
|
|||
|
height: 38rpx;
|
|||
|
color: #FFFFFF;
|
|||
|
margin: auto;
|
|||
|
position: relative;
|
|||
|
font-size: 24rpx;
|
|||
|
margin-bottom: 10rpx;
|
|||
|
text-align: center;
|
|||
|
line-height: 38rpx;
|
|||
|
background-color: #999999;
|
|||
|
border-radius: 50%;
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.work-order-schedule .on {
|
|||
|
background-color: #5391F3
|
|||
|
}
|
|||
|
|
|||
|
.work-order-schedule .text {
|
|||
|
font-size: 24rpx;
|
|||
|
color: #333333;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-schedule .icon-after::after {
|
|||
|
content: "";
|
|||
|
width: 265rpx;
|
|||
|
height: 2rpx;
|
|||
|
background-color: #999999;
|
|||
|
position: absolute;
|
|||
|
top: 19rpx;
|
|||
|
left: 38rpx;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from {
|
|||
|
margin-top: 10rpx;
|
|||
|
background-color: #FFFFFF;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li {
|
|||
|
display: flex;
|
|||
|
padding: 20rpx 40rpx;
|
|||
|
border-bottom: 2rpx solid #ececec;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .title {
|
|||
|
font-size: 26rpx;
|
|||
|
width: 133rpx;
|
|||
|
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .input {
|
|||
|
font-size: 24rpx;
|
|||
|
color: #8b8b8b;
|
|||
|
flex: 1;
|
|||
|
padding-left: 15rpx;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .input .img {
|
|||
|
width: 169rpx;
|
|||
|
height: 127rpx;
|
|||
|
margin-right: 10rpx;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .input .add-img {
|
|||
|
width: 136rpx;
|
|||
|
height: 127rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
background-color: #DCDCDC;
|
|||
|
align-items: center;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .input .add-img .icon {
|
|||
|
width: 64rpx;
|
|||
|
height: 64rpx;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .add-display {
|
|||
|
display: flex;
|
|||
|
}
|
|||
|
|
|||
|
.work-order-from .li .input-black {
|
|||
|
color: #292929;
|
|||
|
}
|
|||
|
</style>
|