ssti-CollegeManage/src/views/fundManage/makerfund.vue

<template>
  <!-- 创客资金管理 -->
  <div class="makerfund" v-loading="loading">
    <div class="pAHeader">
      <div class="pAHeader1">创客资金管理</div>
      <el-button type="primary" style="font-size: 16px;" @click="apply">创客资金申请</el-button>
    </div>
    <hr>
    <!-- 搜索框开始 -->
    <div class="selects">
      <div class="selectsBlock">
        <div class="selectLabel">项目筛选</div>
        <el-select v-model="selectInp.filter" @change="getData" placeholder="我的项目">
          <el-option label="所有项目" value=""></el-option>
          <el-option
            v-for="item in filterSelects"
            :key="item.id"
            :label="item.title"
            :value="item.id">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <div class="selectLabel">部门</div>
        <el-select v-model="selectInp.department" @change="getData" placeholder="请选择">
          <el-option label="所有部门" value=""></el-option>
          <el-option
            v-for="item in departmentSelect"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <div class="selectLabel">分类</div>
        <el-select v-model="selectInp.type" @change="getData" placeholder="请选择">
          <el-option label="所有分类" value=""></el-option>
          <el-option
            v-for="item in typeSelects"
            :key="item.value"
            :label="item.label"
            :value="item.label">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <div class="selectLabel">负责人</div>
        <el-select v-model="selectInp.leader" @change="getData" placeholder="请选择">
          <el-option label="所有负责人" value=""></el-option>
          <el-option
            v-for="(item,index) in leaderSelects"
            :key="index"
            :label="item.pro_leader"
            :value="item.pro_leader">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <div class="selectLabel">状态</div>
        <el-select v-model="selectInp.status" @change="getData" placeholder="请选择">
          <el-option label="所有状态" value=""></el-option>
          <el-option
            v-for="item in statusSelects"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </div>


    </div>
    <!-- 搜索框结束 -->

<!-- 表格开始 -->
    <div>
      <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        stripe
        class="fontSize"
        :header-cell-style="{ background: '#f2f2f2',color:'#000' }"
        @selection-change="handleSelectionChange">
        
        <el-table-column
          prop="title"
          label="项目名称"
          align="center"
          >
        </el-table-column>
        <el-table-column
          prop="pro_leader"
          align="center"
          label="负责人"
          >
        </el-table-column>
        <el-table-column
          align="center"
          prop="type"
          label="项目类型"
          >
        </el-table-column>
        <el-table-column
          prop="fund"
          align="center"
          label="申请经费(元)"
          >
        </el-table-column>
        <el-table-column
          prop="usedFund"
          align="center"
          label="实际使用(元)"
          >
        </el-table-column>
        <el-table-column
          prop="name"
          align="center"
          label="所在部门"
          >
        </el-table-column>
        <el-table-column
          prop="status"
          align="center"
          label="状态"
          >
          <template #default="scope">
            <div>
              <span v-show="scope.row.state==0">未审核</span>
              <span v-show="scope.row.state==1">未报销</span>
              <span v-show="scope.row.state==2">已报销</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="time"
          align="center"
          label="申请时间"
          >
        </el-table-column>
        <el-table-column
          prop="operation"
          align="center"
          width="370"
          label="操作"
          >
          <template #default="scope">
              <div class="operations">
                <el-button type="primary" size="mini" @click="details(scope.row.fid)">查看详情</el-button>

                <el-button type="primary" v-show="scope.row.state==0" size="mini" @click="Audit(scope.row)">审核</el-button>
                <el-button type="primary"  v-show="scope.row.state==1" class="disa" size="mini">已审核</el-button>
                <el-button type="primary"  v-show="scope.row.state==2" class="disa" size="mini">已审核</el-button>

                <el-button type="primary" class="bt1" size="mini" @click="edit(scope.row)">申请表</el-button>

                <el-button  v-show="scope.row.state==0"  class="disa" @click="endDialogShow(scope.row.fid)" type="primary"  size="mini">完结</el-button>
                <el-button  v-show="scope.row.state==1"  @click="endDialogShow(scope.row.fid)" type="primary"  size="mini">完结</el-button>
                <el-button  v-show="scope.row.state==2" class="disa" @click="endDialogShow(scope.row.fid)" type="primary" size="mini">已完结</el-button>

              </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
