af-mobile-client-vue3 1.3.36 → 1.3.37

package/src/components/data/CardContainer/CardHeader.vue

@@ -1,99 +1,99 @@
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const props = defineProps({
-  title: {
-    type: String,
-    required: true,
-  },
-  icon: {
-    type: String,
-    default: '',
-  },
-  collapsible: {
-    type: Boolean,
-    default: false,
-  },
-  defaultCollapsed: {
-    type: Boolean,
-    default: false,
-  },
-})
-
-const emit = defineEmits(['toggle'])
-
-const isCollapsed = ref(props.defaultCollapsed)
-
-function toggleCollapse() {
-  if (props.collapsible) {
-    isCollapsed.value = !isCollapsed.value
-    emit('toggle', isCollapsed.value)
-  }
-}
-</script>
-
-<template>
-  <div class="card-header" @click="toggleCollapse">
-    <div class="card-header__title">
-      <slot name="icon">
-        <van-icon v-if="icon" class="card-header__icon" :name="icon" />
-      </slot>
-      <h4 class="card-header__text">
-        {{ title }}
-      </h4>
-    </div>
-    <div class="card-header__extra">
-      <slot name="extra" />
-      <van-icon
-        v-if="collapsible"
-        class="card-header__collapse-icon"
-        :name="isCollapsed ? 'arrow-down' : 'arrow-up'"
-      />
-    </div>
-  </div>
-</template>
-
-<style lang="less" scoped>
-.card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 8px;
-  padding-bottom: 6px;
-  border-bottom: 1px solid #f0f0f0;
-
-  &__title {
-    display: flex;
-    align-items: center;
-  }
-
-  &__icon {
-    margin-right: 8px;
-    font-size: 14px;
-    color: #666;
-  }
-
-  &__text {
-    font-size: 14px;
-    font-weight: 600;
-    color: #333;
-    margin: 0;
-  }
-
-  &__extra {
-    display: flex;
-    align-items: center;
-  }
-
-  &__collapse-icon {
-    margin-left: 8px;
-    font-size: 14px;
-    color: #666;
-    cursor: pointer;
-
-    &:hover {
-      color: #333;
-    }
-  }
-}
-</style>
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const props = defineProps({
+  title: {
+    type: String,
+    required: true,
+  },
+  icon: {
+    type: String,
+    default: '',
+  },
+  collapsible: {
+    type: Boolean,
+    default: false,
+  },
+  defaultCollapsed: {
+    type: Boolean,
+    default: false,
+  },
+})
+
+const emit = defineEmits(['toggle'])
+
+const isCollapsed = ref(props.defaultCollapsed)
+
+function toggleCollapse() {
+  if (props.collapsible) {
+    isCollapsed.value = !isCollapsed.value
+    emit('toggle', isCollapsed.value)
+  }
+}
+</script>
+
+<template>
+  <div class="card-header" @click="toggleCollapse">
+    <div class="card-header__title">
+      <slot name="icon">
+        <van-icon v-if="icon" class="card-header__icon" :name="icon" />
+      </slot>
+      <h4 class="card-header__text">
+        {{ title }}
+      </h4>
+    </div>
+    <div class="card-header__extra">
+      <slot name="extra" />
+      <van-icon
+        v-if="collapsible"
+        class="card-header__collapse-icon"
+        :name="isCollapsed ? 'arrow-down' : 'arrow-up'"
+      />
+    </div>
+  </div>
+</template>
+
+<style lang="less" scoped>
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 8px;
+  padding-bottom: 6px;
+  border-bottom: 1px solid #f0f0f0;
+
+  &__title {
+    display: flex;
+    align-items: center;
+  }
+
+  &__icon {
+    margin-right: 8px;
+    font-size: 14px;
+    color: #666;
+  }
+
+  &__text {
+    font-size: 14px;
+    font-weight: 600;
+    color: #333;
+    margin: 0;
+  }
+
+  &__extra {
+    display: flex;
+    align-items: center;
+  }
+
+  &__collapse-icon {
+    margin-left: 8px;
+    font-size: 14px;
+    color: #666;
+    cursor: pointer;
+
+    &:hover {
+      color: #333;
+    }
+  }
+}
+</style>

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

