菜单栏样式修改

src/components/newLayout/modules/aside.vue

@@ -1,7 +1,7 @@
 <template>
 <div>
   <div class="aside__panel" :class="!collapse?'width-160':'bg'">
-    <div  class="logo flex-align-center">
+    <div  class="logo flex-align-center" :class="collapse?'flex-around':''">
       <i class="el-icon-s-fold inline-16" @click="collapse = !collapse"></i>
       <img v-show="img.usetype === 'actionlogo' && !collapse" v-for="img in siteinfo.attinfos" :key="img.index" style="height:40px" :src="img.url" alt="">
     </div>
@@ -12,23 +12,31 @@
       text-color="#fff"
       active-text-color="#fff"
       class="el-menu-vertical-demo">
-      <el-menu-item :index="String(item.systemid)" v-for="item in systemList" :key="item.index" @click="handelMenuClick(item,'system')" @mouseenter.native="selectStyle(item)">
+      <el-menu-item :index="String(item.systemid)" v-for="item in systemList" :key="item.index" @click="handelMenuClick(item,'system')" @mouseenter.native="debounce(selectStyle,1500)()" @mouseleave.native="outStyle">
         <p style="text-align:center" v-if="collapse">{{item.systemname.substr(0, 1)}}</p>
         <span slot="title">{{item.systemname}}</span>
       </el-menu-item>
       <el-divider class="divider"></el-divider>
       <!-- <p v-if="!collapse" style="padding:0 20px;font-size:12px;color:#eeeeee">应用</p> -->
       <!-- <el-divider content-position="left">应用</el-divider> -->
-      <el-menu-item :index="String(index + 10)" v-for="(item,index) in menuApp" :key="index" @click="handelMenuAppClick(item,'app')" @mouseenter.native="selectStyle (item)">
+      <el-menu-item :index="String(index + 10)" v-for="(item,index) in menuApp" :key="index" @click="handelMenuAppClick(item,'app')" @mouseenter.native="debounce(selectStyle,1500)()" @mouseleave.native="outStyle">
         <p class="" style="text-align:center" v-if="collapse">{{item.systemappname.substr(0, 1)}}</p>
         <span slot="title">{{item.systemappname}}</span>
         <i v-if="!collapse" style="float:right;line-height: 40px;" class="el-icon-error menuIconClose" @click.stop="deleteMenuApp(item)"></i>
       </el-menu-item>
+      <el-menu-item index="99" style="font-size:12px;margin-top:20px"  @click="handelMenuClick(item,'system')" @mouseenter.native="debounce(selectStyle,1500)()" @mouseleave.native="outStyle">
+        <i v-if="collapse" class="el-icon-aim"  style="font-size:12px;color:#fff"></i>
+        <span slot="title"><b>网站地图</b></span>
+      </el-menu-item>
+      <el-menu-item index="100"  style="font-size:12px"  @click="handelMenuClick(item,'system')" @mouseenter.native="debounce(selectStyle,1500)()" @mouseleave.native="outStyle">
+        <i v-if="collapse" class="el-icon-menu"  style="font-size:12px;color:#fff"></i>
+        <span slot="title"><b>配置菜单</b></span>
+      </el-menu-item>
     </el-menu>
   </div>
-  <div v-if="collapse" :class="fixedMenu" class="aside__panel" @mouseenter="selectStyle" @mouseleave="outStyle()">>
-    <div  class="logo flex-align-center">
-      <img v-show="img.usetype === 'actionlogo'" v-for="img in siteinfo.attinfos" :key="img.index" style="height:40px" :src="img.url" alt="">
+  <div v-if="collapse" :class="fixedMenu" class="aside__panel" @mouseenter="selectStyle" @mouseleave="outStyle()">
+    <div style="height:64px;line-height:64px;text-align: center;" class="logo" @click="collapse = false">
+      <i class="el-icon-s-unfold inline-16" ></i>Expand menu
     </div>
     <el-menu
       style="background:none"
@@ -36,14 +44,19 @@
       active-text-color="#fff"
       class="el-menu-vertical-demo">
       <el-menu-item :index="String(item.systemid)" v-for="item in systemList" :key="item.index" @click="handelMenuClick(item,'system')">
-        <span slot="title">{{item.systemname}}</span>
+        <div slot="title"><span class="name__icon inline-16" style="text-align:center">{{item.systemname.substr(0, 1)}}</span>{{item.systemname}}</div>
       </el-menu-item>
       <el-divider class="divider"></el-divider>
       <!-- <p v-if="!collapse" style="padding:0 20px;font-size:12px;color:#eeeeee">应用</p> -->
       <!-- <el-divider content-position="left">应用</el-divider> -->
       <el-menu-item :index="String(index + 10)" v-for="(item,index) in menuApp" :key="index" @click="handelMenuAppClick(item,'app')">
