82 lines
2.1 KiB
Vue
82 lines
2.1 KiB
Vue
<template>
|
|
<sa-search-bar
|
|
ref="searchBarRef"
|
|
v-model="formData"
|
|
label-width="100px"
|
|
:showExpand="false"
|
|
@reset="handleReset"
|
|
@search="handleSearch"
|
|
>
|
|
<el-col v-bind="setSpan(6)">
|
|
<el-form-item label="供应商编码" prop="provider_code">
|
|
<el-input v-model="formData.provider_code" placeholder="请输入供应商编码" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-bind="setSpan(6)">
|
|
<el-form-item label="游戏编号" prop="game_code">
|
|
<el-input v-model="formData.game_code" placeholder="请输入游戏编号" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-bind="setSpan(6)">
|
|
<el-form-item label="游戏类型" prop="game_type">
|
|
<el-input v-model="formData.game_type" placeholder="请输入游戏类型" clearable />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col v-bind="setSpan(6)">
|
|
<el-form-item label="状态" prop="status">
|
|
<el-select v-model="formData.status" placeholder="请选择状态" clearable>
|
|
<el-option label="启用" :value="1" />
|
|
<el-option label="禁用" :value="0" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</sa-search-bar>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
type GameSearchForm = {
|
|
provider_code?: string
|
|
game_code?: string
|
|
game_type?: string
|
|
status?: number
|
|
[key: string]: unknown
|
|
}
|
|
|
|
interface Props {
|
|
modelValue: GameSearchForm
|
|
}
|
|
interface Emits {
|
|
(e: 'update:modelValue', value: GameSearchForm): void
|
|
(e: 'search', params: GameSearchForm): void
|
|
(e: 'reset'): void
|
|
}
|
|
const props = defineProps<Props>()
|
|
const emit = defineEmits<Emits>()
|
|
|
|
const searchBarRef = ref()
|
|
const formData = computed<GameSearchForm>({
|
|
get: () => props.modelValue,
|
|
set: (val) => emit('update:modelValue', val)
|
|
})
|
|
|
|
function handleReset() {
|
|
searchBarRef.value?.ref.resetFields()
|
|
emit('reset')
|
|
}
|
|
|
|
function handleSearch() {
|
|
emit('search', formData.value)
|
|
}
|
|
|
|
const setSpan = (span: number) => {
|
|
return {
|
|
span,
|
|
xs: 24,
|
|
sm: span >= 12 ? span : 12,
|
|
md: span >= 8 ? span : 8,
|
|
lg: span,
|
|
xl: span
|
|
}
|
|
}
|
|
</script>
|