yuanyiming 1 年之前
父節點
當前提交
5745215ad6

+ 6 - 6
src/router/index.js

@@ -155,13 +155,13 @@ const routes = [{
             },
  
             
-            // { //项目资金管理
-            //     name: 'ProjectManagementFundDetail',
-            //     path: '/ProjectManagementFundDetail',
-            //     component: () =>import ('@/views/projectManage/ProjectManagementFundDetail.vue'),
-            //     meta: { isAuth: true }
+            { //项目资金管理
+                name: 'ProjectManagementFundDetail',
+                path: '/ProjectManagementFundDetail',
+                component: () =>import ('@/views/projectManage/ProjectManagementFundDetail.vue'),
+                meta: { isAuth: true }
 
-            // },
+            },
             // { //项目资金管理
             //     name: 'ProjectManagementFund2',
             //     path: '/ProjectManagementFund2',

+ 1413 - 0
src/views/fundManage/makerfundDetails.vue

@@ -0,0 +1,1413 @@
+<template>
+    <!-- 创客资金申请表单 -->
+  <div class="makerfundApply" v-loading="loading">
+    <div class="vfpHeader">
+        <div class="titleOne">创客资金申请</div>
+        <div class="smallTitle" style="left: 150px;">创客资金申请详情</div>
+        <el-button type="primary" @click="$router.back()">返回</el-button>
+    </div>
+    <hr>
+
+
+    <!-- 项目名称、类型开始 -->
+    <div class="Apply1">
+        <div class="inpInterval">项目名称</div>
+        <el-select v-model="selects.projectName" disabled style="width: 30%;" placeholder="请选择">
+            <el-option
+            v-for="item in projectFilter"
+            :key="item.id"
+            :label="item.title"
+            :value="item.id">
+            </el-option>
+        </el-select>
+    </div>
+    <div class="Apply1">
+        <div class="inpInterval">项目类型</div>
+        <el-select v-model="selects.projectType" disabled placeholder="请选择">
+            <el-option
+            v-for="item in projectType"
+            :key="item.id"
+            :label="item.name"
+            :value="item.name">
+            </el-option>
+        </el-select>
+    </div>
+    <!-- 项目名称、类型结束 -->
+
+
+
+
+    <div class="tabTit">
+            <div>
+                <p>经费支出类别(单位:元)</p>
+            </div>
+    </div>
+    <hr>
+    <div class="moneyBlock" v-for="(item,index) in directFundBlock" :key="index">          <!-- 直接经费 -->
+        <div class="howMoneyFlex">
+            <div style="width: 100%;display: flex;">
+                <div class="howMoney">
+                    <div class="inpInterval ">直接经费</div>
+                    <el-select v-model="item.directFundData" @change="directFundDataSelectChange()" placeholder="请选择">
+                        <el-option
+                        v-for="item in item.directFundSelects"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value">
+                        </el-option>
+                    </el-select>
+                </div>
+                <div class="howMoney">
+                    <div class="inpInterval twoStyle">预算</div>
+                    <el-input v-model="item.budget" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                </div>
+            </div>
+
+            <div style="width: 100%;display: flex;">
+                <div class="howMoney">
+                    <div class="inpInterval ">已支付</div>
+                    <el-input v-model="item.usedFund" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                </div>
+                <div class="howMoney">
+                    <div class="inpInterval twoStyle">本次申请</div>
+                    <el-input v-model="item.apply" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                </div>
+                <div class="howMoney">
+                    <div class="inpInterval twoStyle">余额</div>
+                    <el-input disabled :value="item.budget - item.usedFund -item.apply" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                </div>
+            </div>
+        </div>
+        <div class="howMoney" >
+            <div class="inpInterval" style="position: relative;top:-20px">事由</div>
+            <el-input
+            type="textarea"
+            :rows="3"
+            class="textArea"
+            resize="none"
+            style="width:800px"
+            placeholder="请输入内容"
+            v-model="item.reason">
+            </el-input>
+            <p><span class="delText" v-show="index!=0"  @click="delDerData(index)">删除</span></p>
+            <!-- <el-button v-show="index!=0" type="primary" style="font-size: 16px;height: 40px;margin-left: 10px; line-height: 0;" @click="delDerData(index)">删除</el-button> -->
+
+        </div>
+    </div>
+    <div>
+        <div class="addMoneyBtn" @click="addDirectFund">
+            <div class="jia">+</div>添加
+        </div>
+    </div>
+
+
+    <div>                                                                                  <!-- 间接经费 -->
+        <div class="moneyBlock" v-for="(item,i) in indirectFundBlock" :key="i">       
+            <div class="howMoneyFlex">
+                <div style="width: 100%;display: flex;">
+                    <div class="howMoney">
+                        <div class="inpInterval">间接经费</div>
+                        <el-select v-model="item.indirectFundData" @change="indirectFundSelectChange" placeholder="请选择">
+                            <el-option
+                            v-for="item in item.indirectFundSelects"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                            </el-option>
+                        </el-select>
+                    </div>
+                    <div class="howMoney">
+                        <div class="inpInterval twoStyle">预算</div>
+                        <el-input v-model="item.budget" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                    </div>
+                </div>
+
+                <div style="width: 100%;display: flex;">
+                    <div class="howMoney">
+                        <div class="inpInterval ">已支付</div>
+                        <el-input v-model="item.usedFund" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                    </div>
+                    <div class="howMoney">
+                        <div class="inpInterval twoStyle">本次申请</div>
+                        <el-input v-model="item.apply" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                    </div>
+                    <div class="howMoney">
+                        <div class="inpInterval twoStyle">余额</div>
+                        <el-input disabled :value="item.budget - item.usedFund -item.apply" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+                    </div>
+                </div>
+            </div>
+            <div class="howMoney">
+                <div class="inpInterval" style="position: relative;top:-20px">事由</div> 
+                <el-input
+                type="textarea"
+                :rows="3"
+                class="textArea"
+                resize="none"
+                style="width:800px"
+                placeholder="请输入内容"
+                v-model="item.reason">
+                </el-input>
+                <p><span  class="delText" v-show="i!=0"  @click="delInDerData(i)">删除</span></p>
+
+                <!-- <el-button v-show="i!=0" type="primary" style="font-size: 16px;height: 40px;line-height: 0;margin-left: 10px;" @click="delInDerData(i)">删除</el-button> -->
+            </div>
+        </div>
+    </div>
+    <div>
+        <div class="addMoneyBtn" @click="addIndirectFund">
+            <div class="jia">+</div>添加
+        </div>
+    </div>
+
+
+<!-- 其他经费 -->
+    <div class="moneyBlock">          
+        <!-- <div class="howMoneyFlex">
+            <div class="howMoney">
+                <div class="inpInterval" >其他</div>
+                <el-input v-model="residue.elseReason" placeholder="请输入内容"></el-input>
+            </div>
+            <div class="howMoney">
+                <div class="inpInterval ">预算</div>
+                <el-input v-model="residue.budget" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+            </div>
+            <div class="howMoney">
+                <div class="inpInterval ">已支付</div>
+                <el-input v-model="residue.usedFund" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+            </div>
+            <div class="howMoney">
+                <div class="inpInterval ">余额</div>
+                <el-input disabled :value="residue.budget - residue.usedFund" type="number" class="inputNumber howMoneyInp" placeholder="金额"></el-input>
+            </div>
+        </div> -->
+        <div class="howMoney">
+            <div class="inpInterval" style="position: relative;top:-20px">备注</div>
+            <el-input
+            type="textarea"
+            :rows="3"
+            resize="none"
+            class="textArea"
+            style="width:800px"
+            placeholder="请输入内容"
+            v-model="residue.reason">
+            </el-input>
+        </div>
+
+    </div>
+
+
+    <div>                            <!-- 附件上传 -->
+        <div class="tabTit">
+            <div><p>附件上传</p></div>
+        </div>
+        <hr>
+        <el-progress v-show="progress.show" :percentage="progress.value" :format="ProgressFormat"></el-progress>
+
+        <div style="display: flex;flex-wrap: wrap;width: 100%;margin-bottom: 45px;">
+                <el-upload
+                action="#"
+                list-type="picture-card"
+                style="position: relative;margin-left: 10px;"
+                disabled
+                :on-remove="handleRemove">
+                <BeUpload @getFile="getFile" :progress="progress" style="position: absolute;left: 0;width: 147px;height: 100%;opacity: 0;" class="uploadPic" :navName="'上传封面'" :accept="accept"></BeUpload>
+                <i class="el-icon-plus"></i>
+                </el-upload>
+
+                <el-upload
+                action="#"
+                list-type="picture-card"
+                class="delUpload"
+                style="position: relative;"
+                v-show="file[0]"
+                disabled
+                v-for="(item,index) in this.file" :key="index"
+                >
+                <!-- <span class="delUploadBtnSty" @click="delUploadBtn(index)">×</span> -->
+                <!-- <div class="maskLayer" style="background: #000;position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 99999;"> -->
+                
+                <img style="position: absolute;left: -1px;top:-1px;width: 149px;height: 101%;border-radius: 5px;" :src="dialogImageUrl" alt="">
+                <div class="maskLayer">
+                    <i @click="delUploadBtn(index)" class="maskLayerI el-icon-close"></i>
+                </div>
+                <div style="position: absolute;left: -20%;bottom: -30px;width: 200px;height: 30px;color: #000;line-height: 30px;display: flex;justify-content: center;">{{ item.fileName }}</div>
+                <!-- <img v-if="imageUrl" :src="imageUrl" class="avatar"> -->
+                </el-upload>
+               
+        </div>
+    </div>
+
+
+
+    <div class="baseBtn">
+        <div class="blockWidth">
+            <el-button type="primary" @click="createFrom">生成表单</el-button>
+            <el-button v-show="status==0" type="primary" @click="uploadData">保存</el-button>
+            <el-button v-show="status==1" style="width: 120px;background-color: #c8c9cc !important;border-color: #c8c9cc;cursor: no-drop;" type="primary">保存</el-button>
+            <el-button v-show="status==2" style="width: 120px;background-color: #c8c9cc !important;border-color: #c8c9cc;cursor: no-drop;" type="primary">保存</el-button>
+
+
+            <el-button v-show="status==0" style="width: 120px;" @click="endDialogShow"  type="primary">审核</el-button>
+            <el-button v-show="status==1" style="width: 120px;background-color: #c8c9cc !important;border-color: #c8c9cc;cursor: no-drop;" type="primary">审核</el-button>
+            <el-button v-show="status==2" style="width: 120px;background-color: #c8c9cc !important;border-color: #c8c9cc;cursor: no-drop;" type="primary">审核</el-button>
+
+        </div>
+    </div>
+
+        <!-- 提交对话框开始 -->
+        <el-dialog
+          title="提示"
+          :visible.sync="submitHint"
+          width="600px"
+          class="pageSubmitData"
+          :before-close="init">
+          <div class="addDialogLogo">LOGO</div>
+          <div class="deleteContent">确定完成保存?</div>
+          <span slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="submitAll" class="AllDialogBtn">确定保存</el-button>
+            <el-button @click="init" class="AllDialogBtn" size="small">取消</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>
+      <!-- 生成表单对话框结束 -->
+
+           <!-- 审核对话框框开始 -->
+           <el-dialog
+                title="提示"
+                :visible.sync="auditDialog"
+                width="600px"
+                class="pageSubmitData"
+                :before-close="init">
+                <div class="addDialogLogo">LOGO</div>
+                <div class="deleteContent">确定完成审核?</div>
+                <span slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="submitAudit" class="AllDialogBtn">确认审核</el-button>
+                <el-button @click="auditDialog=false" class="AllDialogBtn" size="small">取消</el-button>
+                </span>
+            </el-dialog>
+            <!-- 审核对话框结束 -->
+  </div>
+</template>
+
+<script>
+    import BeUpload from "../../components/tool/beUpload.vue";
+    import getExcel from "@/components/tool/getExcel";
+export default {
+
+    components: {
+        BeUpload,
+      },
+    data() {
+        return {
+            // items:[
+            //     {num:'01',fromSort:'一.经费支出',fromBudget:'0',fromUsed:'0',fromApp:'0',fromBalance:'0',fromReason:''},
+            //     {num:'02',fromSort:'(一)直接费用',fromBudget:'0',fromUsed:'0',fromApp:'0',fromBalance:'0',fromReason:''},
+            //     {num:'03',fromSort:'小型仪器设备费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'04',fromSort:'材料费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'05',fromSort:'测试化验加工费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'06',fromSort:'项目协作费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'07',fromSort:'其他支出',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'08',fromSort:'(二)间接费用',fromBudget:'0',fromUsed:'0',fromApp:'0',fromBalance:'0',fromReason:''},
+            //     {num:'09',fromSort:'项目成果鉴定费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'10',fromSort:'参展参赛费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'11',fromSort:'创客交流活动费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'12',fromSort:'知识产权事务费',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            //     {num:'13',fromSort:'其他支出',fromBudget:'',fromUsed:'',fromApp:'',fromBalance:'0',fromReason:''},
+            // ], 
+            status:'',   //审核状态
+            auditDialog:false,   //审核按钮
+            loading:false,
+            checkList: [],
+            accept:"*",
+            submitHint:false,   //提交按钮
+            createFromDialog:false,  //生成表单
+            dialogImageUrl:require('../../assets/img/zzpic426.jpg'),
+            disabled: false,
+            file:[],
+            selects:{
+                projectName:'',
+                projectType:''
+            },
+            progress:{   //进度条
+                value:0,
+                show:false
+            },  
+            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,      //余额
+            }
+        }
+    },
+    methods:{
+        endDialogShow(){    //审核对话框显示
+            this.auditDialog=true
+        },
+        submitAudit(){       //确定审核
+            let param={
+                uid:this.$store.state.userInfo.userid,
+                fid:this.fid,
+                status:1
+            }
+            this.ajax
+                .post(this.$store.state.api+"/UpdateMakerFundState",param)
+                .then(res=>{
+                    this.auditDialog=false;
+                    if (res.data) {
+                        this.$message.success('审核成功')
+                        this.getAllFund()
+                        }else{
+                        this.$message.error('审核失败')
+                        }
+                },err=>{
+                    console.log(err);
+                })
+        },
+
+        getAllFund(){
+          let param={
+            uid:this.$store.state.userInfo.userid,
+            fid:this.$route.query['Id']
+          }
+          // 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.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
+                        // console.log(this.directData.facility);
+                        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
+                        // console.log(this.directData.cl);
+                        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']:'';
+
+        },
+        createFrom(){   // 显示表单对话框
+            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,
+            }
+            this.AllEquipment();
+            this.createFromDialog=true;
+        },
+        submitCreateFrom(){   //生成表单
+            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
+                }
+            })
+            
+        },
+        ProgressFormat(value){        //进度条
+          return value ==100?'100%':`${value}%`
+        },
+        delInDerData(index){                       //删除间接经费
+            this.indirectFundBlock.splice(index,1)
+        },
+        delDerData(index){                   //删除直接经费
+            console.log(index);
+            this.directFundBlock.splice(index,1)
+        },
+        delUploadBtn(index){           //删除上传文件
+            console.log(index);
+            this.file.splice(index,1)
+            this.$message.success('删除成功')
+        },
+        handleRemove(index) {
+            console.log(index);
+        },
+        uploadData(){
+            this.submitHint=true;
+        },
+        submitAll(){
+            if(this.selects.projectName=='') return this.$message.error('请选择项目名称')
+            if(this.selects.projectType=='') return this.$message.error('请选择项目类型')
+
+            let dirSum = this.directFundBlock.reduce((per,cur)=>{
+                return per*1+cur.budget*1
+            },0)
+            let indirSum =this.indirectFundBlock.reduce((per,cur)=>{
+                return per*1+cur.budget*1
+            },0)
+            let allSum=dirSum+indirSum+this.residue.budget*1
+
+            let usedDirSum = this.directFundBlock.reduce((per,cur)=>{
+                return per*1+cur.usedFund*1
+            },0)
+            let usedIndirSum =this.indirectFundBlock.reduce((per,cur)=>{
+                return per*1+cur.usedFund*1
+            },0)
+            // let usedAllSum=usedDirSum+usedIndirSum+this.residue.usedFund*1
+            let usedApplyDirSum = this.directFundBlock.reduce((per,cur)=>{
+                return per*1+cur.apply*1
+            },0)
+            let usedApplyIndirSum =this.indirectFundBlock.reduce((per,cur)=>{
+                return per*1+cur.apply*1
+            },0)
+            // return console.log(usedApplyDirSum,usedApplyIndirSum);
+            let usedAllSum=usedDirSum+usedIndirSum+usedApplyDirSum+usedApplyIndirSum;
+            // return console.log(usedAllSum);
+            if (usedAllSum>allSum) return this.$message.error('使用金额大于预算')
+            
+
+            let param={
+                uid:this.$store.state.userInfo.userid,
+                cid:this.selects.projectName,
+                fid:this.$route.query['Id'],
+                type:this.selects.projectType,
+                dir:JSON.stringify(this.directFundBlock),
+                indir:JSON.stringify(this.indirectFundBlock),
+                elseFund:JSON.stringify(this.residue),
+                file:JSON.stringify(this.file),
+                AllSum:allSum,
+                usedSum:usedAllSum
+            }
+            this.ajax
+                .post(this.$store.state.api+'/UpdateMakerFund',param)
+                .then(res=>{
+                    console.log(res);
+                    if (res.data==1) {
+                    //    this.$router.push('/makerfund')
+                         this.$message.success('保存成功')
+                       return this.submitHint=false
+                    }else{
+                        this.$message.error('保存失败')
+                    }
+                },err=>{
+                    console.log(err);
+                })
+        },
+        getFile(val) {       //上传文件
+            this.file.push(val)
+            this.progress.show = false;
+            // this.imageUrl=require("../../assets/img/jj.jpg")
+        },
+        getData(){
+            this.loading = true;
+            let param={
+                uid:this.$store.state.userInfo.userid,
+            }
+            this.ajax
+                // .get(this.$store.state.api+'/SelectMakerFundSelects',param)
+                .get(this.$store.state.api+'/SelectMakerFundDetailSelects',param)
+                .then(res=>{
+                    // console.log(res.data[0]);
+                    this.projectFilter=res.data[0]
+                    this.loading = false;
+                },err=>{
+                    console.log(err);
+                })
+        },
+        addDirectFund(){           //添加直接经费
+
+            //判断如果已经写满
+            if(this.directFundBlock.length==this.newDirectFundBlock.directFundSelects.length)return this.$message.warning("已无法继续添加")
+            let oldArr={};
+            Object.assign(oldArr,this.newDirectFundBlock)
+            oldArr.directFundSelects = oldArr.directFundSelects.filter(item=>this.directFundBlock.filter(dItem=>dItem.directFundData==item.value).length==0)
+            this.directFundBlock.push(oldArr)
+            for(let k in this.newDirectFundBlock) return this.newDirectFundBlock[k]=''
+        },
+        addIndirectFund(){         //添加间接经费
+            //判断如果已经写满
+            if(this.indirectFundBlock.length==this.newIndirectFundBlock.indirectFundSelects.length)return this.$message.warning("已无法继续添加")
+            let oldArr={};
+            Object.assign(oldArr,this.newIndirectFundBlock)
+            oldArr.indirectFundSelects = oldArr.indirectFundSelects.filter(item=>this.indirectFundBlock.filter(dItem=>dItem.indirectFundData==item.value).length==0)
+            this.indirectFundBlock.push(oldArr)
+            for(let k in this.newIndirectFundBlock) return this.newIndirectFundBlock[k]=''
+        },
+        init(){
+                //重置
+                this.submitHint=false;
+                this.createFromDialog=false;
+                this.auditDialog=false;
+        },
+        directFundDataSelectChange(){
+            //直接经费全部下拉框
+            let directFundBlockSelect = [
+                    {
+                        value:1,
+                        label:'小型仪器设备费'
+                    },
+                    {
+                        value:2,
+                        label:'材料费'
+                    },
+                    {
+                        value:3,
+                        label:'测试化验加工费'
+                    },
+                    {
+                        value:4,
+                        label:'项目协作费'
+                    },
+                    {
+                        value:5,
+                        label:'其他支出'
+                    },
+                ]
+            let oneself=[];
+            this.directFundBlock.forEach(item=>{
+                //获取他本身自己的下拉框
+                oneself.push(directFundBlockSelect.filter(sItem=>sItem.value==item.directFundData)[0])
+                //获取未选择的
+                directFundBlockSelect = directFundBlockSelect.filter(sItem=>sItem.value!=item.directFundData)
+            })
+            //再遍历一遍
+            this.directFundBlock.forEach((item,index)=>{
+                let oneSelect = [];
+                directFundBlockSelect.forEach(item=>oneSelect.push(item));
+                if(oneself[index]!=undefined)oneSelect.push(oneself[index])
+                item.directFundSelects = oneSelect;
+            })
+            //遍历所有的直接经费
+
+        },
+        indirectFundSelectChange(){
+            //间接经费全部下拉框
+            let indirectFundSelect = [
+                    {
+                        value:1,
+                        label:'项目成功鉴定费'
+                    },
+                    {
+                        value:2,
+                        label:'参展参赛费'
+                    },
+                    {
+                        value:3,
+                        label:'创客交流活动费'
+                    },
+                    {
+                        value:4,
+                        label:'知识产权事务费'
+                    },
+                    {
+                        value:5,
+                        label:'其他支出'
+                    },
+            ];
+            let oneself=[];
+            this.indirectFundBlock.forEach(item=>{
+                //获取他本身自己的下拉框
+                oneself.push(indirectFundSelect.filter(sItem=>sItem.value==item.indirectFundData)[0])
+                //获取未选择的
+                indirectFundSelect = indirectFundSelect.filter(sItem=>sItem.value!=item.indirectFundData)
+            })
+            //再遍历一遍
+            this.indirectFundBlock.forEach((item,index)=>{
+                let oneSelect = [];
+                indirectFundSelect.forEach(item=>oneSelect.push(item));
+                if(oneself[index]!=undefined)oneSelect.push(oneself[index])
+                item.directFundSelects = oneSelect;
+            })
+            //遍历所有的直接经费
+
+        },
+    },
+    mounted(){
+        this.getData()
+        this.getAllFund()
+    }
+}
+</script>
+
+<style lang="less">
+.makerfundApply{
+
+
+    .maskLayer{
+        background: #000;position: absolute;left: 0;top: 0;opacity: .4; width: 100%;height: 100%;border-radius: 5px;
+        // z-index: 99999;
+        display: none;
+    }
+
+
+    .delUpload{
+        width: 147px;
+        margin-left: 60px;
+        margin-bottom: 62px;
+    }
+    .maskLayerI:hover{
+        color: #fff;
+    }
+    .delUpload:hover .maskLayer{
+        display: block;
+    }
+    // .delUpload{
+    //     width: 147px;
+    //     margin-left: 60px;
+    //     margin-bottom: 62px;
+    // }
+    .delUploadBtnSty{
+        position: absolute;
+        right: 0;top: 0px;
+        line-height: 20px;
+        display: flex;
+        justify-content: center;
+        width: 20px;
+        height: 20px;
+        font-size: 35px;
+        z-index: 10;
+        color: #fff;
+        // background: #fff;
+    }
+
+    .avatar-uploader .el-upload {         //文件上传
+        border: 1px dashed #d9d9d9;
+        border-radius: 6px;
+        cursor: pointer;
+        position: relative;
+        overflow: hidden;
+    }
+
+    .avatar-uploader-icon {
+        font-size: 28px;
+        color: #8c939d;
+        width: 178px;
+        height: 178px;
+        line-height: 178px;
+        text-align: center;
+    }
+    .avatar {
+        width: 178px;
+        height: 178px;
+        display: block;
+    }
+
+
+    .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;
+        }
+    }
+
+  .Apply1{         //顶部两个下拉框
+    height: 45px;
+    width: 100%;
+    display: flex;
+    justify-content: flex-start;
+    margin-top: 20px;
+    .inpName{
+        height: 40px;
+        outline:none ;
+        width: 600px;
+        border: #ccc 1px solid;
+        border-radius: 5px;
+        box-sizing: border-box;
+        padding: 1px 15px;
+    }
+  }
+
+
+
+  .moneyBlock{
+    max-width: 100%;
+    margin-bottom: 20px;
+    .howMoneyFlex{
+        display: flex;
+        flex-wrap: wrap;
+    }
+    .howMoney{
+        display: flex;
+        margin-right: 40px;
+        margin-bottom: 10px;
+        justify-content: flex-start;
+        .howMoneyInp{
+            .el-input__inner{
+                width: 170px;
+            }
+        }
+        
+    }
+  }
+    .inpInterval{
+        min-width: 70px;
+        display: inline-block;
+        text-align: justify;
+        text-justify:distribute-all-lines;
+        text-align-last: justify;
+        transform: translate(0,22%);
+        padding-right: 15px;
+        font-size: 16px;
+    }
+
+    .addMoneyBtn{   //添加样式
+            margin: 15px 85px 30px;
+    }
+
+}
+.tableStyle{
+     border-collapse:collapse;
+     font-size: 16px;
+     td{
+        // align-content: center;
+        height: 35px;
+     }
+}
+.delText{
+    margin-left: 20px;cursor: pointer;
+}
+.delText:hover{
+    color: blue;
+}
+</style>