<!-- 表格结束 -->


    <!-- 分页 -->
    <el-pagination
      @current-change="handleCurrentChange"
      :current-page="table.currentPage"
      :page-size="table.packageSize"
      layout=" prev, pager, next"
      background
      class="paginations"
      :total="table.total">
    </el-pagination>
  <!-- 分页结束 -->
    <!-- 审核对话框开始 -->
      <el-dialog
        title="立项审核"
        :visible.sync="dialogVisible"
        width="750px"
        class="dialog"
        :before-close="init">
        <div class="diaTit1" style="margin-top: 0;">
            <div class="spans">项目名称:</div><div style="margin-right: 30px;color: #adadad;">{{ ProjectFundData.title }}</div>
            <div class="spans">项目负责人:</div><div style="color:#adadad">{{ ProjectFundData.pro_leader }}</div>
        </div>
        <div class="addDialogLogo">LOGO</div>
        <div class="diaTit1">
          <div class="spans1">所在部门</div>
          <div>
            <el-input v-model="ProjectFundData.name" disabled placeholder="信通学院"></el-input>
          </div>
        </div>

        <div class="diaTit1">
          <div class="spans1">使用经费</div>
          <div>
            <el-input v-model="ProjectFundData.usedFund" disabled></el-input>
          </div>
        </div>

        <div class="diaTit1">
          <div class="spans1">联系电话</div>
          <div>
            <el-input v-model="ProjectFundData.phone" disabled></el-input>
          </div>
        </div>

        <div class="diaTit1">
          <div class="spans1">项目类型</div>
          <div>
            <el-select v-model="ProjectFundData.type" disabled placeholder="个人创客">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>

        <!-- <div class="diaTit1">
          <div class="spans1">直接经费</div>
          <div>
            <el-select v-model="input" disabled placeholder="默认字段">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div> -->

        <div class="diaTit1">
          <div class="diaTit5">
            <div class="spans1">预算</div>
            <div>
              <el-input v-model="ProjectFundData.fund" placeholder="6000"></el-input>
            </div>
          </div>

          <div class="diaTit5">
            <div class="spans1">已支付</div>
            <div>
              <el-input v-model="ProjectFundData.usedFund" disabled placeholder="-"></el-input>
            </div>
          </div>
          <div class="diaTit5">
            <div class="spans1">余额</div>
            <div>
              <el-input :value="ProjectFundData.fund - ProjectFundData.usedFund" placeholder="6000"></el-input>
            </div>
          </div>
        </div>
        
        <div class="diaTit1">
          <div class="spans1" style="position: relative;top:-20px">事由</div>
          <el-input
            type="textarea"
            :rows="3"
            resize="none"
            style="width: 100%;"
            placeholder="默认字段"
            v-model="textarea">
          </el-input>
        </div>

        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="auditPass" class="AllDialogBtn">审核通过</el-button>
          <el-button @click="init" class="AllDialogBtn">取消</el-button>
        </div>
      </el-dialog>
    <!-- 审核对话框结束 -->


    <!-- 立项撤回提交对话框开始 -->
    <!-- <div class="dialog">
      <el-dialog
        title="立项撤回提交"
        :visible.sync="revocation"
        width="900px"
        :before-close="init">
        <div class="diaTit1" style="margin-top: 0;">
            <div class="spans">项目名称:</div><div style="margin-right: 30px;color: #adadad;">人工智能分链机器</div>
            <div class="spans">项目负责人:</div><div style="color:#adadad">徐晓霞</div>
        </div>

        <div class="diaTit1">
          <div class="spans1">所在部门</div>
          <div>
            <el-input v-model="input" disabled placeholder="信通学院"></el-input>
          </div>
        </div>

        <div class="diaTit1">
          <div class="spans1">使用经费</div>
          <div>
            <el-input v-model="input" disabled placeholder="6000"></el-input>
          </div>
        </div>

        <div class="diaTit1">
          <div class="spans1">联系电话</div>
          <div>
            <el-input v-model="input" disabled placeholder="13854449525"></el-input>
          </div>
        </div>

        <div class="diaTit1">
          <div class="spans1">项目类型</div>
          <div>
            <el-select v-model="value" disabled placeholder="个人创客">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>

        <div class="diaTit1">
          <div class="diaTit5">
            <div class="spans1">预算</div>
            <div>
              <el-input v-model="input" placeholder="6000"></el-input>
            </div>
          </div>

          <div class="diaTit5">
            <div class="spans1">已支付</div>
            <div>
              <el-input v-model="input" disabled placeholder="-"></el-input>
            </div>
          </div>
          <div class="diaTit5">
            <div class="spans1">余额</div>
            <div>
              <el-input v-model="input" placeholder="6000"></el-input>
            </div>
          </div>
        </div>
      
        <hr style="margin: 40px;width: 90%;">
        <div class="diaTit1">
          <div class="spans1" style="position: relative;top:-20px">撤回意见</div>
          <el-input
            type="textarea"
            :rows="4"
            resize="none"
            style="width: 100%;"
            placeholder="请输入内容"
            v-model="textarea">
          </el-input>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="init" class="AllDialogBtn">审核通过</el-button>
          <el-button @click="init" class="AllDialogBtn">取消</el-button>
        </div>
      </el-dialog>
    </div> -->
    <!-- 立项撤回提交对话框结束 -->

    <!-- 完结对话框开始 -->
    <el-dialog
      title="提示"
      :visible.sync="dialogVisible1"
      width="600px"
      class="pageSubmitData">
      <div class="addDialogLogo">LOGO</div>
      <div class="deleteContent">确定完结?</div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="confirmEnd" class="AllDialogBtn">确认完结</el-button>
        <el-button @click="dialogVisible1=false" class="AllDialogBtn">取消</el-button>
      </span>
    </el-dialog>
