cnhis-design-vue 3.1.5-beta.1 → 3.1.5-beta.10

package/es/packages/info-header/src/InfoHeader.vue_vue_type_script_setup_true_lang.mjs

@@ -0,0 +1,218 @@
+import { defineComponent, ref, nextTick, onMounted, watch, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, Fragment, toDisplayString, createCommentVNode, renderList, withDirectives, createBlock, unref, withCtx, createTextVNode, vShow, createVNode } from 'vue';
+import { NTag, NDescriptions, NDescriptionsItem, NEllipsis } from 'naive-ui';
+import { useThrottleFn, useEventListener } from '@vueuse/core';
+import SlotRender from './SlotRender2.mjs';
+import './HiddenContent2.mjs';
+import script$1 from './HiddenContent.vue_vue_type_script_setup_true_lang.mjs';
+
+const _hoisted_1 = { class: "c-info-header__operation" };
+const _hoisted_2 = /* @__PURE__ */ createElementVNode("div", { class: "c-info-header__divider" }, null, -1);
+const _hoisted_3 = { class: "c-info-header__patient" };
+const _hoisted_4 = { class: "c-info-header__patientHeader" };
+const _hoisted_5 = {
+  key: 0,
+  class: "c-info-header__patientHeader--name"
+};
+const _hoisted_6 = {
+  key: 1,
+  class: "c-info-header__patientHeader--sex"
+};
+const _hoisted_7 = {
+  key: 2,
+  class: "c-info-header__patientHeader--age"
+};
+const _hoisted_8 = { class: "c-info-header__setting" };
+const _hoisted_9 = /* @__PURE__ */ createElementVNode("i", { class: "iconfont icon-bianji" }, null, -1);
+const _hoisted_10 = /* @__PURE__ */ createElementVNode("i", { class: "iconfont icon-setting" }, null, -1);
+const _hoisted_11 = /* @__PURE__ */ createElementVNode("i", { class: "iconfont icon-double_down" }, null, -1);
+var script = /* @__PURE__ */ defineComponent({
+  __name: "InfoHeader",
+  props: {
+    compact: { type: Boolean, required: true },
+    separator: { type: String, default: ":" },
+    patientInfo: { type: Object, default: () => ({}) },
+    infoList: { type: Array, required: true },
+    labelField: { type: String, default: "label" },
+    valueField: { type: String, default: "value" },
+    minColumnWidth: { type: [String, Number], default: 240 },
+    rowHeight: { type: [String, Number], default: 32 }
+  },
+  emits: ["openPatientInfo", "fieldSet", "update:compact"],
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    function toggleCompact() {
+      emit("update:compact", !props.compact);
+    }
+    function openPatientInfo() {
+      emit("openPatientInfo");
+    }
+    function fieldSet() {
+      emit("fieldSet");
+    }
+    function getTagColor(type) {
+      return {
+        color: type === "warning" ? "#fcc200" : "rgba(45, 122, 255, 0.1)",
+        textColor: type === "warning" ? "#ffffff" : "#2563F4"
+      };
+    }
+    function getEllipsisStyle(index) {
+      const width = descriptionWidthList.value[index] + "px";
+      return { width, maxWidth: width };
+    }
+    function needHidden(item) {
+      return ["\u7535\u8BDD", "\u8EAB\u4EFD\u8BC1"].some((key) => {
+        var _a, _b;
+        return (_b = (_a = item[props.labelField]) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, key);
+      });
+    }
+    const infoRef = ref();
+    const columnNum = ref(3);
+    const maxColumnWidth = ref(0);
+    const descriptionWidthList = ref([]);
+    const updateColumn = useThrottleFn(async function() {
+      await nextTick();
+      const infoWrapper = infoRef.value;
+      if (!infoWrapper)
+        return;
+      const { clientWidth } = infoWrapper;
+      columnNum.value = Math.floor(clientWidth / +props.minColumnWidth);
+      maxColumnWidth.value = Math.floor(clientWidth / columnNum.value);
+      await nextTick();
+      const labels = infoWrapper.querySelectorAll(".n-descriptions-table-content__label");
+      if (!labels)
+        return;
+      descriptionWidthList.value = Array.from(labels).map((label) => {
+        return maxColumnWidth.value - label.clientWidth - 20;
+      });
+    }, 100, true, false);
+    onMounted(updateColumn);
+    watch([() => props.minColumnWidth, () => props.infoList], updateColumn, { flush: "post", deep: true });
+    expose({
+      update: updateColumn
+    });
+    useEventListener(window, "resize", updateColumn);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["c-info-header", { "is-compact": __props.compact }]),
+        style: normalizeStyle({ "--row-height": __props.rowHeight, "--column-width": maxColumnWidth.value })
+      }, [
+        createElementVNode("section", _hoisted_1, [
+          renderSlot(_ctx.$slots, "operation")
+        ]),
+        _hoisted_2,
+        createElementVNode("section", _hoisted_3, [
+          renderSlot(_ctx.$slots, "patientModule"),
+          !_ctx.$slots.avatarModule ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+            renderSlot(_ctx.$slots, "avatar"),
+            createElementVNode("section", null, [
+              createElementVNode("header", _hoisted_4, [
+                __props.patientInfo.name ? (openBlock(), createElementBlock("div", _hoisted_5, toDisplayString(__props.patientInfo.name), 1)) : createCommentVNode("v-if", true),
+                __props.patientInfo.sex ? (openBlock(), createElementBlock("div", _hoisted_6, "/ " + toDisplayString(__props.patientInfo.sex), 1)) : createCommentVNode("v-if", true),
+                __props.patientInfo.age ? (openBlock(), createElementBlock("div", _hoisted_7, "/ " + toDisplayString(__props.patientInfo.age) + "\u5C81", 1)) : createCommentVNode("v-if", true),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(__props.patientInfo.tagList || [], (tag) => {
+                  return withDirectives((openBlock(), createBlock(unref(NTag), {
+                    key: tag.content,
+                    size: "medium",
+                    bordered: false,
+                    color: getTagColor(tag.type || "warning")
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(tag.content), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["color"])), [
+                    [vShow, tag.content]
+                  ]);
+                }), 128))
+              ]),
+              renderSlot(_ctx.$slots, "avatarInfo")
+            ])
+          ], 64)) : createCommentVNode("v-if", true)
+        ]),
+        createElementVNode("section", {
+          class: "c-info-header__info",
+          style: normalizeStyle({ "--row-num": __props.compact ? 1 : 2 }),
+          ref_key: "infoRef",
+          ref: infoRef
+        }, [
+          renderSlot(_ctx.$slots, "info", {}, () => [
+            createVNode(unref(NDescriptions), {
+              "label-align": "right",
+              style: { width: "100%" },
+              "label-placement": "left",
+              separator: ":",
+              column: columnNum.value
+            }, {
+              default: withCtx(() => [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(__props.infoList, (item, index) => {
+                  return openBlock(), createBlock(unref(NDescriptionsItem), {
+                    key: item[__props.labelField],
+                    label: item[__props.labelField]
+                  }, {
+                    default: withCtx(() => [
+                      item.slot ? (openBlock(), createBlock(unref(SlotRender), {
+                        key: 0,
+                        renderer: item.slot,
+                        "root-slots": _ctx.$slots,
+                        item,
+                        width: descriptionWidthList.value[index]
+                      }, null, 8, ["renderer", "root-slots", "item", "width"])) : needHidden(item) ? (openBlock(), createBlock(script$1, {
+                        key: 1,
+                        content: item[__props.valueField],
+                        width: descriptionWidthList.value[index]
+                      }, null, 8, ["content", "width"])) : (openBlock(), createBlock(unref(NEllipsis), {
+                        key: 2,
+                        style: normalizeStyle(getEllipsisStyle(index))
+                      }, {
+                        default: withCtx(() => {
+                          var _a;
+                          return [
+                            createTextVNode(toDisplayString((_a = item[__props.valueField]) != null ? _a : "-"), 1)
+                          ];
+                        }),
+                        _: 2
+                      }, 1032, ["style"]))
+                    ]),
+                    _: 2
+                  }, 1032, ["label"]);
+                }), 128))
+              ]),
+              _: 1
+            }, 8, ["column"])
+          ])
+        ], 4),
+        createElementVNode("section", _hoisted_8, [
+          renderSlot(_ctx.$slots, "setting"),
+          !_ctx.$slots.setting ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+            createElementVNode("div", {
+              class: "c-info-header__settingIcon",
+              onClick: openPatientInfo
+            }, [
+              renderSlot(_ctx.$slots, "patientInfoIcon", {}, () => [
+                _hoisted_9
+              ])
+            ]),
+            createElementVNode("div", {
+              class: "c-info-header__settingIcon",
+              onClick: fieldSet
+            }, [
+              renderSlot(_ctx.$slots, "fieldSetIcon", {}, () => [
+                _hoisted_10
+              ])
+            ]),
+            createElementVNode("div", {
+              class: "c-info-header__settingIcon",
+              onClick: toggleCompact
+            }, [
+              renderSlot(_ctx.$slots, "compactIcon", {}, () => [
+                _hoisted_11
+              ])
+            ])
+          ], 64)) : createCommentVNode("v-if", true)
+        ])
+      ], 6);
+    };
+  }
+});
+
+export { script as default };

