af-mobile-client-vue3 1.2.27 → 1.2.29

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

@@ -1,11 +1,11 @@
 <script setup lang="ts">
 import Uploader from '@af-mobile-client-vue3/components/core/Uploader/index.vue'
+import DateTimeSecondsPicker from '@af-mobile-client-vue3/components/data/XReportForm/DateTimeSecondsPicker.vue'
 import XReportFormJsonRender from '@af-mobile-client-vue3/components/data/XReportForm/XReportFormJsonRender.vue'
 import XSignature from '@af-mobile-client-vue3/components/data/XSignature/index.vue'
 import { getConfigByNameWithoutIndexedDB } from '@af-mobile-client-vue3/services/api/common'
 import {
   showFailToast,
-  Toast,
   Button as vanButton,
   Cell as vanCell,
   CellGroup as vanCellGroup,
@@ -17,9 +17,7 @@ import {
   Skeleton as vanSkeleton,
 } from 'vant'
 import { defineEmits, nextTick, reactive, ref, watch } from 'vue'
-// https://calendar.hxkj.vip/
-import VueHashCalendar from 'vue3-hash-calendar'
-import 'vue3-hash-calendar/es/index.css'
+// 移除 VueHashCalendar，使用自定义的 DateTimeSecondsPicker
 
 // -------------------------  类型定义  -------------------------
 interface configDefine {
@@ -66,12 +64,6 @@ let timer: NodeJS.Timeout
 const scanFinish = ref(false)
 // 折叠面板当前激活的值
 const activeCollapseName = ref('副标题')
-// 日期选择器显示状态
-const showDatePicker = ref(false)
-const showTimePicker = ref(false)
-// 当前操作的日期时间字段
-const currentDateField = ref('')
-const currentTimeField = ref('')
 
 watch(() => props.configName, () => {
   // 这里是你的处理逻辑
@@ -128,6 +120,8 @@ function generateDefaultRequiredMessage(field: any): string {
       return `请选择${label || '日期'}`
     case 'timePicker':
       return `请选择${label || '时间'}`
+    case 'dateTimeSecondsPicker':
+      return `请选择${label || '完整时间'}`
     case 'curDateInput':
       return `请设置${label || '时间'}`
     case 'signature':
@@ -564,6 +558,12 @@ function formatConfigToForm(config: configDefine): void {
           tempObj.type = 'timePicker'
           tempObj.required = row[j].required
           break
+        case 'dateTimeSecondsPicker' :
+          tempObj.dataIndex = row[j].dataIndex
+          tempObj.text = row[j].text
+          tempObj.type = 'dateTimeSecondsPicker'
+          tempObj.required = row[j].required
+          break
         case 'signature' :
           tempObj.dataIndex = row[j].dataIndex
           tempObj.text = row[j].text
@@ -855,45 +855,7 @@ function getNow() {
   return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
 }
 
-// 打开日期选择器
-function openDatePicker(dataIndex: string) {
-  console.log('打开日期选择器:', dataIndex)
-  currentDateField.value = dataIndex
-  showDatePicker.value = true
-  console.log('日期选择器状态:', showDatePicker.value)
-}
-
-// 打开时间选择器
-function openTimePicker(dataIndex: string) {
-  console.log('打开时间选择器:', dataIndex)
-  currentTimeField.value = dataIndex
-  showTimePicker.value = true
-  console.log('时间选择器状态:', showTimePicker.value)
-}
-
-// 确认选择日期
-function onConfirmDate(value: any) {
-  console.log('onConfirmDate', value)
-  activatedConfig.data[currentDateField.value] = value
-  showDatePicker.value = false
-  currentDateField.value = ''
-}
-
-// 确认选择时间
-function onConfirmTime(value: any) {
-  console.log('onConfirmTime', value)
-  activatedConfig.data[currentTimeField.value] = value
-  showTimePicker.value = false
-  currentTimeField.value = ''
-}
-
-// 取消选择
-function onCancelPicker() {
-  showDatePicker.value = false
-  showTimePicker.value = false
-  currentDateField.value = ''
-  currentTimeField.value = ''
-}
+// 移除了旧的日期时间选择器相关方法，现在使用 DateTimeSecondsPicker 组件
 </script>
 
 <template>
@@ -913,46 +875,46 @@ function onCancelPicker() {
       <!--  标题  -->
       <h2 v-if="activatedConfig.title" class="title" v-html="activatedConfig.title" />
       <!--  副标题  -->
-      <div v-if="activatedConfig.subTitle && activatedConfig.subTitle.length > 0" class="form_item">
-        <van-collapse v-model="activeCollapseName" accordion>
-          <van-collapse-item title="副标题" name="副标题">
-            <van-form>
-              <van-cell-group inset>
-                <template v-for="(subCell, cellIndex) in activatedConfig.subTitle" :key="cellIndex">
-                  <template v-if="subCell.type === 'inputs'">
-                    <template v-for="(item, itemIndex) in formatInputs(subCell)" :key="itemIndex">
-                      <van-field
-                        v-model="activatedConfig.data[subCell.dataIndex][itemIndex]"
-                        :label="`${item}:`"
-                        clearable
-                        type="textarea"
-                        rows="1"
-                        autosize
-                        :placeholder="`请输入${item}`"
-                      />
-                    </template>
-                  </template>
-                  <template v-else>
-                    <van-field
-                      v-model="activatedConfig.data[subCell.dataIndex]"
-                      :label="`${subCell.format}:`"
-                      clearable
-                      type="textarea"
-                      rows="1"
-                      autosize
-                      :placeholder="`请输入${subCell.format}`"
-                    />
-                  </template>
-                </template>
-              </van-cell-group>
-            </van-form>
-          </van-collapse-item>
-        </van-collapse>
-      </div>
+      <!--      <div v-if="activatedConfig.subTitle && activatedConfig.subTitle.length > 0" class="form_item"> -->
+      <!--        <van-collapse v-model="activeCollapseName" accordion> -->
+      <!--          <van-collapse-item title="副标题" name="副标题"> -->
+      <!--            <van-form> -->
+      <!--              <van-cell-group inset> -->
+      <!--                <template v-for="(subCell, cellIndex) in activatedConfig.subTitle" :key="cellIndex"> -->
+      <!--                  <template v-if="subCell.type === 'inputs'"> -->
+      <!--                    <template v-for="(item, itemIndex) in formatInputs(subCell)" :key="itemIndex"> -->
+      <!--                      <van-field -->
+      <!--                        v-model="activatedConfig.data[subCell.dataIndex][itemIndex]" -->
+      <!--                        :label="`${item}:`" -->
+      <!--                        clearable -->
+      <!--                        type="textarea" -->
+      <!--                        rows="1" -->
+      <!--                        autosize -->
+      <!--                        :placeholder="`请输入${item}`" -->
+      <!--                      /> -->
+      <!--                    </template> -->
+      <!--                  </template> -->
+      <!--                  <template v-else> -->
+      <!--                    <van-field -->
+      <!--                      v-model="activatedConfig.data[subCell.dataIndex]" -->
+      <!--                      :label="`${subCell.format}:`" -->
+      <!--                      clearable -->
+      <!--                      type="textarea" -->
+      <!--                      rows="1" -->
+      <!--                      autosize -->
+      <!--                      :placeholder="`请输入${subCell.format}`" -->
+      <!--                    /> -->
+      <!--                  </template> -->
+      <!--                </template> -->
+      <!--              </van-cell-group> -->
+      <!--            </van-form> -->
+      <!--          </van-collapse-item> -->
+      <!--        </van-collapse> -->
+      <!--      </div> -->
       <!--  表单项  -->
       <div class="form_item">
         <van-collapse v-model="activeCollapseName" accordion>
-          <van-collapse-item title="表单项" name="表单项">
+          <van-collapse-item title="操作卡内容" name="操作卡内容">
             <van-form>
               <template v-for="(row, index) in activatedConfig.columns" :key="index">
                 <!--     value属性      -->
@@ -1020,7 +982,7 @@ function onCancelPicker() {
                         {{ row.valueText || '当前时间' }}
                       </div>
                       <div class="cur-date-input-value">
-                        {{ activatedConfig.data[row.dataIndex] || '未设置' }}
+                        {{ activatedConfig.data[row.dataIndex] || '未操作' }}
                       </div>
                     </div>
                     <div class="cur-date-input-action">
@@ -1058,22 +1020,32 @@ function onCancelPicker() {
                 </van-cell-group>
                 <!--     datePicker      -->
                 <van-cell-group v-else-if="row.type === 'datePicker'" inset :title="row.label" :class="{ 'required-field': row.required }">
-                  <van-field
+                  <DateTimeSecondsPicker
                     v-model="activatedConfig.data[row.dataIndex]"
                     :label="`${row.label || '日期'}:`"
                     placeholder="请选择日期"
-                    readonly
-                    @click="openDatePicker(row.dataIndex)"
+                    title="选择日期"
+                    format="YYYY-MM-DD"
                   />
                 </van-cell-group>
                 <!--     timePicker      -->
                 <van-cell-group v-else-if="row.type === 'timePicker'" inset :title="row.label" :class="{ 'required-field': row.required }">
-                  <van-field
+                  <DateTimeSecondsPicker
                     v-model="activatedConfig.data[row.dataIndex]"
                     :label="`${row.label || '时间'}:`"
                     placeholder="请选择时间"
-                    readonly
-                    @click="openTimePicker(row.dataIndex)"
+                    title="选择时间"
+                    format="YYYY-MM-DD HH:mm:ss"
+                  />
+                </van-cell-group>
+                <!--     dateTimeSecondsPicker      -->
+                <van-cell-group v-else-if="row.type === 'dateTimeSecondsPicker'" inset :title="row.label" :class="{ 'required-field': row.required }">
+                  <DateTimeSecondsPicker
+                    v-model="activatedConfig.data[row.dataIndex]"
+                    :label="`${row.label || '完整时间'}:`"
+                    placeholder="请选择完整时间"
+                    title="选择完整时间"
+                    format="YYYY-MM-DD HH:mm:ss"
                   />
                 </van-cell-group>
                 <!--     inputs      -->
@@ -1235,31 +1207,29 @@ function onCancelPicker() {
     <van-skeleton title :row="5" />
   </div>
 
-  <!-- 日期选择器弹窗 -->
-  <VueHashCalendar v-model:visible="showDatePicker" format="YY-MM-DD" model="dialog" picker-type="date" @confirm="onConfirmDate" />
-  <VueHashCalendar v-model:visible="showTimePicker" format="YY-MM-DD hh:mm:ss" picker-type="datetime" model="dialog" @confirm="onConfirmTime" />
+  <!-- 已移除 VueHashCalendar，现在使用内置的 DateTimeSecondsPicker 组件 -->
 </template>
 
 <style scoped lang="less">
-.main{
+.main {
   padding-top: 4vh;
   width: 100vw;
   height: 100vh;
   background-color: #eff2f5;
 
-  .title{
+  .title {
     padding-bottom: 2vh;
     color: rgb(50, 50, 51);
     text-align: center;
     margin: 0 0 3vh;
   }
 
-  .text_box{
+  .text_box {
     margin-top: 2vh;
     margin-bottom: 2vh;
   }
 
-  .main_text{
+  .main_text {
     padding-left: 16px;
     font-weight: 400;
     line-height: 1.6;
@@ -1268,53 +1238,53 @@ function onCancelPicker() {
     font-size: 14px;
   }
 
-  .show_value_item{
+  .show_value_item {
     text-align: center;
     font-size: 1.2em;
   }
 
-  .cell_group{
+  .cell_group {
     //margin-top: 2vh;
     //margin-bottom: 2vh;
   }
 
-  .form_item{
+  .form_item {
     margin-top: 2vh;
   }
 
-  .button_group{
+  .button_group {
     text-align: center;
     margin-top: 3vh;
     margin-bottom: 3vh;
   }
 
-  .button_group>:first-child {
+  .button_group > :first-child {
     margin-right: 3vw;
   }
 
-  .divider{
+  .divider {
     color: #1989fa;
     border-color: #1989fa;
-    padding: 0 16px
+    padding: 0 16px;
   }
 
-  .submit_button{
+  .submit_button {
     background-color: #eff2f5;
     padding: 5vh;
   }
 }
 
-.skeleton{
-  margin-top: 5vh
+.skeleton {
+  margin-top: 5vh;
 }
-.my-cell-group{
-  margin: 0 0 10px 0
+.my-cell-group {
+  margin: 0 0 10px 0;
 }
 :deep(.van-collapse-item__content) {
   background-color: #eff2f5;
   padding: 10px 0;
 }
-:deep(.van-cell-group__title){
+:deep(.van-cell-group__title) {
   padding-top: 10px;
   padding-bottom: 10px;
 }
@@ -1325,7 +1295,7 @@ function onCancelPicker() {
 // 必填字段星号样式 - 只对星号生效
 :deep(.van-field__label) {
   // 将包含星号的文本进行特殊处理
-  &[style*="color"] {
+  &[style*='color'] {
     color: #323233 !important;
   }
 }
@@ -1340,7 +1310,7 @@ function onCancelPicker() {
     margin-right: 2px;
   }
 }
-:deep(.van-uploader__wrapper){
+:deep(.van-uploader__wrapper) {
   padding: 10px;
   display: flex;
   flex-wrap: wrap;
@@ -1371,7 +1341,7 @@ function onCancelPicker() {
       word-wrap: break-word;
       white-space: normal;
       display: -webkit-box;
-      -webkit-line-clamp: 2; // 最多显示2行
+      -webkit-line-clamp: 4; // 最多显示2行
       -webkit-box-orient: vertical;
       overflow: hidden;
     }

package/src/styles/app.less

@@ -29,3 +29,8 @@ html.dark {
 .van-tabbar--fixed {
   position: fixed !important;
 }
+
+// 所有按钮 添加圆角
+.van-button {
+  border-radius: 10px !important;
+}

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

@@ -1,28 +1,107 @@
 <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 { defineEmits, ref } from 'vue'
 import { useRouter } from 'vue-router'
 
-const emit = defineEmits(['addressSelected'])
+// 定义事件
+const emit = defineEmits(['deleteRow'])
+// 访问路由
 const router = useRouter()
-const configName = ref('userfiles_sel_address')
-const xCellListRefPatrolPlan = ref()
-// 详情
-function toDetail(row) {
-  emit('addressSelected', {
-    f_address: row.tua_f_address,
-    f_address_id: row.tua_id,
+// 获取默认值
+const idKey = ref('o_id')
+
+// 简易crud表单测试
+const configName = ref('lngChargeAuditMobileCRUD')
+const serviceName = ref('af-gaslink')
+
+// 资源权限测试
+// 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: 'XFormGroupView',
+    query: {
+      id: item[idKey.value],
+      // id: item.rr_id,
+      // o_id: item.o_id,
+    },
   })
 }
+
+// 新增功能
+// function addOption(totalCount) {
+//   router.push({
+//     name: 'XFormView',
+//     params: { id: totalCount, openid: totalCount },
+//     query: {
+//       configName: configName.value,
+//       serviceName: serviceName.value,
+//       mode: '新增',
+//     },
+//   })
+// }
+
+// 修改功能
+// function updateRow(result) {
+//   router.push({
+//     name: 'XFormView',
+//     params: { id: result.o_id, openid: result.o_id },
+//     query: {
+//       configName: configName.value,
+//       serviceName: serviceName.value,
+//       mode: '修改',
+//     },
+//   })
+// }
+
+// 删除功能
+function deleteRow(result) {
+  emit('deleteRow', result.o_id)
+}
 </script>
 
 <template>
-  <XCellList
-    ref="xCellListRefPatrolPlan"
-    service-name="af-revenue"
-    :config-name="configName"
-    @to-detail="toDetail"
-  />
+  <NormalDataLayout id="XCellListView" title="工作计划">
+    <template #layout_content>
+      <XCellList
+        :config-name="configName"
+        :service-name="serviceName"
+        :fix-query-form="{ o_f_oper_name: 'edu_test' }"
+        :id-key="idKey"
+        @to-detail="toDetail"
+        @delete-row="deleteRow"
+      />
+    </template>
+  </NormalDataLayout>
 </template>
 
 <style scoped lang="less">

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

@@ -6,8 +6,15 @@ import { ref } from 'vue'
 import { useRoute } from 'vue-router'
 
 // 纯表单
-const configName = ref('ApplyAddContractFormGroup')
-const serviceName = ref('af-apply')
+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 formData = ref({})
 const formGroup = ref(null)
@@ -18,6 +25,36 @@ function submit(_result) {
     history.back()
   })
 }
+
+// 表单组——数据
+// function initComponents () {
+//   runLogic('getlngChargeAuditMobileFormGroupData', {id: 29}, 'af-gaslink').then((res) => {
+//     formData.value = {...res}
+//   })
+// }
+
+// 纯表单——数据
+// function initComponents() {
+//   formData.value = { plan_name: 'af-llllll', plan_point: '1号点位', plan_single: '1号点位', plan_range: '2024-12-12' }
+// }
+
+// function initComponents() {
+//   runLogic('getlngChargeAuditMobileFormGroupData', { id: route.query?.id, o_id: route.query?.o_id }, 'af-gaslink').then((res) => {
+//     console.log('res------', res)
+//     formData.value = { ...res }
+// formGroup.value.init({
+//   configName: configName.value,
+//   serviceName: serviceName.value,
+//   groupFormData: { ...res },
+//   mode: "新增"
+// })
+//     isInit.value = true
+//   })
+// }
+
+// onBeforeMount(() => {
+//   initComponents()
+// })
 </script>
 
 <template>

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

@@ -7,21 +7,8 @@ const configName = ref('AddConstructionForm')
 const serviceName = ref('af-linepatrol')
 
 const formGroupAddConstruction = ref(null)
-function emitFunc(func, data) {
-  console.log('>>>> func: ', func)
-  console.log('>>>> data: ', data)
-  if (func === 'selectAddress') {
-    const add = 'ccss'
-    // 设置单个字段
-    formGroupAddConstruction.value?.setForm({ address: '你的字符串' })
-  }
-}
-function submit(data) {
-  console.log('>>>> data: ', JSON.stringify(data))
-}
 </script>
 
-<!-- workflowId -->
 <template>
   <NormalDataLayout id="XFormGroupView" title="纯表单">
     <template #layout_content>
@@ -30,10 +17,6 @@ function submit(data) {
         mode="新增"
         :config-name="configName"
         :service-name="serviceName"
-        :param-logic-name-param="{ aa: 123 }"
-        :form-data="{ f_project_name: 333 }"
-        @x-form-item-emit-func="emitFunc"
-        @on-submit="submit"
       />
     </template>
   </NormalDataLayout>