vue2-client 1.14.68 → 1.14.69

package/docs/Logic/345/207/275/346/225/260/344/275/277/347/224/250/347/233/270/345/205/263.md

@@ -11,7 +11,6 @@
 - ENV 对应 一个 org.json.JSONObject {tenantName:"租户名称",orgName:"分公司名称",applicationName:"应用名称",dbType:"数据库类型"}
 - logic 对应 LogicService 类，其中有方法
   * logic.run(logicName,param) 执行logic / logicName 执行的业务逻辑名称，param 参数 返回 org.json.JSONObject
-  * logic.remoteRun("服务名","logicName", "param")
 - sql 对应 [SqlService]() 类，其中有方法
   * sql.query(sql别名 string，sql参数 string) 执行已经注册的sql  返回 org.json.JSONArray
   * sql.query(sql别名 string，sql参数 string，页数 int，每页行数 int) 执行已经注册的sql 返回 org.json.JSONArray

package/docs//345/207/275/346/225/260/344/275/277/347/224/250/347/233/270/345/205/263.md

@@ -60,8 +60,7 @@ this.openDialog('xxx', 5, {}, {}, {})
     afterDelete( res (删除接口返回数据)) 删除后触发
     action(record (当前记录), id （当前记录主键）, actionType （操作类型）) 操作按钮触发
   - expandedGrid:"栅格名"
