@ebiz/designer-components 0.0.18-beta.17 → 0.0.18-beta.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ebiz/designer-components",
-  "version": "0.0.18-beta.17",
+  "version": "0.0.18-beta.19",
   "private": false,
   "publishConfig": {
     "access": "public"

package/src/components/EbizDetailBlock.vue

@@ -0,0 +1,54 @@
+<template>
+    <div class="ebiz-detail-block">
+        <t-row v-for="(item, index) in detailItems" :key="index" class="detail-item">
+            <t-col :span="6" class="label">{{ item.label }}</t-col>
+            <t-col :span="18" class="value">{{ item.value }}</t-col>
+        </t-row>
+    </div>
+</template>
+
+<script lang="js" setup>
+import { computed, toRefs } from 'vue'
+import { Row as TRow, Col as TCol } from 'tdesign-vue-next'
+
+const props = defineProps({
+    model: {
+        type: Object,
+        default: () => { }
+    },
+    labelMap: {
+        type: Object,
+        default: () => { }
+    }
+})
+
+const { model, labelMap } = toRefs(props)
+
+const detailItems = computed(() => {
+    return Object.entries(model.value).map(([key, value]) => ({
+        label: labelMap.value[key] || key,
+        value: value || '--'
+    }))
+})
+</script>
+
+<style scoped>
+.ebiz-detail-block {
+    padding: 16px;
+}
+
+.detail-item {
+    margin-bottom: 16px;
+    line-height: 32px;
+}
+
+.label {
+    color: #86909C;
+    text-align: right;
+    padding-right: 16px;
+}
+
+.value {
+    color: #0A0A0A;
+}
+</style>

package/src/index.js

@@ -49,6 +49,7 @@ import EbizAlert from "./components/TdesignAlert.vue";
 import EbizDialog from "./components/TdesignDialog.vue";
 import EbizTable from "./components/EbizTable.vue";
 import { MessagePlugin as EbizMessage } from 'tdesign-vue-next';
+import EbizDetailBlock from './components/EbizDetailBlock.vue';
 
 // 导入简洁数据服务
 import dataService from "./apiService/simpleDataService";
@@ -146,5 +147,7 @@ export {
   // 对话框组件
   EbizDialog,
   // 表格组件
-  EbizTable
+  EbizTable,
+  // 详情块组件
+  EbizDetailBlock
 };