shuhi-ui/src/views/optimization/fallback/index.vue

<template>
  <ele-page flex-table>
    <page-search @search="reload" />
    <common-table
      ref="pageRef"
      :pageConfig="pageConfig"
      :columns="columns"
      :tools="false"
    >
      <template #toolbar>
        <el-button
          type="danger"
          plain
          :icon="DeleteOutlined"
          v-permission="'optimization:fallback:batchDelete'"
          @click="handleBatchDelete()"
        >
          批量删除
        </el-button>
        <el-button
          type="success"
          plain
          v-permission="'optimization:fallback:export'"
          @click="handleExportExcel"
          :icon="DownloadOutlined"
        >
          导出EXCEL
        </el-button>
      </template>
      <template #action="{ row }">
        <div>
          <el-button
            type="primary"
            link
            v-permission="'optimization:fallback:detail'"
            @click="handleUpdate(row, 'detail')"
          >
            [详情]
          </el-button>
          <el-button
            type="primary"
            link
            v-permission="'optimization:fallback:deal'"
            @click="handleUpdate(row)"
          >
            去处理
          </el-button>
        </div>
      </template>
    </common-table>
    <deal-fallback ref="dealFallbackRef" @done="reload()" />
  </ele-page>
</template>

<script setup>
  import { ref, reactive } from 'vue';
  import CommonTable from '@/components/CommonPage/CommonTable.vue';
  import dealFallback from '@/views/optimization/fallback/components/deal-fallback.vue';
  import pageSearch from '@/views/optimization/fallback/components/page-search.vue';
  import { useDictData } from '@/utils/use-dict-data';

  defineOptions({ name: 'fallbackList' });
  const [useStatusDicts] = useDictData(['sys_normal_disable']);

  /** 表格列配置 */
  const columns = ref([
    {
      type: 'selection',
      columnKey: 'selection',
      width: 50,
      align: 'center',
      fixed: 'left'
    },
    { type: 'index', label: '序号', width: 60, align: 'center' },
    {
      label: '状态',
      prop: 'useStatus',
      align: 'center',
      formatter: (row) =>
        useStatusDicts.value.find((d) => d.dictValue == row.useStatus)
          ?.dictLabel
    },
    { label: '用户UID', prop: 'uid', align: 'center' },
    { label: '联系方式', prop: 'mobile', align: 'center' },
    { label: '意见类型', prop: 'type', align: 'center' },
    { label: '反馈时间', prop: 'createTime', align: 'center', width: 180 },
    {
      label: '意见描述',
      prop: 'paymentCode',
      align: 'center',
      minWidth: 200
    },
    {
      columnKey: 'action',
      label: '操作',
      width: 160,
      align: 'center',
      slot: 'action'
    }
  ]);

  /** 页面组件实例 */
  const pageRef = ref(null);

  const pageConfig = reactive({
    pageUrl: '/baseinfo/godown/pagelist',
    exportUrl: '/baseinfo/godown/export',
    fileName: '意见反馈',
    cacheKey: 'fallbackTable'
  });

  //刷新表格
  function reload(where) {
    pageRef.value?.reload(where);
  }

  //批量删除
  function handleBatchDelete(row) {
    let selections = row ? [row] : pageRef.value?.getSelections();
    let ids = selections.map((item) => item.id).join(',');
    let url = `/baseinfo/schoolInfo/removeById/${ids}`;
    pageRef.value?.operatBatch({
      title: '确认删除？',
      method: 'post',
      url,
      row
    });
  }
  //导出excel
  function handleExportExcel() {
    pageRef.value?.exportData('意见反馈');
  }

  //去处理
  const dealFallbackRef = ref(null);
  function handleUpdate(row, type) {
    dealFallbackRef.value?.handleOpen(row, type);
  }
</script>