kehui/kehui-oa-front/src/pages/projectManagements/weekly/ExpenseClaimApply.vue

<template>
  <div id="content-container" :class="{'expand-right': expandRight}">
    <page-loading :show="pageLoading"></page-loading>
    <!--Page Title-->
    <div id="page-title">
      <h1 class="page-header text-overflow">周报填报</h1>
    </div>
    <!--End page title-->

    <!--Breadcrumb-->
    <!--<ol class="breadcrumb">-->
    <!--<li><a href="#">Home</a></li>-->
    <!--<li><a href="#">Layouts</a></li>-->
    <!--<li class="active">Demo</li>-->
    <!--</ol>-->
    <!--End breadcrumb-->

    <!--Page content-->
    <div class="page-content">
      <div style="margin-bottom: 10px">
        <el-button type="primary" @click="addExpApply" v-if="!isSuper">新增</el-button>
      </div>
      <data-table
        :totalColumnsData="tableColumnsData"
        :rowsData="tableRowsData"
        :showSingleOperation="tableShowSingleOperation"
        :showMultipleOperation="false"
        :canFolded="true"
        :showPageCtr="true"
        :totalPage="tableTotalPage"
        :currentPage="pageNo"
        @selectPage="tableSelectPage"
        @singleEdit="tableSingleEdit"
        @singleCheck="tableSingleCheck"
      >
      </data-table>
    </div>
    <!--End Page content-->
  </div>
</template>

<script type="text/ecmascript-6">
import routerData from '../../../../router.json'
import PageLoading from '../../../components/PageLoading.vue'
import DataForm from '../../../components/form/DataForm.vue'
import DataTable from '../../../components/DataTable.vue'
import Api from '../../../server/index.js'
import {getItem} from '../../../config/mUtils.js'

export default {
  beforeRouteEnter (to, from, next) {
    next(function (vm) {
      global.getMenuIndex(vm)
    })
  },
  data () {
    return {
      expandRight: false,
      //table单选操作
      tableShowSingleOperation: {
        show: true,
        showEdit: true,
        showDelete: true,
        showCheck: true
      },
      //分页
      pageNo: 1,
      pageSize: 10,
      tableTotalPage: 1,
      tableColumnsData: [],
      tableRowsData: [],
      isSuper: false
    }
  },
  created () {
    this.initTableColumns()
    this.init()
  },
  methods: {
    addExpApply () {
      this.$router.push({name: 'AddListClaimApply'})
    },
    init () {
      let userId = getItem('userId')
      if (userId === '0') {
        this.isSuper = true
      }
      let projectWeeklyFindReq = {
        pageNo: this.pageNo,
        pageSize: this.pageSize
      }
      Api.ProjectManagements.getWeekly(projectWeeklyFindReq).then(result => {
        this.tableRowsData = []
        this.pageLoading = false
        console.log('周报填报列表', result)
        if (result.status === 0) {
          let dataList = result.data.ls
          for (let i = 0; i < dataList.length; i++) {
            this.tableRowsData.push({
              id: dataList[i].id,
              projectNo: dataList[i].projectNo,
              projectName: dataList[i].projectName,
              userName: dataList[i].userName,
              workload: dataList[i].workload,
              thisWeek: dataList[i].thisWeek,
              nextWeek: dataList[i].nextWeek,
              week: dataList[i].week
            })
            // this.pageNo=result.data.pages
            this.tableTotalPage = result.data.total
          }
          console.log('tableRowsData', this.tableRowsData)
        }
      })
      // Api.FinanceManagement.getReimburseList(this.pageNo, this.pageSize).then(result => {
      //   this.pageLoading = false;
      //   this.tableRowsData = [];
      //   if (result.status === 0) {
      //     this.isEdit = result.data.isEdit;
      //     this.tableTotalPage = result.data.total
      //     let dataList = result.data.ls;
      //     for (let i=0; i<dataList.length; i++) {
      //       let deptName = '';
      //       for (let j=0; j<dataList[i].userInfo.dept.length; j++) {
      //         deptName += dataList[i].userInfo.dept[j].orgName;
      //         if (j < dataList[i].userInfo.dept.length - 1) {
      //           deptName += '>';
      //         }
      //       }
      //       this.tableRowsData.push({
      //         status: dataList[i].status,
      //         id: dataList[i].id,
      //         userInfoName: dataList[i].userInfo.userInfoName,
      //         category: '报销',
      //         deptName: deptName
      //       })
      //     }
      //   } else {
      //     this.$message.error(`${result.msg}`);
      //   }
      // })
    },
    //初始化tableColumns
    initTableColumns () {
      this.tableColumnsData = [
        {
          label: '项目编号',
          prop: 'projectNo',
          show: true
        },
        {
          label: '项目名称',
          prop: 'projectName',
          show: true
        },
        {
          label: '员工姓名',
          prop: 'userName',
          show: true
        },
        {
          label: '工作量(人日)',
          prop: 'workload',
          show: true
        },
        {
          label: '周数',
          prop: 'week',
          show: true
        },
        {
          label: '本周进展',
          prop: 'thisWeek',
          show: true
        },
        {
          label: '下周计划',
          prop: 'nextWeek',
          show: true
        }
      ]
    },
    tableSelectPage (param) {
      this.pageNo = param
      this.init()
    },
    tableSingleCheck (index) {
      this.$router.push({
        name: 'ExpenseClaimApplyEdit',
        params: {id: this.tableRowsData[index].id}
      })
    },
    tableSingleEdit (index) {
      this.$router.push({
        name: 'ExpenseClaimApplyEdit',
        params: {id: this.tableRowsData[index].id}
      })
    }
  },
  components: {
    PageLoading, DataTable, DataForm
  }
}
</script>

<style scoped lang="less" rel="stylesheet/less">
.expand-right {
  @media (min-width: 768px) {
    padding-left: 0 !important;
  }
}

.page-content {
  padding: 15px;
}
</style>