-- json配置相关
-  - "pageMaxSize": (int) num,
+
 # x-report 插槽 使用说明
 
 - init(configName,configData) 配置名称 / 报表数据

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue2-client",
-  "version": "1.14.68",
+  "version": "1.14.69",
   "private": false,
   "scripts": {
     "serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint",

package/src/base-client/components/common/XReport/XReport.vue

@@ -247,7 +247,17 @@ export default {
       this.$emit('updateImg', data)
     },
     // 导出数据，某些外部需要统一控制数据的变动
-    exportData () {
+    exportData (skipValidation = false) {
+      // 如果不跳过校验，先进行必填字段校验
+      if (!skipValidation) {
+        const validation = this.validateRequiredFields()
+        if (!validation.isValid) {
+          const errorMessages = validation.errors.map(error => error.message).join('；')
+          console.warn(`数据导出警告：存在必填字段未填写 - ${errorMessages}`)
+          // 在导出时只警告，不阻止导出
+        }
+      }
+
       // 获取当前修改后的数据
       let tempData
       if (this.activeConfig === undefined || this.activeConfig === null) {
@@ -296,8 +306,68 @@ export default {
         }
       }
     },
+    // 验证必填字段
+    validateRequiredFields () {
+      const errors = []
+      const config = this.type === 'display' ? this.originalConfig : this.activeConfig
+
+      if (!config || !config.columns) {
+        return { isValid: true, errors: [] }
+      }
+
+      // 遍历所有配置项检查必填字段
+      config.columns.forEach((row, rowIndex) => {
+        row.forEach((cell, cellIndex) => {
+          if (cell.required && cell.dataIndex) {
+            let value
+            if (cell.dataIndex.indexOf('@@@') !== -1) {
+              // 处理深层嵌套数据
+              // const arr = cell.dataIndex.split('@@@')
+              value = config.tempData && config.tempData[cell.dataIndex]
+            } else {
+              value = config.data[cell.dataIndex]
+            }
+
+            // 检查值是否为空
+            if (!value || (typeof value === 'string' && value.trim() === '')) {
+              const message = cell.requiredMessage || this.getDefaultRequiredMessage(cell.type)
+              errors.push({
+                dataIndex: cell.dataIndex,
+                message: message,
+                rowIndex: rowIndex,
+                cellIndex: cellIndex,
+                type: cell.type
+              })
+            }
+          }
+        })
+      })
+
+      return {
+        isValid: errors.length === 0,
+        errors: errors
+      }
+    },
+    // 获取默认的必填提示信息
+    getDefaultRequiredMessage (fieldType) {
+      const defaultMessages = {
+        datePicker: '请选择日期',
+        timePicker: '请选择日期时间',
+        input: '请填写此字段',
+        inputs: '请填写此字段'
+      }
+      return defaultMessages[fieldType] || '此字段为必填项'
+    },
     // 正常的保存方法，当前修改内容会直接全部导出到外部
     saveConfig () {
+      // 先进行必填字段校验
+      const validation = this.validateRequiredFields()
+      if (!validation.isValid) {
+        const errorMessages = validation.errors.map(error => error.message).join('；')
+        this.$message.error(`保存失败：${errorMessages}`)
+        return false
+      }
+
       if (this.activeConfig === undefined || this.activeConfig === null) {
         return this.originalConfig.data
       } else {
@@ -306,6 +376,7 @@ export default {
           this.changeDeepObject(this.activeConfig.data, key, this.activeConfig.tempData[key])
         })
         this.$emit('saveConfig', this.$refs.XReportDesign.activatedConfig)
+        return true
       }
     },
     // 通过@@@分割临时变量，找到对应的key，并修改它的值

package/src/base-client/components/common/XReport/XReportDemo.vue

@@ -4,9 +4,8 @@
       @updateImg="updateImg"
       ref="main"
       :use-oss-for-img="false"
-      config-name="ceshi1"
+      config-name="用户户内通气点火工艺流程"
       server-name="af-system"
-      :config-data="{aaa:'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAASHUlEQVR4nO2dWYwUVRuGC1RkVBB1QEUUxW3cF5RxgcG4oIiiInEDF9C4xWi4MPHOi7mQG40bxIVgwDXuoiYqLqDAoIiouKGCgwIiOyqCLNbfz4nn/0d+PH2qp6tOdc/7JB0gqWbOVPdb33q+0y4uEAkhtkn70AsQIs9IIEI4kECEcCCBCOFAAhHCgQQihAMJRAgHEogQDiQQIRxIIEI4kECEcCCBCOFAAhHCgQQihAMJRAgHEogQDiQQIRxIIEI4kECEcCCBCOFAAhHCgQQihAMJRAgHEogQDiQQIRxIIEI4kECEcCCBCOFAAhHCgQQihAMJRAgHEogQDiQQIRxIIEI4kECEcCCBCOFAAhHCgQQihAMJRAgH24degA9btmyJVqxYEf3555+hlyLKRLt27aJdd9016ty5c+ilOKkIgfzxxx/RpEmTolmzZoVeiigTO+64YzR8+PCovr4+9FKc5F4gcRwbyzF9+vRowoQJoZcjykSnTp2i/v37514gikGEcCCBCOFAAhHCgQQihAMJRAgHEogQDiQQIRxIIEI4kECEcJD7Sjo9OzU1NdGgQYOi7t27h15OyWzatMl0AzQ1NXld36FDB/M719XVpbyyMNBqUgm/W7uYXg6ROvSTNTY2RqNHj/a6nlaM8ePHR0OHDk15ZcKFXKycguXMe6drW0ACyQgM9ebNm72vRyBdunRJcUXCBwkkI4hBfv/9d69rEccuu+wSbbfddimvShRDAskAaz3Wr1/vdX379u2jbt26meSECIsEkhGIxDcfggUhSCfTI8IigWQELtavv/7qda11sWRBwiOBZMTGjRujtWvXel2LQHbaaScJJAdIIBmAa4VAsCI+2BTv9tvnvo5b9UggGYBAKBSuW7fO63qb4t1hhx1SXpkohgSSERs2bDAi8cHGILIg4ZFAMsBakOXLl3tdby2IBBIeCSQDEMhvv/0WrVq1yut66iAMVRPhkUAyAIH4pngBgey1114prkj4IoFkwF9//WVGp/pix3KK8EggGYAFWbNmjde1WI+uXbuaSroIjwSSAdRAksQfPXr0kEByggSSMna28OrVq72ut31YVNJFeCSQDEjSZmJdLAkkH0ggKWNTvL41EJvBUidvPpBAUgaB4F4lKRKSwVKbST6QQFKGFC8ZrGXLlnldjwWpra01QhHhkUBSBgtCDcR3u63NYol8IIGkDBZkyZIlXtfarbaqoucHCSRlSPEuXrzY61oE0rNnT1XRc4QEkiK2i/fnn3/2uh6B7LHHHqbVXeQDCSRFbJPi0qVLva5HIHvuuae22uYICSRFbID+008/eV2vGkj+kEBSxAboSSzI3nvvrYFxOUICSZEtW7ZEP/74o2k18aFjx47Rfvvtl/KqRBIkkBRBGAjEB2s9lOLNFxJIStgeLF+B4Fb16tXLZLFEfgg2FYCn63fffWe+RNUI8ceiRYui77//3ut6WkuwIl999VXU3Nyc7uIqDO4LrmcI6xpEILY+8NJLL5lTl6oRa0F8v+zEK5999pk5YEdB+j8hNrvlllvajkCAaec8Xd94441QS8gVCGTBggXmJf4JG8iGDRsW5GcrBhHCgQQihAMJRAgHEogQDiQQIRxIIEI4kECEcCCBCOEgWKHQHhJzwAEHhFpCKtBiwpgf32nutkmxQ4cOKa+sctl5552DjUEKIhB7SOX5558fHX/88SGWkAq0l6xcuTKaOHFi9OWXXxa93vYY3XDDDWZYg9g2iOOwww4L8rPbxb6Hd4ui0C4yc+bMaMSIEaYRsxh88IMHD47GjBljttqK/KEYpIxwii0NhwsXLvS6niPWDj30UHPcmsgnEkiZsN27H330kfcOQrp2jzjiCO1BzzESSJkgOMdyIBAf7ICGurq6lFcmWoMEUiZwr2bNmhXNnz/f63qsx1FHHWUyWCK/SCBlwE5wnzZtmrd7Rfxx9NFHa4ttzpFAygDZq2+//TZqamryut4ecdC7d2/VP3KOBFIGmL87Y8aM6IcffvC6Hvfq4IMPjo488siUVyZaiwTSSgjOmb07depU7/fgXlEgVe0j/wRrNakW2FtPcD579mzv99BFcMopp3idQ7hhwwZTfPzll1+KXovrxtki9fX1GvxQJiSQVmCD87ffftvM4PXBulfHHXec1/+/bt266IUXXojefPPNotcTz1x00UXGOkkg5UECaQUE58yxeu+997zfQ3vJSSedFO2zzz5e19sCpE/rCuNxGKckyodikFbAl3HKlCnewTkuEG0lffv21THPFYIEUiJYD4QxefJk7/fg9tCVWk0dzNWOBFIiBM+4VnPnzvV+D+5VQ0ND1L179xRXJsqJBFICpHY5FOe1115LdHotwujfv7+JFURlIIGUgLUeH3/8sfd7qH306dPHdO+KykECSQjWgyMNGLy9du1a7/exbfT0009X71WFIYEkxFoP37Z2wHocc8wxUb9+/VSfqDAkkARgPWhnp3CXxHpQwGP//f7775/e4kQqSCAJoO7x1ltvRR9++KH3ewjODzzwQBOca+dg5SGBeGKr5s8//7x35gqwHoMGDTJ7z0XlIYF4QLvHmjVrTGD+ySefeL/PWg8EwgwwUXlIIB7QsctmqBdffNF7xyBgPQYMGGB2DorKRAIpAtZjyZIl0dNPP212Dfpircd5550Xde7cOcUVijSRQIpAYE6r+TvvvJPofTb2OOGEE1JamcgCCcSBPXl2woQJXhuWLFgP9nyQ2pX1qGwkkH8B12rZsmXRU089lailBEjnXnDBBdGxxx6b0upEVkgg/8L69evNEdWTJk1KFJhTKWcYw4UXXqjMVREovDLwIs9oR+E2IGs1Z86caNy4caZr1xc2RO2+++7R8OHD1ZRYBCw03Qg8gDgHnfvFURh5G4MkgWwFHxxTSp588snErhU9VwxjIPZQS3txEAj3mfuNO8qkSYSCBWZrQKgzQVoigbQAcXDwDb1WSV0rAnN6rbAenPkh3HCvub+4sl988YU5T6Wmpua/Oy7pPEAoCIYZxjx8QiCBtIAP7P33348eeeSRaPHixYnei2tAYE5Luzp2i4NASKEztaXlvxmfRLcC8dvhhx9upr8ccsghptiKaJhlnOX9lUD+hrjj008/jcaOHRt9/fXXid7LB8YHedlll5kYRPjBPd+WlbaTXGgKZVsBYuH+nn322eY0riz31CiLFf0v7qDe8e677yZ6L4E5/vK1116rUaIJsS6WCysWWn2mT5+eedarzQvEDn977rnnEscdgGtFOwkvtbP7Y4fiUWvygQdRbW2t2ZmZJW1eIPi9r7/+evTwww8njjsIHGklueaaazRnNyEIhDNVkgy9YCJ+1pmtNi0QG5Tfd999iRoRwWat8Il9xoiKf2Izhr5gQXbbbbfM6yRtViCI44MPPojuv//+RIOnLQSOzMEdOHBgLvL1lYbdY+MLDySC86zTvW1SILZSfvfddycOygFBkM698sorjV8skoNAigXoLbGHDmVNmxMIHboUpkjn0sKeNCi3J9PedNNNaidpBaVYEAqGWdOmBGKPSnvwwQej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'}"
       :show-img-in-cell="true"
       :edit-mode="false"
       :show-save-button="false"

package/src/base-client/components/common/XReport/XReportTrGroup.vue

@@ -37,6 +37,22 @@
               {{ deserializeFunctionAndRun(cell.customFunction, configData[cell.dataIndex], config) }}
             </template>
           </template>
+          <template v-else-if="cell.type === 'datePicker'">
+            <template v-if="cell.customFunction === undefined">
+              {{ getDeepObject(configData, cell.dataIndex) }}
+            </template>
+            <template v-else>
+              {{ deserializeFunctionAndRun(cell.customFunction, configData[cell.dataIndex], config) }}
+            </template>
+          </template>
+          <template v-else-if="cell.type === 'timePicker'">
+            <template v-if="cell.customFunction === undefined">
+              {{ getDeepObject(configData, cell.dataIndex) }}
+            </template>
+            <template v-else>
+              {{ deserializeFunctionAndRun(cell.customFunction, configData[cell.dataIndex], config) }}
+            </template>
+          </template>
           <template v-else-if="cell.type === 'inputs'">
             <template v-if="cell.customFunction === undefined">
               {{ showSubRowValue(cell) }}
@@ -131,6 +147,26 @@
               }}
             </template>
           </template>
+          <template v-else-if="cell.type === 'datePicker'">
+            <template v-if="cell.customFunction === undefined">
+              {{ getDeepObject(configData.arr[inputColumnsDefinitionIndex], cell.dataIndex) }}
+            </template>
+            <template v-else>
+              {{
+                deserializeFunctionAndRun(cell.customFunction, configData.arr[inputColumnsDefinitionIndex][cell.dataIndex], config)
+              }}
+            </template>
+          </template>
+          <template v-else-if="cell.type === 'timePicker'">
+            <template v-if="cell.customFunction === undefined">
+              {{ getDeepObject(configData.arr[inputColumnsDefinitionIndex], cell.dataIndex) }}
+            </template>
+            <template v-else>
+              {{
+                deserializeFunctionAndRun(cell.customFunction, configData.arr[inputColumnsDefinitionIndex][cell.dataIndex], config)
+              }}
+            </template>
+          </template>
           <template v-else-if="cell.type === 'inputs'">
             <template v-if="cell.customFunction === undefined">
               {{ getDeepObject(configData.arr[inputColumnsDefinitionIndex], cell.dataIndex) }}
@@ -178,39 +214,61 @@
           >{{ cell.text || '确认' }}
           </a-button>
         </template>
+        <template v-else-if="cell.type === 'datePicker'">
+          <div>
+            <a-date-picker
+              @change="handleDatePickerChange($event, cell.dataIndex, cell)"
+              :value="formatDateValue(configData[cell.dataIndex])"
+              format="YYYY-MM-DD"
+              :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
+              :disabled="cell.inputReadOnly===true"
+              :class="{'required-field-error': isFieldRequired(cell) && !configData[cell.dataIndex]}"/>
+            <div v-if="isFieldRequired(cell) && !configData[cell.dataIndex]" class="required-message">
+              {{ getRequiredMessage(cell, 'datePicker') }}
+            </div>
+          </div>
+        </template>
+        <template v-else-if="cell.type === 'timePicker'">
+          <div>
+            <a-date-picker
+              @change="handleTimePickerChange($event, cell.dataIndex, cell)"
+              :value="formatDateValue(configData[cell.dataIndex])"
+              format="YYYY-MM-DD HH:mm:ss"
+              show-time
+              :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
+              :disabled="cell.inputReadOnly===true"
+              :class="{'required-field-error': isFieldRequired(cell) && !configData[cell.dataIndex]}"/>
+            <div v-if="isFieldRequired(cell) && !configData[cell.dataIndex]" class="required-message">
+              {{ getRequiredMessage(cell, 'timePicker') }}
+            </div>
+          </div>
+        </template>
         <template v-else-if="cell.type === 'signature'">
           <img :src="configData[cell.dataIndex]" alt="签名加载失败" style="max-height: 2rem">
           <a-button v-if="!configData[cell.dataIndex]" type="dashed" >需要在手机端签名 </a-button>
         </template>
         <template v-else-if="cell.type === 'input'">
