first
张同海
1 year ago
parent
6d9f6fa2ea
commit
a7de1cd841
@ -1,26 +1,31 @@
|
||||
<template>
|
||||
<img alt="Vue logo" src="./assets/logo.png">
|
||||
<HelloWorld msg="Welcome to Your Vue.js App"/>
|
||||
<div>
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import HelloWorld from './components/HelloWorld.vue'
|
||||
|
||||
// import { GetSASCCODE } from "./api/Index";
|
||||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
HelloWorld
|
||||
}
|
||||
}
|
||||
name: "App",
|
||||
components: {},
|
||||
methods: {
|
||||
// FnApi() {
|
||||
// GetSASCCODE().then((res) => {
|
||||
// console.log(res);
|
||||
// });
|
||||
// },
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#app {
|
||||
* {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
margin-top: 60px;
|
||||
/* font-size: 16px; */
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<h1 @click="FnClick">{{ name }}</h1>
|
||||
</template>
|
||||
<script>
|
||||
import { ref } from "vue";
|
||||
export default {
|
||||
name: "ViewAbout",
|
||||
setup(msg) {
|
||||
console.log(msg);
|
||||
const name = ref("About");
|
||||
const FnClick = () => {
|
||||
console.log(name.value);
|
||||
};
|
||||
return {
|
||||
name,
|
||||
FnClick,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<el-popover
|
||||
:visible="visible"
|
||||
placement="right"
|
||||
:width="600"
|
||||
trigger="click"
|
||||
@show="FnShow"
|
||||
ref="popoverRef"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="
|
||||
() => {
|
||||
visible = true;
|
||||
}
|
||||
"
|
||||
>{{ Text() }}</el-button
|
||||
>
|
||||
</template>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-input v-model="Name" placeholder="请输入名称"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-button @click="FnShow">查询</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-table ref="OpenTBTable" :data="gridData" height="300">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column property="title" label="代码" />
|
||||
<el-table-column property="name" label="名称" />
|
||||
<el-table-column property="addr" label="地址" />
|
||||
<el-table-column property="countryName" label="国家" />
|
||||
<el-table-column property="remark" label="备注" />
|
||||
<el-table-column property="tel" label="电话" />
|
||||
</el-table>
|
||||
<el-row>
|
||||
<el-col :span="6" :offset="18">
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
:style="{ marginTop: '10px' }"
|
||||
@click="SData"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="small"
|
||||
:style="{ marginTop: '10px' }"
|
||||
@click="
|
||||
() => {
|
||||
visible = false;
|
||||
}
|
||||
"
|
||||
>
|
||||
取消
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-popover>
|
||||
</template>
|
||||
<script>
|
||||
import { ref } from "vue";
|
||||
import { bookingTemplateList } from "@/api/Index";
|
||||
import { ElMessage } from "element-plus";
|
||||
export default {
|
||||
naem: "ViewOpenBT",
|
||||
props: ["type"],
|
||||
setup(props, ctx) {
|
||||
const popoverRef = ref("");
|
||||
const Type = ref(props.type);
|
||||
const Name = ref("");
|
||||
const gridData = ref([]);
|
||||
const OpenTBTable = ref();
|
||||
const visible = ref(false);
|
||||
const Text = () => {
|
||||
let RData = "";
|
||||
switch (Type.value) {
|
||||
case 10:
|
||||
RData = "常用收货人";
|
||||
break;
|
||||
case 20:
|
||||
RData = "常用发货人";
|
||||
break;
|
||||
case 30:
|
||||
RData = "常用通知人";
|
||||
break;
|
||||
default:
|
||||
RData = "常用第二通知人";
|
||||
break;
|
||||
}
|
||||
return RData;
|
||||
};
|
||||
const FnShow = () => {
|
||||
bookingTemplateList({
|
||||
type: Type.value,
|
||||
pageSize: 999,
|
||||
name: Name.value,
|
||||
}).then((res) => {
|
||||
gridData.value = res.data.list;
|
||||
console.log(res);
|
||||
});
|
||||
};
|
||||
const SData = () => {
|
||||
let SData = OpenTBTable.value.getSelectionRows();
|
||||
if (SData.length == 1) {
|
||||
ctx.emit("SelectData", { Data: SData, type: Type });
|
||||
visible.value = false;
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "请选择一条数据",
|
||||
type: "warning",
|
||||
});
|
||||
}
|
||||
};
|
||||
return {
|
||||
popoverRef,
|
||||
Type,
|
||||
Name,
|
||||
gridData,
|
||||
OpenTBTable,
|
||||
visible,
|
||||
Text,
|
||||
FnShow,
|
||||
SData,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -0,0 +1,238 @@
|
||||
<template>
|
||||
<div class="BookingMain">
|
||||
<SearchBox
|
||||
ref="SearchBox"
|
||||
:SearchData="SearchBoxData"
|
||||
@ClickSearch="ClickSearch"
|
||||
@SearchOpen="SearchOpen"
|
||||
/>
|
||||
|
||||
<TableBox
|
||||
ref="TableBoxRef"
|
||||
:TableData="TableData"
|
||||
:ListApi="ListApi"
|
||||
:SearchData="SearchData"
|
||||
:ButtonData="ButtonData"
|
||||
@ClickAdd="ClickAdd"
|
||||
@ClickDelete="ClickDelete"
|
||||
@ClickCopy="ClickCopy"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import SearchBox from "@/components/SearchBox.vue";
|
||||
import TableBox from "@/components/TableBox.vue";
|
||||
import { Plus } from "@element-plus/icons-vue";
|
||||
import { bookingCustomList, bookingCustomDelete } from "@/api/Index";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, reactive } from "vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { useStore } from "vuex";
|
||||
export default {
|
||||
name: "ViewBooking",
|
||||
components: {
|
||||
SearchBox,
|
||||
TableBox,
|
||||
},
|
||||
setup() {
|
||||
const store = useStore();
|
||||
const bizStatusList = [
|
||||
{ code: "0", name: "已录入" },
|
||||
{ code: "1", name: "已审核" },
|
||||
{ code: "3", name: "已提交" },
|
||||
{ code: "4", name: "已驳回" },
|
||||
];
|
||||
const SearchBoxData = reactive([
|
||||
{
|
||||
title: "订舱编号",
|
||||
EType: "Input",
|
||||
DName: "billNo",
|
||||
},
|
||||
{
|
||||
title: "业务状态",
|
||||
EType: "Select",
|
||||
DName: "bizStatus",
|
||||
SelectList: bizStatusList,
|
||||
},
|
||||
{
|
||||
title: "船公司",
|
||||
EType: "Select",
|
||||
DName: "carrierCode",
|
||||
SelectList: store.state.Data.Carrierlist,
|
||||
},
|
||||
{
|
||||
title: "开船日期",
|
||||
EType: "DatePicker",
|
||||
DName: "etdBegin",
|
||||
DName2: "etdEnd",
|
||||
},
|
||||
{
|
||||
title: "订舱日期",
|
||||
EType: "DatePicker",
|
||||
DName: "createTimeBegin",
|
||||
DName2: "createTimeEnd",
|
||||
},
|
||||
]);
|
||||
const TableData = reactive([
|
||||
{
|
||||
width: "55",
|
||||
type: "selection",
|
||||
},
|
||||
{
|
||||
label: "业务状态",
|
||||
prop: "bizStatus",
|
||||
width: "100",
|
||||
StateChange: [
|
||||
{
|
||||
code: "0",
|
||||
name: "已录入",
|
||||
},
|
||||
{
|
||||
code: "1",
|
||||
name: "已审核",
|
||||
},
|
||||
{
|
||||
code: "3",
|
||||
name: "已提交",
|
||||
},
|
||||
{
|
||||
code: "4",
|
||||
name: "已驳回",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ label: "订舱编号", prop: "billNo" },
|
||||
{ label: "船公司", prop: "carrier" },
|
||||
{ label: "箱型*箱量", prop: "containerTotalInfo" },
|
||||
{ label: "开船时间", prop: "etd" },
|
||||
{ label: "付费方式", prop: "paymentType" },
|
||||
{ label: "货物标识", prop: "cargoId" },
|
||||
{ label: "船名", prop: "vessel" },
|
||||
{ label: "航次", prop: "voyageNo" },
|
||||
{
|
||||
label: "操作",
|
||||
prop: "operate",
|
||||
operateData: [
|
||||
{
|
||||
name: "编辑",
|
||||
Fn: (e) => {
|
||||
router.push({
|
||||
path: "/AddBooking",
|
||||
query: {
|
||||
type: "Edit",
|
||||
id: e.id,
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "删除",
|
||||
Fn: (e) => {
|
||||
ClickDelete(e);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
const SearchData = {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
// ReportState: "0",
|
||||
// MBLNO: "",
|
||||
};
|
||||
const ButtonData = [
|
||||
{ text: "新建", type: "primary", icon: Plus, FnName: "ClickAdd" },
|
||||
{ text: "复制", type: "primary", plain: true, FnName: "ClickCopy" },
|
||||
{ text: "导入", type: "primary", plain: true },
|
||||
{ text: "模板", type: "primary", plain: true },
|
||||
{ text: "删除", type: "danger", FnName: "ClickDelete" },
|
||||
{ text: "发送订舱", type: "primary", plain: true },
|
||||
];
|
||||
const TableBoxRef = ref();
|
||||
const router = useRouter();
|
||||
const ClickAdd = () => {
|
||||
router.push({
|
||||
path: "/AddBooking",
|
||||
query: {
|
||||
type: "Add",
|
||||
},
|
||||
});
|
||||
console.log("新增");
|
||||
};
|
||||
|
||||
const ListApi = bookingCustomList;
|
||||
|
||||
const ClickSearch = (e) => {
|
||||
console.log(e.value);
|
||||
TableBoxRef.value.Search(e.value);
|
||||
};
|
||||
const SearchOpen = (e) => {
|
||||
TableBoxRef.value.height = e ? 450 : 562;
|
||||
};
|
||||
const ClickDelete = (e) => {
|
||||
if (e) {
|
||||
bookingCustomDelete({ id: e.id }).then((res) => {
|
||||
if (res.data == 200) {
|
||||
ClickSearch();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
let table = TableBoxRef.value.$refs.Table.getSelectionRows();
|
||||
if (table.length) {
|
||||
table.forEach((item) => {
|
||||
bookingCustomDelete({ id: item.id }).then((res) => {
|
||||
if (res.data == 200) {
|
||||
ClickSearch();
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "请至少选择一条数据",
|
||||
type: "warning",
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
const ClickCopy = () => {
|
||||
let table = TableBoxRef.value.$refs.Table.getSelectionRows();
|
||||
if (table.length == 1) {
|
||||
router.push({
|
||||
path: "/AddBooking",
|
||||
query: {
|
||||
type: "Copy",
|
||||
id: table[0].id,
|
||||
},
|
||||
});
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "请选择一条数据",
|
||||
type: "warning",
|
||||
});
|
||||
}
|
||||
};
|
||||
return {
|
||||
SearchBoxData,
|
||||
TableBoxRef,
|
||||
ClickSearch,
|
||||
SearchOpen,
|
||||
TableData,
|
||||
SearchData,
|
||||
ButtonData,
|
||||
ListApi,
|
||||
ClickAdd,
|
||||
ClickDelete,
|
||||
ClickCopy,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.BookingMain {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,19 @@
|
||||
let cargoIdData = [
|
||||
{
|
||||
name: "S 普通货",
|
||||
code: "S",
|
||||
},
|
||||
{
|
||||
name: "R 冻柜",
|
||||
code: "R",
|
||||
},
|
||||
{
|
||||
name: "D 危险品",
|
||||
code: "D",
|
||||
},
|
||||
{
|
||||
name: "O 超限箱",
|
||||
code: "O",
|
||||
},
|
||||
];
|
||||
export { cargoIdData };
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,19 @@
|
||||
let cargoIdData = [
|
||||
{
|
||||
name: "S 普通货",
|
||||
code: "S",
|
||||
},
|
||||
{
|
||||
name: "R 冻柜",
|
||||
code: "R",
|
||||
},
|
||||
{
|
||||
name: "D 危险品",
|
||||
code: "D",
|
||||
},
|
||||
{
|
||||
name: "O 超限箱",
|
||||
code: "O",
|
||||
},
|
||||
];
|
||||
export { cargoIdData };
|
||||
@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<div class="BookingMain">
|
||||
<SearchBox
|
||||
ref="SearchBox"
|
||||
:SearchData="SearchBoxData"
|
||||
@ClickSearch="ClickSearch"
|
||||
@SearchOpen="SearchOpen"
|
||||
/>
|
||||
|
||||
<TableBox
|
||||
ref="TableBoxRef"
|
||||
:TableData="TableData"
|
||||
:ListApi="ListApi"
|
||||
:SearchData="SearchData"
|
||||
:ButtonData="ButtonData"
|
||||
@ClickAdd="ClickAdd"
|
||||
@ClickDelete="ClickDelete"
|
||||
/>
|
||||
<el-dialog
|
||||
v-model="dialogFormVisible"
|
||||
title="新建收发通模板"
|
||||
:before-close="dialogF"
|
||||
>
|
||||
<el-form :model="DialogForm" :label-width="100">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="类型">
|
||||
<!-- <el-input v-model="DialogForm.type" /> -->
|
||||
<el-select v-model="DialogForm.type" multiple>
|
||||
<el-option
|
||||
v-for="item in TypeData"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="代码">
|
||||
<el-input v-model="DialogForm.title" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="DialogForm.name" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="电话">
|
||||
<el-input v-model="DialogForm.tel" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="国家">
|
||||
<el-input v-model="DialogForm.countryName" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="地址">
|
||||
<el-input v-model="DialogForm.addr" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="备注">
|
||||
<el-input v-model="DialogForm.remark" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="模板内容">
|
||||
<el-input
|
||||
v-model="DialogForm.content"
|
||||
:autosize="{ minRows: 2, maxRows: 4 }"
|
||||
type="textarea"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogF">取消</el-button>
|
||||
<el-button type="primary" @click="dialogS"> 保存 </el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import SearchBox from "@/components/SearchBox.vue";
|
||||
import TableBox from "@/components/TableBox.vue";
|
||||
import { Plus } from "@element-plus/icons-vue";
|
||||
import {
|
||||
bookingTemplateList,
|
||||
bookingTemplateSave,
|
||||
bookingTemplateDelete,
|
||||
} from "@/api/Index";
|
||||
import { ref, reactive } from "vue";
|
||||
export default {
|
||||
name: "ViewBooking",
|
||||
components: {
|
||||
SearchBox,
|
||||
TableBox,
|
||||
},
|
||||
setup() {
|
||||
const dialogFormVisible = ref(false);
|
||||
const DialogForm = ref({});
|
||||
const TypeData = [
|
||||
{
|
||||
code: "10",
|
||||
name: "收货人",
|
||||
},
|
||||
{
|
||||
code: "20",
|
||||
name: "发货人",
|
||||
},
|
||||
{
|
||||
code: "30",
|
||||
name: "通知人",
|
||||
},
|
||||
{
|
||||
code: "40",
|
||||
name: "第二通知人",
|
||||
},
|
||||
];
|
||||
|
||||
const SearchBoxData = reactive([
|
||||
{
|
||||
title: "类型",
|
||||
EType: "Select",
|
||||
DName: "type",
|
||||
SelectList: TypeData,
|
||||
},
|
||||
{
|
||||
title: "代码",
|
||||
EType: "Input",
|
||||
DName: "title",
|
||||
},
|
||||
{
|
||||
title: "名称",
|
||||
EType: "Input",
|
||||
DName: "name",
|
||||
},
|
||||
{
|
||||
title: "地址",
|
||||
EType: "Input",
|
||||
DName: "addr",
|
||||
},
|
||||
{
|
||||
title: "模板内容",
|
||||
EType: "Input",
|
||||
DName: "content",
|
||||
},
|
||||
]);
|
||||
const ClickAdd = () => {
|
||||
dialogFormVisible.value = true;
|
||||
};
|
||||
const ClickEdit = (e) => {
|
||||
dialogFormVisible.value = true;
|
||||
let R = [];
|
||||
|
||||
e.type.split("[").forEach((a) => {
|
||||
if (a) {
|
||||
a.split("]").forEach((b) => {
|
||||
if (b) {
|
||||
R.push(b);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return { ...e, type: R };
|
||||
};
|
||||
const TableData = reactive([
|
||||
{
|
||||
label: "类型",
|
||||
prop: "type",
|
||||
StateType: "multiple",
|
||||
StateChange: TypeData,
|
||||
},
|
||||
{ label: "代码", prop: "title" },
|
||||
{ label: "名称", prop: "name" },
|
||||
{ label: "地址", prop: "addr" },
|
||||
{ label: "国家", prop: "countryName" },
|
||||
{ label: "备注", prop: "remark" },
|
||||
{ label: "电话", prop: "tel" },
|
||||
{
|
||||
label: "操作",
|
||||
prop: "operate",
|
||||
operateData: [
|
||||
{
|
||||
name: "编辑",
|
||||
Fn: (e) => {
|
||||
DialogForm.value = ClickEdit(e);
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "删除",
|
||||
Fn: (e) => {
|
||||
ClickDelete(e);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
const SearchData = {
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0,
|
||||
// ReportState: "0",
|
||||
// MBLNO: "",
|
||||
};
|
||||
const ButtonData = [
|
||||
{ text: "新建", type: "primary", icon: Plus, FnName: "ClickAdd" },
|
||||
];
|
||||
const TableBoxRef = ref();
|
||||
const ListApi = bookingTemplateList;
|
||||
const ClickSearch = (e = {}) => {
|
||||
console.log(e.value);
|
||||
TableBoxRef.value.Search(e.value);
|
||||
};
|
||||
const SearchOpen = (e) => {
|
||||
TableBoxRef.value.height = e ? 450 : 562;
|
||||
};
|
||||
const ClickDelete = (e) => {
|
||||
bookingTemplateDelete({ id: e.id }).then((res) => {
|
||||
if (res.code == 200) {
|
||||
ClickSearch();
|
||||
}
|
||||
});
|
||||
};
|
||||
const dialogF = () => {
|
||||
dialogFormVisible.value = false;
|
||||
DialogForm.value = {};
|
||||
};
|
||||
const dialogS = () => {
|
||||
let type = "";
|
||||
console.log(DialogForm.value);
|
||||
DialogForm.value.type.forEach((item) => {
|
||||
if (type) {
|
||||
type = `${type}[${item}]`;
|
||||
} else {
|
||||
type = `[${item}]`;
|
||||
}
|
||||
});
|
||||
let ApiData = { ...DialogForm.value, type };
|
||||
bookingTemplateSave(ApiData).then((res) => {
|
||||
if (res.code == 200) {
|
||||
dialogF();
|
||||
ClickSearch();
|
||||
}
|
||||
});
|
||||
};
|
||||
return {
|
||||
TypeData,
|
||||
DialogForm,
|
||||
dialogFormVisible,
|
||||
SearchBoxData,
|
||||
TableBoxRef,
|
||||
ClickSearch,
|
||||
SearchOpen,
|
||||
TableData,
|
||||
SearchData,
|
||||
ButtonData,
|
||||
ListApi,
|
||||
ClickAdd,
|
||||
ClickDelete,
|
||||
dialogF,
|
||||
dialogS,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.BookingMain {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,19 @@
|
||||
let cargoIdData = [
|
||||
{
|
||||
name: "S 普通货",
|
||||
code: "S",
|
||||
},
|
||||
{
|
||||
name: "R 冻柜",
|
||||
code: "R",
|
||||
},
|
||||
{
|
||||
name: "D 危险品",
|
||||
code: "D",
|
||||
},
|
||||
{
|
||||
name: "O 超限箱",
|
||||
code: "O",
|
||||
},
|
||||
];
|
||||
export { cargoIdData };
|
||||
@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<h1>Home</h1>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "ViewHome",
|
||||
setup() {},
|
||||
};
|
||||
</script>
|
||||
@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<div class="LoginMain">
|
||||
<div class="loginMBox">
|
||||
<div class="loginImgBox">
|
||||
<img class="loginImg" src="@/assets/login.png" alt="" />
|
||||
</div>
|
||||
<div class="loginBox">
|
||||
<div class="LoginRTitle">
|
||||
<img src="@/assets/logo.png" alt="" />
|
||||
<span>济舱海工作平台</span>
|
||||
</div>
|
||||
<div class="fromBox">
|
||||
<el-input
|
||||
class="CsUserNmaeI CsI"
|
||||
v-model="LoginData.account"
|
||||
size="large"
|
||||
placeholder="用户名"
|
||||
/>
|
||||
<el-input
|
||||
class="CsPasswordI CsI"
|
||||
type="password"
|
||||
v-model="LoginData.password"
|
||||
size="large"
|
||||
placeholder="密码"
|
||||
/>
|
||||
<el-button
|
||||
class="CsLoginB"
|
||||
size="large"
|
||||
type="primary"
|
||||
@click="Login"
|
||||
>
|
||||
登录
|
||||
</el-button>
|
||||
<el-button class="CsSignB" type="primary" link>注册用户</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <h1 @click="FnClick">{{ name }}</h1> -->
|
||||
</template>
|
||||
<script>
|
||||
import { UserLogin, UserGetLoginUser } from "@/api/Index";
|
||||
import { ref, reactive } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useStore } from "vuex";
|
||||
export default {
|
||||
name: "ViewLogin",
|
||||
setup(msg) {
|
||||
const router = useRouter();
|
||||
const store = useStore();
|
||||
const LoginData = reactive({
|
||||
account: "",
|
||||
password: "",
|
||||
});
|
||||
console.log(msg);
|
||||
const name = ref("Login");
|
||||
const FnClick = () => {
|
||||
console.log(name.value);
|
||||
};
|
||||
const Login = () => {
|
||||
UserLogin(LoginData).then((res) => {
|
||||
if (res.code == 200) {
|
||||
console.log(store, res);
|
||||
store.commit("XGetUser", {
|
||||
token: `Bearer ${res.data}`,
|
||||
// userInfo: res.data.userInfo,
|
||||
});
|
||||
UserGetLoginUser().then((res) => {
|
||||
console.log(res);
|
||||
if (res.code == 200) {
|
||||
store.commit("XGetUser", {
|
||||
userInfo: res.data,
|
||||
});
|
||||
router.push("/");
|
||||
store.dispatch("GetInitData");
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
return {
|
||||
name,
|
||||
FnClick,
|
||||
// -----------------
|
||||
LoginData,
|
||||
Login,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.LoginMain {
|
||||
height: 100vw;
|
||||
height: 100vh;
|
||||
background: #f0f3f9;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.loginMBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 1140px;
|
||||
height: 586px;
|
||||
padding: 70px 75px;
|
||||
box-sizing: border-box;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.1);
|
||||
border-radius: 30px;
|
||||
.loginImgBox {
|
||||
flex: 1;
|
||||
.loginImg {
|
||||
width: 425px;
|
||||
height: 385px;
|
||||
}
|
||||
}
|
||||
.loginBox {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.LoginRTitle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 55px;
|
||||
img {
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
}
|
||||
span {
|
||||
display: inline-block;
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
margin-left: 26px;
|
||||
font-family: PingFangSC-Regular !important;
|
||||
font-size: 35px !important;
|
||||
color: #0486fe;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
.fromBox {
|
||||
width: 240px;
|
||||
.CsI {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.CsLoginB {
|
||||
width: 100%;
|
||||
margin-bottom: 21px;
|
||||
}
|
||||
.CsSignB {
|
||||
margin-left: 180px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,261 @@
|
||||
import request from "@/utils/axios";
|
||||
// 用户登录
|
||||
const UserLogin = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/user/login",
|
||||
method: "post",
|
||||
data,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 用户信息
|
||||
const UserGetLoginUser = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/user/getLoginUser",
|
||||
method: "get",
|
||||
data,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 获取客户订单列表
|
||||
const bookingCustomList = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingCustom/list",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 保存客户订单
|
||||
const bookingCustomSave = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingCustom/save",
|
||||
method: "post",
|
||||
data,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 查询客户订单详情
|
||||
const bookingCustomInfo = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingCustom/info",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 上传文件/图片
|
||||
const Uploader = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingaip/file/Uploader/annexpic",
|
||||
method: "post",
|
||||
data,
|
||||
headers: {
|
||||
Authorization: localStorage.getItem("token"),
|
||||
"Content-Type": "multipart/form-data",
|
||||
},
|
||||
},
|
||||
});
|
||||
};
|
||||
// 删除客户订单
|
||||
const bookingCustomDelete = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingCustom/delete",
|
||||
method: "post",
|
||||
data,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 获取收发通模板列表
|
||||
const bookingTemplateList = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingTemplate/list",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 保存
|
||||
const bookingTemplateSave = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingTemplate/save",
|
||||
method: "post",
|
||||
data,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 删除
|
||||
const bookingTemplateDelete = (data) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingTemplate/delete",
|
||||
method: "post",
|
||||
data,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
// 查询订单详情
|
||||
const bookingOrderInfo = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingOrder/info",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 获取订舱台账列表
|
||||
const bookingOrderList = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/bookingOrder/list",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
// 船公司信息
|
||||
const GetCarrierlist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/carrierlist",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 箱型信息
|
||||
const GetCtnlist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/ctn",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 起始港信息
|
||||
const Getportloadlist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/portloadlist",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 目的港信息
|
||||
const Getportlist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/portlist",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 运输条款信息
|
||||
const Getservicelist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/service",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 付费方式信息
|
||||
const Getfrtlist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/frt",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 船名列表信息
|
||||
const Getvessellist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/vessellist",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 获取包装信息
|
||||
const Getpackagelist = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/commondb/package",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
// 获取客户订单服务列表
|
||||
const cobServiceItemTenantList = (params) => {
|
||||
return request({
|
||||
data: {
|
||||
url: "/api/bookingAip/cobServiceItemTenant/list",
|
||||
method: "get",
|
||||
params,
|
||||
// headers: { Authorization: localStorage.getItem("token") },
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export {
|
||||
UserLogin,
|
||||
UserGetLoginUser,
|
||||
bookingCustomList,
|
||||
bookingCustomSave,
|
||||
bookingCustomInfo,
|
||||
Uploader,
|
||||
bookingCustomDelete,
|
||||
bookingTemplateList,
|
||||
bookingTemplateSave,
|
||||
bookingTemplateDelete,
|
||||
bookingOrderInfo,
|
||||
bookingOrderList,
|
||||
GetCarrierlist,
|
||||
GetCtnlist,
|
||||
Getportloadlist,
|
||||
Getportlist,
|
||||
Getservicelist,
|
||||
Getfrtlist,
|
||||
Getvessellist,
|
||||
Getpackagelist,
|
||||
cobServiceItemTenantList,
|
||||
};
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 10 KiB |
@ -0,0 +1,183 @@
|
||||
<template>
|
||||
<div class="SearchBOXMain">
|
||||
<el-row>
|
||||
<el-col class="SearchFirst">
|
||||
<div class="SearchFirstL">
|
||||
<p @click="Open">
|
||||
<el-icon v-if="OpenType"><ArrowUp /></el-icon>
|
||||
<el-icon v-else><ArrowDown /></el-icon>
|
||||
订单查询
|
||||
</p>
|
||||
<!-- <p>
|
||||
<el-icon><Setting /></el-icon>设置查询面板
|
||||
</p> -->
|
||||
</div>
|
||||
<div>
|
||||
<el-button @click="Reset">重置</el-button>
|
||||
<el-button type="primary" @click="Search">查询</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col class="SearchSecond" v-if="OpenType">
|
||||
<el-row>
|
||||
<el-col
|
||||
:span="6"
|
||||
class="SearchSecondUnit"
|
||||
v-for="item in search_data"
|
||||
:key="item.DName"
|
||||
>
|
||||
<span> {{ item.title }} </span>
|
||||
<el-input
|
||||
v-if="item.EType == 'Input'"
|
||||
class="ECs"
|
||||
v-model="Data[item.DName]"
|
||||
:placeholder="`请输入${item.title}`"
|
||||
/>
|
||||
<el-select
|
||||
v-else-if="item.EType == 'Select'"
|
||||
class="ECs"
|
||||
v-model="Data[item.DName]"
|
||||
:placeholder="`请选择${item.title}`"
|
||||
size="large"
|
||||
>
|
||||
<el-option
|
||||
v-for="e in item.SelectList"
|
||||
:key="e.code"
|
||||
:label="e.name"
|
||||
:value="e.code"
|
||||
/>
|
||||
</el-select>
|
||||
<el-row class="ECs" v-else-if="item.EType == 'DatePicker'">
|
||||
<el-col :span="11">
|
||||
<el-date-picker
|
||||
v-model="Data[item.DName]"
|
||||
size="large"
|
||||
type="date"
|
||||
:style="{ width: '100%' }"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="2"> <p class="CsHeng">-</p></el-col>
|
||||
<el-col :span="11">
|
||||
<el-date-picker
|
||||
v-model="Data[item.DName2]"
|
||||
size="large"
|
||||
type="date"
|
||||
:style="{ width: '100%' }"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { ref, reactive } from "@vue/reactivity";
|
||||
export default {
|
||||
name: "SearchBox",
|
||||
props: ["SearchData"],
|
||||
setup(props, ctx) {
|
||||
const search_data = reactive(props.SearchData);
|
||||
console.log(search_data);
|
||||
const Data = ref({});
|
||||
const OpenType = ref(false);
|
||||
const Open = () => {
|
||||
OpenType.value = !OpenType.value;
|
||||
ctx.emit("SearchOpen", OpenType.value);
|
||||
};
|
||||
const Search = () => {
|
||||
ctx.emit("ClickSearch", Data);
|
||||
};
|
||||
const Reset = () => {
|
||||
Data.value = {};
|
||||
};
|
||||
return {
|
||||
Open,
|
||||
OpenType,
|
||||
search_data,
|
||||
Data,
|
||||
Search,
|
||||
Reset,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.SearchBOXMain {
|
||||
background: #ffffff;
|
||||
border: 1px solid #eaf0f7;
|
||||
box-shadow: 0 5px 10px -10px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 10px;
|
||||
padding: 20px 30px;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 12px;
|
||||
.SearchFirst {
|
||||
display: flex;
|
||||
|
||||
justify-content: space-between;
|
||||
.SearchFirstL {
|
||||
display: flex;
|
||||
|
||||
p {
|
||||
cursor: pointer;
|
||||
&:nth-child(1) {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.88);
|
||||
line-height: 28px;
|
||||
font-weight: 500;
|
||||
.el-icon {
|
||||
color: #107ff2;
|
||||
margin-right: 11px;
|
||||
font-weight: bolder;
|
||||
}
|
||||
}
|
||||
&:nth-child(2) {
|
||||
margin-left: 15px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 14px;
|
||||
color: #1989fa;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
line-height: 28px;
|
||||
.el-icon {
|
||||
color: #1989fa;
|
||||
margin-right: 8px;
|
||||
font-weight: bolder;
|
||||
font-size: 14px;
|
||||
line-height: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.SearchSecond {
|
||||
.SearchSecondUnit {
|
||||
display: flex;
|
||||
margin: 8px 0;
|
||||
span {
|
||||
width: 100px;
|
||||
margin-right: 12px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 16px;
|
||||
color: #000000;
|
||||
letter-spacing: 0;
|
||||
text-align: right;
|
||||
line-height: 36px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.CsHeng {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
.ECs {
|
||||
width: 325px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<div class="TableBoxMain">
|
||||
<div class="TableButtonBox">
|
||||
<div>
|
||||
<el-button
|
||||
v-for="item in button_data"
|
||||
:key="item.text"
|
||||
:type="item.type"
|
||||
:icon="item.icon"
|
||||
:plain="item.plain"
|
||||
@click="ClickButton(item.FnName)"
|
||||
>
|
||||
{{ item.text }}
|
||||
</el-button>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="primary" link>
|
||||
<el-icon><RefreshRight /></el-icon> 刷新
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-table
|
||||
:data="TData"
|
||||
style="width: 100%"
|
||||
:height="height"
|
||||
v-loading="loading"
|
||||
ref="Table"
|
||||
>
|
||||
<el-table-column
|
||||
v-for="item in table_data"
|
||||
:key="item.prop"
|
||||
:prop="item.prop"
|
||||
:label="item.label"
|
||||
align="center"
|
||||
:width="item.width"
|
||||
:type="item.type"
|
||||
>
|
||||
<template #default="scope" v-if="item.type != 'selection'">
|
||||
<span v-if="item.StateChange">{{
|
||||
RData(scope.row[item.prop], item)
|
||||
}}</span>
|
||||
<span v-else-if="item.prop == 'operate'">
|
||||
<el-button
|
||||
v-for="button in item.operateData"
|
||||
:key="button.name"
|
||||
:type="button.type ? button.type : 'primary'"
|
||||
text
|
||||
@click="ClickOperateButton(button, scope.row)"
|
||||
>
|
||||
{{ button.name }}
|
||||
</el-button>
|
||||
</span>
|
||||
<span v-else>{{ scope.row[item.prop] }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
background
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="search_data.currentPage"
|
||||
:page-size="search_data.pageSize"
|
||||
layout="total, prev, pager, next"
|
||||
:total="search_data.total"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { ref, reactive } from "@vue/reactivity";
|
||||
|
||||
export default {
|
||||
name: "TableBox",
|
||||
props: ["TableData", "SearchData", "ButtonData", "ListApi"],
|
||||
setup(props, ctx) {
|
||||
const height = ref(562);
|
||||
const table_data = reactive(props.TableData);
|
||||
const search_data = reactive(props.SearchData);
|
||||
const button_data = reactive(props.ButtonData);
|
||||
const TData = ref([]);
|
||||
const loading = ref(false);
|
||||
const Search = (data) => {
|
||||
let ApiData = { ...search_data, ...data };
|
||||
console.log("查询", data);
|
||||
TData.value = [];
|
||||
loading.value = true;
|
||||
props.ListApi(ApiData).then((res) => {
|
||||
if (res.code == 200) {
|
||||
TData.value = res.data.list;
|
||||
search_data.total = res.data.pagination.total;
|
||||
loading.value = false;
|
||||
}
|
||||
});
|
||||
};
|
||||
Search();
|
||||
const handleCurrentChange = (val) => {
|
||||
search_data.currentPage = val;
|
||||
Search();
|
||||
};
|
||||
const ClickButton = (FnName) => {
|
||||
ctx.emit(FnName);
|
||||
};
|
||||
const RData = (data, item) => {
|
||||
let R = "-";
|
||||
if (item.StateType == "multiple") {
|
||||
R = "";
|
||||
data.split("[").forEach((a) => {
|
||||
if (a) {
|
||||
a.split("]").forEach((b) => {
|
||||
if (b) {
|
||||
item.StateChange.forEach((el) => {
|
||||
if (b == el.code) {
|
||||
R = R ? `${R},${el.name}` : el.name;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
item.StateChange.forEach((el) => {
|
||||
if (data == el.code) {
|
||||
R = el.name;
|
||||
}
|
||||
});
|
||||
}
|
||||
return R;
|
||||
};
|
||||
const ClickOperateButton = (data, e) => {
|
||||
data.Fn(e);
|
||||
};
|
||||
return {
|
||||
Search,
|
||||
table_data,
|
||||
search_data,
|
||||
button_data,
|
||||
TData,
|
||||
loading,
|
||||
handleCurrentChange,
|
||||
height,
|
||||
ClickButton,
|
||||
RData,
|
||||
ClickOperateButton,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.TableBoxMain {
|
||||
flex: 1;
|
||||
background: #ffffff;
|
||||
border: 1px solid #eaf0f7;
|
||||
box-shadow: 0 5px 10px -10px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 10px;
|
||||
padding: 20px 30px;
|
||||
box-sizing: border-box;
|
||||
// overflow: auto;
|
||||
.TableButtonBox {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
div {
|
||||
&:first-child {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.pagination {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 1rem;
|
||||
margin-right: 2rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,4 +1,35 @@
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
createApp(App).mount('#app')
|
||||
import { createApp } from "vue";
|
||||
import App from "./App.vue";
|
||||
import router from "./router";
|
||||
import store from "./store";
|
||||
import ElementUI, { ElMessage } from "element-plus";
|
||||
import * as ElementPlusIconsVue from "@element-plus/icons-vue";
|
||||
import zhCn from "element-plus/dist/locale/zh-cn.mjs";
|
||||
import "element-plus/dist/index.css";
|
||||
import axios from "axios";
|
||||
router.beforeEach((to, from, next) => {
|
||||
if (!store.state.User.token) {
|
||||
if (to.path == "/login") {
|
||||
next();
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "登录信息过期,请重新登录！",
|
||||
type: "warning",
|
||||
});
|
||||
next("/login");
|
||||
}
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
});
|
||||
const app = createApp(App);
|
||||
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
||||
app.component(key, component);
|
||||
}
|
||||
app.config.globalProperties.$axios = axios;
|
||||
app.use(ElementUI, {
|
||||
locale: zhCn,
|
||||
});
|
||||
app.use(store);
|
||||
app.use(router);
|
||||
app.mount("#app");
|
||||
|
||||
@ -0,0 +1,27 @@
|
||||
import { createRouter, createWebHistory } from "vue-router";
|
||||
import WebC from "../Views/WebC";
|
||||
import Login from "../Views/Login";
|
||||
import Booking from "../Views/Booking";
|
||||
import AddBooking from "../Views/Booking/AddBooking.vue";
|
||||
import BookingTemplate from "../Views/BookingTemplate";
|
||||
import BookingOrder from "../Views/BookingOrder";
|
||||
import About from "../Views/About.vue";
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(),
|
||||
routes: [
|
||||
{
|
||||
path: "/",
|
||||
component: WebC,
|
||||
children: [
|
||||
{ path: "/about", component: About },
|
||||
{ path: "/booking", component: Booking },
|
||||
{ path: "/AddBooking", component: AddBooking },
|
||||
{ path: "/BookingTemplate", component: BookingTemplate },
|
||||
{ path: "/BookingOrder", component: BookingOrder },
|
||||
],
|
||||
},
|
||||
{ path: "/login", component: Login },
|
||||
],
|
||||
});
|
||||
export default router;
|
||||
@ -0,0 +1,93 @@
|
||||
import { createStore } from "vuex";
|
||||
import {
|
||||
GetCarrierlist,
|
||||
GetCtnlist,
|
||||
Getportloadlist,
|
||||
Getportlist,
|
||||
Getservicelist,
|
||||
Getfrtlist,
|
||||
Getvessellist,
|
||||
Getpackagelist,
|
||||
cobServiceItemTenantList,
|
||||
} from "@/api/Index";
|
||||
export default createStore({
|
||||
state: {
|
||||
User: {
|
||||
token: "",
|
||||
userInfo: {},
|
||||
},
|
||||
Data: {},
|
||||
},
|
||||
mutations: {
|
||||
XGetUser(state, payload) {
|
||||
state.User = { ...state.User, ...payload };
|
||||
},
|
||||
XGetData(state, payload) {
|
||||
state.Data = { ...state.Data, ...payload };
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
GetInitData(store) {
|
||||
console.log("GetInitData");
|
||||
GetCarrierlist().then((res) => {
|
||||
let RData = [];
|
||||
res.data.forEach((item) => {
|
||||
item.name = item.cnName;
|
||||
RData.push(item);
|
||||
});
|
||||
store.commit("XGetData", { Carrierlist: RData });
|
||||
});
|
||||
GetCtnlist().then((res) => {
|
||||
let RData = [];
|
||||
res.data.forEach((item) => {
|
||||
item.name = item.code;
|
||||
RData.push(item);
|
||||
});
|
||||
store.commit("XGetData", { Ctnlist: RData });
|
||||
});
|
||||
Getportloadlist().then((res) => {
|
||||
let RData = [];
|
||||
res.data.forEach((item) => {
|
||||
item.name = item.cnName;
|
||||
RData.push(item);
|
||||
});
|
||||
store.commit("XGetData", { portloadlist: RData });
|
||||
});
|
||||
Getportlist().then((res) => {
|
||||
let RData = [];
|
||||
res.data.forEach((item) => {
|
||||
item.name = item.cnName;
|
||||
RData.push(item);
|
||||
});
|
||||
store.commit("XGetData", { portlist: RData });
|
||||
});
|
||||
Getservicelist().then((res) => {
|
||||
let RData = [];
|
||||
res.data.forEach((item) => {
|
||||
item.name = item.cnName;
|
||||
RData.push(item);
|
||||
});
|
||||
store.commit("XGetData", { servicelist: RData });
|
||||
});
|
||||
Getfrtlist().then((res) => {
|
||||
let RData = [];
|
||||
res.data.forEach((item) => {
|
||||
item.name = item.cnName;
|
||||
RData.push(item);
|
||||
});
|
||||
store.commit("XGetData", { frtlist: RData });
|
||||
});
|
||||
Getvessellist().then((res) => {
|
||||
store.commit("XGetData", { vessellist: res.data });
|
||||
});
|
||||
Getpackagelist().then((res) => {
|
||||
store.commit("XGetData", { packagelist: res.data });
|
||||
});
|
||||
cobServiceItemTenantList().then((res) => {
|
||||
console.log("cobServiceItemTenantList", res);
|
||||
store.commit("XGetData", { cobServiceItemTenantList: res.data });
|
||||
});
|
||||
},
|
||||
},
|
||||
modules: {},
|
||||
});
|
||||
@ -0,0 +1,56 @@
|
||||
import axios from "axios";
|
||||
import { ElMessage } from "element-plus";
|
||||
import router from "../router";
|
||||
import store from "@/store";
|
||||
export default ({ data }) => {
|
||||
let baseURL = "";
|
||||
// let baseURL = "";
|
||||
// if (data.url == "/user/login") {
|
||||
// // baseURL = "http://60.209.125.238:35101"; //测试
|
||||
// baseURL = "http://djy-identity.myshipping.net"; //正式
|
||||
// } else {
|
||||
// baseURL = process.env.VUE_APP_AXIOS_BASEURL;
|
||||
// }
|
||||
const server = axios.create({
|
||||
baseURL,
|
||||
timeout: 60000,
|
||||
headers: { Authorization: store.state.User.token },
|
||||
});
|
||||
server.interceptors.request.use(
|
||||
function (config) {
|
||||
return config;
|
||||
},
|
||||
function (error) {
|
||||
// Do something with request error
|
||||
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
server.interceptors.response.use(
|
||||
(req) => {
|
||||
if (req.data.code !== 200) {
|
||||
if (req.data.code == 602) {
|
||||
store.commit("XGetUser", {
|
||||
token: "",
|
||||
userInfo: {},
|
||||
});
|
||||
ElMessage({
|
||||
message: "登录信息过期,请重新登录！",
|
||||
type: "warning",
|
||||
});
|
||||
router.push("/login");
|
||||
} else {
|
||||
ElMessage({
|
||||
message: req.data.message,
|
||||
type: "warning",
|
||||
});
|
||||
}
|
||||
}
|
||||
return req.data;
|
||||
},
|
||||
(err) => {
|
||||
return err;
|
||||
}
|
||||
);
|
||||
return server(data);
|
||||
};
|
||||
Loading…
Reference in New Issue