af-mobile-client-vue3 1.3.67 → 1.3.69

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "af-mobile-client-vue3",
   "type": "module",
-  "version": "1.3.67",
+  "version": "1.3.69",
   "packageManager": "pnpm@10.13.1",
   "description": "Vue + Vite component lib",
   "engines": {

package/src/components/data/XBadge/index.vue

@@ -1,11 +1,14 @@
 <script setup lang="ts">
 import { getDictItemByValue } from '@af-mobile-client-vue3/utils/dictUtil'
+import dayjs from 'dayjs/esm/index'
 import { ref } from 'vue'
 
-const { serviceName, dictName, dictValue } = defineProps<{
+const { serviceName, dictName, dictValue, dictType } = defineProps<{
   serviceName: string
   dictName: string | null | undefined
-  dictValue: string | null | undefined
+  dictValue: string | number | null | undefined
+  // 用于非字典型的格式化展示：如日期/小数/整数等
+  dictType?: 'date' | 'dateTime' | 'towDecimal' | 'fourDecimal' | 'int' | string
 }>()
 
 // 字面值
@@ -18,23 +21,86 @@ initComponent()
 
 // 组件初始化
 function initComponent() {
-  if (dictValue === null || dictValue === undefined) {
+  if (dictValue === null || dictValue === undefined || dictValue === '') {
     label.value = '--'
+    className.value = ''
     return
   }
-  if (!dictName || dictName === '') {
-    label.value = dictValue.toString()
+
+  // 1) 优先使用字典映射
+  if (dictName && dictName !== '') {
+    getDictItemByValue(dictName, serviceName, String(dictValue), (result) => {
+      if (result == null) {
+        // 字典未命中，退回到格式化/原值
+        applyFormatFallback()
+      }
+      else {
+        label.value = result.label
+        className.value = `badge-${result.status}`
+      }
+    })
     return
   }
-  getDictItemByValue(dictName, serviceName, dictValue, (result) => {
-    if (result == null) {
-      label.value = dictValue.toString()
-    }
-    else {
-      label.value = result.label
-      className.value = `badge-${result.status}`
-    }
-  })
+
+  // 2) 无字典名时，按 dictType 做格式化
+  applyFormatFallback()
+}
+
+function applyFormatFallback() {
+  className.value = ''
+  if (!dictType || dictType === '') {
+    label.value = String(dictValue)
+    return
+  }
+  switch (dictType) {
+    case 'date':
+      label.value = formatDateLike(dictValue, 'YYYY-MM-DD')
+      break
+    case 'dateTime':
+      label.value = formatDateLike(dictValue, 'YYYY-MM-DD HH:mm:ss')
+      break
+    case 'towDecimal':
+      label.value = formatNumberLike(dictValue, 2)
+      break
+    case 'fourDecimal':
+      label.value = formatNumberLike(dictValue, 4)
+      break
+    case 'int':
+      label.value = formatNumberLike(dictValue, 0)
+      break
+    default:
+      label.value = String(dictValue)
+      break
+  }
+}
+
+function pad2(num: number): string {
+  return String(num).padStart(2, '0')
+}
+
+function formatDateLike(val: string | number, pattern: string): string {
+  // 1️⃣ 先判断时间是否合法
+  const date = dayjs(val)
+  if (!date.isValid()) {
+    console.warn('时间字符串不合法:', val)
+    return val as string
+  }
+
+  // 2️⃣ 判断格式字符串是否有效（简单校验，格式字符串非空）
+  if (!pattern || typeof pattern !== 'string') {
+    console.warn('格式字符串不合法:', pattern)
+    return val as string
+  }
+
+  // 3️⃣ 使用 dayjs 格式化
+  return date.format(pattern)
+}
+
+function formatNumberLike(val: string | number, digits: number): string {
+  const num = typeof val === 'number' ? val : Number(val)
+  if (Number.isNaN(num))
+    return String(val)
+  return num.toFixed(digits)
 }
 </script>
 

package/src/components/data/XCellList/index.vue

@@ -841,7 +841,13 @@ function handleCheckboxChange(item: any, checked: boolean) {
                         :class="{ 'selectable-title': isMultiSelectMode }"
                         @click="handleTitleClick(item, $event)"
                       >
-                        {{ item[column.dataIndex] ?? '--' }}
+                        <XBadge
+                          :style="handleFunctionStyle(column.styleFunctionForValue, item)"
+                          :dict-name="column.dictName"
+                          :dict-value="item[column.dataIndex]"
+                          :dict-type="column.slotType"
+                          :service-name="serviceName"
+                        />
                       </p>
                     </div>
                     <div v-for="(column) in subTitleColumns" :key="`subtitle_${column.dataIndex}`" class="sub-title">
@@ -851,7 +857,9 @@ function handleCheckboxChange(item: any, checked: boolean) {
                       >
                         <XBadge
                           :style="handleFunctionStyle(column.styleFunctionForValue, item)"
-                          :dict-name="column.dictName" :dict-value="item[column.dataIndex]"
+                          :dict-name="column.dictName"
+                          :dict-value="item[column.dataIndex]"
+                          :dict-type="column.slotType"
                           :service-name="serviceName"
                         />
                       </p>
@@ -876,7 +884,9 @@ function handleCheckboxChange(item: any, checked: boolean) {
                     {{ (column.showLabel === undefined || column.showLabel) ? `${column.title}: ` : '' }}
                     <XBadge
                       :style="handleFunctionStyle(column.styleFunctionForValue, item)"
-                      :dict-name="column.dictName" :dict-value="item[column.dataIndex]"
+                      :dict-name="column.dictName"
+                      :dict-value="item[column.dataIndex]"
+                      :dict-type="column.slotType"
                       :service-name="serviceName"
                     />
                   </p>
@@ -924,7 +934,9 @@ function handleCheckboxChange(item: any, checked: boolean) {
                     </span>
                     <XBadge
                       :style="handleFunctionStyle(column.styleFunctionForValue, item)"
-                      :dict-name="column.dictName" :dict-value="item[column.dataIndex]"
+                      :dict-name="column.dictName"
+                      :dict-value="item[column.dataIndex]"
+                      :dict-type="column.slotType"
                       :service-name="serviceName"
                     />
                   </p>

package/src/components/data/XFormItem/index.vue

@@ -424,7 +424,7 @@ function updateFile(files, _index) {
 
 // 表单校验的类型校验
 function formTypeCheck(attr, value) {
-  if (mode === '查询')
+  if (mode === '查询' || mode === '预览')
     return
   // if (!attr.rule || !attr.rule.required || attr.rule.required === 'false')
   //   return
@@ -575,7 +575,7 @@ const readonly = computed(() => {
 })
 // 提示内容
 const placeholder = computed(() => {
-  if (attr.addOrEdit === 'readonly')
+  if (attr.addOrEdit === 'readonly' || mode === '预览')
     return '暂无内容 ~ '
   else
     return attr.placeholder ? attr.placeholder : `请选择${attr.name}`