qichexitong/car_client_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

'维修接待-待审核-工单详情'

Browse Source
This commit is contained in:
xiaoshan
2023-12-26 19:24:55 +08:00
parent d87224fa21
commit 0328b7f769
18 changed files with 734 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
api/repair/repair.js
View File

@@ -22,6 +22,39 @@ export function reservationList(params) {
})
}
/**
* 预约接待-预约工单详情
*/
export function reservationInfo(params) {
return request({
url: '/api/front/repair/reservation/management/info',
method: 'get',
params
})
}
/**
* 预约接待-预约工单确认/同意/驳回
*/
export function auditCheck(data) {
return request({
url: '/api/front/repair/reservation/management/auditCheck',
method: 'post',
data
})
}
/**
* 预约接待-预约工单到店
*/
export function arrive(data) {
return request({
url: '/api/front/repair/reservation/management/arrive',
method: 'post',
data
})
}
/**
* 获取事故接待列表
*/
@@ -55,6 +88,17 @@ export function maintenanceList(params) {
})
}
/**
* 获取维修接待详情
*/
export function maintenanceInfo(params) {
return request({
url: '/api/front/repair/maintenance/info',
method: 'get',
params
})
}
/**
* 维修接待-创建并开单
*/
@@ -66,6 +110,17 @@ export function createAndBill(data) {
})
}
/**
* 维修接待-开单
*/
export function billing(data) {
return request({
url: '/api/front/repair/maintenance/billing',
method: 'post',
data
})
}
/**
* 获取退车接待列表
*/

87
components/billing-item/billing-item.vue
View File

