gis-one-map-web/src/components/cus/cus-form-link/tree-select.vue

<template>
  <div v-loading="loading" :element-loading-background="elementLoadingBackground" style="width: 100%;">
    <el-tree-select
        style="width: 100%;"
        v-bind="$attrs"
        v-model="paramVal"
        :placeholder="$attrs.placeholder ? $attrs.placeholder : `请选择${label}`"
        :data="options"
        :clearable="$util.isValue($attrs.clearable) ? $attrs.clearable : true"
        :filterable="$util.isValue($attrs.filterable) ? $attrs.filterable : true"
        :check-strictly="checkStrictly"
        :disabled="$util.isValue($attrs.disabled) ? $attrs.disabled : formView"
    />
  </div>
</template>

<script lang="ts">
import {
  defineComponent,
  computed,
  onMounted,
  ref,
  reactive,
  watch,
  getCurrentInstance,
  ComponentInternalInstance,
  toRefs,
  nextTick,
  inject
} from 'vue'
import {useStore} from 'vuex'
import {useRouter, useRoute} from 'vue-router'

export default defineComponent({
  name: '',
  components: {},
  props: {
    param: {},
    label: {},
    checkStrictly: { default: true },
    options: { type: Array, default: () => [] },
    static: { default: false },
    isLoading: { default: false }
  },
  setup(props, { emit }) {
    const store = useStore();
    const router = useRouter();
    const route = useRoute();
    const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties
    const state = reactive({
      paramVal: props.param,
      loading: true,
      elementLoadingBackground: inject('element-loading-background', null),
      formView: inject('form-view', false),
    })
    watch(() => state.paramVal, (n) => {
      emit('emitParam', n)
    })
    watch(() => props.param, (n) => {
      state.paramVal = n
    })
    watch(() => [props.options, props.static], () => {
      state.loading = false
    })
    onMounted(() => {
      if (props.static !== false || props.options?.length > 0) {
        state.loading = false
      }
    })
    return {
      ...toRefs(state),
    }
  },
})
</script>

<style scoped lang="scss">
</style>