pref_mail@163.com
1 year ago
28 changed files with 6511 additions and 1320 deletions
@ -0,0 +1,50 @@
|
||||
import request from '@/axios'; |
||||
|
||||
export const getList = (current, size, params) => { |
||||
return request({ |
||||
url: '/api/logpm-aftersales/aftersalesAppeal/list', |
||||
method: 'get', |
||||
params: { |
||||
...params, |
||||
current, |
||||
size, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const getDetail = (id) => { |
||||
return request({ |
||||
url: '/api/logpm-aftersales/aftersalesAppeal/detail', |
||||
method: 'get', |
||||
params: { |
||||
id |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const remove = (ids) => { |
||||
return request({ |
||||
url: '/api/logpm-aftersales/aftersalesAppeal/remove', |
||||
method: 'post', |
||||
params: { |
||||
ids, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const add = (row) => { |
||||
return request({ |
||||
url: '/api/logpm-aftersales/aftersalesAppeal/submit', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
export const update = (row) => { |
||||
return request({ |
||||
url: '/api/logpm-aftersales/aftersalesAppeal/submit', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
@ -0,0 +1,50 @@
|
||||
import request from '@/axios'; |
||||
|
||||
export const getList = (current, size, params) => { |
||||
return request({ |
||||
url: '/blade-aftersalesAppealPeople/aftersalesAppealPeople/list', |
||||
method: 'get', |
||||
params: { |
||||
...params, |
||||
current, |
||||
size, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const getDetail = (id) => { |
||||
return request({ |
||||
url: '/blade-aftersalesAppealPeople/aftersalesAppealPeople/detail', |
||||
method: 'get', |
||||
params: { |
||||
id |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const remove = (ids) => { |
||||
return request({ |
||||
url: '/blade-aftersalesAppealPeople/aftersalesAppealPeople/remove', |
||||
method: 'post', |
||||
params: { |
||||
ids, |
||||
} |
||||
}) |
||||
} |
||||
|
||||
export const add = (row) => { |
||||
return request({ |
||||
url: '/blade-aftersalesAppealPeople/aftersalesAppealPeople/submit', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
export const update = (row) => { |
||||
return request({ |
||||
url: '/blade-aftersalesAppealPeople/aftersalesAppealPeople/submit', |
||||
method: 'post', |
||||
data: row |
||||
}) |
||||
} |
||||
|
||||
@ -0,0 +1,12 @@
|
||||
import request from '@/axios'; |
||||
|
||||
/** |
||||
* 暂存单转运单信息查询 |
||||
*/ |
||||
export const postWarehouseFindWaybillInfo = data => { |
||||
return request({ |
||||
url: '/api/logpm-warehouse/warehouseWaybill/findWaybillInfo', |
||||
method: 'post', |
||||
data, |
||||
}); |
||||
}; |
||||
@ -0,0 +1,19 @@
|
||||
import request from '@/axios'; |
||||
|
||||
/** |
||||
* 获取运单列表 |
||||
* @param {number} current |
||||
* @param {number} size |
||||
* @param {*} params |
||||
* @returns |
||||
*/ |
||||
export const postWarehouseWaybillPageWaybillList = (page, params) => { |
||||
return request({ |
||||
url: '/api/logpm-warehouse/warehouseWaybill/pageWaybillList', |
||||
method: 'post', |
||||
data: { |
||||
...params, |
||||
...page, |
||||
}, |
||||
}); |
||||
}; |
||||
@ -0,0 +1,132 @@
|
||||
export default { |
||||
expand: false, |
||||
index: true, |
||||
border: true, |
||||
selection: true, |
||||
column: [ |
||||
{ |
||||
label: "租户号", |
||||
prop: "tenantId", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "主键", |
||||
prop: "id", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "创建人", |
||||
prop: "createUser", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "创建时间", |
||||
prop: "createTime", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "更新人", |
||||
prop: "updateUser", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "更新时间", |
||||
prop: "updateTime", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "状态", |
||||
prop: "status", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "是否已删除", |
||||
prop: "isDeleted", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "创建部门", |
||||
prop: "createDept", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留1", |
||||
prop: "reserve1", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留2", |
||||
prop: "reserve2", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留3", |
||||
prop: "reserve3", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留4", |
||||
prop: "reserve4", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留5", |
||||
prop: "reserve5", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "异常工单ID", |
||||
prop: "workOrderId", |
||||
}, |
||||
{ |
||||
label: "仓库ID", |
||||
prop: "warehouseId", |
||||
}, |
||||
{ |
||||
label: "申述理由", |
||||
prop: "reason", |
||||
}, |
||||
{ |
||||
label: "申述人", |
||||
prop: "claimant", |
||||
}, |
||||
{ |
||||
label: "申述人ID", |
||||
prop: "claimantUserId", |
||||
}, |
||||
{ |
||||
label: "类型;0 待处理 1 成立 2 不成立", |
||||
prop: "typesOf", |
||||
}, |
||||
{ |
||||
label: "审核原因", |
||||
prop: "handlingReason", |
||||
}, |
||||
{ |
||||
label: "处理人", |
||||
prop: "processedByName", |
||||
}, |
||||
{ |
||||
label: "处理时间", |
||||
prop: "processedDate", |
||||
}, |
||||
{ |
||||
label: "处理人ID", |
||||
prop: "processedById", |
||||
}, |
||||
] |
||||
} |
||||
@ -0,0 +1,108 @@
|
||||
export default { |
||||
expand: false, |
||||
index: true, |
||||
border: true, |
||||
selection: true, |
||||
column: [ |
||||
{ |
||||
label: "租户号", |
||||
prop: "tenantId", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "创建人", |
||||
prop: "createUser", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "创建时间", |
||||
prop: "createTime", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "更新人", |
||||
prop: "updateUser", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "更新时间", |
||||
prop: "updateTime", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "状态", |
||||
prop: "status", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "是否已删除", |
||||
prop: "isDeleted", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "创建部门", |
||||
prop: "createDept", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "主键", |
||||
prop: "id", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留1", |
||||
prop: "reserve1", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留2", |
||||
prop: "reserve2", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留3", |
||||
prop: "reserve3", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留4", |
||||
prop: "reserve4", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "预留5", |
||||
prop: "reserve5", |
||||
display: false, |
||||
hide: true, |
||||
}, |
||||
{ |
||||
label: "异常工单ID", |
||||
prop: "workOrderId", |
||||
}, |
||||
{ |
||||
label: "实际责任人名称", |
||||
prop: "actualPersonName", |
||||
}, |
||||
{ |
||||
label: "实际责任人ID", |
||||
prop: "actualPersonId", |
||||
}, |
||||
{ |
||||
label: "仓库ID", |
||||
prop: "warehouseId", |
||||
}, |
||||
] |
||||
} |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,853 @@
|
||||
<template> |
||||
<el-card class="box-card"> |
||||
<template #header> |
||||
<div class="card-header"> |
||||
<span>异常工单完结</span> |
||||
<el-button class="button">提交</el-button> |
||||
</div> |
||||
</template> |
||||
<el-form :model="endFrom" label-width="120px"> |
||||
<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> |
||||
|
||||
<div class="el_Transport"> |
||||
<el-form-item label="运损发现节点"> |
||||
<el-radio-group v-model="endFrom.transportloss" @change="TransportChange"> |
||||
<el-radio v-for="item in TransportlossList" :label="item.label">{{ |
||||
item.txt |
||||
}}</el-radio> |
||||
</el-radio-group> |
||||
</el-form-item> |
||||
</div> |
||||
|
||||
<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="DingTalk"> |
||||
<el-form-item label="钉钉流程号"> |
||||
<el-input v-model="endFrom.name" placeholder="请输入钉钉流程号" /> |
||||
</el-form-item> |
||||
</div> |
||||
|
||||
<div class="selector"> |
||||
<div class="el-form-item"> |
||||
<span class="el-form-item__label">处理方</span> |
||||
<el-select |
||||
v-model="endFrom.processor" |
||||
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> |
||||
</div> |
||||
</div> |
||||
<div class="selector"> |
||||
<div class="el-form-item selector"> |
||||
<span class="el-form-item__label">责任方</span> |
||||
<el-select |
||||
v-model="endFrom.duty" |
||||
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> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="selector"> |
||||
<div class="el-form-item selector"> |
||||
<span class="el-form-item__label">请选择</span> |
||||
<el-select |
||||
v-model="endFrom.result" |
||||
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> |
||||
</div> |
||||
|
||||
<div class="ProcessingResults" v-if="ProcessingList.length"> |
||||
<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.Claimtime" |
||||
type="datetime" |
||||
format="YYYY-MM-DD HH:mm:ss" |
||||
value-format="YYYY-MM-DD HH:mm:ss" |
||||
placeholder="请选择运理赔支付时间" |
||||
:disabled="FromDisabled" |
||||
/> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- 备注信息 --> |
||||
<div class="notes"> |
||||
<el-form-item label="备注"> |
||||
<el-input |
||||
v-model="endFrom.name" |
||||
type="textarea" |
||||
:autosize="{ minRows: 2, maxRows: 4 }" |
||||
placeholder="请输入备注" |
||||
/> |
||||
</el-form-item> |
||||
</div> |
||||
|
||||
<!-- 图片 --> |
||||
<div class="Transport_damage_photos"> |
||||
<span class="title">图片</span> |
||||
<el-upload |
||||
v-model:file-list="endFrom.packageImage" |
||||
list-type="picture-card" |
||||
:on-preview="pictureList" |
||||
:on-remove="ImgListRemove" |
||||
:action="doubledCount" |
||||
:on-success="ImgSuccess" |
||||
:before-upload="beforeAvatarUpload" |
||||
:headers="headers" |
||||
multiple |
||||
drag |
||||
> |
||||
<el-icon><Plus /></el-icon> |
||||
</el-upload> |
||||
|
||||
<el-dialog v-model="dialogVisible"> |
||||
<img w-full :src="dialogImageUrl" alt="Preview Image" /> |
||||
</el-dialog> |
||||
</div> |
||||
|
||||
<!-- 视频 --> |
||||
<div class="Transport_damage_photos void"> |
||||
<span class="title">视频</span> |
||||
<el-upload |
||||
class="upload-demo" |
||||
drag |
||||
:action="doubledCount" |
||||
:headers="headers" |
||||
:on-success="ViodSuccess" |
||||
> |
||||
<el-icon class="el-icon--upload"><upload-filled /></el-icon> |
||||
<div class="el-upload__text"> |
||||
点击上传 |
||||
<span v-if="endFrom['videoUrl'].url" class="PreviewVoid" @click.stop="Clickviod" |
||||
>点击预览</span |
||||
> |
||||
</div> |
||||
</el-upload> |
||||
</div> |
||||
<!-- 视频预览弹窗 --> |
||||
<el-dialog v-model="VideoPreviewStatus" title="视频预览" width="40%"> |
||||
<video height="360" controls class="video-player"> |
||||
<source |
||||
src="http://192.168.10.100:9000/627683-logpm/upload/20231204/1af505c923d87d827c2dc408832af5c9.mp4" |
||||
type="video/mp4" |
||||
/> |
||||
</video> |
||||
</el-dialog> |
||||
|
||||
<!-- 处理记录 --> |
||||
<div class="ProcessingRecords"> |
||||
<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-row> |
||||
<!-- 列表模块 --> |
||||
<tablecmt |
||||
:columnList="recordList" |
||||
:tableData="recorddata" |
||||
:loading="loadingObj.list" |
||||
@inputTxt="recordinputsc" |
||||
@timeCheck="recordtimesc" |
||||
@btnCheck="recordbtnsc" |
||||
@selectCheck="recordselectsc" |
||||
@selection="recordselectionChange" |
||||
> |
||||
</tablecmt> |
||||
</el-row> |
||||
</el-tab-pane> |
||||
</el-tabs> |
||||
</div> |
||||
|
||||
<!-- 完善信息 --> |
||||
<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">{{ 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> |
||||
</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="endFrom.arbitrate" |
||||
type="textarea" |
||||
:autosize="{ minRows: 5, maxRows: 4 }" |
||||
placeholder="请输入仲裁原因" |
||||
/> |
||||
</el-tab-pane> |
||||
</el-tabs> |
||||
</div> |
||||
</el-form> |
||||
</el-card> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { ElMessage } from 'element-plus'; |
||||
import { ElMessageBox } from 'element-plus'; |
||||
import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue'; |
||||
import { columnList, recordList } from '@/option/aftersales/vueTvemp.js'; |
||||
import { getToken } from '@/utils/auth'; |
||||
const endFrom = ref({ |
||||
packageImage: [ |
||||
//图片 |
||||
{ |
||||
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', |
||||
}, |
||||
], |
||||
videoUrl: {}, //视频 |
||||
}); |
||||
const videoUrl = ref(null); //视频预览 |
||||
const VideoPreviewStatus = ref(true); //视频预览状态 |
||||
const warehouseData = ref([]); //处理方 |
||||
import { getDetailWarehouse, getDeptWarehouse } from '@/api/basicdata/basicdataWarehouse'; //处理方 |
||||
const CompensationParty = ref([{ name: '', state: 0, num: 0, reason: '', cld: 1 }]); //收/赔 |
||||
const ProcessingList = ref([]); //处理结果 |
||||
const TransportlossList = ref([ |
||||
//运损发现节点 |
||||
{ |
||||
label: 1, |
||||
txt: '无', |
||||
}, |
||||
{ |
||||
label: 2, |
||||
txt: '在库操作环节', |
||||
}, |
||||
{ |
||||
label: 3, |
||||
txt: '入库环节', |
||||
}, |
||||
{ |
||||
label: 4, |
||||
txt: '配送环节', |
||||
}, |
||||
{ |
||||
label: 5, |
||||
txt: '中转卸车环节', |
||||
}, |
||||
{ |
||||
label: 6, |
||||
txt: '安装环节', |
||||
}, |
||||
]); //运损发现节点 |
||||
const ProcessingResults = ref([ |
||||
{ |
||||
value: '0', |
||||
label: '维修', |
||||
}, |
||||
{ |
||||
value: '1', |
||||
label: '补漆', |
||||
}, |
||||
{ |
||||
value: '2', |
||||
label: '下补单', |
||||
}, |
||||
{ |
||||
value: '3', |
||||
label: '赔付运费', |
||||
}, |
||||
{ |
||||
value: '4', |
||||
label: '用库存', |
||||
}, |
||||
{ |
||||
value: '5', |
||||
label: '赔商家', |
||||
}, |
||||
{ |
||||
value: '6', |
||||
label: '赔客户', |
||||
}, |
||||
]); |
||||
// 运损触发事件 |
||||
const details = reactive({ |
||||
/** 是否开启搜索 */ |
||||
search: false, |
||||
/** 表格搜索条件 */ |
||||
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: [ |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
{ entryTime: '测试' }, |
||||
], |
||||
/** 页面loading */ |
||||
loadingObj: { |
||||
/** 列表加载loading */ |
||||
list: false, |
||||
packageListLoading: false, |
||||
}, |
||||
/** 列表复选框选中的数据 */ |
||||
selectionList: [], |
||||
/** 是否显示设置表格 */ |
||||
drawerShow: false, |
||||
/** 分页参数 */ |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 5, |
||||
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 TransportChange = val => { |
||||
console.log(val, '运损触发事件'); |
||||
}; |
||||
// 页面初始化数据 |
||||
const onLoad = () => { |
||||
getDeptWarehouse({}).then(res => { |
||||
console.log(res, '处理方'); |
||||
res.data.data.forEach(item => { |
||||
warehouseData.value.push({ |
||||
value: item.id, |
||||
label: item.name, |
||||
}); |
||||
}); |
||||
}); |
||||
}; |
||||
onLoad(); |
||||
const changeProcessingResults = val => { |
||||
// 首先删除取消的项目 |
||||
ProcessingList.value = ProcessingList.value.filter(item => val.includes(item.state - 1)); |
||||
|
||||
// 然后添加或保持新的项目 |
||||
val.forEach(num => { |
||||
let newItem = { input: 0, 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}`); |
||||
} |
||||
}); |
||||
}; |
||||
|
||||
// 图片上传必须携带TOKEN |
||||
const headers = computed(() => { |
||||
return { 'Blade-Auth': 'Bearer ' + getToken() }; |
||||
}); |
||||
// 图片上传接口 |
||||
const doubledCount = computed(() => { |
||||
return '/api/blade-resource/oss/endpoint/put-file'; |
||||
}); |
||||
// 图片上传成功回调函数 |
||||
const ImgSuccess = (response, uploadFile) => { |
||||
if (response.success == true) { |
||||
console.log(response); |
||||
|
||||
endFrom.value['packageImage'].push({ |
||||
name: response.data.originalName, |
||||
url: response.data.link, |
||||
}); |
||||
console.log(endFrom.value['packageImage'], '图片列表'); |
||||
} |
||||
}; |
||||
// 视频上传成功 |
||||
const ViodSuccess = response => { |
||||
if (response.success == true) { |
||||
console.log(response); |
||||
endFrom.value['videoUrl'].name = response.data.originalName; |
||||
endFrom.value['videoUrl'].url = response.data.link; |
||||
console.log(endFrom.value['videoUrl']); |
||||
} |
||||
}; |
||||
// 上传图片规则 |
||||
const beforeAvatarUpload = rawFile => { |
||||
if (!/^image\/(png|jpeg|gif)$|^video\/mp4$/.test(rawFile.type)) { |
||||
ElMessage.error('上传格式只支持 png、jpeg、gif 和 mp4 类型!'); |
||||
return false; |
||||
} else if (rawFile.size / 1024 / 1024 > 40) { |
||||
ElMessage.error('上传大小不能超过 40MB!'); |
||||
return false; |
||||
} |
||||
return true; |
||||
}; |
||||
// 点击图片列表回调 |
||||
const pictureList = val => { |
||||
console.log(val, '图片列表'); |
||||
}; |
||||
// 点击图片移除 |
||||
const ImgListRemove = val => { |
||||
console.log(val, '移除图片'); |
||||
}; |
||||
// 查看已上传视频列表 |
||||
const Clickviod = () => { |
||||
console.log('点击了预览'); |
||||
VideoPreviewStatus.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); |
||||
}; |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.card-header { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
} |
||||
|
||||
.text { |
||||
font-size: 14px; |
||||
} |
||||
|
||||
.item { |
||||
margin-bottom: 18px; |
||||
} |
||||
|
||||
.box-card { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
.el-form { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
justify-content: flex-start; |
||||
:deep(.el-form-item) { |
||||
height: 2.39583vw; |
||||
display: flex; |
||||
align-items: center; |
||||
margin: 0; |
||||
margin-bottom: 0.9375vw; |
||||
flex: 1 0 30%; |
||||
} |
||||
:deep(.el-form-item__label) { |
||||
width: 100px !important; |
||||
margin-left: 26px; |
||||
} |
||||
:deep(.el-input--prefix) { |
||||
width: 100%; |
||||
height: 28.68px !important; |
||||
} |
||||
} |
||||
.el_Transport { |
||||
width: 100%; |
||||
} |
||||
.DingTalk { |
||||
width: 100%; |
||||
} |
||||
.selector { |
||||
width: 100%; |
||||
:deep(.el-select) { |
||||
width: 100%; |
||||
} |
||||
} |
||||
.ProcessingResults { |
||||
width: 100%; |
||||
height: 260px; |
||||
border: 1px solid #ccc; |
||||
position: relative; |
||||
padding: 26px; |
||||
box-sizing: border-box; |
||||
margin-top: 20px; |
||||
color: #606266; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
.title { |
||||
position: absolute; |
||||
top: -20px; |
||||
left: 20px; |
||||
font-size: 26px; |
||||
background-color: #fff; |
||||
} |
||||
.Listadmiration { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
.name { |
||||
display: flex; |
||||
margin: 10px 5%; |
||||
|
||||
span { |
||||
display: block; |
||||
width: 90px; |
||||
color: #606266; |
||||
font-size: 16px; |
||||
} |
||||
} |
||||
} |
||||
.lptime { |
||||
display: flex; |
||||
.name { |
||||
width: 126px; |
||||
color: #606266; |
||||
} |
||||
.el-input { |
||||
width: auto; |
||||
} |
||||
:deep(.el-input--prefix) { |
||||
width: 200px; |
||||
} |
||||
} |
||||
} |
||||
.notes { |
||||
width: 100%; |
||||
} |
||||
.Transport_damage_photos { |
||||
width: 100%; |
||||
display: flex; |
||||
margin-left: 26px; |
||||
.title { |
||||
width: 100px; |
||||
color: #606266; |
||||
font-size: 14px; |
||||
margin-bottom: 9px; |
||||
display: block; |
||||
} |
||||
:deep(.el-upload-dragger) { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
} |
||||
} |
||||
.upload-demo { |
||||
width: 100%; |
||||
} |
||||
.box-card { |
||||
overflow-y: scroll; |
||||
} |
||||
.void { |
||||
:deep(.el-upload-list) { |
||||
display: none; |
||||
} |
||||
} |
||||
.PreviewVoid { |
||||
font-weight: bold; |
||||
color: #172e60; |
||||
} |
||||
|
||||
.video-player { |
||||
width: 100%; |
||||
} |
||||
.ProcessingRecords { |
||||
margin-left: 26px; |
||||
width: 100%; |
||||
margin-top: 20px; |
||||
.title { |
||||
font-size: 16px; |
||||
color: #606266; |
||||
width: 100px; |
||||
} |
||||
:deep(.custom-tabs-label) { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
} |
||||
.el-row { |
||||
height: 300px; |
||||
} |
||||
:deep(.maboxhi) { |
||||
height: 300px !important; |
||||
} |
||||
.Improveinformation { |
||||
margin-top: 20px; |
||||
margin-left: 26px; |
||||
width: 100%; |
||||
:deep(.custom-tabs-label) { |
||||
display: flex; |
||||
align-items: center; |
||||
} |
||||
} |
||||
.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; |
||||
} |
||||
} |
||||
.arbitrate { |
||||
width: 100%; |
||||
margin-top: 20px; |
||||
margin-left: 26px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,318 @@
|
||||
<template> |
||||
<basic-container> |
||||
<div class="avue-crud"> |
||||
<el-row :hidden="!search" style="padding:6px 18px"> |
||||
<!-- 查询模块 --> |
||||
<el-form :inline="true" :model="query"> |
||||
<!-- 查询按钮 --> |
||||
<el-form-item> |
||||
<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 v-if="this.permissionList.addBtn" type="primary" icon="el-icon-plus" @click="handleAdd">新 增</el-button> |
||||
<el-button v-if="this.permissionList.delBtn" type="danger" icon="el-icon-delete" @click="handleDelete" plain>删 除</el-button> |
||||
</div> |
||||
<!-- 头部右侧按钮模块 --> |
||||
<div class="avue-crud__right"> |
||||
<el-button icon="el-icon-refresh" @click="searchChange" circle></el-button> |
||||
<el-button icon="el-icon-search" @click="searchHide" circle></el-button> |
||||
</div> |
||||
</div> |
||||
</el-row> |
||||
<el-row> |
||||
<!-- 列表模块 --> |
||||
<el-table ref="table" v-loading="loading" |
||||
@selection-change="selectionChange" |
||||
:data="data" |
||||
:height="height" |
||||
style="width: 100%" |
||||
:border="option.border"> |
||||
<el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column> |
||||
<el-table-column type="expand" v-if="option.expand" align="center"></el-table-column> |
||||
<el-table-column v-if="option.index" label="#" type="index" width="50" align="center"> |
||||
</el-table-column> |
||||
<template v-for="(item,index) in option.column"> |
||||
<!-- table字段 --> |
||||
<el-table-column v-if="item.hide!==true" |
||||
:prop="item.prop" |
||||
:label="item.label" |
||||
:width="item.width" |
||||
:key="index"> |
||||
</el-table-column> |
||||
</template> |
||||
<!-- 操作栏模块 --> |
||||
<el-table-column prop="menu" label="操作" :width="220" align="center"> |
||||
<template #="{row}"> |
||||
<el-button v-if="this.permissionList.viewBtn" type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button> |
||||
<el-button v-if="this.permissionList.editBtn" type="primary" text icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button> |
||||
<el-button v-if="this.permissionList.delBtn" type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-row> |
||||
<el-row> |
||||
<div class="avue-crud__pagination" style="width:100%"> |
||||
<!-- 分页模块 --> |
||||
<el-pagination align="right" |
||||
background |
||||
@size-change="sizeChange" |
||||
@current-change="currentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 20, 30, 40, 50, 100]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.total"> |
||||
</el-pagination> |
||||
</div> |
||||
</el-row> |
||||
<!-- 表单模块 --> |
||||
<el-dialog :title="title" |
||||
v-model="box" |
||||
width="50%" |
||||
:before-close="beforeClose" |
||||
append-to-body> |
||||
<el-form :disabled="view" ref="form" :model="form" label-width="80px"> |
||||
<!-- 表单字段 --> |
||||
<el-form-item label="异常工单ID" prop="workOrderId"> |
||||
<el-input v-model="form.workOrderId" placeholder="请输入异常工单ID"/> |
||||
</el-form-item> |
||||
<el-form-item label="仓库ID" prop="warehouseId"> |
||||
<el-input v-model="form.warehouseId" placeholder="请输入仓库ID"/> |
||||
</el-form-item> |
||||
<el-form-item label="申述理由" prop="reason"> |
||||
<el-input v-model="form.reason" placeholder="请输入申述理由"/> |
||||
</el-form-item> |
||||
<el-form-item label="申述人" prop="claimant"> |
||||
<el-input v-model="form.claimant" placeholder="请输入申述人"/> |
||||
</el-form-item> |
||||
<el-form-item label="申述人ID" prop="claimantUserId"> |
||||
<el-input v-model="form.claimantUserId" placeholder="请输入申述人ID"/> |
||||
</el-form-item> |
||||
<el-form-item label="类型;0 待处理 1 成立 2 不成立" prop="typesOf"> |
||||
<el-input v-model="form.typesOf" placeholder="请输入类型;0 待处理 1 成立 2 不成立"/> |
||||
</el-form-item> |
||||
<el-form-item label="审核原因" prop="handlingReason"> |
||||
<el-input v-model="form.handlingReason" placeholder="请输入审核原因"/> |
||||
</el-form-item> |
||||
<el-form-item label="处理人" prop="processedByName"> |
||||
<el-input v-model="form.processedByName" placeholder="请输入处理人"/> |
||||
</el-form-item> |
||||
<el-form-item label="处理时间" prop="processedDate"> |
||||
<el-input v-model="form.processedDate" placeholder="请输入处理时间"/> |
||||
</el-form-item> |
||||
<el-form-item label="处理人ID" prop="processedById"> |
||||
<el-input v-model="form.processedById" placeholder="请输入处理人ID"/> |
||||
</el-form-item> |
||||
</el-form> |
||||
<!-- 表单按钮 --> |
||||
<template #footer> |
||||
<span v-if="!view" class="dialog-footer"> |
||||
<el-button type="primary" icon="el-icon-circle-check" @click="handleSubmit">提 交</el-button> |
||||
<el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button> |
||||
</span> |
||||
</template> |
||||
</el-dialog> |
||||
</div> |
||||
</basic-container> |
||||
</template> |
||||
|
||||
<script> |
||||
import { getList, getDetail, add, update, remove } from "@/api/aftersales/aftersalesAppeal"; |
||||
import option from "@/option/aftersales/aftersalesAppeal"; |
||||
import { mapGetters } from "vuex"; |
||||
|
||||
export default { |
||||
data () { |
||||
return { |
||||
height: 0, |
||||
// 弹框标题 |
||||
title: '', |
||||
// 是否展示弹框 |
||||
box: false, |
||||
// 是否显示查询 |
||||
search: true, |
||||
// 加载中 |
||||
loading: true, |
||||
// 是否为查看模式 |
||||
view: false, |
||||
// 查询信息 |
||||
query: {}, |
||||
// 分页信息 |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
total: 40 |
||||
}, |
||||
// 表单数据 |
||||
form: {}, |
||||
// 选择行 |
||||
selectionList: [], |
||||
// 表单配置 |
||||
option: option, |
||||
// 表单列表 |
||||
data: [], |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.init(); |
||||
this.onLoad(this.page); |
||||
}, |
||||
computed: { |
||||
...mapGetters(["permission"]), |
||||
permissionList() { |
||||
return { |
||||
addBtn: this.validData(this.permission.param_add, false), |
||||
viewBtn: this.validData(this.permission.param_view, false), |
||||
delBtn: this.validData(this.permission.param_delete, false), |
||||
editBtn: this.validData(this.permission.param_edit, false), |
||||
}; |
||||
}, |
||||
ids() { |
||||
let ids = []; |
||||
this.selectionList.forEach(ele => { |
||||
ids.push(ele.id); |
||||
}); |
||||
return ids.join(","); |
||||
} |
||||
}, |
||||
methods: { |
||||
init() { |
||||
this.height = this.setPx(document.body.clientHeight - 340); |
||||
}, |
||||
searchHide() { |
||||
this.search = !this.search; |
||||
}, |
||||
searchChange() { |
||||
this.onLoad(this.page); |
||||
}, |
||||
searchReset() { |
||||
this.query = {}; |
||||
this.page.currentPage = 1; |
||||
this.onLoad(this.page); |
||||
}, |
||||
handleSubmit() { |
||||
if (!this.form.id) { |
||||
add(this.form).then(() => { |
||||
this.box = false; |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
} else { |
||||
update(this.form).then(() => { |
||||
this.box = false; |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}) |
||||
} |
||||
}, |
||||
handleAdd(){ |
||||
this.title = '新增' |
||||
this.form = {} |
||||
this.box = true |
||||
}, |
||||
handleEdit(row) { |
||||
this.title = '编辑' |
||||
this.box = true |
||||
getDetail(row.id).then(res => { |
||||
this.form = res.data.data; |
||||
}); |
||||
}, |
||||
handleView(row) { |
||||
this.title = '查看' |
||||
this.view = true; |
||||
this.box = true; |
||||
getDetail(row.id).then(res => { |
||||
this.form = res.data.data; |
||||
}); |
||||
}, |
||||
handleDelete() { |
||||
if (this.selectionList.length === 0) { |
||||
this.$message.warning("请选择至少一条数据"); |
||||
return; |
||||
} |
||||
this.$confirm("确定将选择数据删除?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
return remove(this.ids); |
||||
}) |
||||
.then(() => { |
||||
this.selectionClear(); |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
}, |
||||
rowDel(row) { |
||||
this.$confirm("确定将选择数据删除?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
return remove(row.id); |
||||
}) |
||||
.then(() => { |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
}, |
||||
beforeClose (done) { |
||||
done() |
||||
this.form = {}; |
||||
this.view = false; |
||||
}, |
||||
selectionChange(list) { |
||||
this.selectionList = list; |
||||
}, |
||||
selectionClear() { |
||||
this.selectionList = []; |
||||
this.$refs.table.clearSelection(); |
||||
}, |
||||
currentChange(currentPage) { |
||||
this.page.currentPage = currentPage; |
||||
this.onLoad(this.page); |
||||
}, |
||||
sizeChange(pageSize) { |
||||
this.page.pageSize = pageSize; |
||||
this.onLoad(this.page); |
||||
}, |
||||
onLoad(page, params = {}) { |
||||
this.loading = true; |
||||
|
||||
const { |
||||
} = this.query; |
||||
|
||||
let values = { |
||||
}; |
||||
|
||||
getList(page.currentPage, page.pageSize, values).then(res => { |
||||
const data = res.data.data; |
||||
this.page.total = data.total; |
||||
this.data = data.records; |
||||
this.loading = false; |
||||
this.selectionClear(); |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
@ -0,0 +1,300 @@
|
||||
<template> |
||||
<basic-container> |
||||
<div class="avue-crud"> |
||||
<el-row :hidden="!search" style="padding:6px 18px"> |
||||
<!-- 查询模块 --> |
||||
<el-form :inline="true" :model="query"> |
||||
<!-- 查询按钮 --> |
||||
<el-form-item> |
||||
<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 v-if="this.permissionList.addBtn" type="primary" icon="el-icon-plus" @click="handleAdd">新 增</el-button> |
||||
<el-button v-if="this.permissionList.delBtn" type="danger" icon="el-icon-delete" @click="handleDelete" plain>删 除</el-button> |
||||
</div> |
||||
<!-- 头部右侧按钮模块 --> |
||||
<div class="avue-crud__right"> |
||||
<el-button icon="el-icon-refresh" @click="searchChange" circle></el-button> |
||||
<el-button icon="el-icon-search" @click="searchHide" circle></el-button> |
||||
</div> |
||||
</div> |
||||
</el-row> |
||||
<el-row> |
||||
<!-- 列表模块 --> |
||||
<el-table ref="table" v-loading="loading" |
||||
@selection-change="selectionChange" |
||||
:data="data" |
||||
:height="height" |
||||
style="width: 100%" |
||||
:border="option.border"> |
||||
<el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column> |
||||
<el-table-column type="expand" v-if="option.expand" align="center"></el-table-column> |
||||
<el-table-column v-if="option.index" label="#" type="index" width="50" align="center"> |
||||
</el-table-column> |
||||
<template v-for="(item,index) in option.column"> |
||||
<!-- table字段 --> |
||||
<el-table-column v-if="item.hide!==true" |
||||
:prop="item.prop" |
||||
:label="item.label" |
||||
:width="item.width" |
||||
:key="index"> |
||||
</el-table-column> |
||||
</template> |
||||
<!-- 操作栏模块 --> |
||||
<el-table-column prop="menu" label="操作" :width="220" align="center"> |
||||
<template #="{row}"> |
||||
<el-button v-if="this.permissionList.viewBtn" type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button> |
||||
<el-button v-if="this.permissionList.editBtn" type="primary" text icon="el-icon-edit" @click="handleEdit(row)">编辑</el-button> |
||||
<el-button v-if="this.permissionList.delBtn" type="primary" text icon="el-icon-delete" @click="rowDel(row)">删除</el-button> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-row> |
||||
<el-row> |
||||
<div class="avue-crud__pagination" style="width:100%"> |
||||
<!-- 分页模块 --> |
||||
<el-pagination align="right" |
||||
background |
||||
@size-change="sizeChange" |
||||
@current-change="currentChange" |
||||
:current-page="page.currentPage" |
||||
:page-sizes="[10, 20, 30, 40, 50, 100]" |
||||
:page-size="page.pageSize" |
||||
layout="total, sizes, prev, pager, next, jumper" |
||||
:total="page.total"> |
||||
</el-pagination> |
||||
</div> |
||||
</el-row> |
||||
<!-- 表单模块 --> |
||||
<el-dialog :title="title" |
||||
v-model="box" |
||||
width="50%" |
||||
:before-close="beforeClose" |
||||
append-to-body> |
||||
<el-form :disabled="view" ref="form" :model="form" label-width="80px"> |
||||
<!-- 表单字段 --> |
||||
<el-form-item label="异常工单ID" prop="workOrderId"> |
||||
<el-input v-model="form.workOrderId" placeholder="请输入异常工单ID"/> |
||||
</el-form-item> |
||||
<el-form-item label="实际责任人名称" prop="actualPersonName"> |
||||
<el-input v-model="form.actualPersonName" placeholder="请输入实际责任人名称"/> |
||||
</el-form-item> |
||||
<el-form-item label="实际责任人ID" prop="actualPersonId"> |
||||
<el-input v-model="form.actualPersonId" placeholder="请输入实际责任人ID"/> |
||||
</el-form-item> |
||||
<el-form-item label="仓库ID" prop="warehouseId"> |
||||
<el-input v-model="form.warehouseId" placeholder="请输入仓库ID"/> |
||||
</el-form-item> |
||||
</el-form> |
||||
<!-- 表单按钮 --> |
||||
<template #footer> |
||||
<span v-if="!view" class="dialog-footer"> |
||||
<el-button type="primary" icon="el-icon-circle-check" @click="handleSubmit">提 交</el-button> |
||||
<el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button> |
||||
</span> |
||||
</template> |
||||
</el-dialog> |
||||
</div> |
||||
</basic-container> |
||||
</template> |
||||
|
||||
<script> |
||||
import { getList, getDetail, add, update, remove } from "@/api/aftersales/aftersalesAppealPeople"; |
||||
import option from "@/option/aftersales/aftersalesAppealPeople"; |
||||
import { mapGetters } from "vuex"; |
||||
|
||||
export default { |
||||
data () { |
||||
return { |
||||
height: 0, |
||||
// 弹框标题 |
||||
title: '', |
||||
// 是否展示弹框 |
||||
box: false, |
||||
// 是否显示查询 |
||||
search: true, |
||||
// 加载中 |
||||
loading: true, |
||||
// 是否为查看模式 |
||||
view: false, |
||||
// 查询信息 |
||||
query: {}, |
||||
// 分页信息 |
||||
page: { |
||||
currentPage: 1, |
||||
pageSize: 10, |
||||
total: 40 |
||||
}, |
||||
// 表单数据 |
||||
form: {}, |
||||
// 选择行 |
||||
selectionList: [], |
||||
// 表单配置 |
||||
option: option, |
||||
// 表单列表 |
||||
data: [], |
||||
} |
||||
}, |
||||
mounted() { |
||||
this.init(); |
||||
this.onLoad(this.page); |
||||
}, |
||||
computed: { |
||||
...mapGetters(["permission"]), |
||||
permissionList() { |
||||
return { |
||||
addBtn: this.validData(this.permission.param_add, false), |
||||
viewBtn: this.validData(this.permission.param_view, false), |
||||
delBtn: this.validData(this.permission.param_delete, false), |
||||
editBtn: this.validData(this.permission.param_edit, false), |
||||
}; |
||||
}, |
||||
ids() { |
||||
let ids = []; |
||||
this.selectionList.forEach(ele => { |
||||
ids.push(ele.id); |
||||
}); |
||||
return ids.join(","); |
||||
} |
||||
}, |
||||
methods: { |
||||
init() { |
||||
this.height = this.setPx(document.body.clientHeight - 340); |
||||
}, |
||||
searchHide() { |
||||
this.search = !this.search; |
||||
}, |
||||
searchChange() { |
||||
this.onLoad(this.page); |
||||
}, |
||||
searchReset() { |
||||
this.query = {}; |
||||
this.page.currentPage = 1; |
||||
this.onLoad(this.page); |
||||
}, |
||||
handleSubmit() { |
||||
if (!this.form.id) { |
||||
add(this.form).then(() => { |
||||
this.box = false; |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
} else { |
||||
update(this.form).then(() => { |
||||
this.box = false; |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}) |
||||
} |
||||
}, |
||||
handleAdd(){ |
||||
this.title = '新增' |
||||
this.form = {} |
||||
this.box = true |
||||
}, |
||||
handleEdit(row) { |
||||
this.title = '编辑' |
||||
this.box = true |
||||
getDetail(row.id).then(res => { |
||||
this.form = res.data.data; |
||||
}); |
||||
}, |
||||
handleView(row) { |
||||
this.title = '查看' |
||||
this.view = true; |
||||
this.box = true; |
||||
getDetail(row.id).then(res => { |
||||
this.form = res.data.data; |
||||
}); |
||||
}, |
||||
handleDelete() { |
||||
if (this.selectionList.length === 0) { |
||||
this.$message.warning("请选择至少一条数据"); |
||||
return; |
||||
} |
||||
this.$confirm("确定将选择数据删除?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
return remove(this.ids); |
||||
}) |
||||
.then(() => { |
||||
this.selectionClear(); |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
}, |
||||
rowDel(row) { |
||||
this.$confirm("确定将选择数据删除?", { |
||||
confirmButtonText: "确定", |
||||
cancelButtonText: "取消", |
||||
type: "warning" |
||||
}) |
||||
.then(() => { |
||||
return remove(row.id); |
||||
}) |
||||
.then(() => { |
||||
this.onLoad(this.page); |
||||
this.$message({ |
||||
type: "success", |
||||
message: "操作成功!" |
||||
}); |
||||
}); |
||||
}, |
||||
beforeClose (done) { |
||||
done() |
||||
this.form = {}; |
||||
this.view = false; |
||||
}, |
||||
selectionChange(list) { |
||||
this.selectionList = list; |
||||
}, |
||||
selectionClear() { |
||||
this.selectionList = []; |
||||
this.$refs.table.clearSelection(); |
||||
}, |
||||
currentChange(currentPage) { |
||||
this.page.currentPage = currentPage; |
||||
this.onLoad(this.page); |
||||
}, |
||||
sizeChange(pageSize) { |
||||
this.page.pageSize = pageSize; |
||||
this.onLoad(this.page); |
||||
}, |
||||
onLoad(page, params = {}) { |
||||
this.loading = true; |
||||
|
||||
const { |
||||
} = this.query; |
||||
|
||||
let values = { |
||||
}; |
||||
|
||||
getList(page.currentPage, page.pageSize, values).then(res => { |
||||
const data = res.data.data; |
||||
this.page.total = data.total; |
||||
this.data = data.records; |
||||
this.loading = false; |
||||
this.selectionClear(); |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue