删除一些没有用的文件

src/App.vue

@@ -20,9 +20,9 @@ export default {
 
 <style>
 @import './assets/global/font.css';
-@import '//at.alicdn.com/t/font_863923_vbuuda0uxl8.css';
-@import './assets/global/global.css';
+@import '//at.alicdn.com/t/font_1627123_95ez472hgyg.css';
 @import './assets/css/common.css';
+@import './assets/css/init.css';
 body,html{
   padding: 0px;
   margin: 0px;

src/assets/css/LocalCuisine.css

-.LocalCuisine{
-    font-family: "PingFang";
-    color: #333333;
-    background: #f5f5f5;
-}
-.LocalCuisine .w1200{
-    margin:0 auto;
-}
-
-.LocalCuisine .chooseDiv{
-    padding:0 20px;
-    box-sizing: border-box;
-    width: 100%;
-    background: #ffffff;
-    margin-top:25px;
-}
-.LocalCuisine .chooseDiv li{
-    border-bottom:1px dashed rgba(233,233,233,1);
-    padding: 15px 0;
-    box-sizing: border-box;
-    position: relative;
-    
-}
-.LocalCuisine .chooseDiv li div{
-    display: inline-block;
-    position: relative;    
-}
-.LocalCuisine .chooseDiv li .title{
-    width: 80px;
-}
-.LocalCuisine .chooseDiv li .change{
-    width: 1080px;
-    color:#999999;
-}
-.LocalCuisine .chooseDiv li .el-icon-date{
-    color:#4CB960;
-    font-weight: 700;
-}
-.LocalCuisine .el-input__inner{
-    border-radius: 0;
-}
-.LocalCuisine .spanMargin{
-    word-break: break-all; 
-}
-.LocalCuisine .spanMargin span{
-    display: inline-block;
-    font-size: 12px;
-    margin-right:18px;
-    padding-bottom:10px;
-    cursor: pointer;
-}
-.LocalCuisine .spanPrice>span{
-    display: inline-block;
-    font-size: 12px;
-    margin-right:18px;
-    cursor: pointer;
-    
-}
-.LocalCuisine .icon-qian{
-    color: #333333;
-    font-size: 12px;
-}
-.LocalCuisine .pxDiv .px img{
-    width: 8px;
-    height: 12px;
-    position: relative;
-    top: 2px;
-    cursor: pointer;
-}
-.LocalCuisine .pxDiv{
-    padding: 15px 0;
-    text-align: center;
-    font-size: 12px;
-}
-.LocalCuisine .pxDiv span{
-    margin:0 10px;
-}
-.LocalCuisine .dataList{
-    margin-top:40px;
-}
-.LocalCuisine .dataList .dataLeft{
-    float: left;
-    width: 224px;
-    background:rgba(255,255,255,1);
-    border:1px solid rgba(236, 236, 236, 1);
-    box-sizing: border-box;
-}
-.LocalCuisine .dataList .dataRight{
-    float: right;
-    width: 954px;
-    background:rgba(255,255,255,1);
-    border:1px solid rgba(236, 236, 236, 1);
-    box-sizing: border-box;
-    /* margin-left: 20px; */
-}
-.LocalCuisine .dataList .leftList{
-    width: 188px;
-    margin: 0 auto;
-    margin-bottom:30px;
-}
-.LocalCuisine .dataList .dataRight .rightlist{
-    padding:0 20px;
-    box-sizing: border-box;
-    transition: all .5s ease;
-    cursor: pointer;
-}
-.LocalCuisine .dataList .dataRight .el-row{
-    padding:20px 0;    
-    border-bottom: 1px solid #E9E9E9;
-}
-.LocalCuisine .dataList .dataRight .rightlist:hover{
-    box-shadow: 0px 1px 13px 0px rgb(189, 189, 189);
-}
-.LocalCuisine .dataList .dataRight .el-row .el-col{
-    box-sizing: border-box;
-}
-.LocalCuisine .dataList .dataRight .zhuti{
-    margin-bottom: 15px;
-}
-.LocalCuisine .dataList .dataRight .zhuti span{
-    display: inline-block;
-    color:#4E9F5D;
-    background:rgba(76,185,96,0.2);
-    padding:4px 10px;
-    margin-right: 10px;
-    /* opacity:0.2; */
-    
-}
-.LocalCuisine .page{
-    background: #EBEBEB;
-    margin: 30px 0;
-    float: right;
-    width: 954px;
-}
-.LocalCuisine .page ._pagination{
-    height: 45px;
-    background-color: #EBEBEB;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-.LocalCuisine .page .el-pagination .btn-next,.LocalCuisine .page .el-pagination .btn-prev{
-    width:40px !important;
-    height:20px !important;
-    border:1px solid rgba(238,68,84,1);
-    border-radius:10px;
-    color: #f56c6c;
-  }
-  .LocalCuisine .page .el-pagination{
-    display: flex;
-    align-items: center;
-  }
-  .LocalCuisine .page .el-pager li{
-    background: transparent; 
-    font-weight: initial;
-  }
-  .LocalCuisine .page .el-pager li:hover{
-    color: #f56c6c;
-  }
-  .LocalCuisine .page .el-pager li.active{
-    color: #f56c6c;
-  }
-  .LocalCuisine .ChActive{
-      color: #EE4454;
-      font-family: "PingFangR";
-  }
-
-
-  /* 当地美食详情页 */
-  
-  .LocalCuisineDetails .Head{
-      margin-top: 15px;
-  }
-  .LocalCuisineDetails .Head .HeadLeft{
-    width: 460px;
-    float: left;
-  }
-  .LocalCuisineDetails .Head .HeadLeft .Imglist{
-    margin-left: -12px;
-    margin-top: 5px;  
-  }
-  .LocalCuisineDetails .Head .HeadLeft .Imglist li{
-    display: inline-block;  
-    margin-left: 12px;        
-  }
-  .LocalCuisineDetails .Head .HeadLeft .Imglist li a{
-      display: inline-block;
-      width:82px;
-      height:47px;
-      box-sizing:border-box; 
-      position: relative;
-      
-  }
-  .LocalCuisineDetails .Head .HeadLeft .Imglist .activeLi{
-      /* border: 2px solid #EE4454; */
-  }
-  .LocalCuisineDetails .Head .HeadLeft .Imglist .activeLi a:before{
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    border:2px solid #fff;
-}
-.LocalCuisineDetails .Head .HeadLeft .Imglist .activeLi a:after, .LocalCuisineDetails .Head .HeadLeft .Imglist .activeLi a:after{
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    padding: 1px;
-    border: 2px solid #EE4454;
-}
-  .LocalCuisineDetails .Head .HeadLeft .Imglist li img{
-      width: 100%;
-      height: 100%;
-  }
-  .LocalCuisineDetails .Head .HeadRight{
-    width: 720px;
-    float: right;
-    background: #fff;
-    padding: 30px 25px;
-    box-sizing: border-box;
-  }
-  .LocalCuisineDetails .Head .HeadRight .zhuti span{
-    display: inline-block;
-    color:#4E9F5D;
-    background:rgba(76,185,96,0.2);
-    padding:4px 10px;
-    margin-right: 10px;
-    /* opacity:0.2; */
-    
-}
-.LocalCuisineDetails .Head .HeadRight .hr{
-    border-bottom: 1px dashed #E9E9E9;
-    margin:30px 0;
-}
-.LocalCuisineDetails .Head .HeadRight .tcDiv{
-    position: relative;
-}
-.LocalCuisineDetails .Head .HeadRight .tcDiv .tcSpan{
-    position: absolute;
-    color:#666666;
-    font-size: 12px;
-}
-.LocalCuisineDetails .Head .HeadRight .tcDiv .tc{
-    padding-left: 78px;
-    box-sizing: border-box;    
-}
-.LocalCuisineDetails .Head .HeadRight .tcDiv .tc span{
-    display: inline-block;
-    border:1px solid rgba(204, 204, 204, 1);
-    border-radius:2px;
-    font-size:12px;
-    padding:4px 6px;
-    margin-right: 10px;
-    margin-bottom:10px;
-    cursor: pointer;
-}
-.LocalCuisineDetails .Head .HeadRight .tcDiv .tc .Active{
-    border: 2px solid #EE4454;
-    color:#EE4454;
-}
-
-.LocalCuisineDetails .ydDiv{
-    margin-top:15px;
-    background:rgba(255,248,249,1);
-    border:1px solid rgba(249, 229, 232, 1);
-    /* height:80px; */
-    padding:15px 15px;
-    box-sizing: border-box;
-}
-.LocalCuisineDetails .ydDiv .el-form-item{
-    display: inline-block;
-    margin-bottom: 0;
-    
-}
-.LocalCuisineDetails .el-input-number__decrease,.LocalCuisineDetails .el-input-number__increase{
-    background: #fff;
-    outline: none;
-}
-.LocalCuisineDetails .ydDiv .el-icon-date{
-    color: #4CB960;
-    font-family: "PingFangR";
-    font-size: 16px;
-}
-/* .LocalCuisineDetails .ydDiv .el-input__prefix{
-    right:2px;
-} */
-.LocalCuisineDetails .ydDiv .el-form-item__label{
-    color:#666666;
-    font-size: 12px;
-}
-.LocalCuisineDetails .dataRight .el-tabs__nav{
-    float: none;
-    text-align: center;
-}
-.LocalCuisineDetails .dataRight .el-tabs__item{
-    height: 60px;
-    line-height: 60px;
-}
-.LocalCuisineDetails .dataRight .el-tabs__item.is-active{
-    color: #EE4454;
-    font-family: "PingFangR"
-}
-.LocalCuisineDetails .dataRight .el-tabs__active-bar{
-    left: 400px;
-    background-color: #EE4454;
-}
-.LocalCuisineDetails .dataRight .el-tabs__item:hover{
-    color: #EE4454;
-}
-.LocalCuisineDetails .dataRight .el-tabs__nav-wrap::after{
-    height: 1px;
-}
\ No newline at end of file

src/assets/css/init.css

+body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
+body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; }
+h1, h2, h3, h4, h5, h6{ font-size:100%; }
+address, cite, dfn, em, var { font-style:normal; }
+code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
+small{ font-size:12px; }
+ul, ol { list-style:none; }
+a { text-decoration:none; }
+a:hover { text-decoration:underline; }
+sup { vertical-align:text-top; }
+sub{ vertical-align:text-bottom; }
+legend { color:#000; }
+fieldset, img { border:0; }
+button, input, select, textarea { font-size:100%; }
+table { border-collapse:collapse; border-spacing:0; }
\ No newline at end of file

src/assets/css/reset.css

-.el-radio__input.is-checked .el-radio__inner{
-    border-color: #EE4454;
-    background: #EE4454;
-}
-.el-radio__input.is-checked+.el-radio__label {
-    color: #EE4454;
-}
-.orange{
-    color:#FF6633;
-}
-.el-select-dropdown.is-multiple .el-select-dropdown__item.selected{
-    color: #EE4454;
-}
\ No newline at end of file

src/assets/global/PersonalInfo.css

-.PersonalInfo{
-    height: 100px;
-    padding: 18px 0;
-    background-color: #000;
-    background: #f9f9f9 url(../img/Ps_top_bg.png) no-repeat bottom left/100% auto;
-}
-._head_left{
-    display: flex;
-}
-.PersonalInfo ._head ._head_left>img{
-    height: 64px;
-    width: 64px;
-    border-radius: 50%;
-    display: inline-block;
-}
-._head_left_info{
-    padding-left: 20px;
-    line-height: 30px;
-}
-._head_left_info>P{
-    margin: 0;
-    color: #FFFFFF;
-    font-size: 16px;
-}
-._head_left_info>div{
-    display: flex;
-    align-items: center;
-}
-._head_left_info>div>span{
-    font-size: 14px;
-    color: rgba(255,255,255,0.5);
-}
-._head_left_info>div>img{
-    height: 14px;
-    width: 14px;
-    margin-right: 7px;
-}
-._head_left_line{
-    padding: 0 10px;
-}
-._head_right{
-    display: flex;
-    justify-content: flex-end;
-}
-._head_right>div{
-    text-align: center;  
-    margin-right: 20px;  
-}
-._head_right>div:nth-child(1){
-    margin-right: 80px;
-}
-._head_right>div ._head_right_tit{
-    color: #FFFFFF;
-    font-size: 14px;   
-    margin-top: 10px; 
-}
-._head_right>div ._head_right_num{
-    margin: 0;
-    color: #FFAE00;
-    font-size: 18px;
-    font-weight:bold;
-}
\ No newline at end of file

src/assets/global/foot.css

-.foot-box{
-    background: #333;
-    padding: 15px 0;
-    color: #D0D0D0;
-    font-size: 12px;
-    padding-top:25px;
-}
-.foot-box p{
-    margin: 0;
-    text-align: center;
-    /* line-height: 30px; */
-}
\ No newline at end of file

src/assets/global/global.css

-.hgh_table th{
-    background-color: #333333;
-    color: #f5f5f5;
-    font-size: 12px;
-    padding: 15px 0;
-    font-family: 'PingFangR';
-    font-weight: inherit !important;
-}
-.hgh_font_color_org{
-    color: #FF5F08 !important;
-}
-.hgh_font_color_gre{
-    color:#1BB974 !important;
-}
-.hgh_pay_money_bth{
-    display: inline-block;
-    height: 25px;
-    line-height: 25px;
-    padding: 0 9px;
-    border: 1px solid #E73E6D;
-    color: #E73E6D;
-    cursor: pointer;
-}
-.clearfix:after {content: "\0020";display: block;height: 0;clear: both;}
-.item-pager{
-    text-align: right;
-    margin-bottom: 25px;
-}
-.item-pager .el-pagination__editor, .item-pager .el-pager li,  .el-pagination .btn-next,  .el-pagination .btn-prev{
-    border-radius: 0px;
-    width: 38px;
-    height: 38px;
-    line-height:38px;
-    box-sizing: border-box;
-    border:1px solid #ddd;
-    font-weight: 400;
-    font-family: 'pingfangR'
-}
-.item-pager .el-pager li.active+li{
-    border-left: 1px solid #ddd;
-}
-.item-pager .el-pager li.active{
-    border:1px solid #EF4455;
-    background: #EF4455;
-}
-.el-pagination.is-background .el-pager li:not(.disabled).active{
-    border:1px solid #EF4455 !important;
-    background: #EF4455 !important;
-}
-.el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li{
-    border-radius: 0px !important;
-}
-.item-pager .el-pagination__editor{
-    margin: 0 5px;
-}
-.item-pager .el-pagination__editor input{
-    border: none;
-    outline: none;
-}
-.empty-data{
-    width: 100%;
-    padding: 50px;
-    box-sizing: border-box;
-    text-align: center;
-    color: #bbb;
-    font-size: 12px;
-}
-.empty-data .icon-kong{
-    font-size: 120px;
-    display: block;
-}
-._bgc_f5{background-color: #F5F5F5;}

src/assets/global/header.css

-.header{
-
-}
-.header .header-box{
-    width: 100%;
-    background: #333;
-}
-.header .header-box .small .el-menu-item{
-    height: 30px;
-    line-height: 30px;
-    float: right;
-    font-size: 12px;
-}
-.header .header-box .small.el-menu--horizontal{
-    border-bottom: none;
-}
-.header  a{
-    text-decoration: none !important;
-}
-.header .header-box .small .el-menu-item .iconfont{
-    font-size: 21px;
-    color:#fff;
-}
-.header .second-nav{
-    width: 100%;
-    border-bottom: solid 1px #e6e6e6;
-}
-.header .second-nav .el-menu.el-menu--horizontal{
-    border-bottom: none !important;
-}
-.header .second-nav .el-menu-item,.header .second-nav .el-submenu__title{
-    /* height: 80px;
-    line-height: 80px; */
-    font-family: 'pingfang';
-    font-size: 18px;
-}
-.header .second-nav .logo{
-    max-height: 40px;
-    margin-top: 10px;
-    max-width: 100%;
-}
-.header .second-nav .position{
-    width: 100%;
-    height: 60px;
-    line-height: 60px;
-}
-.header .second-nav .position::after{
-    display: block;
-    clear: both;
-    content: '';
-}
-.header .second-nav .position .iconfont{
-    font-size: 22px;
-    color:#EF4455;
-    float: right;
-}
-.header .second-nav .el-select{
-    float: right;
-}
-.header .second-nav .el-input--mini{
-    width: 77px;
-
-}
-.header .second-nav .el-input__inner{
-    border: none;
-    font-size: 14px;
-    padding: 0 5px;
-}
-.header .second-nav {
-
-}
-.el-menu--popup{
-    background-color: #333 !important;
-}
-.el-select-dropdown__item.selected{
-    font-weight: 400;
-}
-/* 登陆后顶部导航 */
-.login_nav .el-menu--horizontal>.el-submenu .el-submenu__title{
-    height: 30px;
-    line-height: 35px;
-    font-size: 12px;
-}
-.login_nav .el-menu--horizontal>.el-submenu{float: right;}
-.user_nav{
-    display: flex;
-    justify-content: flex-end;
-}
-.user_nav a{
-    color: #333333 !important;
-    font-size: 14px;
-    font-weight:400;
-}
-.login_nav .el-menu--horizontal .el-menu-item:not(.is-disabled):focus,.login_nav .el-menu--horizontal .el-menu-item:not(.is-disabled):hover,.login_nav .el-menu--horizontal>.el-menu-item.is-active{
-    border-bottom: none;
-    color: #909399;
-}
\ No newline at end of file

src/components/HomeNav/HomeNav.vue

+<style>
+.home-nav{
+    width: 100%;
+    height: 100%;
+}
+.log-box{
+    width: 100%;
+    height: 13.19%;
+}
+.log-box{
+    background-color: white;
+}
+.log-box>div{
+    height: 100%;
+    width: 100%;
+    background:rgba(13,36,129,1);
+    border-radius:0px 40px 40px 0px;
+    display: flex;
+    align-items: center;
+    justify-content: center
+}
+.log-box img{
+    width: 42px;
+}
+.home-nav .home-menu {
+    padding-left: 19px;
+}
+.home-nav .home-menu .home-menu-item{
+    color:rgba(255,255,255,1);
+    font-size: 12px;
+    cursor: pointer;
+    transition: all linear .2s;
+}
+.home-nav .home-menu .home-menu-item>div{
+    padding: 13px 0 13px 35px;
+    border-radius: 19px 0 0 19px;
+    background-color: rgba(13,36,129,1);
+}
+.home-nav .home-menu .home-menu-item:hover{
+    background-color: rgb(45, 59, 115);
+}
+.home-nav .home-menu .home-menu-item.active>div{
+    font-weight:bold;
+    color:rgba(13,36,129,1);
+    opacity: 1;
+    transition: all linear .2s;
+    background-color: white
+}
+</style>
+<template>
+    <div class="home-nav">
+        <div class="log-box">
+            <div>
+                <img src="../../assets/img/logo.png" alt="">
+            </div>
+        </div>
+        <ul class="home-menu">
+            <li class="home-menu-item" v-for="(item, index) in navList" :key="index" :class="[index === activeIndex ? 'active' : '']" @click="changeMenu(item, index)">
+                <div>
+                    <i :class="item.class"></i><span>{{item.name}}</span>
+                </div>
+            </li>
+        </ul>
+    </div>
+</template>
+<script>
+export default {
+    data () {
+        return {
+            activeIndex: 0,
+            navList: [
+                {
+                    class: 'iconfont icondongwu',
+                    name: '仪表盘'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '待办事项'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '线索'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '客户'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '联系人'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '公海'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '商机'
+                },
+                {
+                    class: 'iconfont icondongwu',
+                    name: '合同'
+                }
+            ]
+        }
+    },
+    mounted () {
+        
+    },
+    methods: {
+        changeMenu: function (it, ind) {
+            this.activeIndex = ind
+        } 
+    }
+
+}
+</script>

src/views/index.vue

 <style>
+.main{
+    height: 100%;
+}
+.left-nav{
+    width: 14.93%;
+    float: left;
+    box-sizing: border-box;
+    height: 100%;
+    background:rgba(13,36,129,1);
+}
+.right-content{
+    float: left;
+    width: calc(100vw - 14.93%);
+    background: #F4F5F9;
+    box-sizing: border-box;
+    height: 100%;
+}
 </style>
 <template>
-    <div>
-        <div>
-            CRM系统
-        </div>
-        <el-card class="box-card">
-        <div slot="header" class="clearfix">
-            <span>卡片名称</span>
-            <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button>
+    <div class="clearfix main">
+        <div class="left-nav">
+            <HomeNav/>
         </div>
-        <div v-for="o in 4" :key="o" class="text item">
-            {{'列表内容 ' + o }}
+        <div class="right-content">
+            a
         </div>
-        </el-card>
     </div>
 </template>
 <script>
+import HomeNav from '../components/HomeNav/HomeNav'
 export default {
+    components: {HomeNav},
     data () {
         return {