Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/americanCont...

gongjinbao

2025-01-08 497583fe37d894095ea03b2ee87d43468b8eed6c

Merge branch 'main' of http://120.76.84.145:10101/gitblit/r/H5/americanContainer

 src/component/AddedInformation.vue

New file
@@ -0,0 +1,159 @@
<template>
    <div>
        <el-dialog :visible.sync="show" :show-close="false" width="1541px" @close="$emit('close')"
            :modal-append-to-body="false">
            <div class="txt-center pt--31">
                <div class="fs--18 mb--34 font-bold">请选择</div>
                <div class="mx--31">
                    <el-table ref="singleTable" highlight-current-row @row-dblclick="rowClick2"
                        @current-change="handleCurrentChange" :data="tableData" style="width: 100%" border
                        :header-cell-style="{ background: '#F6F6F7', 'font-size': '16px', color: '#3B3F56' }">
                        <el-table-column label="选择" align="center">
                            <template slot-scope="scope">
                                <el-radio class="radio" :label="scope.row" v-model="currentRow">{{ "" }}</el-radio>
                            </template>
                        </el-table-column>
                        <el-table-column prop="receiverName" label="姓名" align="center">
                        </el-table-column>
                        <el-table-column prop="receiverPhone" label="手机号" align="center">
                        </el-table-column>
                        <el-table-column prop="receiverEmail" label="邮箱" align="center">
                        </el-table-column>
                        <el-table-column prop="receiverAddress" label="地址" align="center">
                        </el-table-column>
                        <el-table-column prop="remark" label="备注" align="center">
                        </el-table-column>
                    </el-table>
                </div>
                <div class="btns">
                    <el-button @click="$emit('close')">关闭</el-button>
                    <el-button @click="submit" type="primary">确认</el-button>
                </div>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { getMsg } from '@/view/service'
export default {
    components: {},
    props: {
        show: {
            type: Boolean,
            default: false
        },
        row: {

        }
    },
    data() {
        return {
            tableData: [],
            currentRow: null
        };
    },
    computed: {},
    watch: {},
    created() {
        getMsg({ extra: localStorage.getItem('extra') }).then(res => {
            this.tableData = res.data
        })
    },
    mounted() { },
    methods: {
        submit() {
            if (!this.currentRow) {
                this.$message({
                    message: '请选择信息',
                    type: 'warning'
                });
                return
            }
            this.$emit('submit', this.currentRow)
        },
        // 设置选中行
        setCurrent(row) {
            this.$refs.singleTable.setCurrentRow(row);
        },
        // 点击单选
        handleCurrentChange(row) {
            this.currentRow = row;
        },
        // 点击行
        rowClick2(row, column, event) {
            if (this.currentRow && row.id == this.currentRow.id) {
                this.setCurrent();
                this.currentRow = null;
            } else {
                this.currentRow = row;
            }
        },
    },
};
</script>
<style scoped lang="less">
.btns {
    display: flex;
    justify-content: center;
    margin-top: 39px;
    padding-bottom: 31px;

    .el-button {
        width: 190px;
        height: 50px;
        font-size: 20px;

    }

    .el-button--primary {
        background-color: #014099;
        border-color: #014099;
    }
}

::v-deep .el-dialog {
    border-radius: 8px;

    .el-dialog__header {
        display: none !important;
    }

    .el-dialog__body {
        padding: 0 !important;

    }
}

::v-deep .el-radio__label {
    display: none;
}

::v-deep .el-radio__inner::after {
    display: none;
}

::v-deep .el-radio__inner {
    width: 24px !important;
    height: 24px !important;
    box-sizing: border-box;
}

::v-deep .el-radio__input.is-checked {
    padding: 4px 4px 3px 4px;
    border: 1px solid #014099;
    border-radius: 50%;
    box-sizing: border-box;
}

::v-deep .el-radio__input.is-checked .el-radio__inner {
    width: 13px !important;
    height: 13px !important;
    border: unset;
    background: rgba(1, 64, 153, 1) !important;
}

::v-deep .el-radio {
    height: 25px !important;
}
</style>

 src/component/Header.vue

