vue2-client 1.12.72 → 1.12.74

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue2-client",
-  "version": "1.12.72",
+  "version": "1.12.74",
   "private": false,
   "scripts": {
     "serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint",
@@ -34,6 +34,7 @@
     "core-js": "^3.33.0",
     "crypto-js": "^4.1.1",
     "date-fns": "^2.29.3",
+    "dayjs": "^1.11.13",
     "default-passive-events": "^2.0.0",
     "dotenv": "^16.3.1",
     "echarts": "^5.5.0",
@@ -72,12 +73,12 @@
     "@babel/core": "^7.22.20",
     "@babel/eslint-parser": "^7.22.15",
     "@babel/preset-env": "^7.22.20",
+    "@jest/globals": "^29.7.0",
     "@vue/cli-plugin-babel": "^5.0.8",
     "@vue/cli-plugin-eslint": "^5.0.8",
     "@vue/cli-service": "^5.0.8",
     "@vue/eslint-config-standard": "^8.0.1",
     "@vue/test-utils": "^1.3.6",
-    "@jest/globals": "^29.7.0",
     "babel-plugin-transform-remove-console": "^6.9.4",
     "compression-webpack-plugin": "^10.0.0",
     "css-minimizer-webpack-plugin": "^5.0.1",

package/src/base-client/components/common/XCollapse/XCollapse.vue

@@ -10,7 +10,6 @@
         :show-arrow="false"
       >
         <template #header>
-          <a-button @click="handleClick">666</a-button>
           <div class="header-content">
             <span
               class="header-text"
@@ -42,7 +41,7 @@
             <a-input-search
               v-if="panel.search"
               v-model="searchText[panelIndex]"
-              placeholder="请输入搜索内容"
+              placeholder="panel.searchPlace"
               class="search-input"
               @search="(value) => onSearch(value, panelIndex)"
               @click.stop
@@ -61,7 +60,6 @@
             :show-img-in-cell="true"
             :display-only="true"
             :edit-mode="false"
-            :parentContext="parentContext"
             :show-save-button="false"
             :no-padding="true"
             :dont-format="true">
@@ -87,8 +85,7 @@ export default {
       activeKey: [],
       config: {},
       configName: '',
-      searchText: {},
-      parentContext: null
+      searchText: {}
     }
   },
   props: {
@@ -118,10 +115,6 @@ export default {
     window.removeEventListener('setItem', this.handleStorageChange)
   },
   methods: {
-    handleClick () {
-      console.log('xc按钮被点击了！')
-      console.warn(this.getComponentByName)
-    },
     handleStorageChange (e) {
       console.log('监听到sessionStorage的变化：', e)
       if (e.key === 'klcf_id') {

package/src/base-client/components/common/XReportGrid/XReportTrGroup.vue

@@ -25,7 +25,7 @@
           </template>
           <template v-else-if="cell.type === 'slot'">
             <template
-              v-if="['x-form-table','x-add-native-form','x-tree-pro', 'x-his-editor', 'x-tab', 'x-form-group', 'x-report', 'x-buttons', 'x-label-select', 'x-conversation', 'x-check-list', 'x-cardSet', 'x-collapse','x-h-descriptions', 'x-sidebar', 'x-list','x-input'].includes(cell.slotType)">
+              v-if="['x-form-table','x-add-native-form','x-tree-pro', 'x-his-editor', 'x-tab', 'x-form-group', 'x-report', 'x-buttons', 'x-label-select', 'x-conversation', 'x-check-list', 'x-cardSet', 'x-collapse','x-h-descriptions', 'x-sidebar', 'x-list','x-input','x-time-line'].includes(cell.slotType)">
               <component
                 :is="getComponentName(cell.slotConfig, cell.serviceName, cell.slotType)"
                 :key="cellIndex"
@@ -60,7 +60,7 @@
           </template>
           <template v-else-if="cell.type === 'slot'">
             <template
-              v-if="['x-form-table','x-add-native-form','x-tree-pro', 'x-his-editor', 'x-tab', 'x-form-group', 'x-report', 'x-buttons', 'x-label-select', 'x-conversation', 'x-check-list', 'x-cardSet', 'x-collapse', 'x-h-descriptions', 'x-sidebar', 'x-list','x-input'].includes(cell.slotType)">
+              v-if="['x-form-table','x-add-native-form','x-tree-pro', 'x-his-editor', 'x-tab', 'x-form-group', 'x-report', 'x-buttons', 'x-label-select', 'x-conversation', 'x-check-list', 'x-cardSet', 'x-collapse', 'x-h-descriptions', 'x-sidebar', 'x-list','x-input','x-time-line'].includes(cell.slotType)">
               <component
                 :is="getComponentName(cell.slotConfig, cell.serviceName, cell.slotType)"
                 :key="cellIndex"
@@ -110,6 +110,7 @@ export default {
     XSidebar: () => import('@vue2-client/base-client/components/his/XSidebar/XSidebar.vue'),
     XList: () => import('@vue2-client/base-client/components/his/XList/XList.vue'),
     XInput: () => import('@vue2-client/base-client/components/common/XInput/XInput.vue'),
+    XTimeline: () => import('@vue2-client/base-client/components/common/XTimeline/XTimeline.vue'),
   },
   props: {
     // 每一行的配置

package/src/base-client/components/common/XTimeline/XTimeline.vue

@@ -0,0 +1,354 @@
+<template>
+  <!-- 时间轴主容器 -->
+  <div class='x-timeline'>
+    <!-- 时间轴导航栏 -->
+    <div class='x-timeline-nav'>
+      <!-- 导航按钮：前一周、前一天 -->
+      <a-button type="link" @click='goToPrevWeek'>
+        <a-icon type="double-left" />
+        {{ config?.prevWeekText || '前一周' }}
+      </a-button>
+      <a-button type="link" @click='goToPrevDay'>
+        <a-icon type="left" />
+        {{ config?.prevDayText || '前一天' }}
+      </a-button>
+      <!-- 日期显示区域 -->
+      <div class='timeline-dates'>
+        <div v-for='(date, index) in displayDates'
+             :key='index'
+          class='date-item'
+          :class='{
+            "ant-btn-primary": isCurrentDate(date),
+            "date-weekend": isWeekend(date),
+            "ant-btn-disabled": isDisabled(date)
+          }'
+          @click='selectDate(date)'
+        >
+          <div class='weekday'>{{ getWeekDay(date) }}</div>
+          <div class='date'>{{ formatDate(date) }}</div>
+        </div>
+      </div>
+      <!-- 导航按钮：后一天、后一周 -->
+      <a-button type="link" @click='goToNextDay'>
+        {{ config?.nextDayText || '后一天' }}
+        <a-icon type="right" />
+      </a-button>
+      <a-button type="link" @click='goToNextWeek'>
+        {{ config?.nextWeekText || '后一周' }}
+        <a-icon type="double-right" />
+      </a-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import dayjs from 'dayjs'
+import 'dayjs/locale/zh-cn'
+import { getConfigByName, runLogic } from '@vue2-client/services/api/common'
+
+// 设置 dayjs 为中文语言环境
+dayjs.locale('zh-cn')
+
+export default ({
+  name: 'XTimeline',
+  components: {
+  },
+  props: {
+    // 当前选中日期，默认为空（不选中）
+    modelValue: {
+      type: String,
+      default: ''
+    },
+    // 配置参数名称，用于获取时间轴配置
+    queryParamsName: {
+      type: String,
+      default: 'XTimelineExampleConfig'
+    }
+  },
+
+  // 定义组件事件
+  emits: ['update:modelValue', 'change', 'prev-week', 'next-week', 'prev-day', 'next-day'],
+
+  data () {
+    return {
+      currentDate: this.modelValue, // 当前选中日期
+      baseDate: dayjs().format('YYYY-MM-DD'), // 基准日期，默认今天，用于计算显示范围
+      config: {
+        // 基础配置
+        range: null, // 显示的天数范围，默认7天
+        dateFormat: null, // 日期显示格式
+        weekFormat: null, // 星期显示格式
+        // 按钮文字配置
+        prevWeekText: null,
+        nextWeekText: null,
+        prevDayText: null,
+        nextDayText: null,
+        // 周末高亮配置
+        highlightWeekend: true
+      },
+      disabledDates: [] // 禁用日期列表
+    }
+  },
+  computed: {
+    // 计算需要显示的日期范围
+    displayDates () {
+      const dates = []
+      const range = this.config?.range || 7 // 显示天数，默认7天
+      const halfRange = Math.floor(range / 2)
+      let currentDate = dayjs(this.baseDate).subtract(halfRange, 'day')
+      for (let i = 0; i < range; i++) {
+        dates.push(currentDate.format('YYYY-MM-DD'))
+        currentDate = currentDate.add(1, 'day')
+      }
+      return dates
+    }
+  },
+
+  watch: {
+    // 监听外部传入的选中日期变化
+    modelValue: {
+      handler (newVal) {
+        this.currentDate = newVal
+        if (newVal) {
+          this.baseDate = newVal
+        }
+      },
+      immediate: true
+    },
+    // 监听配置参数名称变化
+    queryParamsName: {
+      handler (newValue) {
+        this.getData(newValue)
+      },
+      immediate: true
+    }
+  },
+
+  created () {
+    // 组件创建时获取配置
+    this.getData(this.queryParamsName)
+  },
+
+  methods: {
+    // 获取时间轴配置数据
+    async getData (data) {
+      getConfigByName(data, 'af-his', res => {
+        // var res = {
+        //   // 基础配置
+        //   range: 7, // 显示的天数范围，默认7天
+        //   defaultValue: '', // 默认选中日期，不设置则默认今天
+        //   // 日期格式化
+        //   dateFormat: 'MM/DD', // 日期显示格式，如 03/21
+        //   weekFormat: '周dd', // 星期显示格式，如 周四
+        //   // 按钮文字配置
+        //   prevWeekText: '前一周', // 上一周按钮文字
+        //   nextWeekText: '后一周', // 下一周按钮文字
+        //   prevDayText: '前一天', // 前一天按钮文字
+        //   nextDayText: '后一天', // 后一天按钮文字
+        //   // 日期范围限制
+        //   minDate: '2024-01-01', // 最小可选日期
+        //   maxDate: '2025-12-31', // 最大可选日期
+        //   // 周末高亮配置
+        //   highlightWeekend: true, // 是否高亮周末
+        //   // 业务逻辑配置
+        //   logicName: 'getDisabledDates', // 获取禁用日期的逻辑名称
+        //   parameter: {
+        //     userId: 'xxx',
+        //     type: 'workday'
+        //   }
+        // }
+        this.config = res
+        if (res.defaultValue) {
+          // 如果有默认值，则设置当前选中日期和基准日期
+          this.currentDate = res.defaultValue
+          this.baseDate = res.defaultValue
+          this.$emit('update:modelValue', res.defaultValue)
+        }
+
+        // 执行配置中指定的业务逻辑
+        if (res.logicName) {
+           runLogic(res.logicName, res.parameter, 'af-his').then(result => {
+          // var result = {
+          //   disabledDates: [ // 禁用的日期列表
+          //     '2025-03-23', // 周六
+          //     '2025-03-24', // 周日
+          //     '2025-03-25' // 其他需要禁用的日期
+          //   ],
+          //   currentDate: '' // 指定当前选中日期（可选）
+          // }
+            if (result) {
+              this.handleLogicResult(result)
+            }
+           })
+        }
+       })
+    },
+
+    // 处理业务逻辑返回结果
+    handleLogicResult (result) {
+      if (result.disabledDates) {
+        this.disabledDates = result.disabledDates
+      }
+      if (result.currentDate) {
+        this.currentDate = result.currentDate
+        this.baseDate = result.currentDate
+        this.$emit('update:modelValue', result.currentDate)
+      }
+    },
+
+    // 格式化日期显示
+    formatDate (date) {
+      const format = this.config?.dateFormat || 'MM/DD'
+      return dayjs(date).format(format)
+    },
+
+    // 获取星期显示
+    getWeekDay (date) {
+      const format = this.config?.weekFormat || '周dd'
+      return dayjs(date).format(format)
+    },
+
+    // 判断是否为周末
+    isWeekend (date) {
+      if (!this.config?.highlightWeekend) return false
+      const day = dayjs(date).day()
+      return day === 0 || day === 6
+    },
+
+    // 判断日期是否禁用
+    isDisabled (date) {
+      if (this.config?.minDate && dayjs(date).isBefore(this.config.minDate)) {
+        return true
+      }
+      if (this.config?.maxDate && dayjs(date).isAfter(this.config.maxDate)) {
+        return true
+      }
+      return this.disabledDates.includes(date)
+    },
+
+    // 判断是否为当前选中日期
+    isCurrentDate (date) {
+      if (!this.currentDate) return false
+      return dayjs(date).format('YYYY-MM-DD') === dayjs(this.currentDate).format('YYYY-MM-DD')
+    },
+
+    // 选择日期
+    selectDate (date) {
+      if (this.isDisabled(date)) return
+      this.currentDate = date
+      this.$emit('update:modelValue', date)
+      this.$emit('change', date)
+    },
+
+    // 前一天
+    goToPrevDay () {
+      const newDate = dayjs(this.baseDate).subtract(1, 'day')
+      if (this.config?.minDate && newDate.isBefore(this.config.minDate)) {
+        return
+      }
+      this.baseDate = newDate.format('YYYY-MM-DD')
+      this.$emit('prev-day', this.baseDate)
+    },
+
+    // 后一天
+    goToNextDay () {
+      const newDate = dayjs(this.baseDate).add(1, 'day')
+      if (this.config?.maxDate && newDate.isAfter(this.config.maxDate)) {
+        return
+      }
+      this.baseDate = newDate.format('YYYY-MM-DD')
+      this.$emit('next-day', this.baseDate)
+    },
+
+    // 前一周
+    goToPrevWeek () {
+      const newDate = dayjs(this.baseDate).subtract(7, 'day')
+      if (this.config?.minDate && newDate.isBefore(this.config.minDate)) {
+        return
+      }
+      this.baseDate = newDate.format('YYYY-MM-DD')
+      this.$emit('prev-week', this.baseDate)
+    },
+
+    // 后一周
+    goToNextWeek () {
+      const newDate = dayjs(this.baseDate).add(7, 'day')
+      if (this.config?.maxDate && newDate.isAfter(this.config.maxDate)) {
+        return
+      }
+      this.baseDate = newDate.format('YYYY-MM-DD')
+      this.$emit('next-week', this.baseDate)
+    }
+  }
+})
+</script>
+
+<style scoped>
+.x-timeline {
+  width: 100%;
+  border: 1px solid #f0f0f0;
+  border-radius: 2px;
+}
+
+.x-timeline-nav {
+  display: flex;
+  align-items: center;
+  padding: 16px;
+  border-bottom: 1px solid #f0f0f0;
+  width: 100%;
+  justify-content: space-between;
+}
+
+.timeline-dates {
+  display: flex;
+  flex: 1;
+  justify-content: space-around;
+  align-items: center;
+  margin: 0 16px;
+}
+
+.date-item {
+  padding: 8px 12px;
+  text-align: center;
+  cursor: pointer;
+  border-radius: 2px;
+  flex: 1;
+  margin: 0 8px;
+  transition: all 0.3s;
+}
+
+.date-item:hover:not(.ant-btn-disabled) {
+  background: #fafafa;
+}
+
+.date-item.ant-btn-primary {
+  background: #1890ff;
+  color: #fff;
+}
+
+.date-item.ant-btn-primary .weekday,
+.date-item.ant-btn-primary .date {
+  color: #fff;
+}
+
+.date-item.date-weekend:not(.ant-btn-disabled):not(.ant-btn-primary) {
+  color: #ff4d4f;
+}
+
+.date-item.ant-btn-disabled {
+  color: rgba(0, 0, 0, 0.25);
+  background: #f5f5f5;
+  cursor: not-allowed;
+}
+
+.weekday {
+  font-size: 12px;
+  margin-bottom: 8px;
+  color: rgba(0, 0, 0, 0.45);
+}
+
+.date {
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.85);
+}
+</style>

package/src/base-client/components/his/XList/XList.vue

@@ -36,10 +36,6 @@ export default {
         })
     },
     handleClick (index) {
-      console.log('xlist按钮被点击了！')
-      console.warn(this.getComponentByName)
-      const xCollapseComponent = this.getComponentByName('XCollapse')
-      console.warn('xCollapseComponent', xCollapseComponent)
       this.$emit('listClick', this.data[index])
     },
     refreshList () {