-          <template v-if="cell.inputReadOnly === true">
+          <div>
             <template v-if="cell.dataIndex.indexOf('@@@') !== -1">
               <a-input
-                @change="handleInputDeepChange($event, cell.dataIndex)"
+                @change="handleInputDeepChange($event, cell.dataIndex, cell)"
                 v-model="config.tempData[cell.dataIndex]"
                 :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
-                :disabled="true"/>
+                :disabled="cell.inputReadOnly === true"
+                :class="{'required-field-error': isFieldRequired(cell) && !config.tempData[cell.dataIndex]}"/>
             </template>
             <template v-else>
               <a-input
+                @change="handleInputChange($event, cell.dataIndex, cell)"
                 v-model="configData[cell.dataIndex]"
                 :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
-                :disabled="true"/>
+                :disabled="cell.inputReadOnly === true"
+                :class="{'required-field-error': isFieldRequired(cell) && !configData[cell.dataIndex]}"/>
             </template>
-          </template>
-          <template v-else>
-            <template v-if="cell.dataIndex.indexOf('@@@') !== -1">
-              <a-input
-                @change="handleInputDeepChange($event, cell.dataIndex)"
-                v-model="config.tempData[cell.dataIndex]"
-                :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"/>
-            </template>
-            <template v-else>
-              <a-input
-                v-model="configData[cell.dataIndex]"
-                :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"/>
-            </template>
-          </template>
+            <div v-if="isFieldRequired(cell) && !getInputValue(cell)" class="required-message">
+              {{ getRequiredMessage(cell, 'input') }}
+            </div>
+          </div>
         </template>
         <template v-else-if="cell.type === 'inputs'">
           <template v-if="cell.inputReadOnly === true">
