09/23

19:36

src/App.vue

@@ -163,9 +163,9 @@ input[type="number"] {
 .m-container {
   box-sizing: border-box;
   background-color: #fff;
-  padding: 18px 60px 0;
+  padding: 18px 60px 40px;
   // height: calc(100vh- 80px) !important;
-  height: calc(100vh - 100px);
+  height: calc(100vh - 70px);
   width: 100;
   min-width: 1440px;
   overflow: auto;

src/api/user.js

@@ -1,11 +1,12 @@
 import request from '@/utils/request'
+import qs from 'qs'
 
 export function login (data) {
   return request({
     url: '/api-auth/usernameLogin',
     // url: '/user/login',
     method: 'post',
-    data
+    data: qs.stringify(data)
   })
 }
 

src/store/modules/user.js

@@ -27,10 +27,10 @@ const actions = {
     return new Promise((resolve, reject) => {
       //qs.stringify({ username: username.trim(), password: password, clientId: 'app', clientSecret: 'app' })
       // { username: username.trim(), password: password }
-      login(qs.stringify({ username: username.trim(), password: password, clientId: 'app', clientSecret: 'app' })).then(response => {
+      login({ username: username.trim(), password: password, clientId: 'system', clientSecret: 'system' }).then(response => {
         const { data } = response
         if (response.code == 200) {
-          let token = data.token_type + ' ' + data.access_token;
+          let token = data.authentication.token_type + ' ' + data.authentication.access_token;
           commit('SET_TOKEN', token)
           setToken(token)
           resolve()

src/views/journal/journalItem.vue

@@ -2,11 +2,34 @@
   <div class='infoWrap'>
     <div class="left">
       <div class="unread"> <img :src="img.boxicon"
-             alt=""> 未读消息</div>
-      <div class="read">已读消息</div>
-      <div class="recovery">回收站</div>
+             alt=""> 未读消息
+        <div class="count">84</div>
+      </div>
+      <div class="read">
+        <img :src="img.bookicon"
+             alt="">
+        已读消息</div>
+      <div class="recovery">
+        <img :src="img.trashicon"
+             alt="">
+        回收站</div>
+    </div>
+    <div class="middle">
+      <div class="msgItem">
+        <h6 class="type">审批</h6>
+        <h4 class="name">黄老师 <span class='time'>10:03</span>
+          <div class="dot"></div>
+        </h4>
+        <p class='msg'>那家纯四季花城教学总结爱喝酒收到货就暗示的看见爱上大家超级好吃就撒客户看见爱上当看见那家纯四季花城教学总结爱喝酒收到货就暗示的看见爱上大家超级好吃就撒客户看见爱上当看见</p>
+      </div>
+      <div class="msgItem active">
+        <h6 class="type">审批</h6>
+        <h4 class="name">黄老师 <span class='time'>10:03</span>
+          <div class="dot"></div>
+        </h4>
+        <p class='msg'>那家纯四季花城教学总结爱喝酒收到货就暗示的看见爱上大家超级好吃就撒客户看见爱上当看见那家纯四季花城教学总结爱喝酒收到货就暗示的看见爱上大家超级好吃就撒客户看见爱上当看见</p>
+      </div>
     </div>
-    <div class="middle"></div>
     <div class="right"></div>
   </div>
 </template>
@@ -31,15 +54,41 @@ export default {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
+  height: calc(100vh - 266px);
+  overflow: auto;
   .left {
+    padding-top: 24px;
     display: flex;
     flex-direction: column;
-    align-items: center;
+    align-items: left;
+    > div {
+      height: 26px;
+      line-height: 26px;
+      margin-top: 26px;
+      img {
+        position: relative;
+        top: 6px;
+      }
+    }
     .unread {
+      position: relative;
       img {
         width: 26px;
         height: 25px;
       }
+      .count {
+        position: absolute;
+        width: 38px;
+        height: 23px;
+        background: rgba(20, 146, 138, 0.5);
+        border-radius: 100px;
+        font-size: 12px;
+        line-height: 23px;
+        text-align: center;
+        color: #225551;
+        right: -44px;
+        top: 8px;
+      }
     }
     .read {
       img {
@@ -49,6 +98,62 @@ export default {
     }
     .recovery {
       img {
+        width: 19px;
+        height: 26px;
+      }
+    }
+  }
+  .middle {
+    width: 390px;
+    margin-left: 76px;
+    padding-top: 50px;
+    overflow: auto;
+    .msgItem {
+      padding: 16px 18px 23px 30px;
+      .type {
+        font-size: 14px;
+        color: #777;
+        font-weight: 400;
+        padding-bottom: 4px;
+      }
+      .name {
+        position: relative;
+        color: #444;
+        font-size: 16px;
+        padding-bottom: 9px;
+        clear: both;
+        .time {
+          font-weight: 400;
+          color: #aaa;
+          float: right;
+        }
+        .dot {
+          width: 7px;
+          height: 7px;
+          background-color: #f97215;
+          border-radius: 50%;
+          position: absolute;
+          left: -13px;
+          top: 4px;
+        }
+      }
+      .msg {
+        color: #444;
+        font-size: 14px;
+        line-height: 24px;
+        text-overflow: -o-ellipsis-lastline;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+      }
+    }
+    .msgItem.active {
+      background-color: #f3f4f8;
+      border-radius: 5px;
+      .msg {
+        color: #aaa;
       }
     }
   }

src/views/teamBuild/components/teamSoundMoney.vue

@@ -21,29 +21,91 @@
                          prop="jihua">
           <template slot-scope="scope">
             <div>
+              <el-input type='number'
+                        style="width:80px"
+                        size='mini'
+                        v-model="scope.row.jihua"
+                        placeholder="请输入"></el-input>
 
             </div>
           </template>
         </el-table-column>
         <el-table-column label="预计收费"
                          prop="yuji">
+          <template slot-scope="scope">
+            <div>
+              <el-input v-if='scope.row.type == 1'
+                        type='number'
+                        style="width:80px"
+                        size='mini'
+                        v-model="scope.row.jihua"
+                        placeholder="请输入"></el-input>
+              <p v-if='scope.row.type == 2'>{{scope.row.jihua}}</p>
+            </div>
+          </template>
+
         </el-table-column>
         <el-table-column label="可选乐器种类"
                          prop="zhonglei"
                          width="300">
+          <template slot-scope="scope">
+            <div>
+              <el-select v-model="scope.row.zhonglei"
+                         style="width:260px!important"
+                         multiple>
+                <el-option :label="1"
+                           :value="1"></el-option>
+                <el-option :label="2"
+                           :value="2"></el-option>
+              </el-select>
+              <p v-if='scope.row.type == 2'>{{scope.row.jihua}}</p>
+            </div>
+          </template>
+
         </el-table-column>
         <el-table-column label="乐器提供方式"
                          prop="fangshi"
                          width="180">
+          <template slot-scope="scope">
+            <div>
+              <div class="chiose"
+                   v-if='scope.row.type == 1'
+                   v-popover:popover>选择</div>
+              <p v-if='scope.row.type == 2'>{{scope.row.fangshi}}</p>
+              <el-popover ref='popover'
+                          placement="bottom"
+                          v-model="visible2">
+                <el-input placeholder="啦啦啦"
+                          v-model="scope.row.fangshi"></el-input>
+                <div style="text-align: right; margin: 0">
+                  <el-button size="mini"
+                             type="text"
+                             @click="visible2 = false">取消</el-button>
+                  <el-button type="primary"
+                             size="mini"
+                             @click="visible2 = false">确定</el-button>
+                </div>
+              </el-popover>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column label="教辅组合"
                          prop="jiaopu">
+          <template slot-scope="scope">
+            <div>
+              <div v-if='scope.row.type == 1'
+                   class="chiose">选择</div>
+              <p v-if='scope.row.type == 2'>{{scope.row.jiaopu}}</p>
+            </div>
+          </template>
         </el-table-column>
         <el-table-column label="操作">
           <template slot-scope="scope">
             <div>
-              <div>编辑</div>
-              <div>保存</div>
+              <el-button v-if='scope.row.type == 2'
+                         type="text">编辑</el-button>
+              <el-button v-if='scope.row.type == 1'
+                         type="text">保存</el-button>
             </div>
           </template>
         </el-table-column>
@@ -63,11 +125,13 @@ export default {
         sound: '长笛',
         jihua: '10',
         yuji: '10',
-        zhonglei: [1, 2],
+        zhonglei: [],
         fangshi: [1, 2],
         jiaopu: 'jiaopu1',
-        type: 1
-      }]
+        type: 1,
+        id: 1
+      }],
+      visible2: false
     }
   },
   methods: {
@@ -86,6 +150,9 @@ export default {
   background-color: #14928a;
   border-color: #14928a;
 }
+.el-select__tags .el-tag__close.el-icon-close {
+  display: inline-block;
+}
 .sound-container {
   .topMsg {
     display: flex;
@@ -93,6 +160,7 @@ export default {
     justify-content: flex-start;
     font-size: 14px;
     color: #444;
+    margin-bottom: 15px;
   }
   .floor {
     display: flex;
@@ -131,5 +199,14 @@ export default {
   .xuanze {
     width: 71px;
   }
+  .chiose {
+    width: 65px;
+    height: 24px;
+    line-height: 24px;
+    border: 1px solid rgba(151, 151, 151, 1);
+    border-radius: 12px;
+    text-align: center;
+    cursor: pointer;
+  }
 }
 </style>