vue2-client 1.12.2 → 1.12.3-9.alpha.1

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

@@ -0,0 +1,300 @@
+<template>
+  <div class="card-box" v-if="!configurationParameters.drawerMode">
+    <div
+      class="section-tab"
+      :innerText="configurationParameters"
+      contenteditable="true"
+      :style="{ backgroundColor: configurationParameters.tabBackgroundColor }">
+      <a-icon :type="configurationParameters.icon" style="margin-left: 2%;font-size: medium;"/>
+      {{ configurationParameters.tab }}
+    </div>
+    <div class="patient-overview">
+      <div
+        class="overview-section"
+        v-for="(item,index) in data"
+        :key="index"
+        :style="{borderBottom: index === data.length - 1 ? 'none' : '1px solid #ddd'}">
+        <div class="section-header" :style="{ backgroundColor: item.backgroundColor, color: item.fontColor }">
+          {{ item.titleName }}({{ item.messageNumber }})
+        </div>
+        <div class="patient-list-container">
+          <div class="patient-list">
+            <div
+              v-for="(patient, i) in item.showData"
+              :key="i"
+              class="patient-item"
+              :title="`${patient.room_number} - ${patient.patient_name}`">
+              <span class="card_data" :style="{ color: item.fontColor }">{{ patient.room_number }}</span>
+              <span class="card_data" >{{ patient.patient_name }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div v-else class="card-box">
+    <div
+      class="section-tab"
+      :innerText="configurationParameters"
+      contenteditable="true"
+      :style="{ backgroundColor: configurationParameters.tabBackgroundColor }">
+      <a-icon :type="configurationParameters.icon" style="margin-left: 2%;font-size: medium;"/>
+      {{ configurationParameters.tab }}
+    </div>
+    <a-collapse accordion class="accordion" :activeKey="activeKey" @change="switchDrawers">
+      <a-collapse-panel
+        v-for="(time, rowId) in times"
+        :header="time"
+        :style="{backgroundColor:rowId === rowIndex ? configurationParameters.tabBackgroundColor : '#fff'}"
+        :key="rowId" >
+        <div class="patient-overview">
+          <div
+            class="overview-section"
+            v-for="(item,index) in data"
+            :key="index"
+            :style="{borderBottom: index === data.length - 1 ? 'none' : '1px solid #ddd'}">
+            <div class="section-header" :style="{ backgroundColor: item.backgroundColor, color: item.fontColor }">
+              {{ item.titleName }}({{ item.messageNumber }})
+            </div>
+            <div class="patient-list-container">
+              <div class="patient-list">
+                <div
+                  v-for="(patient, i) in item.showData"
+                  :key="i"
+                  class="patient-item"
+                  :title="`${patient.room_number} - ${patient.patient_name}`">
+                  <span class="card_data" :style="{ color: item.fontColor }">{{ patient.room_number }}</span>
+                  <span class="card_data" >{{ patient.patient_name }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </a-collapse-panel>
+    </a-collapse>
+  </div>
+</template>
+
+<script>
+
+import { getConfigByName, runLogic } from '@vue2-client/services/api/common'
+
+export default {
+  name: 'CardComponent',
+  data () {
+    return {
+      tab: 'container',
+      data: [
+        { room_number: '', patient_name: '' }
+      ],
+      activeKey: '0',
+      times: [],
+      DateTimes: [],
+      rowIndex: 0,
+      /* 配置参数(titleName：行标题名，dataSource：数据源，parameter：参数，fontColor：文字颜色，backgroundColor：背景颜色，
+     pageSize：分页数量，tabBackgroundColor：标签背景颜色，isPrimarySource：是否取mainDataSource中的元素)， drawerMode：是否选用抽屉模式
+     times：如果选用抽屉 */
+      configurationParameters: {
+        drawerMode: false,
+        tab: '',
+        icon: '',
+        tabBackgroundColor: '',
+        mainDataSource: '',
+        serverName: '',
+        parameter: { pageSize: 8 },
+        times: 4,
+        configurationData: [
+          {
+            titleName: '',
+            isPrimarySource: true,
+            dataSource: '',
+            fontColor: '',
+            backgroundColor: ''
+          }
+        ]
+      }
+    }
+  },
+  props: {
+    queryParamsName: {
+      type: String,
+      default: 'nurseStationHomeConfig'
+    }
+  },
+  created () {
+    this.getData(this.queryParamsName)
+  },
+  methods: {
+    async getData (data) {
+      this.data = []
+      getConfigByName(data, 'af-his', res => {
+        if (!res.drawerMode) {
+          this.renderDeck(res)
+        } else { this.renderData(res) }
+      })
+    },
+    // 渲染卡片组数据
+    async renderDeck (res, times) {
+      this.configurationParameters = await res
+      if (res.drawerMode) {
+        res.parameter.times = await times
+      }
+      runLogic(res.mainDataSource, res.parameter).then(result => {
+        for (let i = 0; i < res.configurationData.length; i++) {
+          const ConfigureDisplayData = {
+            titleName: res.configurationData[i].titleName,
+            fontColor: res.configurationData[i].fontColor,
+            backgroundColor: res.configurationData[i].backgroundColor,
+            messageNumber: result[res.configurationData[i].dataSource + 'Total'][0].total,
+            showData: []
+          }
+          this.data.push(ConfigureDisplayData)
+          this.data[i].showData = result[res.configurationData[i].dataSource]
+        }
+      })
+    },
+    formatTime (date) {
+      const year = date.getFullYear()
+      const month = String(date.getMonth() + 1).padStart(2, '0')
+      const day = String(date.getDate()).padStart(2, '0')
+      const hours = String(date.getHours()).padStart(2, '0')
+      return `${year}-${month}-${day} ${hours}:00`
+    },
+    getTimes (n) {
+      const times = []
+      const now = new Date()
+      for (let i = 0; i <= n; i++) {
+        const time = new Date(now.getTime() + i * 60 * 60 * 1000)
+        times.push(this.formatTime(time))
+      }
+      return times
+    },
+    formatTimeToHHMM (timeString) {
+      const date = new Date(timeString)
+      const hours = String(date.getHours()).padStart(2, '0')
+      const minutes = String(date.getMinutes()).padStart(2, '0')
+      return `${hours}:${minutes}`
+    },
+    // 获取数据并渲染数据
+    renderData (data) {
+      this.times = []
+      this.DateTimes = []
+      const time = this.getTimes(data.times)
+      for (let i = 0; i < data.times; i++) {
+        const startTime = this.formatTimeToHHMM(time[i])
+        const endTime = this.formatTimeToHHMM(time[i + 1])
+        this.times.push(`${startTime} ~ ${endTime}`)
+        this.DateTimes.push(`${time[i]} and ${time[i + 1]}`)
+      }
+      this.renderDeck(data, `${time[0]} and ${time[1]}`)
+    },
+    // 切换抽屉
+    switchDrawers (activeKey) {
+      if (activeKey !== undefined) {
+        console.log('Active Header:', this.DateTimes[activeKey])
+        this.data = []
+        this.renderDeck(this.configurationParameters, this.DateTimes[activeKey])
+        this.rowIndex = activeKey
+      }
+    }
+  },
+  watch: {
+    queryParamsName: {
+      handler (newValue) {
+        this.getData(newValue)
+      },
+      deep: true
+    }
+  },
+}
+</script>
+
+<style scoped>
+.accordion{
+  width: 100%;
+}
+.patient-overview {
+  width: 100%;
+  padding: 0.5%;
+  border: 1px solid #ddd;
+  border-radius: 0 5px 5px 5px;
+  height: 100%;
+  background-color: white;
+  overflow: scroll;
+}
+.section-header {
+  font-weight: bold;
+  display: flex;
+  width: 10%;
+  align-items: center;
+  justify-content: center;
+  min-height: 45px;
+  border-radius: 5px;
+  min-width: 90px;
+}
+.patient-list-container {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  padding-left: 1%;
+}
+.overview-section{
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  margin-top: 1%;
+  border-bottom: 1px solid #ddd;
+  padding-bottom: 0.7%;
+}
+.patient-list {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  width: 100%;
+}
+.patient-item {
+  background-color: #fff;
+  padding: 0.3%;
+  border: 1px solid #ddd;
+  width: 4%;
+  height: 21%;
+  text-align: center;
+  font-size: x-small;
+  border-radius: 5px;
+  min-width: 45px;
+  min-height: 45px;
+  cursor: pointer;
+}
+.patient-item:hover {
+  background-color: #f0f0f0;
+}
+.patient-item span {
+  display: block;
+}
+.section-tab {
+  width: 2vw;
+  height: 22vh;
+  display: flex;
+  writing-mode: vertical-rl;
+  align-items: center;
+  justify-content: space-evenly;
+  border-radius: 5px 0 0 5px;
+  color: white;
+  min-width: 27px;
+  min-height: 80px;
+  max-height: 95px;
+  max-width: 30px;
+}
+.card-box {
+  display: flex;
+  flex-direction: row;
+  height: 100%;
+}
+.card_data{
+  display: inline-block;
+  max-width: 5ch; /* 最多显示 3 个字符 */
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+</style>

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

@@ -0,0 +1,154 @@
+<template>
+  <div>
+    <a-collapse
+      :activeKey="activeKey"
+      @change="handleChange"
+    >
+      <a-collapse-panel
+        v-for="(panel, panelIndex) in config.showData"
+        :key="panelIndex.toString()"
+        :show-arrow="false"
+      >
+        <template #header>
+          <div class="header-content">
+            <span
+              class="header-text"
+              :style="config.titleStyle"
+            >
+              {{ panel.title }}
+            </span>
+            <span
+              v-for="(item, headerIndex) in panel.title2 || []"
+              :key="headerIndex"
+              class="info-item"
+              :style="config.title2Style"
+            >
+              <span>{{ item.key }}:</span>
+              <span>{{ item.value }}</span>
+            </span>
+            <span
+              class="time-item"
+              :style="config.title3Style"
+            >
+              {{ panel.title3 }}
+            </span>
+          </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>
+      </a-collapse-panel>
+    </a-collapse>
+  </div>
+</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
+  },
+  inject: ['getConfigByName'],
+  data () {
+    return {
+      activeKey: [],
+      config: {}
+    }
+  },
+  props: {
+    // json名
+    queryParamsName: {
+      type: Object,
+      default: 'openPrescriptionConfig'
+    },
+  },
+  created () {
+    this.getData(this.queryParamsName)
+  },
+  methods: {
+    async getData (config) {
+      getConfigByName(config, 'af-his', res => {
+        this.config = res
+        runLogic(res.mainLogic, {}, 'af-his').then(result => {
+          console.log(result)
+          this.config.showData = result
+          this.activeKey = this.config.showData.map((_, panelIndex) => panelIndex.toString())
+        })
+      })
+    },
+    handleChange (keys) {
+      this.activeKey = keys
+    },
+  },
+  watch: {
+    queryParamsName: {
+      handler (newValue) {
+        console.log(newValue)
+        this.getData(newValue)
+      },
+      deep: true
+    }
+  }
+}
+</script>
+
+<style scoped>
+.header-content {
+  display: flex;
+  align-items: center;
+  gap: 24px;
+}
+
+.header-text {
+  margin-right: 16px;
+  font-size: 16px;
+  font-weight: 800; /* 默认加粗 */
+}
+
+.info-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  font-size: 12px;
+  color: #888888;
+}
+
+.time-item {
+  margin-left: auto;
+  text-align: right;
+}
+
+/* 覆盖 ant-design-vue 的默认样式 */
+:deep(.ant-collapse-header) {
+  align-items: center !important;
+}
+
+:deep(.ant-collapse-header-text) {
+  flex: 1;
+}
+
+:deep(.ant-collapse-content > .ant-collapse-content-box) {
+  padding: 0;
+}
+
+:deep(.ant-card-body) {
+  padding: 8px;
+}
+</style>

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