@@ -1,24 +1,27 @@
<template>
    <div class="header_content">
        <div class="color1 fs--24 font-bold">{{ userInfo.companyName }}</div>
        <div class="flex a-center j-between">
            <div @click="userInfoShow = true" class="flex a-center mr--55 shrink0 pointer">
                <div class="mr--24 fs--20 font-bold shrink0 color2">{{ userInfo.userName }}</div>
                <img @click="$emit('edit')" src="../assets/img/bianji@2x.png" class="w--23 h--23" />
    <div>
        <div class="header_content">
            <div class="color1 fs--24 font-bold">{{ userInfo.companyName }}</div>
            <div class="flex a-center j-between">
                <div @click="userInfoShow = true" class="flex a-center mr--55 shrink0 pointer">
                    <div class="mr--24 fs--20 font-bold shrink0 color2">{{ userInfo.userName }}</div>
                    <img src="../assets/img/bianji@2x.png" class="w--23 h--23" />
                </div>
                <img @click="logOutShow = true" src="../assets/img/tuichu@2x.png" class="w--40 h--40 shrink0 pointer" />
            </div>
            <img @click="logOutShow = true" src="../assets/img/tuichu@2x.png" class="w--40 h--40 shrink0 pointer" />
        </div>
        <el-dialog v-if="logOutShow" :visible.sync="logOutShow" :show-close="false" width="518px"
            top="51px"></el-dialog>
        <UserInfoComponent :show="userInfoShow" @close="userInfoShow = false" />
        <LogOutComponent v-if="logOutShow" :show="logOutShow" @close="logOutShow = false" />
        <UserInfoComponent v-if="userInfoShow" :show="userInfoShow" @close="userInfoShow = false" />
    </div>
</template>

