@ued_fpi/data-visual/dist/lib/wgms/src/WgmsSpecialSiteDetails/index.vue.js

<br /> <br /> <div style="text-align:center"> <b style="font-size:30px">@ued_fpi/data-visual</b> <p>基于Vite4+TypeScript的Vue3大屏组件库开发框架</p> <img style="display:inline" src="https://img.shields.io/npm/v/@ued_fpi/data-visual" />

'use strict';

Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });

const vue = require('vue');
const utils = require('../../../utils.js');

const _hoisted_1 = { class: "exhibition-center-content" };
const _hoisted_2 = { class: "water-quality-category" };
const _hoisted_3 = { class: "water-quality-category-warp" };
const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("div", { class: "water-quality-category-title" }, " 水质类别 ", -1);
const _hoisted_5 = { class: "grade" };
const _hoisted_6 = /* @__PURE__ */ vue.createElementVNode("span", { class: "grade_name" }, "类", -1);
const _hoisted_7 = { class: "water-quality-category-target" };
const _hoisted_8 = /* @__PURE__ */ vue.createElementVNode("span", { class: "target" }, "目标：", -1);
const _hoisted_9 = /* @__PURE__ */ vue.createElementVNode("span", { class: "target_name" }, "类", -1);
const _hoisted_10 = { class: "water-quality-status" };
const _hoisted_11 = /* @__PURE__ */ vue.createElementVNode("span", { class: "target" }, "水质状况：", -1);
const _hoisted_12 = { class: "right-content" };
const _hoisted_13 = { class: "right-content-title" };
const _hoisted_14 = { class: "title-time" };
const _hoisted_15 = {
  key: 0,
  class: "right-content-content"
};
const _hoisted_16 = { class: "factor-item-top" };
const _hoisted_17 = { class: "factor-name" };
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{
    name: "DvWgmsWgmsSpecialSiteDetails",
    title: "特殊站点详情（1.4）"
  },
  __name: "index",
  props: {
    data: { default: null }
  },
  setup(__props) {
    const props = __props;
    const { isDark } = utils.useThemeHook();
    const waterData = vue.ref(null);
    vue.onMounted(() => {
      waterData.value = props.data;
    });
    vue.watch([() => props.data], () => {
      waterData.value = props.data;
    }, { deep: true });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
        vue.createElementVNode("div", _hoisted_2, [
          vue.createElementVNode("div", {
            class: vue.normalizeClass(["water-quality-category-bg", vue.unref(isDark) ? "bg-dark" : "bg-light"])
          }, [
            vue.createElementVNode("div", _hoisted_3, [
              _hoisted_4,
              vue.createElementVNode("div", {
                style: vue.normalizeStyle({ "--color": waterData.value?.waterQuality.gradeColor, "textAlign": "center" })
              }, [
                vue.createElementVNode("span", _hoisted_5, vue.toDisplayString(waterData.value?.waterQuality.grade), 1),
                _hoisted_6
              ], 4)
            ])
          ], 2),
          vue.createElementVNode("div", _hoisted_7, [
            _hoisted_8,
            vue.createElementVNode("span", {
              class: "category",
              style: vue.normalizeStyle({ "--color": waterData.value?.waterQuality.targetColor })
            }, vue.toDisplayString(waterData.value?.waterQuality.target), 5),
            _hoisted_9
          ]),
          vue.createElementVNode("div", _hoisted_10, [
            _hoisted_11,
            vue.createElementVNode("span", {
              class: "category",
              style: vue.normalizeStyle({ "--color": waterData.value?.waterQuality.gradeColor })
            }, vue.toDisplayString(waterData.value?.waterQuality.gradeName), 5)
          ])
        ]),
        vue.createElementVNode("div", _hoisted_12, [
          vue.createElementVNode("div", _hoisted_13, [
            vue.createElementVNode("div", {
              class: vue.normalizeClass(vue.unref(isDark) ? "title-name" : "title-name-light")
            }, vue.toDisplayString(waterData.value?.site.siteName), 3),
            vue.createElementVNode("div", _hoisted_14, vue.toDisplayString(waterData.value?.site.time), 1)
          ]),
          waterData.value?.factorList ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_15, [
            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(waterData.value?.factorList, (item, index) => {
              return vue.openBlock(), vue.createElementBlock("div", {
                key: item.code,
                class: vue.normalizeClass(["factor-item", { "last-item": index === waterData.value?.factorList.length - 1 }])
              }, [
                vue.createElementVNode("div", _hoisted_16, [
                  vue.createElementVNode("div", _hoisted_17, vue.toDisplayString(item.name), 1),
                  vue.createElementVNode("div", {
                    class: "factor-value",
                    style: vue.normalizeStyle({ "--color": item.color })
                  }, vue.toDisplayString(item.value), 5)
                ]),
                vue.createElementVNode("div", {
                  class: "factor-item-bar",
                  style: vue.normalizeStyle({ "--color": item.color })
                }, null, 4)
              ], 2);
            }), 128))
          ])) : vue.createCommentVNode("", true)
        ])
      ]);
    };
  }
});

exports.default = _sfc_main;