Fedex / iClear-Connect-Pre-Clearance

Go to a project
Toggle navigation Toggle navigation pinning
jinhui.wang
481b22de 1 parent 890bf021

图标增加，样式修改

Inline Side-by-side
Showing 12 changed files with 64 additions and 2415 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
```
......
<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,47 @@ 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;
}
\ No newline at end of file
......
<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>
<template>
<div class="search-wrap">
<div class="search-box">
<el-form
class="fedexFormStyle queryTextarea-box"
ref="sreachForm"
:model="sreachFormData"
label-position="top"
size="small"
:rules="rules"
>
<el-row :gutter="6">
<el-col :span="5">
<Formitem label="提單號碼（支持多個提單號查詢）" prop="deliveryNo">
<el-input
type="textarea"
class="inputShadow-deliveryNo"
name="deliveryNo"
id="inputInner--deliveryNo"
resize="none"
:rows="deliveryNoRows"
v-model="sreachFormData.deliveryNo"
clearable
placeholder=""
@focus="consignmentCodeFocus"
@blur="consignmentCodeBlur"
></el-input>
<el-badge
v-if="
deliveryNoRows == 1 &&
sreachFormData.deliveryNoList.length > 1
"
type="info"
:value="`+${sreachFormData.deliveryNoList.length}`"
class="item texttareaTip"
></el-badge>
</Formitem>
</el-col>
<el-col :span="4">
<Formitem label="貨物輸出統一編號" prop="deliveryCode">
<el-input
type="textarea"
class="inputShadow"
name="deliveryCode"
id="inputInner--deliveryCode"
resize="none"
:rows="deliveryCodeRows"
v-model="sreachFormData.deliveryCode"
clearable
placeholder=""
@focus="consignmentCodeFocus"
@blur="consignmentCodeBlur"
></el-input>
<el-badge
v-if="
deliveryCodeRows == 1 &&
sreachFormData.deliveryCodelist.length > 1
"
type="info"
:value="`+${sreachFormData.deliveryCodelist.length}`"
class="item texttareaTip"
></el-badge>
</Formitem>
</el-col>
<el-col :span="6">
<el-row class="commitTime">
<el-col :span="11"
><Formitem
label="提交時間(從)"
prop="commitTimeFrom"
style="margin-bottom: 0px"
>
<el-date-picker
class="unIconDatePicker"
v-model="sreachFormData.commitTimeFrom"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
type="date"
id="inputInner--commitTimeFrom"
placeholder=""
prefix-icon="none"
@change="checkDate1"
></el-date-picker> </Formitem
></el-col>
<el-col
:span="2"
style="line-height: 50px; font-size: 20px; font-weight: 700"
>-</el-col
>
<el-col :span="11">
<Formitem
label="提交時間(至)"
prop="commitTimeTo"
style="margin-bottom: 0px"
>
<el-date-picker
class="unIconDatePicker"
v-model="sreachFormData.commitTimeTo"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
type="date"
id="inputInner--commitTimeTo"
placeholder=""
prefix-icon="none"
@change="checkDate1"
></el-date-picker> </Formitem
></el-col>
</el-row>
</el-col>
<el-col :span="2" class="search-btn">
<el-button @click="searchTable">
<!-- <img src="../../assets/images/select.svg" alt="" /> -->
</el-button>
</el-col>
</el-row>
</el-form>
<span class="textCenter export-btn">
<el-button
class="entrySaveButton"
:loading="exportLoading"
@click="exportBtn()"
>
導出
</el-button>
</span>
</div>
<el-table
:data="tableData"
style="width: 100%"
:height="tableMaxheight"
:row-class-name="tableRowClassName"
v-loading="tableLoading"
class="queryTable"
@sort-change="handleSortChange"
>
<el-table-column
v-for="(item, index) in tableHeaderList"
:key="index"
:prop="item.prop"
:label="item.label"
:min-width="item.width"
:fixed="item.fixed ? item.fixed : false"
:align="item.align"
:sortable="item.sort"
>
<template slot-scope="scope">
<!-- 操作 -->
<template v-if="item.tem == 'opt'">
<el-dropdown trigger="click">
<span style="cursor: pointer">
操作
<!-- <img src="../../assets/images/declareOpt.png" alt="" /> -->
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="viewDeclare(scope.row)">
查看
</el-dropdown-item>
<el-dropdown-item @click.native="downloadFiles(scope.row)"
>下載附件</el-dropdown-item
>
</el-dropdown-menu>
</el-dropdown>
</template>
<span v-else>{{ scope.row[item.prop] }}</span>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="page.curPage"
:page-sizes="[20, 30, 50, 100]"
:page-size="page.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="page.total"
>
</el-pagination>
</div>
</template>
<script>
export default {
name: "",
data() {
return {
sreachFormData: {
deliveryNo: "",
commitTimeFrom: "",
commitTimeTo: "",
deliveryNoList: [],
deliveryCodelist: [],
},
oldSreachFormData: {
deliveryNo: "",
commitTimeFrom: "",
commitTimeTo: "",
deliveryNoList: [],
deliveryCodelist: [],
},
rules: {},
tableData: [],
tableHeaderList: [
{
label: "提單號碼",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "報單類別",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "提交時間",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "文件轉換Tiff",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "傳送狀態/時間",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "貨物輸出統一編號",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "聯絡人 ",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "聯絡人e-mail ",
prop: "deliveryNo",
width: "",
align: "left",
sort: false,
},
{
label: "操作",
prop: "opt",
width: "",
align: "center",
tem: "opt",
sort: false,
},
],
page: {
curPage: 1,
pageSize: 20,
total: 0, //数据总和
},
tableLoading: false,
exportLoading: false,
deliveryNoRows: 1,
deliveryCodeRows: 1,
};
},
computed: {
tableMaxheight() {
return window.innerHeight - 300;
},
},
methods: {
searchTable() {},
//查看
viewDeclare() {},
//下载附件
downloadFiles(data) {},
//导出
exportBtn() {},
// 改变偶数行背景色
tableRowClassName({ row, rowIndex }) {
if ((rowIndex + 1) % 2 === 0) {
return "bgc-row";
}
return "";
},
checkDate1() {},
// column 当前列数据 prop 当前排序的字段 order 排序规则
handleSortChange({ column, prop, order }) {
if (prop == "operStatusAndTime1") {
this.sortOrder = order ? (order == "descending" ? 2 : 1) : 0;
} else if (prop == "delStatus") {
this.sortOrder = order ? (order == "descending" ? 4 : 3) : 0;
}
this.page.curPage = 1;
let paramsData = {
...this.oldSreachFormData,
page: this.page.curPage,
query: this.defQuery,
size: this.page.pageSize,
sort: this.sortOrder,
};
this.sreachData(paramsData);
},
// 改变页面条数
handleSizeChange(val) {
this.page.pageSize = val;
this.sreachData(null);
},
// 切换页码
handleCurrentChange(val) {
this.page.curPage = val;
this.sreachData(null);
},
//文本域切换
consignmentCodeFocus(val) {
if (val.target.name == "deliveryNo") {
this.deliveryNoRows = 5;
} else if (val.target.name == "") {
this.deliveryCodeRows = 5;
}
this.$nextTick(() => {
let inputInner = document.querySelector(
"#inputInner--" + val.target.name
).parentNode;
let inputOuter = document.querySelector(
"#inputOuter--" + val.target.name
);
inputInner.classList.add("consignmentCode-textarea");
document.querySelector("#inputInner--" + val.target.name).focus();
setTimeout(() => {
inputOuter.classList.add("active");
inputOuter.classList.add("activeBorder");
}, 100);
});
},
consignmentCodeBlur(val) {
let data = null;
if (val.target.name == "deliveryNo") {
this.deliveryNoRows = 1;
} else if (val.target.name == "") {
this.deliveryCodeRows = 1;
}
this.$nextTick(() => {
let inputInner = document.querySelector(
"#inputInner--" + val.target.name
).parentNode;
inputInner.classList.remove("consignmentCode-textarea");
});
data = val.target.value.split("\n");
let arr = [];
data.forEach((item) => {
if (item != "" && item != null) {
arr.push(item);
}
});
if (val.target.name == "deliveryNo") {
this.sreachFormData.deliveryNoList = arr;
} else if (val.target.name == "") {
this.sreachFormData.deliveryCodelist = arr;
}
},
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/styles/variables.scss";
.search-wrap {
height: calc(100% - 28px);
margin: 12px 12px 16px 16px;
background-color: #fff;
padding: 20px;
.search-box {
margin-bottom: 12px;
position: relative;
.export-btn {
position: absolute;
right: 12px;
top: 0;
}
}
::v-deep .el-table .bgc-row {
background: #f2f2f2;
}
.el-pagination {
text-align: right;
margin-top: 10px;
::v-deep .el-input.is-focus .el-input__inner {
border: 1px solid $fedexColor;
}
::v-deep .el-input .el-input__inner:hover {
border: 1px solid $fedexColor;
}
::v-deep .el-input__inner:focus {
border: 1px solid $fedexColor;
}
::v-deep .el-pager li.active {
color: $fedexColor;
}
::v-deep .el-pager li:hover {
color: $fedexColor;
}
}
// .el-table__body-wrapper {
// overflow: auto;
// }
}
.search-btn {
::v-deep .el-button {
border: 1px solid #cccccc;
height: 50px;
width: 90px;
.el-icon-search {
color: #cccccc;
font-size: 20px;
}
}
.el-button:hover,
.el-button:focus {
background: #f3f1f1;
}
}
.texttareaTip {
position: absolute;
top: 50%;
right: 20px;
transform: translate(0, -50%);
z-index: 10;
}
.consignmentCode-textarea {
position: absolute;
top: 25px;
left: 1px;
z-index: 10;
min-height: 170px !important;
border: 2px solid $fedexBorder;
background-color: $fedexTablebackgroundColor;
transition: all 0.2s ease;
}
.queryTable {
::v-deep .cell {
text-align: center;
white-space: pre-line;
}
}
.commitTime {
background-color: $formItemBackgroundColor;
}
</style>
<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>
<template>
<div class="search-wrap">
<div class="search-box">
<el-form class="fedexFormStyle queryTextarea-box" ref="sreachForm" :model="sreachFormData" label-position="top"
size="small" :rules="rules">
<el-row :gutter="6">
<el-col :span="5">
<Formitem label="提單號碼（支持多個提單號查詢）" prop="deliveryNo">
<!-- <el-input
type="text"
id="inputInner--deliveryNo"
v-model="sreachFormData.deliveryNo"
clearable
>
</el-input> -->
<el-input type="textarea" class="inputShadow" id="inputInner--deliveryNo" resize="none"
:rows="consignmentCodeRows" v-model="sreachFormData.deliveryNo" clearable placeholder=""
@focus="consignmentCodeFocus" @blur="consignmentCodeBlur"></el-input>
<el-badge v-if="consignmentCodeRows == 1 &&
sreachFormData.consignmentCode.length > 1
" type="info" :value="`+${sreachFormData.consignmentCode.length}`"
class="item texttareaTip"></el-badge>
</Formitem>
</el-col>
<el-col :span="4">
<Formitem label="提交時間(從)" prop="commitTimeFrom">
<el-date-picker v-model="sreachFormData.commitTimeFrom" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="date" id="inputInner--commitTimeFrom" placeholder="" prefix-icon="none"
@change="checkDate1"></el-date-picker>
<!-- :picker-options="startPickerOptions"> -->
<!-- </el-date-picker> -->
</Formitem>
</el-col>
<el-col :span="4">
<Formitem label="提交時間(至)" prop="commitTimeTo">
<el-date-picker v-model="sreachFormData.commitTimeTo" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="date" id="inputInner--commitTimeTo" placeholder="" prefix-icon="none"
@change="checkDate2"></el-date-picker>
<!-- :picker-options="endPickerOptions">
</el-date-picker> -->
</Formitem>
</el-col>
<el-col :span="2" class="search-btn">
<el-button @click="searchTable">
<img src="../../assets/images/select.svg" alt="" />
</el-button>
</el-col>
</el-row>
</el-form>
<span class="textCenter export-btn">
<el-button class="entrySaveButton" :loading="exportLoading" @click="exportBtn()">
導出
</el-button>
</span>
</div>
<el-table :data="tableData" style="width: 100%" :height="tableMaxheight" :row-class-name="tableRowClassName"
v-loading="tableLoading" class="queryTable" @sort-change="handleSortChange">
<el-table-column v-for="(item, index) in tableHeaderList" :key="index" :prop="item.prop" :label="item.label"
:min-width="item.width" :fixed="item.fixed ? item.fixed : false" :align="item.align" :sortable="item.sort">
<template slot-scope="scope">
<template v-if="item.tem == 'operStatusAndTime1'">
<div>
{{ scope.row.operStatus }}
</div>
<div>
{{ scope.row.commitTime }}
</div>
</template>
<!-- 传送时间 -->
<template v-if="item.tem == 'delStatus'">
<div class="query_page_popover">
<el-popover v-if="scope.row.failedMsg" trigger="hover" placement="bottom" :open-delay="1000">
<p>{{ scope.row.failedMsg }}</p>
<div slot="reference" class="name-wrapper">
{{ scope.row.delStatusAndTime }}
</div>
</el-popover>
<span v-else>{{ scope.row.delStatusAndTime }}</span>
</div>
</template>
<!-- 操作 -->
<template v-if="item.tem == 'opt'">
<el-dropdown trigger="click">
<span style="cursor: pointer">
<img src="../../assets/images/declareOpt.png" alt="" />
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="viewDeclare(scope.row)">
查看
</el-dropdown-item>
<el-dropdown-item v-if="scope.row.operStatus == '已提交'" @click.native="reEditDeclare(scope.row)">
重新编辑
</el-dropdown-item>
<el-dropdown-item v-else @click.native="editDeclare(scope.row)">
編輯
</el-dropdown-item>
<el-dropdown-item :disabled="scope.row.operStatus == '已提交'" @click.native="deleteDeclare(scope.row)">
刪除
</el-dropdown-item>
<el-dropdown-item @click.native="downloadFiles(scope.row)">下載附件</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
<span v-else>{{ scope.row[item.prop] }}</span>
</template>
</el-table-column>
</el-table>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="page.curPage"
:page-sizes="[20, 30, 50, 100]" :page-size="page.pageSize" layout="total, sizes, prev, pager, next, jumper"
:total="page.total">
</el-pagination>
<detail-dialog ref="detailDialogRef"></detail-dialog>
<detail-drawer ref="detailDrawerRef" :pageIndex="pageIndex" @viewPdf="openViewPdf"></detail-drawer>
</div>
</template>
<script>
import { getTableFindAll, declareDeleteById, reedit } from "@/api/declareTable.js";
import detailDrawer from "../declarationInput/detailDrawer.vue";
import detailDialog from "./detailDialog.vue";
import { tableHeaderKeys } from "./tableHeaderKey.js";
import { downLoadXlsx, downLoadViewPdf } from "@/utils/zipdownload";
export default {
name: "declareQuery",
components: {
detailDialog,
detailDrawer,
},
data() {
return {
pageIndex: "query",
tableData: [], //运单数据
tableHeaderList: tableHeaderKeys,
sreachFormData: {
deliveryNo: "",
commitTimeFrom: "",
commitTimeTo: "",
consignmentCode: [],
},
oldSreachFormData: {
deliveryNo: "",
commitTimeFrom: "",
commitTimeTo: "",
consignmentCode: [],
},
startDate: new Date() - 3,
endDate: new Date,
page: {
curPage: 1,
pageSize: 20,
total: 0, //数据总和
},
tableSelect: true,
tableLoading: false, //表格loading
exportLoading: false,
defQuery: 0,
consignmentCodeRows: 1,
startPickerOptions: {
disabledDate: (time) => {
if (
this.sreachFormData.commitTimeTo != "" &&
this.sreachFormData.commitTimeTo != null
) {
let commitTimeTo = new Date(
this.sreachFormData.commitTimeTo
).getTime();
return time.getTime() > commitTimeTo;
} else {
return !time.getTime();
}
},
},
endPickerOptions: {
disabledDate: (time) => {
if (
this.sreachFormData.commitTimeFrom != "" &&
this.sreachFormData.commitTimeFrom != null
) {
let commitTimeFrom = new Date(
this.sreachFormData.commitTimeFrom
).getTime();
return time.getTime() < commitTimeFrom - 24 * 60 * 60 * 1000;
} else {
return !time.getTime();
}
},
},
sortOrder: 0, //查询排序 默认根据操作状态呢降序排序
};
},
computed: {
tableMaxheight() {
return window.innerHeight - 300;
},
getOldDate() {
let oldDate = new Date(new Date().getTime() - 3600 * 1000 * 24 * 2);
return oldDate.getFullYear() + '-' + (oldDate.getMonth() + 1).toString().padStart(2, 0) + '-' + (oldDate.getDate()).toString().padStart(2, 0);
}, getNewDate() {
let nowDate = new Date();
return nowDate.getFullYear() + '-' + (nowDate.getMonth() + 1).toString().padStart(2, 0) + '-' + (nowDate.getDate()).toString().padStart(2, 0);
},
rules() {
let rules = {
commitTimeFrom: [
{
validator: (rule, value, callback) => {
if (!value) {
this.$refs.sreachForm.clearValidate(['commitTimeTo']);
this.tableSelect = true;
}
// new Date(year, month, day, hour, minute, second, millisecond);
if (value && this.sreachFormData.commitTimeTo) {
if (new Date(value + " 00:00:00").getTime() > new Date(this.sreachFormData.commitTimeTo + " 00:00:00").getTime()) {
callback("開始時間不能晚於截止時間")
this.tableSelect = false;
} else {
callback()
this.tableSelect = true;
}
}
},
trigger: "change",
},
],
commitTimeTo: [
{
validator: (rule, value, callback) => {
if (!value) {
this.$refs.sreachForm.clearValidate(['commitTimeFrom']);
this.tableSelect = true;
}
if (value && this.sreachFormData.commitTimeFrom) {
if (new Date(value + " 00:00:00").getTime() < new Date(this.sreachFormData.commitTimeFrom + " 00:00:00").getTime()) {
callback("截止時間不能早於開始時間")
this.tableSelect = false;
} else {
callback()
this.tableSelect = true;
}
}
},
trigger: "change",
},
]
}
return rules;
},
},
created() { },
mounted() {
// let oldDate = new Date(new Date().getTime() - 3600 * 1000 * 24 * 2);
// let nowDate = new Date();
this.sreachFormData.commitTimeFrom = this.getOldDate;
this.sreachFormData.commitTimeTo = this.getNewDate;
// this.$set(this.sreachFormData,'commitTimeFrom', );
// this.$set(this.sreachFormData,'commitTimeTo', nowDate.getFullYear() + '-' + (nowDate.getMonth()+1) + '-' + (nowDate.getDate()));
this.sreachData(null);
},
methods: {
// 查询
sreachData(paramsData) {
// this.$refs["sreachForm"].validate((valid, object) => {
if (this.tableSelect) {
if (!paramsData) {
paramsData = {
...this.sreachFormData,
deliveryNo: this.sreachFormData.consignmentCode.join(";"),
page: this.page.curPage,
query: this.defQuery,
size: this.page.pageSize,
sort: this.sortOrder,
};
this.oldSreachFormData={
...this.sreachFormData,
};
}
if (paramsData.deliveryNo.split(';').length > 1000) {
this.$alert('單次最多可查詢1000個提單號碼', '提示', {
confirmButtonText: '確定',
type: 'warning'
});
return;
} else {
this.tableLoading = true;
delete paramsData.consignmentCode;
getTableFindAll(paramsData)
.then((res) => {
if (res.code == 200) {
this.tableData = res.data.list;
this.page.total = res.data.total;
} else {
this.msgWarning(res.msg);
}
})
.finally(() => {
this.tableLoading = false;
});
}
}
// });
},
checkDate1() {
this.$refs.sreachForm.validateField('commitTimeFrom', valid => {
if (!valid) {
this.$refs.sreachForm.validateField('commitTimeTo');
}
});
},
checkDate2() {
this.$refs.sreachForm.validateField('commitTimeTo', valid => {
if (!valid) {
this.$refs.sreachForm.validateField('commitTimeFrom');
}
});
},
// column 当前列数据 prop 当前排序的字段 order 排序规则
handleSortChange({ column, prop, order }) {
if (prop == "operStatusAndTime1") {
this.sortOrder = order ? order == 'descending' ? 2 : 1 : 0;
} else if (prop == "delStatus") {
this.sortOrder = order ? order == 'descending' ? 4 : 3 : 0;
}
this.page.curPage=1;
let paramsData = {
...this.oldSreachFormData,
page: this.page.curPage,
query: this.defQuery,
size: this.page.pageSize,
sort: this.sortOrder,
};
this.sreachData(paramsData);
},
// 查询按钮
searchTable() {
this.page.curPage = 1;
this.defQuery = "";
this.sreachData(null);
},
// 改变偶数行背景色
tableRowClassName({ row, rowIndex }) {
if ((rowIndex + 1) % 2 === 0) {
return "bgc-row";
}
return "";
},
//操作
deleteDeclare(row) {
this.$confirm('是否確認刪除', '提示', {
confirmButtonText: '確定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
declareDeleteById(row.id).then((res) => {
if (res.code == 200) {
this.$message({
type: 'success',
message: '刪除成功!'
});
this.sreachData(null);
} else {
this.msgWarning(res.msg);
}
});
}).catch(() => {
// this.$message({
// type: 'info',
// message: '刪除失敗'
// });
})
},
// 改变页面条数
handleSizeChange(val) {
this.page.pageSize = val;
this.sreachData(null);
},
// 切换页码
handleCurrentChange(val) {
this.page.curPage = val;
this.sreachData(null);
},
// 导出
exportBtn() {
let paramsData = {
...this.oldSreachFormData,
query: this.defQuery,
sort: this.sortOrder,
};
this.exportLoading = true;
downLoadXlsx("/icleartw/declare/export", paramsData, "提單表")
.then(() => {
this.$message.success("導出成功");
this.exportLoading = false;
})
.catch(() => {
this.exportLoading = false;
});
},
// 查看
viewDeclare(row) {
this.$refs.detailDrawerRef.openDrawer(row, "table");
},
// 下载附件
downloadFiles(row) {
this.$refs.detailDialogRef.openDialog(row);
},
// 编辑
editDeclare(row) {
this.$router
.push({
name: "declarationInput",
params: {
step: JSON.stringify(row.saveStep),
id: JSON.stringify(row.id),
},
})
.catch(() => { });
},
//重新编辑
reEditDeclare(row) {
this.$store.dispatch('AppLoading', true);
reedit(row.id).then((res) => {
if (res.code = 200) {
this.$router
.push({
name: "declarationInput",
params: {
step: 1,
id: JSON.stringify(res.data.id),
},
})
.catch(() => { });
} else {
$message.error(res.msg);
}
}).catch(() => { }).finally(() => {
this.$store.dispatch('AppLoading', false);
})
},
//文本域切换
consignmentCodeFocus() {
this.consignmentCodeRows = 5;
this.$nextTick(() => {
let inputInner = document.querySelector(
"#inputInner--deliveryNo"
).parentNode;
let inputOuter = document.querySelector("#inputOuter--deliveryNo");
inputInner.classList.add("consignmentCode-textarea");
document.querySelector("#inputInner--deliveryNo").focus();
setTimeout(() => {
inputOuter.classList.add("active");
inputOuter.classList.add("activeBorder");
}, 100);
});
},
consignmentCodeBlur(val) {
this.consignmentCodeRows = 1;
this.$nextTick(() => {
let inputInner = document.querySelector(
"#inputInner--deliveryNo"
).parentNode;
inputInner.classList.remove("consignmentCode-textarea");
});
this.sreachFormData.consignmentCode = val.target.value.split("\n");
let arr = []
this.sreachFormData.consignmentCode.forEach(item => {
if (item != '' && item != null) {
arr.push(item)
}
})
this.sreachFormData.consignmentCode = arr
},// 查看pdf
openViewPdf(file) {
file.findLoading = true;
downLoadViewPdf("/icleartw/cusFile/previewFile", { fileId: file.id }, file.name + file.type).then(() => {
}).finally(() => {
file.findLoading = false;
});
},
},
};
</script>
<style>
.el-dropdown-menu__item.is-disabled {
color: #bbb;
}
</style>
<style lang="scss" scoped>
@import "@/assets/styles/variables.scss";
.search-wrap {
height: calc(100% - 28px);
margin: 12px 12px 16px 16px;
background-color: #fff;
padding: 20px;
.search-box {
margin-bottom: 12px;
position: relative;
.export-btn {
position: absolute;
right: 12px;
top: 0;
}
}
::v-deep .el-table .bgc-row {
background: #f2f2f2;
}
.el-pagination {
text-align: right;
margin-top: 10px;
::v-deep .el-input.is-focus .el-input__inner {
border: 1px solid $fedexColor;
}
::v-deep .el-input .el-input__inner:hover {
border: 1px solid $fedexColor;
}
::v-deep .el-input__inner:focus {
border: 1px solid $fedexColor;
}
::v-deep .el-pager li.active {
color: $fedexColor;
}
::v-deep .el-pager li:hover {
color: $fedexColor;
}
}
// .el-table__body-wrapper {
// overflow: auto;
// }
}
.search-btn {
::v-deep .el-button {
border: 1px solid #cccccc;
height: 50px;
width: 90px;
.el-icon-search {
color: #cccccc;
font-size: 20px;
}
}
.el-button:hover,
.el-button:focus {
background: #f3f1f1;
}
}
.texttareaTip {
position: absolute;
top: 50%;
right: 20px;
transform: translate(0, -50%);
z-index: 10;
}
.consignmentCode-textarea {
position: absolute;
top: 25px;
left: 1px;
z-index: 10;
min-height: 170px !important;
border: 2px solid $fedexBorder;
background-color: $fedexTablebackgroundColor;
transition: all 0.2s ease;
}
.queryTable {
::v-deep .cell {
text-align: center;
white-space: pre-line;
}
}
</style>
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,
},
];
@import "./variables.scss";
@import "./mixin.scss";
@import "./transition.scss";
@import "./element-ui.scss";
@import "./sidebar.scss";
@import "./btn.scss";
//fedex样式
.el-loading-spinner .path {
stroke: $fedexColor !important;
}
// checkbox
.el-checkbox__inner {
width: 1.25rem;
min-width: 1.25rem;
height: 1.25rem;
border: 2px solid $fedexButton;
content: "";
box-sizing: border-box;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #fff;
border-color: $fedexButton !important;
color: $fedexButton !important;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner::before {
background-color: $fedexButton !important;
top: 7px;
}
.el-checkbox__input.is-focus .el-checkbox__inner {
border-color: $fedexButton !important;
}
.el-checkbox__inner:hover {
border-color: $fedexButton !important;
}
.is-checked {
.el-checkbox__inner {
border: 2px solid $fedexButton !important;
background-color: transparent !important;
}
.el-checkbox__inner::after {
border: 2px solid $fedexButton;
border-top: 0;
border-right: 0;
// left: 0.3125rem;
display: block;
position: absolute;
content: " ";
top: 0.2rem;
width: 0.625rem;
height: 0.3125rem;
box-sizing: border-box;
transform: rotate(-45deg) scaleY(1) !important;
}
}
//radio
.el-radio__input {
.el-radio__inner {
width: 16px;
height: 16px;
border: 2px solid $fedexButton !important;
}
}
.el-radio__label {
color: #999;
font-size: 12px;
}
.el-radio__inner::after {
background-color: $fedexButton;
}
.el-radio__input.is-checked .el-radio__inner::after {
transform: translate(-50%, -50%) scale(2);
}
.el-radio__input.is-checked .el-radio__inner {
background-color: #fff !important;
}
.el-radio__input.is-checked+.el-radio__label {
color: $fedexButton !important;
}
//button
.el-button {
border-radius: 0;
border-color: $fedexButton;
color: $fedexButton;
font-weight: 600;
}
.el-button:hover,
.el-button:focus,
.el-button.is-plain:hover,
.el-button.is-plain:focus {
background: $fedexButton;
border-color: $fedexButton;
color: #fff;
}
.el-button--text:hover,
.el-button--text:focus {
background: transparent;
border: none;
color: $fedexButton;
}
.el-button--primary,
.el-button--primary:hover,
.el-button--primary:focus {
color: #fff;
background: transparent;
border-color: $fedexBottonColor;
}
.el-button-noHover:hover {
color: $fedexButton !important;
background-color: rgba(0, 122, 183, 0.1) !important;
}
.is-circle {
border-radius: 20px !important;
padding: 7px 12px !important;
}
.el-button--text {
color: $fedexButton !important;
font-weight: 600 !important;
border: none;
}
.entrySave {
// margin-top: 64px;
text-align: center;
.el-button {
width: 112px;
height: 56px;
font-size: 1.1875rem;
font-weight: 700;
}
.saveTip {
font-size: 16px;
font-weight: 100;
color: #000000;
margin-top: 16px;
}
}
.entrySaveButton {
background-color: transparent;
border-color: $fedexBottonColor !important;
border-width: 2px;
color: $fedexBottonColor;
}
.entrySaveButton-background {
background-color: $fedexBottonColor !important;
color: #fff !important;
}
.entrySaveButton:hover,
.entrySaveButton:focus {
color: #fff !important;
background-color: $fedexBottonColor !important;
}
.entrySaveButton-background:hover,
.entrySaveButton-background:focus {
background-color: rgba(255, 102, 0, 0.7) !important;
}
.whiteBtn-background {
background-color: #fff !important;
color: $fedexBottonColor !important;
border: 2px solid $fedexBottonColor;
}
.whiteBtn-background:hover,
.whiteBtn-background:focus {
color: #fff !important;
background-color: $fedexBottonColor !important;
}
.button-noHover:hover,
.button-noHover:focus {
border-color: $fedexButton !important;
color: $fedexButton !important;
background-color: #fff !important;
}
.el-button.is-disabled,
.el-button.is-disabled:focus,
.el-button.is-disabled:hover {
// border-color: #ebeef5 !important;
// color: #c0c4cc !important;
// background-color: #fff !important;
}
//update
.upload-demo {
.el-upload-list {
.el-upload-list__item {
margin: 0px;
line-height: normal;
}
}
}
//pagination
.el-pagination.is-background .el-pager li:not(.disabled):hover {
color: $fedexColor;
}
.el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: $fedexColor !important;
color: #fff;
}
//dialog
.el-dialog {
display: flex;
flex-direction: column;
margin: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-height: auto;
max-width: 100%;
}
.el-dialog__title {
font-size: 16px;
font-weight: 400;
color: #333333;
}
.el-dialog-change {
transform: translate(-50%, -35%) !important;
}
//form
.el-input,
.el-textarea,
.el-select {
input,
textarea {
border-radius: 0px !important;
font-family: FedExSansArabic, FedExSans, Arial, sans-serif !important;
}
}
input,
textarea {
outline: none !important;
border-radius: 0px !important;
font-family: FedExSansArabic, FedExSans, Arial, sans-serif !important;
}
input:disabled {
color: $formDisabledColor;
cursor: not-allowed;
}
.inputShadow {
// box-shadow: inset 0 0 0.1rem #f2f2f2;
}
.el-textarea__inner:focus {
border-color: $fedexBorder;
}
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label::before {
content: "";
}
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:after {
content: "*";
color: #ff4949;
margin-right: 4px;
}
.fedexRadiusInput {
input {
border-radius: 50px 0 0 50px !important;
}
.el-input-group__append {
border-radius: 0 50px 50px 0;
background-color: #fff;
}
}
.fedexRadiusTowInput {
input {
border-radius: 50px !important;
}
.el-input-group__append {
border-radius: 50px;
// background-color: #fff;
}
}
.fedexFormStyle {
// margin-top: 4px;
.formTitle {
font-size: 14px;
font-weight: 600;
color: #333333;
margin-top: 12px;
margin-bottom: 4px;
}
.el-form-item {
position: relative;
height: 50px;
background-color: $formItemBackgroundColor;
margin-bottom: 5px;
// padding-top: 3px;
.el-form-item__label {
position: relative;
font-size: 0.75rem;
font-weight: 700;
color: #333;
height: max-content;
padding: 0 0 0 0.6rem;
line-height: 14px;
/*设置行高，防止因为字体缩放导致元素高度变化*/
transform: translate3d(0, 10px, 0);
/*标题平移至合适位置*/
transition: all 0.2s ease;
cursor: text;
}
.el-form-item__content {
position: absolute;
width: 100%;
height: 100%;
top: 0;
bottom: 0px;
line-height: normal;
.el-input,
// .el-select,
.el-date-editor,
.el-range-editor,
.el-checkbox,
.el-autocomplete {
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(0.6rem + 0.1875rem);
font-size: 0.875rem !important;
}
}
.el-select {
width: 100%;
// height: 100%;
input {
width: 100%;
height: 100% !important;
border: none !important;
background-color: transparent;
margin-bottom: 4%;
padding-top: 1.15rem;
// padding-right: 1.15rem;
padding-left: calc(0.6rem + 0.1875rem);
font-size: 0.875rem !important;
}
}
input {
width: 100% !important;
height: 100% !important;
border: none !important;
background-color: transparent;
padding-top: 0.775rem;
// padding-right: 1.15rem;
padding-left: calc(0.6rem + 0.1875rem);
font-size: 0.875rem !important;
}
.el-textarea {
textarea {
border: none !important;
background-color: transparent;
// margin-top: 1.15rem;
// padding-right: 1.15rem;
padding-left: calc(0.625rem + 0.1875rem);
font-size: 1rem !important;
}
}
.el-range-editor.el-input__inner {
border: none;
}
}
.formError {
height: max-content;
line-height: 20px;
color: $fedexError;
font-size: 0.75rem;
padding: 0 0.9375rem;
}
.el-date-editor {
// .el-input__prefix {
// display: none;
// }
}
}
.formItem-justItem {
.el-form-item__content {
&:first-child {
// border-bottom: 1px solid $fedexBorder;
}
.el-form-item {
height: 25px !important;
line-height: 25px;
margin-bottom: 0;
.el-form-item__label {
transform: translate3d(0, -2px, 0);
}
.el-form-item__content {
.el-input,
.el-select,
.el-date-editor,
.el-range-editor,
.el-autocomplete {
input {
padding-top: 0px;
}
.el-input__suffix {
top: 5px;
}
}
}
}
}
}
.el-form-item:has(input:disabled) {
color: $formDisabledColor !important;
.el-form-item__label {
color: $formDisabledColor;
}
.el-form-item__content {
input {
color: $formDisabledColor !important;
}
}
}
.is-error {
margin-bottom: 40px;
border-left: 3px solid $fedexError;
.el-form-item__label {
color: $fedexError;
}
}
.el-form-item:has(.inputFocus) {
.el-form-item__label {
position: relative;
font-size: 0.625rem;
font-weight: 700;
height: max-content;
padding: 0 0 0 0.6rem;
line-height: 14px;
/*设置行高，防止因为字体缩放导致元素高度变化*/
transform: translate3d(0, 1px, 0);
/*标题平移至合适位置*/
transition: all 0.2s ease;
z-index: 99;
}
}
// .active {
// .el-form-item__label {
// position: relative;
// font-size: 0.625rem;
// font-weight: 700;
// height: max-content;
// padding: 0 0 0 .6rem;
// line-height: 14px;
// /*设置行高，防止因为字体缩放导致元素高度变化*/
// transform: translate3d(0, 1px, 0);
// /*标题平移至合适位置*/
// transition: all .2s ease;
// z-index: 99;
// }
// }
.formItem-justItem .el-form-item:has(.inputFocus) {
.el-form-item__label {
display: none;
}
}
.formItem-justItem:has(.formError) {
margin-bottom: 36px;
}
.borderFormItemContent {
.el-form-item__content {
top: 10px;
border-left: 2px solid #333;
}
}
.activeBorder {
border-left: 3px solid $fedexColor;
}
}
.fedexformSreach {
background-color: #fff;
border-bottom: 1px solid $fedexBorder;
.el-form-item {
background-color: transparent;
border-right: 1px solid $fedexBorder !important;
margin-bottom: 0px;
line-height: 25px;
.el-button {
margin-top: 8px;
}
}
.activeBorder {
border: none;
}
}
.fedexTableForm {
height: 100%;
.el-form-item {
.el-form-item__label {
width: 100%;
height: 34px;
line-height: 34px;
font-size: 12px;
font-weight: 600;
color: #333;
background-color: #e3e3e3;
padding-left: 16px;
}
.el-form-item__content {
width: 100%;
height: 100%;
min-height: 36px;
background-color: #f2f2f2;
margin-top: 2px;
div {
height: 100%;
// padding: 0 15px;
}
.el-input,
.el-select {
width: 100%;
input {
border: none;
background-color: transparent;
}
}
}
}
}
.backgroundCol {
.el-form-item {
.el-form-item__label {
color: $fedexBottonColor !important;
}
}
}
//table
.fedexDetialTable {
width: 100%;
height: auto;
position: relative;
.el-table::before {
height: 0;
}
.el-table tbody tr:hover>td {
background-color: rgba(0, 122, 183, 0.1) !important;
}
.el-table__header-wrapper {
width: 100%;
.el-table__header {
.has-gutter {
tr {
th {
position: relative;
font-size: 12px;
font-weight: 700;
background-color: #fff !important;
border: none;
}
}
}
}
}
.el-table__body-wrapper {
width: 100%;
height: auto;
min-height: 100px;
.el-table__body {
tbody {
tr {
width: 100%;
// height: 50px !important;
&:first-child {
td {
border-top: 1px solid $fedexTableBorderColor;
}
}
td {
// height: 50px !important;
font-size: 12px;
font-weight: 400 !important;
// background-color: $fedexTablebackgroundColor;
border-right: none;
.cell {
width: 100% !important;
}
&:first-child {
border-left: 1px solid $fedexTableBorderColor;
}
&:last-child {
border-right: 1px solid $fedexTableBorderColor;
}
}
.el-table__expand-column {
div {
display: none;
}
}
}
.el-table__row_isError {
td {
// border-color: $fedexError !important;
// border-top: 1px solid $fedexError !important;
// border-bottom: 1px solid $fedexError !important;
background-color: rgba(224, 0, 45, 0.05) !important;
}
}
.el-table__expanded-cell {
padding: 8px !important;
background-color: #fff !important;
border-top: 1px solid $fedexBorder;
}
}
}
}
}
.fedexTableBlack {
.el-table__body-wrapper {
.el-table__body {
tbody {
tr {
td {
background-color: $fedexTablebackgroundColor !important;
border-color: $fedexTableBorderColor;
}
}
}
}
}
}
.fedexSreachTable {
.el-table__body-wrapper {
height: auto;
.el-table__body {
tbody {
tr {
height: 32px !important;
td {
height: 32px !important;
font-size: 12px;
font-weight: 400 !important;
}
}
}
}
}
}
.fedexFormTable {
.el-table__body-wrapper {
.el-table__body {
tbody {
tr {
td {
input {
height: auto;
border: none !important;
background-color: transparent;
padding: 0px !important;
font-size: 12px !important;
line-height: normal;
}
}
}
}
}
}
}
.tableHeightAuto {
overflow-y: auto;
.el-table__body-wrapper {
// height: auto !important;
}
}
//dropdown
.el-dropdown {
.el-button {
// width: 4rem;
}
}
.el-dropdown-menu {
padding: 0px;
.el-dropdown-menu__item {
font-size: 12px;
font-weight: 400;
color: #333;
height: 50px;
line-height: 50px;
border-bottom: 1px solid $fedexBorder;
}
.el-dropdown-menu__item:not(.is-disabled):hover,
.el-dropdown-menu__item:focus {
color: #333;
background-color: $formItemBackgroundColor;
}
}
//alert
.fedexAlert {
// position: absolute;
// top: 20px;
// left: 21.8%;
z-index: 10;
width: 100%;
font-size: 14px;
font-weight: 400;
min-height: 80px;
// margin: 0 auto;
background-color: #fafafa !important;
color: #000 !important;
box-shadow: #cfcfcf 0px 0px 5px;
.fedexAlert-list {
display: flex;
svg {
display: block;
margin-right: 25px;
}
}
.el-icon-close:before {
color: #333;
font-size: 16px;
}
.el-icon-user-solid {
position: absolute;
top: 50%;
left: 5%;
transform: translate(-50%, -50%);
font-size: 30px;
}
.alertText {
margin-left: 80px;
}
}
//message
.el-message-box {
.el-message-box__header {
.el-message-box__title {
.el-icon-warning {
color: $fedexBottonColor;
}
}
}
.el-message-box__btns {
.el-button {}
}
}
//other
.TemplateSave {
width: 240px;
margin-top: 24px;
.el-input {
height: 50px !important;
.el-input__inner {
height: 50px !important;
}
.el-input-group__append {
background-color: #fff !important;
color: $fedexButton !important;
}
}
}
.entryInfoTop-item {
width: 320px;
height: 50px;
.el-form {
height: 60px !important;
.el-form-item {
background-color: transparent;
.el-form-item__label {
font-size: 14px;
font-weight: 600;
}
.el-form-item__content {
border: 1px solid $fedexColor !important;
.el-input {
input {
border: none !important;
font-size: 20px;
}
.el-input__suffix {
top: 12px;
font-size: 20px;
color: $fedexButton;
}
}
}
}
}
}
.el-message-box {
.el-button {
border-color: $fedexBottonColor;
color: $fedexBottonColor;
}
.el-button--primary {
background-color: $fedexBottonColor;
color: #fff;
}
.el-button:hover,
.el-button:focus {
background-color: $fedexBottonColor;
color: #fff;
}
.el-button--primary:hover,
.el-button--primary:focus {
background-color: rgba(255, 102, 0, 0.7);
}
}
.el-select-dropdown__item.selected {
color: $fedexColor;
}
.popoverlines {
max-height: 250px;
overflow-y: auto;
overflow-x: hidden;
}
.el-message--warning .el-message__content {
color: #e6a23c;
}
.fedex_input_count {
.el-input .el-input__count .el-input__count-inner {
margin-top: 80%;
background-color: rgba($color: #fff, $alpha: 0);
}
}
.el-input .el-input__count .el-input__count-inner {
background-color: rgba($color: #fff, $alpha: 0);
}
.el-textarea .el-input__count {
font-weight: 500;
}
.el-message {
margin-top: -0.2%;
}
.checkbox-step2 {
.el-checkbox__label {
width: 100% !important;
}
}
.el-dialog__body {
padding: 30px 0px !important;
}
.textarea-box {
.label {
.el-form-item__label {
padding-left: 0.69rem;
}
}
}
.queryTextarea-box {
.el-textarea {
textarea {
height: max-content;
margin-top: 1.3rem;
}
}
.el-form-item {
height: 55px;
}
.el-button {
height: 55px !important;
}
}
.unIconDatePicker {
.el-input__suffix {
.el-input__suffix-inner {
.el-icon-date {
display: none !important;
}
}
}
}
\ No newline at end of file