<script>
import UserInfoComponent from '@/component/userInfo.vue'
import LogOutComponent from '@/component/LogOut.vue'
export default {
    components: {
        UserInfoComponent
        UserInfoComponent,
        LogOutComponent
    },
    props: {},
    data() {
@@ -52,18 +55,5 @@

.color2 {
    color: #EDEDF3;
}

::v-deep .el-dialog {
    border-radius: 8px;

    .el-dialog__header {
        display: none !important;
    }

    .el-dialog__body {
        padding: 0 !important;

    }
}
</style>

 src/component/LogOut.vue

New file
@@ -0,0 +1,77 @@
<template>
    <div>
        <el-dialog :visible.sync="show" :show-close="false" width="518px" @close="$emit('close')"
            :modal-append-to-body="false">
            <div class="txt-center pt--32">
                <div class="fs--21 font-bold">退出登录</div>
                <div class="fs--16 mt--77 color">确认退出当前登录帐号吗？</div>
                <div class="btns">
                    <el-button @click="$emit('close')">关闭</el-button>
                    <el-button @click="submit" type="primary">确认</el-button>
                </div>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    components: {},
    props: {
        show: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {};
    },
    computed: {},
    watch: {},
    created() { },
    mounted() { },
    methods: {
        submit() {
            localStorage.clear();
            window.location.replace('/');
        }
    },
};
</script>
<style scoped lang="less">
.color {
    color: rgba(59, 63, 86, .83);
}

.btns {
    display: flex;
    justify-content: center;
    margin-top: 108px;
    padding-bottom: 29px;

    .el-button {
        width: 190px;
        height: 50px;
        font-size: 20px;

    }

    .el-button--primary {
        background-color: #014099;
        border-color: #014099;
    }
}

::v-deep .el-dialog {
    border-radius: 8px;

    .el-dialog__header {
        display: none !important;
    }

    .el-dialog__body {
        padding: 0 !important;

    }
}
</style>

 src/component/Notice.vue

New file
@@ -0,0 +1,66 @@
<template>
    <el-dialog :visible.sync="show" :show-close="false" width="1018px" @close="$emit('close')"
        :modal-append-to-body="false">
        <div class="txt-center pt--30 pb--25">
            <div class="fs--18 mb--70 font-bold color1">下单须知</div>
            <div v-html="content"></div>
            <div class="btns pointer" @click="$emit('close')">确认</div>
        </div>
    </el-dialog>
</template>

<script>
import { getNotice } from '@/view/service'
export default {
    components: {},
    props: {
        show: {
            type: Boolean,
            default: false
        },
    },
    data() {
        return {
            content: ''
        };
    },
    computed: {},
    watch: {},
    created() {
        getNotice().then(res => {
            this.content = res.data.content
        })
    },
    mounted() { },
    methods: {},
};
</script>
<style scoped lang="less">
.color1 {
    color: rgba(59, 63, 86, 1);
}

::v-deep .el-dialog {
    border-radius: 8px;

    .el-dialog__header {
        display: none !important;
    }

    .el-dialog__body {
        padding: 0 !important;

    }
}

.btns {
    margin: 25px auto 0;
    width: 311px;
    line-height: 50px;
    background: #014099;
    border-radius: 4px;
    font-weight: bold;
    font-size: 18px;
    color: #FFFFFF;
}
</style>

 src/component/userInfo.vue

@@ -1,97 +1,165 @@
<template>
    <el-dialog :visible.sync="show" :show-close="false" width="80%" top="51px" :close-on-click-modal="false">
    <el-dialog :visible.sync="show" :show-close="false" width="80%" top="51px" :close-on-click-modal="false"
        append-to-body @open="open">
        <div class="content">
            <el-form label-position="left" label-width="105px" :model="form" :rules="rules">
            <el-form label-position="left" label-width="120px" ref="form" :model="form" :rules="rules">
                <div class="title">个人信息</div>
                <div class="company">所属公司：成都喜望软件有限公司</div>
                <div class="company">所属公司：{{ userInfo.companyName }}</div>
                <el-row :gutter="90" class="companyForm">
                    <el-col :span="6.5">
                        <el-form-item label="姓名:">
                            <el-input v-model="form.name"></el-input>
                        <el-form-item label="姓名:" prop="userName">
                            <el-input v-model="form.userName" placeholder="请输入"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6.5"><el-form-item label="手机号:" label-width="120px">
                            <el-input v-model="form.region"></el-input>
                    <el-col :span="6.5"><el-form-item label="手机号:" prop="phone" label-width="120px">
                            <el-input v-model="form.phone"></el-input>
                        </el-form-item></el-col>
                    <el-col :span="6.5"><el-form-item label="邮箱:">
                            <el-input v-model="form.type"></el-input>
                    <el-col :span="6.5"><el-form-item label="邮箱:" prop="userEmail">
                            <el-input v-model="form.userEmail"></el-input>
                        </el-form-item></el-col>
                </el-row>
                <div class="company" style="margin-top: 6px;">其他邮箱
                    <div class="btn"><img src="@/assets/add.png" alt="">新增邮箱</div>
                    <div @click="addEmail" class="btn"><img src="@/assets/add.png" alt="">新增邮箱</div>
                </div>
                <el-row :gutter="90" class="companyForm">
                    <el-col :span="6.5">
                        <el-form-item label="邮箱:" prop="email">
                            <el-input v-model="form.email"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="16"><el-form-item label="备注:" label-width="120px">
                            <div style="display: flex;align-items: center;"><el-input v-model="form.region"></el-input>
                                <img style="width: 19px;height: 21px;cursor: pointer;margin-left: 26px;"
                                    src="@/assets/delete.png" alt="">
                            </div>
                        </el-form-item></el-col>

                    <div v-for="(item, index) in form.otherEmails" :key="item">
                        <el-col :span="6.5">
                            <el-form-item label="邮箱:" :prop="'otherEmails.' + index + '.mail'" :rules="[{
                                required: true, message: '请输入邮箱', trigger: 'change'
                            }, { type: 'email', message: '请输入正确的邮箱地址', trigger: 'change' }]">
                                <el-input v-model="item.mail"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="16">
                            <el-form-item label="备注:" label-width="120px">
                                <div style="display: flex;align-items: center;"><el-input
                                        v-model="item.mark"></el-input>
                                    <img style="width: 19px;height: 21px;cursor: pointer;margin-left: 26px;"
                                        src="@/assets/delete.png" alt="">
                                </div>
                            </el-form-item>
                        </el-col>
                    </div>
                </el-row>
                <div class="company" style="margin-top: 6px;">常用收件信息
                    <div class="btn"><img src="@/assets/add.png" alt="">新增收件人</div>
                    <div class="btn" @click="addContact"><img src="@/assets/add.png" alt="">新增收件人</div>
                </div>
                <el-row :gutter="90" class="companyForm">
                <el-row :gutter="90" class="companyForm" v-for="(item, index) in form.contactInfoList" :key="item">
                    <el-col :span="6.5">
                        <el-form-item label="收件人姓名:">
                            <el-input v-model="form.name"></el-input>
                        <el-form-item label="收件人姓名:" :rules="[{ required: true, message: '请输入', trigger: 'change' }]"
                            :prop="'contactInfoList.' + index + '.name'">
                            <el-input v-model="item.name"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6.5"><el-form-item label="收件人手机号:" label-width="120px">
                            <el-input v-model="form.region"></el-input>
                        </el-form-item></el-col>
                    <el-col :span="6.5"><el-form-item label="收件人邮箱:">
                            <el-input v-model="form.type"></el-input>
                        </el-form-item></el-col>
                    <el-col :span="20" style="padding-right: 73px;"><el-form-item label="收件人地址:">
                            <el-input v-model="form.type"></el-input>
                        </el-form-item></el-col>
                    <el-col :span="20" style="padding-right: 73px;position: relative;"><el-form-item label="备注:">
                    <el-col :span="6.5">
                        <el-form-item label="收件人手机号:"
                            :rules="[{ required: true, message: '请输入', trigger: 'change' }, { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号', trigger: 'change' }]"
                            :prop="'contactInfoList.' + index + '.phone'">
                            <el-input v-model="item.phone"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6.5">
                        <el-form-item label="收件人邮箱:"
                            :rules="[{ required: true, message: '请输入', trigger: 'change' }, { type: 'email', message: '请输入正确的邮箱地址', trigger: 'change' }]"
                            :prop="'contactInfoList.' + index + '.email'">
                            <el-input v-model="item.email"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="20" style="padding-right: 52px;">
                        <el-form-item label="收件人地址:" :rules="[{ required: true, message: '请输入', trigger: 'change' }]"
                            :prop="'contactInfoList.' + index + '.address'">
                            <el-input v-model="item.address"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="20" style="padding-right: 52px;position: relative;">
                        <el-form-item label="备注:">
                            <div style="display: flex;align-items: center;"><el-input type="textarea" :rows="3"
                                    v-model="form.region"></el-input>
                                    v-model="item.mark"></el-input>
                                <img style="width: 19px;height: 21px;cursor: pointer;position: absolute;right: -175px;"
                                    src="@/assets/delete.png" alt="">
                            </div>
                        </el-form-item></el-col>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div class="btns">
                <el-button @click="$emit('close')">关闭</el-button>
                <el-button type="primary">保存</el-button>
                <el-button type="primary" @click="submit">保存</el-button>
            </div>
        </div>
    </el-dialog>
