af-mobile-client-vue3 1.3.23 → 1.3.25

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

@@ -1,147 +1,129 @@
 <script setup lang="ts">
 import XCellList from '@af-mobile-client-vue3/components/data/XCellList/index.vue'
-import { defineOptions, onActivated, onMounted, ref } from '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'
 
-defineOptions({ name: 'XCellListView' })
-const configName = ref('ApplyMobileProcessCRUD')
-const serviceName = ref('af-apply')
+// 定义事件
+const emit = defineEmits(['deleteRow'])
+
+// 多选操作配置
+const multiSelectActions = ref([
+  { name: '批量审核', key: 'batchAudit', color: '#000000', icon: 'passed' },
+])
+
+const userInfo = useUserStore().getUserInfo()
+// 访问路由
 const router = useRouter()
+// 获取默认值
+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 phone(result) {
-  // todo 调用真机进行通话
+function deleteRow(result) {
+  emit('deleteRow', result.o_id)
 }
-// 跳转流程处理
-function action(row) {
-  router.push({ name: 'XFormGroupView', query: { workflowId: row.ab_f_workflow_id, stepId: row.ws_f_step_id } })
+
+// 多选操作处理
+function handleMultiSelectAction(action: string, selectedItems: any[], selectedItemsArray: any[]) {
+  console.log('多选操作:', action, selectedItems, selectedItemsArray)
 }
-// 工作日志
-function worklog(row) {
-  router.push({ name: 'worklog', query: { workflowid: row.ab_f_workflow_id, defname: row.ws_f_name } })
+
+// 选择变化处理
+function handleSelectionChange(selectedItems: any[]) {
+  console.log('选择变化，当前选中:', selectedItems.length, '个项目')
+  // 可以在这里更新UI状态，比如显示选中数量等
 }
-onMounted(() => {
-  console.log('初始化页面===')
-})
-onActivated(() => {
-  // 每次回到页面都会触发
-  console.log('activated: 每次回到页面都会触发')
-})
 </script>
 
 <template>
-  <XCellList
-    :config-name="configName"
-    :service-name="serviceName"
-    @phone="phone"
-    @action="action"
-    @worklog="worklog"
-  />
+  <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"
+        @to-detail="toDetail"
+        @multi-select-action="handleMultiSelectAction"
+        @selection-change="handleSelectionChange"
+      />
+    </template>
+  </NormalDataLayout>
 </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

@@ -5,31 +5,31 @@ 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('appapplyuserinfoFormGroup')
-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 configName = ref('lngChargeAuditMobileFormGroup')
+const serviceName = ref('af-gaslink')
 
-const formData = ref({ t_userinfo: { f_user_name: 111 } })
+const formData = ref({})
 const formGroup = ref(null)
 const route = useRoute()
 const isInit = ref(false)
 function submit(_result) {
-  showDialog({ message: '提交成功' })
-  history.back()
-}
-const myXForm = ref([])
-function setRef(value: any) {
-  console.log('myXForm', myXForm)
-  formGroup.value.setRef(myXForm.value)
-  console.log(formGroup)
+  showDialog({ message: '提交成功' }).then(() => {
+    console.log('12121')
+    // history.back()
+  })
 }
+
 // 表单组——数据
 // function initComponents () {
 //   runLogic('getlngChargeAuditMobileFormGroupData', {id: 29}, 'af-gaslink').then((res) => {
@@ -59,30 +59,20 @@ function setRef(value: any) {
 // 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="configName"
-        :service-name="serviceName"
+        config-name="ApplyAddContractFormGroup"
+        service-name="af-apply"
         :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/stores/modules/homeApp/README.md

@@ -1,124 +0,0 @@
-# HomeApp Store 使用说明
-
-## 概述
-`useHomeAppStore` 是一个专门用于管理首页应用列表的 Pinia store，与 `useSettingStore` 配合使用。
-
-## 特性
-- 独立管理 `homeAppList` 数据
-- 提供完整的 CRUD 操作
-- 与 setting store 自动同步数据
-- 支持类型安全的 TypeScript 接口
-
-## 基本使用
-
-### 1. 导入和使用
-```typescript
-import { useHomeAppStore } from '@/stores'
-
-const homeAppStore = useHomeAppStore()
-```
-
-### 2. 获取应用列表
-```typescript
-// 获取所有应用
-const apps = homeAppStore.getHomeAppList()
-
-// 直接访问响应式数据
-const apps = homeAppStore.homeAppList
-```
-
-### 3. 添加应用
-```typescript
-homeAppStore.addHomeApp({
-  id: 'new-app',
-  name: '新应用',
-  icon: '/icon.png',
-  url: 'https://example.com',
-  description: '应用描述'
-})
-```
-
-### 4. 更新应用
-```typescript
-homeAppStore.updateHomeApp('app-id', {
-  name: '更新后的名称',
-  description: '新的描述'
-})
-```
-
-### 5. 删除应用
-```typescript
-homeAppStore.removeHomeApp('app-id')
-```
-
-### 6. 清空列表
-```typescript
-homeAppStore.clearHomeAppList()
-```
-
-## 数据同步
-
-### 自动同步
-- 当 `useSettingStore.init()` 被调用时，`homeAppList` 会自动同步到 `useHomeAppStore`
-- 无需手动同步，数据会自动保持一致
-
-### 手动同步
-```typescript
-import { useSettingStore, useHomeAppStore } from '@/stores'
-
-const settingStore = useSettingStore()
-const homeAppStore = useHomeAppStore()
-
-// 手动同步数据
-homeAppStore.setHomeAppList(settingStore.getSetting()?.homeAppList || [])
-```
-
-## 在组件中使用
-
-### Vue 组件示例
-```vue
-<template>
-  <div class="home-apps">
-    <div 
-      v-for="app in homeAppStore.homeAppList" 
-      :key="app.id"
-      class="app-item"
-      @click="openApp(app)"
-    >
-      <img :src="app.icon" :alt="app.name" />
-      <span>{{ app.name }}</span>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useHomeAppStore } from '@/stores'
-
-const homeAppStore = useHomeAppStore()
-
-function openApp(app) {
-  // 处理应用点击
-  window.open(app.url, '_blank')
-}
-</script>
-```
-
-## 注意事项
-
-1. **初始化顺序**：确保先调用 `useSettingStore.init()`，再使用 `useHomeAppStore`
-2. **数据一致性**：两个 store 中的数据会自动保持同步
-3. **类型安全**：使用 TypeScript 接口确保类型安全
-4. **响应式**：所有数据都是响应式的，可以直接在模板中使用
-
-## 接口定义
-
-```typescript
-export interface HomeApp {
-  id: string          // 应用唯一标识
-  name: string        // 应用名称
-  icon: string        // 应用图标
-  url: string         // 应用链接
-  description?: string // 应用描述（可选）
-  [key: string]: any  // 其他属性
-}
-```