feat: ele use desc comp

apps/web-ele/src/views/member/user/detail/modules/account-info.vue

@@ -8,7 +8,7 @@ import { ElCard } from 'element-plus';
 
 import { useDescription } from '#/components/description';
 
-withDefaults(
+const props = withDefaults(
   defineProps<{
     mode?: 'kefu' | 'member';
     user: MemberUserApi.User;
@@ -20,49 +20,44 @@ withDefaults(
 );
 
 const [Descriptions] = useDescription({
-  componentProps: {
-    border: false,
-    column: 2,
-    direction: 'horizontal',
-    labelWidth: 140,
-    title: '',
-    extra: '',
-  },
+  border: false,
+  column: props.mode === 'member' ? 2 : 1,
+  labelWidth: 140,
   schema: [
     {
       field: 'levelName',
       label: '等级',
-      content: (data) => data.levelName || '-',
+      render: (val) => val || '-',
     },
     {
       field: 'experience',
       label: '成长值',
-      content: (data) => data.experience || 0,
+      render: (val) => val || 0,
     },
     {
       field: 'point',
       label: '当前积分',
-      content: (data) => data.point || 0,
+      render: (val) => val || 0,
     },
     {
       field: 'totalPoint',
       label: '总积分',
-      content: (data) => data.totalPoint || 0,
+      render: (val) => val || 0,
     },
     {
       field: 'balance',
       label: '当前余额',
-      content: (data) => fenToYuan(data.balance || 0),
+      render: (val) => fenToYuan(val || 0),
     },
     {
       field: 'totalExpense',
       label: '支出金额',
-      content: (data) => fenToYuan(data.totalExpense || 0),
+      render: (val) => fenToYuan(val || 0),
     },
     {
       field: 'totalRecharge',
       label: '充值金额',
-      content: (data) => fenToYuan(data.totalRecharge || 0),
+      render: (val) => fenToYuan(val || 0),
     },
   ],
 });
@@ -77,7 +72,6 @@ const [Descriptions] = useDescription({
       <slot name="extra"></slot>
     </template>
     <Descriptions
-      :column="mode === 'member' ? 2 : 1"
       :data="{
         ...user,
         ...wallet,

apps/web-ele/src/views/member/user/detail/modules/basic-info.vue

@@ -11,7 +11,7 @@ import { ElAvatar, ElCard, ElCol, ElRow } from 'element-plus';
 import { useDescription } from '#/components/description';
 import { DictTag } from '#/components/dict-tag';
 
-withDefaults(
+const props = withDefaults(
   defineProps<{ mode?: 'kefu' | 'member'; user: MemberUserApi.User }>(),
   {
     mode: 'member',
@@ -19,14 +19,9 @@ withDefaults(
 );
 
 const [Descriptions] = useDescription({
-  componentProps: {
-    border: false,
-    column: 2,
-    direction: 'horizontal',
-    labelWidth: 140,
-    title: '',
-    extra: '',
-  },
+  border: false,
+  column: props.mode === 'member' ? 2 : 1,
+  labelWidth: 140,
   schema: [
     {
       field: 'name',
@@ -43,10 +38,10 @@ const [Descriptions] = useDescription({
     {
       field: 'sex',
       label: '性别',
-      content: (data) =>
+      render: (val) =>
         h(DictTag, {
           type: DICT_TYPE.SYSTEM_USER_SEX,
-          value: data.sex,
+          value: val,
         }),
     },
     {
@@ -60,17 +55,17 @@ const [Descriptions] = useDescription({
     {
       field: 'birthday',
       label: '生日',
-      content: (data) => formatDate(data.birthday)?.toString() || '-',
+      render: (val) => formatDate(val)?.toString() || '-',
     },
     {
       field: 'createTime',
       label: '注册时间',
-      content: (data) => formatDate(data.createTime)?.toString() || '-',
+      render: (val) => formatDate(val)?.toString() || '-',
     },
     {
       field: 'loginDate',
       label: '最后登录时间',
-      content: (data) => formatDate(data.loginDate)?.toString() || '-',
+      render: (val) => formatDate(val)?.toString() || '-',
     },
   ],
 });
@@ -89,12 +84,12 @@ const [Descriptions] = useDescription({
         <ElAvatar :size="180" shape="square" :src="user.avatar" />
       </ElCol>
       <ElCol :span="18">
-        <Descriptions :column="2" :data="user" />
+        <Descriptions :data="user" />
       </ElCol>
     </ElRow>
     <template v-else-if="mode === 'kefu'">
       <ElAvatar :size="140" shape="square" :src="user.avatar" />
-      <Descriptions :column="1" :data="user" />
+      <Descriptions :data="user" />
     </template>
   </ElCard>
 </template>