+ 245 - 0
src/views/projectManage/ProjectManagementFund2.vue

@@ -0,0 +1,245 @@
+<template>
+  <!-- 项目管理 资金申报明细 -->
+    <div class="ProjectManagementFund2" v-loading="loading">
+        <div class="vfpHeader">
+            <div class="titleOne">预算经费</div>
+            <el-button type="primary" @click="$router.push('/ProjectManagement')">返回</el-button>
+        </div>
+          <hr>
+         <!-- 跳转导航开始 -->
+         <div class="AppBar">
+              <div @click="content">项目资金使用详情</div>
+              <div @click="remark" class="AppBarActive">
+                资金申报明细
+                <div class='pr1TitBass'></div>
+              </div>
+          </div>
+          <!-- 跳转导航结束 -->
+              
+
+      <!-- 表格开始 -->
+      <el-table
+        ref="multipleTable"
+        :data="tableData"
+        tooltip-effect="dark"
+        stripe
+        class="fontSize"
+        :header-cell-style="{ background: '#f2f2f2',color:'#000' }"
+        >
+        
+        <el-table-column
+          prop="title"
+          align="center"
+          label="活动名称"
+          >
+        </el-table-column>
+        <el-table-column
+          prop="pro_leader"
+          align="center"
+          label="负责人"
+          >
+        </el-table-column>
+        <el-table-column
+          prop="type"
+          align="center"
+
+          label="项目类型"
+          >
+        </el-table-column>
+        <el-table-column
+          prop="fund"
+          align="center"
+          label="申请经费(元)"
+          >
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          align="center"
+          label="所在部门"
+          >
+        </el-table-column>
+
+        <el-table-column
+          prop="dateTime"
+          align="center"
+          label="申请时间"
+         >
+        </el-table-column>
+      </el-table>
+      <!-- 表格结束 -->
+
+
+        <el-pagination
+        background
+        class="paginations"
+        layout="prev, pager, next"
+        :total="1">
+        </el-pagination>
+
+  </div>
+  </template>
+  
+  <script>
+      export default {
+        data() {
+          return {
+            tableData:[],
+            loading:false,
+          }
+        },
+        methods:{
+          content(){
+            this.$router.push(`/ProjectManagementFund1?pid=${this.$route.query['pid']}`)
+          },
+          remark(){
+            this.$router.push(`/ProjectManagementFund2?pid=${this.$route.query['pid']}`)
+          },
+          getData(){
+            this.loading = true;
+            let param={
+              uid:this.$store.state.userInfo.userid,
+              cid:this.$route.query['pid']
+            }
+            // console.log(param);
+            // return
+            this.ajax
+                .get(this.$store.state.api+'/SelectFundDetail',param)
+                .then(res=>{
+                    console.log(res.data[0]);
+                    this.tableData=res.data[0]
+                    this.loading = false;
+                },err=>{
+                    console.log(err);
+                })
+          },
+        },
+        mounted(){
+          this.getData()
+        }
+      }
+  </script>
+  
+  <style lang="less">
+  .ProjectManagementFund2{
+ 
+     .right{
+      width: 100%;
+     }
+    .pmFund1Footer{   //分页
+       display: flex;
+       justify-content: flex-end;
+       margin: 20px 50px 0 0;
+    }
+
+
+  .projectApplicationfundAddDialog2{
+
+
+    .el-header {
+      background-color: #3d67bc;
+      color: #333;
+      text-align: center;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+    }
+    .el-select-dropdown__item{
+      text-align: left;
+    }
+    .el-dialog__title{
+      color:#fff;
+        display: flex;
+        justify-content: center;
+        font-size: 18px;
+        position: relative;
+        top: -2px;
+    }
+    font-size: 16px !important;
+    .el-dialog__header{
+      display: flex;
+      font-weight: bold;
+      justify-content: flex-start;
+    }
+    .el-dialog__body{
+      padding-top: 0px;
+    }
+    .dagSpan{
+      min-width: 65px;
+      max-width: 65px;
+      display: flex;
+      justify-content:flex-end;
+      margin-right: 9px;
+      align-items: center;
+      font-size: 16px;
+    }
+    .deleteContent1{
+      width: 55%;
+      margin-bottom: 10px;
+      display: flex;
+    }
+
+    .dagRemark{
+      display: flex;
+      margin: 20px 0px;
+      font-size: 16px;
+      font-weight: 550;
+    }
+    .dagInpS{
+      // width: 100%;
+      display: flex;
+      font-size: 16px;
+
+      justify-content: space-between;
+      .dagInpS1{
+        display: flex;
+        min-width: 23%;
+        max-width: 23%;
+        font-size: 16px;
+
+      }
+      .dagInpS1:nth-child(1){
+        min-width: 30%;
+        max-width: 30%;
+        .dagSpan{
+          font-size: 16px;
+          display: inline-block;
+          text-align: justify;
+          text-justify:distribute-all-lines;
+          text-align-last: justify;
+          transform: translate(0,22%);
+        }
+      }
+      .dagInpSf1:nth-child(n+2) .dagSpan{
+        font-size: 16px;
+        min-width: 50px;
+        max-width: 50px;
+
+      }
+    }
+    .dagInpS2{
+        margin:20px 0 20px 0;
+        display: flex;
+        font-size: 16px;
+
+        .dagSpan2{
+          font-size: 16px;
+
+          max-width: 65px;
+          min-width: 65px;
+          margin-right: 10px;
+          // text-align: right;
+          display: inline-block;
+          text-align: justify;
+          text-justify:distribute-all-lines;
+          text-align-last: justify;
+        }
+    }
+  }
+
+  .newWidth{
+    width: 150px;
+  }
+
+
+  }
+  </style>