<!-- 完结对话框结束-->


      <!-- 生成表单对话框开始 -->
      <el-dialog
          title="表单"
          :visible.sync="createFromDialog"
          width="60%"
          style="top: -150px;"
          class="createFromDialogSty"
          :before-close="init">
          <div class="addDialogLogo">LOGO</div>
          <div class="deleteContent">
            <table class="tableStyle" width="100%" border="1">
                <caption style="height: 40px;font-size: 22px;">学校创客专项资金使用申请表（单位：元）</caption>
                <caption style="height: 30px;text-align: left;">
                    <div style="display: flex;">
                        <div style="margin-right: 10px;margin-top: -5px;"> 项目类型:</div>
                        <el-radio-group disabled v-model="selects.projectType">
                          <el-radio label="创客空间">创客空间</el-radio>
                          <el-radio label="创客实践室">创客实践室</el-radio>
                          <el-radio label="个人创客">个人创客</el-radio>
                          <el-radio label="创客活动">创客活动</el-radio>
                        </el-radio-group>
                    </div>
                    
                </caption>
                <caption style="height: 30px;text-align: left;">项目名称:<span style="margin-left:30%;font-weight: bold;font-size: 16px;">{{ residue.PName }}</span></caption>
                <tr>
                    <td>序号</td>
                    <td>经济支出类别(A)</td>
                    <td>预算</td>
                    <td>已支付</td>
                    <td>本次申请</td>
                    <td>余额</td>
                    <td style="width: 20%;">事由</td>
                </tr>
                <tr>
                    <td>01</td>
                    <td style="text-align: left;">一.经费支出</td>
                    <td>{{ AllFund.budget }}</td>
                    <td>{{ AllFund.expended }}</td>
                    <td>{{ AllFund.application }}</td>
                    <td>{{ AllFund.surplus }}</td>
                    <td style="width: 20%;"></td>
                </tr>
                <tr>
                    <td>02</td>
                    <td style="text-align: left;">(一)直接费用</td>
                    <td>{{ IndirectFunding.budget }}</td>
                    <td>{{ IndirectFunding.expended }}</td>
                    <td>{{IndirectFunding.application}}</td>
                    <td>{{ IndirectFunding.surplus }}</td>
                    <td style="width: 20%;"></td>
                </tr>
                <tr>
                    <td>03</td>
                    <td style="text-align: left;">小型仪器设备费</td>
                    <td>{{ directData.facility==0?'':directData.facility }}</td>
                    <td>{{ usedDirectData.facility==0?'':usedDirectData.facility }}</td>
                    <td>{{ applicationDirectData.facility==0?'':applicationDirectData.facility }}</td>
                    <td>{{ directData.facility-usedDirectData.facility-applicationDirectData.facility }}</td>
                    <td style="width: 20%;">{{ directDataReason.reason }}</td>
                </tr>
                <tr>
                    <td>04</td>
                    <td style="text-align: left;">材料费</td>
                    <td>{{ directData.cl==0?'':directData.cl }}</td>
                    <td>{{ usedDirectData.cl==0?'':usedDirectData.cl }}</td>
                    <td>{{ applicationDirectData.cl==0?'':applicationDirectData.cl }}</td>
                    <td>{{ directData.cl-usedDirectData.cl-applicationDirectData.cl }}</td>
                    <td style="width: 20%;">{{ directDataReason.reason1 }}</td>
                </tr>
                <tr>
                    <td>05</td>
                    <td style="text-align: left;">测试化验加工费</td>
                    <td>{{ directData.jg==0?'':directData.jg }}</td>
                    <td>{{ usedDirectData.jg==0?'':usedDirectData.jg }}</td>
                    <td>{{ applicationDirectData.jg==0?'':applicationDirectData.jg }}</td>
                    <td>{{ directData.jg-usedDirectData.jg-applicationDirectData.jg }}</td>
                    <td style="width: 20%;">{{ directDataReason.reason2 }}</td>
                </tr>
                <tr>
                    <td>06</td>
                    <td style="text-align: left;">项目协作费</td>
                    <td>{{ directData.xz==0?'':directData.xz }}</td>
                    <td>{{ usedDirectData.xz==0?'':usedDirectData.xz }}</td>
                    <td>{{ applicationDirectData.xz==0?'':applicationDirectData.xz }}</td>
                    <td>{{ directData.xz-usedDirectData.xz-applicationDirectData.xz }}</td>
                    <td style="width: 20%;">{{ directDataReason.reason3 }}</td>
                </tr>
                <tr>
                    <td>07</td>
                    <td style="text-align: left;">其他支出</td>
                    <td>{{ directData.qt==0?'':directData.qt }}</td>
                    <td>{{ usedDirectData.qt==0?'':usedDirectData.qt }}</td>
                    <td>{{ applicationDirectData.qt==0?'':applicationDirectData.qt }}</td>
                    <td>{{ directData.qt- usedDirectData.qt-applicationDirectData.qt}}</td>
                    <td style="width: 20%;">{{ directDataReason.reason4 }}</td>
                </tr>
                <tr>
                    <td>08</td>
                    <td style="text-align: left;">(二)间接费用</td>
                    <td>{{ Expenditure['budget'] }}</td>
                    <td>{{ Expenditure['expended'] }}</td>
                    <td>{{ Expenditure['application'] }}</td>
                    <td>{{ Expenditure['surplus'] }}</td>
                    <td style="width: 20%;"></td>
                </tr>
                <tr>
                    <td>03</td>
                    <td style="text-align: left;">项目成果鉴定费</td>
                    <td>{{ indirectData.facility==0?'':indirectData.facility }}</td>
                    <td>{{ usedInDirectData.facility==0?'':usedInDirectData.facility }}</td>
                    <td>{{ applicationInDirectData.facility==0?'':applicationInDirectData.facility }}</td>
                    <td>{{ indirectData.facility-usedInDirectData.facility-applicationInDirectData.facility }}</td>
                    <td style="width: 20%;">{{ indirectDataReason.reason }}</td>
                </tr>
                <tr>
                    <td>04</td>
                    <td style="text-align: left;">参展参赛费</td>
                    <td>{{ indirectData.cl==0?'':indirectData.cl }}</td>
                    <td>{{ usedInDirectData.cl==0?'':usedInDirectData.cl }}</td>
                    <td>{{ applicationInDirectData.cl==0?'':applicationInDirectData.cl }}</td>
                    <td>{{ indirectData.cl-usedInDirectData.cl-applicationInDirectData.cl }}</td>
                    <td style="width: 20%;">{{ indirectDataReason.reason1 }}</td>
                </tr>
                <tr>
                    <td>05</td>
                    <td style="text-align: left;">创客交流活动费</td>
                    <td>{{ indirectData.jg==0?'':indirectData.jg }}</td>
                    <td>{{ usedInDirectData.jg==0?'':usedInDirectData.jg }}</td>
                    <td>{{ applicationInDirectData.jg==0?'':applicationInDirectData.jg }}</td>
                    <td>{{ indirectData.jg-usedInDirectData.jg-applicationInDirectData.jg }}</td>
                    <td style="width: 20%;">{{ indirectDataReason.reason2 }}</td>
                </tr>
                <tr>
                    <td>06</td>
                    <td style="text-align: left;">知识产权事务费</td>
                    <td>{{ indirectData.xz==0?'':indirectData.xz }}</td>
                    <td>{{ usedInDirectData.xz==0?'':usedInDirectData.xz }}</td>
                    <td>{{ applicationInDirectData.xz==0?'':applicationInDirectData.xz }}</td>
                    <td>{{ indirectData.xz-usedInDirectData.xz-applicationInDirectData.xz }}</td>
                    <td style="width: 20%;">{{ indirectDataReason.reason3 }}</td>
                </tr>
                <tr>
                    <td>07</td>
                    <td style="text-align: left;">其他支出</td>
                    <td>{{ indirectData.qt==0?'':indirectData.qt }}</td>
                    <td>{{ usedInDirectData.qt==0?'':usedInDirectData.qt }}</td>
                    <td>{{ applicationInDirectData.qt==0?'':applicationInDirectData.qt }}</td>
                    <td>{{ indirectData.qt-usedInDirectData.qt-applicationInDirectData.qt }}</td>
                    <td style="width: 20%;">{{ indirectDataReason.reason4 }}</td>
                </tr>
                <!-- <tr v-for="(item,index) in items" :key="index">
                    <td>{{ index+1 }}</td>
                    <td style="text-align: left;">{{ item.fromSort }}</td>
                    <td>{{ item.fromBudget }}</td>
                    <td>{{ item.fromUsed }}</td>
                    <td>{{ item.fromApp }}</td>
                    <td>{{ item.fromBalance }}</td>
                    <td style="width: 20%;">{{ item.fromReason }}</td>
                </tr> -->
                <tr>
                    <td style="height: 80px;">备注</td>
                    <td colspan="6" style="text-align:left;">{{ residue.reason }}</td>
                </tr>
            </table>
          </div>
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitCreateFrom"  class="AllDialogBtn">生成表单</el-button>
            <el-button @click="createFromDialog = false" class="AllDialogBtn" size="small">取消</el-button>
          </span>
        </el-dialog>
      <!-- 生成表单对话框结束 -->

  </div>
