|
@@ -3,18 +3,18 @@
|
|
|
<div style="display: flex; justify-content: space-between">
|
|
<div style="display: flex; justify-content: space-between">
|
|
|
<div style="display: flex">
|
|
<div style="display: flex">
|
|
|
<el-input
|
|
<el-input
|
|
|
- placeholder="请输入货主名称/联系人/联系人手机号"
|
|
|
|
|
|
|
+ placeholder="请输入货主/港口名称"
|
|
|
prefix-icon="el-icon-search"
|
|
prefix-icon="el-icon-search"
|
|
|
v-model="term"
|
|
v-model="term"
|
|
|
clearable
|
|
clearable
|
|
|
style="width: 330px"
|
|
style="width: 330px"
|
|
|
></el-input>
|
|
></el-input>
|
|
|
- <div class="seach-btn" @click="getCargoOwnerCompanyList">查询</div>
|
|
|
|
|
|
|
+ <div class="seach-btn" @click="getTransPortsList">查询</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="cargo-owner-add" @click="dialogFormVisible = true">
|
|
<div class="cargo-owner-add" @click="dialogFormVisible = true">
|
|
|
- 添加货主公司
|
|
|
|
|
|
|
+ 添加航期
|
|
|
</div>
|
|
</div>
|
|
|
- <el-dialog title="添加货主公司" v-model="dialogFormVisible">
|
|
|
|
|
|
|
+ <el-dialog title="添加航期" v-model="dialogFormVisible">
|
|
|
<template v-slot:default>
|
|
<template v-slot:default>
|
|
|
<el-form
|
|
<el-form
|
|
|
:model="ruleForm"
|
|
:model="ruleForm"
|
|
@@ -23,22 +23,22 @@
|
|
|
label-width="110px"
|
|
label-width="110px"
|
|
|
label-position="left"
|
|
label-position="left"
|
|
|
>
|
|
>
|
|
|
- <el-form-item prop="companyName" label="货主公司名称">
|
|
|
|
|
|
|
+ <el-form-item prop="portName" label="港口名称">
|
|
|
<el-input
|
|
<el-input
|
|
|
style="width: 280px"
|
|
style="width: 280px"
|
|
|
- v-model="ruleForm.companyName"
|
|
|
|
|
|
|
+ v-model="ruleForm.portName"
|
|
|
></el-input>
|
|
></el-input>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
- <el-form-item prop="contactName" label="联系人">
|
|
|
|
|
|
|
+ <el-form-item prop="longitude" label="经度">
|
|
|
<el-input
|
|
<el-input
|
|
|
style="width: 280px"
|
|
style="width: 280px"
|
|
|
- v-model="ruleForm.contactName"
|
|
|
|
|
|
|
+ v-model="ruleForm.longitude"
|
|
|
></el-input>
|
|
></el-input>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
- <el-form-item prop="contactPhone" label="联系人手机号">
|
|
|
|
|
|
|
+ <el-form-item prop="latitude" label="纬度">
|
|
|
<el-input
|
|
<el-input
|
|
|
style="width: 280px"
|
|
style="width: 280px"
|
|
|
- v-model="ruleForm.contactPhone"
|
|
|
|
|
|
|
+ v-model="ruleForm.latitude"
|
|
|
></el-input>
|
|
></el-input>
|
|
|
</el-form-item>
|
|
</el-form-item>
|
|
|
</el-form>
|
|
</el-form>
|
|
@@ -46,7 +46,7 @@
|
|
|
<template v-slot:footer>
|
|
<template v-slot:footer>
|
|
|
<div class="dialog-footer">
|
|
<div class="dialog-footer">
|
|
|
<el-button @click="resetForm">取 消</el-button>
|
|
<el-button @click="resetForm">取 消</el-button>
|
|
|
- <el-button type="primary" @click="addCargoOwnerCompany(ruleForm)">
|
|
|
|
|
|
|
+ <el-button type="primary" @click="addtTransPort(ruleForm)">
|
|
|
确 定
|
|
确 定
|
|
|
</el-button>
|
|
</el-button>
|
|
|
</div>
|
|
</div>
|
|
@@ -62,26 +62,24 @@
|
|
|
align="center"
|
|
align="center"
|
|
|
></el-table-column>
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
<el-table-column
|
|
|
- prop="companyName"
|
|
|
|
|
- label="货主公司名称"
|
|
|
|
|
|
|
+ prop="portName"
|
|
|
|
|
+ label="港口名称"
|
|
|
min-width="120"
|
|
min-width="120"
|
|
|
align="center"
|
|
align="center"
|
|
|
></el-table-column>
|
|
></el-table-column>
|
|
|
<el-table-column
|
|
<el-table-column
|
|
|
- prop="contactName"
|
|
|
|
|
- label="联系人"
|
|
|
|
|
|
|
+ prop="longitude"
|
|
|
|
|
+ label="经纬度"
|
|
|
min-width="120"
|
|
min-width="120"
|
|
|
align="center"
|
|
align="center"
|
|
|
- ></el-table-column>
|
|
|
|
|
- <el-table-column
|
|
|
|
|
- prop="contactPhone"
|
|
|
|
|
- label="联系人手机号"
|
|
|
|
|
- min-width="160"
|
|
|
|
|
- align="center"
|
|
|
|
|
- ></el-table-column>
|
|
|
|
|
|
|
+ >
|
|
|
|
|
+ <template v-slot="scope">
|
|
|
|
|
+ {{ scope.row.longitude }}, {{ scope.row.latitude }}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
<el-table-column
|
|
<el-table-column
|
|
|
prop="createTime"
|
|
prop="createTime"
|
|
|
- label="入驻时间"
|
|
|
|
|
|
|
+ label="添加时间"
|
|
|
min-width="200"
|
|
min-width="200"
|
|
|
align="center"
|
|
align="center"
|
|
|
>
|
|
>
|
|
@@ -89,15 +87,16 @@
|
|
|
{{ subTimeStr(scope.row.createTime) }}
|
|
{{ subTimeStr(scope.row.createTime) }}
|
|
|
</template>
|
|
</template>
|
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
- <el-table-column label="操作" min-width="80" align="center">
|
|
|
|
|
|
|
+ <el-table-column label="启用/禁用" min-width="80" align="center">
|
|
|
<template v-slot="scope">
|
|
<template v-slot="scope">
|
|
|
- <el-button
|
|
|
|
|
- @click="cargoOwnerCompanyDetail(scope.row.id, tableData)"
|
|
|
|
|
- type="text"
|
|
|
|
|
- size="small"
|
|
|
|
|
- >
|
|
|
|
|
- 查看详情
|
|
|
|
|
- </el-button>
|
|
|
|
|
|
|
+ <el-switch
|
|
|
|
|
+ v-model="scope.row.status"
|
|
|
|
|
+ active-color="#13ce66"
|
|
|
|
|
+ :active-value="0"
|
|
|
|
|
+ :inactive-value="1"
|
|
|
|
|
+ inactive-color="#ff4949"
|
|
|
|
|
+ @change="changeSwitch($event, scope.row.id)"
|
|
|
|
|
+ />
|
|
|
</template>
|
|
</template>
|
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
</el-table>
|
|
</el-table>
|
|
@@ -128,23 +127,18 @@ let total = ref(0);
|
|
|
let dialogFormVisible = ref(false);
|
|
let dialogFormVisible = ref(false);
|
|
|
let form = ref(null);
|
|
let form = ref(null);
|
|
|
const ruleForm = ref({
|
|
const ruleForm = ref({
|
|
|
- companyName: "",
|
|
|
|
|
- contactName: "",
|
|
|
|
|
- contactPhone: "",
|
|
|
|
|
|
|
+ portName: "",
|
|
|
|
|
+ longitude: "",
|
|
|
|
|
+ latitude: "",
|
|
|
});
|
|
});
|
|
|
const rules = ref({
|
|
const rules = ref({
|
|
|
- companyName: [
|
|
|
|
|
- { required: true, message: "请填写货主公司名称", trigger: "blur" },
|
|
|
|
|
- ],
|
|
|
|
|
- contactName: [{ required: true, message: "请填写联系人", trigger: "blur" }],
|
|
|
|
|
- contactPhone: [
|
|
|
|
|
- { required: true, message: "请填写手机号", trigger: "blur" },
|
|
|
|
|
- { min: 11, max: 11, message: "请正确填写手机号", trigger: "blur" },
|
|
|
|
|
- ],
|
|
|
|
|
|
|
+ portName: [{ required: true, message: "请填写港口名称", trigger: "blur" }],
|
|
|
|
|
+ longitude: [{ required: true, message: "请填写港口经度", trigger: "blur" }],
|
|
|
|
|
+ latitude: [{ required: true, message: "请填写港口纬度", trigger: "blur" }],
|
|
|
});
|
|
});
|
|
|
-async function getCargoOwnerCompanyList() {
|
|
|
|
|
|
|
+async function getTransPortsList() {
|
|
|
tableData.value = [];
|
|
tableData.value = [];
|
|
|
- let res = await api.getCargoOwnerCompanyList({
|
|
|
|
|
|
|
+ let res = await api.getTransPortsList({
|
|
|
currentPage: currentPage.value,
|
|
currentPage: currentPage.value,
|
|
|
size: 10,
|
|
size: 10,
|
|
|
term: term.value,
|
|
term: term.value,
|
|
@@ -160,25 +154,25 @@ function resetForm() {
|
|
|
|
|
|
|
|
form.value.resetFields();
|
|
form.value.resetFields();
|
|
|
}
|
|
}
|
|
|
-async function addCargoOwnerCompany() {
|
|
|
|
|
|
|
+async function addtTransPort() {
|
|
|
form.value.validate(async (valid) => {
|
|
form.value.validate(async (valid) => {
|
|
|
if (valid) {
|
|
if (valid) {
|
|
|
- let { companyName, contactName, contactPhone } = ruleForm.value;
|
|
|
|
|
- let res = await api.addCargoOwnerCompany({
|
|
|
|
|
- companyName,
|
|
|
|
|
- contactName,
|
|
|
|
|
- contactPhone,
|
|
|
|
|
|
|
+ let { portName, longitude, latitude } = ruleForm.value;
|
|
|
|
|
+ let res = await api.addtTransPort({
|
|
|
|
|
+ portName,
|
|
|
|
|
+ longitude,
|
|
|
|
|
+ latitude,
|
|
|
});
|
|
});
|
|
|
console.log(res);
|
|
console.log(res);
|
|
|
if (res.data.status == 0) {
|
|
if (res.data.status == 0) {
|
|
|
ElNotification.success({
|
|
ElNotification.success({
|
|
|
title: "添加成功",
|
|
title: "添加成功",
|
|
|
- duration: 0,
|
|
|
|
|
- message: `${companyName}:${res.data.msg}`,
|
|
|
|
|
|
|
+ duration: 2000,
|
|
|
|
|
+ message: `${portName}:${res.data.msg}`,
|
|
|
type: "success",
|
|
type: "success",
|
|
|
});
|
|
});
|
|
|
resetForm();
|
|
resetForm();
|
|
|
- getCargoOwnerCompanyList();
|
|
|
|
|
|
|
+ getTransPortsList();
|
|
|
} else {
|
|
} else {
|
|
|
ElNotification.error({
|
|
ElNotification.error({
|
|
|
title: "失败",
|
|
title: "失败",
|
|
@@ -192,6 +186,20 @@ async function addCargoOwnerCompany() {
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+async function changeSwitch(status, portId) {
|
|
|
|
|
+ let res = await api.updatePortStatus({
|
|
|
|
|
+ status,
|
|
|
|
|
+ portId,
|
|
|
|
|
+ });
|
|
|
|
|
+ if (res.data.status == 0) {
|
|
|
|
|
+ ElNotification.success({
|
|
|
|
|
+ title: "成功",
|
|
|
|
|
+ duration: 2000,
|
|
|
|
|
+ message: res.data.msg,
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
async function cargoOwnerCompanyDetail(id) {
|
|
async function cargoOwnerCompanyDetail(id) {
|
|
|
router.push({
|
|
router.push({
|
|
|
path: "/cargoOwnerManage/cargoOwnerCompanyDetail",
|
|
path: "/cargoOwnerManage/cargoOwnerCompanyDetail",
|
|
@@ -202,10 +210,10 @@ async function cargoOwnerCompanyDetail(id) {
|
|
|
}
|
|
}
|
|
|
function pageChange(e) {
|
|
function pageChange(e) {
|
|
|
currentPage.value = e;
|
|
currentPage.value = e;
|
|
|
- getCargoOwnerCompanyList();
|
|
|
|
|
|
|
+ getTransPortsList();
|
|
|
}
|
|
}
|
|
|
onMounted(() => {
|
|
onMounted(() => {
|
|
|
- getCargoOwnerCompanyList();
|
|
|
|
|
|
|
+ getTransPortsList();
|
|
|
});
|
|
});
|
|
|
</script>
|
|
</script>
|
|
|
<style scoped>
|
|
<style scoped>
|