@@ -9,7 +9,11 @@
           :class="['chat-message', message.type]"
         >
           <span class="chat-avatar">{{ message.type === 'user' ? '👤' : '🤖' }}</span>
-          <div class="chat-text" v-if="message.text" v-html="renderMarkdown(message.text)"></div>
+          <div
+            class="chat-text markdown-body"
+            v-if="message.text"
+            v-html="renderMarkdown(message.text)"
+          ></div>
           <div class="chat-text" v-else-if="message.state === 'loading'">
             <a-spin :spinning="true"/>
           </div>
@@ -166,7 +170,35 @@ export default {
           question: userMessage,
           additionalInfo: this.additionalInfo
         }, this.serviceName)
-        this.messages.push({ type: 'bot', text: response.value })
+
+        // 遍历并保存 additionalInfo
+        console.log(response)
+        if (response.additionalInfo) {
+          Object.entries(response.additionalInfo).forEach(([key, value]) => {
+            // 如果值是字符串类型，尝试转换为数字
+            if (typeof value === 'string' && !isNaN(value)) {
+              const numberValue = Number(value)
+              // 检查转换后的值是否是有限数字
+              if (isFinite(numberValue)) {
+                this.additionalInfo[key] = numberValue
+              } else {
+                this.additionalInfo[key] = value
+              }
+            } else {
+              this.additionalInfo[key] = value
+            }
+          })
+        }
+        console.log(this.additionalInfo)
+        if (typeof response.value === 'string') {
+          try {
+            response.value = JSON.parse(response.value)
+          } catch (e) {
+            console.error('JSON解析失败:', e)
+          }
+        }
+        console.log(response.value.response)
+        this.messages.push({ type: 'bot', text: response.value.response })
       } else if (this.renderConfig.api) {
         // 通过api获取消息
         this.messages.push({ type: 'bot', state: 'loading' })
@@ -195,6 +227,18 @@ export default {
         )
       }
     },