@@ -219,7 +277,7 @@
                 <span class="inputsDivItemLabel">{{ displayFormatStartText(cell.format) }}</span>
                 <template v-if="cell.dataIndex.indexOf('@@@') !== -1">
                   <a-input
-                    @change="handleInputDeepChange($event, cell.dataIndex)"
+                    @change="handleInputDeepChange($event, cell.dataIndex, cell)"
                     v-model="config.tempData[cell.dataIndex][index]"
                     :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
                     :disabled="true"/>
@@ -240,7 +298,7 @@
                 <span class="inputsDivItemLabel">{{ displayFormatStartText(cell.format) }}</span>
                 <template v-if="cell.dataIndex.indexOf('@@@') !== -1">
                   <a-input
-                    @change="handleInputDeepChange($event, cell.dataIndex)"
+                    @change="handleInputDeepChange($event, cell.dataIndex, cell)"
                     v-model="config.tempData[cell.dataIndex][index]"
                     :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"/>
                 </template>
@@ -337,6 +395,35 @@
           >{{ cell.text || '确认' }}
           </a-button>
         </template>
+        <template v-else-if="cell.type === 'datePicker'">
+          <div>
+            <a-date-picker
+              @change="handleArrayDatePickerChange($event, inputColumnsDefinitionIndex, cell.dataIndex, cell)"
+              :value="formatDateValue(configData.arr[inputColumnsDefinitionIndex][cell.dataIndex])"
+              format="YYYY-MM-DD"
+              :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
+              :disabled="cell.inputReadOnly === true"
+              :class="{'required-field-error': isFieldRequired(cell) && !configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]}"/>
+            <div v-if="isFieldRequired(cell) && !configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]" class="required-message">
+              {{ getRequiredMessage(cell, 'datePicker') }}
+            </div>
+          </div>
+        </template>
+        <template v-else-if="cell.type === 'timePicker'">
+          <div>
+            <a-date-picker
+              @change="handleArrayTimePickerChange($event, inputColumnsDefinitionIndex, cell.dataIndex, cell)"
+              :value="formatDateValue(configData.arr[inputColumnsDefinitionIndex][cell.dataIndex])"
+              format="YYYY-MM-DD HH:mm:ss"
+              show-time
+              :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
+              :disabled="cell.inputReadOnly === true"
+              :class="{'required-field-error': isFieldRequired(cell) && !configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]}"/>
+            <div v-if="isFieldRequired(cell) && !configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]" class="required-message">
+              {{ getRequiredMessage(cell, 'timePicker') }}
+            </div>
+          </div>
+        </template>
         <template v-else-if="cell.type === 'signature'">
           <img :src="configData[cell.dataIndex]" alt="签名加载失败" style="max-height: 2rem">
           <a-button v-if="!configData[cell.dataIndex]" type="dashed" >需要在手机端签名</a-button>
