|
|
|
<template>
|
|
|
|
<div>
|
|
|
|
<el-row :gutter="24">
|
|
|
|
<el-col :span="4">
|
|
|
|
<el-input size="medium" v-model="query.carrier" onkeyup="this.value=this.value.toUpperCase()" placeholder="承运人二字码"></el-input>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="4">
|
|
|
|
<el-input size="medium" v-model="query.dest" onkeyup="this.value=this.value.toUpperCase()" placeholder="目的港"></el-input>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="2">
|
|
|
|
<el-button size="medium" @click="getList" type="primary">查询</el-button>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="2">
|
|
|
|
<el-button size="medium" @click="add" type="primary">新增</el-button>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
<el-row :gutter="24">
|
|
|
|
<el-col :span="24">
|
|
|
|
<el-table
|
|
|
|
:data="tableData"
|
|
|
|
border
|
|
|
|
style="width: 100%">
|
|
|
|
<el-table-column
|
|
|
|
prop="carrier"
|
|
|
|
label="承运人二字码"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="dest"
|
|
|
|
label="目的港"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="destrate"
|
|
|
|
label="目的港费率"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="mycname"
|
|
|
|
label="燃油费类型"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="myc"
|
|
|
|
label="燃油费率"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="sccname"
|
|
|
|
label="战险类型"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="scc"
|
|
|
|
label="战险费率"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="zhidanfei"
|
|
|
|
label="制单费"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
prop="cgc"
|
|
|
|
label="信息传输费"
|
|
|
|
width="120">
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
|
|
fixed="right"
|
|
|
|
label="操作"
|
|
|
|
width="100">
|
|
|
|
<template slot-scope="scope">
|
|
|
|
<el-button @click="handleClick(scope.row)" type="text" size="small">编辑</el-button>
|
|
|
|
<el-button @click="deleteClick(scope.row)" type="text" size="small">删除</el-button>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-col>
|
|
|
|
<el-col :span="24">
|
|
|
|
<div class="block">
|
|
|
|
<el-pagination
|
|
|
|
@size-change="handleSizeChange"
|
|
|
|
@current-change="handleCurrentChange"
|
|
|
|
:current-page="query.pageNum"
|
|
|
|
:page-sizes="[10, 20, 30, 40]"
|
|
|
|
:page-size="query.pageSize"
|
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
|
:total="total">
|
|
|
|
</el-pagination>
|
|
|
|
</div>
|
|
|
|
</el-col>
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
title="费率信息"
|
|
|
|
:visible.sync="dialogVisible"
|
|
|
|
width="30%"
|
|
|
|
:before-close="handleClose">
|
|
|
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
|
|
<el-form-item label="目的港" prop="dest">
|
|
|
|
<el-input v-model="ruleForm.dest" onkeyup="this.value=this.value.toUpperCase()"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="目的港费率" prop="destrate">
|
|
|
|
<el-input v-model="ruleForm.destrate" type="number"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="承运人二字码" prop="carrier">
|
|
|
|
<el-input v-model="ruleForm.carrier" onkeyup="this.value=this.value.toUpperCase()"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="燃油费类型：" prop="mycname">
|
|
|
|
<el-input v-model="ruleForm.mycname" onkeyup="this.value=this.value.toUpperCase()"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="燃油费率" prop="myc">
|
|
|
|
<el-input v-model="ruleForm.myc" type="number"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="战险类型" prop="sccname">
|
|
|
|
<el-input v-model="ruleForm.sccname" onkeyup="this.value=this.value.toUpperCase()"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="战险费率" prop="scc">
|
|
|
|
<el-input v-model="ruleForm.scc" type="number"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="制单费" prop="zhidanfei">
|
|
|
|
<el-input v-model="ruleForm.zhidanfei" type="number"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item label="信息传输费" prop="cgc">
|
|
|
|
<el-input v-model="ruleForm.cgc" type="number"></el-input>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item>
|
|
|
|
<el-button type="primary" @click="dialogStatus==='create'?addForm('ruleForm'):ediForm('ruleForm')">保存</el-button>
|
|
|
|
<el-button @click="resetForm('ruleForm')">重置</el-button>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import {addRate,delRate,ediRate,selectRate} from "../../api/zhidan/zhidan";
|
|
|
|
export default {
|
|
|
|
data(){
|
|
|
|
return{
|
|
|
|
ruleForm: {
|
|
|
|
id:'',
|
|
|
|
carrier: '',
|
|
|
|
dest:'',
|
|
|
|
destrate:0,
|
|
|
|
myc:0,
|
|
|
|
scc:0,
|
|
|
|
zhidanfei:0,
|
|
|
|
mycname:'',
|
|
|
|
sccname:'',
|
|
|
|
cgc:0,
|
|
|
|
},
|
|
|
|
rules: {
|
|
|
|
|
|
|
|
},
|
|
|
|
query:{
|
|
|
|
carrier:'',
|
|
|
|
dest:'',
|
|
|
|
pageNum:1,
|
|
|
|
pageSize:20
|
|
|
|
},
|
|
|
|
total:0,
|
|
|
|
tableData:[],
|
|
|
|
dialogVisible:false,
|
|
|
|
dialogStatus: '',
|
|
|
|
}
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
this.getList();
|
|
|
|
},
|
|
|
|
methods:{
|
|
|
|
addForm(formName) {
|
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
|
if (valid) {
|
|
|
|
addRate(this.ruleForm).then((response) => {
|
|
|
|
const res = response.data
|
|
|
|
if (res.code !== '200') {
|
|
|
|
return this.$message.error('费率新增，失败！')
|
|
|
|
}
|
|
|
|
this.$message.success('费率新增，成功！')
|
|
|
|
this.dialogVisible = false;
|
|
|
|
this.getList();
|
|
|
|
}).catch(error => {
|
|
|
|
// 关闭加载
|
|
|
|
this.$message.warning('费率新增，失败！')
|
|
|
|
})
|
|
|
|
} else {
|
|
|
|
console.log('error submit!!');
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
ediForm(formName) {
|
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
|
if (valid) {
|
|
|
|
ediRate(this.ruleForm).then((response) => {
|
|
|
|
const res = response.data
|
|
|
|
if (res.code !== '200') {
|
|
|
|
return this.$message.error('费率更新，失败！')
|
|
|
|
}
|
|
|
|
this.$message.success('费率更新，成功！')
|
|
|
|
this.dialogVisible = false;
|
|
|
|
this.getList();
|
|
|
|
}).catch(error => {
|
|
|
|
// 关闭加载
|
|
|
|
this.$message.warning('费率更新，失败！')
|
|
|
|
})
|
|
|
|
} else {
|
|
|
|
console.log('error submit!!');
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
resetForm(formName) {
|
|
|
|
this.$refs[formName].resetFields();
|
|
|
|
},
|
|
|
|
add(){
|
|
|
|
this.ruleForm={
|
|
|
|
id:'',
|
|
|
|
carrier: '',
|
|
|
|
dest:'',
|
|
|
|
destrate:0,
|
|
|
|
myc:0,
|
|
|
|
scc:0,
|
|
|
|
zhidanfei:0,
|
|
|
|
mycname:'',
|
|
|
|
sccname:'',
|
|
|
|
cgc:0,
|
|
|
|
}
|
|
|
|
this.dialogVisible=true;
|
|
|
|
this.dialogStatus='create';
|
|
|
|
},
|
|
|
|
handleClose(done) {
|
|
|
|
this.$confirm('确认关闭？')
|
|
|
|
.then(_ => {
|
|
|
|
done();
|
|
|
|
})
|
|
|
|
.catch(_ => {});
|
|
|
|
},
|
|
|
|
handleClick(row) {
|
|
|
|
this.dialogVisible=true;
|
|
|
|
this.dialogStatus='update';
|
|
|
|
this.ruleForm=row;
|
|
|
|
},
|
|
|
|
deleteClick(row) {
|
|
|
|
this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
|
|
|
|
confirmButtonText: '确定删除',
|
|
|
|
cancelButtonText: '取消',
|
|
|
|
type: 'warning'
|
|
|
|
}
|
|
|
|
).then(() => {
|
|
|
|
delRate({id: row.id}).then((response) => {
|
|
|
|
const res = response.data
|
|
|
|
this.$message.success(res.msg)
|
|
|
|
this.getList();
|
|
|
|
}).catch(error => {
|
|
|
|
this.$message.error('删除配置，失败！')
|
|
|
|
})
|
|
|
|
}).catch(() => {
|
|
|
|
})
|
|
|
|
},
|
|
|
|
handleSizeChange(val) {
|
|
|
|
this.query.pageSize=val;
|
|
|
|
this.getList();
|
|
|
|
},
|
|
|
|
handleCurrentChange(val) {
|
|
|
|
this.query.pageNum=val;
|
|
|
|
this.getList();
|
|
|
|
},
|
|
|
|
getList(){
|
|
|
|
selectRate(this.query).then((response) => {
|
|
|
|
const res = response.data
|
|
|
|
if (res.code !== '200') {
|
|
|
|
return this.$message.error('获取消息收发记录，失败！')
|
|
|
|
}
|
|
|
|
// 获取列表数据
|
|
|
|
this.tableData = res.data.list
|
|
|
|
// 获取列表的总记录数
|
|
|
|
this.total = res.data.total
|
|
|
|
this.$message.success('获取消息收发记录，成功！');
|
|
|
|
}).catch(error => {
|
|
|
|
// 关闭加载
|
|
|
|
this.$message.error(error.toString())
|
|
|
|
})
|
|
|
|
},
|
|
|
|
validateUppercaseInput() {
|
|
|
|
// 使用正则表达式来匹配非大写字母，并替换为空字符串
|
|
|
|
this.uppercaseInput = this.uppercaseInput.replace(/[^A-Z]/g, '');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script> |
...
|
...
|
|