package/es/packages/info-header/src/InfoHeader2.mjs

@@ -0,0 +1,4 @@
+import script from './InfoHeader.vue_vue_type_script_setup_true_lang.mjs';
+export { default } from './InfoHeader.vue_vue_type_script_setup_true_lang.mjs';
+
+script.__file = "packages/info-header/src/InfoHeader.vue";

package/es/packages/info-header/src/SlotRender.d.ts

@@ -0,0 +1,22 @@
+import { Func } from 'cnhis-design-vue/es/src/types';
+import { PropType } from 'vue';
+declare const _default: import("vue").DefineComponent<{
+    renderer: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: true;
+    };
+    rootSlots: {
+        type: PropType<Record<string, Func<any[], any>>>;
+        required: true;
+    };
+}, () => any, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    renderer: {
+        type: (StringConstructor | FunctionConstructor)[];
+        required: true;
+    };
+    rootSlots: {
+        type: PropType<Record<string, Func<any[], any>>>;
+        required: true;
+    };
+}>>, {}>;
+export default _default;

package/es/packages/info-header/src/SlotRender.mjs

@@ -0,0 +1 @@
+export { default } from './SlotRender2.mjs';

package/es/packages/info-header/src/SlotRender2.mjs

@@ -0,0 +1,35 @@
+import { isString, isFunction } from 'lodash-es';
+import { defineComponent } from 'vue';
+
+var SlotRender = defineComponent({
+  name: "SlotRender",
+  props: {
+    renderer: {
+      type: [String, Function],
+      required: true
+    },
+    rootSlots: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(props, {
+    attrs
+  }) {
+    function renderSlots(slotName) {
+      const renderer = props.rootSlots[slotName];
+      return isFunction(renderer) ? renderer(attrs) : null;
+    }
+    function renderVNode(renderer) {
+      return isFunction(renderer) ? renderer(attrs) : null;
+    }
+    return () => {
+      const {
+        renderer
+      } = props;
+      return isString(renderer) ? renderSlots(renderer) : isFunction(renderer) ? renderVNode(renderer) : null;
+    };
+  }
+});
+
+export { SlotRender as default };

package/es/packages/info-header/style/index.css

@@ -0,0 +1,121 @@
+.c-info-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 18px;
+  padding: 16px;
+  box-shadow: 0 2px 4px 0 rgba(176, 176, 176, 0.46);
+  background: white;
+}
+@font-face {
+  font-family: "iconfont";
+  /* Project id 3468756 */
+  src: url('./iconfont.ttf?t=1655348824139') format('truetype');
+}
+.c-info-header .iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+.c-info-header .icon-double_up:before {
+  content: "\e8c3";
+}
+.c-info-header .icon-guanbi-yanjing:before {
+  content: "\e6e3";
+}
+.c-info-header .icon-faxian-yanjing:before {
+  content: "\e6de";
+}
+.c-info-header .icon-bianji:before {
+  content: "\e600";
+}
+.c-info-header .icon-setting:before {
+  content: "\e785";
+}
+.c-info-header .icon-double_down:before {
+  content: "\e8c2";
+}
+.c-info-header__divider {
+  width: 1px;
+  background: #d5d5d566;
+  align-self: stretch;
+}
+.c-info-header__patient {
+  display: flex;
+  gap: 12px;
+  margin-right: 34px;
+}
+.c-info-header__patientHeader {
+  display: flex;
+  vertical-align: bottom;
+  align-items: baseline;
+  gap: 6px;
+}
+.c-info-header__patientHeader--name {
+  font-size: 20px;
+  font-weight: 700;
+  margin-right: 6px;
+}
+.c-info-header__patientHeader .n-tag {
+  align-self: flex-start;
+  border-radius: 4px;
+}
+.c-info-header__info {
+  flex: 1;
+  display: flex;
+  flex-wrap: wrap;
+  overflow: hidden;
+  justify-content: flex-start;
+  height: calc(var(--row-height) * var(--row-num) * 1px);
+  font-size: 14px;
+}
+.c-info-header__info td {
+  text-align: left;
+}
+.c-info-header__info .n-descriptions-table-content {
+  padding-bottom: 0 !important;
+  height: calc(var(--row-height) * 1px);
+  vertical-align: middle !important;
+  max-width: calc(var(--column-width) * 1px);
+}
+.c-info-header__info .n-descriptions-table-content__content {
+  font-weight: 700;
+}
+.c-info-header__info .n-descriptions-table-content__label {
+  display: inline-block;
+}
+.c-info-header__setting {
+  display: flex;
+  align-self: flex-start;
+  gap: 8px;
+}
+.c-info-header__settingIcon {
+  cursor: pointer;
+}
+.c-info-header__setting .iconfont {
+  font-size: 20px;
+  color: black;
+  display: inline-block;
+  transition: all 0.2s ease-in-out;
+}
+.c-info-header.is-compact [compact-hidden] {
+  display: none !important;
+}
+.c-info-header.is-compact .icon-double_down {
+  transform: rotate(180deg);
+}
+.c-info-header__hidden {
+  display: inline-flex;
+  vertical-align: middle;
+  align-items: center;
+  gap: 8px;
+  font-size: 14px;
+}
+.c-info-header__hidden--icon {
+  color: inherit !important;
+  cursor: pointer;
+  font-size: 14px;
+  text-decoration: none !important;
+}