@@ -345,17 +432,17 @@
           {{ configData.arr[inputColumnsDefinitionIndex][cell.dataIndex] }}
         </template>
         <template v-else-if="cell.type === 'input'">
-          <template v-if="cell.inputReadOnly === true">
+          <div>
             <a-input
+              @change="handleArrayInputChange($event, inputColumnsDefinitionIndex, cell.dataIndex, cell)"
               v-model="configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]"
               :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"
-              :disabled="true"/>
-          </template>
-          <template v-else>
-            <a-input
-              v-model="configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]"
-              :style="'width:' + (cell.inputWidth ? cell.inputWidth : '100') + '%'"/>
-          </template>
+              :disabled="cell.inputReadOnly === true"
+              :class="{'required-field-error': isFieldRequired(cell) && !configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]}"/>
+            <div v-if="isFieldRequired(cell) && !configData.arr[inputColumnsDefinitionIndex][cell.dataIndex]" class="required-message">
+              {{ getRequiredMessage(cell, 'input') }}
+            </div>
+          </div>
         </template>
         <template v-else-if="cell.type === 'inputs'">
           <template v-if="cell.inputReadOnly === true">
@@ -379,6 +466,7 @@
 import Upload from '@vue2-client/base-client/components/common/Upload'
 import { formatDate } from '@vue2-client/utils/util'
 import { nanoid } from 'nanoid'
