no message

src/components/FinancialModule/OpCommission/OPCommissionDetail.vue

@@ -187,6 +187,7 @@
 
               <li style="position: fixed;right: 0;top: 51px;">
                   <input type="button" class="normalBtn" value="导出" @click="exportExcel">
+                  <input type="button" class="hollowFixedBtn" value="团队奖励明细" @click="objNew.EmployeeId=0,objNew.PeriodsId=0,isRewardDetail=true">
               </li>
 
           </ul>
@@ -196,8 +197,8 @@
               <th>公司</th>
               <th>部门</th>
               <th>员工姓名</th>
-              <th>负责团数</th>
-              <th>额外奖励</th>
+              <!-- <th>负责团数</th> -->
+              <th>团数奖励</th>
               <th>总提成</th>
               <th>出团公司提成</th>
               <th>期数</th>
@@ -208,8 +209,14 @@
               <td>{{item.BranchName}}</td>
               <td>{{item.DeptName}}</td>
               <td>{{item.UserName}}</td>
-              <td>{{item.PeopleNum?item.PeopleNum:'-'}}</td>
-              <td>{{item.PeopleMoney?item.PeopleMoney:'-'}}</td>
+              <!-- <td>{{item.PeopleNum?item.PeopleNum:'-'}}</td> -->
+              <td>
+                <span style="color: #409EFF;cursor: pointer;"
+                @click="objNew=item,objNew.PeriodsId=msg.PeriodsId,isRewardDetail=true">
+                  {{item.PeopleMoney?item.PeopleMoney:'-'}}
+                </span>
+                <!-- <span v-else>-</span> -->
+              </td>
               <td>{{item.TotalCMoney?item.TotalCMoney:'-'}}</td>
               <td>{{item.BranchCommission?item.BranchCommission:'-'}}</td>
               <td>{{item.Periods}}</td>
@@ -231,17 +238,20 @@
       <el-pagination background @current-change="handleCurrentChange" :current-page.sync="msg.pageIndex"
           layout="total,prev, pager, next, jumper" :page-size='msg.pageSize' :total='total'>
       </el-pagination>
+      <RewardDetail v-if="isRewardDetail" :obj="objNew" @close="isRewardDetail=false"></RewardDetail>
   </div>
 </template>
 
 <script>
   import moment from "moment"
