95 lines
		
	
	
		
			2.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			95 lines
		
	
	
		
			2.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <section class="AppApprovalManage">
 | |
|     <ai-list v-if="showList">
 | |
|       <template slot="title">
 | |
|         <ai-title title="审批管理" :isShowBottomBorder="false"/>
 | |
|       </template>
 | |
|       <template slot="tabs">
 | |
|         <el-tabs class="tabs-page" v-model="currIndex">
 | |
|           <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label" :name="String(i)">
 | |
|             <component :is="tab.comp" v-if="currIndex==i" :ref="currIndex" :instance="instance" :dict="dict"
 | |
|                        :permissions="permissions" :listType="tab.value" @goPage="goPage"/>
 | |
|           </el-tab-pane>
 | |
|         </el-tabs>
 | |
|       </template>
 | |
|     </ai-list>
 | |
|     <component v-if="!showList" :is="currentPage" :instance="instance" :listType="currentTab.value" :dict="dict"
 | |
|                :permissions="permissions" :detail="detail" @goBack="goBack"></component>
 | |
|   </section>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
|   import forMyApproval from "./components/forMyApproval";
 | |
|   import approvalDetail from "./components/approvalDetail";
 | |
| 
 | |
|   export default {
 | |
|     name: "AppApprovalManage",
 | |
|     label: "审批管理",
 | |
|     components: {approvalDetail},
 | |
|     provide() {
 | |
|       return {
 | |
|         approval: this
 | |
|       }
 | |
|     },
 | |
|     props: {
 | |
|       instance: Function,
 | |
|       dict: Object,
 | |
|       permissions: Function
 | |
|     },
 | |
|     data() {
 | |
|       return {
 | |
|         currIndex: '0',
 | |
|         showList: true,
 | |
|         currentPage: "",
 | |
|         detail: {},
 | |
|       }
 | |
|     },
 | |
|     computed: {
 | |
|       tabs() {
 | |
|         return [
 | |
|           {
 | |
|             label: "待我审批", name: "forMyApproval", value: "0", comp: forMyApproval, detail: approvalDetail,
 | |
|             permission: ""
 | |
|           },
 | |
|           {
 | |
|             label: "我已审批", name: "forMyApproval", value: "1", comp: forMyApproval, detail: approvalDetail,
 | |
|             permission: ""
 | |
|           },
 | |
|           {
 | |
|             label: "抄送我的", name: "forMyApproval", value: "3", comp: forMyApproval, detail: approvalDetail,
 | |
|             permission: ""
 | |
|           },
 | |
|           {
 | |
|             label: "超时督办", name: "forMyApproval", value: "4", comp: forMyApproval, detail: approvalDetail,
 | |
|             permission: ""
 | |
|           },
 | |
|         ]
 | |
|       },
 | |
|       currentTab() {
 | |
|         return this.tabs[this.currIndex] || {}
 | |
|       }
 | |
|     },
 | |
|     methods: {
 | |
|       goPage(obj) {
 | |
|         this.currentPage = this.tabs[Number(this.currIndex)][obj.key];
 | |
|         obj.row && (this.detail = obj.row)
 | |
|         this.showList = false;
 | |
|       },
 | |
|       goBack() {
 | |
|         this.showList = true;
 | |
|         this.$nextTick(() => {
 | |
|           this.$refs[this.currIndex][0].getList();
 | |
|         })
 | |
|       },
 | |
|     }
 | |
|   }
 | |
| </script>
 | |
| 
 | |
| <style lang="scss" scoped>
 | |
|   .AppApprovalManage {
 | |
|     width: 100%;
 | |
|     height: 100%;
 | |
|     background-color: #F3F6F9;
 | |
|   }
 | |
| </style>
 |