09/24

修改登出

src/api/user.js

@@ -17,9 +17,10 @@ export function getInfo () {
   })
 }
 // 登出
-export function logout () {
+export function logout (data) {
   return request({
     url: '/api-auth/exit',
-    method: 'post'
+    method: 'post',
+    data: qs.stringify(data)
   })
 }

src/router/index.js

@@ -88,7 +88,13 @@ export const constantRoutes = [
         name: 'teamBuild',
         component: () => import('@/views/teamBuild/index'),
         meta: { title: '创建乐团' }
-      }
+      },
+      {
+        path: 'sigupList',
+        name: 'sigupList',
+        component: () => import('@/views/teamBuild/signupList'),
+        meta: { title: '乐团报名' }
+      },
     ]
   },
 

src/views/journal/journalItem.vue

@@ -31,45 +31,52 @@
       </div>
     </div>
     <div class="right">
-      <img src="@/assets/images/base/placehorder-icon.png"
-           class="header"
-           alt="">
-      <div class="info">
-        <h2>黄老师<span>【185****2109】</span></h2>
-        <p class="subMsg">发至 <span class='san'></span> <span style="margin-left:30px">我</span></p>
-        <div class="textWrap">
-          <p>审批事项: 合班</p>
-          <p>开始时间: 2019-09-01 09:00</p>
-          <p>结束时间: 2019-09-01 09:00</p>
-          <p>备注:班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少</p>
-        </div>
-        <div class="timeline">
-          <el-timeline>
-            <el-timeline-item placement='center'>
-              <div class='timeMsg'>
-                <p class="name">我</p>
-                <p class='status'>审批中</p>
-              </div>
-              <div slot='dot'>
-                <img class='dot'
-                     src="@/assets/images/base/clock.png"
-                     alt="">
-              </div>
-            </el-timeline-item>
-            <el-timeline-item placement='center'>
-              <div class='timeMsg'>
-                <p class="name">我</p>
-                <p class='status'>审批中</p>
-              </div>
-              <div slot='dot'>
-                <img class='dot'
-                     src="@/assets/images/base/clock.png"
-                     alt="">
-              </div>
-            </el-timeline-item>
-          </el-timeline>
+      <div class="rightWrap">
+        <img src="@/assets/images/base/placehorder-icon.png"
+             class="header"
+             alt="">
+        <div class="info">
+          <h2>黄老师<span>【185****2109】</span></h2>
+          <p class="subMsg">发至 <span class='san'></span> <span style="margin-left:30px">我</span></p>
+          <div class="textWrap">
+            <p>审批事项: 合班</p>
+            <p>开始时间: 2019-09-01 09:00</p>
+            <p>结束时间: 2019-09-01 09:00</p>
+            <p>备注:班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少班人数较少较少</p>
+          </div>
+          <div class="timeline">
+            <el-timeline>
+              <el-timeline-item placement='center'>
+                <div class='timeMsg'>
+                  <p class="name">我</p>
+                  <p class='status'>审批中</p>
+                </div>
+                <div slot='dot'>
+                  <img class='dot'
+                       src="@/assets/images/base/clock.png"
+                       alt="">
+                </div>
+              </el-timeline-item>
+              <el-timeline-item placement='center'>
+                <div class='timeMsg'>
+                  <p class="name">我</p>
+                  <p class='status'>审批中</p>
+                </div>
+                <div slot='dot'>
+                  <img class='dot'
+                       src="@/assets/images/base/clock.png"
+                       alt="">
+                </div>
+              </el-timeline-item>
+            </el-timeline>
+          </div>
+
         </div>
       </div>
+      <div class="infoFoot">
+        <div class="noBtn">拒绝</div>
+        <div class="yesBtn">同意</div>
+      </div>
     </div>
   </div>
 </template>