+    setHistoryMessages (messages) {
+      console.log(messages)
+      // 清空现有消息
+      this.messages = []
+      // 添加历史消息
+      messages.forEach(msg => {
+        this.messages.push({
+          type: msg.role === 'user' ? 'user' : 'bot',
+          text: msg.content
+        })
+      })
+    }
   },
   mounted () {
     this.setAddtionalInfo(this.getMixinData())
@@ -272,4 +316,45 @@ code {
   padding: 2px 4px;
   font-size: 90%;
 }
+
+/* 添加 Markdown 样式 */
+.markdown-body {
+  font-size: 14px;
+  line-height: 1.6;
+}
+
+.markdown-body h1,
+.markdown-body h2,
+.markdown-body h3,
+.markdown-body h4,
+.markdown-body h5,
+.markdown-body h6 {
+  margin-top: 16px;
+  margin-bottom: 8px;
+  font-weight: 600;
+}
+
+.markdown-body pre {
+  background-color: #f6f8fa;
+  border-radius: 6px;
+  padding: 16px;
+  overflow: auto;
+}
+
+.markdown-body code {
+  background-color: #f6f8fa;
+  border-radius: 3px;
+  padding: 0.2em 0.4em;
+  font-size: 85%;
+}
+
+.markdown-body p {
+  margin-bottom: 16px;
+}
+
+.markdown-body ul,
+.markdown-body ol {
+  padding-left: 2em;
+  margin-bottom: 16px;
+}
 </style>

package/src/base-client/components/common/XConversation/XConversationDemo.vue

@@ -1,28 +1,28 @@
-<template>
-  <div>
-    <h1>对话示例</h1>
-    <XConversation ref="XConversation"/>
-  </div>
-</template>
-
-<script>
-import XConversation from './XConversation.vue' // 请根据实际路径调整
-
-export default {
-  name: 'ConversationDemo',
-  components: {
-    XConversation
-  },
-  mounted () {
-    this.$refs.XConversation.init({
-      logicName: 'submitMessage',
-      serviceName: 'af-his'
-    })
-    this.$refs.XConversation.setAddtionalInfo({ patient_id: 37 })
-  }
-}
-</script>
-
-<style scoped>
-/* 这里可以添加你的样式 */
-</style>
+<template>
+  <div>
+    <h1>对话示例</h1>
+    <XConversation ref="XConversation"/>
+  </div>
+</template>
+
+<script>
+import XConversation from './XConversation.vue' // 请根据实际路径调整
+
+export default {
+  name: 'ConversationDemo',
+  components: {
+    XConversation
+  },
+  mounted () {
+    this.$refs.XConversation.init({
+      logicName: 'ragMessage',
+      serviceName: 'af-gpt-apply'
+    })
+    this.$refs.XConversation.setAddtionalInfo({ patient_id: 37 })
+  }
+}
+</script>
+
+<style scoped>
+/* 这里可以添加你的样式 */
+</style>