Elements-SY

et86黑名单维护

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,
});
}
<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>
<span
v-for="(item, i) in attrs.btnCofig.btnGroup"
......@@ -13,8 +17,8 @@
:round="item.round"
:size="item.size"
:loading="item.loading"
@click="handleClick(item)"
v-if="item.btnName !== '导入' && item.btnName !== '导出'"
@click="handleClick(item, i)"
v-if="item.btnName !== '导入' && item.btnName !== '增加'"
>{{ item.btnName }}</el-button
>
<el-upload
......@@ -62,8 +66,10 @@
<!-- 分页 -->
<div
v-if="pageConfig.isPagination"
id="pagination"
class="pagination-container"
:style="{ textAlign: pageConfig.position || 'right' }"
ref="paginationRef"
>
<el-pagination
background
......@@ -219,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() {
......@@ -259,6 +265,9 @@ export default {
},
// 选择上传
toUpload(options) {
this.$refs.upload.map((item) => {
item.clearFiles(); //上传成功之后清除历史记录
});
this.$emit("upload", options);
},
//移除上传
......
......@@ -4,7 +4,7 @@
<sidebar class="sidebar-container"
:style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }" />
<div :class="{ hasTagsView: needTagsView }" class="main-container">
<div :class="{ 'fixed-header': fixedHeader }" ref="headerBlock">
<div :class="{ 'fixed-header': fixedHeader }">
<navbar />
<tags-view v-if="needTagsView" />
</div>
......
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) {
this.getBlockCurrentHeight();
if (this.device === "mobile" && this.sidebar.opened) {
store.dispatch("app/closeSideBar", { withoutAnimation: false });
}
......@@ -23,7 +24,9 @@ export default {
store.dispatch("app/toggleDevice", "mobile");
store.dispatch("app/closeSideBar", { withoutAnimation: true });
}
this.getBlockCurrentHeight();
this.$nextTick(()=>{
this.getBlockCurrentHeight();
})
},
methods: {
// use $_ for mixins properties
......@@ -42,9 +45,9 @@ export default {
}
}
},
getBlockCurrentHeight(){;
// console.log(this.$refs.headerBlock, this.$refs.headerBlock.clientHeight);
// console.log(this.$refs.appMainBlock);
}
getBlockCurrentHeight() {
let height = this.$refs.appMainBlock.$el.clientHeight;
this.$store.dispatch("app/setAppMainBlockCH", height);
},
},
};
......
......@@ -82,7 +82,7 @@ export const constantRoutes = [
{
path: "/errorInfo",
component: (resolve) =>
require(["@/views/et86Config/et86HsCodeBlack/errorInfo"], resolve),
require(["@/views/et86Config/errorInfo"], resolve),
name: "errorInfo",
meta: { title: "错误信息提示", icon: "user" },
},
......
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,
......
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,122 @@ 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);
}
// 获取计算元素的属性的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") {
// 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") {
heigth += getPropertyValue(item.$el.offsetParent);
heigth += item.$el.offsetParent.clientHeight;
}
}
});
} else {
if ($refs[key].hasOwnProperty("$el")) {
heigth += $refs[key].$el.clientHeight;
} else {
heigth += getPropertyValue($refs[key]);
}
}
} else if (key == "formHeaderRef") {
heigth += getPropertyValue($refs[key]);
}
});
return heigth;
}
......
......@@ -79,7 +79,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'
......
......@@ -37,7 +37,10 @@ export default {
tableData: [], // 表格数据
};
},
created() {},
created() {
const { data } = this.$route.query;
this.tableData = JSON.parse(data);
},
methods: {
//条数变化
handleSizeChange(e) {
......@@ -50,10 +53,8 @@ export default {
this.pageConfig.pageData.page = e;
this.searchBtn();
},
// table勾选
handleSelectionChange(val) {
this.multipleSelection = val;
},
// 搜索
searchBtn() {},
},
};
</script>
......
......@@ -12,19 +12,13 @@ export const columnHeader = () => [
{
type: "index",
label: "序号",
prop: "id",
prop: "rowNum",
align: "center",
width: "70",
},
{
label: "运单号",
prop: "waybillNo",
align: "center",
width: 150,
},
{
label: "错误信息",
prop: "errorMessage",
prop: "msg",
align: "center",
minWidth: 150,
},
......
......@@ -2,8 +2,8 @@ export const formConfig = [
{
label: "商品名",
type: "Input",
name: "skuCode",
prop: "skuCode",
name: "searchValue",
prop: "searchValue",
placeholder: "根据Hscode查询",
span: 6,
trigger: "blur", // 事件名
......
<template>
<div class="form-header container">
<div ref="formHeaderRef" class="form-header container">
<el-row>
<el-col>
<yl-form
......@@ -22,9 +22,11 @@
@download="downloadTemplate"
@upload="toUpload"
@rmfile="onRemoveUpload"
@export="exportTemplate"
@delete="deleteData"
@sizeChange="handleSizeChange"
@currentChange="handleCurrentChange"
@selectionEvent="tableSelectionChange"
>
</yl-table>
<!-- <modle-view
......@@ -85,6 +87,14 @@ 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, // HScode黑名单查询
delBlackList, // HScode黑名单删除
downLoadTemplate, // HScode黑名单下载模板
uploadHsCode, // HScode黑名单导入
} from "@/api/et86HsCodeBlack";
import { downLoadXlsx } from "@/utils/zipdownload";
export default {
name: "Et86HsCodeBlack",
components: {
......@@ -95,7 +105,9 @@ export default {
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: {}, // 表单参数
queryForm: {
searchValue: "",
}, // 表单参数
paramsForm: {
skuName: "",
file: null,
......@@ -120,13 +132,79 @@ export default {
multipleSelection: [],
};
},
created() {},
created() {
// 黑名单查询
this.$nextTick(() => {
this.searchBtn();
});
},
mounted() {
this.$nextTick(() => {
let app = document.querySelector(".app-main");
if (this.$store.getters.appMainBlockClientHeight) {
this.tableAttr.maxHeight =
this.$store.getters.appMainBlockClientHeight -
restTableHeight(this.$refs);
} else {
this.tableAttr.maxHeight =
app.clientHeight - restTableHeight(this.$refs);
}
});
},
methods: {
// HScode黑名单查询
queryFindHsCodeList(params) {
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() {},
// 选择上传
toUpload(options) {
console.log(options);
// 选择上传【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) {
......@@ -134,22 +212,74 @@ export default {
},
// 搜索
searchBtn() {
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {});
const { page, size } = this.pageConfig.pageData;
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
let params = {
limitStart: (page - 1) * size,
limitSize: size,
...this.queryForm,
};
this.queryFindHsCodeList(params);
});
},
// 确认对话框
dialogConfirm() {},
// 下载
// 下载【HScode黑名单下载模板】
downloadTemplate() {
// this.$refs.modleViewRef.dialogOpenEvent();
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() {},
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() {},
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;
......@@ -162,11 +292,11 @@ export default {
this.searchBtn();
},
// table勾选
handleSelectionChange(val) {
tableSelectionChange(val) {
this.multipleSelection = val;
},
// 删除
deleteRow() {
deleteRow({ row }) {
this.$confirm("是否确认删除?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
......@@ -174,7 +304,7 @@ export default {
center: true,
})
.then(() => {
this.msgSuccess("删除成功!");
this.toDelBlackList([row.id]);
})
.catch(() => {});
},
......
......@@ -2,7 +2,7 @@ export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 300,
maxHeight: 0,
btnCofig: {
isBtn: true,
btnGroup: [
......@@ -27,7 +27,7 @@ export const tableAttr = {
{
type: "primary",
icon: "el-icon-upload",
btnName: "导入",
btnName: "增加",
size: "mini",
round: false,
loading: false,
......@@ -45,10 +45,6 @@ export const tableAttr = {
round: false,
loading: false,
event: "export",
action: "/goods/uploadGoodsExcel",
fileName: "name",
limit: 1,
accept: ".xlsx",
},
{
type: "danger",
......@@ -77,14 +73,8 @@ export const columnHeader = (deleteRow) => [
width: "50",
},
{
label: "口岸",
prop: "portName",
align: "center",
minWidth: 100,
},
{
label: "HSCODE",
prop: "goodsCode",
prop: "blackValue",
align: "center",
minWidth: 100,
},
......@@ -102,7 +92,7 @@ export const columnHeader = (deleteRow) => [
},
{
label: "文件名",
prop: "fileName",
prop: "uploadFileName",
align: "center",
minWidth: 100,
},
......
<template>
<div class="form-header container">
<div ref="formHeaderRef" class="form-header container">
<el-row>
<el-col>
<yl-form
......@@ -13,6 +13,7 @@
</el-col>
</el-row>
<yl-table
ref="ylTable"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:columns="columns"
......@@ -31,6 +32,7 @@ import YlForm from "@/components/YlForm";
import YlTable from "@/components/YlTable";
import { formConfig } from "./formConfig";
import { tableAttr, columnHeader } from "./tableConfig";
import { restTableHeight } from "@/utils";
import {
findAllEtesRules, // ET86查询
deleteEtesRuleById, // 删除
......@@ -67,7 +69,20 @@ export default {
this.searchBtn();
});
},
mounted() {},
mounted() {
this.$nextTick(() => {
let app = document.querySelector(".app-main");
if (this.$store.getters.appMainBlockClientHeight) {
this.tableAttr.maxHeight =
this.$store.getters.appMainBlockClientHeight -
restTableHeight(this.$refs);
} else {
this.tableAttr.maxHeight =
app.clientHeight - restTableHeight(this.$refs);
}
console.log(this.tableAttr.maxHeight);
});
},
methods: {
// ET86查询
queryFindAllEtesRules(params) {
......
......@@ -6,7 +6,7 @@ export const tableAttr = {
border: true,
loadingTable: false,
isDragSort: false, // 拖拽tableData数据一定要加id字段
maxHeight: 300,
maxHeight: 0,
btnCofig: {
isBtn: true,
btnGroup: [
......
<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: "ShipmentDesc",
prop: "ShipmentDesc",
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
: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, // HScode黑名单查询
delBlackList, // HScode黑名单删除
downLoadTemplate, // HScode黑名单下载模板
uploadHsCode, // HScode黑名单导入
} 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(() => {
let app = document.querySelector(".app-main");
if (this.$store.getters.appMainBlockClientHeight) {
this.tableAttr.maxHeight =
this.$store.getters.appMainBlockClientHeight -
restTableHeight(this.$refs);
} else {
this.tableAttr.maxHeight =
app.clientHeight - restTableHeight(this.$refs);
}
console.log(this.tableAttr.maxHeight);
});
},
methods: {
// HScode黑名单查询
queryFindHsCodeList(params) {
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() {
const { page, size } = this.pageConfig.pageData;
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
let params = {
limitStart: (page - 1) * size,
limitSize: size,
...this.queryForm,
};
this.queryFindHsCodeList(params);
});
},
// 确认对话框
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.searchBtn();
},
//页码变化
handleCurrentChange(e) {
this.pageConfig.pageData.page = e;
this.searchBtn();
},
// 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-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: "ShipmentDesc",
prop: "ShipmentDesc",
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);
},
},
},
"删除"
),
]);
},
},
];
......@@ -195,7 +195,7 @@ export default {
console.log(err)
})
} else {
this.$confirm(`是否要${tip}记录!`, "注意!", {
this.$confirm(`是否要${tip}规则!`, "注意!", {
confirmButtonText: "确定",
cancelButtonText: '取消',
type: "warning",
......
......@@ -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: {
//数据查询
......