You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							419 lines
						
					
					
						
							12 KiB
						
					
					
				
			
		
		
		
			
			
			
				
					
				
				
					
				
			
		
		
	
	
							419 lines
						
					
					
						
							12 KiB
						
					
					
				| <template> | |
|   <div class="div_main"> | |
|     <div v-show="true"> | |
|       <div class="div_search"> | |
|         <el-form :inline="true" | |
|                  :model="searchData" | |
|                  ref="ref_searchform" | |
|                  :label-width="'80px'"> | |
|           <div> | |
|             <el-form-item label="服务类别" | |
|                           prop="serviceType"> | |
|               <el-select v-model="searchData.serviceType" | |
|                          placeholder="请选择" | |
|                          size="small" | |
|                          clearable | |
|                          class="item_width_2"> | |
|                 <el-option v-for="item in categoryOptions" | |
|                            :key="item.value" | |
|                            :label="item.label" | |
|                            :value="item.value"> | |
|                 </el-option> | |
|               </el-select> | |
|             </el-form-item> | |
|             <el-form-item label="服务组织" | |
|                           prop="orgName"> | |
|               <el-input v-model="searchData.orgName" | |
|                         class="item_width_1" | |
|                         size="small" | |
|                         clearable | |
|                         placeholder="请输入"> | |
|               </el-input> | |
|             </el-form-item> | |
|  | |
|             <el-form-item label="服务地址" | |
|                           prop="address"> | |
|               <el-input v-model="searchData.address" | |
|                         class="item_width_2" | |
|                         size="small" | |
|                         clearable | |
|                         placeholder="请输入"> | |
|               </el-input> | |
|             </el-form-item> | |
|  | |
|             <el-form-item label="备注" | |
|                           prop="remark"> | |
|               <el-input v-model="searchData.remark" | |
|                         class="item_width_2" | |
|                         size="small" | |
|                         clearable | |
|                         placeholder="请输入"> | |
|               </el-input> | |
|             </el-form-item> | |
|  | |
|             <el-button style="margin-left: 30px" | |
|                        size="small" | |
|                        class="diy-button--search" | |
|                        @click="handleSearch">查询</el-button> | |
|             <el-button style="margin-left: 10px" | |
|                        size="small" | |
|                        class="diy-button--reset" | |
|                        @click="resetSearch">重置</el-button> | |
|           </div> | |
|         </el-form> | |
|       </div> | |
|  | |
|       <div class="div_table"> | |
|         <div class="div_btn"> | |
|           <el-button class="diy-button--add" | |
|                      size="small" | |
|                      @click="handleAdd">新增</el-button> | |
|  | |
|           <!-- <el-button | |
|             @click="handleExport" | |
|             class="diy-button--reset" | |
|             size="small" | |
|             >导出</el-button | |
|           > --> | |
|         </div> | |
|  | |
|         <el-table :data="tableData" | |
|                   border | |
|                   :header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" | |
|                   class="table" | |
|                   style="width: 100%" | |
|                   :height="maxTableHeight"> | |
|           <el-table-column label="序号" | |
|                            fixed="left" | |
|                            type="index" | |
|                            align="center" | |
|                            width="50" /> | |
|  | |
|           <el-table-column prop="serviceTypeName" | |
|                            align="center" | |
|                            label="服务类别" | |
|                            :show-overflow-tooltip="true"> | |
|           </el-table-column> | |
|  | |
|           <el-table-column prop="orgName" | |
|                            label="服务组织名称" | |
|                            align="center" | |
|                            :show-overflow-tooltip="true"> | |
|           </el-table-column> | |
|  | |
|           <el-table-column prop="address" | |
|                            align="center" | |
|                            label="地址" | |
|                            :show-overflow-tooltip="true"> | |
|           </el-table-column> | |
|  | |
|           <el-table-column prop="principalName" | |
|                            align="center" | |
|                            :show-overflow-tooltip="true" | |
|                            label="负责人"> | |
|           </el-table-column> | |
|  | |
|           <el-table-column prop="principalMobile" | |
|                            align="center" | |
|                            label="联系方式" | |
|                            width="90" | |
|                            :show-overflow-tooltip="true"> | |
|           </el-table-column> | |
|  | |
|           <el-table-column prop="remark" | |
|                            align="center" | |
|                            label="备注" | |
|                            :show-overflow-tooltip="true"> | |
|           </el-table-column> | |
|  | |
|           <el-table-column fixed="right" | |
|                            label="操作" | |
|                            align="center" | |
|                            width="200"> | |
|             <template slot-scope="scope"> | |
|               <el-button @click="handleWatch(scope.row)" | |
|                          type="text" | |
|                          size="small" | |
|                          class=".div-table-button--detail">查看</el-button> | |
|               <el-button @click="handleEdit(scope.row)" | |
|                          type="text" | |
|                          size="small" | |
|                          class="div-table-button--edit">编辑</el-button> | |
|               <el-popconfirm title="删除之后无法回复,确认删除?" | |
|                              @onConfirm="handleDelete(scope.row, scope.$index)" | |
|                              @confirm="handleDelete(scope.row, scope.$index)"> | |
|                 <el-button slot="reference" | |
|                            type="text" | |
|                            size="small" | |
|                            style="margin-left: 10px" | |
|                            class="div-table-button--delete">删除</el-button> | |
|               </el-popconfirm> | |
|             </template> | |
|           </el-table-column> | |
|         </el-table> | |
|  | |
|         <div> | |
|           <el-pagination @size-change="handleSizeChange" | |
|                          @current-change="handleCurrentChange" | |
|                          :current-page.sync="pageNo" | |
|                          :page-sizes="[20, 50, 100, 200]" | |
|                          :page-size="parseInt(pageSize)" | |
|                          layout="sizes, prev, pager, next, total" | |
|                          :total="total"> | |
|           </el-pagination> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- 修改弹出框 --> | |
|     <el-dialog v-if="formShow" | |
|                :visible.sync="formShow" | |
|                :close-on-click-modal="false" | |
|                :close-on-press-escape="false" | |
|                :title="formTitle" | |
|                width="850px" | |
|                top="5vh" | |
|                class="dialog-h" | |
|                @closed="handleClose"> | |
|       <edit-form ref="eleEditForm" | |
|                  :formId="formId" | |
|                  :formType="formType" | |
|                  @close="handleClose" | |
|                  @afterEdit="handleEditSuccess"></edit-form> | |
|     </el-dialog> | |
|  | |
|     <!-- 详情弹出框 --> | |
|     <el-dialog v-if="detailShow" | |
|                :visible.sync="detailShow" | |
|                :close-on-click-modal="false" | |
|                :close-on-press-escape="false" | |
|                :title="'详情'" | |
|                width="850px" | |
|                top="5vh" | |
|                class="dialog-h" | |
|                @closed="diaDetailClose"> | |
|       <detail-form ref="ref_detail" | |
|                    :formId="formId" | |
|                    @diaDetailClose="diaDetailClose"></detail-form> | |
|     </el-dialog> | |
|   </div> | |
| </template> | |
| 
 | |
| <script> | |
| import { requestPost } from "@/js/dai/request"; | |
| import nextTick from "dai-js/tools/nextTick"; | |
| import { mapGetters } from "vuex"; | |
| import axios from "axios"; | |
| import editForm from "./cpts/edit"; | |
| import detailForm from "./cpts/detail"; | |
| 
 | |
| function iniSearchData () { | |
|   return { | |
|     serviceType: "", | |
|     orgName: "", | |
|     address: "", | |
|     remark: "", | |
|   }; | |
| } | |
| 
 | |
| export default { | |
|   components: { editForm, detailForm }, | |
| 
 | |
|   data () { | |
|     return { | |
|       tableData: [], | |
| 
 | |
|       searchData: iniSearchData(), | |
|       categoryOptions: [], | |
| 
 | |
|       pageNo: 1, | |
|       pageSize: window.localStorage.getItem("pageSize") || 20, | |
|       total: 1, | |
| 
 | |
|       formId: "", | |
|       formShow: false, | |
|       formTitle: "服务项目", | |
|       formType: "", // 列表list 新增add  修改edit 详情info | |
|  | |
|       detailShow: false, | |
|     }; | |
|   }, | |
|   computed: { | |
|     maxTableHeight () { | |
|       return this.$store.state.inIframe | |
|         ? this.clientHeight - 410 + this.iframeHeigh | |
|         : this.clientHeight - 410; | |
|     }, | |
|     ...mapGetters(["clientHeight", "iframeHeight"]), | |
|   }, | |
|   watch: { | |
|     "searchData.endTime": function (val) { | |
|       if (val && val != "") { | |
|         let arrayTemp = val.split(" "); | |
|         this.searchData.endTime = arrayTemp[0] + " 23:59:59"; | |
|       } | |
|     }, | |
|   }, | |
|   mounted () { | |
|     console.log(this.$store.state); | |
|     this.user = this.$store.state.user; | |
| 
 | |
|     this.agencyId = this.user.agencyId; | |
| 
 | |
|     this.getTableData(); | |
|   }, | |
|   methods: { | |
|     handleSearch (val) { | |
|       console.log(this.searchData); | |
|       this.pageNo = 1; | |
| 
 | |
|       this.getCategoryOpitons(); | |
|       this.getTableData(); | |
|     }, | |
| 
 | |
|     async handleExport () { | |
|       const url = "/gov/project/icEvent/export"; | |
|       const { pageSize, pageNo, searchData } = this; | |
|       axios({ | |
|         url: window.SITE_CONFIG["apiURL"] + url, | |
|         method: "post", | |
|         data: { | |
|           pageSize, | |
|           pageNo, | |
|           ...searchData, | |
|         }, | |
|         responseType: "blob", | |
|       }) | |
|         .then((res) => { | |
|           let fileName = window.decodeURI( | |
|             res.headers["content-disposition"].split(";")[1].split("=")[1] | |
|           ); | |
|           console.log("filename", fileName); | |
|           let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); | |
|           var url = window.URL.createObjectURL(blob); | |
|           var aLink = document.createElement("a"); | |
|           aLink.style.display = "none"; | |
|           aLink.href = url; | |
|           aLink.setAttribute("download", fileName); | |
|           document.body.appendChild(aLink); | |
|           aLink.click(); | |
|           document.body.removeChild(aLink); //下载完成移除元素 | |
|           window.URL.revokeObjectURL(url); //释放掉blob对象 | |
|         }) | |
|         .catch((err) => { | |
|           console.log("获取导出情失败", err); | |
|           return this.$message.error("网络错误"); | |
|         }); | |
|     }, | |
| 
 | |
|     handleAdd () { | |
|       this.formType = "add"; | |
|       this.formTitle = "新增"; | |
|       this.formShow = true; | |
|     }, | |
| 
 | |
|     handleWatch (row) { | |
|       // this.formType = "watch"; | |
|       this.formId = row.icServiceOrgId; | |
|       // this.formTitle = "查看"; | |
|       // this.formShow = true; | |
|       this.detailShow = true; | |
|     }, | |
| 
 | |
|     diaDetailClose () { | |
|       console.log(this.$refs.ref_detail) | |
|       this.$refs.ref_detail.diaDestroy() | |
|       this.detailShow = false | |
|     }, | |
| 
 | |
|     handleEdit (row) { | |
|       this.formType = "edit"; | |
|       this.formId = row.icServiceOrgId; | |
|       this.formTitle = "编辑"; | |
|       this.formShow = true; | |
|     }, | |
| 
 | |
|     handleClose () { | |
|       this.formShow = false; | |
|     }, | |
| 
 | |
|     handleEditSuccess () { | |
|       this.handleClose(); | |
|       this.getTableData(); | |
|     }, | |
| 
 | |
|     async handleDelete (rowData, rowIndex) { | |
|       console.log(rowData, rowIndex); | |
|       const url = "/heart/icServiceOrg/del"; | |
|       const { tableData } = this; | |
| 
 | |
|       const { data, code, msg } = await requestPost(url, { | |
|         icServiceOrgId: tableData[rowIndex].icServiceOrgId, | |
|       }); | |
| 
 | |
|       if (code === 0) { | |
|         this.$message.success("删除成功!"); | |
|         this.getTableData(); | |
|       } else { | |
|         this.$message.error("操作失败!"); | |
|       } | |
|     }, | |
| 
 | |
|     async getCategoryOpitons () { | |
|       const url = "/sys/dict/data/dictlist"; | |
| 
 | |
|       const { data, code, msg } = await requestPost(url, { | |
|         dictType: "ic_service_type", | |
|       }); | |
| 
 | |
|       if (code === 0) { | |
|         this.categoryOptions = data || []; | |
|       } else { | |
|         this.$message.error(msg); | |
|       } | |
|     }, | |
| 
 | |
|     async getTableData () { | |
|       const url = "/heart/icServiceOrg/list"; | |
| 
 | |
|       const { pageSize, pageNo, searchData } = this; | |
|       const { data, code, msg } = await requestPost(url, { | |
|         pageSize, | |
|         pageNo, | |
|         ...searchData, | |
|       }); | |
| 
 | |
|       if (code === 0) { | |
|         this.total = data.total || 0; | |
|         this.tableData = data.list | |
|           ? data.list.map((item) => { | |
|             return item; | |
|           }) | |
|           : []; | |
|       } else { | |
|         this.$message.error(msg); | |
|       } | |
|     }, | |
| 
 | |
|     handleSizeChange (val) { | |
|       this.pageSize = val; | |
|       window.localStorage.setItem("pageSize", val); | |
|       this.getTableData(); | |
|     }, | |
|     handleCurrentChange (val) { | |
|       this.pageNo = val; | |
|       this.getTableData(); | |
|     }, | |
| 
 | |
|     resetSearch () { | |
|       this.searchData = iniSearchData(); | |
|     }, | |
|   }, | |
| }; | |
| </script> | |
| 
 | |
| <style lang="scss" scoped> | |
| @import "@/assets/scss/buttonstyle.scss"; | |
| @import "@/assets/scss/modules/management/list-main.scss"; | |
| @import "@/assets/scss/modules/shequzhili/event-info.scss"; | |
| </style>
 | |
| 
 |