Fedex / imac-vue

Go to a project
Toggle navigation Toggle navigation pinning
Elements-SY
94f12ced 2 parents f3551a36 a6d7a22c

Merge branch 'test' into uat

Inline Side-by-side
Showing 40 changed files with 3272 additions and 1695 deletions
import request from "@/utils/request";
// ET86查询
/**
* @param createTimeStart; 开始时间
* @param createTimeEnd; 结束时间
* @param status; 1-有效 0-无效 不传查全部
*/
export function findAllEtesRules(data) {
return request({
url: "/etes/findAllEtesRules",
method: "post",
data: data,
});
}
// ET86新增
export function add(data) {
return request({
url: "/etes/add",
method: "post",
data: data,
});
}
// ET86详情
export function findEtesRuleById(data) {
return request({
url: "/etes/findEtesRuleById",
method: "post",
data: data,
});
}
// ET86编辑
export function update(data) {
return request({
url: "/etes/update",
method: "post",
data: data,
});
}
// ET86删除
export function deleteEtesRuleById(data) {
return request({
url: "/etes/deleteEtesRuleById",
method: "post",
data: data,
});
}
import request from "@/utils/request";
// HScode黑名单查询
export function findHsCodeList(data) {
return request({
url: "/etes/findHsCodeList",
method: "post",
data: data,
});
}
// HScode黑名单删除
export function delBlackList(data) {
return request({
url: "/etes/delBlackList",
method: "post",
data: data,
});
}
// HScode黑名单下载模板
export function downLoadTemplate(template) {
return request({
url: "/etes/downLoadTemplate?template=" + template,
method: "get",
responseType: "blob",
});
}
// HScode黑名单导入
export function uploadHsCode(data) {
return request({
url: "/etes/uploadHsCode",
method: "post",
data: data,
});
}
import request from "@/utils/request";
// HScode英文品名黑名单查询
export function findShipmentDescList(data) {
return request({
url: "/etes/findShipmentDescList",
method: "post",
data: data,
});
}
// HScode英文品名黑名单导入
export function uploadShipmentDesc(data) {
return request({
url: "/etes/uploadShipmentDesc",
method: "post",
data: data,
});
}
// HScode黑名单/英文品名删除
export function delBlackList(data) {
return request({
url: "/etes/delBlackList ",
method: "post",
data: data,
});
}
......@@ -7,222 +7,251 @@
<el-form
:model="tempQueryForm"
:inline="inline"
:label-position="position"
:label-width="formWidth"
:loading="loading"
ref="ruleForm"
:size="size"
>
<el-form-item
v-for="item in tempFormConfig"
:label="item.label"
:key="item.prop"
:prop="item.prop"
:rules="item.rules"
<el-row
:gutter="rowGutter"
:type="rowType"
:justify="rowJustify"
:align="rowAlign"
:tag="rowTag"
>
<!-- 输入框 -->
<el-input
v-if="item.type === 'Input'"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:disabled="item.disable"
:placeholder="
item.placeholder ? item.placeholder : '请输入' + item.label
"
v-on:[item.trigger]="
(e) => {
inputEvent(e, item);
}
"
@keyup.enter.native="toEnterSearch"
clearable
>
</el-input>
<template v-if="view">
<span v-text="tempQueryForm[item.prop]"></span>
</template>
<!-- 数字输入框 -->
<el-input
v-if="item.type === 'inputNumber'"
type="number"
:min="item.min"
:max="item.max"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:disabled="item.disable"
:placeholder="
item.placeholder ? item.placeholder : '请输入' + item.label
"
v-on:keyup.enter="value = value.replace(/^-?[0-9]\d*$/, '')"
clearable
>
</el-input>
<!-- InputNumber 计数器 -->
<el-input-number
v-if="item.type === 'Number'"
v-model.trim="tempQueryForm[item.prop]"
:min="0"
:max="10"
:size="item.size"
:style="{ width: item.width }"
label="描述文字"
></el-input-number>
<template v-if="view">
<span v-text="tempQueryForm[item.prop]"></span>
</template>
<!-- 下拉选择 -->
<el-select
v-if="item.type === 'Select'"
:multiple="item.multiple"
:filterable="item.filterable"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:disabled="item.disable"
:loading="searchLoading"
:placeholder="
item.placeholder ? item.placeholder : '请选择' + item.label
"
clearable
<el-col
v-for="item in tempFormConfig"
:span="item.span"
:offset="item.offset"
:tag="item.tag"
:push="item.push"
:pull="item.pull"
:xs="item.xs"
:sm="item.sm"
:md="item.md"
:lg="item.lg"
:xl="item.xl"
:style="{ width: item.colWidth }"
:key="item.prop"
>
<el-option
v-for="op in item.options.data"
:label="op[item.options.label] || op.label"
:value="op[item.options.value] || op.value"
:key="op[item.options.value] || op.value"
<el-form-item
:label="item.label"
:prop="item.prop"
:rules="item.rules"
:label-width="item.labelWidth"
>
</el-option>
</el-select>
<!-- 远程搜索 -->
<template v-if="item.type === 'Search'">
<el-autocomplete
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:debounce="1500"
:fetch-suggestions="querySearchAsync"
:placeholder="
item.placeholder ? item.placeholder : '请选择' + item.label
"
@focus="focusKey(item)"
@select="selectSearch"
clearable
></el-autocomplete>
</template>
<!-- 输入框 -->
<el-input
v-if="item.type === 'Input'"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
:placeholder="
item.placeholder ? item.placeholder : '请输入' + item.label
"
v-on:[item.trigger]="
(e) => {
inputEvent(e, item);
}
"
@keyup.enter.native="toEnterSearch"
clearable
>
</el-input>
<template v-if="view">
<span v-text="tempQueryForm[item.prop]"></span>
</template>
<!-- 数字输入框 -->
<el-input
v-if="item.type === 'inputNumber'"
type="number"
:min="item.min"
:max="item.max"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
:placeholder="
item.placeholder ? item.placeholder : '请输入' + item.label
"
v-on:keyup.enter="value = value.replace(/^-?[0-9]\d*$/, '')"
clearable
>
</el-input>
<!-- InputNumber 计数器 -->
<el-input-number
v-if="item.type === 'Number'"
v-model.trim="tempQueryForm[item.prop]"
:min="0"
:max="10"
:size="item.size"
:style="{ width: item.inputWidth }"
label="描述文字"
></el-input-number>
<!-- 日期 -->
<el-date-picker
v-if="item.type === 'Date'"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:disabled="item.disable"
:placeholder="item.placeholder ? item.placeholder : '请选择日期'"
clearable
>
</el-date-picker>
<template v-if="view">
<span v-text="tempQueryForm[item.prop]"></span>
</template>
<!-- 时间 -->
<el-time-select
v-if="item.type === 'Time'"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:disabled="item.disable"
:placeholder="item.placeholder ? item.placeholder : '请选择时间'"
clearable
>
</el-time-select>
<!-- 下拉选择 -->
<el-select
v-if="item.type === 'Select'"
:multiple="item.multiple"
:filterable="item.filterable"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
:loading="searchLoading"
:placeholder="
item.placeholder ? item.placeholder : '请选择' + item.label
"
clearable
>
<el-option
v-for="op in item.options.data"
:label="op[item.options.label] || op.label"
:value="op[item.options.value] || op.value"
:key="op[item.options.value] || op.value"
>
</el-option>
</el-select>
<!-- 日期时间 -->
<el-date-picker
v-if="item.type === 'DateTime'"
type="datetime"
v-model.trim="tempQueryForm[item.prop]"
:disabled="item.disable"
:placeholder="item.placeholder ? item.placeholder : '请选择日期'"
clearable
>
</el-date-picker>
<!-- 远程搜索 -->
<template v-if="item.type === 'Search'">
<el-autocomplete
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:debounce="1500"
:fetch-suggestions="querySearchAsync"
:placeholder="
item.placeholder ? item.placeholder : '请选择' + item.label
"
@focus="focusKey(item)"
@select="selectSearch"
clearable
></el-autocomplete>
</template>
<!-- 日期范围 -->
<el-date-picker
v-if="item.type === 'datetimerange'"
type="datetimerange"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.width }"
:disabled="item.disable"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
clearable
>
</el-date-picker>
<!-- 日期 -->
<el-date-picker
v-if="item.type === 'Date'"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
:placeholder="item.placeholder ? item.placeholder : '请选择日期'"
:value-format="item.format"
clearable
>
</el-date-picker>
<!-- 单选框 普通的样式 Radio 的尺寸，仅在 border 为真时有效-->
<template v-if="item.type === 'radio'">
<el-radio
v-model.trim="tempQueryForm[item.prop]"
v-for="op in item.options.data"
:disabled="item.disable"
:border="tempQueryForm[item.border]"
:size="tempQueryForm[item.size]"
:label="op[item.options.label] || op.label"
:value="op[item.options.value] || op.value"
:key="op[item.options.value] || op.value"
></el-radio>
</template>
<!-- 时间 -->
<el-time-select
v-if="item.type === 'Time'"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
:placeholder="item.placeholder ? item.placeholder : '请选择时间'"
clearable
>
</el-time-select>
<!-- 单选框 按钮样式 -->
<el-radio-group
v-if="item.type === 'radioButtom'"
v-model.trim="tempQueryForm[item.prop]"
:size="tempQueryForm[item.size]"
:disabled="item.disable"
>
<el-radio-button
v-for="op in item.options.data"
:label="op[item.options.label] || op.label"
:value="op[item.options.value] || op.value"
:key="op[item.options.value] || op.value"
></el-radio-button>
</el-radio-group>
<!-- 日期时间 -->
<el-date-picker
v-if="item.type === 'DateTime'"
type="datetime"
v-model.trim="tempQueryForm[item.prop]"
:disabled="item.disable"
:placeholder="item.placeholder ? item.placeholder : '请选择日期'"
clearable
>
</el-date-picker>
<!-- 文本框 -->
<el-input
v-if="item.type === 'textarea'"
v-model.trim="tempQueryForm[item.prop]"
type="textarea"
:style="{ width: item.width }"
:disabled="item.disable"
:rows="item.row"
:autosize="item.autosize"
:placeholder="
item.placeholder ? item.placeholder : '请输入' + item.label
"
clearable
>
</el-input>
<!-- 多选框 -->
<template v-if="item.type === 'Checkbox'">
<el-checkbox
v-model="tempQueryForm[item.prop]"
:disabled="item.disabled"
></el-checkbox>
</template>
</el-form-item>
<!-- 查询按钮 de-->
<span v-show="inline & hiddenFormBtn">
<el-form-item v-show="show">
<el-button
type="primary"
@click="handleSearch('ruleForm')"
:btnLoading="btnLoading"
>
{{ formBtn }}
</el-button>
</el-form-item>
</span>
<span v-show="inline & hiddenFormBtn">
<el-form-item v-show="show">
<el-button @click="resetFields('ruleForm')">重置</el-button>
</el-form-item>
</span>
<!-- 日期范围 -->
<el-date-picker
v-if="item.type === 'datetimerange'"
type="datetimerange"
v-model.trim="tempQueryForm[item.prop]"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
clearable
>
</el-date-picker>
<!-- 单选框 普通的样式 Radio 的尺寸，仅在 border 为真时有效-->
<template v-if="item.type === 'radio'">
<el-radio
v-model.trim="tempQueryForm[item.prop]"
v-for="op in item.options.data"
:disabled="item.disable"
:border="tempQueryForm[item.border]"
:size="tempQueryForm[item.size]"
:label="op[item.options.label] || op.label"
:value="op[item.options.value] || op.value"
:key="op[item.options.value] || op.value"
></el-radio>
</template>
<!-- 单选框 按钮样式 -->
<el-radio-group
v-if="item.type === 'radioButtom'"
v-model.trim="tempQueryForm[item.prop]"
:size="tempQueryForm[item.size]"
:disabled="item.disable"
>
<el-radio-button
v-for="op in item.options.data"
:label="op[item.options.label] || op.label"
:value="op[item.options.value] || op.value"
:key="op[item.options.value] || op.value"
></el-radio-button>
</el-radio-group>
<!-- 文本框 -->
<el-input
v-if="item.type === 'textarea'"
v-model.trim="tempQueryForm[item.prop]"
type="textarea"
:style="{ width: item.inputWidth }"
:disabled="item.disable"
:rows="item.row"
:autosize="item.autosize"
:placeholder="
item.placeholder ? item.placeholder : '请输入' + item.label
"
clearable
>
</el-input>
<!-- 多选框 -->
<template v-if="item.type === 'Checkbox'">
<el-checkbox
v-model="tempQueryForm[item.prop]"
:disabled="item.disabled"
></el-checkbox>
</template>
</el-form-item>
</el-col>
<!-- 查询按钮 de-->
<span v-show="inline & hiddenFormBtn">
<el-form-item v-show="show">
<el-button
type="primary"
@click="handleSearch('ruleForm')"
:btnLoading="btnLoading"
>
{{ formBtn }}
</el-button>
</el-form-item>
</span>
<span v-show="inline & hiddenFormBtn">
<el-form-item v-show="show">
<el-button @click="resetFields('ruleForm')">重置</el-button>
</el-form-item>
</span>
</el-row>
</el-form>
</div>
</template>
......@@ -232,30 +261,25 @@ import request from "@/utils/request";
import { deepClone } from "@/utils";
export default {
props: {
marginBottom: {
rowGutter: {
type: Number,
default: 30,
default: 24,
},
view: {
type: Boolean,
default: false,
},
formBtn: {
rowType: {
type: String,
default: "查询",
default: "",
},
btnLoading: {
type: Boolean,
default: false,
rowJustify: {
type: String,
default: "",
},
loading: {
//加载
type: Boolean,
default: false,
rowAlign: {
type: String,
default: "",
},
isBtnSave: {
type: Boolean,
default: false,
rowTag: {
type: String,
default: "div",
},
// 由inline属性决定form表单是普通表单，还是行内表单
inline: {
......@@ -272,14 +296,14 @@ export default {
type: Boolean,
default: false,
},
labelWidth: {
type: String,
default: "120px",
},
formWidth: {
//form表单宽度
type: String,
default: "200px",
default: "auto",
},
position: {
type: String,
default: "",
},
formConfig: {
type: Array,
......@@ -294,6 +318,31 @@ export default {
type: String,
default: "small",
},
marginBottom: {
type: Number,
default: 0,
},
view: {
type: Boolean,
default: false,
},
formBtn: {
type: String,
default: "查询",
},
btnLoading: {
type: Boolean,
default: false,
},
loading: {
//加载
type: Boolean,
default: false,
},
isBtnSave: {
type: Boolean,
default: false,
},
},
data() {
return {
......@@ -310,7 +359,7 @@ export default {
methods: {
// input事件绑定和注册
inputEvent(e, item) {
this.$emit("input", this.tempQueryForm);
this.$emit(item.trigger, this.tempQueryForm);
},
// 回车事件
toEnterSearch() {
......
<template>
<div class="table-container">
<el-row v-if="attrs.btnCofig.isBtn" style="margin-bottom: 15px">
<el-row
v-if="attrs.btnCofig.isBtn"
style="margin-bottom: 15px"
id="group-btn"
>
<el-col>
<el-button
v-for="item in attrs.btnCofig.btnGroup"
:key="item.icon"
:type="item.type"
:icon="item.icon"
:round="item.round"
:size="item.size"
:loading="item.loading"
@click="handleClick(item)"
>{{ item.btnName }}</el-button
<span
v-for="(item, i) in attrs.btnCofig.btnGroup"
:key="item.btnName"
:class="i == 0 ? 'first-span' : 'span'"
>
<el-button
:type="item.type"
:icon="item.icon"
:round="item.round"
:size="item.size"
:loading="item.loading"
@click="handleClick(item, i)"
v-if="item.btnName !== '导入' && item.btnName !== '增加'"
>{{ item.btnName }}</el-button
>
<el-upload
v-else
ref="upload"
:action="item.action"
:fileName="item.fileName"
:http-request="toUpload"
:on-remove="onRemoveUpload"
:limit="item.limit"
:accept="item.accept"
:show-file-list="false"
class="upload"
>
<el-button
:type="item.type"
:icon="item.icon"
:round="item.round"
:size="item.size"
:loading="item.loading"
>{{ item.btnName }}</el-button
>
</el-upload>
</span>
</el-col>
</el-row>
<el-table
......@@ -27,8 +57,8 @@
:header-cell-class-name="headerCellClassName"
>
<template v-if="columns.length">
<template v-for="(item, index) in columns">
<column v-if="!item.hidden" :key="index" :attrs="item"></column>
<template v-for="item in columns">
<column v-if="!item.hidden" :key="item.id" :attrs="item"></column>
</template>
</template>
<slot name="column" v-else></slot>
......@@ -36,8 +66,10 @@
<!-- 分页 -->
<div
v-if="pageConfig.isPagination"
id="pagination"
class="pagination-container"
:style="{ textAlign: pageConfig.position || 'right' }"
ref="paginationRef"
>
<el-pagination
background
......@@ -193,8 +225,8 @@ export default {
this.$emit("currentChange", e);
},
// btn点击事件注册
handleClick(item) {
this.$emit(item.event, item);
handleClick(item, i) {
this.$emit(item.event, item, i);
},
// 拖拽行更新排序
rowDrop() {
......@@ -231,6 +263,17 @@ export default {
},
});
},
// 选择上传
toUpload(options) {
this.$refs.upload.map((item) => {
item.clearFiles(); //上传成功之后清除历史记录
});
this.$emit("upload", options);
},
//移除上传
onRemoveUpload(file, fileList) {
this.$emit("rmfile", { file, fileList });
},
},
watch: {
data() {
......@@ -250,4 +293,10 @@ export default {
padding: 0;
}
}
.first-span,.span{
display: inline-block;
}
.span{
margin-left: 6px;
}
</style>
......
......@@ -8,7 +8,7 @@
<navbar />
<tags-view v-if="needTagsView" />
</div>
<app-main />
<app-main ref="appMainBlock" />
<right-panel v-if="false">
<settings />
</right-panel>
......
import store from '@/store'
import store from "@/store";
const { body } = document
const WIDTH = 992 // refer to Bootstrap's responsive design
const { body } = document;
const WIDTH = 992; // refer to Bootstrap's responsive design
export default {
watch: {
$route(route) {
if (this.device === 'mobile' && this.sidebar.opened) {
store.dispatch('app/closeSideBar', { withoutAnimation: false })
this.getBlockCurrentHeight();
if (this.device === "mobile" && this.sidebar.opened) {
store.dispatch("app/closeSideBar", { withoutAnimation: false });
}
}
},
},
beforeMount() {
window.addEventListener('resize', this.$_resizeHandler)
window.addEventListener("resize", this.$_resizeHandler);
},
beforeDestroy() {
window.removeEventListener('resize', this.$_resizeHandler)
window.removeEventListener("resize", this.$_resizeHandler);
},
mounted() {
const isMobile = this.$_isMobile()
const isMobile = this.$_isMobile();
if (isMobile) {
store.dispatch('app/toggleDevice', 'mobile')
store.dispatch('app/closeSideBar', { withoutAnimation: true })
store.dispatch("app/toggleDevice", "mobile");
store.dispatch("app/closeSideBar", { withoutAnimation: true });
}
this.$nextTick(()=>{
this.getBlockCurrentHeight();
})
},
methods: {
// use $_ for mixins properties
// https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
$_isMobile() {
const rect = body.getBoundingClientRect()
return rect.width - 1 < WIDTH
const rect = body.getBoundingClientRect();
return rect.width - 1 < WIDTH;
},
$_resizeHandler() {
if (!document.hidden) {
const isMobile = this.$_isMobile()
store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop')
const isMobile = this.$_isMobile();
store.dispatch("app/toggleDevice", isMobile ? "mobile" : "desktop");
if (isMobile) {
store.dispatch('app/closeSideBar', { withoutAnimation: true })
store.dispatch("app/closeSideBar", { withoutAnimation: true });
}
}
}
}
}
},
getBlockCurrentHeight() {
let height = this.$refs.appMainBlock.$el.clientHeight;
this.$store.dispatch("app/setAppMainBlockCH", height);
},
},
};
......
......@@ -73,19 +73,18 @@ export const constantRoutes = [
hidden: true,
children: [
{
path: "/et86",
path: "/edit",
component: (resolve) =>
require(["@/views/allocationConfig/et86"], resolve),
name: "et86",
meta: { title: "ET86", icon: "user" },
children: [],
require(["@/views/et86Config/et86RuleConfig/edit"], resolve),
name: "edit",
meta: { title: "ET86规则", icon: "user", noCache: false },
},
{
path: "/et86/:edit",
path: "/errorInfo",
component: (resolve) =>
require(["@/views/allocationConfig/et86/edit"], resolve),
name: "edit",
meta: { title: "编辑", icon: "user" },
require(["@/views/et86Config/errorInfo"], resolve),
name: "errorInfo",
meta: { title: "错误信息提示", icon: "user" },
},
{
path: "/info/:handle/id=:id;routeStatus=:routeStatus;fltNo=:fltNo;route=:route;fltDate=:fltDate;status=:status",
......
const getters = {
sidebar: state => state.app.sidebar,
size: state => state.app.size,
device: state => state.app.device,
visitedViews: state => state.tagsView.visitedViews,
cachedViews: state => state.tagsView.cachedViews,
token: state => state.user.token,
avatar: state => state.user.avatar,
name: state => state.user.name,
id: state => state.user.id,
activePortName: state => state.user.activePortName,
portName: state => state.user.portName,
introduction: state => state.user.introduction,
roles: state => state.user.roles,
permissions: state => state.user.permissions,
permission_routes: state => state.permission.routes,
topbarRouters: state => state.permission.topbarRouters,
defaultRoutes: state => state.permission.defaultRoutes,
sidebarRouters: state => state.permission.sidebarRouters,
filghtAllData: state => state.permission.filghtAllData,
tableHeader: state => state.user.tableHeader
}
sidebar: (state) => state.app.sidebar,
size: (state) => state.app.size,
device: (state) => state.app.device,
appMainBlockClientHeight: (state) => state.app.appMainBlockClientHeight,
visitedViews: (state) => state.tagsView.visitedViews,
cachedViews: (state) => state.tagsView.cachedViews,
token: (state) => state.user.token,
avatar: (state) => state.user.avatar,
name: (state) => state.user.name,
id: (state) => state.user.id,
activePortName: (state) => state.user.activePortName,
portName: (state) => state.user.portName,
introduction: (state) => state.user.introduction,
roles: (state) => state.user.roles,
permissions: (state) => state.user.permissions,
permission_routes: (state) => state.permission.routes,
topbarRouters: (state) => state.permission.topbarRouters,
defaultRoutes: (state) => state.permission.defaultRoutes,
sidebarRouters: (state) => state.permission.sidebarRouters,
filghtAllData: (state) => state.permission.filghtAllData,
tableHeader: (state) => state.user.tableHeader,
};
export default getters
......
......@@ -2,13 +2,16 @@
const state = {
sidebar: {
opened: localStorage.getItem('sidebarStatus') ? !!+localStorage.getItem('sidebarStatus') : true,
withoutAnimation: false
opened: localStorage.getItem("sidebarStatus")
? !!+localStorage.getItem("sidebarStatus")
: true,
withoutAnimation: false,
},
device: 'desktop',
device: "desktop",
//size: Cookies.get('size') || 'medium'
size: localStorage.getItem('size') || 'medium'
}
size: localStorage.getItem("size") || "medium",
appMainBlockClientHeight: null
};
const mutations = {
TOGGLE_SIDEBAR: state => {
......@@ -35,23 +38,30 @@ const mutations = {
state.size = size
//Cookies.set('size', size)
localStorage.setItem('size', size)
}
},
SET_APPMAINBLOCKCH: (state, height) => {
state.appMainBlockClientHeight = height;
},
}
const actions = {
toggleSideBar({ commit }) {
commit('TOGGLE_SIDEBAR')
commit("TOGGLE_SIDEBAR");
},
closeSideBar({ commit }, { withoutAnimation }) {
commit('CLOSE_SIDEBAR', withoutAnimation)
commit("CLOSE_SIDEBAR", withoutAnimation);
},
toggleDevice({ commit }, device) {
commit('TOGGLE_DEVICE', device)
commit("TOGGLE_DEVICE", device);
},
setSize({ commit }, size) {
commit('SET_SIZE', size)
}
}
commit("SET_SIZE", size);
},
setAppMainBlockCH({ commit }, height) {
commit("SET_APPMAINBLOCKCH", height);
},
};
export default {
namespaced: true,
......
......@@ -54,26 +54,6 @@ const permission = {
return new Promise((resolve) => {
// 向后端请求路由数据
getRouters().then((res) => {
// const newUrl = {
// id: 24,
// name: "et86",
// path: "/et86",
// hidden: false,
// component: "allocationConfig/et86",
// meta: {
// title: "ET86",
// icon: "edit",
// permissions: "allocation:rand:list",
// noCache: false,
// },
// alwaysShow: false,
// children: null,
// };
// res.data.map((item) => {
// if (item.name == "AllocationConfig") {
// item.children.push(newUrl);
// }
// });
res.data = hasPermi.routerPer(res.data);
const sdata = JSON.parse(JSON.stringify(res.data));
const rdata = JSON.parse(JSON.stringify(res.data));
......
import { parseTime } from './FedEx'
import { parseTime } from "./FedEx";
/**
* 表格时间格式化
*/
export function formatDate(cellValue) {
if (cellValue == null || cellValue == "") return "";
var date = new Date(cellValue)
var year = date.getFullYear()
var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds
var date = new Date(cellValue);
var year = date.getFullYear();
var month =
date.getMonth() + 1 < 10
? "0" + (date.getMonth() + 1)
: date.getMonth() + 1;
var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
var minutes =
date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
var seconds =
date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
return (
year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds
);
}
/**
......@@ -21,40 +28,40 @@ export function formatDate(cellValue) {
* @returns {string}
*/
export function formatTime(time, option) {
if (('' + time).length === 10) {
time = parseInt(time) * 1000
if (("" + time).length === 10) {
time = parseInt(time) * 1000;
} else {
time = +time
time = +time;
}
const d = new Date(time)
const now = Date.now()
const d = new Date(time);
const now = Date.now();
const diff = (now - d) / 1000
const diff = (now - d) / 1000;
if (diff < 30) {
return '刚刚'
return "刚刚";
} else if (diff < 3600) {
// less 1 hour
return Math.ceil(diff / 60) + '分钟前'
return Math.ceil(diff / 60) + "分钟前";
} else if (diff < 3600 * 24) {
return Math.ceil(diff / 3600) + '小时前'
return Math.ceil(diff / 3600) + "小时前";
} else if (diff < 3600 * 24 * 2) {
return '1天前'
return "1天前";
}
if (option) {
return parseTime(time, option)
return parseTime(time, option);
} else {
return (
d.getMonth() +
1 +
'月' +
"月" +
d.getDate() +
'日' +
"日" +
d.getHours() +
'时' +
"时" +
d.getMinutes() +
'分'
)
"分"
);
}
}
......@@ -63,18 +70,18 @@ export function formatTime(time, option) {
* @returns {Object}
*/
export function getQueryObject(url) {
url = url == null ? window.location.href : url
const search = url.substring(url.lastIndexOf('?') + 1)
const obj = {}
const reg = /([^?&=]+)=([^?&=]*)/g
url = url == null ? window.location.href : url;
const search = url.substring(url.lastIndexOf("?") + 1);
const obj = {};
const reg = /([^?&=]+)=([^?&=]*)/g;
search.replace(reg, (rs, $1, $2) => {
const name = decodeURIComponent($1)
let val = decodeURIComponent($2)
val = String(val)
obj[name] = val
return rs
})
return obj
const name = decodeURIComponent($1);
let val = decodeURIComponent($2);
val = String(val);
obj[name] = val;
return rs;
});
return obj;
}
/**
......@@ -83,14 +90,14 @@ export function getQueryObject(url) {
*/
export function byteLength(str) {
// returns the byte length of an utf8 string
let s = str.length
let s = str.length;
for (var i = str.length - 1; i >= 0; i--) {
const code = str.charCodeAt(i)
if (code > 0x7f && code <= 0x7ff) s++
else if (code > 0x7ff && code <= 0xffff) s += 2
if (code >= 0xDC00 && code <= 0xDFFF) i--
const code = str.charCodeAt(i);
if (code > 0x7f && code <= 0x7ff) s++;
else if (code > 0x7ff && code <= 0xffff) s += 2;
if (code >= 0xdc00 && code <= 0xdfff) i--;
}
return s
return s;
}
/**
......@@ -98,13 +105,13 @@ export function byteLength(str) {
* @returns {Array}
*/
export function cleanArray(actual) {
const newArray = []
const newArray = [];
for (let i = 0; i < actual.length; i++) {
if (actual[i]) {
newArray.push(actual[i])
newArray.push(actual[i]);
}
}
return newArray
return newArray;
}
/**
......@@ -112,13 +119,13 @@ export function cleanArray(actual) {
* @returns {Array}
*/
export function param(json) {
if (!json) return ''
if (!json) return "";
return cleanArray(
Object.keys(json).map(key => {
if (json[key] === undefined) return ''
return encodeURIComponent(key) + '=' + encodeURIComponent(json[key])
Object.keys(json).map((key) => {
if (json[key] === undefined) return "";
return encodeURIComponent(key) + "=" + encodeURIComponent(json[key]);
})
).join('&')
).join("&");
}
/**
......@@ -126,21 +133,21 @@ export function param(json) {
* @returns {Object}
*/
export function param2Obj(url) {
const search = decodeURIComponent(url.split('?')[1]).replace(/\+/g, ' ')
const search = decodeURIComponent(url.split("?")[1]).replace(/\+/g, " ");
if (!search) {
return {}
return {};
}
const obj = {}
const searchArr = search.split('&')
searchArr.forEach(v => {
const index = v.indexOf('=')
const obj = {};
const searchArr = search.split("&");
searchArr.forEach((v) => {
const index = v.indexOf("=");
if (index !== -1) {
const name = v.substring(0, index)
const val = v.substring(index + 1, v.length)
obj[name] = val
const name = v.substring(0, index);
const val = v.substring(index + 1, v.length);
obj[name] = val;
}
})
return obj
});
return obj;
}
/**
......@@ -148,9 +155,9 @@ export function param2Obj(url) {
* @returns {string}
*/
export function html2Text(val) {
const div = document.createElement('div')
div.innerHTML = val
return div.textContent || div.innerText
const div = document.createElement("div");
div.innerHTML = val;
return div.textContent || div.innerText;
}
/**
......@@ -160,21 +167,21 @@ export function html2Text(val) {
* @returns {Object}
*/
export function objectMerge(target, source) {
if (typeof target !== 'object') {
target = {}
if (typeof target !== "object") {
target = {};
}
if (Array.isArray(source)) {
return source.slice()
return source.slice();
}
Object.keys(source).forEach(property => {
const sourceProperty = source[property]
if (typeof sourceProperty === 'object') {
target[property] = objectMerge(target[property], sourceProperty)
Object.keys(source).forEach((property) => {
const sourceProperty = source[property];
if (typeof sourceProperty === "object") {
target[property] = objectMerge(target[property], sourceProperty);
} else {
target[property] = sourceProperty
target[property] = sourceProperty;
}
})
return target
});
return target;
}
/**
......@@ -183,18 +190,18 @@ export function objectMerge(target, source) {
*/
export function toggleClass(element, className) {
if (!element || !className) {
return
return;
}
let classString = element.className
const nameIndex = classString.indexOf(className)
let classString = element.className;
const nameIndex = classString.indexOf(className);
if (nameIndex === -1) {
classString += '' + className
classString += "" + className;
} else {
classString =
classString.substr(0, nameIndex) +
classString.substr(nameIndex + className.length)
classString.substr(nameIndex + className.length);
}
element.className = classString
element.className = classString;
}
/**
......@@ -202,10 +209,10 @@ export function toggleClass(element, className) {
* @returns {Date}
*/
export function getTime(type) {
if (type === 'start') {
return new Date().getTime() - 3600 * 1000 * 24 * 90
if (type === "start") {
return new Date().getTime() - 3600 * 1000 * 24 * 90;
} else {
return new Date(new Date().toDateString())
return new Date(new Date().toDateString());
}
}
......@@ -216,38 +223,38 @@ export function getTime(type) {
* @return {*}
*/
export function debounce(func, wait, immediate) {
let timeout, args, context, timestamp, result
let timeout, args, context, timestamp, result;
const later = function () {
// 据上一次触发时间间隔
const last = +new Date() - timestamp
const last = +new Date() - timestamp;
// 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait
if (last < wait && last > 0) {
timeout = setTimeout(later, wait - last)
timeout = setTimeout(later, wait - last);
} else {
timeout = null
timeout = null;
// 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用
if (!immediate) {
result = func.apply(context, args)
if (!timeout) context = args = null
result = func.apply(context, args);
if (!timeout) context = args = null;
}
}
}
};
return function (...args) {
context = this
timestamp = +new Date()
const callNow = immediate && !timeout
context = this;
timestamp = +new Date();
const callNow = immediate && !timeout;
// 如果延时不存在，重新设定延时
if (!timeout) timeout = setTimeout(later, wait)
if (!timeout) timeout = setTimeout(later, wait);
if (callNow) {
result = func.apply(context, args)
context = args = null
result = func.apply(context, args);
context = args = null;
}
return result
}
return result;
};
}
/**
......@@ -258,18 +265,18 @@ export function debounce(func, wait, immediate) {
* @returns {Object}
*/
export function deepClone(source) {
if (!source && typeof source !== 'object') {
throw new Error('error arguments', 'deepClone')
if (!source && typeof source !== "object") {
throw new Error("error arguments", "deepClone");
}
const targetObj = source.constructor === Array ? [] : {}
Object.keys(source).forEach(keys => {
if (source[keys] && typeof source[keys] === 'object') {
targetObj[keys] = deepClone(source[keys])
const targetObj = source.constructor === Array ? [] : {};
Object.keys(source).forEach((keys) => {
if (source[keys] && typeof source[keys] === "object") {
targetObj[keys] = deepClone(source[keys]);
} else {
targetObj[keys] = source[keys]
targetObj[keys] = source[keys];
}
})
return targetObj
});
return targetObj;
}
/**
......@@ -277,16 +284,16 @@ export function deepClone(source) {
* @returns {Array}
*/
export function uniqueArr(arr) {
return Array.from(new Set(arr))
return Array.from(new Set(arr));
}
/**
* @returns {string}
*/
export function createUniqueString() {
const timestamp = +new Date() + ''
const randomNum = parseInt((1 + Math.random()) * 65536) + ''
return (+(randomNum + timestamp)).toString(32)
const timestamp = +new Date() + "";
const randomNum = parseInt((1 + Math.random()) * 65536) + "";
return (+(randomNum + timestamp)).toString(32);
}
/**
......@@ -296,7 +303,7 @@ export function createUniqueString() {
* @returns {boolean}
*/
export function hasClass(ele, cls) {
return !!ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'))
return !!ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
}
/**
......@@ -305,7 +312,7 @@ export function hasClass(ele, cls) {
* @param {string} cls
*/
export function addClass(ele, cls) {
if (!hasClass(ele, cls)) ele.className += ' ' + cls
if (!hasClass(ele, cls)) ele.className += " " + cls;
}
/**
......@@ -315,76 +322,148 @@ export function addClass(ele, cls) {
*/
export function removeClass(ele, cls) {
if (hasClass(ele, cls)) {
const reg = new RegExp('(\\s|^)' + cls + '(\\s|$)')
ele.className = ele.className.replace(reg, ' ')
const reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
ele.className = ele.className.replace(reg, " ");
}
}
export function makeMap(str, expectsLowerCase) {
const map = Object.create(null)
const list = str.split(',')
const map = Object.create(null);
const list = str.split(",");
for (let i = 0; i < list.length; i++) {
map[list[i]] = true
map[list[i]] = true;
}
return expectsLowerCase
? val => map[val.toLowerCase()]
: val => map[val]
return expectsLowerCase ? (val) => map[val.toLowerCase()] : (val) => map[val];
}
export const exportDefault = 'export default '
export const exportDefault = "export default ";
export const beautifierConf = {
html: {
indent_size: '2',
indent_char: ' ',
max_preserve_newlines: '-1',
indent_size: "2",
indent_char: " ",
max_preserve_newlines: "-1",
preserve_newlines: false,
keep_array_indentation: false,
break_chained_methods: false,
indent_scripts: 'separate',
brace_style: 'end-expand',
indent_scripts: "separate",
brace_style: "end-expand",
space_before_conditional: true,
unescape_strings: false,
jslint_happy: false,
end_with_newline: true,
wrap_line_length: '110',
wrap_line_length: "110",
indent_inner_html: true,
comma_first: false,
e4x: true,
indent_empty_lines: true
indent_empty_lines: true,
},
js: {
indent_size: '2',
indent_char: ' ',
max_preserve_newlines: '-1',
indent_size: "2",
indent_char: " ",
max_preserve_newlines: "-1",
preserve_newlines: false,
keep_array_indentation: false,
break_chained_methods: false,
indent_scripts: 'normal',
brace_style: 'end-expand',
indent_scripts: "normal",
brace_style: "end-expand",
space_before_conditional: true,
unescape_strings: false,
jslint_happy: true,
end_with_newline: true,
wrap_line_length: '110',
wrap_line_length: "110",
indent_inner_html: true,
comma_first: false,
e4x: true,
indent_empty_lines: true
}
}
indent_empty_lines: true,
},
};
// 首字母大小
export function titleCase(str) {
return str.replace(/( |^)[a-z]/g, L => L.toUpperCase())
return str.replace(/( |^)[a-z]/g, (L) => L.toUpperCase());
}
// 下划转驼峰
export function camelCase(str) {
return str.replace(/-[a-z]/g, str1 => str1.substr(-1).toUpperCase())
return str.replace(/-[a-z]/g, (str1) => str1.substr(-1).toUpperCase());
}
export function isNumberStr(str) {
return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str)
return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str);
}
// Array JsonValue 排序
export function sortList(arr, key) {
return arr.sort((a, b) => {
return a[key].localeCompare(b[key]);
});
}
// 获取计算元素的属性的margin + padding + clientHeight
function getPropertyValue(el) {
let style, marginTop, marginBottom, paddingTop, paddingBottom;
style = window.getComputedStyle(el, null);
marginTop = style.getPropertyValue("margin-top");
marginBottom = style.getPropertyValue("margin-bottom");
paddingTop = style.getPropertyValue("padding-top");
paddingBottom = style.getPropertyValue("padding-bottom");
return (
parseFloat(marginTop) +
parseFloat(marginBottom) +
parseFloat(paddingTop) +
parseFloat(paddingBottom)
);
}
// 获取页面内除了table其他模块所占的高
export function restTableHeight($refs) {
let heigth = 0;
Object.keys($refs).map((key) => {
if (key != "formHeaderRef") {
if (key == "ylTable") {
$refs[key].$children.map((item) => {
if (item.$el.id == "group-btn") {
// console.log("group-btn：", getPropertyValue(item.$el));
// table表格组合按钮
heigth += getPropertyValue(item.$el);
heigth += item.$el.clientHeight;
} else if (item.$el.className == "el-pagination is-background") {
// table表格组合分页
if (item.$el.offsetParent.className == "pagination-container") {
// console.log(
// "pagination：",
// getPropertyValue(item.$el.offsetParent)
// );
// console.log(
// "paginationClientHeight：",
// getPropertyValue(item.$el.offsetParent.clientHeight)
// );
heigth += getPropertyValue(item.$el.offsetParent);
heigth += item.$el.offsetParent.clientHeight;
}
}
});
} else {
if ($refs[key].hasOwnProperty("$el")) {
heigth += $refs[key].$el.clientHeight;
heigth += getPropertyValue($refs[key].$el);
// console.log(
// "ruleForm：",
// $refs[key].$el.clientHeight,
// getPropertyValue($refs[key].$el)
// );
} else {
// console.log("ruleForm：", $refs[key]);
heigth += $refs[key].$el.clientHeight;
heigth += getPropertyValue($refs[key]);
}
}
} else if (key == "formHeaderRef") {
// console.log("formHeaderRef：", getPropertyValue($refs[key]));
heigth += getPropertyValue($refs[key]);
}
});
// console.log("heigth：", heigth);
return heigth;
}
......
export const inputBlurValidate = {
data(){
data() {
return {
queryForm: {
minWeight: "",
......@@ -7,6 +7,7 @@ export const inputBlurValidate = {
minNumOfPieces: "",
maxNumOfPieces: "",
},
validateForm: true,
};
},
methods: {
......@@ -36,49 +37,76 @@ export const inputBlurValidate = {
},
// 校验件数方法 【件数可以为空但件数不得为0】只能输入正整数
validateNumOfPieces(value, pieces) {
if (value.length) {
if (value.toString().length) {
// 获取当前输入框有值的情况下
this.queryForm[pieces] = Number(value);
let markPieces = false;
if (pieces == "minNumOfPieces" || pieces == "maxNumOfPieces") {
if (this.queryForm.minNumOfPieces && this.queryForm.maxNumOfPieces) {
markPieces = Number(this.queryForm.maxNumOfPieces) < Number(this.queryForm.minNumOfPieces);
// 最大件数和最小件数都不为空的情况下
if (
this.queryForm.minNumOfPieces.toString() != "" &&
this.queryForm.maxNumOfPieces.toString() != ""
) {
this.validateForm = true;
this.$refs.minNumOfPieces.innerHTML = "";
markPieces = true;
} else {
markPieces = false;
}
}
if (/^\d+$/.test(this.queryForm[pieces])) {
if (markPieces) {
//当最大件数和最小件数都不为空的情况下，最大件数小于最小件数的时候
if (this.queryForm.maxNumOfPieces < this.queryForm.minNumOfPieces) {
if (Array.isArray(this.$refs.minNumOfPieces)) {
this.msgError("最小件数不得大于最大件数");
this.validateForm = false;
} else {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最小件数不得大于最大件数";
this.$refs.minNumOfPieces.innerHTML =
"最小件数不得大于最大件数";
this.validateForm = false;
}
} else if (
this.queryForm.minNumOfPieces < 1 || this.queryForm.maxNumOfPieces < 1
}
//当最大件数和最小件数都不为空的情况下，最大件数和最小件数小于1的时候
else if (
this.queryForm.minNumOfPieces < 1 ||
this.queryForm.maxNumOfPieces < 1
) {
if (Array.isArray(this.$refs.minNumOfPieces)) {
this.msgError("最小件数和最大件数不能小于1");
this.validateForm = false;
} else {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最小件数和最大件数不能小于1";
}
} else {
if (!Array.isArray(this.$refs.minNumOfPieces)) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML =
"最小件数和最大件数不能小于1";
this.validateForm = false;
}
}
//当最大件数和最小件数都不为空的情况下，最大件数和最小件数满足大于1左区间小于等于右区间的时候
else {
this.$refs.minNumOfPieces.innerHTML = "";
this.validateForm = true;
}
} else {
// 当左右区间其中一个有值的情况下
if (value.length) {
if (Number(value) < 1) {
if (Array.isArray(this.$refs.minNumOfPieces)) {
this.msgError("件数不得小于1");
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "件数不得小于1";
this.validateForm = false;
} else {
this.msgError("件数不得小于1");
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "件数不得小于1";
this.validateForm = false;
}
} else {
if (!Array.isArray(this.$refs.minNumOfPieces)) {
this.$refs.minNumOfPieces.innerHTML = "";
this.validateForm = true;
}
}
}
......@@ -90,9 +118,38 @@ export const inputBlurValidate = {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "请输入有效件数";
}
return false;
this.validateForm = false;
}
} else {
// 【左右区间不是都有值的情况下】
// 最小件数为空最大件数有值的情况下
if (pieces == "minNumOfPieces" && this.queryForm.maxNumOfPieces > 0) {
this.$refs.minNumOfPieces.innerHTML = "";
this.validateForm = true;
} else {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "件数不得小于1";
this.validateForm = false;
}
// 最大件数为空最小件数有值的情况下
if (pieces == "maxNumOfPieces" && this.queryForm.minNumOfPieces > 0) {
this.$refs.minNumOfPieces.innerHTML = "";
this.validateForm = true;
} else {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "件数不得小于1";
this.validateForm = false;
}
// 左右区间 都为空的情况下
if (
this.queryForm.minNumOfPieces.toString().length == 0 &&
this.queryForm.maxNumOfPieces.toString().length == 0
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.validateForm = true;
}
}
return this.validateForm;
},
// 校验重量方法 【重量可以为空为0 && 最小/大重量的范围0~34KG】允许保留1~5位小数。
validateWeight(value, weight) {
......@@ -101,27 +158,34 @@ export const inputBlurValidate = {
let markWeight = false;
if (weight == "minWeight" || weight == "maxWeight") {
if (this.queryForm.minWeight && this.queryForm.maxWeight) {
markWeight = Number(this.queryForm.maxWeight) < Number(this.queryForm.minWeight);
markWeight =
Number(this.queryForm.maxWeight) <
Number(this.queryForm.minWeight);
}
}
if (/^(0|[1-9]\d*)(.\d{1,5})?$/.test(this.queryForm[weight])) {
if (this.queryForm[weight] >= 0) {
if (markWeight) {
if (Array.isArray(this.$refs.minWeight)) {
this.validateForm = false;
this.msgError("最小重量不得大于最大重量");
} else {
this.validateForm = false;
this.$refs.minWeight.innerHTML = "";
this.$refs.minWeight.innerHTML = "最小重量不得大于最大重量";
}
} else if (this.queryForm[weight] > 34) {
this.validateForm = false;
if (Array.isArray(this.$refs.minWeight)) {
this.msgError("最大重量不能大于34KG");
} else {
this.validateForm = false;
this.$refs.minWeight.innerHTML = "";
this.$refs.minWeight.innerHTML = "最大重量不能大于34KG";
}
} else {
if (!Array.isArray(this.$refs.minWeight)) {
this.validateForm = true;
this.$refs.minWeight.innerHTML = "";
}
}
......@@ -129,13 +193,16 @@ export const inputBlurValidate = {
if (value.length) {
if (Number(value) > 34) {
if (Array.isArray(this.$refs.minWeight)) {
this.validateForm = false;
this.msgError("最大重量不能大于34KG");
} else {
this.validateForm = false;
this.$refs.minWeight.innerHTML = "";
this.$refs.minWeight.innerHTML = "最大重量不能大于34KG";
}
} else {
if (!Array.isArray(this.$refs.minWeight)) {
this.validateForm = true;
this.$refs.minWeight.innerHTML = "";
}
}
......@@ -143,19 +210,21 @@ export const inputBlurValidate = {
}
} else {
if (Array.isArray(this.$refs.minWeight)) {
this.validateForm = false;
this.msgError("请输入正整数，小数保留5位");
} else {
this.validateForm = false;
this.$refs.minWeight.innerHTML = "";
this.$refs.minWeight.innerHTML = "请输入正整数，小数保留5位";
}
return false;
}
}
return this.validateForm;
},
// 报价值【申报价值可以为空为0】
validateCustomVal(value, customVal) {
if (value.length) {
this.queryForm[customVal] = Number(value);
this[customVal] = Number(value);
let coin = {
minCNYCustomVal: "minCNYCustomVal",
maxCNYCustomVal: "minCNYCustomVal",
......@@ -170,41 +239,56 @@ export const inputBlurValidate = {
};
let markCoin = false;
if (customVal == "minCNYCustomVal" || customVal == "maxCNYCustomVal") {
if (this.queryForm.minCNYCustomVal && this.queryForm.maxCNYCustomVal) {
markCoin = Number(this.queryForm.maxCNYCustomVal) < Number(this.queryForm.minCNYCustomVal);
if (this.minCNYCustomVal && this.maxCNYCustomVal) {
this.validateForm = false;
markCoin =
Number(this.maxCNYCustomVal) < Number(this.minCNYCustomVal);
}
} else {
if (this.queryForm.minSUDCustomVal && this.queryForm.maxSUDCustomVal) {
markCoin = Number(this.queryForm.maxSUDCustomVal) < Number(this.queryForm.minSUDCustomVal);
if (this.minSUDCustomVal && this.maxSUDCustomVal) {
this.validateForm = false;
markCoin =
Number(this.maxSUDCustomVal) < Number(this.minSUDCustomVal);
}
}
if (/^(0|[1-9]\d*)(.\d{1,2})?$/.test(this.queryForm[customVal])) {
if (this.queryForm[customVal] >= 0) {
if (/^(0|[1-9]\d*)(.\d{1,2})?$/.test(this[customVal])) {
if (this[customVal] >= 0) {
if (markCoin) {
this.validateForm = false;
this.$refs[coin[customVal]].innerHTML = "";
this.$refs[coin[customVal]].innerHTML = "最小申报价值不得大于最大申报价值";
} else if (this.queryForm[customVal] > currency[customVal]) {
this.$refs[coin[customVal]].innerHTML =
"最小申报价值不得大于最大申报价值";
} else if (this[customVal] > currency[customVal]) {
this.validateForm = false;
this.$refs[coin[customVal]].innerHTML = "";
this.$refs[coin[customVal]].innerHTML = `最大申报值不得大于${currency[customVal]}`;
this.$refs[
coin[customVal]
].innerHTML = `最大申报值不得大于${currency[customVal]}`;
} else {
this.validateForm = true;
this.$refs[coin[customVal]].innerHTML = "";
}
} else {
if (value.length) {
if (Number(value) > currency[customVal]) {
this.validateForm = false;
this.$refs[coin[customVal]].innerHTML = "";
this.$refs[coin[customVal]].innerHTML = `最大申报值不得大于${currency[customVal]}`;
this.$refs[
coin[customVal]
].innerHTML = `最大申报值不得大于${currency[customVal]}`;
} else {
this.validateForm = true;
this.$refs[coin[customVal]].innerHTML = "";
}
}
}
} else {
this.validateForm = false;
this.$refs[coin[customVal]].innerHTML = "";
this.$refs[coin[customVal]].innerHTML = "请输入正确申报价值";
return false;
}
}
return this.validateForm;
},
},
};
......
......@@ -81,7 +81,7 @@ service.interceptors.response.use(res => {
type: 'error'
})
return Promise.reject(new Error(msg))
} else if (code !== 200 && code !== 201 && code !== 202 && code !== 203 && code !== 603) {
} else if (code !== 200 && code !== 201 && code !== 202 && code != 203 && code != 603 && code != 402) {
Message({
message: msg,
type: 'error'
......
<template>
<div class=''></div>
</template>
<script>
export default {
name: '',
components: {},
data() {
return {
}
},
computed: {},
created () {},
mounted () {},
methods: {}
}
</script>
<style lang='scss' scoped>
</style>
<template>
<div class=''></div>
</template>
<script>
export default {
name: '',
components: {},
data() {
return {
}
},
computed: {},
created () {},
mounted () {},
methods: {}
}
</script>
<style lang='scss' scoped>
</style>
<template>
<div class="form-header">
<el-row style="padding-bottom: 20px">
<el-col>
<el-divider content-position="left">ET86配舱航班顺位</el-divider>
</el-col>
</el-row>
<!-- ET86配舱航班顺位 -->
<el-row :gutter="24" justify="center">
<el-col :span="18">
<yl-table
emptyText="请添加配舱航班"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:tableData="tableData"
:pageConfig="{
isPagination: false,
}"
@add="addBtn"
>
<template #column>
<el-table-column
type="index"
label="序号"
width="50"
align="center"
></el-table-column>
<el-table-column
label="航班号"
prop="fltNo"
min-width="100"
align="center"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.fltNo"
clearable
:readonly="scope.row.edit | isEdit"
@focus="inputFocus(scope)"
@input="inputEvent"
placeholder="请输入航班号"
size="small"
/>
</template>
</el-table-column>
<el-table-column
label="加减天数"
prop="fltNoDate"
width="100"
align="center"
>
<template slot-scope="scope">
<el-input
type="number"
v-model="scope.row.fltNoDate"
:readonly="scope.row.edit | isEdit"
:disabled="scope.row.edit | isEdit"
min="-7"
max="7"
v-input-filter
clearable
placeholder=""
size="small"
/>
</template>
</el-table-column>
<el-table-column
label="航线"
prop="fltRoute"
min-width="100"
align="center"
>
<template slot-scope="scope">
<el-select
v-model="scope.row.fltRoute"
placeholder="请选择"
size="small"
>
<el-option
v-for="item in scope.row.routeList"
:key="item.id"
:label="item.route"
:value="item.route"
>
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column
label="爆仓是否继续配舱"
prop="isOn"
min-width="100"
align="center"
>
<template slot-scope="scope">
<el-checkbox
v-model="scope.row.isOn"
:disabled="scope.row.edit | isEdit"
@change="changeCheck(scope)"
></el-checkbox>
</template>
</el-table-column>
<el-table-column label="操作" min-width="100" align="center">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
:disabled="scope.row.edit"
@click="deleBtn(scope.row, scope.$index)"
>删除</el-button
>
</template>
</el-table-column>
</template>
</yl-table>
</el-col>
</el-row>
<!-- 航线维度设置 -->
<el-row style="padding: 20px 0">
<el-col>
<el-divider content-position="left">航线维度设置</el-divider>
</el-col>
</el-row>
<el-card shadow="always" class="box-card">
<el-form
:model="queryForm"
label-position="right"
label-width="120px"
ref="ruleForm"
class="config-form"
>
<el-row class="rowPadding">
<el-col :span="12">
<el-form-item label="原航班号">
<el-input
type="textarea"
v-model="queryForm.fltNo"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="请输入原航班号"
></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="服务种类">
<el-col :span="4">
<el-radio-group
v-model="queryForm.isServiceCode"
@change="isServiceCode"
>
<el-radio label="1">包含ServiceCode</el-radio>
<el-radio label="2">不包含ServiceCode</el-radio>
</el-radio-group>
</el-col>
<el-col :span="10" :offset="1">
<el-input
type="textarea"
v-model="queryForm.serviceCode"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="请输入ServiceCode"
@blur="serviceCodeBlur"
></el-input>
</el-col>
</el-form-item>
</el-col>
<el-col :span="24">
<el-col :span="12">
<el-form-item label="URSA包含">
<el-input
type="textarea"
v-model="queryForm.includeUrsa"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="URSA之间用分号分隔，例：F2;F3;P_"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="URSA不包含">
<el-input
type="textarea"
v-model="queryForm.notIncludeUrsa"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="URSA之间用分号分隔，例：F2;F3;P_"
></el-input>
</el-form-item>
</el-col>
</el-col>
<el-col :span="24">
<el-form-item label="申报类别">
<el-card shadow="never">
<el-checkbox-group
v-model="checkboxClsssType"
@change="checkboxCargoType"
style="display: flex"
v-if="queryForm.cargoType.length"
>
<el-checkbox
v-for="item in queryForm.cargoType"
:label="item.chineseName"
:name="item.chineseName"
:key="item.code"
>
<Tooltips :content="item.chineseName" :refName="item.code">
</Tooltips>
</el-checkbox>
</el-checkbox-group>
</el-card>
</el-form-item>
</el-col>
<el-col :span="24">
<el-col :span="3">
<el-form-item label="单品名">
<el-checkbox v-model="queryForm.singleName"></el-checkbox>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="" class="custom-label">
<span class="custom-label-title">重量(KG)</span>
<el-col :span="10">
<el-input
v-model.trim="queryForm.minWeight"
clearable
placeholder="最小重量"
@blur="inputBlurMinWeight($event)"
></el-input>
<span ref="minWeight" class="el-form-item__error"></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="queryForm.maxWeight"
clearable
placeholder="最大重量"
@blur="inputBlurMaxWeight($event)"
></el-input>
</el-col>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="件数" class="custom-label-pieces">
<el-col :span="10">
<el-input
v-model.trim="queryForm.minNumOfPieces"
clearable
placeholder="最少件数"
@blur="inputBlurMinPieces($event)"
></el-input>
<span ref="minNumOfPieces" class="el-form-item__error"></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="queryForm.maxNumOfPieces"
clearable
placeholder="最多件数"
@blur="inputBlurMaxPieces($event)"
></el-input>
</el-col>
</el-form-item>
</el-col>
</el-col>
<el-col :span="24">
<el-col :span="3">
<el-form-item label="申报价值"></el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="" class="custom-label">
<span class="custom-label-title">人民币</span>
<el-col :span="10">
<el-input
v-model.trim="queryForm.minCNYCustomVal"
clearable
placeholder="最小申报价值"
@blur="inputBlurMin($event, 'minCNYCustomVal')"
></el-input>
<span
ref="minCNYCustomVal"
class="el-form-item__error"
></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="queryForm.maxCNYCustomVal"
clearable
placeholder="最大申报价值"
@blur="inputBlurMax($event, 'maxCNYCustomVal')"
></el-input>
</el-col>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="美元" class="custom-label-pieces">
<el-col :span="10">
<el-input
v-model.trim="queryForm.minSUDCustomVal"
clearable
placeholder="最小申报价值"
@blur="inputBlurMin($event, 'minSUDCustomVal')"
></el-input>
<span
ref="minSUDCustomVal"
class="el-form-item__error"
></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="queryForm.maxSUDCustomVal"
clearable
placeholder="最大申报价值"
@blur="inputBlurMax($event, 'maxSUDCustomVal')"
></el-input>
</el-col>
</el-form-item>
</el-col>
</el-col>
<el-col :span="24">
<el-form-item label="">
<el-button type="primary" @click="submitForm('ruleForm')"
>保存</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import { formConfig } from "./formConfig";
import { debounce } from "@/utils";
import { inputBlurValidate } from "@/utils/mixins";
import { tableAttr } from "./tableConfig";
import {
allDictData, // 获取全部字典
queryRouteByFltNo, // 航线查询
findDestinationFltRuleByFlightNo, // 获取航班下航线维度
} from "@/api/destinationFlight";
import indexMixins from "./mixins";
export default {
name: "edit",
components: {
YlForm,
YlTable,
},
mixins: [indexMixins, inputBlurValidate],
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
// 表单参数
fltNo: "", // 原航班号
isServiceCode: "1", // 服务种类
serviceCode: "",
includeUrsa: "", // URSA包含
notIncludeUrsa: "", // URSA不包含
cargoType: [], // 申报类别调用接口获取所有的申报类别
checkboxCargoType: [], // 已勾选申报类别的数据
singleName: false, // 单品名
minWeight: "",
maxWeight: "",
minNumOfPieces: "",
maxNumOfPieces: "",
minCNYCustomVal: "", //
maxCNYCustomVal: "", //
minSUDCustomVal: "", //
maxSUDCustomVal: "", //
},
tableAttr: tableAttr, // table配置项
tableData: [],
currentIndex: 0, // 记录当前table 列的索引位置
id: 0,
checkboxClsssType: [], // 申报类别
serviceCodeData: [], // 【服务种类】调用接口获取服务种类所有的serviceCode
};
},
computed: {},
created() {
this.tableData = [
{
id: this.id++,
fltNo: "",
fltNoDate: "",
fltRoute: "",
routeList: [],
isOn: "0" ? false : true,
sort: "0", // 排序字段
},
];
this.getAllDictData();
this.getEdit();
this.PostFindDestinationFltRuleByFlightNo();
},
mounted() {},
directives: {
// 处理加减天数
"input-filter": {
bind: function (el, binding) {
el.handler = function (event) {
if (event.data == "E" || event.data == "e") {
// 无理数时
event.target.value = "";
}
if (event.target.value) {
if (Number(event.target.value) < -7) {
event.target.value = "";
} else if (Number(event.target.value) > 7) {
event.target.value = "";
} else if (/[\.]/.test(Number(event.target.value))) {
// 浮点数时
event.target.value = "";
} else {
}
event.target.dispatchEvent(new Event("input"));
}
};
el.addEventListener("input", el.handler);
},
unbind: function (el) {
el.removeEventListener("input", el.handler);
},
},
},
filters: {
isEdit: function (value) {
switch (value) {
case "新增":
false;
break;
case "编辑":
true;
break;
default:
"新增";
}
},
// 航线个数
fltRoute(val) {
if (val.length && val.split(",").length > 2) {
return false;
} else {
return true;
}
},
},
methods: {
// 获取编辑详情数据
getEdit() {},
// 获取所有数据字典
getAllDictData() {
allDictData().then((res) => {
if (res.code != 200) {
this.msgError(res.msg);
return;
}
this.queryForm.cargoType = res.data.cargoType; // 申报类别
if (res.data.serviceCode.length) {
this.getObj(res.data);
}
});
},
// 航线查询
getQueryRouteByFltNo(item) {
this.tableAttr.loadingTable = true;
queryRouteByFltNo(item).then((res) => {
this.tableAttr.loadingTable = false;
if (res.code == 200) {
const list = res.data.list;
let routeList = [];
if (list.length) {
list.map((item) => {
routeList.push(item);
});
let isEtesRoute = list.filter((item) => item.isEtesRoute == "Y"); // 过滤普通航线
if (isEtesRoute.length == 0) {
this.msgError("该航班下的航线均为普通航线");
}
this.tableData[this.currentIndex].fltRoute = "";
this.tableData[this.currentIndex].routeList = isEtesRoute;
} else {
this.msgError("暂无航线");
this.tableData[this.currentIndex].routeList = [];
this.tableData[this.currentIndex].fltRoute = "";
}
}
});
},
// 获取航班下航线维度
PostFindDestinationFltRuleByFlightNo() {
let params = {};
findDestinationFltRuleByFlightNo(params).then((res) => {
console.log(res);
});
},
// 航班号input 聚焦事件
inputFocus({ $index }) {
this.currentIndex = $index;
},
// 航班号input搜索事件
inputEvent: debounce(function () {
let params = {
fltNo: this.tableData[this.currentIndex].fltNo,
};
if (params.fltNo) {
this.getQueryRouteByFltNo(params);
} else {
this.tableData[this.currentIndex].fltRoute = "";
this.tableData[this.currentIndex].routeList = [];
this.msgError("请输入航班号");
}
}, 1000),
// 添加ET86配舱航班顺位
addBtn(item) {
this.tableData.unshift({
id: this.id++,
fltNo: "",
fltNoDate: "",
fltRoute: "",
routeList: [],
isOn: "0" ? false : true,
sort: "0", // 排序字段
});
},
// 是否爆仓
changeCheck({ $index, row }) {
this.tableData.map((item, i) => {
if ($index !== i) {
item.isOn = false;
}
});
},
// 删除
deleBtn(item, $index) {
this.tableData.splice($index, 1);
},
// 类别
checkboxCargoType(arr) {
let include = this.queryForm.cargoType.filter((item) =>
arr.some((val) => val == item.chineseName)
);
this.queryForm.checkboxCargoType = include; //已勾选申报类别的数据
// console.log(arr, include);
},
// 表单提交
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
let parmas = {
fltInfoList: this.tableData,
...this.queryForm,
};
parmas.singleName = this.queryForm.singleName ? "Y" : "N"; // N为单品名，Y为多品名
console.log(parmas);
} else {
console.log("error submit!!");
return false;
}
});
this.$emit("handleSearch");
},
},
};
</script>
<style lang="scss" scoped>
.rowPadding {
padding: 10px 0;
font-size: 12px;
}
::v-deep .custom-label {
.el-form-item__content {
display: flex;
margin-left: 0 !important;
span {
font-size: 14px;
color: #606266;
font-weight: 700;
float: right;
margin-right: 10px;
text-align: end;
}
.custom-label-title {
width: 120px;
}
.el-input__suffix {
right: -15px !important;
}
.el-form-item__error {
color: #ff4949;
font-size: 12px;
line-height: 1;
padding-top: 4px;
position: absolute;
top: 100%;
left: 0;
font-weight: 500;
width: 100% !important;
}
}
}
::v-deep .custom-label-pieces {
.el-form-item__content {
width: 80%;
}
}
</style>
<template>
<div class="form-header container">
<el-row>
<el-col>
<yl-form
ref="ruleForm"
:formConfig="formConfig"
:queryForm="queryForm"
@input="inputEvent"
@keyup="keyUpEvent"
/>
</el-col>
</el-row>
<yl-table
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:columns="columns"
:tableData="tableData"
:pageConfig="pageConfig"
@sizeChange="handleSizeChange"
@currentChange="handleCurrentChange"
@search="searchBtn"
@restForm="restForm"
@add="addBtn"
>
</yl-table>
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import { formConfig } from "./formConfig";
import { debounce } from "@/utils";
import { tableAttr, columnHeader, tableData } from "./tableConfig";
import {
allDictData, // 获取全部字典
queryRouteByFltNo, // 航线查询
} from "@/api/destinationFlight";
export default {
components: {
YlForm,
YlTable,
},
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
// 表单参数
status: "有效",
},
pageConfig: {
// 分页配置项
isPagination: true,
total: 13,
pageData: {
page: 1,
size: 10,
},
},
tableAttr: tableAttr, // table配置项
columns: columnHeader(this.viewRow, this.editRow, this.deleteRow), // 表头
tableData: tableData, // 表格数据
selectionList: [], // table复选框筛选集合
};
},
created() {},
mounted() {},
methods: {
// 航线查询
queryRoute(item) {
queryRouteByFltNo(item).then((res) => {
if (res.code == 200) {
const list = res.data.list;
let routeList = "";
if (list.length) {
list.map((item) => {
routeList += item.route + ",";
});
this.queryForm.fltRoute = routeList.substring(
0,
routeList.length - 1
);
} else {
this.queryForm = {
fltNo: item.fltNo, // 航班号
};
}
}
});
},
// input事件
inputEvent: debounce(function () {
this.queryRoute({
fltNo: this.queryForm.fltNo, // 航班号
});
}, 800),
// 回车事件
keyUpEvent(item) {
this.queryRoute(item);
},
// table复选框事件
selectionTable(e) {
console.log("selectionTable：", e);
this.selectionList = e;
},
//条数变化
handleSizeChange(e) {
this.pageConfig.pageData.size = e;
this.pageConfig.pageData.page = 1;
console.log("sizeChange：", e);
},
//页码变化
handleCurrentChange(e) {
this.pageConfig.pageData.page = e;
console.log("currentChange：", e);
},
// 搜索
searchBtn(row) {
let params = {
...this.queryForm,
};
if (this.queryForm.status == "有效") {
params.status = '1';
}
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
console.log(params);
});
},
// 重置表单
restForm() {
this.$refs.ruleForm.resetFields("ruleForm");
},
// 添加
addBtn(item) {
console.log("add：", item);
this.$router.push({
name: "edit",
params: {
edit: 12,
},
});
},
// 编辑
editRow(item) {
this.$router.push({
name: "edit",
params: {
edit: 12,
},
});
console.log("修改：", item);
},
// 删除
deleteRow(item) {
this.$confirm("是否确认删除？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
center: true,
})
.then(() => {
console.log("删除：", item);
this.msgSuccess("删除成功!");
})
.catch(() => {});
},
// 查看
viewRow({ row }) {
this.$router.push({
name: "edit",
params: {
edit: 12,
},
});
console.log("查看：", row);
},
},
};
</script>
<style lang="scss" scoped></style>
const state = {
1: "有效",
3: "无效",
};
export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 300,
btnCofig: {
isBtn: true,
btnGroup: [
{
type: "primary", // text、primary、danger
icon: "el-icon-search", // el-icon-edit 、el-icon-delete、el-icon-plus、el-icon-download、el-icon-upload el-icon--right
btnName: "搜索",
size: "mini", // medium / small / mini
round: false,
loading: false,
event: "search",
},
{
type: "info",
icon: "",
btnName: "重置",
size: "mini",
round: false,
loading: false,
event: "restForm",
},
{
type: "primary",
icon: "el-icon-plus",
btnName: "添加",
size: "mini",
round: false,
loading: false,
event: "add",
},
],
},
};
export const columnHeader = (viewRow, editRow, deleteRow) => [
{
type: "selection",
align: "center",
prop: "selection",
width: "50",
},
{
type: "index",
label: "序号",
prop: "id",
align: "center",
width: "50",
},
{
label: "原航班号",
prop: "fltNo",
align: "center",
minWidth: 100,
},
{
label: "顺位航班",
prop: "flightRand",
align: "center",
minWidth: 100,
},
{
label: "URSA包含",
prop: "includeUrsa",
align: "center",
minWidth: 100,
},
{
label: "URSA不包含",
prop: "notIncludeUrsa",
align: "center",
minWidth: 100,
},
{
label: "状态",
prop: "status",
align: "center",
minWidth: 100,
render: (h, params) => {
const { row } = params;
return h("div", `${state[row.status]}`);
},
},
{
label: "创建时间",
prop: "createTime",
align: "center",
minWidth: 100,
sortable: true,
"sort-method": (a, b) => b.createTime - a.createTime,
},
{
label: "创建人",
prop: "createUserName",
align: "center",
minWidth: 100,
},
{
label: "修改时间",
prop: "updateTime",
align: "center",
minWidth: 100,
},
{
label: "修改人",
prop: "updateUserName",
align: "center",
minWidth: 100,
},
{
label: "操作",
prop: "operate",
align: "center",
minWidth: 120,
fixed: "right",
render: (h, params) => {
return h("div", [
h(
"el-button",
{
props: {
type: "text",
size: "mini",
icon: "el-icon-view",
},
on: {
click() {
viewRow(params);
},
},
},
"查看"
),
h(
"el-button",
{
props: {
type: "text",
size: "mini",
icon: "el-icon-edit",
},
on: {
click() {
editRow(params);
},
},
},
"修改"
),
h(
"el-button",
{
style: {
color: "#ff4949",
},
props: {
type: "text",
size: "mini",
icon: "el-icon-delete",
},
on: {
click() {
deleteRow(params);
},
},
},
"删除"
),
]);
},
},
];
export const tableData = [
{
id: "1",
flightRand: "LZ003;LZ00",
status: "1",
fltNo: "FX0090",
includeUrsa: "URSACODE191",
notIncludeUrsa: "P_3",
createTime: "2023-08-14",
createUserName: "wjh",
updateTime: "2023-08-14",
updateUserName: "wjh",
},
{
id: "2",
flightRand: "LP001;LP004+1",
status: "3",
fltNo: "FX0090",
includeUrsa: "P_;URSACODE105",
notIncludeUrsa: "P_21",
createTime: "2023-08-14",
createUserName: "wjh",
updateTime: "2023-08-14",
updateUserName: "wjh",
},
{
id: "3",
flightRand: "CQ00;LZ003;CS0004",
status: "1",
fltNo: "CS0002",
includeUrsa: "URSACODE12",
notIncludeUrsa: "P_2",
createTime: "2023-08-14",
createUserName: "wjh",
updateTime: "2023-08-14",
updateUserName: "wjh",
},
{
id: "4",
flightRand: "LZ001;LZ002;LZ004",
status: "1",
fltNo: "FX0090",
includeUrsa: "URSACODE192",
notIncludeUrsa: "P_17",
createTime: "2023-08-11",
createUserName: "wjh",
updateTime: "2023-08-11",
updateUserName: "wjh",
},
{
id: "5",
flightRand: "PS001;PS003",
status: "1",
fltNo: "FX0091",
includeUrsa: "URSACODE10",
notIncludeUrsa: "P_28",
createTime: "2023-08-11",
createUserName: "wjh",
updateTime: "2023-08-11",
updateUserName: "wjh",
},
{
id: "6",
flightRand: "PS002;PS003",
status: "3",
fltNo: "XN007",
includeUrsa: "URSACODE27",
notIncludeUrsa: "P_4",
createTime: "2023-08-11",
createUserName: "wjh",
updateTime: "2023-08-11",
updateUserName: "wjh",
},
{
id: "7",
flightRand: "XN001;XN002;XN003;XN004",
status: "1",
fltNo: "XN001",
includeUrsa: "URSACODE34",
notIncludeUrsa: "P_7",
createTime: "2023-08-10",
createUserName: "wjh",
updateTime: "2023-08-10",
updateUserName: "wjh",
},
{
id: "8",
flightRand: "HA004",
status: "3",
fltNo: "LZ007",
includeUrsa: "URSACODE71",
notIncludeUrsa: "P_2",
createTime: "2023-08-10",
createUserName: "wjh",
updateTime: "2023-08-10",
updateUserName: "wjh",
},
{
id: "9",
flightRand: "AB0001;AB123",
status: "1",
fltNo: "AB0001",
includeUrsa: "URSACODE87",
notIncludeUrsa: "P_26",
createTime: "2023-08-10",
createUserName: "wjh",
updateTime: "2023-08-10",
updateUserName: "wjh",
},
];
<template>
<div class="form-header container">
<yl-table
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:columns="columns"
:tableData="tableData"
:pageConfig="pageConfig"
@sizeChange="handleSizeChange"
@currentChange="handleCurrentChange"
>
</yl-table>
</div>
</template>
<script>
import YlTable from "@/components/YlTable";
import { tableAttr, columnHeader } from "./tableConfig";
export default {
name: "ErrorInfo",
components: {
YlTable,
},
data() {
return {
pageConfig: {
// 分页配置项
isPagination: false,
total: 0,
pageData: {
page: 1,
size: 10,
},
},
tableAttr: tableAttr, // table配置项
columns: columnHeader(), // 表头
tableData: [], // 表格数据
};
},
created() {
const { data } = this.$route.query;
this.tableData = JSON.parse(data);
},
methods: {
//条数变化
handleSizeChange(e) {
this.pageConfig.pageData.size = e;
this.pageConfig.pageData.page = 1;
this.searchBtn();
},
//页码变化
handleCurrentChange(e) {
this.pageConfig.pageData.page = e;
this.searchBtn();
},
// 搜索
searchBtn() {},
},
};
</script>
<style lang="scss" scoped></style>
export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 300,
btnCofig: {
isBtn: false,
btnGroup: [],
},
};
export const columnHeader = () => [
{
type: "index",
label: "序号",
prop: "rowNum",
align: "center",
width: "70",
},
{
label: "错误信息",
prop: "msg",
align: "center",
minWidth: 150,
},
];
<template>
<div class="error-container">
<el-dialog
:width="width"
:title="title"
:center="center"
:visible.sync="dialogVisible"
:close-on-click-modal="onModalClickClose"
@open="dialogOpenEvent"
@close="dialogCloseEvent"
>
<slot></slot>
<span slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="confirm">{{
confirmBtnName
}}</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
width: {
type: String,
default: "50%",
},
title: {
type: String,
default: "标题",
},
center: {
type: String,
default: "center",
},
confirmBtnName: {
type: String,
default: "确 定",
},
onModalClickClose: {
type: Boolean,
default: false,
},
},
data() {
return {
dialogVisible: false,
};
},
computed: {},
created() {},
mounted() {},
methods: {
dialogOpenEvent(data) {
if (data && data.length) {
console.log(data);
}
this.dialogVisible = true;
this.$emit("open");
},
dialogCloseEvent() {
this.dialogVisible = false;
this.$emit("close");
},
// 确认事件
confirm() {
this.dialogVisible = false;
this.$emit("confirm");
},
// 取消事件
cancel() {
this.dialogVisible = false;
this.$emit("cancel");
},
},
};
</script>
<style lang='scss' scoped>
</style>
export const formConfig = [
{
label: "HSCODE",
type: "Input",
name: "searchValue",
prop: "searchValue",
placeholder: "根据Hscode查询",
span: 6,
trigger: "blur", // 事件名
},
];
<template>
<div ref="formHeaderRef" class="form-header container">
<el-row>
<el-col>
<yl-form
ref="ruleForm"
:formConfig="formConfig"
:queryForm="queryForm"
:inline="false"
formWidth="auto"
@blur="blurEvent"
/>
</el-col>
</el-row>
<yl-table
ref="ylTable"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:columns="columns"
:tableData="tableData"
:pageConfig="pageConfig"
@search="searchBtn"
@download="downloadTemplate"
@upload="toUpload"
@rmfile="onRemoveUpload"
@export="exportTemplate"
@delete="deleteData"
@sizeChange="handleSizeChange"
@currentChange="handleCurrentChange"
@selectionEvent="tableSelectionChange"
>
</yl-table>
<!-- <modle-view
ref="modleViewRef"
width="30%"
title="导入Excel"
confirmBtnName="导入Excel"
@confirm="dialogConfirm"
>
<el-form
:model="paramsForm"
:rules="rules"
ref="ruleForm"
label-width="80px"
>
<el-row>
<el-col :span="20">
<el-form-item
label="商品名称"
prop="skuName"
size="small"
label-position="left"
>
<el-input
v-model="paramsForm.skuName"
placeholder="请输入商品名称"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item prop="file">
<el-upload
ref="upload"
action="/goods/uploadGoodsExcel"
name="file"
:http-request="toUpload"
:on-remove="onRemoveUpload"
:limit="1"
accept=".xlsx"
class="upload"
>
<el-button type="primary" icon="el-icon-upload2" size="small"
>选择文件</el-button
>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-form>
</modle-view> -->
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import ModleView from "./components/ModleView";
import { formConfig } from "./formConfig";
import { tableAttr, columnHeader } from "./tableConfig";
import { restTableHeight } from "@/utils";
import {
findHsCodeList, // ShipmentDesc查询
delBlackList, // ShipmentDesc删除
downLoadTemplate, // ShipmentDesc下载模板
uploadHsCode, // ShipmentDesc导入
} from "@/api/et86HsCodeBlack";
import { downLoadXlsx } from "@/utils/zipdownload";
export default {
name: "Et86HsCodeBlack",
components: {
YlForm,
YlTable,
ModleView,
},
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
searchValue: "",
}, // 表单参数
paramsForm: {
skuName: "",
file: null,
},
rules: {
skuName: [
{ required: true, message: "请输入商品名称", trigger: "blur" },
],
},
pageConfig: {
// 分页配置项
isPagination: true,
total: 0,
pageData: {
page: 1,
size: 10,
},
},
tableAttr: tableAttr, // table配置项
columns: columnHeader(this.deleteRow), // 表头
tableData: [], // 表格数据
multipleSelection: [],
};
},
created() {
// 黑名单查询
this.$nextTick(() => {
this.searchBtn();
});
},
mounted() {
this.$nextTick(() => {
this.tableAttr.maxHeight =
window.innerHeight - restTableHeight(this.$refs);
});
},
methods: {
// HScode黑名单查询
queryFindHsCodeList() {
const { page, size } = this.pageConfig.pageData;
let params = {
limitStart: (page - 1) * size,
limitSize: size,
...this.queryForm,
};
this.tableAttr.loadingTable = true;
findHsCodeList(params)
.then((res) => {
this.tableAttr.loadingTable = false;
const { code, data } = res;
if (code == 200) {
this.tableData = data.list;
this.pageConfig.total = data.total;
}
})
.catch(() => {});
},
// 删除黑名单
toDelBlackList(params) {
delBlackList(params)
.then((res) => {
const { code, msg } = res;
if (code == 200) {
this.searchBtn();
this.msgSuccess(msg || "删除成功!");
} else {
this.$message.error(msg || "删除失败");
}
})
.catch(() => {});
},
// 失焦事件
blurEvent() {},
// 选择上传【HScode黑名单导入】
toUpload({ file }) {
const formData = new FormData();
formData.append("file", file);
uploadHsCode(formData)
.then((res) => {
const { code, data, msg } = res;
if (code == 200) {
this.searchBtn();
this.msgSuccess(msg || "导入成功!");
} else {
this.$message.error(msg || "导入失败");
this.$router.push({
path: "/errorInfo",
query: {
name: "errorInfo",
error: code,
data: JSON.stringify(data),
},
});
}
})
.catch(() => {});
},
//移除上传
onRemoveUpload(options) {
console.log(options);
},
// 搜索
searchBtn() {
this.pageConfig.pageData.page = 1;
this.pageConfig.pageData.size = 10;
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
this.queryFindHsCodeList();
});
},
// 确认对话框
dialogConfirm() {},
// 下载【HScode黑名单下载模板】
downloadTemplate() {
downLoadTemplate("hsCode")
.then((res) => {
if (res) {
const blob = new Blob([res]);
const link = document.createElement("a"); //创建a标签
link.download = "HSCODE黑名单表.xlsx"; //a标签添加属性
link.style.display = "none";
link.href = URL.createObjectURL(blob);
document.body.appendChild(link);
link.click(); //执行下载
URL.revokeObjectURL(link.href); //释放url
document.body.removeChild(link); //释放标签
} else {
this.$message.error("下载失败");
}
})
.catch(() => {});
},
// 上传
upLoadTemplate() {
// console.log(this.$refs.modleViewRef);
},
// 导出
exportTemplate(row, i) {
this.tableAttr.btnCofig.btnGroup[i].loading = true;
downLoadXlsx("/etes/exportHsCodeList", this.queryForm, "HSCODE黑名单表")
.then(() => {
this.tableAttr.btnCofig.btnGroup[i].loading = false;
})
.catch(() => {
this.$message.error("导出失败");
});
},
// 删除
deleteData(row) {
if (this.multipleSelection.length) {
let params = [];
this.multipleSelection.map((item) => {
params.push(item.id);
});
this.$confirm("是否确认删除？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
center: true,
})
.then(() => {
this.toDelBlackList(params);
})
.catch(() => {});
} else {
this.$message.error("请勾选一条或者多条数据再操作！");
}
},
//条数变化
handleSizeChange(e) {
this.pageConfig.pageData.size = e;
this.pageConfig.pageData.page = 1;
this.queryFindHsCodeList();
},
//页码变化
handleCurrentChange(e) {
this.pageConfig.pageData.page = e;
this.queryFindHsCodeList();
},
// table勾选
tableSelectionChange(val) {
this.multipleSelection = val;
},
// 删除
deleteRow({ row }) {
this.$confirm("是否确认删除？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
center: true,
})
.then(() => {
this.toDelBlackList([row.id]);
})
.catch(() => {});
},
},
};
</script>
<style lang="scss" scoped></style>
export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 0,
btnCofig: {
isBtn: true,
btnGroup: [
{
type: "primary", // text、primary、danger
icon: "el-icon-search", // el-icon-edit 、el-icon-delete、el-icon-plus、el-icon-download、el-icon-upload el-icon--right
btnName: "搜索",
size: "mini", // medium / small / mini
round: false,
loading: false,
event: "search",
},
{
type: "primary",
icon: "el-icon-download",
btnName: "下载模板",
size: "mini",
round: false,
loading: false,
event: "download",
},
{
type: "primary",
icon: "el-icon-upload",
btnName: "导入",
size: "mini",
round: false,
loading: false,
event: "upLoad",
action: "/goods/uploadGoodsExcel",
fileName: "name",
limit: 1,
accept: ".xlsx",
},
{
type: "primary",
icon: "el-icon-download",
btnName: "导出",
size: "mini",
round: false,
loading: false,
event: "export",
},
{
type: "danger",
icon: "el-icon-delete",
btnName: "删除",
size: "mini",
round: false,
loading: false,
event: "delete",
},
],
},
};
export const columnHeader = (deleteRow) => [
{
type: "selection",
align: "center",
prop: "selection",
width: "50",
},
{
type: "index",
label: "序号",
prop: "id",
align: "center",
width: "50",
},
{
label: "HSCODE",
prop: "blackValue",
align: "center",
minWidth: 100,
},
{
label: "创建时间",
prop: "createTime",
align: "center",
minWidth: 100,
},
{
label: "创建人",
prop: "createUserName",
align: "center",
minWidth: 100,
},
{
label: "文件名",
prop: "uploadFileName",
align: "center",
minWidth: 100,
},
{
label: "操作",
prop: "operate",
align: "center",
minWidth: 120,
fixed: "right",
render: (h, params) => {
return h("div", [
h(
"el-button",
{
style: {
color: "#ff4949",
},
props: {
type: "text",
size: "mini",
icon: "el-icon-delete",
},
on: {
click() {
deleteRow(params);
},
},
},
"删除"
),
]);
},
},
];
<template>
<div class="form-header">
<el-row style="padding-bottom: 20px">
<el-col>
<el-divider content-position="left">ET86配舱航班顺位</el-divider>
</el-col>
</el-row>
<!-- ET86配舱航班顺位 -->
<el-row :gutter="24" justify="center">
<el-col :span="18">
<el-row style="margin-bottom: 15px" v-if="getRouter">
<el-col>
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="addBtn"
>添加</el-button
>
</el-col>
</el-row>
<yl-table
emptyText="请添加配舱航班"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:tableData="tableData"
:pageConfig="{
isPagination: false,
}"
>
<template #column>
<el-table-column
type="index"
label="序号"
width="50"
align="center"
></el-table-column>
<el-table-column
label="航班号"
prop="flightNo"
min-width="100"
align="center"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.flightNo"
clearable
:disabled="scope.row.edit"
@focus="inputFocus(scope)"
@blur="blurSearch"
placeholder="请输入航班号"
size="small"
/>
</template>
</el-table-column>
<el-table-column
label="加减天数"
prop="calculateDay"
width="100"
align="center"
>
<template slot-scope="scope">
<el-input
type="text"
v-model="scope.row.calculateDay"
:disabled="scope.row.edit"
min="-7"
max="7"
v-input-filter
clearable
placeholder=""
size="small"
/>
<!-- <el-input
type="number"
v-model="scope.row.calculateDay"
:disabled="scope.row.edit"
min="-7"
max="7"
v-input-filter
clearable
placeholder=""
size="small"
/> -->
</template>
</el-table-column>
<el-table-column
label="航线"
prop="flightRoute"
min-width="100"
align="center"
>
<template slot-scope="scope">
<el-select
v-model="scope.row.flightRoute"
placeholder="请选择"
size="small"
:disabled="scope.row.edit"
>
<el-option
v-for="item in scope.row.routeList"
:key="item.id"
:label="item.route"
:value="item.route"
>
</el-option>
</el-select>
</template>
</el-table-column>
<el-table-column
label="爆仓是否继续配舱"
prop="permitOverweight"
min-width="100"
align="center"
>
<template slot-scope="scope">
<el-checkbox
v-model="scope.row.permitOverweight"
:disabled="scope.row.edit"
@change="changeCheck(scope)"
></el-checkbox>
</template>
</el-table-column>
<el-table-column label="操作" min-width="100" align="center">
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
:disabled="scope.row.edit"
@click="deleBtn(scope.row, scope.$index)"
>删除</el-button
>
</template>
</el-table-column>
</template>
</yl-table>
</el-col>
</el-row>
<!-- ET86配舱航班顺位维度 -->
<el-row style="padding: 20px 0">
<el-col>
<el-divider content-position="left">航线维度设置</el-divider>
</el-col>
</el-row>
<el-card shadow="always" class="box-card">
<el-form
:model="queryForm"
label-position="right"
label-width="120px"
ref="ruleForm"
class="config-form"
>
<el-row class="rowPadding">
<el-col :span="24">
<el-col :span="10">
<el-form-item label="原航班号">
<el-input
type="textarea"
v-model="queryForm.originOfFlightNo"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="原航班号之间用分号分隔，例：LP001;LP002"
@blur="blurEvent"
:disabled="!getRouter"
></el-input>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="">
<el-col :span="4" style="text-align: end; width: 8%">
<span
style="
width: 10%;
margin-right: 10px;
font-size: 14px;
color: #606266;
font-weight: 700;
"
>服务种类</span
>
</el-col>
<el-col :span="4" style="text-align: end; width: 19%">
<el-radio-group
v-model="isServiceCode"
@change="changeIsServiceCode"
:disabled="!getRouter"
style="text-align: left"
>
<el-radio label="1">包含ServiceCode</el-radio>
<el-radio label="2">不包含ServiceCode</el-radio>
</el-radio-group>
</el-col>
<el-col :span="16">
<el-input
type="textarea"
v-model="queryForm.includeServiceType"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="请输入ServiceCode"
@blur="serviceCodeBlur"
:disabled="!getRouter"
></el-input>
</el-col>
</el-form-item>
</el-col>
</el-col>
<el-col :span="24">
<el-col :span="10">
<el-form-item label="URSA包含">
<el-input
type="textarea"
v-model="queryForm.includeUrsa"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="URSA之间用分号分隔，例：F2;F3;P_"
:disabled="!getRouter"
></el-input>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="">
<el-col :span="8" style="text-align: end; width: 27%"
><span
class="ursa-label"
style="
margin-right: 10px;
font-size: 14px;
color: #606266;
font-weight: 700;
"
>URSA不包含</span
></el-col
>
<el-col :span="16">
<el-input
type="textarea"
v-model="queryForm.notIncludeUrsa"
size="medium"
maxlength="1000"
show-word-limit
:rows="4"
placeholder="URSA之间用分号分隔，例：F2;F3;P_"
:disabled="!getRouter"
></el-input>
</el-col>
</el-form-item>
</el-col>
</el-col>
<el-col :span="10">
<el-form-item label="申报类别">
<el-card shadow="never">
<el-checkbox-group
v-model="checkboxClassType"
@change="changeCheckboxCargoType"
style="display: flex"
v-if="cargoType.length"
:disabled="!getRouter"
>
<el-checkbox
v-for="item in cargoType"
:label="item.chineseName"
:name="item.chineseName"
:key="item.code"
>
<Tooltips :content="item.chineseName" :refName="item.code">
</Tooltips>
</el-checkbox>
</el-checkbox-group>
</el-card>
</el-form-item>
</el-col>
<el-col :span="24">
<el-col :span="2">
<el-form-item label="单品名">
<el-checkbox
v-model="queryForm.multiHs"
:disabled="!getRouter"
></el-checkbox>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="" class="custom-label">
<span class="custom-label-title">重量(KG)</span>
<el-col :span="10">
<el-input
v-model.trim="queryForm.minWeight"
placeholder="最小重量"
@blur="inputBlurMinWeight($event)"
:disabled="!getRouter"
></el-input>
<span ref="minWeight" class="el-form-item__error"></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="queryForm.maxWeight"
placeholder="最大重量"
@blur="inputBlurMaxWeight($event)"
:disabled="!getRouter"
></el-input>
</el-col>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="件数" class="custom-label-pieces">
<el-col :span="10">
<el-input
v-model.trim="queryForm.minNumOfPieces"
placeholder="最少件数"
@blur="inputBlurMinPieces($event)"
:disabled="!getRouter"
></el-input>
<span ref="minNumOfPieces" class="el-form-item__error"></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="queryForm.maxNumOfPieces"
placeholder="最多件数"
@blur="inputBlurMaxPieces($event)"
:disabled="!getRouter"
></el-input>
</el-col>
</el-form-item>
</el-col>
</el-col>
<el-col :span="24">
<el-col :span="2">
<el-form-item label="申报价值"></el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="" class="custom-label">
<span class="custom-label-title">人民币</span>
<el-col :span="10">
<el-input
v-model.trim="minCNYCustomVal"
placeholder="最小申报价值"
@blur="inputBlurMin($event, 'minCNYCustomVal')"
:disabled="!getRouter"
></el-input>
<span
ref="minCNYCustomVal"
class="el-form-item__error"
></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="maxCNYCustomVal"
placeholder="最大申报价值"
@blur="inputBlurMax($event, 'maxCNYCustomVal')"
:disabled="!getRouter"
></el-input>
</el-col>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="美元" class="custom-label-pieces">
<el-col :span="10">
<el-input
v-model.trim="minSUDCustomVal"
placeholder="最小申报价值"
@blur="inputBlurMin($event, 'minSUDCustomVal')"
:disabled="!getRouter"
></el-input>
<span
ref="minSUDCustomVal"
class="el-form-item__error"
></span>
</el-col>
<el-col style="text-align: center" :span="1">-</el-col>
<el-col :span="10">
<el-input
v-model.trim="maxSUDCustomVal"
placeholder="最大申报价值"
@blur="inputBlurMax($event, 'maxSUDCustomVal')"
:disabled="!getRouter"
></el-input>
</el-col>
</el-form-item>
</el-col>
</el-col>
<el-col :span="24" v-if="getRouter">
<el-form-item label="">
<el-button type="primary" @click="submitForm('ruleForm')">{{
getRouter
}}</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import { formConfig } from "./formConfig";
import { inputBlurValidate } from "@/utils/mixins";
import { tableAttr } from "./tableConfig";
import {
allDictData, // 获取全部字典
queryRouteByFltNo, // 航线查询
} from "@/api/destinationFlight";
import {
add, // ET86新增
findEtesRuleById, // ET86详情
update, // ET86编辑
} from "@/api/et86";
import indexMixins from "./mixins";
export default {
name: "edit",
components: {
YlForm,
YlTable,
},
mixins: [indexMixins, inputBlurValidate],
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
// ET86配舱航班顺位维度
// 表单参数
id: "", // 维度ID
originOfFlightNo: "", // 原航班号
includeServiceType: "", // 服务种类包含
notIncludeServiceType: "", // 服务种类不包含
includeUrsa: "", // URSA包含
notIncludeUrsa: "", // URSA不包含
declarationCategory: "", // 已勾选申报类别的数据
multiHs: false, // 单品名
minWeight: "", // 最小重量
maxWeight: "",
minNumOfPieces: "", // 最小件数
maxNumOfPieces: "",
currencyCd: "", // 币种
minCustomVal: "", // 最小申报值
maxCustomVal: "",
},
tableAttr: tableAttr, // table配置项
tableData: [], // ET86配舱航班顺位
currentIndex: 0, // 记录当前table 列的索引位置
id: 1, // ET86配舱航班顺位ID
isServiceCode: "1", // 服务种类
serviceCode: "", // 服务种类内容
cargoType: [], // 申报类别调用接口获取所有的申报类别
checkboxCargoType: [], // 已勾选申报类别的数据
checkboxClassType: [], // 申报类别
serviceCodeData: [], // 【服务种类】调用接口获取服务种类所有的serviceCode
minCNYCustomVal: "", // 人民币最小申报值
maxCNYCustomVal: "", //
minSUDCustomVal: "", // 美元最小申报值
maxSUDCustomVal: "", //
};
},
computed: {
// 获取路由参数
getRouter() {
if (this.$route.query.name == "add") {
return "保存";
} else if (this.$route.query.name == "edit") {
return "修改";
} else {
return false;
}
},
},
created() {
this.getAllDictData(); // 获取全部字典
if (this.$route.query.name == "view" || this.$route.query.name == "edit") {
this.queryFindEtesRuleById(this.$route.query); // ET86详情
} else {
// 新增时默认一条数据
this.tableData = [
{
id: this.id,
flightNo: "", // 航班号
calculateDay: "", // 航班日期//+1 -1
flightRoute: "", // 航线
routeList: [], // 航线列表
permitOverweight: "N" ? false : true, // 爆仓是否继续配舱 Y-是，N-否
priority: this.id, // 优先等级
ruleId: "", // 维度ID
},
];
}
},
mounted() {},
directives: {
// 处理加减天数
"input-filter": {
bind: function (el, binding) {
el.handler = function (event) {
if (event.data == "E" || event.data == "e") {
// 无理数时
event.target.value = "";
}
if (event.target.value) {
if (Number(event.target.value) < -7) {
event.target.value = "";
this.msgError("加减天数最小不能低于7天");
} else if (Number(event.target.value) > 7) {
event.target.value = "";
this.msgError("加减天数最小不能大于7天");
} else if (/[\.]/.test(Number(event.target.value))) {
// 浮点数时
event.target.value = "";
} else {
}
event.target.dispatchEvent(new Event("input"));
}
};
el.addEventListener("input", el.handler);
},
unbind: function (el) {
el.removeEventListener("input", el.handler);
},
},
},
filters: {},
methods: {
// ET86新增
postAdd(params) {
add(params)
.then((res) => {
const { code, msg } = res;
if (code == 200) {
this.msgSuccess(msg || "创建成功!");
this.$router.push("/et86RuleConfig");
} else {
this.msgError(msg || "创建失败!");
}
})
.catch(() => {});
},
// ET86详情
queryFindEtesRuleById({ id, status, name }) {
findEtesRuleById({ id: id, status: status })
.then((res) => {
const { code, data, msg } = res;
if (code == 200) {
data.list.flightRankDtoList.map((item) => {
if (name == "view") {
item.edit = true;
} else {
item.edit = false;
}
// 爆仓是否继续配舱
if (item.permitOverweight == "N") {
item.permitOverweight = false;
} else {
item.permitOverweight = true;
}
});
data.list.flightRankDtoList.map((item) => {
item.calculateDay = item.calculateDay;
});
// ET86配舱航班顺位
this.tableData = data.list.flightRankDtoList;
Object.keys(data.list.fltRuleDto).map((key) => {
if (key == "multiHs") {
if (data.list.fltRuleDto[key] == "N") {
data.list.fltRuleDto[key] = true;
} else {
data.list.fltRuleDto[key] = false;
}
}
// 将详情获取为null的字段设置为空字符串，目的是为了判断的时候少些为null的判断,保持空数据同一的判断条件;
if (data.list.fltRuleDto[key] == null) {
data.list.fltRuleDto[key] = "";
}
});
if (data.list.fltRuleDto.declarationCategory) {
this.checkboxClassType =
data.list.fltRuleDto.declarationCategory.split(";");
} else {
this.checkboxClassType = [];
}
this.queryForm = data.list.fltRuleDto; // ET86配舱航班顺位维度
} else {
this.msgError(msg || "获取查看失败");
}
})
.catch(() => {});
},
// ET86编辑
postUpdate(parmas) {
update(parmas)
.then((res) => {
const { code, msg } = res;
if (code == 200) {
this.msgSuccess(msg || "修改成功!");
this.$router.push("/et86RuleConfig");
} else {
this.msgError(msg || "修改失败!");
}
})
.catch(() => {});
},
// 获取所有数据字典
getAllDictData() {
allDictData()
.then((res) => {
if (res.code != 200) {
this.msgError(res.msg);
return;
}
this.cargoType = res.data.cargoType; // 申报类别
if (res.data.serviceCode.length) {
this.getObj(res.data);
}
})
.catch(() => {});
},
// 航线查询
getQueryRouteByFltNo(item) {
this.tableAttr.loadingTable = true;
this.tableData[this.currentIndex].flightRoute;
queryRouteByFltNo(item)
.then((res) => {
this.tableAttr.loadingTable = false;
if (res.code == 200) {
const list = res.data.list;
let routeList = [];
if (list.length) {
list.map((item) => {
routeList.push(item);
});
let isEtesRoute = list.filter((item) => item.isEtesRoute == "Y"); // 过滤普通航线
if (isEtesRoute.length == 0) {
this.msgError("该航班下的航线均为普通航线");
}
this.tableData[this.currentIndex].flightRoute = "";
this.tableData[this.currentIndex].routeList = isEtesRoute;
} else {
this.msgError("暂无航线");
this.tableData[this.currentIndex].routeList = [];
this.tableData[this.currentIndex].flightRoute = "";
}
}
})
.catch(() => {});
},
// 航班号input 聚焦事件
inputFocus({ $index }) {
this.currentIndex = $index;
},
// 失焦查询
blurSearch() {
this.tableData[this.currentIndex].flightNo = this.upCase(
this.tableData[this.currentIndex].flightNo
); // 转大写字母
let params = {
fltNo: this.tableData[this.currentIndex].flightNo,
};
let repeat = this.tableData.filter(
(item) =>
item.flightNo == this.tableData[this.currentIndex].flightNo &&
item.calculateDay == this.tableData[this.currentIndex].calculateDay &&
item.flightRoute == this.tableData[this.currentIndex].flightRoute
); // 筛选重复的航班
if (repeat.length > 1) {
this.msgError("航班顺位已重复");
return;
}
if (params.fltNo) {
this.getQueryRouteByFltNo(params);
} else {
this.tableData[this.currentIndex].flightRoute = "";
this.tableData[this.currentIndex].routeList = [];
this.msgError("请输入航班号");
}
},
// 添加ET86配舱航班顺位
addBtn(item) {
this.id++;
this.tableData.unshift({
id: this.id,
flightNo: "", // 航班号
calculateDay: "", // 航班日期//+1 -1
flightRoute: "", // 航线
routeList: [], // 航线列表
permitOverweight: "N" ? false : true, // 爆仓是否继续配舱 Y-是，N-否
priority: this.id, // 优先等级
ruleId: "", // 维度ID
});
},
// 是否爆仓
changeCheck({ $index, row }) {
this.tableData.map((item, i) => {
if ($index !== i) {
item.permitOverweight = false;
}
});
},
// 删除
deleBtn(item, $index) {
this.tableData.splice($index, 1);
},
// 类别
changeCheckboxCargoType(arr) {
let include = this.cargoType.filter((item) =>
arr.some((val) => val == item.chineseName)
); // 查询已被勾选的类别
this.checkboxCargoType = include; //已勾选申报类别的数据
this.queryForm.declarationCategory = arr.join(";");
},
// 失焦事件
blurEvent() {
this.queryForm.originOfFlightNo = this.upCase(
this.queryForm.originOfFlightNo
);
},
// 表单提交
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
// 爆仓是否继续配舱
const newtTableData = JSON.parse(JSON.stringify(this.tableData));
const tableData = newtTableData;
tableData.filter((item) => {
if (item.permitOverweight == false) {
item.permitOverweight = "N";
} else {
item.permitOverweight = "Y";
}
});
// 校验ET86配舱航班顺位维度
if (
this.minCNYCustomVal.length != "" ||
this.maxCNYCustomVal.length != ""
) {
this.queryForm.currencyCd = "CNY";
this.queryForm.minCustomVal = this.minCNYCustomVal;
this.queryForm.maxCustomVal = this.maxCNYCustomVal;
} else if (
this.minSUDCustomVal.length != "" ||
this.maxSUDCustomVal.length != ""
) {
this.queryForm.currencyCd = "USD";
this.queryForm.minCustomVal = this.minSUDCustomVal;
this.queryForm.maxCustomVal = this.maxSUDCustomVal;
} else {
this.queryForm.currencyCd = "CNY";
}
let fltNo = this.tableData.some((item) => item.flightNo == ""); // 通过遍历判断航班顺位列表有没有填写的航班号
let fltNoRoute = this.tableData.some(
(item) => item.flightRoute == ""
); // 通过遍历判断航班顺位列表有没有填写的航线
if (fltNo) {
this.msgError("航班号不可为空");
return;
}
if (fltNoRoute) {
this.msgError("航线不可为空");
return;
}
if (this.queryForm.originOfFlightNo.length == 0) {
this.msgError("原航班号不可为空");
return;
}
this.queryForm.includeServiceType =
this.isServiceCode == "1" && this.serviceCode.length > 0
? this.serviceCode
: ""; // 包含服务种类
this.queryForm.notIncludeServiceType =
this.isServiceCode == "2" && this.serviceCode.length > 0
? this.serviceCode
: ""; // 不包含服务种类
let parmas = {
flightRankDtoList: tableData, // ET86配舱航班顺位
fltRuleDto: this.queryForm,
};
// 筛选重复的航班
let repeat = tableData.filter(
(item) =>
item.flightNo == tableData[this.currentIndex].flightNo &&
item.calculateDay == tableData[this.currentIndex].calculateDay &&
item.flightRoute == tableData[this.currentIndex].flightRoute
);
if (tableData.length > 100) {
this.msgError("最多添加100条，请删除后再添加");
return;
}
if (repeat.length > 1) {
this.msgError("ET86配舱航班顺位中存在重复设置");
return;
}
parmas.fltRuleDto.multiHs = this.queryForm.multiHs ? "N" : "Y"; // N为单品名，Y为多品名
if (this.validateForm && this.$route.query.name == "add") {
this.postAdd(parmas); // 新增
} else {
if (this.validateForm) {
this.postUpdate(parmas); // 修改
}
}
} else {
console.log("error submit!!");
return false;
}
});
this.$emit("handleSearch");
},
},
};
</script>
<style lang="scss" scoped>
.rowPadding {
padding: 10px 0;
font-size: 12px;
}
::v-deep .custom-label {
.el-form-item__content {
display: flex;
margin-left: 0 !important;
span {
font-size: 14px;
color: #606266;
font-weight: 700;
float: right;
margin-right: 10px;
text-align: end;
}
.custom-label-title {
width: 120px;
}
.el-input__suffix {
right: -15px !important;
}
.el-form-item__error {
color: #ff4949;
font-size: 12px;
line-height: 1;
padding-top: 4px;
position: absolute;
top: 100%;
left: 0;
font-weight: 500;
width: 100% !important;
}
}
}
::v-deep .custom-label-pieces {
.el-form-item__content {
width: 80%;
}
}
</style>
......@@ -10,7 +10,7 @@ export default {
},
// 处理serviceCode包不包含
serviceCodeCofig() {
let str = this.queryForm.serviceCode.replace(/;|；/g, ",");
let str = this.serviceCode.replace(/;|；/g, ",");
let arr = str.split(",");
if (arr[arr.length - 1] == "") {
arr.splice(arr.length - 1, 1);
......@@ -28,7 +28,7 @@ export default {
};
},
// radio包含不包含serviceCode
isServiceCode(val) {
changeIsServiceCode(val) {
// 勾选的时候去校验 || 输入的时候去校验
if (val == 1) {
if (this.serviceCodeCofig().noInclude.length) {
......@@ -44,15 +44,15 @@ export default {
},
// serviceCode失焦事件
serviceCodeBlur() {
if (this.queryForm.isServiceCode == "1") {
if (this.isServiceCode == "1") {
if (this.serviceCodeCofig().noInclude.length) {
let tip = this.serviceCodeCofig().noInclude.toString();
this.msgError(`${tip} 不包含`);
// this.msgError(`${tip} 不包含`);
}
} else {
if (this.serviceCodeCofig().include.length) {
let tip = this.serviceCodeCofig().include.toString();
this.msgError(`${tip} 已包含`);
// this.msgError(`${tip} 已包含`);
}
}
},
......
......@@ -4,7 +4,7 @@ export const tableAttr = {
isDragSort: true, // 拖拽tableData数据一定要加id字段
maxHeight: 300,
btnCofig: {
isBtn: true,
isBtn: false,
btnGroup: [
{
type: "primary",
......@@ -22,32 +22,32 @@ export const tableAttr = {
export const columnHeader = (deleteRow) => [
{
label: "航班号",
prop: "fltNo",
prop: "flightNo",
align: "center",
minWidth: 100,
},
{
label: "航班日期",
prop: "fltNoDate",
prop: "calculateDay",
align: "center",
minWidth: 100,
// sortable: true,
// "sort-method": (a, b) => b.updateTime - a.updateTime,
},
{
label: "航线优先级",
prop: "fltRoute",
label: "航线",
prop: "flightRoute",
align: "center",
minWidth: 100,
},
{
label: "爆仓是否继续配舱",
prop: "isOn",
prop: "permitOverweight",
align: "center",
minWidth: 100,
render: (h, params) => {
const { row } = params;
console.log(345678,row);
console.log(345678, row);
// return h("div", `状态-${row.id}`);
},
},
......@@ -80,15 +80,3 @@ export const columnHeader = (deleteRow) => [
},
},
];
export const tableData = [
{
id: "1",
fltNo: "A380",
fltNoDate: "3",
fltRoute: "",
routeList: [],
isOn: "1",
sort: "1", // 排序字段
},
];
......
export const formConfig = [
{
label: "创建时间(从)",
label: "原航班",
type: "Input",
name: "originOfFlightNo",
prop: "originOfFlightNo",
placeholder: "请输入原航班号",
span: 5,
trigger: "blur",
labelWidth: "55px",
},
{
label: "修改时间 从",
type: "Date",
name: "startTime",
prop: "startTime",
width: "140px",
placeholder: "请选择开始时间",
rules: { required: true, message: "请选择开始时间", trigger: "blur" },
// rules: { required: true, message: "请选择开始时间", trigger: "blur" },
format: "yyyy-MM-dd",
colWidth: "23%",
inputWidth: "100%",
},
{
label: "创建时间(到)",
label: "到",
type: "Date",
name: "endTime",
prop: "endTime",
width: "140px",
placeholder: "请选择结束时间",
rules: { required: true, message: "请选择结束时间", trigger: "blur" },
// rules: { required: true, message: "请选择结束时间", trigger: "blur" },
format: "yyyy-MM-dd",
colWidth: "20%",
labelWidth: "20px",
inputWidth: "100%",
},
{
label: "规则状态",
type: "Select",
name: "status",
prop: "status",
width: "140px",
placeholder: "请选择状态",
options: {
data: [
......@@ -31,13 +45,16 @@ export const formConfig = [
label: "有效",
},
{
value: "3",
value: "0",
label: "无效",
},
],
label: "有效",
value: "1",
},
colWidth: "18%",
labelWidth: "70px",
inputWidth: "100%",
},
];
......
<template>
<div ref="formHeaderRef" class="form-header container">
<el-row>
<el-col>
<yl-form
ref="ruleForm"
:formConfig="formConfig"
:queryForm="queryForm"
:inline="false"
formWidth="auto"
@blur="blurEvent"
/>
</el-col>
</el-row>
<yl-table
ref="ylTable"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:columns="columns"
:tableData="tableData"
:pageConfig="pageConfig"
@sizeChange="handleSizeChange"
@currentChange="handleCurrentChange"
@search="searchBtn"
@add="addBtn"
>
</yl-table>
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import { formConfig } from "./formConfig";
import { tableAttr, columnHeader } from "./tableConfig";
import { restTableHeight, sortList } from "@/utils";
import {
findAllEtesRules, // ET86查询
deleteEtesRuleById, // 删除
} from "@/api/et86";
export default {
components: {
YlForm,
YlTable,
},
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
// 表单参数
status: "有效",
},
pageConfig: {
// 分页配置项
isPagination: true,
total: 0,
pageData: {
page: 1,
size: 10,
},
},
tableAttr: tableAttr, // table配置项
columns: columnHeader(this.viewRow, this.editRow, this.deleteRow), // 表头
tableData: [], // 表格数据
};
},
created() {
// ET86查询
this.$nextTick(() => {
this.searchBtn();
});
},
mounted() {
this.$nextTick(() => {
this.tableAttr.maxHeight =
window.innerHeight - restTableHeight(this.$refs);
});
},
methods: {
// ET86查询
queryFindAllEtesRules() {
const { page, size } = this.pageConfig.pageData;
let params = {
originOfFlightNo: this.queryForm.originOfFlightNo,
updateTimeStart: this.queryForm.startTime
? this.queryForm.startTime
: "",
updateTimeEnd: this.queryForm.endTime ? this.queryForm.endTime : "",
limitStart: (page - 1) * size,
limitSize: size,
status: this.queryForm.status,
};
if (this.queryForm.status == "有效") {
params.status = "1";
}
this.tableAttr.loadingTable = true;
findAllEtesRules(params)
.then((res) => {
this.tableAttr.loadingTable = false;
const { code, data } = res;
if (code == 200) {
const valid = data.list.filter((item) => item.status == "1"); // 有效
const invalid = data.list.filter((item) => item.status == "0"); // 无效
// valid.reverse(); // 有效航班修改时间排序
// invalid.reverse(); //
// const newValid = sortList(valid, "originOfFlightNo"); // 有效原航班按字母排序
// const newInvalid = sortList(invalid, "originOfFlightNo");
// this.tableData = newValid.concat(newInvalid);
this.tableData = valid.concat(invalid);
this.pageConfig.total = data.total;
}
})
.catch(() => {});
},
// 失焦事件
blurEvent({ originOfFlightNo }) {
this.queryForm.originOfFlightNo = this.upCase(originOfFlightNo);
},
// 搜索
searchBtn() {
this.pageConfig.pageData.page = 1;
this.pageConfig.pageData.size = 10;
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
this.queryFindAllEtesRules();
});
},
//条数变化
handleSizeChange(e) {
this.pageConfig.pageData.size = e;
this.pageConfig.pageData.page = 1;
this.queryFindAllEtesRules();
},
//页码变化
handleCurrentChange(e) {
this.pageConfig.pageData.page = e;
this.queryFindAllEtesRules();
},
// 添加
addBtn(item) {
this.$router.push({
path: "/edit",
query: {
name: "add",
},
});
},
// 重置表单
restForm() {
this.$refs.ruleForm.resetFields("ruleForm");
},
// 查看
viewRow({ row }) {
this.$router.push({
path: "/edit",
query: {
name: "view",
id: row.id,
status: row.status,
},
});
},
// 编辑
editRow({ row }) {
this.$router.push({
path: "/edit",
query: {
name: "edit",
id: row.id,
status: row.status,
},
});
},
// 删除
deleteRow({ row }) {
this.$confirm("是否确认删除? 删除后该规则设置为无效，不可恢复", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
center: true,
})
.then(() => {
deleteEtesRuleById({ id: row.id }).then((res) => {
const { code, msg } = res;
if (code == 200) {
this.searchBtn();
this.msgSuccess("删除成功!");
} else {
this.msgError(msg || "删除失败");
}
});
})
.catch(() => {});
},
},
};
</script>
<style lang="scss" scoped></style>
const state = {
1: "有效",
0: "无效",
};
export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 0,
// defaultSort: { prop: "updateTime", order: "descending" },
btnCofig: {
isBtn: true,
btnGroup: [
{
type: "primary", // text、primary、danger
icon: "el-icon-search", // el-icon-edit 、el-icon-delete、el-icon-plus、el-icon-download、el-icon-upload el-icon--right
btnName: "搜索",
size: "mini", // medium / small / mini
round: false,
loading: false,
event: "search",
},
{
type: "primary",
icon: "el-icon-plus",
btnName: "添加",
size: "mini",
round: false,
loading: false,
event: "add",
},
],
},
};
export const columnHeader = (viewRow, editRow, deleteRow) => [
{
type: "index",
label: "序号",
prop: "id",
align: "center",
width: "50",
},
{
label: "原航班",
prop: "originOfFlightNo",
align: "center",
minWidth: 80,
},
{
label: "配载航班",
prop: "rankFltNoStr",
align: "center",
minWidth: 120,
},
{
label: "航线",
prop: "rankFltRouteStr",
align: "center",
minWidth: 140,
},
{
label: "状态",
prop: "status",
align: "center",
minWidth: 50,
render: (h, params) => {
const { row } = params;
return h("div", `${state[row.status]}`);
},
},
{
label: "修改时间",
prop: "updateTime",
align: "center",
minWidth: 80,
// sortable: true,
// "sort-method": (a, b) => a.createTime - b.createTime,
},
{
label: "修改人",
prop: "updateUserName",
align: "center",
minWidth: 60,
},
{
label: "操作",
prop: "operate",
align: "center",
minWidth: 90,
fixed: "right",
render: (h, params) => {
let operateData = []
if (params.row.status == "1") {
operateData = [
h(
"el-button",
{
props: {
type: "text",
size: "mini",
icon: "el-icon-view",
},
on: {
click() {
viewRow(params);
},
},
},
"查看"
),
h(
"el-button",
{
props: {
type: "text",
size: "mini",
icon: "el-icon-edit",
},
on: {
click() {
editRow(params);
},
},
},
"修改"
),
h(
"el-button",
{
style: {
color: "#ff4949",
},
props: {
type: "text",
size: "mini",
icon: "el-icon-delete",
},
on: {
click() {
deleteRow(params);
},
},
},
"删除"
),
];
}else{
operateData = [
h(
"el-button",
{
props: {
type: "text",
size: "mini",
icon: "el-icon-view",
},
on: {
click() {
viewRow(params);
},
},
},
"查看"
),
];
}
return h("div", operateData);
},
},
];
<template>
<div class="error-container">
<el-dialog
:width="width"
:title="title"
:center="center"
:visible.sync="dialogVisible"
:close-on-click-modal="onModalClickClose"
@open="dialogOpenEvent"
@close="dialogCloseEvent"
>
<slot></slot>
<span slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="confirm">{{
confirmBtnName
}}</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
width: {
type: String,
default: "50%",
},
title: {
type: String,
default: "标题",
},
center: {
type: String,
default: "center",
},
confirmBtnName: {
type: String,
default: "确 定",
},
onModalClickClose: {
type: Boolean,
default: false,
},
},
data() {
return {
dialogVisible: false,
};
},
computed: {},
created() {},
mounted() {},
methods: {
dialogOpenEvent(data) {
if (data && data.length) {
console.log(data);
}
this.dialogVisible = true;
this.$emit("open");
},
dialogCloseEvent() {
this.dialogVisible = false;
this.$emit("close");
},
// 确认事件
confirm() {
this.dialogVisible = false;
this.$emit("confirm");
},
// 取消事件
cancel() {
this.dialogVisible = false;
this.$emit("cancel");
},
},
};
</script>
<style lang='scss' scoped>
</style>
export const formConfig = [
{
label: "ShipmentDesc",
type: "Input",
name: "searchValue",
prop: "searchValue",
placeholder: "根据ShipmentDesc查询",
span: 7,
trigger: "blur", // 事件名
},
];
<template>
<div ref="formHeaderRef" class="form-header container">
<el-row>
<el-col>
<yl-form
ref="ruleForm"
:formConfig="formConfig"
:queryForm="queryForm"
:inline="false"
formWidth="auto"
@blur="blurEvent"
/>
</el-col>
</el-row>
<yl-table
ref="ylTable"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:columns="columns"
:tableData="tableData"
:pageConfig="pageConfig"
@search="searchBtn"
@upload="toUpload"
@rmfile="onRemoveUpload"
@export="exportTemplate"
@delete="deleteData"
@sizeChange="handleSizeChange"
@currentChange="handleCurrentChange"
@selectionEvent="tableSelectionChange"
>
</yl-table>
<!-- <modle-view
ref="modleViewRef"
width="30%"
title="导入Excel"
confirmBtnName="导入Excel"
@confirm="dialogConfirm"
>
<el-form
:model="paramsForm"
:rules="rules"
ref="ruleForm"
label-width="80px"
>
<el-row>
<el-col :span="20">
<el-form-item
label="商品名称"
prop="skuName"
size="small"
label-position="left"
>
<el-input
v-model="paramsForm.skuName"
placeholder="请输入商品名称"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item prop="file">
<el-upload
ref="upload"
action="/goods/uploadGoodsExcel"
name="file"
:http-request="toUpload"
:on-remove="onRemoveUpload"
:limit="1"
accept=".xlsx"
class="upload"
>
<el-button type="primary" icon="el-icon-upload2" size="small"
>选择文件</el-button
>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-form>
</modle-view> -->
</div>
</template>
<script>
import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import ModleView from "./components/ModleView";
import { formConfig } from "./formConfig";
import { tableAttr, columnHeader } from "./tableConfig";
import { restTableHeight } from "@/utils";
import {
findShipmentDescList, // HScode英文品名黑名单查询
uploadShipmentDesc, // HScode英文品名黑名单导入
delBlackList, // HScode黑名单/英文品名删除
} from "@/api/et86ShipmentDesc";
import { downLoadXlsx } from "@/utils/zipdownload";
export default {
name: "et86ShipmentDesc",
components: {
YlForm,
YlTable,
ModleView,
},
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {
searchValue: "",
}, // 表单参数
paramsForm: {
skuName: "",
file: null,
},
rules: {
skuName: [
{ required: true, message: "请输入ShipmentDesc", trigger: "blur" },
],
},
pageConfig: {
// 分页配置项
isPagination: true,
total: 0,
pageData: {
page: 1,
size: 10,
},
},
tableAttr: tableAttr, // table配置项
columns: columnHeader(this.deleteRow), // 表头
tableData: [], // 表格数据
multipleSelection: [],
};
},
created() {
// 黑名单查询
this.$nextTick(() => {
this.searchBtn();
});
},
mounted() {
this.$nextTick(() => {
this.tableAttr.maxHeight =
window.innerHeight - restTableHeight(this.$refs);
});
},
methods: {
// HScode黑名单查询
queryFindShipmentDescList() {
const { page, size } = this.pageConfig.pageData;
let params = {
limitStart: (page - 1) * size,
limitSize: size,
...this.queryForm,
};
this.tableAttr.loadingTable = true;
findShipmentDescList(params)
.then((res) => {
this.tableAttr.loadingTable = false;
const { code, data } = res;
if (code == 200) {
this.tableData = data.list;
this.pageConfig.total = data.total;
}
})
.catch(() => {});
},
// 删除黑名单
toDelBlackList(params) {
delBlackList(params)
.then((res) => {
const { code, msg } = res;
if (code == 200) {
this.searchBtn();
this.msgSuccess(msg || "删除成功!");
} else {
this.$message.error(msg || "删除失败");
}
})
.catch(() => {});
},
// 失焦事件
blurEvent() {},
// 选择上传【HScode黑名单导入】
toUpload({ file }) {
const formData = new FormData();
formData.append("file", file);
uploadShipmentDesc(formData)
.then((res) => {
const { code, data, msg } = res;
if (code == 200) {
this.searchBtn();
this.msgSuccess(msg || "导入成功!");
} else {
this.$message.error(msg || "导入失败");
this.$router.push({
path: "/errorInfo",
query: {
name: "errorInfo",
error: code,
data: JSON.stringify(data),
},
});
}
})
.catch(() => {});
},
//移除上传
onRemoveUpload(options) {
console.log(options);
},
// 搜索
searchBtn() {
this.pageConfig.pageData.page = 1;
this.pageConfig.pageData.size = 10;
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
this.queryFindShipmentDescList();
});
},
// 确认对话框
dialogConfirm() {},
// 上传
upLoadTemplate() {
// console.log(this.$refs.modleViewRef);
},
// 导出
exportTemplate(row, i) {
this.tableAttr.btnCofig.btnGroup[i].loading = true;
downLoadXlsx("/etes/exportShipmentDescList", this.queryForm, "HSCODE英文品名黑名单表")
.then(() => {
this.tableAttr.btnCofig.btnGroup[i].loading = false;
})
.catch(() => {
this.$message.error("导出失败");
});
},
// 删除
deleteData(row) {
if (this.multipleSelection.length) {
let params = [];
this.multipleSelection.map((item) => {
params.push(item.id);
});
this.$confirm("是否确认删除？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
center: true,
})
.then(() => {
this.toDelBlackList(params);
})
.catch(() => {});
} else {
this.$message.error("请勾选一条或者多条数据再操作！");
}
},
//条数变化
handleSizeChange(e) {
this.pageConfig.pageData.size = e;
this.pageConfig.pageData.page = 1;
this.queryFindShipmentDescList();
},
//页码变化
handleCurrentChange(e) {
this.pageConfig.pageData.page = e;
this.queryFindShipmentDescList();
},
// table勾选
tableSelectionChange(val) {
this.multipleSelection = val;
},
// 删除
deleteRow({ row }) {
this.$confirm("是否确认删除？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
center: true,
})
.then(() => {
this.toDelBlackList([row.id]);
})
.catch(() => {});
},
},
};
</script>
<style lang="scss" scoped></style>
export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 300,
btnCofig: {
isBtn: true,
btnGroup: [
{
type: "primary", // text、primary、danger
icon: "el-icon-search", // el-icon-edit 、el-icon-delete、el-icon-plus、el-icon-download、el-icon-upload el-icon--right
btnName: "搜索",
size: "mini", // medium / small / mini
round: false,
loading: false,
event: "search",
},
{
type: "primary",
icon: "el-icon-upload",
btnName: "导入",
size: "mini",
round: false,
loading: false,
event: "upLoad",
action: "/goods/uploadGoodsExcel",
fileName: "name",
limit: 1,
accept: ".xlsx",
},
{
type: "primary",
icon: "el-icon-download",
btnName: "导出",
size: "mini",
round: false,
loading: false,
event: "export",
},
{
type: "danger",
icon: "el-icon-delete",
btnName: "删除",
size: "mini",
round: false,
loading: false,
event: "delete",
},
],
},
};
export const columnHeader = (deleteRow) => [
{
type: "selection",
align: "center",
prop: "selection",
width: "50",
},
{
type: "index",
label: "序号",
prop: "id",
align: "center",
width: "50",
},
{
label: "ShipmentDesc",
prop: "blackValue",
align: "center",
minWidth: 100,
},
{
label: "创建时间",
prop: "createTime",
align: "center",
minWidth: 100,
},
{
label: "创建人",
prop: "createUserName",
align: "center",
minWidth: 100,
},
{
label: "文件名",
prop: "uploadFileName",
align: "center",
minWidth: 100,
},
{
label: "操作",
prop: "operate",
align: "center",
minWidth: 120,
fixed: "right",
render: (h, params) => {
return h("div", [
h(
"el-button",
{
style: {
color: "#ff4949",
},
props: {
type: "text",
size: "mini",
icon: "el-icon-delete",
},
on: {
click() {
deleteRow(params);
},
},
},
"删除"
),
]);
},
},
];
......@@ -353,28 +353,18 @@ export default {
如果该航线是普通航线直接删，如果是ET86航线，那么要查询该航线有没有设置维度，
如果没有直接删，如果已经设置了维度是否考虑将该航线下的维度删掉再进行操作;
*/
// if(!val.isEtesRoute){ // 普通航线
// this.routeDel({ data: [val], id: [val.id] })
// }else{ // ET86航线
// this.$confirm("该航线是ET86航线。是否要删除", "注意!", {
// closeOnClickModal: false,
// confirmButtonText: "确定删除",
// cancelButtonText: "取消",
// type: "warning",
// }).then(() => {
// this.msgWarning('待联调！')
// // delDict(val).then(res => {
// // if (res.code === 200) {
// // this.msgSuccess(res.msg)
// // } else {
// // this.msgWarning(res.msg)
// // }
// // this.tableSelect() // 回调查询
// // }).catch(err => {
// // console.log(err)
// // })
// }).catch(() => { })
// }
if(!val.isEtesRoute){ // 普通航线
this.routeDel({ data: [val], id: [val.id] })
}else{ // ET86航线
this.$confirm("该航线是ET86航线。是否要删除", "注意!", {
closeOnClickModal: false,
confirmButtonText: "确定删除",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
this.routeDel({ data: [val], id: [val.id] })
}).catch(() => { })
}
} else {
this.dicDel([val.id])
}
......
......@@ -186,7 +186,7 @@ export default {
cancelButtonText: '取消',
type: "warning",
}).then(() => {
this.statusChange({ id: val.id, status: status })
this.statusChange({ id: val.id, status: status, tip: tip })
}).catch(() => { })
} else {
this.msgWarning(res.msg)
......@@ -195,12 +195,12 @@ export default {
console.log(err)
})
} else {
this.$confirm(`是否要${tip}记录！`, "注意！", {
this.$confirm(`是否要${tip}规则！`, "注意！", {
confirmButtonText: "确定",
cancelButtonText: '取消',
type: "warning",
}).then(() => {
this.statusChange({ id: val.id, status: status })
this.statusChange({ id: val.id, status: status, tip: tip })
}).catch(() => { })
}
},
......
......@@ -17,7 +17,7 @@
</el-col>
<el-col :span="6">
<el-form-item label="运单号">
<el-input v-model="selectForm.awbNbr" class="formItem" placeholder="例: xxx;xxx;" clearable></el-input>
<el-input v-model="selectForm.awbNbr" class="formItem" placeholder="请输入运单号" clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
......@@ -138,6 +138,7 @@ export default {
this.data = [];
},
mounted() {
this.tableHeight = window.innerHeight - this.$refs.dmLogForm.$el.offsetHeight - 130;
},
methods: {
//数据查询
......