diff --git a/src/assets/image/Link.png b/src/assets/image/Link.png
new file mode 100644
index 0000000..d30f2fb
Binary files /dev/null and b/src/assets/image/Link.png differ
diff --git a/src/assets/image/login-bg1.png b/src/assets/image/login-bg1.png
new file mode 100644
index 0000000..3fbeab6
Binary files /dev/null and b/src/assets/image/login-bg1.png differ
diff --git a/src/assets/image/login-logo.png b/src/assets/image/login-logo.png
index eba96c5..4187371 100644
Binary files a/src/assets/image/login-logo.png and b/src/assets/image/login-logo.png differ
diff --git a/src/assets/style/common.scss b/src/assets/style/common.scss
index 2dcd545..0cfb9f2 100644
--- a/src/assets/style/common.scss
+++ b/src/assets/style/common.scss
@@ -93,12 +93,19 @@ html{
 .f-weight600{
     font-weight: 600;
 }
+.background-color-fff{
+    background-color: $color-white;
+}
 .color-fff{
     color: $color-white;
 }
 .color-000{
     color: $color-000000;
 }
+.color-86909C{
+    color: #86909C;
+}
+
 .color-text-primary{
     color: $color-text-primary;
 }
@@ -732,4 +739,8 @@ html{
 
 
 
- //=================== end::状态标签样式 =============================== 
\ No newline at end of file
+ //=================== end::状态标签样式 =============================== 
+
+ .navigation-bar{
+    
+ }
\ No newline at end of file
diff --git a/src/assets/style/element-ui-variable.scss b/src/assets/style/element-ui-variable.scss
index 13f686c..d3533bc 100644
--- a/src/assets/style/element-ui-variable.scss
+++ b/src/assets/style/element-ui-variable.scss
@@ -11,4 +11,19 @@ $--button-primary-border-color: #1960F4 !default;
 /// padding||Spacing|3
 //$--button-padding-horizontal: 20px !default;
 
+
+.el-button--primary{
+    color: #FFFFFF;
+    background-color: #C66A5B !important;
+    border-color: #C66A5B !important;
+}
+.el-button:hover{
+    color: #FFFFFF;
+    background-color: #c66a5b9c !important;
+    border-color: #c66a5b9c !important;
+}
+.el-button:hover span{
+    color: #FFFFFF;
+}
+
 @import "~element-ui/packages/theme-chalk/src/index";
\ No newline at end of file
diff --git a/src/pages/case-package/index.vue b/src/pages/case-package/index.vue
new file mode 100644
index 0000000..37b798f
--- /dev/null
+++ b/src/pages/case-package/index.vue
@@ -0,0 +1,407 @@
+<template>
+    <div class="layout-content-wrap">
+        <div class="navigation-bar flex-row mb-16">
+            <img src="../../assets/image/Link.png"  height="22" alt="">
+            <a>/</a>
+            <a>案件包列表</a>
+        </div>
+        
+        <div class="layout-tabs-content-box background-color-fff border-radius-4">
+            <div class="pt-8 border-b-solid-lighter-1">
+                <div class="height-30 flex-row align-items-center justify-content-between mb-24">
+                    <div class="f22 color-text-primary">筛选</div>
+                    <div class="flex-row align-items-center color-text-regular cursor-pointer"
+                         @click="handleToggleSearch">
+                        <span class="f14 pr-8">{{showSearch?'展开':'收起'}}</span>
+                        <i :class="['f14 el-icon-arrow-down transform-time-default', {
+                        'rotate--180': showSearch
+                    }]"></i>
+                    </div>
+                </div>
+                <el-collapse-transition>
+                    <div v-show="showSearch">
+                        <el-row :gutter="56">
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">委案机构</span>
+                                    <el-select v-model="queryParam.productTypeId"
+                                           clearable placeholder="请选择委案机构"
+                                           @keydown.enter.native="handleSearch"
+                                           class="width100">
+                                    <el-option
+                                            v-for="item in financialProductsTypeOptions"
+                                            :key="item.code"
+                                            :label="item.codeName"
+                                            :value="item.code">
+                                    </el-option>
+                                </el-select>
+                                </div>
+                            </el-col>
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件包名称</span>
+                                    <el-input v-model.trim="queryParam.pkgName"
+                                              clearable placeholder="请输入案件包名称"
+                                              @keydown.enter.native="handleSearch">
+                                    </el-input>
+                                </div>
+                            </el-col>
+                            <el-col :span="8">
+                                <div class="flex-row-center align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">案件即将到期</span>
+                                    <el-select v-model="queryParam.resultStatus"
+                                            clearable placeholder="请选择案件是否即将到期"
+                                            @keydown.enter.native="handleSearch"
+                                            :disabled="deptDisabled"
+                                            class="width100">
+                                        <el-option
+                                                v-for="item in caseStatusData"
+                                                :key="item.code"
+                                                :label="item.desc"
+                                                :value="item.code">
+                                        </el-option>
+                                    </el-select>
+                                </div>
+                            </el-col>
+                        </el-row>
+                        
+                        <el-row :gutter="56" v-if="caseStatusShow">
+                            
+                        </el-row>
+                        <el-row :gutter="56">
+                            <el-col :span="18">
+                                <div class="flex-row align-items-center height-40 mb-24">
+                                    <span class="tabs__search-criteria-title flex-shrink-0 pr-16">委案时间</span>
+                                    <span :class="['f14 pr-24 cursor-pointer', i === 0 ? 'pl-8' : '',
+                                    activeUsage === item ?'color-primary' : 'color-text-regular']"
+                                          v-for="(item, i) in usageOption" :key="i"
+                                          @click="handleClickUsage(item)">{{item}}</span>
+
+                                    <el-date-picker
+                                            v-model="queryDate"
+                                            type="daterange"
+                                            clearable
+                                            range-separator="至"
+                                            start-placeholder="开始日期"
+                                            end-placeholder="结束日期"
+                                            @change="handleChangeDate">
+                                    </el-date-picker>
+                                </div>
+                            </el-col>
+                            <el-col :span="4" :offset="2">
+                                <div class="flex-row align-items-center justify-content-end">
+                                    <el-button @click="hanldeReset">重置</el-button>
+                                    <el-button type="primary" @click="handleSearch">搜索</el-button>
+                                </div>
+                            </el-col>
+                        </el-row>
+                    </div>
+                </el-collapse-transition>
+            </div>
+            <!-- table -->
+            <div class="pt-8">
+                <div class="height-56 flex-row align-items-center justify-content-between">
+                    <div class="f22 color-text-primary">列表</div>
+                    <div class="flex-row">
+                        <el-button size="small" type="primary" @click="handleImport">批量导入案件</el-button>
+                        <el-button size="small" @click="handleAddForm">添加案件</el-button>
+                        <el-button size="small" @click="handleBatchDelete">错误修复</el-button>
+                        <el-button size="small" type="primary" @click="handleCaseAllocation">案件分配</el-button>
+                    </div>
+                </div>
+                
+                <div >
+                    <el-table :data="tableData" :height="`${contentHeight}`" 
+                    @selection-change="handleSelectionChange">
+                        <el-table-column type="selection" width="55" ></el-table-column>
+                        <el-table-column prop="pkgName" label="案件包名称" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="entrustingAgencyName" label="委案机构" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="resultStatus" label="产品类别" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="planStartTime" label="委案时间" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="resultStatus" label="委案期限" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="resultStatus" label="案件数量" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="resultStatus" label="待分案" show-overflow-tooltip ></el-table-column>
+                        <el-table-column prop="resultStatus" label="已分案" show-overflow-tooltip ></el-table-column>
+                        <el-table-column  label="操作" width="370">
+                            <template slot-scope="scope">
+                                <div class="flex-row align-items-center">
+                                    <el-button size="mini" @click="handleEdit(scope)">查看</el-button>
+                                    <el-button size="mini" @click="handleEdit(scope)">案件分案</el-button>
+                                    <el-button size="mini" @click="handleEdit(scope)">预设还款方案</el-button>
+                                    <el-button size="mini" @click="handleDelete(scope)">删除</el-button>
+                                </div>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </div>
+                
+                <div class="text-center pt-16">
+                    <el-pagination
+                        @size-change="getCaseInfoList"
+                        @current-change="getCaseInfoList"
+                        :current-page="queryParam.current"
+                        :page-size="queryParam.size"
+                        layout="total, prev, pager, next, jumper"
+                        :total="total">
+                    </el-pagination>
+                </div>
+
+            </div>
+        </div>
+        <!-- 导入 -->
+        <!-- <importCaseDialog v-if="importCaseDialog" :importCaseDialog.sync="importCaseDialog" /> -->
+        <!-- 新增 -->
+        <!-- <addCaseDialog v-if="addCaseDialog" :addCaseDialog.sync="addCaseDialog" /> -->
+        <!-- 编辑 -->
+        <!-- <editCaseDrawer v-if="editCaseDrawer" :editCaseDrawer.sync="editCaseDrawer"/> -->
+        <!-- 案件分配-->
+        <!-- <caseAllocationDialog v-if="caseAllocationDialog" :caseAllocationDialog.sync="caseAllocationDialog" /> -->
+    </div>
+</template>
+<script>
+import api from "@/services/casePackageManagement";
+    export default {
+        components: {
+            // importCaseDialog: () => import('./components/importCaseDialog'),//导入
+            // addCaseDialog: () => import('./components/addCaseDialog'),//新增
+            // editCaseDrawer: () => import('./components/editCaseDrawer'),//编辑
+            // caseAllocationDialog: () => import('./components/caseAllocationDialog'),//案件分配
+        },
+        data() {
+            return {
+                activeName:'all',
+                showSearch: true,
+                queryDate: '',
+                activeUsage: '',
+                
+                mediateStatusData:[],//所有案件状态枚举
+                financialProductsTypeOptions:[],//金融产品类型
+                departmentOptions:[],//部门
+                queryParam: {
+                    pkgName:'',//案件包名称
+                    pkgNo: '',//案件编号
+                    endTime: '',//结束时间
+                    beginTime:'',//开始时间
+                    current:1,
+                    size:10,
+                },
+                usageOption: ['今日','昨日', '近一周', '近一月', '近半年', '近一年'],
+                tableData: [],
+                total:0,
+                uniqueSelection:[],
+                caseAllocationDialog:null,//案件分配弹框
+                importCaseDialog:null,//导入
+                addCaseDialog:null,//新增
+                editCaseDrawer:null,//编辑
+                deptDisabled:false,//部门下拉设置是否可选
+
+
+
+            }
+        },
+        created() {
+            // 判断当前登录人角色，如果是普通调解员，则默认展示部门且不可选择
+            let identifier = this.$store.state.userinfo.identifier
+            if(identifier=='mediator'){
+                this.deptDisabled = true
+                this.queryParam.deptId = this.$store.state.userinfo.deptId
+            }else{
+                this.deptDisabled = false
+            }
+            this.getCaseInfoList(1)
+        },
+        computed:{
+            // 获取抽屉drawer的内容高度
+            contentHeight(){
+                let oh = document.documentElement.clientHeight;
+                if(this.showSearch){
+                    if(this.caseStatusShow){
+                        return oh-56-48-430-32
+                    }else{
+                        return oh-56-48-366-32
+                    }
+                    
+                }else{
+                    return oh-56-48-175-32
+                }
+            }  
+        },
+        methods: {
+            
+            // 导入
+            handleImport(){
+                this.importCaseDialog={
+                    title:'导入案件',
+                }
+            },
+            // 批量删除
+            handleBatchDelete(){
+                if(this.uniqueSelection.length==0){
+                    this.$message.warning("请先选择你要删除的列表数据");
+                    return
+                }
+                this.$confirm("请确定是否删除这些数据?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning",
+                }).then(() => {
+                    if(!this.$clickThrottle()) { return }//防止重复点击
+                    
+                    let data = {
+                        ids:this.uniqueSelection
+                    }
+                    api.deleteCaseBatch(data).then((res) => {
+                        
+                        this.$message.success("成功");
+                        this.getCaseInfoList(1)
+                       
+                    });
+                }).catch(() => {});
+            },
+            // 单条删除
+            handleDelete(scope){
+                this.$confirm("请确定是否删除此条数据?", "提示", {
+                    confirmButtonText: "确定",
+                    cancelButtonText: "取消",
+                    type: "warning",
+                }).then(() => {
+                    if(!this.$clickThrottle()) { return }//防止重复点击
+                    api.CasePkgdeleteById({id:scope.row.id}).then((res) => {
+                        
+                        this.$message.success("删除成功");
+                        this.getCaseInfoList(1)
+                       
+                    });
+                }).catch(() => {});
+            },
+            // 新增
+            handleAddForm(){
+                this.addCaseDialog={
+                    title:'新增案件',
+                }
+            },
+            // 案件分配
+            handleCaseAllocation(){
+                this.caseAllocationDialog={
+                    title:'案件分配',
+                }
+            },
+            // 编辑
+            handleEdit(scope){
+                this.editCaseDrawer={
+                    title:'编辑案件',
+                    data:scope.row,
+                    currentPage:this.queryParam.current
+                }
+            },
+            // 列表数据
+            getCaseInfoList(val){
+                this.queryParam.current = val
+                api.getCasePkgQuery(this.queryParam).then(res => {
+                    if (!res.code) {
+                        this.tableData = res.records;
+                        this.total = res.total;
+                    }
+                })
+            },
+            
+            formatProductType(row, column, cellValue, index){
+                // console.log('row',row)
+                let obj = this.financialProductsTypeOptions.find((item) => {
+                    return item.code == row.productTypeId
+                })
+                return row.productTypeId != null ? <div>{obj?obj.codeName:'-'}</div> : '-'
+            },
+            handleToggleSearch() {
+                this.showSearch = !this.showSearch
+            },
+            // 重置
+            hanldeReset() {
+                for (let key in this.queryParam) {
+                this.queryParam[key] = ''
+                }
+                this.queryParam.current = 1
+                this.queryParam.size = 10
+            },
+            handleSearch() {
+                this.queryParam.size = 10;
+                this.queryParam.current = 1;
+                this.getCaseInfoList(1)
+            },
+            handleClickUsage(item) {
+                this.activeUsage = item
+                this.setDateFast()
+            },
+            handleChangeDate() {
+                this.activeUsage = ''
+                if(this.queryDate === null) {
+                    this.setDateFast()
+                }else {
+                    this.queryParam.beginTime = this.$util.getDayStart(this.queryDate[0])
+                    this.queryParam.endTime = this.$util.getDayEnd(this.queryDate[1])
+                }
+
+            },
+            setDateFast() {
+                switch (this.activeUsage) {
+                    case "今日":
+                        let todayObj = this.$util.getToday()
+                        this.queryParam.beginTime = todayObj.todayStart
+                        this.queryParam.endTime = todayObj.todayEnd
+                        break
+                    case "昨日":
+                        let yesterdayObj = this.$util.getYesterday()
+                        this.queryParam.beginTime = yesterdayObj.beginTime
+                        this.queryParam.endTime = yesterdayObj.endTime
+                        break
+                    case "近一周":
+                        let rangeWeek = this.$util.getRecentWeeks()
+                        this.queryParam.beginTime = rangeWeek.recentWeekStart
+                        this.queryParam.endTime = rangeWeek.todayEnd
+                        break
+                    case "近一月":
+                        let rangeMonth = this.$util.getRecentMonths()
+                        this.queryParam.beginTime = rangeMonth.recentMonthStart
+                        this.queryParam.endTime = rangeMonth.todayEnd
+                        break
+                    case "近半年":
+                        let rangeMonths = this.$util.getRecentMonths(6)
+                        console.log('近半年：', rangeMonths)
+                        this.queryParam.beginTime = rangeMonths.recentMonthStart
+                        this.queryParam.endTime = rangeMonths.todayEnd
+                        break
+                    case "近一年":
+                        let rangeYear = this.$util.getRecentYears()
+                        this.queryParam.beginTime = rangeYear.recentYearStart
+                        this.queryParam.endTime = rangeYear.todayEnd
+                        break
+                    default:
+                        this.queryParam.beginTime = ''
+                        this.queryParam.endTime = ''
+                        this.queryDate = ''
+                        break
+                }
+                if(this.queryParam.beginTime && this.queryParam.endTime) {
+                    this.queryDate = [this.queryParam.beginTime, this.queryParam.endTime]
+                }
+
+            },
+
+            handleSelectionChange(val){
+                console.log('获取val',val)
+                this.uniqueSelection = []
+                val.forEach((row)=>{
+                    this.uniqueSelection.push(row.id)
+                })
+                console.log('uniqueSelection',this.uniqueSelection)
+
+            },
+            
+        }
+    }
+</script>
+<style scoped>
+.el-badge{
+    top: 3px;
+}
+</style>
\ No newline at end of file
diff --git a/src/pages/layout/components/LayoutHeader.vue b/src/pages/layout/components/LayoutHeader.vue
index 9ca27f9..98949d6 100644
--- a/src/pages/layout/components/LayoutHeader.vue
+++ b/src/pages/layout/components/LayoutHeader.vue
@@ -1,16 +1,20 @@
 <template>
     <div>
