yunyubang-web/src/views/business/merchantManage.vue

<template>
  <div style="padding: 0px 20px">
    <div ref="lxHeader">
      <lx-header icon="md-apps" text="商户管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
        <div slot="content"></div>
        <slot>
          <div>
            <Input style="width: 200px; margin-right: 10px" placeholder="关键字搜索" />
            <Button type="primary" @click="getMerchant">查询</Button>
            <Button type="primary" style="margin-left: 10px" @click="$refs['addMerchant'].isShow = true,$refs['addMerchant'].type = 'add'">新增商户</Button>
          </div>
        </slot>
      </lx-header>
    </div>

    <xy-table :list="list" :table-item="tableItem" @editor="editorShow" @delete="deleteMerchant"></xy-table>

    <div style="display: flex;justify-content: flex-end;">
      <Page :total="total" show-elevator @on-change="pageChange"/>
    </div>

<!--    新增商户-->
    <addMerchant ref="addMerchant" @refresh="getMerchant"></addMerchant>
  </div>
</template>

<script>
import {index,destroy} from "@/api/merchant"

import addMerchant from './component/addMerchant'
import { Message } from 'element-ui'
export default {
  components:{
    addMerchant
  },
  data() {
    return {
      select:{
        pageSize:10,
        pageIndex:1,

      },

      total:0,
      list:[],
      tableItem:[
        {
          prop:'username',
          label:'简称/用户名',
          width:150,
          sortable:false
        },
        {
          prop:'name',
          label:'全名',
          width: 200,
          sortable:false,
          align:'left'
        },
        {
          prop:'business_number',
          label:'营业执照号码',
          width: 180
        },
        {
          prop:"address",
          label:"地址",
          width: 300,
          align:'left'
        },
        {
          prop:"boss",
          label:"法人/老板",
          width:110
        },
        {
          prop:"boss_phone",
          label:"法人/老板电话",
          width:150
        },
        {
          prop:"contact",
          label:"联系人",
          width: 110
        },
        {
          prop:"phone",
          label:"联系电话",
          width: 150
        },
        {
          prop:"shops_count",
          label:"门店数",
          width: 100
        },
        {
          prop:"state",
          label: "状态"
        }
      ]

    }
  },
  methods: {
    pageChange(e){
      this.select.pageIndex = e
      this.getMerchant()
    },

    async getMerchant(){
      const res = await index({
        page_size:this.select.pageSize,
        page:this.select.pageIndex
      })
      this.list = res.data
      this.total = res.total
    },

    deleteMerchant(row){
      console.log(row.id)
      destroy({ id: row.id }).then(res => {
        Message({
          type:'success',
          message:'删除成功'
        })
        this.getMerchant()
      })
    },

    editorShow(row){
      this.$refs['addMerchant'].id = row.id
      this.$refs['addMerchant'].type = 'editor'
      this.$refs['addMerchant'].isShow = true
    }
  },
  mounted() {
    this.getMerchant()
  }

}
</script>

<style scoped lang="scss">
</style>