MrShi
2024-11-28 7470ad6bfa2f7d7be9c7d1e2d9c991094a3ad367
admin/src/components/common/MemberSearch/src/index.vue
@@ -1,23 +1,57 @@
<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" @click="clear()">重置</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>
@@ -25,11 +59,8 @@
</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'
export default {
  components: {
@@ -40,84 +71,50 @@
    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,
      listLoading: false
    }
  },
  created() {
    // (10: 商品折扣  20: 订场折扣 30: 门票折扣 40: 套餐折扣 50:活动折扣 60:课程折扣)
  },
  methods: {
    clearSearch() {
      this.searchValue = ''
    open () {
      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
      this.filters = {}
      this.pagination.page = 1
      this.pagination.pageSize = 10
      this.isShowMemberList = true
      this.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() {
      this.pagination.page = 1