Elements-SY

modify

......@@ -5,14 +5,17 @@
<el-divider content-position="left">ET86配舱航班顺位</el-divider>
</el-col>
</el-row>
<!-- ET86配舱航班顺位 -->
<el-row :gutter="24" justify="center">
<el-col :span="18">
<yl-table
:emptyText="tableEmptyText"
emptyText="请添加配舱航班"
:attrs="tableAttr"
:loadingTable="tableAttr.loadingTable"
:tableData="tableData"
:pageConfig="pageConfig"
:pageConfig="{
isPagination: false,
}"
@add="addBtn"
>
<template #column>
......@@ -36,8 +39,6 @@
@focus="inputFocus(scope)"
@input="inputEvent"
placeholder="请输入航班号"
class="demo-edit"
ref="demo"
/>
</template>
</el-table-column>
......@@ -108,6 +109,7 @@
</yl-table>
</el-col>
</el-row>
<!-- 航线维度设置 -->
<el-row style="padding: 20px 0">
<el-col>
<el-divider content-position="left">航线维度设置</el-divider>
......@@ -137,7 +139,6 @@
</el-col>
<el-col :span="24">
<el-form-item label="服务种类">
<!-- <div class="label-title label-service-type">服务类型</div> -->
<el-col :span="4">
<el-radio-group
v-model="queryForm.isServiceCode"
......@@ -195,7 +196,7 @@
<el-form-item label="申报类别">
<el-card shadow="never">
<el-checkbox-group
v-model="queryForm.checkboxClsssType"
v-model="checkboxClsssType"
@change="checkboxSingleName"
style="display: flex"
v-if="queryForm.cargoType.length"
......@@ -240,7 +241,6 @@
placeholder="最大重量"
@blur="inputBlur('maxWeight')"
></el-input>
<span ref="maxWeight" class="el-form-item__error"></span>
</el-col>
</el-form-item>
</el-col>
......@@ -264,7 +264,6 @@
placeholder="最多件数"
@blur="inputBlur('maxNumOfPieces')"
></el-input>
<span ref="maxNumOfPieces" class="el-form-item__error"></span>
</el-col>
</el-form-item>
</el-col>
......@@ -297,10 +296,6 @@
placeholder="最大申报价值"
@blur="inputBlur('maxCNYCustomVal')"
></el-input>
<span
ref="maxCNYCustomVal"
class="el-form-item__error"
></span>
</el-col>
</el-form-item>
</el-col>
......@@ -326,10 +321,6 @@
placeholder="最大申报价值"
@blur="inputBlur('maxSUDCustomVal')"
></el-input>
<span
ref="maxSUDCustomVal"
class="el-form-item__error"
></span>
</el-col>
</el-form-item>
</el-col>
......@@ -368,37 +359,31 @@ export default {
mixins: [indexMixins],
data() {
return {
test: "测试",
formConfig: formConfig, // 表单配置项
queryForm: {
// 表单参数
fltNo: "", // 原航班号
isServiceCode: "1", // 服务种类
serviceCode: "",
includeUrsa: "", // URSA包含
notIncludeUrsa: "", // URSA不包含
cargoType: [], // 申报类别调用接口获取所有的申报类别
singleName: false, // 单品名
minWeight: null,
maxWeight: null,
minNumOfPieces: null,
maxNumOfPieces: null,
includeUrsa: "", // URSA包含
notIncludeUrsa: "", // URSA不包含
checkboxClsssType: [], // 申报类别
minCNYCustomVal: "", //
maxCNYCustomVal: "", //
minSUDCustomVal: "", //
maxSUDCustomVal: "", //
serviceCodeData: [], // 【服务种类】调用接口获取服务种类所有的serviceCode
cargoType: [], // 申报类别
},
pageConfig: {
// 分页配置项
isPagination: false,
},
tableAttr: tableAttr, // table配置项
tableEmptyText: "请添加配舱航班",
tableData: [],
currentIndex: 0, // 记录当前table 列的索引位置
id: 0,
checkboxClsssType: [], // 申报类别
serviceCodeData: [], // 【服务种类】调用接口获取服务种类所有的serviceCode
};
},
computed: {},
......@@ -418,22 +403,26 @@ export default {
this.getEdit();
this.PostFindDestinationFltRuleByFlightNo();
},
mounted() {
this.$nextTick(() => {
let el = document.querySelector(".demo-edit");
console.log(el);
console.log(this.$refs.demo);
});
},
mounted() {},
directives: {
// 处理加减天数
"input-filter": {
bind: function (el, binding) {
el.handler = function (event) {
console.log(el);
let regExp = /[^0-9a-zA-Z_]/g;
let newValue = event.target.value.replace(regExp, "");
if (newValue !== event.target.value) {
event.target.value = newValue;
if (event.data == "E" || event.data == "e") {
// 无理数时
event.target.value = "";
}
if (event.target.value) {
if (Number(event.target.value) < -7) {
event.target.value = "";
} else if (Number(event.target.value) > 7) {
event.target.value = "";
} else if (/[\.]/.test(Number(event.target.value))) {
// 浮点数时
event.target.value = "";
} else {
}
event.target.dispatchEvent(new Event("input"));
}
};
......@@ -515,11 +504,11 @@ export default {
console.log(res);
});
},
// input 聚焦事件
inputFocus(scope) {
this.currentIndex = scope.$index;
// 航班号input 聚焦事件
inputFocus({ $index }) {
this.currentIndex = $index;
},
// input事件
// 航班号input搜索事件
inputEvent: debounce(function () {
let params = {
fltNo: this.tableData[this.currentIndex].fltNo,
......@@ -532,7 +521,7 @@ export default {
this.msgError("请输入航班号");
}
}, 1000),
// 添加
// 添加ET86配舱航班顺位
addBtn(item) {
this.tableData.unshift({
id: this.id++,
......@@ -543,7 +532,6 @@ export default {
isOn: "0" ? false : true,
sort: "0", // 排序字段
});
console.log("add:", this.tableData);
},
// 是否爆仓
changeCheck({ $index, row }) {
......@@ -558,36 +546,47 @@ export default {
this.tableData.splice($index, 1);
},
// 类别
checkboxSingleName(val) {
console.log(val);
checkboxSingleName(arr) {
let include = this.queryForm.cargoType.filter((item) =>
arr.some((val) => val == item.chineseName)
);
console.log(arr, include);
},
// input失焦事件
// 重量、件数、申报值input失焦事件
inputBlur(name) {
let coin = {
minCNYCustomVal: "CNY",
maxCNYCustomVal: "CNY",
minSUDCustomVal: "USD",
maxSUDCustomVal: "USD",
};
if (name == "minWeight") {
// 最小重量
this.validateMaxWeight("maxWeight");
this.validateMinWeight(name);
}
if (name == "maxWeight") {
// 最大重量
this.validateMinWeight("minWeight");
this.validateMaxWeight(name);
}
if (name == "minNumOfPieces") {
// 最小件数
this.validateMaxPieces("maxNumOfPieces");
this.validateMinPieces(name);
}
if (name == "maxNumOfPieces") {
// 最大件数
this.validateMinPieces("minNumOfPieces");
this.validateMaxPieces(name);
}
if (name == "minCNYCustomVal" || name == "minSUDCustomVal") {
// 最小申报值(CNY/USD)
this.validateMaxCustomVal(coin[name]);
this.validateMinCustomVal(coin[name]);
}
if (name == "maxCNYCustomVal" || name == "maxSUDCustomVal") {
// 最大申报值(CNY/USD)
this.validateMinCustomVal(coin[name]);
this.validateMaxCustomVal(coin[name]);
}
......@@ -595,8 +594,8 @@ export default {
// 表单提交
submitForm(formName) {
this.$refs[formName].validate((valid) => {
console.log(valid);
if (valid) {
console.log(this.tableData);
} else {
console.log("error submit!!");
return false;
......@@ -607,49 +606,44 @@ export default {
},
};
</script>
<style lang='scss' scoped>
<style lang="scss" scoped>
.rowPadding {
padding: 10px 0;
font-size: 12px;
}
.label-title{
font-size: 14px;
color: #606266;
font-weight: 700;
}
::v-deep .custom-label {
.el-form-item__content{
display: flex;
margin-left: 0 !important;
span{
font-size: 14px;
color: #606266;
font-weight: 700;
float: right;
margin-right: 10px;
text-align: end;
.el-form-item__content {
display: flex;
margin-left: 0 !important;
span {
font-size: 14px;
color: #606266;
font-weight: 700;
float: right;
margin-right: 10px;
text-align: end;
}
.custom-label-title{
width: 120px;
.custom-label-title {
width: 120px;
}
.el-input__suffix{
.el-input__suffix {
right: -15px !important;
}
.el-form-item__error{
color: #ff4949;
font-size: 12px;
line-height: 1;
padding-top: 4px;
position: absolute;
top: 100%;
left: 0;
font-weight: 500;
width: 100% !important;
.el-form-item__error {
color: #ff4949;
font-size: 12px;
line-height: 1;
padding-top: 4px;
position: absolute;
top: 100%;
left: 0;
font-weight: 500;
width: 100% !important;
}
}
}
::v-deep .custom-label-pieces {
.el-form-item__content{
.el-form-item__content {
width: 80%;
}
}
......
......@@ -29,7 +29,6 @@ export default {
},
// radio包含不包含serviceCode
isServiceCode(val) {
// 包含
// 勾选的时候去校验 || 输入的时候去校验
if (val == 1) {
if (this.serviceCodeCofig().noInclude.length) {
......@@ -58,7 +57,7 @@ export default {
}
},
// 最小重量
// 最小重量 【重量可以为空为0】
validateMinWeight(name) {
if (/^(0|[1-9]\d*)(.\d{1,5})?$/.test(Number(this.queryForm[name]))) {
// 最小重量大于0~34,并且最小重量不得大于最大重量
......@@ -97,9 +96,8 @@ export default {
},
// 最大重量
validateMaxWeight(name) {
// 最大重量
// 校验输入的规则(保留两位小数)
if (/^(0|[1-9]\d*)(.\d{1,2})?$/.test(Number(this.queryForm[name]))) {
// 最大重量大于0~34,并且最大重量不得小于最小重量
if (this.queryForm[name] && this.queryForm.minWeight) {
if (Number(this.queryForm[name]) < Number(this.queryForm.minWeight)) {
this.$refs.minWeight.innerHTML = "";
......@@ -133,7 +131,7 @@ export default {
return false;
}
},
// 最少件数
// 最小件数 【件数可以为空但件数不得为0】
validateMinPieces(name) {
// 校验输入的规则(只能输入正整数)
if (/^\d+$/.test(Number(this.queryForm[name]))) {
......@@ -142,13 +140,13 @@ export default {
Number(this.queryForm[name]) > Number(this.queryForm.maxNumOfPieces)
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数不得大于最多件数";
this.$refs.minNumOfPieces.innerHTML = "最小件数不得大于最大件数";
} else if (
Number(this.queryForm[name]) < 1 ||
Number(this.queryForm.maxNumOfPieces) < 1
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
this.$refs.minNumOfPieces.innerHTML = "最小件数和最大件数不能小于1";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
......@@ -159,10 +157,11 @@ export default {
) {
if (Number(this.queryForm[name]) < 1) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
this.$refs.minNumOfPieces.innerHTML = "最小件数和最大件数不能小于1";
} else if (Number(this.queryForm[name]) > 100) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能大于100";
this.$refs.minNumOfPieces.innerHTML =
"最小件数和最大件数不能大于100";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
......@@ -176,7 +175,7 @@ export default {
return false;
}
},
// 最件数
// 最件数
validateMaxPieces(name) {
// 校验输入的规则(只能输入正整数)
if (/^\d+$/.test(Number(this.queryForm[name]))) {
......@@ -185,13 +184,13 @@ export default {
Number(this.queryForm[name]) < Number(this.queryForm.minNumOfPieces)
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最大件数不得小于最件数";
this.$refs.minNumOfPieces.innerHTML = "最大件数不得小于最件数";
} else if (
Number(this.queryForm[name]) < 1 ||
Number(this.queryForm.minNumOfPieces) < 1
) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
this.$refs.minNumOfPieces.innerHTML = "最小件数和最大件数不能小于1";
return false;
} else {
this.$refs.minNumOfPieces.innerHTML = "";
......@@ -203,10 +202,11 @@ export default {
) {
if (Number(this.queryForm[name]) < 1) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能小于1";
this.$refs.minNumOfPieces.innerHTML = "最小件数和最大件数不能小于1";
} else if (Number(this.queryForm[name]) > 100) {
this.$refs.minNumOfPieces.innerHTML = "";
this.$refs.minNumOfPieces.innerHTML = "最少件数和最多件数不能大于100";
this.$refs.minNumOfPieces.innerHTML =
"最小件数和最大件数不能大于100";
} else {
this.$refs.minNumOfPieces.innerHTML = "";
return true;
......@@ -221,16 +221,13 @@ export default {
}
},
// 最小申报价值
// 最小申报价值 【申报价值可以为空为0】
validateMinCustomVal(name) {
// 申报价值
if (
/^(0|[1-9]\d*)(.\d{1,2})?$/.test(
Number(
this.queryForm.minCNYCustomVal || this.queryForm.minSUDCustomVal
)
)
) {
let value =
this.queryForm.minCNYCustomVal || this.queryForm.minSUDCustomVal;
let regexp = /^(0|[1-9]\d*)(.\d{1,2})?$/.test(Number(value));
if (regexp) {
if (name == "USD" || name == "美元") {
// 申报价值(美元)0~600
if (
......@@ -307,13 +304,10 @@ export default {
// 最大申报价值
validateMaxCustomVal(name) {
// 申报价值
if (
/^(0|[1-9]\d*)(.\d{1,2})?$/.test(
Number(
this.queryForm.maxCNYCustomVal || this.queryForm.maxSUDCustomVal
)
)
) {
let value =
this.queryForm.maxCNYCustomVal || this.queryForm.maxSUDCustomVal;
let regexp = /^(0|[1-9]\d*)(.\d{1,2})?$/.test(Number(value));
if (regexp) {
if (name == "USD" || name == "美元") {
// 申报价值(美元)0~600
if (
......@@ -330,16 +324,16 @@ export default {
} else {
this.$refs.minSUDCustomVal.innerHTML = "";
}
if (Number(this.queryForm.maxCNYCustomVal) > 600) {
if (Number(this.queryForm.maxSUDCustomVal) > 600) {
this.$refs.minSUDCustomVal.innerHTML = "";
this.$refs.minSUDCustomVal.innerHTML = "最大申报值不得大于600";
return false;
}
} else if (Number(this.queryForm.maxCNYCustomVal) < 0) {
} else if (Number(this.queryForm.maxSUDCustomVal) < 0) {
this.$refs.minSUDCustomVal.innerHTML = "";
this.$refs.minSUDCustomVal.innerHTML = "申报价值(美元)0~600";
return false;
} else if (Number(this.queryForm.maxCNYCustomVal) > 600) {
} else if (Number(this.queryForm.maxSUDCustomVal) > 600) {
this.$refs.minSUDCustomVal.innerHTML = "";
this.$refs.minSUDCustomVal.innerHTML = "最大申报值不得大于600";
return false;
......
......@@ -44,8 +44,9 @@ export default {
data() {
return {
formConfig: formConfig, // 表单配置项
queryForm: { // 表单参数
status: "有效"
queryForm: {
// 表单参数
status: "有效",
},
pageConfig: {
// 分页配置项
......@@ -115,10 +116,15 @@ export default {
},
// 搜索
searchBtn(row) {
let params = {
...this.queryForm,
};
if (this.queryForm.status == "有效") {
params.status = '1';
}
this.$refs.ruleForm.handleSearch("ruleForm", (val) => {
console.log(val);
console.log(params);
});
console.log(this.queryForm);
},
// 重置表单
restForm() {
......@@ -154,7 +160,7 @@ export default {
})
.then(() => {
console.log("删除:", item);
this.msgSuccess("删除成功!")
this.msgSuccess("删除成功!");
})
.catch(() => {});
},
......