Compare commits
129 Commits
prod-25-05
...
2e9f2a6fa1
| Author | SHA1 | Date | |
|---|---|---|---|
| 2e9f2a6fa1 | |||
| 93aaaacd06 | |||
| 4fd27cfa0e | |||
| f4a2c6d6fa | |||
| 5592ad773e | |||
| ff53323c3f | |||
| 1df54434c9 | |||
| 210eb41ca6 | |||
| 436a35ddb5 | |||
| b33522708e | |||
| a9938d03fa | |||
| e7ce0721ca | |||
| 3cab49c0d4 | |||
| 0d14a9add6 | |||
| 6bc78f76ad | |||
| fe5e85b8d5 | |||
| d799cf7b93 | |||
| 64240414b5 | |||
| 0aac318448 | |||
| 121435ff3e | |||
| 2dbf353113 | |||
| 728063ca86 | |||
| ad548db437 | |||
| ad5f16acc9 | |||
| 39921aa2bb | |||
| 3d56f91575 | |||
| fda0139a06 | |||
| 620e6b5ad4 | |||
| 4c0ad71e89 | |||
| 7f8c482df1 | |||
| ceff5e008c | |||
| 16924fb22e | |||
| 6a8b6b7730 | |||
| bdc78351e4 | |||
| 25cc195f1e | |||
| 97ba1500ff | |||
| 93f0e9317c | |||
| 2c83b1ea60 | |||
| 872021eca5 | |||
| 6beda9f6f1 | |||
| be0227c68b | |||
| b981a57ef5 | |||
| b836f3c979 | |||
| a5c88f11bb | |||
| 9b64456854 | |||
| 658c0c7db2 | |||
| 698f98bee7 | |||
| ec974ed55c | |||
| 41820ef796 | |||
| 2bb1885b37 | |||
| fcf088a6f6 | |||
| 60836e19da | |||
| 1abb7ac605 | |||
| 2c94eee160 | |||
| 4bbc53a9aa | |||
| 5c821e1fc0 | |||
| a84dd52eae | |||
| 4dc0e9b835 | |||
| e18be51b77 | |||
| c7cc6bfec4 | |||
| 0d862caff1 | |||
| cf60d22074 | |||
| d99b0d126f | |||
| 0249e0863d | |||
| 314ab0b729 | |||
| 24b94ebc8c | |||
| 21221c2196 | |||
| adf68457fc | |||
| 94f536d304 | |||
| 47d30f220e | |||
| ef4abf8e62 | |||
| 54041f0008 | |||
| 283d1a37a2 | |||
| 0d9c5fefee | |||
| bed585ffdc | |||
| 55044c55d5 | |||
| 97bf33b316 | |||
| 23e066e752 | |||
| 2de215bd1f | |||
| c44851f636 | |||
| 3b51a87ed1 | |||
| 138bd80bc3 | |||
| 1d8fd78a2b | |||
| 8b35675abc | |||
| 8bbdfb5ca5 | |||
| 040fbb268a | |||
| 1cb27fea3a | |||
| 61f2ae5a87 | |||
| 156d570595 | |||
| c44f872d00 | |||
| 5c603618d3 | |||
| 9a9ac9f76e | |||
| da73c933a0 | |||
| 45d95fe250 | |||
| 310b64f97c | |||
| 058ce2c72c | |||
| ee8fdb16c4 | |||
| 7ff13628b5 | |||
| eae60d1000 | |||
| 3a1e4a6ae2 | |||
| 5bd9db3165 | |||
| fbce498e94 | |||
| 6ab2e0b1d7 | |||
| 001683f215 | |||
| bb13a6e34e | |||
| 16d4425e07 | |||
| a73434fd4d | |||
| 75d20beb77 | |||
| 9a21834741 | |||
| 749daae26e | |||
| 0fc0d33742 | |||
| d1efe578d4 | |||
| 899ea612f4 | |||
| 5552b48ec4 | |||
| 56e56c7839 | |||
| 851a0e7260 | |||
| d2f124e901 | |||
| 8bc734273b | |||
| 643ee2c5eb | |||
| 881ae7e47b | |||
| d5af7692f8 | |||
| aa52bd2f31 | |||
| 9df87ac518 | |||
| 8e20adbba3 | |||
| cc083b7551 | |||
| 0a668e6f57 | |||
| c2cc09aef1 | |||
| 037fbf74fb | |||
| de252fceb2 |
@ -26,10 +26,11 @@
|
||||
<van-number-keyboard safe-area-inset-bottom />
|
||||
<script type="text/javascript">
|
||||
window._AMapSecurityConfig = {
|
||||
serviceHost: 'https://api.sinoassist.com/_AMapService',
|
||||
// serviceHost: 'https://api.sinoassist.com/_AMapService',
|
||||
securityJsCode:'91ab1ebc492d5479a68b11527bd73dc9',
|
||||
}
|
||||
</script>
|
||||
<script src="https://webapi.amap.com/maps?v=1.4.15&key=2560bbf04daef66c810c5e6a97e8c508&plugin=AMap.Polyline"></script>
|
||||
<script type="text/javascript" src="https://webapi.amap.com/maps?v=2.0&key=2560bbf04daef66c810c5e6a97e8c508&plugin=AMap.AutoComplete,AMap.PlaceSearch,AMap.Geolocation,AMap.Geocoder,AMap.Marker,AMap.Driving"></script>
|
||||
<!-- <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>-->
|
||||
<script>
|
||||
// VConsole 默认会挂载到 `window.VConsole` 上
|
||||
|
||||
72
src/api/authentication.js
Normal file
@ -0,0 +1,72 @@
|
||||
import request from '@/utils/http'
|
||||
// 根据订单 获取报备类型
|
||||
/*export function getReportListByOrder(key){
|
||||
return request({
|
||||
url: '/order/baseDriverReportConfigs/getByOrderId',
|
||||
method:'GET',
|
||||
params: key
|
||||
})
|
||||
}*/
|
||||
// 弹框
|
||||
export function successPopup( data) {
|
||||
return request({
|
||||
url: '/returnOrder/wechatDriver/user/successPopup',
|
||||
method:'POST',
|
||||
contentType: 'application/x-www-form-urlencoded',
|
||||
data
|
||||
})
|
||||
}
|
||||
// 认证进度
|
||||
export function infoVerifyProgress(data){
|
||||
return request({
|
||||
url: '/returnOrder/wechatDriver/user/infoVerifyProgress',
|
||||
method:'POST',
|
||||
contentType: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 认证详情
|
||||
export function driverInfoVerifyDetail(data) {
|
||||
return request({
|
||||
url:'/returnOrder/wechatDriver/user/driverInfoVerifyDetail',
|
||||
method:'POST',
|
||||
data: data,
|
||||
contentType: 'application/json',
|
||||
})
|
||||
}
|
||||
|
||||
// 我的信息
|
||||
export function getMyInfo(data) {
|
||||
return request({
|
||||
url:'/returnOrder/wechatDriver/user/driverDetail',
|
||||
method:'POST',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
// ocr识别
|
||||
export function ocrRecognize( data) {
|
||||
return request( {
|
||||
url:'/returnOrder/wechatDriver/user/ocrRecognize',
|
||||
data: data,
|
||||
method:'POST',
|
||||
contentType: 'application/json'
|
||||
})
|
||||
}
|
||||
// 认证
|
||||
export function driverInfoVerify( data) {
|
||||
return request({
|
||||
url:'/returnOrder/wechatDriver/user/driverInfoVerify',
|
||||
data: data,
|
||||
method:'POST',
|
||||
contentType: 'application/json'
|
||||
})
|
||||
}
|
||||
// 实名认证
|
||||
export function driverRealName( data) {
|
||||
return request('/returnOrder/wechatDriver/user/driverRealNameAuth', {
|
||||
data: data,
|
||||
method:'POST',
|
||||
contentType: 'application/json'
|
||||
})
|
||||
}
|
||||
@ -317,3 +317,26 @@ export function unifiedOCRWithCompress(data){
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 服务商是否培训
|
||||
export function jumpPage(data){
|
||||
return request({
|
||||
url:'/supplierAppV2/dispatchApp/user/jumpPage',
|
||||
method:'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
//发送确认参保
|
||||
export function sendInsuranceEmail(){
|
||||
return request({
|
||||
url:'/supplierAppV2/dispatchApp/user/sendInsuranceEmail',
|
||||
method:'POST',
|
||||
})
|
||||
}
|
||||
// 判断服务商是否参保
|
||||
export function isSendInsuranceEmail(){
|
||||
return request({
|
||||
url:'/supplierAppV2/dispatchApp/user/isSendInsuranceEmail',
|
||||
method:'POST',
|
||||
})
|
||||
}
|
||||
@ -112,3 +112,43 @@ export function correctionHandle(data) {
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 获取报警列表
|
||||
export function getAlarmList(data) {
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/alarm/alarmList',
|
||||
method:'POST',
|
||||
contentType: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 获取报警数目
|
||||
export function getAlarmCount(data) {
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/alarm/alarmCount',
|
||||
method:'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 获取报警详情
|
||||
export function getAlarmByCode(data) {
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/alarm/getAlarmByCode',
|
||||
method:'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 处理报警
|
||||
export function dealWithAlarm(data) {
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/alarm/handAlarm',
|
||||
method:'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
37
src/api/report.js
Normal file
@ -0,0 +1,37 @@
|
||||
import request from '@/utils/http'
|
||||
// 根据订单 获取报备类型
|
||||
export function getReportListByOrder(key){
|
||||
return request({
|
||||
url: '/order/baseDriverReportConfigs/getByOrderId',
|
||||
method:'GET',
|
||||
params: key
|
||||
})
|
||||
}
|
||||
|
||||
// 添加报备
|
||||
export function newOrderReporting(data){
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/order/newOrderReporting',
|
||||
method:'POST',
|
||||
contentType: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 获取报备列表
|
||||
export function reportHistory(data){
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/order/reportHistory',
|
||||
method:'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
// 获取订单信息
|
||||
export function getOrderInfo(data){
|
||||
return request({
|
||||
url: '/supplierAppV2/dispatchApp/order/reportOrderDetail',
|
||||
method:'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
@ -94,3 +94,22 @@ export function saveRecord(data){
|
||||
data
|
||||
})
|
||||
}
|
||||
// 审核不通过再次提交
|
||||
export function auditCarInfoAgain(data){
|
||||
return request({
|
||||
url: '/toc-user/car-app/auditCarInfoAgain',
|
||||
method:'POST',
|
||||
contentType: 'application/json',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 我的发布列表
|
||||
export function getAddressForService(data){
|
||||
return request({
|
||||
url: '/base/gaodeMap/getPlaceByAddress',
|
||||
method:'GET',
|
||||
params: data,
|
||||
})
|
||||
}
|
||||
|
||||
BIN
src/assets/alarm_check.png
Normal file
|
After Width: | Height: | Size: 785 B |
BIN
src/assets/alarm_one.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src/assets/alarm_repair.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
src/assets/alarm_three.png
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
src/assets/alarm_tip.png
Normal file
|
After Width: | Height: | Size: 6.4 KiB |
BIN
src/assets/alarm_trailer.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
src/assets/alarm_two.png
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
BIN
src/assets/alarm_unCheck.png
Normal file
|
After Width: | Height: | Size: 770 B |
BIN
src/assets/authentication/aduit_icon1.png
Normal file
|
After Width: | Height: | Size: 790 B |
BIN
src/assets/authentication/arrow_left.png
Normal file
|
After Width: | Height: | Size: 441 B |
BIN
src/assets/authentication/arrow_right.png
Normal file
|
After Width: | Height: | Size: 277 B |
BIN
src/assets/authentication/audit_icon1_gray.png
Normal file
|
After Width: | Height: | Size: 727 B |
BIN
src/assets/authentication/audit_icon2.png
Normal file
|
After Width: | Height: | Size: 901 B |
BIN
src/assets/authentication/audit_icon2_gray.png
Normal file
|
After Width: | Height: | Size: 803 B |
BIN
src/assets/authentication/audit_icon3.png
Normal file
|
After Width: | Height: | Size: 478 B |
BIN
src/assets/authentication/audit_icon3_gray.png
Normal file
|
After Width: | Height: | Size: 470 B |
BIN
src/assets/authentication/audit_icon4.png
Normal file
|
After Width: | Height: | Size: 795 B |
BIN
src/assets/authentication/audit_icon4_gray.png
Normal file
|
After Width: | Height: | Size: 725 B |
BIN
src/assets/authentication/bank_icon1.png
Normal file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
src/assets/authentication/camera.png
Normal file
|
After Width: | Height: | Size: 721 B |
BIN
src/assets/authentication/camera_bg.png
Normal file
|
After Width: | Height: | Size: 1.0 KiB |
BIN
src/assets/authentication/carInfo_icon1.png
Normal file
|
After Width: | Height: | Size: 7.4 KiB |
BIN
src/assets/authentication/carInfo_icon2.png
Normal file
|
After Width: | Height: | Size: 7.1 KiB |
BIN
src/assets/authentication/carInfo_icon3.png
Normal file
|
After Width: | Height: | Size: 29 KiB |
BIN
src/assets/authentication/carInfo_icon4.png
Normal file
|
After Width: | Height: | Size: 33 KiB |
BIN
src/assets/authentication/carInfo_icon5.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/authentication/car_icon1.png
Normal file
|
After Width: | Height: | Size: 6.9 KiB |
BIN
src/assets/authentication/car_icon2.png
Normal file
|
After Width: | Height: | Size: 4.9 KiB |
BIN
src/assets/authentication/icon_register.png
Normal file
|
After Width: | Height: | Size: 106 KiB |
BIN
src/assets/authentication/icon_tip.png
Normal file
|
After Width: | Height: | Size: 727 B |
BIN
src/assets/authentication/person_header.png
Normal file
|
After Width: | Height: | Size: 8.6 KiB |
BIN
src/assets/authentication/person_idcard1.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/authentication/person_idcard2.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
BIN
src/assets/authentication/tipBg.png
Normal file
|
After Width: | Height: | Size: 44 KiB |
BIN
src/assets/emptyData.png
Normal file
|
After Width: | Height: | Size: 21 KiB |
BIN
src/assets/insured-jianbian.png
Normal file
|
After Width: | Height: | Size: 19 KiB |
BIN
src/assets/insured.png
Normal file
|
After Width: | Height: | Size: 28 KiB |
BIN
src/assets/report/add_report_address.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/assets/report/add_report_arrow.png
Normal file
|
After Width: | Height: | Size: 589 B |
BIN
src/assets/report/add_report_bg.png
Normal file
|
After Width: | Height: | Size: 36 KiB |
BIN
src/assets/report/add_report_close.png
Normal file
|
After Width: | Height: | Size: 1022 B |
BIN
src/assets/report/add_report_dot.png
Normal file
|
After Width: | Height: | Size: 355 B |
BIN
src/assets/report/add_report_time.png
Normal file
|
After Width: | Height: | Size: 1.0 KiB |
BIN
src/assets/report/destMarker.png
Normal file
|
After Width: | Height: | Size: 7.3 KiB |
BIN
src/assets/report/report_address.png
Normal file
|
After Width: | Height: | Size: 5.6 KiB |
BIN
src/assets/report/report_ai.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
src/assets/report/report_cancel.png
Normal file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
src/assets/report/report_customer.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
src/assets/report/report_delay.png
Normal file
|
After Width: | Height: | Size: 4.6 KiB |
BIN
src/assets/report/report_dispatch.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
src/assets/report/report_driver.png
Normal file
|
After Width: | Height: | Size: 9.6 KiB |
BIN
src/assets/report/report_fee.png
Normal file
|
After Width: | Height: | Size: 4.1 KiB |
BIN
src/assets/report/report_line.png
Normal file
|
After Width: | Height: | Size: 300 B |
BIN
src/assets/report/report_logo.png
Normal file
|
After Width: | Height: | Size: 2.6 KiB |
BIN
src/assets/report/report_other.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
BIN
src/assets/report/report_unconnect.png
Normal file
|
After Width: | Height: | Size: 4.0 KiB |
BIN
src/assets/secondHandCar/reviseXiajia.png
Normal file
|
After Width: | Height: | Size: 6.1 KiB |
BIN
src/assets/secondHandCar/sellingInfo.png
Normal file
|
After Width: | Height: | Size: 7.9 KiB |
BIN
src/assets/secondHandCar/viewXiajia.png
Normal file
|
After Width: | Height: | Size: 5.9 KiB |
BIN
src/assets/secondHandCar/xiajia_nopass.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
BIN
src/assets/secondHandCar/xiajia_saled.png
Normal file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
src/assets/secondHandCar/xiajia_scrap.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
src/assets/secondHandCar/xiajia_warting.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 6.2 KiB |
43
src/router/authentication-router.js
Normal file
@ -0,0 +1,43 @@
|
||||
const authenticationRouter = [
|
||||
{
|
||||
path: '/auditList',
|
||||
name: 'auditList',
|
||||
component: () => import('@/views/rvDriverAuthentication/auditList.vue'),
|
||||
meta:{
|
||||
title: '小板运输司机认证',
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/personAudit',
|
||||
name: 'personAudit',
|
||||
component: () => import('@/views/rvDriverAuthentication/personAudit.vue'),
|
||||
meta:{
|
||||
title: '实名认证',
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/carAudit',
|
||||
name: 'carAudit',
|
||||
component: () => import('@/views/rvDriverAuthentication/carAudit.vue'),
|
||||
meta:{
|
||||
title: '驾驶证认证',
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/carInfoAudit',
|
||||
name: 'carInfoAudit',
|
||||
component: () => import('@/views/rvDriverAuthentication/carInfoAudit.vue'),
|
||||
meta:{
|
||||
title: '车辆信息认证',
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/bankInfo',
|
||||
name: 'bankInfo',
|
||||
component: () => import('@/views/rvDriverAuthentication/bankInfo.vue'),
|
||||
meta:{
|
||||
title: '银行卡信息认证',
|
||||
}
|
||||
},
|
||||
]
|
||||
export default authenticationRouter
|
||||
@ -4,6 +4,8 @@ Vue.use(VueRouter);
|
||||
import kpiRouter from './kpi-router'
|
||||
import invoiceRouter from "@/router/invoice-router";
|
||||
import secondHandRouter from "@/router/second-hand-router";
|
||||
import reportRouter from "@/router/report-router"
|
||||
import authenticationRouter from "@/router/authentication-router"
|
||||
const routes = [
|
||||
{
|
||||
path: '/',
|
||||
@ -250,6 +252,22 @@ const routes = [
|
||||
title:'车辆维保'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/vehicleAlarmList',
|
||||
name: 'vehicleAlarmList',
|
||||
component:()=>import('@/views/vehicle-maintenance/vehicle-alarm-list.vue'),
|
||||
meta: {
|
||||
title:'车辆报警'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/vehicleAlarmDetail',
|
||||
name: 'vehicleAlarmDetail',
|
||||
component:()=>import('@/views/vehicle-maintenance/vehicle-alarm-detail.vue'),
|
||||
meta: {
|
||||
title:'报警详情'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/maintenanceApplication',
|
||||
name: 'maintenanceApplication',
|
||||
@ -277,6 +295,8 @@ const routes = [
|
||||
...kpiRouter,
|
||||
...invoiceRouter,
|
||||
...secondHandRouter,
|
||||
...reportRouter,
|
||||
...authenticationRouter
|
||||
]
|
||||
|
||||
const router = new VueRouter({
|
||||
|
||||
29
src/router/report-router.js
Normal file
@ -0,0 +1,29 @@
|
||||
const reportRouter = [
|
||||
{
|
||||
path: '/reportIndex',
|
||||
name: 'reportIndex',
|
||||
component: () => import('@/views/report/reportIndex'),
|
||||
meta:{
|
||||
title: '道路救援',
|
||||
cache: true,
|
||||
modalState: false,
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/addressMap',
|
||||
name: 'addressMap',
|
||||
component: () => import('@/views/report/addressMap'),
|
||||
meta:{
|
||||
title: '道路救援',
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/insuredPage',
|
||||
name: 'insuredPage',
|
||||
component: () => import('@/views/liabilityInsurance/insuredPage'),
|
||||
meta:{
|
||||
title: '参保救援职业责任险',
|
||||
}
|
||||
},
|
||||
]
|
||||
export default reportRouter
|
||||
@ -55,5 +55,13 @@ const secondHandCar = [
|
||||
title: '免责声明',
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/sellingInfo',
|
||||
name: 'sellingInfo',
|
||||
component: () => import('@/views/secondHandCar/sellingInfo.vue'),
|
||||
meta:{
|
||||
title: '售出信息',
|
||||
}
|
||||
},
|
||||
]
|
||||
export default secondHandCar
|
||||
|
||||
@ -47,4 +47,84 @@ select{
|
||||
font-size: 14px;
|
||||
color: #000000;
|
||||
}
|
||||
.text_center {
|
||||
text-align: center;
|
||||
}
|
||||
//同意协议勾选
|
||||
.protocol-list {
|
||||
display: flex;
|
||||
//align-items: top;
|
||||
margin-top: 5px;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
.protocol-text {
|
||||
font-size: 12px;
|
||||
color: #203152;
|
||||
line-height: 18px;
|
||||
//text-align: left;
|
||||
.linkColor {
|
||||
color: #3364B7;
|
||||
word-break: keep-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon_register {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.mr15 {
|
||||
margin-right: 15px;
|
||||
}
|
||||
.mt20 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.flex_vertical_center {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.flex_between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
|
||||
/*@mixin wh($w,$h) {
|
||||
width: $w;
|
||||
height: $h;
|
||||
}
|
||||
@mixin flex(){
|
||||
display: flex;
|
||||
}
|
||||
@mixin alignCenter(){
|
||||
@include flex();
|
||||
align-items: center;
|
||||
}
|
||||
@mixin col(){
|
||||
@include flex();
|
||||
flex-direction: column;
|
||||
}
|
||||
@mixin colBothCenter(){
|
||||
@include col();
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@mixin sizingPadding($t,$r,$b,$l) {
|
||||
box-sizing: border-box;
|
||||
padding: $t $r $b $l;
|
||||
}*/
|
||||
/*@mixin weigthSize($wei,$size){
|
||||
font-weight:$wei ;
|
||||
font-size: $size;
|
||||
}
|
||||
@mixin weigthSizeColor($wei,$size,$col){
|
||||
@include weigthSize($wei,$size);
|
||||
color: $col;
|
||||
}*/
|
||||
|
||||
43
src/styles/infoShow.scss
Normal file
@ -0,0 +1,43 @@
|
||||
.carInfo{
|
||||
margin-top: 10px;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
min-height: 151px;
|
||||
background: #FFFFFF;
|
||||
padding:8px 23px 17px 30px ;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left_wrap,.right_wrap{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #323643;
|
||||
.mar_left{
|
||||
margin-left: 8px;
|
||||
}
|
||||
.star {
|
||||
color: red;
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
.right_wrap{
|
||||
align-items: flex-end;
|
||||
.phone{
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: #323643;
|
||||
}
|
||||
input{
|
||||
font-size: 12px;
|
||||
text-align: right;
|
||||
&::-webkit-input-placeholder { /* WebKit browsers,webkit内核浏览器 */
|
||||
color: #A1A1A1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -105,3 +105,32 @@
|
||||
color: $col;
|
||||
line-height: $hei;
|
||||
}
|
||||
@mixin width_height($width,$height){
|
||||
width: $width;
|
||||
height: $height;
|
||||
}
|
||||
@mixin flex($row,$colum){
|
||||
display: flex;
|
||||
justify-content: $row;
|
||||
align-items: $colum;
|
||||
}
|
||||
@mixin center(){
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
@mixin direction($justify-content){
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: $justify-content;
|
||||
}
|
||||
@mixin iconImg($width,$height,$marginRight){
|
||||
width: $width;
|
||||
height: $height;
|
||||
margin-right: $marginRight;
|
||||
}
|
||||
|
||||
@mixin iconImgLeft($width,$height,$marginRight){
|
||||
width: $width;
|
||||
height: $height;
|
||||
margin-left: $marginRight;
|
||||
}
|
||||
@ -42,11 +42,89 @@ const timeFormat=(data) =>{
|
||||
return formattedDate;
|
||||
|
||||
}
|
||||
// 认证状态
|
||||
const verifyStatus=(id)=> {
|
||||
const ids = String(id)
|
||||
const status = {
|
||||
'0': 1, // 个人信息认证
|
||||
'-1': 1, // 已注册
|
||||
'7': 1, // 已发送待认证
|
||||
'1': 2, // 驾照信息认证
|
||||
'2': 3, // 车辆信息审核
|
||||
'3': 4, // 银行卡信息审核
|
||||
'4': 5, // 认证中
|
||||
'8': 6, // 审核中
|
||||
'11': 6, // 审核失败
|
||||
'12': 6 // 审核成功
|
||||
}
|
||||
return status[ids]
|
||||
}
|
||||
|
||||
// 认证状态 简易版
|
||||
const verifyStatusSimple=(id)=> {
|
||||
const ids = String(id)
|
||||
const status = {
|
||||
'0': 1, // 个人信息认证
|
||||
'-1': 1, // 已注册
|
||||
'7': 1, // 已发送待认证
|
||||
'1': 3, // 驾照信息认证
|
||||
'2': 3, // 车辆信息审核
|
||||
'3': 4, // 银行卡信息审核
|
||||
'4': 5, // 认证中
|
||||
'8': 6, // 审核中
|
||||
'11': 6, // 审核失败
|
||||
'12': 6 // 审核成功
|
||||
}
|
||||
return status[ids]
|
||||
}
|
||||
|
||||
// 认证状态
|
||||
const tipString=(id)=> {
|
||||
const ids = String(id)
|
||||
const status = {
|
||||
'0': { // 个人信息认证
|
||||
tip: '认证待提交',
|
||||
button: '待认证'
|
||||
},
|
||||
'1': { // 驾照信息认证
|
||||
tip: '认证待提交',
|
||||
button: '待认证'
|
||||
},
|
||||
'2': { // 车辆信息审核
|
||||
tip: '认证待提交',
|
||||
button: '待认证'
|
||||
},
|
||||
'3': { // 银行卡信息审核
|
||||
tip: '认证待提交',
|
||||
button: '待认证'
|
||||
},
|
||||
'4': { // 认证中
|
||||
tip: '认证待提交',
|
||||
button: '待认证'
|
||||
},
|
||||
'8': { // 审核中
|
||||
tip: '认证审核中',
|
||||
button: '审核中'
|
||||
},
|
||||
'11': { // 审核失败
|
||||
tip: '认证审核失败',
|
||||
button: '审核失败'
|
||||
},
|
||||
'12': { // 审核成功
|
||||
tip: '认证审核成功',
|
||||
button: '审核成功'
|
||||
},
|
||||
}
|
||||
return status[ids]
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
formatNumber,
|
||||
formatDate,
|
||||
leftCopy,
|
||||
timeFormat,
|
||||
formatDate1
|
||||
formatDate1,
|
||||
verifyStatus,
|
||||
verifyStatusSimple,
|
||||
tipString
|
||||
}
|
||||
@ -11,7 +11,11 @@ const service = axios.create({
|
||||
})
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
let token = urlParams.get('token');
|
||||
localStorage.setItem('token', token);
|
||||
if( token ) {
|
||||
localStorage.setItem('token', token);
|
||||
} else {
|
||||
localStorage.setItem('token', '');
|
||||
}
|
||||
service.interceptors.request.use(
|
||||
config => {
|
||||
let reqUrl=config.url
|
||||
@ -21,11 +25,13 @@ service.interceptors.request.use(
|
||||
}
|
||||
config.headers['Content-Type'] = config.contentType || 'application/x-www-form-urlencoded'
|
||||
let token = localStorage.getItem('token');
|
||||
// let token='4099761587129c46b03c9316c9e866c9'
|
||||
// let token='eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJBTkNIQU5HIiwidXNlcklkIjo0NTY3MSwibmFtZSI6IuWuieeVhSIsInVzZXJOYW1lIjoiQU5DSEFORyIsInN1cHBsaWVySWQiOjExMjgsImlzWmQiOjAsImV4cCI6MTc1NTQyMjUyNX0.xzDZhaANJFnbeViIHJA0SEtOyTv7Ja3rKmXqRKRuFkc'
|
||||
// let token='eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJTSEhQWEIiLCJ1c2VySWQiOjU0NzI2LCJuYW1lIjoiI-a1i-ivleWwj-eZveeZvSIsInVzZXJOYW1lIjoiU0hIUFhCIiwic3VwcGxpZXJJZCI6MTAwMDE2NSwiZXhwIjoxNzQ0NTEwNzkwfQ.JPk0OA7slYJN3FIi_uhW4Y0CiWRvl6R1dK8MRTbyhD8'
|
||||
if(!(reqUrl=='/supplier/supplierTraining/trainingTask' || reqUrl=='/supplier/supplierTraining/normalList' || reqUrl=='/supplier/supplierTraining/trainingList')){
|
||||
if(token) {
|
||||
config.headers['Authorization'] = `${token}`;
|
||||
config.headers['token'] = `${token}`;
|
||||
}
|
||||
}
|
||||
return config
|
||||
},
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import { getAddressForService } from "@/api/secondHandCar"
|
||||
// 获取定位, 返回 经纬度
|
||||
export function getLocal(mapContext) {
|
||||
return new Promise((resolve, reject) => {
|
||||
@ -36,6 +37,7 @@ export function getAddress(mapContext, lnglat) {
|
||||
} else {
|
||||
console.log(result)
|
||||
alert(JSON.stringify(result))
|
||||
reject(result)
|
||||
}
|
||||
})
|
||||
})
|
||||
@ -44,8 +46,20 @@ export function getAddress(mapContext, lnglat) {
|
||||
|
||||
// 输入提示
|
||||
export function searchFun(mapContext, cityCode, keyword) {
|
||||
return new Promise((resolve, reject) => {
|
||||
mapContext.plugin('AMap.AutoComplete', function(){
|
||||
return new Promise((resolve) => {
|
||||
getAddressForService({
|
||||
city: '',
|
||||
address: keyword
|
||||
}).then((res) => {
|
||||
if(res.code == 200) {
|
||||
resolve(res?.data?.pois || [])
|
||||
} else {
|
||||
resolve([])
|
||||
}
|
||||
}).catch(() => {
|
||||
resolve([])
|
||||
})
|
||||
/*mapContext.plugin('AMap.AutoComplete', function(){
|
||||
var autoOptions = {
|
||||
city: cityCode || '全国',
|
||||
};
|
||||
@ -57,10 +71,10 @@ export function searchFun(mapContext, cityCode, keyword) {
|
||||
if(result.info == 'OK') {
|
||||
resolve(result.tips)
|
||||
} else {
|
||||
reject(result)
|
||||
resolve([])
|
||||
}
|
||||
})
|
||||
})
|
||||
})*/
|
||||
})
|
||||
}
|
||||
|
||||
@ -90,6 +104,7 @@ export function getRoad( mapContext, startLng, startLat, endLng, endLat ) {
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
function drawRoute(route, map) {
|
||||
let path = parseRouteToPath(route)
|
||||
|
||||
@ -106,3 +121,4 @@ function drawRoute(route, map) {
|
||||
|
||||
map.add(routeLine);
|
||||
}
|
||||
*/
|
||||
|
||||
@ -5,6 +5,12 @@ export const myMixins = {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showFun() {
|
||||
if( localStorage.getItem('infoVerify') == 8 || localStorage.getItem('infoVerify') == 12 ) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
goPage(page, query) {
|
||||
this.$router.push({
|
||||
name: page,
|
||||
|
||||
@ -101,7 +101,7 @@ export default {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
this.driverId = urlParams.get('driverId');
|
||||
this.time=timeFormat(Date.now())
|
||||
this.keyword=urlParams.get('keyWord') || ''
|
||||
this.keyword=urlParams.get('keyword') || ''
|
||||
this.getTrainingList();
|
||||
document.addEventListener('visibilitychange', async ( ) => {
|
||||
let state = document.visibilityState
|
||||
|
||||
@ -36,9 +36,6 @@
|
||||
v-model="keyword"
|
||||
placeholder="名称/关键词/简介"
|
||||
>
|
||||
<!-- <template #button>
|
||||
<van-icon class="search" name="search" size="20" @click="getTrainingList"/>
|
||||
</template>-->
|
||||
</van-field>
|
||||
</template>
|
||||
<template slot="left">
|
||||
@ -104,32 +101,34 @@ export default {
|
||||
this.supplierId = urlParams.get('supplierId');
|
||||
this.driverId = urlParams.get('driverId');
|
||||
if(this.driverId){
|
||||
this.keyword=urlParams.get('keyWord') || ''
|
||||
this.keyword=urlParams.get('keyword') || ''
|
||||
}
|
||||
this.getNormalList()
|
||||
},
|
||||
methods:{
|
||||
onRefresh() {
|
||||
this.getNormalList()
|
||||
setTimeout(() => {
|
||||
if(!this.isLoading){
|
||||
this.$toast('刷新成功');
|
||||
}
|
||||
/* setTimeout(() => {
|
||||
this.$toast('刷新成功');
|
||||
this.isLoading = false;
|
||||
}, 1000);
|
||||
}, 1000);*/
|
||||
},
|
||||
async changeTab(index) {
|
||||
this.activeIndex = index
|
||||
await this.getNormalList()
|
||||
},
|
||||
async getNormalList(){
|
||||
let res= await getNormalList({
|
||||
type:this.supplierId ? 2 : 1,
|
||||
// type:2,
|
||||
id: this.supplierId ? this.supplierId : this.driverId,
|
||||
// id:this.supplierId,//33041,
|
||||
text:this.keyword || '',
|
||||
})
|
||||
this.isLoading = true;
|
||||
this.totalList=[]
|
||||
this.pageList=[]
|
||||
let res= await getNormalList({
|
||||
type:this.supplierId ? 2 : 1,
|
||||
id: this.supplierId ? this.supplierId : this.driverId,
|
||||
text:this.keyword || '',
|
||||
})
|
||||
this.totalList=res.data.list
|
||||
let result=[]
|
||||
if(this.activeIndex === 0){
|
||||
@ -149,6 +148,7 @@ export default {
|
||||
}else {
|
||||
this.showEmpty = false
|
||||
}
|
||||
this.isLoading = false
|
||||
},
|
||||
initShow(){
|
||||
this.keyword= '',
|
||||
|
||||
@ -88,7 +88,8 @@
|
||||
<script>
|
||||
import { Decimal } from 'decimal.js';
|
||||
import {myMixins} from "@/utils/myMixins"
|
||||
import {notifyInvoiceList} from "@/api/mine"
|
||||
import {notifyInvoiceList, jumpPage} from "@/api/mine"
|
||||
import {Dialog} from "vant";
|
||||
export default {
|
||||
name: "invoicingNotify",
|
||||
mixins:[myMixins],
|
||||
@ -154,7 +155,7 @@ export default {
|
||||
}
|
||||
}
|
||||
},
|
||||
changeTabHandler() {
|
||||
async changeTabHandler() {
|
||||
this.pageNum = 1;
|
||||
this.notifyList = [];
|
||||
this.checkList = [];
|
||||
@ -166,6 +167,20 @@ export default {
|
||||
this.status = 2;
|
||||
this.dispatchAppSearchInvoiced = '';
|
||||
this.pageSize = 10000
|
||||
let res = await this.getJumpHandler();
|
||||
if(res?.data?.jump) {
|
||||
Dialog.alert({
|
||||
message: '您有暂未完成的培训,请在中道调度APP上完成培训,再进行发票上传',
|
||||
confirmButtonText: '去培训',
|
||||
confirmButtonColor: '#0E76F4',
|
||||
showCancelButton: false,
|
||||
}).then(async() => {
|
||||
this.goPage('newTrainingList', { supplierId : this.supplierId })
|
||||
}).catch(() => {
|
||||
// on cancel
|
||||
});
|
||||
return false
|
||||
}
|
||||
} else if(this.active == 3) { // 已开票,需要分页
|
||||
this.status = '';
|
||||
this.dispatchAppSearchInvoiced = 1;
|
||||
@ -173,6 +188,10 @@ export default {
|
||||
}
|
||||
this.getNotifyList()
|
||||
},
|
||||
async getJumpHandler() {
|
||||
let res = await jumpPage();
|
||||
return res
|
||||
},
|
||||
getMonth(item) {
|
||||
let str = '';
|
||||
let startTime = new Date(item.createTime);
|
||||
|
||||
@ -62,7 +62,7 @@
|
||||
</div>
|
||||
<div class="upload_btn_wrap">
|
||||
<div class="btn_save" @click="createInvoiceHandler">保存</div>
|
||||
<van-uploader :before-read="beforeRead" :after-read="afterRead" accept=".png,.jpg,.jpeg,.pdf,.ofd">
|
||||
<van-uploader :before-read="beforeRead" use-before-read :after-read="afterRead" accept=".png,.jpg,.jpeg,.pdf,.ofd">
|
||||
<div class="btn_upload">
|
||||
<img class="icon_upload" src="@/assets/icon_upload.png" alt="">
|
||||
上传发票
|
||||
@ -76,13 +76,14 @@
|
||||
import { Decimal } from 'decimal.js';
|
||||
import { Dialog } from "vant";
|
||||
import { myMixins } from "@/utils/myMixins"
|
||||
import { uploadInvoice, getBillingInfo, deleteInvoice, createBatch } from "@/api/mine"
|
||||
import { uploadInvoice, getBillingInfo, deleteInvoice, createBatch} from "@/api/mine"
|
||||
export default {
|
||||
name: "uploadInvoice",
|
||||
mixins:[ myMixins ],
|
||||
data(){
|
||||
return {
|
||||
list: [],
|
||||
fileObj: '',
|
||||
invoiceMoneyTotal: 0,
|
||||
tableData: [],
|
||||
activeObj: {},
|
||||
@ -132,6 +133,10 @@
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/* async getJumpHandler() {
|
||||
let res = await jumpPage();
|
||||
return res
|
||||
},*/
|
||||
async initData() {
|
||||
this.list = JSON.parse(localStorage.getItem('list'));
|
||||
this.batchIds = [];
|
||||
@ -230,14 +235,13 @@
|
||||
}).catch(() => {
|
||||
});
|
||||
},
|
||||
beforeRead (file) {
|
||||
async beforeRead (file) {
|
||||
const FileExt = file.name.replace(/.+\./, "");
|
||||
if (['jpg', 'png', 'jpeg', 'pdf', 'ofd'].indexOf(FileExt.toLowerCase()) === -1) {
|
||||
this.$toast('请上传后缀名为jpg、jpeg、png、pdf、ofd的文件!')
|
||||
return false;
|
||||
return false
|
||||
}
|
||||
this.$set(this.activeObj, 'fileType', FileExt)
|
||||
return true
|
||||
},
|
||||
async afterRead (file) {
|
||||
try {
|
||||
|
||||
@ -308,7 +308,7 @@ export default {
|
||||
}else{
|
||||
this.supplierServiceList = this.oldSupplierServiceList
|
||||
}
|
||||
|
||||
this.setDefault();
|
||||
},
|
||||
},
|
||||
|
||||
@ -321,6 +321,23 @@ export default {
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
setDefault() {
|
||||
if( this.vehicleLicenseInfo?.vehicleType?.includes('小型') || this.vehicleLicenseInfo?.vehicleType?.includes('微型') || this.vehicleLicenseInfo?.vehicleType?.includes('普通') || this.vehicleLicenseInfo?.vehicleType?.includes('摩托') ) {
|
||||
this.vehicleTypes.map(item => {
|
||||
if( item.value == 1 || item.value == 9 ) {
|
||||
item.disabled = false;
|
||||
} else {
|
||||
item.disabled = true;
|
||||
}
|
||||
})
|
||||
this.$forceUpdate();
|
||||
} else {
|
||||
this.vehicleTypes.map(item => {
|
||||
item.disabled = false;
|
||||
})
|
||||
this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
getVehicleLicense(color) {
|
||||
if( color == '蓝' ) {
|
||||
this.vehicleLicense = 1
|
||||
@ -402,6 +419,7 @@ export default {
|
||||
this.vehicleLicenseInfo.registrationDate = frontInfo?.registerDate;
|
||||
this.vehicleLicenseInfo.issueDate = frontInfo?.issueDate;
|
||||
this.vehicleLicenseInfo.issueAuthority = frontInfo?.seal;
|
||||
this.setDefault();
|
||||
}
|
||||
},
|
||||
async vehicleBackOcrHandler() { // 行驶证副页 ocr 识别
|
||||
|
||||
@ -84,7 +84,7 @@ export default {
|
||||
color:'rgba(4, 4, 21,0.45)'
|
||||
},
|
||||
detail: {
|
||||
color:this.isStore ? this.bgColor : '#040415',
|
||||
color:this.isStore ? this.bgColor : (this.bgColor || '#040415'),
|
||||
fontSize: this.isStore ? 43 :19,
|
||||
formatter: this.isStore ? '{value}' : '{value}%'
|
||||
}
|
||||
|
||||
@ -39,7 +39,7 @@
|
||||
<van-tabs v-model="active" sticky @click="tabClickHandle">
|
||||
<van-tab v-for="(item,index) in tabArr" :key="index" :title="item.name"></van-tab>
|
||||
<div v-if="isMobile && !([0,1,2,3].includes(active))" class="tipArrow left">{{ leftArr }}</div>
|
||||
<div v-if="isMobile && !([9,10].includes(active))" class="tipArrow right">>>></div>
|
||||
<div v-if="isMobile && !([9,10, 11].includes(active))" class="tipArrow right">>>></div>
|
||||
</van-tabs>
|
||||
<div v-loading="loadingData" :class="{'contentWrap':true,'webcontentWrap':!isMobile}" v-if="active===0">
|
||||
<div :class="{'reciceOrder':true,'webCom':!isMobile}">
|
||||
@ -51,11 +51,11 @@
|
||||
<div class="itemTitle">承接案件量</div>
|
||||
</div>
|
||||
<div class="center common" @click="clickJumpHandle(5)">
|
||||
<div class="num">{{ indexData && indexData.refuseOrderRate }}%</div>
|
||||
<div class="num" :class="{'numRed': Number(indexData?.refuseOrderRate) >= 5, 'numGreen': Number(indexData?.refuseOrderRate) < 5 }">{{ indexData && indexData.refuseOrderRate }}%</div>
|
||||
<div class="itemTitle" style="cursor: pointer">拒单率 ></div>
|
||||
</div>
|
||||
<div class="right common" @click="clickJumpHandle(6)">
|
||||
<div class="num">{{ indexData && indexData.timeoutOrderRate }}%</div>
|
||||
<div class="num" :class="{'numRed': Number(indexData?.timeoutOrderRate) >= 5, 'numGreen': Number(indexData?.timeoutOrderRate) < 5 }">{{ indexData && indexData.timeoutOrderRate }}%</div>
|
||||
<div class="itemTitle" style="cursor: pointer">超时率 ></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -63,41 +63,39 @@
|
||||
<div :class="{'reciceOrder':true,'webCom':!isMobile,'evaluate':isMobile}">
|
||||
<div class="title">客户评价</div>
|
||||
<div class="reciceOrderIWrap" v-if="indexData">
|
||||
<circle-char ref="Doughnut1" :data="indexData && indexData.complainOrderRate" :title-text="'投诉率'" :bg-color="'#9485ED'"
|
||||
<circle-char ref="Doughnut1" :data="indexData && indexData.complainOrderRate" :title-text="'投诉率'" :bg-color="Number(indexData?.complainOrderRate || 0) <= 0.1 ? 'green' : 'red'"
|
||||
:is-store="false" @clickComplain="clickJumpHandle(7)"></circle-char>
|
||||
<circle-char ref="Doughnut2" :data="indexData && indexData.customerSatisfaction" :title-text="'客户满意度'"
|
||||
:bg-color="'#5DDECF'"></circle-char>
|
||||
<circle-char ref="Doughnut2" :data="indexData && indexData.pinganFavorableRate" :title-text="'平安好评率'" :is-store="false"
|
||||
:bg-color="Number(indexData?.pinganFavorableRate || 0) >= 99.4 ? 'green' : 'red'"></circle-char>
|
||||
<circle-char ref="Doughnut3" :data="indexData && indexData.urgeRate" :title-text="'催促率'"
|
||||
:bg-color="'#FFADAD'"></circle-char>
|
||||
:bg-color="Number(indexData?.urgeRate || 0) >= 3 ? 'red' : 'green'"></circle-char>
|
||||
</div>
|
||||
</div>
|
||||
<div :class="{'reciceOrder':true,'webCom':!isMobile,'appUse':isMobile}">
|
||||
<div class="title">APP使用</div>
|
||||
<div class="reciceOrderIWrap" v-if="indexData">
|
||||
<circle-char ref="Doughnut4" :data="indexData && indexData.appRate" :title-text="'使用率'" :bg-color="'#3AA1FF'"
|
||||
<circle-char ref="Doughnut4" :data="indexData && indexData.appRate" :title-text="'APP使用率'" :bg-color="Number(indexData?.appRate || 0) >= 95 ? 'green' : 'red'"
|
||||
:is-store="false"
|
||||
@clickUse="clickJumpHandle(8)"></circle-char>
|
||||
<circle-char ref="Doughnut5" :data="indexData && indexData.threeMinutesContactRate" :title-text="'3′联系客户率'"
|
||||
:bg-color="'#5D7FD7'"></circle-char>
|
||||
<circle-char ref="Doughnut6" :data="indexData && indexData.polymerizationSuccessRate" :title-text="'总聚合成功率'"
|
||||
:bg-color="'#4ECB73'"></circle-char>
|
||||
<circle-char ref="Doughnut5" :data="indexData && indexData.threeMinutesContactRate" :title-text="'3′联系客户率'" :bg-color="Number(indexData?.threeMinutesContactRate || 0) >= 90 ? 'green' : 'red'"></circle-char>
|
||||
<circle-char ref="Doughnut6" :data="indexData && indexData.wholeJuheSuccessRate" :title-text="'总聚合成功率'" :is-store="false" :bg-color="Number(indexData?.wholeJuheSuccessRate || 0) >= 80 ? 'green' : 'red'"></circle-char>
|
||||
</div>
|
||||
</div>
|
||||
<div :class="{'reciceOrder':true,'webCom':!isMobile}">
|
||||
<div :class="{'title':true,'webTitle':!isMobile}">时效</div>
|
||||
<div class="reciceOrderIWrap">
|
||||
<div class="left common">
|
||||
<div class="num">{{ indexData && indexData.receiving }}</div>
|
||||
<div class="num" :class="{'numRed': Number(indexData?.receiving) > 5, 'numGreen': Number(indexData?.receiving) <= 5 }">{{ indexData && indexData.receiving }}</div>
|
||||
<div class="itemTitle">接单时效(分)</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="center common">
|
||||
<div class="num">{{ indexData && indexData.polymerizationSuccessArriving }}</div>
|
||||
<div class="itemTitle">集合成功到达时效(分)</div>
|
||||
<div class="num" :class="{'numRed': Number(indexData?.pinganJuheSuccessArriving) > 22, 'numGreen': Number(indexData?.pinganJuheSuccessArriving) <= 22 }">{{ indexData && indexData.pinganJuheSuccessArriving }}</div>
|
||||
<div class="itemTitle">平安聚合成功到达时效(分)</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<div class="right common">
|
||||
<div class="num">{{ indexData && indexData.arriving }}</div>
|
||||
<div class="num" :class="{'numRed': Number(indexData?.arriving) > 40, 'numGreen': Number(indexData?.arriving) <= 40 }">{{ indexData && indexData.arriving }}</div>
|
||||
<div class="itemTitle">到达时效(分)</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -111,7 +109,7 @@
|
||||
<i class="el-icon-question" @click.prevent="showScoreChart = !showScoreChart"></i>
|
||||
</div>
|
||||
<div class="storeWrap" v-if="indexData">
|
||||
<circle-char v-show="showScoreChart" ref="Doughnut7" :data="indexData && indexData.score" :bg-color="'#00D273'" :is-store="true"></circle-char>
|
||||
<circle-char v-show="showScoreChart" ref="Doughnut7" :data="indexData && indexData.score" :bg-color="Number(indexData?.score || 0) >= 60 ? 'green' : 'red'" :is-store="true"></circle-char>
|
||||
<div v-show="!showScoreChart" class="detailScore">
|
||||
<div class="left">
|
||||
<div>
|
||||
@ -245,7 +243,7 @@
|
||||
:total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
<div v-loading="loadingData" class="contentWrap monthTotal" v-if="[3,6,7,8,9,10].includes(active)">
|
||||
<div v-loading="loadingData" class="contentWrap monthTotal" v-if="[3,6,7,8,9,10, 11].includes(active)">
|
||||
<div :class="{'comTab':true,'detailTable':isMobile}">
|
||||
<noFit-table :active='active' :is-mobile='isMobile' :table-data="detailList" :label-list="labelList"
|
||||
></noFit-table>
|
||||
@ -292,7 +290,7 @@ export default {
|
||||
//
|
||||
tabArr: [
|
||||
{name: '总览'}, {name: '月/总'}, {name: '日/总'},{name: '师傅满意度'},{name: '月/师傅'}, {name: '日/师傅'}, {name: '拒单明细'},
|
||||
{name: '超时明细'}, {name: '投诉明细'}, {name: '不使用APP案件明细'}, {name: '车辆在线情况'}
|
||||
{name: '超时明细'}, {name: '投诉明细'}, {name: '不使用APP案件明细'}, {name: '车辆在线情况'} , {name: '聚合失败案件明细'}
|
||||
],
|
||||
list: [{name: '接单指标'}, {name: '客户评价'}, {name: 'APP使用'}, {name: ' 时效 '}],
|
||||
driverList: [{name: '得分总览'},{name: '接单情况'}, {name: '服务评价'}, {name: 'APP使用情况'}, {name: '时效 '}],
|
||||
@ -312,10 +310,12 @@ export default {
|
||||
v4: [],
|
||||
v5: [],
|
||||
v6: [],
|
||||
v7: [],
|
||||
v8: [],
|
||||
xAxisArr: [],
|
||||
isMobile: false,
|
||||
isZd: '',
|
||||
current:'',
|
||||
current:'2024-10',
|
||||
// current: dayjs(new Date()).format('M'),
|
||||
supplierName:'',
|
||||
value: '1',
|
||||
@ -370,14 +370,19 @@ export default {
|
||||
}
|
||||
},
|
||||
monthChangeHandle(value){
|
||||
console.log('valuevaluevalue', dayjs(new Date(value)).format('YYYY-MM-DD'))
|
||||
if (value) {
|
||||
const year = value.getFullYear();
|
||||
this.current = dayjs(new Date(value)).format('YYYY-MM')
|
||||
const _tempDate = dayjs(new Date(value)).format('YYYY-MM-DD')
|
||||
const lastDay = dayjs(_tempDate).endOf('month');
|
||||
|
||||
/*const year = value.getFullYear();
|
||||
const month = value.getMonth() + 1; // 月份从 0 开始,需要加 1
|
||||
const yearAndMonth = year + '-' + (month > 9 ? month : '0' + month);
|
||||
this.current = dayjs(new Date(yearAndMonth)).format('YYYY-MM')
|
||||
this.startTime = `${year}-${this.padZero(month)}-01 00:00:00`;
|
||||
const lastDay = new Date(year, month, 0).getDate(); // 获取该月的最后一天
|
||||
this.endTime = `${year}-${this.padZero(month)}-${this.padZero(lastDay)} 23:59:59`;
|
||||
this.current = dayjs(new Date(yearAndMonth)).format('YYYY-MM')*/
|
||||
this.startTime = `${this.current}-01 00:00:00`;
|
||||
// const lastDay = new Date(year, month, 0).getDate(); // 获取该月的最后一天
|
||||
this.endTime = `${this.current}-${this.padZero(lastDay.date())} 23:59:59`;
|
||||
this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
|
||||
console.log(" this.startMonthTime", this.startMonthTime)
|
||||
this.selectSupplierNameHandle();
|
||||
@ -455,6 +460,8 @@ export default {
|
||||
this.v4 = []
|
||||
this.v5 = []
|
||||
this.v6 = []
|
||||
this.v7 = []
|
||||
this.v8 = []
|
||||
this.xAxisArr = []
|
||||
this.etlDetailList=[]
|
||||
this.etlLabelList=[]
|
||||
@ -545,7 +552,7 @@ export default {
|
||||
formatter: '{c}%'
|
||||
},
|
||||
},
|
||||
{
|
||||
/* {
|
||||
name: '客户取消率',
|
||||
type: "line",
|
||||
data: this.v4,
|
||||
@ -556,24 +563,13 @@ export default {
|
||||
position: 'top',
|
||||
formatter: '{c}%'
|
||||
},
|
||||
},
|
||||
},*/
|
||||
]
|
||||
let series2 = [{
|
||||
name: '客户评价率',
|
||||
type: 'line',
|
||||
data: this.v1,
|
||||
smooth: true,
|
||||
yAxisIndex: 0,
|
||||
label: {
|
||||
show: true, // 显示标签
|
||||
position: 'top', // 标签位置在柱形顶部
|
||||
formatter: '{c}%'
|
||||
}
|
||||
},
|
||||
let series2 = [
|
||||
{
|
||||
name: '投诉率',
|
||||
type: "line",
|
||||
data: this.v3,
|
||||
data: this.v2,
|
||||
smooth: true,
|
||||
yAxisIndex: 0,
|
||||
label: {
|
||||
@ -583,10 +579,10 @@ export default {
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '客户满意度',
|
||||
name: '好评率',
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
data: this.v2,
|
||||
data: this.v4,
|
||||
yAxisIndex: 0,
|
||||
label: {
|
||||
show: true,
|
||||
@ -595,7 +591,7 @@ export default {
|
||||
},
|
||||
},
|
||||
]
|
||||
let series3 = [
|
||||
/*let series3 = [
|
||||
{
|
||||
name: 'APP使用率',
|
||||
type: 'line',
|
||||
@ -668,8 +664,8 @@ export default {
|
||||
formatter: '{c}%'
|
||||
},
|
||||
},
|
||||
]
|
||||
let series4 = [{
|
||||
]*/
|
||||
/*let series4 = [{
|
||||
name: '接单时效(分)',
|
||||
type: 'bar',
|
||||
data: this.v1,
|
||||
@ -693,6 +689,19 @@ export default {
|
||||
formatter: '{c}%'
|
||||
},
|
||||
},
|
||||
]*/
|
||||
let series4 = [
|
||||
{
|
||||
name: '接单时效(分)',
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
data: this.v1,
|
||||
yAxisIndex: 0,
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
},
|
||||
},
|
||||
]
|
||||
let series5 = [{
|
||||
name: '到达时效(分)',
|
||||
@ -747,21 +756,15 @@ export default {
|
||||
formatter: '{value}%'
|
||||
}
|
||||
} ]
|
||||
let yAxis3 = [
|
||||
/*let yAxis3 = [
|
||||
{
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: '{value}%'
|
||||
}
|
||||
},
|
||||
]
|
||||
]*/
|
||||
let yAxis4 = [
|
||||
{
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: '{value}%'
|
||||
}
|
||||
},
|
||||
{type: 'value'},
|
||||
]
|
||||
let yAxis5 = [
|
||||
@ -783,8 +786,8 @@ export default {
|
||||
series = series2
|
||||
yAxis = yAxis2
|
||||
} else if (this.activeIndex === 2) {
|
||||
series = series3
|
||||
yAxis = yAxis3
|
||||
series = []
|
||||
yAxis = []
|
||||
} else if (this.activeIndex === 3) {
|
||||
if (this.value == 1) {
|
||||
series = series4
|
||||
@ -797,7 +800,7 @@ export default {
|
||||
}
|
||||
option = {
|
||||
title: {
|
||||
text: this.isMobile ? this.getTitle(this.activeIndex) : '师傅接单时效',
|
||||
text: this.isMobile ? this.getTitle(this.activeIndex) : (this.active === 1 && this.activeIndex === 2) ? '' : '师傅接单时效',
|
||||
textStyle: {
|
||||
fontSize: 12
|
||||
},
|
||||
@ -852,41 +855,32 @@ export default {
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: '{value}%'
|
||||
}
|
||||
},
|
||||
{type: 'value'},
|
||||
],
|
||||
series: [{
|
||||
name: '到达时效(分)',
|
||||
type: 'bar',
|
||||
name: '到达时效',
|
||||
type: 'line',
|
||||
data: this.v3,
|
||||
yAxisIndex: 1,
|
||||
yAxisIndex: 0,
|
||||
smooth: true,
|
||||
barWidth: 45,
|
||||
barGap: '0%', // 设置柱子之间的间隔
|
||||
label: {
|
||||
show: true, // 显示标签
|
||||
position: 'top', // 标签位置在柱形顶部
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '聚合成功到达时效',
|
||||
type: 'bar',
|
||||
name: '平安聚合成功到达时效',
|
||||
type: 'line',
|
||||
data: this.v4,
|
||||
yAxisIndex: 1,
|
||||
smooth: true,
|
||||
yAxisIndex: 0,
|
||||
barWidth: 45,
|
||||
barGap: '0%', // 设置柱子之间的间隔
|
||||
label: {
|
||||
show: true, // 显示标签
|
||||
position: 'top', // 标签位置在柱形顶部
|
||||
}
|
||||
},
|
||||
{
|
||||
/*{
|
||||
name: '40分钟到达率',
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
@ -897,7 +891,7 @@ export default {
|
||||
position: 'top',
|
||||
formatter: '{c}%'
|
||||
},
|
||||
},
|
||||
},*/
|
||||
]
|
||||
};
|
||||
option && myChart.setOption(option, true);
|
||||
@ -1013,7 +1007,9 @@ export default {
|
||||
'threeMinutesContactRate',
|
||||
'urgeRate',
|
||||
'appRate',
|
||||
'polymerizationSuccessRate'
|
||||
'polymerizationSuccessRate',
|
||||
'pinganFavorableRate',
|
||||
'wholeJuheSuccessRate',
|
||||
];
|
||||
for (let key in this.indexData){
|
||||
if (propertiesToProcess.includes(key)) {
|
||||
@ -1032,12 +1028,16 @@ export default {
|
||||
item.timeoutOrderRate=this.formatPercentage(item.timeoutOrderRate) ;
|
||||
item.cancelRate=this.formatPercentage(item.cancelRate) ;
|
||||
item.urgeRate=this.formatPercentage(item.urgeRate) ;
|
||||
item.favorableRate=this.formatPercentage(item.favorableRate) ;
|
||||
item.pinganEvaluateRate = this.formatPercentage(item.pinganEvaluateRate) ;
|
||||
item.complainOrderRate=this.formatPercentage(item.complainOrderRate) ;
|
||||
item.pinganFavorableRate=this.formatPercentage(item.pinganFavorableRate) ;
|
||||
item.customerEvaluateRate=this.formatPercentage(item.customerEvaluateRate) ;
|
||||
item.appRate=this.formatPercentage(item.appRate) ;
|
||||
item.threeMinutesContactRate=this.formatPercentage(item.threeMinutesContactRate) ;
|
||||
item.pinganPolymerizationSuccessRate=this.formatPercentage(item.pinganPolymerizationSuccessRate) ;
|
||||
item.zhonghuaPolymerizationSuccessRate=this.formatPercentage(item.zhonghuaPolymerizationSuccessRate) ;
|
||||
item.wholeJuheSuccessRate = this.formatPercentage(item.wholeJuheSuccessRate) ;
|
||||
item.zdPolymerizationSuccessRate=this.formatPercentage(item.zdPolymerizationSuccessRate) ;
|
||||
item.polymerizationSuccessRate=this.formatPercentage(item.polymerizationSuccessRate) ;
|
||||
item.threeMinutesReceivingRate=this.formatPercentage(item.threeMinutesReceivingRate) ;
|
||||
@ -1119,7 +1119,7 @@ export default {
|
||||
}
|
||||
await this.twoTabHanldeData();
|
||||
}
|
||||
else if ([ 6, 7, 8,9,10].includes(this.active)) {
|
||||
else if ([ 6, 7, 8,9,10, 11].includes(this.active)) {
|
||||
this.detailList = []
|
||||
this.labelList = []
|
||||
let result = await getKpiDetailsData({
|
||||
@ -1140,38 +1140,38 @@ export default {
|
||||
this.labelList = [
|
||||
{label: '案件编号', prop: 'orderCode'},
|
||||
{label: '服务内容', prop: 'serviceName'},
|
||||
{label: '拒单师傅车号', prop: 'plateNumber'},
|
||||
{label: '拒单师傅名称', prop: 'driverName'},
|
||||
{label: '手机号', prop: 'driverPhone'},
|
||||
{label: '上游接单来源', prop: 'workSource'},
|
||||
{label: '中道派单时间', prop: 'dispatchTime'},
|
||||
{label: '拒绝原因', prop: 'reason'},
|
||||
{label: '拒单供应商', prop: 'supplierName'},
|
||||
{label: '拒单车辆名称', prop: 'vehicleName'},
|
||||
{label: '拒单师傅', prop: 'driverName'},
|
||||
{label: '拒绝时间', prop: 'time'},
|
||||
{label: '拒单原因', prop: 'reason'},
|
||||
]
|
||||
} else if (this.active === 7) {//超时明细
|
||||
this.labelList = [
|
||||
{label: '案件编号', prop: 'orderCode'},
|
||||
{label: '服务内容', prop: 'serviceName'},
|
||||
{label: '超时师傅车号', prop: 'plateNumber'},
|
||||
{label: '超时师傅名称', prop: 'driverName'},
|
||||
{label: '手机号', prop: 'driverPhone'},
|
||||
{label: '上游接单来源', prop: 'workSource'},
|
||||
{label: '中道派单时间', prop: 'dispatchTime'},
|
||||
{label: '超时供应商', prop: 'supplierName'},
|
||||
{label: '超时车辆名称', prop: 'vehicleName'},
|
||||
{label: '超时师傅', prop: 'driverName'},
|
||||
{label: '超时时间', prop: 'time'},
|
||||
{label: '超时原因', prop: 'reason'},
|
||||
]
|
||||
} else if (this.active === 8) {//投诉明细
|
||||
this.labelList = [
|
||||
{label: '案件编号', prop: 'orderCode'},
|
||||
{label: '服务内容', prop: 'serviceName'},
|
||||
{label: '接单车号', prop: 'plateNumber'},
|
||||
{label: '接单师傅', prop: 'driverName'},
|
||||
{label: '责任供应商', prop: 'supplierName'},
|
||||
{label: '投诉时间', prop: 'complainCreateTime'},
|
||||
{label: '投诉类型', prop: 'complainTypeString'},
|
||||
{label: '责任供应商扣罚金额', prop: 'compensateFee'},
|
||||
]
|
||||
} else if (this.active === 9) {//不使用App案件明细
|
||||
this.labelList = [
|
||||
{label: '案件编号', prop: 'orderCode'},
|
||||
{label: '服务内容', prop: 'serviceName'},
|
||||
{label: '接单师傅手机号', prop: 'driverPhone'},
|
||||
{label: '工单创建时间', prop: 'orderCreateTime'},
|
||||
{label: '供应商', prop: 'supplierName'},
|
||||
{label: '车辆', prop: 'driverName'},
|
||||
{label: '案件创建时间', prop: 'orderCreateTime'},
|
||||
{label: '事发地', prop: 'vehiclePointAddress'},
|
||||
]
|
||||
} else if (this.active === 10) {//车辆在线情况
|
||||
@ -1184,6 +1184,14 @@ export default {
|
||||
{label: '20点在线车辆数量', prop: 'twentyClockVehicleCount'},
|
||||
{label: '22点在线车辆数量', prop: 'twentyTwoClockVehicleCount'},
|
||||
]
|
||||
} else if (this.active === 11) {//车辆在线情况
|
||||
this.labelList = [
|
||||
{label: '案件编号', prop: 'orderCode'},
|
||||
{label: '服务内容', prop: 'serviceName'},
|
||||
{label: '聚合分类', prop: 'workOrderTypeString'},
|
||||
{label: '聚合信息', prop: 'rescuePersonName'},
|
||||
{label: '创建时间', prop: 'orderCreateTime'},
|
||||
]
|
||||
}
|
||||
}
|
||||
} finally {
|
||||
@ -1200,7 +1208,7 @@ export default {
|
||||
},
|
||||
// 初始化获取当月日期
|
||||
initDate() {
|
||||
let year=''
|
||||
/*let year=''
|
||||
let month=''
|
||||
if( this.current ) {
|
||||
year = new Date(this.current).getFullYear();
|
||||
@ -1212,7 +1220,25 @@ export default {
|
||||
let yearAndMonth = year + '-' + (month > 9 ? month : '0' + month);
|
||||
this.current = dayjs(new Date(yearAndMonth)).format('YYYY-MM')
|
||||
this.startTime = dayjs(new Date()).format('YYYY-MM') + '-01 00:00:00'
|
||||
this.endTime = dayjs(new Date()).format('YYYY-MM') + '-' + this.getDayLen()+' 23:59:59'
|
||||
this.endTime = dayjs(new Date()).format('YYYY-MM') + '-' + this.getDayLen()+' 23:59:59'*/
|
||||
// test
|
||||
// let _testDate = new Date('2024-11-01 00:00:01')
|
||||
|
||||
const today = dayjs(); // 获取当前日期
|
||||
const currentDay = today.date(); // 获取今天是几号(1-31)
|
||||
let targetMonth = today; // 默认目标月份是当前月
|
||||
if (currentDay === 1) {
|
||||
targetMonth = today.subtract(1, 'month'); // 上个月
|
||||
}
|
||||
this.current = targetMonth.format('YYYY-MM');
|
||||
this.startTime = targetMonth.startOf('month').format('YYYY-MM-DD HH:mm:ss');
|
||||
let endTime;
|
||||
if (targetMonth.isSame(today, 'month')) {
|
||||
endTime = today.subtract(1, 'day').endOf('day');
|
||||
} else {
|
||||
endTime = targetMonth.endOf('month');
|
||||
}
|
||||
this.endTime = endTime.format('YYYY-MM-DD HH:mm:ss');
|
||||
this.startMonthTime=this.getStartTimeFromEndTime(this.endTime)
|
||||
console.log(" this.startMonthTime", this.startMonthTime,this.startTime)
|
||||
},
|
||||
@ -1230,13 +1256,15 @@ export default {
|
||||
},
|
||||
//获取近五个月的开始时间
|
||||
getStartTimeFromEndTime(endTimeStr) {
|
||||
const endTime = new Date(endTimeStr);
|
||||
/* const endTime = new Date(endTimeStr);
|
||||
endTime.setMonth(endTime.getMonth() - 5); // 减去5个月
|
||||
const year = endTime.getFullYear();
|
||||
let month = String(endTime.getMonth() + 1).padStart(2, '0'); // 月份+1,并确保为两位数
|
||||
let day = '01'; // 因为我们要的是那个月的第一天
|
||||
const startTimeStr = `${year}-${month}-${day} `+'00:00:00';
|
||||
return startTimeStr;
|
||||
return startTimeStr;*/
|
||||
const startTime = dayjs(endTimeStr).subtract(4, 'month').startOf('month');
|
||||
return startTime.format('YYYY-MM-DD HH:mm:ss');
|
||||
},
|
||||
async changeTab(index) {
|
||||
try {
|
||||
@ -1249,6 +1277,8 @@ export default {
|
||||
this.v4 = []
|
||||
this.v5 = []
|
||||
this.v6 = []
|
||||
this.v7 = []
|
||||
this.v8 = []
|
||||
await this.twoTabHanldeData()
|
||||
this.loadingData = false
|
||||
if (this.active === 1) {
|
||||
@ -1275,8 +1305,8 @@ export default {
|
||||
{ 'month': '拒单量' },{ 'month': '拒单率(%)' },{ 'month': '超时接单量' },{ 'month': '超时率(%)' },{ 'month': '客户取消率(%)' }]
|
||||
let props = 'prop' //自定义字段名称
|
||||
this.detailList?.map((item,index) => {
|
||||
|
||||
item.dispatchOrderCount=this.formatCurrency1( item.dispatchOrderCount);
|
||||
let _dispatchOrderCount = Number(item.receiveOrderCount) + Number(item.refuseOrderCount)
|
||||
item.dispatchOrderCount=this.formatCurrency1( _dispatchOrderCount );
|
||||
item.receiveOrderCount=this.formatCurrency1( item.receiveOrderCount);
|
||||
item.finishOrderCount=this.formatCurrency1( item.finishOrderCount);
|
||||
item.refuseOrderCount=this.formatCurrency1( item.refuseOrderCount);
|
||||
@ -1307,39 +1337,43 @@ export default {
|
||||
{label: '取消率(%)', prop: 'cancelRate'},
|
||||
]
|
||||
} else if (this.activeIndex === 1) {
|
||||
this.etlDetailList=[{ 'month': '投诉量' },{ 'month': '投诉率(%)' },{ 'month': '客户满意度(%)' }, { 'month': '客户评价率(%)' }]
|
||||
this.etlDetailList=[{ 'month': '投诉量' },{ 'month': '投诉率(%)' },{ 'month': '平安好评量' }, { 'month': '平安好评率' }]
|
||||
console.log('detailList', this.detailList)
|
||||
let props = 'prop' //自定义字段名称
|
||||
this.detailList?.map((item,index) => {
|
||||
this.v1.push(item.customerEvaluateRate.replace('%', ''))
|
||||
this.v2.push(item.customerSatisfaction.replace('%', ''))
|
||||
this.v3.push(item.complainOrderRate.replace('%', ''))
|
||||
this.v1.push(item.complainOrderCount)
|
||||
this.v2.push(item.complainOrderRate?.replace('%', ''))
|
||||
this.v3.push(item?.pinganFavorableCount)
|
||||
this.v4.push(item.pinganFavorableRate?.replace('%', ''))
|
||||
const columnObj = {}
|
||||
columnObj.label = item.month // 每一列的标题的名称
|
||||
columnObj.prop = props + index //自定义每一列标题字段名称
|
||||
this.etlLabelList.push(columnObj)
|
||||
let mappings = [ 'complainOrderCount', 'complainOrderRate', 'customerSatisfaction','customerEvaluateRate' ];
|
||||
let mappings = [ 'complainOrderCount', 'complainOrderRate', 'pinganFavorableCount','pinganFavorableRate' ];
|
||||
for (let i = 0; i < mappings.length; i++) {
|
||||
this.$set(this.etlDetailList[i], columnObj.prop, item[mappings[i]]);
|
||||
}
|
||||
})
|
||||
this.labelList = [
|
||||
{label: '月', prop: 'month'},
|
||||
{label: '月份', prop: 'month'},
|
||||
{label: '投诉量', prop: 'complainOrderCount'},
|
||||
{label: '投诉率(%)', prop: 'complainOrderRate'},
|
||||
{label: '客户满意度(%)', prop: 'customerSatisfaction'},
|
||||
{label: '客户评价率(%)', prop: 'customerEvaluateRate'},
|
||||
{label: '投诉率', prop: 'complainOrderRate'},
|
||||
{label: '平安好评量', prop: 'pinganFavorableCount'},
|
||||
{label: '平安好评率', prop: 'pinganFavorableRate'},
|
||||
]
|
||||
} else if (this.activeIndex === 2) {
|
||||
this.etlDetailList=[{ 'month': '使用率(%)' },{ 'month': '3′联系客户率(%)' },{ 'month': '平安聚合成功率(%)' }, { 'month': '中华聚合成功率(%)' }
|
||||
,{ 'month': '中道聚合成功率(%' }, { 'month': '总聚合成功率(%)' }]
|
||||
this.etlDetailList=[{ 'month': 'APP使用量' }, { 'month': 'APP使用率' }, { 'month': '平安聚合成功量' },{ 'month': '平安聚合成功率' },
|
||||
{ 'month': '中华联合聚合成功量' }, { 'month': '中华联合聚合成功率' }, { 'month': '整体聚合成功量' }, { 'month': '整体聚合成功率' }]
|
||||
let props = 'prop' //自定义字段名称
|
||||
this.detailList?.map((item,index) => {
|
||||
this.v1.push(item.appRate.replace('%', ''))
|
||||
this.v2.push(item.threeMinutesContactRate.replace('%', ''))
|
||||
this.v3.push(item.pinganPolymerizationSuccessRate.replace('%', ''))
|
||||
this.v4.push(item.zhonghuaPolymerizationSuccessRate.replace('%', ''))
|
||||
this.v5.push(item.zdPolymerizationSuccessRate.replace('%', ''))
|
||||
this.v6.push(item.polymerizationSuccessRate.replace('%', ''))
|
||||
this.v1.push(item.appUseCount)
|
||||
this.v2.push(item.appRate.replace('%', ''))
|
||||
this.v3.push(item.pinganJuheSuccessCount)
|
||||
this.v4.push(item.pinganPolymerizationSuccessRate.replace('%', ''))
|
||||
this.v5.push(item.zhonghuaPolymerizationSuccessCount)
|
||||
this.v6.push(item.zhonghuaPolymerizationSuccessRate.replace('%', ''))
|
||||
this.v7.push(item.wholeJuheSuccessCount)
|
||||
this.v7.push(item.wholeJuheSuccessRate.replace('%', ''))
|
||||
const columnObj = {}
|
||||
columnObj.label = item.month // 每一列的标题的名称
|
||||
columnObj.prop = props + index //自定义每一列标题字段名称
|
||||
@ -1350,22 +1384,24 @@ export default {
|
||||
}
|
||||
})
|
||||
this.labelList = [
|
||||
{label: '月', prop: 'month'},
|
||||
{label: '使用率(%)', prop: 'appRate'},
|
||||
{label: '3′联系客户率(%)', prop: 'threeMinutesContactRate'},
|
||||
{label: '平安聚合成功率(%)', prop: 'pinganPolymerizationSuccessRate'},
|
||||
{label: '中华聚合成功率(%)', prop: 'zhonghuaPolymerizationSuccessRate'},
|
||||
{label: '中道聚合成功率(%)', prop: 'zdPolymerizationSuccessRate'},
|
||||
{label: '总聚合成功率(%)', prop: 'polymerizationSuccessRate'},
|
||||
{label: '月份', prop: 'month'},
|
||||
{label: 'APP使用量', prop: 'appUseCount'},
|
||||
{label: 'APP使用率', prop: 'appRate'},
|
||||
{label: '平安聚合成功量', prop: 'pinganJuheSuccessCount'},
|
||||
{label: '平安聚合成功率', prop: 'pinganPolymerizationSuccessRate'},
|
||||
{label: '中华联合聚合成功量', prop: 'zhonghuaPolymerizationSuccessCount'},
|
||||
{label: '中华联合聚合成功率', prop: 'zhonghuaPolymerizationSuccessRate'},
|
||||
{label: '整体聚合成功量', prop: 'wholeJuheSuccessCount'},
|
||||
{label: '整体聚合成功率', prop: 'wholeJuheSuccessRate'},
|
||||
]
|
||||
} else if (this.activeIndex === 3) {
|
||||
this.etlDetailList=[{ 'month': '接单时效(分)' },{ 'month': '3′接单率(%)' },{ 'month': '到达时效(分)' }, { 'month': '40′到达率(%)' },{'month':'聚合成功到达时效(分)'}]
|
||||
this.etlDetailList=[{ 'month': '接单时效' },{ 'month': '3分钟联系客户率' },{ 'month': '到达时效' },{'month':'平安聚合成功到达时效'}]
|
||||
let props = 'prop' //自定义字段名称
|
||||
if (this.isMobile) {
|
||||
if (this.value == 1) {
|
||||
this.detailList?.map(item => {
|
||||
this.v1.push(item.receiving)
|
||||
this.v2.push(item.threeMinutesReceivingRate.replace('%', ''))
|
||||
this.v2.push(item.threeMinutesContactRate.replace('%', ''))
|
||||
})
|
||||
} else {
|
||||
this.detailList?.map(item => {
|
||||
@ -1379,7 +1415,7 @@ export default {
|
||||
columnObj.label = item.month // 每一列的标题的名称
|
||||
columnObj.prop = props + index //自定义每一列标题字段名称
|
||||
this.etlLabelList.push(columnObj)
|
||||
let mappings = [ 'receiving', 'threeMinutesReceivingRate', 'arriving','fortyMinutesArrivalRate','polymerizationSuccessArriving'];
|
||||
let mappings = [ 'receiving', 'threeMinutesContactRate', 'arriving','fortyMinutesArrivalRate','polymerizationSuccessArriving'];
|
||||
for (let i = 0; i < mappings.length; i++) {
|
||||
this.$set(this.etlDetailList[i], columnObj.prop, item[mappings[i]]);
|
||||
}
|
||||
@ -1387,75 +1423,72 @@ export default {
|
||||
} else {
|
||||
this.detailList?.map(item => {
|
||||
this.v1.push(item.receiving)
|
||||
this.v2.push(item.threeMinutesReceivingRate.replace('%', ''))
|
||||
this.v2.push(item.threeMinutesContactRate.replace('%', ''))
|
||||
})
|
||||
if (this.swithVal) {
|
||||
this.detailList?.map(item => {
|
||||
this.v3.push(item.trailArriving)
|
||||
this.v4.push(item.trailPolymerizationSuccessArsriving)
|
||||
this.v5.push(item.trailFortyMinutesArrivalRate ? item.trailFortyMinutesArrivalRate.replace('%', '') : item.trailFortyMinutesArrivalRate)
|
||||
this.v4.push(item.pinganJuheSuccessArriving)
|
||||
// this.v5.push(item.trailFortyMinutesArrivalRate ? item.trailFortyMinutesArrivalRate.replace('%', '') : item.trailFortyMinutesArrivalRate)
|
||||
})
|
||||
} else {
|
||||
this.detailList?.map(item => {
|
||||
this.v3.push(item.minorArriving)
|
||||
this.v4.push(item.minorPolymerizationSuccessArriving)
|
||||
this.v5.push(item.minorFortyMinutesArrivalRate ? item.minorFortyMinutesArrivalRate.replace('%', '') : item.minorFortyMinutesArrivalRate)
|
||||
this.v4.push(item.pinganJuheSuccessArriving)
|
||||
// this.v5.push(item.minorFortyMinutesArrivalRate ? item.minorFortyMinutesArrivalRate.replace('%', '') : item.minorFortyMinutesArrivalRate)
|
||||
})
|
||||
}
|
||||
}
|
||||
this.labelList = [
|
||||
{label: '月', prop: 'month'},
|
||||
{label: '接单时效(分)', prop: 'receiving'},
|
||||
{label: '3′接单率(%)', prop: 'threeMinutesReceivingRate'},
|
||||
{label: '到达时效(分)', prop: 'arriving'},
|
||||
{label: '40′到达率(%)', prop: 'fortyMinutesArrivalRate'},
|
||||
{label: '聚合成功到达时效(分)', prop: 'polymerizationSuccessArriving'},
|
||||
{label: '月份', prop: 'month'},
|
||||
{label: '接单时效', prop: 'receiving'},
|
||||
{label: '3分钟联系客户率', prop: 'threeMinutesContactRate'},
|
||||
{label: '到达时效', prop: 'arriving'},
|
||||
{label: '平安聚合成功到达时效', prop: 'pinganJuheSuccessArriving'},
|
||||
]
|
||||
}
|
||||
} else if (this.active === 2) {
|
||||
if (this.activeIndex === 0) {//接单指标
|
||||
this.labelList = [
|
||||
{label: '日', prop: 'date'},
|
||||
{label: '派遣案件量', prop: 'dispatchOrderCount'},
|
||||
{label: '承接案件量', prop: 'receiveOrderCount'},
|
||||
{label: '完成量', prop: 'finishOrderCount'},
|
||||
{label: '派单量', prop: 'dispatchOrderCount'},
|
||||
{label: '接单量', prop: 'receiveOrderCount'},
|
||||
// {label: '完成量', prop: 'finishOrderCount'},
|
||||
{label: '拒单量', prop: 'refuseOrderCount'},
|
||||
{label: '拒单率(%)', prop: 'refuseOrderRate'},
|
||||
{label: '超时接单量', prop: 'timeoutOrderCount'},
|
||||
{label: '超时率(%)', prop: 'timeoutOrderRate'},
|
||||
{label: '客户取消率(%)', prop: 'cancelRate'},
|
||||
{label: '拒单率', prop: 'refuseOrderRate'},
|
||||
{label: '超时量', prop: 'timeoutOrderCount'},
|
||||
{label: '超时率', prop: 'timeoutOrderRate'},
|
||||
// {label: '客户取消率(%)', prop: 'cancelRate'},
|
||||
]
|
||||
} else if (this.activeIndex === 1) {
|
||||
this.labelList = [
|
||||
{label: '日', prop: 'date'},
|
||||
{label: '投诉量', prop: 'complainOrderCount'},
|
||||
{label: '投诉率(%)', prop: 'complainOrderRate'},
|
||||
{label: '客户评价率(%)', prop: 'customerEvaluateRate'},
|
||||
{label: '催促率(%)', prop: 'urgeRate'},
|
||||
{label: '投诉率', prop: 'complainOrderRate'},
|
||||
/* {label: '好评量', prop: 'favorableCount'},
|
||||
{label: '好评率', prop: 'favorableRate'},*/
|
||||
{label: '平安评价率', prop: 'pinganEvaluateRate'},
|
||||
{label: '平安好评率', prop: 'pinganFavorableRate'},
|
||||
]
|
||||
} else if (this.activeIndex === 2) {
|
||||
this.labelList = [
|
||||
{label: '日', prop: 'date'},
|
||||
{label: '使用率(%)', prop: 'appRate'},
|
||||
{label: '3′联系客户率(%)', prop: 'threeMinutesContactRate'},
|
||||
{label: '平安聚合成功率(%)', prop: 'pinganPolymerizationSuccessRate'},
|
||||
{label: '中华聚合成功率(%)', prop: 'zhonghuaPolymerizationSuccessRate'},
|
||||
{label: '中道聚合成功率(%)', prop: 'zdPolymerizationSuccessRate'},
|
||||
{label: '总聚合成功率(%)', prop: 'polymerizationSuccessRate'},
|
||||
{label: 'APP使用量', prop: 'appUseCount'},
|
||||
{label: 'APP使用率', prop: 'appRate'},
|
||||
{label: '平安聚合成功量', prop: 'pinganJuheSuccessCount'},
|
||||
{label: '平安聚合成功率', prop: 'pinganPolymerizationSuccessRate'},
|
||||
{label: '中华联合聚合成功量', prop: 'zhonghuaPolymerizationSuccessCount'},
|
||||
{label: '中华联合聚合成功率', prop: 'zhonghuaPolymerizationSuccessRate'},
|
||||
{label: '整体聚合成功量', prop: 'wholeJuheSuccessCount'},
|
||||
{label: '整体聚合成功率', prop: 'wholeJuheSuccessRate'},
|
||||
]
|
||||
} else if (this.activeIndex === 3) {
|
||||
this.labelList = [
|
||||
{label: '日', prop: 'date'},
|
||||
{label: '接单时效(分)', prop: 'receiving'},
|
||||
{label: '3′接单率(%)', prop: 'threeMinutesReceivingRate'},
|
||||
{label: '小修到达时效(分)', prop: 'minorArriving'},
|
||||
{label: '拖车到达时效(分)', prop: 'trailArriving'},
|
||||
{label: '困境到达时效(分)', prop: 'dilemmaArriving'},
|
||||
{label: '3分钟联系客户率', prop: 'threeMinutesContactRate'},
|
||||
{label: '到达时效(分)', prop: 'arriving'},
|
||||
{label: '40′到达率(%)', prop: 'fortyMinutesArrivalRate'},
|
||||
{label: '小修聚合成功到达时效(分)', prop: 'minorPolymerizationSuccessArriving'},
|
||||
{label: '拖车聚合成功到达时效(分)', prop: 'trailPolymerizationSuccessArriving'},
|
||||
{label: '聚合成功到达时效(分)', prop: 'polymerizationSuccessArriving'},
|
||||
{label: '平安聚合成功到达时效(分)', prop: 'pinganJuheSuccessArriving'},
|
||||
]
|
||||
}
|
||||
}
|
||||
@ -1584,6 +1617,7 @@ export default {
|
||||
checkMobile() {
|
||||
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
|
||||
this.isMobile = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i.test(userAgent);
|
||||
// this.isMobile = true
|
||||
},
|
||||
setType(type) {
|
||||
switch (type) {
|
||||
@ -1597,6 +1631,8 @@ export default {
|
||||
return 4;
|
||||
case 10:
|
||||
return 5;
|
||||
case 11:
|
||||
return 6;
|
||||
}
|
||||
},
|
||||
getTitle(type) {
|
||||
@ -2049,4 +2085,10 @@ export default {
|
||||
line-height: 1 !important;
|
||||
}
|
||||
}
|
||||
.numRed {
|
||||
color: red !important;
|
||||
}
|
||||
.numGreen {
|
||||
color: green !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
208
src/views/liabilityInsurance/insuredPage.vue
Normal file
@ -0,0 +1,208 @@
|
||||
<template>
|
||||
<div class="wrap">
|
||||
<div class="navBar">
|
||||
<van-nav-bar
|
||||
title="参保救援职业责任险"
|
||||
left-arrow
|
||||
left-arrow-color="#FFFFFF"
|
||||
:border="false"
|
||||
:fixed="true"
|
||||
:safe-area-inset-top="true"
|
||||
@click-left="goBack"
|
||||
/>
|
||||
</div>
|
||||
<div class="contentWrap">
|
||||
<div>
|
||||
为降低日常救援工作中的不可预期的车损赔付带来的运营风险和资金压力,减少由此衍生而来的可能投诉,顺应行业服务标准不断增长的局势,中道救援自有车辆已全部投保了救援职业责任险。
|
||||
</div>
|
||||
<div>
|
||||
通过日常的交流了解,此险种对于服务商而言,投保相对较难,很多服务商在无投保渠道的情况下选择了对于我们救援场景保障能力稍弱、不太匹配的货物险,从而从形成了现在很多救援车无保障、或者特殊场景货物险理赔难的局面。
|
||||
</div>
|
||||
<div>
|
||||
为此中道救援经过与保司沟通协调,特为与中道救援合作紧密的服务商,提供救援职业责任险参保渠道,提升服务商服务能力,降低运营风险,实现共同进步。
|
||||
</div>
|
||||
<div>一、救援职业责任险简介:</div>
|
||||
<div>1、综合保额50万元,可全方位覆盖我们日常的经营活动。</div>
|
||||
<div> 2、保费支付可采用救援服务费抵扣的方式,降低资金压力。</div>
|
||||
<div> 3、详细保险条款、保费和其他问题,如需了解,请与辖区区域经理联系。</div>
|
||||
<div> 二、其他意见建议如需交流,请与18621558505曲仁杰联系。</div>
|
||||
<div> 三、如确认参保,请点击下方“参保”按钮,会有专人与贵司联系。</div>
|
||||
</div>
|
||||
<div class="upload_btn_wrap">
|
||||
<div class="btn_save" :style="{'backgroundColor':used ? '#cccccc' : '#354D93'}" @click="showPoup = true">参保</div>
|
||||
</div>
|
||||
<div class="poupCommon" v-if="showPoup">
|
||||
<div class="showPoupContainer">
|
||||
<img class="insured" src="@/assets/insured-jianbian.png">
|
||||
<img class="insure" src="@/assets/insured.png">
|
||||
<div class="con">
|
||||
<template v-if="used">
|
||||
<div class="title">您已成功申请参保,请等待</div>
|
||||
<div class="title">专人与贵司联系。</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="title">请确认</div>
|
||||
<div class="title">是否参保救援职业责任险</div>
|
||||
</template>
|
||||
<div class="btnWrap">
|
||||
<div v-if="used" class="btn confirmBtn" @click="showPoup = false">确认</div>
|
||||
<div v-else class="btn confirmBtn" @click="saveHandle">确认</div>
|
||||
<div class="btn closeBtn" @click="showPoup = false">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {myMixins} from "@/utils/myMixins"
|
||||
import {sendInsuranceEmail,isSendInsuranceEmail} from "@/api/mine"
|
||||
export default {
|
||||
name: "insuredPage",
|
||||
mixins: [myMixins],
|
||||
data() {
|
||||
return {
|
||||
showPoup: false,
|
||||
used:false,
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
let res=await isSendInsuranceEmail()
|
||||
this.used=res.data
|
||||
},
|
||||
methods: {
|
||||
async saveHandle() {
|
||||
await sendInsuranceEmail();
|
||||
this.$toast('操作成功');
|
||||
this.showPoup=false
|
||||
setTimeout(()=>{
|
||||
this.goBack()
|
||||
},1500)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "@/styles/mixin.scss";
|
||||
@import "@/styles/common.scss";
|
||||
|
||||
.wrap {
|
||||
@include wh(100%, 100%);
|
||||
background-color: #F4F5F7;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.navBar {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.contentWrap {
|
||||
padding-top: 15px;
|
||||
|
||||
div {
|
||||
padding: 0 18px;
|
||||
line-height: 22px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.upload_btn_wrap {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
padding: 15px 30px;
|
||||
display: flex;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
line-height: 40px;
|
||||
div {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
flex: 1;
|
||||
}
|
||||
.btn_save {
|
||||
//background: #354D93;
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.poupCommon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, .7);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
.showPoupContainer {
|
||||
width: 290px;
|
||||
height: 242px;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 12px;
|
||||
position: absolute;
|
||||
z-index: 11;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
.con {
|
||||
top: 80px !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 60px;
|
||||
}
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
color: #040404;
|
||||
line-height: 28px;
|
||||
}
|
||||
.insure {
|
||||
width: 78px;
|
||||
height: 78px;
|
||||
position: absolute;
|
||||
z-index: 11;
|
||||
top: -34px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.insured {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
.btnWrap {
|
||||
margin-top: 36px;
|
||||
text-align: center;
|
||||
.btn{
|
||||
width: 174px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
border-radius: 23px;
|
||||
}
|
||||
.closeBtn {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: #2C4155;
|
||||
opacity: .6;
|
||||
}
|
||||
.confirmBtn {
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
background: #F1BA63;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
213
src/views/report/addressMap.vue
Normal file
@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<div class="address_wrap">
|
||||
<div class="map_wrap" id="mapId">
|
||||
</div>
|
||||
<div class="button_wrap">
|
||||
<div class="cancel_btn" @click="cancelHandler">取消</div>
|
||||
<div class="confirm_btn" @click="successHandler">完成</div>
|
||||
</div>
|
||||
<div class="search_wrap">
|
||||
<div class="section">
|
||||
<input type="text" v-model="keyword" @change="searchHandler" placeholder="请输入地址" />
|
||||
</div>
|
||||
<div class="server_list" v-if="keyword">
|
||||
<div class="text_box" v-for="(item, index) in addressList" :key="index" @click="chooseHandler(item, index)" :class="{'active': index == activeIndex}">
|
||||
<div class="address_name">{{ item.name }}</div>
|
||||
<div class="address_detail">{{ ( item.district || '' ) + ( item.address || '' ) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { searchFun, getLocal, getAddress } from '@/utils/map'
|
||||
export default {
|
||||
name: "addressMap",
|
||||
data() {
|
||||
return {
|
||||
keyword: '',
|
||||
addressList: [],
|
||||
activeIndex: '',
|
||||
map: '',
|
||||
marker: null,
|
||||
cityCode: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
keyword() {
|
||||
this.searchHandler()
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
sessionStorage.setItem('reportAddress', '')
|
||||
await this.initMap()
|
||||
},
|
||||
methods: {
|
||||
async initMap() { // 初始化地图
|
||||
this.map = new AMap.Map('mapId', {
|
||||
viewMode: '2D', // 默认使用 2D 模式
|
||||
zoom:11, //初始化地图层级
|
||||
})
|
||||
let res = await getLocal(this.map);
|
||||
let lnglat = new AMap.LngLat(res?.lng, res?.lat);
|
||||
let location = await getAddress(this.map, lnglat)
|
||||
this.cityCode = location?.regeocode.addressComponent.adcode
|
||||
//location?.regeocode?.addressComponent?.city || location?.regeocode?.addressComponent?.province
|
||||
console.log('location', location);
|
||||
},
|
||||
async searchHandler() {
|
||||
this.activeIndex = null
|
||||
if( this.keyword ) {
|
||||
this.addressList = await searchFun(this.map, this.cityCode, this.keyword,)
|
||||
this.addressList = this.addressList.filter(item => !!item.location)
|
||||
} else {
|
||||
this.addressList = []
|
||||
}
|
||||
},
|
||||
chooseHandler(item, index) {
|
||||
this.activeIndex = index;
|
||||
this.addMarker()
|
||||
},
|
||||
addMarker() {
|
||||
if( this.marker ) {
|
||||
this.map.remove(this.marker)
|
||||
}
|
||||
let content = '<div class="dest-position"></div>';
|
||||
let activeObj = this.addressList[this.activeIndex];
|
||||
this.marker = new AMap.Marker({
|
||||
position: new AMap.LngLat( activeObj.location.lng, activeObj.location.lat ),
|
||||
content: content,
|
||||
offset: new AMap.Pixel(-13, -30)
|
||||
});
|
||||
this.map.add(this.marker)
|
||||
this.map.setCenter([activeObj.location.lng, activeObj.location.lat])
|
||||
},
|
||||
successHandler() {
|
||||
if( this.activeIndex == null ) {
|
||||
this.$toast('请选择具体地址')
|
||||
return
|
||||
}
|
||||
let activeObj = this.addressList[this.activeIndex];
|
||||
let _tempObj = {
|
||||
startPoiAddress: activeObj?.address + activeObj?.name,
|
||||
startLat: activeObj?.location?.lat,
|
||||
startLng: activeObj?.location?.lng,
|
||||
adCode: activeObj?.adcode,
|
||||
}
|
||||
sessionStorage.setItem('reportAddress', JSON.stringify(_tempObj))
|
||||
setTimeout(() => {
|
||||
this.$router.go(-1)
|
||||
}, 1)
|
||||
},
|
||||
// 取消 返回上一页
|
||||
cancelHandler() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.dest-position {
|
||||
width: 30px;
|
||||
height: 36px;
|
||||
background-size: 100% 100%;
|
||||
background-image: url("~@/assets/report/destMarker.png");
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.address_wrap {
|
||||
height: 100%;
|
||||
}
|
||||
.map_wrap {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 60%;
|
||||
z-index: -1;
|
||||
}
|
||||
.button_wrap {
|
||||
width: 100%;
|
||||
padding: 5px;
|
||||
box-sizing: border-box;
|
||||
zoom: 1;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
.cancel_btn {
|
||||
width: 50px;
|
||||
height: 27px;
|
||||
background: #F37877;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
line-height: 27px;
|
||||
color: #fff;
|
||||
border-radius: 3px;
|
||||
float: left;
|
||||
}
|
||||
.confirm_btn {
|
||||
width: 50px;
|
||||
height: 27px;
|
||||
background: rgba(5,193,98,1);
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
line-height: 27px;
|
||||
color: #fff;
|
||||
border-radius: 3px;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
.search_wrap {
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 60%;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
.section {
|
||||
height: 35px;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 40%;
|
||||
padding-top: 10px;
|
||||
input {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
border: none;
|
||||
height: 30px;
|
||||
border-radius: 3px;
|
||||
padding: 0 10px;
|
||||
background: #e2e0e0;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.server_list {
|
||||
overflow-y: auto;
|
||||
padding-top: 30px;
|
||||
.text_box {
|
||||
margin: 10px 25px;
|
||||
padding-top: 10px;
|
||||
.address_name {
|
||||
font-size: 14px !important;
|
||||
color: rgba(0,0,0,0.8);
|
||||
}
|
||||
.address_detail {
|
||||
margin-top: 3px;
|
||||
color: #c3c3c3 !important;
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
.active {
|
||||
.address_name {
|
||||
color: green !important;
|
||||
}
|
||||
.address_detail {
|
||||
color: green !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
57
src/views/report/components/report-list-item.vue
Normal file
@ -0,0 +1,57 @@
|
||||
<template>
|
||||
<div class="bottom_wrap">
|
||||
<div class="report_item" v-for="(item, index) in reportList" @click="goReportHandler(item)" :key="index">
|
||||
<img class="report_icon" :src="item?.iconUrl" alt="">
|
||||
<div class="report_title">{{item.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "report-list-item",
|
||||
data() {
|
||||
return {
|
||||
addressReportCode: '',
|
||||
|
||||
}
|
||||
},
|
||||
props: ['reportList'],
|
||||
methods: {
|
||||
goReportHandler(data) {
|
||||
this.$emit('getReport', data);
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.bottom_wrap {
|
||||
width: 100%;
|
||||
/*position: fixed;*/
|
||||
bottom: 0;
|
||||
/*padding: 0 34px 20px;*/
|
||||
padding-bottom: 20px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 0px 20px 0px rgba(53,73,93,0.2);
|
||||
box-sizing: border-box;
|
||||
.report_item {
|
||||
width: 25%;
|
||||
margin-top: 20px;
|
||||
text-align: center;
|
||||
.report_icon {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
}
|
||||
.report_title {
|
||||
color: rgba(53, 53, 53, 0.67);
|
||||
font-size: 11px;
|
||||
line-height: 16px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
112
src/views/report/components/service-item.vue
Normal file
@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div class="wrap">
|
||||
<div class="service_title">
|
||||
<span class="name">{{orderInfo?.serviceName}}</span>
|
||||
<span class="status">
|
||||
{{orderInfo?.orderStatusString}}
|
||||
<span class="refresh_btn" @click="refreshHandler">刷新</span>
|
||||
</span>
|
||||
</div>
|
||||
<!-- <img class="report_line" src="@/assets/report/report_line.png" alt="">-->
|
||||
<div class="service_content">
|
||||
<div class="content_left">
|
||||
<img class="report_logo" src="@/assets/report/report_logo.png" alt="">
|
||||
</div>
|
||||
<div class="content_right">
|
||||
<div class="order_code">单号:{{orderInfo?.userOrderCode}}</div>
|
||||
<div class="company">单位:{{orderInfo?.supplierName}}</div>
|
||||
<div class="driver_info">
|
||||
<span class="driver_name">{{orderInfo?.driverName}}</span>
|
||||
<span>{{orderInfo?.phone}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "service-item",
|
||||
props: ['orderInfo'],
|
||||
methods: {
|
||||
refreshHandler() {
|
||||
this.$emit('refresh')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.wrap {
|
||||
width: calc(100% - 20px);
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 0px 9px 0px rgba(53,73,93,0.2);
|
||||
border-radius: 8px;
|
||||
border: 1px solid #E6E6E6;
|
||||
backdrop-filter: blur(5.602678571428572px);
|
||||
margin: 0 auto;
|
||||
}
|
||||
.service_title {
|
||||
height: 40px;
|
||||
line-height: 42px;
|
||||
padding-left: 22px;
|
||||
padding-right: 14px;
|
||||
background: #F9FDFF;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #EFEFEF;
|
||||
border-top-left-radius: 8px;
|
||||
border-top-right-radius: 8px;
|
||||
.name {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: rgba(0, 0, 0, 0.9);
|
||||
}
|
||||
.status {
|
||||
font-size: 13px;
|
||||
color: #F19028;
|
||||
}
|
||||
.refresh_btn {
|
||||
background-color: #267EF0;
|
||||
color: #fff;
|
||||
padding: 6px 12px;
|
||||
margin-left: 5px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
.service_content {
|
||||
padding: 11px 16px 18px;
|
||||
display: flex;
|
||||
.content_left {
|
||||
.report_logo {
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
margin-right: 14px;
|
||||
}
|
||||
}
|
||||
.content_right {
|
||||
.order_code {
|
||||
color: #323643;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
.company {
|
||||
color: #323643;
|
||||
font-size: 13px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
.driver_info {
|
||||
color: rgba(50, 54, 67, 0.65);
|
||||
font-size: 12px;
|
||||
margin-bottom: 3px;
|
||||
.driver_name {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.report_line {
|
||||
|
||||
}
|
||||
</style>
|
||||
568
src/views/report/reportIndex.vue
Normal file
@ -0,0 +1,568 @@
|
||||
<template>
|
||||
<!-- <van-pull-refresh v-model="isLoading" class="custom-pull-refresh safe-pull-refresh" @refresh="onRefresh">-->
|
||||
<div class="main_wrap">
|
||||
<div class="top_bg" :class="{'dispatch' : type == 1 , 'driver' : type != 1}">
|
||||
<!-- <div class="title">报备中心</div>-->
|
||||
</div>
|
||||
<div class="service_wrap">
|
||||
<service-item :order-info="orderInfo" @refresh="onRefreshHandler"></service-item>
|
||||
</div>
|
||||
<div class="chat_list" ref="chatList" >
|
||||
<!--ai对话框 s -->
|
||||
<div v-for="(item, index) in recordList" :key="index">
|
||||
<template v-if="item.messageType == 4">
|
||||
<div class="top_tip_wrap">为了快速解决问题,请选择下方咨询类型</div>
|
||||
<div class="ai_chat" >
|
||||
<div class="ai_left">
|
||||
<img class="report_ai" src="@/assets/report/report_ai.png" alt="">
|
||||
</div>
|
||||
<div class="ai_right">
|
||||
<div class="ai_title">{{ orderInfo?.driverName }}你好,请选择报备内容</div>
|
||||
<ul>
|
||||
<li v-for="_item in item.content" :key="_item.id" @click="addReportHandler(_item)">“{{_item.name}}”</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="[2, 3].includes(Number(item.messageType))">
|
||||
<!--ai对话框 e -->
|
||||
<div class="tip_wrap">{{item.createTime}}</div>
|
||||
<!--客服对话框 s -->
|
||||
<div class="customer_item mb20">
|
||||
<div class="customer_left">
|
||||
<img class="profile_photo mr" src="@/assets/report/report_customer.png" alt="">
|
||||
</div>
|
||||
<div class="common_right customer_cls">
|
||||
<div class="customer_status">{{item.reportConfigName}}</div>
|
||||
<div class="response_con">{{item.remark}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="item.messageType == 1">
|
||||
<!--服务人员对话框 e -->
|
||||
<div class="tip_wrap">{{item.createTime}}</div>
|
||||
<!--服务人员对话框 s -->
|
||||
<div class="server_item mb20">
|
||||
<div class="common_right service_cls">
|
||||
<div class="service_status">{{item.reportConfigName}}</div>
|
||||
<div class="response_con">{{item.remark}}</div>
|
||||
</div>
|
||||
<div class="customer_left">
|
||||
<img class="profile_photo ml" v-if="type == 1" src="@/assets/report/report_dispatch.png" alt="">
|
||||
<img class="profile_photo ml" v-else src="@/assets/report/report_driver.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<!--服务人员对话框 e -->
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<report-list-item :report-list.sync="reportList" @getReport="getReportHandler" />
|
||||
<van-popup ref="addReportModal" v-model="addReportShow" :close-on-click-overlay="false" closeable duration="0" round position="bottom">
|
||||
<div class="dialog_wrap">
|
||||
<img class="add_report_bg" src="@/assets/report/add_report_bg.png" alt="">
|
||||
<div class="report_content">
|
||||
<template v-if="currentInfo.component == 'time'">
|
||||
<!--预约时间报备 s -->
|
||||
<div class="report_title">
|
||||
<img class="dot" src="@/assets/report/add_report_dot.png" alt="">
|
||||
<span>预约时间</span>
|
||||
</div>
|
||||
<div class="report_time_content" @click="showDatetime = true">
|
||||
<div class="report_time_left">
|
||||
<img class="add_report_time" src="@/assets/report/add_report_time.png" alt="">
|
||||
<span>{{appointTime || '请选择时间'}}</span>
|
||||
</div>
|
||||
<img class="report_arrow" src="@/assets/report/add_report_arrow.png" alt="">
|
||||
</div>
|
||||
<!--预约时间报备 e -->
|
||||
</template>
|
||||
<template v-if="currentInfo.component == 'address'">
|
||||
<!--修改地址报备 s -->
|
||||
<div class="report_title">
|
||||
<img class="dot" src="@/assets/report/add_report_dot.png" alt="">
|
||||
<span>修改地址</span>
|
||||
</div>
|
||||
<div class="report_time_content" @click="goPage('addressMap')">
|
||||
<div class="report_time_left">
|
||||
<img class="add_report_time" src="@/assets/report/add_report_address.png" alt="">
|
||||
<span>{{address || '请选择地址'}}</span>
|
||||
</div>
|
||||
<img class="report_arrow" src="@/assets/report/add_report_arrow.png" alt="">
|
||||
</div>
|
||||
<!--修改地址报备 e -->
|
||||
</template>
|
||||
<div class="report_title">
|
||||
<img class="dot" src="@/assets/report/add_report_dot.png" alt="">
|
||||
<span>补充报备内容</span>
|
||||
</div>
|
||||
<div class="report_common_content">
|
||||
<textarea class="report_textarea" id="text-input" rows="4" placeholder="点击这里输入补充报备内容" v-model.trim="remark"></textarea>
|
||||
<!-- <van-field-->
|
||||
<!-- v-model="remark"-->
|
||||
<!-- class="report_textarea"-->
|
||||
<!-- placeholder="点击这里输入补充报备内容" />-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="report_btn" @click="saveHandler">
|
||||
提交报备
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<van-popup v-model="showDatetime" round position="bottom">
|
||||
<van-datetime-picker
|
||||
class="dataTime"
|
||||
v-if="showDatetime"
|
||||
v-model="appointTime"
|
||||
type="datetime"
|
||||
:min-date="minDate"
|
||||
@confirm="onConfirm"
|
||||
@cancel="showDatetime = false"
|
||||
/>
|
||||
</van-popup>
|
||||
</div>
|
||||
<!-- </van-pull-refresh>-->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getReportListByOrder, reportHistory, newOrderReporting, getOrderInfo } from "@/api/report"
|
||||
import { myMixins} from "@/utils/myMixins";
|
||||
import {timeFormat} from "@/utils/common";
|
||||
import reportListItem from '@/views/report/components/report-list-item'
|
||||
import serviceItem from "@/views/report/components/service-item"
|
||||
import {Dialog, Toast} from "vant";
|
||||
export default {
|
||||
name: "reportIndex",
|
||||
components: { serviceItem, reportListItem },
|
||||
mixins: [myMixins],
|
||||
data() {
|
||||
return {
|
||||
addReportShow: false,
|
||||
remark: '',
|
||||
showDatetime: false,
|
||||
appointTime: '',
|
||||
minDate: new Date(),
|
||||
address: '',
|
||||
lat: '',
|
||||
lng: '',
|
||||
reportList: [],
|
||||
recordList: [],
|
||||
orderInfo: {},
|
||||
type: '', // 1 调度 2 司机
|
||||
currentInfo: '',
|
||||
userOrderId: '',
|
||||
userOrderCode: '',
|
||||
driverId: '',
|
||||
clickFlag: true,
|
||||
isLoading: false,
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
this.userOrderId = this.$route.query.userOrderId || urlParams.get('userOrderId');
|
||||
this.userOrderCode = this.$route.query.userOrderCode || urlParams.get('userOrderCode');
|
||||
this.type = this.$route.query.type || urlParams.get('type');
|
||||
this.driverId = this.$route.query.driverId || urlParams.get('driverId');
|
||||
await this.getReportList();
|
||||
await this.getDetail();
|
||||
await this.getRecordList();
|
||||
await this.scrollToBottom();
|
||||
},
|
||||
activated() {
|
||||
let addressSession = sessionStorage.getItem('reportAddress');
|
||||
if(addressSession) {
|
||||
let _obj = JSON.parse(addressSession)
|
||||
this.address = _obj.startPoiAddress;
|
||||
this.lat = _obj.startLat;
|
||||
this.lng = _obj.startLng;
|
||||
this.adCode = _obj.adCode;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onRefreshHandler() {
|
||||
setTimeout(async () => {
|
||||
try {
|
||||
this.recordList = [];
|
||||
await this.getReportList();
|
||||
await this.getDetail();
|
||||
await this.getRecordList();
|
||||
await this.scrollToBottom();
|
||||
} finally {
|
||||
this.isLoading = false; // 结束加载状态
|
||||
}
|
||||
}, 100)
|
||||
},
|
||||
// 添加滚动方法
|
||||
scrollToBottom() {
|
||||
this.$nextTick(() => {
|
||||
const container = this.$refs.chatList
|
||||
container.scrollTop = container.scrollHeight
|
||||
})
|
||||
},
|
||||
async getRecordList() {
|
||||
let recordList = await reportHistory({
|
||||
userOrderId: this.userOrderId,
|
||||
userOrderCode: this.userOrderCode,
|
||||
driverId: this.driverId,
|
||||
source: Number(this.type),
|
||||
})
|
||||
this.recordList = recordList.data;
|
||||
},
|
||||
async saveHandler() {
|
||||
if( this.clickFlag ) {
|
||||
let data = {
|
||||
source: Number(this.type),
|
||||
reportContent: this.remark,
|
||||
userOrderId: Number(this.userOrderId),
|
||||
reportConfigId: this.currentInfo.id,
|
||||
userOrderCode: this.userOrderCode,
|
||||
driverId: this.driverId,
|
||||
}
|
||||
if(this.currentInfo.component == 'time') {
|
||||
if( !this.appointTime ) {
|
||||
Toast('预约时间不能为空')
|
||||
return
|
||||
}
|
||||
if( new Date(this.appointTime).getTime() <= new Date().getTime() ) {
|
||||
Toast('预约时间不能小于当前时间')
|
||||
return
|
||||
}
|
||||
data.time = this.appointTime
|
||||
}
|
||||
if(this.currentInfo.component == 'address') {
|
||||
if( !this.address ) {
|
||||
Toast('地址不能为空')
|
||||
return
|
||||
}
|
||||
data.address = this.address
|
||||
data.lat = this.lat;
|
||||
data.lng = this.lng;
|
||||
}
|
||||
if( !this.remark ) {
|
||||
Toast('备注内容不能为空')
|
||||
return
|
||||
}
|
||||
this.clickFlag = false;
|
||||
try {
|
||||
await newOrderReporting(data)
|
||||
Dialog.alert({
|
||||
title: '提示',
|
||||
message: "报备添加成功"
|
||||
}).then(async () => {
|
||||
await this.getRecordList()
|
||||
this.addReportShow = false
|
||||
this.scrollToBottom();
|
||||
this.initDialogData();
|
||||
this.clickFlag = true
|
||||
});
|
||||
} finally {
|
||||
this.clickFlag = true
|
||||
}
|
||||
}
|
||||
},
|
||||
initDialogData() {
|
||||
this.appointTime = '';
|
||||
this.address = '';
|
||||
this.lat = '';
|
||||
this.lng = '';
|
||||
this.remark = '';
|
||||
},
|
||||
addReportHandler(data) { // 点击添加报备弹框
|
||||
this.currentInfo = data;
|
||||
this.addReportShow = true
|
||||
},
|
||||
getReportHandler(data) { // 点击获取当前报备信息
|
||||
this.recordList.push({
|
||||
messageType: 4,
|
||||
content: data.child
|
||||
})
|
||||
this.scrollToBottom();
|
||||
},
|
||||
async getDetail(){ // 订单详情
|
||||
if(this.userOrderId) {
|
||||
let result = await getOrderInfo({
|
||||
userOrderId: this.userOrderId,
|
||||
userOrderCode: this.userOrderCode
|
||||
})
|
||||
this.orderInfo = result.data
|
||||
} else {
|
||||
this.orderInfo = {}
|
||||
}
|
||||
|
||||
},
|
||||
async getReportList() { // 报备大类
|
||||
let res = await getReportListByOrder({
|
||||
orderId: this.userOrderId
|
||||
});
|
||||
this.reportList = res.data
|
||||
},
|
||||
onConfirm(data) {
|
||||
this.appointTime = timeFormat(new Date(data))
|
||||
this.showDatetime = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.custom-pull-refresh {
|
||||
height: 100% !important;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
#app {
|
||||
background: #F9FCFF !important;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.main_wrap {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #F9FCFF !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// 添加以下样式确保正确的高度计算
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
.top_bg {
|
||||
width: 100%;
|
||||
height: 87px;
|
||||
/*.title {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding-top: 52px;
|
||||
font-size: 17px;
|
||||
line-height: 24px;
|
||||
}*/
|
||||
}
|
||||
.dispatch { // 调度app头部背景色
|
||||
background: #354683;
|
||||
}
|
||||
.driver { // 司机app头部背景色
|
||||
background: #334885;
|
||||
}
|
||||
.service_wrap {
|
||||
margin-top: -75px;
|
||||
/*margin-bottom: 20px;*/
|
||||
}
|
||||
.chat_list {
|
||||
flex: 1;
|
||||
/*overflow: auto;*/
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
-webkit-overflow-scrolling: touch; // 为了iOS平滑滚动
|
||||
padding-top: 10px;
|
||||
/* 修复 iOS 滚动问题 */
|
||||
transform: translateZ(0);
|
||||
.top_tip_wrap {
|
||||
color: #7C8698;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
}
|
||||
.tip_wrap {
|
||||
color: #7C8698;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.ai_chat {
|
||||
padding: 25px 10px 20px;
|
||||
display: flex;
|
||||
.ai_left {
|
||||
.report_ai {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
.ai_right {
|
||||
.ai_title {
|
||||
color: #203152;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
li {
|
||||
font-size: 13px;
|
||||
color: #267EF0;
|
||||
line-height: 18px;
|
||||
margin-bottom: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
li::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #5680FA;
|
||||
border-radius: 50%; /* 圆形 */
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*客服人员,服务人员对话弹框样式 s*/
|
||||
.profile_photo {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
}
|
||||
.mr {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.ml {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.mb20 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.customer_item {
|
||||
display: flex;
|
||||
padding-left: 10px;
|
||||
padding-right: 64px;
|
||||
.customer_left {
|
||||
}
|
||||
}
|
||||
.common_right {
|
||||
padding: 11px 13px;
|
||||
flex: 1;
|
||||
.customer_status::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #5680FA;
|
||||
border-radius: 50%; /* 圆形 */
|
||||
margin-right: 10px;
|
||||
}
|
||||
.customer_status {
|
||||
font-size: 14px;
|
||||
color: #267EF0;
|
||||
line-height: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.service_status {
|
||||
font-size: 14px;
|
||||
color: #F07926;
|
||||
line-height: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.service_status::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #F07926;
|
||||
border-radius: 50%; /* 圆形 */
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.customer_cls {
|
||||
border-radius: 0px 6px 6px 6px;
|
||||
background: #E3F0FF;
|
||||
}
|
||||
.service_cls {
|
||||
background: #FAEBD8;
|
||||
border-radius: 0px 6px 6px 6px;
|
||||
}
|
||||
.server_item {
|
||||
display: flex;
|
||||
padding-right: 10px;
|
||||
padding-left: 64px;
|
||||
}
|
||||
.response_con {
|
||||
font-size: 13px;
|
||||
color: #242A37;
|
||||
line-height: 18px;
|
||||
font-weight: bold;
|
||||
margin-top: 5px;
|
||||
}
|
||||
/*客服人员,服务人员对话弹框样式 e*/
|
||||
.dialog_wrap {
|
||||
.add_report_bg {
|
||||
width: 100%;
|
||||
height: 76px;
|
||||
}
|
||||
.report_content {
|
||||
width: calc(100% - 12px);
|
||||
margin: -30px auto 0;
|
||||
padding-right: 14px;
|
||||
padding-left: 20px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
padding-top: 25px;
|
||||
border-radius: 10px;
|
||||
.report_title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
color: #267EF0;
|
||||
line-height: 22px;
|
||||
margin-bottom: 10px;
|
||||
.dot {
|
||||
width: 7px;
|
||||
height: 6px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
.report_time_content {
|
||||
padding: 13px;
|
||||
background: #F2F7FF;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #E2EAF6;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 30px;
|
||||
.report_time_left {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: rgba(0, 0, 0, 0.9);
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.add_report_time {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.report_arrow {
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
.report_common_content {
|
||||
margin-bottom: 27px;
|
||||
.report_textarea {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background: #F8FAFC;
|
||||
border-radius: 6px;
|
||||
min-height: 95px;
|
||||
border: 1px solid #E2EAF6;
|
||||
padding: 10px;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.report_btn {
|
||||
width: calc(100% - 80px);
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
background: #005DD5;
|
||||
border-radius: 23px;
|
||||
color: #FFFFFF;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin: 0 auto 40px;
|
||||
}
|
||||
}
|
||||
::v-deep .van-popup__close-icon {
|
||||
color: #0F458E;
|
||||
}
|
||||
</style>
|
||||
164
src/views/rvDriverAuthentication/auditList.vue
Normal file
@ -0,0 +1,164 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="navBar">
|
||||
<van-nav-bar
|
||||
title="小板运输司机认证"
|
||||
left-arrow
|
||||
left-arrow-color="#FFFFFF"
|
||||
:border="false"
|
||||
:fixed="true"
|
||||
:safe-area-inset-top="true"
|
||||
@click-left="h5GoBack"
|
||||
/>
|
||||
</div>
|
||||
<img class="icon_register" mode="widthFix" src="@/assets/authentication/icon_register.png" />
|
||||
<tip-bar :title="'应国家政策要求:从事货运行业的司机用户,身份证照片、驾驶证信息、行驶证信息、人车合影及承运资质信息必须进行实名认证。'"></tip-bar>
|
||||
<div class="audit_list">
|
||||
<audit-item title="个人信息" tip="上传本人头像和身份证"
|
||||
:url="currentFlag(1) ? personActiveUrl : personUrl"
|
||||
:pass="currentFlag(1)" :current-class="currentStep == 1"
|
||||
@detail="showDetail('personAudit')" @upload="showDetail('personAudit')"></audit-item>
|
||||
<audit-item title="驾照信息" tip="上传驾驶证" :url="currentFlag(2) ? driverActiveUrl : driverUrl" v-if="type != 'simple'" :pass="currentFlag(2)" :current-class="currentStep == 2"
|
||||
@detail="showDetail('carAudit')" @upload="showDetail('carAudit')"></audit-item>
|
||||
<audit-item title="车辆信息" tip="上传行驶证与车辆照片" :url="currentFlag(3) ? carActiveUrl : carUrl" :pass="currentFlag(3)" :current-class="currentStep == 3"
|
||||
@detail="showDetail('carInfoAudit')" @upload="showDetail('carInfoAudit')"></audit-item>
|
||||
<audit-item title="银行卡信息" tip="上传本人银行卡信息" :url="currentFlag(4) ? bankActiveUrl :bankUrl" :pass="currentFlag(4)" :current-class="currentStep == 4"
|
||||
@detail="showDetail('bankInfo')" @upload="showDetail('bankInfo')"></audit-item>
|
||||
<audit-item title="审核信息" :tip="auditTip" :status="statusStr" :url="currentFlag(5) ? bankActiveUrl :bankUrl" :pass="currentFlag(5)" :current-class="currentStep == 5" :button-hide="false"
|
||||
></audit-item>
|
||||
</div>
|
||||
<fixed-button v-if="verifyStatus == 11" @myClick="showDetail('personAudit')" title="重新认证"></fixed-button>
|
||||
<success-dialog ref="successDialog"></success-dialog>s
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import successDialog from "./component/successDialog.vue";
|
||||
import auditItem from "./component/auditItem";
|
||||
import tipBar from "./component/tipBar";
|
||||
import { verifyStatus, verifyStatusSimple ,tipString} from '@/utils/common';
|
||||
import { myMixins } from '@/utils/myMixins.js';
|
||||
import fixedButton from "./component/fixedButton";
|
||||
import {infoVerifyProgress} from "@/api/authentication"
|
||||
export default {
|
||||
name:"auditList",
|
||||
data() {
|
||||
return {
|
||||
personUrl: require('@/assets/authentication/audit_icon4_gray.png'),
|
||||
personActiveUrl: require('@/assets/authentication/audit_icon4.png'),
|
||||
driverUrl: require('@/assets/authentication/audit_icon1_gray.png'),
|
||||
driverActiveUrl: require('@/assets/authentication/aduit_icon1.png'),
|
||||
carUrl: require('@/assets/authentication/audit_icon2_gray.png'),
|
||||
carActiveUrl: require('@/assets/authentication/audit_icon2.png'),
|
||||
bankUrl: require('@/assets/authentication/audit_icon3_gray.png'),
|
||||
bankActiveUrl: require('@/assets/authentication/audit_icon3.png'),
|
||||
currentStep: undefined,
|
||||
auditTip: '',
|
||||
statusStr: '',
|
||||
verifyStatus: '',
|
||||
type: 'full',
|
||||
}
|
||||
},
|
||||
mixins: [ myMixins ],
|
||||
components: {
|
||||
tipBar,
|
||||
auditItem,
|
||||
fixedButton,
|
||||
successDialog
|
||||
},
|
||||
// onLoad() {
|
||||
// },
|
||||
// async onPullDownRefresh() {
|
||||
// await this.refresh()
|
||||
// uni.stopPullDownRefresh()
|
||||
// },
|
||||
async mounted() {
|
||||
// await this.$onLaunched;
|
||||
// 禁止双击放大
|
||||
let lastTouchEnd = 0;
|
||||
document.addEventListener('touchend', (event) => {
|
||||
const now = Date.now();
|
||||
if (now - lastTouchEnd <= 300) {
|
||||
event.preventDefault(); // 阻止双击放大
|
||||
}
|
||||
lastTouchEnd = now;
|
||||
}, { passive: false });
|
||||
|
||||
await this.refresh()
|
||||
},
|
||||
methods: {
|
||||
async getRegisterInfo(data) {
|
||||
let res = await infoVerifyProgress( data)
|
||||
// console.log("res",res)
|
||||
localStorage.setItem('infoVerify', res?.data?.infoVerify?.code)
|
||||
localStorage.setItem('failReason', res?.data?.verifyRemark)
|
||||
localStorage.setItem('authIsSuccess', res?.data?.authIsSuccess)
|
||||
localStorage.setItem('name', res?.data?.name)
|
||||
},
|
||||
async refresh() {
|
||||
await this.getRegisterInfo()
|
||||
await this.getVerifyStatus()
|
||||
let obj = await tipString(localStorage.getItem('infoVerify'))
|
||||
this.verifyStatus = localStorage.getItem('infoVerify')
|
||||
if( this.verifyStatus == 11 ) {
|
||||
this.auditTip = localStorage.getItem('failReason')
|
||||
localStorage.setItem('authIsSuccess', 0)
|
||||
} else {
|
||||
this.auditTip = obj.tip
|
||||
}
|
||||
if( this.verifyStatus == 12 && parseInt(localStorage.getItem('authIsSuccess')) != 1) { // 审核通过
|
||||
this.$refs.successDialog.openHandler()
|
||||
}
|
||||
this.statusStr = obj.button
|
||||
},
|
||||
currentFlag(status) {
|
||||
return this.currentStep > status
|
||||
},
|
||||
showDetail(path) {
|
||||
this.goPage(path,{
|
||||
token:localStorage.getItem('token')
|
||||
})
|
||||
},
|
||||
getVerifyStatus() {
|
||||
if( this.type == 'simple' ) {
|
||||
this.currentStep = verifyStatusSimple(localStorage.getItem('infoVerify'))
|
||||
} else {
|
||||
this.currentStep = verifyStatus(localStorage.getItem('infoVerify'))
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/styles/common.scss";
|
||||
.navBar{
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
.content {
|
||||
font-size: 0;
|
||||
padding-bottom: 80px;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch; /* 启用iOS惯性滚动 */
|
||||
scroll-behavior: smooth; /* 平滑滚动(部分浏览器支持) */
|
||||
}
|
||||
.audit_list {
|
||||
padding: 20px 30px;
|
||||
.audit_item:after{
|
||||
left: 18px;
|
||||
position: absolute;
|
||||
content: '';
|
||||
display: block;
|
||||
width: 2px;
|
||||
top: 56px;
|
||||
height: 48px;
|
||||
background: rgba($color: #B2C2E4, $alpha: 0.59);
|
||||
}
|
||||
.audit_item:last-child {
|
||||
&::after{
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
164
src/views/rvDriverAuthentication/bankInfo.vue
Normal file
@ -0,0 +1,164 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="navBar">
|
||||
<van-nav-bar
|
||||
title="银行卡信息认证"
|
||||
left-arrow
|
||||
left-arrow-color="#FFFFFF"
|
||||
:border="false"
|
||||
:fixed="true"
|
||||
:safe-area-inset-top="true"
|
||||
@click-left="goListPage"
|
||||
/>
|
||||
</div>
|
||||
<tip-bar :title="'温馨提示:服务完成后,平台代收的运费需要提现到您的银行卡账户中,请确保您上传的银行卡信息真实可用。'"></tip-bar>
|
||||
<photo-item title="银行卡正面照片" :left-url="form.bankCardFront || bank" :show="show" @leftImg="bankHandler"></photo-item>
|
||||
<div class="carInfo">
|
||||
<div class="left_wrap title">
|
||||
<span class="mar_left">姓名</span>
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>账户号</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>开户行</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right_wrap">
|
||||
<input type="text" disabled placeholder="请输入持卡人姓名" v-model="form.name">
|
||||
<input type="text" placeholder="请输入银行卡号" v-model="form.cardNumber">
|
||||
<input type="text" placeholder="请输入开户行" v-model="form.bankName">
|
||||
</div>
|
||||
</div>
|
||||
<fixed-button @myClick="clickHandler" v-if="showFun()"></fixed-button>
|
||||
<!-- <protocol-dialog></protocol-dialog>-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import protocolDialog from "./component/protocolDialog";
|
||||
import fixedButton from "./component/fixedButton";
|
||||
import photoItem from "./component/photoItem";
|
||||
import tipBar from "./component/tipBar";
|
||||
import {ocrRecognize, driverInfoVerify, driverInfoVerifyDetail, infoVerifyProgress} from '@/api/authentication.js'
|
||||
import { leftCopy } from '@/utils/common.js'
|
||||
import { myMixins } from '@/utils/myMixins.js'
|
||||
export default {
|
||||
name: "bankInfo",
|
||||
components: {
|
||||
tipBar,
|
||||
photoItem,
|
||||
fixedButton,
|
||||
// protocolDialog
|
||||
},
|
||||
mixins: [myMixins],
|
||||
data() {
|
||||
return {
|
||||
bank: require('@/assets/authentication/bank_icon1.png'),
|
||||
show: undefined,
|
||||
form: {
|
||||
bankCardFront: '',
|
||||
bankName: '',
|
||||
cardNumber: '',
|
||||
name: '',
|
||||
},
|
||||
type:localStorage.getItem('type')
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
// 禁止双击放大
|
||||
let lastTouchEnd = 0;
|
||||
document.addEventListener('touchend', (event) => {
|
||||
const now = Date.now();
|
||||
if (now - lastTouchEnd <= 300) {
|
||||
event.preventDefault(); // 阻止双击放大
|
||||
}
|
||||
lastTouchEnd = now;
|
||||
}, { passive: false });
|
||||
|
||||
// if(options?.show) {
|
||||
this.show = true
|
||||
// }
|
||||
if( this.show ) {
|
||||
await this.getDetail()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async clickHandler() {
|
||||
if(!this.form.bankCardFront) {
|
||||
this.$toast('银行卡照片未上传');
|
||||
return
|
||||
}
|
||||
if( this.form.name && this.form.cardNumber && this.form.bankName ) {
|
||||
let res = await driverInfoVerify( {
|
||||
verifyType: 4,
|
||||
...this.form,
|
||||
type: this.type || 'full',
|
||||
})
|
||||
this.$toast('操作成功')
|
||||
await this.getRegisterInfo({
|
||||
verifyType: 4
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.goListPage()
|
||||
}, 100)
|
||||
console.log('注册', res)
|
||||
} else {
|
||||
this.$toast('银行卡信息识别错误')
|
||||
}
|
||||
},
|
||||
async getRegisterInfo(data) {
|
||||
let res = await infoVerifyProgress( data)
|
||||
localStorage.setItem('infoVerify', res?.data?.infoVerify?.code)
|
||||
localStorage.setItem('failReason', res?.data?.verifyRemark)
|
||||
localStorage.setItem('authIsSuccess', res?.data?.authIsSuccess)
|
||||
localStorage.setItem('name', res?.data?.name)
|
||||
},
|
||||
goListPage(){
|
||||
this.goPage('auditList',{
|
||||
token:localStorage.getItem('token')
|
||||
})
|
||||
},
|
||||
async bankHandler(data) {
|
||||
this.form.bankName = ''
|
||||
this.form.cardNumber = ''
|
||||
this.form.name = ''
|
||||
this.form.bankCardFront = data
|
||||
let res = await this.orcHandler(this.form.bankCardFront, 5)
|
||||
leftCopy(this.form, {...res?.data?.data})
|
||||
},
|
||||
async getDetail() { // 认证详情
|
||||
let res = await driverInfoVerifyDetail( {
|
||||
verifyType: 4
|
||||
})
|
||||
leftCopy(this.form, {...res?.data?.bankCardInfoData})
|
||||
console.log('bank', res)
|
||||
},
|
||||
async orcHandler(url, type) { // ocr 识别
|
||||
let res = await ocrRecognize( {
|
||||
ocrType: type,
|
||||
imageUrl: url
|
||||
});
|
||||
return res;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/styles/common.scss";
|
||||
@import "@/styles/infoShow.scss";
|
||||
page {
|
||||
background: #F4F5F7;
|
||||
}
|
||||
.content{
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch; /* 启用iOS惯性滚动 */
|
||||
scroll-behavior: smooth; /* 平滑滚动(部分浏览器支持) */
|
||||
}
|
||||
.navBar{
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
</style>
|
||||
237
src/views/rvDriverAuthentication/carAudit.vue
Normal file
@ -0,0 +1,237 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="navBar">
|
||||
<van-nav-bar
|
||||
title="驾驶证认证"
|
||||
left-arrow
|
||||
left-arrow-color="#FFFFFF"
|
||||
:border="false"
|
||||
:fixed="true"
|
||||
:safe-area-inset-top="true"
|
||||
@click-left="goListPage"
|
||||
/>
|
||||
</div>
|
||||
<tip-bar :title="'应国家政策要求:从事货运行业的司机用户,身份证照片、驾驶证信息、行驶证信息、人车合影及承运资质信息必须进行实名认证。'"></tip-bar>
|
||||
<photo-item title="上传驾驶证" :left-url="form.drivingLicenceFront || carFront" :right-url="form.drivingLicenceContrary || carBack"
|
||||
:show="show" @leftImg="carFrontHandler" @rightImg="carBackHandler"></photo-item>
|
||||
<div class="carInfo">
|
||||
<div class="left_wrap title">
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>姓名</span>
|
||||
</div>
|
||||
<span class="phone">{{form.name}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>身份证号</span>
|
||||
</div>
|
||||
<input class="phone" type="text" placeholder="请输入持卡人身份证号" v-model="form.licenseNumber">
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>准驾类型</span>
|
||||
</div>
|
||||
<span class="phone">{{form.approvedType}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>初次领证日期</span>
|
||||
</div>
|
||||
<span class="phone">{{form.initialIssueDate}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>有效期限</span>
|
||||
</div>
|
||||
<span class="phone">{{form.validPeriod}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>档案编号</span>
|
||||
</div>
|
||||
<span class="phone">{{form.recordNumber}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<fixed-button @myClick="clickHandler" v-if="showFun()"></fixed-button>
|
||||
<!-- <protocol-dialog></protocol-dialog>-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import protocolDialog from "./component/protocolDialog";
|
||||
import fixedButton from "./component/fixedButton";
|
||||
import photoItem from "./component/photoItem";
|
||||
import tipBar from "./component/tipBar";
|
||||
import {ocrRecognize, driverInfoVerify, driverInfoVerifyDetail, infoVerifyProgress} from '@/api/authentication.js'
|
||||
import { leftCopy } from '@/utils/common.js'
|
||||
import { myMixins } from '@/utils/myMixins.js'
|
||||
export default {
|
||||
name: "carAudit",
|
||||
components: {
|
||||
tipBar,
|
||||
photoItem,
|
||||
fixedButton,
|
||||
// protocolDialog
|
||||
},
|
||||
mixins: [ myMixins ],
|
||||
data() {
|
||||
return {
|
||||
carFront: require('@/assets/authentication/car_icon1.png'),
|
||||
carBack: require('@/assets/authentication/car_icon2.png'),
|
||||
form: {
|
||||
name: '',
|
||||
drivingLicenceFront: '',
|
||||
drivingLicenceContrary: '',
|
||||
licenseNumber: '',
|
||||
approvedType: '', // 准驾车型
|
||||
initialIssueDate: '', // 初次领证日期
|
||||
validPeriod: '', // 有效期
|
||||
recordNumber: '', // 档案编号
|
||||
},
|
||||
show: undefined,
|
||||
type: 'full',
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
// 禁止双击放大
|
||||
let lastTouchEnd = 0;
|
||||
document.addEventListener('touchend', (event) => {
|
||||
const now = Date.now();
|
||||
if (now - lastTouchEnd <= 300) {
|
||||
event.preventDefault(); // 阻止双击放大
|
||||
}
|
||||
lastTouchEnd = now;
|
||||
}, { passive: false });
|
||||
|
||||
// if(options?.show) {
|
||||
this.show = true
|
||||
// }
|
||||
if( this.show ) {
|
||||
await this.getDetail()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
backInit() {
|
||||
this.form.recordNumber = ''
|
||||
},
|
||||
frontInit() {
|
||||
this.form.licenseNumber = ''
|
||||
this.form.approvedType = ''
|
||||
this.form.initialIssueDate = ''
|
||||
this.form.validPeriod = ''
|
||||
},
|
||||
async carFrontHandler(data) {
|
||||
await this.frontInit();
|
||||
this.form.drivingLicenceFront = data
|
||||
await this.idOrcHandler(this.form.drivingLicenceFront)
|
||||
},
|
||||
async carBackHandler(data) {
|
||||
await this.backInit();
|
||||
this.form.drivingLicenceContrary = data
|
||||
await this.idOrcHandler(this.form.drivingLicenceContrary, 'back')
|
||||
},
|
||||
async idOrcHandler(url, type = 'front') { // ocr 识别
|
||||
let res = await ocrRecognize({
|
||||
ocrType: 2,
|
||||
imageUrl: url
|
||||
});
|
||||
let carInfo
|
||||
if(type == 'back') {
|
||||
carInfo = res?.data?.data?.back?.data
|
||||
this.form.recordNumber = carInfo?.recordNumber || ''
|
||||
} else {
|
||||
carInfo = res?.data?.data?.face?.data
|
||||
leftCopy(this.form, {...carInfo})
|
||||
}
|
||||
|
||||
},
|
||||
async getDetail() { // 认证详情
|
||||
let res = await driverInfoVerifyDetail( {
|
||||
verifyType: 2
|
||||
})
|
||||
leftCopy(this.form, {...res?.data?.drivingLicenseInfoData})
|
||||
console.log('carAudit', res)
|
||||
},
|
||||
async clickHandler() { // 点击去认证
|
||||
if( !this.form.drivingLicenceFront ) {
|
||||
this.$toast('驾驶证正面照片未上传')
|
||||
return
|
||||
}
|
||||
if( !this.form.drivingLicenceContrary ) {
|
||||
this.$toast('驾驶证反面照片未上传')
|
||||
return
|
||||
}
|
||||
if(!this.form.licenseNumber || !this.form.initialIssueDate || !this.form.validPeriod) {
|
||||
this.$toast('驾驶证正面识别错误,请重新上传')
|
||||
return
|
||||
}
|
||||
if(!this.form.recordNumber) {
|
||||
this.$toast('驾驶证反面识别错误,请重新上传')
|
||||
return
|
||||
}
|
||||
await driverInfoVerify({
|
||||
verifyType: 2,
|
||||
type: this.type || 'full',
|
||||
...this.form,
|
||||
})
|
||||
this.$toast('操作成功')
|
||||
await this.getRegisterInfo({
|
||||
verifyType: 2
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.goListPage()
|
||||
}, 100)
|
||||
}, async getRegisterInfo(data) {
|
||||
let res = await infoVerifyProgress( data)
|
||||
localStorage.setItem('infoVerify', res?.data?.infoVerify?.code)
|
||||
localStorage.setItem('failReason', res?.data?.verifyRemark)
|
||||
localStorage.setItem('authIsSuccess', res?.data?.authIsSuccess)
|
||||
localStorage.setItem('name', res?.data?.name)
|
||||
},
|
||||
goListPage(){
|
||||
this.goPage('auditList',{
|
||||
token:localStorage.getItem('token')
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/styles/common.scss";
|
||||
@import "@/styles/infoShow.scss";
|
||||
page {
|
||||
background: #F4F5F7;
|
||||
}
|
||||
.content{
|
||||
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch; /* 启用iOS惯性滚动 */
|
||||
scroll-behavior: smooth; /* 平滑滚动(部分浏览器支持) */
|
||||
}
|
||||
.navBar{
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
.carInfo .title {
|
||||
width: 100% !important;
|
||||
}
|
||||
.form_item {
|
||||
line-height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.phone {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
446
src/views/rvDriverAuthentication/carInfoAudit.vue
Normal file
@ -0,0 +1,446 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="navBar">
|
||||
<van-nav-bar
|
||||
title="车辆信息认证"
|
||||
left-arrow
|
||||
left-arrow-color="#FFFFFF"
|
||||
:border="false"
|
||||
:fixed="true"
|
||||
:safe-area-inset-top="true"
|
||||
@click-left="goListPage"
|
||||
/>
|
||||
</div>
|
||||
<tip-bar :title="'应国家政策要求:从事货运行业的司机用户,身份证照片、驾驶证信息、行驶证信息、人车合影及承运资质信息必须进行实名认证。'"></tip-bar>
|
||||
<div class="titleWrap">
|
||||
<div class="natureWrap">
|
||||
<span class="title"><span class="star">*</span>业务性质</span>
|
||||
<van-radio-group @change="radioChange" v-model="form.businessNature" class="flexWrap">
|
||||
<van-radio :name="1">全国跑圈业务</van-radio>
|
||||
<van-radio :name="2">固定区域救援业务</van-radio>
|
||||
</van-radio-group>
|
||||
</div>
|
||||
<div class="natureWrap regionWrap" v-if="form.businessNature == 2" >
|
||||
<span class="title"><span class="star">*</span>所在地区</span>
|
||||
<div class="pickerWrap picker" @click="areaShow = true" >{{regionText}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<photo-item title="上传行驶证" :left-url="form.vehicleLicenseFront || driveFront" :right-url="form.vehicleLicenseBack || driveBack" v-if="type != 'simple'"
|
||||
:show="show" @leftImg="vehicleFrontHandler" @rightImg="vehicleBackHandler"></photo-item>
|
||||
<photo-item title="上传车辆照片" :left-url="form.vehicleFrontPhoto || carHead" :right-url="form.peopleVehiclePhoto || personCar" v-if="type != 'simple'"
|
||||
:show="show" @leftImg="carPhotoHandler" @rightImg="personPhotoHandler"></photo-item>
|
||||
<photo-item title="是否有救援责任险/货物运输险" :url-list="form.carrierLiabilityInsurancePhoto" :in-sure="form.hasInsurancePhoto"
|
||||
:show="show" @urlList="carrierHandler" @insureHandle="insureHandle"></photo-item>
|
||||
<div class="titleWrap">
|
||||
<div class="natureWrap">
|
||||
<span class="title"><span class="star">*</span>随车小轮个数</span>
|
||||
<van-radio-group v-model="form.wheelNum" class="flexWrap">
|
||||
<van-radio v-for="item in tyreOptions" :key="item.value" :name="item.value">{{item.name}}</van-radio>
|
||||
</van-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carInfo" v-if="type != 'simple'">
|
||||
<div class="left_wrap title">
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>车牌号</span>
|
||||
</div>
|
||||
<span class="phone">{{form.licensePlateNumber}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>车架号</span>
|
||||
</div>
|
||||
<span class="phone">{{form.vinCode}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>车型</span>
|
||||
</div>
|
||||
<span class="phone">{{form.vehicleType}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>品牌车型</span>
|
||||
</div>
|
||||
<span class="phone">{{form.vehicleLicenseModel}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>行驶证人</span>
|
||||
</div>
|
||||
<span class="phone">{{form.vehicleLicenseOwner}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span>检验记录</span>
|
||||
</div>
|
||||
<span class="phone">{{form.inspectionRecord}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>总质量</span>
|
||||
</div>
|
||||
<span class="phone">{{form.totalWeight}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>整备质量</span>
|
||||
</div>
|
||||
<span class="phone">{{form.curbWeight}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>外廓尺寸</span>
|
||||
</div>
|
||||
<span class="phone">{{form.overallDimension}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star"></span>
|
||||
<span>档案编号</span>
|
||||
</div>
|
||||
<span class="phone">{{form.vehicleLicenseRecordNumber}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star"></span>
|
||||
<span>行驶证备注</span>
|
||||
</div>
|
||||
<span class="phone">{{form.vehicleLicenseRemarks}}</span>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div>
|
||||
<span class="star">*</span>
|
||||
<span>车头照片中的车牌号码</span>
|
||||
</div>
|
||||
<span class="phone">{{form.carNumber}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<fixed-button @myClick="clickHandler" v-if="showFun()" :noBg="true"></fixed-button>
|
||||
<van-popup
|
||||
v-model="areaShow"
|
||||
position="bottom"
|
||||
>
|
||||
<van-area title="标题" :area-list="areaList" :columns-num="3" closeable="true" :value="form.areaCode ? String(form.areaCode) : ''"
|
||||
@cancel="areaShow = false" @confirm="confirmHandle"/>
|
||||
</van-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import fixedButton from "./component/fixedButton";
|
||||
import photoItem from "./component/photoItem";
|
||||
import tipBar from "./component/tipBar";
|
||||
import {ocrRecognize, driverInfoVerify, driverInfoVerifyDetail, infoVerifyProgress} from '@/api/authentication.js'
|
||||
import { leftCopy } from '@/utils/common.js'
|
||||
import { myMixins } from '@/utils/myMixins.js'
|
||||
import {areaList} from "@vant/area-data";
|
||||
export default {
|
||||
name: "carInfoAudit",
|
||||
components: {
|
||||
tipBar,
|
||||
photoItem,
|
||||
fixedButton,
|
||||
},
|
||||
mixins: [myMixins],
|
||||
data() {
|
||||
return {
|
||||
areaList: areaList,
|
||||
areaShow:false,
|
||||
region: [],
|
||||
driveFront: require('@/assets/authentication/carInfo_icon1.png'),
|
||||
driveBack: require('@/assets/authentication/carInfo_icon2.png'),
|
||||
carHead:require('@/assets/authentication/carInfo_icon3.png'),
|
||||
personCar:require('@/assets/authentication/carInfo_icon4.png'),
|
||||
liabilityInsurance:require('@/assets/authentication/carInfo_icon5.png'),
|
||||
form: {
|
||||
vehicleLicenseFront: '', // 行驶证主页照片
|
||||
vehicleLicenseBack: '', // 行驶证副页照片
|
||||
vehicleLicenseAddress: '', // 行驶证地址
|
||||
engineNumber: '', // 行驶证发动机号
|
||||
licensePlateNumber: '', // 车牌号
|
||||
vinCode: '', // 车架号
|
||||
vehicleType: '', // 车型
|
||||
vehicleLicenseModel: '', // 行驶证车辆品牌车型
|
||||
vehicleLicenseOwner: '', // 行驶证所有人
|
||||
inspectionRecord: '', // 检验记录
|
||||
totalWeight: '', // 总质量
|
||||
curbWeight: '', // 整备质量
|
||||
overallDimension: '', // 外廓尺寸
|
||||
vehicleLicenseRecordNumber: '', // 行驶证档案编号
|
||||
vehicleLicenseRemarks: '', // 行驶证备注
|
||||
vehicleFrontPhoto: '', // 车头照片
|
||||
carNumber: '', // 车头照片中的车牌号码
|
||||
peopleVehiclePhoto: '', // 人车合影照片
|
||||
carrierLiabilityInsurancePhoto: [], // 承运人责任险照片,如多张用英文逗号分开
|
||||
businessNature:'',
|
||||
areaCode:'',
|
||||
hasInsurancePhoto:'',
|
||||
wheelNum:-1,
|
||||
region:[],
|
||||
},
|
||||
show: undefined,
|
||||
type: 'full',
|
||||
tyreOptions:[{value:0,name:'0'},{value:2,name:'2'},{value:4,name:'4'}]
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
// 禁止双击放大
|
||||
let lastTouchEnd = 0;
|
||||
document.addEventListener('touchend', (event) => {
|
||||
const now = Date.now();
|
||||
if (now - lastTouchEnd <= 300) {
|
||||
event.preventDefault(); // 阻止双击放大
|
||||
}
|
||||
lastTouchEnd = now;
|
||||
}, { passive: false });
|
||||
|
||||
// if(options?.show) {
|
||||
this.show = true
|
||||
// }
|
||||
if(this.show) {
|
||||
await this.getDetail()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
confirmHandle(val){
|
||||
this.region=[]
|
||||
val?.forEach(item => this.region.push(item.name))
|
||||
let code=[]
|
||||
val?.forEach(item => code.push(item.code))
|
||||
this.form.areaCode=code[code.length - 1]
|
||||
this.areaShow=false
|
||||
},
|
||||
radioChange(){
|
||||
if(this.form.businessNature==1){
|
||||
this.region=[]
|
||||
this.form.areaCode=''
|
||||
}
|
||||
},
|
||||
async getDetail() { // 认证详情
|
||||
let res = await driverInfoVerifyDetail( {
|
||||
verifyType: 3
|
||||
})
|
||||
leftCopy(this.form, {...res?.data?.vehicleInfoData})
|
||||
console.log("this.form",this.form)
|
||||
this.form.carrierLiabilityInsurancePhoto=this.form.carrierLiabilityInsurancePhoto ? res?.data?.vehicleInfoData?.carrierLiabilityInsurancePhoto?.split(',') : []
|
||||
if(this.form.businessNature==2){
|
||||
this.region=res?.data?.vehicleInfoData?.region
|
||||
if(this.region[0].includes('市')){
|
||||
this.region?.unshift(this.region[0])
|
||||
}
|
||||
}else {
|
||||
this.region=[]
|
||||
}
|
||||
},
|
||||
async clickHandler() {
|
||||
if( this.type != 'simple' ) {
|
||||
if(!this.form.businessNature){
|
||||
this.$toast('请选择业务性质')
|
||||
return
|
||||
}
|
||||
if(this.form.businessNature==2 && !this.form.areaCode){
|
||||
this.$toast('请选择所在地区')
|
||||
return
|
||||
}
|
||||
if(!this.form.vehicleLicenseFront) {
|
||||
this.$toast('行驶证主页未上传')
|
||||
return
|
||||
}
|
||||
if(!this.form.licensePlateNumber || !this.form.vehicleType ) {
|
||||
this.$toast('行驶证主页信息识别错误')
|
||||
return
|
||||
}
|
||||
if(!this.form.vehicleLicenseBack) {
|
||||
this.$toast('行驶证副页未上传')
|
||||
return
|
||||
}
|
||||
if(!this.form.totalWeight) {
|
||||
this.$toast('行驶证副页信息识别错误')
|
||||
return
|
||||
}
|
||||
if(!this.form.carNumber) {
|
||||
this.$toast('车辆信息识别错误')
|
||||
return
|
||||
}
|
||||
if( !this.form.peopleVehiclePhoto ) {
|
||||
this.$toast('人车合影未上传')
|
||||
return
|
||||
}
|
||||
if(this.form.hasInsurancePhoto == -1){
|
||||
this.$toast('请选择是否有救援责任险')
|
||||
return
|
||||
}
|
||||
if(this.form.hasInsurancePhoto==1 && this.form.carrierLiabilityInsurancePhoto?.length<=0){
|
||||
this.$toast('救援责任险/货物运输险未上传')
|
||||
return
|
||||
}
|
||||
if(this.form.wheelNum==-1){
|
||||
this.$toast('请选择随车小轮个数')
|
||||
return
|
||||
}
|
||||
}
|
||||
await driverInfoVerify( {
|
||||
verifyType: 3,
|
||||
type: this.type || 'full',
|
||||
...this.form,
|
||||
carrierLiabilityInsurancePhoto:this.form.carrierLiabilityInsurancePhoto?.length>0 ? this.form.carrierLiabilityInsurancePhoto?.join(',') : ''
|
||||
})
|
||||
this.$toast('操作成功')
|
||||
await this.getRegisterInfo({
|
||||
verifyType: 3
|
||||
})
|
||||
setTimeout(() => {
|
||||
this.goListPage()
|
||||
}, 100)
|
||||
},
|
||||
async getRegisterInfo(data) {
|
||||
let res = await infoVerifyProgress( data)
|
||||
localStorage.setItem('infoVerify', res?.data?.infoVerify?.code)
|
||||
localStorage.setItem('failReason', res?.data?.verifyRemark)
|
||||
localStorage.setItem('authIsSuccess', res?.data?.authIsSuccess)
|
||||
localStorage.setItem('name', res?.data?.name)
|
||||
},
|
||||
carrierHandler(data) { // 承运人责任险照片
|
||||
console.log("data",data)
|
||||
this.form.carrierLiabilityInsurancePhoto = data
|
||||
},
|
||||
insureHandle(val){
|
||||
this.form.hasInsurancePhoto=val
|
||||
},
|
||||
vehicleFrontInit() {
|
||||
this.form.licensePlateNumber = ''
|
||||
this.form.vinCode = ''
|
||||
this.form.vehicleType = ''
|
||||
this.form.vehicleLicenseModel = ''
|
||||
this.form.vehicleLicenseOwner = ''
|
||||
},
|
||||
async vehicleFrontHandler(data) { // 行驶证正面照,及ocr识别
|
||||
console.log("vehicleFrontHandler",data)
|
||||
await this.vehicleFrontInit()
|
||||
this.form.vehicleLicenseFront = data
|
||||
let vehicleInfo = await this.orcHandler(this.form.vehicleLicenseFront, 3)
|
||||
let tempInfo = vehicleInfo?.data?.data?.face?.data
|
||||
this.form.licensePlateNumber = tempInfo.licensePlateNumber
|
||||
this.form.vinCode = tempInfo.vinCode
|
||||
this.form.vehicleType = tempInfo.vehicleType
|
||||
this.form.vehicleLicenseModel = tempInfo.model
|
||||
this.form.vehicleLicenseOwner = tempInfo.owner
|
||||
this.form.vehicleLicenseAddress = tempInfo.address
|
||||
this.form.engineNumber = tempInfo.engineNumber
|
||||
},
|
||||
vehicleBackInit() {
|
||||
this.form.inspectionRecord = ''
|
||||
this.form.totalWeight = ''
|
||||
this.form.curbWeight = ''
|
||||
this.form.overallDimension = ''
|
||||
this.form.vehicleLicenseRecordNumber = ''
|
||||
this.form.vehicleLicenseRemarks = ''
|
||||
},
|
||||
async vehicleBackHandler(data) {
|
||||
await this.vehicleBackInit()
|
||||
this.form.vehicleLicenseBack = data
|
||||
let vehicleInfo = await this.orcHandler(this.form.vehicleLicenseBack, 3)
|
||||
let tempInfo = vehicleInfo?.data?.data?.back?.data
|
||||
this.form.inspectionRecord = tempInfo.inspectionRecord
|
||||
this.form.totalWeight = tempInfo.totalWeight
|
||||
this.form.curbWeight = tempInfo.curbWeight
|
||||
this.form.overallDimension = tempInfo.overallDimension
|
||||
this.form.vehicleLicenseRecordNumber = tempInfo.recordNumber
|
||||
this.form.vehicleLicenseRemarks = tempInfo.remarks
|
||||
},
|
||||
async carPhotoHandler(data) { // 车头照
|
||||
this.form.carNumber = ''
|
||||
this.form.vehicleFrontPhoto = data
|
||||
let carInfo = await this.orcHandler(this.form.vehicleFrontPhoto, 6)
|
||||
this.form.carNumber = carInfo?.data
|
||||
},
|
||||
personPhotoHandler(data){ // 人车合影
|
||||
this.form.peopleVehiclePhoto = data
|
||||
},
|
||||
async orcHandler(url, type) { // ocr 识别
|
||||
let res = await ocrRecognize( {
|
||||
ocrType: type,
|
||||
imageUrl: url
|
||||
});
|
||||
return res;
|
||||
},
|
||||
goListPage(){
|
||||
this.goPage('auditList',{
|
||||
token:localStorage.getItem('token')
|
||||
})
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
regionText() {
|
||||
return this.region.length ? `${this.region[0]}/${this.region[1]}/${this.region[2]}` : '请选择所在地区';
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "@/styles/common.scss";
|
||||
@import "@/styles/infoShow.scss";
|
||||
page {
|
||||
background: #F4F5F7;
|
||||
}
|
||||
.navBar{
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
.content {
|
||||
padding-bottom: 86px;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch; /* 启用iOS惯性滚动 */
|
||||
scroll-behavior: smooth; /* 平滑滚动(部分浏览器支持) */
|
||||
}
|
||||
.carInfo .title {
|
||||
width: 100% !important;
|
||||
}
|
||||
.form_item {
|
||||
line-height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.carInfo {
|
||||
padding-bottom: 86px;
|
||||
}
|
||||
.star{
|
||||
color: red;
|
||||
margin-right: 3px;
|
||||
}
|
||||
.titleWrap{
|
||||
margin-bottom: 10px;
|
||||
background-color: #FFFFFF;
|
||||
padding: 15px 12px 15px 17px;
|
||||
.natureWrap{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 13px !important;
|
||||
}
|
||||
.regionWrap{
|
||||
margin-top: 8px;
|
||||
}
|
||||
.flexWrap{
|
||||
display:flex;
|
||||
align-items: center;
|
||||
::v-deep .van-radio__icon{
|
||||
transform: scale(0.8);
|
||||
transform-origin: center; /* 保持中心点不变 */
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
131
src/views/rvDriverAuthentication/component/auditItem.vue
Normal file
@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div class="audit_item flex flex_between">
|
||||
<div class="item_left flex">
|
||||
<img class="main_img mr15" :src="url" />
|
||||
<div class="flex_fit">
|
||||
<div class="main_title active">{{title}}</div>
|
||||
<div class="main_tip">{{tip}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pass_item" v-if="pass" @click="showDetail">
|
||||
<span>{{status}}</span>
|
||||
<img v-if="title != '审核信息'" class="arrow_icon" src="@/assets/authentication/arrow_right.png" />
|
||||
</div>
|
||||
<div class="uploadBtn" :class="{'activeBtn': currentClass }"
|
||||
v-else-if="!pass && buttonHide" @click="uploadHandler">{{buttonTitle}}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "auditItem",
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
uploadHandler(){
|
||||
if( !this.pass && this.currentClass ) {
|
||||
this.$emit('upload')
|
||||
}
|
||||
},
|
||||
showDetail() {
|
||||
this.$emit('detail')
|
||||
}
|
||||
},
|
||||
props: {
|
||||
buttonHide: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
status: {
|
||||
type: String,
|
||||
default: '查看'
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
tip: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
url: {
|
||||
type: String,
|
||||
default: require('@/assets/authentication/aduit_icon1.png')
|
||||
},
|
||||
pass: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
currentClass: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
buttonTitle: {
|
||||
type: String,
|
||||
default: '上传'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.audit_item {
|
||||
width: 100%;
|
||||
padding: 20px 0;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
.item_left {
|
||||
flex: 1;
|
||||
.main_img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
.flex_fit {
|
||||
flex: 1;
|
||||
}
|
||||
.main_title {
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
line-height: 24px;
|
||||
color: #33495E;
|
||||
}
|
||||
.active {
|
||||
color: #33495E;
|
||||
}
|
||||
.main_tip {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #33495E;
|
||||
line-height: 20px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
.uploadBtn {
|
||||
width: 68px;
|
||||
height: 31px;
|
||||
background: rgba($color: #5B739D, $alpha: 0.24);
|
||||
color: #fff;
|
||||
font-size: 13px;
|
||||
border-radius: 4px;
|
||||
line-height: 31px;
|
||||
text-align: center;
|
||||
}
|
||||
.activeBtn {
|
||||
background: #3364B7;
|
||||
}
|
||||
.pass_item {
|
||||
font-size: 13px;
|
||||
color: rgba($color: #000, $alpha: 0.59);
|
||||
.arrow_icon {
|
||||
width: 8px;
|
||||
height: 12px;
|
||||
vertical-align: sub;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
56
src/views/rvDriverAuthentication/component/fixedButton.vue
Normal file
@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div class="button_fixed" :class="{ 'noBg': noBg }">
|
||||
<div class="button_wrap" @click="clickHandler">
|
||||
{{title}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "fixedButton",
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: '下一步'
|
||||
},
|
||||
noBg: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickHandler() {
|
||||
this.$emit('myClick')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.button_fixed {
|
||||
width: 100%;
|
||||
background: #F4F5F7;
|
||||
padding: 20px 0;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1111;
|
||||
.button_wrap {
|
||||
width: calc(100% - 80px);
|
||||
height: 46px;
|
||||
background: #354D93;
|
||||
border-radius: 23px;
|
||||
margin: 0 auto;
|
||||
line-height: 46px;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.noBg {
|
||||
background: none
|
||||
}
|
||||
</style>
|
||||
301
src/views/rvDriverAuthentication/component/photoItem.vue
Normal file
@ -0,0 +1,301 @@
|
||||
<template>
|
||||
<div class="photo_wrap">
|
||||
<template v-if="title.indexOf('责任险/货物') !== -1">
|
||||
<div class="photo_title custom-title">
|
||||
<span><span class="star">*</span>{{title}}</span>
|
||||
<van-radio-group @change="radioChange" v-model="form.isInsure" class="flexWrap">
|
||||
<van-radio :name="0">否</van-radio>
|
||||
<van-radio :name="1">是</van-radio>
|
||||
</van-radio-group>
|
||||
</div>
|
||||
<div class="photoWrap" v-if="inSure == 1">
|
||||
<van-uploader :after-read="(file) => afterRead(file,'urlList')" class="customUploadMul" @click-upload="(event)=>clickUpload(event,'urlList')">
|
||||
<!-- -->
|
||||
<!-- :max-count="3" v-model="fileList" multiple :deletable="true" -->
|
||||
<template v-if="urlList.length > 0">
|
||||
<div v-for="(item, index) in urlList" :key="index" class="uploaded-item">
|
||||
<img class="photo_item" mode="widthFix" :src="item.replace(/http:\/\//g, 'https://')" />
|
||||
</div>
|
||||
</template>
|
||||
<template v-if="urlList.length < 3 && showFun()">
|
||||
<div class="tipWrap">
|
||||
<img class="photo_item" mode="widthFix" src="@/assets/authentication/carInfo_icon5.png"/>
|
||||
<img class="camera" v-if="showFun()" src="@/assets/authentication/camera.png" />
|
||||
<span class="picNum">({{ urlList.length }}/3)</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-uploader>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="photo_title">
|
||||
<span class="star">*</span>
|
||||
<span>{{title}}</span>
|
||||
</div>
|
||||
<div class="photo_img flex flex_between">
|
||||
<van-uploader v-if="leftUrl" :after-read="(file) => afterRead(file,'leftImg')" class="customUpload" @click-upload="(event)=>clickUpload(event,'leftImg')">
|
||||
<template v-if="form.leftImg">
|
||||
<img class="photo_item" mode="widthFix" :src="form.leftImg.replace(/http:\/\//g, 'https://')" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<img class="photo_item" mode="widthFix" :src="leftUrl" />
|
||||
<img class="camera" v-if="showFun()" src="@/assets/authentication/camera.png" />
|
||||
</template>
|
||||
</van-uploader>
|
||||
<van-uploader v-if="rightUrl" :after-read="(file) => afterRead(file,'rightImg')" class="customUpload" @click-upload="(event)=>clickUpload(event,'rightImg')">
|
||||
<template v-if="form.rightImg">
|
||||
<img class="photo_item" mode="widthFix" :src="form.rightImg.replace(/http:\/\//g, 'https://')" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<img class="photo_item" mode="widthFix" :src="rightUrl" />
|
||||
<img class="camera" v-if="showFun()" src="@/assets/authentication/camera.png" />
|
||||
</template>
|
||||
</van-uploader>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {uploadImage} from "@/api/mine";
|
||||
import { ImagePreview } from 'vant';
|
||||
|
||||
/*let baseUrl=''
|
||||
if (window.location.href.includes('www.sinoassist.com')) {
|
||||
baseUrl = 'https://www.sinoassist.com'
|
||||
} else {
|
||||
baseUrl = 'https://crm1.sino-assist.com'
|
||||
}*/
|
||||
export default {
|
||||
name: "photoItem",
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
},
|
||||
leftUrl: {
|
||||
type: String,
|
||||
default: require('@/assets/authentication/person_header.png')
|
||||
},
|
||||
rightUrl: {
|
||||
type: String,
|
||||
},
|
||||
show: {
|
||||
|
||||
},
|
||||
urlList: {
|
||||
type: Array,
|
||||
default: ()=>[]
|
||||
},
|
||||
inSure:{
|
||||
type:Number,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
leftImg: '',
|
||||
rightImg: '',
|
||||
urlList:[],
|
||||
isInsure:'',
|
||||
},
|
||||
options:[{value:0,name:'否'},{value:1,name:'是'}],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
setTimeout(()=>{
|
||||
this.form.isInsure=this.inSure
|
||||
// this.form.isInsure=1
|
||||
},1500)
|
||||
},
|
||||
methods: {
|
||||
clickUpload(event,type){
|
||||
if (!this.showFun()) {
|
||||
let url=[]
|
||||
if (type=='leftImg'){
|
||||
url=[this.leftUrl?.replace(/http:\/\//g, 'https://')]
|
||||
}else if(type=='rightImg'){
|
||||
url= [this.rightUrl?.replace(/http:\/\//g, 'https://')]
|
||||
}else{
|
||||
url=this.urlList?.map(item => item?.replace(/http:\/\//g, 'https://'))
|
||||
}
|
||||
ImagePreview({
|
||||
images: url,
|
||||
closeable: true,
|
||||
showIndex:false
|
||||
});
|
||||
console.log(url)
|
||||
event.stopPropagation(); // 阻止事件冒泡
|
||||
event.preventDefault(); // 阻止默认上传行为(如果支持)
|
||||
return false; // 阻止后续逻辑
|
||||
}
|
||||
// 默认行为(允许上传)
|
||||
},
|
||||
async afterRead(file,type){ // 支持多文件上传
|
||||
const formData = new FormData();
|
||||
formData.append("file" , file.file);
|
||||
let res = await uploadImage(formData)
|
||||
if (type=='urlList'){
|
||||
console.log("this.urlList",this.urlList?.length)
|
||||
if(this.urlList?.length==3){
|
||||
const updatedList = [...this.urlList];
|
||||
updatedList[2] = res?.data?.replace(/http:\/\//g, 'https://');
|
||||
this.form.urlList = updatedList;
|
||||
}else{
|
||||
this.form.urlList=[res?.data?.replace(/http:\/\//g, 'https://'),...this.urlList]
|
||||
}
|
||||
const uniqueUrls = this.form.urlList?.reduce((acc, url) => {
|
||||
if (!acc.includes(url)) {
|
||||
acc.push(url);
|
||||
}
|
||||
return acc;
|
||||
}, []);
|
||||
this.$emit(type, uniqueUrls)
|
||||
}else{
|
||||
this.form[type] = res.data
|
||||
this.$emit(type, this.form[type])
|
||||
}
|
||||
},
|
||||
radioChange(val){
|
||||
this.$emit('insureHandle',val)
|
||||
if(this.form.isInsure==0){
|
||||
this.form.urlList=[]
|
||||
this.$emit('urlList', this.form.urlList)
|
||||
}
|
||||
},
|
||||
showFun() {
|
||||
if( localStorage.getItem('infoVerify') == 8 || localStorage.getItem('infoVerify') == 12 ) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/styles/common.scss";
|
||||
.customUpload{
|
||||
width: calc(50% - 3px);
|
||||
::v-deep .van-uploader__input-wrapper{
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
.customUploadMul{
|
||||
width: 100%;
|
||||
::v-deep .van-uploader__input-wrapper{
|
||||
width: 100% !important;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
/* ::v-deep .van-uploader__preview{
|
||||
width: 100% !important;
|
||||
}*/
|
||||
}
|
||||
.uploaded-item,.tipWrap{
|
||||
width: calc(50% - 3px);
|
||||
}
|
||||
::v-deep .van-uploader__preview{
|
||||
width: calc(50% - 3px);
|
||||
margin: 0 0 8px 0;
|
||||
.van-uploader__preview-image{
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
::v-deep .van-uploader__preview:nth-child(odd){
|
||||
margin-right: 5px !important;
|
||||
}
|
||||
}
|
||||
.photo_wrap {
|
||||
padding: 20px 12px 22px 17px;
|
||||
background: #FFFFFF;
|
||||
margin-bottom: 10px;
|
||||
.photo_title {
|
||||
font-size: 14px;
|
||||
padding-left: 10px;
|
||||
margin-bottom: 5px;
|
||||
.star {
|
||||
color: red;
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
.custom-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.flexWrap{
|
||||
display:flex;
|
||||
::v-deep .van-radio__icon{
|
||||
//width: 24px;
|
||||
transform: scale(0.8);
|
||||
transform-origin: center; /* 保持中心点不变 */
|
||||
}
|
||||
}
|
||||
.labelWrap{
|
||||
margin-left: 10px;
|
||||
}
|
||||
.center{
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.photoWrap{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.tipWrap{
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.picNum{
|
||||
position: absolute;
|
||||
z-index: 111;
|
||||
color: #206FFF ;
|
||||
top: 3px;
|
||||
right: 3px;
|
||||
font-size: 11px;
|
||||
}
|
||||
div:nth-child(2n+1) {
|
||||
margin-right: 4px;
|
||||
}
|
||||
div {
|
||||
//width: calc(50% - 3px);
|
||||
position: relative;
|
||||
.photo_item {
|
||||
width: 100%;
|
||||
height: 95px !important;
|
||||
}
|
||||
.camera {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 35px;
|
||||
height: 34px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.photo_img {
|
||||
width: 100%;
|
||||
div {
|
||||
width: calc(50% - 3px);
|
||||
position: relative;
|
||||
.photo_item {
|
||||
width: 100%;
|
||||
height: 95px !important;
|
||||
}
|
||||
.camera {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 35px;
|
||||
height: 34px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.van-image-preview{
|
||||
z-index: 9999999999 !important;
|
||||
}
|
||||
</style>
|
||||