+import moment from 'moment'
 
 export default {
   name: 'XReportTrGroup',
@@ -582,9 +670,35 @@ export default {
       return result
     },
     // 表格中数据key含有@@@，需要手动触发更新
-    handleInputDeepChange () {
+    handleInputDeepChange (event, dataIndex, cell = null) {
+      // 如果字段必填且有值，触发重新渲染以移除错误样式
+      if (cell && this.isFieldRequired(cell) && event.target.value) {
+        this.$forceUpdate()
+      }
       this.$forceUpdate()
     },
+    // 处理普通input变化
+    handleInputChange (event, dataIndex, cell = null) {
+      // 如果字段必填且有值，触发重新渲染以移除错误样式
+      if (cell && this.isFieldRequired(cell) && event.target.value) {
+        this.$forceUpdate()
+      }
+    },
+    // 处理动态行中input变化
+    handleArrayInputChange (event, arrayIndex, dataIndex, cell = null) {
+      // 如果字段必填且有值，触发重新渲染以移除错误样式
+      if (cell && this.isFieldRequired(cell) && event.target.value) {
+        this.$forceUpdate()
+      }
+    },
+    // 获取input的值，用于必填校验
+    getInputValue (cell) {
+      if (cell.dataIndex.indexOf('@@@') !== -1) {
+        return this.config.tempData[cell.dataIndex]
+      } else {
+        return this.configData[cell.dataIndex]
+      }
+    },
     // 路径中含有@@@的key，将其解析，并返回其数据
     getDeepObject (obj, strPath) {
       const arr = strPath.split('@@@')
@@ -610,6 +724,69 @@ export default {
       }
       this.configData = Object.assign({}, this.configData)
     },
+    // 通用的日期时间选择器变化处理方法
+    handleDateTimePickerChange (date, dataIndex, format, arrayIndex = null, cell = null) {
+      const dateStr = date ? moment(date).format(format) : ''
+
+      if (arrayIndex !== null) {
+        // 处理动态行中的日期时间选择器
+        this.configData.arr[arrayIndex][dataIndex] = dateStr
+      } else if (dataIndex.indexOf('@@@') !== -1) {
+        // 处理深层嵌套的数据
+        this.handleInputDeepChange({ target: { value: dateStr } }, dataIndex, cell)
+      } else {
+        // 处理普通的数据
+        this.configData[dataIndex] = dateStr
+      }
+
+      // 如果字段必填且有值，触发重新渲染以移除错误样式
+      if (cell && this.isFieldRequired(cell) && dateStr) {
+        this.$forceUpdate()
+      }
+
+      this.configData = Object.assign({}, this.configData)
+    },
+    // 日期选择器变化处理（YYYY-MM-DD格式）
+    handleDatePickerChange (date, dataIndex, cell = null) {
+      this.handleDateTimePickerChange(date, dataIndex, 'YYYY-MM-DD', null, cell)
+    },
+    // 时间选择器变化处理（YYYY-MM-DD HH:mm:ss格式）
+    handleTimePickerChange (date, dataIndex, cell = null) {
+      this.handleDateTimePickerChange(date, dataIndex, 'YYYY-MM-DD HH:mm:ss', null, cell)
+    },
+    // 动态行中日期选择器变化处理
+    handleArrayDatePickerChange (date, arrayIndex, dataIndex, cell = null) {
+      this.handleDateTimePickerChange(date, dataIndex, 'YYYY-MM-DD', arrayIndex, cell)
+    },
+    // 动态行中时间选择器变化处理
+    handleArrayTimePickerChange (date, arrayIndex, dataIndex, cell = null) {
+      this.handleDateTimePickerChange(date, dataIndex, 'YYYY-MM-DD HH:mm:ss', arrayIndex, cell)
+    },
+    // 判断字段是否必填
+    isFieldRequired (cell) {
+      return cell && cell.required === true
+    },
+    // 获取必填字段的提示信息
+    getRequiredMessage (cell, fieldType) {
+      if (cell.requiredMessage) {
+        return cell.requiredMessage
+      }
+
+      // 默认提示信息
+      const defaultMessages = {
+        datePicker: '请选择日期',
+        timePicker: '请选择日期时间',
+        input: '请填写此字段'
+      }
+
+      return defaultMessages[fieldType] || '此字段为必填项'
+    },
+    // 格式化日期值，用于日期选择器的value
+    formatDateValue (dateStr) {
+      if (!dateStr) return null
+      const date = moment(dateStr)
+      return date.isValid() ? date : null
+    },
     // 反序列化函数并执行
     deserializeFunctionAndRun (functionStr, value) {
       // eslint-disable-next-line no-eval
@@ -813,4 +990,16 @@ export default {
   border-bottom: 1px solid #000;
   padding: 8px;
 }
+
+.required-field-error {
+  border-color: #ff4d4f !important;
+  box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2) !important;
+}
+
+.required-message {
+  color: #ff4d4f;
+  font-size: 12px;
+  margin-top: 4px;
+  line-height: 1.2;
+}
 </style>

package/src/base-client/components/common/XReport/index.md

@@ -36,9 +36,68 @@ export default {
 ```vue
 <XReport :config-name="'test_tableConfig'" :activated-slot-name="'test_tableConfig_slot'"/>
 ```
+
+## 支持的表单项目类型
+
+| 类型              | 说明   | 输出格式    | 备注       |
+|-----------------|------|-------|-----------|
+| input | 文本输入框 | 字符串 | 标准文本输入     |
+| datePicker| 日期选择器 | YYYY-MM-DD | 日期格式 |
+| timePicker | 时间选择器 | YYYY-MM-DD HH:mm:ss | 日期时间格式 |
+| curDateInput | 当前日期按钮 | YYYY-MM-DD HH:mm:ss | 点击获取当前时间|
+| signature | 签名框 | 图片URL | 需要在手机端操作|
+| images | 图片上传 | 图片数组 | 支持多图片上传|
+
+## 配置例子
+
+### 日期选择器配置
+```json
+{
+  "type": "datePicker",
+  "dataIndex": "selectedDate",
+  "inputWidth": "100%",
+  "inputReadOnly": false,
+  "required": true,
+  "requiredMessage": "请选择操作日期"
+}
+```
+
+### 时间选择器配置
+```json
+{
+  "type": "timePicker", 
+  "dataIndex": "selectedDateTime",
+  "inputWidth": "100%",
+  "inputReadOnly": false,
+  "required": true,
+  "requiredMessage": "请选择具体时间"
+}
+```
+
+### 必填字段配置说明
+
+| 参数              | 说明   | 类型    | 默认值       |
+|-----------------|------|-------|-----------|
+| required | 是否必填 | Boolean | false |
+| requiredMessage| 必填提示信息 | String | 根据字段类型自动生成 |
+
+**默认提示信息：**
+- datePicker: "请选择日期"
+- timePicker: "请选择日期时间" 
+- input: "请填写此字段"
+- 其他类型: "此字段为必填项"
+
+**必填校验特性：**
+- 必填字段为空时会显示红色边框和错误提示
+- 保存时会自动校验所有必填字段，校验失败会阻止保存并显示错误信息
+- 导出数据时会进行校验提醒，但不会阻止导出
+
 ## 注意事项
 
 > 在某些情况下，比如手机端，只需要输入表格中一部分的内容。
 > 可以将这部分内容作为插槽，并在activatedSlotName中填写插槽名。
 > 则会在设计页面仅展示插槽中的输入项，并在预览窗口中，根据configName中的配置，
 > 渲染出来完整的表格
+
+> 新增的datePicker和timePicker支持在普通行、动态行中使用，
+> 会自动格式化为指定的日期时间格式并保存到配置数据中。支持必填校验功能。