You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

3508 lines
107 KiB

<template>
<div class="content_max">
<!-- 菜单 -->
<el-tabs type="border-card" v-model="tabValue" @tab-change="tabChenge" class="el_tabs">
<div></div>
<el-tab-pane :name="item.name" :label="item.label" v-for="item in TabList" :key="item.name">
</el-tab-pane>
<div class="content_right">
<basic-container>
<div class="avue-crud">
<!-- 搜索模块 -->
<el-row v-if="search">
<!-- 查询模块 -->
<el-form :inline="true" :model="query" class="el-fr-d">
<div class="el_tims_box">
<div class="topText">
<el-input
v-model="query.workOrderNumber"
:rows="4"
type="textarea"
placeholder="请输入工单号"
/>
</div>
<div class="el_times">
<el-form-item label="上报日期" class="el-times">
<el-date-picker
v-model="value1"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:size="size"
/>
</el-form-item>
<el-form-item label="处理时间" class="el-times">
<el-date-picker
v-model="value1"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:size="size"
/>
</el-form-item>
<el-form-item label="送货时间" class="el-times">
<el-date-picker
v-model="value1"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:size="size"
/>
</el-form-item>
<el-form-item label="运损发现" class="el-times">
<el-date-picker
v-model="value1"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:size="size"
/>
</el-form-item>
</div>
</div>
<!-- 查询按钮 -->
<el-form-item class="el-btn">
<el-button type="primary" icon="el-icon-search" @click="searchChange"
>搜 索</el-button
>
<el-button icon="el-icon-delete" @click="searchReset()">清 空</el-button>
</el-form-item>
</el-form>
</el-row>
<!-- 控件模块 -->
<el-row>
<div class="avue-crud__header">
<!-- 头部左侧按钮模块 -->
<div class="avue-crud__left">
<!-- v-if="ButtonPermissions.add" -->
<el-button type="primary" @click="AddInfo">
<el-icon><Plus /></el-icon>新 增</el-button
>
<!-- <el-button type="primary" @click="BatchDelete">
<el-icon><Delete /></el-icon>批量删除</el-button
> -->
<!-- v-if="ButtonPermissions.batchReject" -->
<el-button type="primary" @click="BatchReturn">批量打回</el-button>
<!-- v-if="ButtonPermissions.assignment" -->
<el-button type="primary" @click="assign">工单指派</el-button>
<!-- v-if="ButtonPermissions.applyArbitration" -->
<el-button type="primary" @click="arbitrate">申请仲裁</el-button>
<!-- v-if="ButtonPermissions.batchFinish" -->
<el-button type="primary" @click="Batchcompletion">批量完结</el-button>
<!-- v-if="ButtonPermissions.appeal" -->
<el-button type="primary" @click="appeal">申诉</el-button>
<!-- v-if="details.query.workOrderStatus == 30" -->
<!-- <el-button type="primary" @click="ProcessingParty"> 处理方信息</el-button> -->
</div>
<!-- 头部右侧按钮模块 -->
<div class="avue-crud__right">
<el-button icon="el-icon-refresh" @click="searchChangeS" circle></el-button>
<el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
<el-button icon="Search" @click="searchHide" circle></el-button>
</div>
</div>
</el-row>
<!-- 申诉列表展示 -->
<el-tabs
type="border-card"
v-if="details.query.workOrderStatus == 30"
@tab-change="AppealTab"
>
<el-tab-pane label="处理完毕"></el-tab-pane>
<el-tab-pane label="申诉列表"></el-tab-pane>
</el-tabs>
<!-- 首页表格 -->
<el-row>
<!-- 列表模块 -->
<tablecmt
:columnList="publicColumnList"
:tableData="data"
:loading="loadingObj.list"
@inputTxt="inputsc"
@timeCheck="timesc"
@btnCheck="btnsc"
@selectCheck="selectsc"
@selection="selectionChange"
>
<template #default="slotProps">
<template v-if="slotProps.scope.column.label === '操作'">
<div class="ElBtnClass">
<div>
<!-- <el-button @click="addingRecord(slotProps.scope)">新增记录</el-button> -->
<el-button v-if="TabPermissions != '4'" @click="view(slotProps.scope)"
>查看</el-button
>
<!-- <el-button @click="ViewEvent(slotProps.scope)">编辑</el-button> -->
<!-- <el-button @click="reply(slotProps.scope)">回复</el-button> -->
<!-- <el-button @click="ViewDelete(slotProps.scope)">删除</el-button> -->
<!-- <el-button @click="CompletionButton(slotProps.scope)">完结</el-button> -->
<!-- <el-button v-if="ClaimStatus" @click="appeal(slotProps.scope)"
>申诉</el-button
> -->
</div>
<el-button
v-if="TabPermissions == 7"
@click="BtnModifyAmount(slotProps.scope)"
>修改金额</el-button
>
</div>
</template>
</template>
</tablecmt>
</el-row>
<!-- 分页模块 -->
<el-row class="el-fy">
<div class="avue-crud__pagination flex-c-sb" style="width: 100%">
<div></div>
<el-pagination
align="right"
background
@size-change="sizeChange"
@current-change="currentChange"
:current-page="page.currentPage"
:page-sizes="[30, 50, 80, 120]"
:page-size="page.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="page.total"
>
</el-pagination>
</div>
</el-row>
</div>
<!-- 新增弹窗 -->
<el-dialog v-model="Indexdialog" :title="FromDisabled ? '详情' : '新增'" width="60%">
<el-form :model="Indexform" label-width="100px" class="IndexFrom" ref="IndexForm">
<el-form-item label="异常类型">
<el-select
v-model="Indexform.workOrderType"
:disabled="FromDisabled"
clearable
placeholder="选择工单异常类型"
@change="abnormalChange"
>
<el-option
v-for="item in IndexException"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="发现节点">
<el-select
v-model="Indexform.discoveryNode"
:disabled="FromDisabled"
clearable
placeholder="选择发现节点"
@change="DiscoveringNodesChange"
>
<el-option
v-for="item in DiscoveringNodes"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="异常工单号">
<el-input
v-model="Indexform.workOrderNumber"
:disabled="FromDisabled"
placeholder="请输入异常工单号"
clearable
/>
</el-form-item>
<!-- 必填 -->
<el-form-item label="运单号">
<el-input
v-model="Indexform.waybillNumber"
:disabled="FromDisabled"
placeholder="请输入云单号"
clearable
/>
</el-form-item>
<el-form-item label="少货件数">
<el-input
v-model="Indexform.waybillNumber"
:disabled="FromDisabled"
placeholder="请输入少货件数"
clearable
/>
</el-form-item>
<el-form-item label="窜货件数">
<el-input
v-model="Indexform.waybillNumber"
:disabled="FromDisabled"
placeholder="请输入窜货件数"
clearable
/>
</el-form-item>
<el-form-item
label="包条码"
v-if="SelectType == 1 || SelectType == 2 || SelectType == 3 || StateType"
>
<el-input
v-model="Indexform.waybillNumber"
:disabled="FromDisabled"
placeholder="请输入包条码,多个用逗号隔开"
clearable
/>
</el-form-item>
<!-- 必填 -->
<el-form-item label="订单自编号">
<el-input
v-model="Indexform.orderCode"
:disabled="FromDisabled"
placeholder="请输入订单自编号"
clearable
/>
</el-form-item>
<el-form-item
label="车次号"
v-if="
groundlineSet || groundlineType == 1 || groundlineType == 3 || groundlineType == 4
"
>
<el-input
v-model="Indexform.trainNumber"
placeholder="请输入车次号(干线卸车环节)"
clearable
:disabled="FromDisabled"
/>
</el-form-item>
<!-- 必填 -->
<el-form-item label="一级品">
<el-input
v-model="Indexform.first"
:disabled="FromDisabled"
placeholder="请输入一级品类"
clearable
/>
</el-form-item>
<!-- 必填 -->
<el-form-item label="二级品">
<el-input
v-model="Indexform.secondary"
:disabled="FromDisabled"
placeholder="请输入二级品类"
clearable
/>
</el-form-item>
<el-form-item label="车辆路线">
<el-input
v-model="Indexform.vehicleRoute"
placeholder="请输入车辆路线车次号(通过车次号自动带出车辆路线)"
clearable
:disabled="FromDisabled"
/>
</el-form-item>
<el-form-item label="送货时间">
<el-date-picker
v-model="Indexform.deliverGoodsTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择送货时间"
/>
</el-form-item>
<el-form-item
label="发现时间"
v-if="
groundlineSet || groundlineType == 2 || groundlineType == 3 || groundlineType == 4
"
>
<el-date-picker
v-model="Indexform.discoveryTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择发现时间"
:disabled="FromDisabled"
/>
</el-form-item>
<el-form-item
label="配送时间"
v-if="groundlineSet || groundlineType == 3 || groundlineType == 4"
>
<el-date-picker
v-model="Indexform.deliveryTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择入库"
:disabled="FromDisabled"
/>
</el-form-item>
<el-form-item label="入库时间" v-if="groundlineSet || groundlineType == 2">
<el-date-picker
v-model="Indexform.warehousingTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择入库"
:disabled="FromDisabled"
/>
</el-form-item>
<!-- 必填 -->
<el-form-item label="运单商场">
<el-input
v-model="Indexform.waybillMall"
:disabled="FromDisabled"
placeholder="请输入运单商场"
clearable
/>
</el-form-item>
<el-form-item
label="配送司机"
v-if="groundlineSet || groundlineType == 3 || groundlineType == 4"
>
<el-select
v-model="Indexform.deliveryDriver"
multiple
filterable
default-first-option
:reserve-keyword="false"
placeholder="请输入配送司机"
>
<el-option
v-for="item in DeliveryDriver"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<!-- 必填 -->
<el-form-item label="异常问题描述">
<el-input
v-model="Indexform.problemDescription"
:disabled="FromDisabled"
placeholder="请输入异常问题"
clearable
/>
</el-form-item>
<el-form-item
label="责任人(库内作业环节)"
v-if="
groundlineSet || groundlineType == 2 || groundlineType == 3 || groundlineType == 4
"
>
<el-input
v-model="Indexform.personResponsible"
:disabled="FromDisabled"
placeholder="请输入责任人"
clearable
/>
</el-form-item>
<el-form-item label="备注">
<el-input
v-model="Indexform.remarks"
:disabled="FromDisabled"
placeholder="请输入备注"
clearable
/>
</el-form-item>
</el-form>
<!-- 必填 -->
<div class="el_clzr">
<el-form-item label="处理方">
<el-select
v-model="Indexform.processor"
:disabled="FromDisabled"
clearable
multiple
placeholder="请选择处理方"
>
<el-option
v-for="item in warehouseData"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<!-- 必填 -->
<el-form-item label="责任方">
<el-select
v-model="Indexform.duty"
:disabled="FromDisabled"
clearable
multiple
placeholder="请选择责任方"
>
<el-option
v-for="item in warehouseData"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</div>
<div
class="Transport_damage_photos"
v-if="SelectType == 1 || SelectType == 3 || StateType"
>
<span class="title">运损照片</span>
<el-upload
v-model:file-list="fileList"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
>
<el-icon><Plus /></el-icon>
</el-upload>
<el-dialog v-model="dialogVisible">
<img w-full :src="dialogImageUrl" alt="图片" />
</el-dialog>
</div>
<template #footer>
<span class="dialog-footer" v-if="!FromDisabled">
<el-button @click="Indexdialog = false">取消</el-button>
<el-button type="primary" @click="ConfirmForm"> 提交 </el-button>
</span>
</template>
</el-dialog>
<!-- 完结弹窗 -->
<el-dialog
:style="{ height: eightyPercentHeight + 'px', overflowY: 'scroll' }"
v-model="enddialog"
title="完结"
width="70%"
:before-close="handleClose"
>
<el-form :model="endFrom" label-width="90px" class="endClass">
<el-form-item label="运单商场">
<el-input v-model="endFrom.name" placeholder="请输入运单商场" />
</el-form-item>
<el-form-item label="运单号">
<el-input v-model="endFrom.name" placeholder="请输入运单号" />
</el-form-item>
<el-form-item label="订单自编号">
<el-input v-model="endFrom.name" placeholder="请输入订单自自编号" />
</el-form-item>
<el-form-item label="包条码">
<el-input v-model="endFrom.name" placeholder="请输入包条码" />
</el-form-item>
<el-form-item label="品类">
<el-input v-model="endFrom.name" placeholder="请输入品类" />
</el-form-item>
<el-form-item label="异常状态">
<el-input v-model="endFrom.name" placeholder="异常状态" />
</el-form-item>
<el-form-item label="运损发现节点">
<el-select
v-model="endFrom.a"
class="m-2"
clearable
placeholder="请选择运损发现节点"
>
<el-option
v-for="item in TransportLossNode"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="车次号">
<el-input v-model="endFrom.name" placeholder="请输入车次号" />
</el-form-item>
<el-form-item label="运损发现时间">
<el-date-picker
v-model="endFrom.warehousingTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择运损发现时间"
:disabled="FromDisabled"
/>
</el-form-item>
<el-form-item label="送货时间">
<el-date-picker
v-model="endFrom.warehousingTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择送货时间"
:disabled="FromDisabled"
/>
</el-form-item>
<div class="selector">
<span class="title">处理方</span>
<el-select
v-model="endFrom.value"
multiple
filterable
default-first-option
:reserve-keyword="false"
placeholder="请选择处理方"
>
<el-option
v-for="item in optionss"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div>
<div class="selector">
<span class="title">责任方</span>
<el-select
v-model="endFrom.value"
multiple
filterable
default-first-option
:reserve-keyword="false"
placeholder="请选择处理方"
>
<el-option
v-for="item in optionss"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div>
<!-- <el-form-item label="处理结果"> -->
<div class="selector">
<span class="title">处理结果</span>
<el-select
v-model="endFrom.value"
multiple
filterable
default-first-option
:reserve-keyword="false"
placeholder="请选择处理方"
@change="changeProcessingResults"
>
<el-option
v-for="item in ProcessingResults"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div>
<!-- </el-form-item> -->
</el-form>
<div class="ProcessingResults">
<div class="title">处理结果-理赔金额</div>
<div class="Listadmiration">
<div class="name" v-for="(item, index) in ProcessingList" :key="index">
<span>{{ item.name }}:</span>
<el-input-number
v-model="item.input"
:min="item.min"
:max="item.max"
@change="handleChange"
/>
</div>
</div>
<div class="lptime">
<span class="name">理赔支付时间</span>
<el-date-picker
v-model="endFrom.warehousingTime"
type="datetime"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择运理赔支付时间"
:disabled="FromDisabled"
/>
</div>
</div>
<!-- 图片 -->
<div
class="Transport_damage_photos"
v-if="SelectType == 1 || SelectType == 3 || StateType"
>
<span class="title">图片</span>
<el-upload
v-model:file-list="fileList"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
>
<el-icon><Plus /></el-icon>
</el-upload>
<el-dialog v-model="dialogVisible">
<img w-full :src="dialogImageUrl" alt="Preview Image" />
</el-dialog>
</div>
<el-form-item label="备注">
<el-input v-model="endFrom.name" placeholder="请输入备注" />
</el-form-item>
<!-- 表格 -->
<div class="recordCl">
<el-row>
<!-- 列表模块 -->
<tablecmt
:columnList="recordList"
:tableData="recorddata"
:loading="loadingObj.list"
@inputTxt="recordinputsc"
@timeCheck="recordtimesc"
@btnCheck="recordbtnsc"
@selectCheck="recordselectsc"
@selection="recordselectionChange"
>
<!-- <template #default="slotProps">
<template v-if="slotProps.scope.column.label === '操作'">
<div class="ElBtnClass">
<el-button @click="view(slotProps.scope)">查看</el-button>
<el-button @click="ViewEvent(slotProps.scope)">编辑</el-button>
<el-button @click="ViewEvent(slotProps.scope)">回复</el-button>
<el-button @click="Delete(slotProps.scope)">删除</el-button>
<el-button @click="CompletionButton(slotProps.scope)">完结</el-button>
</div>
</template>
</template> -->
</tablecmt>
</el-row>
</div>
<!-- <div class="el_Completion">
<span class="title">完结信息</span>
<div class="el-ckbtn">
<el-button type="primary" @click="AddCompensation">添加赔款方</el-button>
<el-button type="primary" @click="AddPayee">添加收款方</el-button>
</div>
<div class="payanindemnity" v-for="(item, index) in CompensationParty" :key="index">
<span class="title">{{ item.state == 0 ? '赔款方' : '收款方' }}{{ item.cld }}</span>
<div class="sk_input"><el-input v-model="item.name" placeholder="赔款方" /></div>
<div class="sk_input"><el-input v-model="item.reason" placeholder="原因" /></div>
<div class="sk_input"><el-input v-model="item.nunm" placeholder="金额" /></div>
<el-button type="danger" round @click="payremove(item.state, index)">移除</el-button>
</div>
</div>
<div>
<span>仲裁原因</span>
<el-input
style="margin-top: 12px"
v-model="endFrom.textarea"
:rows="5"
type="textarea"
placeholder="请输入仲裁原因"
/>
</div> -->
<template #footer>
<span class="dialog-footer">
<el-button @click="enddialog = false">取消</el-button>
<el-button type="primary" @click="dialogVisible = false"> 确定 </el-button>
</span>
</template>
</el-dialog>
<!-- 回复弹窗 -->
<el-dialog
class="el_fk"
v-model="dialogcustomerService"
title="客服信息"
width="60%"
draggable
>
<template #header="{ titleId, titleClass }">
<div class="my-header">
<h4 :id="titleId" :class="titleClass">客服回复</h4>
<el-button type="danger" @click="KFRefresh"> 刷新聊天 </el-button>
</div>
</template>
<div class="content" ref="scrollContainer">
<!-- 用户 -->
<div
:class="{ YH: item.businessId != currentUser, KF: item.businessId == currentUser }"
v-for="item in ChatHistory"
:key="item.input"
>
<div class="box">
<div class="TX"></div>
<div class="name">
<span>{{ item.businessName }}</span>
<div class="input">
{{ item.content }}
</div>
<div class="time">{{ item.createTime }}</div>
</div>
</div>
</div>
</div>
<div class="inputTextarea" v-loading="iconState" element-loading-text="正在发送中...">
<div class="fell">
<el-upload
ref="uploadRef"
class="upload-demo"
:action="doubledCount"
:headers="headers"
:on-success="fellSuccess"
>
<template #trigger>
<el-button type="primary">上传附件</el-button>
<div class="felltis" v-if="KFfeel">上传成功</div>
</template>
</el-upload>
<el-input
@keydown.enter="inputEnter"
v-model="KFinput"
:rows="4"
type="textarea"
placeholder="请输入内容"
/>
</div>
<el-button class="btn_fs" type="primary" @click="messagesend">发送</el-button>
</div>
</el-dialog>
<!-- 批量打回弹窗 -->
<el-dialog v-model="dialogReturn" title="批量打回" width="40%" draggable class="plAllret">
<el-form
v-loading="repulse"
element-loading-text="正在打回中..."
label-position="top"
label-width="100px"
:model="BatchFrom"
>
<el-form-item label="打回原因">
<el-input v-model="BatchFrom.txt" type="textarea" :rows="4" />
</el-form-item>
<el-form-item label="流转营业部">
<el-select
v-model="BatchFrom.businessDepartment"
multiple
filterable
default-first-option
:reserve-keyword="false"
placeholder="请选择活动区域"
>
<el-option
v-for="item in warehouseData"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogReturn = false">取消</el-button>
<el-button type="primary" @click="ConfirmReturn" :disabled="repulse">
确定
</el-button>
</span>
</template>
</el-dialog>
<!-- 工单指派弹窗 -->
<el-dialog v-model="dialogassign" title="工单指派" width="40%" draggable class="plAllret">
<el-form
v-loading="AssignLoad"
element-loading-text="正在打回中..."
label-position="top"
label-width="100px"
:model="assignFrom"
>
<el-form-item label="客服列表">
<el-select
v-model="assignFrom.businessDepartment"
filterable
default-first-option
:reserve-keyword="false"
placeholder="请选择指派客服"
>
<el-option
v-for="item in customerService"
:key="item.value"
:label="item.realName"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogassign = false">取消</el-button>
<el-button type="primary" @click="Assignbutton" :disabled="AssignLoad">
确定
</el-button>
</span>
</template>
</el-dialog>
<!-- 批量完结弹窗 -->
<el-dialog
v-model="dialogBatchcompletion"
title="批量完结"
width="60%"
:before-close="handleClose"
:style="{ height: BatchcompletionHeight + 'px', overflowY: 'scroll' }"
class="el_Batchcompletion"
>
<div v-loading="PLloading" element-loading-text="正在批量处理中...">
<div class="Improveinformation">
<el-tabs type="border-card" class="demo-tabs">
<el-tab-pane>
<template #label>
<span class="custom-tabs-label">
<el-icon><calendar /></el-icon>
<span>完结信息</span>
</span>
</template>
<div class="el-ckbtn">
<el-button type="primary" @click="AddCompensation">添加赔款方</el-button>
<el-button type="primary" @click="AddPayee">添加收款方</el-button>
</div>
<div
class="payanindemnity"
v-for="(item, index) in CompensationParty"
:key="index"
>
<span class="title" :style="{ color: item.state != 0 ? '#000' : '#F56C6C' }"
>{{ item.state == 0 ? '赔款方' : '收款方' }}{{ item.cld }}</span
>
<div class="sk_input">
<el-input
v-model="item.name"
:placeholder="item.state == 0 ? '请填写赔款方' : '请填写收款方'"
/>
</div>
<div class="sk_input">
<el-input v-model="item.reason" placeholder="请填写原因" />
</div>
<div class="sk_input">
<el-input
@input="amountMoney"
:min="0"
v-model="item.num"
placeholder="金额"
/>
</div>
<el-button type="danger" round @click="payremove(item.state, index)"
>移除</el-button
>
</div>
<div class="paySum">
<div class="sum">
<span>
<el-icon><Coin /></el-icon>赔款金额总和:<b>{{
TotalamountCompensation
}}</b></span
>
<span>
<el-icon><Coin /></el-icon>收款金额总和:<b>{{
TotalamountReceived
}}</b></span
>
</div>
<div></div>
</div>
</el-tab-pane>
</el-tabs>
</div>
<!-- 仲裁原因 -->
<div class="arbitrate">
<el-tabs type="border-card" class="demo-tabs">
<el-tab-pane>
<template #label>
<span class="custom-tabs-label">
<el-icon><calendar /></el-icon>
<span>仲裁原因</span>
</span>
</template>
<el-input
v-model="Reasonarbitration"
type="textarea"
:autosize="{ minRows: 5, maxRows: 4 }"
placeholder="请输入仲裁原因"
/>
</el-tab-pane>
</el-tabs>
<div class="el_btn">
<el-button type="primary" @click="CompletedSubmission">确认提交</el-button>
</div>
</div>
</div>
</el-dialog>
<!-- 申诉弹窗 -->
<el-dialog v-model="dialogappeal" title="工单申诉" width="30%">
<div class="el_appeal" v-loading="loadingappeal" element-loading-text="Loading...">
<el-select
v-model="Appealselection"
clearable
filterable
multiple
placeholder="请选择责任方"
>
<el-option
v-for="item in warehouseData"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-input
v-model="Reasonforappeal"
:rows="4"
type="textarea"
placeholder="请输入申诉原因"
/>
<span class="el_sdialog-footer">
<el-button @click="dialogappeal = false">取消</el-button>
<el-button type="primary" @click="Appealbutton"> 确定 </el-button>
</span>
</div>
</el-dialog>
<el-dialog
v-model="dialogModifyAmount"
:title="fromamount.title + '超时金额修改'"
width="30%"
>
<el-form label-position="left" label-width="70px" :model="fromamount">
<div class="el_amount">
<el-form-item label="原金额">
<el-input v-model="fromamount.ytimeout" disabled />
</el-form-item>
<el-form-item label="修改金额">
<el-input v-model="fromamount.Amount" placeholder="请输入要修改的金额" />
</el-form-item>
</div>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogModifyAmount = false">取消</el-button>
<el-button type="primary" @click="ModifyAmountFn">确定修改</el-button>
</span>
</template>
</el-dialog>
</basic-container>
</div>
</el-tabs>
</div>
<!-- 列表配置显示 -->
<edittablehead
@setcolum="setnewcolum"
@closce="showdrawer"
:drawerShow="drawerShow"
:columnList="details.columnList"
></edittablehead>
</template>
<script setup>
import { ElMessage } from 'element-plus';
import { ElMessageBox } from 'element-plus';
import { Plus } from '@element-plus/icons-vue';
import {
$_getList,
$_submit,
$_getDetail,
$_remove,
$_getProcessor,
$_AddReply,
$_getExchangeList,
$_getInfo,
$_batchReturn,
$_assignCustomerService,
$_getCustomerServicePersonnel,
$_arbitrate,
$_addCompletionEnd,
$_appealSubmit,
$_listSettlement,
$_listAppeal,
$_listOwn,
$_moneyUpdate,
} from '@/api/aftersales/aftersalesWorkOrder';
import { getToken } from '@/utils/auth';
import { getDictionaryBiz } from '@/api/system/dict'; //字典
import functions from '@/utils/functions.js';
import { getDetailWarehouse, getDeptWarehouse } from '@/api/basicdata/basicdataWarehouse'; //处理方
import { ref, reactive, toRefs, computed, onMounted, nextTick, watch } from 'vue';
import {
columnList,
recordList,
Claimsfield,
AppealList,
timeoutList,
} from '@/option/aftersales/vueTvemp.js';
import { processRowProperty, isNumer, computeNumber } from '@/utils/util';
import { useRouter } from 'vue-router';
import dayjs from 'dayjs';
const $router = useRouter();
const tabValue = ref(0); //侧边栏激活状态
const publicColumnList = ref([]); //公共列表参数
const scrollContainer = ref(null); //客服实例
const workOrderStatus = ref(null); //侧边栏参数
const BatchFrom = ref({}); //批量打回
const currentPage = ref(1); // 默认页码
const TransportlossList = ref([
//运损发现节点
]);
const pageSize = ref(30); // 默认每一页几条
const total = ref(0); //页码总页数
const KFinput = ref(''); //客服发送消息
const Appealselection = ref([]); //申诉选择的责任人
const KFfeel = ref(''); //文件附件地址
const pageList = ref([5, 10, 50, 100, 200]); // 选择每页显示多少条
const background = ref(true); // 是否开启背景颜色
const disabled = ref(false); // 是否禁止使用页码功能
const fromamount = ref({}); //修改金额表单
const TimeoutStatus = ref(false); //超时列表状态
const loading = ref(false); //首页表格加载效果
const dialogReturn = ref(false); //批量打回弹窗状态
const dialogappeal = ref(false); //申诉弹窗状态
const Indexdialog = ref(false); //新增弹窗
const Reasonforappeal = ref(''); //申诉原因
const Indexform = ref({}); //首页新增表单
const dialogcustomerService = ref(false); //客服信息
const IndexException = ref([]); //异常类型下拉选择
const DiscoveringNodes = ref([]); //发现节点下拉选择
const warehouseData = ref([]); //处理方
const customerService = ref([]);
const IndexForm = ref(null); //首页表实例
const FromDisabled = ref(false); //详情禁止输入框
const loadingappeal = ref(false); //工单申诉状态
const SelectType = ref(null); //类型
const ListRow = ref(); //当前行数据
const appealList = ref(); //申诉选择的参数
const StateType = ref(true); //类型
const dialogassign = ref(false); //工单指派
const AssignLoad = ref(false); //工单指派加载
const assignFrom = ref({}); //工单指派表单
const dialogImageUrl = ref('');
const dialogVisible = ref(false);
const groundlineType = ref(null); //干线状态
const groundlineSet = ref(true); //干线条件都满足
const enddialog = ref(false); //完结弹窗
const endFrom = ref({}); //完结弹窗表单
const screenHeight = ref(0); // 屏幕高度
const eightyPercentHeight = ref(0); // 80% 高度
const list = ref([]);
const options = ref([]);
const repulse = ref(false);
const dialogBatchcompletion = ref(false); //批量完结弹窗
const PLloading = ref(false);
const Mydata = ref(null); //仓库关键信息
const ProcessingList = ref([]); //赔付方式列表
const iconState = ref(false); //消息状态
const ProcessingPartyState = ref(false); //处理方数据(为真才显示)
const currentUser = ref(null); //存放当前的对话框必要Id
const ArbitrationStatus = ref(null); //申请仲裁状态
const TotalamountCompensation = ref(0); //赔款金额合计
const TotalamountReceived = ref(0); //收款金额合计
const Reasonarbitration = ref(null); //仲裁原因
const BatchcompletionHeight = ref(0); //批量完结弹窗
const userInfo = ref(); //当前登录人信息
const ClaimStatus = ref(false); //理赔状态
const AppealStatus = ref(false); //申诉列表状态
const dialogModifyAmount = ref(false); //超时金额修改弹出状态
const UserPermissions = ref('仓库客服'); //客服权限
const TabPermissions = ref(0); //菜单权限
const AppealStatusT = ref(false); //是否为申诉列表
const TabList = ref([
{ name: 0, label: '全部' },
{ name: 1, label: '处理中' },
{ name: 2, label: '处理完毕' },
{ name: 3, label: '待处理' },
{ name: 4, label: '理赔金额未出' },
{ name: 5, label: '仲裁中' },
{ name: 6, label: '完结' },
{ name: 7, label: '超时未处理' },
]); //标签栏
const DeliveryDriver = ref([
//配送司机
{
value: '0',
label: '兰溪',
},
{
value: '1',
label: '李华',
},
{
value: '2',
label: '唐飞',
},
]);
const CompensationParty = ref([
{ name: '', state: 0, num: null, reason: '', cld: 1 }, //赔款方
{ name: '', state: 1, num: null, reason: '', cld: 1 }, //收款方
]); //收/赔
const details = reactive({
/** 是否开启搜索 */
search: false,
/** 表格搜索条件 */
query: {
workOrderStatus: null,
},
/** 时间快捷选择设置 */
shortcuts: [
{
text: '最近一周',
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
return [start, end];
},
},
{
text: '最近一个月',
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
return [start, end];
},
},
{
text: '最近三个月',
value: () => {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
return [start, end];
},
},
],
/** 时间选择器数据 */
stockupDate: [],
/** 列表 */
columnList,
/** 列表数据 */
data: [{}],
// 处理记录
recordList,
// 处理记录数据
recorddata: [{}],
/** 页面loading */
loadingObj: {
/** 列表加载loading */
list: false,
packageListLoading: false,
},
/** 列表复选框选中的数据 */
selectionList: [],
/** 是否显示设置表格 */
drawerShow: false,
/** 分页参数 */
page: {
currentPage: 1,
pageSize: 50,
total: 0,
},
/** 弹出层显示 */
popUpShow: {
/** 包件明细 */
packageOrderListlVisited: false,
/** 二维码 */
QRCodeVisible: false,
/** 修改客户信息 */
editClientInfoVisible: false,
},
/** 列表Dom节点 */
listNode: '',
form: {},
/** 全屏 */
fullscreenObj: {
/** 包明细 */
packageOrderListlVisited: false,
},
});
const {
search,
query,
shortcuts,
stockupDate,
data,
loadingObj,
selectionList,
drawerShow,
page,
trickleLoadingPage,
zeroAdditionalRecordingInfo,
popUpShow,
recorddata,
} = toRefs(details);
// let tab = [
// { label: '全部', value: 0 },
// { label: '处理中', value: 1 },
// { label: '待处理完毕', value: 2 },
// { label: '待处理', value: 3 },
// { label: '理赔金额未出', value: 4 },
// { label: '仲裁中', value: 5 },
// { label: '完结', value: 6 },
// { label: '超时未处理', value: 7 },
// ];
// // 按钮配置
// // 1.新增 2.批量打回 3.工单指派 4.申请仲裁 5.批量完结 6.申诉
// // 角色配置
// // 1.仓库客服
// // 2.职能客服
// // 3.客服经理
// // 在value == 0状态下的权限配置
// 1.新增 只能仓库客服查看
// 2.批量打回 只能职能客服查看
// 3.工单指派 只能客服经理查看
// 4.申请仲裁 只能仓库客服查看
// 5.批量完结 只能职能客服查看
// 6.申诉 隐藏
// // 在value==1状态下的权限配置
// 1.新增 隐藏
// 2.批量打回 只能仓库客服查看
// 3.工单指派 隐藏
// 4.申请仲裁 只能仓库客服查看
// 5.批量完结 只能职能客服和客服经理查看
// 6.申诉 隐藏
// // 在value==2状态下的权限配置
// 隐藏所有按钮
// // 在value==3状态下的权限配置
// 1.新增 隐藏
// 2.批量打回 只能仓库客服查看
// 3.工单指派 只能客服经理查看
// 4.申请仲裁 隐藏
// 5.批量完结 隐藏
// 6.申诉 隐藏
// // 在value==4状态下的权限配置
// 1.新增 隐藏
// 2.批量打回 隐藏
// 3.工单指派 隐藏
// 4.申请仲裁 隐藏
// 5.批量完结 隐藏
// 6.申诉 仓库客服查看
// // 在value==5状态下的权限配置
// 1.新增 隐藏
// 2.批量打回 隐藏
// 3.工单指派 隐藏
// 4.申请仲裁 隐藏
// 5.批量完结 隐藏
// 6.申诉 隐藏
// // 在value==6状态下的权限配置
// 1.新增 隐藏
// 2.批量打回 隐藏
// 3.工单指派 隐藏
// 4.申请仲裁 隐藏
// 5.批量完结 隐藏
// 6.申诉 隐藏
// // 在value== 7 状态下的权限配置
// 1.新增 隐藏
// 2.批量打回 隐藏
// 3.工单指派 隐藏
// 4. 申请仲裁 隐藏
// 5.批量完结 隐藏
// 6.申诉 隐藏
// 角色通过 UserPermissions 变量控制
// 菜单通过 TabPermissions变量 来控制
// 例如:
// const UserPermissions = ref('仓库客服'); //客服权限
// const TabPermissions = ref(0); //菜单权限
const ButtonPermissions = computed(() => {
// 根据 TabPermissions 的状态,决定每个按钮的显示隐藏逻辑
switch (TabPermissions.value) {
case 0: //全部
return {
add: UserPermissions.value == '仓库客服', //新增按钮
batchReject: UserPermissions.value == '职能客服', //批量打回
assignment: UserPermissions.value == '客服经理', //工单指派
applyArbitration: UserPermissions.value == '仓库客服', //申请仲裁
batchFinish: UserPermissions.value == '职能客服', //批量完结
appeal: false, //申诉
};
case 1: //处理中
return {
add: false, //新增按钮
batchReject: UserPermissions.value != '仓库客服', //批量打回
assignment: false, //工单指派
applyArbitration: UserPermissions.value == '仓库客服', //申请仲裁
batchFinish: UserPermissions.value != '仓库客服', //批量完结
appeal: false, //申诉
};
case 2: //处理完毕
return {
add: false, //新增按钮
batchReject: false, //批量打回
assignment: false, //工单指派
applyArbitration: false, //申请仲裁
batchFinish: false, //批量完结
appeal: UserPermissions.value == '仓库客服' && AppealStatusT.value, //申诉
};
case 3: //待处理
return {
add: false, //新增按钮
batchReject: UserPermissions.value == '仓库客服', //批量打回
assignment: UserPermissions.value == '客服经理', //工单指派
applyArbitration: false, //申请仲裁
batchFinish: false, //批量完结
appeal: false, //申诉
};
case 4: //理赔金额未出
return {
add: false, //新增按钮
batchReject: false, //批量打回
assignment: false, //工单指派
applyArbitration: false, //申请仲裁
batchFinish: false, //批量完结
appeal: UserPermissions.value == '仓库客服', //申诉
};
case 5: //仲裁中
return {
add: false, //新增按钮
batchReject: false, //批量打回
assignment: false, //工单指派
applyArbitration: false, //申请仲裁
batchFinish: false, //批量完结
appeal: false, //申诉
};
case 6: //完结
return {
add: false, //新增按钮
batchReject: false, //批量打回
assignment: false, //工单指派
applyArbitration: false, //申请仲裁
batchFinish: false, //批量完结
appeal: false, //申诉
};
case 7: //超时未处理
return {
add: false, //新增按钮
batchReject: false, //批量打回
assignment: false, //工单指派
applyArbitration: false, //申请仲裁
batchFinish: false, //批量完结
appeal: false, //申诉
};
// 其他任何情况下的默认情况
default:
return {
add: false,
batchReject: false,
assignment: false,
applyArbitration: false,
batchFinish: false,
appeal: false,
};
}
});
const ProcessingResults = [
{
value: '0',
label: '维修',
},
{
value: '1',
label: '补漆',
},
{
value: '2',
label: '下补单',
},
{
value: '3',
label: '赔付运费',
},
{
value: '4',
label: '用库存',
},
{
value: '5',
label: '赔商家',
},
{
value: '6',
label: '赔客户',
},
];
const fileList = ref([
{
name: 'food.jpeg',
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
},
{
name: 'plant-1.png',
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
},
]);
const TransportLossNode = ref([
{ label: '在库操作环节', value: 1 },
{ label: '干线卸车环节', value: 2 },
{ label: '入库环节', value: 3 },
{ label: '配送环节', value: 4 },
{ label: '中转卸车环节', value: 5 },
{ label: '安装环节', value: 6 },
]);
// 页面初始化数据
const IndexTable = val => {
ClaimStatus.value = false;
AppealStatus.value = false; //关闭申诉状态
TimeoutStatus.value = false; //关闭超时
// ProcessingPartyState.value = false; //关闭处理方
details.loadingObj.list = true; //开启动画加载
let data = {
...val,
};
columnList[2].checkarr = []; //重置下拉搜索框
columnList[3].checkarr = [];
data.current = page.value.currentPage; //页码
data.size = page.value.pageSize; //条数
updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
updateDictionary(columnList[17].checkarr, 'work_order_status'); //发现环节
// 获取角色权限
getDictionaryBiz('after_sales_visits').then(res => {
console.log(res, '角色字典');
const matchingItem = res.data.data.find(
item => item.dictValue == JSON.parse(localStorage.getItem('TWMS-userInfo')).content.role_name
);
if (matchingItem) {
UserPermissions.value = matchingItem.dictValue;
} else {
UserPermissions.value = '仓库客服';
}
console.log(UserPermissions.value, '当前角色权限');
});
$_getList(data).then(res => {
details.loadingObj.list = false; //关闭动画加载
page.value.total = res.data.data.total; //总页数
if (res.data.data.records.length) {
res.data.data.records.forEach(item => {
console.log(item, 'item');
// 对为null的数据进行处理
// for (const property in item) {
// if (item[property] == null) {
// item[property] = '/';
// }
// }
// 对状态进行处理
if (item.workOrderType == 1) {
item.workOrderTypeNameS = columnList[2].checkarr[0].label; //货损
} else if (item.workOrderType == 2) {
item.workOrderTypeNameS = columnList[2].checkarr[1].label; //少货
} else if (item.workOrderType == 3) {
item.workOrderTypeNameS = columnList[2].checkarr[2].label; //窜货
} else if (item.workOrderType == 4) {
item.workOrderTypeNameS = columnList[2].checkarr[3].label; //加急
} else if (item.workOrderType == 5) {
item.workOrderTypeNameS = columnList[2].checkarr[4].label; //其他
}
// 提货环节下拉赋值
if (item.discoveryNode == 1) {
item.discoveryNodeNameS = columnList[3].checkarr[0].label; //提货环节
} else if (item.discoveryNode == 2) {
item.discoveryNodeNameS = columnList[3].checkarr[1].label; //发货环节
} else if (item.discoveryNode == 3) {
item.discoveryNodeNameS = columnList[3].checkarr[2].label; //干线卸车环节
} else if (item.discoveryNode == 4) {
item.discoveryNodeNameS = columnList[3].checkarr[3].label; //库内作业环节
} else if (item.discoveryNode == 5) {
item.discoveryNodeNameS = columnList[3].checkarr[4].label; //配送装车环节
} else if (item.discoveryNode == 6) {
item.discoveryNodeNameS = columnList[3].checkarr[5].label; //其他
} else if (item.discoveryNode == 7) {
item.discoveryNodeNameS = columnList[3].checkarr[6].label; //配送签收环节
} else if (item.discoveryNode == 8) {
item.discoveryNodeNameS = columnList[3].checkarr[7].label; //安装环节
}
if (item.workOrderStatus == 10) {
item.workOrderStatusNameS = columnList[17].checkarr[0].label; //待处理
} else if (item.workOrderStatus == 20) {
item.workOrderStatusNameS = columnList[17].checkarr[1].label; //处理中
} else if (item.workOrderStatus == 30) {
item.workOrderStatusNameS = columnList[17].checkarr[2].label; //已处理
} else if (item.workOrderStatus == 40) {
item.workOrderStatusNameS = columnList[17].checkarr[4].label; //待审核
} else if (item.workOrderStatus == 50) {
item.workOrderStatusNameS = columnList[17].checkarr[5].label; //已审核
} else if (item.workOrderStatus == 60) {
item.workOrderStatusNameS = columnList[17].checkarr[3].label; //超时未处理
} else if (item.workOrderStatus == 70) {
item.workOrderStatusNameS = columnList[17].checkarr[6].label; //仲裁中
} else if (item.workOrderStatus == 80) {
item.workOrderStatusNameS = columnList[17].checkarr[7].label; //完结
} else if (item.workOrderStatus == 90) {
item.workOrderStatusNameS = columnList[17].checkarr[8].label; //理赔金未出
}
});
details.data = res.data.data.records;
} else {
details.data = res.data.data.records; //这里是空的
}
loading.value = false; //关闭加载效果
});
};
// 表格切换
const Tableheaderswitching = (val = columnList) => {
publicColumnList.value = val; //默认加载表格
details.columnList = val;
};
// 页面初始化
const OnLoad = () => {
// 表格切换
Tableheaderswitching();
userInfo.value = JSON.parse(localStorage.getItem('TWMS-userInfo')); //获取本地登录人参数
Mydata.value = JSON.parse(localStorage.getItem('my_data')); //获取本地仓库信息
currentUser.value = Mydata.value.id;
// 在组件挂载后获取屏幕高度
screenHeight.value = window.innerHeight;
// 计算80%的高度
eightyPercentHeight.value = screenHeight.value * 0.8;
BatchcompletionHeight.value = screenHeight.value * 0.6;
loading.value = true; //开启加载效果
let data = {};
console.log(page, 'page');
data.current = page.value.currentPage; //页码
data.size = page.value.pageSize; //条数
console.log(data, '要提交的数据');
updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
IndexTable(details.query);
getDeptWarehouse({}).then(res => {
res.data.data.forEach(item => {
warehouseData.value.push({
value: item.id,
label: item.name,
});
});
});
};
OnLoad();
// 字典公共函数
function updateDictionary(targetArray, dictionaryType) {
getDictionaryBiz(dictionaryType).then(res => {
console.log(res, '字典');
res.data.data.forEach(item => {
targetArray.push({
value: item.dictKey,
label: item.dictValue,
});
});
});
}
// 字典请求函数
const AddInfo = () => {
$router.push('/aftersales/aftersalesWorkOrderAdd');
// Indexform.value = {}; //清空表单
// IndexException.value = [];
// DiscoveringNodes.value = [];
// // Indexdialog.value = true; //开启新增弹窗
// FromDisabled.value = false; //禁用输入框
// updateDictionary(IndexException.value, 'pc_work_order'); //异常类型
// updateDictionary(DiscoveringNodes.value, 'pc_discovery_node'); //发现环节
// getDeptWarehouse({}).then(res => {
// console.log(res, '处理方');
// res.data.data.forEach(item => {
// warehouseData.value.push({
// value: item.id,
// label: item.name,
// });
// });
// });
};
// 首页新增表单确定
const ConfirmForm = () => {
console.log(warehouseData.value, '准备好的数据');
console.log(Indexform.value.duty, '要筛选的数据');
let filteredB = warehouseData.value.filter(item => Indexform.value.duty.includes(item.id));
console.log(filteredB);
// 匹配司机名字
Indexform.value.deliveryDriver = DeliveryDriver.value.find(
item => item.value == Indexform.value.deliveryDriver
).label;
console.log(Indexform.value.deliveryDriver); // 输出李华
FromDisabled.value = false; //启用输入框
let processorEntityList = [];
//处理方
Indexform.value.processor.forEach(item => {
let found = warehouseData.value.find(element => element.value == item.toString());
processorEntityList.push({
businessName: found ? found.label : '',
businessId: item,
conditions: 1,
typesOf: 2,
});
});
//责任方
Indexform.value.duty.forEach(item => {
let found = warehouseData.value.find(element => element.value == item.toString());
processorEntityList.push({
businessName: found ? found.label : '',
businessId: item,
conditions: 1,
typesOf: 1,
});
});
// processorEntityList.push(ResponsibleParty);
console.log(processorEntityList, 'processorEntityList');
let DataSubmit = { ...Indexform.value }; //定义初始化
DataSubmit.processorEntityList = processorEntityList;
delete DataSubmit.duty, //移除多余字段
delete DataSubmit.processor; //移除多余字段
console.log(DataSubmit, '处理好的表单信息');
console.log(warehouseData.value, 'warehouseData.value');
Indexdialog.value = false; //关闭表单弹窗
$_submit(DataSubmit).then(res => {
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
Indexform.value = {}; //重置表单
IndexTable(details.query);
}
});
};
// 顶部搜索
const searchHide = () => {
console.log(details);
details.search = !details.search;
};
// 首页查看详情按钮
const view = val => {
console.log(val.row.id);
$router.push({
path: '/aftersales/aftersalesWorkOrderInfo',
query: {
id: val.row.id,
name: val.row.workOrderNumber + '-信息查看',
warehouseId: val.row.warehouseId,
workOrderNumber: val.row.workOrderNumber, //添加异常记录包条码
businessId: val.row.businessId,
ProcessType: TabPermissions.value == 2 ? '2' : TabPermissions.value == 3 ? '1' : '', //类型 1 待处理 2 已处理
},
});
return;
console.log(val, '当前行数据');
FromDisabled.value = true; //禁用输入框
updateDictionary(IndexException.value, 'pc_work_order'); //异常类型
updateDictionary(DiscoveringNodes.value, 'pc_discovery_node'); //发现环节
getDeptWarehouse({}).then(res => {
res.data.data.forEach(item => {
warehouseData.value.push({
value: item.id,
label: item.name,
});
});
});
$_getDetail({
id: val.row.id,
}).then(res => {
console.log(res, '查看详情返回值');
if (res.data.data) {
Indexform.value = res.data.data;
Indexdialog.value = true; //展开弹窗
}
});
};
// 首页删除
const ViewDelete = val => {
ElMessageBox.confirm(`是否删除该条数据?`)
.then(() => {
$_remove({
ids: val.row.id,
}).then(res => {
console.log(res, '删除成功后的返回值');
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
OnLoad(); //添加成功初始化程序
}
});
})
.catch(() => {
// catch error
});
};
// 首页批量删除
const BatchDelete = () => {
console.log(details.selectionList, '选中的参数');
let ids = [];
details.selectionList.forEach(item => {
ids.push(item.id);
});
ids = ids.join(',');
ElMessageBox.confirm(`是否批量删除选中数据?`)
.then(() => {
$_remove({
ids,
}).then(res => {
console.log(res, '删除成功后的返回值');
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
OnLoad(); //添加成功初始化程序
}
});
})
.catch(() => {
// catch error
});
};
// 完结按钮
const CompletionButton = val => {
$router.push({
path: '/aftersales/aftersalesWorkOrderend',
query: {
id: val.row.id,
name: val.row.id + '-完结填写',
RouterState: 'end',
},
});
};
// 新增记录
const addingRecord = val => {
console.log(val);
$router.push({
path: '/aftersales/aftersalesWorkOrderend',
query: {
id: val.row.id,
name: val.row.workOrderNumber + '-添加异常记录',
RouterState: 'record',
businessId: val.row.businessId,
},
});
};
// 工单申诉按钮
const appeal = val => {
console.log(details.selectionList, 'details.selectionList');
if (!details.selectionList.length) {
ElMessage({
message: '请选择要申诉的数据',
type: 'warning',
});
return;
}
if (details.selectionList.length > 1) {
ElMessage({
message: '只能单条申诉',
type: 'warning',
});
return;
}
dialogappeal.value = true; //展开申诉弹窗
};
// 工单申诉确认按钮
const Appealbutton = () => {
console.log(details.selectionList, '当前申诉的东西');
loadingappeal.value = true; //开启加载效果
console.log(Appealselection.value, '当前选择的责任人');
console.log(warehouseData.value, '要循环处理的参数');
let data = {
peopleEntityList: [], //参数一
};
data.workOrderId = details.selectionList[0].lawoId;
data.reason = Reasonforappeal.value;
(data.appealPeopleName = warehouseData.value
.filter(item => Appealselection.value.includes(item.value))
.map(item => item.label)
.join(',')), //实际责任人名称
details.selectionList.forEach(item => {
console.log(item.id);
console.log(item, '已经选择的列表');
data['peopleEntityList'].push({
workOrderId: item.id, //异常工单ID
warehouseId: item.warehouseId == '/' ? '' : item.warehouseId,
reason: Reasonforappeal.value, //申诉理由
claimant: userInfo.value.content.user_name, //申诉人
claimantUserId: userInfo.value.content.user_id, //申诉人ID
actualPersonName: warehouseData.value
.filter(item => Appealselection.value.includes(item.value))
.map(item => item.label)
.join(','), //实际责任人名称
});
});
console.log(data, '处理好的值');
$_appealSubmit(data).then(res => {
dialogappeal.value = false; //关闭申诉弹窗
loadingappeal.value = false; //关闭加载效果
console.log(res, '申诉成功返回值');
ProcessingPartyState.value = false; //关闭处理方
data.workOrderStatus = 30;
details.query.workOrderStatus = 30;
ArbitrationStatus.value = false; //不可以申请仲裁
tabValue.value = 2;
empty(); //清空搜索数据
IndexTable({ workOrderStatus: 30 });
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
}
});
};
// 异常类型事件
const abnormalChange = val => {
console.log(val);
StateType.value = false;
if (val == 1 || val == 2 || val == 3) {
SelectType.value = val;
} else {
StateType.value = true;
}
};
// 添加赔款方
// const AddCompensation = () => {
// console.log('添加赔款方');
// let som = 1;
// CompensationParty.value.forEach(item => {
// if (item.state == 0) {
// som++;
// }
// });
// CompensationParty.value.push({ name: '', state: 0, num: 0, reason: '', cld: som });
// };
// // 添加收款方
// const AddPayee = () => {
// let som = 1;
// CompensationParty.value.forEach(item => {
// if (item.state == 1) {
// som++;
// }
// });
// CompensationParty.value.push({ name: '', state: 1, num: 0, reason: '', cld: som });
// };
// // 移除按钮
// const payremove = (state, val) => {
// // 判断赔付方,至少保留一条数据
// let som = 0;
// if (state == 0) {
// CompensationParty.value.forEach(item => {
// if (item.state == 0) {
// som++;
// }
// });
// if (som == 1) {
// ElMessage({
// message: '赔款必填最少一条',
// type: 'warning',
// });
// return;
// }
// }
// CompensationParty.value.splice(val, 1);
// };
// 发现节点事件
const DiscoveringNodesChange = val => {
groundlineSet.value = false; //干线条件都满足
if (val == 1 || val == 2 || val == 3 || val == 4 || val == 5) {
groundlineType.value = val; //干线状态
} else {
groundlineSet.value = true; //展示所有搜索框
}
};
// 照片
const handleRemove = (uploadFile, uploadFiles) => {
console.log(uploadFile, uploadFiles);
};
const handlePictureCardPreview = uploadFile => {
dialogImageUrl.value = uploadFile.url;
dialogVisible.value = true;
};
/** 表格表头输入框搜索 */
const inputsc = (index, row) => {
processRowProperty(index, row, details);
details.query[row.prop] = index;
if (TimeoutStatus.value) {
// 超时列表
TimeoutHandling(details.query);
return;
}
if (AppealStatus.value) {
// 申诉列表
appealFn(details.query);
return;
}
if (ClaimStatus.value) {
// 这是理赔搜索
settlementclaim(details.query);
return;
}
if (!ProcessingPartyState.value) {
IndexTable(details.query); //首页初始化信息
console.log('首页');
} else {
ProcessingPartyFun(details.query); //处理方信息
console.log('处理方');
}
};
// 网页顶部搜索按钮
const searchChange = () => {
if (ClaimStatus.value) {
// 表示这是理赔查询
settlementclaim();
details.search = false; //关闭搜索
return;
}
details.search = false; //关闭搜索
if (!ProcessingPartyState.value) {
IndexTable(details.query); //首页初始化信息
} else {
ProcessingPartyFun(details.query); //处理方信息
}
};
// 清空头部搜索
const empty = () => {
details.columnList.forEach(item => {
item.values = '';
});
};
const searchChangeS = () => {
console.log(details.columnList);
details.columnList.forEach(item => {
item.values = '';
});
details.search = false; //关闭搜索
tabValue.value = 0;
IndexTable(); //首页初始化信息
};
// 网页顶部清空按钮
const searchReset = () => {
details.query = {};
IndexTable(details.query);
details.search = false; //关闭搜索
};
/** 表格表头时间选择 */
const timesc = (index, row) => {
console.log(index, row);
if (!!index) {
index = dayjs(index).format('YYYY-MM-DD');
}
details.query[row.prop] = index;
if (!index) {
delete details.query[row.prop];
}
};
/** 表格表头输入框搜索 */
const btnsc = val => {
console.log(val);
};
/** 表格表头下拉框选择 */
const selectsc = (index, row) => {
processRowProperty(index, row, details);
if (TimeoutStatus.value) {
// 超时列表
TimeoutHandling(details.query);
return;
}
if (AppealStatus.value) {
// 申诉列表
appealFn(details.query);
return;
}
if (ClaimStatus.value) {
// 这是理赔搜索
settlementclaim(details.query);
return;
}
if (!ProcessingPartyState.value) {
IndexTable(details.query); //首页初始化信息
} else {
ProcessingPartyFun(details.query); //处理方信息
}
};
// 反字典公共请求
const Antidictionary = (val, data) => {
getDictionaryBiz(val).then(res => {
res.data.data.forEach(item => {
data.checkarr.push({
value: item.dictValue,
label: item.dictValue,
});
});
});
};
function onLoad() {}
/** 表格表头复选框选择 */
const selectionChange = list => {
console.log(list, '当前选择的数据');
details.selectionList = list;
};
/** 页码改变执行的回调 */
const currentChange = val => {
page.value.currentPage = val;
// 超时
if (TimeoutStatus.value) {
TimeoutHandling(details.query);
return;
}
if (AppealStatus.value) {
// 申诉列表
appealFn(details.query);
return;
}
if (ClaimStatus.value) {
// 这是理赔
settlementclaim(details.query);
return;
}
if (!ProcessingPartyState.value) {
//表示当前不是处理方
IndexTable(details.query);
} else {
ProcessingPartyFun(details.query);
}
};
// 每页多少条
const sizeChange = val => {
page.value.pageSize = val;
// 超时
if (TimeoutStatus.value) {
TimeoutHandling(details.query);
return;
}
if (AppealStatus.value) {
// 申诉列表
appealFn(details.query);
return;
}
if (ClaimStatus.value) {
// 这是理赔
settlementclaim(details.query);
return;
}
if (!ProcessingPartyState.value) {
//表示当前不是处理方
IndexTable(details.query);
} else {
ProcessingPartyFun(details.query);
}
};
const changeProcessingResults = val => {
// 首先删除取消的项目
ProcessingList.value = ProcessingList.value.filter(item => val.includes(item.state - 1));
// 然后添加或保持新的项目
val.forEach(num => {
let newItem = { input: '', min: 0, max: 1000, state: num + 1 };
// 根据num为newItem的name字段赋值
switch (num) {
case '0':
newItem.name = '维修';
break;
case '1':
newItem.name = '补漆';
break;
case '2':
newItem.name = '下补单';
break;
case '3':
newItem.name = '赔付运费';
break;
case '4':
newItem.name = '用库存';
break;
case '5':
newItem.name = '赔商家';
break;
case '6':
newItem.name = '赔客户';
break;
default:
console.log('未知的编号:', num);
return; // 如果不是我们想处理的num,跳过之后的逻辑
}
// 如果列表中不存在则加入新项目
if (!ProcessingList.value.some(item => item.state === newItem.state)) {
ProcessingList.value.push(newItem);
console.log(`添加:${newItem.name}`);
}
});
};
// 查询理赔数据
const settlementclaim = val => {
details.loadingObj.list = true; //开启动画加载
console.log(Claimsfield, '理赔数据');
ClaimStatus.value = true; //开启理赔查询状态
AppealStatus.value = false; //关闭申诉状态
TimeoutStatus.value = false; //关闭 超时状态
details.columnList = Claimsfield;
Claimsfield[3].checkarr = []; //营业部
Claimsfield[7].checkarr = []; //异常类型名称
Claimsfield[9].checkarr = []; //发现环节
getDeptWarehouse({}).then(res => {
res.data.data.forEach(item => {
Claimsfield[3].checkarr.push({
value: item.name,
label: item.name,
});
});
});
getDictionaryBiz('pc_work_order').then(res => {
res.data.data.forEach(item => {
Claimsfield[7].checkarr.push({
value: item.dictValue,
label: item.dictValue,
});
});
});
getDictionaryBiz('pc_discovery_node').then(res => {
res.data.data.forEach(item => {
Claimsfield[9].checkarr.push({
value: item.dictValue,
label: item.dictValue,
});
});
});
// details.columnList warehouseData.value
console.log(details, 'details');
let data = {
current: details.page.currentPage,
size: details.page.pageSize,
...val,
};
console.log(data, '要传递的参数');
$_listSettlement(data).then(res => {
details.loadingObj.list = false; //关闭动画加载
console.log(res, '查询理赔数据');
details.data = res.data.data.records; //数据
page.value.total = res.data.data.total;
});
};
// 获取申诉列表
const appealFn = val => {
details.loadingObj.list = true; //开启动画加载
AppealStatus.value = true; //开启申诉列表状态
TimeoutStatus.value = false; //关闭 超时状态
ClaimStatus.value = false; //关闭理赔查询状态
AppealList[5].checkarr = []; //异常类型名称
AppealList[6].checkarr = []; //发现环节
Antidictionary('pc_work_order', AppealList[5]);
Antidictionary('pc_discovery_node', AppealList[6]);
console.log('当前是申诉列表');
let data = {
current: details.page.currentPage,
size: details.page.pageSize,
...val,
};
$_listAppeal(data).then(res => {
details.loadingObj.list = false; //开启动画加载
console.log(res, '申诉列表返回值');
details.data = res.data.data.records;
page.value.total = res.data.data.total;
});
};
// 申诉列表
const AppealTab = val => {
if (val == 0) {
AppealStatusT.value = false; //申诉列表开启
Tableheaderswitching(columnList); //切换表头
console.log('处理完毕');
ProcessingPartyState.value = false; //关闭处理方
details.query.workOrderStatus = 30;
ArbitrationStatus.value = false; //不可以申请仲裁
empty(); //清空搜索数据
let data = {
workOrderStatus: 30,
...details.query,
};
IndexTable(data);
} else {
AppealStatusT.value = true; //申诉列表开启
console.log(val, '切换申诉列表');
Tableheaderswitching(AppealList); //切换表头
AppealList.forEach(item => {
//清空搜索记录
item.values = '';
});
appealFn(); // 获取申诉列表
}
};
// 超时金额修改
const BtnModifyAmount = val => {
console.log(val, '超时金额修改');
dialogModifyAmount.value = true; //开启超时金额弹窗修改
fromamount.value.title = val.row.workOrderNumber; //工单号
fromamount.value.ytimeout = val.row.money; //原本金额
fromamount.value.id = val.row.lawoId; //id
};
// 修改金额确定
const ModifyAmountFn = () => {
let data = {
id: fromamount.value.id,
money: fromamount.value.Amount,
};
console.log(data, '准备提交的金额参数');
$_moneyUpdate(data).then(res => {
TimeoutHandling();
console.log(res, '修改成功返回值');
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
}
dialogModifyAmount.value = false; //关闭超时金额弹窗修改
});
};
// 查询超时记录
const TimeoutHandling = val => {
timeoutList[3].checkarr = []; //异常类型名称
timeoutList[4].checkarr = []; //发现环节
ClaimStatus.value = false; //关闭理赔查询状态
AppealStatus.value = false; //关闭申诉状态
TimeoutStatus.value = true; //开启超时记录查询
details.loadingObj.list = true; //开启动画加载
Antidictionary('pc_work_order', timeoutList[3]);
Antidictionary('pc_discovery_node', timeoutList[4]);
let data = {
current: details.page.currentPage,
size: details.page.pageSize,
...val,
};
$_listOwn(data).then(res => {
details.loadingObj.list = false; //开启动画加载
console.log(res, '超时记录');
details.data = res.data.data.records;
page.value.total = res.data.data.total;
});
};
// 标签栏触发
const tabChenge = val => {
TabPermissions.value = val; //记录当前点击的菜单
AppealStatusT.value = false; //申诉列表开启
console.log(val, '触发了标签栏');
let data = {};
if (val == 0) {
ProcessingPartyState.value = false; //关闭处理方
details.query.workOrderStatus = null;
ArbitrationStatus.value = false; //不可以申请仲裁
Tableheaderswitching(columnList);
IndexTable();
empty();
console.log('全部');
} else if (val == 1) {
// 处理中
if (UserPermissions.value == '职能客服') {
data.workOrderStatus = 40;
details.query.workOrderStatus = 40;
} else {
data.workOrderStatus = 20;
details.query.workOrderStatus = 20;
}
ProcessingPartyState.value = false; //关闭处理方
ArbitrationStatus.value = true; //可以申请仲裁
Tableheaderswitching(columnList);
empty();
IndexTable(data);
} else if (val == 2) {
if (UserPermissions.value == '职能客服') {
data.workOrderStatus = 50;
details.query.workOrderStatus = 50;
} else {
data.workOrderStatus = 30;
details.query.workOrderStatus = 30;
}
// 处理完毕
ProcessingPartyState.value = false; //关闭处理方
ArbitrationStatus.value = false; //不可以申请仲裁
Tableheaderswitching(columnList);
empty();
IndexTable(data);
} else if (val == 3) {
console.log(UserPermissions.value, '当前身份');
if (UserPermissions.value == '客服经理') {
data.workOrderStatus = 10;
ArbitrationStatus.value = true; //可以申请仲裁
Tableheaderswitching(columnList);
empty();
IndexTable(data);
} else {
console.log('待处理');
ProcessingPartyState.value = true; //开启处理方
details.query.workOrderStatus = '';
ArbitrationStatus.value = true; //可以申请仲裁
Tableheaderswitching(columnList);
empty();
ProcessingPartyFun(data);
}
} else if (val == 4) {
ProcessingPartyState.value = false; //关闭处理方
// 理赔金额未出
details.query.workOrderStatus = null;
ArbitrationStatus.value = false; //不可以申请仲裁
Tableheaderswitching(Claimsfield); //切换表格
empty();
settlementclaim();
} else if (val == 5) {
// 仲裁中
ProcessingPartyState.value = false; //关闭处理方
data.workOrderStatus = 70;
details.query.workOrderStatus = 70;
ArbitrationStatus.value = false; //不可以申请仲裁
Tableheaderswitching(columnList); //表头切换
empty();
IndexTable(data);
} else if (val == 6) {
// 完结
ProcessingPartyState.value = false; //关闭处理方
data.workOrderStatus = 80;
details.query.workOrderStatus = 80;
ArbitrationStatus.value = false; //不可以申请仲裁
Tableheaderswitching(columnList); //表头切换
empty();
IndexTable(data);
} else if (val == 7) {
// 超时未处理
ProcessingPartyState.value = false; //关闭处理方
data.workOrderStatus = null;
details.query.workOrderStatus = '';
ArbitrationStatus.value = false; //不可以申请仲裁
Tableheaderswitching(timeoutList); //表头切换
empty();
TimeoutHandling(); //调用超时未出理
}
};
/**
* 设置列表 -- 固定函数
* 弹窗的勾选回调,用于更改头部数组
* 固定搭配,只需要更换 columnList
* */
const setnewcolum = (newarr, headarr, type) => {
if (type == 1) {
details.columnList = newarr;
functions.setStorage(window.location.pathname + 'checkList', headarr);
} else if (type == 2) {
details.columnList = newarr;
functions.setStorage(window.location.pathname + 'flexList', headarr);
} else if (type == 3) {
details.columnList = newarr;
functions.setStorage(window.location.pathname + 'sortlist', headarr);
}
};
/** 展开列表控件 */
const showdrawer = _flag => {
details.drawerShow = _flag;
};
// 处理方数据公共函数
const ProcessingPartyFun = val => {
ClaimStatus.value = false; //关闭理赔状态
TimeoutStatus.value = false; //关闭超时
AppealStatus.value = false; //关闭申诉状态
details.query.workOrderStatus = null;
details.loadingObj.list = true; //开启动画加载
let data = {
...val,
workOrderStatus: 10,
};
console.log(val, 'val接收的参数');
columnList[2].checkarr = []; //重置下拉搜索框
columnList[3].checkarr = [];
data.current = page.value.currentPage; //页码
data.size = page.value.pageSize; //条数
updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
$_getProcessor(data).then(res => {
details.loadingObj.list = false; //关闭动画加载
page.value.total = res.data.data.total; //总页数
if (res.data.data.records.length) {
res.data.data.records.forEach(item => {
// 对为null的数据进行处理
for (const property in item) {
if (item[property] == null) {
item[property] = '/';
}
}
// 对状态进行处理
if (item.workOrderType == 1) {
item.workOrderTypeNameS = columnList[2].checkarr[0].label; //货损
} else if (item.workOrderType == 2) {
item.workOrderTypeNameS = columnList[2].checkarr[1].label; //少货
} else if (item.workOrderType == 3) {
item.workOrderTypeNameS = columnList[2].checkarr[2].label; //窜货
} else if (item.workOrderType == 4) {
item.workOrderTypeNameS = columnList[2].checkarr[3].label; //加急
} else if (item.workOrderType == 5) {
item.workOrderTypeNameS = columnList[2].checkarr[4].label; //其他
}
// 提货环节下拉赋值
if (item.discoveryNode == 1) {
item.discoveryNodeNameS = columnList[3].checkarr[0].label; //提货环节
} else if (item.discoveryNode == 2) {
item.discoveryNodeNameS = columnList[3].checkarr[1].label; //发货环节
} else if (item.discoveryNode == 3) {
item.discoveryNodeNameS = columnList[3].checkarr[2].label; //干线卸车环节
} else if (item.discoveryNode == 4) {
item.discoveryNodeNameS = columnList[3].checkarr[3].label; //库内作业环节
} else if (item.discoveryNode == 5) {
item.discoveryNodeNameS = columnList[3].checkarr[4].label; //配送装车环节
} else if (item.discoveryNode == 6) {
item.discoveryNodeNameS = columnList[3].checkarr[5].label; //其他
} else if (item.discoveryNode == 7) {
item.discoveryNodeNameS = columnList[3].checkarr[6].label; //配送签收环节
} else if (item.discoveryNode == 8) {
item.discoveryNodeNameS = columnList[3].checkarr[7].label; //安装环节
}
});
details.data = res.data.data.records;
console.log(details.data, '存储的数据');
} else {
details.data = res.data.data.records; //这里是空的
}
loading.value = false; //关闭加载效果
});
};
// 获取聊天记录
const FKList = () => {
iconState.value = true;
let data = { workOrderId: ListRow.value.id };
$_getExchangeList(data).then(res => {
iconState.value = false;
console.log(res, '查询的值');
ChatHistory.value = res.data.data;
setTimeout(() => {
const container = scrollContainer.value;
if (container) {
container.scrollTop = container.scrollHeight;
}
}, 0);
});
};
// 点击回复按钮
const reply = val => {
$router.push({
path: '/aftersales/customerService',
query: {
row: JSON.stringify(val.row),
},
});
return;
console.log(val, 'ID++++++++');
console.log(val.row);
dialogcustomerService.value = true; //开启回复弹窗
ListRow.value = val.row; //存储当前行点击数据
FKList();
};
// 处理方数据
const ProcessingParty = () => {
ProcessingPartyState.value = true; //开启处理方
ProcessingPartyFun();
};
// 消息发送函数
const messagesendFn = () => {
iconState.value = true;
let data = {
workOrderId: ListRow.value.id,
businessName: Mydata.value.departmentName,
businessId: Mydata.value.id,
content: KFinput.value,
warehouseId: ListRow.value.warehouseId,
annex: KFfeel.value,
};
console.log(data, '处理好的数据');
$_AddReply(data).then(res => {
// 获取当前时间
const currentTime = new Date();
// 获取年、月、日、小时、分钟、秒
const year = String(currentTime.getFullYear());
const month = String(currentTime.getMonth() + 1).padStart(2, '0');
const day = String(currentTime.getDate()).padStart(2, '0');
const hours = String(currentTime.getHours()).padStart(2, '0');
const minutes = String(currentTime.getMinutes()).padStart(2, '0');
const seconds = String(currentTime.getSeconds()).padStart(2, '0');
// 拼接时间字符串
const formattedTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
console.log(res, '添加成功');
if (res.data.code == 200) {
// 添加成功
iconState.value = false;
ChatHistory.value.push({
businessId: Mydata.value.id,
businessName: Mydata.value.departmentName,
content: KFinput.value,
createTime: formattedTime,
});
// 滚动到最后
setTimeout(() => {
const container = scrollContainer.value;
if (container) {
container.scrollTop = container.scrollHeight;
}
}, 0);
KFinput.value = ''; //清空内容
KFfeel.value = null; //清空文件
}
});
console.log(Mydata.value, '参数');
};
// 发送按钮
const messagesend = () => {
messagesendFn();
};
// 客服刷新按钮
const KFRefresh = () => {
FKList();
};
// 输入框回车
const inputEnter = () => {
messagesendFn();
};
// 图片上传必须携带TOKEN
const headers = computed(() => {
return { 'Blade-Auth': 'Bearer ' + getToken() };
});
// 图片上传接口
const doubledCount = computed(() => {
return '/api/blade-resource/oss/endpoint/put-file';
});
// 附件上传成功
const fellSuccess = (response, uploadFile) => {
console.log('上船成功');
console.log(response, uploadFile);
if (response.data.link) {
KFfeel.value = response.data.link;
}
};
// 批量打回
const BatchReturn = () => {
BatchFrom.value.businessDepartment = [];
BatchFrom.value.txt = null;
if (!details.selectionList.length) {
ElMessage({
message: '请勾选要打回的数据',
type: 'warning',
});
return;
}
dialogReturn.value = true;
console.log(details.selectionList, '选中的参数');
};
// 批量打回确定按钮
const ConfirmReturn = () => {
repulse.value = true; //开启加载并关闭按钮
let data = {
processorList: [],
};
// 过滤满足条件的对象
let foundObjs = warehouseData.value.filter(obj =>
BatchFrom.value.businessDepartment.includes(obj.value)
);
data['businessId'] = foundObjs.map(item => item.value).join(',');
data['businessName'] = foundObjs.map(item => item.label).join(',');
// 营业部处理
foundObjs.forEach(item => {
data['processorList'].push({ id: item.value, name: item.label });
});
data.reasonReturn = BatchFrom.value.txt; //打回原因
// data.warehouseId = details.selectionList.map(item=>item.warehouseId); //仓库ID
data.workOrderIds = details.selectionList.map(item => item.id); //异常工单ID
console.log(data, '处理好的值');
$_batchReturn(data)
.then(res => {
repulse.value = false; //关闭加载并关闭按钮
dialogReturn.value = false; //关闭打回弹窗
IndexTable(); //首页初始化信息
console.log(res, '批量打回返回值');
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
}
})
.catch(error => {
repulse.value = false; //关闭加载并关闭按钮
dialogReturn.value = false; //关闭打回弹窗
});
};
// 工单指派
const assign = () => {
if (!details.selectionList.length) {
ElMessage({
message: '请勾选工单数据',
type: 'warning',
});
return;
}
$_getCustomerServicePersonnel({})
.then(res => {
console.log(res, '客服列表');
customerService.value = res.data.data;
})
.catch(error => {
console.log(error, '客服列表错误');
});
assignFrom.value = {}; //清空内容
dialogassign.value = true; //开启指派工单弹窗
};
// 工单指派确定按钮
const Assignbutton = () => {
AssignLoad.value = true; //开启加载和按钮禁止重复点击
let foundObjs = customerService.value.find(obj => obj.id == assignFrom.value.businessDepartment); //筛选选择的工单
let data = {
assignList: [],
};
data.customerServiceId = foundObjs.id; //归属客服ID
data.customerServiceName = foundObjs.name; //归属客服名称
data['assignList'] = details.selectionList.map(item => item.id); //异常工单ID//工单ID
console.log(data, '处理好的值');
$_assignCustomerService(data)
.then(res => {
AssignLoad.value = false; //关闭加载和按钮禁止重复点击
dialogassign.value = false; //关闭指派工单弹窗
console.log(res, '工单指派返回');
IndexTable(); //首页初始化信息
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
}
})
.catch(error => {
AssignLoad.value = false; //关闭加载和按钮禁止重复点击
dialogassign.value = false; //关闭指派工单弹窗
});
};
// 申请仲裁
const arbitrate = () => {
// 处理中,待处理可申请
if (!details.selectionList.length) {
console.log('当前没有数据');
ElMessage({
message: '请勾要仲裁的数据',
type: 'warning',
});
return;
}
let data = {
assignList: [],
};
console.log(details.selectionList, '仲裁选中的参数');
details.selectionList.forEach(item => {
data['assignList'].push(item.id);
});
if (!ArbitrationStatus.value) {
ElMessage({
message: '当前状态不可申请仲裁',
type: 'warning',
});
} else {
console.log(data, '仲裁处理好的参数');
// 发送请求
$_arbitrate(data).then(res => {
console.log(res, '仲裁成功返回值');
empty();
PagerefreshPublic();
if (res.data.code == 200) {
ElMessage({
message: res.data.msg,
type: 'success',
});
}
});
}
};
// 页面刷新公共函数
const PagerefreshPublic = () => {
console.log('执行了页面刷新公共函数');
if (ProcessingPartyState.value && ArbitrationStatus.value) {
ProcessingPartyFun();
} else {
IndexTable(); //刷新页面
}
};
// 添加赔款方
const AddCompensation = () => {
console.log('添加赔款方');
let som = 1;
CompensationParty.value.forEach(item => {
if (item.state == 0) {
som++;
}
});
CompensationParty.value.push({ name: '', state: 0, num: 0, reason: '', cld: som });
};
// 添加收款方
const AddPayee = () => {
let som = 1;
CompensationParty.value.forEach(item => {
if (item.state == 1) {
som++;
}
});
CompensationParty.value.push({ name: '', state: 1, num: 0, reason: '', cld: som });
};
// 移除按钮
const payremove = (state, val) => {
// 判断赔付方,至少保留一条数据
let som = 0;
if (state == 0) {
CompensationParty.value.forEach(item => {
if (item.state == 0) {
som++;
}
});
if (som == 1) {
ElMessage({
message: '赔款必填最少一条',
type: 'warning',
});
return;
}
}
CompensationParty.value.splice(val, 1);
console.log('CompensationParty :>> ', CompensationParty);
amountMoney();
};
// 金额输入汇总
const amountMoney = () => {
// 计算赔款金额总数
TotalamountCompensation.value = 0;
TotalamountReceived.value = 0;
CompensationParty.value.forEach(item => {
const _num = isNumer(item.num) ? item.num : 0;
// 统计赔款方【0】
if (item.state == 0) {
TotalamountCompensation.value = computeNumber(
TotalamountCompensation.value,
'+',
_num
).result;
}
// 统计收款方金额【1】
if (item.state == 1) {
TotalamountReceived.value = computeNumber(TotalamountReceived.value, '+', _num).result;
}
});
console.log('赔款总计金额', TotalamountCompensation.value);
console.log('收款总计金额', TotalamountReceived.value);
};
// 批量完结
const Batchcompletion = () => {
console.log(details.selectionList);
// 完结的逻辑
if (!details.selectionList.length) {
ElMessage({
message: '请先勾选要处理的数据',
type: 'warning',
});
return;
}
dialogBatchcompletion.value = true; //开启批量完结弹窗
};
// 批量提交
const CompletedSubmission = () => {
PLloading.value = true; //开启处理加载效果
console.log(CompensationParty.value);
let pay = CompensationParty.value.find(item => item.cld == 1);
console.log(pay);
if (!pay.name || pay.num == null || !pay.reason) {
ElMessage({
message: '请填写赔款方完整信息',
type: 'warning',
});
return;
}
if (!Reasonarbitration.value) {
ElMessage({
message: '请填写仲裁原因',
type: 'warning',
});
return;
}
console.log(CompensationParty.value, 'CompensationParty赔款列表');
console.log(details.selectionList, '选中的参数');
// 初始化data数组,其结构对应于details.selectionList的长度
let data = details.selectionList.map(() => ({
completionRecipientEntities: [],
completionRecordEntities: [],
}));
console.log(data, '初始值');
// 填充data数组
details.selectionList.forEach((selection, index) => {
CompensationParty.value.forEach(party => {
// 根据state值创建不同类型的对象填充到相应的数组中
if (party.state === 0) {
// 赔款方信息对象
const record = {
indemnitor: party.name,
reason: party.reason,
money: Number(party.num),
reasonArbitration: Reasonarbitration.value,
workOrderId: selection.id,
warehouseId: selection.warehouseId,
};
// 将赔款方信息添加到对应的completionRecordEntities数组中
data[index].completionRecordEntities.push(record);
} else {
// 收款方信息对象
const recipient = {
recipient: party.name,
reasonReceivingPayment: party.reason,
money: Number(party.num),
responsibleParty: '', //
workOrderNumber: selection.workOrderNumber,
workOrderId: selection.id,
warehouseId: selection.warehouseId,
};
// 将收款方信息添加到对应的completionRecipientEntities数组中
data[index].completionRecipientEntities.push(recipient);
}
});
});
// 赔款方
console.log(data, '处理好的值');
$_addCompletionEnd(data).then(res => {
PagerefreshPublic();
PLloading.value = false; //关闭处理加载效果
dialogBatchcompletion.value = false; //关闭弹窗
console.log(res, '完结成功返回值');
if (res.data.code) {
ElMessage({
message: res.data.msg,
type: 'success',
});
}
});
};
</script>
<style scoped lang="scss">
.el-card {
height: 100%;
:deep(.el-card__body) {
height: 100%;
display: flex;
flex-direction: column;
}
}
.page {
height: 30px;
flex: 1;
display: flex;
align-items: flex-end;
padding-bottom: 14px;
justify-content: flex-end;
}
:deep(.el-Cart-button) {
margin-bottom: 8px;
display: flex;
justify-content: space-between;
}
.el-Cart-button-right {
display: flex;
margin: 0 0px;
justify-content: space-between;
}
.el-Cart-button-right {
display: flex;
margin: 0 0px;
justify-content: space-between;
align-items: center;
button {
background-color: transparent;
border-radius: 50%;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #ccc;
margin-right: 8px;
&:hover {
background-color: #172e601f;
i {
color: #0e2549;
}
}
// 去掉最后一个按钮右侧边距
&:last-child {
margin-right: 0;
}
}
}
.IndexFrom {
display: flex;
flex-wrap: wrap;
.el-form-item {
margin: 10px;
width: 31%;
height: 46px;
display: flex;
align-items: center;
}
.el-form-item__content {
.el-input {
height: 36px;
width: 206px;
}
}
.el-input__wrapper {
height: 32px !important;
}
:deep(.el-input) {
width: 100% !important;
}
:deep(.el-input__wrapper) {
height: 30px !important;
}
:deep(.el-select) {
width: 100%;
}
}
.Transport_damage_photos {
padding: 6px;
.title {
font-size: 14px;
margin-bottom: 9px;
display: block;
}
}
.endClass {
display: flex;
flex-wrap: wrap;
align-items: center;
.el-form-item {
margin: 6px;
width: 32%;
}
.el-select {
width: 100%;
}
:deep(.el-input) {
width: 100%;
}
:deep(.el-input__wrapper) {
height: 26px;
}
.Transport_damage_photos {
.title {
font-size: 14px;
}
}
}
.ProcessingResults {
width: 100%;
height: 260px;
border: 1px solid #ccc;
position: relative;
padding: 26px;
box-sizing: border-box;
margin-top: 20px;
.title {
position: absolute;
top: -20px;
left: 20px;
font-size: 26px;
background-color: #fff;
}
}
.selector {
display: flex;
width: 100%;
padding: 16px;
padding-left: 6px;
.title {
width: 108px;
}
}
.Listadmiration {
display: flex;
flex-wrap: wrap;
.name {
display: flex;
margin: 10px 5%;
span {
display: block;
width: 90px;
}
}
}
.ElBtnClass {
button {
border: none;
padding: 0;
background-color: transparent;
}
button:hover {
background-color: transparent;
}
}
:deep(.el-card) {
height: 100%;
}
.avue-crud {
height: 100%;
display: flex;
flex-direction: column;
}
:deep(.el-card__body) {
height: 100%;
}
.lptime {
margin-top: 30px;
padding-left: 60px;
display: flex;
flex-direction: column;
font-size: 14px;
:deep(.el-input__wrapper) {
height: 30px;
}
.name {
margin-bottom: 10px;
}
}
.recordCl {
height: 200px;
overflow-y: scroll;
}
.el_Completion {
padding: 10px 0;
.title {
font-size: 14px;
}
}
.el-ckbtn {
margin-top: 10px;
}
.payanindemnity {
display: flex;
align-items: center;
margin-top: 20px;
.title {
width: 76px;
height: 100%;
display: flex;
display: block;
align-items: center;
}
.sk_input {
margin: 0 5px;
width: 300px;
}
.el-button {
background-color: #ff0000;
border: none;
}
}
.el_clzr {
padding: 0 18px;
padding-left: 8px;
:deep(.el-select) {
width: 100%;
}
:deep(.el-input) {
height: 38px;
}
}
.el-fy {
flex: 1;
display: flex;
align-items: flex-end;
margin-bottom: 10px;
}
.el-times {
:deep(.el-input__wrapper) {
height: 30px !important;
}
}
.el_tims_box {
display: flex;
}
.el-fr-d {
margin: 6px 0px;
}
.el-btn {
width: 100%;
}
:deep(.el-card) {
box-shadow: none;
}
.content_max {
display: flex;
height: 100%;
}
.content_right {
flex: 1;
height: 100%;
width: 100%;
}
.el_times {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-content: space-between;
:deep(.el-form-item) {
margin: 0;
align-items: center;
.el-form-item__label {
margin-left: 20px;
}
}
}
.topText {
width: 70%;
}
.content {
width: 100%;
height: 300px;
overflow-y: scroll;
scroll-behavior: smooth;
/* 添加平滑滚动效果 */
border-radius: 5px;
.YH {
width: 100%;
min-height: 50px;
margin: 4px 0;
display: flex;
flex-direction: row;
.box {
width: 386px;
height: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
.name {
display: flex;
flex-direction: column;
span {
display: flex;
justify-content: flex-start;
padding-left: 10px;
margin-bottom: 10px;
}
.time {
display: flex;
justify-content: flex-end;
padding: 0 10px;
margin-top: 4px;
}
}
}
.input {
border: 1px solid;
width: 300px;
min-height: 30px;
box-sizing: border-box;
border-radius: 8px;
padding: 8px;
margin: 0 6px;
text-indent: 2em;
position: relative;
.ico {
position: absolute;
right: -6%;
bottom: 0;
}
}
}
.KF {
width: 100%;
min-height: 50px;
margin: 4px 0;
display: flex;
justify-content: flex-end;
.box {
width: 386px;
height: 100%;
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
.name {
display: flex;
flex-direction: column;
span {
display: flex;
justify-content: flex-end;
padding-right: 10px;
margin-bottom: 10px;
}
.time {
display: flex;
justify-content: flex-start;
padding: 0 10px;
margin-top: 4px;
}
}
}
.input {
border: 1px solid;
width: 300px;
min-height: 30px;
box-sizing: border-box;
border-radius: 8px;
padding: 8px;
margin: 0 6px;
text-indent: 2em;
position: relative;
.ico {
position: absolute;
left: -16%;
bottom: 0;
}
}
}
.TX {
height: 50px;
width: 50px;
border-radius: 50%;
border: 1px solid #ccc;
background: url('../../../public/img/tx.png') no-repeat;
background-size: cover;
}
}
.inputTextarea {
margin-top: 50px;
display: flex;
align-items: flex-end;
.fell {
width: 100%;
.el-upload-list {
display: none;
}
}
}
.btn_fs {
margin-left: 50px;
}
.felltis {
height: 28px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 4px;
border: 1px dashed;
padding: 0 4px;
border-radius: 3px;
}
.el_fk {
.my-header {
display: flex;
justify-content: space-between;
margin-right: 25px;
}
.el-dialog__title {
margin: 0;
}
}
.plAllret {
:deep(.el-select) {
width: 100%;
}
.el-select {
width: 100%;
}
}
:deep(.is-active) {
font-weight: bold !important;
}
.Improveinformation {
width: 100%;
:deep(.custom-tabs-label) {
display: flex;
align-items: center;
}
:deep(.el-tab-pane) {
padding: 10px;
}
}
.paySum {
margin-top: 36px;
font-size: 14px;
display: flex;
justify-content: space-between;
.sum {
display: flex;
}
span {
margin-right: 30px;
display: flex;
align-items: center;
}
}
:deep(.el_Batchcompletion) {
height: 745.6px;
overflow-y: scroll;
margin: 0;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.el_btn {
display: flex;
justify-content: flex-end;
}
:deep(.el_tabs) {
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
.el-tabs__content {
padding: 0;
flex: 1;
}
.el-tabs__header {
height: 37px;
width: 100%;
}
}
:deep(.avue-crud__pagination) {
padding-top: 2px !important;
}
.arbitrate {
margin-top: 36px;
.el_btn {
margin-top: 10px;
}
:deep(.el-tabs__content) {
padding: 0 !important;
flex: 1;
}
}
.el_appeal {
:deep(.el-select) {
width: 100% !important;
margin-bottom: 10px;
}
}
.el_sdialog-footer {
display: flex;
justify-content: flex-end;
margin-top: 10px;
}
:deep(.avue-crud__header) {
align-items: center;
}
.el_amount {
display: flex;
justify-content: space-between;
}
</style>