<!--
 * @Author: YKH
 * @Date: 2021-12-23 17:04:33
 * @LastEditTime: 2022-09-23 14:53:01
 * @Description: 
 * @FilePath: \cool-admin\cool-admin-vue-vue3-ts-vite\src\cool\modules\shuyou\components\shuyouGameList-select.vue
-->
<template>
	<el-select
		v-model="value"
		v-bind="props"
		filterable
		multiple
		multiple-limit="1"
		@change="onChange"
		placeholder="可搜索"
	>
		<el-option
			v-for="(item, index) in list"
			:key="index"
			:value="item.id"
			:label="'[' + item.shop_name + '] ' + item.pc_num"
		/>
	</el-select>
</template>

<script lang="ts">
import { defineComponent, inject, onMounted, ref, watch } from "vue";
import { isArray } from "/@/core/utils";

export default defineComponent({
	name: "shuyouRentComputerList",

	props: {
		modelValue: [String, Number, Array],
		props: Object
	},

	emits: ["update:modelValue"],

	setup(props, { emit }) {
		// 请求服务
		const service = inject<any>("service");

		// 数据列表
		const list = ref<any[]>([]);

		// 绑定值
		const value = ref<any>();

		// 绑定值回调
		function onChange(val: any) {
			emit("update:modelValue", val);
		}

		// 解析值
		watch(
			() => props.modelValue,
			(val: any) => {
				// value.value = val;
				value.value = (isArray(val) ? val : [val]).filter(Boolean);
			},
			{
				immediate: true
			}
		);

		onMounted(async () => {
			let aa = await service.shuyouRentComputer.rentComputerList();
			list.value = aa.data;
		});

		return {
			list,
			value,
			onChange
		};
	}
});
</script>