package/es/packages/info-header/style/index.less

@@ -0,0 +1,153 @@
+.c-info-header {
+  @font-face {
+  font-family: "iconfont"; /* Project id 3468756 */
+  src: url('./iconfont.ttf?t=1655348824139') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-double_up:before {
+  content: "\e8c3";
+}
+
+.icon-guanbi-yanjing:before {
+  content: "\e6e3";
+}
+
+.icon-faxian-yanjing:before {
+  content: "\e6de";
+}
+
+.icon-bianji:before {
+  content: "\e600";
+}
+
+.icon-setting:before {
+  content: "\e785";
+}
+
+.icon-double_down:before {
+  content: "\e8c2";
+}
+
+
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 18px;
+  padding: 16px;
+  box-shadow: 0 2px 4px 0 rgba(176, 176, 176, 0.46);
+  background: white;
+
+  &__operation {
+    //
+  }
+
+  &__divider {
+    width: 1px;
+    background: #d5d5d566;
+    align-self: stretch;
+  }
+
+  &__patient {
+    display: flex;
+    gap: 12px;
+    margin-right: 34px;
+
+    &Header {
+      display: flex;
+      vertical-align: bottom;
+      align-items: baseline;
+      gap: 6px;
+
+      &--name {
+        font-size: 20px;
+        font-weight: 700;
+        margin-right: 6px;
+      }
+
+      .n-tag {
+        align-self: flex-start;
+        border-radius: 4px;
+      }
+    }
+  }
+
+  &__info {
+    flex: 1;
+    display: flex;
+    flex-wrap: wrap;
+    overflow: hidden;
+    justify-content: flex-start;
+    height: calc(var(--row-height) * var(--row-num) * 1px);
+
+    font-size: 14px;
+
+    td {
+      text-align: left;
+    }
+
+    .n-descriptions-table-content {
+      padding-bottom: 0 !important;
+      height: calc(var(--row-height) * 1px);
+      vertical-align: middle !important;
+      max-width: calc(var(--column-width) * 1px);
+    }
+
+    .n-descriptions-table-content__content {
+      font-weight: 700;
+    }
+
+    .n-descriptions-table-content__label {
+      display: inline-block;
+    }
+  }
+
+  &__setting {
+    display: flex;
+    align-self: flex-start;
+    gap: 8px;
+
+    &Icon {
+      cursor: pointer;
+    }
+
+    .iconfont {
+      font-size: 20px;
+      color: black;
+      display: inline-block;
+      transition: all .2s ease-in-out;
+    }
+  }
+
+  &.is-compact {
+    [compact-hidden] {
+      display: none !important;
+    }
+
+    .icon-double_down {
+      transform: rotate(180deg);
+    }
+  }
+
+  &__hidden {
+    display: inline-flex;
+    vertical-align: middle;
+    align-items: center;
+    gap: 8px;
+    font-size: 14px;
+
+    &--icon {
+      color: inherit !important;
+      cursor: pointer;
+      font-size: 14px;
+      text-decoration: none !important;
+    }
+  }
+}

package/es/packages/map/index.mjs

@@ -1 +1 @@
-export{default}from"./index2.mjs";
+export { default } from './index2.mjs';

package/es/packages/map/index2.mjs

@@ -1 +1,11 @@
-import{KEY_COMPONENT_NAME as s}from"cnhis-design-vue/es/src/global/variable";import{safeComponentRegister as r,getComponentName as e}from"cnhis-design-vue/es/src/utils";import"./src/Map2.mjs";import t from"./src/Map.vue_vue_type_script_setup_true_lang.mjs";const i=t;i.install=function(t){r(t,i,s+e(i))};export{i as default};
+import { COMPONENT_NAMESPACE } from 'cnhis-design-vue/es/src/global/variable';
+import { safeComponentRegister } from 'cnhis-design-vue/es/src/utils';
+import './src/Map2.mjs';
+import script from './src/Map.vue_vue_type_script_setup_true_lang.mjs';
+
+const Map = script;
+Map.install = function(app) {
+  safeComponentRegister(app, Map, COMPONENT_NAMESPACE + "Map");
+};
+
+export { Map as default };

package/es/packages/map/src/Map.mjs

@@ -1 +1,2 @@
-import"./Map2.mjs";export{default}from"./Map.vue_vue_type_script_setup_true_lang.mjs";
+import './Map2.mjs';
+export { default } from './Map.vue_vue_type_script_setup_true_lang.mjs';