-        <span slot="title">{{item.systemappname}}</span>
-        <i v-if="!collapse" style="float:right;line-height: 40px;" class="el-icon-error menuIconClose" @click.stop="deleteMenuApp(item)"></i>
+        <div slot="title"><span class="name__icon inline-16" style="text-align:center">{{item.systemappname.substr(0, 1)}}</span>{{item.systemappname}}</div>
+      </el-menu-item>
+      <el-menu-item index="99" style="margin-top:20px">
+        <span slot="title" style="font-size:12px">网站地图</span>
+      </el-menu-item>
+      <el-menu-item index="100">
+        <span slot="title" style="font-size:12px">配置菜单</span>
       </el-menu-item>
     </el-menu>
   </div>
@@ -59,7 +72,8 @@ export default {
       systemList:[],
       active:"0",
       collapse:true,
-      fixedMenu:'no__panel'
+      fixedMenu:'no__panel',
+      timer:null
     }
   },
   computed:{
@@ -108,13 +122,20 @@ export default {
       })
       this.$store.dispatch('setAppMenu')
     },
-    selectStyle (item) {
-      var _this=this;
-      this.$nextTick(()=>{
-        _this.fixedMenu = 'pos__panel'
-      })
+    debounce (fn, wait) {
+      var that = this
+      that.timer = null
+      return function () {
+        if (that.timer !== null) clearTimeout(that.timer)
+        that.timer = setTimeout(fn, wait)
+      }
+    },
+    selectStyle () {
+      var _this = this;
+      _this.fixedMenu = 'pos__panel'
     },
-    outStyle (item) {
+    outStyle () {
+      clearTimeout(this.timer)
       this.fixedMenu = 'no__panel'
     }
     
@@ -156,14 +177,10 @@ export default {
 .aside__panel .el-menu-item{
   height: 40px;
   line-height: 40px;
-  /* border-radius: 0 10px 10px 0; */
-  /* margin: 16px 0; */
-  padding-left:30px !important;
+  padding-left:20px !important;
 }
 .aside__panel .el-menu-item:hover{
   background-color: rgba(255 ,255,255,.2) !important;
-  /* border-radius: 0 40px 40px 0; */
-  /* color:#333 !important; */
 }
 .el-menu-item:focus, .el-menu-item:hover{
   background: none;
@@ -171,7 +188,9 @@ export default {
 .is-active .menuIconClose{
   display: block !important;
 }
-
+.bg .el-menu-item{
+  /* margin-bottom: 16px; */
+}
 </style>
 <style scoped>
 .is-active{
@@ -186,23 +205,33 @@ export default {
   height: 62px;
   line-height: 62px;
   color:#fff;
-  padding-left:30px;
+  padding-left:20px;
   /* border-right: 1px solid #f1f2f3; */
 }
 .bg{
   margin-right: 10px;
 }
+
 .bg .logo{
   margin-left: -10px;
 }
 .bg p{
-  height:30px;
-  width: 30px;
-  line-height: 30px;
-  margin-top:5px;
+  height:24px;
+  width: 24px;
+  line-height: 24px;
+  margin-top:9px;
   border-radius: 100%;
   background-color: rgba(255 ,255,255,.2)
 }
+.name__icon{
+  display: inline-block;
+  height:20px;
+  width: 20px;
+  line-height: 20px;
+  border-radius: 100%;
+  font-size: 12px;
+  background-color: rgba(255 ,255,255,.2)
+}
 .is-active p{
   background:none !important;
 }
@@ -216,12 +245,13 @@ export default {
 .divider{opacity: .2;}
 .pos__panel{
   position: absolute;
-  width: 200px;
   left:0;
   top:0;
-  background: rgba(32, 30, 30, 0.9);
-  box-shadow: 0 15px 30px rgb(0 0 0 / 10%);
+  width: 200px;
+  box-shadow: 2px 8px 8px 0 rgb(0 0 0 / 20%);
+  background: rgba(52,60,71,.95);
   z-index: 999;
+  transition: .5s ease-in-out;
 }
 .no__panel{
   position: absolute;
@@ -230,5 +260,7 @@ export default {
   top:0;
   background: rgba(32, 30, 30, 0.8);
   z-index: 999;
+  transition: .5s ease-in-out;
+  
 }
 </style>

src/components/normal-basic-layout/details/modules/followUp/addLog.vue

@@ -69,8 +69,9 @@ export default {
           "attachmentids": this.attachmentids
           
         }).then(rs=>{
-            this.dialogFormVisible = false
-            this.$emit('onSuccess')
+          this.attachmentids = []
+          this.dialogFormVisible = false
+          this.$emit('onSuccess')
         })
        
       })

src/components/normal-basic-layout/details/modules/followUp/editLog.vue

@@ -81,8 +81,9 @@ export default {
           "attachmentids": this.attachmentids
           
         }).then(rs=>{
-            this.dialogFormVisible = false
-            this.$emit('onSuccess')
+          this.attachmentids = []
+          this.dialogFormVisible = false
+          this.$emit('onSuccess')
         })
        
       })

src/components/normal-basic-layout/details/modules/group/group.vue

@@ -8,7 +8,7 @@
         placement="right"
         trigger="click"
         width="300">
-        <member :param="param" :radio="true" @onSelect="onSubmit"></member>
+        <member :param="param" :radio="true" :checked="item.teamleader" @onSelect="onSubmit"></member>
         <el-button type="text" size="small" slot="reference" @click="(addType = 'leader')">变更</el-button>
       </el-popover>
     </div>
@@ -17,12 +17,16 @@
         <div class="avatar inline-16" :class="men.isleader === 1?'leader':''" >
           <img class="avatar__image" v-if="men.headpic" :src="men.headpic" alt="">
           <p v-else>{{men.name.substr(0, 1)}}</p>
-          <span class="avatar__model">
+          <!-- <span class="avatar__model">
             <i style="margin-right:5px" class="el-icon-user" @click="setLeader(men)"></i>
             <i class="el-icon-delete" @click="deleteGroupAccount(men)"></i>
-          </span>
+          </span> -->
         </div>
-        <p>{{men.name}}</p>
+        <!-- <p>{{men.name}}</p> -->
+        <div>
+					<p>{{ men.name }} &nbsp;</p>
+					<small style="color:#999999ad;margin-top:10px">部门：{{ men.depname?men.depname:"未知部门" }}&emsp;职位：{{ men.position?men.position:"未知部门" }}</small>
+				</div>
       </div>
       <div v-if="item.teamleader.length === 0">
         <el-empty description="暂无负责人" :image-size="40"></el-empty>
@@ -34,7 +38,7 @@
         placement="right"
         trigger="click"
         width="300">
-        <member :param="param" :radio="false" @onSelect="onSubmit"></member>
+        <member :param="param" :radio="false" :checked="item.team" @onSelect="onSubmit"></member>
         <el-button type="text" size="small" slot="reference"  @click="(addType = 'menber')">变更</el-button>
       </el-popover>
     </div>
@@ -43,12 +47,15 @@
         <div class="avatar inline-16"  :class="men.isleader === 1?'leader':''" >
           <img class="avatar__image" v-if="men.headpic" :src="men.headpic" alt="">
           <p v-else>{{men.name.substr(0, 1)}}</p>
-          <span class="avatar__model">
+          <!-- <span class="avatar__model">
             <i style="margin-right:5px" class="el-icon-user" @click="setLeader(men)"></i>
             <i class="el-icon-delete" @click="deleteGroupAccount(men)"></i>
-          </span>
+          </span> -->
+        </div>
+        <div>
+          <p>{{ men.name }}</p>
+          <small style="color:#999999ad;margin-top:10px">部门：{{ men.depname?men.depname:"未知部门" }}&emsp;职位：{{ men.position?men.position:"未知部门" }}</small>
         </div>
-        <p><span>{{men.name}}</span><br><small style="color:#999">{{men.position}}</small></p>
       </div>
       <div v-if="item.team.length === 0">
         <el-empty description="暂无成员" :image-size="40"></el-empty>

src/template/menber/index.vue

@@ -1,6 +1,14 @@
 <template>
-<div> 
-	<el-input class="normal-margin" v-model="search" @keyup.native.enter="listData" suffix-icon="el-icon-search" size="small" placeholder="输入成员名称"></el-input>
+<div>
+	<!-- <el-input class="normal-margin" type="text" v-model="search" @keyup.native.enter="listData" suffix-icon="el-icon-search" size="small" placeholder="输入成员名称">
+    <div slot="prepend">
+      <el-tag type="info" size="mini" closable v-for="item in selected" :key="item.index">{{item.name}}</el-tag>
+    </div>
+  </el-input> -->
+  <div class="search_input normal-margin">
+    <el-tag style="margin:0 5px 5px 0" type="info" size="mini" closable v-for="item in selected" :key="item.index">{{item.name}}</el-tag>
+    <input class="input_panel" type="text" v-model="search" @keyup.enter="listData" placeholder="输入搜索内容">
+  </div>
 	<div class="flex-align-stretch menber__panel">
 		<div class="flex-align-center menber__item flex-between" :class="showSelelctIcon(item)?'active_menber__item':''" style="flex:1 0 auto" v-for="item in tableData" :key="item.index" @click="clickMenber(item)">
 			<div  class="flex-align-center">
@@ -34,7 +42,7 @@
 
 <script>
 export default {
-	props:['param','radio'],
+	props:['param','radio','checked'],
   data () {
     return {
       search:'',
@@ -53,6 +61,7 @@ export default {
       this.tableData = res.data
       this.total = res.total
       this.currentPage = res.pageNumber
+      // this.selected = [...this.selected,...this.checked]
     },
     handleSizeChange(val) {
       // console.log(`每页 ${val} 条`);
@@ -94,6 +103,21 @@ export default {
 <style>
 </style>
 <style scoped>
+.search_input{
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  padding: 5px 5px 0 5px;
+  border: 1px solid #f1f2f3;
+  border-radius: 5px;
+}
+.input_panel{
+  flex: 1;
+  min-width: 100px;
+  border:none;
+  outline: none;
+  margin-bottom: 5px;
+}
 .menber__item{
 	width: calc(100% - 20px);
 	padding:5px 10px;