@ued_fpi/data-visual/dist/lib/wgms/src/SubordinateRanking/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 es = require('element-plus/es');
require('element-plus/es/components/base/style/css');
require('element-plus/es/components/scrollbar/style/css');
require('element-plus/es/components/tooltip/style/css');
const vue = require('vue');
const dayjs = require('dayjs');
const ProgressBar_vue_vue_type_script_setup_true_lang = require('../common/ProgressBar.vue.js');
require('../common/ProgressBar.vue2.js');
const index = require('./api/index.js');

const _hoisted_1 = { class: "dv-wgms-subordinate-ranking-table" };
const _hoisted_2 = { class: "dv-wgms-subordinate-ranking-sort" };
const _hoisted_3 = {
  key: 0,
  class: "dv-wgms-subordinate-ranking-name"
};
const _hoisted_4 = { class: "dv-wgms-subordinate-ranking-name" };
const _hoisted_5 = { class: "dv-wgms-subordinate-ranking-percent" };
const _hoisted_6 = { class: "dv-wgms-ranking-percent-progress" };
const _hoisted_7 = { class: "dv-wgms-ranking-percent-num" };
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{
    name: "DvWgmsSubordinateRanking",
    title: "下级排名"
  },
  __name: "index",
  props: {
    treeId: {
      type: [Number, String],
      default: 3302
    },
    beginTime: {
      type: Number,
      default: dayjs().startOf("year").valueOf()
    },
    endTime: {
      type: Number,
      default: dayjs().subtract(-1, "y").startOf("year").valueOf()
    },
    timeType: {
      type: String,
      default: "year"
    },
    controlLevel: {
      type: String,
      default: "001,002,003"
    },
    isLazy: {
      type: Boolean,
      default: false
    },
    data: {
      type: Array,
      default: () => []
    }
  },
  setup(__props, { expose: __expose }) {
    const props = __props;
    const data = vue.reactive({
      isLoading: false,
      curYear: dayjs().format("YYYY"),
      countyData: props.data,
      controlLevel: ""
    });
    vue.watch(() => props.data, (val) => {
      data.countyData = val;
    });
    vue.watch(() => [props.timeType, props.controlLevel, props.beginTime, props.endTime, props.treeId], () => {
      getRankData();
    });
    vue.onMounted(() => {
      !props.isLazy && getRankData();
    });
    const reload = () => {
      getRankData();
    };
    const getRankData = async () => {
      data.isLoading = true;
      const params = {
        controlLevel: props.controlLevel,
        treeId: props.treeId,
        startTime: props.beginTime,
        endTime: props.endTime,
        timeType: props.timeType
      };
      const res = await index.waterSubordinateRanking(params);
      data.countyData = res?.data || [];
    };
    const { countyData } = vue.toRefs(data);
    __expose({
      reload
    });
    return (_ctx, _cache) => {
      const _component_ElTooltip = es.ElTooltip;
      const _component_el_scrollbar = es.ElScrollbar;
      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
        vue.createVNode(_component_el_scrollbar, { class: "dv-wgms-sub-scroll-table" }, {
          default: vue.withCtx(() => [
            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(countyData), (item, index) => {
              return vue.openBlock(), vue.createElementBlock("div", {
                key: index,
                class: "dv-wgms-subordinate-ranking-list"
              }, [
                vue.createElementVNode("span", _hoisted_2, vue.toDisplayString(item.rankNo ? `TOP${item.rankNo}` : "--"), 1),
                item.regionName.length < 6 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3, vue.toDisplayString(item.regionName), 1)) : (vue.openBlock(), vue.createBlock(_component_ElTooltip, {
                  key: 1,
                  content: item.regionName,
                  placement: "top",
                  effect: "dark"
                }, {
                  default: vue.withCtx(() => [
                    vue.createElementVNode("div", _hoisted_4, vue.toDisplayString(item.regionName), 1)
                  ]),
                  _: 2
                }, 1032, ["content"])),
                vue.createElementVNode("div", _hoisted_5, [
                  vue.createElementVNode("div", _hoisted_6, [
                    vue.createVNode(ProgressBar_vue_vue_type_script_setup_true_lang.default, {
                      "active-color": "linear-gradient(270deg, var(--dv-color-index) 0%, var(--dv-color-index-30) 100%)",
                      "handle-style": {
                        background: "var(--dv-color-index)",
                        width: "2px",
                        height: "12px"
                      },
                      percentage: Number(item.percent)
                    }, null, 8, ["handle-style", "percentage"])
                  ]),
                  vue.createElementVNode("span", _hoisted_7, vue.toDisplayString(item.percent ?? "--") + "%", 1)
                ])
              ]);
            }), 128))
          ]),
          _: 1
        })
      ]);
    };
  }
});

exports.default = _sfc_main;