+ 75 - 0
src/views/projectManage/ProjectManagementFundDetail.vue

@@ -0,0 +1,75 @@
+<template>
+  <!-- 项目管理 项目资金使用情况 -->
+  <div class="ProjectManagementFundDetail" v-loading="loading">
+        <div class="vfpHeader">
+            <div class="titleOne">预算经费</div>
+            <el-button type="primary" @click="back">返回</el-button>
+        </div>
+          <hr>
+          <!-- 跳转导航开始 -->
+          <div class="AppBar">
+              <div @click="state=0" class="AppBarActive">项目资金使用详情<div v-if="state==0" class='pr1TitBass'></div></div>
+              <div @click="state=1">资金申报明细<div v-if="state==1" class='pr1TitBass'></div></div>
+          </div>
+          <div id="ShowArea">
+            <fundDetail v-if="state==0"/>
+          </div>
+
+         
+</div>
+</template>
+
+<script>
+import fundDetail from './components/FundDetail.vue'
+    export default {
+      components:{fundDetail},
+      data() {
+        return {
+          state:0,
+          loading:false,
+        }
+      },
+      methods:{
+        // getData(){   //初始化完成获取基本数据进行填充
+        //   this.loading = true;
+        //     let param={
+        //       uid:this.$store.state.userInfo.userid,
+        //       pid:this.$route.query['pid']
+        //     }
+        //       this.ajax
+        //             .get(this.$store.state.api+'/GetProjectDetailMessage',param)
+        //             .then(res=>{
+        //               let data = res.data[0][0]
+        //               let fund = JSON.parse(data['money'])
+        //               this.tableData = fund['tableData']
+        //               this.tableData2 = fund['tableData2']
+        //               this.allFund = data['fund']
+        //               this.tableData2.forEach((e)=>{
+        //                 this.useFund=this.useFund+e.fund
+        //               })
+        //               this.useFund=this.useFund / 10000
+        //               this.remainFund=this.allFund - this.useFund
+        //               this.loading = false;
+        //             },err=>{
+        //               console.log(err);
+        //             })
+        //   },
+        back(){
+          this.$router.push('/ProjectManagement')
+        }
+      },
+      mounted(){
+        // this.getData()
+      }
+    }
+</script>
+
+<style lang="less">
+.ProjectManagementFundDetail{
+  width: 100%;
+  height: 100%;
+  #ShowArea{
+    width: 100%;
+  }
+}
+</style>