</template>

<script>
import downloadFile from '@/components/tool/downloadFile.js';
import getExcel from "@/components/tool/getExcel";

    export default {
      data() {
        return {
          loading:false,
          ProjectFundData:{},
          projectFundState:'',
          dialogVisible1:false,
          dialogVisible:false,         //立即审核
          revocation:false,            //撤回
          createFromDialog:false,  //生成表单
          selects:{             //所选名称，类型id
                projectName:'',
                projectType:''
          },
          projectFilter:[],    //项目名称
            projectType:[     //项目类型
                {
                    id:1,
                    name:'创客空间'
                },
                {
                    id:2,
                    name:'创客实践室'
                },
                {
                    id:3,
                    name:'个人创客'
                },
                {
                    id:4,
                    name:'创客活动'
                },
            ],      
            directFundBlock:[   //直接经费
                {
                    directFundData:'',
                    directFundSelects:[
                        {
                            value:1,
                            label:'小型仪器设备费'
                        },
                        {
                            value:2,
                            label:'材料费'
                        },
                        {
                            value:3,
                            label:'测试化验加工费'
                        },
                        {
                            value:4,
                            label:'项目协作费'
                        },
                        {
                            value:5,
                            label:'其他支出'
                        },
                    ],
                    budget:'',         //预算
                    usedFund:'',       //已使用
                    apply:'',          //本次申请
                    reason:''          //理由
                }
            ], 
            newDirectFundBlock:{     //添加直接经费
                directFundData:'',
                directFundSelects:[
                        {
                            value:1,
                            label:'小型仪器设备费'
                        },
                        {
                            value:2,
                            label:'材料费'
                        },
                        {
                            value:3,
                            label:'测试化验加工费'
                        },
                        {
                            value:4,
                            label:'项目协作费'
                        },
                        {
                            value:5,
                            label:'其他支出'
                        },
                ],
                budget:'',         //预算
                usedFund:'',       //已使用
                apply:'',          //本次申请
                reason:''          //理由
            },

            indirectFundBlock:[    //间接经费
                {
                    indirectFundData:'',
                    indirectFundSelects:[
                        {
                            value:1,
                            label:'项目成功鉴定费'
                        },
                        {
                            value:2,
                            label:'参展参赛费'
                        },
                        {
                            value:3,
                            label:'创客交流活动费'
                        },
                        {
                            value:4,
                            label:'知识产权事务费'
                        },
                        {
                            value:5,
                            label:'其他支出'
                        },
                    ],
                    budget:'',         //预算
                    usedFund:'',       //已使用
                    apply:'',          //本次申请
                    reason:''          //理由
                }
            ], 
            newIndirectFundBlock:{    //添加间接经费
                indirectFundData:'',
                indirectFundSelects:[
                        {
                            value:1,
                            label:'项目成功鉴定费'
                        },
                        {
                            value:2,
                            label:'参展参赛费'
                        },
                        {
                            value:3,
                            label:'创客交流活动费'
                        },
                        {
                            value:4,
                            label:'知识产权事务费'
                        },
                        {
                            value:5,
                            label:'其他支出'
                        },
                ],
                budget:'',         //预算
                usedFund:'',       //已使用
                apply:'',          //本次申请
                reason:''          //理由
            },
            

            residue:{                 //其他
                    PName:"",//项目名称
                    elseReason:'',
                    budget:'',
                    usedFund:'',
                    reason:'',
                }
            ,
            directData:{     //直接经费预算
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            },
            directDataReason:{     //直接经费理由
                reason:'',
                reason1:'',
                reason2:'',
                reason3:'',
                reason4:''
            },
            usedDirectData:{     //直接经费已支出
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            },
            applicationDirectData:{    //直接经费本次申请
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            },
            indirectData:{     //间接经费预算
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            },
            indirectDataReason:{   //间接理由
                reason:'',
                reason1:'',
                reason2:'',
                reason3:'',
                reason4:''
            },
            usedInDirectData:{     //间接经费已支出
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            },
            applicationInDirectData:{   //间接经费本次申请
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            },
            DirectFunding:{ //直接经费汇总
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            },
            IndirectFunding:{//间接经费汇总
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            },
            Expenditure:{//经费支出汇总
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            },
            AllFund:{ //经费支出
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            },
          textarea:'',  //立项审核事由
          input:'',
          value:'',
          options:[],
          status:'',
          table:{   // 分页数据
            total:0,
            packageSize:8,
            currentPage:1
          },   
          filterSelects:[],        
          departmentSelect:[],
          typeSelects:[
            {
              value:0,
              label:'个人创客'
            },
            {
              value:1,
              label:'活动创客'
            },
            {
              value:2,
              label:'创客空间'
            },
            {
              value:3,
              label:'创客实践室'
            },
          ],
          leaderSelects:[],
          statusSelects:[
            {
              value:0,
              label:'未审核'
            },
            {
              value:1,
              label:'已审核'
            },
          ],
          tableData:[         //列表
          ],
          selectInp:{    //搜索下拉框的值
            filter:'',
            department:'',
            type:'',
            leader:'',
            status:''
          }
        }
      },
      methods:{
        getAllFund(val){
          let param={
            uid:this.$store.state.userInfo.userid,
            fid:val
          }
          // console.log(param);
          this.ajax
              .get(this.$store.state.api+'/SelectMakerFundSelects',param)
              .then(res=>{
                console.log(res.data);
                  let data=res.data;
                  this.directFundBlock=JSON.parse(data[0][0].directFund);
                //   console.log(this.directFundBlock);
                  this.indirectFundBlock=JSON.parse(data[0][0].indirectFund);
                  this.residue=JSON.parse(data[0][0].elseFund);
                  this.file=JSON.parse(data[0][0].fundFile);
                  this.selects.projectName=data[0][0].courseId;
                  this.selects.projectType=data[0][0].type;
                  this.status=data[0][0].state;
                  this.fid=data[0][0].fid;
                  this.AllEquipment();
                  this.createFromDialog=true;
                //   this.projectFilter=data[1];
              },err=>{
                  console.log(err);
              })
      },
        AllEquipment(){                             //填写表单数据
           this.directFundBlock.forEach((e,i)=>{
                switch(e.directFundData)
                {
                    case 1:
                        this.directData.facility+=e.budget*1;
                        this.usedDirectData.facility+=e.usedFund*1;
                        this.directDataReason.reason=e.reason;
                        this.applicationDirectData.facility = e.apply*1
                        break;
                    case 2:
                        this.directData.cl+=e.budget*1;
                        this.usedDirectData.cl+=e.usedFund*1;
                        this.directDataReason.reason1=e.reason;
                        this.applicationDirectData.cl = e.apply*1
                        break;
                    case 3:
                        this.directData.jg=e.budget*1;
                        this.usedDirectData.jg+=e.usedFund*1;
                        this.directDataReason.reason2=e.reason;
                        this.applicationDirectData.jg = e.apply*1
                        break;
                    case 4:
                        this.directData.xz=e.budget*1;
                        this.usedDirectData.xz+=e.usedFund*1;
                        this.directDataReason.reason3=e.reason;
                        this.applicationDirectData.xz = e.apply*1
                        break;
                    case 5:
                        this.directData.qt=e.budget*1;
                        this.usedDirectData.qt+=e.usedFund*1;
                        this.directDataReason.reason4=e.reason;
                        this.applicationDirectData.qt = e.apply*1
                        break;
                }
           })
           this.indirectFundBlock.forEach((e,i)=>{
                switch(e.indirectFundData)
                {
                    case 1:
                        this.indirectData.facility+=e.budget*1;
                        this.usedInDirectData.facility+=e.usedFund*1;
                        this.indirectDataReason.reason=e.reason;
                        this.applicationInDirectData.facility = e.apply*1;
                        // console.log(this.directData.facility);
                        break;
                    case 2:
                        this.indirectData.cl+=e.budget*1;
                        this.usedInDirectData.cl+=e.usedFund*1;
                        this.indirectDataReason.reason1=e.reason;
                        this.applicationInDirectData.cl = e.apply*1;
                        // console.log(this.directData.cl);
                        break;
                    case 3:
                        this.indirectData.jg=e.budget*1;
                        this.usedInDirectData.jg+=e.usedFund*1;
                        this.indirectDataReason.reason2=e.reason;
                        this.applicationInDirectData.jg = e.apply*1;
                        break;
                    case 4:
                        this.indirectData.xz=e.budget*1;
                        this.usedInDirectData.xz+=e.usedFund*1;
                        this.indirectDataReason.reason3=e.reason;
                        this.applicationInDirectData.xz = e.apply*1;
                        break;
                    case 5:
                        this.indirectData.qt=e.budget*1;
                        this.usedInDirectData.qt+=e.usedFund*1;
                        this.indirectDataReason.reason4=e.reason;
                        this.applicationInDirectData.qt = e.apply*1;
                        break;
                }
           })
        //    this.DirectFunding.budget = this.
            //直接费用全部预算
            for(let i in this.directData)this.IndirectFunding['budget']+=this.directData[i];
            //直接费用全部已支出
            for(let a in this.usedDirectData)this.IndirectFunding['expended']+=this.usedDirectData[a];
            //直接费用本次申请
            for(let b in this.applicationDirectData)this.IndirectFunding['application']+=this.applicationDirectData[b]
            //直接费用余额
            this.IndirectFunding['surplus'] = this.IndirectFunding['budget']-this.IndirectFunding['expended']-this.IndirectFunding['application']

            //间接费用
            //间接费用全部预算
            for(let c in this.indirectData)this.Expenditure['budget']+=this.indirectData[c];
            //间接费用全部已支出
            for(let d in this.usedInDirectData)this.Expenditure['expended']+=this.usedInDirectData[d];
            //间接费用本次申请
            for(let e in this.applicationInDirectData)this.Expenditure['application']+=this.applicationInDirectData[e];
            //间接费用余额
            this.Expenditure['surplus'] = this.Expenditure['budget']-this.Expenditure['expended']-this.Expenditure['application']

            //经费支出
            //预算
            this.AllFund.budget =this.Expenditure['budget']+this.IndirectFunding['budget'];
            //已支出
            this.AllFund.expended = this.Expenditure['expended']+this.IndirectFunding['expended'];
            //本次申请
            this.AllFund.application = this.Expenditure['application']+this.IndirectFunding['application']
            //余额
            this.AllFund.surplus = this.AllFund['budget']-this.AllFund['expended']-this.AllFund['application'];

            //项目名称
            this.residue.PName = this.projectFilter.filter(item=>item.id==this.selects.projectName).length!=0?this.projectFilter.filter(item=>item.id==this.selects.projectName)[0]['title']:'';

        },
        edit(val){   // 显示表单对话框
            this.directData={     //直接经费预算
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0
            },
            this.usedDirectData={     //直接经费已支出
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0
            },
            this.indirectData={     //间接经费预算
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0
            },
            this.usedInDirectData={     //间接经费已支出
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0
            },
            this.directDataReason={
                reason:'',
                reason1:'',
                reason2:'',
                reason3:'',
                reason4:''
            },
            this.IndirectFunding = { //直接经费汇总
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            },
            this.Expenditure={//经费支出汇总
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            }
            this.AllFund={ //经费支出
                budget:0,       //预算
                expended:0,     //已支付
                application:0,  //本次申请
                surplus:0,      //余额
            }
            this.applicationInDirectData={   //间接经费本次申请
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            }
            this.applicationDirectData={    //直接经费本次申请
                facility:0,
                cl:0,
                jg:0,
                xz:0,
                qt:0,
            }
            console.log(val.fid);
            this.getAllFund(val.fid)

           
        },
        submitCreateFrom(){   //生成表单
          // console.log();
            getExcel({
                PName:this.residue.PName,   //项目名称
                remarks:this.residue.reason,//备注
                type:this.selects.projectType,//项目类型
                direct:{
                    budget:this.directData,
                    expended:this.usedDirectData,
                    apply:this.applicationDirectData,
                    reason:this.directDataReason,
                },
                indirect:{
                    budget:this.indirectData,
                    expended:this.usedInDirectData,
                    apply:this.applicationInDirectData,
                    reason:this.indirectDataReason
                }
            })
            
        },
        Audit(val){          //显示审核对话框
          console.log(val);
          this.ProjectFundData=val;
          this.dialogVisible=true;
        },
        auditPass(){     //审核通过
          // console.log(111);
          let param={
            uid:this.$store.state.userInfo.userid,
            fid:this.ProjectFundData.fid,
            status:1
          }
          this.ajax
              .post(this.$store.state.api+"/UpdateMakerFundState",param)
              .then(res=>{
                  this.dialogVisible=false;
                  if (res.data) {
                      this.$message.success('审核成功')
                      this.getData()
                    }else{
                      this.$message.error('审核失败')
                    }
              },err=>{
                console.log(err);
              })
        },
        endDialogShow(val){      //完结对话框显示
            this.dialogVisible1=true
            this.projectFundState=val
            console.log(val);
        },
        confirmEnd(){        //确定完结
          let param={
            uid:this.$store.state.userInfo.userid,
            fid:this.projectFundState,
            status:2
          }
          console.log(param);
          this.ajax
              .post(this.$store.state.api+"/UpdateMakerFundState",param)
              .then(res=>{
                console.log(res);
                  this.dialogVisible1=false
                  if (res.data) {
                      this.$message.success('完结成功')
                      this.getData()
                    }else{
                      this.$message.error('完结失败')
                    }
              },err=>{
                console.log(err);
              })
        },
       
        handleCurrentChange(val) {   //当页数发生改变的时候调用获取列表数据请求
          // console.log(`当前页: ${val}`);
          this.table.currentPage=val
          this.getData()
        },
        getData(){
          this.loading = true;
            let param={
              uid:this.$store.state.userInfo.userid,
              filter:this.selectInp.filter,
              department:this.selectInp.department,
              type:this.selectInp.type,
              leader:this.selectInp.leader,
              status:this.selectInp.status,
              page:this.table.currentPage,
              lim:this.table.packageSize
            }
            this.ajax
                .get(this.$store.state.api+'/SelectMakerFund',param)
                .then(res=>{
                  let data=res.data;
                  if (data[0].length==0 && data[4][0]['total'] != 0) {
                    this.table.currentPage=1
                    this.getData()
                  }
                  // console.log(data);
                  this.tableData=data[0];
                  this.filterSelects=data[1];
                  this.departmentSelect=data[2];
                  this.leaderSelects=data[3];
                  this.table.total=data[4][0].total
                  this.loading = false;
                },err=>{
                  console.log(err);
                })
        },
        // edit(val){
        //   console.log(val);
        //   this.createFromDialog=true
        //   this.getAllFund(val.fid)
        //   // downloadFile('/file/附件 5 ：学校创客专项资金使用申请表.xlsx',"学校创客专项资金使用申请表.xlsx",(_b)=>this.loading = _b);
        // },
        handleSelectionChange(val) {     //批量选择
          this.multipleSelection = val;
        },
        apply(){              //创客资金申请跳转界面
          this.$router.push('/makerfundApply')
        },
        init(){         
          this.dialogVisible=false
          this.createFromDialog=false
        },
        details(Id){       //跳转详情页面
          this.$router.push(`/makerfundDetails?Id=${Id}`)
        }
      },
      mounted(){
        this.getData();
        // this.getAllFund()
      }
    }
