pref_mail@163.com
1 year ago
30 changed files with 7676 additions and 1319 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
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue