| <template> | 
|   <GlobalWindow title="选择客户" width="1000px" @close="close" :visible.sync="isShowMemberList"> | 
|     <div> | 
|       <div class="df_ac mb20"> | 
|         <el-input v-model="modalSearchValue" placeholder="请输入客户名称" class="w400" @keyup.enter.native="queryList"> | 
|           <!-- <el-button slot="append" icon="el-icon-search" @click="queryList()" /> --> | 
|         </el-input> | 
|         <el-button class="ml10" type="primary" @click="queryList()">查询</el-button> | 
|       </div> | 
|       <el-table ref="table" v-loading="listLoading" :data="list" element-loading-text="Loading" border fit | 
|         :header-row-class-name="'table-header'" class="doumee-element-table doumee-element-tableb" | 
|         @row-click="rowClick"> | 
|   | 
|         <el-table-column align="center" label="客户类型" prop="cardName" show-overflow-tooltip min-width="80" /> | 
|         <el-table-column align="center" label="客户名称" show-overflow-tooltip prop="remainingMoney" min-width="80" /> | 
|         <el-table-column align="center" label="联系人" show-overflow-tooltip prop="remainingGiveMoney" min-width="80" /> | 
|         <el-table-column label="联系电话" prop="createTime" min-width="100" align="center" /> | 
|         <el-table-column label="统一信用代码" prop="createTime" min-width="120" align="center" /> | 
|         <el-table-column label="营业期限" prop="createTime" min-width="100" align="center" /> | 
|         <el-table-column label="默认发票类型" prop="createTime" min-width="100" align="center" /> | 
|       </el-table> | 
|       <Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" /> | 
|     </div> | 
|   </GlobalWindow> | 
| </template> | 
|   | 
| <script> | 
| import { memberList, memberDetailInfo } from '@/api' | 
| import GlobalWindow from '@/components/common/GlobalWindow' | 
| import dayjs from 'dayjs' | 
| // import { debounce } from '@/utils/debounce' | 
|   | 
| import Pagination from '@/components/common/Pagination' | 
| export default { | 
|   components: { | 
|     Pagination, | 
|     GlobalWindow | 
|   }, | 
|   props: { | 
|     isShowChooseBtn: { | 
|       type: Boolean, | 
|       default: () => true | 
|     }, | 
|     type: { // (10: 商品折扣  20: 订场折扣 30: 门票折扣 40: 套餐折扣 50:活动折扣 60:课程折扣) | 
|       type: String, | 
|       default: 'default' | 
|     } | 
|   }, | 
|   data() { | 
|     return { | 
|       searchValue: '', | 
|       isShowMemberList: false, | 
|       modalSearchValue: '', | 
|       list: [], | 
|       totalCount: 0, | 
|       pagination: { | 
|         pageSize: 10, | 
|         page: 1, | 
|         total: 0 | 
|       }, | 
|       listLoading: false, | 
|   | 
|     } | 
|   }, | 
|   created() { | 
|     // (10: 商品折扣  20: 订场折扣 30: 门票折扣 40: 套餐折扣 50:活动折扣 60:课程折扣) | 
|   }, | 
|   methods: { | 
|     clearSearch() { | 
|       this.searchValue = '' | 
|       this.modalSearchValue = '' | 
|     }, | 
|     handleMemberSelect(item) { | 
|       memberDetailInfo({ param: { memberId: item.id } }).then((res) => { | 
|         if (res.errorCode !== '000000') return | 
|         const obj = res.record || {} | 
|         obj.searchValue = this.searchValue | 
|         this.$emit('select', obj) | 
|       }) | 
|     }, | 
|     clear() { | 
|       this.searchValue = '' | 
|       setTimeout(() => { | 
|         this.$refs.searchValueRef.focus() | 
|       }) | 
|       this.$emit('clear') | 
|     }, | 
|     rowClick(item) { | 
|       memberDetailInfo({ param: { memberId: item.id } }).then((res) => { | 
|         if (res.errorCode !== '000000') return | 
|         const obj = res.record || {} | 
|         this.searchValue = obj.nickName | 
|         obj.searchValue = this.modalSearchValue | 
|         if (item.phone) { | 
|           this.searchValue += '-' + item.phone | 
|         } | 
|         if (item.number) { | 
|           this.searchValue += '(' + item.number + ')' | 
|         } | 
|         this.$emit('select', obj) | 
|       }) | 
|       this.isShowMemberList = false | 
|     }, | 
|     getList() { | 
|       const { pagination, modalSearchValue } = this | 
|       this.listLoading = true | 
|       memberList({ pagination, param: { keyword: modalSearchValue } }).then((res) => { | 
|         this.listLoading = false | 
|         if (res.errorCode !== '000000') return | 
|         this.list = res.recordList | 
|         this.pagination.total = res.total || 0 | 
|         this.totalCount = res.totalCount | 
|       }, () => { | 
|         this.listLoading = false | 
|       }) | 
|     }, | 
|     openModal() { | 
|       this.modalSearchValue = '' | 
|       // this.queryList() | 
|       this.isShowMemberList = true | 
|     }, | 
|     queryList() { | 
|       this.pagination.page = 1 | 
|       this.getList() | 
|     }, | 
|     currentChange(val) { | 
|       this.pagination.page = val | 
|       this.getList() | 
|     }, | 
|     clear() { | 
|       this.filters = {} | 
|       this.pagination.pageSize = 10 | 
|       this.pagination.page = 1 | 
|       this.getList() | 
|     }, | 
|     handleSizeChange(capacity) { | 
|       this.pagination.pageSize = capacity | 
|       this.getList() | 
|     }, | 
|     close() { | 
|       this.isShowMemberList = false | 
|     } | 
|   } | 
| } | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
| .member_search_wrap { | 
|   display: flex; | 
|   | 
|   ::v-deep .el-input__validateIcon { | 
|     display: none !important; | 
|   } | 
| } | 
| </style> |