vue2-client 1.12.84 → 1.12.87

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue2-client",
-  "version": "1.12.84",
+  "version": "1.12.87",
   "private": false,
   "scripts": {
     "serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve --no-eslint",

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

@@ -0,0 +1,351 @@
+<template>
+  <div class="calendar-wrapper" :style="config.styles?.wrapper">
+    <!-- 顶部标题栏 -->
+    <div v-if="config.header.show" class="header-bar" :style="config.styles?.header">
+      <div class="left">
+        <i v-if="config.header.showIcon" class="icon-menu"></i>
+        <input type="text" :value="config.header.title" class="title-input" :style="config.styles?.titleInput"/>
+      </div>
+      <div class="right">
+        <a-button v-if="config.header.showBackToToday" type="link" @click="backToToday">{{
+          config.header.backToTodayText
+        }}
+        </a-button>
+        <a-button v-if="config.header.showMonth" type="link" :disabled="!config.header.monthClickable">{{
+          todayMonth
+        }}
+        </a-button>
+        <a-button v-if="config.header.showDay" type="link" :disabled="!config.header.dayClickable">{{
+          todayDay
+        }}
+        </a-button>
+      </div>
+    </div>
+
+    <!-- 子标题栏 -->
+    <div v-if="config.subHeader.show" class="sub-header" :style="config.styles?.subHeader">
+      <div class="title">
+        <span class="current-date" :style="config.styles?.currentDate">{{ currentDateText }}</span>
+        <span class="year" :style="config.styles?.year">{{ currentYearText }}</span>
+      </div>
+      <div class="actions">
+        <span
+          v-for="(action, index) in config.actions"
+          :key="index"
+          class="action-item"
+          :style="config.styles?.actionItem"
+          @click="handleAction(action)">
+          {{ action.text }}
+        </span>
+        <a-button v-if="config.subHeader.showNavigation" type="link" @click="prevMonth">
+          {{ config.subHeader.prevMonthText }}
+        </a-button>
+        <a-button v-if="config.subHeader.showNavigation" type="link" @click="nextMonth">
+          {{ config.subHeader.nextMonthText }}
+        </a-button>
+      </div>
+    </div>
+
+    <!-- 日历内容 -->
+    <div class="calendar-content" :style="config.styles?.calendarContent">
+      <a-calendar
+        ref="calendar"
+        :value="currentDate"
+        :fullscreen="config.calendar.fullscreen"
+        @select="handleSelect"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { Calendar, Button } from 'ant-design-vue'
+import moment from 'moment'
+import 'moment/locale/zh-cn'
+
+// 设置中文
+moment.locale('zh-cn')
+
+// 默认配置
+const defaultConfig = {
+  header: {
+    show: true,
+    title: '我的日程',
+    showIcon: true,
+    showBackToToday: true,
+    backToTodayText: '返回当天',
+    showMonth: true,
+    showDay: true,
+    monthClickable: false,
+    dayClickable: false
+  },
+  subHeader: {
+    show: true,
+    showNavigation: true,
+    prevMonthText: '←',
+    nextMonthText: '→'
+  },
+  calendar: {
+    fullscreen: false,
+    locale: 'zh-cn'
+  },
+  // 操作按钮
+  actions: [
+    {
+      text: '+ 新增日程',
+      type: 'add',
+      handler: 'handleAdd'
+    }
+  ],
+  // 自定义样式
+  styles: {
+    wrapper: {},
+    header: {},
+    titleInput: {},
+    subHeader: {},
+    currentDate: {},
+    year: {},
+    actionItem: {},
+    calendarContent: {}
+  },
+  // 事件配置
+  events: {
+    select: 'select',
+    backToToday: 'back-to-today',
+    action: 'action',
+    add: 'add',
+    monthChange: 'month-change'
+  }
+}
+
+export default {
+  name: 'XCalendar',
+  components: {
+    ACalendar: Calendar,
+    AButton: Button
+  },
+  props: {
+    // 接收配置
+    config: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data () {
+    const today = moment()
+    return {
+      currentDate: moment(),
+      todayMonth: today.month() + 1,
+      todayDay: today.date(),
+      // 合并默认配置和传入的配置
+      mergedConfig: {}
+    }
+  },
+  created () {
+    // 深度合并配置
+    this.mergedConfig = this.mergeConfig(defaultConfig, this.config)
+  },
+  computed: {
+    // 使用计算属性访问合并后的配置
+    // eslint-disable-next-line vue/no-dupe-keys
+    config () {
+      return this.mergedConfig
+    },
+    currentDateText () {
+      const month = this.currentDate.month() + 1
+      const day = this.currentDate.date()
+      return `${this.numberToChinese(month)}月${this.numberToChinese(day)}日`
+    },
+    currentYearText () {
+      return this.currentDate.format('YYYY')
+    }
+  },
+  methods: {
+    // 深度合并配置
+    mergeConfig (defaultConfig, userConfig) {
+      const result = { ...defaultConfig }
+
+      for (const key in userConfig) {
+        if (typeof userConfig[key] === 'object' && userConfig[key] !== null &&
+          typeof defaultConfig[key] === 'object' && defaultConfig[key] !== null) {
+          result[key] = this.mergeConfig(defaultConfig[key], userConfig[key])
+        } else if (userConfig[key] !== undefined) {
+          result[key] = userConfig[key]
+        }
+      }
+
+      return result
+    },
+    numberToChinese (num) {
+      const chineseNums = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十']
+      if (num <= 10) return chineseNums[num]
+      if (num < 20) return '十' + (num % 10 === 0 ? '' : chineseNums[num % 10])
+      return chineseNums[Math.floor(num / 10)] + '十' + (num % 10 === 0 ? '' : chineseNums[num % 10])
+    },
+    handleSelect (date) {
+      this.currentDate = date
+      // 触发选择事件，使用配置的事件名
+      this.$emit(this.config.events.select, date)
+    },
+    prevMonth () {
+      // 使用moment API直接操作日期
+      this.currentDate = moment(this.currentDate).subtract(1, 'month')
+      // 触发月份变化事件
+      this.$emit(this.config.events.monthChange, this.currentDate)
+    },
+    nextMonth () {
+      // 使用moment API直接操作日期
+      this.currentDate = moment(this.currentDate).add(1, 'month')
+      // 触发月份变化事件
+      this.$emit(this.config.events.monthChange, this.currentDate)
+    },
+    backToToday () {
+      // 返回当天
+      this.currentDate = moment()
+      // 触发返回今天事件
+      this.$emit(this.config.events.backToToday, this.currentDate)
+    },
+    // 处理操作按钮点击
+    handleAction (action) {
+      // 检查是否有注册的处理方法
+      if (action.type && typeof this[`handle${action.type.charAt(0).toUpperCase() + action.type.slice(1)}`] === 'function') {
+        // 调用对应的处理方法
+        this[`handle${action.type.charAt(0).toUpperCase() + action.type.slice(1)}`](action)
+      } else if (action.handler && typeof this.$parent[action.handler] === 'function') {
+        // 调用父组件的方法
+        this.$parent[action.handler](this.currentDate, action)
+      }
+      // 触发点击事件
+      this.$emit(this.config.events.action, this.currentDate)
+    },
+    // 默认的新增处理方法
+    handleAdd (action) {
+      this.$emit(this.config.events.add, this.currentDate)
+    }
+  }
+}
+</script>
+
+<style scoped>
+.calendar-wrapper {
+  background: #fff;
+  border-radius: 4px;
+  padding: 20px;
+}
+
+/* 顶部标题栏样式 */
+.header-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 16px;
+  border-bottom: 1px solid #f0f0f0;
+  margin-bottom: 16px;
+}
+
+.header-bar .left {
+  display: flex;
+  align-items: center;
+}
+
+.icon-menu {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  background-color: #ccc;
+  margin-right: 8px;
+}
+
+.title-input {
+  border: none;
+  font-size: 16px;
+  font-weight: 500;
+  outline: none;
+  color: #000;
+  background-color: transparent;
+  width: 200px;
+}
+
+.header-bar .right {
+  display: flex;
+}
+
+.sub-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+}
+
+.title {
+  display: flex;
+  gap: 8px;
+  align-items: baseline;
+}
+
+.current-date {
+  font-size: 24px;
+  font-weight: 500;
+}
+
+.year {
+  color: #999;
+  font-size: 16px;
+}
+
+.actions {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.action-item {
+  color: #666;
+  cursor: pointer;
+}
+
+.calendar-content {
+  :deep(.ant-fullcalendar-header) {
+    display: none;
+  }
+
+  :deep(.ant-fullcalendar) {
+    border: 1px solid #f0f0f0;
+    border-radius: 2px;
+  }
+
+  :deep(.ant-fullcalendar-calendar-body) {
+    padding: 8px 12px;
+  }
+
+  :deep(.ant-fullcalendar-column-header) {
+    text-align: center;
+    padding: 12px 0;
+
+    .ant-fullcalendar-column-header-inner {
+      display: inline-block;
+      font-weight: normal;
+    }
+  }
+
+  :deep(.ant-fullcalendar-cell) {
+    padding: 4px 0;
+  }
+
+  :deep(.ant-fullcalendar-date) {
+    height: 24px;
+    margin: 0 4px;
+    padding: 4px;
+    border-radius: 2px;
+    border: none;
+    width: auto;
+    text-align: center;
+  }
+
+  :deep(.ant-fullcalendar-selected-day .ant-fullcalendar-value) {
+    background: #000;
+    color: #fff;
+    border-radius: 50%;
+  }
+}
+</style>

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

@@ -2,20 +2,17 @@
   <div>
     <a-collapse
       :activeKey="activeKey"
-      @change="handleChange"
-    >
+      @change="handleChange">
       <a-collapse-panel
         v-for="(panel, panelIndex) in config.showData"
         :key="panelIndex.toString()"
         :show-arrow="false"
-        :disabled="config.collapsible"
-      >
+        :disabled="config.collapsible">
         <template #header>
           <div class="header-content">
             <span
               class="header-text"
-              :style="config.titleStyle"
-            >
+              :style="config.titleStyle">
               {{ panel.title }}
             </span>
             <!-- 当有 title2 数据时显示信息项 -->
@@ -24,8 +21,7 @@
                 v-for="(item, headerIndex) in panel.title2"
                 :key="headerIndex"
                 class="info-item"
-                :style="config.title2Style"
-              >
+                :style="config.title2Style">
                 <!-- 根据showTitle是否显示键名 -->
                 <span v-if="config.showTitle">{{ item.key }}:</span>
                 <span>{{ item.value }}</span>
@@ -35,8 +31,7 @@
             <span
               v-if="panel.title3"
               class="time-item"
-              :style="config.title3Style"
-            >
+              :style="config.title3Style">
               {{ panel.title3 }}
             </span>
             <!-- 修改搜索框的显示条件 -->
@@ -46,26 +41,23 @@
               :placeholder="panel.searchPlace"
               class="search-input"
               @search="(value) => onSearch(value, panelIndex)"
-              @click.stop
-            />
+              @click.stop/>
           </div>
         </template>
         <!-- 根据类型显示不同内容 -->
         <template v-if="panel.type === 'picture'">
           <img :src="panel.configName" alt="图片" style="width: 100%; max-width: 500px;"/>
         </template>
-        <template v-else-if="panel.type === 'cover'">
-          <x-report
-            :use-oss-for-img="false"
-            :config-name="panel.configName"
-            server-name="af-his"
-            :show-img-in-cell="true"
-            :display-only="true"
-            :edit-mode="false"
-            :show-save-button="false"
-            :no-padding="true"
-            :dont-format="true">
-          </x-report>
+        <template v-else-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', 'x-radio'].includes(panel.type)">
+          <component
+            :is="getComponentName(panel.type)"
+            :ref="`dynamicComponent_${ panel.type }`"
+            serverName="af-his"
+            :queryParamsName="panel.configName"
+            :countVisible="false"
+            :env="env"
+            @listClick="listClick"
+          />
         </template>
       </a-collapse-panel>
     </a-collapse>
@@ -73,15 +65,31 @@
 </template>
 
 <script>
-import XReport from '@vue2-client/base-client/components/common/XReportGrid'
 import { getConfigByName, runLogic } from '@vue2-client/services/api/common'
 
 export default {
   name: 'XCollapse',
   components: {
-    XReport
+    XFormTable: () => import('@vue2-client/base-client/components/common/XFormTable/XFormTable.vue'),
+    XAddNativeForm: () => import('@vue2-client/base-client/components/common/XAddNativeForm/XAddNativeForm.vue'),
+    XFormGroup: () => import('@vue2-client/base-client/components/common/XFormGroup/XFormGroup.vue'),
+    XTreePro: () => import('@vue2-client/base-client/components/common/XTree/XTreePro.vue'),
+    XHisEditor: () => import('@vue2-client/base-client/components/his/XHisEditor/XHisEditor.vue'),
+    XTab: () => import('@vue2-client/base-client/components/common/XTab/XTab.vue'),
+    XReport: () => import('@vue2-client/base-client/components/common/XReport/XReport.vue'),
+    XButtons: () => import('@vue2-client/base-client/components/common/XButtons/XButtons.vue'),
+    XLabelSelect: () => import('@vue2-client/base-client/components/common/XLabelSelect/XLabelSelect.vue'),
+    XConversation: () => import('@vue2-client/base-client/components/common/XConversation/XConversation.vue'),
+    XCheckList: () => import('@vue2-client/base-client/components/common/XCheckList/XCheckList.vue'),
+    XCardSet: () => import('@vue2-client/base-client/components/common/XCardSet/XCardSet.vue'),
+    XCollapse: () => import('@vue2-client/base-client/components/common/XCollapse/XCollapse.vue'),
+    XHDescriptions: () => import('@vue2-client/base-client/components/his/XHDescriptions/XHDescriptions.vue'),
+    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'),
+    XRadio: () => import('@vue2-client/base-client/components/his/XRadio/XRadio.vue')
   },
-  inject: ['getConfigByName', 'getComponentByName'],
   data () {
     return {
       activeKey: [],
@@ -101,31 +109,12 @@ export default {
     }
   },
   created () {
-    this.searchTexts = {} // 初始化对象
-
     this.getData(this.queryParamsName)
-    window.addEventListener('setItem', (e) => {
-      console.log('监听到sessionStorage的变化：', e)
-      if (e.key === 'klcf_id') {
-        this.newVal = sessionStorage.getItem('klcf_id')
-        // 进行业务处理
-        console.log('sessionStorage中的值发生了变化：', this.newVal)
-      }
-    })
   },
   beforeDestroy () {
-    window.removeEventListener('setItem', this.handleStorageChange)
   },
   methods: {
-    handleStorageChange (e) {
-      console.log('监听到sessionStorage的变化：', e)
-      if (e.key === 'klcf_id') {
-        this.newVal = sessionStorage.getItem('klcf_id')
-        // 进行业务处理
-        console.log('sessionStorage中的值发生了变化：', this.newVal)
-      }
-    },
-    async getData (config, parameter) {
+    async getData (config) {
       this.configName = config
       getConfigByName(config, 'af-his', res => {
         this.config = res

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

@@ -0,0 +1,15 @@
+<template>
+  <x-collapse :query-params-name="openPrescriptionConfig" />
+</template>
+
+<script>
+import XCollapse from '@vue2-client/base-client/components/common/XCollapse/XCollapse.vue'
+export default {
+  name: 'Demo',
+  components: { XCollapse }
+}
+</script>
+
+<style scoped>
+
+</style>

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

@@ -17,6 +17,7 @@
       :server-name="serverName"
       :env="env"
       :show-title="showTitle"
+      @listClick="listClick"
     >
     </XReportDesign>
     <a-row
@@ -246,6 +247,9 @@ export default {
     }
   },
   methods: {
+    listClick (data) {
+      this.$emit('listClick', data)
+    },
     slotRendered () {
       if (this.config?.mountedFunction) {
         let func = this.config.mountedFunction

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

@@ -1,44 +1,44 @@
-<template>
-  <div id="test">
-    <a-card :bordered="false">
-      <XReport
-        ref="main"
-        :use-oss-for-img="false"
-        config-name="openPrescriptionCover"
-        server-name="af-his"
-        :show-img-in-cell="true"
-        :display-only="true"
-        :edit-mode="false"
-        :dont-format="true"/>
-    </a-card>
-  </div>
-</template>
-
-<script>
-import XReport from './XReport'
-import XAddReport from '../XAddReport/XAddReport.vue'
-// eslint-disable-next-line no-unused-vars
-
-export default {
-  name: 'XReportDemo',
-  components: {
-    XReport, XAddReport
-  },
-  mounted () {
-    // this.$refs.xAddReport.init({
-    //   configName: 'skinTestExecuActionCover',
-    //   selectedId: '11111',
-    //   mixinData: {}
-    // })
-  },
-  data () {
-    return {
-    }
-  },
-  methods: {
-  }
-}
-</script>
-<style scoped>
-
-</style>
+<template>
+  <div id="test">
+    <a-card :bordered="false">
+      <XReport
+        ref="main"
+        :use-oss-for-img="false"
+        config-name="openPrescriptionCover"
+        server-name="af-his"
+        :show-img-in-cell="true"
+        :display-only="true"
+        :edit-mode="false"
+        :dont-format="true"/>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import XReport from './XReport'
+import XAddReport from '../XAddReport/XAddReport.vue'
+// eslint-disable-next-line no-unused-vars
+
+export default {
+  name: 'XReportDemo',
+  components: {
+    XReport, XAddReport
+  },
+  mounted () {
+    // this.$refs.xAddReport.init({
+    //   configName: 'skinTestExecuActionCover',
+    //   selectedId: '11111',
+    //   mixinData: {}
+    // })
+  },
+  data () {
+    return {
+    }
+  },
+  methods: {
+  }
+}
+</script>
+<style scoped>
+
+</style>

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

@@ -35,6 +35,7 @@
               :columns="row"
               :config-data="activatedConfig.data"
               :config="activatedConfig"
+              @listClick="listClick"
               :display="true">
             </x-report-tr-group>
           </tbody>
@@ -122,6 +123,9 @@ export default {
     }
   },
   methods: {
+    listClick (data) {
+      this.$emit('listClick', data)
+    },
     slotRendered () {
       this.$emit('slotRendered')
     },