@@ -201,84 +208,137 @@ export default {
     }
   }
   .right {
-    padding: 18px 24px;
     display: flex;
-    flex-direction: row;
-    justify-content: flex-start;
-    width: 570px;
-    box-sizing: border-box;
+    flex-direction: column;
+    justify-content: space-between;
     border: 1px solid #e4e8eb;
     margin-left: 25px;
-    .header {
-      width: 30px;
-      height: 30px;
-      position: relative;
-      top: 7px;
-      border-radius: 50%;
-      margin-right: 12px;
-    }
-    .info {
-      position: relative;
-      h2 {
-        color: #212223;
-        font-size: 16px;
-        margin-bottom: 0px;
-        span {
-          font-size: 12px;
-          color: #444;
-        }
-      }
-      .subMsg {
+    position: relative;
+    overflow: auto;
+    .rightWrap {
+      // overflow: auto;
+      padding: 18px 24px;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      width: 570px;
+      box-sizing: border-box;
+      .header {
+        width: 30px;
+        height: 30px;
         position: relative;
-        font-size: 12px;
-        color: #444;
-        margin-bottom: 12px;
-        .san {
-          // margin-left: 110px;
-          float: left;
-          position: absolute;
-          top: 0px;
-          width: 0;
-          height: 0;
-          border-width: 5px;
-          border-style: solid;
-          border-color: transparent #909191 transparent transparent;
-          transform: rotate(180deg); /*顺时针旋转90°*/
-          margin: 0 8px;
-        }
+        top: 7px;
+        border-radius: 50%;
+        margin-right: 12px;
       }
-      .textWrap {
-        width: 316px;
-        line-height: 21px;
-        font-size: 14px;
-        color: #212223;
-        margin: 12px 0 34px;
-      }
-      .dot {
-        width: 20px;
-        height: 20px;
-      }
-      .timeMsg {
+      .info {
         position: relative;
-        top: 5px;
-        .name {
-          font-size: #444;
+        h2 {
+          color: #212223;
           font-size: 16px;
-          margin-bottom: 3px;
-          font-weight: 600;
+          margin-bottom: 0px;
+          span {
+            font-size: 12px;
+            color: #444;
+          }
         }
-        .status {
+        .subMsg {
+          position: relative;
+          font-size: 12px;
+          color: #444;
+          margin-bottom: 12px;
+          .san {
+            // margin-left: 110px;
+            float: left;
+            position: absolute;
+            top: 0px;
+            width: 0;
+            height: 0;
+            border-width: 5px;
+            border-style: solid;
+            border-color: transparent #909191 transparent transparent;
+            transform: rotate(180deg); /*顺时针旋转90°*/
+            margin: 0 8px;
+          }
+        }
+        .textWrap {
+          width: 316px;
+          line-height: 21px;
           font-size: 14px;
-          color: #62a070;
+          color: #212223;
+          margin: 12px 0 34px;
         }
-        .status.waring {
-          color: #f97215;
+        .dot {
+          width: 20px;
+          height: 20px;
         }
-        .status.end {
-          color: #aaaaaa;
+        .timeMsg {
+          position: relative;
+          top: 5px;
+          margin-left: 20px;
+          .name {
+            font-size: #444;
+            font-size: 16px;
+            margin-bottom: 3px;
+            font-weight: 600;
+          }
+          .status {
+            font-size: 14px;
+            color: #62a070;
+          }
+          .status.waring {
+            color: #f97215;
+          }
+          .status.end {
+            color: #aaaaaa;
+          }
         }
       }
     }
+    .infoFoot {
+      min-height: 60px;
+      height: 60px;
+      line-height: 60px;
+      border-top: 1px solid #e4e8eb;
+      width: 100%;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: center;
+      .noBtn {
+        cursor: pointer;
+        width: 100px;
+        height: 32px;
+        line-height: 32px;
+        color: #444;
+        border-radius: 3px;
+        border: 1px solid rgba(228, 232, 235, 1);
+        text-align: center;
+        margin-left: 70px;
+      }
+      .yesBtn {
+        cursor: pointer;
+        margin-left: 15px;
+        text-align: center;
+        width: 100px;
+        height: 32px;
+        line-height: 32px;
+        background: rgba(249, 114, 21, 1);
+        border-radius: 3px;
+        color: #fff;
+      }
+      // width: 570px;
+    }
   }
 }
+.el-timeline-item__dot {
+  width: 20px;
+  height: 20px;
+}
+.el-timeline-item {
+  min-height: 80px !important;
+}
+.el-timeline-item__tail {
+  left: 9px !important;
+}
 </style>

src/views/teamBuild/components/teamSoundMoney.vue

@@ -115,9 +115,14 @@
       </el-table>
       <div class="floor">
         <div class="remove">删除</div>
-        <div class='add'>添加</div>
+        <div class='add'
+             @click="dialogTableVisible = true">添加</div>
       </div>
     </div>
+    <el-dialog title="声部选择"
+               :visible.sync="dialogTableVisible">
+
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -125,6 +130,7 @@ import store from '@/store'
 export default {
   data () {
     return {
+      dialogTableVisible: true,
       tableList: [{
         sound: '长笛',
         jihua: '10',
@@ -174,6 +180,17 @@ export default {
 .el-select__tags .el-tag__close.el-icon-close {
   display: inline-block;
 }
+// .el-dialog__header {
+//   padding: 0 32px !important;
+//   height: 40px;
+//   line-height: 40px;
+//   background-color: #14928a;
+
+//   .el-dialog__title {
+//     color: #fff;
+//     font-size: 16px;
+//   }
+// }
 .sound-container {
   .topMsg {
     display: flex;

src/views/teamBuild/signupList.vue

@@ -0,0 +1,142 @@
+<template>
+  <div class="sigup-container">
+    <div class="topWrap">
+      <div>
+        <h2>
+          <div class="squrt"></div>
+          xxx乐团报名详情
+        </h2>
+        <div class="btnList">
+          <div class='newBand close'>停止乐团</div>
+          <div class='newBand'>开始缴费</div>
+        </div>
+      </div>
+      <p class='msg'> <img src="@/assets/images/base/clock.png"
+             alt=""> 报名中</p>
+
+    </div>
+    <div class="sigup-core">
+      <div class="left">
+        <el-table :data='leftList'
+                  :header-cell-style="{background:'#EDEEF0',color:'#444'}">
+          >
+          <el-table-column label="
+                  乐团声部"
+                           align='center'>
+          </el-table-column>
+          <el-table-column label="计划招生"
+                           align='center'>
+          </el-table-column>
+          <el-table-column label="已报名"
+                           align='center'>
+          </el-table-column>
+        </el-table>
+      </div>
+      <div class="right">
+
+      </div>
+    </div>
+
+  </div>
+</template>
+<script>
+export default {
+  data () {
+    return {
+      leftList: []
+    }
+  }
+}
+</script>
+<style lang="scss">
+.sigup-container {
+  margin-left: 12px;
+  .topWrap {
+    padding: 18px 58px;
+    height: 136px;
+    background-color: #fff;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    .msg {
+      text-align: right;
+      color: #f97215;
+      font-size: 32px;
+      font-weight: bold;
+      padding-top: 30px;
+      box-sizing: border-box;
+      img {
+        width: 36px;
+        height: 36px;
+        position: relative;
+        top: 5px;
+        margin-right: 8px;
+      }
+    }
+    h2 {
+      height: 48px;
+      line-height: 48px;
+      position: relative;
+      // padding-left: 30px;
+      font-size: 32px;
+      font-weight: 600;
+      margin-bottom: 10px;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: center;
+      .term {
+        height: 32px;
+        line-height: 32px;
+        border-radius: 24px;
+        width: 100px;
+        color: #14928a;
+        border: 1px solid rgba(20, 146, 138, 1);
+        font-size: 14px;
+        text-align: center;
+        margin-right: 12px;
+        &:nth-child(1) {
+          margin-left: 47px;
+        }
+      }
+      .term.active {
+        color: #fff;
+        background-color: #14928a;
+      }
+      .squrt {
+        position: absolute;
+        left: -25px;
+        top: 8px;
+        height: 34px;
+        width: 8px;
+        background-color: #14928a;
+      }
+    }
+    .btnList {
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: center;
+      div {
+        margin-right: 15px;
+      }
+    }
+    .newBand.close {
+      background-color: #777;
+      border: 1px solid #777;
+    }
+  }
+  .sigup-core {
+    margin-top: 12px;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    .left {
+      width: 304px;
+      background-color: #fff;
+      height: 80vh;
+      overflow: auto;
+    }
+  }
+}
+</style>