starfish-form-custom 1.0.28 → 1.0.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "starfish-form-custom",
-  "version": "1.0.28",
+  "version": "1.0.29",
   "main": "dist/starfish-form.mjs",
   "style": "dist/style.css",
   "module": "dist/starfish-form.mjs",

package/src/components/CheckBox/index.vue

@@ -9,7 +9,7 @@
     </div>
     <div class="control" :style="{marginLeft: labelalign != 'top'?labelWidth + 'px': ''}">
       <!-- 只读的时候就只展示文本 -->
-      <span v-if="!drag && data[item.data.fieldName] && (item.data.state === 'readonly' || readonly)">{{ data[item.data.fieldName].join(',') || '--' }}</span>
+      <span v-if="!drag && data[item.data.fieldName] && (item.data.state === 'readonly' || readonly)">{{ Array.isArray(data[item.data.fieldName]) ? data[item.data.fieldName].join(',') || '--' : data[item.data.fieldName] || '--' }}</span>
       <el-checkbox-group v-model="data[item.data.fieldName]" :class="{'vertical-group': item.data.arrangeMent === 'vertical'}" v-else-if="!drag && data[item.data.fieldName]" :size="size" :disabled="item.data.state === 'disabled' || item.data.state === 'readonly'">
         <el-checkbox v-for="(sitem, sindex) in item.data.itemConfig.items" :key="sindex" :label="sitem.value">{{ sitem.label }}</el-checkbox>
       </el-checkbox-group>

package/src/components/DateTime/index.vue

@@ -9,7 +9,8 @@
     </div>
     <div class="control" :style="{marginLeft: labelalign != 'top'?labelWidth + 'px': ''}">
       <el-date-picker v-model="item.data.default" type="datetime" :placeholder="item.data.placeholder" v-if="drag" :size="size" :disabled="item.data.state === 'disabled'" :readonly="item.data.state === 'readonly'"> </el-date-picker>
-      <el-date-picker v-model="data[item.data.fieldName]" type="datetime" :placeholder="item.data.placeholder" v-if="!drag" :size="size" :disabled="item.data.state === 'disabled'" :readonly="item.data.state === 'readonly'"> </el-date-picker>
+      <span v-if="!drag && (item.data.state === 'readonly' || readonly)">{{ formatReadonlyDate(data[item.data.fieldName], item.data.format) }}</span>
+      <el-date-picker v-model="data[item.data.fieldName]" type="datetime" :placeholder="item.data.placeholder" v-else-if="!drag"  :size="size" :disabled="item.data.state === 'disabled'" :readonly="item.data.state === 'readonly'"> </el-date-picker>
     </div>
   </div>
 </template>
@@ -34,6 +35,42 @@
     },
     setup(props) {
       useWatch(props);
+      // 格式化只读日期显示
+      const formatReadonlyDate = (dateValue: any, format: string) => {
+        if (!dateValue) return '--';
+        
+        // 如果已经是格式化好的字符串，直接返回
+        if (typeof dateValue === 'string') {
+          return dateValue;
+        }
+        
+        // 如果是日期对象，进行格式化
+        if (dateValue instanceof Date) {
+          const year = dateValue.getFullYear();
+          const month = String(dateValue.getMonth() + 1).padStart(2, '0');
+          const day = String(dateValue.getDate()).padStart(2, '0');
+          const hours = String(dateValue.getHours()).padStart(2, '0');
+          const minutes = String(dateValue.getMinutes()).padStart(2, '0');
+          const seconds = String(dateValue.getSeconds()).padStart(2, '0');
+          
+          const formatMap: Record<string, string> = {
+            'YYYY': `${year}`,
+            'YYYY-MM': `${year}-${month}`,
+            'YYYY-MM-DD': `${year}-${month}-${day}`,
+            'YYYY-MM-DD HH': `${year}-${month}-${day} ${hours}`,
+            'YYYY-MM-DD HH:mm': `${year}-${month}-${day} ${hours}:${minutes}`,
+            'YYYY-MM-DD HH:mm:ss': `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+          };
+          
+          return formatMap[format] || `${year}-${month}-${day}`;
+        }
+        
+        // 其他情况返回原始值
+        return String(dateValue);
+      };
+      return {
+        formatReadonlyDate
+      };
     },
   });
 </script>

package/src/components/Selecteds/index.vue

@@ -44,7 +44,7 @@
           :value="items.value"
         />
       </el-select>
-      <span v-if="!drag && (item.data.state === 'readonly' || readonly)">{{ data[item.data.fieldName].join(',') || '--' }}</span>
+      <span v-if="!drag && (item.data.state === 'readonly' || readonly)">{{ Array.isArray(data[item.data.fieldName]) ? data[item.data.fieldName].join(',') || '--' : data[item.data.fieldName] || '--' }}</span>
       <el-select
         v-model="data[item.data.fieldName]"
         style="width: 320px;"