@@ -1,132 +1,132 @@
-<script setup lang="ts">
-import type { PropType } from 'vue'
-
-export interface ConfigItem {
-  label: string
-  field: string
-  full?: boolean
-  format?: (value: string | number) => string
-  template?: string
-  condition?: (data: any) => boolean
-}
-
-const props = defineProps({
-  config: {
-    type: Array as PropType<ConfigItem[]>,
-    required: true,
-  },
-  data: {
-    type: Object,
-    default: () => ({}),
-  },
-  singleColumn: {
-    type: Boolean,
-    default: false,
-  },
-})
-
-// 模板解析函数
-function parseTemplate(template: string, data: Record<string, any>, fieldValue: any): string {
-  return template.replace(/\{(\w+)\}/g, (match, key) => {
-    switch (key) {
-      case 'value':
-        return fieldValue ?? '--'
-      default:
-        // 支持其他字段引用，如 {f_user_name}
-        return data[key] ?? match
-    }
-  })
-}
-
-// 获取显示值的函数
-function getDisplayValue(item: ConfigItem, data: Record<string, any>): string {
-  const fieldValue = data[item.field]
-
-  // 优先使用 template
-  if (item.template) {
-    return parseTemplate(item.template, data, fieldValue)
-  }
-
-  // 其次使用 format 函数
-  if (item.format) {
-    return item.format(fieldValue)
-  }
-
-  // 最后使用原始值
-  return fieldValue ?? '--'
-}
-</script>
-
-<template>
-  <div class="info-grid" :class="{ 'info-grid--single-column': singleColumn }">
-    <div
-      v-for="item in props.config.filter(item => item.condition ? item.condition(props.data) : true)"
-      :key="item.label"
-      class="info-item"
-      :class="[
-        item.full ? 'info-item--full' : '',
-      ]"
-    >
-      <p class="info-label">
-        {{ item.label }}
-      </p>
-      <p class="info-value">
-        {{ getDisplayValue(item, props.data) }}
-      </p>
-    </div>
-  </div>
-</template>
-
-<style lang="less" scoped>
-.info-grid {
-  display: grid;
-  gap: 12px;
-  width: 100%;
-
-  // 默认移动端一行两列
-  grid-template-columns: repeat(2, 1fr);
-
-  // 单列模式
-  &--single-column {
-    grid-template-columns: 1fr;
-  }
-
-  // 平板及以上屏幕展示两列
-  @media (min-width: 600px) {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  // 桌面屏幕及以上展示三列
-  @media (min-width: 960px) {
-    grid-template-columns: repeat(3, 1fr);
-
-    &--single-column {
-      grid-template-columns: 1fr;
-    }
-  }
-}
-
-.info-item {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-
-  &--full {
-    grid-column: 1 / -1;
-  }
-}
-
-.info-label {
-  font-size: 14px;
-  color: #666;
-  margin: 0;
-}
-
-.info-value {
-  font-size: 14px;
-  color: #333;
-  margin: 0;
-  font-weight: 600;
-  word-break: break-all;
-}
-</style>
+<script setup lang="ts">
+import type { PropType } from 'vue'
+
+export interface ConfigItem {
+  label: string
+  field: string
+  full?: boolean
+  format?: (value: string | number) => string
+  template?: string
+  condition?: (data: any) => boolean
+}
+
+const props = defineProps({
+  config: {
+    type: Array as PropType<ConfigItem[]>,
+    required: true,
+  },
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+  singleColumn: {
+    type: Boolean,
+    default: false,
+  },
+})
+
+// 模板解析函数
+function parseTemplate(template: string, data: Record<string, any>, fieldValue: any): string {
+  return template.replace(/\{(\w+)\}/g, (match, key) => {
+    switch (key) {
+      case 'value':
+        return fieldValue ?? '--'
+      default:
+        // 支持其他字段引用，如 {f_user_name}
+        return data[key] ?? match
+    }
+  })
+}
+
+// 获取显示值的函数
+function getDisplayValue(item: ConfigItem, data: Record<string, any>): string {
+  const fieldValue = data[item.field]
+
+  // 优先使用 template
+  if (item.template) {
+    return parseTemplate(item.template, data, fieldValue)
+  }
+
+  // 其次使用 format 函数
+  if (item.format) {
+    return item.format(fieldValue)
+  }
+
+  // 最后使用原始值
+  return fieldValue ?? '--'
+}
+</script>
+
+<template>
+  <div class="info-grid" :class="{ 'info-grid--single-column': singleColumn }">
+    <div
+      v-for="item in props.config.filter(item => item.condition ? item.condition(props.data) : true)"
+      :key="item.label"
+      class="info-item"
+      :class="[
+        item.full ? 'info-item--full' : '',
+      ]"
+    >
+      <p class="info-label">
+        {{ item.label }}
+      </p>
+      <p class="info-value">
+        {{ getDisplayValue(item, props.data) }}
+      </p>
+    </div>
+  </div>
+</template>
+
+<style lang="less" scoped>
+.info-grid {
+  display: grid;
+  gap: 12px;
+  width: 100%;
+
+  // 默认移动端一行两列
+  grid-template-columns: repeat(2, 1fr);
+
+  // 单列模式
+  &--single-column {
+    grid-template-columns: 1fr;
+  }
+
+  // 平板及以上屏幕展示两列
+  @media (min-width: 600px) {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
+  // 桌面屏幕及以上展示三列
+  @media (min-width: 960px) {
+    grid-template-columns: repeat(3, 1fr);
+
+    &--single-column {
+      grid-template-columns: 1fr;
+    }
+  }
+}
+
+.info-item {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+
+  &--full {
+    grid-column: 1 / -1;
+  }
+}
+
+.info-label {
+  font-size: 14px;
+  color: #666;
+  margin: 0;
+}
+
+.info-value {
+  font-size: 14px;
+  color: #333;
+  margin: 0;
+  font-weight: 600;
+  word-break: break-all;
+}
+</style>

package/src/components/data/UserDetail/api.ts

@@ -1,24 +1,24 @@
-import type { BaseUser } from './types'
-import { post } from '@af-mobile-client-vue3/services/restTools'
-
-/**
- * 获取用户详情信息（通用接口）
- * 各项目需要在自己的后端实现这个接口
- */
-export function getCacheUserDetail(
-  f_userinfo_id: string,
-): Promise<BaseUser> {
-  return post('/api/af-revenue/logic/mobile_getCacheUserDetail', {
-    f_userinfo_id,
-  })
-}
-
-/**
- * 获取用户最近各种业务的时间（通用接口）
- * 各项目可选实现这个接口
- */
-export function getRecentBusinessTime(
-  f_userinfo_id: string,
-): Promise<Record<string, string>> {
-  return post('/api/af-revenue/logic/mobile_getRecentBusinessTime', { f_userinfo_id })
-}
+import type { BaseUser } from './types'
+import { post } from '@af-mobile-client-vue3/services/restTools'
+
+/**
+ * 获取用户详情信息（通用接口）
+ * 各项目需要在自己的后端实现这个接口
+ */
+export function getCacheUserDetail(
+  f_userinfo_id: string,
+): Promise<BaseUser> {
+  return post('/api/af-revenue/logic/mobile_getCacheUserDetail', {
+    f_userinfo_id,
+  })
+}
+
+/**
+ * 获取用户最近各种业务的时间（通用接口）
+ * 各项目可选实现这个接口
+ */
+export function getRecentBusinessTime(
+  f_userinfo_id: string,
+): Promise<Record<string, string>> {
+  return post('/api/af-revenue/logic/mobile_getRecentBusinessTime', { f_userinfo_id })
+}