vue2-client 1.14.82 → 1.14.83

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

@@ -1,79 +1,16 @@
 <template>
-  <div class="list-wrapper">
-    <a-list size="large"
-            :data-source="data"
-            itemLayout="horizontal"
-            class="list-container"
-            ref="listRef"
-            split="config.split"
-    >
-      <template v-if="config.header" #header>
-        <div >{{ config.header }}</div>
-      </template>
-      <a-list-item
-        :class="{'header-row': item.type === 'header'}"
-        slot="renderItem"
-        slot-scope="item, index">
-        <div
-          class="row-item"
-          :style="{ justifyContent: getFlexJustify(item.style) }"
-        >
-          <template v-for="(column, idx) in item.item">
-            <template v-if="column.type === 'selectionBox'">
-              <a-checkbox @change="handleChange($event,column,index)" v-model="column.value" :key="`row-${index}-item-${idx}`" :class="['column-item']"></a-checkbox>
-            </template>
-            <template v-else-if="column.type === 'input'">
-              <a-input @change="handleChange($event,column,index)" :key="`row-${index}-item-${idx}`" :class="['column-item','item-input']" v-model="column.value" />
-            </template>
-            <template v-else-if="column.type === 'radio'">
-              <x-radio
-                :class="['column-item']"
-                :key="`row-${index}-item-${idx}`"
-                :queryParamsName="column.configName"
-                @change="handleChange($event,column,index)">
-              </x-radio>
-            </template>
-            <template v-else-if="column.type === 'time'">
-              <x-time-select :key="`row-${index}-item-${idx}`" :class="['column-item']" @change="handleChange($event,column,index)" :queryParamsName="column.configName">
-              </x-time-select>
-            </template>
-            <template v-else-if="column.type === 'text'">
-              <span :key="`row-${index}-item-${idx}`" :class="['column-item','item-text']"> {{ column.value }} </span>
-            </template>
-            <template v-else-if="column.type === 'describe'">
-              <span :key="`row-${index}-item-${idx}`" :class="['column-item','item-describe']"> {{ column.value }} </span>
-            </template>
-            <template v-else-if="column.type === 'header'">
-              <span :key="`row-${index}-item-${idx}`" :class="['item-header']"> {{ column.value }} </span>
-            </template>
-            <template v-else-if="column.type === 'button'">
-              <a-button
-                :class="['column-item']"
-                :key="`row-${index}-item-${idx}`"
-                :disabled="column.disabled"
-                :icon="column.icon"
-                :loading="column.loading"
-                :type="column.buttonType || 'default'"
-                @click="handleButtonClick(column)"
-              >
-                {{ column.label }}
-              </a-button>
-            </template>
-            <template v-else>
-              <span :key="`row-${index}-item-${idx}`" :class="['column-item','item-text']"> {{ column.value }} </span>
-            </template>
-          </template>
-        </div>
-      </a-list-item>
-    </a-list>
+  <div class="list-container" style="display: flex;">
+    <template v-for="(config, index) in configs">
+      <x-questionnaire-item :queryParamsName="config" :ref="el => setItemRef(el, index)" :key="`questionnaire-${index}`"></x-questionnaire-item>
+    </template>
   </div>
 </template>
 
 <script>
 
 import { getConfigByName } from '@vue2-client/services/api/common'
