emis-frontend/src/views/emis/emisWaybillProblemInfo/problemEntry.vue

650 lines
24 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<!-- <search-form :model="queryParams" ref="queryForm" size="small" :maxShow="6" label-width="68px" v-show="showSearch" @search="handleQuery" @reset="resetQuery"> -->
<!-- <Form ref="refForm" :model="queryParams" label-width="68px" size="small" :inline="true" > -->
<el-row :gutter="0">
<!-- <el-form ref="form" size="mini" :model="queryParams" :rules="rules" label-width="80px"> -->
<el-form ref="form" size="mini" :model="queryParams" label-width="80px">
<el-col :span="8">
<el-form-item :label="$t('通知网点')" prop="xxx" label-width="70px">
<EmisSiteSimplePicker v-model="queryParams.xxx" @onChange="onScanSiteSelect" ></EmisSiteSimplePicker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('问题类型')" prop="problemType">
<ProblemTypePicker v-model="queryParams.problemType" @onChange="onproblemTypeSelect" ></ProblemTypePicker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="运单号" prop="billCode">
<el-input
v-model="queryParams.billCode"
:placeholder="$t('请输入')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="问题原因" prop="problemCause">
<el-input
v-model="form.problemCause"
:placeholder="$t('请输入')"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="问题图片" prop="xxx">
<ImageOneUpload v-model="form.problemType" @input="handleInput" ></ImageOneUpload>
</el-form-item>
</el-col>
<!-- <el-row :gutter="10" class="mb8"> -->
<el-col :span="1.5">
<el-button
type="primary"
plain
icon=""
size="mini"
@click="handleEdit"
v-hasPermi="['emis:emisWaybillProblemInfo:edit']"
>保存</el-button>
</el-col>
<!-- </el-row> -->
</el-form>
<!-- </Form> -->
</el-row>
<!-- </search-form> -->
<div>
</div>
<xd-table v-loading="loading"
border stripe
size="small"
:data="emisWaybillProblemInfoList"
:showSearch.sync="showSearch"
:queryParams="queryParams"
:total="total"
@queryTable="getList"
@selection-change="handleSelectionChange"
@sort-change="handleSortChange"
>
<div slot="toolbar">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
:disabled="multiple"
@click="handleQuery"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>上传</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['emis:emisTmsScanRecord:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleQuery"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>批量扫描</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleQuery"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>下载导入模版</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleQuery"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>导入</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleQuery"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>批量登记</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
size="mini"
@click="handleQuery"
v-hasPermi="['emis:emisTmsScanRecord:add']"
>批量修改</el-button>
</el-col>
</el-row>
</div>
<el-table-column type="selection" width="55" align="center" />
<el-table-column :label="$t('校验信息')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('运单号')" align="center" prop="billCode" min-width="100" />
<el-table-column :label="$t('通知网点')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('登记网点')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('登记日期')" align="center" prop="xxx" min-width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.xxx) }}</span>
</template>
</el-table-column>
</el-table-column>
<el-table-column :label="$t('问题件类型')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('登记人')" align="center" prop="registerMan" min-width="100" />
<el-table-column :label="$t('图片路径')" align="center" prop="picUrl" min-width="100" />
<el-table-column :label="$t('问题件原因')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('数据来源')" align="center" prop="xxx" min-width="100" />
<el-table-column :label="$t('所属业务员')" align="center" prop="marketMan" min-width="100" />
<el-table-column :label="$t('业务员编号')" align="center" prop="xxx" min-width="100" />
</xd-table>
<!-- 添加或修改问题件对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag :close-on-click-modal="false" append-to-body>
<el-row :gutter="0">
<el-form ref="form" :model="form" size="mini" label-width="80px">
<!-- <el-form ref="form" :model="form" :rules="rules" size="mini" label-width="80px"> -->
<el-col :span="24">
<el-form-item :label="$t('运单号')" prop="billCode">
<el-input v-model="form.billCode" placeholder="请输入运单号" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('问题类型:')" prop="problemType">
<el-input v-model="form.problemType" placeholder="请输入问题类型:" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('问题件标题')" prop="problemTitle">
<el-input v-model="form.problemTitle" placeholder="请输入问题件标题" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('问题件原因')" prop="problemCause">
<el-input v-model="form.problemCause" placeholder="请输入问题件原因" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('发送站点')" prop="sendSite">
<el-input v-model="form.sendSite" placeholder="请输入发送站点" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('发送站点代码')" prop="sendSiteCode">
<el-input v-model="form.sendSiteCode" placeholder="请输入发送站点代码" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('登记人代码')" prop="registerManCode">
<el-input v-model="form.registerManCode" placeholder="请输入登记人代码" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('登记人所在部门')" prop="registerManDept">
<el-input v-model="form.registerManDept" placeholder="请输入登记人所在部门" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('登记站点代码')" prop="registerSiteCode">
<el-input v-model="form.registerSiteCode" placeholder="请输入登记站点代码" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('登记时间')" prop="registerDate">
<el-date-picker clearable
v-model="form.registerDate"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择登记时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('登记保存时间')" prop="registerSaveDate">
<el-input v-model="form.registerSaveDate" placeholder="请输入登记保存时间" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('数据来源')" prop="dataFrom">
<el-input v-model="form.dataFrom" placeholder="请输入数据来源" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('状态')" prop="status">
<el-input v-model="form.status" placeholder="请输入状态" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('是否寄件网点发起')" prop="isSendSiteRegister">
<el-input v-model="form.isSendSiteRegister" placeholder="请输入是否寄件网点发起" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('是否回复')" prop="blReversion">
<el-input v-model="form.blReversion" placeholder="请输入是否回复" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('回复内容')" prop="reversionStr">
<el-input v-model="form.reversionStr" placeholder="请输入回复内容" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('回复人')" prop="reversionMan">
<el-input v-model="form.reversionMan" placeholder="请输入回复人" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('回复人代码')" prop="reversionManCode">
<el-input v-model="form.reversionManCode" placeholder="请输入回复人代码" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('回复日期')" prop="reversionDate">
<el-input v-model="form.reversionDate" placeholder="请输入回复日期" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('是否检查')" prop="blCheckok">
<el-input v-model="form.blCheckok" placeholder="请输入是否检查" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('是否查看')" prop="blSee">
<el-input v-model="form.blSee" placeholder="请输入是否查看" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('文件路径')" prop="filePath">
<el-input v-model="form.filePath" placeholder="请输入文件路径" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('修改站点代码')" prop="modifySiteCode">
<el-input v-model="form.modifySiteCode" placeholder="请输入修改站点代码" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('删除标志(0代表存在')" prop="delFlag">
<el-input v-model="form.delFlag" placeholder="请输入删除标志(0代表存在" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('备注')" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-col>
<!--
<el-col :span="24" v-show="moreInputVisible" > </el-col>
<el-col :span="24">
<el-divider content-position="right" @click="handleShowMoreInput" >更多信息[+]</el-divider>
</el-col>
-->
</el-form>
</el-row>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listEmisWaybillProblemInfo, getEmisWaybillProblemInfo, delEmisWaybillProblemInfo, addEmisWaybillProblemInfo, updateEmisWaybillProblemInfo } from "@/api/emis/emisWaybillProblemInfo";
import elDateSimplePicker from '@/components/DatePickerAdv/elDateSimplePicker';
import emisWaybillProblemInfoView from '@/views/emis/emisWaybillProblemInfo/emisWaybillProblemInfoView';
import emisWaybillProblemInfoForm from '@/views/emis/emisWaybillProblemInfo/emisWaybillProblemInfoForm';
import EmisSiteSimplePicker from '@/views/emis/EmisBaseTools/EmisSiteSimplePicker.vue';
import ProblemTypePicker from '@/views/emis/EmisBaseTools/ProblemTypePicker.vue';
import { Form, FormItem, Button } from 'element-ui'
export default {
name: "ProblemEntry",
components: { EmisSiteSimplePicker, ProblemTypePicker, Form },
dicts: ['emis_question_type'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 创建时间搜索
dateTimeRange:[],
// 总条数
total: 0,
// 问题件表格数据
emisWaybillProblemInfoList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
problemTypeValue:{},
openForm: false,
titleForm: "",
titleEmisWaybillProblemInfo: "",
openEmisWaybillProblemInfo: false,
// 显示编辑框更多
moreInputVisible: false,
// 弹出展示层
currentId:null,
id:null,
titleView:"",
openView: false,
// 备注时间范围
daterangeRegisterDate: [],
// 备注时间范围
daterangeCreateTime: [],
// 备注时间范围
daterangeUpdateTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 20,
billCode: null,
problemType: null,
problemTitle: null,
problemCause: null,
sendSite: null,
sendSiteCode: null,
registerManCode: null,
registerManDept: null,
registerSiteCode: null,
registerDate: null,
registerSaveDate: null,
dataFrom: null,
status: null,
isSendSiteRegister: null,
blReversion: null,
reversionStr: null,
reversionMan: null,
reversionManCode: null,
reversionDate: null,
blCheckok: null,
blSee: null,
filePath: null,
modifySiteCode: null,
delFlag: null,
remark: null
},
// 表单参数
form: {},
// 表单校验
// rules: {
// id: [
// { required: true, message: "id不能为空", trigger: "blur" }
// ],
// }
};
},
created() {
this.getList();
},
methods: {
/** 查询问题件列表 */
getList() {
this.loading = true;
this.queryParams.params = {};
if (null != this.daterangeRegisterDate && '' != this.daterangeRegisterDate) {
this.queryParams.params["beginRegisterDate"] = this.daterangeRegisterDate[0];
this.queryParams.params["endRegisterDate"] = this.daterangeRegisterDate[1];
}
if (null != this.daterangeCreateTime && '' != this.daterangeCreateTime) {
this.queryParams.params["beginCreateTime"] = this.daterangeCreateTime[0];
this.queryParams.params["endCreateTime"] = this.daterangeCreateTime[1];
}
if (null != this.daterangeUpdateTime && '' != this.daterangeUpdateTime) {
this.queryParams.params["beginUpdateTime"] = this.daterangeUpdateTime[0];
this.queryParams.params["endUpdateTime"] = this.daterangeUpdateTime[1];
}
listEmisWaybillProblemInfo(this.addDateRange(this.queryParams, this.dateTimeRange)).then(response => {
this.emisWaybillProblemInfoList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
billCode: null,
problemType: null,
problemTitle: null,
problemCause: null,
sendSite: null,
sendSiteCode: null,
registerManCode: null,
registerManDept: null,
registerSiteCode: null,
registerDate: null,
registerSaveDate: null,
dataFrom: null,
status: null,
isSendSiteRegister: null,
blReversion: null,
reversionStr: null,
reversionMan: null,
reversionManCode: null,
reversionDate: null,
blCheckok: null,
blSee: null,
filePath: null,
createSiteCode: null,
modifySiteCode: null,
delFlag: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length!==1
this.multiple = !selection.length
},
onScanSiteSelect(item){
this.queryParams.scanSite=item && item.siteName;
this.queryParams.scanSiteCode=item && item.siteCode;
},
onproblemTypeSelect(item){
},
handleInput(item){
},
handleEdit(){
// 1、先判断是否经过查询且有数据
// 2、调保存接口
},
// 排序 查询字段是表格中字段名字 动态取值排序顺序
handleSortChange(column) {
this.queryParams.orderByColumn = column.prop;
this.queryParams.isAsc = column.order;
this.getList();
},
handleShowMoreInput(){
this.moreInputVisible = !this.moreInputVisible;
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getEmisWaybillProblemInfo(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改";
});
// 子组件打开模式
// this.currentId= row.id || this.ids;
// this.openEmisWaybillProblemInfo = true;
// this.titleEmisWaybillProblemInfo = "修改";
},
handleView(row) {
this.id=row.id;
this.titleView="查看";
this.openView=true;
// this.router.push({ path: '/emis/emisWaybillProblemInfo/viewDetail', query: { id: row.id }})
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
updateEmisWaybillProblemInfo(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addEmisWaybillProblemInfo(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
handleFormChanged(){
this.openForm = false;
this.getList();
},
cancelForm(){
this.openForm = false;
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal.confirm('是否确认删除').then(function() {
return delEmisWaybillProblemInfo(ids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
// this.download('emis/emisWaybillProblemInfo/export', {
// ...this.queryParams
// }, `emisWaybillProblemInfo_${new Date().getTime()}.xlsx`)
const loadingInstance = this.$loading({
text: '正在导出...'
})
var qParam = {...this.queryParams};
qParam.pageNum=1;
qParam.pageSize=5000;
listEmisWaybillProblemInfo(this.addDateRange(qParam, this.dateTimeRange)).then(response => {
this.downloadLoading = false
if (response.code === 200) {
const curList = response.rows
import('@/vendor/Export2Excel').then(excel => {
const tHeader = ['id','运单号','问题类型:','问题件标题','问题件原因','发送站点','发送站点代码','登记人代码','登记人所在部门','登记站点代码','登记时间','登记保存时间','数据来源','状态','是否寄件网点发起','是否回复','回复内容','回复人','回复人代码','回复日期','是否检查','是否查看','文件路径','创建站点代码','修改站点代码','删除标志(0代表存在','创建者','创建时间','更新者','更新时间','备注',];
const filterVal = ['id','billCode','problemType','problemTitle','problemCause','sendSite','sendSiteCode','registerManCode','registerManDept','registerSiteCode','registerDate','registerSaveDate','dataFrom','status','isSendSiteRegister','blReversion','reversionStr','reversionMan','reversionManCode','reversionDate','blCheckok','blSee','filePath','createSiteCode','modifySiteCode','delFlag','createBy','createTime','updateBy','updateTime','remark',];
const data = this.formatJson(filterVal, curList, response.rows)
excel.export_json_to_excel({
header: tHeader,
data,
filename: '问题件',
autoWidth: true
})
loadingInstance.close()
})
}
});
},
formatJson(filterVal, jsonData, resData) {
let index = 0
return jsonData.map(v => filterVal.map(j => {
if (j === 'index') {
return ++index
}
if (j === 'status') {
var statusStr='xxx'
if(v[j] == 10){
statusStr='xxx'
}
return statusStr;
}
return v[j]
}))
},
/** 列索引函数 */
getIndex($index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
},
/** 时间搜索响应函数 */
dateTimeChange(value){
this.dateTimeRange=value;
},
}
};
</script>
<style scoped>
.el-divider{
margin-top: 0px;
background: 0 0;
border-top: 1px solid #E6EBF5;
}
.el-divider__text {
color: #0955ee;
cursor: pointer;
}
</style>