<template>
|
<div class="page-list-container">
|
<!--数据Table-->
|
<yrt-data-list :ref="dataListRef" :editor-ref="editorRef" :data-options="dataOptions" :fields.sync="dataListOptions.fields" :buttons="dataListOptions.buttons" :action-field="actionField" :button-click="buttonClick" :data-list-selections.sync="dataListSelections" :auth-nodes="authNodes">
|
<template slot="common-column-slot" slot-scope="{row, col}">
|
<template v-if="col.prop=='abnormalData'">
|
<div v-html="row[col.prop]"></div>
|
</template>
|
<template v-else-if="col.prop==dataOptions.linkColumn">
|
<el-link type="primary" @click.native="()=>{linkEditor(row[dataOptions.idField]);}">
|
<template v-if="['date', 'datetime'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatDate(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else-if="['byte', 'int32', 'int64', 'decimal', 'double'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatNumber(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else>
|
{{ row[col.prop] }}
|
</template>
|
</el-link>
|
</template>
|
<template v-else>
|
<template v-if="['date', 'datetime'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatDate(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else-if="['byte', 'int32', 'int64', 'decimal', 'double'].indexOf(col.dataType)>=0 && col.formatter">
|
{{ common.formatNumber(row[col.prop], col.formatter) }}
|
</template>
|
<template v-else>
|
{{ row[col.prop] }}
|
</template>
|
</template>
|
</template>
|
</yrt-data-list>
|
|
<!--数据编辑器Editor-->
|
<yrt-editor :ref="editorRef" :data-list-ref="dataListRef" v-bind="editorOptions" :data-options="dataOptions" :action.sync="editorOptions.action" :visible.sync="editorOptions.config.visible" :on-save-before="onSaveBefore" :auth-nodes="authNodes" @on-change="onChange" @on-edit-load-after="onEditLoadAfter">
|
<div slot="blank-address">
|
<el-button type="primary" icon="el-icon-circle-plus" size="mini" style="float:right;" @click="addAddress">添加</el-button>
|
<div v-for="(addrInfo, index) in addressList" :key="index">
|
省：
|
<el-select v-model="addrInfo.province_Id" clearable placeholder="请选择" style="width:150px;" @change="(val)=>{onChangeAddress(addrInfo.province_Id, 'city', addrInfo)}">
|
<el-option v-for="item in provinceList" :key="item.value" :label="item.provinceName" :value="item.province_Id">
|
</el-option>
|
</el-select>
|
市：
|
<el-select v-model="addrInfo.city_Id" clearable placeholder="请选择" style="width:150px;" @change="(val)=>{onChangeAddress(addrInfo.city_Id, 'region', addrInfo)}">
|
<el-option v-for="item in addrInfo.cityList" :key="item.value" :label="item.cityName" :value="item.city_Id">
|
</el-option>
|
</el-select>
|
区：
|
<el-select v-model="addrInfo.regionName" clearable placeholder="请选择" style="width:150px;" @change="(val)=>{onChangeAddress(addrInfo.region_Id, 'none', addrInfo)}">
|
<el-option v-for="item in addrInfo.regionList" :key="item.value" :label="item.regionName" :value="item.regionName">
|
</el-option>
|
</el-select>
|
</div>
|
</div>
|
</yrt-editor>
|
|
<el-dialog :visible.sync="dialogFormVisible" title="禁止组板" width="500px">
|
<el-form :model="data">
|
<el-form-item label="数据分类">
|
<el-select v-model="data.dataType" filterable clearable placeholder="数据分类">
|
<el-option v-for="(item, index) in dataTypeList" :key="index" :label="item.name" :value="item.name">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="适用口岸">
|
<el-select v-model="data.port_Id" filterable clearable placeholder="适用口岸">
|
<el-option v-for="(item, index) in portList" :key="index" :label="item.portName" :value="item.port_Id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="异常分类">
|
<el-select v-model="data.abnormalType" filterable clearable placeholder="异常分类">
|
<el-option v-for="(item, index) in abnormalTypeList" :key="index" :label="item.name" :value="item.name">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="异常数据">
|
<el-input v-model="data.abnormalData" :rows="4" type="textarea" placeholder="可批量添加数据间用，或、隔开">
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="dialogFormVisible=false">取 消</el-button>
|
<el-button type="primary" @click="save()">确 定</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import baseLayout from "@/components/common/base-layout.vue";
|
|
export default {
|
name: "tms-service-abnormal",
|
components: {},
|
mixins: [baseLayout],
|
data() {
|
return {
|
actionField: {
|
prop: "_action",
|
label: "操作",
|
width: "100",
|
headerAlign: "center",
|
align: "center",
|
action: [
|
{
|
type: "button",
|
action: "edit",
|
label: "编辑",
|
onClick: function(btnInfo, rowData, colInfo, the) {
|
if (rowData.panelType === "普通组板") {
|
the.openStopBoard();
|
the.data = rowData;
|
} else {
|
the.editor.editData(rowData.abnormal_Id);
|
}
|
return true;
|
}
|
},
|
{
|
type: "button",
|
action: "delete",
|
label: "删除"
|
}
|
],
|
hidden: false
|
},
|
provinceList: [],
|
addressList: [
|
{
|
cityList: [],
|
regionList: []
|
// province_Id,
|
// provinceName,
|
// city_Id:0,
|
// cityName:"",
|
// region_Id,
|
// regionName
|
}
|
],
|
tableData: [], // 异常数据table
|
dataTypeList: [], // 数据类型List
|
portList: [], // 口岸List
|
abnormalTypeList: [], // 异常分类List
|
dialogFormVisible: false, // 禁止组板窗口
|
// 组板对象
|
data: {
|
abnormal_Id: 0,
|
abnormalData: null, // 异常数据
|
abnormalType: null, // 异常分类
|
dataType: null, // 数据分类
|
Port_Id: null,
|
portName: null,
|
panelType: "普通组板"
|
}
|
};
|
},
|
mounted() {
|
const rowData = this.addressList[0];
|
this.onChangeAddress(0, "province", rowData);
|
},
|
methods: {
|
// 列表页面按钮点击事件
|
buttonClick(authNode) {
|
switch (authNode) {
|
case "addStopBoard":
|
// 添加禁止组板
|
this.openStopBoard();
|
}
|
},
|
openStopBoard() {
|
// 初始化
|
this.data = {
|
abnormal_Id: 0,
|
abnormalData: null, // 异常数据
|
abnormalType: null, // 异常分类
|
dataType: null, // 数据分类
|
Port_Id: null,
|
portName: null,
|
panelType: "普通组板"
|
};
|
this.getDataTypeList();
|
this.getPortList();
|
this.getAbnormalTypeList();
|
this.dialogFormVisible = true;
|
},
|
// 保存禁止组板
|
save() {
|
this.portList.forEach(item => {
|
if (item.port_Id === this.data.port_Id) {
|
this.data.portName = item.portName;
|
}
|
});
|
var url = "/api/tms/abnormal/saveAbnormal";
|
var params = this.data;
|
this.common.ajax(url, params, res => {
|
this.common.showMsg(res);
|
this.dialogFormVisible = false;
|
this.dataList.reload();
|
});
|
},
|
// 数据分类
|
getDataTypeList() {
|
var url = "/api/tms/abnormal/getDataTypeList";
|
var params = {};
|
this.common.ajax(url, params, res => {
|
if (res.result) {
|
this.dataTypeList = res.data;
|
}
|
});
|
},
|
getPortList() {
|
var url = "/api/basicInfo/base/port/getList";
|
var params = {};
|
this.common.ajax(url, params, res => {
|
if (res.result) {
|
this.portList = res.data;
|
}
|
});
|
},
|
// 异常分类List
|
getAbnormalTypeList() {
|
var url = "/api/tms/abnormal/getAbnormalTypeList";
|
var params = {};
|
this.common.ajax(url, params, res => {
|
if (res.result) {
|
this.abnormalTypeList = res.data;
|
}
|
});
|
},
|
onSaveBefore(formData) {
|
var address = this.addressList.map(item => {
|
var newItem = JSON.parse(JSON.stringify(item));
|
delete newItem.cityList;
|
delete newItem.regionList;
|
return newItem;
|
});
|
var editorRef = this.editor;
|
editorRef.formData.panelType = "综合组板";
|
editorRef.formData.abnormalType = "口岸禁止";
|
editorRef.formData.dataType = "禁止组板";
|
editorRef.formData.addressee = JSON.stringify(address);
|
if (address.length) {
|
var addstr = "";
|
address.forEach(element => {
|
addstr += element.provinceName + (element.cityName || "");
|
});
|
}
|
var dataAbnormal =
|
"适用口岸:" +
|
(formData.portName || "") +
|
"<br>仓库:" +
|
(formData.storageName || "") +
|
"<br>快递名称:" +
|
(formData.expressCorpName || "") +
|
"<br>启用时间:" +
|
(formData.beginTime || "") +
|
"<br>失效时间:" +
|
(formData.endTime || "") +
|
"<br>包裹重量:" +
|
(formData.packageWeight || "") +
|
"<br>提示信息:" +
|
(formData.tipsMsg || "") +
|
"<br>物料名称关键字:" +
|
(formData.productNameKeyWord || "") +
|
"<br>订单来源:" +
|
(formData.orderSourse || "") +
|
"<br>收件人地址:" +
|
addstr;
|
editorRef.formData.abnormalData = dataAbnormal;
|
},
|
addAddress() {
|
this.addressList.push({
|
cityList: [],
|
regionList: []
|
// province_Id,
|
// provinceName,
|
// city_Id:0,
|
// cityName:"",
|
// region_Id,
|
// regionName
|
});
|
},
|
// 根据省ID获得市
|
onChangeAddress(parentId, type, rowData) {
|
if (type === "city") {
|
// 获得省的名称
|
var provinceObj = this.provinceList.find(item => {
|
return item.province_Id === parentId;
|
});
|
if (provinceObj) {
|
rowData.province_Id = provinceObj.province_Id;
|
rowData.provinceName = provinceObj.provinceName;
|
}
|
} else if (type === "region") {
|
var cityObj = rowData.cityList.find(item => {
|
return item.city_Id === parentId;
|
});
|
if (cityObj) {
|
rowData.city_Id = cityObj.city_Id;
|
rowData.cityName = cityObj.cityName;
|
}
|
} else if (type === "none") {
|
var regionObj = rowData.regionList.find(item => {
|
return item.region_Id === parentId;
|
});
|
if (regionObj) {
|
rowData.region_Id = cityObj.region_Id;
|
rowData.regionName = regionObj.regionName;
|
}
|
}
|
if (type === "none" || !type) return;
|
// 加载下一级数据
|
var the = this;
|
// var editorRef = this.editor;
|
var where = { parentId: parentId };
|
var url = "/api/common/loadTreeNode";
|
var params = {
|
folder: "basicInfo/base",
|
DBServer: "Sys",
|
tableName: "Base_City",
|
tableView: "Base_City",
|
keyName: "city_Id",
|
nodeName: "cityName",
|
fixHasChild: false,
|
isBreakWay: false,
|
displayBreakWay: false,
|
parentName: "parentId",
|
orderBy: "orderNo desc, city_Id",
|
where: where,
|
extendColumns: ""
|
};
|
the.common.ajax(
|
url,
|
params,
|
res => {
|
if (res.result) {
|
var data = res.data.map(item => {
|
if (type === "province") {
|
const newItem = {
|
province_Id: item.value,
|
provinceName: item.label,
|
value: item.value,
|
label: item.label
|
};
|
return newItem;
|
} else if (type === "city") {
|
const newItem = {
|
city_Id: item.value,
|
cityName: item.label,
|
value: item.value,
|
label: item.label
|
};
|
return newItem;
|
} else if (type === "region") {
|
const newItem = {
|
region_Id: item.value,
|
regionName: item.label,
|
value: item.value,
|
label: item.label
|
};
|
return newItem;
|
}
|
});
|
if (type === "province") {
|
this.provinceList = data;
|
} else if (type === "city") {
|
this.$set(rowData, "cityList", data);
|
} else if (type === "region") {
|
this.$set(rowData, "regionList", data);
|
}
|
} else {
|
the.$message.error(res.msg);
|
}
|
},
|
true
|
);
|
},
|
onEditLoadAfter(formData) {
|
if (formData.addressee) {
|
this.addressList = JSON.parse(formData.addressee);
|
this.addressList.forEach((item, index) => {
|
this.onChangeAddress(item.province_Id, "city", this.addressList[index]);
|
});
|
} else {
|
this.addressList = [];
|
}
|
},
|
// 级联改变数据
|
onChange(ref, val, field, formData) {
|
if (field.options.prop === "expressType") {
|
this.$set(formData, "expressCorpName", null);
|
this.$set(formData, "expressCorpCode", null);
|
this.$set(formData, "expressCorp_Id", null);
|
var url = "/api/basicInfo/base/expressCorp/getList";
|
var params = {
|
expressCorpType: formData.expressType
|
};
|
var callBack = res => {
|
this.common.showMsg(res);
|
if (res.result) {
|
var data = res.data.map(item => {
|
item.label = item.expressCorpName;
|
item.value = item.expressCorp_Id;
|
return item;
|
});
|
this.editor.setDropdownData(568, data);
|
}
|
};
|
this.common.ajax(url, params, callBack);
|
}
|
}
|
}
|
};
|
</script>
|