</template>

<script>
import { mapState } from 'vuex'
export default {
    props: ['show'],
    data() {
        return {
            form: {
                name: '',
                region: '',
                type: '',
                email: ''
            },
            form: {},
            rules: {
                email: [
                    { required: true, message: '请选择活动区域', trigger: 'change' }
                userName: [
                    { required: true, message: '请输入姓名', trigger: 'change' }
                ],
                phone: [
                    { required: true, message: '请输入手机号', trigger: 'change' },
                    { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号', trigger: 'change' }
                ],
                userEmail: [
                    { required: true, message: '请输入邮箱', trigger: 'change' }
                ],
            }
        };
    },
    computed: {
        ...mapState(['userInfo'])
    },
    watch: {
        show(val) {
            if (val) {
                console.log(this.$store.state.userInfo, '111');
        'show': {
            handler(val) {
                if (val) {
                    this.open()
                }
            },
            immediate: true
        }
    },
    methods: {
        // 提交
        submit() {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    console.log(this.form);
                }
            })
        },
        // 打开
        open() {
            let userInfo = JSON.parse(JSON.stringify(this.userInfo));
            this.form = {
                userName: userInfo.userName,
                phone: userInfo.phone,
                userEmail: userInfo.userEmail,
                otherEmails: userInfo.otherEmails,
                contactInfoList: userInfo.contactInfoList,
            }
        },
        // 新增其他邮箱
        addEmail() {
            this.form.otherEmails.push({
                email: '',
                mark: ''
            })
        },
        // 新增收件人
        addContact() {
            this.form.contactInfoList.push({
                name: '',
                phone: '',
                email: '',
                address: '',
                mark: ''
            })
        }
    }
};
@@ -181,7 +249,7 @@

/deep/ .el-form {
    .el-form-item__label {
        font-size: 16px;
        font-size: 15px;
        color: #3B3F56;
        font-weight: 500;
    }

 src/router/index.js

@@ -38,7 +38,7 @@
        meta: {
          title: "登录",
        },
        component: () => import("../view/Login"),
        component: () => import("../view/Login.vue"),
      },
      {
        path: "/addOrder",

 src/store/index.js

@@ -4,7 +4,7 @@

const store = new Vuex.Store({
  state: {
    userInfo: {} || JSON.parse(sessionStorage.getItem('userInfo'))
    userInfo: JSON.parse(localStorage.getItem('userInfo')) || {}
  },
  mutations: {
    SET_USERINFO(state, userInfo) {

 src/utils/request.js

@@ -21,6 +21,9 @@
    if (env === 'production') {
      url = url.replace(/.$/, '0');
      config.url = url;
    } else {
      url = url.replace(/.$/, '1');
      config.url = url;
    }

    const nowTime = Date.now()
@@ -66,7 +69,7 @@
          type: 'warning',
          duration: 2000
        })
        window.location.replace('/login');
        window.location.replace('/');
        return Promise.reject(res.data)
      }
      Message({

 src/view/Home.vue

@@ -1,14 +1,16 @@
<template>
    <div>
        <Header />
        <UserInfo :show="showUserInfo" @close="showUserInfo = false" />
        <!-- <UserInfo :show="true" /> -->
        <Header style="position: sticky;top: 0;z-index: 1999;" />
        <NoticeComponent v-if="noticeShow" :show="noticeShow" @close="noticeShow = false" />
        <AddedInformation v-if="false" :show="false" />
        <div class="search-box">
            <div class="title-card">
                <div class="title-left">
                    订单列表
                </div>
                <div class="title-right">
                    <span class="order-agress">下单须知</span>
                    <span @click="noticeShow = true" class="order-agress">下单须知</span>
                    <div class="line"></div>
                    <span class="add-ord">添加订单</span>
                </div>
@@ -16,33 +18,33 @@
            <div class="search-form">
                <el-form :inline="true" :model="searchForm" class="demo-form-inline">
                    <div class="flex a-center justify-between flex-wrap">
                        <el-form-item label="订单编号：" prop="date" class="unset_m" style="margin-left: 15px">
                            <el-input style="width: 230px;" v-model="searchForm.input" placeholder="请输入"></el-input>
                        <el-form-item label="订单编号：" prop="orderId" class="unset_m" style="margin-left: 15px">
                            <el-input style="width: 230px;" v-model="searchForm.orderId" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="集装箱号：" prop="date" class="unset_m">
                            <el-input style="width: 230px;" v-model="searchForm.input" placeholder="请输入"></el-input>
                        <el-form-item label="集装箱号：" prop="container" class="unset_m">
                            <el-input style="width: 230px;" v-model="searchForm.container" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="提单号：" prop="date" class="unset_m">
                            <el-input style="width: 230px;" v-model="searchForm.input" placeholder="请输入"></el-input>
                        <el-form-item label="提单号：" prop="bol" class="unset_m">
                            <el-input style="width: 230px;" v-model="searchForm.bol" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="收件人邮箱：" prop="date" class="unset_m">
                            <el-input style="width: 230px;" v-model="searchForm.input" placeholder="请输入"></el-input>
                        <el-form-item label="收件人邮箱：" prop="post" class="unset_m">
                            <el-input style="width: 230px;" v-model="searchForm.post" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="订单状态：" prop="date" class="unset_m">
                            <el-select style="width: 230px;" :popper-append-to-body="false" v-model="searchForm.typeId"
                        <el-form-item label="订单状态：" prop="status" class="unset_m">
                            <el-select style="width: 230px;" :popper-append-to-body="false" v-model="searchForm.status"
                                placeholder="请选择">
                                <el-option v-for="item in options" placeholder="请输入" :key="item.id" :label="item.label"
                                    :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="收件人地址：" prop="date" class="unset_m1"
                        <el-form-item label="收件人地址：" prop="address" class="unset_m1"
                            style="margin-bottom: unset !important;">
                            <el-input style="width: 230px;" v-model="searchForm.input" placeholder="请输入"></el-input>
                            <el-input style="width: 230px;" v-model="searchForm.address" placeholder="请输入"></el-input>
                        </el-form-item>
                        <el-form-item label="DO文件是否上传：" prop="date" class="unset_m1"
                        <el-form-item label="DO文件是否上传：" prop="DO" class="unset_m1"
                            style="margin-bottom: unset !important;">
                            <el-select style="width: 230px;" :popper-append-to-body="false" v-model="searchForm.typeId"
                            <el-select style="width: 230px;" :popper-append-to-body="false" v-model="searchForm.DO"
                                placeholder="请选择">
                                <el-option v-for="item in option1" placeholder="请输入" :key="item.id" :label="item.label"
                                    :value="item.id">
@@ -53,7 +55,7 @@
                        </el-form-item>
                        <div class="flex a-center">
                            <el-button type="default" class="reset" @click="reset">重置</el-button>
                            <el-button type="primary" class="search">搜索</el-button>
                            <el-button type="primary" class="search" @click="search">搜索</el-button>
                        </div>
                    </div>
                </el-form>
@@ -61,50 +63,72 @@
        </div>
        <div class="table-box">
            <el-table :data="tableData" style="width: 100%" border>
                <el-table-column prop="date" label="订单编号" align="center">
                <el-table-column prop="orderld" label="订单编号" align="center">
                </el-table-column>
                <el-table-column prop="name" label="集装箱号" align="center">
                <el-table-column prop="container" label="集装箱号" align="center">
                </el-table-column>
                <el-table-column prop="address" label="提单号" align="center">
                <el-table-column prop="bol" label="提单号" align="center">
                </el-table-column>
                <el-table-column prop="address" label="收件人邮箱" align="center">
                <el-table-column prop="post" label="收件人邮箱" align="center">
                </el-table-column>
                <el-table-column prop="address" label="收件人地址" align="center">
                </el-table-column>
                <el-table-column prop="address" label="预计到达时间" align="center">
                <el-table-column prop="estimatedArrival" label="预计到达时间" align="center">
                </el-table-column>
                <el-table-column prop="address" label="预计送柜日期" align="center">
                <el-table-column prop="deliverySchedule" label="预计送柜日期" align="center">
                </el-table-column>
                <el-table-column prop="address" label="实际送货日期" align="center">
                <el-table-column prop="realSchedule" label="实际送货日期" align="center">
                </el-table-column>
                <el-table-column prop="address" label="DO文件是否上传" align="center">
                <el-table-column prop="DO" label="DO文件是否上传" align="center">
                </el-table-column>
                <el-table-column prop="address" label="订单状态" align="center">
                <el-table-column prop="status" label="订单状态" align="center">
                </el-table-column>
                <el-table-column prop="address" label="操作" align="center">
                <el-table-column prop="option" label="操作" align="center">
                    <template slot-scope="scope">
                        <el-button type="text" @click="handleClick(scope.row)">查看</el-button>
                        <el-button type="text" @click="handleClick(scope.row)">编辑</el-button>
                        <el-button type="text" @click="handleClick(scope.row)">删除</el-button>
                        <el-button type="text" class="table-btn" @click="handleClick(scope.row)">查看详情</el-button><span
                            class="line-set">|</span>
                        <el-button type="text" class="table-btn" @click="handleClick(scope.row)">编辑</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <!-- <div class="text-right pagination-card">
                <el-pagination background :page-size="pagination.pageSize" layout="slot,prev,pager,next"
                    :current-page="pagination.pageNum" @current-change="handleCurrentChange"
                    @size-change="handleSizeChange" :total="pagination.total">
                    <span class="total-num">共{{ pagination.total }}条记录</span>
                </el-pagination>
            </div> -->
        </div>
    </div>
</template>

<script>
import UserInfo from '@/component/userInfo.vue'
import Header from '@/component/Header.vue'
import NoticeComponent from '@/component/Notice.vue'
import AddedInformation from '@/component/AddedInformation.vue'
import { getList } from './home'
export default {
    name: "Home",
    components: {
        Header
        UserInfo,
        Header,
        NoticeComponent,
        AddedInformation
    },
    data() {
        return {
            noticeShow: false,
            showUserInfo: false,
            searchForm: {

                orderId: '',
                container: '',
                bol: '',
                post: '',
                address: '',
                DO: '',
                status: '',
            },
            options: [
                {
@@ -148,6 +172,7 @@
                    label: '已取消'
                }
            ],
            tableData: [],
            option1: [
                {
                    id: 1,
@@ -158,11 +183,36 @@
                    label: '否'
                }
            ],
            // pagination: {
            //     total: 999,
            //     pageNum: 1,
            //     pageSize: 10,
            // },
        };
    },
    created() {
        this.getLists()
    },
    methods: {
        getLists() {
            getList({ ...this.searchForm }).then(res => {
                this.tableData = res.data
            })
        },
        search(){
            this.getLists()
        },
        reset() {
            this.searchForm = {}
            this.searchForm = {
                orderId: '',
                container: '',
                bol: '',
                post: '',
                address: '',
                DO: '',
                status: '',
            }
            this.getLists()
        }
    }
};
@@ -279,5 +329,108 @@
    margin-right: 35px;
    width: calc(100% - 70px);
    border-radius: 6px;
    background-color: #fff;
    padding-bottom: 24px;

    ::v-deep {
        .el-table__header {
            .el-table__cell {
                background-color: rgba(246, 246, 247, 1) !important;

                .cell {
                    font-family: SourceHanSansCN, SourceHanSansCN;
                    font-weight: 500;
                    font-size: 16px;
                    color: #3B3F56;
                }
            }
        }
    }

    ::v-deep {
        .el-table__cell {
            height: 50px;
        }
    }

    ::v-deep .el-table__row {
        .el-table__cell {
            font-family: SourceHanSansCN, SourceHanSansCN;
            font-weight: 400;
            font-size: 16px;
            color: #3B3F56 !important;
        }
    }

    .table-btn {
        font-family: SourceHanSansCN, SourceHanSansCN;
        font-weight: 400;
        font-size: 16px;
        color: #014099;
    }

    .line-set {
        font-size: 14px;
        color: #014099;
        margin: 0 5px;
    }

    .total-num {
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 12px;
        color: #989BB0;
        margin-right: 12px;
    }
}

::v-deep .el-pager {
    .number {
        min-width: 30px;
        height: 30px;
        background: #FFFFFF !important;
        border-radius: 4px !important;
        border: 1px solid #DBDBE7 !important;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 12px;
        color: #989BB0;
    }

    .active {
        min-width: 30px;
        height: 30px;
        background: #014099 !important;
        border-radius: 4px !important;
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 12px;
        color: #FFFFFF;
    }


}

.pagination-card {
    margin-top: 49px;
    margin-right: 14px;
}

::v-deep .btn-prev {
    margin-left: 0;
    margin-right: 5px;

    .el-icon-arrow-left:before {
        content: "\E792";
    }
}

::v-deep .btn-next {
    margin-left: 5px;
    margin-right: 0;

    .el-icon-arrow-right:before {
        content: "\E791";
    }
}
</style>

 src/view/Login.vue

@@ -23,7 +23,7 @@

<script>
import { generateVerificationCode } from '@/utils/utils';
import { login } from './login'
import { login } from './service'
import CryptoJS from 'crypto-js';
export default {
    components: {},

 src/view/home.js

New file
@@ -0,0 +1,7 @@
import axios from '@/utils/request';


//订单列表
export const getList = (data) => {
    return axios.post('/zj0FFk5wx4S05X-zksSUHaFEdk0Xv-1', data)
}

 src/view/login.js

File was deleted

 src/view/service.js

New file
@@ -0,0 +1,17 @@
import axios from '@/utils/request';


//登录
export const login = (data) => {
    return axios.post('/zj0FFk5wx4S05X-zj1pJ2B2g2y0Xb-1', data)
}

//信息
export const getMsg = (data) => {
    return axios.post('/zj0FFk5wx4S05X-zlGsc6coLPE0Xp-1', data)
}

//下单须知
export const getNotice = (data) => {
    return axios.post('/zj0FFk5wx4S05X-zlHKJ68bVk80Xr-1', data)
}