+ 138 - 0
src/views/projectManage/components/FundDetail.vue

@@ -0,0 +1,138 @@
+<template>
+    <div id="fundDetail">
+        <table border="1" cellspacing="0" class="table">
+            <tr id="fund">
+            <td rowspan="12" ref="fund" style="white-space: ;">实际使用经费</td><td>总经费</td><td colspan="5" v-text="'xxxxxx'"></td>
+          </tr>
+          <tr>
+            <td>支出类别</td><td colspan="2">支出项目</td><td>金额(元)</td><td colspan="4">备 注</td>
+          </tr>
+          <tr>
+            <td rowspan="5">直接费用</td>
+          </tr>
+          <tr>
+            <td colspan="2">小型仪器设备费</td>
+            <td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              项目开展所需的小型专用仪器设备、工具、配件购置或租赁费用。
+            </td>
+          </tr>
+          <tr>
+            <td colspan="2">材料费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              项目开展需消耗的各种原材料、辅助材料等低值易耗品的采购费用。
+            </td>
+          </tr>
+          <tr>
+            <td colspan="2">测试化验加工费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              项目开展过程中支付给外单位的检验、测试、化验、计算、分析及加工费等费用。
+            </td>
+          </tr>
+          <tr>
+            <td colspan="2">项目协作费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              按合同规定支付给协作单位的费用
+            </td>
+          </tr>
+    
+          <tr>
+            <td rowspan="5">间接费用</td>
+          </tr>
+          <tr>
+            <td colspan="2">项目成果鉴定费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              学术会务费、评审费、鉴定费、成果集制作费等费用。
+            </td>
+          </tr>
+          <tr>
+            <td colspan="2">参展参赛费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              参加创客展会、竞赛等所需的报名费、展位费、布展费、宣传推广费及差旅费等费用。
+            </td>
+          </tr>
+          <tr>
+            <td colspan="2">创客交流活动费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              创客交流活动中支付给校外专家的指导费、咨询费、授课费等费用。
+            </td>
+          </tr>
+          <tr>
+            <td colspan="2">知识产权事务费</td><td v-text="'xxxxxx'">
+            </td><td colspan="2">
+              论文版面费、专利及其他知识产权事务等费用。
+            </td>
+          </tr>
+        </table>
+    </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+
+    }
+  },
+  methods:{
+    // getData(){   //初始化完成获取基本数据进行填充
+    //   this.loading = true;
+    //     let param={
+    //       uid:this.$store.state.userInfo.userid,
+    //       pid:this.$route.query['pid']
+    //     }
+    //       this.ajax
+    //             .get(this.$store.state.api+'/GetProjectDetailMessage',param)
+    //             .then(res=>{
+    //               let data = res.data[0][0]
+    //               let fund = JSON.parse(data['money'])
+    //               this.tableData = fund['tableData']
+    //               this.tableData2 = fund['tableData2']
+    //               this.allFund = data['fund']
+    //               this.tableData2.forEach((e)=>{
+    //                 this.useFund=this.useFund+e.fund
+    //               })
+    //               this.useFund=this.useFund / 10000
+    //               this.remainFund=this.allFund - this.useFund
+    //               this.loading = false;
+    //             },err=>{
+    //               console.log(err);
+    //             })
+    //   },
+  },
+  mounted(){
+    // this.getData()
+  }
+}
+</script>
+
+<style lang="less" scoped>
+#fundDetail{
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .table{
+        width: 100%;
+        border: none;
+        border-top: solid 1px black;
+        border-right:  solid 1px black;
+        border-left:  solid 1px black;
+        tr{
+          position: relative;
+          td{
+            border: none;
+            border-bottom: solid 1px black;
+            border-right: solid 1px black;
+            height: 65px;
+            text-align: center;
+            line-height: 30px;
+            min-width: 80px;
+            box-sizing: border-box;
+            padding: 5px;
+            }
+        }      
+    }
+}
+</style>