@@ -1,26 +1,64 @@
<template>
<view>
<view class="item bg-white c444 f-28">
<view class="item bg-white c444 f-28" @click="checkBtn(0)">
<view class="item-title flex align-center justify-between">
<text class="f-38 black">浙A·15JD6</text>
<text class="c-danger f-24">待确认</text>
<text class="f-38 black">{{item.carNo}}</text>
<text class="c-danger f-24">{{showStatus()}}</text>
</view>
<view class="flex align-center justify-between">
<text>维修类型</text>
<text>维修保养</text>
<text>{{showType(item.repairType)}}</text>
</view>
<view class="flex align-center justify-between">
<text>车辆型号</text>
<text>UE5系列</text>
<text>{{item.modelName}}</text>
</view>
<view class="flex align-center justify-between">
<text>预约时间</text>
<text>2023-11-07 14:00-14:30</text>
<text>{{item.workingDay + ' ' + item.workingTime}}</text>
</view>
<view class="btns flex justify-end">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="reject">驳回</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">到店</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: '0 0 0 16rpx', fontSize:'24rpx'}" color="#13AFA8" shape="circle" @click="argee">同意</u-button>
<!-- 预约接待按钮 -->
<view class="btns flex justify-end" v-if="btnState=='commonOrderType'">
<view v-if="item.auditStatus==0" @click.stop="checkBtn(2)">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle">驳回</u-button>
</view>
<view v-if="item.isArrived == 0 && item.auditStatus == 1" class="" @click.stop="checkBtn(3)">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: '0 0 0 16rpx', fontSize:'24rpx'}" shape="circle">到店</u-button>
</view>
<view v-if="item.auditStatus==0" class="" @click.stop="checkBtn(1)">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: '0 0 0 16rpx', fontSize:'24rpx'}" color="#13AFA8" shape="circle">同意</u-button>
</view>
</view>
<!-- 维修接待按钮 -->
<view class="btns flex justify-end" v-if="btnState=='orderType'&&!(item.billAuditStatus==0&&item.isBilled)">
<view class="">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle">查看</u-button>
</view>
<view class="" v-if="item.status == 1" @click.stop="checkBtn()">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: '0 0 0 16rpx', fontSize:'24rpx'}" color="#13AFA8" shape="circle">维修完成</u-button>
</view>
<view class="" v-if="item.isArrived && !item.isBilled" @click.stop="checkBtn(4)">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: '0 0 0 16rpx', fontSize:'24rpx'}" shape="circle" color="#13AFA8">开单</u-button>
</view>
<view class="" v-if="item.billAuditStatus == 2" @click="toStore">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" color="#13AFA8">重新开单</u-button>
</view>
</view>
<!-- 事故接待按钮 -->
<view class="btns flex justify-end" v-if="btnState=='accientOrderType'">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">接车</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">定损</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">开单</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">结束维修</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">提车</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">结算</u-button>
</view>
<!-- 退车接待按钮 -->
<view class="btns flex justify-end" v-if="btnState=='backOrderType'">
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">接车</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">维修完成</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">提车</u-button>
<u-button :customStyle="{width: '160rpx',height: '56rpx', margin: 0, fontSize:'24rpx'}" shape="circle" @click="toStore">结算</u-button>
</view>
</view>
</view>
@@ -28,6 +66,7 @@
<script>
import { mapGetters } from 'vuex'
import { typelist } from '@/data/typeData'
export default {
name:"billing-item",
props: {
@@ -38,15 +77,39 @@
}
}
},
components: {
...mapGetters(['btnStatw'])
computed: {
...mapGetters(['btnState'])
},
data() {
return {
show: false,
typelist,
};
},
onShow() {
console.log(this.btnState);
},
mounted() {
console.log('详情', this.item);
},
methods: {
showType(e) {
return this.typelist.filter(i => i.type == e)[0].text
},
showStatus(e) {
if(this.item.auditStatus == 0) return '待确认'
if(this.item.auditStatus == 1 && this.item.isArrived == 0) return "确认未到店"
if(this.item.auditStatus == 2) return "已驳回"
if(this.item.isArrived && !this.item.isBilled) return "未处理"
if(this.item.auditRepair == 2 || this.item.billAuditStatus == 2) return "已拒绝"
if(this.item.auditRepair == 1 && this.item.billAuditStatus == 0) return "平台审核中"
if(this.item.auditRepair == 0 && this.item.billAuditStatus == 1) return "公司审核中"
if(this.item.auditRepair == 0 && this.item.billAuditStatus == 0) return "平台/公司审核中"
if(this.item.status == 1) return "维修中"
},
checkBtn(e) {
this.$emit('checkBtn', {btnType: e, item: this.item})
},
argee() {
this.$emit('argee', this.item)
},

4
components/cell-list/cell-list.vue
View File

@@ -42,10 +42,6 @@
detail: {}
};
},
created() {
console.log(this.list);
console.log(this.btnState);
},
methods: {
checkItem(item){
this.detail = item

2
components/prompt-box/prompt-box.vue
View File

@@ -44,6 +44,8 @@
}
}
},
created() {
},
data() {
return {
show: false,

2
data/tabsData.js
View File

@@ -6,7 +6,7 @@ export const tabsList1 = [{
value: 'ucheck'
}, {
name: '未到店',
value: 'noArrive'
value: 'notArrive'
}, {
name: '已驳回',
value: 'reject'

6
data/typeData.js
View File

@@ -11,13 +11,9 @@ export const typelist = [{
type: 3,
from: 'accientOrderType'
},{
text: '退车维修',
text: '退车',
type: 4,
from: 'backOrderType'
},{
text: '退车不维修',
type: 5,
from: 'backOrderType'
}]
export const settlementList = [{

382
pages/repair/repair/detail.vue
View File

@@ -1,20 +1,394 @@
<!-- 预约单详情页 -->
<template>
<view>
<view class="page">
<view class="" v-if="btnState == 'commonOrderType'">
<view class="car-info bg-white">
<view class="car-info-item flex align-center justify-between">
<view class="f-38 fw-b c000"> {{detail.carNo}} </view>
<view class="red f-28"> {{ showStatus() }} </view>
</view>
<view class="car-info-item flex align-center justify-between mt-2 f-28">
<view class="c666"> 维修类型 </view>
<view class="reser"> {{showType(detail.repairType)}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 车架号 </view>
<view class="c111"> {{detail.vinId}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 车辆品牌 </view>
<view class="c111"> {{detail.brandName}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 车辆型号 </view>
<view class="c111"> {{detail.modelName}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 所属公司 </view>
<view class="c111"> {{detail.company}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 预约时间 </view>
<view class="c111"> {{detail.workingDay + ' ' + detail.workingTime}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 司机 </view>
<view class="c111"> {{detail.name}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 手机号码 </view>
<view class="c111"> {{detail.phone}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 描述 </view>
<view class="c111"> {{detail.repairDescribe}} </view>
</view>
</view>
<view class="back-box bg-white" v-if="detail.auditStatus == 2">
<view class="back-box-title flex align-center justify-between">
<view class="f-32 c111">
拒绝接受预约单
</view>
<view class="f-28 c666">
{{detail.auditStatusTime}}
</view>
</view>
<view class="back-content f-28 c666 mt-2">
{{detail.auditReason}}
</view>
</view>
</view>
<view class="" v-if="btnState == 'orderType'">
<view class="car-info bg-white">
<view class="car-info-item flex align-center justify-between">
<view class="f-38 fw-b c000"> {{detail.carNo}} </view>
<view class="red f-28"> {{ showStatus() }} </view>
</view>
<view class="car-info-item flex align-center justify-between mt-2 f-28" v-if="!(detail.billAuditStatus==0&&detail.isBilled)">
<view class="c666"> 维修类型 </view>
<view class="c111"> {{showType(detail.repairType)}} </view>
</view>
</view>
<view class="f-32 c111 mt-2 mb-2" v-if="!(detail.billAuditStatus==0&&detail.auditRepair==0&&detail.isBilled)">
基本信息
</view>
<view class="car-info bg-white" v-if="!(detail.billAuditStatus==0&&detail.auditRepair==0&&detail.isBilled)">
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 车系 </view>
<view class="c111"> {{detail.modelName}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 公里数 </view>
<view class="c111"> {{detail.maintenance?detail.maintenance.kilometer : '未填写'}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 所属公司 </view>
<view class="c111"> {{detail.company}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 司机 </view>
<view class="c111"> {{detail.name}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 预约时间 </view>
<view class="c111"> {{detail.workingDay + ' ' + detail.workingTime}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 手机号码 </view>
<view class="c111"> {{detail.phone}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 描述 </view>
<view class="c111"> {{detail.repairDescribe}} </view>
</view>
</view>
<view class="f-32 c111 mt-2 mb-2" v-if="detail.billAuditStatus==0&&detail.auditRepair==0&&detail.isBilled">
送修信息
</view>
<view class="car-info bg-white rel" :class="carInfoLoadMore&&'active-car-info'" v-if="detail.billAuditStatus==0&&detail.auditRepair==0&&detail.isBilled">
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 品牌 </view>
<view class="c111"> {{detail.brandName}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 车系 </view>
<view class="c111"> {{detail.modelName}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 车架号 </view>
<view class="c111"> {{detail.vinId}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 所属公司 </view>
<view class="c111"> {{detail.company}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 维修类型 </view>
<view class="c111"> {{showType(detail.repairType)}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 司机名称 </view>
<view class="c111"> {{detail.name}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 司机名称 </view>
<view class="c111"> {{detail.phone}} </view>
</view>
<view class="load-more abs flex align-center justify-center" @click="carInfoLoadMore = !carInfoLoadMore">
{{carInfoLoadMore ? '更多' : '收起'}}
<u-icon class="ml-1" :name="carInfoLoadMore ? 'arrow-down' : 'arrow-up'" color="#666666" size="12"></u-icon>
</view>
</view>
<view class="f-32 c111 mt-2 mb-2" v-if="detail.billAuditStatus==0&&detail.auditRepair==0&&detail.isBilled">
接单信息
</view>
<view class="car-info bg-white rel" :class="orderInfoLoadMore&&'active-car-info'" v-if="detail.billAuditStatus==0&&detail.auditRepair==0&&detail.isBilled">
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 工单号 </view>
<view class="c111"> {{detail.orderSn}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 公里数 </view>
<view class="c111"> {{detail.maintenance.kilometer}} </view>
</view>
<view class="car-info-item flex align-center justify-between f-28">
<view class="c666"> 故障现象 </view>
<view class="">
<view class="c111" v-for="(item,index) in detail.fault" :key="index"> {{item.content}} </view>
</view>
</view>
<view class="car-info-item item-image-box flex align-center justify-between f-28">
<view class="c666"> 车头照片 </view>
<image class="image" :src="detail.maintenance.headerImage" mode=""></image>
</view>
<view class="car-info-item item-image-box flex align-center justify-between f-28">
<view class="c666"> 车架号照片 </view>
<image class="image" :src="detail.maintenance.vinImage" mode=""></image>
</view>
<view class="car-info-item item-image-box flex align-center justify-between f-28">
<view class="c666"> 仪表盘照片 </view>
<image class="image" :src="detail.maintenance.dashboardImage" mode=""></image>
</view>
<view class="car-info-item item-image-box flex align-center justify-between f-28">
<view class="c666"> 行驶证及驾驶证 </view>
<view class="flex">
<image class="image" :src="detail.maintenance.drivingLicenseImage" mode=""></image>
<image class="image" :src="detail.maintenance.driveLicenseImage" mode=""></image>
</view>
</view>
<view class="car-info-item item-image-box flex align-center justify-between f-28">
<view class="c666"> 故障照片/视频 </view>
<view class="flex">
<image class="image" v-if="detail.maintenance.faultImage" :src="detail.maintenance.faultImage" mode=""></image>
<view v-if="detail.maintenance.faultVideo" class="image-box rel" style="margin-left: 32rpx">
<image :src="videoImage" mode=""></image>
<view class="icon abs flex align-center justify-center">
<u-icon name="play-right-fill" color="#fff"></u-icon>
</view>
<!-- <video style="width: 112rpx;height: 112rpx;" :src="detail.maintenance.faultVideo"></video> -->
</view>
</view>
</view>
<view class="load-more abs flex align-center justify-center" @click="orderInfoLoadMore = !orderInfoLoadMore">
{{orderInfoLoadMore ? '更多' : '收起'}}
<u-icon class="ml-1" :name="orderInfoLoadMore ? 'arrow-down' : 'arrow-up'" color="#666666" size="12"></u-icon>
</view>
</view>
</view>
<view class="btn-box fixed-bottom flex align-center justify-between">
<u-button v-if="detail.auditStatus==0" shape="circle" :customStyle="{background: '#f5f5f5', border: '1rpx solid #000'}" @click="checkBtn(2)">驳回</u-button>
<u-button v-if="detail.auditStatus==0" class="ml-2" color="#13AFA8" shape="circle" @click="checkBtn(1)">同意</u-button>
<u-button v-if="detail.isArrived == 0 && detail.auditStatus == 1" color="#13AFA8" shape="circle" @click="checkBtn(3)">到店</u-button>
<u-button v-if="detail.isArrived && !detail.isBilled" color="#13AFA8" shape="circle" @click="checkBtn(4)">开单</u-button>
</view>
<prompt-box @confirm="confirm" ref="prompt" />
<u-popup :show="auditShow" round="16" @close="auditShow = false" :safeAreaInsetBottom="false">
<view class="audit-box">
<view class="audit-title rel f-32 fw-b c222 text-center">
审核意见
<image @click="auditShow = false" class="abs" src="@/static/images/icon/x_4.png" mode=""></image>
</view>
<u-textarea style="background-color: #f5f5f5;" maxlength="30" count height="404rpx" v-model="remark" placeholder="（选填）不填写也可以提交"></u-textarea>
<u-button @click="submitAudit" class="mt-4" shape="circle" color="#13AFA8">提交</u-button>
</view>
</u-popup>
</view>
</template>
<script>
import billindItem from '@/components/billing-item/billing-item'
import promptBox from '@/components/prompt-box/prompt-box'
import { reservationInfo, maintenanceInfo, auditCheck, arrive, } from '@/api/repair/repair'
import { typelist } from '@/data/typeData'
import { mapGetters } from 'vuex'
export default {
components: { billindItem, promptBox },
data() {
return {
carInfoLoadMore: true,
orderInfoLoadMore: true,
auditShow: false,
dataType: 0,
remark: '',
videoImage: '',
detail: {},
typelist,
};
},
computed: {...mapGetters(['btnState'])},
onLoad(options) {
console.log(options);
uni.setNavigationBarTitle({
title: options.title
})
if(this.btnState == 'commonOrderType') this.getReservationInfo(options.orderSn)
if(this.btnState == 'orderType') this.getMaintenanceInfo(options.orderSn)
},
methods: {
showType(e) {
if(this.typelist.filter(i => i.type == e)[0]) return this.typelist.filter(i => i.type == e)[0].text
},
showStatus(e) {
if(this.detail.auditStatus == 0) return '待确认'
if(this.detail.auditStatus == 1 && this.detail.isArrived == 0) return "确认未到店"
if(this.detail.auditStatus == 2) return "已驳回"
if(this.detail.isArrived && !this.detail.isBilled) return "未处理"
if(this.detail.auditRepair == 2 || this.detail.billAuditStatus == 2) return "已拒绝"
if(this.detail.auditRepair == 1 && this.detail.billAuditStatus == 0) return "平台审核中"
if(this.detail.auditRepair == 0 && this.detail.billAuditStatus == 1) return "公司审核中"
if(this.detail.auditRepair == 0 && this.detail.billAuditStatus == 0) return "平台/公司审核中"
},
checkBtn(e) {
console.log(e);
if (e == 1) {
this.$refs.prompt.tipContent = {
title: '预约单确认',
content: '是否同意该预约单？',
confirmText: '确认',
cancelText: '取消',
}
this.dataItem = e
this.$refs.prompt.show = true
} else if (e == 2) {
this.dataItem = e
this.auditShow = true
}
},
confirm() {
console.log('同意', this.dataItem);
if(this.dataItem == 1) {
auditCheck({id: this.detail.id, auditStatus: 1}).then(res => {
this.$u.toast('该预约单已同意')
this.dataItem = 0
this.getReservationInfo(this.detail.orderSn)
})
} else if(this.dataItem == 3) {
arrive({id: this.detail.id}).then(res => {
this.$u.toast('该预约单已确认到店')
this.dataItem = 0
this.getReservationInfo(this.detail.orderSn)
})
}
},
submitAudit() {
auditCheck({id: this.detail.id, auditStatus: 2, remark: this.remark}).then(res => {
this.$u.toast('该预约单已驳回')
this.auditShow = false
this.dataItem = 0
this.getReservationInfo(this.detail.orderSn)
})
},
// 获取预约工单详情
getReservationInfo(orderSn){
reservationInfo({orderSn}).then(res => {
this.detail = res.data
})
},
// 获取维修工单详情
getMaintenanceInfo(id){
maintenanceInfo({id}).then(res => {
this.detail = res.data
this.videoImage = res.data.maintenance.faultVideo+'?x-oss-process=video/snapshot,t_1000,ar_auto,m_fast,f_png,w_500'
console.log(res);
})
}
}
}
</script>
<style lang="scss">
page {
background-color: #f5f5f5;
}
.page {
padding: 16rpx 24rpx;
.car-info {
padding: 32rpx;
padding-bottom: 88rpx;
border-radius: 8rpx;
.car-info-item {
line-height: 58rpx;
transition: height 0.5s;
.reser {
width: 128rpx;
line-height: 44rpx;
background: #333333;
border-radius: 4rpx;
text-align: center;
color: #fff;
}
.image {
margin-left: 32rpx;
width: 112rpx;
height: 112rpx;
border-radius: 8rpx;
}
.image-box {
width: 112rpx;
height: 112rpx;
.icon {
top: 0;
left: 0;
width: 112rpx;
height: 112rpx;
border-radius: 8rpx;
background-color: rgba(0,0,0,.3);
}
image {
width: 112rpx;
height: 112rpx;
border-radius: 8rpx;
}
}
}
.item-image-box {
padding: 16rpx 0;
border-bottom: 1rpx solid #eee;
}
.load-more {
bottom: 0;
left: 0;
padding: 16rpx 0 32rpx 0;
width: 100%;
background-color: #fff;
line-height: 40rpx;
}
}
.active-car-info {
height: 300rpx;
transition: height 0.5s;
overflow: hidden;
}
.back-box {
margin-top: 16rpx;
padding: 32rpx;
border-radius: 8rpx;
}
.btn-box {
padding: 0 24rpx;
padding-bottom: 68rpx;
width: 100%;
}
}
</style>

172
pages/repair/repair/list.vue
View File

@@ -1,51 +1,62 @@
<!-- 预约管理主页 -->
<template>
<view class="page">
<view class="navbar">
<view :style="`height: ${$u.sys().statusBarHeight}px;`" />
<view class="navbar-content flex align-center justify-between">
<view class="back-icon flex-center" @click="$tab.navigateBack">
<image src="@/static/images/icon/arrow-left.png" mode=""></image>
</view>
<u-input
customStyle="height: 72rpx"
placeholder="输入车牌号/所属公司搜索"
shape="circle"
v-model="keyword"
confirmType="search"
placeholderStyle="fontSize: 28rpx;color:#999;font-weight: 500;"
@confirm="inputConfirm">
<template slot="prefix">
<u-image width="16" height="16" src="@/static/images/icon/search.png"></u-image>
</template>
</u-input>
<view class="navbar-btn" v-if="btnState!='commonOrderType'">
<u-button
:customStyle="{width: '144rpx', height: '56rpx',fontSize: '24rpx',margin: 0}"
color="#333333"
@click="toCreateOrder">
<image src="@/static/images/icon/plus-circle.png" mode=""></image>
<text style="line-height: 1">新建</text>
</u-button>
<view class="fixed-top">
<view class="navbar">
<view :style="`height: ${$u.sys().statusBarHeight}px;`" />
<view class="navbar-content flex align-center justify-between">
<view class="back-icon flex-center" @click="$tab.navigateBack">
<image src="@/static/images/icon/arrow-left.png" mode=""></image>
</view>
<u-input
customStyle="height: 72rpx"
placeholder="输入车牌号/所属公司搜索"
shape="circle"
v-model="keyword"
confirmType="search"
placeholderStyle="fontSize: 28rpx;color:#999;font-weight: 500;"
@confirm="inputConfirm">
<template slot="prefix">
<u-image width="16" height="16" src="@/static/images/icon/search.png"></u-image>
</template>
</u-input>
<view class="navbar-btn" v-if="btnState!='commonOrderType'">
<u-button
:customStyle="{width: '144rpx', height: '56rpx',fontSize: '24rpx',margin: 0}"
color="#333333"
@click="toCreateOrder">
<image src="@/static/images/icon/plus-circle.png" mode=""></image>
<text style="line-height: 1">新建</text>
</u-button>
</view>
</view>
</view>
<view class="tabs-box bg-white">
<u-tabs v-if="btnState=='commonOrderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList1" @click="clickTab" :scrollable="false"></u-tabs>
<u-tabs v-if="btnState=='accientOrderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList2" @click="clickTab" :scrollable="false"></u-tabs>
<u-tabs v-if="btnState=='orderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList3" @click="clickTab" :scrollable="false"></u-tabs>
<u-tabs v-if="btnState=='backOrderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList4" @click="clickTab" :scrollable="false"></u-tabs>
</view>
</view>
<view class="tabs-box bg-white">
<u-tabs v-if="btnState=='commonOrderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList1" @click="clickTab" :scrollable="false"></u-tabs>
<u-tabs v-if="btnState=='accientOrderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList2" @click="clickTab" :scrollable="false"></u-tabs>
<u-tabs v-if="btnState=='orderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList3" @click="clickTab" :scrollable="false"></u-tabs>
<u-tabs v-if="btnState=='backOrderType'" :activeStyle="{color: '#111111'}" :inactiveStyle="{color: '#666666' }" :current="current" lineWidth="30" lineColor="#222222" :list="tabsList4" @click="clickTab" :scrollable="false"></u-tabs>
<view class="">
<view :style="`height: ${$u.sys().statusBarHeight}px;`" />
<view style="height: 190rpx;" />
</view>
<view class="mt-1">
<z-paging :auto="false" ref="paging" height="100%" :fixed ="false" v-model="dataList" @query="queryList" safe-area-inset-bottom :use-page-scroll="true">
<z-paging ref="paging" height="100%" :fixed ="false" v-model="dataList" @query="queryList" safe-area-inset-bottom :use-page-scroll="true">
<empty-view slot="empty" text="暂无更多"></empty-view>
<billing-item @toStore="toStore" v-for="(item,index) in dataList" :key="item.id"></billing-item>
<billing-item :item="item" @checkBtn="checkBtn" v-for="(item,index) in dataList" :key="item.id"></billing-item>
</z-paging>
</view>
<prompt-box ref="prompt" />
<u-popup :show="opinionShow">
<view class="">
<prompt-box @confirm="confirm" ref="prompt" />
<u-popup :show="auditShow" round="16" @close="auditShow = false" :safeAreaInsetBottom="false">
<view class="audit-box">
<view class="audit-title rel f-32 fw-b c222 text-center">
审核意见
<image @click="auditShow = false" class="abs" src="@/static/images/icon/x_4.png" mode=""></image>
</view>
<u-textarea style="background-color: #f5f5f5;" maxlength="30" count height="404rpx" v-model="remark" placeholder="（选填）不填写也可以提交"></u-textarea>
<u-button @click="submitAudit" class="mt-4" shape="circle" color="#13AFA8">提交</u-button>
</view>
</u-popup>
</view>
@@ -53,23 +64,28 @@
<script>
import billindItem from '@/components/billing-item/billing-item'
import { reservationList, maintenanceList, accidentList, returnList } from '@/api/repair/repair'
import promptBox from '@/components/prompt-box/prompt-box'
import { reservationList, maintenanceList, accidentList, auditCheck, arrive, returnList, } from '@/api/repair/repair'
import { tabsList1, tabsList2, tabsList3, tabsList4 } from '@/data/tabsData'
import { mapGetters } from 'vuex'
export default {
components: { billindItem },
components: { billindItem, promptBox },
data() {
return {
current: 0,
keyword: '',
remark: '',
auditShow: false,
opinionShow: false,
tabsList1,
tabsList2,
tabsList3,
tabsList4,
dataList: [],
query: {}
query: {},
dataItem: {}
};
},
onLoad(option) {
@@ -78,10 +94,9 @@
this.$store.dispatch('changeBtnState', option.modul)
// 将请求query的传进来的字段名赋值相应tabs下的默认参数
this.query[option.modul] = this[`tabsList${option.index}`][0].value
console.log(123, this.btnState);
},
onShow() {
this.$refs.paging.reload()
// this.$refs.paging.reload()
},
mounted() {
// 这里调用是避免参数获取不及时
@@ -143,16 +158,58 @@
if(this.btnState == 'accientOrderType') this.$tab.navigateTo('/pages/repair/repair/accident/createOrder')
if(this.btnState == 'backOrderType') this.$tab.navigateTo('/pages/repair/repair/reverse/createOrder')
},
// 点击到店
toStore(e) {
console.log(e);
this.$refs.prompt.tipContent={
title: '确认到店',
content: `是否确认车牌号为【${'浙A·15JD6'}】的用户已到店？`,
confirmText: '确认',
cancelText: '取消',
checkBtn(e) {
if(e.btnType == 0) {
if(this.btnState == 'commonOrderType') this.$tab.navigateTo(`./detail?orderSn=${e.item.orderSn}&title=预约单详情`)
if(this.btnState == 'orderType') this.$tab.navigateTo(`./detail?orderSn=${e.item.id}&title=工单详情`)
} else if (e.btnType == 1) {
this.$refs.prompt.tipContent = {
title: '预约单确认',
content: '是否同意该预约单？',
confirmText: '确认',
cancelText: '取消',
}
this.dataItem = e
this.$refs.prompt.show = true
} else if (e.btnType == 2) {
this.dataItem = e
this.auditShow = true
} else if (e.btnType == 3) {
this.$refs.prompt.tipContent = {
title: '确认到店',
content: `是否确认车牌号为【${e.item.carNo}】的用户已到店？`,
confirmText: '确认',
cancelText: '取消',
}
this.dataItem = e
this.$refs.prompt.show = true
} else if (e.btnType == 4) {
this.$tab.navigateTo(`./reservation/createOrder?id=${e.item.id}`)
}
this.$refs.prompt.show = true
},
confirm() {
console.log('同意', this.dataItem);
if(this.dataItem.btnType == 1) {
auditCheck({id: this.dataItem.item.id, auditStatus: 1}).then(res => {
this.$u.toast('该预约单已同意')
this.dataItem = {}
this.$refs.paging.reload()
})
} else if (this.dataItem.btnType == 3) {
arrive({id: this.dataItem.item.id}).then(res => {
this.$u.toast('该预约单已确认到店')
this.dataItem = {}
this.$refs.paging.reload()
})
}
},
submitAudit() {
auditCheck({id: this.dataItem.item.id, auditStatus: 2, remark: this.remark}).then(res => {
this.$u.toast('该预约单已驳回')
this.dataItem = {}
this.auditShow = false
this.$refs.paging.reload()
})
}
}
}
@@ -193,4 +250,17 @@
justify-content: center;
}
}
.audit-box {
padding: 0 24rpx 76rpx 24rpx;
.audit-title {
padding-top: 48rpx;
padding-bottom: 32rpx;
image {
top: 24rpx;
right: 24rpx;
width: 34rpx;
height: 34rpx;
}
}
}
</style>

96
pages/repair/repair/reservation/createNewOrder.vue
View File

@@ -28,7 +28,7 @@
<view class="form-item">
<view class="flex align-center justify-between">
公里数
<u-input border="none" v-model="maintenance.kilometer" input-align="right" placeholder="请输入公里数"></u-input>
<u-input border="none" type="number" v-model="maintenance.kilometer" input-align="right" placeholder="请输入公里数"></u-input>
</view>
</view>
</u-form-item>
@@ -76,9 +76,9 @@
<view class="flex align-center justify-between">
仪表盘照片
<view class="image-box rel">
<image class="upload-bg" v-show="maintenance.vinImage" :src="maintenance.vinImage" mode=""></image>
<image v-show="!maintenance.vinImage" class="upload-bg" src="@/static/images/icon/plus_box.png" mode="" @click="upload('image', 'vinImage')"></image>
<image v-show="maintenance.vinImage" class="reduce abs" src="@/static/images/icon/reduce.png" mode="" @click="DelPic('vinImage')"></image>
<image class="upload-bg" v-show="maintenance.dashboardImage" :src="maintenance.dashboardImage" mode=""></image>
<image v-show="!maintenance.dashboardImage" class="upload-bg" src="@/static/images/icon/plus_box.png" mode="" @click="upload('image', 'dashboardImage')"></image>
<image v-show="maintenance.dashboardImage" class="reduce abs" src="@/static/images/icon/reduce.png" mode="" @click="DelPic('dashboardImage')"></image>
</view>
</view>
</view>
@@ -106,10 +106,18 @@
<view class="form-item">
<view class="flex align-center justify-between">
故障照片/视频
<view class="image-box rel ml-2">
<image class="upload-bg" v-show="maintenance.faultVideo" :src="videoImage" mode=""></image>
<image v-show="!maintenance.faultVideo" class="upload-bg" src="@/static/images/icon/plus_box.png" mode="" @click="upload('video', 'faultVideo')"></image>
<image v-show="maintenance.faultVideo" class="reduce abs" src="@/static/images/icon/reduce.png" mode="" @click="DelPic('faultVideo')"></image>
<view class="flex align-center justify-end">
<view v-show="maintenance.faultVideo" class="image-box rel ml-2">
<image class="upload-bg" :src="videoImage" mode=""></image>
<image class="reduce abs" src="@/static/images/icon/reduce.png" mode="" @click="DelPic('faultVideo')"></image>
</view>
<view v-show="maintenance.faultImage" class="image-box rel ml-2">
<image class="upload-bg" :src="maintenance.faultImage" mode=""></image>
<image class="reduce abs" src="@/static/images/icon/reduce.png" mode="" @click="DelPic('faultImage')"></image>
</view>
<view class="image-box rel ml-2" v-show="!maintenance.faultVideo || !maintenance.faultImage">
<image class="upload-bg" src="@/static/images/icon/plus_box.png" mode="" @click="videoOrImage = true"></image>
</view>
</view>
</view>
</view>
@@ -176,34 +184,41 @@
</view>
<view class="form-box bg-white">
<u-form-item>
<view class="form-item">
<view class="form-item flex align-center justify-between">
<text>合计金额</text>
<text>￥{{amount}}</text>
</view>
</u-form-item>
<u-form-item>
<view class="form-item">
<view class="form-item flex align-center justify-between">
<text>大写金额</text>
<text>陆佰肆拾元整</text>
<text>{{ showNum(amount) }}</text>
</view>
</u-form-item>
</view>
<view class="form-box bg-white">
<u-form-item>
<view class="form-item">
<u-input type="textarea" placeholder="整备备注 (选填)"></u-input>
<u--textarea v-model="form.remark" placeholder="整备备注 (选填)" ></u--textarea>
</view>
</u-form-item>
</view>
</u-form>
</view>
<u-toast ref="uToast"/>
<u-popup :show="videoOrImage" bgColor="transparent" @close="videoOrImage=false">
<view class="image-btns-box">
<u-button @click="upload('image', 'faultImage')">图片</u-button>
<u-button class="mt-3" @click="upload('video', 'faultVideo')">视频</u-button>
</view>
</u-popup>
<cell-list ref="cellList" :title="title" @confirm="checkItem" :list="selectList"></cell-list>
</view>
</template>
<script>
import { createAndBill } from '@/api/repair/repair'
import { createAndBill, billing } from '@/api/repair/repair'
import { convertNumberToChinese } from '@/utils/index'
import { typelist } from '@/data/typeData'
import { mapGetters } from 'vuex'
export default {
@@ -211,6 +226,7 @@
return {
title: '',
videoImage: '',
videoOrImage: false,
formData: {},
faultList: [],
selectList: [],
@@ -232,24 +248,8 @@
name: '', // 司机名称
phone: '', // 联系方式
repairType: 1, // 维修类型 1=常规保养2=故障维修3=事故维修4=退车
projectList: [{
accessoryList: [{ // 工单项目材料表请求对象
accessoryId: 0, // 材料id
id: 0, // 如果是快速开单，则id未套餐对应的字配件类目主键id必穿
name: '', // 材料名称
num: 0, // 材料数量
price: 0, // 材料价格
workingHour: '', // 工时（小时）
workingPrice: '', // 工时价格
}],
isPackage: 0, // 0=自定义,1=套餐快速
name: '', // 维修项目名称
packageId: '', // 套餐id
price: '', // 材料价格
type: '', // 1=金额计价,2=工时计价
workingHour: 0, // 工时（小时）
workingPrice: 0, // 工时价格]
}]
remark: '',
projectList: []
},
rules: {
@@ -257,7 +257,7 @@
};
},
computed: {
...mapGetters(['projectList']),
...mapGetters(['projectList', 'saveForm']),
amount() {
let price = 0
this.projectList.forEach(item => {
@@ -270,6 +270,9 @@
console.log(this.projectList);
},
methods: {
showNum(a) {
return convertNumberToChinese(a)
},
checkItem(e) {
console.log(e);
},
@@ -295,6 +298,7 @@
},null,res=>{
console.log(res);
this.maintenance[key] = res.data
this.videoOrImage = false
this.$store.dispatch('SetForm',{key: 'maintenance', value: this.maintenance})
uni.hideLoading();
});
@@ -322,6 +326,7 @@
// this.formData.video = res.data|| '';
// this.image = [{url: ,isCover: true}];
this.$refs.uToast.hide();
this.videoOrImage = false
});
},
/**删除图片*/
@@ -340,8 +345,30 @@
this.faultList.splice(index, 1)
},
submitOrder() {
console.log('提交');
console.log('提交',this.saveForm);
this.form.faultList = this.faultList
this.form.maintenance = this.maintenance
this.form.maintenance.kilometer *= 1
this.form.carNo = this.saveForm.carNo
this.form.repairType = this.saveForm.repairType
this.form.name = this.saveForm.name
this.form.phone = this.saveForm.phone
this.form.projectList = this.projectList
this.form.faultList = this.faultList
if(this.saveForm.carReservationOrderId) {
this.form.carReservationOrderId = this.saveForm.carReservationOrderId
billing(this.form).then(res => {
this.$tab.redirectTo('/pages/repair/repair/list')
}).catch(err => {
console.log('失败', err);
})
} else {
createAndBill(this.form).then(res => {
this.$tab.redirectTo('/pages/repair/repair/list')
}).catch(err => {
console.log('失败', err);
})
}
console.log('form表单', this.form);
}
}
@@ -475,4 +502,7 @@
width: 32rpx;
height: 32rpx;
}
.image-btns-box {
padding: 32rpx;
}
</style>

36
pages/repair/repair/reservation/createOrder.vue
View File

@@ -12,7 +12,7 @@
<u-form-item border-bottom label="所属公司" class="forms-item">
<u-input border="none" v-model="data.company" placeholder="浙江有限公司" input-align="right"></u-input>
</u-form-item>
<u-form-item border-bottom label="维修类型" @click="openType" class="forms-item" prop="repairTypeName">
<u-form-item border-bottom label="维修类型" @click="openType" class="forms-item" prop="repairType">
<view class="select-box flex align-center justify-end">
<text v-if="form.repairType" class="checked">{{showDp(form.repairType, 'typelist')}}</text>
<text v-else class="nochecked">请选择维修类型</text>
@@ -44,16 +44,16 @@
</view>
</u-form>
<view class="btn-bottom">
<u-button color="#13AFA8" @click="toNewCreate">创建工单</u-button>
<u-button color="#13AFA8" shape="circle" @click="toNewCreate">创建工单</u-button>
<view class="" style="height: 60rpx;"/>
</view>
<cell-list ref="cellList" title="维修类型" @confirm="checkItem" :list="typelist"></cell-list>
<u-keyboard ref="uKeyboard" mode="car" @cancel="cancel" @confirm="carConfirm" @change="carNoChange" safeAreaInsetBottom :show="carShow" autoChange></u-keyboard>
<u-keyboard ref="uKeyboard" @backspace="backspace" mode="car" @cancel="cancel" @confirm="carConfirm" @change="carNoChange" safeAreaInsetBottom :show="carShow" autoChange></u-keyboard>
</view>
</template>
<script>
import { getCarInfo } from '@/api/repair/repair';
import { getCarInfo, maintenanceInfo } from '@/api/repair/repair';
import cellList from '@/components/cell-list/cell-list';
import { typelist } from '@/data/typeData'
import { mapGetters } from 'vuex'
@@ -106,10 +106,23 @@
typelist
};
},
onLoad() {
console.log(this.btnState);
onLoad(option) {
if(option.id) {
this.getMaintenanceInfo(option.id)
}
},
methods: {
// 获取维修工单详情
getMaintenanceInfo(id){
maintenanceInfo({id}).then(res => {
this.$store.dispatch('SetForm', {key: 'carReservationOrderId', value: res.data.id})
this.form.carNo = res.data.carNo
this.form.name = res.data.name
this.form.phone = res.data.phone
this.form.repairType = res.data.repairType
this.carConfirm()
})
},
showDp(id, str){
if(this[str].filter(i => i.type == id).length) {
return this[str].filter(i => i.type == id)[0].text
@@ -127,11 +140,11 @@
},
// 创建工单
toNewCreate() {
this.$tab.navigateTo('/pages/repair/repair/reservation/createNewOrder')
this.$refs.uForm.validate().then(res => {
uni.$u.toast('校验通过')
this.$store.dispatch('SetForm', {key: 'name', value: this.form.name})
this.$store.dispatch('SetForm', {key: 'phone', value: this.form.phone})
this.$tab.navigateTo('/pages/repair/repair/reservation/createNewOrder')
}).catch(errors => {
uni.$u.toast('校验失败')
})
@@ -190,6 +203,11 @@
return 3
}
},
backspace() {
console.log('退格');
console.log(this.form.carNo.substr(0, this.form.carNo.length-1));
this.form.carNo = this.form.carNo.substr(0, this.form.carNo.length-1)
},
carNumdfocus() {
this.carShow = true
uni.hideKeyboard()
@@ -225,8 +243,8 @@ page {
}
.btn-bottom {
margin-top: 188rpx;
padding: 0 24rpx;
margin-top: 100rpx;
// padding: 0 24rpx;
.btn {
height: 96rpx;
}

1
pages/repair/repair/reservation/createProject.vue
View File

@@ -212,6 +212,7 @@
this.projectForm.packageId = this.packageForm.id
this.projectForm.name = this.packageForm.name
let price = 0
this.projectForm.packageItemRequestList = []
this.packageForm.itemResponsesList.forEach(item => {
price += (item.workingPrice * 1)
item.accessoryList.forEach(i => {

1
pages/repair/tabbar/repair.vue
View File

@@ -70,7 +70,6 @@
// 获取轮播图
getBrannerList() {
brannerList({type: 1}).then(res => {
console.log(res.data.list);
this.brannerList = res.data.list
})
},

BIN
static/images/icon/x_4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 843 B

5
static/scss/currency.css
View File

@@ -206,6 +206,9 @@ image {
.mr-2 {
margin-right: 20rpx;
}
.mb-2 {
margin-bottom: 20rpx;
}
.mb-3 {
margin-bottom: 30rpx;
}
@@ -277,7 +280,7 @@ image {
position: fixed;
top: 0;
left: 0;
z-index: 99999;
z-index: 999;
}
.fixed-bottom {
position: fixed;

3
store/modules/form.js
View File

@@ -4,7 +4,7 @@ const form = {
state: {
saveForm: {}, // 维保开单
packageForm: {}, // 项目套餐选中
projectList: uni.getStorageSync('form') || [], // 项目套餐选中
projectList: [], // 项目套餐选中
accessoryList: [], // 选中材料列表
workingHours: {}, // 选择工时
},
@@ -19,7 +19,6 @@ const form = {
PUSH_PACKAGELIST:(state, data) => {
state.projectList.push(data)
state.packageForm = {}
uni.setStorageSync('form', state.projectList)
},
PUSH_ACCESSORYLIST: (state, data) => {
state.accessoryList = [...state.accessoryList, ...data]

2
store/modules/pageManager.js
View File

@@ -2,7 +2,7 @@ import config from '@/config'
const pageManager = {
state: {
btnState: '', // 判断服务类型
btnState: 'orderType', // 判断服务类型
},
mutations: {

4
utils/index.js
View File

@@ -74,8 +74,8 @@ export function parseTime(time, pattern) {
//金额格式化 传入2201 输出二千二佰零一
export function convertNumberToChinese(number) {
const cnNums = ["零", "一", "二", "三", "四", "五", "六", "七", "八", "九"];
const units = ["", "十", "百", "千"];
const cnNums = ["零", "壹", "贰", "叁", "肆", "伍", "陆", "柒", "捌", "玖"];
const units = ["", "拾", "佰", "仟"];
const bigUnits = ["", "万", "亿", "万亿"];
let result = "";
const intPart = Math.floor(number);

4
utils/request.js
View File

@@ -13,7 +13,7 @@ const request = config => {
if (getToken() && !isToken) {
config.header['Authori-zation'] = getToken()
}
// console.log(getToken());
console.log(getToken());
// get请求映射params参数
// console.log(config.params);
if (config.params) {
@@ -30,7 +30,7 @@ const request = config => {
header: config.header,
dataType: 'json'
}).then(response => {
console.log(response);
// console.log(response);
let [error, res] = response
if (error) {
toast('后端接口连接异常')