fix: 一些基本功能

apps/web-antd/src/views/log/op-log/components/modal.vue

@@ -0,0 +1,71 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { Descriptions } from 'ant-design-vue';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal class="w-[80%]" title="操作日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="管理员ID">{{ data.admin_id }}</Descriptions.Item>
+        <Descriptions.Item label="理员名称">{{ data.old_admin?.username || data.admin?.nick_name }}</Descriptions.Item>
+        <Descriptions.Item label="类型">{{ data.type }}</Descriptions.Item>
+        <Descriptions.Item label="内容">
+          <pre>{{ JSON.parse(data.content) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="模式">
+          {{ data.mold_txt }}
+        </Descriptions.Item>
+        <Descriptions.Item label="操作时间">
+          {{ data.operate_time }}
+        </Descriptions.Item>
+        <Descriptions.Item label="创建时间">{{ data.created_at }}</Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+  white-space: pre-wrap;
+}
+</style>