feat

src/views/InvoiceSales/refund/components/refund-form.vue

@@ -77,11 +77,11 @@ function handleCreate() {
       />
     </el-form-item>
 
-    <el-form-item label="申请类型" prop="type">
+    <!-- <el-form-item label="申请类型" prop="type">
       <el-select v-model="formData.type" placeholder="请选择申请类型" w-380px>
         <el-option value="2" label="解除资金认领" />
       </el-select>
-    </el-form-item>
+    </el-form-item> -->
 
     <el-form-item label="退款原因" prop="return_reason" w-480px>
       <el-input v-model="formData.return_reason" placeholder="请输入退款原因" />

src/views/InvoiceSales/refund/config/content.config.ts

@@ -45,17 +45,17 @@ const columns = [
     prop: "goodNo",
     width: "120px"
   },
-  {
-    label: "退款类型",
-    prop: "status",
-    width: "120px",
-    cellRenderer: ({ row }) => {
-      return h(ElTag, null, {
-        default: () =>
-          refund_type.find(s => s.value === String(row.type))?.label || "--"
-      });
-    }
-  },
+  // {
+  //   label: "退款类型",
+  //   prop: "status",
+  //   width: "120px",
+  //   cellRenderer: ({ row }) => {
+  //     return h(ElTag, null, {
+  //       default: () =>
+  //         refund_type.find(s => s.value === String(row.type))?.label || "--"
+  //     });
+  //   }
+  // },
   {
     label: "状态",
     prop: "status",

src/views/InvoiceSales/refund/config/search.config.ts

@@ -53,12 +53,12 @@ const searchFormConfig: FormConfig = {
       type: "input",
       placeholder: "申请人"
     },
-    {
-      field: "type",
-      type: "select",
-      placeholder: "退款类型",
-      options: refund_type
-    },
+    // {
+    //   field: "type",
+    //   type: "select",
+    //   placeholder: "退款类型",
+    //   options: refund_type
+    // },
     {
       field: "status",
       type: "select",

src/views/system/updates/columns.tsx

@@ -1,74 +0,0 @@
-import { ref } from "vue";
-import dayjs from "dayjs";
-import { statusList, levelList } from "/@/utils/status";
-export function useColumns() {
-  const columns = ref([
-    {
-      type: "selection",
-      width: 55,
-      hide: ({ checkList }) => !checkList.includes("勾选列")
-    },
-    {
-      label: "序号",
-      type: "index",
-      width: 70,
-      hide: ({ checkList }) => !checkList.includes("序号列")
-    },
-
-    {
-      label: "角色名称",
-      prop: "role_name"
-    },
-    {
-      label: "等级",
-      prop: "level",
-      cellRenderer: ({ row, props }) => (
-        <el-tag
-          size={props.size}
-          type={
-            (levelList.find(item => item.value == row.level + "") || {}).type ||
-            "info"
-          }
-          effect="plain"
-        >
-          {(levelList.find(item => item.value == row.level + "") || {}).label ||
-            "--"}
-        </el-tag>
-      )
-    },
-    {
-      label: "状态",
-      prop: "status",
-      cellRenderer: ({ row, props }) => (
-        <el-tag
-          size={props.size}
-          type={
-            (statusList.find(item => item.value == row.status + "") || {})
-              .type || "info"
-          }
-          effect="plain"
-        >
-          {(statusList.find(item => item.value == row.status + "") || {})
-            .label || "--"}
-        </el-tag>
-      )
-    },
-
-    {
-      label: "创建时间",
-      prop: "createTime",
-      formatter: ({ createTime }) =>
-        dayjs(createTime).format("YYYY-MM-DD HH:mm:ss")
-    },
-    {
-      label: "操作",
-      fixed: "right",
-      width: 145,
-      slot: "operation"
-    }
-  ]);
-
-  return {
-    columns
-  };
-}

src/views/system/updates/component/choose-form.vue

@@ -0,0 +1,75 @@
+<script setup lang="ts">
+import { ref, watch, unref } from "vue";
+import { ElForm } from "element-plus";
+// import ReconciliationForm from "/@/components/ReconciliationForm";
+import { createRules } from "../config/_rules";
+import { useAsync } from "/@/hooks/core/useAsync";
+import ChooseModal from "./choose-modal.vue";
+import { httpDetail } from "/@/api/purchase/orderPay";
+import { purchpayColumns } from "../../purchPay/config/_details";
+import BasicDescriptions from "/@/components/BasicDescriptions";
+
+const emit = defineEmits(["create"]);
+
+const formRef = ref<InstanceType<typeof ElForm> | null>(null);
+const chooseModalRef = ref<InstanceType<typeof ChooseModal> | null>(null);
+const { data: detail, run: runDetail } = useAsync<Record<string, string>>({
+  initalData: {}
+});
+
+const formData = ref({
+  dzNo: "",
+  reason: ""
+});
+
+const handleChoose = () => chooseModalRef.value.onDisplay();
+
+function handleCreate() {
+  emit("create", unref(formData));
+}
+
+watch(
+  () => formData.value.dzNo,
+  DzNo => runDetail(httpDetail({ DzNo }))
+);
+</script>
+
+<template>
+  <div w-full>
+    <ElForm ref="formRef" :model="formData" :rules="createRules">
+      <ElFormItem label="采购付款" prop="dzNo">
+        <div class="w-full flex justify-end">
+          <ElButton type="primary" text @click="() => handleChoose()"
+            >选择</ElButton
+          >
+        </div>
+
+        <div class="w-full" v-if="Object.keys(detail).length > 0">
+          <BasicDescriptions :columns="purchpayColumns" :data="detail" />
+        </div>
+      </ElFormItem>
+
+      <ElFormItem label="退款原因" prop="reason">
+        <ElInput
+          type="textarea"
+          style="width: 350px"
+          v-model="formData.reason"
+          placeholder="请输入退款原因"
+        />
+      </ElFormItem>
+
+      <ElFormItem>
+        <div class="flex w-full justify-end">
+          <ElButton type="primary" @click="handleCreate">保存</ElButton>
+        </div>
+      </ElFormItem>
+    </ElForm>
+
+    <ChooseModal
+      ref="chooseModalRef"
+      @choose="dzNo => (formData.dzNo = dzNo)"
+    />
+  </div>
+</template>
+
+<style lang="scss" scoped></style>

src/views/system/updates/component/choose-modal.vue

@@ -0,0 +1,176 @@
+<script setup lang="ts">
+import { ref, unref, reactive } from "vue";
+import { ElMessage, ElTable } from "element-plus";
+import { columns } from "../config/_details";
+import { useResponseHandle } from "/@/hooks";
+import { pay_status } from "/@/utils/details/reconciliation";
+import { httpList } from "/@/api/purchase/orderPay";
+import { useCompany } from "/@/hooks/core/useCompany";
+
+const emit = defineEmits(["choose"]);
+
+const visible = ref(false);
+const paymentList = ref<Array<Record<string, string>>>([]);
+const selects = ref<Array<Record<string, string>>>([]);
+
+const pagination = reactive({
+  total: 0,
+  size: 15,
+  page: 1,
+  background: true
+});
+
+const formData = ref<Record<string, string>>({
+  pay_status: "",
+  currentValue: ""
+});
+
+const tableRef = ref<InstanceType<typeof ElTable>>(null);
+const currentKey = ref("payNo");
+const loading = ref(false);
+const responseHandle = useResponseHandle();
+const { currentCompany } = useCompany();
+
+//初始化订单对账列表
+async function requestPaymentList() {
+  const { size, page } = pagination;
+  loading.value = true;
+
+  const { currentValue, ...otherParams } = formData.value;
+
+  const { code, message, data } = await httpList({
+    status: "3",
+    [currentKey.value]: currentValue,
+    supplierNo: currentCompany.value.companyNo,
+    ...otherParams,
+    page,
+    size
+  });
+
+  responseHandle({
+    code,
+    message,
+    handler: () => {
+      pagination.total = data.count;
+      paymentList.value = data.list;
+    }
+  });
+  loading.value = false;
+}
+
+function handleConfirm() {
+  const [order] = selects.value;
+  if (!order) return ElMessage.warning("选择一条采购付款");
+  emit("choose", unref(order.dzNo));
+  visible.value = false;
+}
+
+function handleSelectionChange(values) {
+  if (values.length > 1) {
+    const value = values.pop();
+    tableRef.value.clearSelection();
+    tableRef.value.toggleRowSelection(value, true);
+    selects.value = [value];
+  } else {
+    selects.value = [values[0]];
+  }
+}
+
+function handleSizeChange() {
+  pagination.page = 1;
+  requestPaymentList();
+}
+
+function handleSearch(_isReset?: boolean) {
+  if (_isReset) formData.value = {};
+  pagination.page = 1;
+  requestPaymentList();
+}
+
+defineExpose({
+  onDisplay: () => (visible.value = true)
+});
+</script>
+
+<template>
+  <el-dialog
+    v-model="visible"
+    title="采购付款"
+    center
+    width="1040px"
+    @open="() => requestPaymentList()"
+  >
+    <div flex justify-between mb-2>
+      <div flex gap-2>
+        <el-input
+          clearable
+          v-model="formData.currentValue"
+          placeholder="对账编号"
+        >
+          <template #prepend>
+            <el-select v-model="currentKey" style="width: 130px">
+              <el-option label="对账编号" value="payNo" />
+              <el-option label="买方公司编号" value="companyNo" />
+            </el-select>
+          </template>
+        </el-input>
+      </div>
+
+      <div>
+        <el-button type="primary" @click="() => handleSearch()">搜索</el-button>
+        <el-button @click="() => handleSearch(true)">重置</el-button>
+      </div>
+    </div>
+    <el-table
+      border
+      ref="tableRef"
+      :data="paymentList"
+      size="small"
+      row-key="id"
+      @selection-change="handleSelectionChange"
+      mb-2
+      v-loading="loading"
+      max-height="520px"
+    >
+      <el-table-column type="selection" width="55" />
+      <el-table-column
+        v-for="(col, index) in columns"
+        :key="index"
+        v-bind="col"
+        show-overflow-tooltip
+      >
+        <template #="{ row }">
+          <el-tag v-if="col.prop === 'pay_status'">{{
+            pay_status.find(p => p.value === row.pay_status)?.label
+          }}</el-tag>
+
+          <span v-else>{{ row[col.prop] }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <div flex>
+      <el-pagination
+        v-model:current-page="pagination.page"
+        v-model:page-size="pagination.size"
+        :total="pagination.total"
+        :page-sizes="[15, 50, 100]"
+        layout="sizes, prev, pager, next"
+        @current-change="requestPaymentList"
+        @size-change="handleSizeChange"
+      />
+
+      <div w-full flex justify-end mt-2>
+        <el-button type="primary" @click="handleConfirm">保存</el-button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<style lang="scss" scoped>
+:deep(.el-table__header) {
+  .el-checkbox {
+    display: none;
+  }
+}
+</style>

src/views/system/updates/config/_details.ts

@@ -0,0 +1,184 @@
+import { h } from "vue";
+import { ElImage, ElTag } from "element-plus";
+import { statusOptions } from "./_options";
+import { DescriptionColumns } from "/@/components/BasicDescriptions";
+import { createTooltip } from "/@/utils/tootip";
+
+export const purchpayColumns: DescriptionColumns = [
+  {
+    field: "payNo",
+    span: 2,
+    label: "对账申请编号"
+  },
+  {
+    field: "dzNo",
+    span: 2,
+    label: "付款申请编号"
+  },
+  {
+    field: "apply_name",
+    span: 2,
+    label: "申请人",
+    render: (apply_name, { apply_id }) =>
+      createTooltip(apply_name, "申请人ID : " + apply_id, 90)
+  },
+  {
+    field: "pay_fee",
+    label: "申请付款额度"
+  },
+  {
+    field: "addtime",
+    label: "申请时间"
+  },
+  {
+    field: "return_img",
+    label: "付款回执",
+    render(return_img) {
+      const chunks = return_img?.split(",");
+      if (!chunks) return null;
+
+      return chunks.map(src => {
+        return h(ElImage, {
+          src,
+          previewSrcList: [src],
+          style: {
+            height: "20px"
+          }
+        });
+      });
+    }
+  },
+  {
+    field: "return_time",
+    label: "付款回执时间"
+  },
+  {
+    field: "status",
+    label: "状态",
+    span: 2,
+    render(status) {
+      return h(ElTag, null, {
+        default: () =>
+          statusOptions.find(s => String(status) === s.value)?.label || "--"
+      });
+    }
+  },
+  {
+    field: "remark",
+    label: "备注"
+  }
+];
+
+export const purchpayReliveColumns: DescriptionColumns = [
+  {
+    field: "returnCode",
+    span: 2,
+    label: "退款编号"
+  },
+  {
+    field: "payNo",
+    span: 2,
+    label: "对账申请编号"
+  },
+  {
+    field: "apply_name",
+    span: 2,
+    label: "申请人",
+    render: (apply_name, { apply_id }) =>
+      createTooltip(apply_name, "申请人ID : " + apply_id, 90)
+  },
+  {
+    field: "supplierName",
+    span: 2,
+    label: "卖方公司",
+    render: (supplierName, { supplierNo }) =>
+      createTooltip(supplierName, "卖方公司编号 : " + supplierNo, 360)
+  },
+  {
+    field: "companyName",
+    span: 2,
+    label: "买方公司",
+    render: (companyName, { companyNo }) =>
+      createTooltip(companyName, "买方公司编号 : " + companyNo, 360)
+  },
+  {
+    field: "pay_fee",
+    label: "申请付款额度"
+  },
+  {
+    field: "addtime",
+    label: "申请时间"
+  },
+  {
+    field: "returnImg",
+    label: "退款回执",
+    render(src) {
+      return h(ElImage, {
+        src,
+        previewSrcList: [src],
+        style: {
+          height: "20px"
+        }
+      });
+    }
+  },
+  {
+    field: "status",
+    label: "状态",
+    span: 2,
+    render(status) {
+      return h(ElTag, null, {
+        default: () =>
+          statusOptions.find(s => String(status) === String(s.value))?.label ||
+          "--"
+      });
+    }
+  },
+  {
+    field: "remark",
+    label: "备注"
+  }
+];
+
+export const columns = [
+  {
+    label: "对账编号",
+    prop: "payNo",
+    minWidth: 160,
+    align: "left"
+  },
+  {
+    label: "卖方公司编号",
+    prop: "supplierNo",
+    minWidth: 150,
+    align: "left"
+  },
+  {
+    label: "买方公司编号",
+    prop: "companyNo",
+    minWidth: 150
+  },
+  {
+    label: "买方公司名称",
+    prop: "companyName",
+    minWidth: 180
+  },
+  {
+    label: "总额款",
+    prop: "total_fee",
+    minWidth: 110,
+    align: "total_fee"
+  },
+  {
+    label: "本次付款金额",
+    prop: "dpay_fee",
+    minWidth: 110,
+    align: "left"
+  },
+  {
+    label: "申请人",
+    prop: "apply_name",
+    minWidth: 90,
+    align: "total_fee"
+  }
+];

src/views/system/updates/config/_options.ts

@@ -0,0 +1,45 @@
+export const statusOptions = [
+  {
+    value: "1",
+    label: "待审核"
+  },
+  {
+    value: "2",
+    label: "审核通过"
+  },
+  {
+    value: "3",
+    label: "审核驳回"
+  }
+];
+
+export const paymentStatusOptions = [
+  {
+    label: "待系统查票",
+    value: "1"
+  },
+  {
+    label: "待买方公司审核",
+    value: "2"
+  },
+  {
+    label: "验证失败",
+    value: "3"
+  },
+  {
+    label: "待买方公司认证",
+    value: "4"
+  },
+  {
+    label: "买方公司驳回",
+    value: "5"
+  },
+  {
+    label: "认证成功",
+    value: "6"
+  },
+  {
+    label: "认证失败",
+    value: "7"
+  }
+];

src/views/system/updates/config/_rules.ts

@@ -0,0 +1,12 @@
+import { FormRules } from "element-plus";
+
+export const createRules: FormRules = {
+  dzNo: [{ required: true, trigger: "change", message: "请选择采购付款" }],
+  reason: [
+    {
+      required: true,
+      trigger: "change",
+      message: "请输入解除原因"
+    }
+  ]
+};

src/views/system/updates/config/content.config.ts

@@ -0,0 +1,106 @@
+import { ContentConfig } from "/@/components/PageContent";
+import { httpList, httpDelete } from "/@/api/purchase/purchPayRelive";
+
+import dayjs from "dayjs";
+import { h } from "vue";
+import { ElTag } from "element-plus";
+import { statusOptions } from "./_options";
+
+const columns = [
+  {
+    type: "selection",
+    minWidth: 55,
+    align: "left",
+    hide: ({ checkList }) => !checkList.includes("勾选列")
+  },
+  {
+    label: "序号",
+    type: "index",
+    minWidth: 60,
+    align: "left",
+    hide: ({ checkList }) => !checkList.includes("序号列")
+  },
+  {
+    label: "退款申请编号",
+    prop: "returnCode",
+    minWidth: 180,
+    align: "left"
+  },
+  {
+    label: "对账编号",
+    prop: "payNo",
+    minWidth: 180,
+    align: "left"
+  },
+  {
+    label: "卖方公司编号",
+    prop: "supplierNo",
+    minWidth: 180,
+    align: "left"
+  },
+  {
+    label: "买方公司名称",
+    prop: "companyName",
+    minWidth: 180
+  },
+  {
+    label: "买方公司编号",
+    prop: "companyNo",
+    minWidth: 180
+  },
+  {
+    label: "买方公司名称",
+    prop: "companyNo",
+    minWidth: 180
+  },
+  {
+    label: "状态",
+    prop: "status",
+    minWidth: 120,
+    cellRenderer: ({ row, props }) =>
+      h(
+        ElTag,
+        {
+          size: props.size
+        },
+        {
+          default: () =>
+            statusOptions.find(s => String(row.status) === s.value)?.label
+        }
+      )
+  },
+  {
+    label: "申请人",
+    prop: "apply_name",
+    minWidth: 90,
+    align: "left"
+  },
+  {
+    label: "申请时间",
+    minWidth: 180,
+    prop: "addtime",
+    formatter: ({ addtime }) => dayjs(addtime).format("YYYY-MM-DD HH:mm:ss")
+  },
+  {
+    label: "操作",
+    fixed: "right",
+    width: 100,
+    slot: "operation"
+  }
+];
+
+const contentConfig: ContentConfig = {
+  title: "采购付款",
+  columns,
+  deleteProp: "dzNo",
+  showDelete: ({ dstatus }) => Number(dstatus) !== 3,
+  companyProp: "supplierNo",
+  superUserNoAction: true,
+  apis: {
+    httpList,
+    httpDelete,
+    httpAdd: true
+  }
+};
+
+export default contentConfig;

src/views/system/updates/config/search.config.ts

@@ -0,0 +1,36 @@
+import { FormConfig } from "/@/components/PageSearch";
+import { statusOptions } from "./_options";
+
+const searchFormConfig: FormConfig = {
+  formItems: [
+    {
+      field: "returnCode",
+      type: "input",
+      placeholder: "退款申请编号"
+    },
+    {
+      field: "payNo",
+      type: "input",
+      placeholder: "对账编号"
+    },
+    {
+      field: "timer",
+      type: "date_picker",
+      otherOptions: {
+        type: "daterange",
+        startProp: "start",
+        endProp: "end",
+        startPlaceholder: "申请开始时间",
+        endPlaceholder: "申请结束时间"
+      }
+    },
+    {
+      field: "status",
+      type: "select",
+      placeholder: "审核状态",
+      options: statusOptions
+    }
+  ]
+};
+
+export default searchFormConfig;

src/views/system/updates/index.vue

@@ -1,228 +1,29 @@
 <script setup lang="ts">
-import { useColumns } from "./columns";
-import { httpList, httpStatus } from "/@/api/system/updates";
-import { reactive, ref, onMounted } from "vue";
-import { type FormInstance } from "element-plus";
-import { ElMessage } from "element-plus";
-import { TableProBar } from "/@/components/ReTable";
-import { type PaginationProps } from "@pureadmin/table";
-import { useRenderIcon } from "/@/components/ReIcon/src/hooks";
-import { useNav } from "/@/layout/hooks/nav";
-import { statusList } from "/@/utils/status";
-const { logout } = useNav();
-defineOptions({
-  name: "role"
-});
+import contentConfig from "./config/content.config";
+import searchConfig from "./config/search.config";
+import { usePageSearch, type PageHooks, type PageEvents } from "/@/hooks/page";
 
-const form = reactive({
-  name: "",
-  page: 1,
-  size: 15
-});
+const PageName = "updates";
 
-const dataList = ref([]);
-const loading = ref(true);
-const { columns } = useColumns();
-const showModel = ref(false);
-const itemId = ref("");
-const isDetails = ref("add");
-const formRef = ref<FormInstance>();
-
-const pagination = reactive<PaginationProps>({
-  total: 0,
-  pageSize: 15,
-  currentPage: 1,
-  background: true
-});
-
-//修改状态
-const handleStatus = async row => {
-  const { id, status } = row;
-  const { code, message } = await httpStatus({
-    id,
-    status: status + "" === "1" ? "0" : "1"
-  });
-  if (code === 0) {
-    onSearch();
-  } else if (code > 100 && code < 140) {
-    logout();
-  } else {
-    ElMessage.error(message);
-  }
+const hooks: PageHooks = {
+  pageSearchHook: () => usePageSearch(undefined, undefined, searchConfig)
 };
 
-async function handleCurrentChange(val: number) {
-  form.page = val;
-  await onSearch();
-}
-
-async function handleSizeChange(val: number) {
-  form.size = val;
-  form.page = 1;
-  await onSearch();
-}
-
-function handleSelectionChange(val) {
-  console.log("handleSelectionChange", val);
-}
-
-async function onSearch() {
-  loading.value = true;
-  const { code, data, message } = await httpList(form);
-  if (code === 0) {
-    const { list, count } = data;
-    dataList.value = list ?? [];
-    pagination.total = count ?? 0;
-    pagination.pageSize = form.size;
-    pagination.currentPage = form.page;
-  } else if (code > 100 && code < 140) {
-    logout();
-  } else {
-    ElMessage.error(message);
+const events: PageEvents = {
+  content: {
+    preview: () => {},
+    create: () => {}
   }
-  loading.value = false;
-}
-async function resetSearch() {
-  form.page = 1;
-  await onSearch();
-}
-//新建/编辑/详情弹窗
-function editItem(id, type) {
-  itemId.value = id;
-  isDetails.value = type;
-  showModel.value = true;
-}
-
-const resetForm = (formEl: FormInstance | undefined) => {
-  if (!formEl) return;
-  formEl.resetFields();
-  form.page = 1;
-  onSearch();
 };
-
-onMounted(() => {
-  onSearch();
-});
 </script>
 
 <template>
-  <div class="main role">
-    <el-form
-      ref="formRef"
-      :inline="true"
-      :model="form"
-      :label-width="0"
-      class="bg-white w-99/100 pl-8 pt-4"
-    >
-      <el-form-item prop="status">
-        <el-select
-          v-model="form.status"
-          style="width: 100%"
-          placeholder="角色状态"
-          clearable
-        >
-          <el-option
-            v-for="(si, sii) in statusList"
-            :key="'status' + si.value + sii"
-            :label="si.label"
-            :value="si.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item prop="role_name">
-        <el-input v-model="form.role_name" placeholder="角色名称" clearable />
-      </el-form-item>
-      <el-form-item>
-        <el-button
-          type="primary"
-          :icon="useRenderIcon('search')"
-          :loading="loading"
-          @click="resetSearch"
-        >
-          搜索
-        </el-button>
-        <el-button :icon="useRenderIcon('refresh')" @click="resetForm(formRef)">
-          重置
-        </el-button>
-      </el-form-item>
-    </el-form>
-
-    <TableProBar
-      title="角色管理"
-      :loading="loading"
-      :dataList="dataList"
-      @refresh="onSearch"
-    >
-      <template #buttons>
-        <el-button
-          type="primary"
-          :icon="useRenderIcon('add')"
-          @click="editItem('', 'add')"
-        >
-          新增角色
-        </el-button>
-      </template>
-      <template v-slot="{ size, checkList }">
-        <PureTable
-          border
-          align="left"
-          showOverflowTooltip
-          table-layout="auto"
-          :size="size"
-          :data="dataList"
-          :columns="columns"
-          :checkList="checkList"
-          :pagination="pagination"
-          :paginationSmall="size === 'small' ? true : false"
-          :header-cell-style="{ background: '#fafafa', color: '#606266' }"
-          @selection-change="handleSelectionChange"
-          @size-change="handleSizeChange"
-          @current-change="handleCurrentChange"
-        >
-          <template #operation="{ row }">
-            <el-button
-              class="reset-margin"
-              link
-              type="primary"
-              :size="size"
-              @click="editItem(row.id, 'view')"
-              :icon="useRenderIcon('eye-view')"
-            />
-            <el-button
-              class="reset-margin"
-              link
-              type="primary"
-              :size="size"
-              @click="editItem(row.id, 'edit')"
-              :icon="useRenderIcon('edits')"
-            />
-            <el-popconfirm
-              :title="row.status === '1' ? '改为禁用？' : '改为启用？'"
-              @confirm="handleStatus(row)"
-            >
-              <template #reference>
-                <el-button
-                  class="reset-margin"
-                  link
-                  type="primary"
-                  :size="size"
-                  :icon="
-                    useRenderIcon(
-                      row.status === '1'
-                        ? 'close-circle-line'
-                        : 'checkbox-circle-line'
-                    )
-                  " /></template
-            ></el-popconfirm>
-          </template>
-        </PureTable>
-      </template>
-    </TableProBar>
-  </div>
+  <PageAuth :pageName="PageName">
+    <PageContainer
+      :hooks="hooks"
+      :events="events"
+      :contentConfig="contentConfig"
+      :search-config="searchConfig"
+    />
+  </PageAuth>
 </template>
-
-<style scoped lang="scss">
-:deep(.el-dropdown-menu__item i) {
-  margin: 0;
-}
-</style>