</script>

<style lang="less">
.makerfund{     

  .el-dialog{
    border-radius: 5px;
    overflow: hidden;
  }

  .dialog-footer{
    width: 100%;
    display: flex;
    justify-content: center;
  }

  .dialog{//审核
    .el-dialog__header{
      background: #32455b;

    }
    .addDialogLogo{
        width: 60px;
        height: 30px;
        border-radius: 5px;
        display: flex;
        justify-content: center;
        line-height: 30px;
        background: #f2f2f2;
        position: absolute;
        left: 20px; top: 15px; 
      }
    .el-dialog__title{
        color:#fff;
        display: flex;
        justify-content: center;
        font-size: 18px;
        position: relative;
        top: -2px;
    }
    .diaBtn{     //dialog按钮
      font-size: 16px;
    }
    .el-dialog__body{
          padding:30px 0px 30px 50px ;
    }
    .diaTit{
      width: 100%;
      display: flex;
      font-size: 16px;
      // margin-right: 20px;
      justify-content: flex-start;
      
    }
    .diaTit1{
      display: flex;
      margin-top: 20px;
      font-size: 16px;
      width: 91%;
      .spans{
        font-size: 16px;
        color: #000;
        box-sizing: border-box;
        padding-right: 10px;
      }

    }
    
    .spans1{
      color: #000;
      min-width: 70px;
      margin-right: 5px;
      display: inline-block;
      text-align: justify;
      text-justify:distribute-all-lines;
      text-align-last: justify;
      transform: translate(0,22%);
      padding-right: 15px;
    }
    // .el-input__inner{
    //   width: 300px;
    // }
    .diaTit5{
      display: flex;
      margin-right: 15px;
      .el-input__inner{
        width: 100px;
      }
    }
  }
  .createFromDialogSty{        //生成表单
        .el-dialog__header{
          display: flex;
          justify-content: center;
        }
        .el-dialog{   
            border-radius: 5px;
            overflow: hidden;

            top: 10%;
        }
        
        .deleteContent{
            width: 100%;
            text-align: center;
            font-size: 22px;
            color: #000;
        }
        .addDialogLogo{
            width: 60px;
            height: 30px;
            border-radius: 5px;
            display: flex;
            justify-content: center;
            line-height: 30px;
            background: #f2f2f2;
            position: absolute;
            left: 20px; top: 15px; 
        }
        .el-dialog__header{
            background: #32455b;
        }
        .el-dialog__title{
            color:#fff;
            display: flex;
            justify-content: center;
            font-size: 18px;
            position: relative;
            top: -2px;
        }
        .addDialogMid{
            box-sizing: border-box;
            padding:0 60px 0 10px;
        .addDialogTit{
            display: flex;
            span{
            width: 80px;
            line-height: 40px;
            text-align: left;
            }
        }
        .addDialogTit1{
            display: flex;
            justify-content: space-between;
            margin-bottom: 15px;
        }
        .addDialogTit2{
            margin-top: 10px;
            font-size: 18px;
            color: #000;
            text-indent: 2em;
        }
        .addDialogCon{
            margin-top: 20px;
        }
        }
        .dialog-footer{
            display: flex;
            justify-content: center;
        }
    }
    .tableStyle{  //申请表样式
      border-collapse:collapse;
      font-size: 16px;
      td{
          // align-content: center;
          height: 35px;
      }
    }
}

</style>