+  import RewardDetail from "./RewardDetail";
   export default {
       components:{
-
+        RewardDetail
       },
       data() {
           return {
+              isRewardDetail: false,
               objNew:{},
               outerVisible:false,//提成比例弹窗
               Month: moment().format("YYYY-MM"),

src/components/FinancialModule/OpCommission/RewardDetail.vue

+<template>
+  <el-dialog title="团数奖励明细" width="1100px" :visible.sync="isShow" center
+  @close="$emit('close')">
+    <div v-loading="loading">
+      <div v-for="(item,index) in dataList" :key="index" class="dataList-box">
+        <div class="dataList-heade">
+          <div>月份：<span>{{item.Month}}</span></div>
+          <div>总团数：<span>{{item.TravelNum}}</span></div>
+          <div>
+            <span :class="[item.State==1?'groupTourOrder_count_green':
+            'groupTourOrder_count_yellow']">{{item.State==1?'已发放':'未发放'}}</span></div>
+          <div>总奖励金额：<span>{{item.Money}}</span></div>
+          <div>发放日期：<span>{{item.Periods?item.Periods:'-'}}</span></div>
+        </div>
+        <el-table
+        :data="item.DetailList"
+        style="width: 100%">
+          <el-table-column
+          prop="Name"
+          label="线路" width="80"></el-table-column>
+          <el-table-column
+          prop="Money"
+          label="奖励金额" width="80"></el-table-column>
+          <el-table-column
+          prop="TravelNum"
+          label="当月团数" width="80"></el-table-column>
+        <el-table-column label="团列表">
+          <template slot-scope="scope">
+            <div v-for="(items,indexs) in scope.row.newTravelList" :key="indexs"
+            class="DetailList-form">
+              <div class="DetailList-right">
+                <div v-if="indexs==0" class="right-title">
+                  <span>团号</span>
+                  <span>团队状态</span>
+                  <span>类型</span>
+                  <span>结团日期</span>
+                </div>
+                <div>
+                  <span @click="goDetails(items)"
+                  style="color: #409EFF;cursor: pointer;">
+                  {{items.TCNUM}} ({{items.TCID}})
+                  </span>
+                  <span>{{items.StatusName}}</span>
+                  <span>{{items.TeamTypeName}}</span>
+                  <span>{{items.OutGroupAuditDate}}</span>
+                </div>
+              </div>
+              <more @change="ViewMore(scope.row,indexs)" :upIcon="scope.row.upIcon"></more>
+            </div>
+          </template>
+          </el-table-column>
+          <template slot="append" >
+          </template>
+      </el-table>
+      </div>
+      <div v-if="dataList&&dataList.length==0" style="text-align: center;">暂无数据</div>
+    </div>
+
+
+    <div slot="footer" class="dialog-footer">
+      <el-pagination background @current-change="handleCurrentChange"
+    :current-page.sync="msg.pageIndex"
+          layout="total,prev, pager, next, jumper" :page-size='msg.pageSize' :total='total'>
+      </el-pagination>
+      <button class="hollowFixedBtn" @click="$emit('close')">{{$t('pub.cancelBtn')}}</button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+  import more from '../../public/more.vue';
+export default {
+  props: ["obj","type"],
+  components: {more},
+  data() {
+    return {
+      isShow: true,
+      dataList: [],
+      loading: false,
+      total: 0,
+      msg:{
+        pageIndex: 1,
+        pageSize: 3,
+        EmpId: 0,
+        PeriodsId: 0
+      }
+    }
+  },
+  watch: {
+    obj: {
+      handler(newValue,onldValue) {
+        this.msg.EmpId = newValue.EmployeeId?newValue.EmployeeId:0
+        this.msg.PeriodsId = newValue.PeriodsId?newValue.PeriodsId:0
+        this.isShow = true
+        this.getList()
+      },
+      deep:true,
+      immediate: true
+    },
+  },
+  mounted() {
+    if(this.obj){
+      this.msg.EmpId = this.obj.EmployeeId?this.obj.EmployeeId:0
+      this.msg.PeriodsId = this.obj.PeriodsId?this.obj.PeriodsId:0
+      this.isShow = true
+      this.getList()
+    }
+  },
+  methods: {
+    goDetails(row){
+        let name
+        if(row.TeamType==0){
+          name = 'TravelControlList'
+        }else if(row.TeamType==1){
+          name = 'TravelControlListSale'
+        }else if(row.TeamType==2){
+          name = 'oneDayTrip'
+        }
+        this.$emit('close')
+        this.$router.push({
+          path: name,
+          query: {
+            TCID: row.TCID,
+            // id: row.TCID,
+            tcmun: row.TCNUM,
+              blank: 'y',
+              tab: ''
+            }
+          });
+    },
+    ViewMore(x,index){
+        x.upIcon = !x.upIcon
+        if(x.upIcon){
+          x.newTravelList = JSON.parse(JSON.stringify(x.TravelList))
+        }else{
+          x.newTravelList = []
+          x.TravelList.forEach((y,index)=>{
+            if(index<1){
+              x.newTravelList.push(y)
+            }
+          })
+        }
+
+      },
+    handleCurrentChange(val) {
+      this.msg.pageIndex = val;
+      this.getList();
+    },
+    //获取数据
+    getList() {
+      this.loading = true;
+      this.apipost(
+          "opcommission_GetEmpAwardPageList",
+          this.msg,
+          res => {
+              this.loading = false;
+              if (res.data.resultCode == 1) {
+                let data = res.data.data.pageData
+                let arrList = function(arr){
+                  arr.forEach(x=>{
+                    x.upIcon = false
+                    x.newTravelList = []
+                  })
+                }
+                data.forEach(x=>{
+                  arrList(x.DetailList)
+                })
+                this.dataList = data;
+                this.dataList.forEach(x=>{
+                  x.DetailList.forEach((y,index)=>{
+                    y.newTravelList = []
+                    y.TravelList.forEach((z,indexs)=>{
+                      if(indexs<1){
+                        y.newTravelList.push(z)
+                      }
+                    })
+                  })
+                })
+                this.total = res.data.data.count;
+              } else {
+                  this.Error(res.data.message);
+              }
+          },
+          null
+      );
+   },
+  }
+}
+</script>
+
+<style scoped>
+  .dataList-box{
+    background: #F2F2F2;
+    padding: 10px;
+    margin-bottom: 10px;
+    border-radius:5px ;
+  }
+.dataList-heade{
+  display: flex;
+  padding: 10px 0;
+}
+.dataList-heade div{
+  margin-right: 15px;
+  font-size: 14px;
+}
+.dataList-heade div span{
+  font-size: 13px;
+  font-weight: bold;
+}
+.DetailList-form{
+  display: flex;
+  justify-content: space-between;
+}
+.DetailList-right{
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+}
+.right-title{
+  font-size: 14px;
+  font-weight: bold;
+  color: gray;
+}
+.DetailList-right div{
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.DetailList-right div span{
+  flex: 0 0 25%;
+}
+/deep/.el-table th.el-table__cell{
+  background: #EBEEF5 !important;
+}
+</style>