af-mobile-client-vue3 1.3.10 → 1.3.11

package/package.json

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

package/src/components/data/XFormGroup/doc/DeviceForm.vue

@@ -119,4 +119,4 @@ onUnmounted(() => {
     color: #ff976a;
   }
 }
-</style>
+</style>

package/src/components/data/XFormGroup/doc/UserForm.vue

@@ -99,4 +99,4 @@ onUnmounted(() => {
 .user-form {
   padding: 16px;
 }
-</style>
+</style>

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

@@ -11,6 +11,7 @@ const props = withDefaults(defineProps<{
   mode?: string
   isScrollspy?: boolean
   formShow?: any
+  showTabHeader?: boolean
 }>(), {
   configName: '',
   serviceName: undefined,
@@ -18,25 +19,15 @@ const props = withDefaults(defineProps<{
   mode: '查询',
   isScrollspy: true,
   formShow: undefined,
+  showTabHeader: true,
 })
 const emit = defineEmits(['submit', 'xFormItemEmitFunc'])
 
-interface Form {
-  configName?: string
-  serviceName?: string
-  groupFormData?: object
-  mode?: string
-  isScrollspy?: boolean
-  formShow?: any
-}
-
 const groupItems = ref([])
 const formData = ref({})
 const submitGroup = ref(false)
 const submitSimple = ref(false)
 const isInit = ref(false)
-const initStatus = ref(false)
-const propsData = ref<Partial<Form>>({})
 
 const slots = useSlots()
 const renderableGroupItems = computed(() => {
@@ -55,18 +46,9 @@ const renderableGroupItems = computed(() => {
 })
 
 // 组件初始化函数
-function init(params: Form) {
-  initStatus.value = true
-  propsData.value = {
-    configName: props.configName,
-    serviceName: props.serviceName,
-    groupFormData: props.groupFormData,
-    mode: props.mode,
-    formShow: props.formShow,
-    ...params,
-  }
-  formData.value = propsData.value.groupFormData
-  getConfigByName(propsData.value.configName, (result) => {
+function init() {
+  formData.value = props.groupFormData
+  getConfigByName(props.configName, (result) => {
     if (result?.groups) {
       groupItems.value = result.groups
       result.groups.forEach((group) => {
@@ -81,14 +63,13 @@ function init(params: Form) {
       groupItems.value = [{ ...result }]
     }
     isInit.value = true
-  }, propsData.value.serviceName)
+  }, props.serviceName)
 }
-watch(() => props.groupFormData, (_val) => {
-  formData.value = { ...formData.value, ...props.groupFormData }
-})
+// watch(() => props.groupFormData, (_val) => {
+//   formData.value = { ...formData.value, ...props.groupFormData }
+// })
 onBeforeMount(() => {
-  if (!initStatus.value)
-    init(props)
+  init()
 })
 interface XFormLike {
   validate: () => Promise<void>
@@ -112,6 +93,7 @@ function removeRef(refValue: XFormLike) {
 }
 
 async function submit() {
+  console.log(props.groupFormData)
   for (const res of xFormListRef.value) {
     try {
       await res.validate()
@@ -143,7 +125,7 @@ defineExpose({ init, removeRef, xFormListRef })
 
 <template>
   <div v-if="isInit" id="x-form-group">
-    <VanTabs :scrollspy="propsData.isScrollspy" sticky :offset-top="offsetTop">
+    <VanTabs :scrollspy="props.isScrollspy" sticky :offset-top="offsetTop" :show-header="props.showTabHeader">
       <VanTab
         v-for="(item, index) in renderableGroupItems"
         :key="item.groupName ? (item.groupName + index) : index"
@@ -153,7 +135,7 @@ defineExpose({ init, removeRef, xFormListRef })
           class="x-form-group-item"
           :class="{ 'is-last': index === renderableGroupItems.length - 1 }"
         >
-          <div v-if="item.describe && propsData.isScrollspy && (item.groupName || item.slotName)" class="form-group-title">
+          <div v-if="item.describe && props.isScrollspy && (item.groupName || item.slotName)" class="form-group-title">
             <span class="form-group-bar" />
             <span class="form-group-text">{{ item.describe }}</span>
           </div>
@@ -193,7 +175,6 @@ defineExpose({ init, removeRef, xFormListRef })
 
 <style scoped lang="less">
 #x-form-group {
-  padding: 12px;
   display: flex;
   flex-direction: column;
   background-color: rgb(247, 248, 250);

package/src/components/data/XReportGrid/XReportDemo.vue

@@ -1,33 +1,33 @@
-<script setup lang="ts">
-import { onMounted, ref } from 'vue'
-import XReport from './XReport.vue'
-
-const mainRef = ref()
-
-onMounted(() => {
-  // 初始化逻辑
-})
-</script>
-
-<template>
-  <div id="test">
-    <van-card :bordered="false">
-      <XReport
-        ref="mainRef"
-        :use-oss-for-img="false"
-        config-name="nurseWorkstationCover"
-        server-name="af-his"
-        :show-img-in-cell="true"
-        :display-only="true"
-        :edit-mode="false"
-        :show-save-button="false"
-        :no-padding="true"
-        :dont-format="true"
-      />
-    </van-card>
-  </div>
-</template>
-
-<style scoped>
-
-</style>
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import XReport from './XReport.vue'
+
+const mainRef = ref()
+
+onMounted(() => {
+  // 初始化逻辑
+})
+</script>
+
+<template>
+  <div id="test">
+    <van-card :bordered="false">
+      <XReport
+        ref="mainRef"
+        :use-oss-for-img="false"
+        config-name="nurseWorkstationCover"
+        server-name="af-his"
+        :show-img-in-cell="true"
+        :display-only="true"
+        :edit-mode="false"
+        :show-save-button="false"
+        :no-padding="true"
+        :dont-format="true"
+      />
+    </van-card>
+  </div>
+</template>
+
+<style scoped>
+
+</style>

package/src/components/data/XReportGrid/print.js

@@ -1,184 +1,184 @@
-// print.js
-
-export function printElement(elementToPrint) {
-  // 创建一个新的浏览器窗口
-  const printWindow = window.open('', '_blank', 'height=1024,width=768')
-  // 设置新窗口的文档内容
-  printWindow.document.write(`
-    <html>
-      <head>
-        <title>Print</title>
-        <style>
-          @page {
-            size: auto;
-            margin: 0mm;
-          }
-          html, body {
-            margin: 0;
-            padding: 0;
-            width: 100%;
-            height: 100%;
-          }
-          #print-container {
-            display: none
-          }
-          .img{
-            width: 95%;
-            height: 180px;
-            object-fit: cover;
-          }
-          .reportMain {
-            text-align: center;
-            margin: 0 auto;
-            font-size: 16px;
-            color: #000;
-            background-color: #fff;
-            border-radius: 8px;
-
-            .reportTitle {
-              font-weight: bold;
-            }
-
-            .subTitle {
-              display: flex;
-              justify-content: space-between;
-              margin-bottom: 1%;
-
-              .subTitleItems {
-                max-width: 30%;
-              }
-            }
-
-            .inputsDiv {
-              display: flex;
-              justify-content: space-between;
-              .inputsDivItem {
-                display: flex;
-                align-items: center;
-                padding: 0 4px;
-                white-space: nowrap;
-                .inputsDivItemLabel {
-                  padding: 0 4px;
-                }
-              }
-            }
-
-            .reportTable {
-              width: 100%;
-              border-collapse: collapse;
-              table-layout:fixed;
-              word-break:break-all;
-              text-align: center;
-            }
-          }
-          .reportMainForDisplay {
-            text-align: center;
-            margin: 10% auto;
-            font-size: 16px;
-            color: #000;
-            background-color: #fff;
-            border-radius: 8px;
-
-            .reportTitle {
-              font-weight: bold;
-            }
-
-            .subTitle {
-              display: flex;
-              justify-content: space-between;
-
-              .subTitleItems {
-                max-width: 30%;
-              }
-            }
-
-            .inputsDiv {
-              display: flex;
-              justify-content: space-around;
-              .inputsDivItem {
-                display: flex;
-                align-items: center;
-                padding: 0 4px;
-                white-space: nowrap;
-                .inputsDivItemLabel {
-                  padding: 0 4px;
-                }
-              }
-            }
-
-            .reportTable {
-              width: 100%;
-              border-collapse: collapse;
-              table-layout:fixed;
-              word-break:break-all;
-            }
-          }
-          .reportMainNoPadding {
-            text-align: center;
-            margin: 0 auto;
-            font-size: 16px;
-            color: #000;
-            background-color: #fff;
-            border-radius: 8px;
-
-            .reportTitle {
-              font-weight: bold;
-            }
-
-            .subTitle {
-              display: flex;
-              justify-content: space-between;
-
-              .subTitleItems {
-                max-width: 30%;
-              }
-            }
-
-            .inputsDiv {
-              display: flex;
-              justify-content: space-between;
-              .inputsDivItem {
-                display: flex;
-                align-items: center;
-                padding: 0 4px;
-                white-space: nowrap;
-                .inputsDivItemLabel {
-                  padding: 0 4px;
-                }
-              }
-            }
-
-            .reportTable {
-              width: 100%;
-              border-collapse: collapse;
-              table-layout:fixed;
-              word-break:break-all;
-            }
-          }
-          .tools{
-            position: fixed;
-            right: 2%;
-            text-align: right;
-            width: 60%;
-            cursor: pointer;
-            .toolsItem{
-              width: 15%;
-              margin-right: 3%;
-              display: inline-block;
-            }
-          }
-        </style>
-      </head>
-      <body>
-        <!-- 将需要打印的元素内容复制到新窗口中 -->
-        ${elementToPrint.innerHTML}
-      </body>
-    </html>
-  `)
-  // 延迟执行打印，以确保新窗口的内容已加载完成
-  printWindow.document.close() // 关闭文档流，确保内容完全加载
-  setTimeout(() => {
-    printWindow.print() // 调用打印方法
-    printWindow.close()
-  }, 500) // 延迟500毫秒后执行打印
-}
+// print.js
+
+export function printElement(elementToPrint) {
+  // 创建一个新的浏览器窗口
+  const printWindow = window.open('', '_blank', 'height=1024,width=768')
+  // 设置新窗口的文档内容
+  printWindow.document.write(`
+    <html>
+      <head>
+        <title>Print</title>
+        <style>
+          @page {
+            size: auto;
+            margin: 0mm;
+          }
+          html, body {
+            margin: 0;
+            padding: 0;
+            width: 100%;
+            height: 100%;
+          }
+          #print-container {
+            display: none
+          }
+          .img{
+            width: 95%;
+            height: 180px;
+            object-fit: cover;
+          }
+          .reportMain {
+            text-align: center;
+            margin: 0 auto;
+            font-size: 16px;
+            color: #000;
+            background-color: #fff;
+            border-radius: 8px;
+
+            .reportTitle {
+              font-weight: bold;
+            }
+
+            .subTitle {
+              display: flex;
+              justify-content: space-between;
+              margin-bottom: 1%;
+
+              .subTitleItems {
+                max-width: 30%;
+              }
+            }
+
+            .inputsDiv {
+              display: flex;
+              justify-content: space-between;
+              .inputsDivItem {
+                display: flex;
+                align-items: center;
+                padding: 0 4px;
+                white-space: nowrap;
+                .inputsDivItemLabel {
+                  padding: 0 4px;
+                }
+              }
+            }
+
+            .reportTable {
+              width: 100%;
+              border-collapse: collapse;
+              table-layout:fixed;
+              word-break:break-all;
+              text-align: center;
+            }
+          }
+          .reportMainForDisplay {
+            text-align: center;
+            margin: 10% auto;
+            font-size: 16px;
+            color: #000;
+            background-color: #fff;
+            border-radius: 8px;
+
+            .reportTitle {
+              font-weight: bold;
+            }
+
+            .subTitle {
+              display: flex;
+              justify-content: space-between;
+
+              .subTitleItems {
+                max-width: 30%;
+              }
+            }
+
+            .inputsDiv {
+              display: flex;
+              justify-content: space-around;
+              .inputsDivItem {
+                display: flex;
+                align-items: center;
+                padding: 0 4px;
+                white-space: nowrap;
+                .inputsDivItemLabel {
+                  padding: 0 4px;
+                }
+              }
+            }
+
+            .reportTable {
+              width: 100%;
+              border-collapse: collapse;
+              table-layout:fixed;
+              word-break:break-all;
+            }
+          }
+          .reportMainNoPadding {
+            text-align: center;
+            margin: 0 auto;
+            font-size: 16px;
+            color: #000;
+            background-color: #fff;
+            border-radius: 8px;
+
+            .reportTitle {
+              font-weight: bold;
+            }
+
+            .subTitle {
+              display: flex;
+              justify-content: space-between;
+
+              .subTitleItems {
+                max-width: 30%;
+              }
+            }
+
+            .inputsDiv {
+              display: flex;
+              justify-content: space-between;
+              .inputsDivItem {
+                display: flex;
+                align-items: center;
+                padding: 0 4px;
+                white-space: nowrap;
+                .inputsDivItemLabel {
+                  padding: 0 4px;
+                }
+              }
+            }
+
+            .reportTable {
+              width: 100%;
+              border-collapse: collapse;
+              table-layout:fixed;
+              word-break:break-all;
+            }
+          }
+          .tools{
+            position: fixed;
+            right: 2%;
+            text-align: right;
+            width: 60%;
+            cursor: pointer;
+            .toolsItem{
+              width: 15%;
+              margin-right: 3%;
+              display: inline-block;
+            }
+          }
+        </style>
+      </head>
+      <body>
+        <!-- 将需要打印的元素内容复制到新窗口中 -->
+        ${elementToPrint.innerHTML}
+      </body>
+    </html>
+  `)
+  // 延迟执行打印，以确保新窗口的内容已加载完成
+  printWindow.document.close() // 关闭文档流，确保内容完全加载
+  setTimeout(() => {
+    printWindow.print() // 调用打印方法
+    printWindow.close()
+  }, 500) // 延迟500毫秒后执行打印
+}

package/src/router/routes.ts

@@ -10,7 +10,6 @@ import XCellDetailView from '@af-mobile-client-vue3/views/component/XCellDetailV
 import XCellListView from '@af-mobile-client-vue3/views/component/XCellListView/index.vue'
 import XFormAppraiseView from '@af-mobile-client-vue3/views/component/XFormAppraiseView/index.vue'
 import XFormGroupView from '@af-mobile-client-vue3/views/component/XFormGroupView/index.vue'
-import xformgroup222 from '@af-mobile-client-vue3/views/component/XFormGroupView/xformgroup222.vue'
 import XFormView from '@af-mobile-client-vue3/views/component/XFormView/index.vue'
 import XOlMapView from '@af-mobile-client-vue3/views/component/XOlMapView/index.vue'
 import XLocationPicker from '@af-mobile-client-vue3/views/component/XOlMapView/XLocationPicker/index.vue'
@@ -67,11 +66,6 @@ const routes: Array<RouteRecordRaw> = [
         name: 'XCellDetailView',
         component: XCellDetailView,
       },
-      {
-        path: '/xformgroup222',
-        name: 'xformgroup222',
-        component: xformgroup222,
-      },
       {
         path: '/Component/XFormGroupView',
         name: 'XFormGroupView',

package/src/utils/queryFormDefaultRangePicker.ts

@@ -1,57 +1,57 @@
-/**
- * 根据类型获取日期区间字符串
- * @param type '当年' | 'curMonth' | '当日'
- * @param show 区分实际值还是显示值, true为实际值, false为显示值
- * @returns [start, end] 例：['2024-01-01 00:00:00', '2024-12-31 23:59:59']
- */
-export function getRangeByType(type: string, show: boolean): [string, string] {
-  const now = new Date()
-  const year = now.getFullYear()
-  const month = (now.getMonth() + 1).toString().padStart(2, '0')
-  const day = now.getDate().toString().padStart(2, '0')
-
-  if (!show) {
-    if (type === 'curYear') {
-      return [
-        `${year}-01-01 00:00:00`,
-        `${year}-12-31 23:59:59`,
-      ]
-    }
-    if (type === 'curMonth') {
-      const lastDay = new Date(year, now.getMonth() + 1, 0).getDate()
-      return [
-        `${year}-${month}-01 00:00:00`,
-        `${year}-${month}-${lastDay.toString().padStart(2, '0')} 23:59:59`,
-      ]
-    }
-    if (type === 'curDay') {
-      return [
-        `${year}-${month}-${day} 00:00:00`,
-        `${year}-${month}-${day} 23:59:59`,
-      ]
-    }
-  }
-  if (show) {
-    if (type === 'curYear') {
-      return [
-        `${year}-01-01`,
-        `${year}-12-31`,
-      ]
-    }
-    if (type === 'curMonth') {
-      const lastDay = new Date(year, now.getMonth() + 1, 0).getDate()
-      return [
-        `${year}-${month}-01`,
-        `${year}-${month}-${lastDay.toString().padStart(2, '0')}`,
-      ]
-    }
-    if (type === 'curDay') {
-      return [
-        `${year}-${month}-${day}`,
-        `${year}-${month}-${day}`,
-      ]
-    }
-  }
-  // 兜底返回空字符串数组
-  return ['', '']
-}
+/**
+ * 根据类型获取日期区间字符串
+ * @param type '当年' | 'curMonth' | '当日'
+ * @param show 区分实际值还是显示值, true为实际值, false为显示值
+ * @returns [start, end] 例：['2024-01-01 00:00:00', '2024-12-31 23:59:59']
+ */
+export function getRangeByType(type: string, show: boolean): [string, string] {
+  const now = new Date()
+  const year = now.getFullYear()
+  const month = (now.getMonth() + 1).toString().padStart(2, '0')
+  const day = now.getDate().toString().padStart(2, '0')
+
+  if (!show) {
+    if (type === 'curYear') {
+      return [
+        `${year}-01-01 00:00:00`,
+        `${year}-12-31 23:59:59`,
+      ]
+    }
+    if (type === 'curMonth') {
+      const lastDay = new Date(year, now.getMonth() + 1, 0).getDate()
+      return [
+        `${year}-${month}-01 00:00:00`,
+        `${year}-${month}-${lastDay.toString().padStart(2, '0')} 23:59:59`,
+      ]
+    }
+    if (type === 'curDay') {
+      return [
+        `${year}-${month}-${day} 00:00:00`,
+        `${year}-${month}-${day} 23:59:59`,
+      ]
+    }
+  }
+  if (show) {
+    if (type === 'curYear') {
+      return [
+        `${year}-01-01`,
+        `${year}-12-31`,
+      ]
+    }
+    if (type === 'curMonth') {
+      const lastDay = new Date(year, now.getMonth() + 1, 0).getDate()
+      return [
+        `${year}-${month}-01`,
+        `${year}-${month}-${lastDay.toString().padStart(2, '0')}`,
+      ]
+    }
+    if (type === 'curDay') {
+      return [
+        `${year}-${month}-${day}`,
+        `${year}-${month}-${day}`,
+      ]
+    }
+  }
+  // 兜底返回空字符串数组
+  return ['', '']
+}

package/src/views/component/XCellListView/index.vue

@@ -1,157 +1,147 @@
 <script setup lang="ts">
 import XCellList from '@af-mobile-client-vue3/components/data/XCellList/index.vue'
-import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
-import { useUserStore } from '@af-mobile-client-vue3/stores/modules/user'
-import { defineEmits, ref } from 'vue'
+import { defineOptions, onActivated, onMounted, ref } from 'vue'
 import { useRouter } from 'vue-router'
 
-// 定义事件
-const emit = defineEmits(['deleteRow'])
-const userInfo = useUserStore().getUserInfo()
-// 访问路由
+defineOptions({ name: 'XCellListView' })
+const configName = ref('ApplyMobileProcessCRUD')
+const serviceName = ref('af-apply')
 const router = useRouter()
-// 获取默认值
-const idKey = ref('o_id')
-
-// 简易crud表单测试
-// const configName = ref('orderCarInMobileCRUD')
-// const serviceName = ref('af-gaslink')
-// const configName = ref('lngPriceManageMobileCRUD')
-const configName = ref('测试2')
-const serviceName = ref('af-gaslink')
-// const configName = ref('mobile_liushuiQueryCRUD')
-// const serviceName = ref('af-revenue')
-
-// 资源权限测试
-// const configName = ref('crud_sources_test')
-// const serviceName = ref('af-system')
-
-// 实际业务测试
-// const configName = ref('lngChargeAuditMobileCRUD')
-// const serviceName = ref('af-gaslink')
-
-// 跳转到详情页面
-// function toDetail(item) {
-//   router.push({
-//     name: 'XCellDetailView',
-//     params: { id: item[idKey.value] }, // 如果使用命名路由，推荐使用路由参数而不是直接构建 URL
-//     query: {
-//       operName: item[operNameKey.value],
-//       method:item[methodKey.value],
-//       requestMethod:item[requestMethodKey.value],
-//       operatorType:item[operatorTypeKey.value],
-//       operUrl:item[operUrlKey.value],
-//       operIp:item[operIpKey.value],
-//       costTime:item[costTimeKey.value],
-//       operTime:item[operTimeKey.value],
-//
-//       title: item[titleKey.value],
-//       businessType: item[businessTypeKey.value],
-//       status:item[statusKey.value]
-//     }
-//   })
-// }
-
-// 跳转到表单——以表单组来渲染纯表单
-function toDetail(item) {
-  router.push({
-    name: 'xformgroup222',
-    // query: {
-    //   id: item[idKey.value],
-    // id: item.rr_id,
-    // o_id: item.o_id,
-    // },
-  })
+// 删除功能
+function phone(result) {
+  // todo 调用真机进行通话
 }
-
-// 新增功能
-// function addOption(totalCount) {
-//   router.push({
-//     name: 'XFormView',
-//     params: { id: totalCount, openid: totalCount },
-//     query: {
-//       configName: configName.value,
-//       serviceName: serviceName.value,
-//       mode: '新增',
-//     },
-//   })
-// }
-function addOption() {
-  console.log('用户----', userInfo)
-  router.push({
-    name: 'XFormGroupView',
-    // params: { id: totalCount.value },
-    // query: {
-    //   configName: configName.value,
-    //   serviceName: serviceName.value,
-    //   mode: '新增',
-    // },
-  })
-  // 如果存在回调函数，调用它并传递true表示已处理
-  // if (typeof callback === 'function') {
-  //   callback(true)
-  // }
+// 跳转流程处理
+function action(row) {
+  router.push({ name: 'XFormGroupView', query: { workflowId: row.ab_f_workflow_id, stepId: row.ws_f_step_id } })
 }
-
-// 修改功能
-function updateRow(result) {
-  console.log('用户----', userInfo)
-  router.push({
-    name: 'XFormView',
-    params: { id: 1, openid: 2 },
-    query: {
-      configName: configName.value,
-      serviceName: serviceName.value,
-      mode: '修改',
-    },
-  })
-}
-
-// 删除功能
-function deleteRow(result) {
-  emit('deleteRow', result.o_id)
+// 工作日志
+function worklog(row) {
+  router.push({ name: 'worklog', query: { workflowid: row.ab_f_workflow_id, defname: row.ws_f_name } })
 }
+onMounted(() => {
+  console.log('初始化页面===')
+})
+onActivated(() => {
+  // 每次回到页面都会触发
+  console.log('activated: 每次回到页面都会触发')
+})
 </script>
 
 <template>
-  <NormalDataLayout id="XCellListView" title="工作计划">
-    <template #layout_content>
-      <!--      <XCellList -->
-      <!--        :config-name="configName" -->
-      <!--        :service-name="serviceName" -->
-      <!--        :custom-add="true" -->
-      <!--        :custom-edit="true" -->
-      <!--        :id-key="idKey" -->
-      <!--        @to-detail="toDetail" -->
-      <!--        @delete-row="deleteRow" -->
-      <!--        @update="updateRow" -->
-      <!--        @add="addOption" -->
-      <!--      /> -->
-
-      <!--      :fix-query-form="{ u_f_price_state: ['生效', '待生效'] }" -->
-
-      <!--      <XCellList -->
-      <!--        config-name="ApplyMobileSuperviseCRUD" -->
-      <!--        service-name="af-apply" -->
-      <!--        @to-detail="toDetail" -->
-      <!--        @delete-row="deleteRow" -->
-      <!--      /> -->
-
-      <!--      <XCellList -->
-      <!--        service-name="af-revenue" -->
-      <!--        config-name="userfiles_sel_address" -->
-      <!--        @to-detail="toDetail" -->
-      <!--      /> -->
-      <XCellList
-        service-name="af-safecheck"
-        config-name="temporarySecurityCheckCRUD"
-        :custom-add="true"
-        @to-detail="toDetail"
-        @add="addOption"
-      />
-    </template>
-  </NormalDataLayout>
+  <XCellList
+    :config-name="configName"
+    :service-name="serviceName"
+    @phone="phone"
+    @action="action"
+    @worklog="worklog"
+  />
 </template>
 
 <style scoped lang="less">
+.cell-search-after {
+  padding: 0 12px 12px 12px;
+  background-color: #fff;
+  .van-row:first-child {
+    align-items: center;
+    margin-bottom: 8px;
+    padding: 0 2px;
+    h4 {
+      font-size: 1.08rem;
+      font-weight: 600;
+      margin: 0;
+      color: #222;
+      letter-spacing: 1px;
+    }
+    .stat-date-range {
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      font-size: 0.92rem;
+      color: #b0b3b8;
+      font-weight: 400;
+      span {
+        margin-left: 4px;
+        font-size: 0.92rem;
+        color: #b0b3b8;
+      }
+      .van-icon {
+        font-size: 1rem;
+        color: #b0b3b8;
+        margin-right: 2px;
+      }
+    }
+  }
+  .van-row:nth-child(2) {
+    margin-top: 8px;
+    // 统计卡片间距由gutter控制
+    .van-col {
+      // 让卡片宽度自适应
+      .stat-card {
+        width: 100%;
+      }
+    }
+  }
+  .stat-card {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border-radius: 12px;
+    padding: 6px 0 4px 0; // 压缩高度
+    min-height: 44px; // 压缩高度
+    position: relative;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
+    background: #f7f8fa;
+    .stat-num {
+      font-size: 1.08rem; // 缩小字体
+      font-weight: 600;
+      margin-bottom: 2px;
+    }
+    .stat-label {
+      font-size: 0.82rem; // 缩小字体
+      margin-bottom: 2px;
+    }
+    .stat-icon {
+      position: absolute;
+      top: 6px;
+      right: 8px;
+      font-size: 1rem;
+      opacity: 0.4;
+    }
+  }
+  .stat-total {
+    background: #f0f5ff;
+    color: #2f54eb;
+    .stat-num,
+    .stat-label {
+      color: #2f54eb;
+    }
+    .stat-icon {
+      color: #2f54eb;
+    }
+  }
+  .stat-done {
+    background: #e6fffb;
+    color: #13c2c2;
+    .stat-num,
+    .stat-label {
+      color: #13c2c2;
+    }
+    .stat-icon {
+      color: #13c2c2;
+    }
+  }
+  .stat-processing {
+    background: #f9f0ff;
+    color: #b37feb;
+    .stat-num,
+    .stat-label {
+      color: #b37feb;
+    }
+    .stat-icon {
+      color: #b37feb;
+    }
+  }
+}
 </style>

package/src/views/component/XFormGroupView/index.vue

@@ -1,35 +1,36 @@
 <script setup lang="ts">
 import XFormGroup from '@af-mobile-client-vue3/components/data/XFormGroup/index.vue'
+import XFormView from '@af-mobile-client-vue3/views/component/XFormView/index.vue'
 import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
 import { showDialog } from 'vant'
 import { ref } from 'vue'
 import { useRoute } from 'vue-router'
 
-// const configName = ref('reviewFormGroup')
-// const serviceName = ref('af-revenue')
-
 // 纯表单
-// const configName = ref('form_check_test')
-// const serviceName = ref('af-system')
+const configName = ref('appapplyuserinfoFormGroup')
+const serviceName = ref('af-apply')
 
 // const configName = ref("计划下发Form")
 // const serviceName = ref("af-linepatrol")
 
 // 表单组
-const configName = ref('lngChargeAuditMobileFormGroup')
-const serviceName = ref('af-gaslink')
+// const configName = ref('lngChargeAuditMobileFormGroup')
+// const serviceName = ref('af-gaslink')
 
-const formData = ref({})
+const formData = ref({t_userinfo:{f_user_name:111}})
 const formGroup = ref(null)
 const route = useRoute()
 const isInit = ref(false)
 function submit(_result) {
-  showDialog({ message: '提交成功' }).then(() => {
-    console.log('12121')
-    // history.back()
-  })
+  showDialog({ message: '提交成功' })
+  history.back()
+}
+const myXForm = ref([])
+function setRef(value: any) {
+  console.log('myXForm', myXForm)
+  formGroup.value.setRef(myXForm.value)
+  console.log(formGroup)
 }
-
 // 表单组——数据
 // function initComponents () {
 //   runLogic('getlngChargeAuditMobileFormGroupData', {id: 29}, 'af-gaslink').then((res) => {
@@ -59,20 +60,28 @@ function submit(_result) {
 // onBeforeMount(() => {
 //   initComponents()
 // })
+function a(){
+  formData.value.t_userinfo.f_user_name = '453333333'
+}
 </script>
 
 <template>
   <NormalDataLayout id="XFormGroupView" title="纯表单">
     <template #layout_content>
+      <button @click="a">修改</button>
       <!--      v-if="isInit" -->
       <XFormGroup
         ref="formGroup"
-        config-name="ApplyAddContractFormGroup"
-        service-name="af-apply"
+        :config-name="configName"
+        :service-name="serviceName"
         :group-form-data="formData"
         mode="新增"
         @submit="submit"
-      />
+      >
+<!--        <template #device="{ setRef, removeRef, item, formData }">
+          <XFormView :setRef="setRef" :formGroupName="'myXForm'"/>
+        </template>-->
+      </XFormGroup>
     </template>
   </NormalDataLayout>
 </template>

package/src/views/component/XFormView/index.vue

@@ -1,25 +1,105 @@
 <script setup lang="ts">
+// 组件顶部功能说明：本组件为表单视图，支持通过 setRef 注册自身到父组件
 import XForm from '@af-mobile-client-vue3/components/data/XForm/index.vue'
-import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
-import { ref } from 'vue'
+import { post } from '@af-mobile-client-vue3/services/restTools'
+import { useUserStore } from '@af-mobile-client-vue3/stores/modules/user'
+import dayjs from 'dayjs/esm/index'
+import { showFailToast, showToast } from 'vant'
+import {computed, defineExpose, defineProps, onMounted, onUnmounted, ref} from 'vue'
+import { useRoute } from 'vue-router'
 
-const configName = ref('addappapplychargeForm')
+const props = withDefaults(defineProps<{
+  setRef?: (refValue: any) => void
+  removeRef?: (refValue: any) => void
+  formGroupName?: string
+}>(), {
+  setRef: () => {},
+  removeRef: () => {},
+  formGroupName: '',
+})
+const configName = ref('mobile_OtherChargeCancelForm')
 const serviceName = ref('af-apply')
+const route = useRoute()
+const userInfo = useUserStore().getUserInfo()
+const workflowId = computed(() => route.query.workflowid)
+const formData = {
+  f_cancel_reason: '1111',
+}
 
-const formGroupAddConstruction = ref(null)
+const xFormRef = ref()
+const aaa = ref({})
+function submit(res: any) {
+  if (Number(res.charge_money) > Number(res.surplus_money)) {
+    showFailToast('收费金额不能大于未结金额！！')
+    return
+  }
+  const saveData = {
+    f_payment_type: res.payment_type,
+    f_charge_money: res.charge_money,
+    f_amount_words: res.amount_words,
+    f_payment_method: res.payment_method,
+    f_actual_date: res.actual_date,
+    f_charge_status: '有效',
+    f_workflow_id: workflowId.value,
+    f_charge_collectors: userInfo.f_operator,
+    f_charge_collectors_id: userInfo.f_operatorid,
+    f_charge_date: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+    f_filialeid: userInfo.f_orgid,
+    f_filiale: userInfo.f_orgname,
+  }
+  post('api/af-apply/entity/save/t_charge_record', saveData).then((_res) => {
+    showToast('提交成功！')
+    history.back()
+  })
+}
+function init() {
+  // runLogic('getApplyBusinessrecode', { f_workflow_id: 854 }, 'af-apply').then((res) => {
+  //   // formData.value = res
+  //   console.log('res==', res)
+  // }).catch((err) => {
+  //
+  // })
+  setTimeout(() => {
+    Object.assign(formData, { f_cancel_reason: '2222222' })
+  }, 5000)
+}
+function validate() {
+  // 调用 XForm 的 validate 方法
+  return xFormRef.value?.validate?.() ?? Promise.resolve()
+}
+function getFormData() {
+  console.log('自定义表单=====', xFormRef.value.getFormData())
+  // 获取 XForm 的表单数据
+  return xFormRef.value?.getFormData?.() ?? {}
+}
+onMounted(() => {
+  init()
+})
+const exposeObj = { validate, getFormData, init, formGroupName: props.formGroupName }
+defineExpose(exposeObj)
+onMounted(() => {
+  props.setRef && props.setRef(exposeObj)
+})
+onUnmounted(() => {
+  props.removeRef && props.removeRef(exposeObj)
+})
+// watch(() => props.formData, (newVal) => {
+//   console.log('变更了===', newVal)
+//   if (newVal) {
+//     Object.assign(form, newVal)
+//   }
+// })
 </script>
 
 <template>
-  <NormalDataLayout id="XFormGroupView" title="纯表单">
-    <template #layout_content>
-      <XForm
-        ref="formGroupAddConstruction"
-        mode="新增"
-        :config-name="configName"
-        :service-name="serviceName"
-      />
-    </template>
-  </NormalDataLayout>
+  <XForm
+    ref="xFormRef"
+    mode="新增"
+    :config-name="configName"
+    :service-name="serviceName"
+    :form-data="formData"
+    @on-submit="submit"
+  />
 </template>
 
 <style scoped lang="less">

package/vite.config.ts

@@ -11,8 +11,8 @@ export default ({ mode }: ConfigEnv): UserConfig => {
 
   const appProxys = {}
 
-  const v4Server = 'http://aote-office.8866.org:31567'
-  const v3Server = 'http://aote-office.8866.org:31567'
+  const v4Server = 'http://192.168.50.67:31577'
+  const v3Server = 'https://wkf.qhgas.com'
   const OSSServerDev = 'http://192.168.50.67:30351'
   const geoserver = 'http://39.104.49.8:30372'
   // const OSSServerProd = 'http://192.168.50.67:31351'

package/src/views/component/XFormGroupView/xformgroup222.vue

@@ -1,97 +0,0 @@
-<script setup lang="ts">
-import XFormGroup from '@af-mobile-client-vue3/components/data/XFormGroup/index.vue'
-import { runLogic } from '@af-mobile-client-vue3/services/api/common'
-import { useUserStore } from '@af-mobile-client-vue3/stores/modules/user'
-import dayjs from 'dayjs/esm/index'
-import { showToast } from 'vant'
-import { onMounted, ref } from 'vue'
-import { useRoute } from 'vue-router'
-
-const configName = ref('appapplyuserinfoFormGroup')
-const serviceName = ref('af-apply')
-const route = useRoute()
-const userInfo = useUserStore().getUserInfo()
-const workflowId = ref('3045')
-const userinfoid = ref('93116')
-const model = ref('编辑')
-const groupFormData = ref({})
-
-function submit(res) {
-  if (model.value === '新增') {
-    res.t_userinfo.f_operate_date = dayjs().format('YYYY-MM-DD HH:mm:ss')
-    res.t_userinfo.f_orgid = userInfo.f_orgid
-    res.t_userinfo.f_orgname = userInfo.f_orgname
-    res.t_userinfo.f_depid = userInfo.f_depid
-    res.t_userinfo.f_depname = userInfo.f_depname
-    res.t_userinfo.f_operatorid = userInfo.f_operatorid
-    res.t_userinfo.f_operator = userInfo.f_operator
-    res.t_userinfo.f_workflow_id = this.f_workflow_id
-    res.t_userinfo.f_user_state = '预备'
-
-    res.t_userfiles.f_operate_date = dayjs().format('YYYY-MM-DD HH:mm:ss')
-    res.t_userfiles.f_orgid = userInfo.f_orgid
-    res.t_userfiles.f_orgname = userInfo.f_orgname
-    res.t_userfiles.f_depid = userInfo.f_depid
-    res.t_userfiles.f_depname = userInfo.f_depname
-    res.t_userfiles.f_operatorid = userInfo.f_operatorid
-    res.t_userfiles.f_operator = userInfo.f_operator
-    res.t_userfiles.f_workflow_id = this.f_workflow_id
-    res.t_userfiles.f_table_state = '待开通'
-  }
-  let saveData = res
-  if (saveData.t_userfiles.f_gasbrand_id.length > 0) {
-    saveData.t_userfiles.f_gasbrand_id = saveData.t_userfiles.f_gasbrand_id[0]
-  }
-  if (saveData.t_userfiles.f_price_id.length > 0) {
-    saveData.t_userfiles.f_price_id = saveData.t_userfiles.f_price_id[0]
-  }
-  if (model.value === '编辑') {
-    saveData = Object.assign(saveData, {
-      f_operator_record: userInfo.f_operator,
-      f_operatorid_record: userInfo.f_operatorid,
-      f_orgid_record: userInfo.f_orgid,
-      f_orgname_record: userInfo.f_orgname,
-      f_depid_record: userInfo.f_depid,
-      f_depname_record: userInfo.f_depname,
-    })
-  }
-  runLogic('userFIleSaveLogic', saveData, 'af-revenue').then((res) => {
-    showToast('操作成功！')
-    history.back()
-  })
-}
-const isInit = ref(false)
-function init() {
-  if (model.value === '编辑') {
-    runLogic('getFileDetailForEdit', { f_userinfo_id: userinfoid.value }, 'af-revenue').then((res) => {
-      // if (res.t_userfiles.f_gasmodel_id) {
-      //   res.t_userfiles.f_gasmodel_id = 76
-      // }
-      // if (res.t_userfiles.f_price_id) {
-      //   res.t_userfiles.f_price_id = [res.t_userfiles.f_price_id]
-      // }
-      console.log('1111111----,', res)
-      groupFormData.value = res
-      isInit.value = true
-    })
-  }
-}
-onMounted(() => {
-  init()
-})
-</script>
-
-<template>
-  <XFormGroup
-    v-if="isInit"
-    mode="修改"
-    :config-name="configName"
-    :service-name="serviceName"
-    :group-form-data="groupFormData"
-    @submit="submit"
-  />
-</template>
-
-<style scoped lang="less">
-
-</style>