parking/src/views/backend/enterprise/store/storeManage/index.vue

<template>
  <div class="default-main ">
    <el-alert class="ba-table-alert" v-if="baTable.table.remark" :title="baTable.table.remark" type="info"
              show-icon/>
    <el-row>
      <el-col :span="24">

        <!-- 表格顶部菜单 -->
        <TableHeader :buttons="['refresh', 'add', 'edit', 'delete', 'comSearch']"
                     quick-search-placeholder="通过标题模糊搜索"
                     @action="baTable.onTableHeaderAction"/>
        <!-- 表格 -->
        <!-- 要使用`el-table`组件原有的属性，直接加在Table标签上即可 -->
        <Table @action="baTable.onTableAction"/>

      </el-col>
    </el-row>

    <!-- 表单 -->
    <PopupForm ref="formRef"/>

  </div>
</template>

<script setup lang="ts">
import {ref, onMounted, provide} from 'vue'
import { store } from "/@/api/controllerUrls";
import Table from '/@/components/table/index.vue'
import TableHeader from '/@/components/table/header/index.vue'
import {defaultOptButtons} from '/@/components/table'
import PopupForm from './popupForm.vue'
import {baTableApi} from '/@/api/common'
import baTableClass from '/@/utils/baTable'


const baTable = new baTableClass(
  new baTableApi(store),
  {
    dblClickNotEditColumn: [undefined, 'status'],
    column: [
      {type: 'selection', align: 'center', operator: false},
      {label: '门店名称', prop: 'storeName', align: 'left', operator: 'LIKE'},
      {
        label: "门店类型",
        prop: "storeType",
        align: "center",
        render: "tag",
        operator: "=",
        replaceValue: { 0: "自营", 1: "加盟" }
      },
      {label: '门店LOGO', prop: 'storeLogo', align: 'center',render:'images', operator: false},
      {
        label: "门店状态",
        prop: "storeStatus",
        align: "center",
        render: "tag",
        operator: "=",
        replaceValue: { 0: "正常", 1: "停用" }
      },
      {label: '创建人', prop: 'creatorName', align: 'center', width: '120', operator: false},
      {label: '创建时间', prop: 'createTime', align: 'center', width: '180', operator: false},
      {
        label: '操作',
        align: 'center',
        width: '160',
        render: 'buttons',
        buttons: defaultOptButtons(),
        operator: false
      },
    ],
  },
  {
    defaultItems: {},
  },
  {
    // 获得编辑数据后
    requestEdit: () => {
      if (baTable.form.items && !baTable.form.items.icon) baTable.form.items.icon = 'el-icon-Minus'
    },
  }
)

provide('baTable', baTable)

onMounted(() => {
  baTable.mount()
  baTable.getIndex()
})
</script>


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