riku
2025-03-12 42f42dc88214f283b43c422f37e10ab45c5c5578
src/components/search/OptionDevice.vue
@@ -18,36 +18,67 @@
</template>
<script>
import { deviceList } from '@/constant/device-type';
// import { deviceList } from '@/constant/device-type';
import { mapStores } from 'pinia';
import { useDeviceStore } from '@/stores/device';
export default {
  props: {
    type: String,
    modelValue: String
  },
  emits: ['update:modelValue'],
  emits: ['update:modelValue', 'initOver'],
  data() {
    return {};
  },
  computed: {
    ...mapStores(useDeviceStore),
    deviceOptions() {
      return deviceList(this.type);
      return this.deviceStore.getDevice(this.type).map((v) => {
        return {
          label: v.deviceName,
          value: v.deviceCode
        };
      });
    }
  },
  watch: {
    // type(nV, oV) {
    //   if (nV != oV) {
    //     this.refreshOptions();
    //   }
    // }
    deviceOptions(nV, oV) {
      if (nV != oV) {
        this.handleChange(nV[0].value);
        if (nV.length > 0) {
          this.handleChange(nV[0].value);
        }
      }
    }
  },
  methods: {
    fetchDevice() {
      this.deviceStore.fetchDevice().then((res) => {
        if (res.success && res.data.length > 0) {
          this.handleChange(this.deviceOptions[0].value);
          this.$emit('initOver');
        }
      });
    },
    // refreshOptions() {
    //   this.deviceOptions =
    // },
    handleChange(value) {
      this.$emit('update:modelValue', value);
    }
  },
  mounted() {
    this.handleChange(this.deviceOptions[0].value);
    if (this.deviceStore.deviceList.length == 0) {
      this.fetchDevice();
    } else {
      this.handleChange(this.deviceOptions[0].value);
      this.$emit('initOver');
    }
  }
};
</script>