Jackwang
4 years ago
3 changed files with 170 additions and 11 deletions
@ -0,0 +1,148 @@ |
|||||
|
<template> |
||||
|
<el-dialog :visible.sync="visible" |
||||
|
append-to-body |
||||
|
:close-on-click-modal="false" |
||||
|
:close-on-press-escape="false" |
||||
|
width="80%" |
||||
|
height="90%"> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-sys__user"> |
||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataListSearch()"> |
||||
|
<el-form-item label="姓名"> |
||||
|
<el-input v-model="dataForm.realName" placeholder='姓名' clearable maxlength="10" @keyup.native="btKeyUpRealname"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="手机号"> |
||||
|
<el-input v-model="dataForm.mobile" placeholder="手机号" clearable maxlength="11" @keyup.native="btKeyUpMobile"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button @click="getDataListOverWrite()" type="success">{{ $t('query') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<el-table v-loading="dataListLoading" ref="Table" :data="dataList" max-height="450" style="width: 100%;" @selection-change="handleSelectionChange"> |
||||
|
<!-- <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>--> |
||||
|
<el-table-column |
||||
|
type="index" |
||||
|
header-align="center" |
||||
|
align="center" |
||||
|
width="50" |
||||
|
label='序号' |
||||
|
></el-table-column> |
||||
|
<!-- <el-table-column prop="nickname" :label="$t('user.username')" sortable="custom" header-align="center" align="center" width="100"></el-table-column>--> |
||||
|
<el-table-column prop="realName" label="姓名" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="sex" label="性别" header-align="center" align="center" min-width="120"></el-table-column> |
||||
|
<!-- <el-table-column prop="email" :label="$t('user.email')" header-align="center" align="center" width="200"></el-table-column>--> |
||||
|
<el-table-column prop="mobile" :label="$t('user.mobile')" sortable="custom" header-align="center" align="center" width="120"></el-table-column> |
||||
|
<!-- <el-table-column prop="status" :label="$t('user.status')" sortable="custom" header-align="center" align="center" width="180">--> |
||||
|
<!-- <template slot-scope="scope">--> |
||||
|
<!-- <el-tag v-if="scope.row.status === 0" size="small" type="danger">{{ $t('user.status0') }}</el-tag>--> |
||||
|
<!-- <el-tag v-else size="small" type="success">{{ $t('user.status1') }}</el-tag>--> |
||||
|
<!-- </template>--> |
||||
|
<!-- </el-table-column>--> |
||||
|
<!-- <el-table-column prop="createdTime" :label="$t('user.createDate')" sortable="custom" header-align="center" align="center" width="180"></el-table-column>--> |
||||
|
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
:current-page="page" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="limit" |
||||
|
:total="total" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
data () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/app-user/vlounteerteamrealation/getVolunteerListByTeamId', |
||||
|
getDataListIsPage: true, |
||||
|
deleteURL: '/app-user/vlounteerteamrealation', |
||||
|
deleteIsBatch: true |
||||
|
}, |
||||
|
visible: false, |
||||
|
dataForm: { |
||||
|
realName: '', |
||||
|
mobile: '', |
||||
|
teamId:'' |
||||
|
}, |
||||
|
responseData: [] |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// btKeyUpUserName (e) { |
||||
|
// e.target.value = e.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g, '') |
||||
|
// this.dataForm.username = e.target.value |
||||
|
// }, |
||||
|
btKeyUpRealname (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g, '') |
||||
|
this.dataForm.realname = e.target.value |
||||
|
}, |
||||
|
// btKeyUpEmail (e) { |
||||
|
// e.target.value = e.target.value.replace(/[`~!#$%^&*()_\-+=<>?:"{}|~！#￥%……&*（）——={}|《》？：“”【】、；‘’，。、]/g, '') |
||||
|
// this.dataForm.email = e.target.value |
||||
|
// }, |
||||
|
btKeyUpMobile (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!@#$%^&*()_=<>?:"{}|·~！@#￥%……&*（）——={}|《》？：“”【】、；‘’，。、]/g, '') |
||||
|
this.dataForm.mobile = e.target.value |
||||
|
}, |
||||
|
getDataListOverWrite () { |
||||
|
this.page = 1 |
||||
|
this.getDataList() |
||||
|
}, |
||||
|
// 获取数据列表 |
||||
|
init () { |
||||
|
this.dataForm.realName = '' |
||||
|
this.dataForm.mobile = '' |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.getDataList() |
||||
|
}) |
||||
|
}, |
||||
|
handleSelectionChange (val) { |
||||
|
this.responseData = val |
||||
|
if (val.length > 1) { |
||||
|
this.$refs.Table.clearSelection() |
||||
|
this.$refs.Table.toggleRowSelection(val.pop()) |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
getInfo () { |
||||
|
if (this.responseData.length === 0) { |
||||
|
this.$message({ |
||||
|
message: '请选择志愿者！', |
||||
|
type: 'warning' |
||||
|
}) |
||||
|
return false |
||||
|
} |
||||
|
this.$emit('connectResponse', this.responseData) |
||||
|
this.visible = false |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style scoped lang='scss'> |
||||
|
.el-form{ |
||||
|
.end{ |
||||
|
margin-top: 10px; |
||||
|
} |
||||
|
} |
||||
|
.el-button--success{ |
||||
|
margin-top: 0px!important; |
||||
|
} |
||||
|
thead .el-table-column--selection .cell{ |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
Loading…
Reference in new issue