| | |
| | | <template> |
| | | <GlobalWindow title="选择客户" width="1000px" @close="close" :visible.sync="isShowMemberList"> |
| | | <GlobalWindow title="选择客户" width="80%" :withFooter="false" @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> |
| | | <el-button class="ml10 mr10" type="primary" @click="queryList()">查询</el-button> |
| | | <el-button class="ml10" @click="clear()">重置</el-button> |
| | | <el-button class="ml10" type="primary" @click="$refs.operaYwCustomerWindow.open('新建客户')">新建客户</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-column align="center" label="客户类型" show-overflow-tooltip min-width="80"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.type === 0">个人</span> |
| | | <span v-if="row.type === 1">企业</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column align="center" label="客户名称" show-overflow-tooltip prop="name" min-width="80" /> |
| | | <el-table-column align="center" label="联系人" show-overflow-tooltip prop="memberName" min-width="80" /> |
| | | <el-table-column label="联系电话" prop="memberPhone" min-width="100" align="center" /> |
| | | <el-table-column label="统一信用代码" prop="creditCard" min-width="120" align="center"> |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.type === 1"> |
| | | <span v-if="row.fpType === 0">增值税普通发票</span> |
| | | <span v-else-if="row.fpType === 1">增值税专用发票</span> |
| | | <span v-else>-</span> |
| | | </div> |
| | | <div v-else>-</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="营业期限" prop="validity" min-width="100" align="center"> |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.type === 1"> |
| | | <span>{{row.validity || '-'}}</span> |
| | | </div> |
| | | <div v-else>-</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="默认发票类型" min-width="100" align="center"> |
| | | <template slot-scope="{row}"> |
| | | <div v-if="row.type === 1"> |
| | | <span v-if="row.fpType === 0">增值税普通发票</span> |
| | | <span v-else-if="row.fpType === 1">增值税专用发票</span> |
| | | <span v-else>-</span> |
| | | </div> |
| | | <div v-else>-</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" min-width="100" align="center"> |
| | | <template slot-scope="{row}"> |
| | | <span class="primaryColor cu" @click="selectItem(row)">选择</span> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" /> |
| | | <div style="text-align: right; margin-top: 15px;"> |
| | | <Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" /> |
| | | </div> |
| | | </div> |
| | | <!-- 新建/修改 --> |
| | | <OperaYwCustomerWindow ref="operaYwCustomerWindow" @success="clear" /> |
| | | </GlobalWindow> |
| | | </template> |
| | | |
| | | <script> |
| | | import { memberList, memberDetailInfo } from '@/api' |
| | | import { fetchList } from '@/api/customer' |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import dayjs from 'dayjs' |
| | | // import { debounce } from '@/utils/debounce' |
| | | |
| | | import Pagination from '@/components/common/Pagination' |
| | | import OperaYwCustomerWindow from '@/views/client/components/OperaYwCustomerWindow' |
| | | export default { |
| | | components: { |
| | | Pagination, |
| | | GlobalWindow |
| | | GlobalWindow, |
| | | OperaYwCustomerWindow |
| | | }, |
| | | props: { |
| | | isShowChooseBtn: { |
| | | type: Boolean, |
| | | default: () => true |
| | | }, |
| | | type: { // (10: 商品折扣 20: 订场折扣 30: 门票折扣 40: 套餐折扣 50:活动折扣 60:课程折扣) |
| | | type: String, |
| | | default: 'default' |
| | | } |
| | | }, |
| | | data() { |
| | | data () { |
| | | return { |
| | | searchValue: '', |
| | | isShowMemberList: false, |
| | | modalSearchValue: '', |
| | | list: [], |
| | | totalCount: 0, |
| | | pagination: { |
| | | pageSize: 10, |
| | | page: 1, |
| | | total: 0 |
| | | }, |
| | | listLoading: false, |
| | | |
| | | listLoading: false |
| | | } |
| | | }, |
| | | created() { |
| | | // (10: 商品折扣 20: 订场折扣 30: 门票折扣 40: 套餐折扣 50:活动折扣 60:课程折扣) |
| | | }, |
| | | methods: { |
| | | clearSearch() { |
| | | this.searchValue = '' |
| | | open () { |
| | | this.modalSearchValue = '' |
| | | this.filters = {} |
| | | this.pagination.page = 1 |
| | | this.pagination.pageSize = 10 |
| | | this.isShowMemberList = true |
| | | this.getList() |
| | | }, |
| | | 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() { |
| | | getList () { |
| | | const { pagination, modalSearchValue } = this |
| | | this.listLoading = true |
| | | memberList({ pagination, param: { keyword: modalSearchValue } }).then((res) => { |
| | | fetchList({ |
| | | capacity: pagination.pageSize, |
| | | page: pagination.page, |
| | | model: { |
| | | name: modalSearchValue |
| | | } |
| | | }).then((res) => { |
| | | this.listLoading = false |
| | | if (res.errorCode !== '000000') return |
| | | this.list = res.recordList |
| | | this.list = res.records |
| | | this.pagination.total = res.total || 0 |
| | | this.totalCount = res.totalCount |
| | | }, () => { |
| | | this.listLoading = false |
| | | }) |
| | | }, |
| | | openModal() { |
| | | this.modalSearchValue = '' |
| | | // this.queryList() |
| | | this.isShowMemberList = true |
| | | selectItem (row) { |
| | | this.$emit('select', row) |
| | | this.isShowMemberList = false |
| | | }, |
| | | queryList() { |
| | | queryList () { |
| | | this.pagination.page = 1 |
| | | this.getList() |
| | | }, |
| | | currentChange(val) { |
| | | currentChange (val) { |
| | | this.pagination.page = val |
| | | this.getList() |
| | | }, |
| | | clear() { |
| | | clear () { |
| | | this.filters = {} |
| | | this.pagination.pageSize = 10 |
| | | this.pagination.page = 1 |
| | | this.getList() |
| | | }, |
| | | handleSizeChange(capacity) { |
| | | handleSizeChange (capacity) { |
| | | this.pagination.pageSize = capacity |
| | | this.getList() |
| | | }, |
| | | close() { |
| | | close () { |
| | | this.isShowMemberList = false |
| | | } |
| | | } |