BMS Shared Components

Библиотека общих Vue 3 компонентов для переиспользования в различных проектах.

Установка

npm install bms-shared-components

Что тут есть

• ReSimpleTable
• ReSimpleSelect
• TheTable - Обертка над DataTable
• TheSelect - Был создан как обертка над Select чтобы в модель класть айди объекта а не весь объект
• TheDateInput - Был создан когда то как обертка над DateInput которая всегда сохраняет ISO формат даты
• RequestingSelect - Select поддерживающий поиск на сервере
• NewMkbSelectBox - компонент для быстрого поиска МКБ
• STable
• ConstructorReports - Список отчетов созданных на конструкторе форм с возможностью генерации оных
• ConstructorReportsQueue - Просмотр очереди отчетов (созданных на конструкторе форм и добавленных в очередь на формирование)
• ScanWriteOffMedicalDevicesFormMDLP - Списание мед. изделий и препаратов посредством документов выбытия

Использование

Как плагин (рекомендуется)

Компоненты используют Pinia через provide/inject (без глобальной регистрации). Передайте pinia при установке:

import { createApp } from "vue";
import { createPinia } from "pinia";
import App from "./App.vue";
import BmsSharedComponents from "bms-shared-components";
import "bms-shared-components/style.css";

const pinia = createPinia();
const app = createApp(App);
app.use(BmsSharedComponents, { pinia });
app.mount("#app");

С настройкой API и Pinia

При использовании плагина по умолчанию (BmsSharedComponents) поддерживаются apiConfig и axiosConfig:

import { createApp } from "vue";
import { createPinia } from "pinia";
import App from "./App.vue";
import BmsSharedComponents from "bms-shared-components";
import "bms-shared-components/style.css";

const pinia = createPinia();
const app = createApp(App);
app.use(BmsSharedComponents, {
  pinia,
  apiConfig: {
    baseURL: "https://api.example.com",
    token: "your-auth-token",
  },
  // или axiosConfig:
  // axiosConfig: { baseURL: "...", headers: { Authorization: "..." } },
});
app.mount("#app");

createBmsComponentsPlugin

Плагин принимает pinia и axiosInstance (конфиг для setupAxios):

import { createApp } from "vue";
import { createPinia } from "pinia";
import { createBmsComponentsPlugin } from "bms-shared-components";
import "bms-shared-components/style.css";

const hostPinia = createPinia();
const libPinia = createPinia();
const app = createApp(App);
app.use(hostPinia); // pinia хоста
app.use(
  createBmsComponentsPlugin({
    pinia: libPinia, // отдельный pinia для библиотеки
    axiosInstance: {
      baseURL: "https://api.example.com",
      headers: { Authorization: "Bearer your-jwt-token" },
    },
  }),
);
app.mount("#app");

Плагин использует свой экземпляр Pinia через provide, без app.use. Хост и библиотека — разные экземпляры, данные не пересекаются.

Синхронизация useUserStore с хостом: после логина в хосте вызывайте useUserStore(libPinia).setUser(user) — передайте libPinia (pinia библиотеки).

import { useUserStore as useUserStoreBMS, useStockStore as useStockStoreBMS } from "bms-shared-components";
// ...
useUserStoreBMS(window.libPinia).setUser(newUser);

// ...
useUserStoreBMS(window.libPinia).setUser(null);

Доступны глобально: $setupAxios, $updateAxiosToken.

Разработка

Используем библиотеку в проекте без обновления во время разработки

Билдим библиотеку

npm run build:lib

Создаем ссылку для нашей либы

npm link

В нужном проекте (например в web-mis-bms) привязываемся к созданной ссылке

npm link bms-shared-components

Как итог, мы можем тестировать новые фичи нашей библиотеки сразу в проекте Если в библиотеке что то поменялось - нужно перебилдить проект Отвязать ссылку можно командами npm unlink и npm unlink bms-shared-components в библиотеке и хост проекте соответственно

Пишет что нет моего компонента

Попробуй удалить node_modules/.vite