| <template> | 
|     <TableLayout :permissions="['business:applychange:query']"> | 
|         <!-- 搜索表单 --> | 
|         <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline> | 
|             <el-form-item label="保单状态" prop="status"> | 
|                 <el-select v-model="searchForm.status" placeholder="请选择" @change="search"> | 
|                     <el-option label="全部" value=""></el-option> | 
|                     <el-option label="待签署" value="0"></el-option> | 
|                     <el-option label="待审核" value="1"></el-option> | 
|                     <el-option label="已生效" value="2"></el-option> | 
|                     <el-option label="申请退回" value="3"></el-option> | 
| <!--                    3 4 都是退回申请中--> | 
|                     <el-option label="已退回" value="5"></el-option> | 
|                     <el-option label="已关闭" value="6"></el-option> | 
|                     <el-option label="待出单" value="7"></el-option> | 
|                     <el-option label="批改申请中" value="9"></el-option> | 
|                 </el-select> | 
|             </el-form-item> | 
|           <el-form-item label="保险方案" prop="baseSolutionsId"> | 
|             <el-select v-model="searchForm.baseSolutionsId" placeholder="请选择" @change="search"> | 
|               <el-option | 
|                   v-for="item in solutionList" | 
|                   :key="item.baseId" | 
|                   :label="item.name" | 
|                   :value="item.baseId"> | 
|               </el-option> | 
|             </el-select> | 
|           </el-form-item> | 
|             <el-form-item label="年份" prop="year"> | 
|                 <el-date-picker | 
|                     v-model="searchForm.year" | 
|                     type="year" | 
|                     @change="search" | 
|                     :clearable="false" | 
|                     value-format="yyyy" | 
|                     placeholder="请选择年份" | 
|                     format="yyyy"  > | 
|                 </el-date-picker> | 
|             </el-form-item> | 
|             <section> | 
|                 <el-button type="primary" @click="search">搜索</el-button> | 
|                 <el-button @click="reset">重置</el-button> | 
|             </section> | 
|         </el-form> | 
|         <!-- 表格和分页 --> | 
|         <template v-slot:table-wrap> | 
|             <el-table | 
|                 v-loading="isWorking.search" | 
|                 :data="dataList" | 
|                 stripe | 
|                 show-summary | 
|                 :summary-method="getSummaries" | 
|             > | 
|                 <el-table-column label="序号" width="80px"> | 
|                     <template slot-scope="scope"> | 
|                         <span>{{scope.$index + 1}}</span> | 
|                     </template> | 
|                 </el-table-column> | 
|                 <el-table-column prop="month" label="年月" ></el-table-column> | 
|                 <el-table-column prop="countNum" label="申请单数"  ></el-table-column> | 
|                 <el-table-column prop="fee" label="费用变更(元)"  ></el-table-column> | 
|             </el-table> | 
|         </template> | 
|         <!-- 详情 --> | 
|     </TableLayout> | 
| </template> | 
|   | 
| <script> | 
| import BaseTable from '@/components/base/BaseTable' | 
| import TableLayout from '@/layouts/TableLayout' | 
| import { all as solutionAll } from '@/api/business/solutions' | 
| import { monthList } from '@/api/business/applyChange' | 
| export default { | 
|   name: 'add_subtract', | 
|   extends: BaseTable, | 
|   components: { TableLayout }, | 
|   data () { | 
|     return { | 
|       // 搜索 | 
|       searchForm: { | 
|         status: '', | 
|         type: '0', | 
|         applyId:null, | 
|         baseSolutionsId: '', | 
|         createDateE: '', | 
|         createDateS: '', | 
|         year:null | 
|       }, | 
|       solutionList: [], | 
|       dataList: [] | 
|     } | 
|   }, | 
|   created () { | 
|     this.config({ | 
|       module: '加减保换厂申请信息表', | 
|       api: '/business/applyChange', | 
|       'field.id': 'id', | 
|       'field.main': 'id' | 
|     }) | 
|     this.searchForm.year = new Date().getFullYear().toString() | 
|     this.search() | 
|     this.getAll() | 
|   }, | 
|   methods: { | 
|     getSummaries (param) { | 
|       const { columns, data } = param | 
|       const sums = [] | 
|       columns.forEach((column, index) => { | 
|         if (index === 0) { | 
|           sums[index] = '合计' | 
|         } else if (index == 3) { | 
|           let price = 0 | 
|           data.forEach(item => { | 
|             price += item.fee | 
|           }) | 
|           sums[index] = price.toFixed(2) | 
|         } | 
|       }) | 
|       return sums; | 
|     }, | 
|     getAll () { | 
|       solutionAll({ dataType: 2 }).then(res => { | 
|         this.solutionList = res | 
|       }).catch(err => { | 
|       }) | 
|     }, | 
|     search () { | 
|       monthList(this.searchForm).then(res => { | 
|         this.dataList = res | 
|       }).catch(err => { | 
|       }) | 
|     }, | 
|     changeTime (e) { | 
|       if (e.length > 0) { | 
|         this.searchForm.createDateS = e[0] | 
|         this.searchForm.createDateE = e[1] | 
|       } else { | 
|         this.searchForm.createDateS = '' | 
|         this.searchForm.createDateE = '' | 
|       } | 
|       this.search() | 
|     }, | 
|     reset () { | 
|       this.searchForm.createDateS = '' | 
|       this.searchForm.createDateE = '' | 
|       this.searchForm.time = [] | 
|       this.$refs.searchForm.resetFields() | 
|       this.search() | 
|     } | 
|   } | 
| } | 
| </script> | 
| <style> | 
| /* 自定义合计行背景色 */ | 
| ::v-deep .el-table .el-table__footer-wrapper tr { | 
|   background-color: #f2f2f2; | 
| } | 
| ::v-deep .el-table__footer tr { | 
|   background-color: #f2f2f2; | 
| } | 
|   | 
| /* 自定义合计行文本颜色 */ | 
| ::v-deep  .el-table .el-table__footer-wrapper tr td { | 
|   color: red; | 
| } | 
| ::v-deep  .el-table__footer tr td { | 
|   color: red; | 
| } | 
| </style> |