thzxcx/vue3
1
0
Fork 0
Code Pull Requests Packages Releases Activity

Merge branch 'main' of https://gitea.thzxcx.com/thzxcx/vue3

Browse Source
This commit is contained in:
Hefeng
2024-01-30 15:59:37 +08:00
parent a7c5ca8f48 1fbfe22bf0
commit b28c4b4a6c
1 changed files with 30 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
packages/select-transfer-modal/index.vue
View File

@ -14,18 +14,17 @@
</slot> </slot>
</span> </span>
<el-config-provider :locale="locale"> <el-config-provider :locale="locale">
<el-dialog v-model="showDialog" class="select-transfer-modal" :title="title" :width="width" append-to-body <el-dialog
:z-index="zIndex" @open="getList" @closed="closed"> v-model="showDialog" class="select-transfer-modal" :title="title" :width="width" append-to-body
:z-index="zIndex" @open="getList" @closed="closed"
>
<div flex> <div flex>
<slot name="left" /> <slot name="left" />
<div grow> <div grow>
<el-form ref="queryRef" :model="queryParams" inline> <el-form ref="queryRef" :model="queryParams" inline>
<el-form-item v-for="formItem in formItems" :key="formItem.prop" :label="formItem.label" <el-form-item v-for="formItem in formItems" :key="formItem.prop" :label="formItem.label" :prop="formItem.prop">
:prop="formItem.prop"> <el-select v-if="formItem.selectOptions" v-model="queryParams[formItem.prop]" filterable :placeholder="formItem.placeholder">
<el-select v-if="formItem.selectOptions" :placeholder="formItem.placeholder"> <el-option v-for="option in formItem.selectOptions" :key="option.value" :label="$options.label" :value="option.value" />
<el-option v-for="option in formItem.selectOptions" :key="option.value" :value="option.value">
{{ option.label }}
</el-option>
</el-select> </el-select>
<el-input v-else v-model="queryParams[formItem.prop]" :placeholder="formItem.placeholder" /> <el-input v-else v-model="queryParams[formItem.prop]" :placeholder="formItem.placeholder" />
</el-form-item> </el-form-item>
@ -38,21 +37,34 @@
</el-button> </el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-transfer v-model="transferValue" v-loading="loading" inline-block text-left <el-transfer
style="--el-transfer-panel-width:25vw" :titles="['待选项', '已选项']" :button-texts="['移除', '添加']" :format="{ v-model="transferValue"
noChecked: '${total}', v-loading="loading"
hasChecked: '${checked}/${total}', inline-block
}" :data="data" :filter-method="filterMethod" :props="props"> text-left
style="--el-transfer-panel-width:25vw"
:titles="['待选项', '已选项']"
:button-texts="['移除', '添加']"
:format="{
hasChecked: '${checked}',
noChecked: ' ',
}"
:data="data"
:filter-method="filterMethod"
:props="props"
>
<template #default="{ option }"> <template #default="{ option }">
<slot name="transfer" :option="option"> <slot name="transfer" :option="option">
{{ option[props.label] }} {{ option[props.label] }}
</slot> </slot>
</template> </template>
<template #left-footer> <template #left-footer>
<el-pagination v-if="!hidePagination && total > queryParams.pageSize" <el-pagination
v-model:current-page="queryParams.pageNum" v-model:page-size="queryParams.pageSize" background small v-model:current-page="queryParams.pageNum"
layout="total, sizes, prev, next, jumper" mt-9px :page-sizes="pageSizes" :pager-count="pagerCount" v-model:page-size="queryParams.pageSize" background small layout="total, sizes, prev,pager, next" mt-9px
:total="total" @size-change="handleSizeChange" @current-change="getList" /> :page-sizes="pageSizes" :pager-count="pagerCount" :total="total" @size-change="handleSizeChange"
@current-change="getList"
/>
</template> </template>
</el-transfer> </el-transfer>
</div> </div>
@ -218,6 +230,7 @@ function resetQuery() {
function handleSizeChange(val: number) { function handleSizeChange(val: number) {
if (queryParams.pageNum * val > total) if (queryParams.pageNum * val > total)
queryParams.pageNum = 1 queryParams.pageNum = 1
getList()
} }
function transferValueInit() { function transferValueInit() {