-import XRadio from '@vue2-client/base-client/components/his/XRadio/XRadio'
-import XTimeSelect from '@vue2-client/base-client/components/his/XTimeSelect/XTimeSelect'
+import XQuestionnaireItem from './XQuestionnaireItem.vue'
+
 export default {
   name: 'XQuestionnaire',
   props: {
@@ -84,18 +21,12 @@ export default {
   },
   inject: ['getComponentByName'],
   components: {
-    XTimeSelect,
-    XRadio
+    XQuestionnaireItem
   },
   data () {
     return {
-      data: [],
-      config: {
-        split: true,
-        header: null
-      },
-      results: [],
-      mapping: [] // 行索引  results数据所在的行
+      configs: [],
+      questionnaireItemRefs: [] // 存储子组件实例
     }
   },
   created () {
@@ -106,170 +37,16 @@ export default {
     async getData (queryParamsName) {
       const that = this
       getConfigByName(queryParamsName, 'af-his', res => {
-        that.config = {
-          ...that.config,
-          ...res.config
-        }
-        that.data = res.content || []
-        // 将又返回值的数据创建到results
-        for (let i = 0; i < res.content.length; i++) {
-          const fields = res.content[i]
-          if (!fields.item) {
-            continue
-          }
-          const value = {}
-          let hasValidData = false // 标识是否有有效数据
-          for (let j = 0; j < fields.item.length; j++) {
-            const field = fields.item[j]
-            if (field.type === 'selectionBox' || field.type === 'input' || field.type === 'radio' || field.type === 'time') {
-              value[field.key] = field.value
-              hasValidData = true
-            }
-          }
-          if (hasValidData) {
-            this.mapping.push(this.results.length)
-            value.row_key = fields.key
-            this.results.push(value)
-          } else {
-            this.mapping.push(undefined)
-          }
-        }
+        that.configs = res.configs || []
       })
     },
-    refreshList (param) {
-      // 清空当前数据和映射关系
-      this.data = []
-      this.results = []
-      this.mapping = []
-      this.results = []
-      this.getData(this.queryParamsName, param)
-    },
-    // 行数据排量方式
-    getFlexJustify (style) {
-      const validStyles = [
-        'flex-start', 'flex-end', 'center',
-        'space-between', 'space-around'
-      ]
-      return validStyles.includes(style) ? style : 'flex-start'
-    },
-    // 数据发生改变--将修改后的值填充到results
-    handleChange (e, column, rowIndex) {
-      const resultIndex = this.mapping[rowIndex]
-      if (resultIndex === undefined) return
-      if (column.type === 'selectionBox') {
-        this.results[resultIndex][column.key] = e.target.checked
-      } else if (column.type === 'input') {
-        this.results[resultIndex][column.key] = column.value
-      } else if (column.type === 'radio' || column.type === 'time') {
-        this.results[resultIndex][column.key] = e
-      }
-    },
-    handleButtonClick (item) {
-      item.loading = true
-      const callback = () => {
-        item.loading = false
-      }
-      if (item.clickEventName && this.$listeners[item.clickEventName]) {
-        // 交由父级处理
-        this.$emit(item.clickEventName, item, callback)
-      } else {
-        this.defaultAction(item.clickEventName, item, callback)
-      }
-    },
-    defaultAction (clickEventName, item, callback) {
-      setTimeout(() => {
-        this.$message.warn(`已触发按钮 [${item.key}]，注册事件名 [${clickEventName}]，未实现事件函数`)
-        callback()
-      }, 200)
-    }
-  },
-  watch: {
-    fixedQueryForm: {
-      deep: true,
-      handler (val) {
-        this.refreshList(val)
+    setItemRef (el, index) {
+      if (el) {
+        this.questionnaireItemRefs[index] = el // 保存实例
       }
     }
   },
-  beforeDestroy () {
-    this.clearAllTimers()
-  }
 }
 </script>
-
 <style scoped>
-
-.list-wrapper {
-  border: 1px solid #f0f0f0;
-}
-.list-container {
-  width: 100%;
-}
-
-/** 自定义滚动条样式
-    .list-wrapper {
-      max-height: 240px;
-      overflow-y: auto;
-      padding-right: 2px;
-    }
-    .list-wrapper::-webkit-scrollbar {
-      width: 6px;
-    }
-
-    .list-wrapper::-webkit-scrollbar-thumb {
-      background-color: #d9d9d9;
-      border-radius: 3px;
-    }
-
-    .list-wrapper::-webkit-scrollbar-track {
-      background-color: #f0f0f0;
-    }
-*/
-/* header样式 */
-.list-wrapper ::v-deep .ant-list-header {
-  background-color: #F4F4F4; /* 自定义背景色 */
-  display: flex;
-  justify-content: center;
-}
-
-.list-wrapper ::v-deep .x-radio-item {
-  margin-bottom: 0;
-}
-.list-wrapper ::v-deep .x-radio-item-container{
-  padding: 0;
-}
-.list-wrapper ::v-deep span.ant-radio + *{
-  padding: 0;
-}
-.list-wrapper ::v-deep .x-time-select {
-  width: auto !important;
-}
-.list-wrapper ::v-deep .header-row {
-  background-color: #F4F4F4; /* 自定义背景色 */
-  height: 45px !important;
-}
-/*每一行的整体样式*/
-.row-item{
-  width: 100%;
-  display: flex;
-  align-items: center;
-  padding: 2px;
-}
-/*行中每一列的数据*/
-.column-item{
-  margin-left: 10px;
-}
-.item-text {
-  color: black;
-}
-.item-describe {
-  color: #808080 ;
-}
-.item-input{
-  width: auto !important;
-}
-.item-header {
-  color: rgba(0, 0, 0, 0.65)
-}
-
 </style>

package/src/base-client/components/his/XQuestionnaire/XQuestionnaireDemo.vue

@@ -1,17 +1,13 @@
 <script>
 import XQuestionnaire from './XQuestionnaire.vue'
-import XRadio from '../XRadio/XRadio.vue'
 export default {
-  name: 'XQuestionnaireDemo',
+  name: 'XList2Demo',
   components: {
     XQuestionnaire,
-    XRadio
   },
   data () {
     return {
-      queryParamsName2: 'surgeryRiskAssessConfig2',
-      queryParamsName3: 'surgeryRiskAssessConfig3',
-      queryParamsName4: 'surgeryRiskAssessConfig4'
+      queryParamsName: 'surgeryRiskAssessConfig'
     }
   }
 }
@@ -19,14 +15,7 @@ export default {
 
 <template>
   <div style="display: flex">
-
-    <x-questionnaire :queryParamsName="queryParamsName2">
-    </x-questionnaire>
-
-    <x-questionnaire :queryParamsName="queryParamsName3">
-    </x-questionnaire>
-
-    <x-questionnaire :queryParamsName="queryParamsName4">
+    <x-questionnaire :queryParamsName="queryParamsName">
     </x-questionnaire>
   </div>
 </template>

package/src/base-client/components/his/XQuestionnaire/XQuestionnaireItem.vue

@@ -0,0 +1,280 @@
+<template>
+  <div class="list-wrapper">
+    <a-list size="large"
+            :data-source="data"
+            itemLayout="horizontal"
+            class="list-container"
+            ref="listRef"
+            split="config.split"
+    >
+      <template v-if="config.header" #header>
+        <div >{{ config.header }}</div>
+      </template>
+      <a-list-item
+        :class="{'header-row': item.type === 'header'}"
+        slot="renderItem"
+        slot-scope="item, index">
+        <div
+          class="row-item"
+          :style="{ justifyContent: getFlexJustify(item.style) }"
+        >
+          <template v-for="(column, idx) in item.item">
+            <template v-if="column.type === 'selectionBox'">
+              <a-checkbox @change="handleChange($event,column,index)" v-model="column.value" :key="`row-${index}-item-${idx}`" :class="['column-item']"></a-checkbox>
+            </template>
+            <template v-else-if="column.type === 'input'">
+              <a-input @change="handleChange($event,column,index)" :key="`row-${index}-item-${idx}`" :class="['column-item','item-input']" v-model="column.value" />
+            </template>
+            <template v-else-if="column.type === 'radio'">
+              <x-radio
+                :class="['column-item']"
+                :key="`row-${index}-item-${idx}`"
+                :queryParamsName="column.configName"
+                @change="handleChange($event,column,index)">
+              </x-radio>
+            </template>
+            <template v-else-if="column.type === 'time'">
+              <x-time-select :key="`row-${index}-item-${idx}`" :class="['column-item']" @change="handleChange($event,column,index)" :queryParamsName="column.configName">
+              </x-time-select>
+            </template>
+            <template v-else-if="column.type === 'text'">
+              <span :key="`row-${index}-item-${idx}`" :class="['column-item','item-text']"> {{ column.value }} </span>
+            </template>
+            <template v-else-if="column.type === 'describe'">
+              <span :key="`row-${index}-item-${idx}`" :class="['column-item','item-describe']"> {{ column.value }} </span>
+            </template>
+            <template v-else-if="column.type === 'header'">
+              <span :key="`row-${index}-item-${idx}`" :class="['item-header']"> {{ column.value }} </span>
+            </template>
+            <template v-else-if="column.type === 'button'">
+              <a-button
+                :class="['column-item']"
+                :key="`row-${index}-item-${idx}`"
+                :disabled="column.disabled"
+                :icon="column.icon"
+                :loading="column.loading"
+                :type="column.buttonType || 'default'"
+                @click="handleButtonClick(column)"
+              >
+                {{ column.label }}
+              </a-button>
+            </template>
+            <template v-else>
+              <span :key="`row-${index}-item-${idx}`" :class="['column-item','item-text']"> {{ column.value }} </span>
+            </template>
+          </template>
+        </div>
+      </a-list-item>
+    </a-list>
+  </div>
+</template>
+
+<script>
+
+import { runLogic } from '@vue2-client/services/api/common'
+import XRadio from '@vue2-client/base-client/components/his/XRadio/XRadio'
+import XTimeSelect from '@vue2-client/base-client/components/his/XTimeSelect/XTimeSelect'
+export default {
+  name: 'XQuestionnaireItem',
+  props: {
+    queryParamsName: {
+      type: Object,
+      default: null
+    },
+    fixedQueryForm: {
+      type: Object,
+      default: { condition: '1=1' }
+    }
+  },
+  inject: ['getComponentByName'],
+  components: {
+    XTimeSelect,
+    XRadio
+  },
+  data () {
+    return {
+      data: [],
+      config: {
+        split: true,
+        header: null
+      },
+      results: [],
+      mapping: [] // 行索引  results数据所在的行
+    }
+  },
+  created () {
+    console.log('queryParamsName', this.queryParamsName)
+    this.getData(this.queryParamsName, this.fixedQueryForm)
+  },
+  methods: {
+    // 获取配置
+    async getData (config, param) {
+      const that = this
+        that.config = {
+          ...that.config,
+          ...config
+        }
+        runLogic(config.data, param, 'af-his').then(res => {
+          that.data = res || []
+          // 将又返回值的数据创建到results
+          for (let i = 0; i < res.length; i++) {
+            const fields = res[i]
+            if (!fields.item) {
+              continue
+            }
+            const value = {}
+            let hasValidData = false // 标识是否有有效数据
+            for (let j = 0; j < fields.item.length; j++) {
+              const field = fields.item[j]
+              if (field.type === 'selectionBox' || field.type === 'input' || field.type === 'radio' || field.type === 'time') {
+                value[field.key] = field.value
+                hasValidData = true
+              }
+            }
+            if (hasValidData) {
+              this.mapping.push(this.results.length)
+              value.row_key = fields.key
+              this.results.push(value)
+            } else {
+              this.mapping.push(undefined)
+            }
+          }
+        })
+    },
+    refreshList (param) {
+      // 清空当前数据和映射关系
+      this.data = []
+      this.results = []
+      this.mapping = []
+      this.results = []
+      this.getData(this.queryParamsName, param)
+    },
+    // 行数据排量方式
+    getFlexJustify (style) {
+      const validStyles = [
+        'flex-start', 'flex-end', 'center',
+        'space-between', 'space-around'
+      ]
+      return validStyles.includes(style) ? style : 'flex-start'
+    },
+    // 数据发生改变--将修改后的值填充到results
+    handleChange (e, column, rowIndex) {
+      const resultIndex = this.mapping[rowIndex]
+      if (resultIndex === undefined) return
+      if (column.type === 'selectionBox') {
+        this.results[resultIndex][column.key] = e.target.checked
+      } else if (column.type === 'input') {
+        this.results[resultIndex][column.key] = column.value
+      } else if (column.type === 'radio' || column.type === 'time') {
+        this.results[resultIndex][column.key] = e
+      }
+    },
+    handleButtonClick (item) {
+      item.loading = true
+      const callback = () => {
+        item.loading = false
+      }
+      if (item.clickEventName && this.$listeners[item.clickEventName]) {
+        // 交由父级处理
+        this.$emit(item.clickEventName, item, callback)
+      } else {
+        this.defaultAction(item.clickEventName, item, callback)
+      }
+    },
+    defaultAction (clickEventName, item, callback) {
+      setTimeout(() => {
+        this.$message.warn(`已触发按钮 [${item.key}]，注册事件名 [${clickEventName}]，未实现事件函数`)
+        callback()
+      }, 200)
+    }
+  },
+  watch: {
+    fixedQueryForm: {
+      deep: true,
+      handler (val) {
+        this.refreshList(val)
+      }
+    }
+  },
+  beforeDestroy () {
+    this.clearAllTimers()
+  }
+}
+</script>
+
+<style scoped>
+
+.list-wrapper {
+  border: 1px solid #f0f0f0;
+}
+.list-container {
+  width: 100%;
+}
+
+/** 自定义滚动条样式
+    .list-wrapper {
+      max-height: 240px;
+      overflow-y: auto;
+      padding-right: 2px;
+    }
+    .list-wrapper::-webkit-scrollbar {
+      width: 6px;
+    }
+
+    .list-wrapper::-webkit-scrollbar-thumb {
+      background-color: #d9d9d9;
+      border-radius: 3px;
+    }
+
+    .list-wrapper::-webkit-scrollbar-track {
+      background-color: #f0f0f0;
+    }
+*/
+/* header样式 */
+.list-wrapper ::v-deep .ant-list-header {
+  background-color: #F4F4F4; /* 自定义背景色 */
+  display: flex;
+  justify-content: center;
+}
+
+.list-wrapper ::v-deep .x-radio-item {
+  margin-bottom: 0;
+}
+.list-wrapper ::v-deep .x-radio-item-container{
+  padding: 0;
+}
+.list-wrapper ::v-deep span.ant-radio + *{
+  padding: 0;
+}
+.list-wrapper ::v-deep .x-time-select {
+  width: auto !important;
+}
+.list-wrapper ::v-deep .header-row {
+  background-color: #F4F4F4; /* 自定义背景色 */
+  height: 45px !important;
+}
+/*每一行的整体样式*/
+.row-item{
+  width: 100%;
+  display: flex;
+  align-items: center;
+  padding: 2px;
+}
+/*行中每一列的数据*/
+.column-item{
+  margin-left: 10px;
+}
+.item-text {
+  color: black;
+}
+.item-describe {
+  color: #808080 ;
+}
+.item-input{
+  width: auto !important;
+}
+.item-header {
+  color: rgba(0, 0, 0, 0.65)
+}
+
+</style>

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

@@ -7,11 +7,16 @@
     <span slot="time" class="time-title">
       <span v-for="(item, index) in configData.timePeriod" :key="index">{{ item }}</span>
     </span>
+    <a-button slot="lastWeek" icon="left" size="large" />
+    <div v-for="(item, index) in weekDays" :key="index" >
+      <span>{{item}}</span>
+    </div>
     <template :slot="day.key" slot-scope="text, record" v-for="day in shiftTable">
       <div class="time-title" :key="day.key">
         <a-button v-for="(item, index) in record[day.key]" :key="index" @click="handleShiftChange(day.key, index, record)">{{ item === 1 || item === '1' ? '坐诊' : '休息' }}</a-button>
       </div>
     </template>
+    <a-button slot="nextWeek" icon="right" size="large" />
     <template slot="sk_limit" slot-scope="text, record">
       <a-input-number id="inputNumber" v-model="record.sk_limit" :min="configData.sk_limitMin" :max="configData.sk_limitMax" />
     </template>
@@ -36,56 +41,38 @@ export default {
       originalData: [],
       // 配置参数
       configData: {},
+      weekDays: [...['周一', '周二', '周三', '周四', '周五', '周六', '周日'].map((title, index) => {
+        const key = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'][index]
+        return { title, key }
+      })],
       // 排班时间表
       shiftTable: [
         {
-          title: '周一',
-          key: 'Monday',
-          dataIndex: 'Monday',
-          scopedSlots: { customRender: 'Monday' },
-          align: 'center'
-        },
-        {
-          title: '周二',
-          key: 'Tuesday',
-          dataIndex: 'Tuesday',
-          scopedSlots: { customRender: 'Tuesday' },
-          align: 'center'
-        },
-        {
-          title: '周三',
-          key: 'Wednesday',
-          dataIndex: 'Wednesday',
-          scopedSlots: { customRender: 'Wednesday' },
-          align: 'center'
-        },
-        {
-          title: '周四',
-          key: 'Thursday',
-          dataIndex: 'Thursday',
-          scopedSlots: { customRender: 'Thursday' },
-          align: 'center'
-        },
-        {
-          title: '周五',
-          key: 'Friday',
-          dataIndex: 'Friday',
-          scopedSlots: { customRender: 'Friday' },
-          align: 'center'
-        },
-        {
-          title: '周六',
-          key: 'Saturday',
-          dataIndex: 'Saturday',
-          scopedSlots: { customRender: 'Saturday' },
-          align: 'center'
+          dataIndex: 'lastWeek',
+          key: 'lastWeek',
+          slots: { title: 'lastWeek' },
+          scopedSlots: { customRender: 'lastWeekTitle' },
+          align: 'center',
+          width: 80
         },
+        ...['周一', '周二', '周三', '周四', '周五', '周六', '周日'].map((title, index) => {
+          const key = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'][index]
+          return {
+            title,
+            key,
+            dataIndex: key,
+            scopedSlots: { customRender: key },
+            slots: { title: key },
+            align: 'center'
+          }
+        }),
         {
-          title: '周日',
-          key: 'Sunday',
-          dataIndex: 'Sunday',
-          scopedSlots: { customRender: 'Sunday' },
-          align: 'center'
+          dataIndex: 'nextWeek',
+          key: 'nextWeek',
+          slots: { title: 'nextWeek' },
+          scopedSlots: { customRender: 'nextWeekTitle' },
+          align: 'center',
+          width: 80
         },
         {
           title: '排班数',