af-mobile-client-vue3 1.3.46 → 1.3.48

package/package.json

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

package/src/components/core/XMultiSelect/index.vue

@@ -110,7 +110,7 @@ const resultLabel = computed(() => {
 </script>
 
 <template>
-  <div class="dh-field">
+  <div class="x-multi-select">
     <VanField
       v-model="resultLabel"
       v-bind="$attrs"
@@ -131,7 +131,7 @@ const resultLabel = computed(() => {
           确认
         </button>
       </div>
-      <div style="max-height:264px; overflow-y:auto;">
+      <div class="x-multi-select-content">
         <VanSearch
           v-if="props.isSearch"
           v-model="searchVal"
@@ -139,44 +139,53 @@ const resultLabel = computed(() => {
           @update:model-value="search"
           @cancel="search"
         />
-        <VanCell title="全选">
-          <template #right-icon>
-            <VanCheckbox v-model="checkedAll" name="all" @click="toggleAll" />
-          </template>
-        </VanCell>
-        <VanCheckboxGroup ref="checkboxGroup" v-model="checkboxValue" @change="change">
-          <VanCellGroup>
-            <VanCell
-              v-for="(item, index) in columnsData"
-              :key="item[props.option.value]"
-              :title="item[props.option.text]"
-              clickable
-              @click="toggle(item, index)"
-            >
-              <template #right-icon>
-                <VanCheckbox ref="checkboxes" :name="item[props.option.value]" @click.stop />
-              </template>
-            </VanCell>
-          </VanCellGroup>
-        </VanCheckboxGroup>
+        <div class="x-multi-select-checkbox-group">
+          <VanCell title="全选">
+            <template #right-icon>
+              <VanCheckbox v-model="checkedAll" name="all" @click="toggleAll" />
+            </template>
+          </VanCell>
+          <VanCheckboxGroup ref="checkboxGroup" v-model="checkboxValue" @change="change">
+            <VanCellGroup>
+              <VanCell
+                v-for="(item, index) in columnsData"
+                :key="item[props.option.value]"
+                :title="item[props.option.text]"
+                clickable
+                @click="toggle(item, index)"
+              >
+                <template #right-icon>
+                  <VanCheckbox ref="checkboxes" :name="item[props.option.value]" @click.stop />
+                </template>
+              </VanCell>
+            </VanCellGroup>
+          </VanCheckboxGroup>
+        </div>
       </div>
     </VanPopup>
   </div>
 </template>
 
 <style lang="less" scoped>
-.dh-field {
+.x-multi-select {
   width: 100%;
   padding: 0;
   background: #fff;
   .dh-cell.van-cell {
-    padding: 10px 0;
+    padding: 10px 16px;
   }
   .dh-cell.van-cell--required::before {
     left: -8px;
   }
-  .van-popup {
-    border-radius: 20px 20px 0 0;
+  .x-multi-select-content {
+    max-height: 264px;
+    overflow-y: auto;
+    .x-multi-select-checkbox-group {
+      padding: 0 16px;
+    }
   }
+  //.van-popup {
+  //  border-radius: 20px 20px 0 0;
+  //}
 }
 </style>

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

@@ -94,9 +94,15 @@ function removeRef(refValue: XFormLike) {
 
 async function submit() {
   console.log(props.groupFormData)
+  await getGroupFormData()
+  emit('submit', formData.value)
+}
+async function getGroupFormData(isValidate = true) {
   for (const res of xFormListRef.value) {
     try {
-      await res.validate()
+      if (isValidate) {
+        await res.validate()
+      }
       if (res.formGroupName && typeof res.getFormData === 'function') {
         formData.value[res.formGroupName] = res.getFormData()
       }
@@ -106,7 +112,7 @@ async function submit() {
       return
     }
   }
-  emit('submit', formData.value)
+  return formData.value
 }
 function emitFunc(func: any, data: any, value: any) {
   emit(func, data, value)
@@ -120,7 +126,7 @@ onMounted(() => {
   offsetTop.value = Number.parseInt(navBarHeight, 10) || 60 + 10
 })
 
-defineExpose({ init, removeRef, xFormListRef })
+defineExpose({ init, removeRef, xFormListRef, getGroupFormData })
 </script>
 
 <template>

package/src/router/routes.ts

@@ -155,7 +155,7 @@ const routes: Array<RouteRecordRaw> = [
         component: XFormAppraiseView,
       },
       {
-        path: '/Component/XFormView',
+        path: '/Component/XFormView/:id/:openid',
         name: 'XFormView',
         component: XFormView,
       },

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,19 +1,11 @@
 <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 { useRouter } from 'vue-router'
 
 // 定义事件
 const emit = defineEmits(['deleteRow'])
-
-// 多选操作配置
-const multiSelectActions = ref([
-  { name: '批量审核', key: 'batchAudit', color: '#000000', icon: 'passed' },
-])
-
-const userInfo = useUserStore().getUserInfo()
 // 访问路由
 const router = useRouter()
 // 获取默认值
@@ -56,7 +48,7 @@ const serviceName = ref('af-gaslink')
 // 跳转到表单——以表单组来渲染纯表单
 function toDetail(item) {
   router.push({
-    name: 'XFormView',
+    name: 'XFormGroupView',
     query: {
       id: item[idKey.value],
       // id: item.rr_id,
@@ -95,36 +87,18 @@ function toDetail(item) {
 function deleteRow(result) {
   emit('deleteRow', result.o_id)
 }
-
-// 多选操作处理
-function handleMultiSelectAction(action: string, selectedItems: any[], selectedItemsArray: any[]) {
-  console.log('多选操作:', action, selectedItems, selectedItemsArray)
-}
-
-// 选择变化处理
-function handleSelectionChange(selectedItems: any[]) {
-  console.log('选择变化，当前选中:', selectedItems.length, '个项目')
-  // 可以在这里更新UI状态，比如显示选中数量等
-}
-
-// 数据加载完成后处理 @after-load
-function afterLoad(result) {
-  console.log('afterLoad:', result)
-}
 </script>
 
 <template>
   <NormalDataLayout id="XCellListView" title="工作计划">
     <template #layout_content>
       <XCellList
-        config-name="lngChargeAuditMobileCRUD"
-        service-name="af-gaslink"
-        :enable-multi-select="true"
-        id-key="rr_id"
-        :multi-select-actions="multiSelectActions"
+        :config-name="configName"
+        :service-name="serviceName"
+        :fix-query-form="{ o_f_oper_name: 'edu_test' }"
+        :id-key="idKey"
         @to-detail="toDetail"
-        @multi-select-action="handleMultiSelectAction"
-        @selection-change="handleSelectionChange"
+        @delete-row="deleteRow"
       />
     </template>
   </NormalDataLayout>

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

@@ -5,19 +5,16 @@ 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('form_check_test')
+const serviceName = ref('af-system')
 
 // 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 formGroup = ref(null)
@@ -25,8 +22,7 @@ const route = useRoute()
 const isInit = ref(false)
 function submit(_result) {
   showDialog({ message: '提交成功' }).then(() => {
-    console.log('12121')
-    // history.back()
+    history.back()
   })
 }
 
@@ -67,8 +63,8 @@ function submit(_result) {
       <!--      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"

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

@@ -2,22 +2,11 @@
 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 {
-  Button as VanButton,
-} from 'vant'
 
-const configName = ref('测试Form')
-const serviceName = ref('af-safecheck')
-const formGroupAddConstruction = ref()
+const configName = ref('AddConstructionForm')
+const serviceName = ref('af-linepatrol')
 
-// 提交测试
-function onSubmit(form) {
-  console.log('事件触发提交表单----', form)
-}
-async function onAsyncSubmit() {
-  const res = await formGroupAddConstruction.value.asyncSubmit()
-  console.log('异步提交表单----', res)
-}
+const formGroupAddConstruction = ref(null)
 </script>
 
 <template>
@@ -27,14 +16,10 @@ async function onAsyncSubmit() {
         ref="formGroupAddConstruction"
         mode="新增"
         :config-name="configName"
-        :show-tab-header="false"
-        service-name="af-safecheck"
-        :is-group-form="true"
-        @on-submit="onSubmit"
+        :service-name="serviceName"
       />
     </template>
   </NormalDataLayout>
-  <van-button type="primary" @click="onAsyncSubmit">提交</van-button>
 </template>
 
 <style scoped lang="less">

package/src/views/component/XOlMapView/XLocationPicker/index.vue

@@ -1,118 +1,118 @@
-<script setup lang="ts">
-import type { LocationResult } from '@af-mobile-client-vue3/components/data/XOlMap/types'
-import LocationPicker from '@af-mobile-client-vue3/components/data/XOlMap/XLocationPicker/index.vue'
-import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
-import { showNotify } from 'vant'
-import { ref } from 'vue'
-
-const selectedLocation = ref<LocationResult>()
-
-// 处理位置选择
-function handleLocationConfirm(location: LocationResult) {
-  // console.log('选择的位置:', location)
-  // selectedLocation.value = location
-  showNotify({ type: 'success', message: '位置已选择' })
-}
-</script>
-
-<template>
-  <NormalDataLayout id="XLocationPicker" title="XOlMap地址选择器">
-    <template #layout_content>
-      <div class="location-picker-demo">
-        <!-- 页面标题 -->
-        <div class="page-header">
-          <div class="title">
-            位置选择
-          </div>
-        </div>
-
-        <!-- 选择结果展示 -->
-        <div v-if="selectedLocation" class="location-result">
-          <div class="label">
-            已选位置:
-          </div>
-          <div class="value">
-            {{ selectedLocation.address }}
-          </div>
-          <div class="coordinates">
-            经度: {{ selectedLocation.longitude.toFixed(6) }},
-            纬度: {{ selectedLocation.latitude.toFixed(6) }}
-          </div>
-        </div>
-
-        <!-- 地图组件 -->
-        <div class="map-container">
-          <LocationPicker
-            v-model="selectedLocation"
-            :default-center="[108.948024, 34.263161]"
-            :default-zoom="12"
-            @confirm="handleLocationConfirm"
-          />
-        </div>
-      </div>
-    </template>
-  </NormalDataLayout>
-</template>
-
-<style scoped lang="less">
-.location-picker-demo {
-  width: 100%;
-  height: 100%;
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  background-color: #f7f8fa;
-}
-
-.page-header {
-  height: 44px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: white;
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
-  position: relative;
-  z-index: 1;
-
-  .title {
-    font-size: 16px;
-    color: #333;
-    font-weight: 500;
-  }
-}
-
-.location-result {
-  background: white;
-  padding: 12px 16px;
-  margin: 10px;
-  border-radius: 8px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
-
-  .label {
-    font-size: 14px;
-    color: #666;
-    margin-bottom: 4px;
-  }
-
-  .value {
-    font-size: 16px;
-    color: #333;
-    margin-bottom: 8px;
-    word-break: break-all;
-  }
-
-  .coordinates {
-    font-size: 12px;
-    color: #999;
-  }
-}
-
-.map-container {
-  flex: 1;
-  position: relative;
-  margin: 0 10px 10px 10px;
-  border-radius: 8px;
-  overflow: hidden;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-}
-</style>
+<script setup lang="ts">
+import type { LocationResult } from '@af-mobile-client-vue3/components/data/XOlMap/types'
+import LocationPicker from '@af-mobile-client-vue3/components/data/XOlMap/XLocationPicker/index.vue'
+import NormalDataLayout from '@af-mobile-client-vue3/components/layout/NormalDataLayout/index.vue'
+import { showNotify } from 'vant'
+import { ref } from 'vue'
+
+const selectedLocation = ref<LocationResult>()
+
+// 处理位置选择
+function handleLocationConfirm(location: LocationResult) {
+  // console.log('选择的位置:', location)
+  // selectedLocation.value = location
+  showNotify({ type: 'success', message: '位置已选择' })
+}
+</script>
+
+<template>
+  <NormalDataLayout id="XLocationPicker" title="XOlMap地址选择器">
+    <template #layout_content>
+      <div class="location-picker-demo">
+        <!-- 页面标题 -->
+        <div class="page-header">
+          <div class="title">
+            位置选择
+          </div>
+        </div>
+
+        <!-- 选择结果展示 -->
+        <div v-if="selectedLocation" class="location-result">
+          <div class="label">
+            已选位置:
+          </div>
+          <div class="value">
+            {{ selectedLocation.address }}
+          </div>
+          <div class="coordinates">
+            经度: {{ selectedLocation.longitude.toFixed(6) }},
+            纬度: {{ selectedLocation.latitude.toFixed(6) }}
+          </div>
+        </div>
+
+        <!-- 地图组件 -->
+        <div class="map-container">
+          <LocationPicker
+            v-model="selectedLocation"
+            :default-center="[108.948024, 34.263161]"
+            :default-zoom="12"
+            @confirm="handleLocationConfirm"
+          />
+        </div>
+      </div>
+    </template>
+  </NormalDataLayout>
+</template>
+
+<style scoped lang="less">
+.location-picker-demo {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  background-color: #f7f8fa;
+}
+
+.page-header {
+  height: 44px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: white;
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
+  position: relative;
+  z-index: 1;
+
+  .title {
+    font-size: 16px;
+    color: #333;
+    font-weight: 500;
+  }
+}
+
+.location-result {
+  background: white;
+  padding: 12px 16px;
+  margin: 10px;
+  border-radius: 8px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+
+  .label {
+    font-size: 14px;
+    color: #666;
+    margin-bottom: 4px;
+  }
+
+  .value {
+    font-size: 16px;
+    color: #333;
+    margin-bottom: 8px;
+    word-break: break-all;
+  }
+
+  .coordinates {
+    font-size: 12px;
+    color: #999;
+  }
+}
+
+.map-container {
+  flex: 1;
+  position: relative;
+  margin: 0 10px 10px 10px;
+  border-radius: 8px;
+  overflow: hidden;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+}
+</style>