public-fuse/src/setSystem.ts

import { ref } from "vue";
import { title } from "./store/system";
import { appConstant } from "./app";
import {
  caseFileTypes,
  caseFiles,
  insertCaseFile,
  deleteCaseFile,
  updateCaseFile,
  axios,
  caseFileInfo,
  saveCaseFileInfo,
  getSysSetting,
  updateSysSetting,
} from "@/request";
import { isOfflineMode, getOfflineDataPath, fetchOfflineJson } from "@/util/offline";

const modules = import.meta.glob("@/assets/style/theme/*.scss", {
  query: "?inline",
});

const appId = import.meta.env.VITE_APP_APP;

const initSysSetting = async () => {
  console.log(isOfflineMode(), import.meta.env.VITE_OFFLINE, 77777777)
  if (isOfflineMode()) {
    try {
      const base = getOfflineDataPath();
      console.log(base, 88888888)
      const dict = await fetchOfflineJson<Record<string, any>>([
        `${base}/package/data.json`,
        `/package/data.json`,
      ]);
      const entry = dict["/fusion/systemSetting/list"];
      const list: any[] = Array.isArray(entry?.data) ? entry.data : (Array.isArray(entry?.list) ? entry.list : []);
      let params = window.location.hash;
      let query = params.indexOf('?') > -1 ? params.split('?')[1] : '';
      let fromRoute = (new URLSearchParams(query).get('fromRoute') || appId).toLowerCase();
      const item = list.find((it) => it.platformKey === fromRoute);
      if (item) {
        systemData.value.name = item.title;
        systemData.value.color = item.themeColour;
        localStorage.setItem('f-themeColour', item.themeColour);
        refresh();
        return;
      }
    } catch (e) {
    }
  }
  axios.get(getSysSetting, { params: { platformKey: appId } }).then((data) => {
    systemData.value.name = data.data.title;
    systemData.value.color = data.data.themeColour;
    localStorage.setItem('f-themeColour', data.data.themeColour);
    refresh();
  });
};

initSysSetting();

const update = () => {
  axios.post(updateSysSetting, {
    title: systemData.value.name,
    themeColour: systemData.value.color,
  });
};

export const themeColors = [
  "d8000a",
  "0960bd",
  "0084f4",
  "009688",
  "536dfe",
  "ff5c93",
  "ee4f12",
  "0096c7",
  "9c27b0",
  "ff9800",
];

export const systemData = ref({
  name: appConstant.name,
  color: themeColors[0],
});

const $style = document.createElement("style");
$style.setAttribute("type", "text/css");
document.body.appendChild($style);

const refresh = async () => {
  title.value = systemData.value.name;

  const key = Object.keys(modules).find((key) =>
    key.includes(systemData.value.color)
  );
  if (key) {
    const res1: any = await modules[key]();
    const res2: any = await import("@/assets/style/public.scss?inline");
    $style.innerHTML = res1.default + res2.default;
  }
};

export const setTheme = async (color: string) => {
  systemData.value.color = color;
  await update();
  refresh();
};

export const setTitle = async (d: string) => {
  systemData.value.name = d;
  await update();
  refresh();
};
export const setSettings = async (title: string, color: string) => {
  systemData.value.name = title;
  systemData.value.color = color;
  await update();
  refresh();
};