Fedex / iClear-Connect-Pre-Clearance

Go to a project
Toggle navigation Toggle navigation pinning
tao.mo
45ab4bb5 2 parents d6abd6c9 fa61e853

Merge remote-tracking branch 'origin/master'

Expand all
Inline Side-by-side
Showing 18 changed files with 292 additions and 339 deletions
......@@ -2,8 +2,7 @@
```bash
# 克隆项目
git clone https://gitee.com/y_project/RuoYi-Vue
git clone http://118.178.128.178/Fedex/iClear-Connect-Pre-Clearance.git
# 进入项目目录
cd IMAC-ui
......@@ -27,4 +26,4 @@ npm run build:stage
# 构建生产环境
npm run build:prod
```
\ No newline at end of file
```
......
This diff is collapsed. Click to expand it.
<svg width="14" height="12" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13 1.08571L7 6.14286L1 1" stroke="#007AB7" stroke-miterlimit="10"/>
<path d="M13 5.37087L7 10.428L1 5.28516" stroke="#007AB7" stroke-miterlimit="10"/>
</svg>
......@@ -2,9 +2,9 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg class="icon" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<defs><style type="text/css"></style></defs>
<circle cx="16.5" cy="16.4" r="4" stroke-width="2" stroke-linejoin="round"/>
<path d="M19 19L23 23" stroke-width="2" stroke-linejoin="round"/>
<path d="M19 10V5L14 1H9.8H6L1 5V18H10" stroke-width="2" stroke-linejoin="round"/>
<path d="M10 6V1" stroke-width="2" stroke-linejoin="round"/>
<path d="M1 6H19" stroke-width="2" stroke-linejoin="round"/>
<circle cx="16.5" cy="16.4" r="4" stroke-width="2" stroke-linejoin="round" stroke="currentColor"/>
<path d="M19 19L23 23" stroke-width="2" stroke-linejoin="round" stroke="currentColor"/>
<path d="M19 10V5L14 1H9.8H6L1 5V18H10" stroke-width="2" stroke-linejoin="round" stroke="currentColor"/>
<path d="M10 6V1" stroke-width="2" stroke-linejoin="round" stroke="currentColor"/>
<path d="M1 6H19" stroke-width="2" stroke-linejoin="round" stroke="currentColor"/>
</svg>
......
<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.5 1C4.4 1 1 4.4 1 8.5C1 12.6 4.4 16 8.5 16C12.6 16 16 12.6 16 8.5C16 4.4 12.6 1 8.5 1Z" stroke="#007AB7" stroke-miterlimit="10"/>
<path d="M8.5 13.5C9.05228 13.5 9.5 13.0523 9.5 12.5C9.5 11.9477 9.05228 11.5 8.5 11.5C7.94772 11.5 7.5 11.9477 7.5 12.5C7.5 13.0523 7.94772 13.5 8.5 13.5Z" fill="#007AB7"/>
<path d="M6.5 6.5C6.5 5 7.5 4 8.5 4C9.5 4 10.5 4.5 10.5 6C10.5 6.9 10 7.6 9.5 8C8.6 8.7 8.5 8.6 8.5 9.5V10.5" stroke="#007AB7" stroke-miterlimit="10"/>
</svg>
<svg width="14" height="11" viewBox="0 0 14 11" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13 10.342L7 5.28488L1 10.4277" stroke="#007AB7" stroke-miterlimit="10"/>
<path d="M13 6.05686L7 0.999721L1 6.14258" stroke="#007AB7" stroke-miterlimit="10"/>
</svg>
......@@ -346,6 +346,7 @@ input:disabled {
/*标题平移至合适位置*/
transition: all 0.2s ease;
cursor: text;
z-index: 99;
}
.el-form-item__content {
......@@ -1062,4 +1063,102 @@ input:disabled {
input::placeholder {
color: #409EFF
}
}
.el-range-editor {
width: 100%;
height: 100%;
.el-range-input {
padding: 0px;
}
.el-range-separator {
line-height: 50px;
}
input {
width: 100%;
height: 100% !important;
border: none !important;
background-color: transparent;
padding-top: 0.775rem;
// padding-right: 1.15rem;
padding-left: calc(.6rem + .1875rem);
font-size: 0.875rem !important;
}
}
.el-range-editor.el-input__inner {
padding: 15px 10px 0px 10px;
}
.el-range-editor {
.el-range-separator {
line-height: 35px;
}
}
.el-input__inner {
background-color: transparent !important;
}
.questionIcon {
color: $fedexColor;
}
.uploadHistoryDialog {
.el-dialog__header {
.el-dialog__title {
font-size: 18px;
}
}
.el-dialog__body {
padding: 10px 50px !important;
}
}
.uploadHistoryTable {
.el-table__header-wrapper {
.el-table__header {
thead {
tr {
th {
background-color: #fff !important;
}
}
}
}
}
.el-table__body-wrapper {
tbody {
tr {
td {
background-color: $formItemBackgroundColor;
}
.el-table__expand-column {
.cell {
.el-table__expand-icon {
display: none !important;
}
}
}
.el-table__expanded-cell {
padding: 0px;
background-color: #fff !important;
}
}
tr:hover {
.el-table__expanded-cell {
background-color: #fff !important;
}
}
}
}
}
\ No newline at end of file
......
<template>
<el-form-item
class="fedexFormItem"
:label="itemLabel"
:prop="prop"
:required="required"
:error="error"
:id="'inputOuter-' + type + '-' + prop"
>
<slot name="title" slot="label"></slot>
<slot></slot>
<template v-slot:error="scoped">
<div class="formError">{{ scoped.error }}</div>
</template>
</el-form-item>
<div style="pointer-events: auto" @click="formItemClick">
<el-form-item
class="fedexFormItem"
:label="itemLabel"
:prop="prop"
:required="required"
:error="error"
:id="'inputOuter-' + type + '-' + prop"
>
<slot name="title" slot="label"></slot>
<el-tooltip
v-if="toolyipShow"
class="item"
effect="dark"
:content="content"
:disabled="tooltipDisabled"
placement="top"
>
<slot></slot>
</el-tooltip>
<slot v-else></slot>
<template v-slot:error="scoped">
<div class="formError">{{ scoped.error }}</div>
</template>
</el-form-item>
</div>
</template>
<script>
......@@ -42,11 +54,25 @@ export default {
type: String,
default: "",
},
disabled: {
type: Boolean,
default: true,
},
toolyipShow: {
type: Boolean,
default: false,
},
eventType: {
type: Boolean,
default: false,
},
},
data() {
return {
itemLabel: this.label,
inputFocusType: false,
content: "",
tooltipDisabled: true,
};
},
watch: {
......@@ -62,8 +88,13 @@ export default {
let outInput = document.querySelector(
"#inputOuter-" + this.type + "-" + this.prop
); //获取formitem
let dateEditor = document.querySelector(".el-date-editor");
if (inputInner) {
if (inputInner.disabled && this.eventType) {
inputInner.style = "pointer-events:none";
}
//通过input得id是否存在判断效果是否激活
this.activeType ? inputInner.classList.add("inputFocus") : "";
inputInner.addEventListener("focus", (e) => {
this.inputFocusType = true;
inputInner.classList.add("inputFocus");
......@@ -73,12 +104,8 @@ export default {
inputInner.addEventListener("blur", (e) => {
if (!e.target.value && !e.target.placeholder) {
// input失焦时如果无内容则移除active class
if (this.labelInput) {
this.itemLabel = this.label;
// labelInputInner_parentNode.style.display = 'inline-block'
} else {
!this.activeType ? inputInner.classList.remove("inputFocus") : "";
}
this.itemLabel = this.label;
!this.activeType ? inputInner.classList.remove("inputFocus") : "";
} else {
inputInner.classList.add("inputFocus");
}
......@@ -89,12 +116,8 @@ export default {
inputInner.addEventListener("change", (e) => {
if (!e.target.value && !e.target.placeholder) {
// input失焦时如果无内容则移除active class
if (this.labelInput) {
this.itemLabel = this.label;
// labelInputInner_parentNode.style.display = 'inline-block'
} else {
!this.activeType ? inputInner.classList.remove("inputFocus") : "";
}
this.itemLabel = this.label;
!this.activeType ? inputInner.classList.remove("inputFocus") : "";
} else {
inputInner.classList.add("inputFocus");
}
......@@ -113,7 +136,62 @@ export default {
if (inputInner.value) {
inputInner.classList.add("inputFocus");
}
this.content = inputInner.value;
});
} else {
if (dateEditor) {
this.activeType
? document
.querySelector(".inputInner-" + this.type + "-" + this.prop)
.classList.add("inputFocus")
: "";
if (
document.querySelector(".inputInner-" + this.type + "-" + this.prop)
) {
let dataInner = document
.querySelector(".inputInner-" + this.type + "-" + this.prop)
.getElementsByClassName("el-range-input");
dataInner[0].addEventListener("focus", (e) => {
this.inputFocusType = true;
dataInner[0].classList.add("inputFocus");
outInput.classList.add("activeBorder");
});
dataInner[1].addEventListener("focus", (e) => {
this.inputFocusType = true;
dataInner[1].classList.add("inputFocus");
outInput.classList.add("activeBorder");
});
dataInner[0].addEventListener("blur", (e) => {
if (!e.target.value && !e.target.placeholder) {
// input失焦时如果无内容则移除active class
this.itemLabel = this.label;
!this.activeType
? dataInner[0].classList.remove("inputFocus")
: "";
} else {
dataInner[0].classList.add("inputFocus");
}
this.inputFocusType = false;
outInput.classList.remove("activeBorder");
});
dataInner[1].addEventListener("blur", (e) => {
if (!e.target.value && !e.target.placeholder) {
// input失焦时如果无内容则移除active class
this.itemLabel = this.label;
!this.activeType
? dataInner[1].classList.remove("inputFocus")
: "";
} else {
dataInner[1].classList.add("inputFocus");
}
this.inputFocusType = false;
outInput.classList.remove("activeBorder");
});
}
}
}
},
updated() {
......@@ -123,27 +201,73 @@ export default {
let outInput = document.querySelector(
"#inputOuter-" + this.type + "-" + this.prop
); //获取formitem
let dateEditor = document.querySelector(".el-date-editor");
this.$nextTick(() => {
if (inputInner && inputInner.value) {
inputInner.classList.add("inputFocus");
if (inputInner) {
if (
inputInner.value != undefined &&
inputInner.value != "" &&
inputInner.value != null
) {
inputInner.classList.add("inputFocus");
} else {
!this.inputFocusType ? inputInner.classList.remove("inputFocus") : "";
this.activeType ? inputInner.classList.add("inputFocus") : "";
}
} else {
!this.inputFocusType ? inputInner?.classList.remove("inputFocus") : "";
if (dateEditor) {
if (this.activeType) {
document.querySelector(".inputInner-" + this.type + "-" + this.prop)
.classList
? document
.querySelector(".inputInner-" + this.type + "-" + this.prop)
.classList.add("inputFocus")
: "";
}
}
}
if (
inputInner &&
inputInner.offsetWidth &&
inputInner.offsetWidth < inputInner.scrollWidth
) {
this.content = inputInner.value;
!this.disabled
? (this.tooltipDisabled = false)
: (this.tooltipDisabled = true);
}
});
},
methods: {
formItemClick() {
this.$emit("event", this.prop);
},
getDateEditorNode() {
let dateInput = document.getElementsByClassName("el-date-editor");
dateInput.forEach((item) => {
item
.querySelector(".el-input__suffix")
.children[0].children[0].classList.add("el-icon-date");
item.querySelector(".el-input__suffix")
? item
.querySelector(".el-input__suffix")
.children[0].children[0].classList.add("el-icon-date")
: "";
});
let selectInput = document.getElementsByClassName("el-select");
selectInput.forEach((item) => {
// item.querySelector('.el-input__suffix').children[0].children[0].style.display = 'none'
});
},
onMouseOver(str) {
if (this.$refs[str]) {
const parentWidth = this.$refs[str].parentNode.offsetWidth;
const contentWidth = this.$refs[str].offsetWidth;
// 判断是否开启tooltip功能
if (contentWidth > parentWidth) {
this.isShowTooltip = false;
} else {
this.isShowTooltip = true;
}
}
},
},
};
</script>
......
......@@ -6,10 +6,10 @@ export default {
},
// 公用
common: {
sureBtn: "確定",
sureBtn: "OK",
goBack: "返回",
submitBtn: "提交",
cancleBtn: "取消",
cancleBtn: "Cancel",
useBtn: "使用",
saveBtn: "保存",
closeBtn: "關閉",
......@@ -86,8 +86,8 @@ export default {
onlineDeclare: "線上申報平臺帳號登錄",
registerNumber: "註冊線上申報平臺帳號",
userInfo: "用戶信息維護",
logOut: "退出登錄",
logOutDia: "確定註銷並退出系統嗎？",
logOut: "log out",
logOutDia: "Are you sure to log out and exit the system?",
},
// 申报输入
fillIn: {
......
......@@ -100,7 +100,6 @@ import TopNav from "@/components/TopNav";
import Hamburger from "@/components/Hamburger";
import { removeToken } from "@/utils/auth";
export default {
components: {
Breadcrumb,
......@@ -109,9 +108,13 @@ export default {
},
data() {
return {
lang: localStorage.getItem("lang") || "zh-TW",
lang: localStorage.getItem("lang") || "en",
langOptions: [
{
label: "English",
value: "en",
},
{
label: "中文繁體",
value: "zh-TW",
},
......@@ -147,7 +150,7 @@ export default {
this.$store.dispatch("app/toggleSideBar");
},
async logout() {
this.$confirm(this.$t("layout.logOutDia"), "提示", {
this.$confirm(this.$t("layout.logOutDia"), "Tip", {
confirmButtonText: this.$t("common.sureBtn"),
cancelButtonText: this.$t("common.cancleBtn"),
type: "warning",
......@@ -165,7 +168,7 @@ export default {
this.$emit("login", "login");
} else if (val == "create") {
this.$emit("login", "create");
}else if(val == "fedexRegister"){
} else if (val == "fedexRegister") {
this.$emit("login", "fedexRegister");
}
},
......
This diff is collapsed. Click to expand it.
......@@ -36,7 +36,7 @@
<div class="buttonItem-icon">
<svg-icon class="el-icon-user-solid" icon-class="fedex-login" />
</div>
<div class="buttonItem-title">在線申報平臺帳號登錄</div>
<div class="buttonItem-title">user log in</div>
<div class="textCenter">
<svg-icon
class="el-icon-user-solid"
......@@ -205,14 +205,13 @@ export default {
},
attrs: { class: "font-style" },
},
"註冊完成後請回到FedEx線上申報平臺重新登錄。"
"After registration is completed, please return to the FedEx online declaration platform and log in again."
),
]),
confirmButtonClass: "confirm-button",
showCancelButton: true,
confirmButtonText: "確定",
cancelButtonText: "取消",
confirmButtonText: this.$t("common.sureBtn"),
cancelButtonText: this.$t("common.cancleBtn"),
iconClass: "el-icon-warning",
center: true,
// showClose: false,
......@@ -409,10 +408,10 @@ export default {
}
}
.guide-box {
height: 170px;
font-size: 16px;
padding-left: 249px;
padding-top: 48px;
padding-top: 24px;
padding-bottom: 24px;
background: #f8f8f8;
.guide {
color: #4d148c;
......
<template>
<el-dialog
class="entryDialog systemDialog"
:title="title"
:visible.sync="outerVisible"
:show-close="false"
:close-on-click-modal="false"
v-loading="loadings.editLoading"
width="25%"
@close="close"
></el-dialog>
</template>
<script>
export default {
data() {
return {};
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/variables.scss";
</style>
This diff is collapsed. Click to expand it.
<template>
<el-dialog
title="下載附件"
:visible.sync="dialogVisible"
width="50%"
:show-close="true"
class="detail-dialog"
>
<Table
class="fedexDetialTable mt20"
:data="tableData"
:headerData="headerData"
:selection="false"
height="400px"
:order="false"
:border="false"
:pagination="false"
:selectFixed="false"
:pageSizes="[20, 30, 50, 100]"
@selectionChange="handleSelectionChange"
:loading="tableLodaing"
>
<template v-slot:name="scope">
<p> {{ scope.row.name }}{{ scope.row.type }}</p>
</template>
<template v-slot:down="scope">
<el-button
class="plain"
size="mini"
@click.native.stop="downLoadOneFile(scope.row)"
:loading="scope.row.downloadLoading"
>下載</el-button
>
</template>
</Table>
<div class="width-btn-box">
<el-button
class="entrySaveButton entrySaveButton-background"
@click="batchDownloadBtn"
style="margin-right: 30px;width: 110px;"
:loading="allDownload"
:disabled="this.tableData<=0"
>
下載全部
</el-button>
<el-button class="entrySaveButton" style="width: 110px;" @click="closeDialog">取消</el-button>
</div>
</el-dialog>
</template>
<script>
import { getFindSysByDeclareId } from "@/api/fillForm.js";
import { downLoadZip,downLoadFile } from "@/utils/zipdownload";
export default {
components: {},
props: {},
data() {
return {
tableLodaing:false,
allDownload:false,
dialogVisible: false,
declareId: null,
tableData: [],
headerData: [
{
name: "附件名稱",
value: "name",
width: "",
align: "left",
slot: true,
},
{
name: "操作",
value: "down",
width: "100",
align: "center",
slot: true,
},
],
selectCheckList: [],
customsFileId: null,
};
},
methods: {
// 打开弹窗
openDialog(row) {
this.dialogVisible = true;
this.declareId = row.id;
this.customsFileId = row.customsFileId;
this.getUploadFileList();
},
// 关闭弹窗
closeDialog() {
this.dialogVisible = false;
},
// 选择下载的附件
handleSelectionChange(val) {
this.selectCheckList = val;
},
// 下载
downLoadOneFile(fileRow) {
fileRow.downloadLoading=true;
downLoadFile(
"/icleartw/cusFile/downLoadFile",
fileRow.id,
fileRow.name+ fileRow.type
).then(() => {
this.$message.success("下載成功");
this.exportLoading = false;
})
.catch(() => {
this.exportLoading = false;
}).finally(()=>{
fileRow.downloadLoading = false;
})
},
// 批量下载
batchDownloadBtn() {
this.allDownload=true;
downLoadZip(
"/icleartw/cusFile/downLoadCusFileAll",
this.customsFileId,
"附件"
)
.then(() => {
this.allDownload = false;
this.exportLoading = false;
})
.catch(() => {
this.exportLoading = false;
});
},
// 获取文件列表
getUploadFileList() {
this.tableData=[];
this.tableLodaing=true;
getFindSysByDeclareId(this.declareId).then((res) => {
if (res.code == 200) {
this.tableData = res.data;
if (this.tableData != null) {
this.tableData = this.tableData.map(item => {
return {
...item,
downloadLoading: false
};
});
}
}else{
this.$message.error(res.msg);
}
}).catch((res)=>{
this.$message.error(res.msg);
}).finally(()=>{
this.tableLodaing = false;
})
},
},
};
</script>
<style lang="scss" scoped>
.detail-dialog {
.title-box {
font-size: 16px;
font-weight: 600;
// line-height: 22px;
color: #000000;
display: flex;
justify-content: space-between;
.el-button {
padding: 0;
font-size: 12px;
}
}
.content {
color: #333;
font-size: 12px;
.small-title {
margin: 12px 0 4px 0;
font-size: 14px;
}
.info-box {
width: 100%;
height: 50px;
line-height: 17px;
background: #f2f2f2;
padding: 8px;
margin-bottom: 4px;
}
}
.download {
.el-button {
padding: 0;
font-size: 12px;
}
img {
vertical-align: -4px;
}
}
::v-deep .el-dialog {
padding: 20px 100px;
}
::v-deep .el-dialog__header {
text-align: center;
}
.width-btn-box {
width: 100%;
text-align: center;
margin-top: 16px;
.el-button {
width: 100px;
}
}
::v-deep .el-table__body-wrapper .el-table__body tbody tr {
height: 50px;
}
}
</style>
This diff is collapsed. Click to expand it.
export const tableHeaderKeys = [
{
label: "提單號碼",
prop: "deliveryNo",
width: 150,
align: "left",
sort: false,
},
{
label: "報單類別",
prop: "customsDeclarationType",
width: 150,
align: "left",
sort: false,
},
{
label: "操作狀態/時間",
prop: "operStatusAndTime1",
width: 150,
align: "left",
tem:"operStatusAndTime1",
sort: "custom",
},
{
label: "傳送狀態/時間",
prop: "delStatus",
width: 150,
align: "left",
tem: "delStatus",
sort:"custom",
},
{
label: "操作",
prop: "opt",
width: 150,
align: "center",
tem: "opt",
sort: false,
},
];
This diff is collapsed. Click to expand it.