-        <div class="layout-header-wrap">
-            <div class="layou-header-left-box flex-row align-items-center">
+        <div class="layout-header-wrap  flex-row">
+            <div class="layou-header-left-box flex-row align-items-center" style="width: 300px;">
                 <div class="flex-row">
                     <img src="../../../assets/image/header-logo1.png"  height="30" alt="">
                     <span class="f20 color-fff ml-8">金桥云调</span>
                 </div>
                 <el-divider direction="vertical"></el-divider>
                 <span class="f20 color-fff ">互联网人民调解</span>
-
+                
             </div>
-            <div class="mr-8 flex-row align-items-center cursor-pointer" @mouseover="showInfo=true" >
+            <div class="layou-header-left-box flex-row align-items-center">
+                <SideMenu />
+            </div>
+
+            <div class="mr-8 flex-row cursor-pointer layou-header-right-box" @mouseover="showInfo=true"  style="">
                 <!-- <el-badge :value="1" :max="99" class="item">
                     <el-avatar size="medium" icon="el-icon-user-solid"></el-avatar>
                 </el-badge> -->
@@ -101,6 +105,9 @@
 </template>
 <script>
     export default {
+        components: {
+            SideMenu: () => import('./SideMenu'),
+        },
         data(){
             var validatePass = (rule, value, callback) => {
                 if (value === '') {
@@ -213,7 +220,7 @@
     box-sizing: border-box;
     // background: url('~@/assets/image/header-bg-1920.png') no-repeat ;
     background-size: cover;
-    background-color: #EB000E;
+    background-color: #C66A5B;
 
     .el-badge__content{
         height: $height20;
@@ -221,6 +228,43 @@
         border: 0 !important;
         top: 30px;
     }
+    .layou-header-right-box{width: 300px;display: inline-block;text-align: right;}
+    .layout-side-menu-wrap .side-menu-container{border-right: 0;}
+    .el-menu{
+        border: 0;
+        background-color: transparent;
+    }
+    .el-menu--horizontal > .el-menu-item{color: #FFFFFFB2;}
+    .el-menu--horizontal > .el-submenu .el-submenu__title{color: #FFFFFFB2;}
+
+    .el-menu--horizontal > .el-menu-item:hover{
+        color: #C66A5B;
+        background-color: transparent;
+        color: #fff;
+    }
+    .el-menu--horizontal > .el-submenu:hover .el-submenu__title {
+        color:#C66A5B;
+        background-color: transparent;
+        color: #fff;
+    }
+    .el-submenu__title i{color:#FFFFFFB2; }
+    .el-menu--horizontal > .el-menu-item.is-active{
+        border-bottom: 2px solid #fff;
+        background-color: transparent;
+        color: #fff;
+    }
+    .el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
+        border-bottom: 2px solid #fff;
+        background-color: transparent;
+        color: #fff;
+    }
+    
+}
+.el-menu--horizontal  .el-menu.el-menu--popup .el-menu-item:not(.is-disabled):hover{
+    color:#C66A5B;
+}
+.el-menu--horizontal .el-menu .el-menu-item.is-active, .el-menu--horizontal .el-menu .el-submenu.is-active > .el-submenu__title {
+    color:#C66A5B;
 }
 .layout-header-number{
     position: absolute;
diff --git a/src/pages/layout/components/MenuTree.vue b/src/pages/layout/components/MenuTree.vue
index 4ac4530..fc4ce5c 100644
--- a/src/pages/layout/components/MenuTree.vue
+++ b/src/pages/layout/components/MenuTree.vue
@@ -43,27 +43,27 @@
     .zd-el-menu-item{
         padding: 0 !important;
     }
-    .zd-el-menu-item__custom-class{
-        width: 100%;
-        position: relative;
-        &::before{
-            content: "";
-            width: 2px;
-            height: 24px;
-            position: absolute;
-            left: 0;
-            top: 16px;
-            background-color: $color-white;
-        }
-    }
-    .zd-el-menu-item__custom-class.is-active{
-        background-color: $color-menu-active-bg !important;
-        color: $color-menu-active-text !important;
+    // .zd-el-menu-item__custom-class{
+    //     width: 100%;
+    //     position: relative;
+    //     &::before{
+    //         content: "";
+    //         width: 2px;
+    //         height: 24px;
+    //         position: absolute;
+    //         left: 0;
+    //         top: 16px;
+    //         background-color: $color-white;
+    //     }
+    // }
+    // .zd-el-menu-item__custom-class.is-active{
+    //     background-color: $color-menu-active-bg !important;
+    //     color: $color-menu-active-text !important;
 
-        &::before{
-            background-color: $color-menu-active-text;
-        }
-    }
+    //     &::before{
+    //         background-color: $color-menu-active-text;
+    //     }
+    // }
     .zd-menu-vertical-bar{
         width: 2px;
         height: $height24;
diff --git a/src/pages/layout/components/SideMenu.vue b/src/pages/layout/components/SideMenu.vue
index bbb24ee..1beb9cf 100644
--- a/src/pages/layout/components/SideMenu.vue
+++ b/src/pages/layout/components/SideMenu.vue
@@ -1,21 +1,13 @@
 <template>
     <div class="layout-side-menu-wrap">
-        <div class="side-menu-container flex-column">
-            <el-menu class="flex-grow-1"
+        <div class="side-menu-container">
+            <el-menu class="flex-grow-1" mode="horizontal"
                     :default-active="defaultActive"
                     @open="handleOpen"
                     @close="handleClose"
             >
                 <MenuTree v-for="(item, i) in menuTree" :key="i" :menu="item" :index="i" />
             </el-menu>
-
-            <div class="side-menu-help flex-row flex-shrink-0 align-items-center">
-                <span class="flex-grow-0 cursor-pointer">
-                    <svg-icon icon-class="help-circle" class="color-text-regular"></svg-icon>
-                    <span class="f14 color-text-primary ml-8">帮助</span>
-                </span>
-
-            </div>
         </div>
 
     </div>
@@ -73,7 +65,7 @@
 </script>
 <style lang="scss">
     .layout-side-menu-wrap {
-        width: 240px;
+        // width: 240px;
         height: 100%;
         .side-menu-container {
             height: calc(100%);
diff --git a/src/pages/layout/index.vue b/src/pages/layout/index.vue
index 0440436..1b2c2bc 100644
--- a/src/pages/layout/index.vue
+++ b/src/pages/layout/index.vue
@@ -2,8 +2,8 @@
     <div class="layout-wrap">
         <LayoutHeader />
         <div class="layout-bottom-wrap">
-            <SideMenu />
-            <div class="layout-bottom-right-content">
+            <!-- <SideMenu /> -->
+            <div class="layout-bottom-right-content p-16">
                 <router-view></router-view>
             </div>
         </div>
@@ -13,7 +13,7 @@
 export default {
     components: {
         LayoutHeader: () => import('./components/LayoutHeader'),
-        SideMenu: () => import('./components/SideMenu'),
+        // SideMenu: () => import('./components/SideMenu'),
     }
 }
 </script>
@@ -30,8 +30,9 @@ export default {
     height: calc(100% - 56px);
 }
 .layout-bottom-right-content{
-    width: calc(100% - 240px);
+    width: calc(100% - 0px);
     height: calc(100%);
+    background-color: #f6f4f4;
 }
 .layout-content-wrap{
     width: 100%;
diff --git a/src/pages/login/index.vue b/src/pages/login/index.vue
index dfa334b..2f9d0f9 100644
--- a/src/pages/login/index.vue
+++ b/src/pages/login/index.vue
@@ -1,11 +1,12 @@
 <template>
     <div class="login-wrap">
+        <div class="login-logo">
+            <img src="../../assets/image/login-logo.png" height="40" alt="" >
+        </div>
         <div class="login-box">
             <div class="login-content flex-column-center">
                 <div class="logo-wrap flex-row-center align-items-center">
-                    <!-- <img src="../../assets/image/login-logo.png" alt="" class="logo-img"> -->
-                    <el-divider direction="vertical"></el-divider>
-                    <div class="f18 color-text-regular">欢迎登录</div>
+                    <div class="f32 color-text-regular">欢迎登录</div>
                 </div>
                 
                 <div class="flex-column-center width100">
@@ -63,8 +64,7 @@
         </div>
 
         <div class="login_footer_ad flex-column-center align-items-center">
-            <div class="f20 color-fff">科技助力司法 公正触手可及</div>
-            <div class="f12 color-fff pt-8">
+            <div class="f12 color-86909C pt-8">
                 <span class="pl-8">Copyright © {{$util.getToyear()}} 法智数科 版权所有</span>
             </div>
         </div>
@@ -292,10 +292,11 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
+.login-logo{padding:20px 0 0 40px;}
 .login-wrap{
     width: 100%;
     height: 100%;
-    background: url('~@/assets/image/login-bg.png') no-repeat ;
+    background: url('~@/assets/image/login-bg1.png') no-repeat ;
     background-size: cover;
     position: relative;
 }
@@ -315,8 +316,10 @@ export default {
     background: $color-white;
     padding: $size32;
     padding-bottom: 0;
-    border-radius: 2px;
-    box-shadow: 0px 33px 114px rgba(25, 96, 244, 0.26), 0px 9.94853px 34.3677px rgba(25, 96, 244, 0.169413), 0px 4.13211px 14.2746px rgba(25, 96, 244, 0.13), 0px 1.4945px 5.16283px rgba(25, 96, 244, 0.0905869);
+    border-radius: 5px;
+    // box-shadow: 0px 33px 114px rgba(25, 96, 244, 0.26), 0px 9.94853px 34.3677px rgba(25, 96, 244, 0.169413), 0px 4.13211px 14.2746px rgba(25, 96, 244, 0.13), 0px 1.4945px 5.16283px rgba(25, 96, 244, 0.0905869);
+    box-shadow: 0px 4px 4px 0px #00000014;
+
 }
 .login-tab{
     display: flex;
@@ -347,7 +350,7 @@ export default {
 }
 .login_footer_ad{
     position: fixed;
-    bottom: 100px;
+    bottom: 30px;
     left: 50%;
     margin-left: -129px;
     opacity: 0.6;
diff --git a/src/pages/workbench/index.vue b/src/pages/workbench/index.vue
index dff656b..eb17902 100644
--- a/src/pages/workbench/index.vue
+++ b/src/pages/workbench/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div>
         <el-scrollbar :style="'height:'+`${contentHeight}`+'px'">
-            <div class="layout-content-wrap p-16">
+            <div class="layout-content-wrap">
                 <div class="border-radius-4 flex-row justify-content-between">
                     <div class="width100 flex-row justify-content-between mr-16 border-radius-4 casework1">
                         <div class="flex-column f14 color-fff line-height-30 p-16">
@@ -40,8 +40,8 @@
                         <img src="../../assets/image/workbench/Subtract2.png" width="30" height="30" alt="">
                     </div>
                 </div>
-                <div class="border-radius-4 flex-row justify-content-between mt-16">
-                    <div class="width30 p-16 flex-column mr-16 border-radius-4 border-solid-lighter-1 listwork1">
+                <div class="border-radius-4 flex-row justify-content-between mt-16 ">
+                    <div class="width30 p-16 flex-column mr-16 border-radius-4 border-solid-lighter-1 listwork1 background-color-fff">
                         <div class="mt-8 mb-16 f22">快速入口</div>
                         <div class="flex-column f14 p-24 color-fff border-radius-8 line-height-40 fastcase1 cursor-pointer" @click="casejump()">
                             <a class="f24">案件列表</a>
@@ -52,7 +52,7 @@
                             <a>快速查看个人业绩信息</a>
                         </div>
                     </div>
-                    <div class="width70 p-16 border-radius-4 border-solid-lighter-1 listwork2">
+                    <div class="width70 p-16 border-radius-4 border-solid-lighter-1 listwork2 background-color-fff">
                         <div class="mt-8 mb-16 f22">最近调解案件</div>
                         <div>
                             <el-table :data="tableData" >
@@ -77,8 +77,8 @@
                         </div>
                     </div>
                 </div>
-                <div class="border-radius-4 flex-row justify-content-between mt-16">
-                    <div class="width70 flex-column p-16 mr-16 border-radius-4 border-solid-lighter-1 seniority1">
+                <div class="border-radius-4 flex-row justify-content-between mt-16 ">
+                    <div class="width70 flex-column p-16 mr-16 border-radius-4 border-solid-lighter-1 seniority1 background-color-fff">
                         <div class="flex-row justify-content-between">
                             <a class="f22">调解案件数量统计</a>
                             <el-radio-group v-model="radio1" size="small">
@@ -88,7 +88,7 @@
                         </div>
                         <span id="total_recycling_chart" class="mt-24"></span>
                     </div>
-                    <div class="width30 flex-column p-16 border-radius-4 border-solid-lighter-1 seniority2">
+                    <div class="width30 flex-column p-16 border-radius-4 border-solid-lighter-1 seniority2 background-color-fff">
                         <div class="flex-row justify-content-between">
                             <a class="f22">本月业绩排行 TOP10</a>
                             <el-radio-group v-model="radioRanking" size="small">
diff --git a/src/router/index.js b/src/router/index.js
index 8edf95d..1994e58 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -16,7 +16,7 @@ const routes = [
     path: "/",
     name: "/",
     component: layout,
-    meta: { title: "政法调解云" },
+    meta: { title: "金桥云调解" },
     redirect: '/workbench',
     children: [
       {
@@ -25,6 +25,12 @@ const routes = [
         component: () => import("@/pages/workbench"),
         meta: { title: "调解首页", icon: 'menu-home' },
       },
+      {
+        path: "/case-package",
+        name: "/case-package",
+        component: () => import("@/pages/case-package"),
+        meta: { title: "案件包管理", icon: 'menu-case-management' },
+      },
       {
         path: "/case-management",
         name: "/case-management",
diff --git a/src/services/casePackageManagement.js b/src/services/casePackageManagement.js
new file mode 100644
index 0000000..0c55d48
--- /dev/null
+++ b/src/services/casePackageManagement.js
@@ -0,0 +1,23 @@
+import service from "./index";
+const apiMediate = '/mediate/api/'
+
+const caseManagementApi = {
+    
+    //========================start::案件包管理======================================
+    // 案件包查询接口
+    getCasePkgQuery: data => {
+        return service.service.post(`${apiMediate}case_pkg/query`, data)
+    },
+    // 案件包删除接口
+    CasePkgdeleteById: data => {
+        return service.service.post(`${apiMediate}case_pkg/deleteById`, data)
+    },
+    // 案件包导入创建
+    CasePkgimport: data => {
+        return service.service.post(`${apiMediate}case_pkg/import`, data)
+    },
+    
+
+    //========================end::案件包管理======================================
+}
+export default caseManagementApi;
\ No newline at end of file