From 8510bc124c563702bcc8b6016ecec45160093b7e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E8=82=A5=E7=BE=8A?= <1048382248@qq.com>
Date: Wed, 13 Aug 2025 15:23:06 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=20=E8=A7=92=E8=89=B2?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=20=E4=BF=AE=E5=A4=8D=20hTable=20Edit=20?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=97=B6=E5=80=99id=E4=B8=8D=E4=B8=BA0?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/hTable/hTable.ts      |   2 +-
 src/components/hTable/hTableEdit.vue |  10 +--
 src/components/hTable/index.vue      |   4 +-
 src/views/admin/role.vue             | 109 +++++++++++++++++++++++++++
 4 files changed, 117 insertions(+), 8 deletions(-)
 create mode 100644 src/views/admin/role.vue

diff --git a/src/components/hTable/hTable.ts b/src/components/hTable/hTable.ts
index 45fb491..95bf2a1 100644
--- a/src/components/hTable/hTable.ts
+++ b/src/components/hTable/hTable.ts
@@ -107,7 +107,7 @@ export interface TableColumn {
   /* 列宽度 */
   width?: string;
   /* 字段类型 */
-  type?: string;
+  type?: "string" | "dropdown" | "switch" | "img" | "datetime" | "textarea";
   /** 是否多选 */
   multiple?: boolean;
   /** 编辑时显示列 */
diff --git a/src/components/hTable/hTableEdit.vue b/src/components/hTable/hTableEdit.vue
index 8da9a3a..b0cc80a 100644
--- a/src/components/hTable/hTableEdit.vue
+++ b/src/components/hTable/hTableEdit.vue
@@ -75,10 +75,10 @@ function handleSubmitForm() {
     }
 
     editData.value.loading = true;
-    let form = {};
+    let form: any = {};
     if (editData.value.isedit) {
       form = props.row;
-    }
+    } else form.id = 0;
     for (const key in column.value) {
       const element = column.value[key];
       if (element.valueE !== null && element.valueE !== "") {
@@ -154,9 +154,9 @@ function fetchFormData() {
         <div v-if="o.type.trim() == 'datetime'">
           <el-date-picker
             v-model="o.valueE as Date"
-            format="yyyy-MM-dd HH:mm:ss"
-            value-format="yyyy-MM-dd HH:mm:ss"
-            type="datetime"
+            type="date"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
             :placeholder="o.label"
             style="width: 100%"
             @change="o.change"
diff --git a/src/components/hTable/index.vue b/src/components/hTable/index.vue
index 3f7d273..26c877a 100644
--- a/src/components/hTable/index.vue
+++ b/src/components/hTable/index.vue
@@ -380,9 +380,9 @@ function fetchPagedData() {
           <el-date-picker
             v-if="o.type.trim() == 'datetime'"
             v-model="o.value as Date"
-            format="yyyy-MM-dd"
-            value-format="yyyy-MM-dd"
             type="date"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
             :placeholder="o.label"
             style="width: 100%"
           />
diff --git a/src/views/admin/role.vue b/src/views/admin/role.vue
new file mode 100644
index 0000000..fc16386
--- /dev/null
+++ b/src/views/admin/role.vue
@@ -0,0 +1,109 @@
+<script setup lang="ts">
+import ahTable from "@/components/hTable/index.vue";
+import { TableConfig } from "@/components/hTable/hTable";
+import { onMounted, ref } from "vue";
+import { fa } from "element-plus/es/locales.mjs";
+import { hTableAPI } from "@/api/hTable";
+const ControllerName = "AdminRole";
+
+defineOptions({
+  name: ControllerName
+});
+
+function searchCallback(data) {}
+const RoleApi = new hTableAPI("AdminRole");
+const table = ref<{ initTable: (config: TableConfig) => void }>(null);
+const tableData: TableConfig = {
+  apiUrl: ControllerName,
+  selectColumn: false, // 列表选择
+  border: false, // 是否显示表格边框
+  searchCallback: searchCallback,
+  search: {
+    // 查询条件
+    show: true,
+    PageIndex: 0,
+    PageSize: 20,
+    OrderBy: "CreateTime", // 排序
+    defaultConditions: [], // 默认查询条件
+    Conditions: []
+  },
+  operationColumn: true, // 显示操作按钮
+  operationColumnData: [
+    {
+      // 操作按钮
+      topBtn: false, // 是头部按钮
+      label: "修改",
+      btnType: "edit" // 按钮类型 add edit del custom
+    },
+    {
+      // 操作按钮
+      topBtn: true, // 是头部按钮
+      label: "添加",
+      btnStyle: "success",
+      btnType: "add" // 按钮类型 add edit del custom
+    },
+    {
+      topBtn: false, // 头部按钮
+      show: true,
+      label: "删除",
+      btnType: "del", // 按钮类型 add edit del 不设置则 自定义按钮
+      btnStyle: "danger" // topBtn: true才生效 success danger
+    }
+  ],
+  column: {
+    // 行数据
+    id: {
+      label: "编号",
+      search: true,
+      add: false, // 字段允许添加
+      edit: false, // 字段允许修改
+      width: "150px"
+    },
+    name: {
+      label: "角色名称",
+      width: "180px",
+      search: true,
+      searchType: "Like",
+      add: true, // 字段允许添加
+      edit: true // 字段允许修改
+    },
+    enable: {
+      label: "启用",
+      type: "switch",
+      search: false,
+      add: false, // 字段允许添加
+      edit: true, // 字段允许修改
+      valueE: true // 编辑时的默认值
+    },
+    createTime: {
+      label: "创建时间",
+      type: "datetime",
+      search: true,
+      add: false, // 字段允许添加
+      edit: false // 字段允许修改
+    },
+    remark: {
+      label: "备注",
+      search: false,
+      add: true, // 字段允许添加
+      edit: true // 字段允许修改
+    }
+  },
+  data: [],
+  pageData: {
+    total: 0
+  },
+  selectRows: []
+};
+
+const showTable = ref(false);
+onMounted(async () => {
+  //初始化数据原
+
+  showTable.value = true;
+});
+</script>
+
+<template>
+  <div><ahTable v-if="showTable" ref="table" :tableConfig="tableData" /></div>
+</template>