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.
1902 lines
50 KiB
1902 lines
50 KiB
<template> |
|
<!-- <div class="el-Cart-button"> |
|
|
|
<div class="el-Cart-button-left"> |
|
<el-button type="primary" @click="AddInfo" |
|
><el-icon><Plus /></el-icon>新 增</el-button |
|
> |
|
</div> |
|
|
|
<div class="el-Cart-button-right"> |
|
|
|
<button @click="refresh"> |
|
<el-icon color="#ccc"><Refresh /></el-icon> |
|
</button> |
|
|
|
<button @click="menu = true"> |
|
<el-icon color="#ccc"><Operation /></el-icon> |
|
</button> |
|
|
|
<button @click="search"> |
|
<el-icon color="#ccc"><Search /></el-icon> |
|
</button> |
|
</div> |
|
</div> --> |
|
|
|
<!-- <el-table |
|
v-loading="loading" |
|
element-loading-text="数据正在更新中..." |
|
:data="ElData" |
|
border |
|
style="width: 100%" |
|
ref="tableRef" |
|
@select-all="selectAll" |
|
@select="selectChange" |
|
> |
|
<el-table-column type="selection" width="55" fixed /> |
|
<el-table-column type="index" fixed width="50" height="100" label="#" align="center" /> |
|
|
|
|
|
|
|
<el-table-column |
|
:prop="item.prop" |
|
:label="item.label" |
|
:width="item.width" |
|
:fixed="item.fixed" |
|
align="center" |
|
v-for="(item) in ElmenuData" |
|
:key="item.label" |
|
> |
|
<el-table-column |
|
:prop="item.prop" |
|
:label="item.label" |
|
:width="item.width" |
|
:fixed="item.fixed" |
|
align="center" |
|
> |
|
|
|
<template #header> |
|
<el-input |
|
clearable |
|
v-if="item.type == 4" |
|
v-model="item.values" |
|
:placeholder="`请输入${item.label}`" |
|
/> |
|
<el-select |
|
v-model="item.values" |
|
class="m-2" |
|
placeholder="请选择" |
|
size="large" |
|
v-if="item.type == 6" |
|
@change="TcChenge($event, item)" |
|
:clearable="true" |
|
> |
|
<el-option |
|
v-for="item in item.checkarr" |
|
:key="item.value" |
|
:label="item.label" |
|
:value="item.value" |
|
/> |
|
</el-select> |
|
</template> |
|
|
|
<template #default="props"> |
|
|
|
<div class="ElBtnClass" v-if="item.type == 10"> |
|
<el-button @click="view(props.row)">查看</el-button> |
|
<el-button @click="ViewEvent(props.row)">编辑</el-button> |
|
<el-button @click="ViewEvent(props.row)">回复</el-button> |
|
<el-button @click="Delete(props.row)">删除</el-button> |
|
<el-button @click="CompletionButton(props.row)">完结</el-button> |
|
</div> |
|
<span v-if="item.type == 4">{{ |
|
props.row[item.prop] != null ? props.row[item.prop] : '/' |
|
}}</span> |
|
</template> |
|
</el-table-column> |
|
</el-table-column> |
|
</el-table> --> |
|
|
|
<basic-container> |
|
<div class="avue-crud"> |
|
<!-- 搜索模块 --> |
|
<el-row v-if="!search"> |
|
<!-- 查询模块 --> |
|
<el-form :inline="true" :model="query" class="el-fr-d"> |
|
<el-form-item label="交期:" class="el-times"> |
|
<!-- <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>--> |
|
<el-date-picker |
|
v-model="stockupDate" |
|
type="daterange" |
|
unlink-panels |
|
range-separator="至" |
|
start-placeholder="开始时间" |
|
end-placeholder="结束时间" |
|
:shortcuts="shortcuts" |
|
clearable |
|
/> |
|
</el-form-item> |
|
<el-form-item label="创建时间:" class="el-times"> |
|
<!-- <el-input v-model="query.stockupArea" placeholder="请输入备货区"></el-input>--> |
|
<el-date-picker |
|
v-model="stockupDate" |
|
type="daterange" |
|
unlink-panels |
|
range-separator="至" |
|
start-placeholder="开始时间" |
|
end-placeholder="结束时间" |
|
:shortcuts="shortcuts" |
|
clearable |
|
/> |
|
</el-form-item> |
|
<!-- 查询按钮 --> |
|
<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"> |
|
<el-button type="primary" @click="AddInfo"> |
|
<el-icon><Plus /></el-icon>新 增</el-button |
|
> |
|
</div> |
|
<!-- 头部右侧按钮模块 --> |
|
<div class="avue-crud__right"> |
|
<el-button icon="el-icon-refresh" @click="searchChange" 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-row> |
|
<!-- 列表模块 --> |
|
<tablecmt |
|
:columnList="columnList" |
|
: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"> |
|
<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> |
|
|
|
<!-- 分页模块 --> |
|
<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-input |
|
v-model="Indexform.deliveryDriver" |
|
:disabled="FromDisabled" |
|
placeholder="请输入配送司机" |
|
clearable |
|
/> |
|
</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" placeholder="Select"> |
|
<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 class="name"> |
|
<span>下补单:</span> |
|
<el-input-number v-model="endFrom.num" :min="1" :max="10" @change="handleChange" /> |
|
</div> |
|
<div class="name"> |
|
<span>赔付运费:</span> |
|
<el-input-number v-model="endFrom.num" :min="1" :max="10" @change="handleChange" /> |
|
</div> |
|
<div class="name"> |
|
<span>维修:</span> |
|
<el-input-number v-model="endFrom.num" :min="1" :max="10" @change="handleChange" /> |
|
</div> |
|
<div class="name"> |
|
<span>用库存:</span> |
|
<el-input-number v-model="endFrom.num" :min="1" :max="10" @change="handleChange" /> |
|
</div> |
|
<div class="name"> |
|
<span>赔商家:</span> |
|
<el-input-number v-model="endFrom.num" :min="1" :max="10" @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> |
|
</basic-container> |
|
|
|
<!-- <div class="page"> |
|
<el-pagination |
|
v-model:current-page="currentPage" |
|
v-model:page-size="pageSize" |
|
:page-sizes="pageList" |
|
:disabled="disabled" |
|
:background="background" |
|
layout="total, sizes, prev, pager, next, jumper" |
|
:total="total" |
|
@size-change="PageSizeChange" |
|
@current-change="SizeChange" |
|
/> |
|
</div> --> |
|
</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 } from '@/api/aftersales/aftersalesWorkOrder'; |
|
import { getDictionaryBiz } from '@/api/system/dict'; //字典 |
|
import { getDetailWarehouse, getDeptWarehouse } from '@/api/basicdata/basicdataWarehouse'; //处理方 |
|
import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue'; |
|
import { columnList, recordList } from '@/option/aftersales/vueTvemp.js'; |
|
import { processRowProperty } from '@/utils/util'; |
|
import dayjs from 'dayjs'; |
|
const currentPage = ref(1); // 默认页码 |
|
const pageSize = ref(30); // 默认每一页几条 |
|
const total = ref(0); //页码总页数 |
|
const pageList = ref([5, 10, 50, 100, 200]); // 选择每页显示多少条 |
|
const background = ref(true); // 是否开启背景颜色 |
|
const disabled = ref(false); // 是否禁止使用页码功能 |
|
const loading = ref(false); //首页表格加载效果 |
|
const Indexdialog = ref(false); //新增弹窗 |
|
const Indexform = ref({}); //首页新增表单 |
|
const IndexException = ref([]); //异常类型下拉选择 |
|
const DiscoveringNodes = ref([]); //发现节点下拉选择 |
|
const warehouseData = ref([]); //处理方 |
|
const IndexForm = ref(null); //首页表实例 |
|
const FromDisabled = ref(false); //详情禁止输入框 |
|
const SelectType = ref(null); //类型 |
|
const StateType = ref(true); //类型 |
|
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 ProcessingList = ref([]); //赔付方式列表 |
|
const CompensationParty = ref([{ name: '', state: 0, num: 0, reason: '', cld: 1 }]); //赔付款方 |
|
const details = reactive({ |
|
/** 是否开启搜索 */ |
|
search: true, |
|
/** 表格搜索条件 */ |
|
query: {}, |
|
/** 时间快捷选择设置 */ |
|
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); |
|
|
|
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 ElButtonS = ref([ |
|
// 1.link 切换按钮样式(文本模式-false ,按钮模式-tre) |
|
// 2.class 按钮样式名(用于切换按钮样式) |
|
// 3.space 是否开启按钮文子直接间距(true开启 ,false关闭) |
|
// 4.size 按钮尺寸默认小尺寸('large'| 'default'| 'small') |
|
// 5.icon 按钮图标 |
|
// 6.table 按钮名称 |
|
{ |
|
link: false, |
|
class: 'el-btn-view', |
|
space: true, |
|
size: 'small', |
|
icon: 'el-icon-view', |
|
table: '详情', |
|
}, |
|
]); |
|
|
|
const ElData = ref([]); // 首页表格数据 |
|
// 首页表格菜单 |
|
const ElmenuData = ref([ |
|
{ |
|
prop: 'workOrderType', |
|
label: '异常类型', |
|
type: 6, |
|
values: '', |
|
width: '150', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'discoveryNode', |
|
label: '发现节点', |
|
type: 1, |
|
values: '', |
|
width: '150', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'workOrderNumber', |
|
label: '异常工单号', |
|
type: 1, |
|
values: '', |
|
width: '150', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'waybillNumber', |
|
label: '运单号', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'orderCode', |
|
label: '订单自编号', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'trainNumber', |
|
label: '车次号', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'first', |
|
label: '一级品', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'secondary', |
|
label: '二级品', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'vehicleRoute', |
|
label: '车辆线路', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'deliverGoodsTime', |
|
label: '送货时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'discoveryTime', |
|
label: '发现时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'warehousingTime', |
|
label: '入库时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'waybillMall', |
|
label: '运单商场', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'deliveryTime', |
|
label: '配送时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'deliveryDriver', |
|
label: '配送司机', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'workOrderStatus', |
|
label: '工单状态', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'customerServiceName', |
|
label: '归属客服名称', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'overTime', |
|
label: '完结时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'problemDescription', |
|
label: '异常问题描述', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'personResponsible', |
|
label: '责任人(库内作业环节)', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'processNumber', |
|
label: '钉钉流程号', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'reviewedBy', |
|
label: '审核人', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'auditTime', |
|
label: '审核时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'entryTime', |
|
label: '财务入账时间', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: 'remarks', |
|
label: '备注', |
|
type: 1, |
|
values: '', |
|
width: '180', |
|
checkarr: [], |
|
fixed: false, |
|
sortable: true, |
|
header: true, |
|
}, |
|
{ |
|
prop: '', |
|
label: '操作', |
|
type: 10, |
|
values: '', |
|
width: '200', |
|
checkarr: [], |
|
fixed: 'right', |
|
sortable: true, |
|
header: true, |
|
}, |
|
]); |
|
|
|
const IndexTable = val => { |
|
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'); //发现环节 |
|
$_getList(data).then(res => { |
|
console.log(res, '页面初始化'); |
|
page.value.total = res.data.data.total; //总页数 |
|
console.log(columnList[3].checkarr, 'columnList[3].checkarr'); |
|
if (res.data.data.records.length) { |
|
res.data.data.records.forEach(item => { |
|
console.log(item.discoveryNode, 'item.discoveryNode'); |
|
// 对为null的数据进行处理 |
|
for (const property in item) { |
|
if (item[property] == null) { |
|
item[property] = '/'; |
|
} |
|
} |
|
// 对状态进行处理 |
|
if (item.workOrderType == 1) { |
|
item.workOrderTypeName = columnList[2].checkarr[0].label; //货损 |
|
} else if (item.workOrderType == 2) { |
|
item.workOrderTypeName = columnList[2].checkarr[1].label; //少货 |
|
} else if (item.workOrderType == 3) { |
|
item.workOrderTypeName = columnList[2].checkarr[2].label; //窜货 |
|
} else if (item.workOrderType == 4) { |
|
item.workOrderTypeName = columnList[2].checkarr[3].label; //加急 |
|
} else if (item.workOrderType == 5) { |
|
item.workOrderTypeName = columnList[2].checkarr[4].label; //其他 |
|
} |
|
|
|
if (item.discoveryNode == 1) { |
|
item.discoveryNodeName = columnList[3].checkarr[0].label; //提货环节 |
|
} else if (item.discoveryNode == 2) { |
|
item.discoveryNodeName = columnList[3].checkarr[1].label; //发货环节 |
|
} else if (item.discoveryNode == 3) { |
|
item.discoveryNodeName = columnList[3].checkarr[2].label; //干线卸车环节 |
|
} else if (item.discoveryNode == 4) { |
|
item.discoveryNodeName = columnList[3].checkarr[3].label; //库内作业环节 |
|
} else if (item.discoveryNode == 5) { |
|
item.discoveryNodeName = columnList[3].checkarr[4].label; //配送装车环节 |
|
} else if (item.discoveryNode == 6) { |
|
item.discoveryNodeName = columnList[3].checkarr[5].label; //其他 |
|
} else if (item.discoveryNode == 7) { |
|
item.discoveryNodeName = columnList[3].checkarr[6].label; //配送签收环节 |
|
} else if (item.discoveryNode == 8) { |
|
item.discoveryNodeName = columnList[3].checkarr[7].label; //安装环节 |
|
} |
|
}); |
|
details.data = res.data.data.records; |
|
|
|
loading.value = false; //关闭加载效果 |
|
} else { |
|
details.data = res.data.data.records = res.data.data.records; |
|
} |
|
}); |
|
}; |
|
|
|
// 页面初始化 |
|
const OnLoad = async () => { |
|
details.loadingObj = true; |
|
// 在组件挂载后获取屏幕高度 |
|
screenHeight.value = window.innerHeight; |
|
// 计算80%的高度 |
|
eightyPercentHeight.value = screenHeight.value * 0.8; |
|
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(); |
|
}; |
|
|
|
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 = () => { |
|
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(Indexform.value.processor, 'Indexform.value.processor'); |
|
FromDisabled.value = false; //启用输入框 |
|
let processorEntityList = []; |
|
let ProcessingParty = { |
|
//处理方 |
|
businessName: warehouseData.value.find(row => row.value == Indexform.value.processor)?.label, |
|
businessId: Indexform.value.processor, |
|
conditions: 1, |
|
typesOf: 2, |
|
}; |
|
processorEntityList.push(ProcessingParty); |
|
let ResponsibleParty = { |
|
//责任方 |
|
businessName: warehouseData.value.find(row => row.value == Indexform.value.duty).label, |
|
businessId: Indexform.value.duty, |
|
conditions: 1, |
|
typesOf: 1, |
|
}; |
|
processorEntityList.push(ResponsibleParty); |
|
Indexform.value.processorEntityList = processorEntityList; |
|
let DataSubmit = { ...Indexform.value }; |
|
delete DataSubmit.duty, //移除多余字段 |
|
delete DataSubmit.processor; //移除多余字段 |
|
console.log(DataSubmit, '处理好的表单信息'); |
|
Indexdialog.value = false; //关闭表单弹窗 |
|
$_submit(DataSubmit).then(res => { |
|
if (res.data.code == 200) { |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
IndexTable(); |
|
} |
|
}); |
|
}; |
|
|
|
// 首页查看详情按钮 |
|
const view = val => { |
|
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 Delete = val => { |
|
ElMessageBox.confirm(`是否删除该条数据?`) |
|
.then(() => { |
|
$_remove({ |
|
ids: val.id, |
|
}).then(res => { |
|
console.log(res, '删除成功后的返回值'); |
|
if (res.data.code == 200) { |
|
ElMessage({ |
|
message: res.data.msg, |
|
type: 'success', |
|
}); |
|
|
|
OnLoad(); //添加成功初始化程序 |
|
} |
|
}); |
|
}) |
|
.catch(() => { |
|
// catch error |
|
}); |
|
}; |
|
// 完结按钮 |
|
const CompletionButton = () => { |
|
enddialog.value = true; //开启完结弹窗 |
|
}; |
|
// 异常类型事件 |
|
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) => { |
|
details.query[row.prop] = index; |
|
IndexTable(details.query); |
|
}; |
|
|
|
/** 表格表头时间选择 */ |
|
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 updateDetailQuery = (index, propName, obj) => { |
|
// // 更新或删除查询参数 |
|
// if (index) { |
|
// obj[propName] = index; |
|
// } else { |
|
// delete obj[propName]; |
|
// } |
|
// }; |
|
// const processRowProperty = (index, row, details) => { |
|
// const nameRegex = /(\w+)Name$/; // 捕获以'Name'结尾的属性名 |
|
// const match = row.prop.match(nameRegex); |
|
|
|
// // 如果属性以'Name'结尾，则更新相应的查询参数 |
|
// if (match) { |
|
// const basePropName = match[1]; // 获取不包含'Name'的属性名 |
|
// updateDetailQuery(index, basePropName, details.query); |
|
// } else { |
|
// updateDetailQuery(index, row.prop, details.query); |
|
// } |
|
// // 如果提供的index为假值，从query中删除原始属性 |
|
// if (!index) { |
|
// delete details.query[row.prop]; |
|
// } |
|
// }; |
|
|
|
|
|
/** 表格表头下拉框选择 */ |
|
const selectsc = (index, row) => { |
|
console.log('index :>> ', index); |
|
console.log('row :>> ', row); |
|
|
|
processRowProperty(index, row, details); |
|
console.log(details.query, details.query); |
|
IndexTable(details.query); |
|
}; |
|
|
|
function onLoad() {} |
|
|
|
/** 表格表头复选框选择 */ |
|
const selectionChange = list => { |
|
console.log(list); |
|
details.selectionList = list; |
|
}; |
|
|
|
/** 页码改变执行的回调 */ |
|
const currentChange = () => { |
|
console.log(''); |
|
}; |
|
|
|
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}`); |
|
} |
|
}); |
|
}; |
|
|
|
// 处理结果选择事件 |
|
</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: 50px; |
|
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 { |
|
margin-top: 24px; |
|
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; |
|
} |
|
</style>
|
|
|